/* Shared navigation and responsive diagrams across the marketing site. */
.nav{gap:24px}
.nav-links{gap:22px}
.nav-links a{white-space:nowrap}
.nav-links a[aria-current="page"]{color:var(--red)}
a:focus-visible,button:focus-visible{outline:2px solid var(--red);outline-offset:5px}
@media(max-width:1100px){
  .nav-links{display:none;position:absolute;top:80px;left:0;right:0;background:var(--paper);padding:24px 32px;flex-direction:column;align-items:flex-start;gap:20px;border-bottom:1px solid var(--line);max-height:calc(100dvh - 80px);overflow-y:auto}
  .nav-links.open{display:flex}
  .nav-cta{margin-left:auto}
  .menu-toggle{display:block}
}
@media(max-width:760px){.nav-links{top:68px;padding:24px 18px;max-height:calc(100dvh - 68px)}}
.flow-figure{margin:24px 0;background:#fff;border:1px solid var(--line);padding:26px}
.flow-figure figcaption{font-size:12px;line-height:1.6;color:#535e68;margin-top:20px}
.flow-label{font:600 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--red)}
.flow-track{display:flex;align-items:stretch;gap:12px;margin-top:18px}
.flow-node{flex:1;min-width:0;padding:18px 14px;background:var(--paper);border:1px solid var(--line)}
.flow-node strong,.flow-node small{display:block}
.flow-node strong{color:var(--ink);font:600 17px var(--display)}
.flow-node small{font-size:12px;line-height:1.6;margin-top:8px;color:#535e68}
.flow-node.accent{background:var(--night);border-color:var(--night)}
.flow-node.accent strong{color:#fff}.flow-node.accent small{color:#c5d0da}
.flow-arrow{align-self:center;color:var(--red);font-size:22px}
.flow-outcomes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.flow-outcomes .flow-node:first-child{border-top:3px solid var(--green)}
.flow-outcomes .flow-node:last-child{border-top:3px solid var(--red)}
.deployment-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0}
.deployment-card{background:#fff;border:1px solid var(--line);padding:24px}
.prose .deployment-card h3{font-size:26px;margin:12px 0}
.deployment-card p{font-size:14px}
.deployment-path{display:flex;flex-direction:column;gap:8px;margin:20px 0;text-align:center;font-size:13px}
.deployment-path span{padding:12px;background:var(--paper);border:1px solid var(--line)}
.deployment-path b{color:var(--red);line-height:1}
.deployment-path .host{background:var(--night);color:white;padding:18px 10px}
.deployment-card .deployment-mode{border-top:1px solid var(--line);padding-top:16px;margin:0;font-size:13px}
.prose ol.visual-steps{list-style:none;counter-reset:step;display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0;padding:0}
.visual-steps li{counter-increment:step;background:#fff;border:1px solid var(--line);padding:22px;margin:0}
.visual-steps li:before{content:"0" counter(step);display:block;color:var(--red);font:600 12px var(--mono);margin-bottom:14px}
.visual-steps strong{display:block;margin-bottom:8px}
.visual-steps p{font-size:14px;margin:0}
@media(max-width:600px){
  .deployment-grid,.prose ol.visual-steps{grid-template-columns:1fr}
  .flow-track{flex-direction:column}.flow-arrow{transform:rotate(90deg)}
  .flow-outcomes{grid-template-columns:1fr}.flow-figure{padding:20px}
}
/* Keep long commands inside their code panels and footer groups inside the viewport. */
.prose{min-width:0;overflow-wrap:anywhere}
.evidence-source{flex-wrap:wrap}
.footer-links{flex-wrap:wrap}
@media(max-width:980px){.layout{grid-template-columns:minmax(0,1fr)}}
.privacy-inline{padding:0;border:0;background:none;color:inherit;font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cookie-banner{position:fixed;z-index:60;bottom:18px;left:18px;right:18px;margin:auto;max-width:1244px;padding:24px;background:var(--white);border:1px solid var(--line);box-shadow:0 8px 40px #10172230;display:grid;grid-template-columns:1fr auto;align-items:center;gap:28px;color:var(--ink)}
.cookie-banner[hidden]{display:none}
.cookie-banner h2,.cookie-dialog h2{font:600 23px var(--display);margin:0 0 10px;letter-spacing:-.03em}
.cookie-banner p,.cookie-dialog p{font:400 14px/1.6 var(--font);margin:0;max-width:720px;color:#46515b}
.cookie-actions{display:flex;gap:10px;flex-wrap:wrap}
.cookie-actions button{border:1px solid var(--ink);padding:12px 16px;background:var(--white);color:var(--ink);font:600 13px var(--font);cursor:pointer}
.cookie-actions button:hover{background:var(--paper)}
.cookie-actions [data-accept],.cookie-actions [data-reject]{background:var(--ink);color:var(--white)}
.cookie-actions [data-accept]:hover,.cookie-actions [data-reject]:hover{background:#354251}
.cookie-dialog{max-width:600px;width:calc(100% - 36px);max-height:85dvh;overflow:auto;padding:30px;border:1px solid var(--line);color:var(--ink);background:var(--white)}
.cookie-dialog::backdrop{background:#10172290}
.cookie-category{padding:20px 0;border-bottom:1px solid var(--line);margin-bottom:16px;font-size:14px}
.cookie-category p{margin-top:8px}
.cookie-category input{width:18px;height:18px;vertical-align:middle;accent-color:var(--ink)}
.cookie-dialog .cookie-actions{margin-top:22px}
.privacy-status:not(:empty){position:fixed;z-index:80;bottom:18px;left:18px;right:18px;max-width:600px;margin:auto;padding:16px 20px;background:var(--night);color:white;font:400 14px/1.5 var(--font)}
@media(max-width:980px){.cookie-banner{grid-template-columns:1fr;gap:18px}}
@media(max-width:440px){.cookie-banner{bottom:10px;left:10px;right:10px;padding:18px;max-height:75dvh;overflow:auto}.cookie-actions{gap:8px}.cookie-actions button{flex:1}.cookie-dialog{padding:22px}}