/* Native, accessible controls for the static production homepage. */
:root{--font-geist-sans:"Geist";--font-geist-mono:"Geist Mono"}
[hidden]{display:none!important}
.homepage{line-height:1.5;overflow-x:clip;overflow-y:visible}
.enterprise-desktop{display:flex;align-items:center}
.enterprise-desktop [data-slot=navigation-menu-list]{display:flex;align-items:center}
.enterprise-desktop [data-slot=navigation-menu-trigger]{display:flex;align-items:center;gap:5px;cursor:pointer;border-radius:8px;list-style:none}
.enterprise-desktop [data-slot=navigation-menu-trigger]>span[aria-hidden]{width:5px;height:5px;margin:-3px 1px 0 2px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;font-size:0;line-height:0;transform:rotate(45deg);transform-origin:center}
summary::-webkit-details-marker{display:none}
.enterprise-desktop details:not([open])>.enterprise-dropdown{display:none}
.enterprise-dropdown{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);z-index:60}
.enterprise-desktop details[open]>summary{color:#2455ed;background:#eef4ff}
.enterprise-desktop [data-slot=navigation-menu-item]{position:static}
.enterprise-menu-links a{border-radius:8px}
.enterprise-mobile summary{display:flex;justify-content:space-between;cursor:pointer;list-style:none}
.enterprise-mobile details{border-bottom:1px solid #e1e9f7}
.enterprise-mobile details[open] .disclosure-icon{transform:rotate(45deg)}
[data-slot=tabs-list]{display:inline-flex;align-items:center;border-radius:8px;gap:4px}
[data-slot=tabs-trigger]{display:inline-flex;align-items:center;justify-content:center;border-radius:6px;color:#526175;white-space:nowrap;line-height:1.5}
[data-slot=tabs-trigger][data-active]{background:white;box-shadow:0 1px 4px #1c3a7910}
.faq-list summary{display:flex;list-style:none;cursor:pointer;gap:8px;font-weight:500}
.faq-list .disclosure-icon{margin-left:auto;font-size:20px;color:#6282b2;transition:transform .2s}
.faq-list details[open] .disclosure-icon{transform:rotate(45deg)}
.run-cost{position:absolute;left:-47px;top:50%;translate:0 -50%;z-index:3;display:inline-flex;align-items:center;justify-content:center;min-width:43px;padding:4px 7px;border:1px solid #cfe0f8;border-radius:999px;background:#fff;color:#2d6bcc;font:600 10px/1 var(--font-geist-mono),monospace;box-shadow:0 5px 14px #376fc921;opacity:0;animation:run-cost-arrive 3.5s ease-in-out infinite}
.production-lane:nth-child(2) .run-cost{animation-delay:-1.15s}
.production-lane:nth-child(3) .run-cost{animation-delay:-2.3s}
@keyframes run-cost-arrive{0%,48%{opacity:0;translate:-17px -50%;scale:.9}62%,79%{opacity:1;translate:0 -50%;scale:1}91%,100%{opacity:0;translate:7px -50%;scale:.94}}
.connected .enterprise-header{margin-top:15px}
.enterprise-menu-intro h2{font-size:25px}
@media(max-width:760px){.role-tabs{max-width:100%;overflow-x:auto}.role-tabs [data-slot=tabs-trigger]{padding-inline:13px}.connected-hero>.wrap{padding-inline:5%}.run-cost{left:-39px;min-width:37px;padding:4px 5px;font-size:9px}}
@media(max-width:360px){.production-lane{grid-template-columns:85px minmax(40px,1fr) 100px}.spend-scene{padding-inline:10px}.direct-route{min-width:40px;margin-inline:7px}.workflow-label{font-size:10px}.spend-provider b{font-size:10px}}
html:not(.js) [role=tabpanel][hidden]{display:block!important}
html:not(.js) [role=tablist]{display:none}
@media(max-width:1020px){html:not(.js) .enterprise-header{flex-wrap:wrap;height:auto;padding-block:15px}html:not(.js) .enterprise-mobile[hidden]{display:block!important;position:static;width:100%;max-height:none;box-shadow:none}html:not(.js) .enterprise-menu-toggle{display:none}}
@media(max-width:360px){.connected-hero h1{font-size:44px}}
/* Reserve the tallest dashboard screen so automatic changes never move the page. */
.js .dash-tabs{display:grid;grid-template-columns:minmax(0,1fr)}
.js .dash-tabs>[role=tablist]{grid-area:1/1;justify-self:start}
.js .dash-tabs>[role=tabpanel]{grid-area:2/1}
.js .dash-tabs>[role=tabpanel][hidden]{display:block!important;visibility:hidden;pointer-events:none}
.scene-caption-mobile,.mobile-signal-bridge,.mobile-outcome-label{display:none}

/* Give the Alongside story its own readable composition on phones. */
@keyframes run-cost-arrive-mobile{0%,45%{opacity:0;translate:-9px 0;scale:.92}60%,80%{opacity:1;translate:0 0;scale:1}92%,100%{opacity:0;translate:5px 0;scale:.96}}
@media(max-width:520px){
  .connected-hero h1{font-size:50px}
  .spend-scene{padding:18px 12px 16px}
  .alongside-grid{gap:0;margin-top:18px}
  .production-lanes{gap:10px}
  .production-lane{grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr);gap:8px;padding:10px;border:1px solid #e0e9f7;border-radius:13px;background:linear-gradient(135deg,#fff,#f7faff);box-shadow:0 7px 20px #315b9310}
  .workflow-label{gap:7px;font-size:12px;line-height:1.35}
  .workflow-label>svg{width:14px;height:14px}
  .direct-route{min-width:0;margin:0;padding:0}
  .direct-route>span{display:none}
  .request-track{margin:0}
  .response-track{display:none}
  .spend-provider{min-height:46px;padding:8px;gap:7px;box-shadow:none}
  .spend-provider .provider-symbol{display:grid;width:27px;height:27px;font-size:19px;border-radius:7px}
  .spend-provider b{font-size:11px;line-height:1.3}
  .billing-port{right:-5px}
  .run-cost{left:auto;right:-5px;top:-9px;translate:0 0;min-width:36px;padding:4px 5px;font-size:8px;animation-name:run-cost-arrive-mobile}
  .side-spend-bridge{height:61px;width:1px;margin:0 auto;border-left:1px dashed #9cbcf0}
  .side-spend-bridge>span:first-child{top:13px;left:50%;translate:-50% 0;transform:none;padding:3px 7px;border:1px solid #dce8fa;border-radius:999px;background:#f8fbff;font-size:9px;white-space:nowrap}
  .bridge-lock{left:-12px;top:38px}
  .alongside-camaze{grid-template-columns:92px minmax(0,1fr);padding:17px 14px;gap:10px 12px;border-color:#dce8fa;box-shadow:0 12px 35px #3f70b51a,inset 0 0 0 5px #ffffff73}
  .alongside-camaze .spend-brand{grid-row:1/3}
  .alongside-camaze .spend-brand-mark{font-size:44px}
  .alongside-camaze .spend-brand-mark>span{font-size:33px}
  .alongside-camaze .spend-brand>b{font-size:21px}
  .alongside-camaze>.readonly-tag{justify-self:stretch;justify-content:center}
  .alongside-camaze>.spend-outcomes{gap:6px}
  .alongside-camaze>p{padding-top:8px;border-top:1px solid #e7eef9}
  .alongside-camaze>p>br{display:block}
  .spend-halo{inset:-7px;border-radius:24px}
  .scene-bottom{padding-inline:4px}
  .no-proxy-proof{margin-top:17px}
}
@media(max-width:360px){
  .connected-hero h1{font-size:43px}
  .production-lane{grid-template-columns:minmax(0,1fr) 26px minmax(0,1.12fr);gap:6px;padding:9px 8px}
  .workflow-label{font-size:10px;gap:5px}
  .workflow-label>svg{width:12px;height:12px}
  .spend-provider{padding:8px 7px}
  .spend-provider .provider-symbol{display:none}
  .spend-provider b{font-size:10px}
  .alongside-camaze{grid-template-columns:78px minmax(0,1fr);padding-inline:11px}
  .alongside-camaze .spend-brand-mark{font-size:39px}
  .alongside-camaze .spend-brand-mark>span{font-size:29px}
  .alongside-camaze .spend-brand>b{font-size:19px}
  .readonly-tag{white-space:normal;text-align:center}
}

/* Selected phone composition: signal convergence above a unified Camaze strip. */
@media(max-width:520px){
  .scene-caption-desktop{display:none}
  .scene-caption-mobile{display:inline}
  .alongside-grid{display:block;margin-top:18px;min-height:0}
  .production-lanes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .production-lane{display:block;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
  .workflow-label,.direct-route,.billing-port{display:none}
  .spend-provider{display:flex;flex-direction:column;justify-content:center;gap:6px;min-height:94px;padding:13px 4px 10px;text-align:center;border-color:#d9e6f9;border-radius:14px;box-shadow:0 7px 20px #315b9310}
  .spend-provider .provider-symbol{display:grid;width:31px;height:31px;font-size:21px}
  .spend-provider b{font-size:10px;white-space:nowrap}
  .desktop-provider-suffix{display:none}
  .run-cost{left:50%;right:auto;top:-11px;translate:-50% 0;min-width:48px;padding:5px 6px;font-size:9px;animation-name:run-cost-arrive-mobile}
  @keyframes run-cost-arrive-mobile{0%,43%{opacity:0;translate:-50% -5px;scale:.92}58%,81%{opacity:1;translate:-50% 0;scale:1}93%,100%{opacity:0;translate:-50% 5px;scale:.96}}
  .mobile-signal-bridge{position:relative;display:block;height:82px;margin-inline:4px}
  .mobile-signal-bridge svg{display:block;width:100%;height:100%;overflow:visible}
  .mobile-signal-paths,.mobile-signal-particles{fill:none;stroke-linecap:round}
  .mobile-signal-paths{stroke:#a9c3ee;stroke-width:1.15;stroke-dasharray:4 6}
  .mobile-signal-particles{stroke:#4f83ed;stroke-width:3;stroke-dasharray:4 74}
  .mobile-signal-particles path{animation:mobile-signal-flow 4.4s linear infinite}
  .mobile-signal-particles path:nth-child(2){animation-delay:-1.45s}
  .mobile-signal-particles path:nth-child(3){animation-delay:-2.9s}
  .mobile-signal-bridge>span{position:absolute;left:50%;bottom:9px;translate:-50% 0;padding:4px 8px;border:1px solid #dce8fa;border-radius:999px;background:#f8fbff;color:#6e91c7;font:500 8px/1 var(--font-geist-mono),monospace;white-space:nowrap}
  @keyframes mobile-signal-flow{to{stroke-dashoffset:-234}}
  .side-spend-bridge{display:none}
  .alongside-camaze{display:grid;grid-template-columns:auto minmax(0,1fr);width:100%;margin:0;padding:15px 14px 13px;gap:11px 13px;border-color:#dce8fa;border-radius:19px;box-shadow:0 12px 35px #3f70b51a,inset 0 0 0 5px #ffffff73}
  .alongside-camaze .spend-brand{grid-row:auto;flex-direction:row;gap:5px;justify-self:start;animation:spend-float 8s ease-in-out infinite}
  .alongside-camaze .spend-brand-mark{font-size:31px;letter-spacing:-5px}
  .alongside-camaze .spend-brand-mark>span{font-size:24px}
  .alongside-camaze .spend-brand>b{font-size:17px;letter-spacing:-1px}
  .alongside-camaze>.readonly-tag{align-self:center;justify-self:stretch;justify-content:center;margin:0;font-size:9px}
  .alongside-camaze>.spend-outcomes{grid-column:1/-1;display:flex;justify-content:space-around;gap:5px;margin:0;padding-top:11px;border-top:1px solid #e3ecf8}
  .alongside-camaze>.spend-outcomes>span{font-size:9px;gap:3px;white-space:nowrap}
  .alongside-camaze>.spend-outcomes svg{width:10px;height:10px}
  .desktop-outcome-label{display:none}
  .mobile-outcome-label{display:inline}
  .alongside-camaze>p,.spend-halo{display:none}
  .scene-bottom{flex-direction:row;justify-content:space-between;align-items:center;gap:12px;margin-top:15px;padding:12px 0 0;font-size:9px}
  .scene-bottom>span{max-width:47%}
}
