/* ============================================================
   SAILS DESIGN TOKENS
   Change a value here and it propagates across the whole site.
   Mirrored in theme.json for the block editor.
   ============================================================ */
:root{
  /* colour */
  --color-bg:#02050A;
  --color-bg-secondary:#070D16;
  --color-surface:#0B1320;
  --color-surface-light:#111C2B;
  --color-primary:#19C7F2;
  --color-primary-dark:#087DB5;
  --color-secondary:#1B5CFF;
  --color-text:#FFFFFF;
  --color-text-secondary:#A8B3C2;
  --color-border:rgba(255,255,255,.08);
  --color-border-strong:rgba(25,199,242,.28);

  /* gradients */
  --grad-heading:linear-gradient(100deg,#8FE4FF 0%,#3DD2FA 45%,#19C7F2 100%);
  --grad-cta:linear-gradient(120deg,#19C7F2 0%,#1B5CFF 100%);
  --grad-surface:linear-gradient(160deg,rgba(255,255,255,.05) 0%,rgba(255,255,255,.012) 46%,rgba(25,199,242,.045) 100%);

  /* typography */
  --font-sans:"Plus Jakarta Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --fs-h1:clamp(2.35rem,5.6vw,4.4rem);
  --fs-h2:clamp(1.85rem,3.3vw,2.9rem);
  --fs-h3:clamp(1.2rem,1.5vw,1.5rem);
  --fs-body:clamp(1rem,1.05vw,1.0625rem);
  --fs-small:.8125rem;
  --lh-tight:1.06;
  --lh-body:1.65;

  /* spacing */
  --space-3xs:.25rem;
  --space-2xs:.5rem;
  --space-xs:.75rem;
  --space-sm:1rem;
  --space-md:1.5rem;
  --space-lg:2.5rem;
  --space-xl:4rem;
  --space-2xl:6rem;
  --section-y:clamp(3.75rem,6.4vw,6.5rem);

  /* radius, shadow, motion */
  --radius-sm:8px;
  --radius-md:14px;
  --radius-lg:22px;
  --radius-pill:999px;
  --shadow-card:0 24px 60px -30px rgba(0,0,0,.9);
  --shadow-glow:0 0 0 1px rgba(25,199,242,.18),0 22px 60px -26px rgba(25,199,242,.45);
  --ease:cubic-bezier(.22,.7,.28,1);
  --t-fast:.22s var(--ease);
  --t-med:.42s var(--ease);

  /* layout */
  --container:1240px;
  --gutter:clamp(1.25rem,4vw,2.5rem);
  --header-h:78px;
}