/* BULLMENT v2.1 — RAYNSIS aile dili (raynsis.com · Console · AI Studio ortalaması, ölçüm 27.09 16:3x)
   Aileden: nötr zemin (#000/#0A0A0A koyu, #FFF/#F5F5F7 açık) · başlık 600 · rakam mono tabular · yarıçap 16/999 ·
   bölüm boşluğu 96/128/160 · cam yalnız üst çubukta · süs animasyonu yok (yalnız veri/seçim taşıyan nesne hareket eder).
   Markadan (MARKA_PROTOKOLU.md, Yasa 22): #0AAEE5 · #BFFBAE · #1e1e1e · #FFFFFF, logo resmî Original.svg.
   İmza: marka çiftinden ince çizgi (camgöbeği → yeşil) + ürünün arkasında ışık havuzu. Düzen dili IOS27_KURALI.md. */
:root{
  --beyaz:#FFFFFF; --ink:#1e1e1e; --mavi:#0AAEE5; --yesil:#BFFBAE;
  --mavi-yazi:#067FA8;
  --acik-2:#F5F5F7; --soluk:#6E6E73; --cizgi:rgba(0,0,0,.08);
  --koyu:#000000; --koyu-2:#0A0A0A; --koyu-yazi:#F5F5F7; --koyu-soluk:#A1A1AA; --koyu-cizgi:rgba(255,255,255,.10);
  --cam:rgba(255,255,255,.78); --cam-2:rgba(255,255,255,.94); --ters:#FFFFFF; --yuzey:#FFFFFF; --kayar:#FFFFFF;
  --segment:rgba(0,0,0,.06); --uyari-yazi:#8A5A00;
  --r-kart:16px; --r-satir:10px;
  --yay:cubic-bezier(.22,1,.36,1);
  --imza:linear-gradient(90deg,var(--mavi),var(--yesil));
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --kenar:max(20px,env(safe-area-inset-left));
  --genislik:1200px;
  --bolum:96px;
}
/* Gece (27.09 Faruk): aile dili saf siyah zemin + nötr merdiven (Console tokens.json). Seçim: data-tema, yoksa cihaz ayarı. */
:root[data-tema=gece]{--beyaz:#000000;--acik-2:#111113;--ink:#F5F5F7;--soluk:#A1A1AA;--cizgi:rgba(255,255,255,.10);--mavi-yazi:#3CC4F0;
  --cam:rgba(0,0,0,.72);--cam-2:rgba(22,22,24,.94);--ters:#000000;--yuzey:#1C1C1E;--kayar:#3A3A3C;--segment:rgba(255,255,255,.08);--uyari-yazi:#E0B35A;color-scheme:dark}
@media (prefers-color-scheme:dark){:root:not([data-tema=gunduz]){--beyaz:#000000;--acik-2:#111113;--ink:#F5F5F7;--soluk:#A1A1AA;--cizgi:rgba(255,255,255,.10);--mavi-yazi:#3CC4F0;
  --cam:rgba(0,0,0,.72);--cam-2:rgba(22,22,24,.94);--ters:#000000;--yuzey:#1C1C1E;--kayar:#3A3A3C;--segment:rgba(255,255,255,.08);--uyari-yazi:#E0B35A;color-scheme:dark}}
/* Logo (Faruk 18:4x): 'Smart Balls' yazısı kalktı, yonca + Bullment büyüdü; gece: gümüş gradyan yazı + yumuşak hale = sahne yıldızı (statik, animasyon yok) */
.marka .companyName path{fill:var(--logo-yazi,#1e1e1e)}
:root[data-tema=gece]{--logo-yazi:url(#gumus)}
@media (prefers-color-scheme:dark){:root:not([data-tema=gunduz]){--logo-yazi:url(#gumus)}}
:root[data-tema=gece] .logo .marka{filter:drop-shadow(0 0 16px rgba(255,255,255,.22)) drop-shadow(0 0 2px rgba(255,255,255,.35))}
@media (prefers-color-scheme:dark){:root:not([data-tema=gunduz]) .logo .marka{filter:drop-shadow(0 0 16px rgba(255,255,255,.22)) drop-shadow(0 0 2px rgba(255,255,255,.35))}}
.alt-logo .marka{height:52px;width:auto;display:block;filter:drop-shadow(0 0 2px rgba(255,255,255,.3))} .alt-logo .companyName path{fill:url(#gumus)}   /* 27.09 Faruk: altbilgi logosu beyaz kutusuz, koyu zeminle bütün; yazı gümüş (gece üst çubukla aynı) */
.tema-dugme{background:none;border:0;color:var(--soluk);width:44px;height:44px;border-radius:999px;cursor:pointer;display:grid;place-items:center}
.tema-dugme:hover{color:var(--ink)}
.tema-dugme svg{width:19px;height:19px}
.tema-dugme .ay{display:none}
:root[data-tema=gece] .tema-dugme .gunes{display:none} :root[data-tema=gece] .tema-dugme .ay{display:block}
@media (prefers-color-scheme:dark){:root:not([data-tema=gunduz]) .tema-dugme .gunes{display:none} :root:not([data-tema=gunduz]) .tema-dugme .ay{display:block}}
@media (min-width:735px){:root{--bolum:128px}}
@media (min-width:1069px){:root{--bolum:160px}}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--beyaz);color:var(--ink);font:400 17px/1.47 var(--sans);letter-spacing:-.01em;overflow-x:hidden;-webkit-font-smoothing:antialiased}
[dir=rtl] body{font-family:"Noto Sans Arabic",var(--sans);letter-spacing:0}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.c{display:block}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.025em;line-height:1.08;text-wrap:balance}
[dir=rtl] h1,[dir=rtl] h2,[dir=rtl] h3{letter-spacing:0}
p{margin:0;text-wrap:pretty}
.atla{position:absolute;inset-inline-start:16px;top:8px;transform:translateY(-300%);background:var(--ink);color:#fff;padding:10px 14px;border-radius:var(--r-satir);z-index:99}
.atla:focus{transform:none}
:focus-visible{outline:2px solid var(--mavi);outline-offset:3px;border-radius:6px}
.kap{max-width:var(--genislik);margin:0 auto;padding:0 var(--kenar)}
.rakam{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}

/* ── Üst çubuk: açık cam, resmî dikey logo ── */
.ust{position:fixed;inset:0 0 auto 0;z-index:50;background:var(--cam);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}
.ust .kap{display:flex;align-items:center;gap:24px;height:96px;transition:height .35s var(--yay)}
.ust.kompakt .kap{height:64px}
.logo{display:flex;align-items:center;min-height:44px}
.logo .marka{height:80px;width:auto;transition:height .35s var(--yay)}   /* dikey logo; Faruk: Bullment + yonca büyüsün */
.ust.kompakt .logo .marka{height:56px}
.nav{display:flex;gap:2px;margin-inline-start:auto;align-items:center}
.nav a{text-decoration:none;font-size:14px;padding:10px 12px;border-radius:999px;min-height:44px;display:inline-flex;align-items:center;color:var(--soluk);transition:color .2s}
.nav a:hover{color:var(--ink)}
.dil{position:relative}
.dil summary{list-style:none;cursor:pointer;font:500 13px/1 var(--mono);color:var(--soluk);padding:10px 12px;border-radius:999px;min-height:44px;display:flex;align-items:center;gap:6px}
.dil summary::-webkit-details-marker{display:none}
.dil ul{position:absolute;inset-inline-end:0;top:calc(100% + 8px);margin:0;padding:4px 0;list-style:none;min-width:190px;
  background:var(--cam-2);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border:1px solid var(--cizgi);border-radius:var(--r-kart)}
.dil li a{display:flex;justify-content:space-between;align-items:center;padding:11px 16px;min-height:44px;text-decoration:none;font-size:15px}
.dil li+li a{border-top:1px solid var(--cizgi)}
.dil li a[aria-current] span:last-child{color:var(--mavi-yazi);font-weight:600}
.nav a.ust-cta{text-decoration:none;font-weight:600;font-size:13px;padding:0 14px;min-height:34px;display:inline-flex;align-items:center;border-radius:999px;background:var(--ink);color:var(--ters);margin-inline-start:8px}   /* .nav a rengi (soluk) düğmeyi eziyordu → gri yazı; çerçeve 40→34 px (Faruk: 'okunmuyor, çerçeve geniş') */
.nav a.ust-cta:hover{color:var(--ters);opacity:.88}
.menu-dugme{display:none;margin-inline-start:auto;background:none;border:0;color:var(--ink);width:44px;height:44px;border-radius:999px;cursor:pointer}
.menu-dugme svg{width:22px;height:22px}

/* ── Bölüm iskeleti + niyet (Yasa 33): zemin boyanmaz, nötr merdiven ── */
.ekran{position:relative;padding:var(--bolum) 0}
.ekran[data-niyet=guven]{background:var(--beyaz)}
.ekran[data-niyet=samimiyet]{background:var(--acik-2)}
.ekran[data-niyet=karar]{background:var(--beyaz)}
.ekran.koyu{background:var(--koyu);color:var(--koyu-yazi)}
.ekran.koyu[data-niyet=kazanc]{background:var(--koyu-2)}
.etiket{display:inline-flex;flex-direction:column;gap:12px;font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--soluk);margin-bottom:20px}
.etiket::after{content:"";width:48px;height:2px;border-radius:2px;background:var(--imza)}   /* imza çizgisi */
[dir=rtl] .etiket{letter-spacing:0}
.koyu .etiket{color:var(--koyu-soluk)}
.baslik{font-size:clamp(34px,4.6vw,56px)}
#sss .baslik{white-space:nowrap;font-size:clamp(24px,7.4vw,56px)}   /* 27.09 21:4x Faruk: SSS başlığı tek satır; dar ekranda punto küçülür, kırılmaz */
.giris{font-size:19px;color:var(--soluk);max-width:600px;margin-top:20px}
.koyu .giris{color:var(--koyu-soluk)}

/* ── Hero: asimetrik, serif yalnız burada (marka anı) ── */
.hero{min-height:min(100svh,940px);display:flex;align-items:center;padding:152px 0 72px;overflow:hidden;
  background:radial-gradient(640px 560px at 74% 48%,rgba(10,174,229,.20),transparent 70%),var(--koyu)}
.hero .kap{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;width:100%;position:relative;z-index:1}
/* 3D derinlik: işaretçiyle hafif eğim (±5°), yay geçiş; reduced-motion'da düz */
.hero figure{transform:perspective(1200px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .6s var(--yay);will-change:transform}
.hero figure img{transform:translateZ(40px)}
/* RAYNSIS ada kabuğu (Faruk 19:0x): koyu cam kapsül + marka renkli ince ışık halkası + üst iç parıltı + alt hale */
.hero .btn-beyaz,.hero .btn-metin{position:relative;isolation:isolate;color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.03));padding:0 24px;min-height:50px;border-radius:999px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 -8px 16px -12px rgba(10,174,229,.35),0 14px 34px -18px rgba(10,174,229,.55)}
.hero .btn-beyaz::before,.hero .btn-metin::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;z-index:-1;pointer-events:none;
  background:conic-gradient(from 210deg,rgba(10,174,229,.9),rgba(191,251,174,.85) 35%,rgba(255,255,255,.55) 50%,rgba(10,174,229,.9) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;opacity:.75;transition:opacity .25s}
.hero .btn-beyaz:hover::before,.hero .btn-metin:hover::before{opacity:1}
.hero .btn-beyaz:hover,.hero .btn-metin:hover{background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.05))}
.hero .btn-metin{padding:0 22px;min-height:50px}
.hero .btn-metin::after{content:"→";margin-inline-start:2px}
.hero h1{font:400 clamp(52px,7.6vw,104px)/1 var(--serif);letter-spacing:-.02em}
.hero h1 span{display:block}
.hero h1 span+span{font-style:italic;background:var(--imza);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{font-size:19px;color:var(--koyu-soluk);max-width:500px;margin-top:28px}
.hero-dugme{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;margin-top:36px}
.hero figure{margin:0;justify-self:end;max-width:460px;width:100%}
.hero figure img{width:100%;aspect-ratio:4/5;object-fit:cover;
  -webkit-mask-image:radial-gradient(ellipse 68% 70% at 50% 50%,#000 60%,transparent 100%);mask-image:radial-gradient(ellipse 68% 70% at 50% 50%,#000 60%,transparent 100%)}
.olgu{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:56px;padding-top:24px;border-top:1px solid var(--koyu-cizgi);font-size:14px;color:var(--koyu-soluk);list-style:none;padding-inline-start:0}
.olgu b{color:var(--koyu-yazi);font-weight:500;margin-inline-end:6px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 24px;border-radius:999px;
  font:600 15px/1 var(--sans);text-decoration:none;cursor:pointer;border:0;transition:background .2s,transform .1s}
.btn:active{transform:scale(.97)}
.btn-beyaz{background:#fff;color:#000}
.btn-beyaz:hover{background:#E8E8ED}
.btn-metin{background:none;color:var(--koyu-yazi);padding:0 4px;min-height:44px}
.btn-metin::after{content:"→";transition:transform .2s var(--yay)}
[dir=rtl] .btn-metin::after{content:"←"}
.btn-metin:hover::after{transform:translateX(3px)}
.btn-birincil{background:var(--ink);color:var(--ters);width:100%}
.btn-birincil:hover{opacity:.88}

/* ── Ürünler: asimetrik galeri + kahraman rakam ── */
.urun{display:grid;grid-template-columns:1.25fr 1fr;gap:72px;align-items:start;margin-top:64px}
.sahne{position:relative}
.sahne::before{content:"";position:absolute;inset:8% 12%;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--aroma) 26%,transparent),transparent);filter:blur(30px)}   /* ışık havuzu: seçili aromanın rengi */
/* Aroma karesi (Faruk 19:1x): beyaz kare, Seedream renderı, 9 sn minimal döngü (süzülme + ışık süpürmesi); kredisiz, CSS */
.urun-gorsel{position:relative;aspect-ratio:1;border-radius:var(--r-kart);overflow:hidden;background:#fff;isolation:isolate}
.urun-gorsel img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .6s var(--yay);filter:drop-shadow(0 26px 30px rgba(0,0,0,.18))}
.urun-gorsel img.secili{opacity:1;animation:suzul 9s ease-in-out infinite}
@keyframes suzul{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-2.5%) scale(1.035)}}
.urun-gorsel::after{content:"";position:absolute;inset:-20%;background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.55) 50%,transparent 58%);transform:translateX(-60%);animation:supur 9s ease-in-out infinite;pointer-events:none}
@keyframes supur{0%,55%{transform:translateX(-60%)}85%,100%{transform:translateX(60%)}}
.urun-gorsel::before{content:"";position:absolute;left:18%;right:18%;bottom:12%;height:8%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.14),transparent);filter:blur(6px);animation:golge 9s ease-in-out infinite}
@keyframes golge{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.92);opacity:.7}}
@media (prefers-reduced-motion:reduce){.urun-gorsel img.secili,.urun-gorsel::after,.urun-gorsel::before{animation:none}}
.demet{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px;position:relative}
.demet button{padding:0;border:0;background:#fff;border-radius:12px;overflow:hidden;cursor:pointer;aspect-ratio:1;
  filter:saturate(.85) opacity(.6);transition:filter .3s var(--yay),box-shadow .3s}
