/* ==========================================================================
   2Iberia Design System — token contract (do not re-declare, consume only)
   Ported verbatim from Design System/tokens/*.css
   Fonts load via <link> tags in each page head (Instrument Sans + Lato).
   Lato is retained ONLY for the wordmark lockup (--font-wordmark).
   ========================================================================== */

:root{
/* --- Wine (brand primary, sampled from the wordmark and deck banners) --- */
--color-wine-900:#6B1435;
--color-wine-800:#821840;
--color-wine-700:#A61E51;
--color-wine-600:#B42950;
--color-wine-500:#C4456B;
--color-wine-200:#EBD2DC;
--color-wine-100:#F5EBEF;
--color-wine-50:#FEF5F6;

/* --- Olive (secondary accent: certification, green-bond and upside callouts) --- */
--color-olive-800:#4F6228;
--color-olive-700:#586933;
--color-olive-500:#7E9450;
--color-olive-100:#E3ECD0;
--color-olive-50:#EBF2DE;

/* --- Ink & neutrals --- */
--color-ink-900:#232323;
--color-ink-800:#3D3D3D;
--color-ink-700:#5A6068;
--color-ink-600:#696969;
--color-ink-500:#848484;
--color-ink-400:#9F9F9F;
--color-neutral-300:#C8C8C8;
--color-neutral-200:#D9D9D9;
--color-neutral-100:#EDEDED;
--color-neutral-50:#F7F7F7;
--color-white:#FFFFFF;

/* --- Data-visualisation ramp --- */
--color-chart-1:#A61E51;
--color-chart-2:#C4456B;
--color-chart-3:#EBD2DC;
--color-chart-4:#586933;
--color-chart-5:#848484;
--color-chart-6:#D9D9D9;

/* --- Semantic text --- */
--text-heading:var(--color-ink-900);
/* NOTE: the upstream design system declares --text-body twice — as this ink colour
   (tokens/colors.css) and as the 15px body size (tokens/typography.css). The type
   value wins, so every `color:var(--text-body)` silently resolved to an invalid
   value and rendered pure black — which the brand guide forbids for text. The ink
   colour is therefore exposed here as --text-ink; --text-body stays the 15px size. */
--text-ink:var(--color-ink-800);
--text-muted:var(--color-ink-500);
--text-subtle:var(--color-ink-400);
--text-accent:var(--color-wine-700);
--text-positive:var(--color-olive-700);
--text-inverse:var(--color-white);
--text-inverse-muted:rgba(255,255,255,.72);

/* --- Semantic surfaces --- */
--surface-page:var(--color-white);
--surface-subtle:var(--color-neutral-50);
--surface-card:var(--color-white);
--surface-tint-wine:var(--color-wine-50);
--surface-tint-wine-strong:var(--color-wine-100);
--surface-tint-olive:var(--color-olive-50);
--surface-accent:var(--color-wine-700);
--surface-accent-hover:var(--color-wine-800);
--surface-inverse:var(--color-ink-900);
--surface-scrim:rgba(24,24,28,.55);
--surface-scrim-wine:rgba(130,24,64,.82);

/* --- Semantic borders --- */
--border-subtle:var(--color-neutral-200);
--border-strong:var(--color-neutral-300);
--border-accent:var(--color-wine-700);
--border-inverse:rgba(255,255,255,.45);

/* --- Focus --- */
--focus-ring:var(--color-wine-600);

/* --- Signature gradients (hero panel + banners) --- */
--gradient-wine-panel:linear-gradient(120deg,rgba(130,24,64,.94) 0%,rgba(130,24,64,.72) 55%,rgba(130,24,64,.34) 100%);
--gradient-hero-scrim:linear-gradient(180deg,rgba(20,20,26,.72) 0%,rgba(20,20,26,.18) 42%,rgba(20,20,26,0) 100%);
--gradient-wine-bar:linear-gradient(90deg,var(--color-wine-800) 0%,var(--color-wine-700) 100%);

/* --- Type --- */
--font-sans:"Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
--font-display:"Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
/* Wordmark only — the 2Iberia mark is set in Lato. Never use for running text. */
--font-wordmark:"Lato",-apple-system,"Segoe UI",Arial,sans-serif;
--font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

--font-weight-regular:400;
--font-weight-medium:500;
--font-weight-semibold:600;
--font-weight-bold:700;
--font-weight-light:400;
--font-weight-black:700;
--font-weight-heading:600;

/* Web scale */
--text-display:50px;
--text-h1:40px;
--text-h2:32px;
--text-h3:24px;
--text-h4:20px;
--text-lead:19px;
--text-body-lg:17px;
--text-body:15px;
--text-caption:13px;
--text-micro:11px;

--leading-tight:1.08;
--leading-snug:1.22;
--leading-normal:1.45;
--leading-relaxed:1.6;

--tracking-tight:-0.022em;
--tracking-normal:0;
--tracking-wide:0.03em;
--tracking-eyebrow:0.11em;
--tracking-caps:0.04em;

/* --- Spacing --- */
--space-0:0px;
--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;
--space-32:128px;

--section-padding-y:80px;
--section-padding-y-lg:112px;
--card-padding:24px;
--card-padding-lg:32px;
--stack-gap:16px;
--grid-gap:24px;

/* --- Radius --- */
--radius-none:0px;
--radius-sm:2px;
--radius-md:4px;
--radius-lg:8px;
--radius-xl:14px;
--radius-2xl:20px;
--radius-pill:999px;
--radius-button:3px;
--radius-card:6px;
--radius-icon-tile:14px;
--radius-panel:10px;

/* --- Elevation --- */
--shadow-none:none;
--shadow-xs:0 1px 2px rgba(35,35,35,.06);
--shadow-sm:0 2px 6px rgba(35,35,35,.07);
--shadow-md:0 6px 18px rgba(35,35,35,.09);
--shadow-lg:0 16px 40px rgba(35,35,35,.13);
--shadow-panel:0 24px 60px rgba(20,20,26,.28);
--shadow-inset-hairline:inset 0 -1px 0 var(--border-subtle);
--ring-accent:0 0 0 2px var(--color-wine-200);
--ring-focus:0 0 0 3px rgba(180,41,80,.35);

/* --- Motion --- */
--duration-instant:80ms;
--duration-fast:150ms;
--duration-base:240ms;
--duration-slow:400ms;
--duration-slide:600ms;
--ease-standard:cubic-bezier(.2,0,.2,1);
--ease-out:cubic-bezier(.16,1,.3,1);
--ease-in-out:cubic-bezier(.45,0,.55,1);
--transition-base:all var(--duration-base) var(--ease-standard);
--transition-colors:background-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard);

/* --- Layout --- */
--container-max:1240px;
--container-wide:1440px;
--container-narrow:760px;
--gutter:40px;
--gutter-sm:20px;
--header-height:72px;
--rule-thickness:2px;
--hairline:1px;
}

/* --- Base --- */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:var(--font-sans);font-size:var(--text-body);line-height:var(--leading-normal);color:var(--text-ink);background:var(--surface-page);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{margin:0;font-family:var(--font-display);color:var(--text-heading);line-height:var(--leading-snug)}
h1,h2{font-weight:var(--font-weight-heading);letter-spacing:var(--tracking-tight)}
h3,h4,h5,h6{font-weight:var(--font-weight-bold);letter-spacing:-0.012em}
p{margin:0}
a{color:var(--text-accent);text-decoration:none;transition:var(--transition-colors)}
a:hover{color:var(--color-wine-900);text-decoration:underline;text-underline-offset:3px}
img{max-width:100%;display:block}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
