/* ============================================================
   SITE STYLESHEET — handwritten, BEM, CSS custom properties
   Two design families:
     .pub-*   → publication (advertorial + about)
     .offer-* → offer product page + legal/contact pages
   Shared: reset, buttons, disclaimer, footer, forms, utilities
   ============================================================ */

/* ---------- Reset & base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  min-width: 0;
  overflow-x: hidden;
  font-family: var(--font-sans);
  color: var(--ink, #16181c);
  background: var(--bg, #fff);
  line-height: 1.5;
}
img, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, p, figure { margin: 0; }
button { font: inherit; cursor: pointer; }
input, textarea, select { font: inherit; }

:root {
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-serif: Georgia, "Times New Roman", Times, serif;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 40px;
  --space-5: 64px;
  --space-6: 96px;
  --shadow-sm: 0 1px 3px rgba(20, 20, 20, 0.08);
  --shadow-md: 0 8px 24px rgba(20, 20, 20, 0.12);
  --shadow-lg: 0 20px 48px rgba(20, 20, 20, 0.18);
}

.wrap {
  width: 100%;
  max-width: 1180px;
  margin-inline: auto;
  padding-inline: 16px;
}
@media (min-width: 768px) { .wrap { padding-inline: 32px; } }

.skip-link {
  position: absolute;
  left: -999px;
  top: 0;
  background: #16181c;
  color: #fff;
  padding: 12px 20px;
  z-index: 999;
  border-radius: 0 0 8px 0;
}
.skip-link:focus { left: 0; }

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* ---------- Buttons (shared, accent CTA treatment borrowed from advertorial accent ref) ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 13px 28px;
  border-radius: var(--radius-sm);
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.01em;
  border: 2px solid transparent;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease;
  cursor: pointer;
  text-align: center;
}
.btn:focus-visible { outline: 3px solid #ffb703; outline-offset: 2px; }
.btn:active { transform: translateY(1px); }
.btn--block { width: 100%; }

/* Publication CTA: bold rectangular ink button (accent borrow) */
.btn--pub-primary {
  background: var(--pub-accent);
  color: #fff;
  box-shadow: var(--shadow-sm);
}
.btn--pub-primary:hover { background: var(--pub-accent-hover); box-shadow: var(--shadow-md); }
.btn--pub-outline {
  background: transparent;
  color: var(--pub-ink);
  border-color: var(--pub-ink);
}
.btn--pub-outline:hover { background: var(--pub-ink); color: #fff; }

/* Offer CTA */
.btn--offer-primary {
  background: var(--offer-accent);
  color: var(--offer-accent-ink);
}
.btn--offer-primary:hover { background: var(--offer-accent-hover); box-shadow: var(--shadow-md); }
.btn--offer-outline {
  background: transparent;
  color: #fff;
  border-color: rgba(255,255,255,0.55);
}
.btn--offer-outline:hover { background: rgba(255,255,255,0.12); border-color: #fff; }
.btn--offer-outline-dark {
  background: transparent;
  color: var(--offer-ink);
  border-color: var(--offer-ink);
}
.btn--offer-outline-dark:hover { background: var(--offer-ink); color: #fff; }

/* ---------- Disclaimer & Footer (shared across all pages) ---------- */
.site-disclaimer {
  display: block;
  max-width: 1180px;
  margin: 0 auto;
  padding: var(--space-3) 16px;
  font-size: 14px;
  line-height: 1.6;
  color: #4a4f55;
  background: #f3f1ec;
  border-top: 1px solid #e2ded4;
}
.site-disclaimer a { text-decoration: underline; font-weight: 600; color: #2a2d31; }
.site-disclaimer p { margin: 0 0 8px; }
.site-disclaimer p:last-child { margin-bottom: 0; }

.site-footer {
  background: #14181c;
  color: #d7dadd;
  padding: var(--space-4) 16px var(--space-5);
}
.site-footer__inner {
  max-width: 1180px;
  margin: 0 auto;
  display: grid;
  gap: var(--space-3);
}
.site-footer__company {
  font-size: 14px;
  line-height: 1.7;
  white-space: pre-line;
  color: #b9bec3;
}
.site-footer__links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  padding-top: var(--space-2);
  border-top: 1px solid rgba(255,255,255,0.12);
}
.site-footer__links a {
  font-size: 14px;
  font-weight: 600;
  color: #eef0f2;
  padding: 6px 0;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.site-footer__links a:hover,
.site-footer__links a:focus-visible { color: var(--offer-accent, #9dbf8c); text-decoration: underline; }

/* ============================================================
   PUBLICATION FAMILY (advertorial + about)
   ============================================================ */
.pub {
  --bg: #fbf8f3;
  --ink: #17181a;
  background: var(--bg);
  color: var(--ink);
}
.pub-body-scope {
  --pub-ink: #17181a;
  --pub-muted: #5a5d61;
  --pub-bg: #fbf8f3;
  --pub-border: #e5decf;
  --pub-ribbon-bg: #f6ddb9;
  --pub-ribbon-text: #7c4a13;
  --pub-accent: #b3271d;
  --pub-accent-hover: #8f1f16;
  --pub-band-bg: #171a1f;
  --pub-band-text: #f3efe6;
  --pub-gold: #b3271d;
}

.pub-masthead {
  border-bottom: 4px double var(--pub-ink);
  padding-top: var(--space-2);
  padding-bottom: var(--space-2);
}
.pub-masthead__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: var(--space-2);
}
.pub-masthead__date {
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--pub-muted);
}
.pub-masthead__ribbon {
  display: inline-block;
  background: var(--pub-ribbon-bg);
  color: var(--pub-ribbon-text);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 6px 12px;
  border-radius: 4px;
}
.pub-masthead__name {
  font-family: var(--font-serif);
  font-weight: 700;
  text-align: center;
  font-size: clamp(28px, 7vw, 46px);
  letter-spacing: -0.01em;
  margin: 4px 0 2px;
}
.pub-masthead__tagline {
  text-align: center;
  font-family: var(--font-serif);
  font-style: italic;
  color: var(--pub-muted);
  font-size: clamp(13px, 3vw, 16px);
}

.pub-article { padding-top: var(--space-3); }
.pub-article__kicker {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--pub-accent);
  margin-bottom: 10px;
}
.pub-article__h1 {
  font-family: var(--font-sans);
  font-weight: 800;
  font-size: clamp(28px, 6.4vw, 46px);
  line-height: 1.12;
  letter-spacing: -0.01em;
  margin-bottom: var(--space-2);
}
.pub-article__dek {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(17px, 3.2vw, 21px);
  color: #34363a;
  line-height: 1.45;
  margin-bottom: var(--space-2);
  max-width: 68ch;
}
.pub-article__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  font-size: 14px;
  color: var(--pub-muted);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--pub-border);
  margin-bottom: var(--space-3);
}
.pub-article__stars { color: #e0a72c; letter-spacing: 1px; }
.pub-article__author { font-weight: 700; color: var(--pub-ink); }
.pub-article__readers {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.pub-article__readers::before {
  content: "";
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #3aa15c;
  display: inline-block;
}

.pub-media { margin: 0 0 var(--space-3); }
.pub-media__frame {
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  aspect-ratio: 4 / 3;
  background: #e9e3d6;
}
.pub-media__frame video, .pub-media__frame img { width: 100%; height: 100%; object-fit: cover; }
.pub-media__caption {
  font-size: 13px;
  color: var(--pub-muted);
  margin-top: 8px;
  font-style: italic;
}

.pub-content { max-width: 72ch; margin: 0 auto; }
.pub-content > * + * { margin-top: var(--space-2); }
.pub-content p { font-size: clamp(16px, 2.2vw, 18px); line-height: 1.75; color: #26282b; }
.pub-content h2 {
  font-size: clamp(23px, 4.6vw, 30px);
  font-weight: 800;
  line-height: 1.22;
  margin-top: var(--space-4) !important;
  letter-spacing: -0.01em;
}
.pub-content h3 {
  font-size: clamp(18px, 3.4vw, 22px);
  font-weight: 700;
  margin-top: var(--space-3) !important;
}
.pub-content blockquote {
  margin: var(--space-3) 0;
  padding: var(--space-2) var(--space-3);
  border-left: 4px solid var(--pub-accent);
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(18px, 3.4vw, 22px);
  line-height: 1.5;
  color: #202225;
  background: #f4efe4;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.pub-content blockquote cite {
  display: block;
  margin-top: 10px;
  font-family: var(--font-sans);
  font-style: normal;
  font-size: 14px;
  font-weight: 700;
  color: var(--pub-muted);
}

.pub-inline-media {
  margin: var(--space-3) 0;
  display: grid;
  gap: var(--space-2);
}
.pub-inline-media__frame {
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.pub-inline-media--duo { grid-template-columns: 1fr; }
@media (min-width: 600px) { .pub-inline-media--duo { grid-template-columns: 1fr 1fr; } }
.pub-inline-media__frame img, .pub-inline-media__frame video {
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
}

/* Aside rates box — "what clients pay" bordered aside */
.pub-aside-rates {
  border: 2px solid var(--pub-ink);
  border-radius: var(--radius-md);
  padding: var(--space-3);
  background: #fff;
  margin: var(--space-4) 0;
}
.pub-aside-rates__label {
  display: inline-block;
  background: var(--pub-ink);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 6px 12px;
  border-radius: 4px;
  margin-bottom: var(--space-2);
}
.pub-aside-rates__heading {
  font-size: clamp(20px, 4vw, 25px);
  font-weight: 800;
  margin-bottom: 6px;
  line-height: 1.25;
}
.pub-aside-rates__intro { color: var(--pub-muted); font-size: 15px; margin-bottom: var(--space-2); }
.pub-aside-rates__list { display: grid; gap: 10px; }
.pub-aside-rates__item {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px dashed var(--pub-border);
}
.pub-aside-rates__item:last-child { border-bottom: none; }
.pub-aside-rates__item-name { font-size: 15px; color: #2c2e31; }
.pub-aside-rates__item-price { font-size: 18px; font-weight: 800; color: var(--pub-accent); white-space: nowrap; }
.pub-aside-rates__note { margin-top: var(--space-2); font-size: 13px; color: var(--pub-muted); }
.pub-aside-rates__note a { text-decoration: underline; }

/* Full-width AI-leverage callout band — accent stat/figure band styling */
.pub-callout {
  background: var(--pub-band-bg);
  color: var(--pub-band-text);
  margin: var(--space-4) calc(50% - 50vw);
  width: 100vw;
  padding: var(--space-4) 16px;
}
.pub-callout__inner { max-width: 72ch; margin: 0 auto; text-align: left; }
.pub-callout__label {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #d9ac5b;
  margin-bottom: 10px;
}
.pub-callout__title {
  font-size: clamp(24px, 5vw, 32px);
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: var(--space-2);
}
.pub-callout__text { font-size: clamp(16px, 2.4vw, 18px); line-height: 1.7; color: #d8d5cd; }
.pub-callout__stats {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-2);
  margin-top: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px solid rgba(255,255,255,0.18);
}
@media (min-width: 640px) { .pub-callout__stats { grid-template-columns: repeat(3, 1fr); } }
.pub-callout__stat-figure { font-size: clamp(24px, 4vw, 32px); font-weight: 800; color: #fff; }
.pub-callout__stat-label { font-size: 13px; color: #b9b6ac; margin-top: 4px; }

/* Checklist — "what you can offer clients" */
.pub-offer-list { display: grid; gap: 12px; margin: var(--space-2) 0; }
.pub-offer-list__item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  font-size: 16px;
  line-height: 1.5;
  color: #26282b;
}
.pub-offer-list__item::before {
  content: "✓";
  flex-shrink: 0;
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--pub-accent);
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1px;
}

/* Steps preview */
.pub-steps { display: grid; gap: var(--space-2); margin: var(--space-2) 0; counter-reset: pubstep; }
.pub-steps__item {
  position: relative;
  padding: var(--space-2) var(--space-2) var(--space-2) 60px;
  background: #fff;
  border: 1px solid var(--pub-border);
  border-radius: var(--radius-md);
  counter-increment: pubstep;
}
.pub-steps__item::before {
  content: counter(pubstep);
  position: absolute;
  left: var(--space-2);
  top: var(--space-2);
  width: 30px; height: 30px;
  border-radius: 50%;
  background: var(--pub-ink);
  color: #fff;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}
.pub-steps__title { font-weight: 800; font-size: 17px; margin-bottom: 4px; }
.pub-steps__text { font-size: 15px; color: var(--pub-muted); line-height: 1.6; }

/* Objection handling accordion */
.pub-objections { display: grid; gap: 10px; margin: var(--space-2) 0; }
.pub-objections__item {
  border: 1px solid var(--pub-border);
  border-radius: var(--radius-sm);
  background: #fff;
  overflow: hidden;
}
.pub-objections__item summary {
  padding: 16px 18px;
  font-weight: 700;
  font-size: 16px;
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  min-height: 44px;
}
.pub-objections__item summary::-webkit-details-marker { display: none; }
.pub-objections__item summary::after {
  content: "+";
  font-size: 22px;
  font-weight: 400;
  color: var(--pub-accent);
  flex-shrink: 0;
}
.pub-objections__item[open] summary::after { content: "−"; }
.pub-objections__item p {
  padding: 0 18px 18px;
  font-size: 15px;
  color: var(--pub-muted);
  line-height: 1.6;
}

/* CTA block */
.pub-cta-block {
  text-align: center;
  padding: var(--space-4) var(--space-2);
  background: #fff;
  border: 2px solid var(--pub-ink);
  border-radius: var(--radius-lg);
  margin: var(--space-4) 0;
}
.pub-cta-block__title { font-size: clamp(22px, 4.6vw, 28px); font-weight: 800; margin-bottom: 10px; }
.pub-cta-block__text { color: var(--pub-muted); font-size: 16px; margin-bottom: var(--space-2); max-width: 52ch; margin-inline: auto; }
.pub-cta-block__actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }

/* Comparison / why old ways fail */
.pub-compare { display: grid; gap: var(--space-2); margin: var(--space-2) 0; }
@media (min-width: 640px) { .pub-compare { grid-template-columns: 1fr 1fr; } }
.pub-compare__card { border-radius: var(--radius-md); padding: var(--space-2); }
.pub-compare__card--old { background: #f3ece2; border: 1px dashed #c9bda6; }
.pub-compare__card--new { background: #fdf1ea; border: 2px solid var(--pub-accent); }
.pub-compare__card-title { font-weight: 800; font-size: 16px; margin-bottom: 8px; }
.pub-compare__card p { font-size: 15px; color: #3a3c3f; line-height: 1.55; }

/* About page (publication family, simpler content page) */
.pub-page { max-width: 68ch; margin: 0 auto; }
.pub-page__intro { margin: 0 0 var(--space-3); font-size: 17px; color: #34363a; line-height: 1.6; }
.pub-page__section { margin: 0 0 var(--space-4); }
.pub-page__section h2 { font-size: clamp(21px,4vw,26px); font-weight: 800; margin-bottom: 12px; }
.pub-page__section p { font-size: 16px; line-height: 1.7; color: #2c2e31; margin-bottom: 12px; }
.pub-page__section ul { display: grid; gap: 8px; margin-top: 10px; }
.pub-page__section li { font-size: 15px; color: #34363a; padding-left: 20px; position: relative; }
.pub-page__section li::before { content: "—"; position: absolute; left: 0; color: var(--pub-accent); }

/* ============================================================
   OFFER FAMILY (offer page + legal/contact pages)
   ============================================================ */
.offer {
  --bg: #ffffff;
  --ink: #101512;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
}
.offer-scope {
  --offer-ink: #101512;
  --offer-muted: #55625c;
  --offer-dark: #0c1310;
  --offer-dark-2: #10201a;
  --offer-accent: #9db98a;
  --offer-accent-strong: #7fa06b;
  --offer-accent-hover: #b3ccA1;
  --offer-accent-ink: #0e2013;
  --offer-border: #e3e8e3;
  --offer-card: #f5f7f4;
}

.offer-topbar {
  background: var(--offer-dark);
  color: #cfe0d1;
  font-size: 13px;
  text-align: center;
  padding: 10px 16px;
  line-height: 1.4;
}
.offer-topbar a { text-decoration: underline; font-weight: 700; color: #fff; }

.offer-nav {
  background: var(--offer-dark);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  position: relative;
  z-index: 20;
}
.offer-nav__inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.offer-nav__logo { font-weight: 800; font-size: 18px; color: #fff; letter-spacing: -0.01em; }
.offer-nav__logo span { color: var(--offer-accent); }
.offer-nav__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px; height: 44px;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.3);
  border-radius: 8px;
  color: #fff;
}
@media (min-width: 1024px) { .offer-nav__toggle { display: none; } }
.offer-nav__links {
  display: none;
  position: absolute;
  top: 100%;
  left: 0; right: 0;
  background: var(--offer-dark);
  flex-direction: column;
  padding: 8px 16px 20px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
.offer-nav__links--open { display: flex; }
.offer-nav__links a {
  color: #dfe6e0;
  font-size: 15px;
  font-weight: 600;
  padding: 12px 0;
  min-height: 44px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
@media (min-width: 1024px) {
  .offer-nav__links {
    display: flex;
    position: static;
    flex-direction: row;
    background: none;
    padding: 0;
    border: 0;
    gap: 28px;
  }
  .offer-nav__links a { border: 0; padding: 0; font-size: 14px; }
}
.offer-nav__actions { display: none; }
@media (min-width: 1024px) { .offer-nav__actions { display: flex; gap: 10px; } }

.offer-hero {
  background:
    radial-gradient(ellipse at 85% 100%, rgba(154,102,58,0.35), transparent 60%),
    linear-gradient(180deg, #0c1411 0%, #0a100d 60%, #0a100d 100%);
  color: #fff;
  padding: var(--space-4) 16px var(--space-5);
}
.offer-hero__inner { max-width: 1180px; margin: 0 auto; }
.offer-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(157,185,138,0.14);
  border: 1px solid rgba(157,185,138,0.4);
  color: var(--offer-accent);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 8px 14px;
  border-radius: 999px;
  margin-bottom: var(--space-2);
}
.offer-hero__h1 {
  font-size: clamp(28px, 6.6vw, 50px);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.02em;
  max-width: 18ch;
  margin-bottom: var(--space-2);
}
.offer-hero__h1 em { font-style: normal; color: var(--offer-accent); }
.offer-hero__h2 {
  font-size: clamp(18px, 3.4vw, 23px);
  font-weight: 600;
  color: #d8e2d9;
  max-width: 46ch;
  margin-bottom: var(--space-2);
  line-height: 1.45;
}
.offer-hero__subhead {
  font-size: clamp(15px, 2.4vw, 17px);
  color: #aebcb1;
  max-width: 56ch;
  margin-bottom: var(--space-3);
  line-height: 1.6;
}
.offer-hero__subhead strong { color: #fff; }
.offer-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: var(--space-4); }
.offer-hero__media {
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: var(--shadow-lg);
  aspect-ratio: 16/9;
  background: #0d1512;
}
.offer-hero__media video { width: 100%; height: 100%; object-fit: cover; }

.offer-section { padding: var(--space-5) 16px; }
.offer-section--alt { background: var(--offer-card); }
.offer-section__inner { max-width: 1180px; margin: 0 auto; }
.offer-section__kicker {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--offer-accent-strong);
  margin-bottom: 10px;
  text-align: center;
}
.offer-section__title {
  font-size: clamp(24px, 5vw, 36px);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.01em;
  text-align: center;
  max-width: 30ch;
  margin: 0 auto 14px;
}
.offer-section__lead {
  font-size: clamp(15px, 2.2vw, 18px);
  color: var(--offer-muted);
  text-align: center;
  max-width: 62ch;
  margin: 0 auto var(--space-4);
  line-height: 1.6;
}

.offer-cards { display: grid; gap: var(--space-2); grid-template-columns: 1fr; }
@media (min-width: 640px) { .offer-cards { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .offer-cards--3 { grid-template-columns: repeat(3, 1fr); } }
.offer-cards__item {
  background: #fff;
  border: 1px solid var(--offer-border);
  border-radius: var(--radius-md);
  padding: var(--space-3);
  box-shadow: var(--shadow-sm);
}
.offer-cards__media {
  border-radius: var(--radius-sm);
  overflow: hidden;
  aspect-ratio: 4/3;
  margin-bottom: var(--space-2);
}
.offer-cards__media img { width: 100%; height: 100%; object-fit: cover; }
.offer-cards__icon {
  width: 40px; height: 40px;
  border-radius: 10px;
  background: rgba(157,185,138,0.18);
  color: var(--offer-accent-strong);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  margin-bottom: 12px;
}
.offer-cards__title { font-size: 18px; font-weight: 800; margin-bottom: 8px; }
.offer-cards__text { font-size: 15px; color: var(--offer-muted); line-height: 1.6; }

/* AI-leverage titled section band */
.offer-leverage {
  background: var(--offer-dark-2);
  color: #fff;
  border-radius: var(--radius-lg);
  padding: var(--space-4);
  max-width: 1180px;
  margin: 0 auto;
  display: grid;
  gap: var(--space-3);
}
@media (min-width: 860px) { .offer-leverage { grid-template-columns: 1fr 1fr; align-items: center; } }
.offer-leverage__label { font-size: 12px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--offer-accent); margin-bottom: 10px; }
.offer-leverage__title { font-size: clamp(22px, 4.2vw, 30px); font-weight: 800; line-height: 1.25; margin-bottom: 12px; }
.offer-leverage__text { font-size: 16px; color: #cdd8ce; line-height: 1.7; }
.offer-leverage__list { display: grid; gap: 10px; margin-top: var(--space-2); }
.offer-leverage__list li { display: flex; gap: 10px; font-size: 15px; color: #dfe6e0; }
.offer-leverage__list li::before { content: "→"; color: var(--offer-accent); font-weight: 800; }

/* Checklist — what clients pay */
.offer-checklist { display: grid; gap: 12px; max-width: 760px; margin: 0 auto; }
.offer-checklist__item {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  background: #fff;
  border: 1px solid var(--offer-border);
  border-radius: var(--radius-sm);
  padding: 16px 18px;
}
.offer-checklist__label { font-size: 15px; color: var(--offer-ink); }
.offer-checklist__fee { font-size: 16px; font-weight: 800; color: var(--offer-accent-strong); white-space: nowrap; }
.offer-checklist__math {
  max-width: 760px;
  margin: var(--space-2) auto 0;
  padding: var(--space-2);
  background: var(--offer-dark-2);
  color: #dfe6e0;
  border-radius: var(--radius-sm);
  font-size: 14px;
  line-height: 1.7;
}
.offer-checklist__math strong { color: #fff; }

/* Curriculum list */
.offer-curriculum { max-width: 760px; margin: 0 auto; display: grid; gap: 10px; counter-reset: curr; }
.offer-curriculum__item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  background: #fff;
  border: 1px solid var(--offer-border);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  counter-increment: curr;
}
.offer-curriculum__item::before {
  content: counter(curr);
  flex-shrink: 0;
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--offer-accent);
  color: var(--offer-accent-ink);
  font-weight: 800;
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.offer-curriculum__text { font-size: 15px; color: var(--offer-ink); line-height: 1.5; padding-top: 3px; }

/* Pricing — stacked full-width boxed offers */
.offer-pricing { display: grid; gap: var(--space-2); max-width: 860px; margin: 0 auto; }
.offer-pricing__item {
  border: 1px solid var(--offer-border);
  border-radius: var(--radius-lg);
  background: #fff;
  padding: var(--space-3);
  display: grid;
  gap: var(--space-2);
  position: relative;
}
@media (min-width: 700px) {
  .offer-pricing__item { grid-template-columns: 2fr 1fr; align-items: center; }
}
.offer-pricing__item--highlight {
  border: 3px solid var(--offer-accent-strong);
  background: #f4f9f1;
  box-shadow: var(--shadow-md);
}
.offer-pricing__badge {
  position: absolute;
  top: -14px; left: 24px;
  background: var(--offer-accent-strong);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 6px 12px;
  border-radius: 999px;
}
.offer-pricing__name { font-size: 22px; font-weight: 800; margin-bottom: 4px; }
.offer-pricing__hours { font-size: 14px; color: var(--offer-muted); margin-bottom: 12px; }
.offer-pricing__list { display: grid; gap: 8px; }
.offer-pricing__list li { display: flex; gap: 8px; font-size: 14px; color: #2c332d; }
.offer-pricing__list li::before { content: "✓"; color: var(--offer-accent-strong); font-weight: 800; }
.offer-pricing__side { text-align: left; }
@media (min-width: 700px) { .offer-pricing__side { text-align: right; } }
.offer-pricing__price { font-size: clamp(28px, 5vw, 36px); font-weight: 800; color: var(--offer-ink); }
.offer-pricing__cta { margin-top: 12px; }

/* Add-ons */
.offer-addons { display: grid; gap: 12px; max-width: 860px; margin: 0 auto; }
.offer-addons__item {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  background: #fff;
  border: 1px dashed var(--offer-border);
  border-radius: var(--radius-md);
  padding: 16px 18px;
}
.offer-addons__name { font-weight: 800; font-size: 16px; margin-bottom: 4px; }
.offer-addons__desc { font-size: 14px; color: var(--offer-muted); line-height: 1.5; max-width: 48ch; }
.offer-addons__price { font-size: 18px; font-weight: 800; color: var(--offer-accent-strong); white-space: nowrap; }

/* Perks stack */
.offer-perks { display: grid; gap: 10px; max-width: 760px; margin: 0 auto; }
.offer-perks__item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  font-size: 15px;
  color: var(--offer-ink);
  background: var(--offer-card);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
}
.offer-perks__item::before { content: "★"; color: var(--offer-accent-strong); flex-shrink: 0; }

/* Honest limits block */
.offer-limits {
  max-width: 760px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid var(--offer-border);
  border-radius: var(--radius-md);
  padding: var(--space-3);
  display: grid;
  gap: 12px;
}
.offer-limits__item { font-size: 15px; color: var(--offer-ink); line-height: 1.6; padding-left: 22px; position: relative; }
.offer-limits__item::before { content: "•"; position: absolute; left: 0; color: var(--offer-muted); font-weight: 800; }

/* Lead form */
.offer-form {
  max-width: 640px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid var(--offer-border);
  border-radius: var(--radius-lg);
  padding: var(--space-3);
  box-shadow: var(--shadow-sm);
}
.offer-form__grid { display: grid; gap: var(--space-2); grid-template-columns: 1fr; }
@media (min-width: 560px) { .offer-form__grid--2 { grid-template-columns: 1fr 1fr; } }
.offer-form__field { display: grid; gap: 6px; }
.offer-form__label { font-size: 14px; font-weight: 700; color: var(--offer-ink); }
.offer-form__input, .offer-form__textarea {
  font-size: 16px;
  padding: 13px 14px;
  border-radius: var(--radius-sm);
  border: 1px solid #c7cfc8;
  background: #fbfcfb;
  width: 100%;
}
.offer-form__input:focus, .offer-form__textarea:focus {
  outline: 3px solid var(--offer-accent);
  outline-offset: 1px;
  border-color: var(--offer-accent-strong);
}
.offer-form__textarea { resize: vertical; min-height: 100px; }
.offer-form__error { font-size: 13px; color: #b3271d; min-height: 16px; }
.offer-form__consent { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; color: var(--offer-muted); line-height: 1.5; }
.offer-form__consent input { width: 20px; height: 20px; flex-shrink: 0; margin-top: 2px; }
.offer-form__consent a { text-decoration: underline; font-weight: 600; }
.offer-form__submit { margin-top: var(--space-1); }
.offer-form__success, .offer-form__top-error {
  display: none;
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  font-size: 15px;
  margin-bottom: var(--space-2);
}
.offer-form__success--visible, .offer-form__top-error--visible { display: block; }
.offer-form__success { background: #eaf3e5; color: #294b1f; border: 1px solid #bcd8ad; }
.offer-form__top-error { background: #fbe9e7; color: #7a231a; border: 1px solid #f0bdb6; }
.offer-form.is-submitted .offer-form__grid,
.offer-form.is-submitted .offer-form__consent,
.offer-form.is-submitted .offer-form__submit { display: none; }

/* Sticky mobile CTA bar — accent (Campsite) rail/sticky treatment */
.offer-sticky-cta {
  position: fixed;
  left: 12px; right: 12px; bottom: 12px;
  z-index: 40;
  background: var(--offer-dark);
  color: #fff;
  border-radius: 999px;
  padding: 10px 10px 10px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  box-shadow: var(--shadow-lg);
}
.offer-sticky-cta__text { font-size: 13px; font-weight: 600; color: #dfe6e0; }
.offer-sticky-cta__btn {
  background: var(--offer-accent);
  color: var(--offer-accent-ink);
  font-weight: 800;
  font-size: 14px;
  padding: 12px 18px;
  border-radius: 999px;
  white-space: nowrap;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
@media (min-width: 1024px) { .offer-sticky-cta { display: none; } }
body.has-sticky-cta { padding-bottom: 78px; }

/* Legal / content pages inside offer family */
.offer-legal { max-width: 760px; margin: 0 auto; }
.offer-legal__updated { font-size: 13px; color: var(--offer-muted); margin-bottom: var(--space-2); }
.offer-legal h2 { font-size: clamp(20px, 3.6vw, 24px); font-weight: 800; margin: var(--space-3) 0 10px; }
.offer-legal p { font-size: 15px; line-height: 1.75; color: #262d28; margin-bottom: 12px; }
.offer-legal ul { display: grid; gap: 8px; margin: 10px 0 16px; }
.offer-legal li { font-size: 15px; color: #262d28; padding-left: 20px; position: relative; line-height: 1.6; }
.offer-legal li::before { content: "—"; position: absolute; left: 0; color: var(--offer-accent-strong); }
.offer-legal a { text-decoration: underline; font-weight: 600; }

.offer-page-hero {
  background: var(--offer-dark);
  color: #fff;
  padding: var(--space-4) 16px;
  text-align: center;
}
.offer-page-hero__kicker { font-size: 12px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--offer-accent); margin-bottom: 10px; }
.offer-page-hero__title { font-size: clamp(26px, 5.6vw, 40px); font-weight: 800; max-width: 26ch; margin: 0 auto; }

/* Contact info cards */
.offer-contact-info { display: grid; gap: var(--space-2); max-width: 760px; margin: 0 auto var(--space-4); }
@media (min-width: 640px) { .offer-contact-info { grid-template-columns: 1fr 1fr; } }
.offer-contact-info__item {
  background: #fff;
  border: 1px solid var(--offer-border);
  border-radius: var(--radius-md);
  padding: var(--space-2);
}
.offer-contact-info__label { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; color: var(--offer-accent-strong); margin-bottom: 6px; }
.offer-contact-info__value { font-size: 15px; color: var(--offer-ink); line-height: 1.6; white-space: pre-line; }

/* 404 */
.offer-404 { text-align: center; padding: var(--space-6) 16px; }
.offer-404__code { font-size: clamp(48px, 12vw, 96px); font-weight: 800; color: var(--offer-accent-strong); }
.offer-404__title { font-size: clamp(20px, 4vw, 28px); font-weight: 800; margin: 10px 0 16px; }
.offer-404__text { color: var(--offer-muted); max-width: 48ch; margin: 0 auto var(--space-3); }