/* Taksomateria — wspólny arkusz stylów.
   Czcionki hostowane lokalnie w assets/fonts/, patrz sekcja @font-face. */

@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 300 500;
  font-display: swap;
  src: url('./fonts/newsreader.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0100-024F, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+1E00-1EFF, U+2000-206F, U+2020, U+20A0-20AB, U+2122, U+2191, U+2193, U+2212, U+2215;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('./fonts/ibm-plex-mono-400.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0100-024F, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+1E00-1EFF, U+2000-206F, U+2020, U+20A0-20AB, U+2122, U+2191, U+2193, U+2212, U+2215;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('./fonts/ibm-plex-mono-500.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0100-024F, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+1E00-1EFF, U+2000-206F, U+2020, U+20A0-20AB, U+2122, U+2191, U+2193, U+2212, U+2215;
}

:root {
  --bg: #F4F0EC;
  --surface: #FFFFFF;
  --ink: #1A1614;
  --ink-soft: #4A423D;
  --muted: #6B625C;
  --muted-2: #8A8079;
  --border: #E7E1DC;
  --border-strong: #DED7D1;
  --border-soft: #C9BEB6;
  --brand: #6E2639;
  --brand-dark: #5C2233;
  --brand-light: #8A3A4A;
  --on-brand: #FBF6F7;
  --dark-bg: #1A1614;
  --dark-text: #F4F0EC;
  --dark-text-soft: #C7BFB9;
  --dark-eyebrow: #9A8F87;
  --dark-meta: #A8A09A;
  --font-serif: 'Newsreader', Georgia, serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
  --container: 1160px;
  --gutter: clamp(24px, 5vw, 56px);
}

/* ---------- reset & base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-serif);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, p, figure { margin: 0; }
a { color: var(--brand); text-decoration: none; }
a:hover { color: var(--brand-light); }
button { font: inherit; color: inherit; }
img { display: block; max-width: 100%; }
::selection { background: var(--brand); color: var(--on-brand); }

.eyebrow {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}
.eyebrow--sm { font-size: 10px; }

.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

/* ---------- skip link ---------- */
.skip-link {
  position: absolute;
  left: 12px;
  top: -48px;
  z-index: 100;
  background: var(--brand);
  color: var(--on-brand);
  padding: 10px 18px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: top 0.15s ease;
}
.skip-link:focus { top: 12px; color: var(--on-brand); }
#main-content:focus { outline: none; }

/* ---------- header / primary nav ---------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.site-header__row {
  max-width: var(--container);
  margin: 0 auto;
  padding: 20px var(--gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.wordmark {
  font-family: var(--font-serif);
  font-size: 24px;
  font-weight: 350;
  letter-spacing: 0.02em;
  color: var(--ink);
}
.wordmark:hover { color: var(--ink); }
.wordmark span { color: var(--brand); }

.primary-nav { display: flex; align-items: center; gap: 28px; }
.nav-link {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.nav-link:hover { color: var(--brand); }

.nav-toggle {
  display: none;
  background: none;
  border: 1px solid var(--border-soft);
  padding: 8px 10px;
  cursor: pointer;
  line-height: 0;
}
.nav-toggle svg { display: block; }

/* ---------- buttons & text links ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-serif);
  font-size: 16px;
  font-weight: 350;
  padding: 14px 28px;
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
}
.btn--sm { font-size: 15px; padding: 11px 22px; }
.btn--primary { background: var(--brand); color: var(--on-brand); border-color: var(--brand); }
.btn--primary:hover { background: var(--brand-dark); border-color: var(--brand-dark); color: var(--on-brand); }
.btn--primary:disabled { opacity: 0.55; cursor: not-allowed; }
.btn--outline { background: transparent; color: var(--ink); border-color: var(--border-soft); }
.btn--outline:hover { border-color: var(--ink); color: var(--ink); }
.btn--choice { background: var(--surface); color: var(--ink); border-color: var(--border-strong); font-size: 16px; padding: 11px 20px; }
.btn--choice:hover { border-color: var(--ink); color: var(--ink); }
.btn--choice.is-active { background: var(--brand); color: var(--on-brand); border-color: var(--brand); }
.choice-row input:checked + .btn--choice { background: var(--brand); color: var(--on-brand); border-color: var(--brand); }
.choice-row input:focus-visible + .btn--choice { outline: 2px solid var(--brand); outline-offset: 2px; }

.link-underline {
  color: var(--brand);
  border-bottom: 1px solid var(--brand);
  padding-bottom: 2px;
  font-size: 16px;
  font-weight: 350;
}
.link-underline:hover { color: var(--brand-light); border-color: var(--brand-light); }
.link-text-btn {
  background: none;
  border: none;
  border-bottom: 1px solid var(--brand);
  padding: 4px 0;
  color: var(--brand);
  cursor: pointer;
  font-family: var(--font-serif);
  font-size: 17px;
  font-weight: 350;
}
.link-text-btn:hover { color: var(--brand-light); border-color: var(--brand-light); }

/* ---------- breadcrumb ---------- */
.crumbs {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  padding-top: 24px;
}
.crumbs a { color: var(--muted); }
.crumbs a:hover { color: var(--brand); }
.crumbs__sep { color: var(--border-soft); }
.crumbs__current { color: var(--ink); }

/* ---------- section rhythm ---------- */
/* padding-top/bottom only (never shorthand): these classes always combine with
   .container on the same element, and a horizontal value here would clobber its gutter. */
.section { padding-top: 96px; padding-bottom: 96px; }
.section--tight { padding-top: 80px; }
.section--tight:last-of-type { padding-bottom: 96px; }
.section--band { background: var(--surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.section--dark { background: var(--dark-bg); color: var(--dark-text); }
.section--hero { padding-top: 112px; padding-bottom: 96px; }
.section--page-hero { padding-top: 56px; }
.section--collab { padding-top: 88px; padding-bottom: 88px; }
.section--cta { padding-top: 64px; padding-bottom: 112px; }

/* single-wrapper page layouts (no separate hero/content sections) */
.page-content { padding-top: 56px; padding-bottom: 112px; }
.page-content--no-crumbs { padding-top: 96px; padding-bottom: 112px; }

.section-head__eyebrow { margin-bottom: 18px; }
h1, .h1 { font-size: 54px; font-weight: 350; line-height: 1.1; letter-spacing: 0.01em; }
h2, .h2 { font-size: 40px; font-weight: 350; line-height: 1.2; letter-spacing: 0.01em; }
h2.h2--sub { font-size: 34px; }
h3, .h3 { font-size: 24px; font-weight: 350; line-height: 1.25; }
.measure-title { max-width: 26ch; text-wrap: pretty; }
.eyebrow + .measure-title { margin-top: 18px; }
.measure { max-width: 62ch; }
.lead { max-width: 62ch; margin-top: 24px; font-size: 18px; line-height: 1.65; color: var(--ink-soft); text-wrap: pretty; }
.body-copy { font-size: 17px; line-height: 1.7; color: var(--ink-soft); text-wrap: pretty; }
.body-copy + .body-copy { margin-top: 20px; }
.body-copy--intro { font-size: 19px; color: var(--ink); }
.body-copy b, .body-copy strong { color: var(--ink); font-weight: 500; }
.muted { color: var(--muted); }

/* ---------- hero ---------- */
.hero__title { max-width: 21ch; font-size: 68px; line-height: 1.06; }
.hero__lead { max-width: 58ch; margin-top: 28px; font-size: 20px; line-height: 1.6; color: var(--ink-soft); text-wrap: pretty; }
.cta-row { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 40px; }

/* ---------- grids: services / features / who-for ---------- */
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.grid-3--wide { gap: 40px; }
.card {
  border-top: 2px solid var(--brand);
  padding-top: 22px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.card__tag { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.feature { display: flex; flex-direction: column; gap: 14px; }
.feature h3 { font-size: 22px; }

.who-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 56px; }
.who-item { border-top: 1px solid var(--border); padding: 22px 0; display: flex; align-items: baseline; gap: 16px; }
.who-item svg { flex: none; position: relative; top: 3px; }
.who-item__body { display: flex; flex-direction: column; gap: 6px; }
.who-item__title { font-size: 21px; font-weight: 350; }
.who-item__desc { font-size: 15px; color: var(--muted); line-height: 1.55; }

/* ---------- numbered process steps ---------- */
.steps { margin-top: 48px; max-width: 900px; }
.step {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 28px;
  padding: 26px 0;
  border-top: 1px solid var(--border);
}
.step:last-child { border-bottom: 1px solid var(--border); }
.step--tight { padding: 22px 0; }
.step__num { font-family: var(--font-mono); font-size: 12px; color: var(--brand); padding-top: 8px; }
.step--tight .step__num { padding-top: 6px; }
.step__body { display: flex; flex-direction: column; gap: 8px; }
.step__title { font-size: 24px; font-weight: 350; }
.step__desc { font-size: 16px; line-height: 1.6; color: var(--ink-soft); max-width: 62ch; text-wrap: pretty; }
.step__desc--wide { max-width: 62ch; }

.callout {
  margin-top: 44px;
  max-width: 62ch;
  padding: 28px 32px;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-left: 2px solid var(--brand);
}
.callout__title { font-size: 20px; font-weight: 350; }
.callout__body { margin-top: 10px; font-size: 16px; line-height: 1.6; color: var(--ink-soft); text-wrap: pretty; }

/* ---------- about (dark) ---------- */
.about { display: grid; grid-template-columns: 340px 1fr; gap: 72px; align-items: start; }
.about__portrait { display: flex; flex-direction: column; gap: 16px; }
.about__portrait img { width: 100%; height: auto; }
.about__name { font-size: 18px; font-weight: 500; }
.about__role { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--dark-meta); }
.about__col { display: flex; flex-direction: column; gap: 24px; }
.about__eyebrow { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--dark-eyebrow); }
.about__title { max-width: 30ch; font-size: 38px; font-weight: 350; line-height: 1.22; letter-spacing: 0.01em; text-wrap: pretty; }
.about__body { max-width: 62ch; font-size: 17px; line-height: 1.7; color: var(--dark-text-soft); text-wrap: pretty; }
.about__body + .about__body { margin-top: -8px; }

/* ---------- FAQ (native details/summary) ---------- */
.faq-list { margin-top: 44px; max-width: 900px; }
.faq-item { border-top: 1px solid var(--border); }
.faq-list .faq-item:last-child { border-bottom: 1px solid var(--border); }
.faq-item summary {
  list-style: none;
  cursor: pointer;
  padding: 24px 0;
  display: flex;
  gap: 24px;
  justify-content: space-between;
  align-items: baseline;
  font-family: var(--font-serif);
  font-size: 21px;
  font-weight: 350;
  color: var(--ink);
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--brand); }
.faq-item summary .eyebrow { flex: none; }
.faq-item__answer { padding: 0 0 28px; max-width: 62ch; font-size: 16px; line-height: 1.7; color: var(--ink-soft); text-wrap: pretty; }
.faq-item__answer p { margin: 0 0 12px; }
.faq-item__answer p:last-child { margin-bottom: 0; }

/* FAQ variant used on offer pages: question + answer side by side */
.qa-grid { margin-top: 36px; max-width: 1060px; }
.qa-item { border-top: 1px solid var(--border); padding: 26px 0; display: grid; grid-template-columns: 1fr 1.5fr; gap: 16px 48px; align-items: start; }
.qa-grid .qa-item:last-child { border-bottom: 1px solid var(--border); }
.qa-item h3 { max-width: 44ch; font-size: 20px; font-weight: 350; line-height: 1.35; }
.qa-item__answer { font-size: 16px; line-height: 1.7; color: var(--ink-soft); text-wrap: pretty; }

/* ---------- pricing table ---------- */
.price-table { margin-top: 56px; background: var(--surface); border: 1px solid var(--border-strong); }
.price-row {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr;
  gap: 24px;
  padding: 26px 28px;
  border-bottom: 1px solid var(--border);
  align-items: baseline;
}
.price-row:last-child { border-bottom: none; }
.price-row--head {
  padding: 18px 28px;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}
.price-row__name { font-size: 21px; font-weight: 350; }
.price-row__tag { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin-top: 6px; }
.price-row__who { font-size: 16px; color: var(--ink-soft); line-height: 1.55; }
.price-row__amount { font-family: var(--font-mono); font-size: 17px; }
.price-row__unit { font-size: 11px; color: var(--muted); margin-top: 4px; }

.value-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; margin-top: 64px; }
.value-card { display: flex; flex-direction: column; gap: 12px; border-top: 2px solid var(--brand); padding-top: 20px; }
.value-card h3 { font-size: 20px; font-weight: 350; }

