/* La Corona (antes La Casa del iPhone) — tokens de diseño
   Fuente de verdad: diseno/esquema-diseno.md. No cambiar sin actualizar el esquema. */
:root{
  /* color — 4 con nombre: tinta, neutro, carbón (marca), oro (acento) */
  --bg:#FFFFFF;            /* igual al fondo de los renders de producto */
  --bg-alt:#F5F5F7;        /* fondo de tiles de producto y secciones alternas */
  --ink:#16191D;           /* tinta, tintada con el carbón del logo */
  --ink-soft:#5E646C;      /* secundario: 5.97 sobre --bg, 5.49 sobre --bg-alt */
  --brand:#1E252D;         /* carbón del fondo del logo: secciones oscuras y footer */
  --brand-soft:#A9AFB7;    /* texto secundario sobre --brand: 7.0 */
  --accent:#C29F45;        /* oro del logo: CTA y detalles, <5% de superficie */
  --line:rgba(22,25,29,.12);
  --line-on-brand:rgba(255,255,255,.12);
  --btn-ink:#FFFFFF;        /* texto sobre --brand / --ink: 15.47 / 17.63 */
  --btn-ink-accent:#16191D; /* texto sobre --accent: 7.0 (blanco da 2.52, FALLA) */
  --shadow-1:0 1px 2px rgba(22,25,29,.06);
  --shadow-2:0 12px 32px rgba(22,25,29,.10);

  /* tipografía — 2 familias, 4 pesos (Inter 400/500, Inter Tight 600/700) */
  --font-display:'Inter Tight',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-text:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --fs-display:clamp(2.5rem,6vw,4.5rem);
  --fs-h2:clamp(1.9rem,4vw,3rem);
  --fs-h3:clamp(1.35rem,2.4vw,1.75rem);
  --fs-lead:clamp(1.05rem,1.4vw,1.2rem);
  --fs-body:1rem; --fs-sm:.875rem; --fs-label:.75rem;
  --ls-display:-0.03em; --ls-h2:-0.02em; --ls-h3:-0.01em; --ls-label:.1em;
  --lh-display:1.04; --lh-h:1.1; --lh-body:1.6;

  /* espacio y forma */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px;
  --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:96px; --sp-10:128px;
  --container:1200px; --gutter:24px;
  --pad-x:20px;
  --radius:12px; --radius-pill:999px;
  --section-y:clamp(64px,9vw,140px);

  /* motion */
  --ease-out:cubic-bezier(.22,1,.36,1);  /* ~power3.out */
  --dur-press:100ms; --dur-in:.6s;

  /* nav translúcida (único material translúcido del sitio) */
  --nav-bg:rgba(255,255,255,.72);
  --nav-blur:saturate(150%) blur(12px);
}
@media (min-width:768px){ :root{ --pad-x:40px; } }
@media (min-width:1200px){ :root{ --pad-x:64px; } }

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
@media (prefers-reduced-transparency: reduce){
  :root{ --nav-bg:#FFFFFF; --nav-blur:none; }
}
@media (prefers-contrast: more){
  :root{ --ink-soft:#3F444A; --line:rgba(22,25,29,.4); --nav-bg:#FFFFFF; --nav-blur:none; }
}