/* Shared foundations for static pages and the React customer area. */
:root { --canvas:#0b1118; --surface:#111a24; --surface-2:#172330; --ink:#f4f7fa; --muted:#b3c0cd; --faint:#97a9b9; --signal:#75dce5; --signal-soft:#75dce510; --flow:#75dce5; --line:#b0cfec24; --line-strong:#b0cfec45; --max:1180px; }
html { scroll-padding-top:100px; }
body { min-width:0; background:radial-gradient(ellipse at 85% 0%,#143b492f,transparent 46rem),var(--canvas); }
img { max-width:100%; height:auto; }
:where(a,button,summary,select,input):focus-visible { outline:2px solid var(--signal); outline-offset:4px; }
:where(h1,h2,h3) { text-wrap:balance; }
::selection { background:#75dce5; color:#0b1118; }
.site-header { background:#0b1118ed; }
.nav { min-height:80px; gap:1.4rem; }
.brand { gap:.65rem; white-space:nowrap; font-size:1rem; }
.brand-symbol { width:48px; height:32px; display:block; flex:none; }
.nav-tools { display:flex; align-items:center; gap:.7rem; margin-inline-start:auto; }
.desktop-links { display:flex; gap:1.5rem; align-items:center; margin-inline-start:auto; }
.desktop-links a { color:var(--muted); font-size:.88rem; text-decoration:none; padding-block:.65rem; }
.desktop-links a:hover,.desktop-links a[aria-current=page] { color:var(--ink); }
.desktop-links .customer-link { padding:.6rem .9rem; border:1px solid var(--line-strong); border-radius:.7rem; }
.mobile-navigation { display:none; }
.mobile-navigation summary { list-style:none; display:grid; place-items:center; min-width:44px; height:44px; cursor:pointer; border:1px solid var(--line-strong); border-radius:.7rem; background:var(--surface); }
.mobile-navigation summary::-webkit-details-marker { display:none; }
.menu-bars { width:18px; height:12px; display:block; border-block:1.5px solid currentColor; position:relative; }
.menu-bars::before { content:''; position:absolute; inset:4px 0 auto; height:1.5px; background:currentColor; }
.mobile-navigation[open] .menu-bars { transform:rotate(90deg); }
.mobile-links { position:absolute; inset:calc(100% + 1px) 0 auto; padding:1rem max(1rem,calc((100vw - 1180px)/2)); background:var(--surface); border-bottom:1px solid var(--line-strong); box-shadow:0 16px 24px #0005; display:grid; }
.mobile-links a { padding:.8rem .6rem; color:var(--ink); border-bottom:1px solid var(--line); text-decoration:none; }
.mobile-links a:last-child { border:0; }
.mobile-links a:hover { background:var(--surface-2); }
h1,.page-hero h1 { font-size:clamp(2.25rem,5.2vw,4.9rem); line-height:1.06; letter-spacing:-.05em; }
.hero { padding:clamp(3rem,6vw,5.5rem) 0 4rem; overflow:visible; }
.hero-grid { grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:clamp(2rem,5vw,4rem); align-items:center; }
.hero h1 { margin-bottom:1.25rem; }
.hero h1 .signal { display:block; }
.eyebrow { font-family:inherit; letter-spacing:.13em; margin-bottom:1.2rem; }
.eyebrow::before { width:1.25rem; }
.lede { font-size:clamp(1rem,1.35vw,1.16rem); line-height:1.65; max-width:40rem; }
.hero .actions { margin-top:1.6rem; }
.button { border-radius:.65rem; font-size:.94rem; font-family:inherit; cursor:pointer; gap:.55rem; text-align:center; }
.button-primary { background:var(--signal); border-color:var(--signal); color:#08202a; }
.button:hover { background:var(--surface-2); }
.button-primary:hover { background:#a6eff3; }
.actions { gap:.65rem; }
.desktop-note { font-size:.81rem; color:var(--faint); line-height:1.6; max-width:34rem; margin:1rem 0 0; }
.product-visual { margin:0; min-width:0; }
.product-visual > a { display:block; overflow:hidden; border:1px solid var(--line-strong); border-radius:1rem; box-shadow:0 24px 65px #0005; background:var(--surface); }
.product-visual img { display:block; width:100%; aspect-ratio:1.6; object-fit:contain; }
.product-visual figcaption { font-size:.72rem; line-height:1.5; color:var(--faint); margin:.75rem 0 0; }
.visual-label { display:flex; align-items:center; gap:.65rem; margin-bottom:.85rem; font-weight:700; }
.visual-label img { width:26px; height:26px; border-radius:.5rem; }
.visual-label span { color:var(--muted); font-size:.8rem; font-weight:400; margin-inline-start:auto; }
.section { padding:clamp(3rem,6vw,5rem) 0; }
.section-heading { grid-template-columns:1fr 1fr; gap:2rem; margin-bottom:2rem; align-items:start; }
.section-heading h2 { font-size:clamp(1.85rem,3.2vw,2.8rem); line-height:1.12; letter-spacing:-.04em; }
.section-heading p { font-size:1rem; }
.page-hero { padding:3rem 0 2.75rem; }
.page-hero h1 { max-width:950px; font-size:clamp(2.2rem,4.7vw,4rem); line-height:1.12; }
.page-hero .breadcrumbs { margin-bottom:1.6rem; }
.product-card { padding:2rem; border-radius:1rem; background:linear-gradient(120deg,#15384545,var(--surface)); gap:2rem; }
.product-card::after { display:none; }
.product-card h3 { font-size:2.7rem; }
.product-card .status { margin-bottom:1rem; }
.principle-grid { border-radius:1rem; }
.principle-card { padding:1.5rem; min-height:0; }
.principle-card .number { margin-bottom:1.5rem; }
.principle-card p { margin-bottom:0; }
.feature-card,.platform-card,.support-card { background:var(--surface); border-radius:1rem; padding:1.5rem; }
.feature-card .micro,.support-card .micro { margin-bottom:1rem; color:var(--signal); }
.feature-card h3,.support-card h3 { margin-bottom:.6rem; font-size:1.15rem; }
.feature-card p,.support-card p { margin-bottom:0; }
.price-card { border-radius:1rem; min-height:0; padding:2rem; }
.price-card.pro { border-color:#75dce560; background:linear-gradient(145deg,#1639448c,var(--surface) 65%); }
.price-card .micro { margin-bottom:1rem; }
.price { margin:1rem 0 1.4rem; }
.price-card .actions { margin-top:1rem; }
.price-card .availability { margin-bottom:0; }
.billing-note { max-width:58rem; margin:1.3rem 0 0; color:var(--muted); font-size:.88rem; }
.workflow-step { grid-template-columns:3rem .65fr 1.35fr; gap:1.5rem; padding:1.5rem 0; }
.workflow-step h3 { font-size:1.2rem; }
.support-card .text-link { display:inline-flex; margin-top:1.3rem; color:var(--signal); min-height:36px; align-items:center; }
.support-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.faq-list details { border-bottom:1px solid var(--line); padding:0; }
.faq-list summary { cursor:pointer; font-weight:650; font-size:1rem; padding:1.2rem 0; }
.faq-list details p { margin:0 0 1.25rem; max-width:70ch; color:var(--muted); }
.launch-panel { gap:1.5rem; margin-top:2rem; padding:1.4rem; }
.launch-panel .actions { margin:0; }
.legal-content { max-width:72ch; }
.legal-content p { line-height:1.8; }
.legal-nav { top:104px; }
.legal-nav a { padding-block:.15rem; }
.site-footer { padding:2.5rem 0; }
.footer-grid { gap:1.75rem; }
.footer-brand .brand { color:var(--ink); margin-bottom:.6rem; }
.footer-brand p { font-size:.83rem; margin:0; max-width:24rem; }
.footer-links { max-width:32rem; justify-content:flex-end; gap:.6rem 1.3rem; font-size:.85rem; }
.footer-links a { min-height:32px; align-content:center; }
.checkout-shell { max-width:1100px; }
.checkout-intro h1 { font-size:clamp(2rem,4.5vw,3.3rem); letter-spacing:-.04em; }
.checkout-card,.checkout-aside,.checkout-result { background:var(--surface); border-color:var(--line-strong); border-radius:1rem; }
.checkout-shell input { font-size:1rem; }
.checkout-shell input,.checkout-shell .plan-option { background:var(--canvas); }
.checkout-shell .plan-option { text-align:start; }
.checkout-shell .plan-option.selected { background:#13313a; border-color:var(--signal); }
.checkout-intro .checkout-plan-summary { display:inline-block; margin:.25rem 0 0; padding:.6rem .9rem; border:1px solid var(--line-strong); border-radius:.6rem; color:var(--ink); font-size:.95rem; }
@media (max-width:1050px) { .desktop-links { display:none; } .mobile-navigation { display:block; } .nav { min-height:72px; } }
@media (max-width:820px) {
 .hero-grid,.section-heading { grid-template-columns:1fr; } .hero-grid { gap:2rem; }
 .hero h1 { max-width:650px; font-size:clamp(2.5rem,7vw,4rem); } .hero .lede { max-width:38rem; }
 .product-visual { max-width:660px; width:100%; } .workflow-step { grid-template-columns:2rem 1fr; gap:.5rem 1rem; } .workflow-step p { grid-column:2; }
 .section-heading { gap:1rem; } .footer-grid { flex-direction:column; } .footer-links { justify-content:flex-start; }
 .legal-nav { grid-template-columns:repeat(2,minmax(0,1fr)); position:static; }
}
@media (max-width:560px) {
 .shell { width:calc(100% - 2rem); } .nav { gap:.65rem; min-height:68px; } .brand { font-size:.88rem; gap:.4rem; }
 .brand-symbol { width:42px; height:28px; } .nav-tools { gap:.45rem; } .hero { padding:2.5rem 0; }
 .hero h1 { font-size:clamp(2.2rem,9vw,3.1rem); } .eyebrow { font-size:.68rem; letter-spacing:.08em; }
 .hero .actions { margin-top:1.25rem; } .actions .button { flex:1 1 auto; } .section { padding:2.75rem 0; }
 .support-grid { grid-template-columns:1fr; } .product-card,.price-card { padding:1.4rem; } .page-hero { padding:2rem 0; }
 .legal-nav { gap:.5rem; padding:1rem; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none !important; } }
@media (max-width:360px) { .brand { font-size:.78rem; } .brand-symbol { width:34px; } .nav { gap:.45rem; } .language-switcher summary { padding-inline:.5rem; } }