/* =====================================================================
   ParkEt — ortak tasarım sistemi (tüm sayfalar bu dosyayı kullanır)
   Açık tema: beyaz zemin, yeşil marka rengi, sade ve kurumsal.
   Kontrastlar (beyaz zemin): metin 17.8:1 · ikincil 7.3:1 · soluk 5.4:1
   · primary #15803D 5.0:1 (beyaz yazı da 5.0:1).
   Uygulamanın parlak yeşili #2ECC71 beyazda okunmaz (2.1:1) →
   yalnızca süs/ikon zemini olarak kullanılır, metin olarak asla.
   ===================================================================== */

/* ---------- 1) PRIMITIVE TOKENLAR ---------- */
:root{
  --white:#ffffff;
  --green-50:#f0faf3;
  --green-100:#e3f5e9;
  --green-200:#c6ebd3;
  --green-400:#2ecc71;   /* app primary — yalnız süs */
  --green-600:#15803d;   /* ana etkileşim rengi */
  --green-700:#116633;
  --green-800:#14532d;
  --green-900:#0d2f1b;

  --gray-25:#fafbfa;
  --gray-50:#f5f8f6;
  --gray-100:#eef2ef;
  --gray-200:#e2e8e4;
  --gray-300:#cdd6d0;
  --gray-500:#5f6e64;
  --gray-700:#3b4a40;
  --gray-900:#0f1a13;

  --amber-50:#fff8e1;
  --amber-700:#8a6d1a;
  --red-600:#c62828;

  /* ---------- 2) SEMANTİK TOKENLAR ---------- */
  --bg:var(--white);
  --bg-subtle:var(--gray-50);
  --surface:var(--white);
  --surface-2:var(--gray-50);
  --border:var(--gray-200);
  --border-strong:var(--gray-300);
  --text:var(--gray-900);
  --text-muted:var(--gray-700);
  --text-subtle:var(--gray-500);
  --primary:var(--green-600);
  --primary-hover:var(--green-700);
  --primary-soft:var(--green-50);
  --primary-tint:var(--green-100);
  --on-primary:var(--white);
  --brand-bright:var(--green-400);
  --gold:var(--amber-700);
  --gold-soft:var(--amber-50);
  --danger:var(--red-600);
  --focus:var(--green-600);

  --shadow-xs:0 1px 2px rgba(15,26,19,.06);
  --shadow-sm:0 1px 3px rgba(15,26,19,.08), 0 1px 2px rgba(15,26,19,.04);
  --shadow-md:0 8px 24px -6px rgba(15,26,19,.10), 0 2px 6px rgba(15,26,19,.04);
  --shadow-lg:0 24px 48px -12px rgba(15,26,19,.18);

  /* ---------- 3) TİPOGRAFİ ---------- */
  --font:"Plus Jakarta Sans", "Segoe UI", system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, Consolas, monospace;

  --fs-xs:12px;
  --fs-sm:14px;
  --fs-base:16px;
  --fs-md:18px;
  --fs-lg:20px;
  --fs-xl:24px;
  --fs-2xl:clamp(26px, 3.4vw, 30px);
  --fs-3xl:clamp(30px, 4.4vw, 40px);
  --fs-display:clamp(38px, 6.2vw, 60px);

  --lh-tight:1.1;
  --lh-snug:1.3;
  --lh-body:1.65;

  /* ---------- 4) BOŞLUK (4px taban) ---------- */
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --space-7:48px;
  --space-8:64px;
  --space-9:96px;

  /* ---------- 5) KÖŞE / HAREKET / YERLEŞİM ---------- */
  --r-sm:8px;
  --r-md:12px;
  --r-lg:16px;
  --r-xl:24px;
  --r-pill:999px;

  --dur-fast:150ms;
  --dur:220ms;
  --ease:cubic-bezier(.2,.7,.2,1);

  --container:1160px;
  --nav-h:68px;

  color-scheme:light;
}

