/* =========================================================
   SITI — landing · 1. tokens
   Dos paletas (--d-* oscura, --l-* clara). theme-boot.js pone
   <html data-theme> antes del primer pintado; sin JS manda el sistema.
   ========================================================= */
:root{
  /* paleta oscura: negro neutro, grises R=G=B */
  --d-bg:#0A0A0A;  --d-bg-2:#131313;  --d-fg:#F5F4F0;
  --d-surface:#161616;
  --d-muted:rgba(245,244,240,.58);
  --d-line:rgba(245,244,240,.11);  --d-line-2:rgba(245,244,240,.22);
  --d-card:rgba(245,244,240,.03);
  --d-mesh:245,244,240;  --d-grain:.05;
  /* naranja legible como texto sobre negro */
  --d-ink:#FF8A3D;  --d-glow:.16;  --d-shadow:0 30px 80px -30px rgba(0,0,0,.8);

  /* paleta clara: el crema de la marca */
  --l-bg:#F7F6F3;  --l-bg-2:#ECEAE4;  --l-fg:#141414;
  --l-surface:#FFFFFF;
  --l-muted:rgba(20,20,20,.62);
  --l-line:rgba(20,20,20,.12);  --l-line-2:rgba(20,20,20,.24);
  --l-card:rgba(20,20,20,.03);
  --l-mesh:20,20,20;  --l-grain:.03;
  /* #FF7A22 sobre crema da 2.6:1: para texto usamos un naranja quemado de 5:1 */
  --l-ink:#B84500;  --l-glow:.12;  --l-shadow:0 30px 70px -30px rgba(60,30,10,.35);

  --orange:#FF7A22;
  --amber:#FEBB28;
  --hot:255,122,34;
  --on-orange:#1A0B00;

  --f-dis:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;
  --f-body:'Manrope',system-ui,-apple-system,sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,monospace;

  --shell:1320px;
  --pad:clamp(20px,4vw,64px);
  --r:22px;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-io:cubic-bezier(.65,0,.35,1);

  /* sin JS y sin preferencia: claro, como la marca */
  color-scheme:light;
  --bg:var(--l-bg); --bg-2:var(--l-bg-2); --fg:var(--l-fg); --surface:var(--l-surface);
  --muted:var(--l-muted); --line:var(--l-line); --line-2:var(--l-line-2);
  --card:var(--l-card); --mesh:var(--l-mesh); --grain:var(--l-grain);
  --ink:var(--l-ink); --glow:var(--l-glow); --shadow:var(--l-shadow);
}

@media (prefers-color-scheme:dark){
  html:not([data-theme]){
    color-scheme:dark;
    --bg:var(--d-bg); --bg-2:var(--d-bg-2); --fg:var(--d-fg); --surface:var(--d-surface);
    --muted:var(--d-muted); --line:var(--d-line); --line-2:var(--d-line-2);
    --card:var(--d-card); --mesh:var(--d-mesh); --grain:var(--d-grain);
    --ink:var(--d-ink); --glow:var(--d-glow); --shadow:var(--d-shadow);
  }
}

html[data-theme="dark"]{
  color-scheme:dark;
  --bg:var(--d-bg); --bg-2:var(--d-bg-2); --fg:var(--d-fg); --surface:var(--d-surface);
  --muted:var(--d-muted); --line:var(--d-line); --line-2:var(--d-line-2);
  --card:var(--d-card); --mesh:var(--d-mesh); --grain:var(--d-grain);
  --ink:var(--d-ink); --glow:var(--d-glow); --shadow:var(--d-shadow);
}

html[data-theme="light"]{
  color-scheme:light;
  --bg:var(--l-bg); --bg-2:var(--l-bg-2); --fg:var(--l-fg); --surface:var(--l-surface);
  --muted:var(--l-muted); --line:var(--l-line); --line-2:var(--l-line-2);
  --card:var(--l-card); --mesh:var(--l-mesh); --grain:var(--l-grain);
  --ink:var(--l-ink); --glow:var(--l-glow); --shadow:var(--l-shadow);
}