/* Presentation update 2026-10-22: two captured glimpses (app and office
   portal), audiences, now/next, the facts strip and the stored Ask for Demo
   form. The original layers are reused through data-scene; the added ones
   appear through data-view. */
.screen-glimpse,.screen-audiences,.screen-roadmap{opacity:0}
.screen-glimpse{position:absolute;inset:0;overflow:hidden;background:#f7f8fa}
.screen-glimpse img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;
  -webkit-mask-image:linear-gradient(#000 72%,transparent);mask-image:linear-gradient(#000 72%,transparent)}
.glimpse-portal{background:#fff;display:flex;flex-direction:column}
.glimpse-portal img{height:auto;flex:none;-webkit-mask-image:linear-gradient(#000 82%,transparent);mask-image:linear-gradient(#000 82%,transparent)}
.glimpse-note{margin:auto 9% 12%;font-size:9px;color:#6a8190}
.glimpse-tag{position:absolute;right:9px;bottom:9px;font-size:7px;letter-spacing:.12em;padding:5px 9px;border-radius:20px;
  background:#ffffffeb;color:#2f6a88;border:1px solid #d3e1ea}
.glimpse-caption{position:absolute;bottom:-5%;left:15%;right:0;text-align:center;font-size:8px;color:#8295a2;letter-spacing:.025em;opacity:0}
.presentation[data-view="console"] .glimpse-console,.presentation[data-view="portal"] .glimpse-portal,
.presentation[data-view="audiences"] .screen-audiences,.presentation[data-view="roadmap"] .screen-roadmap{opacity:1}
.presentation[data-view="console"] .visual-caption,.presentation[data-view="portal"] .visual-caption{opacity:0}
.presentation[data-view="console"] .glimpse-caption,.presentation[data-view="portal"] .glimpse-caption{opacity:1}
.presentation[data-view="portal"] .world-map{opacity:.4}
.presentation[data-view="portal"] .orbit{opacity:0}
.presentation[data-view="portal"] .handoff{opacity:1}
.presentation[data-view="portal"] .glimpse-caption{bottom:-9%}

.audience-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(6px,1vw,16px);margin-top:clamp(10px,1.8vw,30px)}
.audience-grid>div{padding:clamp(8px,1.4vw,22px) clamp(8px,1.25vw,20px);border:1px solid #d7e4ec;border-radius:8px;background:#fff;box-shadow:3px 4px 0 #e1ebf0;
  opacity:calc(.3 + .7*var(--enter))}
.audience-grid b,.audience-grid span{display:block}
.audience-grid b{font-size:clamp(9px,1.05vw,18px);font-weight:600;color:#1c3d53}
.audience-grid span{font-size:clamp(7px,.78vw,13px);color:#6a8496;margin-top:.5em}

.roadmap-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(7px,1.1vw,18px);margin-top:clamp(10px,2vw,32px)}
.roadmap-cols>div{border-top:2px solid #367da0;padding-top:14px}
.roadmap-cols>div+div{border-top-color:#8fb6cb}
.roadmap-cols>div:last-child{border-top-color:#c9dbe5}
.roadmap-cols b{display:block;font-size:clamp(6px,.7vw,12px);letter-spacing:.14em;color:#367da0;margin-bottom:10px}
.roadmap-cols span{display:block;font-size:clamp(7px,.88vw,16px);line-height:1.35;color:#29475b;padding:.8em 0;border-bottom:1px solid #e3ecf1}
.facts-strip{position:absolute;left:4%;right:0;bottom:2%;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;opacity:0;pointer-events:none}
.facts-strip span{font-size:9px;color:#4d6f84;border:1px solid #d2dfe7;border-radius:30px;padding:8px 12px;background:#fff}
.facts-strip b{color:#204e6a;font-size:11px;margin-right:3px}
.presentation[data-view="roadmap"] .facts-strip{opacity:var(--enter)}

.harbour-actions .privacy-link{font-size:11px;color:#306d90;padding:8px 0;min-height:44px;display:inline-flex;align-items:center}
.overview-notes a{color:#367da0}

.demo-dialog select{display:block;box-sizing:border-box;width:100%;margin-top:7px;border:1px solid #bdcfda;border-radius:7px;padding:10px;
  font:13px Arial;color:#193b53;background:#fff}
.demo-dialog .optional{color:#7a93a3}
.demo-dialog .demo-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.demo-dialog .demo-consent{display:flex;gap:10px;align-items:flex-start;line-height:1.5;color:#40627a}
.demo-dialog .demo-consent input{width:18px;height:18px;flex:none;margin:1px 0 0}
.demo-dialog .demo-consent a{color:#367da0}
.demo-dialog button[type="submit"]:disabled{opacity:.6;cursor:progress}
.demo-dialog #demoStatus[data-kind="ok"]{color:#2c7a5b;font-weight:600}
.demo-dialog #demoStatus[data-kind="error"]{color:#a5462f}

@media(min-width:1600px){
  .glimpse-note{font-size:11px}
}
@media(max-width:900px){
  .audience-grid{gap:8px;margin-top:14px}.audience-grid>div{padding:11px 10px}
  .audience-grid b{font-size:10px}.audience-grid span{font-size:7px;margin-top:4px}
  .roadmap-cols{gap:9px;margin-top:16px}.roadmap-cols b{font-size:7px;margin-bottom:6px}
  .roadmap-cols span{font-size:9px;padding:6px 0}
  .facts-strip{gap:5px}.facts-strip span{font-size:7px;padding:6px 8px}.facts-strip b{font-size:9px}
  .glimpse-tag{font-size:5px;padding:4px 6px;right:6px;bottom:6px}.glimpse-note{font-size:7px}
  .glimpse-caption{font-size:7px}
}
@media(max-width:650px) and (min-height:601px){
  .audience-grid{gap:4px;margin-top:7px}.audience-grid>div{padding:5px 6px;box-shadow:2px 2px 0 #e1ebf0}
  .audience-grid b{font-size:7px}.audience-grid span{font-size:5px}
  .roadmap-cols span{font-size:5.5px;padding:3px 0}.roadmap-cols b{font-size:5px}
  .facts-strip{bottom:0;gap:4px}.facts-strip span{font-size:6px;padding:4px 6px}.facts-strip b{font-size:7px}
  .glimpse-caption{bottom:-4%;font-size:6px}
  .glimpse-tag{font-size:4px}.glimpse-note{font-size:5px}
}
@media(max-height:600px){
  .audience-grid{gap:4px;margin-top:6px}.audience-grid>div{padding:4px 6px;box-shadow:none}
  .audience-grid b{font-size:6px}.audience-grid span{font-size:5px;margin-top:2px}
  .roadmap-cols{margin-top:6px;gap:5px}.roadmap-cols b{font-size:5px;margin-bottom:3px}
  .roadmap-cols span{font-size:5px;padding:2px 0}
  .facts-strip span{font-size:5px;padding:4px 6px}.facts-strip b{font-size:6px}
  .glimpse-tag{font-size:4px;padding:3px 5px}.glimpse-note{font-size:5px}
  .glimpse-caption{font-size:5px;bottom:-3%}
  .presentation[data-view="portal"] .glimpse-caption{display:none}
  .harbour-actions .privacy-link{font-size:8px;min-height:32px}
}
@media(max-width:900px){.harbour-actions .privacy-link{font-size:9px}}
@media(prefers-reduced-motion:reduce){.audience-grid>div{opacity:1}}