/* ==========================================================================
   Verde Casino — Česká republika
   Stylesheet: design tokens, base, components, utilities.
   Mobile-first: base rules target phones, wider screens are layered on top.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Self-hosted type: Montserrat (display) + Inter (body), latin + latin-ext
   -------------------------------------------------------------------------- */
@font-face {
  font-display: swap;
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 700;
  src: url("/type/montserrat-latin-ext-700-normal.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-display: swap;
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 700;
  src: url("/type/montserrat-latin-700-normal.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-display: swap;
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 800;
  src: url("/type/montserrat-latin-ext-800-normal.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-display: swap;
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 800;
  src: url("/type/montserrat-latin-800-normal.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-display: swap;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  src: url("/type/inter-latin-ext-400-normal.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-display: swap;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  src: url("/type/inter-latin-400-normal.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-display: swap;
  font-family: "Inter";
  font-style: normal;
  font-weight: 500 600;
  src: url("/type/inter-latin-ext-600-normal.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-display: swap;
  font-family: "Inter";
  font-style: normal;
  font-weight: 500 600;
  src: url("/type/inter-latin-600-normal.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;
}

/* --------------------------------------------------------------------------
   Design tokens (names come from this build's variable dictionary)
   -------------------------------------------------------------------------- */
:root {
  --hfm-advisory: #a4161a;
  --hfm-anchor: #65c000;
  --hfm-blend-a: #3f3958;
  --hfm-border: #2a2d31;
  --hfm-border-strong: #474c53;
  --hfm-deep: #2c5400;
  --hfm-key-active: #000000;
  --hfm-raised: #17191b;
  --hfm-ramp-end: #201c2e;
  --hfm-subtle: #c0c0c0;
  --hfm-surface: #0f1011;
  --hfm-text: #ffffff;
  --hfm-tint: #1f3a05;
  --hfm-vivid: #0c0b11;

  --hfm-heading: "Montserrat", "Segoe UI", Arial, sans-serif;
  --f-text: "Inter", "Segoe UI", Arial, sans-serif;

  --hfm-display-1: 36px;
  --hfm-head: 28px;
  --hfm-h3: 22px;
  --hfm-sub-2: 18px;
  --hfm-h5: 16px;
  --hfm-h6: 14px;
  --hfm-normal: 16px;
  --hfm-small: 13px;
  --hfm-micro: 11px;

  --l-snug: 1.1;
  --hfm-default: 1.5;
  --hfm-loose: 1.75;
  --hfm-book: 400;
  --hfm-half: 500;
  --hfm-thick: 700;
  --hfm-tight: -0.02em;
  --e-normal: 0;
  --hfm-open: 0.04em;

  --hfm-hair: 8px;
  --hfm-tiny: 12px;
  --hfm-snug: 16px;
  --hfm-base: 24px;
  --hfm-wide: 32px;
  --hfm-roomy: 48px;
  --hfm-vast: 72px;
  --hfm-huge: 112px;
  --hfm-sec: 36px;

  --r-hair: 2px;
  --r-tiny: 2px;
  --r-snug: 6px;
  --r-base: 10px;
  --r-wide: 16px;
  --r-roomy: 16px;
  --r-vast: 16px;
  --r-huge: 16px;
  --hfm-pill: 9999px;
  --hfm-round-full: 50%;

  --d-hair: none;
  --d-tiny: none;
  --d-snug: 0 1px 3px rgba(0, 0, 0, 0.05);
  --d-base: 0 4px 12px rgba(0, 0, 0, 0.09);
  --d-wide: 0 8px 24px rgba(0, 0, 0, 0.13);
  --d-roomy: 0 12px 32px rgba(0, 0, 0, 0.4);
  --d-vast: 0 18px 44px rgba(0, 0, 0, 0.5);
  --d-huge: 0 24px 60px rgba(0, 0, 0, 0.6);

  --hfm-fine: 1px;
  --hfm-mid: 2px;
  --hfm-bold: 3px;

  --hfm-fast: 180ms;
  --t-normal: 360ms;
  --hfm-easy: 626ms;
  --hfm-settle: cubic-bezier(0.12, 0.78, 0.52, 0.97);
  --hfm-start: cubic-bezier(0.62, 0.11, 0.39, 0.88);
  --hfm-both: cubic-bezier(0.62, 0.11, 0.39, 0.88);
  --hfm-bounce: cubic-bezier(0.24, 1.15, 0.53, 0.95);

  --hfm-max: 1240px;
  --hfm-readable: 1240px;
  --hfm-slim: 630px;
  --hfm-padding-desktop: 64px;
  --hfm-edge-mid: 32px;
  --hfm-padding-mobile: 20px;
  --hfm-size-desktop: 64px;
  --hfm-short: 64px;
}

/* Desktop scale (TYPO-01 desktop values) */
@media (min-width: 880px) {
  :root {
    --hfm-display-1: 64px;
    --hfm-head: 40px;
    --hfm-h3: 28px;
    --hfm-sub-2: 22px;
    --hfm-h5: 18px;
    --hfm-h6: 16px;
    --hfm-normal: 17px;
    --hfm-small: 14px;
    --hfm-micro: 12px;
    --hfm-sec: 44px;
  }
}

/* --------------------------------------------------------------------------
   Reset / base
   -------------------------------------------------------------------------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  overflow-x: clip;
}

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: auto;
  scroll-padding-top: 84px;
}

body {
  background: var(--hfm-surface);
  color: var(--hfm-text);
  display: flex;
  flex-direction: column;
  font-family: var(--f-text);
  font-size: var(--hfm-normal);
  font-weight: var(--hfm-book);
  line-height: var(--hfm-loose);
  margin: 0;
  min-height: 100vh;
}

main {
  display: block;
  flex: 1 0 auto;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--hfm-heading);
  font-weight: var(--hfm-thick);
  line-height: var(--l-snug);
  margin: 0;
  overflow-wrap: anywhere;
}

p {
  margin: 0;
}

img {
  display: block;
  height: auto;
  max-width: 100%;
}

a {
  color: var(--hfm-anchor);
}

button {
  font: inherit;
}

ul,
ol {
  margin: 0;
}

/* --------------------------------------------------------------------------
   Accessibility helpers
   -------------------------------------------------------------------------- */
.skip-hop {
  background: var(--hfm-anchor);
  border-radius: var(--hfm-pill);
  color: var(--hfm-vivid);
  font-weight: var(--hfm-thick);
  left: 16px;
  padding: 10px 18px;
  position: absolute;
  text-decoration: none;
  top: 12px;
  z-index: 200;
}

.skip-hop:not(:focus) {
  top: -200px !important;
}

.sr-only {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

:focus-visible {
  outline: 2px solid var(--hfm-anchor);
  outline-offset: 3px;
}

/* --------------------------------------------------------------------------
   Reveal on scroll (motion: zoom, observer, data-appear / on-screen)
   -------------------------------------------------------------------------- */
.no-js [data-appear] {
  opacity: 1;
  transform: none;
}

[data-js] [data-appear] {
  opacity: 0;
  transform: translateY(16px) scale(0.97);
  transition: opacity var(--t-normal) var(--hfm-settle), transform var(--hfm-easy) var(--hfm-settle);
}

[data-js] [data-appear].on-screen {
  opacity: 1;
  transform: none;
}

@keyframes hfm-rise {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes hfm-nudge {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(6px);
  }
}

/* --------------------------------------------------------------------------
   RG-04 — dark strip with a coloured rule (18+ notice)
   -------------------------------------------------------------------------- */
.rg-note {
  background: var(--hfm-vivid);
  border-bottom: var(--hfm-bold) solid var(--hfm-advisory);
  color: var(--hfm-text);
  display: block;
  font-size: var(--hfm-micro);
  line-height: 1.45;
  padding: 7px var(--hfm-padding-mobile);
  text-align: center;
}

.rg-note-age {
  background: var(--hfm-advisory);
  border-radius: var(--hfm-pill);
  color: var(--hfm-text);
  display: inline-block;
  font-weight: var(--hfm-thick);
  margin-inline-end: 6px;
  padding: 0 7px;
}

.rg-note-link {
  color: var(--hfm-text);
  display: inline-block;
  text-decoration-color: var(--hfm-advisory);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  white-space: nowrap;
}

.rg-note-link:hover {
  background: var(--hfm-vivid);
  color: var(--hfm-anchor);
}

.rg-note-long {
  display: none;
}

@media (min-width: 640px) {
  .rg-note-long {
    display: inline;
  }
}

/* --------------------------------------------------------------------------
   Header — HEAD-SPLIT: crest left, index centred, nothing on the right
   -------------------------------------------------------------------------- */
.u75 {
  background: var(--hfm-surface);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45);
  position: sticky;
  top: 0;
  z-index: 95;
}

.u75-bar {
  align-items: center;
  display: flex;
  gap: var(--hfm-snug);
  height: 64px;
  margin-inline: auto;
  max-width: calc(var(--hfm-max) + 2 * var(--hfm-padding-desktop));
  padding-inline: var(--hfm-padding-mobile);
  position: relative;
}

.u75-crest {
  align-items: center;
  background: var(--hfm-raised);
  border: var(--hfm-fine) solid var(--hfm-border-strong);
  border-radius: var(--hfm-pill);
  color: var(--hfm-text);
  display: inline-flex;
  flex-shrink: 0;
  padding: 4px 16px;
  text-decoration: none;
}

.u75-crest-visual {
  flex-shrink: 0;
  height: 48px;
  width: auto;
}

.u75-toggle {
  align-items: center;
  background: transparent;
  border: 0;
  color: var(--hfm-text);
  cursor: pointer;
  display: inline-flex;
  height: 44px;
  justify-content: center;
  margin-left: auto !important;
  padding: 0;
  width: 44px;
}

.u75-lines {
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: 24px;
}

.u75-lines span {
  background: currentColor;
  border-radius: 2px;
  display: block;
  height: 2px;
  transition: transform var(--hfm-fast) var(--hfm-settle), opacity var(--hfm-fast) var(--hfm-settle);
}

.u75-toggle[aria-expanded="true"] .u75-lines span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.u75-toggle[aria-expanded="true"] .u75-lines span:nth-child(2) {
  opacity: 0;
}

.u75-toggle[aria-expanded="true"] .u75-lines span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

.u75-index {
  display: none;
}

.u75-series {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: var(--hfm-hair);
  list-style: none;
  margin: 0;
  padding: 0;
}

.u75-one {
  display: block;
  flex-shrink: 0;
}

.u75-one[hidden] {
  display: none;
}

.u75-link {
  background: var(--hfm-surface);
  border: var(--hfm-fine) solid transparent;
  border-radius: var(--hfm-pill);
  color: var(--hfm-text);
  display: inline-block;
  font-size: 16px;
  font-variant: small-caps;
  font-weight: 400;
  letter-spacing: 0.01em;
  line-height: 1.2;
  padding: 7px 12px;
  text-decoration: none;
  transition: background-color var(--hfm-fast) var(--hfm-settle), color var(--hfm-fast) var(--hfm-settle);
  white-space: nowrap;
}

.u75-link:hover {
  background: var(--hfm-tint);
  color: var(--hfm-text);
}

.u75-link[aria-current="page"] {
  background: var(--hfm-deep);
  border-color: var(--hfm-anchor);
  color: var(--hfm-text);
}

.u75-more {
  flex-shrink: 0;
  position: relative;
}

.u75-more[hidden] {
  display: none;
}

.u75-more-opener {
  align-items: center;
  background: var(--hfm-raised);
  border: var(--hfm-fine) solid var(--hfm-border-strong);
  border-radius: var(--hfm-pill);
  color: var(--hfm-text);
  cursor: pointer;
  display: inline-flex;
  gap: 4px;
  height: 36px;
  justify-content: center;
  padding: 0 12px;
}

.u75-more-opener:hover {
  background: var(--hfm-tint);
  color: var(--hfm-text);
}

.u75-more-dots {
  background: currentColor;
  border-radius: 50%;
  display: block;
  height: 5px;
  width: 5px;
}

.u75-more-pane {
  background: var(--hfm-raised);
  border: var(--hfm-fine) solid var(--hfm-border-strong);
  border-radius: var(--r-base);
  box-shadow: var(--d-roomy);
  display: none;
  list-style: none;
  margin: 0;
  max-height: calc(100vh - 90px);
  min-width: 220px;
  overflow-y: auto;
  padding: var(--hfm-hair);
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  z-index: 97;
}

.u75-more-pane.is-open {
  display: block;
}

.u75-more-pane .u75-link {
  border-radius: var(--r-snug);
  display: block;
}

.u75-tray {
  background: var(--hfm-raised);
  border-top: var(--hfm-fine) solid var(--hfm-border);
  box-shadow: var(--d-vast);
  display: none;
  left: 0;
  max-height: calc(100vh - 64px);
  overflow-y: auto;
  padding: var(--hfm-snug) var(--hfm-padding-mobile) var(--hfm-base);
  position: absolute;
  right: 0;
  top: 100%;
}

.u75-tray.is-open {
  display: block;
}

.u75-tray-series {
  display: flex;
  flex-direction: column;
  list-style: none;
  margin: 0;
  padding: 0;
}

.u75-tray-series .u75-link {
  border-radius: var(--r-snug);
  display: block;
  font-size: 17px;
  padding: 11px 14px;
}

@media (max-width: 539px) {
  .u75-crest-visual {
    height: 40px;
  }
  .u75-crest {
    padding: 4px 14px;
  }
}

@media (min-width: 880px) {
  .u75-bar {
    padding-inline: var(--hfm-base);
  }
  .u75-toggle {
    display: none;
  }
  .u75-tray,
  .u75-tray.is-open {
    display: none;
  }
  .u75-index {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: var(--hfm-hair);
    margin-inline: auto;
  }
}

/* --------------------------------------------------------------------------
   Shared section frame
   -------------------------------------------------------------------------- */
.r88-wrap,
.r67-wrap,
.h23-wrap,
.s98-wrap,
.f03-wrap,
.f78-wrap,
.x35-wrap,
.s78-wrap,
.e68-wrap,
.d56-wrap,
.g52-wrap,
.s77-wrap,
.p85-wrap,
.x21-wrap,
.z40-wrap {
  margin-inline: auto;
  max-width: calc(var(--hfm-max) + 2 * var(--hfm-padding-desktop));
  padding-inline: var(--hfm-padding-mobile);
  width: 100%;
}

@media (min-width: 880px) {
  .r88-wrap,
  .r67-wrap,
  .h23-wrap,
  .s98-wrap,
  .f03-wrap,
  .f78-wrap,
  .x35-wrap,
  .s78-wrap,
  .e68-wrap,
  .d56-wrap,
  .g52-wrap,
  .s77-wrap,
  .p85-wrap,
  .x21-wrap,
  .z40-wrap {
    padding-inline: var(--hfm-padding-desktop);
  }
}

/* --------------------------------------------------------------------------
   Breadcrumbs — BREAD-05 slashed display
   -------------------------------------------------------------------------- */
.g52 {
  background: var(--hfm-surface);
  padding-block: var(--hfm-base);
}

.g52-series {
  display: flex;
  flex-wrap: wrap;
  font-family: var(--hfm-heading);
  font-size: var(--hfm-h5);
  font-weight: var(--hfm-thick);
  letter-spacing: var(--hfm-tight);
  line-height: 1.3;
  list-style: none;
  margin: 0;
  padding: 0;
  text-transform: uppercase;
}

.g52-one {
  color: var(--hfm-text);
  display: inline;
}

.g52-one + .g52-one::before {
  color: var(--hfm-anchor);
  content: "/";
  margin-inline: var(--hfm-tiny);
}

.g52-link {
  background: var(--hfm-surface);
  color: var(--hfm-subtle);
  text-decoration: none;
}

.g52-link:hover {
  background: var(--hfm-tint);
  color: var(--hfm-text);
}

.g52-here {
  color: var(--hfm-text);
}

/* --------------------------------------------------------------------------
   Hero — HERO-08 magazine cover (home)
   -------------------------------------------------------------------------- */
.z40 {
  align-items: center;
  background-color: var(--hfm-surface);
  color: var(--hfm-text);
  display: flex;
  isolation: isolate;
  min-height: clamp(560px, calc(100svh - 100px), 820px);
  overflow: hidden;
  position: relative;
}

.z40-visual {
  height: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
  width: 100%;
  z-index: -2;
}

.z40-shade {
  background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.88), rgba(0, 0, 0, 0.42)), linear-gradient(120deg, rgba(32, 28, 46, 0.55), rgba(15, 16, 17, 0));
  inset: 0;
  position: absolute;
  z-index: -1;
}

.z40-wrap {
  padding-block: var(--hfm-roomy) var(--hfm-vast);
}

.z40-cover {
  animation: hfm-rise var(--hfm-easy) var(--hfm-settle) both;
  margin-inline: auto;
  max-width: 900px;
  text-align: center;
}

.z40-issue {
  color: rgba(255, 255, 255, 0.78);
  display: inline-block;
  font-size: var(--hfm-micro);
  font-weight: var(--hfm-half);
  letter-spacing: 0.16em;
  margin-bottom: var(--hfm-snug);
  text-transform: uppercase;
}

.z40-issue::before,
.z40-issue::after {
  color: var(--hfm-anchor);
  content: "—";
  margin-inline: 10px;
}

.z40 h1 {
  color: #ffffff;
  font-size: var(--hfm-display-1);
  font-weight: 800;
  letter-spacing: var(--hfm-tight);
  line-height: var(--l-snug);
  text-transform: uppercase;
}

.z40-lead {
  color: rgba(255, 255, 255, 0.88);
  font-size: var(--hfm-sub-2);
  line-height: var(--hfm-default);
  margin: var(--hfm-base) auto 0;
  max-width: var(--hfm-slim);
}

.z40-facts {
  color: rgba(255, 255, 255, 0.76);
  display: flex;
  flex-wrap: wrap;
  font-size: var(--hfm-small);
  justify-content: center;
  margin-top: var(--hfm-base);
}

.z40-facts span {
  padding-inline: var(--hfm-tiny);
}

.z40-facts span + span {
  border-left: var(--hfm-fine) solid rgba(255, 255, 255, 0.35);
}

.z40-hint {
  align-items: center;
  bottom: var(--hfm-base);
  color: rgba(255, 255, 255, 0.8);
  display: flex;
  flex-direction: column;
  font-size: var(--hfm-micro);
  gap: 6px;
  left: 50%;
  letter-spacing: 0.12em;
  position: absolute;
  text-decoration: none;
  text-transform: uppercase;
  transform: translateX(-50%);
}

.z40-hint::after {
  animation: hfm-nudge 1.8s var(--hfm-both) infinite;
  border-bottom: 2px solid var(--hfm-anchor);
  border-right: 2px solid var(--hfm-anchor);
  content: "";
  height: 12px;
  transform: rotate(45deg);
  width: 12px;
}

/* --------------------------------------------------------------------------
   Page header — PHEAD-03 big block on brand green
   -------------------------------------------------------------------------- */
.d56 {
  background: var(--hfm-anchor);
  color: var(--hfm-vivid);
  padding-block: var(--hfm-roomy);
}

.d56-kicker {
  background: var(--hfm-anchor);
  color: var(--hfm-vivid);
  display: inline-block;
  font-size: var(--hfm-micro);
  font-weight: var(--hfm-thick);
  letter-spacing: 0.14em;
  margin-bottom: var(--hfm-tiny);
  text-transform: uppercase;
}

.d56-head {
  color: var(--hfm-vivid);
  font-size: clamp(30px, 5.4vw, 64px);
  font-weight: 800;
  letter-spacing: var(--hfm-tight);
  line-height: 1.05;
  max-width: 1040px;
  text-transform: uppercase;
}

.d56-lead {
  background: var(--hfm-anchor);
  color: #16200a;
  font-size: var(--hfm-sub-2);
  line-height: var(--hfm-default);
  margin-top: var(--hfm-snug);
  max-width: var(--hfm-slim);
}

.d56-deck {
  margin-top: var(--hfm-base);
}

@media (min-width: 880px) {
  .d56 {
    padding-block: var(--hfm-vast);
  }
}

/* --------------------------------------------------------------------------
   Items — GRID-13 cards with meaning-matched icons
   -------------------------------------------------------------------------- */
.r88 {
  background: var(--hfm-surface);
  padding-block: var(--hfm-sec);
}

.r88-head,
.f78-head,
.h23-head,
.s98-head,
.s78-head {
  color: var(--hfm-text);
  font-size: var(--hfm-head);
  letter-spacing: var(--hfm-tight);
  margin-bottom: var(--hfm-wide);
}

.r88-stack {
  display: grid;
  gap: var(--hfm-base);
  grid-template-columns: minmax(0, 1fr);
}

.r88-brick {
  background: var(--hfm-raised);
  border: var(--hfm-fine) solid rgba(255, 255, 255, 0.08);
  border-radius: var(--r-base);
  color: var(--hfm-text);
  padding: var(--hfm-wide);
  transition: box-shadow var(--t-normal) var(--hfm-settle), border-color var(--t-normal) var(--hfm-settle);
}

.r88-brick:hover {
  border-color: var(--hfm-border-strong);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(101, 192, 0, 0.25);
}

.r88-glyph {
  align-items: center;
  color: var(--hfm-anchor);
  display: inline-flex;
  height: 32px;
  width: 32px;
}

.r88-glyph svg {
  fill: none;
  height: 32px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 32px;
}

.r88-brick-head {
  color: var(--hfm-text);
  font-size: var(--hfm-h5);
  line-height: 1.3;
  margin-top: var(--hfm-snug);
}

.r88-prose {
  color: var(--hfm-subtle);
  font-size: var(--hfm-small);
  line-height: var(--hfm-default);
  margin-top: var(--hfm-tiny);
}

.r88-after {
  margin-top: var(--hfm-wide);
}

@media (min-width: 700px) {
  .r88-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1120px) {
  .r88-stack {
    gap: var(--hfm-wide);
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* --------------------------------------------------------------------------
   Offer strip used between blocks (plug) — layout only, colour comes from
   the offer button class
   -------------------------------------------------------------------------- */
.r67-plug,
.r88-after,
.h23-plug,
.s98-after {
  align-items: center;
  background: var(--hfm-raised);
  border: var(--hfm-fine) solid var(--hfm-border);
  border-left: var(--hfm-bold) solid var(--hfm-anchor);
  border-radius: var(--r-base);
  color: var(--hfm-text);
  display: flex;
  flex-direction: column;
  gap: var(--hfm-snug);
  padding: var(--hfm-base);
}

.r67-plug-copy,
.r88-after-copy,
.h23-plug-copy,
.s98-after-copy {
  color: var(--hfm-text);
  font-family: var(--hfm-heading);
  font-size: var(--hfm-h5);
  font-weight: var(--hfm-thick);
  line-height: 1.35;
}

.r67-plug-fine,
.r88-after-fine,
.h23-plug-fine,
.s98-after-fine {
  color: var(--hfm-subtle);
  display: block;
  font-family: var(--f-text);
  font-size: var(--hfm-micro);
  font-weight: var(--hfm-book);
  margin-top: 4px;
}

@media (min-width: 720px) {
  .r67-plug,
  .r88-after,
  .h23-plug,
  .s98-after {
    flex-direction: row;
    justify-content: space-between;
  }
}

/* --------------------------------------------------------------------------
   Prose — PROSE-28 stepped indents (compact bold heads, step l, roomy)
   -------------------------------------------------------------------------- */
.r67 {
  background: var(--hfm-surface);
  padding-block: var(--hfm-sec);
}

.r67-part + .r67-part,
.r67-part + .r67-plug,
.r67-plug + .r67-part,
.r67-frame + .r67-part,
.r67-part + .r67-frame {
  margin-top: var(--hfm-roomy);
}

.r67-head {
  color: var(--hfm-text);
  font-size: var(--hfm-h3);
  font-weight: var(--hfm-thick);
  letter-spacing: var(--hfm-tight);
  line-height: 1.2;
  margin-bottom: var(--hfm-base);
}

.r67-part p,
.r67-part ul,
.r67-part ol {
  color: var(--hfm-text);
  font-size: var(--hfm-normal);
  line-height: 1.85;
}

.r67-part p + p,
.r67-part p + ul,
.r67-part p + ol,
.r67-part ul + p,
.r67-part ol + p {
  margin-top: var(--hfm-base);
}

.r67-part ul,
.r67-part ol {
  display: grid;
  gap: var(--hfm-hair);
  padding-inline-start: 1.4em;
}

.r67-part li::marker {
  color: var(--hfm-anchor);
  font-weight: var(--hfm-thick);
}

.r67-part strong {
  color: var(--hfm-text);
  font-weight: 600;
}

.r67-part a {
  background: var(--hfm-surface);
  border-radius: 3px;
  color: var(--hfm-anchor);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: background-color var(--hfm-fast) var(--hfm-settle);
}

.r67-part a:hover {
  background: var(--hfm-tint);
  color: var(--hfm-anchor);
}

.r67-frame {
  background: var(--hfm-raised);
  border: var(--hfm-fine) solid var(--hfm-border);
  border-radius: var(--r-wide);
  margin: 0;
  overflow: hidden;
  padding: 0;
}

.r67-frame img {
  height: auto;
  max-height: 56vh;
  object-fit: contain;
  width: 100%;
}

.r67-frame-wide {
  max-width: calc(56vh * 1.5);
}

.r67-frame-square {
  max-width: 56vh;
}

.r67-frame-tall {
  max-width: calc(56vh * 0.6667);
}

@media (min-width: 880px) {
  .r67-part p:nth-of-type(2) {
    padding-inline-start: var(--hfm-wide);
  }
  .r67-part p:nth-of-type(3) {
    padding-inline-start: calc(var(--hfm-wide) * 2);
  }
  .r67-part p:nth-of-type(n + 4) {
    padding-inline-start: calc(var(--hfm-wide) * 3);
  }
  .r67-part p:nth-of-type(2) ~ ul,
  .r67-part p:nth-of-type(2) ~ ol {
    margin-inline-start: var(--hfm-wide);
  }
  .r67-part p:nth-of-type(3) ~ ul,
  .r67-part p:nth-of-type(3) ~ ol {
    margin-inline-start: calc(var(--hfm-wide) * 2);
  }
}

/* --------------------------------------------------------------------------
   Data table — TABLE-01 striped rows
   -------------------------------------------------------------------------- */
.f78 {
  background: var(--hfm-surface);
  padding-block: var(--hfm-sec);
}

.f78-scroll {
  border: var(--hfm-fine) solid var(--hfm-border);
  border-radius: var(--r-base);
  overflow-x: auto;
}

.f78-grid {
  background: var(--hfm-raised);
  border-collapse: collapse;
  color: var(--hfm-subtle);
  font-size: var(--hfm-small);
  min-width: 520px;
  width: 100%;
}

.f78-grid thead th {
  background: var(--hfm-anchor);
  color: var(--hfm-vivid);
  font-family: var(--f-text);
  font-size: var(--hfm-h6);
  font-weight: 600;
  letter-spacing: var(--hfm-open);
  padding: var(--hfm-snug);
  text-align: left;
  text-transform: uppercase;
}

.f78-grid td,
.f78-grid tbody th {
  border-top: var(--hfm-fine) solid var(--hfm-border);
  padding: var(--hfm-snug);
  text-align: left;
  vertical-align: top;
}

.f78-grid tbody th {
  background: var(--hfm-raised);
  color: var(--hfm-text);
  font-weight: 600;
}

.f78-grid tbody td {
  background: var(--hfm-raised);
  color: var(--hfm-subtle);
}

.f78-grid tbody tr:nth-child(even) th,
.f78-grid tbody tr:nth-child(even) td {
  background: #1b1d1f;
}

.f78-grid tbody tr:hover th,
.f78-grid tbody tr:hover td {
  background: #202326;
  transition: background-color var(--hfm-fast) var(--hfm-settle);
}

@media (min-width: 880px) {
  .f78-grid {
    font-size: var(--hfm-normal);
  }
  .f78-grid td,
  .f78-grid tbody th,
  .f78-grid thead th {
    padding: var(--hfm-snug) var(--hfm-base);
  }
}

/* --------------------------------------------------------------------------
   Reviews — REV-06 compact list with inline ratings
   -------------------------------------------------------------------------- */
.h23 {
  background: var(--hfm-surface);
  padding-block: var(--hfm-sec);
}

.h23-sum {
  color: var(--hfm-subtle);
  font-size: var(--hfm-small);
  margin-bottom: var(--hfm-base);
}

.h23-sum strong {
  color: var(--hfm-anchor);
}

.h23-series {
  list-style: none;
  margin: 0;
  padding: 0;
}

.h23-one {
  border-bottom: var(--hfm-fine) solid rgba(255, 255, 255, 0.08);
  display: grid;
  gap: 6px var(--hfm-snug);
  grid-template-columns: minmax(0, 1fr) auto;
  padding-block: var(--hfm-base);
}

.h23-who {
  color: var(--hfm-text);
  font-size: var(--hfm-normal);
  font-weight: var(--hfm-thick);
}

.h23-score {
  background: var(--hfm-surface);
  color: var(--hfm-anchor);
  font-weight: 600;
  margin-inline-start: var(--hfm-hair);
  white-space: nowrap;
}

.h23-stamp {
  color: var(--hfm-subtle);
  font-size: var(--hfm-small);
  white-space: nowrap;
}

.h23-say {
  color: var(--hfm-text);
  font-size: var(--hfm-normal);
  grid-column: 1 / -1;
  line-height: var(--hfm-default);
}

.h23-plug {
  margin-block: var(--hfm-base);
}

/* --------------------------------------------------------------------------
   FAQ — FAQ-01 classic accordion
   -------------------------------------------------------------------------- */
.s98 {
  background: var(--hfm-ramp-end);
  padding-block: var(--hfm-sec);
}

.s98-head {
  color: var(--hfm-text);
}

.s98-series {
  margin: 0;
}

.s98-one {
  border-bottom: var(--hfm-fine) solid rgba(255, 255, 255, 0.12);
  padding-block: var(--hfm-snug);
}

.s98-one dt {
  margin: 0;
}

.s98-ask {
  font-family: var(--f-text);
  font-size: var(--hfm-h5);
  font-weight: var(--hfm-thick);
  line-height: 1.4;
}

.s98-question {
  align-items: center;
  background: var(--hfm-ramp-end);
  border: 0;
  color: var(--hfm-text);
  cursor: pointer;
  display: flex;
  font-weight: var(--hfm-thick);
  gap: var(--hfm-snug);
  justify-content: space-between;
  padding: 0;
  text-align: left;
  width: 100%;
}

.s98-question:hover {
  background: var(--hfm-ramp-end);
  color: var(--hfm-anchor);
}

.s98-sign {
  color: var(--hfm-anchor);
  flex-shrink: 0;
  height: 18px;
  position: relative;
  width: 18px;
}

.s98-sign::before,
.s98-sign::after {
  background: currentColor;
  border-radius: 2px;
  content: "";
  height: 2px;
  left: 0;
  position: absolute;
  top: 8px;
  width: 18px;
}

.s98-sign::after {
  transform: rotate(0deg);
  transition: transform var(--t-normal) var(--hfm-settle);
}

.s98-question[aria-expanded="false"] .s98-sign::after {
  transform: rotate(90deg);
}

.s98-answer {
  color: var(--hfm-subtle);
  margin: 0;
  overflow: hidden;
  transition: max-height var(--t-normal) var(--hfm-both), opacity var(--t-normal) var(--hfm-settle);
}

.s98-answer p {
  font-size: var(--hfm-normal);
  line-height: var(--hfm-loose);
  padding-top: var(--hfm-snug);
}

[data-js] .s98-answer {
  max-height: 0;
  opacity: 0;
}

[data-js] .s98-answer.is-open {
  max-height: 60em;
  opacity: 1;
}

.s98-after {
  margin-top: var(--hfm-wide);
}

/* --------------------------------------------------------------------------
   CTA — CTA-04 minimal text link (target of #gateway)
   -------------------------------------------------------------------------- */
.f03 {
  background: var(--hfm-surface);
  padding-block: var(--hfm-roomy);
  text-align: center;
}

.f03-head {
  color: var(--hfm-text);
  font-size: var(--hfm-sub-2);
  font-weight: var(--hfm-thick);
  margin-inline: auto;
  max-width: var(--hfm-slim);
}

.f03-note {
  color: var(--hfm-subtle);
  line-height: var(--hfm-loose);
  margin: var(--hfm-base) auto;
  max-width: var(--hfm-slim);
}

.f03-fine {
  color: var(--hfm-subtle);
  display: block;
  font-size: var(--hfm-micro);
  margin-top: var(--hfm-snug);
}

/* --------------------------------------------------------------------------
   Inline CTA — INLINE-CTA-01 compact banner strip on brand green
   -------------------------------------------------------------------------- */
.s77 {
  background: var(--hfm-anchor);
  color: var(--hfm-vivid);
  padding-block: var(--hfm-base);
}

.s77-wrap {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: var(--hfm-snug);
}

.s77-prose {
  background: var(--hfm-anchor);
  color: var(--hfm-vivid);
  font-family: var(--hfm-heading);
  font-size: var(--hfm-h5);
  font-weight: var(--hfm-thick);
  line-height: 1.35;
}

.s77-small {
  background: var(--hfm-anchor);
  color: #16200a;
  display: block;
  font-family: var(--f-text);
  font-size: var(--hfm-micro);
  font-weight: var(--hfm-book);
  margin-top: 4px;
}

@media (min-width: 720px) {
  .s77-wrap {
    flex-direction: row;
    justify-content: space-between;
  }
}

/* --------------------------------------------------------------------------
   Author byline — BYLINE-07 expertise tags block
   -------------------------------------------------------------------------- */
.p85 {
  background: var(--hfm-surface);
  padding-block: var(--hfm-wide) var(--hfm-roomy);
}

.p85-brick {
  background: var(--hfm-raised);
  border: var(--hfm-fine) solid var(--hfm-border);
  border-radius: var(--r-base);
  box-shadow: var(--d-snug);
  color: var(--hfm-text);
  padding: var(--hfm-wide);
}

.p85-top {
  align-items: center;
  display: flex;
  gap: var(--hfm-snug);
}

.p85-mug {
  border-radius: 50%;
  flex-shrink: 0;
  height: 72px;
  object-fit: cover;
  object-position: center top;
  width: 72px;
}

.p85-kicker {
  color: var(--hfm-subtle);
  display: block;
  font-size: var(--hfm-micro);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.p85-byname {
  font-size: var(--hfm-sub-2);
  font-weight: var(--hfm-thick);
}

.p85-byname a {
  background: var(--hfm-raised);
  color: var(--hfm-text);
  text-decoration: none;
}

.p85-byname a:hover {
  background: var(--hfm-tint);
  color: var(--hfm-text);
}

.p85-position {
  color: var(--hfm-subtle);
  font-size: var(--hfm-small);
  line-height: 1.4;
  margin-top: 4px;
}

.p85-bio {
  color: var(--hfm-text);
  line-height: var(--hfm-loose);
  margin-top: var(--hfm-snug);
}

.p85-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--hfm-tiny);
  margin-top: var(--hfm-snug);
}

.p85-chip {
  background: var(--hfm-anchor);
  border-radius: var(--hfm-pill);
  color: var(--hfm-vivid);
  font-size: var(--hfm-micro);
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: var(--hfm-hair) var(--hfm-snug);
  text-transform: uppercase;
}

.p85-stamp {
  color: var(--hfm-subtle);
  font-size: var(--hfm-small);
  margin-top: var(--hfm-snug);
}

.p85-stamp span + span::before {
  color: var(--hfm-anchor);
  content: "·";
  margin-inline: var(--hfm-hair);
}

.p85-link {
  background: var(--hfm-raised);
  color: var(--hfm-anchor);
  display: inline-block;
  font-weight: 600;
  margin-top: var(--hfm-snug);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.p85-link:hover {
  background: var(--hfm-tint);
  color: var(--hfm-anchor);
}

/* --------------------------------------------------------------------------
   Legal — LEGAL-07 magazine editorial
   -------------------------------------------------------------------------- */
.x35 {
  background: var(--hfm-surface);
  padding-block: var(--hfm-wide) var(--hfm-roomy);
}

.x35-kicker {
  color: var(--hfm-anchor);
  display: block;
  font-size: var(--hfm-micro);
  font-weight: var(--hfm-thick);
  letter-spacing: 0.16em;
  margin-bottom: var(--hfm-tiny);
  text-transform: uppercase;
}

.x35-intro {
  color: var(--hfm-text);
  font-family: var(--hfm-heading);
  font-size: var(--hfm-sub-2);
  font-style: italic;
  line-height: var(--hfm-default);
}

.x35-part {
  margin-top: var(--hfm-roomy);
}

.x35-head {
  color: var(--hfm-text);
  font-size: var(--hfm-h3);
  font-style: italic;
}

.x35-rule {
  background: var(--hfm-anchor);
  border: 0;
  height: 3px;
  margin: var(--hfm-snug) 0 var(--hfm-base);
  width: 80px;
}

.x35-part p {
  color: var(--hfm-text);
  line-height: 1.8;
}

.x35-part p + p {
  margin-top: var(--hfm-snug);
}

.x35-rule + p::first-letter {
  color: var(--hfm-anchor);
  float: left;
  font-family: var(--hfm-heading);
  font-size: 3.1em;
  font-weight: 800;
  line-height: 0.9;
  padding: 6px 10px 0 0;
}

.x35-series {
  display: grid;
  gap: var(--hfm-hair);
  padding-inline-start: 1.3em;
}

.x35-series li::marker {
  color: var(--hfm-anchor);
}

.x35-fine {
  border-top: var(--hfm-fine) solid var(--hfm-border);
  color: var(--hfm-subtle);
  font-size: var(--hfm-small);
  margin-top: var(--hfm-roomy);
  padding-top: var(--hfm-base);
}

.x35-stamp {
  color: var(--hfm-subtle);
  font-size: var(--hfm-small);
  margin-top: var(--hfm-hair);
}

/* --------------------------------------------------------------------------
   Author card — AUTH-05 compact inline
   -------------------------------------------------------------------------- */
.e68 {
  background: var(--hfm-surface);
  padding-block: var(--hfm-sec) 0;
}

.e68-brick {
  align-items: center;
  background: var(--hfm-raised);
  border: var(--hfm-fine) solid var(--hfm-border);
  border-radius: var(--r-base);
  color: var(--hfm-text);
  display: flex;
  gap: var(--hfm-snug);
  max-width: 480px;
  padding: var(--hfm-base);
}

.e68-mug {
  border-radius: 50%;
  flex-shrink: 0;
  height: 56px;
  object-fit: cover;
  width: 56px;
}

.e68-body {
  display: flex;
  flex-direction: column;
  gap: var(--hfm-hair);
}

.e68-position {
  color: var(--hfm-anchor);
  font-size: var(--hfm-micro);
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.35;
  text-transform: uppercase;
}

.e68-byname {
  color: var(--hfm-text);
  font-size: var(--hfm-normal);
  font-weight: var(--hfm-thick);
}

.e68-bio {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: var(--hfm-subtle);
  display: -webkit-box;
  font-size: var(--hfm-small);
  line-height: 1.5;
  overflow: hidden;
}

.e68-articles {
  background: var(--hfm-surface);
  padding-block: 0 var(--hfm-sec);
}

.e68-articles-head {
  color: var(--hfm-text);
  font-size: var(--hfm-h3);
  margin-bottom: var(--hfm-base);
}

.e68-articles-series {
  display: grid;
  gap: var(--hfm-tiny);
  list-style: none;
  margin: 0;
  padding: 0;
}

.e68-articles-one a {
  background: var(--hfm-raised);
  border: var(--hfm-fine) solid var(--hfm-border);
  border-radius: var(--r-snug);
  color: var(--hfm-text);
  display: flex;
  gap: var(--hfm-tiny);
  justify-content: space-between;
  padding: var(--hfm-snug) var(--hfm-base);
  text-decoration: none;
  transition: border-color var(--hfm-fast) var(--hfm-settle);
}

.e68-articles-one a:hover {
  background: var(--hfm-tint);
  border-color: var(--hfm-anchor);
  color: var(--hfm-text);
}

.e68-articles-chip {
  background: var(--hfm-anchor);
  border-radius: var(--hfm-pill);
  color: var(--hfm-vivid);
  flex-shrink: 0;
  font-size: var(--hfm-micro);
  font-weight: 600;
  padding: 2px 10px;
  text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   Contact form — FORM-04 inline single row
   -------------------------------------------------------------------------- */
.s78 {
  background: var(--hfm-surface);
  padding-block: var(--hfm-sec);
}

.s78-intro {
  color: var(--hfm-subtle);
  margin-bottom: var(--hfm-base);
}

.s78-form {
  display: flex;
  flex-direction: column;
  gap: var(--hfm-snug);
}

.s78-line {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 6px;
}

.s78-cue {
  color: var(--hfm-subtle);
  font-size: var(--hfm-small);
}

.s78-input {
  background: var(--hfm-raised);
  border: var(--hfm-fine) solid var(--hfm-border-strong);
  border-radius: var(--hfm-pill);
  color: var(--hfm-text);
  font: inherit;
  min-height: 48px;
  padding: 10px 20px;
  width: 100%;
}

.s78-input:focus {
  border-color: var(--hfm-anchor);
  outline: none;
}

.s78-key {
  align-self: stretch;
  background: var(--hfm-anchor);
  border: 0;
  border-radius: var(--hfm-pill);
  color: var(--hfm-vivid);
  cursor: pointer;
  font-family: var(--hfm-heading);
  font-weight: var(--hfm-thick);
  letter-spacing: var(--hfm-open);
  min-height: 48px;
  padding: 0 28px;
  text-transform: uppercase;
  transition: transform var(--hfm-fast) var(--hfm-settle);
}

.s78-key:hover {
  background: #74d10a;
  color: var(--hfm-vivid);
  transform: scale(1.015);
}

.s78-done {
  background: var(--hfm-tint);
  border-radius: var(--r-base);
  color: var(--hfm-text);
  margin-top: var(--hfm-snug);
  padding: var(--hfm-snug) var(--hfm-base);
}

.s78-done[hidden] {
  display: none;
}

.s78-mail {
  color: var(--hfm-subtle);
  font-size: var(--hfm-small);
  margin-top: var(--hfm-base);
}

@media (min-width: 880px) {
  .s78-form {
    align-items: flex-end;
    flex-direction: row;
  }
  .s78-line {
    flex: 1 1 0;
  }
  .s78-line-wide {
    flex: 2 1 0;
  }
  .s78-key {
    align-self: flex-end;
  }
}

/* --------------------------------------------------------------------------
   Error — ERR-04 full-bleed atmospheric
   -------------------------------------------------------------------------- */
.m87 {
  align-items: center;
  background-color: var(--hfm-surface);
  color: var(--hfm-text);
  display: flex;
  isolation: isolate;
  justify-content: center;
  min-height: clamp(520px, calc(100svh - 170px), 860px);
  overflow: hidden;
  position: relative;
}

.m87-visual {
  height: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
  width: 100%;
  z-index: -2;
}

.m87-shade {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.85));
  inset: 0;
  position: absolute;
  z-index: -1;
}

.m87-core {
  backdrop-filter: blur(3px);
  margin: var(--hfm-roomy) var(--hfm-padding-mobile);
  max-width: var(--hfm-slim);
  text-align: center;
}

.m87-code {
  color: var(--hfm-anchor);
  display: block;
  font-family: var(--hfm-heading);
  font-size: clamp(88px, 18vw, 180px);
  font-weight: 800;
  line-height: 0.9;
}

.m87-head {
  color: #ffffff;
  font-size: var(--hfm-head);
  margin-top: var(--hfm-snug);
}

.m87-lead {
  color: rgba(255, 255, 255, 0.86);
  margin-top: var(--hfm-snug);
}

.m87-return {
  background: var(--hfm-anchor);
  border-radius: var(--hfm-pill);
  color: var(--hfm-vivid);
  display: inline-block;
  font-family: var(--hfm-heading);
  font-weight: var(--hfm-thick);
  letter-spacing: var(--hfm-open);
  margin-top: var(--hfm-base);
  padding: 14px 30px;
  text-decoration: none;
  text-transform: uppercase;
  transition: transform var(--hfm-fast) var(--hfm-settle);
}

.m87-return:hover {
  background: #74d10a;
  color: var(--hfm-vivid);
  transform: scale(1.015);
}

/* --------------------------------------------------------------------------
   Footer — FOOT-04 mini bar
   -------------------------------------------------------------------------- */
.x21 {
  backdrop-filter: blur(8px);
  background: rgba(15, 16, 17, 0.95);
  background-color: var(--hfm-surface);
  border-top: var(--hfm-fine) solid var(--hfm-border);
  color: var(--hfm-subtle);
  position: relative;
}

.x21-wrap {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: var(--hfm-hair);
  min-height: 80px;
  padding-block: var(--hfm-snug);
}

.x21-fine {
  color: var(--hfm-subtle);
  font-size: var(--hfm-micro);
  line-height: 1.5;
}

.x21-index {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 0;
}

.x21-link {
  background: var(--hfm-surface);
  color: var(--hfm-subtle);
  font-size: var(--hfm-micro);
  letter-spacing: var(--hfm-open);
  padding-inline: var(--hfm-snug);
  text-decoration: none;
  text-transform: uppercase;
}

.x21-link:first-child {
  padding-inline-start: 0;
}

.x21-link + .x21-link {
  border-left: var(--hfm-fine) solid var(--hfm-border-strong);
}

.x21-link:hover {
  background: var(--hfm-surface);
  color: var(--hfm-text);
}

@media (min-width: 880px) {
  .x21-wrap {
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
    min-height: 64px;
  }
  .x21-fine {
    max-width: 62%;
  }
}

/* --------------------------------------------------------------------------
   Cookie banner — COOK-14 two-row bar with preferences
   -------------------------------------------------------------------------- */
.h52 {
  background: var(--hfm-raised);
  border-top: var(--hfm-mid) solid var(--hfm-anchor);
  bottom: 0;
  box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.5);
  color: var(--hfm-text);
  left: 0;
  position: fixed;
  right: 0;
  transition: transform var(--t-normal) var(--hfm-start), visibility 0s linear var(--t-normal);
  z-index: 90;
}

.h52[hidden] {
  display: none;
}

.h52.is-leaving {
  transform: translateX(105%);
  visibility: hidden;
}

.h52-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--hfm-tiny);
  margin-inline: auto;
  max-width: calc(var(--hfm-max) + 2 * var(--hfm-padding-desktop));
  padding: var(--hfm-snug) var(--hfm-padding-mobile);
}

.h52-note {
  color: var(--hfm-text);
  font-size: var(--hfm-small);
  line-height: 1.5;
}

.h52-deck {
  display: flex;
  flex-direction: column;
  gap: var(--hfm-hair);
}

.h52-accept,
.h52-decline,
.h52-link {
  align-items: center;
  border-radius: var(--hfm-pill);
  cursor: pointer;
  display: inline-flex;
  font-size: var(--hfm-small);
  font-weight: 600;
  justify-content: center;
  min-height: 40px;
  padding: 8px 20px;
  text-decoration: none;
  white-space: nowrap;
}

.h52-accept {
  background: var(--hfm-anchor);
  border: var(--hfm-fine) solid var(--hfm-anchor);
  color: var(--hfm-vivid);
}

.h52-accept:hover {
  background: #74d10a;
  color: var(--hfm-vivid);
}

.h52-decline {
  background: var(--hfm-raised);
  border: var(--hfm-fine) solid var(--hfm-border-strong);
  color: var(--hfm-text);
}

.h52-decline:hover {
  background: var(--hfm-tint);
  color: var(--hfm-text);
}

.h52-link {
  background: var(--hfm-raised);
  border: var(--hfm-fine) solid transparent;
  color: var(--hfm-subtle);
  text-decoration: underline;
}

.h52-link:hover {
  background: var(--hfm-raised);
  color: var(--hfm-text);
}

@media (min-width: 701px) {
  .h52-deck {
    flex-direction: row;
  }
}

@media (min-width: 880px) {
  .h52-wrap {
    padding-inline: var(--hfm-padding-desktop);
  }
}

@media (max-width: 720px) {
  .h52,
  .h52-wrap {
    font-size: 13px !important;
    gap: 8px !important;
    line-height: 1.35 !important;
    padding: 12px 14px !important;
  }
  .h52 {
    padding: 0 !important;
  }
  .h52 button,
  .h52-link {
    font-size: 12px !important;
    min-height: 36px !important;
    padding: 8px 14px !important;
    white-space: normal;
  }
}

/* --------------------------------------------------------------------------
   Reduced motion
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
  [data-js] [data-appear] {
    opacity: 1;
    transform: none;
  }
}

/* Offer button (cta-style output, domain-seeded: sky + stamp) */
.vrd-act{display:inline-flex;align-items:center;justify-content:center;text-align:center;min-height:48px;padding:12px 26px;border-radius:var(--hfm-pill);border:var(--hfm-fine) solid transparent;font-family:var(--hfm-heading);font-size:15px;font-weight:700;letter-spacing:0.04em;line-height:1.25;text-transform:uppercase;white-space:normal;}
.vrd-act{
  background:#0284C7;color:#000000;text-decoration:none;
  transition:background var(--hfm-fast) var(--hfm-settle);}
.vrd-act.vrd-act{color:#000000;text-decoration:none;}
.vrd-act:hover{background:#0369A1;color:#FFFFFF;animation:none;transform:scale(1.015);}
.vrd-act.vrd-act:hover{color:#FFFFFF;text-decoration:none}
.vrd-act:hover::after{animation:none}
.vrd-act:active{background:#075985;color:#FFFFFF}
.vrd-act:focus-visible{outline:3px solid #FFFFFF;outline-offset:3px}
.vrd-act{animation:vrd-press 1.77s var(--hfm-both) infinite}
@keyframes vrd-press{0%{transform:translate(0,0)}14.689%{transform:translate(2px,2px)}35.028%,100%{transform:translate(0,0)}}
@media (prefers-reduced-motion:reduce){.vrd-act,.vrd-act::after{animation:none!important;transition:none!important}}

/* --------------------------------------------------------------------------
   Offer buttons — placement per context (look comes from .vrd-act above)
   -------------------------------------------------------------------------- */
.d56-go,
.r67-go,
.r88-go,
.h23-go,
.s98-go,
.s77-go,
.f03-prompt {
  flex-shrink: 0;
  position: relative;
}

.d56-go {
  box-shadow: 0 0 0 3px var(--hfm-vivid);
}

.s77-go {
  box-shadow: 0 0 0 3px var(--hfm-vivid);
}

.f03-prompt {
  gap: 8px;
}

@media (max-width: 510px) {
  .u75-index,
  .u75-series,
  .u75-more { display: none !important; }
  .u75-more-opener { display: inline-flex !important; }
}