.includes { margin-top: 64px; }
.includes-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 56px; margin-top: 20px; }
.includes-item { border-top: 1px solid var(--border); padding: 16px 0; font-size: 17px; line-height: 1.55; color: var(--ink); text-wrap: pretty; }
.includes-grid .includes-item:nth-last-child(-n+1) { border-bottom: 1px solid var(--border); }

.stat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin-top: 36px; }
.stat { border-top: 2px solid var(--brand); padding-top: 20px; display: flex; flex-direction: column; gap: 10px; }
.stat__amount { font-family: var(--font-mono); font-size: 22px; color: var(--ink); }
.stat__amount span { font-size: 13px; color: var(--muted); }
.stat__desc { font-size: 15px; line-height: 1.55; color: var(--muted); }

/* ---------- CTA band ---------- */
.cta-card {
  margin-top: 64px;
  padding: 40px;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
  flex-wrap: wrap;
}
.cta-card__title { font-size: 26px; font-weight: 350; line-height: 1.25; }
.cta-card__desc { margin-top: 10px; font-size: 16px; line-height: 1.6; color: var(--ink-soft); text-wrap: pretty; max-width: 46ch; }
.cta-card__desc small { color: var(--muted); font-size: 15px; }

/* ---------- two-column content ---------- */
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; margin-top: 64px; align-items: start; }
.two-col__label { margin-bottom: 20px; }
.checklist { display: flex; flex-direction: column; }
.checklist__item { border-top: 1px solid var(--border); padding: 18px 0; font-size: 17px; line-height: 1.55; }
.checklist .checklist__item:last-child { border-bottom: 1px solid var(--border); }

