
/* tokens/fonts.css */
/* IIA webfonts · type direction B "Geometría de marca" (approved Aug 2026, single-sans revision).
   Manrope carries BOTH display and text/interface: the logo wordmark is Avenir Bold and Manrope is the
   closest open-licence geometric humanist, so the whole system descends from the mark.
   EB Garamond Italic stays as the editorial accent (quotes and manifestos only).
   No binaries were supplied; families are served from Google Fonts and can be self-hosted as-is. */
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=EB+Garamond:ital,wght@1,400..600&display=swap");

/* tokens/colors.css */
:root{
/* ---- Brand core (from Plataforma de Marca 2026 · paleta) ---- */
--iia-blue:#516099;         /* Núcleo */
--deep-ink:#111528;         /* Base */
--cloud:#F7F8FB;            /* Fondo */
--future-violet:#8453BE;    /* Acento */
--signal-magenta:#E03CBE;   /* Campañas */
--signal-cyan:#44CDC9;      /* Datos / acción */
--logo-blue:#535488;        /* exact fill of the supplied logo file */

/* ---- Blue ramp (derived from --iia-blue) ---- */
--blue-50:#F2F4F9;--blue-100:#E3E7F1;--blue-200:#C6CDE2;--blue-300:#A3AECE;
--blue-400:#7A88B4;--blue-500:#516099;--blue-600:#42507F;--blue-700:#343F66;
--blue-800:#262E4C;--blue-900:#1A2038;

/* ---- Ink / neutral ramp ---- */
--ink-900:#111528;--ink-800:#1B2038;--ink-700:#2A3050;--ink-600:#464E6E;
--ink-500:#666D8A;--ink-400:#8B91A8;--ink-300:#B4B9CA;--ink-200:#D6D9E3;
--ink-100:#E9EBF1;--ink-50:#F7F8FB;--white:#FFFFFF;

/* ---- Accent ramps ---- */
--violet-100:#F1E9F9;--violet-300:#C39FE2;--violet-500:#8453BE;--violet-700:#5F3A8C;
--magenta-100:#FCE6F7;--magenta-300:#F08FDD;--magenta-500:#E03CBE;--magenta-700:#A32689;
--cyan-100:#E4F8F7;--cyan-300:#8FE2E0;--cyan-500:#44CDC9;--cyan-700:#22928F;

/* ---- Semantic: text ---- */
--text-strong:var(--ink-900);
--text-body:var(--ink-700);
--text-muted:var(--ink-500);
--text-subtle:var(--ink-400);
--text-brand:var(--iia-blue);
--text-on-dark:var(--white);
--text-on-dark-muted:rgba(255,255,255,.72);
--text-inverse:var(--white);
--text-link:var(--iia-blue);
--text-link-hover:var(--blue-700);

/* ---- Semantic: surfaces ---- */
--surface-page:var(--cloud);
--surface-card:var(--white);
--surface-sunken:var(--blue-50);
--surface-brand:var(--iia-blue);
--surface-dark:var(--deep-ink);
--surface-dark-elevated:#1A2038;
--surface-accent-soft:var(--violet-100);
--surface-signal-soft:var(--cyan-100);
--surface-campaign:var(--signal-magenta);
--surface-overlay:rgba(17,21,40,.62);
--surface-glass:rgba(255,255,255,.08);

/* ---- Semantic: borders ---- */
--border-subtle:var(--ink-100);
--border-default:var(--ink-200);
--border-strong:var(--ink-300);
--border-brand:var(--blue-300);
--border-on-dark:rgba(255,255,255,.14);
--focus-ring:rgba(81,96,153,.45);

/* ---- Semantic: status (derived, brand-tinted) ---- */
--status-info:var(--iia-blue);--status-info-soft:var(--blue-50);
--status-success:#1F9D6B;--status-success-soft:#E6F5EF;
--status-warning:#C7842A;--status-warning-soft:#FBF1E1;
--status-danger:#C6395B;--status-danger-soft:#FBE9EE;

/* ---- Brand gradients (deck cover + campaign cards) ---- */
--grad-cover:linear-gradient(115deg,#111528 0%,#1B2038 42%,#3A2B5C 72%,#6B3F8F 100%); /* @kind color */
--grad-campaign:linear-gradient(100deg,var(--future-violet) 0%,var(--signal-magenta) 100%); /* @kind color */
--grad-brand:linear-gradient(100deg,var(--blue-600) 0%,var(--future-violet) 100%); /* @kind color */
--grad-protect:linear-gradient(180deg,rgba(17,21,40,0) 0%,rgba(17,21,40,.86) 100%); /* @kind color */
}

/* tokens/typography.css */
:root{
/* families */
--font-display:Manrope,system-ui,-apple-system,sans-serif;
--font-sans:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;
--font-editorial:"EB Garamond",Georgia,"Times New Roman",serif;
--font-mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,monospace; /* @kind font */

/* size scale */
--fs-display-xl:72px;--fs-display-lg:56px;--fs-display-md:40px;--fs-display-sm:32px;
--fs-h1:28px;--fs-h2:22px;--fs-h3:18px;
--fs-body-lg:17px;--fs-body:15px;--fs-body-sm:13.5px;--fs-caption:12px;--fs-eyebrow:11px;--fs-micro:10px;

/* weights */
--fw-light:300; /* @kind font */--fw-regular:400; /* @kind font */--fw-medium:500; /* @kind font */--fw-semibold:600; /* @kind font */--fw-bold:700; /* @kind font */--fw-extrabold:800; /* @kind font */

/* line heights */
--lh-tight:1.04; /* @kind font */--lh-display:1.1; /* @kind font */--lh-heading:1.22; /* @kind font */--lh-snug:1.4; /* @kind font */--lh-body:1.6; /* @kind font */--lh-loose:1.7; /* @kind font */

/* tracking */
--ls-display:-0.035em; /* @kind font */--ls-heading:-0.015em; /* @kind font */--ls-body:-0.005em; /* @kind font */--ls-eyebrow:0.08em; /* @kind font */--ls-micro:0.12em; /* @kind font */

/* composed roles */
--type-display:var(--fw-extrabold) var(--fs-display-lg)/var(--lh-display) var(--font-display);
--type-title:var(--fw-bold) var(--fs-display-sm)/var(--lh-heading) var(--font-display);
--type-h1:var(--fw-bold) var(--fs-h1)/var(--lh-heading) var(--font-display);
--type-h2:var(--fw-bold) var(--fs-h2)/var(--lh-heading) var(--font-display);
--type-h3:var(--fw-semibold) var(--fs-h3)/var(--lh-snug) var(--font-sans);
--type-body:var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-sans);
--type-body-sm:var(--fw-regular) var(--fs-body-sm)/var(--lh-body) var(--font-sans);
--type-label:var(--fw-semibold) var(--fs-body-sm)/var(--lh-snug) var(--font-sans);
--type-eyebrow:var(--fw-bold) var(--fs-eyebrow)/1.3 var(--font-sans);
--type-quote:italic var(--fw-regular) var(--fs-body-lg)/var(--lh-snug) var(--font-editorial);
}

