/* Shared presentation layer. Business rules remain in their existing modules. */
:root { --ux-radius: .9rem; --ux-focus: #098681; }
.local-preview-link { position: fixed; z-index: 2000; right: .6rem; bottom: .5rem; padding: .3rem .6rem; border: 1px solid #b8d7d5; border-radius: .5rem; background: #f3faf9; color: #17484d; font-size: .75rem; text-decoration: none; box-shadow: 0 2px 8px #10282d22; }
html { scroll-padding-top: 6.5rem; scrollbar-gutter: stable; }
html[data-theme="dark"] { --teal-dark: #70d9d1; --ux-focus: #70d9d1; }
.button, .portal-button, .auth-submit, .portal-logout { border-radius: var(--ux-radius); min-height: 44px; transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease; }
.button:hover { transform: none; }
.button-primary { box-shadow: none; }
.button-primary:hover { box-shadow: 0 0 0 4px rgba(91,212,206,.1); }
.button-dark:hover, .auth-submit:hover:not(:disabled) { background: #155159; }
.button-plain:hover { background: var(--surface-alt); border-color: var(--ux-focus); }
.button-secondary { background: rgba(126,155,159,.07); }
.button-secondary:hover, .button-quiet:hover { background: rgba(126,155,159,.14); }
.stock-header, .stock-hero, .stock-final, .stock-mobile-cta, .sgq-hero, .sgq-closing { --ink-inverse: #f5fbfb; --muted-inverse: #b7c9cc; --line-dark: rgba(222,247,247,.2); }
.consent-actions .button-quiet { color: var(--ink); border-color: var(--line); }
.page-main .content-section .button-secondary { color: var(--ink); border-color: var(--line); }
:where(a,button,input,select,textarea,summary):focus-visible { outline: 3px solid var(--ux-focus); outline-offset: 4px; }
.header-inner { gap: 1.25rem; }
.site-header { border-bottom: 1px solid transparent; }
.main-nav { gap: 1.15rem; }
.main-nav a { font-size: .875rem; }
.main-nav a[aria-current="page"] { color: var(--teal); }
.main-nav .mobile-account-link { display: none; }
.header-actions .header-download { box-shadow: none; font-size: .875rem; padding-inline: .9rem; }
.brand, .auth-brand, .portal-brand { overflow: visible; }
.brand img, .auth-brand img, .portal-brand img { object-fit: contain; }
.hero { min-height: 0; padding: 8.25rem 0 4.5rem; }
.hero-grid { grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); gap: clamp(2rem,4vw,4rem); align-items: center; }
.hero h1 { max-width: 23ch; font-size: clamp(2.5rem,3.5vw,3.4rem); line-height: 1.09; letter-spacing: -.045em; }
.hero-lead { font-size: 1.05rem; line-height: 1.65; max-width: 50ch; margin-top: 1.25rem; }
.hero-actions { margin-top: 1.4rem; }
.hero-free-note { font-size: .875rem; line-height: 1.55; max-width: 55ch; }
.platform-note { font-size: .875rem; line-height: 1.5; color: var(--muted-inverse); margin: .9rem 0 0; }
.interest-paths { margin-top: 1.7rem; }
.interest-paths h2 { font-size: 1rem; font-weight: 650; margin: 0 0 .8rem; letter-spacing: 0; }
.interest-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.interest-card { display: grid; gap: .35rem; padding: 1rem; text-decoration: none; border: 1px solid var(--line-dark); border-radius: 1rem; background: rgba(91,212,206,.04); transition: background .18s ease, border-color .18s ease; }
.interest-card strong { display: flex; justify-content: space-between; color: var(--ink-inverse); }
.interest-card > span { color: var(--muted-inverse); font-size: .875rem; line-height: 1.45; }
.interest-card:hover { border-color: var(--teal); background: rgba(91,212,206,.09); }
.product-frame { transform: none; width: 100%; }
.product-greeting strong { font-size: 1.15rem; }
.product-panels { grid-template-columns: 1fr; }
.product-panels > article:nth-child(2) { display: none; }
.product-frame .metric-grid { grid-template-columns: 1fr 1fr; }
.product-title { font-size: .875rem; padding-inline: .7rem; }
.window-actions { display: none; }
.journey-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.journey-grid article { padding: 1.5rem; border: 1px solid var(--line); border-radius: 1.15rem; background: var(--surface-strong); }
.journey-grid h3 { margin: 1rem 0 .6rem; font-size: 1.15rem; }
.journey-grid p { margin: 0; color: var(--ink-soft); }
.step-number { width: 2.5rem; height: 2.5rem; display: grid; place-items: center; border-radius: .85rem; color: var(--teal-dark); background: var(--surface-alt); font-weight: 750; }
.section, .content-section { padding-block: clamp(3rem,6vw,5rem); }
.section-heading h2, .content-heading h2, .closing-inner h2 { font-size: clamp(1.8rem,3vw,2.7rem); line-height: 1.15; }
.page-hero { padding: 8rem 0 3.5rem; }
.page-hero h1 { max-width: 22ch; font-size: clamp(2.25rem,4vw,3.6rem); line-height: 1.12; }
.page-hero > .shell > p:last-child { font-size: 1.05rem; line-height: 1.65; }
.inner-header { position: fixed; }
.module-row { scroll-margin-top: 7rem; }
.feature-list article, .capability-card, .contact-card { border-radius: 1rem; }
.capability-grid { gap: .8rem; background: transparent; border: 0; }
.capability-grid .capability-card:nth-child(n) { border: 1px solid var(--line); background: var(--surface-strong); }
.capability-card p, .feature-list p, .feature-list li, .contact-card p { font-size: 1rem; }
.plan-limit-grid { grid-template-columns: repeat(6,minmax(0,1fr)); }
.plan-limit-grid small { font-size: .875rem; }
.next-action { margin-top: 2rem; padding: 1.6rem; border: 1px solid var(--line); border-radius: 1.1rem; background: var(--surface-alt); display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.next-action h2 { margin: 0 0 .4rem; font-size: 1.4rem; }
.next-action p { margin: 0; color: var(--ink-soft); max-width: 55ch; }
.next-action .button { flex-shrink: 0; }
.download-layout { display: grid; grid-template-columns: 1.1fr 1fr; gap: 2rem; align-items: start; }
.download-panel { padding: clamp(1.4rem,3vw,2.3rem); background: var(--surface-strong); border: 1px solid var(--line); border-radius: 1.3rem; }
.download-panel h2 { margin: .75rem 0; font-size: 1.6rem; }
.download-panel p { color: var(--ink-soft); }
.download-panel [data-download-version] { display: block; font-size: .875rem; margin: .75rem 0; color: var(--ink-soft); }
.download-panel .section-actions { margin-top: 1.2rem; }
.download-help { border-top: 1px solid var(--line); margin-top: 1.5rem; padding-top: 1rem; }
.download-status { font-size: .875rem; color: var(--ink-soft); }
.onboarding-steps { margin: 0; padding: 0; list-style: none; display: grid; gap: 1.4rem; }
.onboarding-steps li { display: grid; grid-template-columns: 2.5rem 1fr; gap: 1rem; }
.onboarding-steps h3 { margin: 0 0 .3rem; font-size: 1.1rem; }
.onboarding-steps p { margin: 0; color: var(--ink-soft); }
.start-next { padding-top: 1rem; }
.success-next-card .button { margin-top: 1.25rem; }
.success-next-card p { font-size: 1rem; }
.stock-header-actions { align-items: center; flex-wrap: wrap; }
.stock-header .stock-paths { display: flex; gap: 1rem; align-items: center; }
.stock-paths a { text-decoration: none; font-size: .875rem; color: #b7c9cc; }
.stock-paths a:hover { color: #5bd4ce; }
.download-label-short { display: none; }
.stock-hero, .sgq-hero { padding-top: 8rem; }
.stock-hero h1, .sgq-hero h1 { font-size: clamp(2.35rem,4vw,3.6rem); line-height: 1.12; }
.sgq-hero-lead { font-size: 1.05rem; }
/* Content never collapses: only fully offscreen, non-focused cards are faded. */
[data-reveal] { transition: opacity .32s ease, transform .32s ease; }
[data-reveal].reveal-out { opacity: 0; transform: translateY(10px); }
[data-reveal]:focus-within { opacity: 1 !important; transform: none !important; }
.motion-toggle { border: 1px solid var(--line); border-radius: .7rem; background: transparent; padding: .5rem .7rem; color: var(--ink-soft); font: inherit; font-size: .875rem; cursor: pointer; }
/* Auth pages retain their focused, light form surface and original validation. */
body.auth-page { color: #183136; }
.auth-story h2 { font-size: clamp(2rem,3.2vw,3.1rem); line-height: 1.15; }
.auth-card h1 { font-size: clamp(1.9rem,3vw,2.8rem); line-height: 1.15; }
.auth-top { gap: 1rem; justify-content: space-between; align-items: center; }
.auth-top a, .field label, .field > span:first-child, .form-section legend { font-size: .875rem; }
.field small, .form-section p.section-help, .form-feedback, .registration-security-note { font-size: .875rem; line-height: 1.5; }
.registration-progress b { font-size: .8rem; }
.registration-reassurance li { font-size: .8rem; }
.auth-footnote { font-size: .875rem; }
.auth-context { font-size: .875rem; color: #496166; margin: 1rem 0; }
.auth-theme-toggle { background: transparent; border: 1px solid #bacacc; color: #38575c; border-radius: .7rem; padding: .5rem .7rem; cursor: pointer; }
.portal-nav a [data-windows-download-label] { width: auto; text-align: left; }
.portal-intro h1 { font-size: clamp(1.8rem,3vw,2.6rem); line-height: 1.2; }
.portal-welcome-copy h1 { font-size: clamp(2rem,3vw,3rem); line-height: 1.15; }
.portal-welcome-choice > p, .portal-welcome-copy ul { font-size: .95rem; }
.portal-welcome-choice > small, .portal-nav a, .portal-user-copy strong, .portal-user-copy small { font-size: .875rem; }
.portal-sidebar { overflow-y: auto; }
.portal-nav { margin-top: 1rem; }
.portal-button:hover:not(:disabled), .portal-logout:hover { box-shadow: 0 0 0 3px rgba(8,124,121,.09); }
.portal-next-step { margin-bottom: 1.3rem; padding: 1rem 1.2rem; background: #e2f2f0; border: 1px solid #c0ded9; border-radius: 1rem; }
.portal-next-step p { margin: .25rem 0; }
.portal-next-step a { font-weight: 650; color: #116560; }
.welcome-instructions { margin: 1rem 0 0; padding-left: 1.1rem; color: #496166; font-size: .875rem; display: grid; gap: .5rem; }
.stock-header { position: fixed; background: #0b1d21; }
.stock-header-inner { min-height: 5.3rem; }
.stock-landing { --teal-dark: #087c79; }
.stock-landing { background: var(--surface); color: var(--ink); }
html[data-theme="dark"] .stock-landing { --teal-dark: #70d9d1; }
.stock-proof, .stock-get-started, .stock-benefit-grid, .stock-flow-grid article, .audience-list li, .free-plan-layout dl { background: var(--surface-strong); border-color: var(--line); }
.stock-section-soft, .stock-start-steps li { background: var(--surface-alt); }
.stock-heading > p:last-child, .stock-benefit-grid p, .stock-flow-grid p, .stock-flow-grid ul, .stock-faq p, .free-plan-layout p, .free-plan-layout dt, .stock-start-steps p, .stock-proof ul { color: var(--ink-soft); }
.stock-proof strong, .stock-start-steps strong { color: var(--ink); }
.stock-benefit-grid { gap: .8rem; border: 0; background: transparent; }
.stock-benefit-grid article { border: 1px solid var(--line); border-radius: 1rem; background: var(--surface-strong); }
.stock-benefit-grid h3 { margin-top: 1rem; }
.stock-benefit-grid p, .stock-flow-grid ul, .stock-start-steps p { font-size: 1rem; }
.stock-heading h2, .free-plan-layout h2, .sgq-section-heading h2, .sgq-faq-intro h2 { font-size: clamp(1.9rem,3vw,2.8rem); line-height: 1.15; }
.stock-section, .sgq-section { padding-block: clamp(3rem,6vw,5rem); }
.footer-bottom { flex-wrap: wrap; gap: 1rem; }
.site-footer .motion-toggle, .stock-footer .motion-toggle { color: #c5d4d6; border-color: #496166; }
.stock-preview { transform: none; }
@media (max-width: 1100px) {
  .hero-grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .hero h1 { font-size: 2.6rem; }
  .hero .product-content { padding: 1rem; }
  .main-nav { gap: .5rem; }
}
@media (max-width: 1020px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-copy { max-width: 700px; }
  .hero h1 { max-width: 23ch; }
  .hero .product-frame { max-width: 700px; }
  .main-nav .mobile-account-link { display: flex; border-top: 1px solid var(--line-dark); }
  .plan-limit-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .stock-paths { display: none !important; }
}
@media (max-width: 820px) {
  .header-actions .button-quiet { display: inline-flex; }
  .header-actions .header-download { display: none; }
  .header-inner { grid-template-columns: auto 1fr auto; gap: .7rem; }
  .nav-toggle { justify-self: end; }
  .journey-grid, .download-layout { grid-template-columns: 1fr; }
  .next-action { align-items: flex-start; flex-direction: column; }
  .hero { padding: 6.7rem 0 3rem; }
  .hero-grid { gap: 2rem; }
  .hero-lead { margin-top: 1rem; }
  .page-hero { padding: 7rem 0 3rem; }
  .auth-top { flex-wrap: wrap; }
}
@media (max-width: 560px) {
  .brand, .brand img { width: 125px; }
  .header-actions { gap: .4rem; }
  .header-actions .icon-button { display: none; }
  .header-inner { min-height: 4.5rem; }
  .main-nav { top: 4.5rem; }
  .hero h1 { font-size: clamp(2rem,8.6vw,2.6rem); max-width: 20ch; }
  .hero .hero-free-note, .hero .platform-note { font-size: .875rem; }
  .hero .hero-lead { font-size: 1rem; }
  .interest-grid { grid-template-columns: 1fr 1fr; gap: .5rem; }
  .interest-card { padding: .85rem .7rem; }
  .interest-card > span { font-size: .875rem; }
  .hero .product-title { font-size: .8rem; }
  .plan-limit-grid { grid-template-columns: 1fr 1fr; }
  .stock-header-inner { gap: .65rem; }
  .stock-header-actions .button { padding-inline: .6rem; font-size: .8rem; }
  .stock-header-actions .button-quiet { display: inline-flex; }
  .stock-header-actions { flex-wrap: nowrap; }
  .download-label-long { display: none; }
  .download-label-short { display: inline; }
  .sgq-header .header-actions { display: flex; }
  .stock-header-actions [data-cta="signup"] { display: none; }
  .stock-header .brand, .stock-header .brand img { width: 125px; }
  .stock-hero, .sgq-hero { padding-top: 6.5rem; }
  .stock-hero h1, .sgq-hero h1 { font-size: 2.25rem; }
  .portal-user { gap: .5rem; }
  .portal-theme-toggle { font-size: .8rem; padding: .4rem; }
  .auth-story > p { font-size: .9rem; }
  .registration-progress b { font-size: .72rem; }
}
@media (prefers-reduced-motion: reduce) {
  [data-reveal], [data-reveal].reveal-out { opacity: 1; transform: none; transition: none; }
}
html[data-motion="off"] [data-reveal] { opacity: 1; transform: none; transition: none; }

/* Inner pages introduce the subject without delaying the useful content. */
.page-main .page-hero { padding: 7rem 0 2rem; }
.page-main .page-hero h1 { max-width: 34ch; font-size: clamp(2rem, 3vw, 2.8rem); }
.page-main .page-hero > .shell > p:last-child { margin-top: 1rem; }
.page-main .page-hero + .content-section { padding-top: 2rem; }
.page-main .content-section > .shell > .content-heading:first-child { margin-bottom: 1.5rem; }
.page-main .content-heading h2 { font-size: clamp(1.6rem, 2.3vw, 2.1rem); }
.plan-public-grid + .truth-note { margin-top: 1.5rem; }
@media (hover: hover) and (pointer: fine) {
  html[data-motion="on"] :is(.capability-card, .feature-list article, .contact-card, .interest-card) { transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
  html[data-motion="on"] :is(.capability-card, .feature-list article, .contact-card, .interest-card):hover { transform: translateY(-2px); border-color: var(--ux-focus); box-shadow: 0 5px 14px #10282d12; }
}
html[data-motion="on"] :is(.button, .auth-submit, .portal-button):active:not(:disabled) { transform: translateY(1px); }
@media (prefers-reduced-motion: reduce) {
  :is(.capability-card, .feature-list article, .contact-card, .interest-card, .button, .auth-submit, .portal-button) { transform: none !important; transition: none !important; }
}
.registration-complete-page .download-panel { padding: 1.4rem; }
.registration-complete-page .download-panel > .step-number { display: none; }
.registration-complete-page .download-panel h2 { margin-top: 0; }
.registration-complete-page .download-help { margin: 0 0 2rem; padding: 0 0 1.5rem; border-top: 0; border-bottom: 1px solid var(--line); }
@media (max-width: 560px) {
  .page-main .page-hero { padding-top: 6rem; }
  .page-main .page-hero h1 { font-size: 2rem; }
}