/* ==========================================================
   ESTUDI 53 PILATES · Tokens de diseño
   Paleta tomada de la fachada: negro mate, beige cálido,
   blanco roto y la luz cálida del retroiluminado del logo.
   ========================================================== */
:root {
  /* Marca */
  --c-ink: #1C1A17;        /* negro mate */
  --c-ink-2: #262320;      /* piedra oscura */
  --c-ink-3: #34302B;
  --c-ivory: #F4EFE7;      /* blanco roto */
  --c-sand: #E7DDCD;       /* arena */
  --c-beige: #CDBB9E;      /* beige cálido */
  --c-stone: #8A8278;      /* gris piedra */
  --c-glow: #D6A866;       /* luz cálida (acento) */
  --c-glow-deep: #A87A3E;
  --c-sage: #7E8A72;       /* acento natural secundario (estados OK) */
  --c-error: #A4483A;

  /* Superficies (se intercambian por sección) */
  --bg: var(--c-ivory);
  --surface: #FBF8F3;
  --text: var(--c-ink);
  --muted: #625B52;
  --line: rgba(28, 26, 23, .14);
  --accent-text: var(--c-glow-deep);

  /* Tipografía */
  --f-display: 'Newsreader', 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;
  --f-sans: 'Jost', 'Avenir Next', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --fs-xs: .8125rem;
  --fs-sm: .9375rem;
  --fs-base: 1.0625rem;
  --fs-lead: clamp(1.25rem, 1.05rem + .8vw, 1.6rem);
  --fs-h3: clamp(1.4rem, 1.2rem + .7vw, 1.75rem);
  --fs-h2: clamp(2.1rem, 1.5rem + 2.6vw, 3.6rem);
  --fs-h1: clamp(2.9rem, 1.6rem + 5.6vw, 6.4rem);
  --track-wide: .32em;

  /* Espacio y forma */
  --wrap: 1240px;
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --section-y: clamp(4.5rem, 10vw, 8.5rem);
  --r-sm: 6px;
  --r-md: 14px;
  --r-pill: 999px;
  --header-h: 72px;

  --ease: cubic-bezier(.22, .61, .36, 1);
  --dur: .45s;
}

/* Modo oscuro del sistema: las secciones claras pasan a piedra
   cálida, coherente con la fachada nocturna. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --c-ivory: #221F1B;
    --c-sand: #2A2622;
    --surface: #2C2824;
    --text: #EFE8DD;
    --muted: #B5AC9F;
    --line: rgba(239, 232, 221, .14);
    --accent-text: var(--c-glow);
  }
}
:root[data-theme="dark"] {
  --c-ivory: #221F1B;
  --c-sand: #2A2622;
  --surface: #2C2824;
  --text: #EFE8DD;
  --muted: #B5AC9F;
  --line: rgba(239, 232, 221, .14);
  --accent-text: var(--c-glow);
}
