/* =====================================================
   AVCIOĞLU ELEKTRİK BOBİNAJ — ana stil dosyası
   Palet: lacivert + kırmızı (logo) + bakır (bobinaj imzası)
   ===================================================== */

/* ---------- Fontlar ---------- */
@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/barlow-latin-400-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/barlow-latin-ext-400-normal.woff2') format('woff2');unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/barlow-latin-600-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/barlow-latin-ext-600-normal.woff2') format('woff2');unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/barlow-latin-700-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/barlow-latin-ext-700-normal.woff2') format('woff2');unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/barlow-condensed-latin-600-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/barlow-condensed-latin-ext-600-normal.woff2') format('woff2');unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/barlow-condensed-latin-700-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/barlow-condensed-latin-ext-700-normal.woff2') format('woff2');unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ---------- Değişkenler ---------- */
:root{
  --lacivert:#0a1f44; --lacivert-koyu:#081a3f; --lacivert-panel:#0f2c5e;
  --cizgi-koyu:#33496f; --cizgi:#41598c;
  --kirmizi:#e30613; --kirmizi-koyu:#b8050f;
  --bakir:#c47a3c; --bakir-acik:#e0965a; --bakir-koyu:#8a4f22;
  --zemin:#f5f7fb; --beyaz:#fff;
  --metin:#16233d; --soluk:#5b6879; --kenar:#e3e8f1;
  --govde:'Barlow',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --baslik:'Barlow Condensed','Barlow',system-ui,sans-serif;
  --golge:0 10px 30px rgba(10,31,68,.10);
  --golge-buyuk:0 22px 55px rgba(10,31,68,.16);
  --gecis:.28s cubic-bezier(.4,0,.2,1);
  --r:14px;
}

/* ---------- Sıfırlama ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--govde);color:var(--metin);background:var(--zemin);line-height:1.65;font-size:1.0625rem;overflow-x:hidden}
img,svg{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
ul,ol{list-style:none}
address{font-style:normal}
.kap{max-width:1200px;margin-inline:auto;padding-inline:24px}
:focus-visible{outline:3px solid var(--bakir);outline-offset:3px;border-radius:4px}
.atla{position:fixed;top:-60px;left:16px;z-index:300;background:var(--lacivert);color:#fff;padding:10px 18px;border-radius:8px;transition:top .2s}
.atla:focus{top:12px}
.merkez{text-align:center}
.ipucu{font-size:.87rem;color:var(--soluk)}

h1,h2,h3{font-family:var(--baslik);line-height:1.12;color:var(--lacivert);text-wrap:balance}
h1{font-size:clamp(2.3rem,5vw,3.5rem);font-weight:700}
h2{font-size:clamp(1.8rem,3.4vw,2.5rem);font-weight:700}
h3{font-size:1.32rem;font-weight:600}
.bolum-baslik{margin-top:.55rem}
.bolum-metin{color:var(--soluk);font-size:1.08rem;max-width:62ch;margin-top:.7rem}
.merkez .bolum-metin{margin-inline:auto}

/* Bölüm kaşı: bakır tel imzası */
.kas{display:inline-flex;align-items:center;gap:12px;font-family:var(--baslik);font-weight:600;font-size:1rem;letter-spacing:.22em;text-transform:uppercase;color:var(--bakir-koyu)}
.kas::before{content:'';width:44px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--bakir-koyu),var(--bakir-acik));flex:none}

