/* Public marketing surfaces share a quieter type scale and clearer actions. */
.marketing-page { font-weight: 400; }
.marketing-page :is(.section, .pro-section) { padding-block: clamp(3.5rem, 5rem + 1vw, 6rem); }
.marketing-page .section-heading { margin-block-end: 2.5rem; }
.marketing-page .section-heading > div { align-items: start; gap: 3rem; }
.marketing-page .section-heading h2 { font-size: clamp(2.25rem, 1.25rem + 3.4vw, 4rem); line-height: 1.12; letter-spacing: -.035em; text-wrap: balance; }
.marketing-page .section-heading > div > p { max-inline-size: 40ch; font-size: 1rem; line-height: 1.75; }
.marketing-page :is(.button, .nav-cta) { font-size: .875rem; font-weight: 500; letter-spacing: 0; text-transform: none; }
.marketing-page :is(.button, .text-link, .nav-cta) > svg { inline-size: 1.125rem; block-size: 1.125rem; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.marketing-page .button { min-block-size: 3rem; padding: .875rem 1.25rem; }
.marketing-page .text-link { gap: .625rem; font-size: .875rem; font-weight: 500; color: var(--muted); }
.marketing-page .text-link:hover { color: var(--violet-text); }
.marketing-page .nav-cta { padding: .75rem 1.125rem; gap: .875rem; font-size: .8125rem; }
.marketing-page .desktop-nav { gap: 1.5rem; font-size: .8125rem; font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--muted); }
.marketing-page .desktop-nav a { position: relative; }
.marketing-page .desktop-nav a::after { content: ''; position: absolute; inset-inline: 0; inset-block-end: .5rem; block-size: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; }
.marketing-page .desktop-nav a:hover { color: var(--violet-text); }
.marketing-page .desktop-nav a:hover::after { transform: scaleX(1); }
.marketing-page .audience-nav { gap: .25rem; }
.marketing-page .audience-nav a { padding-inline: 1.5rem; border-radius: .75rem .75rem 0 0; font-size: .875rem; }
.marketing-page .audience-nav a[aria-current=page] { font-weight: 500; }
.marketing-page .mobile-menu { max-block-size: calc(100dvh - 2rem); overflow-y: auto; padding: 4.25rem 1.5rem 1.5rem; border-radius: 1rem; }
.marketing-page .mobile-menu nav { gap: .375rem; font-size: 1.25rem; letter-spacing: -.02em; }
.marketing-page .mobile-menu nav a { min-block-size: 3.25rem; padding: .5rem .75rem; border-radius: .5rem; }
.marketing-page .mobile-menu nav a:hover { color: var(--violet-text); background: var(--surface-accent); }
.marketing-page .mobile-menu nav a[aria-current=page] { color: var(--violet-text); }
.marketing-page .mobile-menu p { margin-block-start: 1.25rem; line-height: 1.65; }
.marketing-page .menu-close { display: grid; place-items: center; inline-size: 3rem; block-size: 3rem; padding: .75rem; }
.marketing-page .menu-close svg { inline-size: 1.5rem; block-size: 1.5rem; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; }
.marketing-page .hero-message h1 { font-size: clamp(4rem, 1.5rem + 5.3vw, 6rem); letter-spacing: -.035em; line-height: 1.04; margin-block-end: 1.5rem; }
.marketing-page .hero-description { max-inline-size: 41ch; font-size: 1.0625rem; line-height: 1.75; margin-block-end: 1.75rem; }
.marketing-page .hero-actions { gap: 1.375rem; }
.marketing-page .hero-actions > .button { font-size: .875rem; padding: .875rem 1.25rem; }
.marketing-page .hero-price { margin-block-start: 1.25rem; font-size: .8125rem; line-height: 1.65; }
.marketing-page .hero-price strong { font-weight: 600; }
.marketing-page .hero-bottom p { font-size: .8125rem; }
.marketing-page .hero-bottom { border-block-start: 1px solid var(--line); padding-block-start: 1.5rem; gap: 2.5rem; }
.marketing-page .hero-scenes { display: flex; gap: 1.5rem; margin-inline-start: auto; color: var(--muted); font-size: .75rem; }
.marketing-page .hero-scenes > span { position: relative; padding-block: .75rem; border-block-start: 1px solid var(--line-strong); }
.marketing-page .hero-scenes > span::before { content: ''; position: absolute; inset-inline: 0; inset-block-start: -1px; block-size: 2px; background: var(--violet-text); transform: scaleX(0); transform-origin: left; }
.constellation[data-shape="brain"] ~ .hero [data-scene="brain"],
.constellation[data-shape="bulb"] ~ .hero [data-scene="bulb"],
.constellation[data-shape="globe"] ~ .hero [data-scene="globe"] { color: var(--violet-text); }
.constellation[data-shape="brain"] ~ .hero [data-scene="brain"]::before,
.constellation[data-shape="bulb"] ~ .hero [data-scene="bulb"]::before,
.constellation[data-shape="globe"] ~ .hero [data-scene="globe"]::before { transform: scaleX(1); }
.marketing-page .scroll-cue { font-size: .75rem; font-weight: 500; gap: 1rem; text-transform: none; }
.marketing-page .scroll-cue svg { inline-size: 1.25rem; block-size: 1.25rem; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.marketing-page .proof-strip > .container { align-items: center; flex-wrap: nowrap; padding-block: 1.75rem; gap: 2.5rem; }
.marketing-page .proof-strip p { max-inline-size: none; flex-shrink: 0; font-size: .8125rem; line-height: 1.6; letter-spacing: 0; }
.marketing-page .proof-strip ul { display: flex; flex: 1; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem 1.5rem; margin: 0; padding: 0; list-style: none; }
.marketing-page .proof-strip a { display: flex; align-items: center; min-block-size: 2.75rem; font-size: .9375rem; font-weight: 500; letter-spacing: -.015em; color: var(--muted); }
.marketing-page .proof-strip a:hover { color: var(--violet-text); }
.marketing-page .audience-invitation { padding-block: clamp(3.25rem, 5vw, 5rem); }
.marketing-page .audience-invitation h2 { font-size: clamp(2.25rem, 1.3rem + 2.8vw, 3.5rem); line-height: 1.15; letter-spacing: -.03em; }
.marketing-page .audience-invitation p { line-height: 1.75; }
.marketing-page .process-grid { gap: 2rem; }
.marketing-page .process-grid > li { padding-block-start: 1.5rem; }
.marketing-page .process-grid > li > span { font-size: .875rem; font-weight: 500; font-variant-numeric: tabular-nums; }
.marketing-page .process-grid > li > span { display: grid; place-items: center; inline-size: 2.25rem; block-size: 2.25rem; border: 1px solid var(--line-accent); border-radius: 50%; color: var(--violet-text); background: var(--surface-accent); }
.marketing-page .process-grid h3 { font-size: 1.375rem; line-height: 1.3; letter-spacing: -.025em; margin-block: 1.5rem .875rem; }
.marketing-page .process-grid p { font-size: .9375rem; line-height: 1.75; }
.marketing-page .technical-details { margin-block-start: 2.5rem; }
.marketing-page .technical-details summary { font-size: .9375rem; }
.marketing-page .faq-section { gap: 4rem; padding-block: 1rem 5.5rem; }
.marketing-page .faq-title h2 { max-inline-size: 14ch; font-size: clamp(2rem, 1rem + 2.6vw, 3rem); line-height: 1.18; letter-spacing: -.03em; text-wrap: balance; }
.marketing-page .faq-items summary { gap: 1.5rem; min-block-size: 4.5rem; font-size: 1rem; font-weight: 400; padding-block: 1.375rem; }
.marketing-page .faq-items p { font-size: .9375rem; }
.marketing-page .faq-items details[open] summary { color: var(--violet-text); font-weight: 500; }
.marketing-page .footer { padding-block: 2rem; gap: 1.25rem 2rem; font-size: .8125rem; }
.marketing-page .footer > p { font-size: .8125rem; }
.marketing-page .footer nav { gap: 1.5rem; }
.marketing-page .footer nav a { font-size: .8125rem; }
.marketing-page .footer a:hover { color: var(--violet-text); }
.marketing-page .footer > .brand { font-size: 2rem; letter-spacing: -.04em; }
.marketing-page :is(input, textarea) { caret-color: var(--violet-text); }
.marketing-page ::selection { background: var(--violet-text); color: var(--paper); }
@media (min-width: 1001px) {
  .marketing-page .hero { min-block-size: min(100svh, 940px); }
  .marketing-page .story-stage { min-block-size: min(100svh, 940px); }
  .marketing-page .hero-copy { padding-block: 3rem; }
}
@media (min-width: 1001px) and (max-width: 1100px) {
  .marketing-page .header { gap: .75rem; }
  .marketing-page .desktop-nav { gap: 1rem; font-size: .75rem; }
  .marketing-page .nav-cta { font-size: .75rem; padding-inline: .875rem; }
}
@media (max-width: 920px) {
  .marketing-page .section-heading > div { gap: 1.75rem; }
  .marketing-page .proof-strip > .container { flex-direction: column; align-items: stretch; gap: .75rem; }
  .marketing-page .proof-strip p br { display: none; }
  .marketing-page .proof-strip ul { justify-content: flex-start; gap: .375rem 1.75rem; }
}
@media (max-width: 800px) {
  .marketing-page .section-heading > div { flex-direction: column; align-items: start; gap: 1.25rem; }
  .marketing-page .section-heading > div > p { max-inline-size: 54ch; }
  .marketing-page .section-heading { margin-block-end: 2rem; }
  .marketing-page .hero-message h1 { font-size: clamp(2.25rem, 1rem + 4vw, 3.5rem); }
  .marketing-page .hero-description { font-size: .9375rem; }
  .marketing-page .faq-section { grid-template-columns: minmax(0, 1fr); gap: 1.75rem; padding-block-end: 4rem; }
}
@media (max-width: 600px) {
  .marketing-page :is(.section, .pro-section) { padding-block: 3.5rem; }
  .marketing-page .section-heading h2 { font-size: clamp(2rem, 1.25rem + 3.2vw, 2.75rem); }
  .marketing-page .section-heading > div > p { font-size: .9375rem; line-height: 1.75; }
  .marketing-page .audience-nav a { padding-inline: .5rem; font-size: .8125rem; }
  .marketing-page .audience-detail { font-size: .6875rem; }
  .marketing-page .nav-cta { padding: .625rem .75rem; gap: .375rem; font-size: .75rem; }
  .marketing-page .hero-message h1 { font-size: clamp(1.55rem, 1rem + 4vw, 2.125rem); line-height: 1.08; margin-block-end: 1.25rem; }
  .marketing-page .hero-description { font-size: .8125rem; line-height: 1.7; margin-block-end: 1.25rem; }
  .marketing-page .hero-actions { align-items: start; gap: .375rem; }
  .marketing-page .hero-copy > .hero-actions > .button { padding: .75rem .75rem; font-size: .8125rem; line-height: 1.4; gap: .5rem; min-block-size: 3rem; }
  .marketing-page .hero-copy > .hero-actions > .text-link { font-size: .8125rem; }
  .marketing-page .hero-price { font-size: .75rem; margin-block-start: .875rem; }
  .marketing-page .hero-bottom .scroll-cue { font-size: .75rem; }
  .marketing-page .hero-bottom { gap: 1rem; padding-block: 1rem 4.5rem; }
  .marketing-page .hero-scenes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); inline-size: 100%; gap: .75rem; font-size: .6875rem; margin-inline-start: 0; }
  .marketing-page .hero-bottom .scroll-cue { display: none; }
  .marketing-page .hero-bottom > p { display: none; }
  .marketing-page .proof-strip > .container { padding-block: 1.5rem; }
  .marketing-page .proof-strip ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem 1rem; }
  .marketing-page .proof-strip a { font-size: .875rem; }
  .marketing-page .audience-invitation h2 { font-size: 2.125rem; }
  .marketing-page .audience-invitation .button { font-size: .875rem; }
  .marketing-page .process-grid { gap: 0; }
  .marketing-page .process-grid > li { display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: .625rem 1rem; padding-block: 1.5rem; }
  .marketing-page .process-grid > li > span { grid-row: 1 / 3; padding-block-start: .25rem; }
  .marketing-page .process-grid > li > span { inline-size: 2rem; block-size: 2rem; padding: 0; }
  .marketing-page .process-grid h3 { margin: 0; font-size: 1.25rem; }
  .marketing-page .process-grid p { grid-column: 2; margin: 0; font-size: .9375rem; }
  .marketing-page .faq-title h2 { max-inline-size: none; font-size: 2rem; }
  .marketing-page .faq-items summary { font-size: .9375rem; padding-block: 1.25rem; }
  .marketing-page .footer { gap: 1rem 1.5rem; padding-block: 1.75rem; }
}
@media (max-width: 360px) {
  .marketing-page .hero-message h1 { font-size: calc(1rem + 3.5vw); }
}
@media (prefers-reduced-motion: no-preference) {
  .marketing-page .desktop-nav a::after { transition: transform 180ms cubic-bezier(.2,.8,.2,1); }
  .marketing-page :is(.nav-cta,.audience-nav a,.mobile-menu nav a,.proof-strip a) { transition: color 150ms, background-color 150ms; }
  html:not(.reduce-motion) .marketing-page :is(.button, .text-link, .nav-cta, .appointment-choice) > svg,
  html:not(.reduce-motion) .marketing-page .project-visit svg { transition: transform 250ms cubic-bezier(.16,1,.3,1); }
  html:not(.reduce-motion) .marketing-page .hero-scenes > span::before { transition: transform 650ms cubic-bezier(.16,1,.3,1); }
  html:not(.reduce-motion) .marketing-page .button:active { transform: scale(.985); }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  html:not(.reduce-motion) .marketing-page :is(.button, .nav-cta):hover > svg,
  html:not(.reduce-motion) .marketing-page .project-card:hover .project-visit svg { transform: translate(2px, -2px); }
  html:not(.reduce-motion) .marketing-page .appointment-choice:hover > .appointment-choice-arrow { transform: translateX(3px); }
}
@media (forced-colors: active) {
  .marketing-page .audience-nav a[aria-current=page] { border-color: Highlight; color: LinkText; }
}