:root { --ink:#102842; --ink-2:#183957; --paper:#fbf8f1; --paper-deep:#f0eadf; --line:#d9d8d2; --signal:#b63b1d; --signal-dark:#8e250c; --gold:#f8b64c; --green:#46a675; --muted:#4d606f; --shadow:0 18px 55px rgba(13,35,57,.12); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; background:var(--paper); color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.5; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.48; background-image:linear-gradient(rgba(19,53,77,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(19,53,77,.025) 1px,transparent 1px); background-size:26px 26px; z-index:-1; }
a { color:inherit; } button,input,textarea { font:inherit; } button { cursor:pointer; } .section-shell { width:min(1140px,calc(100% - 48px)); margin-inline:auto; }
.skip-link { position:absolute; left:-999px; top:10px; z-index:20; background:var(--signal); color:white; padding:10px 14px; border-radius:8px; font-weight:800; }.skip-link:focus { left:10px; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }.hidden-field { position:absolute; left:-9999px; }
.site-header { width:min(1240px,calc(100% - 48px)); min-height:82px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:28px; border-bottom:1px solid rgba(16,40,66,.12); }
.brand { display:inline-flex; align-items:center; gap:10px; font-size:20px; font-weight:850; letter-spacing:-.05em; text-decoration:none; white-space:nowrap; }.brand > span:last-child span { color:var(--signal); }.brand-mark { width:26px; height:26px; display:flex; align-items:end; gap:3px; padding:4px; background:var(--ink); border-radius:7px; transform:skewY(-7deg); }.brand-mark i { display:block; flex:1; background:var(--signal); border-radius:1px; }.brand-mark i:nth-child(1){height:42%}.brand-mark i:nth-child(2){height:70%}.brand-mark i:nth-child(3){height:100%}
.site-nav { display:flex; align-items:center; gap:25px; font-size:14px; font-weight:700; }.site-nav a { text-decoration:none; color:#38506a; }.site-nav a:hover { color:var(--signal-dark); }.site-nav .nav-cta { color:var(--paper); background:var(--ink); padding:10px 14px; border-radius:8px; }.site-nav .nav-cta:hover { color:white; background:var(--ink-2); }.menu-toggle { display:none; }.source-ref { color:#425766; font-weight:800; }
.hero { min-height:650px; padding:95px 0 78px; display:grid; grid-template-columns:1.04fr .96fr; align-items:center; gap:60px; }.eyebrow { margin:0 0 15px; color:var(--signal-dark); font-size:11px; letter-spacing:.13em; font-weight:850; }.signal-dot { display:inline-block; width:7px; height:7px; margin-right:7px; border-radius:50%; background:var(--signal); box-shadow:0 0 0 4px rgba(244,91,47,.12); vertical-align:1px; }
h1,h2,h3,p { margin-top:0; } h1 { max-width:650px; margin-bottom:22px; font-family:Georgia,"Times New Roman",serif; font-size:clamp(3.2rem,7vw,5.9rem); line-height:.97; letter-spacing:-.065em; font-weight:500; } h1 em { color:var(--signal); font-weight:400; } h2 { font-family:Georgia,"Times New Roman",serif; font-size:clamp(2.1rem,4vw,3.35rem); line-height:1.03; letter-spacing:-.045em; font-weight:500; }.hero-summary { max-width:560px; color:#425a70; font-size:19px; line-height:1.6; }.hero-proof { list-style:none; display:flex; flex-wrap:wrap; padding:8px 0 15px; gap:16px 24px; font-size:13px; font-weight:750; }.hero-proof li { display:flex; align-items:center; gap:7px; }.hero-proof span { color:var(--green); font-size:18px; }
.demo-form { max-width:565px; margin-top:20px; padding:15px; background:white; border:1px solid #d7d8d4; border-radius:13px; box-shadow:0 9px 28px rgba(16,40,66,.07); }.demo-form label { display:block; padding:0 4px 8px; font-size:12px; font-weight:800; color:#496075; }.input-row { display:flex; gap:8px; }.input-row input { min-width:0; flex:1; padding:13px 14px; border:1px solid #cbd2d5; border-radius:8px; outline:none; color:var(--ink); }.input-row input:focus,.lead-form input:focus,.lead-form textarea:focus { border-color:var(--signal); box-shadow:0 0 0 3px rgba(182,59,29,.15); }.input-row button,.button { border:0; border-radius:8px; padding:13px 17px; background:var(--signal); color:white; font-weight:850; white-space:nowrap; text-decoration:none; display:inline-block; }.input-row button:hover,.button:hover { background:var(--signal-dark); }.form-status { min-height:18px; margin:9px 4px 0; color:#52636d; font-size:11px; }.form-status.error { color:#97280f; }.form-status.success { color:#1f6845; }
.hero-visual { position:relative; min-height:420px; }.hero-visual::before { content:""; position:absolute; inset:15px 0 0 15px; border-radius:50%; background:radial-gradient(circle,#e7e1d5 0 28%,rgba(231,225,213,.7) 29% 47%,transparent 48%); }.hero-orbit { position:absolute; border:1px dashed rgba(24,57,87,.24); border-radius:50%; }.orbit-one { width:320px; height:320px; right:12px; top:54px; }.orbit-two { width:410px; height:410px; right:-28px; top:9px; border-color:rgba(244,91,47,.25); }.matrix-card { position:absolute; z-index:2; width:min(360px,90%); padding:20px; background:#fffefa; border:1px solid #d9d5cc; border-radius:13px; box-shadow:var(--shadow); transform:rotate(-4deg); right:47px; top:56px; }.card-topline { display:flex; align-items:center; justify-content:space-between; color:#6b7880; font-size:9px; letter-spacing:.13em; font-weight:900; }.mini-brand { color:var(--ink); }.live-pill { padding:3px 5px; background:#e7f4ed; color:#268252; border-radius:4px; letter-spacing:.08em; }.card-title-row { display:flex; align-items:center; gap:8px; margin:18px 0 13px; }.doc-icon { color:var(--signal); font-size:20px; }.card-title-row strong { font-size:15px; }.dots { margin-left:auto; letter-spacing:2px; color:#98a1a4; }.mini-table { border-top:1px solid #e6e5e0; }.mini-table div { display:grid; grid-template-columns:18px 1fr auto; align-items:center; gap:5px; padding:10px 0; border-bottom:1px solid #eeeae3; font-size:11px; }.mini-table b { font-weight:700; }.mini-table small { color:#7c8990; }.complete-icon,.alert-icon,.empty-icon { width:15px; height:15px; display:inline-grid; place-items:center; border-radius:50%; font-weight:900; }.complete-icon { background:#e4f3ea; color:#278252; }.alert-icon { background:#fff0cc; color:#a6630d; }.empty-icon { border:1.5px solid #b9c2c4; }.amendment-card { position:absolute; z-index:3; display:flex; align-items:center; gap:11px; max-width:260px; padding:13px 15px; right:0; bottom:35px; background:var(--ink); color:white; border-radius:10px; box-shadow:0 14px 32px rgba(16,40,66,.27); transform:rotate(4deg); }.amendment-card small { display:block; margin-bottom:2px; color:#ffb18e; font-size:9px; letter-spacing:.1em; font-weight:850; }.amendment-card strong { font-size:13px; }.amendment-icon { display:grid; place-items:center; width:29px; height:29px; border-radius:50%; background:var(--signal); font-weight:900; }
.proof-strip { display:flex; align-items:center; justify-content:center; gap:45px; padding:23px 24px; background:var(--ink); color:white; font-size:13px; }.proof-strip p { margin:0; color:#b9c8d3; }.proof-items { display:flex; align-items:center; gap:15px; font-weight:800; }.proof-items i { display:block; width:3px; height:3px; border-radius:50%; background:var(--signal); }
.problem-section { padding:115px 0; }.compact-heading { max-width:680px; }.compact-heading h2 { margin-bottom:0; }.problem-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:52px; }.problem-grid article { min-height:220px; padding:25px; background:rgba(255,255,255,.5); border:1px solid #dddcd6; border-radius:11px; }.problem-number { display:block; margin-bottom:37px; color:var(--signal-dark); font-size:12px; font-weight:900; letter-spacing:.08em; }.problem-grid h3 { margin-bottom:10px; font-size:18px; letter-spacing:-.03em; }.problem-grid p { margin:0; color:#4d606f; font-size:14px; }
.process-section { padding:90px 0 105px; border-top:1px solid #dddcd5; }.process-header { display:grid; grid-template-columns:1.1fr .75fr; gap:90px; align-items:end; }.process-header p:last-child { margin:0 0 6px; color:#4d606f; font-size:16px; }.process-list { list-style:none; display:grid; grid-template-columns:repeat(3,1fr); margin:63px 0 0; padding:0; border-top:1px solid #cfd4d4; }.process-list li { padding:24px 29px 8px 0; border-right:1px solid #cfd4d4; }.process-list li:not(:first-child){padding-left:29px}.process-list li:last-child{border:0}.process-list > li > span { color:var(--signal-dark); font-size:12px; font-weight:900; }.process-list h3 { margin:38px 0 8px; font-size:21px; letter-spacing:-.035em; }.process-list p { color:#4d606f; font-size:14px; }
.matrix-section { padding:105px 0; background:#e9e5da; }.matrix-heading { display:flex; justify-content:space-between; gap:30px; align-items:end; margin-bottom:38px; }.matrix-heading h2 { margin:0; }.matrix-actions { text-align:right; }.matrix-actions p { margin:7px 0 0; color:#4c5d65; font-size:11px; }.text-link { color:var(--signal-dark); font-size:13px; font-weight:850; text-decoration:none; }.text-link:hover { text-decoration:underline; }.matrix-window { overflow:hidden; background:white; border:1px solid #d4d4cc; border-radius:12px; box-shadow:0 15px 44px rgba(16,40,66,.1); }.window-topbar { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:19px 23px; background:#fbfcfc; border-bottom:1px solid #e0e4e2; }.window-doc { display:flex; align-items:center; gap:10px; }.doc-icon.large { font-size:25px; }.window-doc strong,.window-doc small { display:block; }.window-doc strong { font-size:14px; }.window-doc small { color:#52636d; font-size:11px; }.version-chip { padding:5px 8px; border:1px solid #d77f60; border-radius:5px; background:#fff6f1; color:#982d11; font-size:11px; font-weight:800; }.matrix-controls { display:flex; gap:8px; padding:14px 19px; border-bottom:1px solid #ebedeb; }.filter-button { border:1px solid #d8dfde; border-radius:6px; padding:6px 9px; background:white; color:#455b6a; font-size:12px; font-weight:750; }.filter-button span { margin-left:4px; color:#60717a; }.filter-button:hover,.filter-button.active { color:var(--ink); border-color:var(--ink); background:#f0f5f5; }.table-wrap { overflow-x:auto; }.table-wrap:focus { outline:3px solid rgba(182,59,29,.25); outline-offset:-3px; } table { width:100%; min-width:700px; border-collapse:collapse; text-align:left; } th { padding:11px 15px; background:#fafbfa; color:#4f626d; font-size:10px; letter-spacing:.08em; text-transform:uppercase; } td { padding:13px 15px; border-top:1px solid #edf0ee; vertical-align:middle; font-size:13px; } td:nth-child(1){width:55px}td:nth-child(3){width:85px}td:nth-child(4){width:125px}td:nth-child(5){width:70px}td strong,td small { display:block; }td strong{font-size:13px}td small{margin-top:3px;color:#52636d;font-size:11px}td a{color:#982d11;font-weight:800;text-decoration:none}.row-check { width:22px; height:22px; border:1.5px solid #c7d0cf; border-radius:50%; background:white; color:#52636d; font-weight:900; }.row-check.done { border-color:#77bf94; background:#e8f5ed; color:#287a50; }.row-check.alert { border-color:#d9a648; background:#fff4dc; color:#82520d; }.row-check.changed { border-color:#d77f60; background:#fff0e9; color:#982d11; }.owner { display:inline-grid; place-items:center; width:23px; height:23px; margin-right:4px; border-radius:50%; background:#dbeee4; color:#327556; font-size:9px; font-weight:900; }.owner.navy { background:#e3ebf2; color:#345778; }.owner.orange { background:#ffe7d9; color:#963b20; }.amendment-tag { display:inline-block; padding:1px 4px; border-radius:3px; background:#fff0e8; color:#982d11; font-size:9px; letter-spacing:.06em; font-weight:900; }.matrix-footer { display:flex; align-items:center; gap:18px; padding:14px 20px; border-top:1px solid #e4e8e5; color:#52636d; font-size:11px; }.matrix-footer strong { margin-left:auto; color:#425766; }.legend-dot { display:inline-block; width:7px; height:7px; margin-right:4px; border-radius:50%; }.green{background:#4ca775}.yellow{background:#c28418}.orange-dot{background:#c65332}
.amendment-section { display:grid; grid-template-columns:1fr .85fr; align-items:center; gap:100px; padding:125px 0; }.amendment-copy > p:not(.eyebrow) { color:#4d606f; font-size:16px; }.check-list { margin:24px 0 0; padding:0; list-style:none; }.check-list li { margin:10px 0; font-size:14px; font-weight:700; }.check-list li::before { content:"✓"; margin-right:10px; color:var(--green); }.diff-card { overflow:hidden; background:white; border:1px solid #d9ddda; border-radius:11px; box-shadow:var(--shadow); }.diff-title { display:flex; justify-content:space-between; padding:16px 18px; background:var(--ink); color:white; font-size:13px; font-weight:800; }.diff-title small{color:#ffc0a7;font-size:10px;letter-spacing:.06em}.diff-item { display:flex; gap:11px; padding:14px 18px; border-bottom:1px solid #e7e8e4; }.diff-item > span { display:grid; place-items:center; width:20px; height:20px; flex:0 0 auto; border-radius:5px; font-weight:900; }.diff-item p{margin:0;font-size:13px}.diff-item p small{display:block;margin-bottom:2px;font-size:9px;font-weight:900;letter-spacing:.07em}.diff-item.removed{background:#fff7f5;color:#91422f}.diff-item.removed > span{background:#ffe1d9}.diff-item.added{color:#236444}.diff-item.added > span{background:#ddf1e4}.diff-note{display:flex;gap:9px;align-items:center;padding:14px 18px;background:#fffbf1;color:#6d5314;font-size:12px;font-weight:800}.diff-note span{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#bb8a25;color:white}
.pricing-section { padding:0 0 110px; }.pricing-card { display:grid; grid-template-columns:1fr .82fr; gap:80px; padding:48px 55px; background:var(--signal); color:white; border-radius:14px; box-shadow:0 20px 44px rgba(142,37,12,.22); }.pricing-card .eyebrow { color:white; }.pricing-card h2 { margin-bottom:16px; }.pricing-card p:not(.eyebrow) { max-width:510px; margin-bottom:0; color:white; font-size:16px; }.pricing-side { padding-left:32px; border-left:1px solid rgba(255,255,255,.5); }.price { display:block; font-family:Georgia,serif; font-size:61px; line-height:.9; letter-spacing:-.06em; }.price-unit { display:block; margin:7px 0 19px; color:white; font-size:12px; font-weight:800; }.pricing-side ul { margin:0 0 23px; padding:0; list-style:none; font-size:12px; }.pricing-side li { margin:7px 0; padding-left:17px; position:relative; }.pricing-side li::before{content:"✓";position:absolute;left:0;color:white;font-weight:900}.light-button { background:white; color:var(--signal-dark); }.light-button:hover { background:#fff0e9; color:#8e250c; }
.faq-section { padding:0 0 110px; }.faq-list { margin-top:42px; border-top:1px solid #d1d7d4; }.faq-list details { border-bottom:1px solid #d1d7d4; }.faq-list summary { display:flex; justify-content:space-between; gap:20px; padding:22px 3px; list-style:none; font-weight:800; font-size:16px; cursor:pointer; }.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span{color:var(--signal-dark);font-size:21px;font-weight:400;line-height:.8}.faq-list details[open] summary span{transform:rotate(45deg)}.faq-list details p{max-width:740px;margin:0;padding:0 3px 20px;color:#4d606f;font-size:14px}
.request-section { padding:95px 0; background:var(--ink); color:white; }.request-grid { display:grid; grid-template-columns:.95fr 1.05fr; gap:90px; align-items:start; }.request-grid .eyebrow{color:#ffb699}.request-grid h2{margin-bottom:18px}.request-grid > div > p:not(.eyebrow){max-width:440px;color:#d3dde3;font-size:17px}.request-note{margin-top:33px!important;padding-top:19px;border-top:1px solid rgba(255,255,255,.18);color:#b9cad5!important;font-size:12px!important}.lead-form { padding:25px; background:#fffefa; color:var(--ink); border-radius:11px; box-shadow:0 18px 40px rgba(0,0,0,.18); }.lead-form label { display:block; margin-bottom:14px; color:#465b69; font-size:11px; font-weight:850; letter-spacing:.02em; }.lead-form input,.lead-form textarea { width:100%; margin-top:5px; padding:10px 11px; resize:vertical; background:white; border:1px solid #cdd5d4; border-radius:6px; outline:none; color:var(--ink); }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.submit-button { width:100%; margin-top:3px; }.privacy-note { margin:10px 0 0; color:#52636d; font-size:10px; text-align:center; }.privacy-note a,.site-footer a:not(.brand){color:inherit;font-weight:800}.site-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:28px 0; color:#52636d; font-size:12px; }.site-footer p{margin:0}.site-footer .brand{font-size:17px}.site-footer .brand-mark{width:22px;height:22px}.privacy-page{min-height:100vh;padding-top:32px}.privacy-card{max-width:760px;margin:70px auto;padding:48px;background:white;border:1px solid #deded6;border-radius:14px;box-shadow:var(--shadow)}.privacy-card h1{font-size:clamp(2.6rem,6vw,4.5rem)}.privacy-card h2{margin-top:35px;font-family:inherit;font-size:20px;font-weight:800;letter-spacing:-.03em}.privacy-card p:not(.eyebrow){color:#4d606f;font-size:16px}.success-page{min-height:100vh;padding-top:32px}.success-card{max-width:680px;margin:13vh auto;padding:50px;background:white;border:1px solid #deded6;border-radius:14px;box-shadow:var(--shadow)}.success-card h1{font-size:clamp(2.7rem,6vw,4.8rem)}.success-card p:not(.eyebrow){max-width:510px;color:#4d606f;font-size:17px}.success-mark{display:grid;place-items:center;width:42px;height:42px;margin-bottom:25px;border-radius:50%;background:#e5f3eb;color:#298050;font-size:22px;font-weight:900}
@media (max-width:850px){.site-header{position:relative}.menu-toggle{display:grid;gap:5px;width:37px;height:37px;padding:9px;border:1px solid #d5d8d6;border-radius:7px;background:white}.menu-toggle .menu-bar{display:block;height:2px;background:var(--ink);transition:transform .2s}.menu-toggle[aria-expanded="true"] .menu-bar.top{transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded="true"] .menu-bar.bottom{transform:translateY(-3.5px) rotate(-45deg)}.site-nav{display:none;position:absolute;z-index:10;top:70px;right:0;flex-direction:column;align-items:stretch;min-width:235px;padding:16px;background:white;border:1px solid #d8dcda;border-radius:10px;box-shadow:var(--shadow)}.site-nav.open{display:flex}.site-nav .nav-cta{text-align:center}.hero{grid-template-columns:1fr;padding-top:65px;gap:18px}.hero-visual{min-height:360px;max-width:520px;width:100%;margin:auto}.problem-grid,.process-list{grid-template-columns:1fr}.process-header,.amendment-section,.pricing-card,.request-grid{grid-template-columns:1fr;gap:35px}.process-list li,.process-list li:not(:first-child){padding:22px 0;border-right:0;border-bottom:1px solid #cfd4d4}.process-list h3{margin-top:15px}.matrix-heading{align-items:start;flex-direction:column}.matrix-actions{text-align:left}.pricing-card{padding:35px}.pricing-side{padding:25px 0 0;border-left:0;border-top:1px solid rgba(255,255,255,.35)}.amendment-section{padding:90px 0}.site-footer{flex-wrap:wrap}.request-grid{gap:45px}}
@media (max-width:560px){.section-shell,.site-header{width:min(100% - 32px,1140px)}.site-header{min-height:68px}.hero{padding:58px 0 52px}.hero-summary{font-size:17px}.hero-proof{display:block}.hero-proof li{margin:5px 0}.input-row{flex-direction:column}.input-row button{width:100%}.matrix-card{right:20px;top:28px}.amendment-card{right:0;bottom:15px}.orbit-one{right:0}.orbit-two{right:-70px}.proof-strip{display:block;text-align:center}.proof-strip p{margin-bottom:10px}.proof-items{justify-content:center;gap:10px;font-size:12px}.problem-section,.process-section{padding:75px 0}.matrix-section{padding:75px 0}.matrix-controls{overflow-x:auto}.matrix-controls .filter-button{white-space:nowrap}.matrix-footer{flex-wrap:wrap;gap:9px 13px}.matrix-footer strong{margin-left:0;width:100%}.pricing-section,.faq-section{padding-bottom:75px}.form-grid{grid-template-columns:1fr}.site-footer{padding:22px 0}.site-footer p{order:3;width:100%}.success-card,.privacy-card{margin:9vh auto;padding:30px 23px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.menu-toggle span:not(.sr-only),.faq-list summary span{transition:none}}
.row-check { display:inline-grid; place-items:center; }
.hero-visual { overflow:hidden; }
.scene-stage { min-height:520px; overflow:hidden; border:1px solid rgba(99,148,190,.26); border-radius:22px; background:radial-gradient(circle at 50% 32%,rgba(112,172,226,.2),transparent 33%),radial-gradient(circle at 70% 78%,rgba(222,81,43,.26),transparent 37%),linear-gradient(145deg,#0e2744 0%,#102d4a 50%,#0b1d34 100%); box-shadow:inset 0 1px rgba(255,255,255,.13),0 28px 70px rgba(10,30,53,.2); isolation:isolate; touch-action:pan-y; }.scene-stage::before,.scene-stage::after { content:""; position:absolute; z-index:0; pointer-events:none; border-radius:50%; }.scene-stage::before { width:410px; height:410px; right:-142px; top:-148px; border:1px solid rgba(177,221,255,.18); box-shadow:0 0 0 42px rgba(177,221,255,.035),0 0 0 84px rgba(177,221,255,.025); }.scene-stage::after { width:148px; height:148px; left:-67px; bottom:-62px; background:radial-gradient(circle,rgba(255,162,108,.25),transparent 70%); filter:blur(8px); }.scene-stage .hero-orbit,.scene-stage .matrix-card,.scene-stage .amendment-card,.scene-stage .visual-glow { display:none; }#webgl-stage { position:absolute; inset:0; z-index:1; overflow:hidden; }.scene-canvas { display:block; width:100%; height:100%; cursor:grab; }.scene-canvas:active { cursor:grabbing; }.scene-fallback { position:absolute; inset:0; z-index:1; perspective:900px; transition:opacity .45s ease,transform .45s ease; }.scene-ready .scene-fallback { opacity:0; transform:scale(.98); pointer-events:none; }.fallback-card { position:absolute; width:67%; min-height:188px; padding:23px; border:1px solid rgba(255,255,255,.5); border-radius:13px; background:linear-gradient(145deg,#fafdff,#dceafa); color:var(--ink); box-shadow:0 28px 55px rgba(2,13,27,.38); transform-style:preserve-3d; }.fallback-card span,.fallback-card small { display:block; color:#557086; font-size:10px; letter-spacing:.13em; font-weight:900; }.fallback-card strong { display:block; margin:30px 0 12px; font-family:Georgia,"Times New Roman",serif; font-size:29px; letter-spacing:-.05em; }.fallback-back { top:18%; right:10%; background:linear-gradient(145deg,#fff6f0,#ffe2d3); transform:rotateY(-22deg) rotateX(13deg) rotateZ(7deg); }.fallback-front { top:31%; left:11%; transform:rotateY(18deg) rotateX(9deg) rotateZ(-6deg); }.scene-chrome { position:absolute; z-index:2; top:22px; left:23px; right:23px; display:flex; align-items:flex-start; justify-content:space-between; gap:16px; pointer-events:none; }.scene-kicker { display:flex; align-items:center; gap:8px; margin:0; color:#dceeff; font-size:10px; letter-spacing:.12em; font-weight:850; }.pulse-dot { width:7px; height:7px; border-radius:50%; background:#7ee0ab; box-shadow:0 0 0 0 rgba(126,224,171,.7); animation:signal-pulse 1.8s infinite; }.scene-readout { max-width:190px; padding:9px 11px; border:1px solid rgba(220,238,255,.23); border-radius:8px; background:rgba(7,27,48,.48); color:white; box-shadow:0 10px 28px rgba(0,0,0,.13); backdrop-filter:blur(12px); }.scene-readout span,.scene-readout strong,.scene-readout small { display:block; }.readout-index { margin-bottom:2px; color:#93bde7; font-size:9px; letter-spacing:.11em; font-weight:900; }.scene-readout strong { font-size:12px; }.scene-readout small { margin-top:2px; color:#c0d2e1; font-size:10px; line-height:1.35; }.scene-controls { position:absolute; z-index:3; bottom:23px; left:23px; display:flex; align-items:center; gap:7px; }.scene-control { min-width:44px; min-height:44px; padding:7px 10px; border:1px solid rgba(220,238,255,.25); border-radius:7px; background:rgba(7,27,48,.57); color:#d9eaf8; font-size:10px; font-weight:850; transition:background .2s,border-color .2s,color .2s,transform .2s; backdrop-filter:blur(10px); }.scene-control:hover,.scene-control:focus-visible,.scene-control.active { border-color:#ffba9b; background:#f6c1a5; color:#5d1a0a; }.scene-control:focus-visible { outline:2px solid white; outline-offset:2px; }.icon-control { width:44px; padding-inline:0; font-size:12px; }.scene-caption { position:absolute; z-index:2; right:23px; bottom:25px; margin:0; color:#bed3e7; font-size:10px; font-weight:750; pointer-events:none; }.scene-caption span { color:#ffad87; font-size:14px; vertical-align:-1px; }@keyframes signal-pulse { 70% { box-shadow:0 0 0 7px rgba(126,224,171,0); } 100% { box-shadow:0 0 0 0 rgba(126,224,171,0); } }@media (max-width:850px){.scene-stage{min-height:440px;max-width:590px}.scene-chrome{top:17px;left:17px;right:17px}.scene-controls{bottom:17px;left:17px}.scene-caption{right:17px;bottom:20px}.fallback-card{min-height:162px}.fallback-card strong{font-size:24px}}@media (max-width:560px){.scene-stage{min-height:340px;border-radius:16px}.scene-kicker{font-size:8px}.scene-readout{max-width:155px;padding:8px 9px}.scene-readout small{font-size:9px}.scene-controls{gap:5px}.scene-control{padding:7px 8px;font-size:9px}.icon-control{width:44px}.scene-caption{display:none}.fallback-card{width:76%;padding:17px}.fallback-card strong{margin:22px 0 9px;font-size:22px}}
.hero-sample-link { display:inline-flex; align-items:center; gap:7px; margin:13px 4px 0; color:#29475f; font-size:12px; font-weight:850; text-decoration:none; }.hero-sample-link span { color:var(--signal-dark); font-size:15px; }.hero-sample-link:hover { color:var(--signal-dark); text-decoration:underline; }
.scene-controls { max-width:calc(100% - 46px); }@media (max-width:359px){.scene-controls{right:17px;display:grid;grid-template-columns:1fr 1fr}.scene-control{width:auto}.icon-control{justify-self:end}}@media (prefers-reduced-motion:reduce){.pulse-dot{animation:none}.scene-fallback{transition:none}}