/* ---------- AÇILIŞ ANİMASYONU (saf CSS zaman çizelgesi) ---------- */
#acilis{display:none;position:fixed;inset:0;z-index:1000;background:var(--zemin);place-items:center;transition:transform .55s cubic-bezier(.7,0,.3,1),opacity .45s}
body.acilis-var #acilis{display:grid}
#acilis.bitiyor{transform:translateY(-101%);opacity:.4}
.acilis-ic{display:grid;place-items:center;gap:16px}
#acilisLogo{opacity:0;width:min(230px,60vw);height:auto}
/* zaman çizelgesi: 0-0.85 hilti vurur · 0.85-1.3 dönüşüm · 1.3-2.05 matkap+kıvılcım · 1.75-2.45 logo */
body.acilis-var #hilti{animation:hilti-vur .12s linear 7 alternate,hilti-git .3s .86s forwards}
body.acilis-var #keski{animation:keski-in .12s linear 7 alternate}
@keyframes hilti-vur{from{transform:translateY(0)}to{transform:translateY(4px)}}
@keyframes keski-in{from{transform:translateY(0)}to{transform:translateY(5px)}}
@keyframes hilti-git{to{opacity:0;transform:translateX(-18px)}}
#matkap{opacity:0}
body.acilis-var #matkap{animation:parca-gel .3s .98s forwards}
@keyframes parca-gel{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
body.acilis-var #uc{animation:uc-titre .09s linear 1.3s 8 alternate}
@keyframes uc-titre{from{transform:translateX(0)}to{transform:translateX(3.5px)}}
body.acilis-var #kivilcim{animation:kivilcim-yan .14s linear 1.32s 5 alternate}
@keyframes kivilcim-yan{from{opacity:0}to{opacity:1}}
body.acilis-var #acilisIkon{animation:ikon-git .35s 1.78s forwards}
@keyframes ikon-git{to{opacity:0;transform:scale(.86)}}
body.acilis-var #acilisLogo{animation:logo-gel .5s 1.92s forwards}
@keyframes logo-gel{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}

/* ---------- Üst / gezinti ---------- */
.ust{position:sticky;top:0;z-index:200;background:rgba(255,255,255,.93);backdrop-filter:blur(10px);border-bottom:1px solid var(--kenar);transition:box-shadow var(--gecis)}
.ust.kaydi{box-shadow:0 6px 24px rgba(10,31,68,.10)}
.ust-ic{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:78px}
.marka img{width:164px;height:auto}
.gezinti{display:flex;align-items:center;gap:4px}
.gezinti a{position:relative;padding:10px 12px;font-weight:600;font-size:.98rem;color:var(--metin);border-radius:8px;transition:color var(--gecis)}
.gezinti a::after{content:'';position:absolute;left:12px;right:12px;bottom:5px;height:2.5px;border-radius:2px;background:linear-gradient(90deg,var(--bakir-koyu),var(--bakir-acik));transform:scaleX(0);transform-origin:left;transition:transform var(--gecis)}
.gezinti a:hover{color:var(--lacivert)}
.gezinti a:hover::after,.gezinti a[aria-current]::after{transform:scaleX(1)}
.gezinti a[aria-current]{color:var(--lacivert)}
.gezinti-tel{display:inline-flex;align-items:center;gap:8px;margin-left:8px;background:var(--kirmizi);color:#fff !important;border-radius:999px;padding:10px 18px !important;box-shadow:0 8px 20px rgba(227,6,19,.28);transition:transform var(--gecis),box-shadow var(--gecis)}
.gezinti-tel::after{display:none}
.gezinti-tel:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(227,6,19,.36)}
.menu-dugme{display:none;flex-direction:column;gap:5px;padding:10px}
.menu-dugme span{width:26px;height:3px;border-radius:2px;background:var(--lacivert);transition:transform var(--gecis),opacity var(--gecis)}
.menu-dugme[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu-dugme[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-dugme[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* ---------- Butonlar ---------- */
.dugme{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--baslik);font-weight:600;font-size:1.1rem;letter-spacing:.03em;padding:14px 26px;border-radius:10px;transition:transform var(--gecis),box-shadow var(--gecis),background var(--gecis),border-color var(--gecis);text-align:center}
.dugme-kirmizi{background:var(--kirmizi);color:#fff;box-shadow:0 10px 26px rgba(227,6,19,.28)}
.dugme-kirmizi:hover{background:var(--kirmizi-koyu);transform:translateY(-2px)}
.dugme-bakir{background:linear-gradient(120deg,var(--bakir-koyu),var(--bakir) 55%,var(--bakir-acik));color:#fff;box-shadow:0 10px 24px rgba(138,79,34,.30)}
.dugme-bakir:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(138,79,34,.38)}
.dugme-cerceve{border:2px solid var(--cizgi);color:#e8eefb}
.dugme-cerceve:hover{border-color:var(--bakir-acik);color:#fff;transform:translateY(-2px)}
.bolum .dugme-cerceve{border-color:#c9d3e6;color:var(--lacivert)}
.bolum .dugme-cerceve:hover{border-color:var(--bakir);color:var(--bakir-koyu)}
.bolum-koyu .dugme-cerceve,.cta-band .dugme-cerceve,.sayfa-giris .dugme-cerceve,.fan-hero .dugme-cerceve{border-color:var(--cizgi);color:#e8eefb}
.bolum-koyu .dugme-cerceve:hover,.cta-band .dugme-cerceve:hover,.sayfa-giris .dugme-cerceve:hover,.fan-hero .dugme-cerceve:hover{border-color:var(--bakir-acik);color:#fff}
.dugme-beyaz{background:#f2f5fa;color:var(--lacivert);border:1.5px solid var(--kenar)}
.dugme-beyaz:hover{transform:translateY(-2px);box-shadow:var(--golge)}
.dugmeler{display:flex;gap:14px;flex-wrap:wrap}

/* ---------- ANA SAYFA HERO (30 sn bobinaj hikâyesi) ---------- */
.anahero{position:relative;min-height:calc(100svh - 78px);display:flex;align-items:stretch;overflow:hidden;color:#eaf0fb;background:
  radial-gradient(1100px 550px at 82% -10%,rgba(224,150,90,.10),transparent 60%),
  repeating-linear-gradient(135deg,rgba(255,255,255,.022) 0 2px,transparent 2px 26px),
  linear-gradient(160deg,#0d2450,var(--lacivert-koyu) 55%,#071633)}
.anahero-kap{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,430px);gap:48px;align-items:center;padding-block:44px;width:100%}
.sahne-metin{max-width:600px}
.sahne-no{font-family:var(--baslik);font-weight:600;font-size:1.05rem;letter-spacing:.2em;color:var(--bakir-acik);margin-bottom:8px}
.sahne-no b{font-size:1.5rem;letter-spacing:.06em}
.sahne-baslik{color:#fff;font-size:clamp(2.2rem,4.6vw,3.5rem);margin-bottom:14px;min-height:2.35em}
.sahne-aciklama{color:#c3cee4;font-size:1.1rem;max-width:520px;min-height:3.3em;margin-bottom:28px}
.icerik-degis{transition:opacity .24s ease,transform .24s ease}
.sahne-metin.degisiyor .icerik-degis{opacity:0;transform:translateY(9px)}

/* İlerleme çubukları (5 aşama) — JS animasyonu sıfırlayıp yeniden başlatır */
.ilerleme{display:flex;gap:8px;max-width:430px}
.ilerleme span{flex:1;height:4px;border-radius:3px;background:rgba(255,255,255,.15);overflow:hidden;position:relative}
.ilerleme span i{position:absolute;inset:0;border-radius:3px;background:linear-gradient(90deg,var(--bakir-koyu),var(--bakir-acik));transform:scaleX(0);transform-origin:left}
.ilerleme span.akan i{animation:ilerle 5.4s linear forwards}
.ilerleme span.dolu i{transform:scaleX(1);animation:none}
@keyframes ilerle{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* Sağ: portre sahne çerçevesi (JS kareleri buraya basar) */
.sahne-gorsel{justify-self:end;width:100%;max-width:430px}
.sahne-cerceve{position:relative;aspect-ratio:941/1672;max-height:72vh;width:100%;margin-inline:auto;border-radius:20px;overflow:hidden;background:#050e20;box-shadow:0 30px 70px rgba(0,0,0,.5),0 0 0 1px rgba(224,150,90,.22)}
.sahne-cerceve::after{content:'';position:absolute;inset:0;border-radius:20px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),inset 0 -90px 70px -50px rgba(7,22,51,.55);pointer-events:none}
.sahne-cerceve img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease}
.sahne-cerceve img.aktif{opacity:1;animation:kenburns 5.6s ease-out forwards}
@keyframes kenburns{from{transform:scale(1.03)}to{transform:scale(1.13)}}
.sahne-not{margin-top:12px;text-align:center;font-family:var(--baslik);letter-spacing:.14em;text-transform:uppercase;font-size:.82rem;color:#8fa0c2}

/* Kontroller */
.hero-kontrol{position:absolute;top:20px;right:24px;display:flex;gap:10px;z-index:6}
.hero-kontrol button{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;background:rgba(8,26,63,.55);border:1px solid rgba(255,255,255,.22);color:#e8eefb;font-weight:600;font-size:.92rem;backdrop-filter:blur(8px);transition:background var(--gecis),border-color var(--gecis)}
.hero-kontrol button:hover{background:rgba(15,44,94,.85);border-color:var(--bakir-acik)}

/* Final sahnesi */
.hero-final{position:absolute;inset:0;z-index:5;display:grid;place-items:center;text-align:center;padding:24px;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility 0s .8s;background:
  radial-gradient(900px 480px at 50% 30%,rgba(224,150,90,.13),transparent 65%),
  linear-gradient(160deg,#0d2450,var(--lacivert-koyu) 55%,#071633)}
.anahero.bitti .hero-final{opacity:1;visibility:visible;transition:opacity .8s ease}
.anahero.bitti .anahero-kap{opacity:0;transition:opacity .5s}
.hero-final img{width:min(430px,74vw);margin-inline:auto;filter:drop-shadow(0 12px 34px rgba(0,0,0,.45));opacity:0;transform:scale(.96)}
.anahero.bitti .hero-final img{animation:yukari .7s .15s forwards}
.hero-final p{font-family:var(--baslik);font-weight:600;font-size:clamp(1.35rem,2.8vw,2rem);color:#e8eefb;margin:24px 0 30px;letter-spacing:.02em;opacity:0;transform:translateY(14px)}
.hero-final .dugmeler{justify-content:center;opacity:0;transform:translateY(14px)}
.anahero.bitti .hero-final p{animation:yukari .6s .4s forwards}
.anahero.bitti .hero-final .dugmeler{animation:yukari .6s .6s forwards}
@keyframes yukari{to{opacity:1;transform:none}}
.asagi-ok{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);color:#9db0d4;opacity:0;z-index:6;animation:zipla 1.7s ease-in-out infinite}
.anahero.bitti .asagi-ok{opacity:1;transition:opacity .8s 1s}
@keyframes zipla{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,7px)}}

/* ---------- Genel bölümler ---------- */
.bolum{padding-block:clamp(60px,8.5vw,100px)}
.bolum-koyu{background:
  radial-gradient(900px 400px at 15% 0%,rgba(224,150,90,.08),transparent 60%),
  linear-gradient(160deg,#0d2450,var(--lacivert-koyu))}
.bolum-koyu h2,.bolum-koyu h3{color:#fff}
.bolum-koyu .bolum-metin{color:#c3cee4}
.bolum-koyu .kas{color:var(--bakir-acik)}

.izgara{display:grid;gap:26px}
.izgara-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.izgara-3{grid-template-columns:repeat(auto-fit,minmax(270px,1fr))}
.izgara-4{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}

/* ---------- Kartlar ---------- */
.kart{position:relative;background:#fff;border-radius:var(--r);box-shadow:var(--golge);overflow:hidden;display:flex;flex-direction:column;transition:transform var(--gecis),box-shadow var(--gecis)}
.kart::after{content:'';position:absolute;left:0;right:0;bottom:0;height:4px;background:linear-gradient(90deg,var(--bakir-koyu),var(--bakir-acik));transform:scaleX(0);transform-origin:left;transition:transform .4s ease;z-index:2}
.kart:hover{transform:translateY(-6px);box-shadow:var(--golge-buyuk)}
.kart:hover::after{transform:scaleX(1)}
.kart-gorsel{aspect-ratio:8/5;overflow:hidden;background:var(--lacivert-koyu)}
.kart-gorsel img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.kart:hover .kart-gorsel img{transform:scale(1.06)}
.kart-ic{position:relative;padding:22px 22px 24px;display:flex;flex-direction:column;gap:9px;flex:1}
.kart-ic p{color:var(--soluk);font-size:.98rem;flex:1}
.kart-link{position:absolute;inset:0;z-index:3;border-radius:inherit}
.kart-ok{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--kirmizi);font-size:.98rem;margin-top:6px}
.kart-ok svg{transition:transform var(--gecis)}
.kart:hover .kart-ok svg{transform:translateX(5px)}
/* koyu kategori kartı */
.kat-kart{background:var(--lacivert-panel);border:1px solid rgba(255,255,255,.08)}
.kat-kart h3{color:#fff}
.kat-kart .kart-ic p{color:#b9c6df}
.kat-kart .kart-ok{color:var(--bakir-acik)}

/* ---------- Avantajlar ---------- */
.avantajlar{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px}
.avantaj{position:relative;background:#fff;border-radius:var(--r);padding:28px 24px;box-shadow:var(--golge);overflow:hidden;transition:transform var(--gecis),box-shadow var(--gecis)}
.avantaj::before{content:'';position:absolute;top:0;left:0;width:4px;height:100%;background:linear-gradient(180deg,var(--bakir-koyu),var(--bakir-acik));transform:scaleY(0);transform-origin:top;transition:transform .4s}
.avantaj:hover{transform:translateY(-6px);box-shadow:var(--golge-buyuk)}
.avantaj:hover::before{transform:scaleY(1)}
.avantaj .rakam{font-family:var(--baslik);font-weight:700;font-size:2.5rem;line-height:1;color:transparent;background:linear-gradient(120deg,var(--bakir-koyu),var(--bakir-acik));-webkit-background-clip:text;background-clip:text;margin-bottom:12px}
.avantaj>svg{color:var(--bakir);margin-bottom:12px}
.avantaj h3{margin-bottom:6px;font-size:1.22rem}
.avantaj p:not(.rakam){color:var(--soluk);font-size:.96rem}

/* ---------- CTA bandı ---------- */
.cta-band{position:relative;border-radius:20px;overflow:hidden;color:#fff;padding:clamp(34px,5.5vw,58px);display:flex;flex-wrap:wrap;gap:26px;align-items:center;justify-content:space-between;background:
  radial-gradient(700px 300px at 85% 0%,rgba(224,150,90,.16),transparent 60%),
  linear-gradient(140deg,var(--lacivert-panel),var(--lacivert-koyu))}
.cta-band::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 2px,transparent 2px 26px);pointer-events:none}
.cta-band>div{position:relative;z-index:1}
.cta-band h2{color:#fff}
.cta-band p{color:#c3cee4;max-width:54ch}
.cta-band .kas{color:var(--bakir-acik)}

/* ---------- Sayfa girişi (iç sayfalar, koyu şerit) ---------- */
.sayfa-giris{color:#fff;padding-block:clamp(52px,7.5vw,80px);background:
  radial-gradient(800px 380px at 85% -20%,rgba(224,150,90,.10),transparent 60%),
  linear-gradient(160deg,#0d2450,var(--lacivert-koyu))}
.sayfa-giris h1{color:#fff;margin-top:.5rem}
.sayfa-giris .bolum-metin{color:#c3cee4}
.sayfa-giris .kas{color:var(--bakir-acik)}
.kirinti{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.92rem;color:#8fa0c2;margin-bottom:14px}
.kirinti a{color:#c3cee4;transition:color var(--gecis)}
.kirinti a:hover{color:var(--bakir-acik)}
.kirinti span{opacity:.9}

/* ---------- Hizmet detay ---------- */
.detay-duzen{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:44px;align-items:start}
.detay-gorsel{border-radius:var(--r);overflow:hidden;box-shadow:var(--golge-buyuk);background:var(--lacivert-koyu)}
.detay-gorsel img{width:100%;height:auto;object-fit:cover}
.detay-govde p{margin-bottom:16px;color:#2a3a58}
.detay-govde p:last-child{margin-bottom:0}

.kontrol-liste{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}
.kontrol-liste li{position:relative;background:#fff;border:1px solid var(--kenar);border-radius:10px;padding:13px 16px 13px 46px;font-size:.98rem}
.kontrol-liste li::before{content:'✓';position:absolute;left:13px;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:7px;display:grid;place-items:center;font-size:.8rem;font-weight:700;color:#fff;background:linear-gradient(140deg,var(--bakir-koyu),var(--bakir-acik))}

/* Süreç (numaralı zaman çizelgesi) */
.surec{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px;counter-reset:adim}
.surec li{position:relative;background:#fff;border:1px solid var(--kenar);border-radius:var(--r);padding:24px 20px 20px;counter-increment:adim}
.surec li::before{content:counter(adim,decimal-leading-zero);font-family:var(--baslik);font-weight:700;font-size:1.05rem;letter-spacing:.1em;color:transparent;background:linear-gradient(120deg,var(--bakir-koyu),var(--bakir-acik));-webkit-background-clip:text;background-clip:text}
.surec li::after{content:'';position:absolute;top:36px;right:-19px;width:19px;height:2px;background:repeating-linear-gradient(90deg,var(--bakir) 0 5px,transparent 5px 9px)}
.surec li:last-child::after{display:none}
.surec h3{font-size:1.15rem;margin:6px 0 6px}
.surec p{font-size:.94rem;color:var(--soluk)}

/* SSS */
.sss details{background:#fff;border:1px solid var(--kenar);border-radius:12px;margin-bottom:12px;overflow:hidden;transition:box-shadow var(--gecis)}
.sss details[open]{box-shadow:var(--golge)}
.sss summary{list-style:none;position:relative;padding:17px 52px 17px 20px;font-weight:600;cursor:pointer;color:var(--lacivert)}
.sss summary::-webkit-details-marker{display:none}
.sss summary::after{content:'+';position:absolute;right:16px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:9px;display:grid;place-items:center;font-size:1.2rem;font-weight:600;color:var(--bakir-koyu);background:#fdf3ea;transition:transform var(--gecis)}
.sss details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.sss details p{padding:0 20px 18px;color:var(--soluk)}

/* Galeri */
.galeri{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.galeri a{display:block;border-radius:12px;overflow:hidden;box-shadow:var(--golge);aspect-ratio:4/3;background:var(--lacivert-koyu)}
.galeri img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.galeri a:hover img{transform:scale(1.07)}

/* Yan panel */
.detay-yan{position:sticky;top:100px;display:flex;flex-direction:column;gap:18px}
.yan-kutu{background:#fff;border-radius:var(--r);box-shadow:var(--golge);padding:24px}
.yan-kutu h3{margin-bottom:10px}
.yan-kutu .dugme{width:100%;margin-top:12px}
.yan-kutu p a{transition:color var(--gecis),padding-left var(--gecis);display:inline-block}
.yan-kutu p a:hover{color:var(--kirmizi) !important;padding-left:4px}

/* Mini animasyon kutusu + SVG animasyon yardımcıları */
.mini-anim{display:grid;place-items:center;padding:26px;border-radius:var(--r);box-shadow:var(--golge);background:
  radial-gradient(360px 200px at 70% 10%,rgba(224,150,90,.14),transparent 60%),
  linear-gradient(160deg,#0d2450,var(--lacivert-koyu))}
.don-yavas{animation:don 9s linear infinite;transform-origin:center;transform-box:fill-box}
.don-orta{animation:don 4.5s linear infinite;transform-origin:center;transform-box:fill-box}
.don-hizli{animation:don 1.4s linear infinite;transform-origin:center;transform-box:fill-box}
@keyframes don{to{transform:rotate(360deg)}}
.enerji-akis{stroke-dasharray:26 300;animation:akis 2.6s linear infinite}
@keyframes akis{to{stroke-dashoffset:-326}}
.devre-nokta{animation:yanip 1.8s ease-in-out infinite}
.devre-nokta:nth-of-type(2){animation-delay:.45s}
.devre-nokta:nth-of-type(3){animation-delay:.9s}
.devre-nokta:nth-of-type(4){animation-delay:1.3s}
@keyframes yanip{0%,100%{opacity:.25}50%{opacity:1}}
.su-dalga{animation:dalga 2.2s linear infinite}
@keyframes dalga{to{transform:translateX(-14px)}}

/* ---------- İletişim ---------- */
.iletisim-duzen{display:grid;grid-template-columns:minmax(290px,410px) minmax(0,1fr);gap:40px;align-items:start}
.bilgi-kart{background:#fff;border-radius:var(--r);box-shadow:var(--golge);padding:22px 24px;display:flex;gap:18px;align-items:flex-start;margin-bottom:16px;transition:transform var(--gecis),box-shadow var(--gecis)}
.bilgi-kart:hover{transform:translateY(-3px);box-shadow:var(--golge-buyuk)}
.bilgi-ikon{width:52px;height:52px;flex:none;border-radius:13px;display:grid;place-items:center;color:var(--bakir-acik);background:linear-gradient(140deg,var(--lacivert),var(--lacivert-panel))}
.bilgi-kart h3{font-size:1.13rem;margin-bottom:3px}
.bilgi-kart p,.bilgi-kart a{color:var(--soluk);font-size:.98rem}
.bilgi-kart a{font-weight:600}
.bilgi-kart a:hover{color:var(--kirmizi)}

.form-kart{background:#fff;border-radius:var(--r);box-shadow:var(--golge-buyuk);padding:clamp(24px,4vw,38px);border-top:4px solid transparent;border-image:linear-gradient(90deg,var(--bakir-koyu),var(--bakir-acik)) 1}
.form-satir{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.alan{display:flex;flex-direction:column;gap:7px;margin-bottom:16px}
.alan label{font-weight:600;font-size:.95rem;color:var(--lacivert)}
.alan input,.alan select,.alan textarea{font:inherit;width:100%;padding:12px 14px;border:1.5px solid var(--kenar);border-radius:10px;background:#fbfcfe;color:var(--metin);transition:border-color var(--gecis),box-shadow var(--gecis)}
.alan input:focus,.alan select:focus,.alan textarea:focus{outline:none;border-color:var(--bakir);box-shadow:0 0 0 4px rgba(196,122,60,.14)}
.alan textarea{min-height:128px;resize:vertical}
.alan input[type=file]{padding:10px;background:#fff;border-style:dashed;cursor:pointer}
.alan input[type=file]::file-selector-button{font:inherit;font-weight:600;border:0;border-radius:8px;padding:8px 14px;margin-right:12px;cursor:pointer;color:#fff;background:linear-gradient(120deg,var(--lacivert),var(--lacivert-panel))}
.balküpü{position:absolute !important;left:-9999px !important;width:1px;height:1px;opacity:0;pointer-events:none}
.uyari{display:none;margin-bottom:16px;padding:14px 18px;border-radius:10px;font-weight:600}
.uyari.goster{display:block;animation:yukari .4s forwards;opacity:0;transform:translateY(8px)}
.uyari.basari{background:#e9f7ee;color:#176b36;border:1px solid #bfe5cc}
.uyari.hata{background:#fdecec;color:#8d1c1c;border:1px solid #f1c6c6}
.harita{border-radius:var(--r);overflow:hidden;box-shadow:var(--golge)}
.harita iframe{display:block;width:100%;height:430px;border:0}

/* ---------- FAN SAYFASI ---------- */
.fan-hero{color:#fff;overflow:hidden;padding-block:clamp(52px,7vw,80px);background:
  radial-gradient(900px 460px at 80% -10%,rgba(224,150,90,.12),transparent 60%),
  repeating-linear-gradient(135deg,rgba(255,255,255,.02) 0 2px,transparent 2px 26px),
  linear-gradient(160deg,#0d2450,var(--lacivert-koyu) 55%,#071633)}
.fan-hero h1{color:#fff;margin-top:.5rem}
.fan-hero .kas{color:var(--bakir-acik)}
.fan-hero-kap{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,470px);gap:52px;align-items:center}
.alt-metin{color:#c3cee4;font-size:1.14rem;max-width:48ch;margin:.9rem 0 1.7rem}

/* 3B pervane sahnesi (saf CSS 3D; sürükleme fan3d.js) */
.fan-sahne{position:relative;aspect-ratio:1/1;width:100%;max-width:470px;margin-inline:auto;perspective:1150px;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}
.fan-sahne:active{cursor:grabbing}
.fan-donen{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform;transform:rotateX(-18deg) rotateY(24deg)}
.fan-halka{position:absolute;inset:3.5%;border-radius:50%;border:1.5px dashed rgba(224,150,90,.4);transform:translateZ(-6px)}
.fan-halka::after{content:'';position:absolute;inset:7%;border-radius:50%;border:1px solid rgba(255,255,255,.09)}
.fan-grup{position:absolute;inset:0;transform-style:preserve-3d;animation:fan-otodon 15s linear infinite}
.fan-sahne.duraklat .fan-grup{animation-play-state:paused}
@keyframes fan-otodon{from{transform:rotateZ(0)}to{transform:rotateZ(360deg)}}
.fan-kanat{position:absolute;left:50%;top:50%;width:38%;height:15.5%;margin-top:-7.75%;transform-origin:0 50%;border-radius:14% 52% 46% 26%/34% 56% 50% 30%;background:linear-gradient(115deg,#e0965a,#b06f33 55%,#8a4f22);box-shadow:inset 0 3px 7px rgba(255,255,255,.4),inset 0 -5px 9px rgba(60,30,8,.45),0 6px 14px rgba(0,0,0,.28)}
.fan-kanat::after{content:'';position:absolute;inset:14% 10%;border-radius:inherit;background:linear-gradient(115deg,rgba(255,255,255,.3),transparent 46%)}
.fan-gobek{position:absolute;left:50%;top:50%;width:25%;aspect-ratio:1;transform:translate(-50%,-50%) translateZ(16px);border-radius:50%;background:radial-gradient(circle at 34% 30%,#1d3a72,var(--lacivert-panel) 55%,#081a3f);box-shadow:0 12px 28px rgba(0,0,0,.42),inset 0 2px 6px rgba(255,255,255,.2)}
.fan-gobek::after{content:'';position:absolute;inset:31%;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--bakir-acik),var(--bakir-koyu));box-shadow:inset 0 -3px 7px rgba(60,30,8,.55)}
.fan-ipucu{display:flex;justify-content:center;gap:8px;margin-top:14px;color:#8fa0c2;font-size:.92rem;text-align:center}

/* Özellik kartları */
.ozellik{background:#fff;border:1px solid var(--kenar);border-radius:var(--r);padding:24px 22px;display:flex;gap:16px;align-items:flex-start;transition:transform var(--gecis),box-shadow var(--gecis)}
.ozellik:hover{transform:translateY(-5px);box-shadow:var(--golge)}
.ozellik-ikon{width:52px;height:52px;flex:none;border-radius:13px;display:grid;place-items:center;color:var(--bakir-acik);background:linear-gradient(140deg,var(--lacivert),var(--lacivert-panel))}
.ozellik h3{font-size:1.18rem;margin-bottom:4px}
.ozellik p{color:var(--soluk);font-size:.95rem}
.ozellik.vurgu{border:2px solid var(--bakir);background:linear-gradient(150deg,#fff7f0,#fff);box-shadow:0 14px 34px rgba(196,122,60,.18)}
.ozellik.vurgu .ozellik-ikon{background:linear-gradient(140deg,var(--bakir-koyu),var(--bakir))}
.ozellik.vurgu .ozellik-ikon svg{color:#fff}

/* ---------- Tek kanat değişimi sahnesi ---------- */
.kanat-degisim{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,460px);gap:52px;align-items:center}
.kd-sahne{position:relative;aspect-ratio:1/1;width:100%;max-width:460px;margin-inline:auto}
.kd-fan{position:absolute;inset:7%}
.kd-fan::before{content:'';position:absolute;inset:0;border-radius:50%;border:1.5px dashed rgba(224,150,90,.35)}
.kd-kanat{position:absolute;left:50%;top:50%;width:39%;height:16%;margin-top:-8%;transform-origin:0 50%;border-radius:14% 52% 46% 26%/34% 56% 50% 30%;background:linear-gradient(115deg,#e0965a,#b06f33 55%,#8a4f22);box-shadow:inset 0 2px 6px rgba(255,255,255,.35),0 5px 12px rgba(0,0,0,.28)}
.kd-gobek{position:absolute;left:50%;top:50%;width:24%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 34% 30%,#1d3a72,var(--lacivert-panel) 58%,#081a3f);box-shadow:0 10px 24px rgba(0,0,0,.4),inset 0 2px 6px rgba(255,255,255,.18);z-index:2}
.kd-gobek::after{content:'';position:absolute;inset:31%;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--bakir-acik),var(--bakir-koyu))}
.kd-hasarli{background:linear-gradient(115deg,#a7afc0,#78829a 55%,#565f75);box-shadow:inset 0 2px 5px rgba(255,255,255,.25),0 4px 10px rgba(0,0,0,.25)}
.kd-hasarli::after{content:'';position:absolute;right:14%;top:22%;width:34%;height:8%;background:#3f4759;border-radius:4px;transform:rotate(-16deg);opacity:.55}
.kd-yeni{opacity:0;background:linear-gradient(115deg,#f0a869,#c47a3c 55%,#8a4f22);box-shadow:inset 0 3px 7px rgba(255,255,255,.5),0 0 0 2px rgba(224,150,90,.45),0 6px 16px rgba(0,0,0,.3)}
/* animasyon: hasarlı çıkar (0.3s-1.4s), yeni takılır (1.6s-2.8s) */
.kd-sahne.kd-oynat .kd-hasarli{animation:kanat-cik 1.1s ease-in .3s forwards}
@keyframes kanat-cik{35%{transform:rotate(var(--aci)) translateX(7%)}100%{transform:rotate(var(--aci)) translateX(155%);opacity:0}}
.kd-sahne.kd-oynat .kd-yeni{animation:kanat-gel 1.2s ease-out 1.6s forwards}
@keyframes kanat-gel{0%{opacity:1;transform:rotate(var(--aci)) translateX(155%)}60%{opacity:1;transform:rotate(var(--aci)) translateX(3%)}80%{transform:rotate(var(--aci)) translateX(0) scale(1.04)}100%{opacity:1;transform:rotate(var(--aci)) translateX(0)}}
.kd-etiket{position:absolute;z-index:3;padding:7px 14px;border-radius:999px;background:#fff;box-shadow:var(--golge);font-weight:600;font-size:.88rem;opacity:0;white-space:nowrap}
.kd-etiket.hasar{top:5%;right:0;color:#8d1c1c;border:1px solid #f1c6c6}
.kd-etiket.yeni-e{right:0;color:var(--bakir-koyu);border:1px solid #ecd3ba}
.kd-sahne.kd-oynat .kd-etiket.hasar{animation:etiket-gel .45s .15s forwards,etiket-git .4s 1.45s forwards}
.kd-sahne.kd-oynat .kd-etiket.yeni-e{animation:etiket-gel .45s 1.95s forwards}
@keyframes etiket-gel{to{opacity:1}}
@keyframes etiket-git{to{opacity:0}}

/* ---------- Footer ---------- */
.alt{background:linear-gradient(180deg,#081a3f,#060f26);color:#c3cee4}
.alt-izgara{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:38px;padding-block:60px 40px}
.alt-blok h3{color:#fff;font-size:1.13rem;letter-spacing:.05em;margin-bottom:15px}
.alt-blok img{margin-bottom:16px}
.alt-blok p{font-size:.95rem;margin-bottom:8px}
nav.alt-blok a{display:block;padding:5px 0;font-size:.96rem;transition:color var(--gecis),padding-left var(--gecis)}
nav.alt-blok a:hover{color:var(--bakir-acik);padding-left:5px}
.alt-blok address a:hover,.alt-blok p a:hover{color:var(--bakir-acik)}
.alt-saat{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed rgba(255,255,255,.13);padding-block:5px;font-size:.93rem}
.alt-saat:last-of-type{border-bottom:0}
.sosyal{display:flex;gap:12px;margin-top:8px}
.sosyal a{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.08);transition:background var(--gecis),transform var(--gecis)}
.sosyal a:hover{background:var(--bakir);transform:translateY(-3px)}
.alt-cizgi{border-top:1px solid rgba(255,255,255,.1)}
.alt-cizgi-ic{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;padding-block:18px;font-size:.89rem;color:#8fa0c2}

/* ---------- Mobil bar + WhatsApp ---------- */
.mobil-bar{position:fixed;left:0;right:0;bottom:0;z-index:220;display:none;grid-template-columns:1fr 1fr;box-shadow:0 -8px 26px rgba(10,31,68,.18)}
.mobil-bar a{display:flex;align-items:center;justify-content:center;gap:9px;padding:14px 10px calc(14px + env(safe-area-inset-bottom));font-family:var(--baslik);font-weight:600;font-size:1.12rem;color:#fff}
.mobil-ara{background:var(--kirmizi)}
.mobil-wa{background:#1faa53}
.wa-yuzen{position:fixed;right:20px;bottom:24px;z-index:210;width:58px;height:58px;border-radius:50%;background:#1faa53;color:#fff;display:grid;place-items:center;box-shadow:0 12px 30px rgba(23,107,54,.4);transition:transform var(--gecis)}
.wa-yuzen:hover{transform:scale(1.09)}

/* ---------- Görünme animasyonları ---------- */
.gorun{opacity:0;transform:translateY(26px);transition:opacity .7s ease var(--gecikme,0s),transform .7s ease var(--gecikme,0s)}
.gorun.geldi{opacity:1;transform:none}

/* ---------- Duyarlılık ---------- */
@media (max-width:1080px){
  .detay-duzen{grid-template-columns:1fr}
  .detay-yan{position:static;flex-direction:row;flex-wrap:wrap}
  .detay-yan>*{flex:1 1 300px}
  .alt-izgara{grid-template-columns:1fr 1fr}
  .fan-hero-kap,.kanat-degisim{grid-template-columns:1fr;gap:38px}
  .kanat-degisim>.gorun:last-child{order:-1}
}
@media (max-width:920px){
  .gezinti{position:fixed;inset:78px 0 auto 0;background:#fff;flex-direction:column;align-items:stretch;padding:12px 20px 20px;gap:2px;border-bottom:1px solid var(--kenar);box-shadow:0 24px 44px rgba(10,31,68,.16);transform:translateY(-115%);transition:transform .35s ease;z-index:190;max-height:calc(100vh - 78px);overflow:auto}
  .gezinti.acik{transform:none}
  .gezinti a{padding:13px 10px;opacity:0;transform:translateY(-6px);transition:opacity .3s calc(var(--i,0)*.05s),transform .3s calc(var(--i,0)*.05s),color var(--gecis)}
  .gezinti.acik a{opacity:1;transform:none}
  .gezinti-tel{margin:10px 0 0;justify-content:center}
  .menu-dugme{display:flex}
  /* mobil hero: görsel tam ekran, metin altta bindirme */
  .anahero{min-height:100svh}
  .anahero-kap{grid-template-columns:1fr;gap:0;padding:0}
  .sahne-gorsel{max-width:none;justify-self:stretch}
  .sahne-cerceve{position:absolute;inset:0;max-height:none;border-radius:0;aspect-ratio:auto;box-shadow:none}
  .sahne-cerceve::after{box-shadow:inset 0 -240px 160px -80px rgba(7,22,51,.9)}
  .sahne-not{display:none}
  .sahne-metin{position:absolute;left:0;right:0;bottom:0;z-index:4;max-width:none;padding:24px 22px calc(30px + env(safe-area-inset-bottom))}
  .sahne-baslik{min-height:auto;font-size:clamp(1.9rem,8vw,2.5rem)}
  .sahne-aciklama{min-height:auto;font-size:1rem;margin-bottom:18px}
  .hero-final{padding-bottom:64px}
  .iletisim-duzen{grid-template-columns:1fr}
}
@media (max-width:640px){
  body{font-size:1rem;padding-bottom:58px}
  .mobil-bar{display:grid}
  .wa-yuzen{bottom:76px;width:52px;height:52px}
  .form-satir{grid-template-columns:1fr}
  .alt-izgara{grid-template-columns:1fr;gap:30px;padding-block:46px 32px}
  .surec li::after{display:none}
  .hero-kontrol{top:12px;right:12px}
  .hero-kontrol button span{display:none}
  .hero-kontrol button{padding:10px 12px}
  .cta-band{justify-content:flex-start}
  .harita iframe{height:340px}
}

/* ---------- Hareket azaltma ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  html{scroll-behavior:auto}
  .gorun{opacity:1;transform:none}
  .sahne-cerceve img.aktif{animation:none;transform:none}
  #acilis{display:none !important}
}

/* ---------- Yazdırma ---------- */
@media print{.ust,.alt,.mobil-bar,.wa-yuzen,#acilis,.hero-kontrol,.asagi-ok{display:none !important}.anahero{min-height:auto}}

/* Footer saat başlığı boşluğu */
.alt-saat-baslik{margin-top:20px}