/* ---------- TABAN ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--nav-h) + var(--space-4)); -webkit-text-size-adjust:100%; }
body{
  margin:0; min-height:100vh; display:flex; flex-direction:column;
  background:var(--bg); color:var(--text);
  font-family:var(--font); font-size:var(--fs-base); line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
main{ flex:1; }
img{ display:block; max-width:100%; }
a{ color:inherit; }
h1,h2,h3,h4{ font-family:var(--font); line-height:var(--lh-snug); letter-spacing:-.02em; margin:0; color:var(--text); }
:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; border-radius:6px; }
::selection{ background:var(--green-200); color:var(--text); }

.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--space-5); }
@media (max-width:520px){ .container{ padding-inline:var(--space-4); } }

.accent{ color:var(--primary); }

/* ---------- ÜST MENÜ ---------- */
.site-nav{
  position:sticky; top:0; z-index:50; height:var(--nav-h);
  background:rgba(255,255,255,.88);
  backdrop-filter:saturate(180%) blur(12px); -webkit-backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--border);
}
.site-nav .container{ height:100%; display:flex; align-items:center; gap:var(--space-5); }
.brand{
  display:inline-flex; align-items:center; gap:var(--space-3); text-decoration:none;
  font-weight:800; font-size:var(--fs-lg); letter-spacing:-.02em; color:var(--text);
}
.brand img{ width:34px; height:34px; border-radius:10px; }
.nav-links{ display:flex; align-items:center; gap:var(--space-1); margin:0 0 0 auto; padding:0; list-style:none; }
.nav-links a{
  display:inline-flex; align-items:center; min-height:44px; padding:0 var(--space-3);
  border-radius:var(--r-sm); text-decoration:none; font-weight:500; font-size:var(--fs-sm); color:var(--text-muted);
  transition:color var(--dur-fast), background var(--dur-fast);
}
.nav-links a:hover{ color:var(--text); background:var(--gray-100); }
.nav-links a[aria-current="page"]{ color:var(--primary); font-weight:600; }
.nav-cta{ margin-left:var(--space-3); }
.nav-links a.btn{ color:var(--on-primary); padding:0 var(--space-4); font-weight:600; }
.nav-links a.btn:hover{ color:var(--on-primary); background:var(--primary-hover); }

.menu-btn{
  display:none; margin-left:auto; width:44px; height:44px; padding:0; cursor:pointer;
  align-items:center; justify-content:center; border-radius:var(--r-md);
  background:var(--surface); color:var(--text); border:1px solid var(--border);
}
.menu-btn .bars{ width:18px; height:12px; position:relative; }
.menu-btn .bars span{ position:absolute; left:0; width:100%; height:2px; border-radius:2px; background:currentColor; transition:transform var(--dur) var(--ease), opacity var(--dur-fast), top var(--dur) var(--ease); }
.menu-btn .bars span:nth-child(1){ top:0; } .menu-btn .bars span:nth-child(2){ top:5px; } .menu-btn .bars span:nth-child(3){ top:10px; }
.menu-btn[aria-expanded="true"] .bars span:nth-child(1){ top:5px; transform:rotate(45deg); }
.menu-btn[aria-expanded="true"] .bars span:nth-child(2){ opacity:0; }
.menu-btn[aria-expanded="true"] .bars span:nth-child(3){ top:5px; transform:rotate(-45deg); }

@media (max-width:860px){
  .menu-btn{ display:inline-flex; }
  .nav-links{
    position:fixed; left:var(--space-4); right:var(--space-4); top:calc(var(--nav-h) + var(--space-2));
    flex-direction:column; align-items:stretch; gap:var(--space-1); padding:var(--space-2);
    background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg);
    box-shadow:var(--shadow-lg);
    opacity:0; visibility:hidden; transform:translateY(-6px);
    transition:opacity var(--dur) var(--ease), transform var(--dur) var(--ease), visibility 0s linear var(--dur);
  }
  .nav-links.open{ opacity:1; visibility:visible; transform:none; transition:opacity var(--dur) var(--ease), transform var(--dur) var(--ease); }
  .nav-links a{ font-size:var(--fs-base); padding:0 var(--space-4); }
  .nav-cta{ margin:var(--space-2) 0 0; }
  .nav-cta .btn{ width:100%; }
}

