/* Visual identity v7. Shared layout contracts remain in site.css. */
:root {
  --paper:#f7f7f2; --white:#ffffff; --ink:#173c35; --muted:#5d7069;
  --green:#176b53; --green-dark:#10543f; --on-green:#ffffff;
  --line:#d6dfd8; --soft:#e9eee5; --deep:#143d32; --on-deep:#f6f8ee;
  --deep-muted:#c2d3c7; --focus:#a44e00; --radius:16px; --shell:1240px;
  --accent:#d1e4a7; --canvas:#e2e9dd; --shadow:0 24px 64px #173c350c;
}
:root[data-theme=dark] {
  --paper:#132420; --white:#1b3029; --ink:#eef3e9; --muted:#b0c3b7;
  --green:#bddc97; --green-dark:#d2eab3; --on-green:#203629;
  --line:#354b40; --soft:#203b30; --deep:#0d1d18; --on-deep:#eef3e9;
  --deep-muted:#b0c3b7; --focus:#f0b47c; --accent:#d1e4a7; --canvas:#284837;
  --shadow:0 24px 64px #00000020;
}
body { letter-spacing:-.012em; }
h1,h2,h3 { letter-spacing:-.05em; font-weight:600; }
.site-header { background:var(--paper); }
.header-inner { padding-block:18px; }
.brand { gap:12px; }
.brand .brand-symbol { width:48px; height:48px; padding:6px; border-radius:14px; background:var(--green); color:var(--on-green); }
.site-header .brand { font-weight:670; font-size:17px; line-height:1.15; letter-spacing:-.035em; }
.site-navigation { gap:28px; font-size:13px; }
.site-navigation .nav-download { border-radius:24px; padding:10px 20px; background:var(--green); border-color:var(--green); color:var(--on-green); }
.theme-control summary,.menu-toggle { border-radius:24px; border-color:var(--line); }
.theme-options { border-radius:14px; padding:7px; }
.theme-options button { border-radius:8px; }
.hero { grid-template-columns:.92fr 1.08fr; align-items:center; gap:48px; padding-block:64px 54px; }
.release-label { font:500 12px/1.5 Inter,system-ui,sans-serif; gap:12px; margin-bottom:24px; }
.release-label span { border:0; border-radius:20px; padding:6px 12px; color:var(--green); background:var(--soft); }
.hero h1 { font-size:clamp(48px,4.5vw,66px); line-height:1.06; font-weight:610; letter-spacing:-.055em; max-width:9.5ch; }
.hero h1 span { font-size:23px; line-height:1.35; letter-spacing:-.03em; font-weight:450; max-width:18em; margin-top:24px; color:var(--ink); }
.hero-lead { margin-top:20px; font-size:16px; line-height:1.75; max-width:32em; }
.hero-actions { margin-top:28px; gap:12px; align-items:center; }
.button { border-radius:28px; padding:14px 22px; min-height:50px; font-size:13px; font-weight:600; gap:10px; }
.button:hover { transform:translateY(-1px); }
.button-primary { box-shadow:0 5px 12px #143d3210; }
.button-text { background:transparent; border-color:var(--line); }
.hero-note { max-width:33em; font-size:12px; line-height:1.7; margin-top:24px; }
.hero-visual { min-width:0; gap:16px; }
.hero-preview { background:var(--canvas); padding:22px 22px 0; border:1px solid var(--line); border-radius:24px; box-shadow:var(--shadow); }
.preview-label { padding:0 0 18px; border:0; font:500 12px/1.5 Inter,system-ui,sans-serif; align-items:center; }
.preview-label span:last-child { font-size:10px; font-weight:450; color:var(--muted); }
.hero-preview a { border-radius:10px; overflow:hidden; background:#fff; border:1px solid #173c351a; }
.hero-preview img { aspect-ratio:1.44; object-fit:cover; }
.hero-preview figcaption { padding:15px 0 18px; border:0; font-size:10px; line-height:1.5; gap:12px; }
.preview-zoom { white-space:nowrap; color:var(--ink); }
.couch-comment { background:transparent; color:var(--muted); padding:0 14px; display:flex; gap:18px; border-radius:0; }
.couch-comment .couch-character { width:66px; height:58px; flex-shrink:0; }
.couch-comment p { font-size:12px; font-weight:450; letter-spacing:0; line-height:1.6; max-width:29em; }
.data-route { padding-block:24px 36px; }
.route-heading { font-size:12px; margin-bottom:20px; }
.route-steps { gap:32px; }
.route-steps li { padding-top:18px; }
.route-steps li::before { width:7px; height:7px; border-radius:50%; top:-4px; }
.route-steps li:not(:last-child)::after { animation:none; transform:none; opacity:.25; }
.route-steps strong { font-size:13px; font-weight:600; }
.route-steps span { font-size:12px; }
.spec-strip { background:var(--soft); border-block:0; }
.spec-strip>.shell { padding-block:19px; font:500 12px/1.6 Inter,system-ui,sans-serif; color:var(--ink); }
.section { padding-block:80px; }
h2 { font-size:clamp(30px,3.2vw,44px); line-height:1.12; }
.section-heading { gap:64px; margin-bottom:40px; }
.section-heading>p { font-size:16px; line-height:1.75; }
.report-layout { grid-template-columns:.75fr 1.25fr; gap:54px; }
.feature-ledger>div { padding-block:21px; }
.feature-ledger dt { font-size:17px; font-weight:600; }
.feature-ledger dd { font-size:14px; line-height:1.75; }
.report-image { padding:14px 14px 0; background:var(--canvas); border-radius:20px; }
.report-image a { display:block; border-radius:9px; overflow:hidden; }
.report-image figcaption { border:0; padding-inline:3px; font-size:11px; }
.mobile-layout { background:var(--soft); border-radius:24px; max-width:100%; padding:40px 64px; margin-top:48px; gap:72px; grid-template-columns:240px 1fr; }
.phone-shot { border-radius:14px; border-color:var(--line); }
.mobile-layout h3 { font-weight:550; }
.demo-band { background:var(--deep); border-block:1px solid var(--line); }
.demo-layout { padding-block:64px; }
.demo-panel { border-radius:20px; padding:30px; box-shadow:none; }
.demo-numbers strong { font-size:52px; font-weight:500; }
.demo-consent button,.demo-actions button { border-radius:9px; }
.section-note { font:500 12px/1.6 Inter,system-ui,sans-serif; }
.install-options { gap:24px; }
.install-option { border:1px solid var(--line); border-radius:20px; padding:36px; background:var(--white); }
.install-kind { font:500 12px/1.5 Inter,system-ui,sans-serif; padding:6px 11px; background:var(--soft); border-radius:18px; display:inline-flex; }
.install-head h3 { margin-top:20px; font-size:32px; font-weight:550; }
.install-option ul { font-size:14px; }
.integration-table article { padding-block:32px; }
.integration-table h3 { font-size:26px; font-weight:550; }
.video-layout video { border-radius:18px; }
.faq-list summary { font-weight:550; padding-block:24px; }
.creator-section { background:var(--soft); }
.creator-contact { border-color:var(--line); }
.site-footer { font-size:12px; padding-block:36px; }
.screen-dialog { border-radius:20px; }
.dialog-bar button,.dialog-controls button { border-radius:24px; }
.guide-page .guide-brand-symbol { width:44px; height:44px; padding:5px; background:var(--green); color:var(--on-green); border-radius:12px; }
.guide-page .guide-brand { font-size:19px; letter-spacing:-.035em; font-weight:650; }
.guide-page .guide-code { border-radius:12px; }
.guide-page .button { border-radius:24px; }
@media(max-width:1100px) {
  .hero { gap:32px; }
  .hero h1 { font-size:54px; }
  .hero h1 span { font-size:21px; }
  .hero-preview { padding:16px 16px 0; }
  .hero-actions .button { font-size:12px; padding-inline:17px; }
  .site-navigation { gap:20px; }
}
@media(max-width:900px) and (min-width:761px) {
  .site-header .brand { font-size:14px; gap:9px; }
  .brand .brand-symbol { width:40px; height:40px; }
  .site-navigation { gap:14px; font-size:12px; }
  .site-navigation .nav-download { padding-inline:14px; }
  .header-inner { gap:12px; }
  .theme-control summary { padding-inline:10px; }
  .hero { grid-template-columns:1fr; gap:36px; padding-top:48px; }
  .hero-copy { max-width:620px; }
  .hero h1 { max-width:none; font-size:58px; }
  .hero-visual { max-width:700px; }
  .report-layout { gap:30px; }
}
@media(max-width:760px) {
  .header-inner { padding-block:12px; }
  .hero { grid-template-columns:1fr; padding-block:40px 32px; gap:32px; }
  .hero h1 { font-size:clamp(44px,8vw,58px); max-width:12ch; }
  .hero h1 span { font-size:22px; margin-top:20px; max-width:18em; }
  .hero-preview { max-width:none; }
  .hero-visual { width:100%; }
  .couch-comment { padding-inline:4px; }
  .data-route { padding-block:18px 28px; }
  .route-heading { font-size:11px; }
  .route-steps { gap:24px; }
  .spec-strip>.shell { font-size:11px; }
  .section { padding-block:56px; }
  .section-heading { gap:22px; margin-bottom:30px; }
  .report-layout { grid-template-columns:1fr; gap:28px; }
  .mobile-layout { grid-template-columns:180px 1fr; gap:32px; padding:28px; margin-top:32px; }
  .demo-layout { padding-block:48px; }
  .install-option { padding:28px; }
  .guide-page .guide-brand { font-size:17px; }
}
@media(max-width:480px) {
  .site-header .brand { font-size:14px; gap:9px; }
  .brand .brand-symbol { width:40px; height:40px; padding:5px; border-radius:12px; }
  .header-controls { gap:6px; }
  .theme-control summary { padding:8px; gap:6px; }
  .menu-toggle { padding:8px; }
  .hero-lead { font-size:15px; }
  .hero h1 { font-size:46px; }
  .hero h1 span { font-size:21px; }
  .hero-actions { gap:9px; }
  .hero-actions .button { font-size:12px; padding:13px 16px; }
  .hero-note { font-size:11px; max-width:30em; }
  .hero-preview { padding:14px 14px 0; border-radius:18px; }
  .preview-label { font-size:11px; padding-bottom:12px; }
  .preview-label span:last-child { font-size:9px; }
  .preview-zoom { display:none; }
  .hero-preview figcaption { padding-block:12px; font-size:10px; }
  .couch-comment .couch-character { width:54px; height:48px; }
  .couch-comment p { font-size:11px; }
  .route-steps { gap:22px 20px; }
  .route-steps strong { font-size:12px; }
  .route-steps span { font-size:11px; }
  .mobile-layout { grid-template-columns:1fr; padding:28px 24px; gap:28px; }
  .demo-panel { padding:22px; }
  .install-option { padding:26px; }
  .site-footer { font-size:11px; }
  .guide-page .guide-brand-symbol { width:34px; height:34px; padding:4px; border-radius:10px; }
}
@media(max-width:360px) {
  .site-header .brand { font-size:12px; gap:7px; }
  .brand .brand-symbol { width:34px; height:34px; padding:4px; }
  .hero h1 { font-size:40px; }
  .hero h1 span { font-size:20px; }
  .hero-actions .button { padding-inline:13px; font-size:11px; }
  .route-heading { flex-direction:column; gap:4px; }
}
@media(prefers-reduced-motion:reduce) { .button:hover { transform:none; } }
@media print { .hero-preview,.report-image { box-shadow:none; } }

/* The stepped cushion mark determines the rounded corners and warm product stage. */
:root { --paper:#f8f7f2; --ink:#213b31; --muted:#637067; --green:#244c3c; --green-dark:#163a2b; --line:#d8ddd1; --soft:#edf0e5; --accent:#eee49b; --canvas:#eee49b; --terracotta:#ab482f; --stage-ink:#2f412c; --stage-line:#bdba85; --stage-muted:#596043; --radius:12px; }
:root[data-theme=dark] { --paper:#19251f; --white:#23332b; --ink:#f0f0e5; --muted:#b6c4b5; --green:#dbdfa6; --green-dark:#eaedc7; --on-green:#243b2c; --line:#405044; --soft:#293b2d; --canvas:#dcd693; --terracotta:#ecae8e; --stage-ink:#2f412c; --stage-line:#aaa66f; --stage-muted:#53593c; }
.brand .brand-symbol,.guide-page .guide-brand-symbol { padding:0; background:none; color:var(--green); border-radius:0; }
.site-header .brand { font-size:18px; font-weight:750; letter-spacing:-.055em; }
.site-header .brand-symbol { width:46px; height:46px; transition:transform .25s ease; }
.brand:hover .brand-symbol { transform:translateY(-2px) rotate(-4deg); }
.site-navigation .nav-download,.theme-control summary,.menu-toggle { border-radius:9px; }
.site-navigation .nav-download { background:transparent; color:var(--ink); border-color:var(--line); }
.hero { display:block; padding-block:54px 24px; }
.hero-intro { display:grid; grid-template-columns:1.5fr 1fr; gap:64px; align-items:end; margin-bottom:38px; }
.hero-copy { max-width:none; }
.release-label { font-size:11px; margin-bottom:23px; gap:12px; flex-wrap:wrap; }
.release-label span { background:none; color:var(--terracotta); padding:0; font-weight:650; }
.hero h1 { font-size:clamp(44px,4.65vw,66px); max-width:none; line-height:1.07; letter-spacing:-.06em; font-weight:650; }
.hero h1 em { font-style:normal; color:var(--green); font-weight:450; }
.hero-lead { font-size:15px; margin:0; line-height:1.7; }
.hero-actions { margin-top:22px; gap:20px; }
.button { border-radius:10px; padding:14px 20px; }
.hero-demo-link { font-size:12px; font-weight:550; }
.hero-note { margin:16px 0 0; max-width:none; font-size:11px; }
.product-stage { border-radius:22px; background:var(--canvas); color:var(--stage-ink); padding:24px 30px 28px; }
.stage-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid var(--stage-line); padding-bottom:17px; }
.stage-brand { display:flex; align-items:center; gap:12px; font-size:13px; font-weight:600; }
.stage-brand svg { width:30px; height:30px; }
.stage-heading>p { font-size:11px; }
.product-tabs { display:flex; gap:4px; padding-block:17px 20px; }
.product-tabs button { border:1px solid transparent; border-radius:8px; padding:10px 15px; min-height:44px; color:var(--stage-ink); background:transparent; font-size:12px; font-weight:550; }
.product-tabs button:hover { border-color:var(--stage-line); }
.product-tabs button[aria-selected=true] { background:var(--stage-ink); color:#fffde8; }
.product-panel { display:grid; grid-template-columns:1fr 3fr; align-items:center; gap:40px; }
.product-panel-copy h3 { font-size:28px; line-height:1.15; letter-spacing:-.045em; font-weight:550; margin-bottom:16px; }
.product-panel-copy p { font-size:13px; line-height:1.75; color:var(--stage-muted); }
.product-panel-copy>span { display:block; margin-top:28px; font-size:10px; max-width:20em; color:var(--stage-muted); }
.product-shot { min-width:0; }
.product-shot>a { display:flex; align-items:center; justify-content:center; height:410px; border-radius:10px; overflow:hidden; background:#fff; border:1px solid #213b3126; box-shadow:0 12px 30px #39482512; }
.product-shot img { width:100%; height:100%; object-fit:contain; }
.product-shot figcaption { margin-top:11px; font-size:10px; color:var(--stage-muted); }
.product-phone>a { background:#e4dfa9; }
.product-phone img { width:auto; max-width:100%; }
.js .product-panel:not([hidden]) .product-shot { animation:product-arrive .3s ease both; }
@keyframes product-arrive { from { transform:translateY(7px); } to { transform:none; } }
html:not(.js) .product-panel { padding-top:28px; }
.data-route { padding-block:32px 38px; }
.spec-strip { background:var(--green); color:var(--on-green); }
.spec-strip>.shell { color:var(--on-green); }
.section { padding-block:72px; }
.section-heading { grid-template-columns:1.2fr 1fr; align-items:start; gap:64px; }
h2 { font-weight:550; font-size:clamp(30px,3.25vw,44px); }
.report-layout { display:block; }
.feature-ledger { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; }
.feature-ledger>div { border-top:2px solid var(--line); }
.feature-ledger dt { font-size:20px; letter-spacing:-.025em; }
.report-description>.quiet { max-width:73em; }
.report-description>.text-link { margin-top:12px; }
.demo-band { background:var(--deep); }
.demo-panel { border-radius:16px; }
.demo-numbers strong { color:var(--green); }
.install-options { gap:0; border:1px solid var(--line); border-radius:18px; overflow:hidden; }
.install-option { border:0; border-radius:0; padding:36px; }
.install-option+ .install-option { border-left:1px solid var(--line); background:var(--soft); }
.install-kind { padding:0; background:none; color:var(--terracotta); border-radius:0; }
.install-head h3 { font-size:36px; font-weight:600; }
.integration-table article { transition:padding .2s,background .2s; }
.integration-table article:focus-within { background:var(--soft); }
.faq-list details[open] { padding-inline:18px; background:var(--soft); border-radius:8px; }
.faq-list details { transition:background .2s; }
.creator-section { background:var(--canvas); color:var(--stage-ink); }
.creator-section p,.creator-section a:not(.button) { color:var(--stage-ink); }
.creator-section .button { background:var(--stage-ink); color:#fffde8; }
.creator-contact { border-color:var(--stage-line); }
.guide-page .guide-brand { font-weight:700; }
@media(min-width:1600px) { .product-shot>a { height:460px; } }
@media(max-width:1100px) {
  .hero-intro { gap:32px; grid-template-columns:1.2fr 1fr; }
  .hero h1 { font-size:50px; }
  .hero-actions { gap:14px; }
  .product-panel { gap:28px; grid-template-columns:1fr 2.5fr; }
  .product-shot>a { height:350px; }
}
@media(max-width:900px) {
  .hero-intro { grid-template-columns:1fr; gap:24px; }
  .hero h1 { font-size:58px; }
  .hero-summary { display:grid; grid-template-columns:1.4fr 1fr; gap:30px; align-items:start; }
  .hero-actions { margin:0; }
  .product-panel { grid-template-columns:1fr; gap:20px; }
  .product-panel-copy { display:grid; grid-template-columns:1fr 1.5fr; gap:24px; align-items:start; }
  .product-panel-copy h3 { margin:0; }
  .product-panel-copy>span { display:none; }
  .product-shot>a { height:400px; }
  .feature-ledger { gap:24px; }
}
@media(max-width:760px) {
  .site-header .brand { font-size:15px; }
  .site-header .brand-symbol { width:39px; height:39px; }
  .hero { padding-top:36px; }
  .hero h1 { font-size:clamp(38px,7.8vw,56px); }
  .hero-summary { display:block; }
  .hero-actions { margin-top:20px; }
  .hero-intro { margin-bottom:28px; }
  .product-stage { padding:18px; border-radius:16px; }
  .product-shot>a { height:320px; }
  .section-heading { grid-template-columns:1fr; gap:20px; }
  .feature-ledger { grid-template-columns:1fr; gap:0; }
  .feature-ledger>div { padding-block:22px; }
  .section { padding-block:52px; }
  .install-option+.install-option { border-left:0; border-top:1px solid var(--line); }
}
@media(max-width:480px) {
  .hero h1 { font-size:39px; }
  .hero-intro { gap:20px; }
  .release-label { font-size:10px; margin-bottom:20px; gap:7px 12px; }
  .hero-lead { font-size:14px; }
  .product-stage { padding:15px; }
  .stage-brand { gap:8px; font-size:11px; }
  .stage-brand svg { width:26px; height:26px; }
  .stage-heading>p { display:none; }
  .product-tabs { gap:2px; padding-block:12px 18px; }
  .product-tabs button { padding:8px 9px; font-size:10px; flex:1; line-height:1.4; }
  .product-panel-copy { display:block; }
  .product-panel-copy h3 { font-size:24px; margin-bottom:10px; }
  .product-panel-copy p { font-size:12px; }
  .product-panel { gap:18px; }
  .product-shot>a { height:215px; }
  .product-phone>a { height:330px; }
  .product-shot figcaption { font-size:9px; }
  .hero-note { font-size:10px; }
  .install-option { padding:26px; }
}
@media(max-width:360px) {
  .site-header .brand { font-size:12px; }
  .site-header .brand-symbol { width:34px; height:34px; }
  .hero h1 { font-size:33px; }
  .product-tabs button { padding-inline:6px; }
  .product-shot>a { height:180px; }
  .product-phone>a { height:300px; }
}
@media(prefers-reduced-motion:reduce) { .brand:hover .brand-symbol { transform:none; } .js .product-panel:not([hidden]) .product-shot { animation:none; } }
@media print { .product-tabs { display:none; } .product-panel[hidden] { display:grid!important; } .product-panel { break-inside:avoid; padding-block:20px; } }
