/* VESS — Fonts
   Display & body: Inter Tight (brand-specified "Inter Tight Black" for headings).
   Editorial serif italic: Newsreader  ——  SUBSTITUTE for Editorial New / GT Sectra
   (commercial fonts; Newsreader is the closest free literary serif with a true italic).
   Loaded from Google Fonts CDN; both families carry full Czech (Latin Extended). */

@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500&family=Newsreader:ital,opsz,wght@1,6..72,400;1,6..72,500;0,6..72,400;0,6..72,500&display=swap');
/* VESS — Colors
   Institutional / legal "listina" palette: black ground, white text,
   muted grey meta, a single accent red. No second hue. No gradients. */

:root {
  /* ---- Base ground & ink ---- */
  --vess-black: #0A0A0A;        /* primary background ("the page") */
  --vess-white: #FFFFFF;        /* primary text & strong rules */

  /* ---- Secondary / meta text ---- */
  --vess-grey-1: #8A8A8A;       /* secondary text, eyebrows, meta */
  --vess-grey-2: #6A6A6A;       /* tertiary / quietest text */

  /* ---- Accent (the § seal) ---- */
  --vess-red: #e40425;          /* screen accent — seal ring, labels, links */
  --vess-red-print: #b8001c;    /* deeper red for the seal on light paper / print */

  /* ---- Lines / rules ---- */
  --vess-line-weak: #2A2A2A;    /* hairline dividers on black */
  --vess-line-strong: var(--vess-white); /* the framing rules (1.5px) */

  /* ---- Light surface (printed paper / inverse contexts) ---- */
  --vess-paper: #F4F1EC;        /* warm off-white "paper" */
  --vess-paper-ink: #0A0A0A;

  /* ================= Semantic aliases ================= */
  --surface-page: var(--vess-black);
  --surface-paper: var(--vess-paper);

  --text-primary: var(--vess-white);
  --text-secondary: var(--vess-grey-1);
  --text-tertiary: var(--vess-grey-2);
  --text-accent: var(--vess-red);
  --text-on-paper: var(--vess-paper-ink);

  --rule-strong: var(--vess-line-strong);
  --rule-weak: var(--vess-line-weak);
  --rule-accent: var(--vess-red);

  --seal-ring: var(--vess-red);
  --seal-ring-print: var(--vess-red-print);
}
/* VESS — Typography
   Headlines: heavy grotesque, UPPERCASE, negative tracking, centered.
   Subtext / quotes: serif italic. Meta / small: sans, 11–13px, often tracked uppercase. */

:root {
  /* ---- Families ---- */
  --font-display: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; /* headings */
  --font-sans: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif;    /* body, meta */
  --font-serif: 'Newsreader', 'Times New Roman', Georgia, serif;      /* italic subtext/quotes */

  /* ---- Display weights ---- */
  --weight-black: 900;   /* hero titles */
  --weight-extrabold: 800;
  --weight-bold: 700;    /* section headlines */
  --weight-semibold: 600;
  --weight-medium: 500;
  --weight-regular: 400;

  /* ---- Tracking (negative on display, positive on small caps) ---- */
  --track-hero: -0.04em;     /* -3..-4 at large sizes */
  --track-title: -0.025em;   /* section headlines */
  --track-tight: -0.01em;
  --track-label: 0.22em;     /* tracked uppercase eyebrows / nav / meta */
  --track-label-wide: 0.32em;

  /* ---- Display sizes (clamped, responsive) ---- */
  --size-hero: clamp(3.5rem, 11vw, 9.5rem);   /* "VAŠE KAUZA." */
  --size-display: clamp(2.5rem, 6vw, 4.75rem);/* lead story headline */
  --size-title: clamp(1.6rem, 3vw, 2.4rem);   /* column headlines */
  --size-subtitle: clamp(1.15rem, 1.6vw, 1.5rem); /* serif italic lead */

  /* ---- Text sizes ---- */
  --size-body: 1rem;          /* 16px */
  --size-quote: 1.375rem;     /* 22px serif italic pull-quote */
  --size-meta: 0.8125rem;     /* 13px meta */
  --size-small: 0.6875rem;    /* 11px micro label */

  --leading-tight: 0.95;      /* stacked hero lines */
  --leading-snug: 1.1;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;    /* serif reading */

  /* ---- Semantic aliases ---- */
  --text-hero: var(--weight-black) var(--size-hero)/var(--leading-tight) var(--font-display);
  --text-label-track: var(--track-label);
}
/* VESS — Spacing, rules & layout
   No corner radius (institutional, square). No shadows. The signature device is
   the framing rule: a strong 1.5px line top and bottom of every content block. */