/* ---------- BUTONLAR ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2);
  min-height:48px; padding:0 var(--space-5); border-radius:var(--r-md); border:1px solid transparent;
  font:600 var(--fs-base)/1 var(--font); text-decoration:none; cursor:pointer;
  transition:background var(--dur-fast), border-color var(--dur-fast), box-shadow var(--dur), color var(--dur-fast);
}
.btn svg{ width:18px; height:18px; flex:none; }
.btn-sm{ min-height:44px; padding:0 var(--space-4); font-size:var(--fs-sm); }
.btn-primary{ background:var(--primary); color:var(--on-primary); box-shadow:var(--shadow-xs); }
.btn-primary:hover{ background:var(--primary-hover); }
.btn-secondary{ background:var(--surface); color:var(--text); border-color:var(--border-strong); box-shadow:var(--shadow-xs); }
.btn-secondary:hover{ background:var(--gray-50); }
.btn[disabled]{ opacity:.55; cursor:not-allowed; }

/* ---------- MAĞAZA BUTONLARI ---------- */
.stores{ display:flex; flex-wrap:wrap; gap:var(--space-3); }
.store{
  display:inline-flex; align-items:center; gap:var(--space-3); min-height:58px; min-width:200px;
  padding:var(--space-2) var(--space-5) var(--space-2) var(--space-4); border-radius:var(--r-md);
  text-decoration:none; color:var(--text); background:var(--surface); border:1px solid var(--border-strong);
  transition:background var(--dur-fast), border-color var(--dur-fast), box-shadow var(--dur);
}
.store svg{ width:24px; height:24px; flex:none; fill:currentColor; }
.store .lines{ display:flex; flex-direction:column; line-height:1.2; }
.store small{ font-size:var(--fs-xs); color:var(--text-subtle); }
.store strong{ font-size:var(--fs-md); font-weight:700; letter-spacing:-.01em; }
.store.live{ background:var(--gray-900); color:var(--white); border-color:var(--gray-900); box-shadow:var(--shadow-sm); }
.store.live small{ color:rgba(255,255,255,.75); }
.store.live:hover{ background:#000; box-shadow:var(--shadow-md); }
.store.soon{ cursor:default; background:var(--gray-50); }
.store.soon svg, .store.soon strong{ color:var(--text-subtle); }
.store .tag{
  margin-left:auto; padding:2px var(--space-2); border-radius:var(--r-pill);
  font-size:11px; font-weight:600; white-space:nowrap;
  color:var(--primary); background:var(--primary-tint);
}
@media (max-width:520px){ .stores{ flex-direction:column; } .store{ width:100%; } }

/* ---------- ETİKET ---------- */
.pill{
  display:inline-flex; align-items:center; gap:var(--space-2);
  padding:6px var(--space-3); border-radius:var(--r-pill);
  font-size:var(--fs-sm); font-weight:600; color:var(--primary);
  background:var(--primary-soft); border:1px solid var(--green-200);
}
.pill .dot{ width:8px; height:8px; border-radius:50%; background:var(--brand-bright); }

/* ---------- ALT BİLGİ ---------- */
.site-footer{ margin-top:var(--space-9); border-top:1px solid var(--border); background:var(--bg-subtle); }
.footer-grid{
  display:grid; grid-template-columns:1.4fr repeat(3, 1fr); gap:var(--space-6);
  padding-block:var(--space-7) var(--space-6);
}
.footer-grid .tagline{ margin:var(--space-3) 0 0; color:var(--text-subtle); font-size:var(--fs-sm); max-width:32ch; }
.footer-col h3{ font-size:var(--fs-sm); font-weight:700; letter-spacing:0; color:var(--text); margin-bottom:var(--space-3); }
.footer-col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--space-1); }
.footer-col a, .footer-col span{
  display:inline-flex; align-items:center; gap:var(--space-2); min-height:32px;
  font-size:var(--fs-sm); color:var(--text-muted); text-decoration:none; transition:color var(--dur-fast);
}
.footer-col a:hover{ color:var(--primary); }
.footer-col .soon-note{ color:var(--text-subtle); }
.footer-col a[href^="mailto:"]{ word-break:break-all; }
.footer-bottom{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--space-2) var(--space-5);
  padding-block:var(--space-4) var(--space-5); border-top:1px solid var(--border);
  font-size:var(--fs-xs); color:var(--text-subtle);
}
@media (max-width:860px){ .footer-grid{ grid-template-columns:1fr 1fr; } .footer-grid > :first-child{ grid-column:1 / -1; } }
@media (max-width:420px){ .footer-grid{ grid-template-columns:1fr; } }