/* ---------- footer ---------- */
.site-footer { background: var(--surface); border-top: 1px solid var(--border-strong); }
.site-footer__grid {
  max-width: var(--container);
  margin: 0 auto;
  padding: 64px var(--gutter) 48px;
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1fr;
  gap: 48px;
  align-items: start;
}
.site-footer__grid--3col { grid-template-columns: 1.4fr 1fr 1fr; }
.site-footer__brand { display: flex; flex-direction: column; gap: 16px; }
.site-footer__wordmark { font-size: 26px; font-weight: 350; letter-spacing: 0.02em; }
.site-footer__wordmark span { color: var(--brand); }
.site-footer__legal { font-size: 15px; line-height: 1.65; color: var(--muted); max-width: 40ch; }
.site-footer__col { display: flex; flex-direction: column; gap: 12px; }
.site-footer__col a { font-family: var(--font-serif); font-size: 16px; font-weight: 400; color: var(--ink-soft); }
.site-footer__col a:hover { color: var(--brand); }
.site-footer__policy-link { margin-top: 6px; }
.site-footer__bottom { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter) 40px; }
.site-footer__copyright { border-top: 1px solid var(--border); padding-top: 20px; font-family: var(--font-mono); font-size: 11px; color: var(--muted); }

/* ---------- forms (wycena) ---------- */
.form-card { margin-top: 48px; max-width: 860px; background: var(--surface); border: 1px solid var(--border-strong); padding: 40px; display: flex; flex-direction: column; gap: 32px; }
.form-note { font-size: 14px; line-height: 1.55; color: var(--muted); }
.form-note .req-mark { color: var(--brand); }
.field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.field-grid--nums { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.field { display: flex; flex-direction: column; gap: 8px; }
.field label { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); }
.field label .req-mark, .choice-group label .req-mark { color: var(--brand); font-size: 13px; line-height: 0; vertical-align: super; margin-left: 2px; }
.field input {
  font-family: var(--font-serif);
  font-size: 17px;
  color: var(--ink);
  background: var(--surface);
  border: 1px solid var(--border-strong);
  padding: 12px 14px;
  width: 100%;
}
.field input:focus { border-color: var(--brand); }
.field input:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.field__hint { font-size: 13px; line-height: 1.45; color: var(--muted); }
.field__error, .form-error { font-size: 13px; line-height: 1.45; color: var(--brand); }
.field.has-error input { border-color: var(--brand); }
.choice-group { display: flex; flex-direction: column; gap: 14px; }
.choice-row { display: flex; flex-wrap: wrap; gap: 10px; }
.choice-notes { display: flex; flex-direction: column; gap: 6px; max-width: 68ch; font-size: 14px; line-height: 1.55; color: var(--muted); text-wrap: pretty; }
.consent-block { border-top: 1px solid var(--border); padding-top: 28px; display: flex; flex-direction: column; gap: 18px; }
.consent-block__legal { font-size: 14px; line-height: 1.65; color: var(--muted); text-wrap: pretty; }
.consent-check { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; line-height: 1.55; color: var(--ink-soft); cursor: pointer; }
.consent-check input { margin-top: 4px; accent-color: var(--brand); flex: none; }
.submit-row { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.honeypot-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.confirm-card { margin-top: 48px; max-width: 860px; background: var(--surface); border: 1px solid var(--border-strong); padding: 40px; display: flex; flex-direction: column; gap: 16px; }
.confirm-card[hidden] { display: none; }
.confirm-card__title { font-size: 26px; font-weight: 350; }

/* ---------- privacy policy ---------- */
.legal-doc { margin-top: 56px; max-width: 68ch; display: flex; flex-direction: column; gap: 28px; }
.legal-doc h2 { font-size: 20px; font-weight: 350; }
.legal-doc__body { margin-top: 10px; font-size: 16px; line-height: 1.7; color: var(--ink-soft); text-wrap: pretty; }
.legal-doc__points { margin-top: 14px; display: flex; flex-direction: column; gap: 18px; }
.legal-doc__point { border-left: 2px solid var(--brand); padding-left: 18px; }
.legal-doc__point-title { font-size: 17px; font-weight: 500; }
.legal-doc__point-body { margin-top: 6px; font-size: 15px; line-height: 1.65; color: var(--ink-soft); text-wrap: pretty; }
.legal-doc__list { margin-top: 10px; padding-left: 22px; display: flex; flex-direction: column; gap: 8px; font-size: 16px; line-height: 1.7; color: var(--ink-soft); text-wrap: pretty; }
.legal-doc__note { border-top: 1px solid var(--border); padding-top: 20px; font-size: 14px; line-height: 1.65; color: var(--muted-2); text-wrap: pretty; }
.doc-date { margin-top: 16px; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.08em; color: var(--muted); }

.visually-hidden { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.gtm-noscript { display: none; visibility: hidden; }

/* ================= responsive ================= */
@media (max-width: 860px) {
  .primary-nav {
    position: fixed;
    inset: 73px 0 0 0;
    background: var(--surface);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 8px 24px 24px;
    overflow-y: auto;
    transform: translateY(-12px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease, transform 0.15s ease;
  }
  .primary-nav .nav-link { padding: 14px 0; border-top: 1px solid var(--border); font-size: 13px; }
  .primary-nav .btn { margin-top: 16px; align-self: flex-start; }
  .nav-toggle { display: inline-flex; align-items: center; justify-content: center; }
  .site-header.is-open .primary-nav { transform: translateY(0); opacity: 1; pointer-events: auto; }
  .site-header.is-open .icon-open { display: none; }
  .site-header:not(.is-open) .icon-close { display: none; }

  .hero__title { font-size: 44px; }
  h1, .h1 { font-size: 38px; }
  h2, .h2 { font-size: 30px; }
  h2.h2--sub { font-size: 26px; }
  .about__title { font-size: 30px; }

  .grid-3, .grid-3--wide, .who-grid, .two-col, .includes-grid, .stat-grid, .value-grid { grid-template-columns: 1fr; gap: 32px; }
  .who-grid { gap: 0; }
  .about { grid-template-columns: 1fr; gap: 32px; }
  .about__portrait { max-width: 260px; }
  .field-grid, .field-grid--nums { grid-template-columns: 1fr; }
  .qa-item { grid-template-columns: 1fr; gap: 10px; }
  .price-row, .price-row--head { grid-template-columns: 1fr; gap: 8px; }
  .price-row__amount { justify-self: start; }

  .cta-card, .cta-card > .btn { flex-direction: column; align-items: flex-start; }
  .cta-card > .btn { width: 100%; }

  .section, .section--hero { padding-top: 64px; padding-bottom: 64px; }
  .section--tight { padding-top: 56px; }
  .section--tight:last-of-type { padding-bottom: 64px; }
}

@media (max-width: 520px) {
  .hero__title { font-size: 34px; }
  h1, .h1 { font-size: 32px; }
  .site-footer__grid { grid-template-columns: 1fr; gap: 32px; }
}

/* print (kept from the original export) */
@media print {
  .site-header, .nav-toggle { position: static; }
}
