/* ===========================================================================
   ADIDAT DIGITAL — adidat-tokens.css
   Design tokens + base resets shared by every vertical / hub page.
   Palette and type match the homepage: brand indigo + AI teal, Space Grotesk
   display, IBM Plex Sans body. Upload to:  <site root>/css/adidat-tokens.css
   =========================================================================== */

:root{
  /* brand */
  --brand:#3A5AF0; --brand-d:#2743C6; --brand-l:#7A92FA; --brand-2:#5A76F5;
  --brand-tint:rgba(58,90,240,.08); --brand-tint2:rgba(58,90,240,.14);
  --ai:#0FA3A0; --ai-d:#0B7F7C; --ai-tint:rgba(15,163,160,.10); --ai-b:rgba(15,163,160,.26);
  --ok:#16A34A; --ok-tint:rgba(22,163,74,.10); --ok-b:rgba(22,163,74,.24);
  --bad:#E23D4B; --bad-tint:rgba(226,61,75,.07);
  --star:#F59E0B;

  /* surfaces */
  --bg:#F4F6FC; --bg2:#EAEEF8; --card:#FFFFFF; --card2:#F7F9FD; --card3:#EFF2F9; --input:#EDF0F8;

  /* ink */
  --ink:#0C1020; --ink2:#39415A; --ink3:#69728C; --ink4:#9AA3B8;

  /* lines + shadows */
  --line:rgba(14,20,45,.08); --line2:rgba(14,20,45,.14); --line3:rgba(14,20,45,.22);
  --sh1:0 1px 2px rgba(14,20,45,.05),0 3px 10px rgba(14,20,45,.05);
  --sh2:0 12px 34px -14px rgba(14,20,45,.20);
  --sh3:0 40px 80px -30px rgba(30,44,120,.34);

  /* radii + metrics + type */
  --r:12px; --r2:18px; --r3:26px; --rp:999px;
  --mx:1180px;
  --dsp:"Space Grotesk",system-ui,sans-serif;
  --txt:"IBM Plex Sans",system-ui,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--txt);background:var(--bg);color:var(--ink2);
  font-size:16px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
body::before{
  content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(60% 40% at 82% -8%,rgba(58,90,240,.07),transparent 60%),
    radial-gradient(46% 34% at 10% 4%,rgba(15,163,160,.05),transparent 60%);
}
a{text-decoration:none;color:inherit}
ul{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
img,svg{display:block;max-width:100%}
em{font-style:normal;color:var(--brand)}
::selection{background:var(--brand-tint2);color:var(--ink)}

/* skip link + scroll progress bar */
.skip{
  position:absolute;left:-9999px;top:0;z-index:300;background:var(--brand);color:#fff;
  padding:10px 16px;border-radius:0 0 var(--r) 0;font-family:var(--dsp);font-weight:600;
}
.skip:focus{left:0}
#scrollbar{
  position:fixed;top:0;left:0;height:3px;width:0;z-index:200;
  background:linear-gradient(90deg,var(--brand),var(--ai));transition:width .1s linear;
}