/* ==========================================================================
   Zenera — main stylesheet
   Design tokens sourced 1:1 from workspace/artifacts/ux_ui_designer/design_system.json
   ========================================================================== */

/* ---- Fonts (self-hosted, Google Fonts "latin" + "latin-ext" subsets so
   Romanian diacritics ă â î ș ț render — â/î live in "latin", ă/ș/ț live in
   "latin-ext"; both are needed, neither subset alone covers Romanian) ---- */
@font-face {
  font-family: 'Quicksand';
  src: url('/fonts/quicksand-400-latin-ext.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  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: 'Quicksand';
  src: url('/fonts/quicksand-400-latin.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  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: 'Quicksand';
  src: url('/fonts/quicksand-500-latin-ext.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  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: 'Quicksand';
  src: url('/fonts/quicksand-500-latin.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  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: 'Quicksand';
  src: url('/fonts/quicksand-600-latin-ext.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  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: 'Quicksand';
  src: url('/fonts/quicksand-600-latin.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  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: 'Quicksand';
  src: url('/fonts/quicksand-700-latin-ext.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  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: 'Quicksand';
  src: url('/fonts/quicksand-700-latin.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  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: 'Chango';
  src: url('/fonts/chango-400-latin-ext.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  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: 'Chango';
  src: url('/fonts/chango-400-latin.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  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 {
  /* Reenie Beanie has no latin-ext subset upstream — accent-only decorative
     text falls back to the 'cursive' stack for ă/ș/ț glyphs, a Google Fonts
     upstream limitation, not a build issue. */
  font-family: 'Reenie Beanie';
  src: url('/fonts/reenie-beanie-400-latin.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  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;
}

:root {
  /* Color */
  --color-charcoal: #3B3547;
  --color-cream: #F2EFE9;
  --color-cream-tint: #FAF8F4;
  --color-charcoal-40: #5C5670;
  --color-charcoal-70: #8A8596;
  --color-border-hairline: #DAD4C8;
  --color-white: #FFFFFF;
  --color-success: #5C7A5C;
  --color-error: #A2503D;
  --color-focus-ring: #3B3547;

  /* Typography */
  --font-body: 'Quicksand', 'Helvetica Neue', Arial, sans-serif;
  --font-logo: 'Chango', cursive;
  --font-accent: 'Reenie Beanie', cursive;

  /* Spacing */
  --space-xs: 4px; --space-sm: 8px; --space-md: 16px; --space-lg: 24px;
  --space-xl: 32px; --space-2xl: 48px; --space-3xl: 64px; --space-4xl: 96px; --space-5xl: 128px;

  /* Radius */
  --radius-sm: 4px; --radius-md: 8px; --radius-lg: 16px; --radius-pill: 999px;

  /* Shadow */
  --shadow-sm: 0 1px 3px rgba(59,53,71,0.08);
  --shadow-md: 0 4px 16px rgba(59,53,71,0.12);

  /* Motion */
  --duration-fast: 150ms;
  --duration-base: 250ms;
  --duration-slow: 400ms;
}

/* ---- Reset / base ---- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--color-charcoal);
  background: var(--color-cream);
  font-weight: 400;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
ul, ol { margin: 0; padding: 0; list-style: none; }
p { margin: 0 0 var(--space-md); }
table { border-collapse: collapse; width: 100%; }

h1, h2, h3, h4 { font-family: var(--font-body); font-weight: 600; margin: 0 0 var(--space-md); color: var(--color-charcoal); }
h1 { font-size: 28px; line-height: 1.25; }
h2 { font-size: 22px; line-height: 1.3; margin-top: var(--space-2xl); }
h3 { font-size: 18px; line-height: 1.35; }
h4 { font-size: 16px; line-height: 1.4; }
@media (min-width: 640px) {
  h1 { font-size: 34px; }
  h2 { font-size: 26px; }
  h3 { font-size: 19px; }
}
@media (min-width: 1024px) {
  h1 { font-size: 40px; }
  h2 { font-size: 28px; }
  h3 { font-size: 20px; }
}

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

:focus-visible {
  outline: 2px solid var(--color-focus-ring);
  outline-offset: 2px;
}

.skip-link {
  position: absolute; left: 0; top: -100px; z-index: 1000;
  background: var(--color-charcoal); color: var(--color-cream);
  padding: var(--space-sm) var(--space-md); border-radius: 0 0 var(--radius-sm) 0;
  transition: top var(--duration-fast) ease-out;
}
.skip-link:focus { top: 0; }

.container, main > section, main > .section {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--space-md);
}
@media (min-width: 640px) { .container, main > section, main > .section { padding: 0 var(--space-xl); } }
@media (min-width: 1024px) { .container, main > section, main > .section { padding: 0 var(--space-3xl); } }

main > section, main > .section { padding-top: var(--space-2xl); padding-bottom: var(--space-2xl); }
@media (min-width: 640px) { main > section, main > .section { padding-top: var(--space-3xl); padding-bottom: var(--space-3xl); } }
@media (min-width: 1024px) { main > section, main > .section { padding-top: var(--space-4xl); padding-bottom: var(--space-4xl); } }

.section--tint { background: var(--color-cream-tint); }
.prose { max-width: 720px; }
.prose ul, .content-measure ul { padding-left: 1.25em; list-style: disc; margin-bottom: var(--space-md); }
.prose li, .content-measure li { margin-bottom: var(--space-xs); }

/* ---- Buttons ---- */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: 0 var(--space-lg);
  font-family: var(--font-body); font-weight: 600; font-size: 16px; letter-spacing: 0.01em;
  border-radius: var(--radius-md); text-decoration: none; cursor: pointer;
  border: 1.5px solid transparent; transition: background var(--duration-fast) ease-out, color var(--duration-fast) ease-out;
}
.btn--primary { background: var(--color-charcoal); color: var(--color-cream); }
.btn--primary:hover, .btn--primary:focus-visible { background: #2c2738; }
.btn--secondary { background: transparent; border-color: var(--color-charcoal); color: var(--color-charcoal); }
.btn--secondary:hover, .btn--secondary:focus-visible { background: var(--color-charcoal); color: var(--color-cream); }
.btn--tertiary { background: transparent; color: var(--color-charcoal); text-decoration: underline; min-height: auto; padding: var(--space-xs) 0; }
.btn--instagram { background: var(--color-charcoal); color: var(--color-cream); }
.btn-row { display: flex; gap: var(--space-md); flex-wrap: wrap; margin: var(--space-lg) 0; }
.link-button { background: none; border: none; padding: 0; color: var(--color-charcoal); text-decoration: underline; cursor: pointer; font: inherit; }

/* ---- Header ---- */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: var(--color-cream); border-bottom: 1px solid var(--color-border-hairline);
}
.site-header__inner {
  max-width: 1200px; margin: 0 auto; padding: var(--space-md);
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-md);
}
.logo-wordmark { font-family: var(--font-logo); font-size: 24px; color: var(--color-charcoal); text-decoration: none; }
.logo-wordmark--footer { color: var(--color-cream); font-size: 28px; }
.site-header__logo { text-decoration: none; }

.nav-toggle {
  display: inline-flex; flex-direction: column; gap: 5px; align-items: center; justify-content: center;
  width: 44px; height: 44px; background: none; border: none; cursor: pointer;
}
.nav-toggle__bar, .nav-toggle__bar::before, .nav-toggle__bar::after {
  content: ''; display: block; width: 22px; height: 2px; background: var(--color-charcoal);
}
.nav-toggle__bar::before { transform: translateY(-6px); }
.nav-toggle__bar::after { transform: translateY(4px); }

.primary-nav__list { display: flex; flex-wrap: wrap; gap: var(--space-md); align-items: center; }
.primary-nav__list a { text-decoration: none; padding: var(--space-sm) 0; }
.primary-nav__list a[aria-current="page"] { text-decoration: underline; text-underline-offset: 4px; }
.has-dropdown { position: relative; }
.dropdown {
  display: none; position: absolute; top: 100%; left: 0; min-width: 220px;
  background: var(--color-cream); border: 1px solid var(--color-border-hairline);
  border-radius: var(--radius-md); box-shadow: var(--shadow-md); padding: var(--space-sm) 0; z-index: 50;
}
.has-dropdown:hover .dropdown, .has-dropdown:focus-within .dropdown { display: block; }
.dropdown li a { display: block; padding: var(--space-sm) var(--space-md); }
.dropdown li a:hover, .dropdown li a:focus-visible { background: var(--color-cream-tint); }

.primary-nav__actions { display: flex; align-items: center; gap: var(--space-md); margin-left: auto; }
.lang-switch {
  display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px;
  border-radius: var(--radius-pill); border: 1.5px solid var(--color-charcoal); text-decoration: none; font-weight: 600;
}
.lang-switch--disabled { opacity: 0.5; border-style: dashed; cursor: not-allowed; }

@media (max-width: 1023px) {
  .nav-toggle { display: inline-flex; }
  .primary-nav {
    position: fixed; inset: 0 0 0 auto; width: min(320px, 85vw); height: 100vh;
    background: var(--color-cream); box-shadow: var(--shadow-md);
    transform: translateX(100%); transition: transform var(--duration-base) ease-out;
    padding: var(--space-xl) var(--space-md); overflow-y: auto;
  }
  .primary-nav[data-open="true"] { transform: translateX(0); }
  .primary-nav__list { flex-direction: column; align-items: flex-start; width: 100%; }
  .dropdown { display: block; position: static; box-shadow: none; border: none; padding-left: var(--space-md); }
  .primary-nav__actions { flex-direction: column; align-items: stretch; margin-top: var(--space-lg); width: 100%; }
  .primary-nav__actions .btn { width: 100%; }
}
@media (min-width: 1024px) {
  .nav-toggle { display: none; }
  .primary-nav { display: flex; align-items: center; gap: var(--space-lg); flex: 1; justify-content: flex-end; }
}

/* ---- Breadcrumb ---- */
.breadcrumb { padding: var(--space-sm) var(--space-md); font-size: 14px; color: var(--color-charcoal-40); }
.breadcrumb__list { display: flex; flex-wrap: wrap; gap: var(--space-xs); max-width: 1200px; margin: 0 auto; }
.breadcrumb a { text-decoration: underline; }
@media (min-width: 640px) { .breadcrumb { padding: var(--space-sm) var(--space-xl); } }
@media (min-width: 1024px) { .breadcrumb { padding: var(--space-sm) var(--space-3xl); } }

/* ---- Hero ---- */
.hero { padding-top: var(--space-3xl); }
.hero__eyebrow { font-family: var(--font-accent); font-size: 26px; color: var(--color-charcoal-40); display: block; margin-bottom: var(--space-sm); }
.hero__intro { font-size: 17px; line-height: 1.6; max-width: 640px; }
@media (min-width: 640px) { .hero__intro { font-size: 18px; } }
.hero__rating { font-size: 14px; color: var(--color-charcoal-40); margin-top: var(--space-sm); }

/* ---- Responsive images (placeholder brand graphics until real photography ships) ---- */
.responsive-image { display: block; margin: 0; }
.responsive-image img { width: 100%; height: auto; border-radius: var(--radius-lg); }
.hero--split { display: grid; grid-template-columns: 1fr; gap: var(--space-lg); align-items: center; }
.hero--split .hero__media { order: -1; }
@media (min-width: 768px) {
  .hero--split { grid-template-columns: 1fr 1fr; gap: var(--space-2xl); }
  .hero--split .hero__media { order: 1; }
}
.section__media { margin-top: var(--space-xl); max-width: 640px; }

/* ---- Entry router cards ---- */
.entry-grid { display: grid; grid-template-columns: 1fr; gap: var(--space-md); }
@media (min-width: 640px) { .entry-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .entry-grid { grid-template-columns: repeat(4, 1fr); } }
.entry-card {
  display: flex; align-items: center; gap: var(--space-md); min-height: 64px;
  background: var(--color-cream-tint); border: 1px solid var(--color-border-hairline);
  border-radius: var(--radius-md); padding: var(--space-md); text-decoration: none; color: var(--color-charcoal);
  transition: box-shadow var(--duration-fast) ease-out;
}
.entry-card:hover, .entry-card:focus-visible { box-shadow: var(--shadow-sm); }
.entry-card__icon { font-size: 24px; }
.entry-card__label { font-weight: 600; }

/* ---- Stat block ---- */
.stat-block { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-lg); text-align: center; }
@media (min-width: 640px) { .stat-block { grid-template-columns: repeat(4, 1fr); } }
.stat-block__value { font-size: 32px; font-weight: 600; margin: 0; }
.stat-block__label { font-size: 14px; color: var(--color-charcoal-40); margin: 0; }

/* ---- Cards ---- */
.card-grid { display: grid; grid-template-columns: 1fr; gap: var(--space-md); }
@media (min-width: 640px) { .card-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .card-grid--3 { grid-template-columns: repeat(3, 1fr); } .card-grid--4 { grid-template-columns: repeat(4, 1fr); } }
.card {
  display: block; padding: var(--space-lg); border-radius: var(--radius-md); text-decoration: none; color: var(--color-charcoal);
  border: 1px solid var(--color-border-hairline);
}
.card--cream-tint { background: var(--color-cream-tint); }
.card--cream-base { background: var(--color-cream); }
.card__title { margin: 0 0 var(--space-sm); }
.card__description { margin: 0 0 var(--space-sm); font-size: 14px; }
.card__meta { margin: 0; font-size: 14px; font-weight: 600; color: var(--color-charcoal-40); }

/* ---- Testimonials ---- */
.testimonial-grid { display: grid; grid-template-columns: 1fr; gap: var(--space-lg); }
@media (min-width: 640px) { .testimonial-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .testimonial-grid { grid-template-columns: repeat(3, 1fr); } }
.testimonial-card { background: var(--color-cream-tint); border-radius: var(--radius-md); padding: var(--space-lg); margin: 0; }
.testimonial-card__quote p { font-size: 18px; font-family: var(--font-accent); line-height: 1.4; margin: 0 0 var(--space-sm); }
.testimonial-card__attribution { font-size: 14px; color: var(--color-charcoal-40); }

/* ---- Pricing ---- */
.pricing-tables { display: grid; grid-template-columns: 1fr; gap: var(--space-xl); }
@media (min-width: 1024px) { .pricing-tables { grid-template-columns: 1fr 1fr; } }
.pricing-group__title { margin-top: 0; }
.pricing-table th, .pricing-table td { text-align: left; padding: var(--space-sm) var(--space-md); border-bottom: 1px solid var(--color-border-hairline); }
.pricing-table tbody tr { cursor: pointer; }
.pricing-table tbody tr:hover, .pricing-table tbody tr:focus-within { background: var(--color-cream-tint); }
.pricing-group__note { font-size: 14px; color: var(--color-charcoal-40); }

.duration-list__row {
  display: flex; justify-content: space-between; padding: var(--space-md); min-height: 48px;
  border: 1px solid var(--color-border-hairline); border-radius: var(--radius-sm); margin-bottom: var(--space-sm); cursor: pointer;
}
.duration-list__row:hover, .duration-list__row:focus-within { background: var(--color-cream-tint); }
.duration-list__price { font-weight: 600; }

/* ---- FAQ accordion ---- */
.faq-accordion { max-width: 720px; }
.faq-item { border-bottom: 1px solid var(--color-border-hairline); }
.faq-item__heading { margin: 0; }
.faq-item__question {
  width: 100%; display: flex; justify-content: space-between; align-items: center; gap: var(--space-md);
  background: none; border: none; text-align: left; font: inherit; font-weight: 600; color: var(--color-charcoal);
  padding: var(--space-md) 0; min-height: 48px; cursor: pointer;
}
.faq-item__chevron { transition: transform var(--duration-base) ease-out; }
.faq-item__question[aria-expanded="true"] .faq-item__chevron { transform: rotate(180deg); }
.faq-item__answer { padding: 0 0 var(--space-md); }
.faq-item__answer[hidden] { display: none; }

/* ---- Form ---- */
.form-field { margin-bottom: var(--space-md); display: flex; flex-direction: column; gap: var(--space-xs); max-width: 480px; }
.form-field label { font-weight: 600; }
.form-field input, .form-field textarea, .form-field select {
  font: inherit; font-size: 16px; padding: var(--space-sm) var(--space-md); border: 1.5px solid var(--color-border-hairline);
  border-radius: var(--radius-sm); background: var(--color-white);
}
.form-field__error { color: var(--color-error); font-size: 14px; }
.form-summary-error { border: 1.5px solid var(--color-error); border-radius: var(--radius-sm); padding: var(--space-md); margin-bottom: var(--space-md); }

/* ---- Alerts / banners ---- */
.consent-banner {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 200;
  background: var(--color-cream-tint); border-top: 1px solid var(--color-border-hairline);
  padding: var(--space-md); box-shadow: var(--shadow-md);
}
.consent-banner__actions { display: flex; gap: var(--space-sm); flex-wrap: wrap; margin-top: var(--space-sm); }
.consent-banner[hidden] { display: none; }
.inline-info { background: var(--color-cream-tint); border-radius: var(--radius-sm); padding: var(--space-md); }

/* ---- Sticky mobile CTA bar ---- */
.sticky-cta-bar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 90;
  background: var(--color-cream); border-top: 1px solid var(--color-border-hairline);
  padding: var(--space-sm) var(--space-md); padding-bottom: calc(var(--space-sm) + env(safe-area-inset-bottom));
  box-shadow: var(--shadow-md);
}
.sticky-cta-bar .btn { width: 100%; }
.sticky-cta-bar[hidden] { display: none; }
@media (min-width: 1024px) { .sticky-cta-bar { display: none !important; } }

/* ---- Footer ---- */
.site-footer { background: var(--color-charcoal); color: var(--color-cream); }
.site-footer a { color: var(--color-cream); }
.site-footer__inner {
  max-width: 1200px; margin: 0 auto; padding: var(--space-3xl) var(--space-md);
  display: grid; grid-template-columns: 1fr; gap: var(--space-xl);
}
@media (min-width: 640px) { .site-footer__inner { grid-template-columns: 1fr 1fr; padding: var(--space-3xl) var(--space-xl); } }
@media (min-width: 1024px) { .site-footer__inner { grid-template-columns: 2fr 1fr 1fr 1fr; padding: var(--space-4xl) var(--space-3xl); } }
.footer-col__heading { color: var(--color-cream); font-size: 16px; }
.footer-nav { display: flex; gap: var(--space-xl); }
.footer-nav__list li { margin-bottom: var(--space-sm); }
.footer-social { display: flex; gap: var(--space-md); margin-top: var(--space-md); }
.footer-lead-time { font-size: 14px; opacity: 0.85; }
.site-footer address { font-style: normal; }

/* ---- Utility layout helpers used by page bodies ---- */
.two-col { display: grid; grid-template-columns: 1fr; gap: var(--space-lg); }
@media (min-width: 1024px) { .two-col { grid-template-columns: 1fr 1fr; align-items: start; } }
.cta-band { text-align: center; padding-top: var(--space-2xl); padding-bottom: var(--space-2xl); }
.numbered-list { counter-reset: item; padding-left: 0; }
.numbered-list li { counter-increment: item; padding-left: var(--space-xl); position: relative; margin-bottom: var(--space-sm); }
.numbered-list li::before { content: counter(item) "."; position: absolute; left: 0; font-weight: 600; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; }
}