/* New content uses the original Claude colors, typefaces and materials. */
.product-demo{position:relative;width:100%;aspect-ratio:1450/990;overflow:hidden;background:var(--bg)}
.product-demo iframe{position:absolute;top:0;left:0;width:1450px;height:990px;border:0;transform-origin:top left}
.demo-shortcuts{position:relative;z-index:3;display:flex;align-items:center;gap:12px 18px;flex-wrap:wrap;margin-top:16px;font-size:12px}
.hero-visual .floating-chip{position:relative;left:auto;bottom:auto;margin-top:18px;max-width:max-content}
.hero-visual .visual-caption{position:static;margin-top:16px;text-align:left}
.hero-visual{padding-bottom:34px}
.demo-shortcuts .text-link{font:inherit;padding:6px 0;background:none;border:0;color:var(--muted);cursor:pointer}
.demo-shortcuts .text-link:hover{color:var(--gold)}
#demo-dialog{width:min(1740px,96vw);max-width:96vw;height:92vh;max-height:92vh;margin:auto;padding:0;background:var(--bg);color:var(--text);border:1px solid var(--line-2);border-radius:20px;overflow:hidden}
#demo-dialog::backdrop{background:rgba(5,5,7,.88)}
.demo-dialog-bar{height:60px;padding:10px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);font:11px var(--f-mono);color:var(--muted)}
#demo-expanded{height:calc(100% - 60px)}
#demo-expanded iframe{width:100%;height:100%;border:0}
.workflow-example{display:grid;gap:12px;padding:24px 0}
.workflow-example>div{padding:18px;border:1px solid var(--line-2);border-radius:14px;background:var(--surface)}
.workflow-example span{font:10px var(--f-mono);color:var(--gold);letter-spacing:.08em}
.workflow-example b{display:block;margin:8px 0;font-size:17px}
.workflow-example small{color:var(--muted);line-height:1.6}
.workflow-example>i{color:var(--cyan);font-style:normal;text-align:center}
.feature p{overflow-wrap:break-word}
.demo-shortcuts button:focus-visible,#demo-dialog button:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}
@media(max-width:600px){.demo-dialog-bar{padding:8px 12px;font-size:9px}#demo-dialog{width:98vw;max-width:98vw;border-radius:12px}.workflow-example b{font-size:15px}}

.protection-web{padding:90px 0}.protection-web .feature:last-child{grid-column:auto;display:flex}.protection-web .feature p{line-height:1.7}.protection-web .section-heading .eyebrow{width:100%}
