/* ==========================================================================
   tokens.css - Brother Hustle tasarim tokenleri
   Tek vurgu rengi: vermilion. Tek sekil sistemi. Tek tipografi ailesi seti.
   Tum kontrast oranlari WCAG AA icin olculdu, degerler yorumlarda.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Fontlar - self-host, latin + latin-ext (Turkce icin latin-ext zorunlu:
   g U+011F, s U+015F, I U+0130 latin subsetinde yok)
   -------------------------------------------------------------------------- */

@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 400 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("../fonts/archivo-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7,
    U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F,
    U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
    U+A720-A7FF;
}

@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 400 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("../fonts/archivo-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
    U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
    U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/geist-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7,
    U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F,
    U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
    U+A720-A7FF;
}

@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/geist-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
    U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
    U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Geist Mono";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/geist-mono-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7,
    U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F,
    U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
    U+A720-A7FF;
}

@font-face {
  font-family: "Geist Mono";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/geist-mono-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
    U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
    U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --------------------------------------------------------------------------
   Tokenlar - light (kagit) varsayilan
   -------------------------------------------------------------------------- */

:root {
  color-scheme: light;

  /* Zemin */
  --bh-paper: #f3f2ef;
  --bh-surface: #eae8e3;

  /* Murekkep - alfa kademeleri olculdu, kontrast paper uzerinde */
  --bh-ink-rgb: 16 16 16;
  --bh-ink: rgb(var(--bh-ink-rgb));              /* 17.00:1 */
  --bh-ink-muted: rgb(var(--bh-ink-rgb) / 0.62); /*  5.02:1 - govde ikincil, etiket */
  --bh-ink-soft: rgb(var(--bh-ink-rgb) / 0.55);  /*  4.07:1 - placeholder, input kenari */
  --bh-ink-line: rgb(var(--bh-ink-rgb) / 0.12);  /*  dekoratif ayirici, metin degil */

  /* Ters bant */
  --bh-invert-bg: #101010;
  --bh-invert-fg: #f3f2ef;
  --bh-invert-muted: rgb(243 242 239 / 0.62);
  --bh-invert-line: rgb(243 242 239 / 0.16);

  /* Tek vurgu rengi
     spot uzerine ink = 5.33:1 (AA gecer)
     spot uzerine paper = 3.19:1 (AA gecmez) -> spot zemininde daima koyu metin
     spot metin olarak paper uzerinde = 3.19:1 -> sadece buyuk metin (>=24px bold) */
  --bh-spot: #ff3b14;
  --bh-spot-fg: #101010;

  /* Tipografi */
  --bh-font-display: "Archivo", system-ui, -apple-system, sans-serif;
  --bh-font-body: "Geist", system-ui, -apple-system, sans-serif;
  --bh-font-mono: "Geist Mono", ui-monospace, "SF Mono", monospace;

  /* Display ust siniri 5.5rem. Basliklar kisa tutulur (satir basina ~11 karakter),
     boylece 850px'lik kolonda 2 satirda kalir. Uzun baslik yazilacaksa once
     baslik kisaltilir, font kucultulmez. */
  --bh-text-display: clamp(2.75rem, 1.3rem + 4.6vw, 5.5rem);
  --bh-text-h2: clamp(1.75rem, 1rem + 2.6vw, 3.25rem);
  --bh-text-h3: clamp(1.25rem, 1rem + 1vw, 1.75rem);
  --bh-text-lead: clamp(1.125rem, 1rem + 0.6vw, 1.5rem);
  --bh-text-body: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --bh-text-small: 0.9375rem;
  --bh-text-label: 0.8125rem;

  --bh-leading-display: 0.92;
  --bh-leading-heading: 1.05;
  --bh-leading-body: 1.6;
  --bh-tracking-display: -0.03em;
  --bh-tracking-label: 0.08em;

  /* Genislik ekseni - Archivo variable, display genis, govde normal */
  --bh-width-display: 118%;
  --bh-width-heading: 112%;

  /* Bosluk */
  --bh-space-section: clamp(4.5rem, 3rem + 6vw, 10rem);
  --bh-space-gutter: clamp(1.25rem, 0.75rem + 2vw, 3rem);
  --bh-container: 1400px;

  /* Nav yuksekligi tek yerden yonetilir: hero min-height hesabi ve mobil
     menu overlay'inin ust offset'i bu degeri kullanir. Ust sinir 80px. */
  --bh-nav-h: 80px;

  /* Sekil - kilitli uclu sistem */
  --bh-radius-card: 0px;
  --bh-radius-button: 999px;
  --bh-radius-input: 2px;

  /* Motion */
  --bh-duration-fast: 160ms;
  --bh-duration-normal: 320ms;
  --bh-duration-slow: 640ms;
  --bh-ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  /* Katman */
  --bh-z-nav: 40;
  --bh-z-menu: 50;
  --bh-z-grain: 60;
}

/* --------------------------------------------------------------------------
   Dark - ayni token adlari, farkli degerler
   spot #ff4a22 uzerine ink #0e0e0e = 5.75:1
   -------------------------------------------------------------------------- */

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;

    --bh-paper: #0e0e0e;
    --bh-surface: #181818;

    --bh-ink-rgb: 243 242 239;
    --bh-ink-muted: rgb(var(--bh-ink-rgb) / 0.62); /* 6.87:1 */
    --bh-ink-soft: rgb(var(--bh-ink-rgb) / 0.55);  /* 5.68:1 */
    --bh-ink-line: rgb(var(--bh-ink-rgb) / 0.14);

    --bh-invert-bg: #f3f2ef;
    --bh-invert-fg: #101010;
    --bh-invert-muted: rgb(16 16 16 / 0.62);
    --bh-invert-line: rgb(16 16 16 / 0.16);

    --bh-spot: #ff4a22;
    --bh-spot-fg: #0e0e0e;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;

  --bh-paper: #0e0e0e;
  --bh-surface: #181818;

  --bh-ink-rgb: 243 242 239;
  --bh-ink-muted: rgb(var(--bh-ink-rgb) / 0.62);
  --bh-ink-soft: rgb(var(--bh-ink-rgb) / 0.55);
  --bh-ink-line: rgb(var(--bh-ink-rgb) / 0.14);

  --bh-invert-bg: #f3f2ef;
  --bh-invert-fg: #101010;
  --bh-invert-muted: rgb(16 16 16 / 0.62);
  --bh-invert-line: rgb(16 16 16 / 0.16);

  --bh-spot: #ff4a22;
  --bh-spot-fg: #0e0e0e;
}