:root {
  /* ---- Spacing scale (8px base) ---- */
  --space-0: 0;
  --space-1: 0.25rem;   /* 4 */
  --space-2: 0.5rem;    /* 8 */
  --space-3: 0.75rem;   /* 12 */
  --space-4: 1rem;      /* 16 */
  --space-5: 1.5rem;    /* 24 */
  --space-6: 2rem;      /* 32 */
  --space-7: 3rem;      /* 48 */
  --space-8: 4rem;      /* 64 */
  --space-9: 6rem;      /* 96 */
  --space-10: 8rem;     /* 128 */

  /* ---- Rule (line) weights ---- */
  --rule-w-strong: 1.5px;   /* the framing lines */
  --rule-w-hair: 1px;       /* weak dividers */

  /* ---- Radius — there is none. Kept as a token to enforce 0. ---- */
  --radius-none: 0;

  /* ---- Layout ---- */
  --content-max: 1180px;    /* framed content column */
  --content-narrow: 720px;  /* reading measure */
  --page-gutter: clamp(1.25rem, 4vw, 4rem); /* @kind spacing */

  /* ---- Seal sizing ---- */
  --seal-sm: 28px;   /* inline by wordmark */
  --seal-md: 40px;
  --seal-lg: 96px;   /* feature lockup */

  /* ---- Motion (restrained — no bounce) ---- */
  --ease-standard: cubic-bezier(0.2, 0, 0, 1); /* @kind other */
  --dur-fast: 120ms; /* @kind other */
  --dur-base: 220ms; /* @kind other */
}
/* VESS — interaction states for primitives.
   Restrained: no scale/bounce. Hover shifts toward the single accent red or
   inverts fill. These rules ship with styles.css so primitives behave the same
   everywhere. */

.vess-btn { -webkit-tap-highlight-color: transparent; }

/* primary: white block -> red block on hover */
.vess-btn--primary:not([disabled]):hover { background: var(--vess-red); color: var(--vess-white); }
.vess-btn--primary:not([disabled]):active { background: var(--vess-red-print); }

/* ghost: transparent -> white fill */
.vess-btn--ghost:not([disabled]):hover { background: var(--vess-white); color: var(--vess-black); }
.vess-btn--ghost:not([disabled]):active { background: var(--vess-grey-1); border-color: var(--vess-grey-1); }

/* link: text -> red, arrow nudges */
.vess-btn--link:not([disabled]):hover { color: var(--vess-red); }
.vess-btn--link:not([disabled]):hover span[aria-hidden] { transform: translateX(3px); }
.vess-btn--link span[aria-hidden] { transition: transform var(--dur-base) var(--ease-standard); display: inline-block; }

/* Inputs: line strengthens / turns red on focus */
.vess-field__input { transition: border-color var(--dur-base) var(--ease-standard); }
.vess-field__input:focus { outline: none; border-color: var(--vess-white); }
.vess-field__input:focus.vess-field__input--accent { border-color: var(--vess-red); }
.vess-field__input::placeholder { color: var(--vess-grey-2); }

/* Generic link hover within VESS surfaces */
.vess-link { color: var(--vess-white); text-decoration: none; transition: color var(--dur-base) var(--ease-standard); }
.vess-link:hover { color: var(--vess-red); }
