/* ══════════════════════════════════════════════════════════════
   KASHMIR.PI — DESIGN TOKENS
   One file to retune the whole aesthetic.
   ══════════════════════════════════════════════════════════════ */

:root {
  /* ── Brand constants (never change with season) ───────────── */
  --saffron:        #E7B84B;
  --saffron-deep:   #C08A22;
  --saffron-soft:   #F4D98C;
  --crimson:        #B23A2E;
  --pine:           #0F3A31;

  /* ── Type ─────────────────────────────────────────────────── */
  --font-display: "Fraunces", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --font-sans:    "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono:    ui-monospace, "SF Mono", "Cascadia Mono", Menlo, monospace;

  --fs-xs:   clamp(.68rem, .66rem + .1vw, .75rem);
  --fs-sm:   clamp(.8rem,  .77rem + .15vw, .875rem);
  --fs-base: clamp(.95rem, .92rem + .18vw, 1.0625rem);
  --fs-md:   clamp(1.06rem, 1rem + .3vw, 1.2rem);
  --fs-lg:   clamp(1.3rem, 1.16rem + .6vw, 1.65rem);
  --fs-xl:   clamp(1.75rem, 1.4rem + 1.5vw, 2.6rem);
  --fs-2xl:  clamp(2.3rem, 1.6rem + 3.2vw, 4.4rem);
  --fs-3xl:  clamp(3rem, 1.6rem + 6.4vw, 7.5rem);

  /* ── Space & shape ────────────────────────────────────────── */
  --sp-1: .25rem;  --sp-2: .5rem;   --sp-3: .75rem;  --sp-4: 1rem;
  --sp-5: 1.5rem;  --sp-6: 2rem;    --sp-7: 3rem;    --sp-8: 4.5rem;
  --sp-9: 7rem;    --sp-10: 10rem;

  --r-xs: 6px; --r-sm: 10px; --r-md: 16px; --r-lg: 24px; --r-xl: 34px; --r-pill: 999px;

  --wrap: 1240px;
  --wrap-narrow: 820px;
  --gutter: clamp(1.1rem, 4vw, 3.5rem);

  /* ── Motion ───────────────────────────────────────────────── */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --t-fast: .18s; --t: .34s; --t-slow: .7s; --t-glacial: 1.4s;

  /* ── Elevation ────────────────────────────────────────────── */
  --sh-1: 0 1px 2px rgba(0,0,0,.28), 0 2px 8px rgba(0,0,0,.16);
  --sh-2: 0 4px 12px rgba(0,0,0,.3), 0 14px 34px rgba(0,0,0,.28);
  --sh-3: 0 10px 30px rgba(0,0,0,.34), 0 40px 80px rgba(0,0,0,.42);
  --sh-glow: 0 0 0 1px rgba(231,184,75,.22), 0 10px 46px rgba(231,184,75,.16);

  --z-nav: 60; --z-overlay: 90; --z-toast: 120; --z-curtain: 200;
}

/* ══════════════ DARK (default — the house look) ══════════════ */
:root, [data-theme="dark"] {
  color-scheme: dark;
  --bg:        #06090D;
  --bg-2:      #090E14;
  --surface:   #0D141C;
  --surface-2: #121C27;
  --surface-3: #17232F;
  --line:      rgba(255,255,255,.09);
  --line-2:    rgba(255,255,255,.16);
  --line-3:    rgba(255,255,255,.28);

  --ink:   #EFF4F9;
  --ink-2: #A9B8C6;
  --ink-3: #74869A;
  --ink-inv: #06090D;

  --glass:      rgba(13,20,28,.62);
  --glass-hi:   rgba(255,255,255,.05);
  --scrim:      rgba(3,5,8,.72);
  --grain-op: .05;
  --sky-fade: 0deg;
}

