/* The product showcase extends the existing warm, compact identity. */
.feature-tabs{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);background:var(--panel)}
.feature-tabs button{display:flex;align-items:center;gap:12px;text-align:left;min-height:48px;padding:12px 18px;border:0;border-right:1px solid var(--line);background:transparent;font-size:13px;font-weight:600}
.feature-tabs button:last-child{border-right:0}.feature-tabs .mono{color:var(--muted);font-size:10px}
.feature-tabs button[aria-selected=true]{background:var(--surface);box-shadow:inset 0 3px var(--orange)}
.feature-tabs button[aria-selected=true] .mono{color:var(--orange)}
.feature-panel{display:grid;grid-template-columns:.7fr 1.3fr;align-items:center;gap:34px;border:1px solid var(--line);border-top:0;background:var(--surface);padding:26px}
.feature-panel[hidden]{display:none}.feature-panel:focus-visible{outline:2px solid var(--orange);outline-offset:4px}
.feature-copy .eyebrow{font-size:9px;margin-bottom:12px}.feature-copy h3{font-size:28px;line-height:1.2;letter-spacing:-1px;margin-bottom:15px}
.feature-copy>p:not(.eyebrow){font-size:13px;max-width:320px}.feature-points{list-style:none;margin:20px 0;padding:0;max-width:320px}
.feature-points li{display:flex;gap:9px;padding:8px 0;border-top:1px solid var(--line);font-size:11px}
.feature-copy>.text-link{font-size:12px}.feature-visual{min-width:0;margin:0}.feature-visual .zoomable{display:block;position:relative;border:1px solid var(--line);background:#202125}.feature-visual img{width:100%}
/* Hide the white capture edge while preserving the original Mac app screenshot. */
.feature-visual .app-window-preview{border:0;background:transparent}
.app-window-preview img,#expanded-image.app-window-preview{clip-path:inset(1px round 2% / 3.2%)}
#expanded-image.app-window-preview{width:auto;max-width:100%;height:auto;margin-inline:auto}
.feature-visual figcaption{font-size:10px;line-height:1.7;color:var(--muted);margin-top:10px}.media-kind{display:inline-block;color:var(--ink);font:9px var(--mono);text-transform:uppercase;margin-right:8px}
.diagram-stage{border:1px solid var(--line);background:#222427}.diagram-stage svg{display:block;width:100%;height:auto;color:#bcbfbd;font-family:var(--mono);font-size:11px}
.diagram-controls{display:flex;align-items:center;gap:12px;min-height:45px;padding:9px 12px;border:1px solid var(--line);border-top:0;background:var(--panel);font-size:11px}
.diagram-controls input{width:140px;min-width:60px;flex:1;max-width:240px;accent-color:var(--orange);height:22px;cursor:pointer}.diagram-controls output{min-width:4ch;font:10px var(--mono)}
.diagram-controls input:focus-visible{outline:2px solid var(--orange);outline-offset:2px}.roll-controls{justify-content:space-between;gap:8px}.roll-controls button{background:var(--surface);border:1px solid var(--line);padding:6px 10px;font-size:11px;white-space:nowrap}.roll-controls button[aria-pressed=true]{border-color:var(--orange);color:var(--orange)}
.showcase-note{font-size:11px;margin-top:13px}.showcase-note a{text-decoration:underline}.roll-sheet{transition:transform .35s ease}.roll-join{transition:opacity .2s ease}.roll-separated .roll-sheet-0{transform:translateX(-14px)}.roll-separated .roll-sheet-2{transform:translateX(14px)}.roll-separated .roll-join{opacity:0}
.cloud-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:72px;padding-block:40px;border-block:1px solid var(--line);margin-bottom:48px}
.cloud-intro .eyebrow{font-size:10px;margin-bottom:17px}.cloud-intro h2{font-size:36px;line-height:1.14;margin-bottom:20px}.cloud-intro>p:not(.eyebrow){font-size:14px;max-width:360px}.cloud-intro .actions{gap:16px}.cloud-intro .button{font-size:12px;gap:10px;padding:12px 15px}.cloud-intro .text-link{font-size:12px}
.cloud-status{display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid var(--line);padding-bottom:12px}.cloud-status .mono,.cloud-roadmap .mono{font-size:10px;color:var(--muted)}.availability{font-size:10px;color:var(--orange);border:1px solid var(--line);padding:3px 7px}
.cloud-steps{list-style:none;padding:0;margin:0}.cloud-steps li{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}.step-number{font:10px var(--mono);color:var(--orange);padding-top:3px}.cloud-steps h3{font-size:14px;margin-bottom:5px}.cloud-steps p{font-size:12px;max-width:490px}
.cloud-roadmap{padding:14px 0;display:grid;grid-template-columns:90px 1fr;gap:12px;align-items:start}.cloud-roadmap .mono{padding-top:3px}.cloud-roadmap p{font-size:12px}.cloud-limits{font-size:10px;margin:0 0 12px}.cloud-detail>.text-link{font-size:11px}
@media(max-width:1100px){.feature-panel{gap:24px;padding:20px;grid-template-columns:.8fr 1.2fr}.feature-copy h3{font-size:25px}.feature-copy>p:not(.eyebrow){font-size:12px}.feature-points{margin:16px 0}.feature-points li{font-size:10px}.cloud-section{gap:36px}}
@media(max-width:760px){.feature-tabs button{font-size:11px;padding:12px 9px;gap:7px}.feature-tabs .mono{font-size:9px}.feature-panel{grid-template-columns:1fr;padding:20px 16px;gap:22px}.feature-copy h3{font-size:26px}.feature-copy h3 br{display:none}.feature-copy>p:not(.eyebrow){max-width:100%;font-size:13px}.feature-points{max-width:100%;margin:15px 0}.feature-points li{font-size:11px;padding:7px 0}.feature-visual figcaption{font-size:10px}.diagram-controls{font-size:10px;gap:8px;padding:8px}.roll-controls{flex-wrap:wrap}.cloud-section{grid-template-columns:1fr;gap:28px;padding-block:30px;margin-bottom:32px}.cloud-intro h2{font-size:30px}.cloud-intro h2 br:nth-of-type(1){display:none}.cloud-intro>p:not(.eyebrow){max-width:100%;font-size:13px}.cloud-intro .eyebrow{font-size:9px}.cloud-roadmap{grid-template-columns:75px 1fr;gap:10px}}
@media(prefers-reduced-motion:reduce){.roll-sheet,.roll-join{transition:none}}