/*
 * GENERATED by tools/build.mjs from design/tokens.json v1.1.0 – do not edit by hand.
 * Light values on :root; the dark theme is defined twice (system preference and data-theme="dark")
 * from the same source, so the two blocks cannot drift apart. Extension tokens: base.css.
 */
:root {
  --bg: #FFFFFF;
  --bg-2: #F1F6FA;
  --bg-3: #E3EDF5;
  --surface: #FFFFFF;
  --surface-2: #F6F9FC;
  --surface-3: #EAF2F8;
  --text: #001E38;
  --text-2: #354B66;
  --text-3: #536A86;
  --line: #D6E1EB;
  --line-2: #BCCDDE;
  --field: #6F86A3;
  --link: #0467AD;
  --link-hover: #03538C;
  --focus: #0467AD;
  --focus-on-navy: #FFED00;
  --navy: #003061;
  --navy-deep: #001E38;
  --navy-ink: #00152A;
  --on-navy: #FFFFFF;
  --on-navy-2: #BFD3EA;
  --navy-line: rgba(191,211,234,0.20);
  --sky: #2EA3F2;
  --on-sky: #001E38;
  --sky-soft: #6CC0F8;
  --blue: #0467AD;
  --footer-bar: #0C71C3;
  --on-footer-bar: #FFFFFF;
  --mountain: #007FC3;
  --hero-1: #04598D;
  --hero-2: #004A73;
  --hero-3: #000B11;
  --yellow: #FFED00;
  --yellow-hover: #F3D90D;
  --yellow-press: #E2CA00;
  --on-yellow: #001E38;
  --band-yellow: #FFED00;
  --ice: #BDE3E8;
  --ice-soft: #DDF0F4;
  --on-ice: #0B4A63;
  --btn-2: #003061;
  --btn-2-hover: #001E38;
  --on-btn-2: #FFFFFF;
  --sel: #003061;
  --on-sel: #FFFFFF;
  --success: #0E7A43;
  --success-bg: #E7F5EC;
  --warning: #8A4B00;
  --warning-ink: #7A4A00;
  --warning-bg: #FFF4C2;
  --danger: #B3261E;
  --danger-bg: #FCEDEC;
  --info: #0467AD;
  --info-bg: #E8F3FC;
  --logo-tile: #FFFFFF;
  --ridge-snow: #FFFFFF;
  --ridge-shade: #BDE3E8;
  --mtn-back: #007FC3;
  --mtn-back-opacity: 0.38;
  --scrim: rgba(0,21,42,0.55);
  --tone-info-bg: #E8F3FC;
  --tone-info-text: #0467AD;
  --tone-progress-bg: #DDF0F4;
  --tone-progress-text: #0B4A63;
  --tone-success-bg: #E7F5EC;
  --tone-success-text: #0E7A43;
  --tone-warning-bg: #FFF4C2;
  --tone-warning-text: #7A4A00;
  --tone-danger-bg: #FCEDEC;
  --tone-danger-text: #B3261E;
  --tone-neutral-bg: #EAF2F8;
  --tone-neutral-text: #354B66;
  --e1: 0 1px 2px rgba(0,30,56,0.06), 0 6px 18px rgba(0,30,56,0.07);
  --e2: 0 18px 48px rgba(0,30,56,0.18);
  --e3: 0 24px 64px rgba(0,30,56,0.28);
  --button-inset: inset 0 -2px 0 rgba(0,30,56,0.14);

  /* Jégstúdió constants (identical in both themes; baked into the renders) */
  --studio-back-top: #001A33;
  --studio-back-mid: #07558C;
  --studio-floor: #06446F;
  --studio-stage: #05436F;
  --dimension-line: #A6DAFF;
  --dimension-label-bg: rgba(0,21,42,0.64);
  --loupe-ring: #2EA3F2;

  /* Happy Solutions constants (footer credit only; --hs-* is reserved for Happy) */
  --hs-cream: #FDF7F1;
  --hs-wordmark: #F87317;

  /* Brand gradient: the only CSS gradient on the site */
  --hero-gradient: linear-gradient(180deg, var(--hero-1) 0%, var(--hero-2) 58%, var(--hero-3) 100%);

  /* Type */
  --font-display: "Archivo", "Arial Narrow", "Roboto Condensed", "Helvetica Neue", Arial, sans-serif;
  --font-ui: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --fs-display-xl: clamp(2.75rem, 1.45rem + 5.2vw, 6rem); --lh-display-xl: 0.92; --fw-display-xl: 800; --wdth-display-xl: 75%; --ls-display-xl: -0.012em;
  --fs-display-l: clamp(2.25rem, 1.6rem + 2.9vw, 4rem); --lh-display-l: 0.95; --fw-display-l: 800; --wdth-display-l: 75%; --ls-display-l: -0.01em;
  --fs-h2: clamp(2rem, 1.3rem + 2.5vw, 3.375rem); --lh-h2: 0.98; --fw-h2: 800; --wdth-h2: 75%; --ls-h2: -0.008em;
  --fs-h3: clamp(1.3125rem, 1.12rem + 0.7vw, 1.75rem); --lh-h3: 1.1; --fw-h3: 700; --wdth-h3: 87.5%; --ls-h3: -0.005em;
  --fs-h4: 1.125rem; --lh-h4: 1.3; --fw-h4: 700; --wdth-h4: 100%; --ls-h4: 0;
  --fs-lead: clamp(1.0625rem, 1rem + 0.32vw, 1.25rem); --lh-lead: 1.5; --fw-lead: 400; --wdth-lead: 100%; --ls-lead: 0;
  --fs-body: 1rem; --lh-body: 1.5625; --fw-body: 400; --wdth-body: 100%; --ls-body: 0;
  --fs-body-s: 0.875rem; --lh-body-s: 1.45; --fw-body-s: 400; --wdth-body-s: 100%; --ls-body-s: 0;
  --fs-caption: 0.8125rem; --lh-caption: 1.4; --fw-caption: 500; --wdth-caption: 100%; --ls-caption: 0.005em;
  --fs-label: 0.875rem; --lh-label: 1.3; --fw-label: 600; --wdth-label: 100%; --ls-label: 0;
  --fs-button: 1rem; --lh-button: 1; --fw-button: 700; --wdth-button: 100%; --ls-button: 0.005em;
  --fs-button-s: 0.875rem; --lh-button-s: 1; --fw-button-s: 700; --wdth-button-s: 100%; --ls-button-s: 0.005em;
  --fs-nav: 1rem; --lh-nav: 1; --fw-nav: 600; --wdth-nav: 100%; --ls-nav: 0;
  --fs-utility: 0.8125rem; --lh-utility: 1.2; --fw-utility: 500; --wdth-utility: 100%; --ls-utility: 0;
  --fs-price-xl: clamp(2.25rem, 1.9rem + 1.4vw, 3rem); --lh-price-xl: 1; --fw-price-xl: 800; --wdth-price-xl: 87.5%; --ls-price-xl: -0.01em;
  --fs-price-l: 1.625rem; --lh-price-l: 1.05; --fw-price-l: 800; --wdth-price-l: 87.5%; --ls-price-l: -0.005em;
  --fs-price-m: 1.25rem; --lh-price-m: 1.1; --fw-price-m: 800; --wdth-price-m: 87.5%; --ls-price-m: 0;
  --fs-badge: 0.75rem; --lh-badge: 1; --fw-badge: 700; --wdth-badge: 100%; --ls-badge: 0.01em;

  /* Space, layout */
  --space-0: 0px; --space-1: 2px; --space-2: 4px; --space-3: 8px; --space-4: 12px; --space-5: 16px; --space-6: 20px; --space-7: 24px; --space-8: 32px; --space-9: 40px; --space-10: 48px; --space-11: 64px; --space-12: 80px; --space-13: 96px; --space-14: 128px;
  --section-y: clamp(56px, 3.6vw + 40px, 112px);
  --gutter: clamp(16px, 4vw, 40px);
  --container-max: 1320px;
  --content-max: 1240px;
  --text-max: 760px;
  --sidebar-w: 280px;
  --utility-h: 36px;
  --header-h: 80px;
  --header-h-mobile: 60px;
  --subnav-h: 52px;
  --touch: 44px;

  /* Shape */
  --radius-xs: 3px; --radius-s: 6px; --radius-m: 10px; --radius-l: 16px; --radius-round: 999px;
  --radius-phone-screen: 55px; --radius-phone-body: 67px;

  /* Motion */
  --dur-instant: 80ms; --dur-fast: 150ms; --dur-base: 200ms; --dur-slow: 280ms;
  --dur-meter-cell: 120ms; --dur-meter-stagger: 20ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1); --ease-exit: cubic-bezier(0.4, 0, 1, 1); --ease-emphasized: cubic-bezier(0.3, 0, 0, 1.15);

  /* Layers */
  --z-subnav: 90; --z-header: 100; --z-dropdown: 110; --z-backdrop: 190;
  --z-drawer: 200; --z-palette: 300; --z-modal: 300; --z-cookie: 350; --z-toast: 400; --z-skip: 1000;

  /* Phone frame for the /mobile page (natural titanium) */
  --phone-screen-w: 402px; --phone-screen-h: 874px;
  --phone-outer-w: 426px; --phone-outer-h: 898px;
  --phone-black-bezel: 8px; --phone-titanium-band: 4px;
  --phone-titanium-edge-light: #E3E5E8; --phone-titanium-light: #CDD0D4; --phone-titanium-base: #B9BCC0;
  --phone-titanium-shade: #8D9196; --phone-titanium-button: #A4A8AD; --phone-bezel: #050608;
  --phone-shadow: 0 2px 4px rgba(0,21,42,0.20), 0 30px 60px -10px rgba(0,21,42,0.45), 0 60px 120px -30px rgba(0,21,42,0.35);

  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #001326;
    --bg-2: #00182F;
    --bg-3: #03213F;
    --surface: #031D36;
    --surface-2: #062646;
    --surface-3: #0A2E52;
    --text: #E6F0FA;
    --text-2: #B2C6DB;
    --text-3: #8BA6C2;
    --line: #0F3257;
    --line-2: #184371;
    --field: #5481AE;
    --link: #6CC0F8;
    --link-hover: #9AD3FF;
    --focus: #FFED00;
    --focus-on-navy: #FFED00;
    --navy: #002A55;
    --navy-deep: #000F1F;
    --navy-ink: #000A15;
    --on-navy: #FFFFFF;
    --on-navy-2: #BFD3EA;
    --navy-line: rgba(191,211,234,0.16);
    --sky: #1C8FDB;
    --on-sky: #001E38;
    --sky-soft: #6CC0F8;
    --blue: #6CC0F8;
    --footer-bar: #0A5FA6;
    --on-footer-bar: #FFFFFF;
    --mountain: #007FC3;
    --hero-1: #002A55;
    --hero-2: #003F66;
    --hero-3: #000F1F;
    --yellow: #FFED00;
    --yellow-hover: #F3D90D;
    --yellow-press: #E2CA00;
    --on-yellow: #001E38;
    --band-yellow: #F3D90D;
    --ice: #BDE3E8;
    --ice-soft: #0B3550;
    --on-ice: #BDE3E8;
    --btn-2: #0C71C3;
    --btn-2-hover: #0A5FA6;
    --on-btn-2: #FFFFFF;
    --sel: #2EA3F2;
    --on-sel: #00152A;
    --success: #5BD08A;
    --success-bg: #0D2E22;
    --warning: #FFC857;
    --warning-ink: #FFC857;
    --warning-bg: #33270A;
    --danger: #FF8A80;
    --danger-bg: #3A1416;
    --info: #6CC0F8;
    --info-bg: #0A2A4A;
    --logo-tile: #FFFFFF;
    --ridge-snow: #001326;
    --ridge-shade: #062646;
    --mtn-back: #007FC3;
    --mtn-back-opacity: 0.22;
    --scrim: rgba(0,8,18,0.70);
    --tone-info-bg: #0A2A4A;
    --tone-info-text: #6CC0F8;
    --tone-progress-bg: #0B3550;
    --tone-progress-text: #BDE3E8;
    --tone-success-bg: #0D2E22;
    --tone-success-text: #5BD08A;
    --tone-warning-bg: #33270A;
    --tone-warning-text: #FFC857;
    --tone-danger-bg: #3A1416;
    --tone-danger-text: #FF8A80;
    --tone-neutral-bg: #0A2E52;
    --tone-neutral-text: #B2C6DB;
    --e1: 0 1px 2px rgba(0,0,0,0.35), 0 6px 18px rgba(0,0,0,0.28);
    --e2: 0 18px 48px rgba(0,0,0,0.50);
    --e3: 0 24px 64px rgba(0,0,0,0.60);
    --button-inset: inset 0 -2px 0 rgba(0,0,0,0.25);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg: #001326;
  --bg-2: #00182F;
  --bg-3: #03213F;
  --surface: #031D36;
  --surface-2: #062646;
  --surface-3: #0A2E52;
  --text: #E6F0FA;
  --text-2: #B2C6DB;
  --text-3: #8BA6C2;
  --line: #0F3257;
  --line-2: #184371;
  --field: #5481AE;
  --link: #6CC0F8;
  --link-hover: #9AD3FF;
  --focus: #FFED00;
  --focus-on-navy: #FFED00;
  --navy: #002A55;
  --navy-deep: #000F1F;
  --navy-ink: #000A15;
  --on-navy: #FFFFFF;
  --on-navy-2: #BFD3EA;
  --navy-line: rgba(191,211,234,0.16);
  --sky: #1C8FDB;
  --on-sky: #001E38;
  --sky-soft: #6CC0F8;
  --blue: #6CC0F8;
  --footer-bar: #0A5FA6;
  --on-footer-bar: #FFFFFF;
  --mountain: #007FC3;
  --hero-1: #002A55;
  --hero-2: #003F66;
  --hero-3: #000F1F;
  --yellow: #FFED00;
  --yellow-hover: #F3D90D;
  --yellow-press: #E2CA00;
  --on-yellow: #001E38;
  --band-yellow: #F3D90D;
  --ice: #BDE3E8;
  --ice-soft: #0B3550;
  --on-ice: #BDE3E8;
  --btn-2: #0C71C3;
  --btn-2-hover: #0A5FA6;
  --on-btn-2: #FFFFFF;
  --sel: #2EA3F2;
  --on-sel: #00152A;
  --success: #5BD08A;
  --success-bg: #0D2E22;
  --warning: #FFC857;
  --warning-ink: #FFC857;
  --warning-bg: #33270A;
  --danger: #FF8A80;
  --danger-bg: #3A1416;
  --info: #6CC0F8;
  --info-bg: #0A2A4A;
  --logo-tile: #FFFFFF;
  --ridge-snow: #001326;
  --ridge-shade: #062646;
  --mtn-back: #007FC3;
  --mtn-back-opacity: 0.22;
  --scrim: rgba(0,8,18,0.70);
  --tone-info-bg: #0A2A4A;
  --tone-info-text: #6CC0F8;
  --tone-progress-bg: #0B3550;
  --tone-progress-text: #BDE3E8;
  --tone-success-bg: #0D2E22;
  --tone-success-text: #5BD08A;
  --tone-warning-bg: #33270A;
  --tone-warning-text: #FFC857;
  --tone-danger-bg: #3A1416;
  --tone-danger-text: #FF8A80;
  --tone-neutral-bg: #0A2E52;
  --tone-neutral-text: #B2C6DB;
  --e1: 0 1px 2px rgba(0,0,0,0.35), 0 6px 18px rgba(0,0,0,0.28);
  --e2: 0 18px 48px rgba(0,0,0,0.50);
  --e3: 0 24px 64px rgba(0,0,0,0.60);
  --button-inset: inset 0 -2px 0 rgba(0,0,0,0.25);
  color-scheme: dark;
}