/* ---------- GİRİŞ ANİMASYONU (sade) ---------- */
.reveal{ opacity:0; transform:translateY(10px); transition:opacity .5s var(--ease), transform .5s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.d1{ transition-delay:.06s; } .d2{ transition-delay:.12s; } .d3{ transition-delay:.18s; }

/* =====================================================================
   HUKUKİ SAYFALAR (privacy / terms / hesap-silme) — body.doc
   ===================================================================== */
.doc{ background:var(--bg-subtle); }
.doc .site-footer{ background:var(--white); }
.doc .page{ width:100%; max-width:800px; margin-inline:auto; padding:var(--space-7) var(--space-5) 0; }
@media (max-width:520px){ .doc .page{ padding:var(--space-5) var(--space-4) 0; } }
.doc header.hero{
  background:var(--surface); border:1px solid var(--border); border-top:4px solid var(--primary);
  border-radius:var(--r-lg); box-shadow:var(--shadow-sm);
  padding:var(--space-6); margin-bottom:var(--space-4);
}
.doc .eyebrow{
  display:flex; align-items:center; gap:var(--space-2); margin-bottom:var(--space-3);
  font-size:var(--fs-sm); font-weight:600; color:var(--primary);
}
.doc .eyebrow .dot{ width:8px; height:8px; border-radius:50%; background:var(--brand-bright); flex:none; }
.doc h1{ font-size:var(--fs-3xl); font-weight:800; line-height:var(--lh-tight); letter-spacing:-.03em; text-wrap:balance; margin:0 0 var(--space-3); }
.doc .lede{ color:var(--text-muted); font-size:var(--fs-md); max-width:62ch; margin:0 0 var(--space-5); }
.doc .lede:last-child{ margin-bottom:0; }
.doc .meta-row{ display:flex; flex-wrap:wrap; gap:var(--space-2); }
.doc .meta-row .pill{ font-size:var(--fs-xs); font-weight:500; color:var(--text-muted); background:var(--gray-50); border-color:var(--border); }
.doc .meta-row .pill b{ color:var(--text); font-weight:600; }

.doc nav.toc{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg);
  padding:var(--space-5); margin-bottom:var(--space-4); box-shadow:var(--shadow-xs);
}
.doc .toc-title{ font-size:var(--fs-sm); font-weight:700; color:var(--text); margin-bottom:var(--space-3); }
.doc nav.toc ol{ columns:2; column-gap:var(--space-5); margin:0; padding:0; list-style:none; }
.doc nav.toc li{ break-inside:avoid; }
.doc nav.toc a{
  display:flex; gap:var(--space-2); padding:6px var(--space-2); margin-inline:calc(var(--space-2) * -1);
  border-radius:var(--r-sm); color:var(--text-muted); text-decoration:none; font-size:var(--fs-sm); font-weight:500;
  transition:color var(--dur-fast), background var(--dur-fast);
}
.doc nav.toc a:hover{ color:var(--primary); background:var(--primary-soft); }
.doc .tocnum{ color:var(--primary); font-family:var(--font-mono); font-size:var(--fs-xs); padding-top:3px; flex:none; }
@media (max-width:560px){ .doc nav.toc ol{ columns:1; } }

.doc section.card{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg);
  padding:var(--space-6); margin-bottom:var(--space-4); box-shadow:var(--shadow-xs);
}
@media (max-width:520px){ .doc section.card, .doc header.hero{ padding:var(--space-5); } }
.doc section.card h2{
  display:flex; align-items:baseline; flex-wrap:wrap; gap:var(--space-3);
  font-size:var(--fs-xl); font-weight:700; margin:0 0 var(--space-4);
}
.doc section.card h2 .num{ color:var(--primary); font-family:var(--font-mono); font-size:var(--fs-sm); font-weight:500; }
.doc section.card h3{ font-size:var(--fs-md); font-weight:700; margin:var(--space-5) 0 var(--space-2); }
.doc section.card p, .doc section.card ul{ margin:0 0 var(--space-3); color:var(--text-muted); }
.doc section.card p:last-child, .doc section.card ul:last-child{ margin-bottom:0; }
.doc section.card ul{ padding-left:var(--space-5); }
.doc section.card li{ margin-bottom:var(--space-2); }
.doc section.card li::marker{ color:var(--primary); }
.doc section.card strong, .doc section.card b{ color:var(--text); font-weight:600; }
.doc section.card a:not(.btn){ color:var(--primary); font-weight:500; text-underline-offset:3px; }

