/* =========================================================
   ICON5 · base · tokens, reajuste y utilidades
   Derivado de MINI_BRAND_GUIDELINE_I5_ICON5.

   Orden de carga:  base → components → (landing | app)
   ========================================================= */

/* =========================================================
   ICON5 · Design System
   Derivado de MINI_BRAND_GUIDELINE_I5_ICON5 (v1.0 · agosto 2026).

   Paleta      #660D27 vino · #FFFFFF · #0D0D0D negro · #383A3B gris
   Tipografía  Cormorant Garamond (títulos) · Montserrat (resto)
   Jerarquía   títulos Regular/Bold · subtítulos Medium/SemiBold
               texto Regular/Light · CTA SemiBold MAYÚSCULAS

   VOZ: el manual fija títulos y subtítulos en MAYÚSCULAS con tracking
   abierto, igual que el logotipo "I C O N 5", y admite Regular Y Bold.
   Se juega con esos dos pesos —y con dos escalas— para dar contraste.
   Sin itálicas ni acentos de color dentro del texto: no están en el manual.

   ESTRUCTURA: Icon5 ocupa tres niveles reales de la torre. La sección de
   niveles se lee con un TABLERO DE ELEVADOR pegado a la izquierda: la pila
   de entrepisos, el número del nivel y su nombre. El número cambia al bajar,
   como el indicador de un elevador. Es un índice, no un adorno, y vive
   dentro de la retícula —no flotando lejos del contenido.

   CONTRASTE: el vino #660D27 sobre negro da 1.53:1. Sobre fondo oscuro se
   usa sólo como relleno (blanco sobre vino = 12.7:1); para texto y filetes
   se usa --wine-tint, el mismo tono aclarado, tal como el manual imprime
   sus propias páginas negras.
   ========================================================= */
:root{
  /* --- Paleta de marca (exacta del manual) --- */
  --black:#0D0D0D;
  --white:#FFFFFF;
  --wine:#660D27;
  --grey:#383A3B;

  /* --- Derivados --- */
  --black-2:#121213;
  --black-3:#191919;
  --wine-lift:#8C1F3C;
  --wine-tint:#C06E82;      /* acento sobre oscuro · 5.4:1 sobre #0D0D0D */
  --wine-tint-2:#CE8095;    /* acento sobre superficie ya teñida · 5.3:1 */
  --wine-soft:#F7EDEF;

  --on-dark:rgba(255,255,255,.74);      /* 10.1:1 */
  --on-dark-2:rgba(255,255,255,.58);    /*  6.8:1 */
  --line-dark:rgba(255,255,255,.11);
  --line-dark-2:rgba(255,255,255,.22);

  /* Superficies claras (reservar · cuenta · formularios) */
  --ink:#0D0D0D;
  --ink-2:#26282A;
  --muted:#6B6D6E;
  --muted-2:#8E9091;
  --bg:#FFFFFF;
  --paper:#F5F4F4;
  --soft:#EFEEEE;
  --soft-2:#E4E3E3;
  --line:#E2E1E1;
  --accent:var(--wine);
  --accent-soft:var(--wine-soft);

  --ok:#137434;
  --danger:#B42318;
  --warn:#B45309;

  --radius:4px;
  --radius-sm:3px;
  --shadow:0 1px 2px rgba(13,13,13,.05),0 10px 30px rgba(13,13,13,.07);
  --shadow-lg:0 30px 70px rgba(13,13,13,.16);
  --maxw:1460px;
  --gutter:44px;

  --font:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --display:'Cormorant Garamond','Georgia','Times New Roman',serif;

  --tr-display:.085em;
  --tr-label:.26em;
  --tr-item:.14em;
}
*{box-sizing:border-box}
/* NO se usa scroll-behavior:smooth. Con un ancla en la URL el navegador
   anima el salto, y ScrollTrigger llega a inicializarse a media animación:
   mide rect.top contra un scroll que todavía lee 0 y calcula posiciones
   negativas. El desplazamiento suave lo hace motion.js al pulsar un enlace,
   cuando ya no hay nada midiendo. */
html.dark{background:var(--black);color-scheme:dark}
body{
  margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);
  -webkit-font-smoothing:antialiased;line-height:1.65;font-size:16px;font-weight:400;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4,h5{margin:0;font-family:var(--display);font-weight:400;line-height:1.1}

/* Cormorant Garamond trae cifras ELZEVIRIANAS por defecto: el 5, el 3 y el 9
   caen bajo la línea base. En capitulares eso descuadra el renglón ("EL PISO 5
   TIENE", "ICON5"). Se fuerzan cifras de caja alta en toda la tipografía de
   titulares y en cualquier cifra que se muestre en Cormorant. */
h1, h2, h3, h4, h5,
.hero-meta .m b, .esp-meta b, .nivel-num,
.acc-stat-num, .kpi .v {
  font-variant-numeric: lining-nums;
  font-feature-settings: "lnum" 1, "onum" 0;
}
p{margin:0}
:focus-visible{outline:2px solid var(--wine-tint);outline-offset:3px}
.container{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}
.muted{color:var(--muted)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.section-label{display:block;font-family:var(--font);font-size:10.5px;font-weight:600;
  letter-spacing:var(--tr-label);text-transform:uppercase;color:var(--wine);margin-bottom:20px}
.eyebrow{font-size:10.5px;font-weight:600;letter-spacing:var(--tr-label);text-transform:uppercase;
  color:var(--muted);display:inline-flex;align-items:center;gap:6px}
.pill svg{width:16px;height:16px;flex:none}@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;
    animation-iteration-count:1!important}
}
