/* NFT Global Validity — design tokens
   The first block is fixed by 00-system-specification.md ("UI-rendszer").
   Every further value is taken from the design package source CSS
   (source/design.css, source/home.css, source/site-footer.css) — never sampled
   from a mockup image. The origin of each extra token is noted next to it.
   This file moves unchanged to app/static/css/tokens.css. */

/* --- Self-hosted fonts (work/betuk-letoltese.sh) ---
   The mockups use Arial / Arial Black. Where those are installed they are
   used directly (local()); elsewhere the metric-compatible Arimo (OFL) and
   Archivo Black (OFL) files are loaded, so the layout stays identical. */
@font-face {
  font-family: "NGV Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("Arial"), local("ArialMT"),
       url("../fonts/arimo-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "NGV Sans";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local("Arial Bold"), local("Arial-BoldMT"),
       url("../fonts/arimo-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "NGV Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("Arial"), local("ArialMT"),
       url("../fonts/arimo-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
                 U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB,
                 U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "NGV Sans";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local("Arial Bold"), local("Arial-BoldMT"),
       url("../fonts/arimo-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
                 U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB,
                 U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "NGV Display";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: local("Arial Black"), local("Arial-Black"),
       url("../fonts/archivo-black-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "NGV Display";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: local("Arial Black"), local("Arial-Black"),
       url("../fonts/archivo-black-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
                 U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB,
                 U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* --- Fixed by the system specification --- */
  --color-bg:         #080B12;
  --color-panel:      #111723;
  --color-accent:     #00E2E9;
  --color-text:       #EDF1F8;
  --color-text-muted: #A9B5C8;
  --color-paper:      #FBFAF5;
  --color-gold:       #AE995A;

  /* --- Surfaces --- */
  --color-bg-deep:       #090C14;  /* home.css .hero */
  --color-surface:       #0C111C;  /* design.css aside */
  --color-field:         #0A101B;  /* design.css input */
  --color-overlay:       rgba(2, 5, 11, 0.85);   /* home.css dialog::backdrop */
  --color-map-fade:      rgba(8, 11, 18, 0.5);   /* home.css .map:after */
  --color-map-veil:      rgba(8, 11, 18, 0.74);  /* world-map backdrop of the inner public pages (2026-10-18) */
  --color-ghost-fill:    rgba(9, 12, 20, 0.5);   /* home.css .secondary */

  /* --- Text --- */
  --color-text-subtle:   #7E8DA4;  /* design.css .muted */
  --color-text-footer:   #B6C4D8;  /* site-footer.css links */
  --color-text-faint:    #718298;  /* site-footer.css .footer-bottom */
  --color-on-accent:     #061319;  /* design.css .btn */
  --color-label:         #B3BFD1;  /* design.css label */

  /* --- Lines --- */
  --color-rule:          #1C2634;  /* design.css header border */
  --color-border:        #223044;  /* design.css .card */
  --color-rule-footer:   #253044;  /* site-footer.css */
  --color-line:          #253346;  /* design.css .line */
  --color-field-border:  #2D3B50;  /* design.css input */
  --color-menu-border:   #36434F;  /* home.css .menu */
  --color-outline-line:  #344459;  /* design.css .outline */

  /* --- Home hero buttons (home.css) --- */
  --color-btn-light:       #EEF1F6;
  --color-btn-light-text:  #131922;
  --color-btn-ghost-line:  #AAB0BB;
  --color-page-mark:       #666C78; /* home.css .page-mark (#666), aligned to the blue-grey scale */

  /* --- Brand mark (home.css .brand svg stroke) --- */
  --color-brand-mark:      #03CFFE;
  --color-brand-glow:      rgba(0, 191, 255, 0.25);

  /* --- Booking (design.css .tabs / .calendar / .slots / .notice / .state-banner) --- */
  --color-tab-line:        #263449;
  --color-tab-selected-bg: rgba(0, 226, 233, 0.094);
  --color-cal-line:        #293B51;
  --color-slot-line:       #344B66;
  --color-notice-bg:       rgba(0, 216, 223, 0.043);
  --color-notice-line:     rgba(0, 216, 223, 0.19);
  --color-notice-text:     #8EDCE0;
  --color-success-line:    rgba(0, 221, 179, 0.267);
  --color-success-text:    #9EDFCC;
  --color-warning-line:    rgba(215, 170, 74, 0.31);   /* .state-banner.expired */
  --color-warning-text:    #D7BA7C;
  --color-neutral-bg:      rgba(38, 53, 71, 0.31);     /* .state-banner.notfound */
  --color-neutral-line:    #465B73;
  --color-neutral-text:    #B4C4D8;
  --color-draft-bg:        rgba(189, 158, 82, 0.04);   /* design.css .legal-draft */
  --color-draft-line:      rgba(189, 158, 82, 0.23);
  --color-draft-text:      #D2BC88;

  /* --- Certificate paper (design.css .certificate-page / .paper) --- */
  --color-paper-desk:      #EBE9E2;
  --color-ink:             #172537;
  --color-ink-muted:       #596372;
  --color-paper-frame:     #B6A878;
  --color-paper-inner:     #D2C6A0;
  --color-paper-rule:      #C9BF9C;
  --color-paper-kicker:    #948044;
  --color-paper-card:      #F1F0E9;
  --color-paper-card-line: #DED9C6;
  --color-paper-label:     #887C5B;
  --color-paper-alert:     #8E3B33;   /* revoked / expired stamp on the ivory paper (contrast ≥ 7:1) */

  /* --- Status — always paired with a text label (system specification) --- */
  --color-success:         #62E3BE; /* design.css .badge */
  --color-success-bg:      rgba(0, 221, 179, 0.10);
  --color-warning:         #E1B457; /* design.css .pending */
  --color-warning-bg:      rgba(229, 174, 50, 0.11);
  --color-danger:          #DE9D97; /* design.css .state-banner.revoked */
  --color-danger-bg:       rgba(216, 109, 102, 0.06);
  --color-danger-line:     rgba(216, 109, 102, 0.31);

  /* --- Typography --- */
  --font-sans:    "NGV Sans", Arial, Helvetica, sans-serif;
  --font-display: "NGV Display", "Arial Black", "NGV Sans", Arial, sans-serif;

  --fs-11: 0.6875rem;  /* uppercase kickers only (letter-spaced, high contrast) */
  --fs-12: 0.75rem;
  --fs-13: 0.8125rem;
  --fs-14: 0.875rem;   /* body minimum (CLAUDE.md 7.) */
  --fs-15: 0.9375rem;
  --fs-16: 1rem;
  --fs-17: 1.0625rem;
  --fs-24: 1.5rem;
  --fs-28: 1.75rem;
  --fs-30: 1.875rem;   /* design.css .number */
  --fs-33: 2.0625rem;  /* design.css h1 on mobile */
  --fs-40: 2.5rem;
  --fs-44: 2.75rem;
  --fs-hero: clamp(2.125rem, 3.85vw, 3.25rem);   /* home.css h1: 34–52 px */

  --lh-tight: 1.03;
  --lh-snug:  1.15;
  --lh-heading: 1.12;  /* design.css h1 */
  --lh-body:  1.45;
  --lh-loose: 1.65;

  --ls-hero:    -0.1125rem; /* -1.8 px */
  --ls-eyebrow: 0.336em;    /* home.css .eyebrow: 3.7 px at 11 px */
  --ls-kicker:  0.22em;     /* site-footer.css .kicker: 2 px at 9 px */
  --ls-section: 0.3em;      /* design.css .kicker: 3 px at 10 px */
  --ls-h2:      -0.0375rem; /* design.css h2: -0.6 px */
  --ls-button:  0.1em;

  /* --- Spacing (4 px grid, named by multiplier) --- */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-7:  1.75rem;
  --space-8:  2rem;
  --space-9:  2.25rem;
  --space-10: 2.5rem;
  --space-11: 2.75rem;
  --space-12: 3rem;
  --space-14: 3.5rem;
  --space-15: 3.75rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-21: 5.25rem;
  --space-25: 6.25rem;

  /* --- Shape, motion, layout --- */
  --radius-sm: 2px;
  --radius:    4px;
  --radius-md: 6px;
  --radius-lg: 8px;

  --duration: 200ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);

  --content-max: 1180px;   /* public pages (CLAUDE.md 7.) */
  --header-max:  1280px;   /* home.css .header */
  --header-h: 80px;        /* design.css header — every public page except Home */
  --header-h-home: 74px;
  --header-h-home-mobile: 68px;
  --focus-ring: 2px solid var(--color-accent);
}