/* ==========================================================================
   tokens.css — Matěj Mandelík · the only file with literal colours, fonts, sizes, radii, shadows and timings.
   Values taken from the Claude Design export (design kept 1:1). Contrast ratios measured with contrast.py.
   Changed for WCAG AA (lightness only, hue kept): --c-star, --c-accent-text-end, --c-btn-end, --c-control-line.
   ========================================================================== */

@font-face { font-family: "Instrument Sans"; src: url("../fonts/instrument-sans.woff2") format("woff2"); font-weight: 400 600; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0100-017F, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+20B8, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Geist"; src: url("../fonts/geist.woff2") format("woff2"); font-weight: 300 600; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0100-017F, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+20B8, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Geist Mono"; src: url("../fonts/geist-mono.woff2") format("woff2"); font-weight: 400 500; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0100-017F, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+20B8, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  /* Neutrals (light surfaces) */
  --c-ink: #08100D;            /* 18.4:1 on --c-bg */
  --c-ink-2: #2A322F;          /* 11.8:1 on --c-bg-2 */
  --c-muted: #5C6763;          /* 5.25:1 on --c-bg-2, 5.87:1 on white */
  --c-bg: #F8FAF9;
  --c-bg-2: #EFF3F1;
  --c-bg-3: #E6EDEA;           /* bar tracks */
  --c-white: #FFFFFF;
  --c-black: #000000;
  --c-line: #E1E6E3;           /* decorative dividers */
  --c-line-soft: #C2CCC7;      /* chip outlines (text inside identifies the control) */
  --c-control-line: #7A9085;   /* slider track · 3.06:1 on --c-bg-2 */
  --c-ink-a04: rgba(8, 16, 13, 0.04);
  --c-ink-a08: rgba(8, 16, 13, 0.08);
  --c-ink-a10: rgba(8, 16, 13, 0.1);
  --c-ink-a12: rgba(8, 16, 13, 0.12);
  --c-ink-a14: rgba(8, 16, 13, 0.14);
  --c-ink-a55: rgba(8, 16, 13, 0.55);
  --c-white-a55: rgba(255, 255, 255, 0.55);
  --c-white-a60: rgba(255, 255, 255, 0.6);
  --c-white-a62: rgba(255, 255, 255, 0.62);
  --c-white-a70: rgba(255, 255, 255, 0.7);
  --c-white-a80: rgba(255, 255, 255, 0.8);
  --c-white-a92: rgba(255, 255, 255, 0.92);

  /* Brand */
  --c-brand-900: #0B2B24;      /* dark sections */
  --c-brand-850: #0E312A;      /* inputs on dark */
  --c-brand-800: #0F3D33;
  --c-brand-700: #0E6E5C;      /* accent text on light · 5.89:1 on --c-bg */
  --c-brand-650: #12796A;
  --c-brand-600: #155F4E;
  --c-brand-500: #128570;      /* gradient end under white text · 4.55:1 */
  --c-brand-400: #17A98E;      /* decorative only */
  --c-mint: #4FD1B4;           /* accent on dark · 8.02:1 on --c-brand-900 */
  --c-mint-200: #93E2D0;
  --c-mint-100: #CFEDE4;
  --c-mint-50: #E2F3ED;
  --c-accent-text-end: #16A086;/* gradient headline end, large text · 3.13:1 */
  --c-on-dark: #CFE7E0;        /* 11.67:1 on --c-brand-900 */
  --c-on-dark-2: #DCF0EA;
  --c-on-dark-muted: #9FD6C8;  /* 9.33:1 on --c-brand-900 */
  --c-on-dark-faint: #7FBFAE;  /* 7.19:1 */
  --c-on-dark-dim: #7A8A85;    /* disabled / footer labels · 5.8:1 on black */
  --c-on-sticky: #C4E9DF;      /* ≥ 5.2:1 on the sticky bar's lightest stop */
  --c-footer-line: #16201C;
  --c-error-on-dark: #FFD9CF;  /* 11.6:1 on --c-brand-900 */
  --c-error-line: #F0A48F;
  --c-link: #0E5A4A;
  --c-link-line: rgba(14, 90, 74, 0.35);
  --c-footer-link-line: rgba(207, 231, 224, 0.3);
  --c-on-dark-a18: rgba(247, 248, 250, 0.18);
  --c-star: #B75C0B;           /* rating stars · 4.54:1 on review cards (measured as text) */
  --c-star-off: #64786E;       /* empty star in a 4-star rating · 4.63:1 */
  --c-on-dark-a08: rgba(247, 248, 250, 0.08);
  --c-on-dark-a10: rgba(247, 248, 250, 0.1);
  --c-on-dark-a14: rgba(247, 248, 250, 0.14);
  --c-on-dark-a20: rgba(247, 248, 250, 0.2);
  --c-on-dark-a25: rgba(247, 248, 250, 0.25);
  --c-on-dark-a30: rgba(247, 248, 250, 0.3);
  --c-on-dark-a35: rgba(247, 248, 250, 0.35);
  --c-on-dark-a40: rgba(247, 248, 250, 0.4);
  --c-white-a07: rgba(255, 255, 255, 0.07);
  --c-white-a10: rgba(255, 255, 255, 0.1);
  --c-white-a14: rgba(255, 255, 255, 0.14);
  --c-white-a18: rgba(255, 255, 255, 0.18);
  --c-white-a22: rgba(255, 255, 255, 0.22);
  --c-white-a35: rgba(255, 255, 255, 0.35);
  --c-brand-a05: rgba(23, 169, 142, 0.05);
  --c-brand-a06: rgba(23, 169, 142, 0.06);
  --c-brand-a07: rgba(23, 169, 142, 0.07);
  --c-brand-a09: rgba(23, 169, 142, 0.09);
  --c-brand-a10: rgba(14, 110, 92, 0.1);
  --c-mint-a08: rgba(79, 209, 180, 0.08);
  --c-photo-bg: #A5C7F4;
  --c-google-r: #EA4335;
  --c-google-y: #FBBC05;
  --c-google-g: #34A853;
  --c-google-b: #4285F4;

  /* Gradients (the stop under text is the one that must pass) */
  --g-btn: linear-gradient(100deg, #0F3D33 0%, #12796A 55%, #128570 100%);
  --g-btn-hover: linear-gradient(100deg, #155F4E 0%, #12796A 60%, #128570 100%);
  --g-text: linear-gradient(96deg, #0B2B24 0%, #0E6E5C 46%, #16A086 100%);
  --g-sticky: linear-gradient(100deg, rgba(6, 32, 26, 0.96) 0%, rgba(13, 74, 60, 0.96) 42%, rgba(14, 96, 82, 0.96) 78%, rgba(15, 100, 86, 0.96) 100%); /* end stop darkened for AA under white / --c-on-sticky */
  --g-mesh: radial-gradient(42% 48% at 12% 8%, rgba(23, 169, 142, 0.3), transparent 70%), radial-gradient(38% 42% at 88% 4%, rgba(244, 162, 89, 0.24), transparent 68%), radial-gradient(46% 50% at 70% 82%, rgba(79, 209, 180, 0.24), transparent 72%);
  --g-mesh-dark: radial-gradient(44% 52% at 8% 4%, rgba(23, 169, 142, 0.42), transparent 70%), radial-gradient(40% 44% at 92% 10%, rgba(244, 162, 89, 0.2), transparent 66%), radial-gradient(50% 54% at 62% 92%, rgba(79, 209, 180, 0.26), transparent 72%);
  --g-photo-glow: linear-gradient(140deg, rgba(23, 169, 142, 0.5), rgba(244, 162, 89, 0.38) 55%, rgba(79, 209, 180, 0.5));
  --g-logo: conic-gradient(from -90deg, #0E6E5C 0deg 68deg, transparent 68deg 72deg, #17A98E 72deg 140deg, transparent 140deg 144deg, #4FD1B4 144deg 212deg, transparent 212deg 216deg, #93E2D0 216deg 284deg, transparent 284deg 288deg, #E2F3ED 288deg 356deg, transparent 356deg 360deg);
  --g-google: conic-gradient(from -30deg, #EA4335 0deg 90deg, #FBBC05 90deg 180deg, #34A853 180deg 270deg, #4285F4 270deg 360deg);
  --g-avatar: linear-gradient(135deg, #17A98E, #0F3D33);
  --g-confirm: linear-gradient(155deg, rgba(11, 43, 36, 0.84), rgba(8, 32, 27, 0.9));

  /* Typography */
  --font-display: "Instrument Sans", system-ui, sans-serif;
  --font-body: "Geist", system-ui, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, monospace;
  --fs-label: 12px;            /* smallest text on the site (was 10.5–11 px) */
  --fs-note: 12.5px;
  --fs-xs: 13.5px;
  --fs-sm: 14.5px;
  --fs-md: 15px;
  --fs-md2: 15.5px;
  --fs-base: 16px;
  --fs-base2: 16.5px;
  --fs-lg: 17px;
  --fs-lg2: 17.5px;
  --fs-xl: 18px;
  --fs-num: 19px;
  --fs-num-lg: 24px;
  --fs-stat: 28px;
  --fs-stat-wide: clamp(19px, 4.4vw, 26px);
  --fs-lead: clamp(18px, 1.9vw, 21px);
  --fs-h1: clamp(34px, 5.2vw, 64px);
  --fs-h2: clamp(28px, 4.4vw, 52px);
  --fs-h2b: clamp(28px, 4.2vw, 50px);
  --fs-h2c: clamp(26px, 3.8vw, 44px);
  --fs-h2d: clamp(26px, 4vw, 46px);
  --fs-h3: clamp(24px, 3.2vw, 38px);
  --fs-h3q: clamp(24px, 3.6vw, 40px);
  --fs-h3s: clamp(20px, 2.6vw, 28px);
  --fs-h3t: clamp(22px, 3vw, 32px);
  --fs-h3u: clamp(20px, 2.6vw, 30px);
  --fs-h3v: clamp(24px, 3.2vw, 30px);
  --fs-payment: clamp(36px, 5.6vw, 58px);
  --fs-ring: clamp(20px, 4vw, 28px);
  --fs-path: clamp(19px, 2.4vw, 24px);
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --lh-tight: 1;
  --lh-heading: 1.2;
  --lh-snug: 1.3;
  --lh-body: 1.6;
  --ls-tight-4: -0.042em;
  --ls-tight-3: -0.04em;
  --ls-tight-2: -0.035em;
  --ls-tight-1: -0.032em;
  --ls-tight: -0.03em;
  --ls-tight-0: -0.02em;
  --ls-mono: 0.12em;
  --ls-mono-2: 0.14em;
  --ls-mono-3: 0.16em;
  --ls-mono-4: 0.2em;
  --ls-mono-1: 0.08em;
  --ls-mono-0: 0.1em;

  /* Layout & spacing */
  --container: 1240px;
  --container-narrow: 1000px;
  --gutter: 20px;
  --space-section: clamp(48px, 7vw, 96px);
  --space-section-sm: clamp(40px, 6vw, 80px);
  --tap: 44px;

  /* Shape, elevation, layers, motion */
  --r-sm: 10px;
  --r-md: 12px;
  --r-lg: 14px;
  --r-xl: 18px;
  --r-2xl: 20px;
  --r-card: 22px;
  --r-panel: 24px;
  --r-media: 26px;
  --r-pill: 999px;
  --r-hero-photo: 40% 60% 56% 44% / 30% 38% 62% 70%;
  --r-hero-glow: 42% 58% 52% 48% / 32% 40% 60% 68%;
  --shadow-glass: 0 1px 0 rgba(255, 255, 255, 0.8) inset, 0 20px 60px -30px rgba(8, 16, 13, 0.28);
  --shadow-glass-hover: 0 18px 40px -20px rgba(8, 16, 13, 0.34);
  --shadow-btn: 0 14px 34px -18px rgba(15, 61, 51, 0.7);
  --shadow-btn-hover: 0 14px 28px -12px rgba(23, 169, 142, 0.65);
  --shadow-btn-active: 0 6px 14px -8px rgba(23, 169, 142, 0.55);
  --shadow-soft: 0 10px 22px -14px rgba(6, 32, 26, 0.4);
  --shadow-chip: 0 8px 18px -12px rgba(6, 32, 26, 0.4);
  --shadow-light-hover: 0 14px 30px -12px rgba(6, 32, 26, 0.55);
  --shadow-photo: 0 36px 80px -38px rgba(8, 16, 13, 0.5);
  --shadow-media: 0 30px 70px -34px rgba(8, 16, 13, 0.4);
  --shadow-map: 0 26px 60px -34px rgba(8, 16, 13, 0.38);
  --shadow-dialog: 0 40px 120px rgba(0, 0, 0, 0.35);
  --shadow-sticky: 0 -18px 44px -22px rgba(6, 32, 26, 0.5);
  --blur-glass: blur(18px) saturate(150%);
  --blur-glass-dark: blur(20px) saturate(140%);
  --blur-sticky: blur(22px) saturate(160%);
  --z-header: 40;
  --z-sticky: 50;
  --z-skip: 99;
  --dur-fast: 0.16s;
  --dur-mid: 0.2s;
  --dur-reveal: 0.62s;
  --ease-out: cubic-bezier(0.22, 0.68, 0.2, 1);

  /* Cookie banner (gdpr-consent consent.css) branded to the site's dark glass */
  --consent-bg: #0B2B24;
  --consent-fg: #FFFFFF;
  --consent-muted: #CFE7E0;
  --consent-border: rgba(255, 255, 255, 0.22);
  --consent-btn-bg: #F8FAF9;
  --consent-btn-fg: #08100D;
  --consent-focus: #4FD1B4;
  --consent-shadow: 0 26px 70px -28px rgba(8, 16, 13, 0.55);
  --consent-radius: 22px;
  --consent-font-size: 0.906rem;
  --consent-font-size-small: 0.875rem;
  --consent-z: 70;
}