/* tokens/spacing.css */
:root{
--space-0:0px;--space-1:2px;--space-2:4px;--space-3:6px;--space-4:8px;--space-5:12px;
--space-6:16px;--space-7:20px;--space-8:24px;--space-9:32px;--space-10:40px;--space-11:48px;
--space-12:64px;--space-13:80px;--space-14:96px;--space-15:128px;
/* semantic */
--gap-inline:var(--space-4);--gap-stack:var(--space-5);--gap-group:var(--space-8);
--pad-control:var(--space-5);--pad-card:var(--space-8);--pad-card-lg:var(--space-9);
--section-y:var(--space-14);--section-y-sm:var(--space-12);
--container-max:1200px;--container-narrow:760px;--measure:66ch; /* @kind spacing */
--slide-w:1280px;--slide-h:720px;--slide-margin:72px;
}

/* tokens/radius.css */
:root{
--radius-xs:4px;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-2xl:28px;--radius-pill:999px;
--radius-control:var(--radius-md);--radius-card:var(--radius-lg);--radius-panel:var(--radius-xl);
--border-w:1px;--border-w-strong:2px;--rule-w:3px;
}

/* tokens/elevation.css */
:root{
--shadow-0:none;
--shadow-1:0 1px 2px rgba(17,21,40,.06);
--shadow-2:0 4px 14px -2px rgba(17,21,40,.10);
--shadow-3:0 18px 40px -12px rgba(17,21,40,.22);
--shadow-4:0 32px 72px -20px rgba(17,21,40,.32);
--shadow-inset:inset 0 1px 0 rgba(255,255,255,.06);
--shadow-focus:0 0 0 3px var(--focus-ring);
--glow-cyan:0 0 0 1px rgba(68,205,201,.5),0 8px 28px -8px rgba(68,205,201,.45);
--glow-violet:0 12px 36px -10px rgba(132,83,190,.55);
--blur-glass:saturate(140%) blur(14px); /* @kind other */
}

/* tokens/motion.css */
:root{
--dur-instant:80ms; /* @kind other */--dur-fast:140ms; /* @kind other */--dur-base:220ms; /* @kind other */--dur-slow:340ms; /* @kind other */--dur-slower:520ms; /* @kind other */
--ease-standard:cubic-bezier(.2,.6,.2,1); /* @kind other */
--ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */
--ease-in:cubic-bezier(.5,0,.9,.3); /* @kind other */
--transition-control:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard),transform var(--dur-fast) var(--ease-standard); /* @kind other */
--lift-hover:translateY(-1px); /* @kind other */--press-scale:.985; /* @kind other */
}
@media (prefers-reduced-motion:reduce){:root{--dur-instant:0ms; /* @kind other */--dur-fast:0ms; /* @kind other */--dur-base:0ms; /* @kind other */--dur-slow:0ms; /* @kind other */--dur-slower:0ms /* @kind other */}}

/* tokens/base.css */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font:var(--type-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{margin:0;color:var(--text-strong);font-family:var(--font-display);letter-spacing:var(--ls-heading)}
p{margin:0;text-wrap:pretty}
a{color:var(--text-link);text-decoration:none;border-bottom:1px solid transparent;transition:color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}
a:hover{color:var(--text-link-hover);border-bottom-color:currentColor}
:focus-visible{outline:none;box-shadow:var(--shadow-focus);border-radius:var(--radius-sm)}
::selection{background:var(--cyan-300);color:var(--deep-ink)}
