/* Local campaign treatment for the unpublished September pages.
   This stylesheet is loaded after the existing component CSS so the page
   content and interaction code remain intact while the visual system changes. */
:root {
  --brand-gray: #405260;
  --brand-gray-rgb: 64, 82, 96;
  --brand-blue: #226eac;
  --brand-blue-rgb: 34, 110, 172;
  --bg: #e9eef1;
  --surface: #f8fafb;
  --surface-strong: #d9e2e8;
  --surface-soft: #e9eef1;
  --text: #17222b;
  --muted: #405260;
  --line: #aebdc8;
  --accent: #226eac;
  --accent-rgb: 34, 110, 172;
  --accent-soft: #a8d2ee;
  --page: #e9eef1;
  --action: #226eac;
  --action-hover: #15588f;
  --on-action: #f8fafb;
  --border: #aebdc8;
  --control-border: #677d8d;
  --focus-ring: #0b76c4;
  --ink-soft: #405260;
  --shadow: none;
  --shadow-soft: none;
  --radius-xl: 0;
  --radius-lg: 0;
  --radius-md: 0;
  --radius-sm: 0;
  --display: "Avenir Next", "Helvetica Neue", Arial, sans-serif;
  --sans: "Avenir Next", "Helvetica Neue", Arial, sans-serif;
}

.concept-product {
  --display: "Avenir Next", "Helvetica Neue", Arial, sans-serif;
  --sans: "Avenir Next", "Helvetica Neue", Arial, sans-serif;
}

body {
  min-width: 320px;
  background: var(--bg);
  color: var(--text);
}

.main-stack,
.section-card,
.table-wrap {
  min-width: 0;
  max-width: 100%;
}

.table-wrap {
  overflow-x: auto;
}

body::before,
body::after,
.background-preview::before,
.background-preview::after {
  display: none !important;
}

.site-shell {
  max-width: none;
  margin: 0;
  padding: 0;
}

.topbar,
.topbar-home,
.topbar-subpage {
  min-height: 104px;
  margin: 0;
  padding: 15px clamp(20px, 4vw, 70px);
  border: 0;
  border-bottom: 1px solid #c5d0d7;
  border-radius: 0;
  background: #f8fafb;
  box-shadow: none;
  backdrop-filter: none;
}

.brand-mark {
  width: 150px;
  max-width: 100%;
  height: auto;
}

.brand-kicker {
  border-left: 1px solid #c8d4dc;
  padding-left: 16px;
  color: #536675;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: .08em;
}

.nav,
.nav-home,
.nav-subpage {
  gap: clamp(12px, 1.8vw, 30px);
}

.nav a,
.nav-home a,
.nav-subpage a,
.nav-dropdown-trigger {
  padding: 7px 0;
  border-radius: 0;
  background: transparent;
  color: var(--text);
  font-size: 13px;
  font-weight: 750;
  letter-spacing: 0;
}

