/* ==========================================================================
   KOÇ YAPI MÜHENDİSLİK — ortak stil dosyası
   Bütün sayfalar bu dosyayı kullanır. Renk veya yazı değişikliği
   yalnızca buradan yapılır, tüm site birden değişir.
   ========================================================================== */

:root{
  color-scheme:light;
  /* marka renkleri — logodan alındı */
  --marka:#1D3A6B;        /* çatı mavisi, koyu */
  --marka-2:#2B5490;
  --gok:#1F97C9;          /* dalga mavisi */
  --vurgu:#D81848;        /* logo kırmızısı — yalnızca düğme ve vurgu */
  --vurgu-2:#B5123B;
  --altin:#F09C30;        /* logo turuncusu — küçük vurgular */
  --yesil:#1E9E5C;        /* whatsapp */

  --koyu:#0C1728; --koyu-2:#152438;
  --zemin:#FFFFFF; --zemin-2:#F3F6FA; --kart:#FFFFFF;
  --murekkep:#132033; --murekkep-2:#5A6B7F; --cizgi:#E1E7EF;
  --acik-ust:#C4D2E4;
  --olcu:1240px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --marka:#7FA8DC; --marka-2:#9DBDE8; --gok:#4FB9E4;
    --vurgu:#FF5C7D; --vurgu-2:#FF7B95; --altin:#F5B45C; --yesil:#35B573;
    --koyu:#070D16; --koyu-2:#101A28;
    --zemin:#0B1119; --zemin-2:#111A26; --kart:#131D2B;
    --murekkep:#E9EEF5; --murekkep-2:#9BABBE; --cizgi:#243040;
    --acik-ust:#A9BCD2;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --marka:#7FA8DC; --marka-2:#9DBDE8; --gok:#4FB9E4;
  --vurgu:#FF5C7D; --vurgu-2:#FF7B95; --altin:#F5B45C; --yesil:#35B573;
  --koyu:#070D16; --koyu-2:#101A28;
  --zemin:#0B1119; --zemin-2:#111A26; --kart:#131D2B;
  --murekkep:#E9EEF5; --murekkep-2:#9BABBE; --cizgi:#243040;
  --acik-ust:#A9BCD2;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--zemin);color:var(--murekkep);
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  font-size:16.5px;line-height:1.65;font-weight:400;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{margin:0;line-height:1.08;font-weight:800;letter-spacing:-.02em;text-wrap:balance}
.olcu{max-width:var(--olcu);margin:0 auto;padding-inline:22px}

/* ---------- 0. üst şerit ---------- */
.util{background:var(--koyu);color:var(--acik-ust);font-size:13.5px;
  border-bottom:1px solid rgba(255,255,255,.08)}
.util .olcu{display:flex;align-items:center;gap:8px 26px;min-height:40px;flex-wrap:wrap}
.util a{text-decoration:none;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.util a:hover{color:#fff}
.util svg{width:14px;height:14px;flex:0 0 auto;color:var(--gok)}
.util .sag{margin-left:auto;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.util b{color:#fff;font-weight:700}
.util .slogan-ust{font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--altin);white-space:nowrap}
@media (max-width:1100px){ .util .slogan-ust{display:none} }
@media (max-width:760px){ .util .gizle-mobil{display:none} .util .olcu{min-height:36px;gap:6px 16px} }

/* ---------- 0b. yetki şeridi (her sayfada, üstte) ---------- */
.yetki-serit{background:var(--zemin-2);border-bottom:1px solid var(--cizgi)}
.yetki-serit .olcu{display:flex;align-items:center;justify-content:space-between;gap:10px 24px;
  padding-block:11px}
.ys{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.ys.sag{text-align:right}
.ys img{height:38px;width:auto;max-width:124px;object-fit:contain;flex:0 0 auto}
.ys span{display:grid;line-height:1.25}
.ys b{font-size:13.5px;font-weight:800;color:var(--murekkep);letter-spacing:-.005em}
.ys i{font-style:normal;font-size:11.5px;color:var(--murekkep-2);font-weight:600}
.ys-slogan{font-size:11.5px;font-weight:800;letter-spacing:.15em;color:var(--vurgu);
  white-space:nowrap;text-align:center;flex:0 1 auto;overflow:hidden;text-overflow:ellipsis}
@media (max-width:1150px){ .ys-slogan{display:none} }
.ys i.its{color:var(--vurgu);font-weight:800;letter-spacing:.06em}
@media (max-width:700px){
  .yetki-serit .olcu{gap:10px 14px;padding-block:8px}
  .ys img{height:30px;max-width:94px}
  .ys b{font-size:11.5px;letter-spacing:-.01em}
  .ys i{font-size:10.5px}
  .ys.sag i{display:none}            /* Baymak alt yazısı dar ekranda gizlenir */
  .ys{gap:9px}
}
@media (max-width:420px){ .ys b{font-size:10.5px} .ys i{font-size:10px}
  .ys img{height:26px;max-width:78px} }

/* ---------- ana sayfa: ilke listesi ---------- */
.sutun2.dengeli{gap:54px 64px}
dl.ilke{margin:0;display:grid;gap:22px}
dl.ilke>div{display:grid;grid-template-columns:44px 1fr;gap:18px;align-items:start}
dl.ilke dt{margin:0;width:44px;height:44px;border-radius:3px;background:rgba(31,151,201,.10);
  border:1px solid rgba(29,58,107,.10);display:flex;align-items:center;justify-content:center;
  color:var(--marka)}
dl.ilke dt svg{width:22px;height:22px}
dl.ilke dd{margin:0;display:grid;gap:4px}
dl.ilke b{font-size:18px;font-weight:800;letter-spacing:-.01em}
dl.ilke span{color:var(--murekkep-2);font-size:15.5px;line-height:1.6}

/* ---------- ana sayfa: kompakt hizmet listesi ---------- */
ul.hliste{list-style:none;margin:0;padding:0;border-top:1px solid var(--cizgi)}
ul.hliste a{display:grid;grid-template-columns:38px 1fr auto;gap:15px;align-items:center;
  padding-block:15px;border-bottom:1px solid var(--cizgi);text-decoration:none;
  transition:padding-left .18s,color .18s}
ul.hliste a:hover{padding-left:8px;color:var(--vurgu)}
.hl-ik{width:38px;height:38px;border-radius:3px;background:rgba(31,151,201,.10);
  border:1px solid rgba(29,58,107,.10);display:flex;align-items:center;justify-content:center;
  color:var(--marka)}
.hl-ik svg{width:20px;height:20px}
.hl-ad{font-size:17px;font-weight:700;letter-spacing:-.01em}
.hl-ok{color:var(--vurgu);font-weight:800;font-size:16px}

/* ---------- 1. başlık ---------- */
header.ana{position:sticky;top:env(safe-area-inset-top,0px);z-index:60;background:var(--zemin);
  border-bottom:1px solid var(--cizgi);transition:box-shadow .25s}
header.ana.kucul{box-shadow:0 6px 22px rgba(12,23,40,.10)}
.hrow{display:flex;align-items:center;gap:18px;min-height:86px;padding-block:12px;
  transition:min-height .25s}
header.ana.kucul .hrow{min-height:66px}
.logo{display:flex;align-items:center;gap:13px;text-decoration:none;flex:0 0 auto}
.logo img{width:auto;height:50px;transition:height .25s}
header.ana.kucul .logo img{height:40px}
.logo .isim{display:block;line-height:1}
.logo .k1{display:block;font-size:24px;font-weight:800;letter-spacing:-.015em;color:var(--marka)}
.logo .k2{display:block;font-size:11px;font-weight:700;letter-spacing:.26em;
  text-transform:uppercase;color:var(--vurgu);margin-top:4px}
nav.menu{margin-left:auto;display:flex;align-items:center;gap:17px}
nav.menu a{text-decoration:none;font-size:14px;font-weight:600;color:var(--murekkep);
  white-space:nowrap;padding-block:6px;border-bottom:2px solid transparent}
nav.menu a:hover{color:var(--vurgu);border-bottom-color:var(--vurgu)}
nav.menu a.acik{color:var(--vurgu);border-bottom-color:var(--vurgu)}
.cta{background:var(--vurgu);color:#fff;text-decoration:none;font-weight:700;font-size:14.5px;
  padding:13px 18px;white-space:nowrap;border-radius:4px;flex:0 0 auto;margin-left:20px;
  box-shadow:0 2px 10px rgba(216,24,72,.28);transition:background .18s,transform .18s}
.cta:hover{background:var(--vurgu-2);transform:translateY(-1px)}
.cta .kisa{display:none}
.mbtn{display:none;margin-left:auto;background:none;border:1px solid var(--cizgi);border-radius:4px;
  padding:10px;cursor:pointer;color:var(--murekkep)}
.mbtn svg{width:22px;height:22px;display:block}
#mmenu{display:none;border-top:1px solid var(--cizgi);background:var(--zemin)}
#mmenu.acik{display:block}
#mmenu a{display:block;padding:15px 22px;text-decoration:none;font-weight:700;font-size:16.5px;
  border-bottom:1px solid var(--cizgi)}
@media (max-width:1180px){ nav.menu{display:none} .mbtn{display:block} .cta{margin-left:12px} }
@media (max-width:640px){ .cta .uzun{display:none} .cta .kisa{display:inline} }
@media (max-width:430px){
  .logo .k1{font-size:19px} .logo .k2{font-size:10px;letter-spacing:.2em}
  .logo img{height:40px} .logo{gap:10px}
  .cta{padding:12px 13px;font-size:13.5px} .hrow{gap:8px;min-height:72px}
}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--koyu);color:#fff;overflow:hidden;
  border-bottom:4px solid var(--vurgu)}
.hero::before{content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:46px 46px;
  mask-image:radial-gradient(ellipse 85% 75% at 72% 40%,#000 25%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 85% 75% at 72% 40%,#000 25%,transparent 78%)}
.hero::after{content:"";position:absolute;right:-12%;top:-28%;width:62%;height:150%;
  background:radial-gradient(circle at 50% 50%,rgba(31,151,201,.30),transparent 62%);
  pointer-events:none}
.hero .olcu{position:relative;z-index:2;padding-block:58px 54px}

/* hero künye paneli — yetki ve bayilik */

/* hizmet şeridi — dönen kelime yerine sabit kurumsal liste */
.hero.kucuk .olcu{padding-block:48px 46px}
.rozet{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.18);padding:7px 15px;border-radius:100px;
  font-size:13px;font-weight:700;letter-spacing:.06em;color:#fff;margin-bottom:22px}
.rozet i{width:7px;height:7px;border-radius:50%;background:var(--altin);display:block;
  box-shadow:0 0 0 4px rgba(240,156,48,.22)}
.hero h1{font-size:clamp(25px,2.7vw,37px);font-weight:800;max-width:34ch;line-height:1.2;
  padding-left:20px;border-left:4px solid var(--vurgu)}
@media (max-width:520px){ .hero h1{padding-left:15px;border-left-width:3px} }
.hero.kucuk h1{font-size:clamp(32px,4.8vw,50px);max-width:22ch}
.hero h1 em{font-style:normal;color:var(--gok)}
.hero p.alt{color:#BCCBDC;font-size:18px;max-width:58ch;margin:20px 0 0}
.yol{color:#8FA5BD;font-size:13.5px;margin-bottom:16px}
.yol a{text-decoration:none;border-bottom:1px solid rgba(255,255,255,.25)}
.hero-dug{display:flex;flex-wrap:wrap;gap:13px;margin-top:32px}

.dug{display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;
  font-weight:700;font-size:16px;padding:17px 26px;border-radius:4px;border:1px solid transparent;
  transition:transform .18s,background .18s,border-color .18s}
.dug:hover{transform:translateY(-2px)}
.dug-1{background:var(--vurgu);color:#fff;box-shadow:0 4px 18px rgba(216,24,72,.32)}
.dug-1:hover{background:var(--vurgu-2)}
.dug-2{background:transparent;color:#fff;border-color:rgba(255,255,255,.32)}
.dug-2:hover{border-color:#fff}
.dug-3{background:var(--yesil);color:#fff;box-shadow:0 4px 18px rgba(30,158,92,.3)}
.dug-4{background:var(--marka);color:#fff}
.dug svg{width:18px;height:18px;flex:0 0 auto}

/* ---------- bölüm ---------- */
section{padding-block:64px}
section.gri{background:var(--zemin-2)}
.bslik{max-width:64ch;margin-bottom:38px}
.bslik .et{color:var(--vurgu);font-size:12.5px;font-weight:800;letter-spacing:.18em;
  text-transform:uppercase;display:flex;align-items:center;gap:12px;margin-bottom:14px}
.bslik .et::after{content:"";height:1px;flex:1 1 auto;max-width:78px;
  background:linear-gradient(90deg,var(--vurgu),transparent)}
.bslik h2{font-size:clamp(27px,3.7vw,40px);letter-spacing:-.025em}
.bslik p{color:var(--murekkep-2);margin:15px 0 0;font-size:17.5px}
.golge{box-shadow:0 10px 30px rgba(12,23,40,.06)}

/* alt CTA bandındaki beyaz etiket */
.et-beyaz{color:#fff;font-size:12.5px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;
  display:flex;align-items:center;gap:12px;margin-bottom:14px;opacity:.95}
.et-beyaz::after{content:"";height:1px;flex:1 1 auto;max-width:78px;
  background:linear-gradient(90deg,rgba(255,255,255,.7),transparent)}

/* ---------- hızlı erişim kutuları ---------- */
.hizli{background:var(--zemin);margin-top:-34px;position:relative;z-index:5}
.kutular{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:820px){ .kutular{grid-template-columns:1fr} .hizli{margin-top:-26px} }
.hkutu{position:relative;overflow:hidden;background:var(--kart);border:1px solid var(--cizgi);
  border-radius:3px;padding:24px 24px 26px;display:grid;gap:7px;text-decoration:none;
  box-shadow:0 8px 26px rgba(12,23,40,.07);
  transition:transform .2s,box-shadow .2s,border-color .2s;align-content:start}
.hkutu::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--vurgu);
  transform:scaleX(0);transform-origin:left;transition:transform .25s}
.hkutu:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(12,23,40,.11);
  border-color:var(--marka)}
.hkutu:hover::after{transform:scaleX(1)}
.ikon{width:48px;height:48px;border-radius:3px;background:rgba(31,151,201,.10);
  border:1px solid rgba(29,58,107,.10);
  display:flex;align-items:center;justify-content:center;color:var(--marka);margin-bottom:5px;
  flex:0 0 auto}
.ikon svg{width:25px;height:25px}
.ikon.buyuk{width:70px;height:70px;border-radius:3px;background:var(--marka);color:#fff;
  border-color:transparent;box-shadow:0 6px 20px rgba(29,58,107,.22)}
.ikon.buyuk svg{width:34px;height:34px}
.hkutu b{font-size:19px;font-weight:800;letter-spacing:-.01em}
.hkutu span{color:var(--murekkep-2);font-size:15px}
.hkutu .oku{color:var(--vurgu);font-weight:700;font-size:14.5px;margin-top:4px}

/* ---------- kart ızgarası ---------- */
.izgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:18px}
.izgara.dar{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.kart{background:var(--kart);border:1px solid var(--cizgi);border-radius:3px;padding:26px 24px 28px;
  display:grid;gap:10px;align-content:start;transition:transform .2s,box-shadow .2s}
.kart:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(12,23,40,.09);
  border-color:var(--marka)}
.kart h3{font-size:20.5px;font-weight:800}
.kart p{margin:0;color:var(--murekkep-2);font-size:15.5px}
.kart .oku{color:var(--vurgu);font-weight:700;font-size:14.5px;text-decoration:none}
a.kart{text-decoration:none}

/* ---------- sayı bandı ---------- */
.sayilar{background:var(--koyu);color:#fff;position:relative;overflow:hidden;padding-block:52px}
.sayilar::before{content:"";position:absolute;inset:0;
  background-image:radial-gradient(rgba(255,255,255,.10) 1.4px,transparent 1.4px);
  background-size:26px 26px;opacity:.5}
.sayilar .olcu{position:relative;z-index:2}
.sayilar .dortlu{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.sayilar .sayi{padding-inline:26px;border-left:1px solid rgba(255,255,255,.14)}
.sayilar .sayi:first-child{border-left:0;padding-left:0}
@media (max-width:860px){ .sayilar .dortlu{grid-template-columns:1fr 1fr;gap:30px 0}
  .sayilar .sayi:nth-child(3){border-left:0;padding-left:0} }
.sayi b{display:block;font-size:clamp(34px,4.6vw,48px);font-weight:800;color:var(--altin);
  line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.sayi strong{display:block;font-size:16px;font-weight:700;margin-top:10px;color:#fff}
.sayi span{display:block;font-size:14px;color:#9FB2C7;margin-top:4px}

/* ---------- vurgulu kart (avantaj / değer) ---------- */
.vkart{border:1px solid var(--cizgi);border-left:4px solid var(--vurgu);background:var(--kart);
  border-radius:0 3px 3px 0;padding:24px;display:grid;gap:8px;align-content:start}
.vkart.mavi{border-left-color:var(--marka)}
.vkart.altin{border-left-color:var(--altin)}
.vkart .et{font-size:11.5px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;
  color:var(--vurgu)}
.vkart.mavi .et{color:var(--marka)}
.vkart.altin .et{color:#B4700F}
.vkart b{font-size:19.5px;font-weight:800}
.vkart p{margin:0;color:var(--murekkep-2);font-size:15.5px}

/* ---------- yetki / bayilik kartları ---------- */
.yetki-izgara{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:760px){ .yetki-izgara{grid-template-columns:1fr} }
.yetki{background:var(--kart);border:1px solid var(--cizgi);border-radius:3px;
  padding:30px 26px 28px;display:grid;gap:9px;align-content:start;text-align:center;
  justify-items:center;transition:transform .2s,box-shadow .2s}
.yetki:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(12,23,40,.09);
  border-color:var(--marka)}
.mlogo{height:78px;display:flex;align-items:center;justify-content:center;margin-bottom:10px;
  padding-inline:10px}
.mlogo img{max-height:78px;width:auto;object-fit:contain}
.mlogo.yazi img{display:none}
.mlogo.yazi::before{content:attr(data-ad);font-size:34px;font-weight:800;letter-spacing:.04em;
  color:var(--marka);line-height:1}
.yetki b{font-size:21px;font-weight:800;letter-spacing:-.01em}
.yetki .its{display:inline-block;font-size:12.5px;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:var(--vurgu);background:rgba(216,24,72,.08);
  padding:5px 13px;border-radius:100px}
.yetki p{margin:6px 0 0;color:var(--murekkep-2);font-size:15.5px;max-width:42ch}

/* ---------- bilgilendirme şeridi ---------- */
.bilgi-serit{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:start;
  background:var(--zemin-2);border:1px solid var(--cizgi);border-left:4px solid var(--gok);
  border-radius:0 3px 3px 0;padding:26px 28px}
.bilgi-serit b{display:block;font-size:20px;font-weight:800;letter-spacing:-.01em;margin-bottom:6px}
.bilgi-serit p{margin:0;color:var(--murekkep-2);font-size:16px;max-width:76ch}
@media (max-width:620px){
  .bilgi-serit{grid-template-columns:1fr;gap:14px;padding:22px 20px}
}

/* ---------- süreç ---------- */
.sutun2{display:grid;grid-template-columns:1fr 1fr;gap:54px}
@media (max-width:900px){ .sutun2{grid-template-columns:1fr;gap:44px} }
.sbas{display:inline-flex;align-items:center;gap:10px;background:var(--marka);color:#fff;
  font-size:12.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  padding:9px 16px;border-radius:4px;margin-bottom:20px}
ol.adimlar{list-style:none;margin:0;padding:0;counter-reset:s;position:relative}
ol.adimlar::before{content:"";position:absolute;left:17px;top:14px;bottom:14px;width:2px;
  background:var(--cizgi)}
ol.adimlar li{counter-increment:s;display:grid;grid-template-columns:36px 1fr;gap:18px;
  padding-block:13px;position:relative}
ol.adimlar li::before{content:counter(s);width:36px;height:36px;border-radius:50%;
  background:var(--marka);color:#fff;font-size:15px;font-weight:800;display:flex;
  align-items:center;justify-content:center;position:relative;z-index:2}
ol.adimlar b{display:block;font-size:18.5px;font-weight:800;margin-bottom:3px}
ol.adimlar span{color:var(--murekkep-2);font-size:15.5px}

/* ---------- künye / tanım listesi ---------- */
.kdl{margin:0}
.kdl .s{display:grid;grid-template-columns:118px minmax(0,1fr);gap:16px;padding-block:15px;
  border-bottom:1px solid var(--cizgi);align-items:baseline}
.kdl .s:first-child{border-top:1px solid var(--cizgi)}
.kdl dt{margin:0;font-size:11.5px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;
  color:var(--murekkep-2)}
.kdl dd{margin:0;font-size:17px;font-weight:600;min-width:0;overflow-wrap:anywhere}
.kdl a{text-decoration:none;border-bottom:2px solid rgba(216,24,72,.35)}
.kdl a:hover{border-bottom-color:var(--vurgu)}
@media (max-width:480px){ .kdl .s{grid-template-columns:1fr;gap:4px} }

/* ---------- referans satırı ---------- */
.ref{border-top:1px solid var(--cizgi)}
.ref .r{display:grid;grid-template-columns:1.3fr .9fr 1.6fr .5fr;gap:18px;padding-block:20px;
  border-bottom:1px solid var(--cizgi);align-items:baseline}
.ref .r b{font-size:19.5px;font-weight:800}
.ref .yer{color:var(--murekkep-2);font-size:14px;letter-spacing:.08em;text-transform:uppercase}
.ref .kap{color:var(--murekkep-2);font-size:15.5px}
.ref .yil{font-weight:700;font-variant-numeric:tabular-nums;color:var(--marka)}
@media (max-width:820px){ .ref .r{grid-template-columns:1fr;gap:5px} }
.durum{display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.1em;
  text-transform:uppercase;padding:4px 10px;border-radius:100px}
.durum.bitti{background:rgba(30,158,92,.12);color:#127343}
.durum.devam{background:rgba(240,156,48,.16);color:#8A5A0B}

/* ---------- sss ---------- */
details{border-bottom:1px solid var(--cizgi);background:var(--kart)}
details:first-of-type{border-top:1px solid var(--cizgi)}
summary{cursor:pointer;list-style:none;padding:21px 20px;font-weight:700;font-size:18px;
  display:flex;gap:16px;align-items:flex-start;letter-spacing:-.005em}
summary::-webkit-details-marker{display:none}
summary::after{content:"";margin-left:auto;flex:0 0 auto;width:10px;height:10px;margin-top:7px;
  border-right:2.4px solid var(--vurgu);border-bottom:2.4px solid var(--vurgu);
  transform:rotate(45deg);transition:transform .2s}
details[open] summary::after{transform:rotate(-135deg)}
details .cev{margin:0;padding:0 20px 22px;color:var(--murekkep-2);max-width:78ch}

/* ---------- form ---------- */
.iletgrid{display:grid;grid-template-columns:1fr 1.06fr;gap:48px;align-items:start}
@media (max-width:900px){ .iletgrid{grid-template-columns:1fr;gap:34px} }
form.kutu{background:var(--kart);border:1px solid var(--cizgi);border-radius:3px;padding:28px;
  box-shadow:0 12px 34px rgba(12,23,40,.07)}
form.kutu h3{font-size:25px;font-weight:800;margin-bottom:6px}
form.kutu .fnot{color:var(--murekkep-2);font-size:15px;margin:0 0 22px}
.alan{display:grid;gap:7px;margin-bottom:16px}
.ikili{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:520px){ .ikili{grid-template-columns:1fr;gap:0} }
label{font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--murekkep-2)}
input,select,textarea{font:inherit;font-size:16px;width:100%;padding:13px 14px;border-radius:4px;
  color:var(--murekkep);background:var(--zemin);border:1px solid var(--cizgi)}
textarea{min-height:108px;resize:vertical}
input:focus,select:focus,textarea:focus,summary:focus-visible,a:focus-visible,button:focus-visible{
  outline:2px solid var(--vurgu);outline-offset:2px}
button.gonder{width:100%;background:var(--vurgu);color:#fff;border:0;padding:17px;font:inherit;
  font-weight:800;font-size:16.5px;border-radius:4px;cursor:pointer;
  box-shadow:0 4px 16px rgba(216,24,72,.28);transition:background .18s}
button.gonder:hover{background:var(--vurgu-2)}
.minik{font-size:13.5px;color:var(--murekkep-2);margin:14px 0 0}

/* ---------- metin blokları ---------- */
.yazi{max-width:72ch}
.yazi p{margin:0 0 18px}
.yazi h3{font-size:24px;margin:34px 0 12px}
.yazi ul{margin:0 0 18px;padding-left:22px;color:var(--murekkep-2)}
.yazi li{margin-bottom:8px}

/* ---------- alt CTA bandı ---------- */
.altcta{background:var(--marka);color:#fff;padding-block:50px}
.altcta h2{font-size:clamp(26px,3.6vw,38px);margin-bottom:12px}
.altcta p{color:#CBDCF0;margin:0 0 26px;font-size:17.5px;max-width:60ch}

/* ---------- footer ---------- */
footer{background:var(--koyu);color:#A9BCD2;padding-block:44px 24px;font-size:15px}
footer .fgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.1fr;gap:38px;
  padding-bottom:34px;border-bottom:1px solid rgba(255,255,255,.12)}
@media (max-width:900px){ footer .fgrid{grid-template-columns:1fr 1fr;gap:30px} }
@media (max-width:560px){ footer .fgrid{grid-template-columns:1fr} }
footer img.flogo{height:78px;width:auto;margin-bottom:14px}
footer .fslogan{color:var(--altin);font-size:13px;font-weight:800;letter-spacing:.11em;
  text-transform:uppercase;line-height:1.55;margin-bottom:16px;padding-bottom:16px;
  border-bottom:1px solid rgba(255,255,255,.12);max-width:34ch}
footer h4{color:#fff;font-size:12.5px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;
  margin:0 0 15px}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
footer a{color:#A9BCD2;text-decoration:none}
footer a:hover{color:#fff}
footer .dhat{color:#fff;font-size:23px;font-weight:800;display:block;margin-bottom:3px;
  letter-spacing:-.01em}
.falt{padding-top:20px;display:flex;flex-wrap:wrap;gap:10px 24px;font-size:13.5px;color:#7D92AB}

/* ---------- mobil alt çubuk ---------- */
.mcubuk{display:none}
@media (max-width:820px){
  .mcubuk{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:70;
    box-shadow:0 -4px 20px rgba(12,23,40,.26)}
  .mcubuk a{display:flex;align-items:center;justify-content:center;gap:9px;
    padding:15px 10px calc(15px + env(safe-area-inset-bottom,0px));text-decoration:none;
    font-weight:800;font-size:16px;color:#fff}
  .mcubuk .a1{background:var(--vurgu)}
  .mcubuk .a2{background:var(--yesil)}
  .mcubuk svg{width:19px;height:19px}
  body{padding-bottom:64px}
}

/* ---------- hareket ---------- */
.gel{opacity:0;transform:translateY(26px);transition:opacity .5s ease,transform .5s ease}
.gel.acik{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .gel{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* ---------- fiyat listesi ---------- */
.fiyat-izgara{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
@media (max-width:860px){ .fiyat-izgara{grid-template-columns:1fr} }
.fiyat{background:var(--kart);border:1px solid var(--cizgi);border-radius:3px;overflow:hidden}
.f-bas{background:var(--marka);color:#fff;padding:16px 20px;display:grid;gap:2px}
.f-bas b{font-size:18px;font-weight:800;letter-spacing:-.01em}
.f-bas span{font-size:13px;color:#CBDCF0;font-weight:600}
.fs{display:grid;grid-template-columns:minmax(0,1fr) 90px auto auto;gap:14px;align-items:center;
  padding:13px 20px;border-top:1px solid var(--cizgi)}
.fs-ad{font-size:15.5px;font-weight:700;letter-spacing:-.005em;min-width:0;overflow-wrap:anywhere}
.fs-kap{font-size:13.5px;color:var(--murekkep-2);font-weight:600;text-align:right}
.fs-fi{font-size:16.5px;font-weight:800;color:var(--marka);font-variant-numeric:tabular-nums;
  white-space:nowrap}
.fs-dug{font-size:12.5px;font-weight:800;letter-spacing:.04em;color:var(--vurgu);
  text-decoration:none;white-space:nowrap;border:1px solid rgba(216,24,72,.32);
  padding:6px 11px;border-radius:3px;transition:background .18s,color .18s}
.fs-dug:hover{background:var(--vurgu);color:#fff;border-color:var(--vurgu)}
@media (max-width:520px){
  .fs{grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:13px 16px}
  .fs-kap{grid-row:2;grid-column:1;text-align:left}
  .fs-dug{grid-row:2;grid-column:2;justify-self:end}
}
.fiyat-not{margin:20px 0 26px;font-size:14.5px;color:var(--murekkep-2);max-width:82ch;
  border-left:3px solid var(--altin);padding-left:16px}
