:root { --navy:#102357; --blue:#183b80; --accent:#4777be; --muted:#5c6b84; --line:#e1e7f1; --pale:#f3f6fb; color-scheme:light; font-family:Inter,"Segoe UI",system-ui,-apple-system,sans-serif; color:var(--navy); background:#fff; -webkit-font-smoothing:antialiased; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
body { margin:0; line-height:1.6; }
a { color:inherit; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { line-height:1.12; }
.site-header { max-width:1180px; min-height:98px; margin:auto; padding:20px 28px; display:flex; justify-content:space-between; align-items:center; gap:24px; background:#fff; }
.brand { display:inline-flex; align-items:center; gap:11px; color:var(--navy); text-decoration:none; font-size:20px; font-weight:750; letter-spacing:-.6px; white-space:nowrap; }
.brand img { object-fit:contain; flex:none; }
nav { display:flex; align-items:center; gap:28px; font-size:13px; font-weight:550; }
nav a { text-decoration:none; color:#52617a; }
nav a:hover { color:var(--navy); }
nav .nav-cta { padding:10px 16px; background:var(--pale); border:1px solid var(--line); border-radius:9px; color:var(--blue); }
.hero { max-width:1180px; margin:0 auto; padding:64px 28px 74px; display:grid; grid-template-columns:1.1fr 1fr; gap:66px; align-items:center; }
.platform-tag { display:inline-flex; gap:9px; align-items:center; color:#42618f; font-size:12px; font-weight:600; padding:7px 11px; background:#f0f5fc; border:1px solid #e2eaf6; border-radius:7px; margin-bottom:25px; }
h1 { font-size:clamp(42px,4.6vw,64px); letter-spacing:-2.7px; font-weight:720; margin-bottom:25px; line-height:1.08; }
h1 span { color:#4777be; }
.lead { max-width:475px; font-size:17px; color:var(--muted); line-height:1.75; }
.hero-actions { display:flex; gap:24px; flex-wrap:wrap; align-items:center; margin-top:30px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:14px; padding:13px 18px; min-height:48px; border-radius:10px; background:var(--blue); color:#fff; text-decoration:none; font-size:13px; font-weight:650; border:1px solid transparent; }
.button:hover { background:var(--navy); }
.text-link { color:var(--blue); text-decoration:none; font-size:13px; font-weight:600; }
.text-link:hover { text-decoration:underline; }
.release-note { font-size:12px; color:var(--muted); margin:16px 0 0; }
.preview-stage { padding:28px 34px 22px; border-radius:28px; background:radial-gradient(ellipse at top left,#e0e9f9,transparent 70%),#f3f6fc; border:1px solid #e4eaf5; }
.preview-label { text-align:center; color:#61779c; font-size:9px; font-weight:700; letter-spacing:1.5px; margin-bottom:19px; }
.product-preview { max-width:320px; margin:auto; padding:23px; background:#fff; border:1px solid #e3e9f3; border-radius:18px; box-shadow:0 20px 45px #1023570c; }
.preview-brand { display:flex; align-items:center; gap:9px; margin-bottom:20px; }
.preview-brand img { object-fit:contain; }
.preview-brand strong { display:block; font-size:15px; letter-spacing:-.3px; }
.preview-brand span { display:block; font-size:9px; color:var(--muted); }
.preview-status { padding:14px; display:flex; gap:11px; align-items:flex-start; background:#eff8f3; border:1px solid #daebe1; border-radius:11px; }
.status-dot { flex:none; width:7px; height:7px; margin-top:7px; border-radius:50%; background:#247952; box-shadow:0 0 0 3px #dcefe3; }
.preview-status strong { font-size:12px; }
.preview-status p { color:#526480; font-size:10px; margin:3px 0 0; line-height:1.5; }
.preview-page { margin:20px 0; font-size:12px; }
.preview-page .eyebrow { font-size:9px; }
.preview-host { font-size:12px; font-weight:600; margin:3px 0 13px; }
.preview-page strong { display:block; font-size:13px; }
.preview-page > p:not(.preview-host) { color:var(--muted); margin:4px 0 12px; font-size:11px; }
.preview-count { display:block; padding:6px 9px; font-size:10px; background:var(--pale); border-radius:6px; color:#526480; }
.preview-action { padding:10px; border-radius:8px; background:var(--blue); color:#fff; text-align:center; font-size:11px; font-weight:600; }
.preview-caption { font-size:9px; color:var(--muted); text-align:center; margin:18px 0 0; }
.principles { max-width:1124px; margin:0 auto; padding:21px; display:flex; justify-content:center; gap:58px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:#526480; font-size:13px; }
.principles span::before { content:"✓"; color:var(--accent); margin-right:10px; }
.section { max-width:1180px; padding:94px 28px; margin:auto; }
.section-heading { max-width:650px; margin-bottom:36px; }
.eyebrow { color:#476797; font-size:10px; font-weight:750; letter-spacing:1.7px; margin-bottom:13px; }
h2 { font-size:clamp(29px,3vw,40px); letter-spacing:-1.4px; font-weight:700; margin-bottom:18px; }
.section-heading > p:last-child { color:var(--muted); font-size:15px; max-width:610px; }
h3 { font-size:18px; letter-spacing:-.4px; margin-bottom:13px; }
.feature-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.feature { padding:25px 22px; border:1px solid var(--line); border-radius:16px; }
.feature-number { display:grid; place-items:center; width:33px; height:33px; margin-bottom:27px; background:#eef3fb; color:#4770a9; border-radius:9px; font-size:11px; font-weight:700; }
.feature p { color:var(--muted); font-size:13px; margin-bottom:0; line-height:1.75; }
.section-note { color:var(--muted); font-size:12px; margin:22px 0 0; }
.privacy-band { max-width:1124px; margin:auto; padding:48px; display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; background:#f2f6fc; border:1px solid #e5ecf7; border-radius:22px; }
.privacy-band h2 { font-size:33px; margin:0; }
.privacy-band p:not(.eyebrow) { color:#526480; font-size:14px; }
.privacy-band .privacy-detail { margin-bottom:0; font-size:12px!important; }
.plan-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.plan { display:flex; flex-direction:column; padding:30px; border:1px solid var(--line); border-radius:18px; background:#fff; }
.plan-label { color:#58729a; letter-spacing:1px; font-size:9px; font-weight:700; margin-bottom:15px; }
.plan h3 { font-size:23px; letter-spacing:-.7px; }
.price { display:flex; gap:5px; align-items:baseline; margin:11px 0 0; }
.price strong { font-size:52px; letter-spacing:-2px; line-height:1.1; font-weight:700; }
.price span { font-size:13px; color:var(--muted); }
.annual { font-size:12px; color:#476797; margin:7px 0 24px; }
.plan > p:not(.price):not(.plan-label):not(.annual) { font-size:13px; color:var(--muted); }
.plan ul { padding:0; margin:8px 0 24px; list-style:none; font-size:12px; }
.plan li { padding:6px 0; }
.plan li::before { content:"✓"; margin-right:9px; color:var(--accent); }
.plan .plan-footnote { padding-top:18px; border-top:1px solid var(--line); margin:auto 0 0; font-size:11px!important; }
.plan.featured { border:2px solid #789bcf; padding:29px; background:#f9fbff; box-shadow:0 12px 36px #10235708; }
.plan.upcoming { background:#f7f8fb; }
.plan .organization-price { font-size:22px!important; line-height:1.3; letter-spacing:-.5px; color:var(--navy)!important; margin:14px 0 25px; }
.roadmap-section { border-top:1px solid var(--line); padding-bottom:40px; }
.roadmap-grid { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.roadmap-item { padding:23px; border:1px solid var(--line); border-radius:15px; }
.roadmap-item.current { background:#f2f6fc; border-color:#c8d8ef; }
.roadmap-number { font-size:11px; font-weight:700; color:#617aa0; }
.roadmap-status { float:right; font-size:10px; color:#526480; background:#edf2f9; padding:2px 7px; border-radius:5px; }
.roadmap-item h3 { clear:both; margin:27px 0 11px; }
.roadmap-item p { color:var(--muted); font-size:12px; margin-bottom:0; }
.install-section { padding-top:54px; display:grid; grid-template-columns:.9fr 1.1fr; gap:70px; }
.install-options { display:grid; gap:12px; align-content:start; }
.install-option { border:1px solid var(--line); border-radius:13px; overflow:hidden; }
.install-option[open] { border-color:#b5c9e6; }
summary { display:flex; align-items:center; gap:12px; padding:19px 21px; cursor:pointer; list-style:none; font-size:15px; font-weight:650; }
summary::-webkit-details-marker { display:none; }
summary::after { content:"+"; margin-left:auto; font-size:22px; font-weight:400; color:#617aa0; }
details[open] summary::after { content:"−"; }
summary:hover { background:var(--pale); }
summary small { display:block; font-size:11px; color:var(--muted); font-weight:400; margin-top:2px; }
.availability { font-size:10px; white-space:nowrap; color:#617089; background:#eef2f8; padding:3px 7px; border-radius:5px; margin-left:auto; }
.availability.testing { color:#476797; background:#e7effa; }
.install-body { padding:20px 22px 24px; border-top:1px solid var(--line); }
.install-body h3 { font-size:16px; }
.install-body p { color:var(--muted); font-size:13px; }
.install-body p:last-child { margin-bottom:0; }
.release-badge { display:block; padding:11px; border:1px dashed #bacbe3; border-radius:8px; color:#526480; text-align:center; font-size:12px; }
.closing { max-width:1124px; margin:0 auto 70px; border-radius:22px; background:var(--navy); color:#fff; padding:50px; display:flex; justify-content:space-between; align-items:center; gap:25px; }
.closing .eyebrow { color:#a7bfdf; }
.closing h2 { margin-bottom:0; font-size:34px; }
.closing .button { background:#fff; color:var(--navy); flex:none; }
.closing .button:hover { background:#edf3fc; }
.site-footer { max-width:1180px; margin:auto; padding:0 28px 36px; display:grid; grid-template-columns:1fr 1.6fr auto; align-items:center; gap:25px; color:var(--muted); font-size:11px; }
.site-footer .brand { font-size:16px; }
.site-footer p { margin-bottom:0; }
.site-footer > div { text-align:right; }
.site-footer a:not(.brand) { text-underline-offset:3px; }
.copyright { margin-top:6px; }
:focus-visible { outline:3px solid #4777be; outline-offset:4px; }
summary:focus-visible { outline-offset:-4px; }
.skip-link { position:absolute; top:-80px; left:15px; padding:12px 20px; background:#fff; z-index:5; }
.skip-link:focus { top:10px; }
@media(max-width:1000px) {
  .site-header { flex-wrap:wrap; }
  nav { gap:20px; }
  .hero { gap:30px; padding-top:35px; }
  .preview-stage { padding:25px 18px; }
  .feature-grid,.roadmap-grid { grid-template-columns:repeat(2,1fr); }
  .privacy-band,.closing { margin-left:28px; margin-right:28px; padding:35px; }
  .plan { padding:22px; }
  .plan.featured { padding:21px; }
  .plan h3 { font-size:20px; }
  .install-section { gap:35px; }
  .site-footer { grid-template-columns:1fr 1fr; }
  .site-footer > div { text-align:left; }
}
@media(max-width:760px) {
  .site-header { padding:20px; gap:18px; }
  nav { width:100%; justify-content:space-between; gap:10px; font-size:11px; }
  nav .nav-cta { padding:8px 10px; }
  .hero { grid-template-columns:1fr; padding:35px 22px 40px; gap:35px; }
  h1 { max-width:540px; font-size:48px; letter-spacing:-2px; }
  .lead { max-width:550px; font-size:16px; }
  .hero-actions { gap:18px; }
  .preview-stage { max-width:470px; width:100%; margin:auto; }
  .principles { flex-wrap:wrap; gap:12px 24px; font-size:11px; margin:0 22px; }
  .section { padding:65px 22px; }
  h2 { font-size:31px; }
  .privacy-band { grid-template-columns:1fr; gap:24px; margin:0 22px; padding:28px; }
  .privacy-band h2 { font-size:29px; }
  .plan-grid { grid-template-columns:1fr; gap:16px; }
  .plan,.plan.featured { padding:28px; }
  .plan h3 { font-size:23px; }
  .install-section { grid-template-columns:1fr; gap:0; }
  .closing { flex-direction:column; align-items:flex-start; margin:0 22px 50px; padding:30px; }
  .closing h2 { font-size:28px; }
  .site-footer { grid-template-columns:1fr; padding:0 22px 30px; gap:18px; }
}
@media(max-width:420px) {
  .feature-grid,.roadmap-grid { grid-template-columns:1fr; }
  .feature-number { margin-bottom:18px; }
  .platform-tag { font-size:10px; }
  h1 { font-size:42px; }
  .hero-actions .button { width:100%; }
  .hero-actions .text-link { margin:auto; }
  summary { padding:17px 15px; gap:8px; font-size:14px; }
  summary small { font-size:10px; }
  .availability { font-size:9px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

/* Privacy notice */
.privacy-page{max-width:960px;margin:auto;padding:45px 28px 80px}.privacy-page h1{font-size:clamp(36px,5vw,56px);max-width:800px}.privacy-page .lead{max-width:780px}.privacy-updated{color:var(--muted);font-size:13px}.privacy-callout{background:var(--pale);border-left:4px solid var(--accent);padding:26px;margin:32px 0}.privacy-callout h2{font-size:25px}.privacy-callout p{margin-bottom:0}.privacy-contents{display:flex;flex-wrap:wrap;gap:12px 24px;border-bottom:1px solid var(--line);padding-bottom:24px}.privacy-page section{padding-top:38px;scroll-margin-top:24px}.privacy-page h2{font-size:28px}.privacy-page h3{font-size:20px;margin-top:26px}.privacy-page p,.privacy-page td{color:#43526a}.privacy-page a{text-decoration:underline;text-underline-offset:3px}.privacy-table-wrap{overflow-x:auto}.privacy-page table{border-collapse:collapse;width:100%;font-size:15px}.privacy-page caption{text-align:left;color:var(--muted);margin-bottom:12px}.privacy-page th,.privacy-page td{text-align:left;vertical-align:top;padding:16px;border-bottom:1px solid var(--line)}.privacy-page thead{background:var(--pale)}.privacy-page tbody th{width:27%}a:focus-visible{outline:3px solid var(--accent);outline-offset:4px}@media(max-width:600px){.privacy-page{padding:28px 20px 55px}.privacy-page th,.privacy-page td{padding:12px 8px;font-size:14px}.privacy-page tbody th{width:31%}.privacy-callout{padding:20px}}

/* Release-preview sections reuse the public site's existing cards and palette. */
.controls-grid { grid-template-columns:repeat(3,1fr); }
.feature-details { margin-top:22px; border:1px solid var(--line); border-radius:13px; overflow:hidden; }
.feature-details summary { line-height:1.5; }
.enterprise-section { border-top:1px solid var(--line); }
.enterprise-notes { display:grid; grid-template-columns:1fr 1fr; gap:36px; padding:30px; margin-top:24px; background:var(--pale); border:1px solid var(--line); border-radius:16px; }
.enterprise-notes h3 { font-size:17px; }
.enterprise-notes p { font-size:13px; color:var(--muted); margin:0; }
@media(max-width:760px) {
  nav { flex-wrap:wrap; justify-content:flex-start; gap:12px 18px; }
  .controls-grid,.enterprise-notes { grid-template-columns:1fr; }
  .enterprise-notes { padding:24px; gap:24px; }
}