.demet button[aria-pressed=true]{filter:none;box-shadow:0 0 0 2px var(--mavi)}
.demet button:hover{filter:none}
.demet img{width:100%;height:100%;object-fit:cover}
.segment{display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;position:relative;padding:3px;border-radius:12px;background:var(--segment);max-width:100%}
.segment button{position:relative;z-index:1;border:0;background:none;font:500 14px/1 var(--sans);color:var(--ink);min-height:40px;padding:0 16px;border-radius:9px;cursor:pointer;white-space:nowrap}
.segment button[aria-selected=true]{font-weight:600}
/* 27.09 21:3x Faruk: seçilen meyvenin rengi arka plana sıvı (liquid) geçişle akar. --aroma kayıtlı özellik → renk kendisi animasyonlanır; kapsül geçerken hafif esner + bulanır */
@property --aroma{syntax:"<color>";inherits:true;initial-value:#4FD1B8}
.urun{--aroma:#4FD1B8;transition:--aroma .9s var(--yay)}
.segment .kayar.akis{animation:kayar-akis .6s var(--yay)}
@keyframes kayar-akis{0%{filter:blur(0)}35%{filter:blur(1.5px) saturate(1.25);scale:1.06 .94}100%{filter:blur(0);scale:1}}
@media (prefers-reduced-motion:reduce){.urun{transition:--aroma .25s linear}.segment .kayar.akis{animation:none}}
.segment .kayar{position:absolute;z-index:0;top:3px;bottom:3px;border-radius:9px;background:color-mix(in srgb,var(--aroma) 58%,var(--kayar));box-shadow:0 3px 8px rgba(0,0,0,.12),0 0 0 .5px rgba(0,0,0,.04);transition:transform .45s var(--yay),width .45s var(--yay)}
.urun-panel{min-height:120px}   /* 27.09 21:2x Faruk: başlık üstte, seçici altta */
.urun-panel + .segment{margin-top:24px}
.urun-panel [role=tabpanel][hidden]{display:none}
.urun-panel h3{font-size:clamp(34px,3.6vw,44px)}
.urun-panel p{font-size:19px;color:var(--soluk);margin-top:10px}
.kahraman{margin-top:48px;padding-top:28px;border-top:1px solid var(--cizgi);display:grid;grid-template-columns:auto 1fr;gap:4px 20px;align-items:end}
.kahraman .rakam{font-size:clamp(72px,8vw,112px);line-height:.85;font-weight:400}
.kahraman span{color:var(--soluk);font-size:15px;padding-bottom:8px}
.urun-not{margin-top:28px;font-size:15px;color:var(--soluk)}
.urun-not a{color:var(--mavi-yazi);font-weight:600}

/* ── Gruplanmış inset liste (iOS 27) ── */
.grup{list-style:none;margin:0;padding:0;background:var(--yuzey);border-radius:var(--r-kart);overflow:hidden}
.grup>li{display:flex;align-items:center;gap:14px;min-height:56px;padding:10px 16px;position:relative}
.grup>li+li::before{content:"";position:absolute;top:0;inset-inline-start:62px;inset-inline-end:0;border-top:1px solid var(--cizgi)}
/* 27.09 21:1x Faruk: ikon kareleri pastel, semboller %50 kalın (insa.py stroke ×1.5); sembol rengi pastel zeminde okunur koyu ton */
.ikon{flex:none;width:32px;height:32px;border-radius:8px;display:grid;place-items:center;background:#8AD4F0;color:#0B4A5E}
.ikon svg{width:18px;height:18px}
.ikon.y{background:#D6FCCA;color:#1F4D26}
.koyu .grup{background:rgba(255,255,255,.06);border:1px solid var(--koyu-cizgi)}
.koyu .grup>li+li::before{border-color:var(--koyu-cizgi)}
.dipnot{font-size:13px;color:var(--soluk);margin:10px 16px 0}
.koyu .dipnot{color:var(--koyu-soluk)}

#bayilik .baslik,#bayilik .giris{text-align:center;margin-inline:auto}
.bayi{display:block;margin-top:56px}
.urun-grup{margin-top:40px}
.harita{margin:0}
/* Bayi haritası: Natural Earth il sınırı + gölgeli rölyef (kamu malı); bayi ili marka camgöbeği, merkezde nabız (veri taşır → hareket eder) */
.harita svg{width:100%;height:auto;display:block;overflow:visible}
.harita .kara{fill:#15181C}
.harita .rolyef{mix-blend-mode:overlay;opacity:.9}
.harita .il{fill:transparent;stroke:rgba(255,255,255,.14);stroke-width:.7;transition:fill .3s var(--yay)}
.harita .il.bayi{fill:rgba(10,174,229,.42);stroke:rgba(10,174,229,.9)}
.harita .il:hover{fill:rgba(255,255,255,.08)}
.harita .il.bayi:hover{fill:rgba(10,174,229,.62)}
/* bağlantı ağı: ince hat, hat boyunca kayan sinyal; bir merkeze gelince bağlı hatlar parlar (JS .aktif) */
.harita .baglar path{fill:none;stroke:rgba(191,251,174,.32);stroke-width:.6;transition:stroke .3s,stroke-width .3s}
.harita .baglar path.aktif{stroke:var(--yesil);stroke-width:1.3;filter:drop-shadow(0 0 3px rgba(191,251,174,.8))}
.harita .sinyal{fill:#FFFFFF;opacity:.85}
.harita .nabiz{cursor:pointer}
.harita .nabiz.aktif circle:first-child{fill:#FFFFFF}
@media (prefers-reduced-motion:reduce){.harita .sinyal{display:none}}
.harita .nabiz circle{fill:var(--yesil)}
.harita .nabiz .halka{fill:none;stroke:var(--yesil);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:nabiz 2.6s var(--yay) infinite;animation-delay:var(--g)}
@keyframes nabiz{0%{transform:scale(1);opacity:.9}100%{transform:scale(4.5);opacity:0}}
.lejant{display:flex;gap:20px;flex-wrap:wrap;margin-top:14px;font-size:13px;color:var(--koyu-soluk);list-style:none;padding:0}
.lejant li{display:flex;align-items:center;gap:8px}
.lejant i{width:12px;height:12px;border-radius:3px;background:rgba(10,174,229,.42);border:1px solid #0AAEE5}
.lejant i.n{border-radius:50%;background:var(--yesil);border:0}
.harita figcaption{margin-top:16px}
.harita b{display:block;font-size:17px;font-weight:600;color:var(--koyu-yazi)}

/* ── Başvuru: ayar satırı düzeni ── */
.form-kap{max-width:720px;margin:0 auto}
.form-kap .baslik,.form-kap .giris{text-align:center;margin-inline:auto}
form{margin-top:44px}
.alan{background:var(--acik-2)}
.alan>li{min-height:54px;padding:0 16px}
.alan label{flex:none;width:34%;font-size:15px;font-weight:500}
.alan input,.alan textarea{flex:1;min-width:0;border:0;background:none;font:400 17px/1.4 var(--sans);color:var(--ink);padding:15px 0;text-align:end}
.alan textarea{resize:vertical;min-height:88px;text-align:start}
.alan>li.uzun{align-items:flex-start}
.alan>li.uzun label{padding-top:15px}
.alan input:focus,.alan textarea:focus{outline:none}
.alan>li:focus-within{background:rgba(10,174,229,.06)}
.alan>li+li::before{inset-inline-start:16px}
.form-alt{margin-top:24px}
.form-hata{color:var(--uyari-yazi);font-size:14px;min-height:20px;margin:10px 16px 0}

/* ── SSS ── */
.sss-duzen{display:grid;grid-template-columns:1fr 1.6fr;gap:72px;align-items:start}
.sss{background:var(--acik-2);border-radius:var(--r-kart);overflow:hidden}
.sss details+details{border-top:1px solid var(--cizgi)}
.sss summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:14px 18px;font-weight:500}
.sss summary::-webkit-details-marker{display:none}
.sss summary svg{flex:none;width:14px;height:14px;color:var(--soluk);transition:transform .35s var(--yay)}
.sss details[open] summary svg{transform:rotate(90deg)}
[dir=rtl] .sss summary svg{transform:scaleX(-1)}
[dir=rtl] .sss details[open] summary svg{transform:rotate(90deg)}
.sss details p{padding:0 18px 18px;color:var(--soluk)}

/* ── Hakkımızda ── */
.hak{display:grid;grid-template-columns:minmax(0,1fr);max-width:760px}
.hak-baslik{font-size:clamp(28px,3.4vw,44px);line-height:1.1;letter-spacing:-.02em;margin:0 0 24px}   /* 27.09 Faruk: sayfada 3. logo yok, hero logosu kalktı */
.hak p{font-size:19px;line-height:1.55;margin-top:16px;max-width:640px}
.hak p:first-of-type{margin-top:0}
.hak address{font-style:normal;margin-top:28px;color:var(--soluk);font-size:15px}
.yil{display:flex;gap:40px;margin-top:40px;padding-top:24px;border-top:1px solid var(--cizgi)}
.yil b{display:block;font-size:40px;font-weight:400;line-height:1}
.yil span{display:block;margin-top:8px;font-size:14px;color:var(--soluk)}

/* ── Alt bilgi ── */
.alt{background:var(--koyu);color:var(--koyu-soluk);padding:80px 0 40px;font-size:14px}
.alt .kap{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
.alt h4{margin:0 0 12px;color:var(--koyu-yazi);font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase}
[dir=rtl] .alt h4{letter-spacing:0}
.alt a{display:inline-flex;min-height:44px;align-items:center;text-decoration:none}
.alt a:hover{color:#fff}
.alt-logo{display:inline-block}
.uyari{grid-column:1/-1;border-top:1px solid var(--koyu-cizgi);padding-top:24px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px}
.uyari strong{color:var(--yesil);font-weight:500}

/* ── Kırılımlar ── */
@media (max-width:980px){
  .hero .kap,.urun,.bayi,.sss-duzen,.hak{grid-template-columns:1fr;gap:48px}
  .hero{padding:112px 0 40px;min-height:auto}   /* mobilde ekran boyu zorlaması altta boş siyah alan bırakıyordu (Faruk 18:3x) */
  .hero figure{max-width:340px;order:-1;justify-self:center;margin-bottom:-28px}
  .alt .kap{grid-template-columns:1fr 1fr}
  .alt .kap>div:first-child{grid-column:1/-1}
}
@media (max-width:860px){
  .ust .kap{height:72px}
  .logo .marka{height:54px}
  .nav{display:none}
  .menu-dugme{display:grid;place-items:center}
  .ust.acik .nav{display:flex;flex-direction:column;align-items:stretch;position:absolute;top:100%;inset-inline:0;margin:0;padding:8px var(--kenar) 20px;
    background:var(--cam-2);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border-bottom:1px solid var(--cizgi);gap:0}
  .ust.acik .nav>a{padding:12px 4px;border-radius:0;border-bottom:1px solid var(--cizgi);font-size:17px;color:var(--ink)}
  .ust.acik .nav>a.ust-cta{margin:14px 0 0;justify-content:center;min-height:48px;background:var(--ink);color:var(--beyaz);border-bottom:0}   /* gece: beyaz üstüne beyaz yazıydı (27.09 ölçüm) */
  /* 27.09 22:0x Faruk: mobil barda dil seçici SOLDA, logo ORTADA, menü tuşu sağda. Kenarlar eşit genişlik (56 px) → logo gerçekten ortada */
  .ust .kap>.dil{order:0;margin-inline-start:0;flex:0 0 56px;display:flex;justify-content:flex-start} .ust .kap>.dil summary{padding:10px 6px}
  .ust .kap>.logo{order:1;margin-inline:auto} .menu-dugme{order:2;margin-inline-start:0;flex:0 0 56px;justify-items:end}
  .ust .kap>.dil ul{position:absolute;inset-inline-start:0;inset-inline-end:auto;top:calc(100% + 8px)}
  .ust.acik .nav{order:3}
}
@media (max-width:600px){
  .segment{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;justify-content:space-between;width:100%}   /* tek satır (Faruk 18:4x: küçük görsel şeridi kalktı, seçici bu bar) */
  .segment button{padding:0 8px;font-size:12.5px}
  .urun-panel{margin-top:20px;min-height:0}
  .demet{gap:8px}
  .alan label{width:40%}
  .hero-dugme .btn-beyaz{flex:1 1 100%}
  .alt .kap{grid-template-columns:1fr 1fr;column-gap:24px}   /* 27.09 22:0x Faruk: İletişim ve Kurumsal yan yana; logo+adres ve uyarı tam satır */
  .alt .kap>div:first-child{grid-column:1/-1}
  .yil{gap:28px}
}
@media (max-width:400px){.hero h1{font-size:clamp(32px,10vw,42px)} .segment button{padding:0 6px;font-size:12px}}   /* DE "ein anderer Moment." 360 px'te 23 px taşıyordu */
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation:none!important;scroll-behavior:auto!important} .hero figure{transform:none}}
@media (prefers-reduced-transparency:reduce){.ust,.dil ul{background:var(--beyaz);-webkit-backdrop-filter:none;backdrop-filter:none}}
@media (prefers-contrast:more){:root{--soluk:var(--ink);--cizgi:rgba(0,0,0,.4)}}