/* Truly Nolen Tech · design system del sitio (marketing)
   Tres capas: primitivos → semánticos → componente. Los componentes de
   experience.css consumen SOLO variables de este archivo — cero hex fuera
   de acá (lo vigila check.mjs).

   Tipografía (10-sep, tras el rechazo de Switzer):
     display  Bricolage Grotesque — titulares, cifras, leads
     texto    Hanken Grotesk — la misma del sitio principal de TNI
     índice   JetBrains Mono — etiquetas, numeración y metadatos
   El mono no es decorativo: es lo que da la lectura técnica y moderna que
   Switzer a 14px gris no daba. */
@font-face{font-family:Bricolage;src:url('/assets/fonts/bricolage.woff2') format('woff2');font-weight:200 800;font-display:swap}
@font-face{font-family:Hanken;src:url('/assets/fonts/hanken-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Hanken;src:url('/assets/fonts/hanken-500.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Hanken;src:url('/assets/fonts/hanken-600.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:Hanken;src:url('/assets/fonts/hanken-700.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('/assets/fonts/jetbrains-mono.woff2') format('woff2');font-weight:400 700;font-display:swap}
:root{
 /* — Capa 1 · primitivos — */
 --brand-yellow:#ffd900;--brand-yellow-light:#fff2a1;--brand-yellow-deep:#bf8b00;--brand-cobalt:#1737ef;--brand-navy:#071750;--brand-ink:#111d39;--white:#fff;
 --tint-soft:#f2f5fc;--tint-message:#eaf0ff;--tint-yellow-hover:#ffe64c;
 --font-display:Bricolage,sans-serif;--font-body:Hanken,system-ui,sans-serif;--font-mono:'JetBrains Mono',ui-monospace,monospace;
 --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;
 --duration-fast:140ms;--duration-ui:240ms;--duration-reveal:560ms;--ease:cubic-bezier(.2,.7,.2,1);--ease-out:cubic-bezier(.16,1,.3,1);
 /* — Capa 2 · semánticos — */
 --surface-page:var(--white);--surface-hero:var(--brand-cobalt);--surface-deep:var(--brand-navy);--surface-accent:var(--brand-yellow);--surface-soft:var(--tint-soft);--surface-message:var(--tint-message);
 --text-primary:var(--brand-ink);--text-secondary:#4f5c75;--text-inverse:var(--white);--text-inverse-muted:#d8e0ff;--text-link:var(--brand-cobalt);
 --action-bg:var(--brand-yellow);--action-text:var(--brand-navy);--action-hover:var(--tint-yellow-hover);--action-dark:var(--brand-ink);--action-dark-hover:var(--brand-navy);
 --border-default:#d8deea;--border-inverse:#52638b;--border-header:#e6e9f0;
 --rule:color-mix(in srgb,var(--brand-ink) 12%,transparent);--rule-inverse:color-mix(in srgb,var(--white) 16%,transparent);
 --focus-color:var(--brand-cobalt);--tick-color:var(--brand-cobalt);
 --hover-inverse:color-mix(in srgb,var(--white) 9%,transparent);
 /* — Capa 3 · de componente — */
 --header-bg:color-mix(in srgb,var(--white) 84%,transparent);--header-blur:14px;
 --shadow-panel:0 24px 64px color-mix(in srgb,var(--brand-navy) 8%,transparent),0 2px 8px color-mix(in srgb,var(--brand-navy) 4%,transparent);
 --shadow-header:0 4px 24px color-mix(in srgb,var(--brand-navy) 5%,transparent);
 --shadow-segment:0 1px 4px color-mix(in srgb,var(--brand-navy) 18%,transparent);
 --sculpture-base:var(--brand-yellow);--sculpture-light:var(--brand-yellow-light);--sculpture-shadow:var(--brand-yellow-deep);--scene-orbit:#849cff;
 --type-label:0.9375rem;--type-body:1rem;--type-lead:1.125rem;--type-h3:1.5rem;--type-h2:clamp(2.5rem,4.6vw,4.5rem);--type-h1:clamp(3.5rem,6.1vw,6rem);
 --type-index:0.6875rem;--tracking-index:.18em;
 --gutter:clamp(24px,4.45vw,80px);--header-height:88px;--radius-control:8px;--radius-panel:24px;--radius-pill:999px;
 color:var(--text-primary);background:var(--surface-page);font-family:var(--font-body);font-synthesis:none;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + 24px)
}
@media(max-width:700px){:root{--type-h1:clamp(2.75rem,10.6vw,3.75rem);--type-h2:clamp(2.25rem,9vw,3rem);--type-h3:1.375rem;--header-height:76px;--gutter:24px}}