.nav a:hover,
.nav a[aria-current="page"] {
  background: transparent;
  color: var(--blue, #226eac);
}

.nav .cta-link,
.button,
.button-ghost {
  min-width: 0;
  padding: 15px 18px;
  border: 0;
  border-radius: 0;
  background: #17222b;
  box-shadow: none;
  color: #f8fafb;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0;
}

.nav .cta-link:hover,
.button:hover,
.button-ghost:hover {
  background: #15588f;
  box-shadow: none;
  color: #f8fafb;
  transform: translateY(-2px);
}

.button-ghost {
  border: 1px solid #17222b;
  background: transparent;
  color: #17222b;
}

.hero.hero-page,
.main-stack {
  width: min(100%, 1510px);
  margin-left: auto;
  margin-right: auto;
  padding-left: clamp(22px, 5vw, 86px);
  padding-right: clamp(22px, 5vw, 86px);
}

.hero.hero-page {
  min-height: min(600px, 75vh);
  align-items: center;
  padding-top: clamp(72px, 8vw, 130px);
  padding-bottom: clamp(72px, 8vw, 130px);
  border-bottom: 1px solid var(--line);
}

.hero.hero-page .hero-copy {
  padding: 0;
}

.hero.hero-page h1,
.hero h1 {
  max-width: 18ch;
  font-family: var(--display);
  font-size: clamp(52px, 6vw, 104px);
  font-weight: 760;
  line-height: .99;
  letter-spacing: -.07em;
  text-wrap: balance;
  animation: campaign-title-in .85s cubic-bezier(.19, 1, .22, 1) both;
}

.hero p {
  max-width: 680px;
  margin-top: 34px;
  padding-top: 22px;
  border-top: 1px solid #b7c5ce;
  color: #384d5b;
  font-size: clamp(16px, 1.35vw, 21px);
  line-height: 1.52;
  animation: campaign-copy-in .8s .16s both;
}

.hero.hero-page .hero-actions {
  animation: campaign-copy-in .8s .27s both;
}

@keyframes campaign-title-in {
  from { opacity: 0; transform: translateY(24px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes campaign-copy-in {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

.eyebrow,
.mini-label,
.status-label {
  color: #15588f;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.eyebrow::before {
  width: 9px;
  height: 9px;
  background: #226eac;
}

.main-stack {
  gap: 0;
  margin-top: 0;
  padding-top: clamp(55px, 7vw, 110px);
  padding-bottom: clamp(75px, 9vw, 145px);
}

.section-card,
.about-page .section-card,
.products-page .section-card {
  margin: 0;
  padding: clamp(48px, 6vw, 95px) 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.section-heading,
.home-page .section-heading,
.about-page .section-heading,
.products-page .section-heading {
  gap: clamp(25px, 4vw, 65px);
  margin-bottom: clamp(35px, 5vw, 70px);
}

.section-heading h2,
.home-page .section-heading h2,
.about-page .section-heading h2,
.products-page .section-heading h2,
.footer-panel h2,
.final-cta h2 {
  font-family: var(--display);
  font-size: clamp(40px, 5vw, 86px);
  font-weight: 760;
  line-height: 1;
  letter-spacing: -.065em;
}

.note-card,
.lane-card,
.proof-card,
.product-card,
.why-card,
.project-preview,
.tier-card,
.service-card,
.workflow-step,
.faq-list details,
.voice-shell {
  border: 1px solid var(--line);
  border-radius: 0;
  background: #f8fafb;
  box-shadow: none;
}

.note-card h3,
.product-card h3,
.project-preview h3,
.tier-card h3 {
  font-family: var(--display);
  font-weight: 750;
  letter-spacing: -.04em;
}

.chip,
.pill,
.status-pill {
  border-radius: 0;
}

.final-cta,
.footer-panel {
  border: 0;
  border-radius: 0;
  background: #d9e2e8;
  box-shadow: none;
}

.site-footer {
  margin-top: 0;
  padding: clamp(45px, 5vw, 85px) clamp(22px, 5vw, 86px);
  border: 0;
  border-radius: 0;
  background: #17222b;
  box-shadow: none;
  color: #f8fafb;
}

.site-footer a,
.site-footer .footer-label,
.site-footer-brand p,
.site-footer .footer-note p,
.site-footer .footer-copyright,
.site-footer .footer-legal,
.site-footer .footer-meta {
  color: #e4edf2;
}

.site-footer .footer-meta,
.site-footer .site-footer-band {
  border-color: #465663;
}

.site-footer .footer-list a:hover,
.site-footer .footer-legal a:hover {
  color: #a8d2ee;
}

.site-footer .brand-mark {
  width: 165px;
  padding: 5px;
  background: #f8fafb;
}

@media (max-width: 900px) {
  .topbar,
  .topbar-home,
  .topbar-subpage {
    min-height: 82px;
  }

  .hero.hero-page {
    min-height: 0;
  }

  .section-heading,
  .home-page .section-heading,
  .about-page .section-heading,
  .products-page .section-heading {
    grid-template-columns: 1fr;
  }

  .section-heading:has(.mini-label) .mini-label,
  .section-heading:has(.mini-label) h2,
  .section-heading:has(.mini-label) p {
    grid-column: 1;
    grid-row: auto;
    margin-top: 0;
  }
}

@media (max-width: 560px) {
  .brand-mark { width: 128px; }
  .brand-kicker { display: none; }
  .hero.hero-page { padding-top: 65px; padding-bottom: 65px; }
  .hero.hero-page h1 { font-size: clamp(42px, 13vw, 65px); }
  .section-heading h2 { font-size: clamp(38px, 11vw, 58px); }
  .contact-hero-actions { grid-template-columns: 1fr; }
  .contact-hero-actions .button-ghost { overflow-wrap: anywhere; }
  .contact-page .comparison-table,
  .contact-page .comparison-table tbody,
  .contact-page .comparison-table tr,
  .contact-page .comparison-table td { display: block; width: 100%; }
  .contact-page .comparison-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .contact-page .comparison-table td { padding: 12px; overflow-wrap: anywhere; }
  .contact-page .comparison-table td:first-child { font-weight: 700; border-bottom: 0; }
  .contact-page .comparison-table td:last-child { border-bottom: 1px solid var(--line); }
}

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

/* Match the open, editorial homepage rhythm on interior pages. The original
   stylesheet's highly specific wake-surface rules otherwise restore boxed
   panels and shadows after the campaign treatment. */
body.concept-product.bg-surface-wake .section-card {
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.concept-product.bg-surface-wake :is(
  .note-card,
  .lane-card,
  .proof-card,
  .why-card,
  .project-preview,
  .tier-card,
  .service-card
) {
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.concept-product.bg-surface-wake .tier-card:hover {
  background: rgba(248, 250, 251, .38);
  box-shadow: none;
}

/* launch 2026-10-23: footer link columns stack instead of running together */
.site-footer .footer-list { display: flex; flex-direction: column; gap: 8px; }
.site-footer .footer-label { margin: 18px 0 10px; }
