/* Source: supplied questionnaire v2; identity guide 1.2 takes precedence. */
:root {
  /* Color · base (del SVG del logotipo) */
  --ob-antracita: #242D39;
  --ob-tinta: #1A212B;
  --ob-pizarra: #768598;          /* solo usos gráficos: no para texto */
  --ob-niebla: #BCC4D3;
  --ob-bruma: #F1F2F6;
  --ob-blanco: #FFFFFF;
  --ob-texto-suave: #4E5C6E;
  --ob-borde: #DDE1E9;

  /* Color · acento petróleo */
  --ob-acento: #0B5C59;           /* acción sobre claro */
  --ob-acento-hover: #084543;
  --ob-acento-claro: #5FBDB6;     /* acción sobre oscuro */
  --ob-acento-claro-hover: #83CEC8;
  --ob-acento-brillo: #B7E3DF;
  --ob-acento-velo: #E0EFEE;

  /* Color · estado excepción (simulación) */
  --ob-aviso: #F2D49F;
  --ob-aviso-borde: #E8BD76;
  --ob-aviso-fondo: rgba(232, 189, 118, .10);

  /* RGB para mezclas con alfa */
  --rgb-tinta: 26, 33, 43;
  --rgb-antracita: 36, 45, 57;
  --rgb-niebla: 188, 196, 211;
  --rgb-pizarra: 118, 133, 152;
  --rgb-acento: 11, 92, 89;
  --rgb-acento-claro: 95, 189, 182;

  /* Tipografía */
  --font-brand: "Jost", "Jost Local", "Futura", "Century Gothic", sans-serif;
  --font-text: "IBM Plex Sans", "Plex Local", -apple-system, "Segoe UI", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", monospace;

  --t-display: clamp(2.75rem, 1.9rem + 4.2vw, 4.75rem);   /* 44 → 76 px */
  --t-h2: clamp(2rem, 1.45rem + 2.5vw, 3.375rem);          /* 32 → 54 px */
  --t-h3: clamp(1.25rem, 1.15rem + .4vw, 1.5rem);          /* 20 → 24 px */
  --t-expressive: clamp(2.1rem, 1.2rem + 4.4vw, 5rem);     /* piezas expresivas, Jost 300 */
  --t-lead: clamp(1.0625rem, 1rem + .3vw, 1.25rem);
  --t-base: 1rem;
  --t-small: .875rem;
  --t-label: .8125rem;

  --lh-display: 1.08;
  --lh-title: 1.14;
  --lh-text: 1.65;
  --track-brand: .22em;
  --track-label: .12em;
  --track-title: -.025em;

  /* Espaciado y medidas */
  --gutter: 20px;
  --max: 1240px;
  --measure: 62ch;
  --space-section: clamp(88px, 11vw, 160px);
  --r-s: 8px;
  --r-m: 14px;
  --r-l: 22px;
  --r-xl: 30px;
  --r-sheet: 28px;
  --nav-h: 64px;

  /* Vidrio */
  --glass-blur: 14px;
  --glass-sat: 150%;
  --glass-dark-solid: rgba(36, 45, 57, .96);
  --glass-dark: rgba(36, 45, 57, .40);
  --glass-light-solid: rgba(255, 255, 255, .97);
  --glass-light: rgba(255, 255, 255, .56);
  --glass-edge-dark: rgba(188, 196, 211, .14);
  --glass-edge-light: rgba(255, 255, 255, .9);
  --shadow-dark: 0 1px 0 rgba(255,255,255,.06) inset, 0 30px 80px -20px rgba(0,0,0,.55);
  --shadow-light: 0 1px 0 rgba(255,255,255,.9) inset, 0 2px 4px rgba(36,45,57,.04), 0 24px 60px -24px rgba(36,45,57,.22);

  /* Movimiento */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --dur-fast: .18s;
  --dur-med: .45s;
  --dur-slow: .9s;

  /* Capas */
  --z-nav: 50;
  --z-intro: 100;
}
@media (min-width: 720px) { :root { --gutter: 32px; --r-sheet: 40px; --glass-blur: 18px; } }
@media (min-width: 1024px) { :root { --gutter: 40px; --r-sheet: 48px; --glass-blur: 22px; --nav-h: 68px; } }

/* Temas de sección: los componentes solo leen --c-* */
.theme-dark {
  --c-bg: var(--ob-tinta);
  --c-heading: var(--ob-bruma);
  --c-text: var(--ob-niebla);
  --c-muted: var(--ob-niebla);
  --c-eyebrow: var(--ob-acento-claro);
  --c-accent: var(--ob-acento-claro);
  --c-line: rgba(var(--rgb-niebla), .16);
  --c-line-strong: rgba(var(--rgb-niebla), .32);
  --c-focus: var(--ob-acento-claro);
  --logo-a: #F1F2F6; --logo-b: #768598; --logo-y: #F1F2F6;
  color-scheme: dark;
}
.theme-light {
  --c-bg: var(--ob-bruma);
  --c-heading: var(--ob-tinta);
  --c-text: var(--ob-tinta);
  --c-muted: var(--ob-texto-suave);
  --c-eyebrow: var(--ob-texto-suave);
  --c-accent: var(--ob-acento);
  --c-line: var(--ob-borde);
  --c-line-strong: #C9CFDA;
  --c-focus: var(--ob-acento);
  --logo-a: #242D39; --logo-b: #BCC4D3; --logo-y: #242D39;
  color-scheme: light;
}