/* ══════════════════════ LIGHT (paper) ════════════════════════ */
[data-theme="light"] {
  color-scheme: light;
  --bg:        #FAF7F1;
  --bg-2:      #F3EEE4;
  --surface:   #FFFFFF;
  --surface-2: #FBF7F0;
  --surface-3: #F1EADD;
  --line:      rgba(24,20,14,.10);
  --line-2:    rgba(24,20,14,.18);
  --line-3:    rgba(24,20,14,.30);

  --ink:   #171310;
  --ink-2: #4E463C;
  --ink-3: #857A6C;
  --ink-inv: #FFFFFF;

  --glass:    rgba(255,255,255,.72);
  --glass-hi: rgba(24,20,14,.03);
  --scrim:    rgba(40,33,24,.42);
  --grain-op: .035;

  --sh-1: 0 1px 2px rgba(60,48,30,.06), 0 2px 8px rgba(60,48,30,.06);
  --sh-2: 0 4px 12px rgba(60,48,30,.08), 0 14px 34px rgba(60,48,30,.10);
  --sh-3: 0 10px 30px rgba(60,48,30,.10), 0 40px 80px rgba(60,48,30,.14);
  --sh-glow: 0 0 0 1px rgba(192,138,34,.28), 0 10px 40px rgba(192,138,34,.14);
}

/* ══════════════════════════════════════════════════════════════
   SEASONS — the site's living variable.
   --s0..--s4 : scenery ramp, sky → far ridge → near ridge → water
   --accent   : interactive accent for that season
   ══════════════════════════════════════════════════════════════ */

[data-season="spring"] {
  --accent:      #E0577A;
  --accent-2:    #7FBF7E;
  --accent-ink:  #2A0A13;
  --s-sky-1: #FCE9EF;  --s-sky-2: #D9E9F2;  --s-sky-3: #A9CFDF;
  --s-far:   #8FA9BE;  --s-mid:   #5E7F8E;  --s-near:  #35525C;
  --s-fore:  #1B3230;  --s-water: #4C8296;  --s-sun:   #FFF1E2;
  --s-bloom: rgba(224,87,122,.35);
  --particle: petal;
}
[data-season="summer"] {
  --accent:      #17A08B;
  --accent-2:    #E7B84B;
  --accent-ink:  #032420;
  --s-sky-1: #DFF4F5;  --s-sky-2: #9ED6E4;  --s-sky-3: #63B4CE;
  --s-far:   #7FA79C;  --s-mid:   #4C7C6C;  --s-near:  #2A5544;
  --s-fore:  #16362A;  --s-water: #2E8D93;  --s-sun:   #FFF8E4;
  --s-bloom: rgba(23,160,139,.32);
  --particle: firefly;
}
[data-season="autumn"] {
  --accent:      #E08A32;
  --accent-2:    #B23A2E;
  --accent-ink:  #2A1305;
  --s-sky-1: #FBE3C0;  --s-sky-2: #E9AE79;  --s-sky-3: #C4784F;
  --s-far:   #8E6F63;  --s-mid:   #5F4740;  --s-near:  #3B2A26;
  --s-fore:  #221613;  --s-water: #6B5340;  --s-sun:   #FFE9C2;
  --s-bloom: rgba(224,138,50,.34);
  --particle: leaf;
}
[data-season="winter"] {
  --accent:      #6FA8E8;
  --accent-2:    #D9E7F5;
  --accent-ink:  #04121F;
  --s-sky-1: #E9F2FA;  --s-sky-2: #BCD3E7;  --s-sky-3: #8AA9C6;
  --s-far:   #93A8BD;  --s-mid:   #64798F;  --s-near:  #3D4E62;
  --s-fore:  #212C3B;  --s-water: #587C97;  --s-sun:   #FFFFFF;
  --s-bloom: rgba(111,168,232,.30);
  --particle: snow;
}

/* Light theme lifts the scenery ramp so illustrations stay airy */
[data-theme="light"] {
  --s-fore: color-mix(in oklab, var(--s-near) 72%, #FFFFFF);
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: .01ms; --t: .01ms; --t-slow: .01ms; --t-glacial: .01ms; }
}