/* ═══════════════════════════════════════════════════════════════
   ÖZER CNC — Teknik tema, beyaz zemin (2026-10-27)
   Beyaz zemin üzerinde ince teknik çizim ızgarası, HUD köşe çizgileri,
   monospace teknik etiketler ve işlenen parça animasyonları (parts.js).
   Diğer stillerden SONRA yüklenir; kaldırılırsa eski tasarım geri gelir.
   ═══════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');

:root {
  --red:       #D6102C;
  --red2:      #EE1835;
  --red-dark:  #A50C22;
  --red-light: #FDEEF1;
  --red-glow:  rgba(214,16,44,0.14);
  --bg:        #FFFFFF;
  --bg1:       #F6F7F9;
  --bg2:       #EEF1F4;
  --bg3:       #E3E7EC;
  --text:      #121821;
  --text2:     #4A5361;
  --muted:     #8A93A0;
  --borderG:   #E3E7EC;
  --border:    rgba(214,16,44,0.25);
  --mono:      'JetBrains Mono', ui-monospace, Consolas, monospace;
  --ink:       #0D1117;
  --line:      #C9D0D8;     /* çizim çizgisi */
  --steel:     #6B7685;     /* parça rengi */
}

html, body { background:#fff; }
body {
  background-image:
    linear-gradient(rgba(18,24,33,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18,24,33,0.035) 1px, transparent 1px);
  background-size:40px 40px;
}
::selection { background:var(--red); color:#fff; }

/* Bölümler beyaz; ızgara görünür kalsın */
#about, #products, #services, #sectors, #contact, #testimonials, #blog-preview, #teknik-servis, #why,
.products-section, .related-section, .categories-section { background:transparent !important; }
section { position:relative; }
section + section::before {
  content:''; position:absolute; top:0; left:5%; right:5%; height:1px;
  background:linear-gradient(90deg, transparent, var(--red) 20%, var(--bg3) 45%, transparent);
  opacity:.6;
}

/* ── Tipografi ── */
.section-label, .hero-badge, .card-cat-tag, .bp-date, .ci-label, .rfq-eyebrow, .service-num,
.stat-label, .spec-key, .footer-col h4, .part-meta {
  font-family:var(--mono) !important; letter-spacing:.12em;
}
.section-label { font-size:.7rem; color:var(--red) !important; }
.section-label::before { content:'// '; opacity:.55; }
.red-divider { background:linear-gradient(90deg, var(--red), transparent) !important; width:96px; height:2px; }

/* ── Hero (video zemini koyu kalır) ── */
.hero-overlay2 {
  background:
    linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px),
    linear-gradient(to top, rgba(13,15,20,0.55) 0%, transparent 45%) !important;
  background-size:64px 64px, 64px 64px, 100% 100% !important;
}
#hero::after {
  content:''; position:absolute; left:0; right:0; height:120px; top:-120px; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, transparent, rgba(238,24,53,0.08), transparent);
  animation:techScan 7s linear infinite;
}
@keyframes techScan { to { transform:translateY(calc(100vh + 240px)); } }
.hero-badge { border-radius:3px !important; text-transform:uppercase; font-size:.68rem !important; }
.hero-spec { border-radius:3px !important; font-family:var(--mono); font-size:.76rem !important; }
.hero-spec strong { color:#ff6b7f !important; }
.hero-deco { position:absolute; right:4%; top:50%; width:min(38vw,520px); transform:translateY(-50%); z-index:1;
  opacity:.22; pointer-events:none; }
.hero-deco svg { width:100%; height:auto; display:block; }
@media (max-width:900px) { .hero-deco { display:none; } }

/* ── Butonlar ── */
.btn, .nav-cta, .form-submit, .rfq-btn, .card-btn, .btn-secondary { border-radius:4px !important; }
.btn-primary, .nav-cta, .form-submit { background:linear-gradient(135deg, var(--red2), var(--red-dark)) !important; }

/* ── Paneller: beyaz kart + HUD köşe çizgileri ── */
.stat-card, .product-card, .service-card, .sector-card, .contact-form, .tst-card, .bp-card,
.blog-card, .why-box, .p-card, .rel-card, .sidebar-card, .part-card {
  background:#fff !important; border:1px solid var(--borderG) !important; border-radius:6px !important;
}
.stat-card:hover, .product-card:hover, .service-card:hover, .sector-card:hover, .tst-card:hover,
.bp-card:hover, .blog-card:hover, .p-card:hover, .rel-card:hover, .part-card:hover, .why-box:hover {
  border-color:rgba(214,16,44,0.45) !important;
  box-shadow:0 14px 36px rgba(18,24,33,0.10) !important;
}
.product-card::after, .service-card::after, .bp-card::after, .blog-card::after, .sector-card::after,
.tst-card::after, .stat-card::after, .contact-form::after, .part-card::after {
  content:''; position:absolute; inset:-1px; pointer-events:none; border-radius:inherit; z-index:2;
  background:
    linear-gradient(var(--red), var(--red)) top left / 14px 2px,
    linear-gradient(var(--red), var(--red)) top left / 2px 14px,
    linear-gradient(var(--red), var(--red)) bottom right / 14px 2px,
    linear-gradient(var(--red), var(--red)) bottom right / 2px 14px;
  background-repeat:no-repeat; opacity:.5; transition:opacity .25s;
}
.product-card:hover::after, .service-card:hover::after, .bp-card:hover::after, .blog-card:hover::after,
.sector-card:hover::after, .tst-card:hover::after, .stat-card:hover::after, .part-card:hover::after { opacity:1; }
.stat-card, .sector-card, .tst-card, .contact-form, .blog-card, .part-card { position:relative; }

.stats-grid { background:transparent !important; border:none !important; gap:12px !important; box-shadow:none !important; }
.stat-number { font-family:var(--mono) !important; letter-spacing:-.02em; }
.stat-label { text-transform:uppercase; font-size:.68rem !important; }
.card-cat-tag { border-radius:2px !important; }
.spec-val { font-family:var(--mono); }

/* ── Hakkımızda: dönen dişli dekoru ── */
#about { overflow:hidden; }
.about-deco { position:absolute; right:-120px; bottom:-140px; width:420px; opacity:.07; pointer-events:none; z-index:0; }
#about .about-grid { position:relative; z-index:1; }

/* ── Neden Özer CNC: artık beyaz zeminde ── */
#why { overflow:hidden; }
#why .section-title { color:var(--ink) !important; }
#why .section-label { color:var(--red) !important; }
.why-content h4, .why-box-text h5 { color:var(--ink) !important; }
.why-content p, .why-box-text p { color:var(--text2) !important; }
.why-num { background:#fff !important; border:1px solid var(--red); color:var(--red) !important; font-family:var(--mono) !important; border-radius:4px !important; }
.why-deco { position:absolute; left:-160px; top:40px; width:460px; opacity:.06; pointer-events:none; }
.why-grid { position:relative; z-index:1; }

/* ── Sektör kartları: çizgi ikonlar ── */
.sector-icon svg { width:46px; height:46px; stroke:var(--ink); fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.sector-icon svg .acc { stroke:var(--red); }
.sector-card:hover .sector-icon svg { animation:iconPulse 1.2s ease-in-out infinite; }
@keyframes iconPulse { 50% { transform:translateY(-3px); } }
.sector-card.is-key { border-color:rgba(214,16,44,0.55) !important; background:linear-gradient(180deg,#fff, var(--red-light)) !important; }
.sector-card.is-key .sector-name::after { content:'ANA SEKTÖR'; display:block; margin-top:6px; font-family:var(--mono); font-size:.58rem; letter-spacing:.14em; color:var(--red); }
.sector-icon .spin { transform-box:fill-box; transform-origin:center; animation:spin 6s linear infinite; }

/* ══ İşlenen parçalar bölümü ══ */
#parcalar { padding:96px 5%; }
.parts-head { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-bottom:44px; }
.parts-head .section-sub { margin-bottom:0; }
.parts-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.part-card { overflow:hidden; }
.part-art {
  height:200px; border-bottom:1px solid var(--borderG);
  background:
    linear-gradient(rgba(18,24,33,0.05) 1px, transparent 1px) 0 0 / 16px 16px,
    linear-gradient(90deg, rgba(18,24,33,0.05) 1px, transparent 1px) 0 0 / 16px 16px,
    #FBFCFD;
  display:flex; align-items:center; justify-content:center; position:relative;
}
.part-art svg { width:100%; height:100%; display:block; }
.part-art .hud { position:absolute; left:12px; top:10px; font-family:var(--mono); font-size:.62rem; letter-spacing:.12em; color:var(--muted); }
.part-art .hud b { color:var(--red); font-weight:700; }
.part-body { padding:20px 22px 22px; }
.part-title { font-family:'Rajdhani',sans-serif; font-size:1.3rem; font-weight:700; color:var(--ink); line-height:1.2; margin-bottom:6px; }
.part-desc { font-size:.85rem; color:var(--text2); line-height:1.6; margin-bottom:12px; }
.part-meta { font-size:.66rem; color:var(--red); text-transform:uppercase; display:flex; gap:8px; flex-wrap:wrap; }
.part-meta span { border:1px solid var(--border); padding:3px 8px; border-radius:2px; }
.parts-note { margin-top:26px; font-family:var(--mono); font-size:.72rem; color:var(--muted); letter-spacing:.06em; }
@media (max-width:1100px) { .parts-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:640px)  { .parts-grid { grid-template-columns:1fr; } #parcalar { padding:64px 5%; } }

/* SVG parça çizim stilleri */
.pa-steel  { fill:#E9EDF1; stroke:var(--steel); stroke-width:1.4; }
.pa-steel2 { fill:#D9DFE6; stroke:var(--steel); stroke-width:1.4; }
.pa-line   { fill:none; stroke:var(--steel); stroke-width:1.2; }
.pa-thin   { fill:none; stroke:var(--line); stroke-width:1; stroke-dasharray:4 4; }
.pa-path   { fill:none; stroke:var(--red); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.pa-tool   { fill:var(--ink); }
.pa-tool-tip { fill:var(--red); }
.pa-hole   { fill:#fff; stroke:var(--steel); stroke-width:1.2; }
.pa-chip   { fill:var(--red); }

.spin      { transform-box:fill-box; transform-origin:center; animation:spin var(--dur,10s) linear infinite; }
.spin.rev  { animation-direction:reverse; }
@keyframes spin { to { transform:rotate(360deg); } }

.draw      { stroke-dasharray:var(--len,1000); stroke-dashoffset:var(--len,1000); animation:draw var(--dur,6s) linear infinite; }
@keyframes draw { 0% { stroke-dashoffset:var(--len,1000); } 75%,100% { stroke-dashoffset:0; } }

.drill     { animation:drill 1.6s ease-in-out infinite; }
@keyframes drill { 0%,100% { transform:translateY(0); } 45%,60% { transform:translateY(26px); } }
.hole-in   { opacity:0; animation:holeIn var(--cycle,9.6s) step-end infinite; animation-delay:var(--d,0s); }
@keyframes holeIn { 0% { opacity:1; } }

.turn-tool { animation:turnTool 5s ease-in-out infinite; }
@keyframes turnTool { 0%,100% { transform:translateX(0); } 50% { transform:translateX(120px); } }
.turn-stripes { animation:stripes .5s linear infinite; }
@keyframes stripes { to { transform:translateY(-8px); } }
.chip-fly  { animation:chip 1s ease-out infinite; opacity:0; }
@keyframes chip { 0% { opacity:1; transform:translate(0,0); } 100% { opacity:0; transform:translate(var(--cx,10px),var(--cy,-18px)); } }

@media (prefers-reduced-motion: reduce) {
  #hero::after, .spin, .draw, .drill, .turn-tool, .turn-stripes, .chip-fly, .hole-in { animation:none !important; }
  .draw { stroke-dashoffset:0; } .hole-in { opacity:1; }
}

/* ── Ürünler sayfası hero: işleme sahnesi ── */
.page-hero { min-height:520px; }
.ph-anim {
  position:absolute; top:70px; right:2%; bottom:0; width:60%; z-index:0; pointer-events:none;
}
.ph-anim svg {
  position:absolute; top:0; bottom:0; left:0; right:190px; width:calc(100% - 190px); height:100%;
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 26%);
          mask-image:linear-gradient(90deg, transparent 0%, #000 26%);
}
.ph-dro {
  position:absolute; right:0; bottom:44px; padding:10px 14px; min-width:160px;
  font-family:var(--mono); font-size:.74rem; color:#fff; letter-spacing:.06em;
  background:rgba(13,17,23,0.72); border:1px solid rgba(255,255,255,0.14); border-left:2px solid var(--red2); border-radius:3px;
  backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
}
.ph-dro div { display:flex; justify-content:space-between; gap:18px; line-height:1.7; }
.ph-dro span { color:var(--red2); font-weight:700; }
.ph-dro b { font-weight:500; font-variant-numeric:tabular-nums; }
.ph-dro .ph-dro-sub { margin-top:4px; padding-top:4px; border-top:1px solid rgba(255,255,255,0.12); color:rgba(255,255,255,0.55); font-size:.66rem; justify-content:flex-start; }
.ph-dro .ph-dro-sub b { color:#fff; }
@media (max-width:900px) {
  .ph-anim { width:100%; right:0; opacity:.28; }
  .ph-anim svg { right:0; width:100%; -webkit-mask-image:none; mask-image:none; }
  .ph-dro { display:none; }
}

/* Fotoğrafı henüz olmayan ürün kartı */
.p-card-noimg {
  width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  font-family:'Rajdhani',sans-serif; font-size:1.5rem; font-weight:700; color:#B8C0CA; letter-spacing:.04em;
  background:
    linear-gradient(rgba(18,24,33,0.05) 1px, transparent 1px) 0 0 / 16px 16px,
    linear-gradient(90deg, rgba(18,24,33,0.05) 1px, transparent 1px) 0 0 / 16px 16px, #FBFCFD;
}
.p-card-noimg small { font-family:var(--mono); font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:400; }

/* Yazdırma (ürün datasheet PDF'i) */
@media print {
  html, body { background:#fff !important; background-image:none !important; }
}