/* i-square.be — design tokens. Sibling of i-square digital: same structure, own palette & type. */
:root{
/* Logo gradient stops (fixed — the mark never changes) */
--sky-50:#E2F2FC;--sky-100:#B3E1F8;--sky-300:#6CC6F2;--cyan:#00B9EE;--cerulean:#009EE2;--deep:#0B6FAE;--navy:#0D2A3F;
--graphite:#4A4A49;--amber:#F2A33A;--amber-ink:#9A5A00;
--grad-logo:linear-gradient(90deg,#E2F2FC 0%,#B3E1F8 25%,#6CC6F2 50%,#00B9EE 67%,#009EE2 100%);
/* Role tokens (driven by palette tweak) */
--paper:#FFFFFF;--paper-2:#F4F8FB;--paper-3:#E9F1F7;--line:#DCE6EE;
--ink:#2B2C2E;--ink-70:#4A4A49;--ink-50:#6B6E72;--ink-20:#C3C9CF;
--accent:#009EE2;--accent-ink:#0077B6;--accent-2:#00B9EE;--on-accent:#FFFFFF;
--hero-bg:#0D2A3F;--hero-ink:#FFFFFF;--hero-mute:rgba(255,255,255,.72);
--grad:linear-gradient(90deg,#6CC6F2 0%,#00B9EE 45%,#009EE2 100%);
--grad-soft:linear-gradient(135deg,rgba(108,198,242,.16),rgba(0,158,226,.10));
--glow-1:rgba(0,185,238,.30);--glow-2:rgba(108,198,242,.22);
/* Type (driven by type tweak) */
--font-sans:"Outfit",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
--font-display:"Outfit",ui-sans-serif,system-ui,sans-serif;
--display-weight:500;--display-track:-.025em;
--font-mono:"DM Mono",ui-monospace,"SF Mono",Menlo,monospace;
--font-logo:"Roboto",ui-sans-serif,system-ui,sans-serif;
/* Scale / space / radii */
--s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:24px;--s-6:32px;--s-7:48px;--s-8:64px;--s-9:96px;
--r-sm:4px;--r-md:10px;--r-lg:16px;--r-xl:24px;--r-pill:999px;
--sh-1:0 1px 2px rgba(13,42,63,.06);--sh-2:0 8px 24px rgba(13,42,63,.08);--sh-3:0 24px 60px rgba(13,42,63,.14);
}
/* Palette B — logo blues + Belgian amber */
[data-palette="amber"]{--accent-2:#F2A33A;--hero-bg:#0D2A3F;--glow-2:rgba(242,163,58,.20);
--grad:linear-gradient(90deg,#00B9EE 0%,#009EE2 60%,#0B6FAE 100%);}
/* Palette C — graphite monochrome, cyan as sole accent */
[data-palette="graphite"]{--paper-2:#F4F4F4;--paper-3:#EBEBEB;--line:#E0E0E0;--ink:#1F1F1F;--ink-70:#4A4A49;--ink-50:#707070;
--accent:#00B9EE;--accent-ink:#0077B6;--accent-2:#00B9EE;--hero-bg:#2B2B2A;--glow-1:rgba(0,185,238,.22);--glow-2:rgba(255,255,255,.05);
--grad:linear-gradient(90deg,#00B9EE,#00B9EE);--grad-soft:linear-gradient(135deg,rgba(0,0,0,.03),rgba(0,0,0,.03));}
[data-flat="true"]{--grad:var(--accent)!important}
/* Dark surface */
.dark,[data-theme="dark"]{--paper:#0D2A3F;--paper-2:#11344D;--paper-3:#163E5B;--line:#21496A;--ink:#F2F7FA;--ink-70:#C9D8E3;--ink-50:#8FA8BA;--ink-20:#355A78;--accent-ink:#6CC6F2;--hero-bg:#081C2B}
.dark[data-palette="graphite"],[data-palette="graphite"][data-theme="dark"]{--paper:#1F1F1F;--paper-2:#2A2A2A;--paper-3:#333;--line:#3A3A3A;--ink-70:#D0D0D0;--ink-50:#9A9A9A;--hero-bg:#141414}
/* Type pairings */
[data-fonts="serif"]{--font-display:"Instrument Serif",Georgia,serif;--display-weight:400;--display-track:-.01em}
[data-fonts="digital"]{--font-sans:"Manrope",ui-sans-serif,system-ui,sans-serif;--font-display:"Manrope",ui-sans-serif,sans-serif;--display-weight:700;--display-track:-.03em;--font-mono:"JetBrains Mono",ui-monospace,monospace}
/* Language visibility */
[data-lang="en"] [data-l]:not([data-l="en"]),[data-lang="nl"] [data-l]:not([data-l="nl"]),[data-lang="fr"] [data-l]:not([data-l="fr"]){display:none!important}
html:not([data-lang]) [data-l]:not([data-l="en"]){display:none!important}
/* Base */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--font-sans);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:var(--accent-ink);text-decoration:none}a:hover{color:var(--ink)}
::selection{background:var(--cyan);color:#fff}
.mono{font-family:var(--font-mono)}
.display{font-family:var(--font-display);font-weight:var(--display-weight);letter-spacing:var(--display-track)}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-50)}
.btn{display:inline-flex;align-items:center;gap:8px;font:500 15px/1 var(--font-sans);padding:13px 22px;border-radius:var(--r-pill);border:1px solid transparent;cursor:pointer;transition:transform .15s,box-shadow .2s,background .2s}
.btn-primary{background:var(--accent-ink);color:#fff}.btn-primary:hover{color:#fff;transform:translateY(-1px);box-shadow:var(--sh-2)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--ink-20)}.btn-ghost:hover{border-color:var(--ink)}
.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--r-pill);font-size:13px;font-weight:500;background:var(--paper-2);color:var(--ink-70);border:1px solid var(--line)}