.doc .note{
  margin:var(--space-4) 0; padding:var(--space-3) var(--space-4); border-radius:var(--r-md);
  background:var(--primary-soft); border:1px solid var(--green-200); border-left:3px solid var(--primary);
  font-size:var(--fs-sm); color:var(--text);
}
.doc .note.warn{ background:var(--gold-soft); border-color:#f1e2b0; border-left-color:var(--gold); }

.doc .table-wrap{ overflow-x:auto; margin:var(--space-4) 0; border:1px solid var(--border); border-radius:var(--r-md); }
.doc table{ width:100%; min-width:560px; border-collapse:collapse; font-size:var(--fs-sm); }
.doc th, .doc td{ text-align:left; vertical-align:top; padding:var(--space-3); border-bottom:1px solid var(--border); color:var(--text-muted); }
.doc th{ background:var(--gray-50); color:var(--text); font-size:var(--fs-xs); font-weight:700; }
.doc tbody tr:last-child td{ border-bottom:none; }
.doc td.cat{ color:var(--text); font-weight:600; white-space:nowrap; }
.doc .mono{ font-family:var(--font-mono); font-size:.9em; }
.doc code.mono{ background:var(--gray-100); border:1px solid var(--border); border-radius:6px; padding:1px 6px; color:var(--text); }
.doc .badge{
  display:inline-block; padding:2px var(--space-2); border-radius:var(--r-pill);
  font-size:11px; font-weight:600; letter-spacing:0;
  background:var(--gray-100); border:1px solid var(--border); color:var(--text-muted);
}
.doc .badge.plus{ background:var(--gold-soft); color:var(--gold); border-color:#f1e2b0; }
.doc .doc-foot{ text-align:center; color:var(--text-subtle); font-size:var(--fs-sm); margin:var(--space-6) 0 0; }
.doc .doc-foot a{ color:var(--primary); }

/* =====================================================================
   KİMLİK DOĞRULAMA SAYFALARI (confirm / reset) — body.auth
   ===================================================================== */
.auth{ background:var(--bg-subtle); }
.auth .site-footer{ background:var(--white); margin-top:0; }
.auth main{ display:flex; align-items:center; justify-content:center; padding:var(--space-8) var(--space-4); }
.auth-card{
  width:100%; max-width:420px; text-align:center;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-xl);
  padding:var(--space-7) var(--space-6); box-shadow:var(--shadow-md);
}
@media (max-width:420px){ .auth-card{ padding:var(--space-6) var(--space-5); } }
.auth-icon{
  width:60px; height:60px; margin:0 auto var(--space-5); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:var(--primary); background:var(--primary-tint);
}
.auth-icon svg{ width:28px; height:28px; }
.auth-icon.warn{ color:var(--gold); background:var(--gold-soft); }
.auth-card h1{ font-size:var(--fs-2xl); font-weight:800; letter-spacing:-.03em; margin-bottom:var(--space-2); }
.auth-card .sub{ color:var(--text-muted); margin:0 0 var(--space-5); }
.auth-card .sub:last-child{ margin-bottom:0; }
.auth-card .btn{ width:100%; }
.field{ text-align:left; margin-bottom:var(--space-4); }
.field label{ display:block; margin-bottom:var(--space-2); font-size:var(--fs-sm); font-weight:600; color:var(--text); }
.field input{
  width:100%; min-height:48px; padding:0 var(--space-4); border-radius:var(--r-md);
  background:var(--surface); color:var(--text); border:1px solid var(--border-strong);
  font:var(--fs-base) var(--font); transition:border-color var(--dur-fast), box-shadow var(--dur-fast);
}
.field input:focus{ outline:none; border-color:var(--primary); box-shadow:0 0 0 3px var(--green-200); }
.field .hint{ display:block; margin-top:var(--space-2); font-size:var(--fs-xs); color:var(--text-subtle); }
.form-error{ min-height:20px; margin:0 0 var(--space-3); text-align:left; font-size:var(--fs-sm); color:var(--danger); }
.spinner{
  width:40px; height:40px; margin:0 auto var(--space-4); border-radius:50%;
  border:3px solid var(--gray-200); border-top-color:var(--primary); animation:spin .8s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }
.hidden{ display:none!important; }

/* ---------- AZALTILMIŞ HAREKET ---------- */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ transition-duration:.01ms!important; }
  .reveal{ opacity:1; transform:none; }
}