/* ==========================================================================
   RAPORON — tanıtım sayfası (raporon.com)
   Aynı marka paleti: koyu deniz yeşili zemin bantları, şeftali vurgu,
   "ON" yeşili yalnızca eylem düğmelerinde. Sayfa üründen ödünç alınmış
   parçalarla (rapor kartı, editör satırı) anlatır; stok görsel yok.
   ========================================================================== */

:root{
  color-scheme: light;
  --t-900:#05373c; --t-800:#083f45; --t-700:#0b545c; --t-500:#0f6973; --t-400:#488c92;
  --t-300:#80aeb1; --t-200:#bbd3d3; --t-100:#dae7e7; --t-50:#e5f0f0; --t-25:#f2f8f8;
  --p-600:#ec917d; --p-500:#f5a08c; --p-100:#fce3dd; --p-50:#fef6f4;
  --on:#14a08b; --on-koyu:#0f8a77;
  --bg:#f4f1ef; --card:#fff; --card-2:#faf8f7;
  --line:#e9e4e1; --line-soft:#f0ecea;
  --ink:#12232a; --ink-2:#3d5157; --muted:#54666b; --muted-2:#5f7176;
  --good:#0e7d63; --good-bg:#e3f2ee;
  --warn:#a4703b; --warn-bg:#fbf0e4;
  --golge:0 1px 2px rgba(18,35,42,.05), 0 10px 30px -12px rgba(5,55,60,.18);
  --golge-buyuk:0 2px 4px rgba(18,35,42,.05), 0 30px 60px -24px rgba(5,55,60,.32);
  --yay:cubic-bezier(.2,.8,.2,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth; font-size:106%}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size:.9375rem; line-height:1.6;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
a{color:inherit}
h1,h2,h3{margin:0; letter-spacing:-.035em; line-height:1.15; font-weight:800}
p{margin:0}
ul{margin:0; padding:0; list-style:none}
svg{display:block}
b{font-weight:700}

.kap{width:min(100% - 2.5rem, 68rem); margin-inline:auto}
@media (min-width:60rem){ .kap{width:min(100% - 5rem, 68rem)} }

/* ---------- Logo ---------- */
.logo{display:inline-flex; align-items:center; gap:.34em; font-size:1.25rem; line-height:1; user-select:none; text-decoration:none}
.logo .word{font-weight:800; letter-spacing:-.025em; color:var(--t-900)}
.logo .sw{display:inline-flex; align-items:center; gap:.34em; background:var(--on); border-radius:999px; padding:.24em .24em .24em .55em}
.logo .sw b{font-size:.82em; font-weight:800; letter-spacing:.02em; color:#fff}
.logo .sw i{width:.9em; height:.9em; border-radius:50%; background:#fff; display:block; box-shadow:0 1px 2px rgba(0,0,0,.14)}
.logo.kucuk{font-size:1.05rem}

/* ---------- Düğmeler ----------
   Basış anında küçülür (site.js .pressed), bırakınca yayla döner. */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.45em;
  padding:.85rem 1.35rem; border-radius:999px; text-decoration:none;
  font-weight:700; font-size:.94rem; line-height:1; white-space:nowrap;
  border:1.5px solid transparent;
  transition:transform .28s var(--yay), background-color .18s, border-color .18s, box-shadow .18s;
}
.btn svg{width:1em; height:1em}
.btn.sm{padding:.66rem 1.05rem; font-size:.86rem}
.btn.tam{width:100%}
.btn.koyu{background:var(--t-900); color:#fff}
.btn.koyu:hover{background:var(--t-700)}
.btn.yesil{background:var(--on); color:#fff; box-shadow:0 8px 20px -10px rgba(20,160,139,.7)}
.btn.yesil:hover{background:var(--on-koyu)}
.btn.acik{background:var(--card); color:var(--t-900); border-color:var(--line)}
.btn.acik:hover{border-color:var(--t-200); background:var(--t-25)}
.btn.acik-koyu{background:transparent; color:#fff; border-color:rgba(255,255,255,.28)}
.btn.acik-koyu:hover{background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.5)}
.btn.pressed{transform:scale(.965); transition-duration:.08s}
.btn:focus-visible{outline:none; box-shadow:0 0 0 4px var(--t-100)}
@media (prefers-reduced-motion:reduce){ .btn{transition:none} .btn.pressed{transform:none; opacity:.85} }

/* ---------- Başlık çubuğu ---------- */
.ust{
  position:sticky; top:0; z-index:50;
  background:rgba(244,241,239,.86);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .2s, box-shadow .2s;
}
.ust.kaydi{border-bottom-color:var(--line-soft); box-shadow:0 8px 24px -20px rgba(5,55,60,.3)}
.kayiyor .ust{-webkit-backdrop-filter:none; backdrop-filter:none; background:rgba(244,241,239,.97)}
.ust-ic{display:flex; align-items:center; gap:1rem; height:4.1rem}
.ust-nav{display:none; gap:.25rem; margin-left:1.25rem}
.ust-nav a{
  text-decoration:none; font-weight:600; font-size:.88rem; color:var(--ink-2);
  padding:.5rem .8rem; border-radius:999px; transition:background-color .15s, color .15s;
}
.ust-nav a:hover{background:var(--t-25); color:var(--t-900)}
.ust-ic .btn{margin-left:auto}
@media (min-width:52rem){ .ust-nav{display:flex} }

/* Yapışkan çubuk bölüm başlıklarını örtmesin */
section[id]{scroll-margin-top:4.6rem}

/* ---------- Ortak metin ---------- */
.eyebrow{
  font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--t-500); margin-bottom:.9rem;
}
.eyebrow.seftali{color:var(--p-500)}
.bolum{padding:4.5rem 0}
@media (min-width:60rem){ .bolum{padding:6.5rem 0} }
.bolum-bas{max-width:38rem; margin:0 auto 2.75rem; text-align:center}
.bolum-bas.sol{margin:0; text-align:left}
.bolum-bas h2{font-size:clamp(1.75rem, 1.2rem + 2.2vw, 2.6rem); margin-bottom:.9rem}
.bolum-bas .alt{font-size:1.02rem; line-height:1.65; color:var(--muted); font-weight:500}
.bolum-bas .alt a{color:var(--t-500); font-weight:700; text-decoration:none}
.bolum-bas .alt a:hover{text-decoration:underline}

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{
  position:relative; overflow:hidden;
  padding:3.5rem 0 4rem;
  background:
    radial-gradient(60% 50% at 85% 10%, rgba(15,105,115,.10), transparent 70%),
    radial-gradient(40% 40% at 8% 90%, rgba(245,160,140,.16), transparent 70%),
    var(--bg);
}
@media (min-width:60rem){ .hero{padding:5.5rem 0 6rem} }
.hero-ic{display:grid; gap:3rem; align-items:center}
@media (min-width:60rem){ .hero-ic{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:4rem} }

.hero h1{font-size:clamp(2.1rem, 1.3rem + 3.4vw, 3.5rem); letter-spacing:-.045em; max-width:15ch; color:var(--t-900)}
.hero .giris-yazi{margin:1.4rem 0 2rem; font-size:1.08rem; line-height:1.65; color:var(--ink-2); font-weight:500; max-width:36rem}
.hero .giris-yazi b{color:var(--t-900)}
.hero-btn{display:flex; flex-wrap:wrap; gap:.7rem}
.hero-kanit{display:flex; flex-wrap:wrap; gap:.4rem 1.4rem; margin-top:2rem}
.hero-kanit li{display:flex; align-items:center; gap:.5rem; font-size:.84rem; font-weight:600; color:var(--muted)}
.hero-kanit li::before{content:""; width:.42rem; height:.42rem; border-radius:50%; background:var(--on); flex:0 0 auto}

/* ---------- Telefon: rapor sayfasının küçültülmüşü ---------- */
.hero-gorsel{position:relative; max-width:24rem; margin:0 auto; padding:2.4rem 0 2.2rem}
@media (min-width:60rem){ .hero-gorsel{max-width:none; padding:3rem 2.5rem 2.6rem 1rem} }
.telefon{
  position:relative; z-index:1;
  background:var(--card); border-radius:1.6rem; padding:1.15rem 1.1rem 1rem;
  box-shadow:var(--golge-buyuk); border:1px solid var(--line-soft);
  font-size:.82rem;
}
.tel-ust{display:flex; align-items:center; gap:.7rem; margin-bottom:.9rem}
.tel-marka{width:2.3rem; height:2.3rem; border-radius:.75rem; background:var(--t-50); color:var(--t-500); font-weight:800; display:grid; place-items:center; font-size:.85rem}
.tel-ad{display:flex; flex-direction:column; min-width:0; flex:1}
.tel-ad b{font-size:.95rem; letter-spacing:-.02em}
.tel-ad small{color:var(--muted); font-weight:500; font-size:.72rem}
.tel-pill{font-size:.6rem; font-weight:800; letter-spacing:.06em; padding:.3rem .55rem; border-radius:999px; background:var(--good-bg); color:var(--good)}

.tel-not{background:var(--t-900); color:#fff; border-radius:1rem; padding:.9rem .95rem; margin-bottom:.8rem}
.tel-not-kim{display:flex; align-items:center; gap:.5rem; margin-bottom:.5rem; font-size:.68rem; font-weight:600; color:rgba(255,255,255,.7)}
.tel-not-kim i{width:1.4rem; height:1.4rem; border-radius:50%; background:var(--p-500); color:var(--t-900); font-style:normal; font-weight:800; font-size:.58rem; display:grid; place-items:center}
.tel-not p{font-size:.8rem; line-height:1.5; font-weight:500}

.tel-grid{display:grid; grid-template-columns:1fr 1fr; gap:.55rem; margin-bottom:.8rem}
.tk{background:var(--card-2); border:1px solid var(--line-soft); border-radius:.9rem; padding:.7rem .75rem; display:flex; flex-direction:column; gap:.25rem}
.tk small{font-size:.66rem; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.03em}
.tk b{font-size:1.25rem; letter-spacing:-.04em; font-weight:800; color:var(--t-900); line-height:1.05}
.tk.vurgu{background:var(--p-50); border-color:var(--p-100)}
.tk.vurgu b{color:var(--p-600)}
.chip{display:inline-flex; align-items:center; gap:.15rem; align-self:flex-start; font-size:.64rem; font-weight:800; padding:.2rem .45rem; border-radius:999px}
.chip svg{width:.7rem; height:.7rem; fill:none; stroke:currentColor; stroke-width:3; stroke-linecap:round; stroke-linejoin:round}
.chip.iyi{background:var(--good-bg); color:var(--good)}

.tel-akis{display:flex; align-items:center; gap:.7rem; padding:.8rem .85rem; border:1px solid var(--line-soft); border-radius:.9rem; margin-bottom:.9rem; flex-wrap:wrap}
.ak{display:flex; flex-direction:column; line-height:1}
.ak small{font-size:.58rem; text-transform:uppercase; letter-spacing:.05em; font-weight:700; color:var(--muted-2); margin-bottom:.25rem}
.ak b{font-size:1rem; color:var(--muted-2); font-weight:600; letter-spacing:-.03em}
.ak.buay b{font-size:1.35rem; color:var(--t-500); font-weight:800}
.tel-akis > svg{width:.9rem; height:.9rem; color:var(--t-200)}
.ak-etiket{margin-left:auto; font-size:.66rem; font-weight:700; color:var(--t-500); background:var(--t-50); padding:.3rem .55rem; border-radius:999px}

.tel-tab{display:flex; gap:.25rem; background:var(--card-2); border-radius:999px; padding:.3rem}
.tel-tab span{flex:1; text-align:center; font-size:.66rem; font-weight:700; color:var(--muted); padding:.45rem 0; border-radius:999px}
.tel-tab span.on{background:var(--t-900); color:#fff}

/* Yüzen bildirimler */
.yuzen{
  position:absolute; z-index:2;
  display:flex; align-items:center; gap:.6rem;
  background:var(--card); border:1px solid var(--line-soft); border-radius:1rem;
  padding:.7rem .9rem; box-shadow:var(--golge);
  font-size:.74rem; line-height:1.2;
}
.yuzen b{display:block; font-size:.78rem; color:var(--t-900)}
.yuzen small{color:var(--muted); font-weight:500; font-size:.68rem}
.yuzen svg{width:1.1rem; height:1.1rem; color:var(--on); flex:0 0 auto}
.y-nokta{width:.6rem; height:.6rem; border-radius:50%; background:var(--p-500); flex:0 0 auto; box-shadow:0 0 0 4px var(--p-100)}
.y1{top:0; right:-.4rem}
.y2{bottom:0; left:-.4rem}
@media (min-width:60rem){ .y1{top:.4rem; right:0} .y2{bottom:.4rem; left:-.5rem} }
@media (prefers-reduced-motion:no-preference){
  .y1{animation:suzul 7s ease-in-out infinite}
  .y2{animation:suzul 8s ease-in-out infinite reverse}
  @keyframes suzul{0%,100%{transform:translateY(0)} 50%{transform:translateY(-.4rem)}}
}

/* ==========================================================================
   KARTLAR
   ========================================================================== */
.kartlar{display:grid; gap:1rem}
@media (min-width:44rem){ .kartlar.uc{grid-template-columns:repeat(2,1fr)} }
@media (min-width:64rem){ .kartlar.uc{grid-template-columns:repeat(3,1fr); gap:1.25rem} }
.kart{
  background:var(--card); border:1px solid var(--line-soft); border-radius:1.25rem;
  padding:1.5rem 1.5rem 1.6rem;
  transition:transform .35s var(--yay), box-shadow .35s;
}
.kart:hover{transform:translateY(-3px); box-shadow:var(--golge)}
.kart .ikon{width:2.6rem; height:2.6rem; border-radius:.85rem; background:var(--t-50); color:var(--t-500); display:grid; place-items:center; margin-bottom:1.1rem}
.kart .ikon svg{width:1.3rem; height:1.3rem}
.kart h3{font-size:1.08rem; margin-bottom:.5rem; letter-spacing:-.025em}
.kart p{color:var(--muted); font-weight:500; line-height:1.6; font-size:.92rem}

/* ==========================================================================
   AJANSLAR — koyu bant
   ========================================================================== */
.koyu-band{
  position:relative; color:#fff; overflow:hidden;
  background:
    radial-gradient(90% 70% at 100% 0%, #10606b 0%, transparent 55%),
    radial-gradient(70% 60% at -10% 100%, #0a4a52 0%, transparent 60%),
    var(--t-900);
}
.koyu-band::after{
  content:""; position:absolute; right:-8rem; top:-8rem;
  width:26rem; height:26rem; border-radius:50%;
  background:radial-gradient(circle, rgba(245,160,140,.16), transparent 68%); pointer-events:none;
}
.koyu-band > *{position:relative; z-index:1}
.ajans-ic{display:grid; gap:3rem; align-items:center}
@media (min-width:60rem){ .ajans-ic{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:4.5rem} }
.ajans-yazi h2{font-size:clamp(1.75rem, 1.2rem + 2.2vw, 2.5rem); margin-bottom:.9rem; max-width:18ch}
.ajans-yazi .alt{font-size:1rem; line-height:1.65; color:rgba(255,255,255,.7); font-weight:500; max-width:34rem; margin-bottom:2rem}
.madde{display:flex; flex-direction:column; gap:1.05rem}
.madde li{position:relative; padding-left:1.7rem; font-size:.94rem; line-height:1.6; color:rgba(255,255,255,.72); font-weight:500}
.madde li b{display:block; color:#fff; font-weight:700; margin-bottom:.1rem}
.madde li::before{
  content:""; position:absolute; left:0; top:.5rem;
  width:.7rem; height:.7rem; border-radius:50%;
  background:var(--on); box-shadow:0 0 0 4px rgba(20,160,139,.22);
}

/* ---------- Editör kartı ---------- */
.editor{
  background:var(--card); color:var(--ink); border-radius:1.25rem;
  box-shadow:var(--golge-buyuk); overflow:hidden; font-size:.8rem;
}
.ed-bas{display:flex; align-items:center; gap:.6rem; padding:.95rem 1.1rem; border-bottom:1px solid var(--line-soft)}
.ed-ik{width:1.7rem; height:1.7rem; border-radius:.55rem; background:var(--p-100); color:var(--p-600); display:grid; place-items:center}
.ed-ik svg{width:1rem; height:1rem}
.ed-bas b{font-size:.95rem}
.ed-say{margin-left:auto; color:var(--muted); font-weight:600; font-size:.74rem}
.ed-kolon, .ed-satir{
  display:grid; grid-template-columns:1.4fr .8fr .9fr .75fr 4.5rem;
  gap:.6rem; align-items:center; padding:.6rem 1.1rem;
}
.ed-kolon{font-size:.6rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--muted-2); background:var(--card-2); border-bottom:1px solid var(--line-soft)}
.ed-kolon span:not(:first-child){text-align:right}
.ed-satir + .ed-satir{border-top:1px solid var(--line-soft)}
.ed-l{font-weight:700; color:var(--ink)}
.ed-p{text-align:right; color:var(--muted); font-weight:600; background:var(--card-2); border:1.5px dashed var(--line); border-radius:.5rem; padding:.45rem .55rem; font-variant-numeric:tabular-nums}
.ed-c{text-align:right; font-weight:800; color:var(--ink); border:1.5px solid var(--line); border-radius:.5rem; padding:.45rem .55rem; background:var(--card); font-variant-numeric:tabular-nums; min-height:2rem}
.ed-c.yaziyor{border-color:var(--t-500); box-shadow:0 0 0 3px var(--t-50)}
.ed-c.yaziyor i{display:inline-block; width:1.5px; height:.9em; background:var(--t-500); vertical-align:-.12em; margin-left:.05em}
@media (prefers-reduced-motion:no-preference){
  .ed-c.yaziyor i{animation:imlec 1.1s steps(2) infinite}
  @keyframes imlec{to{opacity:0}}
}
.ed-c.bos{background:var(--card-2)}
.ed-chip{justify-self:end; font-size:.66rem; font-weight:800; padding:.25rem .5rem; border-radius:999px}
.ed-chip.iyi{background:var(--good-bg); color:var(--good)}
.ed-chip.notr{background:var(--card-2); color:var(--muted-2)}
.ed-spark{width:4.5rem; height:1.75rem; justify-self:end; overflow:visible}
.ed-spark polyline{fill:none; stroke:var(--t-400); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.ed-spark .alan{fill:var(--t-50)}
.ed-spark circle{fill:var(--t-500)}
.ed-spark.soluk{opacity:.3}
.ed-alt{display:flex; align-items:center; gap:.8rem; padding:.85rem 1.1rem; border-top:1px solid var(--line-soft); background:var(--card-2); flex-wrap:wrap}
.ed-durum{font-weight:600; color:var(--muted); font-size:.78rem}
.ed-durum b{color:var(--ink)}
.ed-kirli{display:inline-flex; align-items:center; gap:.4rem; font-size:.7rem; font-weight:700; color:var(--warn); background:var(--warn-bg); padding:.28rem .6rem; border-radius:999px}
.ed-kirli::before{content:""; width:.4rem; height:.4rem; border-radius:50%; background:currentColor}
.ed-btn{margin-left:auto; background:var(--t-900); color:#fff; font-weight:700; font-size:.76rem; padding:.55rem .9rem; border-radius:999px}
@media (max-width:30rem){
  .ed-kolon, .ed-satir{grid-template-columns:1.2fr .8fr .9fr .7fr}
  .ed-spark, .ed-kolon span:last-child{display:none}
}

/* ---------- Adımlar ---------- */
.adimlar{display:grid; gap:1rem; margin-top:3.5rem; padding-top:2.5rem; border-top:1px solid rgba(255,255,255,.12)}
@media (min-width:44rem){ .adimlar{grid-template-columns:repeat(3,1fr); gap:2rem} }
.adim{display:grid; grid-template-columns:auto 1fr; gap:.25rem .9rem; align-items:baseline}
.adim .no{grid-row:1 / 3; width:2rem; height:2rem; border-radius:50%; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); display:grid; place-items:center; font-weight:800; font-size:.82rem; align-self:start}
.adim b{font-size:1rem}
.adim p{color:rgba(255,255,255,.66); font-weight:500; font-size:.9rem; line-height:1.55}

/* ==========================================================================
   FİYATLAR
   ========================================================================== */
.paketler{display:grid; gap:1.1rem; align-items:stretch}
@media (min-width:60rem){ .paketler{grid-template-columns:repeat(3,1fr); gap:1.25rem} }
.paket{
  position:relative; display:flex; flex-direction:column;
  background:var(--card); border:1px solid var(--line-soft); border-radius:1.4rem;
  padding:1.8rem 1.6rem 1.6rem;
  transition:transform .35s var(--yay), box-shadow .35s;
}
.paket:hover{transform:translateY(-3px); box-shadow:var(--golge)}
.paket.one{background:var(--t-900); color:#fff; border-color:var(--t-900); box-shadow:var(--golge-buyuk)}
@media (min-width:60rem){ .paket.one{transform:translateY(-.6rem)} .paket.one:hover{transform:translateY(-.85rem)} }
.rozet{
  position:absolute; top:-.8rem; left:1.6rem;
  background:var(--on); color:#fff; font-size:.66rem; font-weight:800; letter-spacing:.05em;
  padding:.38rem .75rem; border-radius:999px; box-shadow:0 6px 16px -8px rgba(20,160,139,.8);
}
.p-ad{font-size:1.3rem; font-weight:800; letter-spacing:-.03em}
.p-kime{font-size:.86rem; line-height:1.5; color:var(--muted); font-weight:500; margin:.35rem 0 1.4rem; min-height:2.6rem}
.paket.one .p-kime{color:rgba(255,255,255,.66)}
.p-fiyat{display:flex; align-items:baseline; gap:.4rem; line-height:1}
.p-fiyat b{font-size:2.6rem; font-weight:800; letter-spacing:-.05em; color:var(--t-900); font-variant-numeric:tabular-nums}
.p-fiyat b.ozel{font-size:1.9rem}
.p-fiyat span{font-size:.92rem; font-weight:600; color:var(--muted)}
.paket.one .p-fiyat b{color:#fff}
.paket.one .p-fiyat span{color:rgba(255,255,255,.66)}
.p-kapsam{
  display:inline-block; align-self:flex-start; margin:.9rem 0 1.4rem;
  font-size:.76rem; font-weight:800; letter-spacing:.03em;
  padding:.35rem .7rem; border-radius:999px; background:var(--t-50); color:var(--t-500);
}
.paket.one .p-kapsam{background:rgba(255,255,255,.12); color:#fff}
.p-liste{display:flex; flex-direction:column; gap:.6rem; margin-bottom:1.6rem; flex:1}
.p-liste li{display:flex; gap:.6rem; align-items:flex-start; font-size:.9rem; line-height:1.5; font-weight:500; color:var(--ink-2)}
.p-liste svg{width:1rem; height:1rem; color:var(--on); flex:0 0 auto; margin-top:.2rem}
.paket.one .p-liste li{color:rgba(255,255,255,.82)}
.paket.one .p-liste svg{color:var(--p-500)}
.paket.one .btn.yesil{box-shadow:none}
.p-dip{margin-top:1.5rem; text-align:center; font-size:.82rem; color:var(--muted); font-weight:500}

/* ==========================================================================
   SSS
   ========================================================================== */
.sss{background:var(--card); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft)}
.sss-ic{display:grid; gap:2.5rem}
@media (min-width:60rem){ .sss-ic{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:5rem; align-items:start} }
.sss-liste{display:flex; flex-direction:column}
.sss-madde{border-top:1px solid var(--line-soft)}
.sss-madde:last-child{border-bottom:1px solid var(--line-soft)}
.sss-madde summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; gap:1rem;
  padding:1.1rem 0; font-weight:700; font-size:1rem; letter-spacing:-.01em;
}
.sss-madde summary::-webkit-details-marker{display:none}
.sss-madde summary span{flex:1}
.sss-madde summary svg{width:1.15rem; height:1.15rem; color:var(--t-400); flex:0 0 auto; transition:transform .3s var(--yay)}
.sss-madde[open] summary svg{transform:rotate(180deg)}
.sss-madde summary:hover{color:var(--t-700)}
.sss-madde summary:focus-visible{outline:none; box-shadow:inset 0 0 0 2px var(--t-200); border-radius:.5rem}
.sss-madde p{padding:0 2.2rem 1.25rem 0; color:var(--muted); font-weight:500; line-height:1.65; font-size:.94rem; max-width:52rem}

/* ==========================================================================
   KAPANIŞ + ALT
   ========================================================================== */
.kapanis{padding:4.5rem 0; background:var(--t-900); color:#fff}
@media (min-width:60rem){ .kapanis{padding:6rem 0} }
.kapanis-ic{text-align:center; max-width:40rem}
.kapanis h2{font-size:clamp(1.75rem, 1.2rem + 2.2vw, 2.5rem); margin-bottom:.6rem}
.kapanis p{color:rgba(255,255,255,.7); font-weight:500; font-size:1.02rem; margin-bottom:1.75rem}
.kapanis .hero-btn{justify-content:center}

.alt{padding:2rem 0}
.alt-ic{display:flex; align-items:center; gap:1rem 1.5rem; flex-wrap:wrap}
.alt-nav{display:flex; gap:.25rem 1.2rem; flex-wrap:wrap}
.alt-nav a{text-decoration:none; font-size:.84rem; font-weight:600; color:var(--muted)}
.alt-nav a:hover{color:var(--t-900)}
.telif{margin-left:auto; font-size:.8rem; color:var(--muted-2); font-weight:500}

/* ==========================================================================
   Görünme animasyonu — site.js .beliren sınıfını ekler; JS yoksa
   her şey zaten görünür.
   ========================================================================== */
@media (prefers-reduced-motion:no-preference){
  .js .belir{opacity:0; transform:translateY(.7rem); transition:opacity .6s var(--yay), transform .7s var(--yay)}
  .js .belir.beliren{opacity:1; transform:none}
}


/* ---------- Sayılar şeridi (hero altı) ---------- */
.sayilar{padding:0 0 1rem; position:relative; z-index:3}
.sayilar-ic{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:.75rem; margin-top:-1.25rem}
.sayi{background:var(--card); border-radius:1.15rem; padding:1.15rem 1.2rem; box-shadow:0 10px 30px -18px rgba(5,55,60,.25), 0 0 0 1px var(--line-soft)}
.sayi b{display:block; font-size:2rem; font-weight:800; letter-spacing:-.045em; line-height:1; color:var(--t-900)}
.sayi b span{font-size:1.05rem; font-weight:800; color:var(--on); margin-left:.15rem; letter-spacing:-.02em}
.sayi small{display:block; margin-top:.45rem; font-size:.8rem; font-weight:600; color:var(--muted); line-height:1.4}
@media (min-width:52rem){
  .sayilar-ic{grid-template-columns:repeat(4, minmax(0,1fr)); gap:1rem; margin-top:-2.25rem}
  .sayi{padding:1.35rem 1.4rem}
  .sayi b{font-size:2.4rem}
}