/* Underline selectors for video/roles; the hero keeps its original segmented pill. */
:root{--tab-radius:12px;--tab-height:44px;--tab-text:#62718a;--tab-line:#d8e3f2;--tab-active:#eaf3ff;--tab-active-line:#a9c9f3;--tab-active-text:#1768bf;--control-ease:cubic-bezier(.45,0,.2,1)}
.industry-chips{gap:8px;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.industry-chips button{
 display:inline-flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;
 height:var(--tab-height);min-height:var(--tab-height);padding:0 20px;border:1px solid var(--tab-line);border-radius:var(--tab-radius);
 background:#ffffffb8;color:var(--tab-text);font-size:14px;font-weight:600;line-height:20px;white-space:nowrap;box-shadow:none;
 transition:background-color 200ms var(--control-ease),border-color 200ms var(--control-ease),color 200ms var(--control-ease),box-shadow 200ms var(--control-ease);
}
.industry-chips button[aria-selected=true]{background:var(--tab-active);border-color:var(--tab-active-line);color:var(--tab-active-text);box-shadow:inset 0 1px 0 #fff}
.industry-chips button .ri{display:block;width:18px;height:18px;flex:none;color:currentColor}
.industry-chips button:active{background:#deecff;border-color:#8eb7ed}
:is(.film-categories,#ai .ai-roles){gap:8px;padding:0;border:0;border-bottom:1px solid #d5dfed;border-radius:0;background:none;box-shadow:none}
.film-categories{margin-bottom:24px;align-items:stretch}
#ai .ai-roles::before{display:none}
:is(.film-categories,#ai .ai-roles) button{
 display:inline-flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;
 position:relative;height:48px;min-height:48px;padding:0 20px;border:0;border-radius:0;
 background:none;color:var(--tab-text);font-size:15px;font-weight:500;line-height:20px;white-space:nowrap;box-shadow:none;
 transition:color 200ms var(--control-ease);
}
:is(.film-categories,#ai .ai-roles) button::after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:linear-gradient(90deg,#3c8be4,#9385d2);opacity:0;transform:scaleX(.35);transform-origin:center;transition:transform 240ms var(--control-ease),opacity 200ms var(--control-ease)}
:is(.film-categories,#ai .ai-roles) button[aria-selected=true]{background:none;color:var(--tab-active-text);font-weight:600;box-shadow:none}
:is(.film-categories,#ai .ai-roles) button[aria-selected=true]::after{opacity:1;transform:scaleX(1)}
:is(.film-categories,#ai .ai-roles) button .ri{display:block;width:18px;height:18px;flex:none;color:currentColor}
.film-categories .film-companion{width:24px;height:24px;flex:0 0 24px;margin:0}
:is(.film-categories,#ai .ai-roles,.industry-chips) button:focus-visible{outline:2px solid #4285dc;outline-offset:3px}
@media(hover:hover) and (pointer:fine){
 .industry-chips button:hover{background:#f0f6ff;border-color:#b6cdee;color:var(--tab-active-text)}
 .industry-chips button[aria-selected=true]:hover{background:#e1eeff;border-color:#95bbed}
 :is(.film-categories,#ai .ai-roles) button:hover{background:none;color:var(--tab-active-text)}
 :is(.film-categories,#ai .ai-roles) button:not([aria-selected=true]):hover::after{opacity:.3;transform:scaleX(.5)}
}
/* Preserve the selected version and customer-case treatments. */
body .btn:not(:where(#versions *,#cases *)),body .nav-register{transition:background-position 220ms var(--control-ease),background-color 200ms var(--control-ease),color 200ms var(--control-ease),border-color 200ms var(--control-ease),box-shadow 220ms var(--control-ease),transform 200ms var(--control-ease);filter:none}
body .btn:is(.btn-ink,.btn-blue,.btn-light,#aiRoleVideo):not(:where(#versions *,#cases *)),body .nav-register{background:linear-gradient(115deg,#68b7f5 0%,#3b94e8 26%,#256bd5 60%,#205fc6 100%);background-size:175% 100%;background-position:0 50%;background-origin:border-box;background-clip:border-box;background-repeat:no-repeat;border:0;color:#fff;box-shadow:0 5px 14px #347cce1c}
body .btn:is(.btn-ghost,.btn-outline-light):not(#aiRoleVideo):not(:where(#versions *,#cases *)){background:#ffffffcf;border-color:#b6c9e5;color:#315881;box-shadow:0 3px 10px #527dcf0a}
@media(hover:hover) and (pointer:fine){
 body .btn:not(:where(#versions *,#cases *)):hover,body .nav-register:hover{transform:translateY(-2px);filter:none}
 body .btn:is(.btn-ink,.btn-blue,.btn-light,#aiRoleVideo):not(:where(#versions *,#cases *)):hover,body .nav-register:hover{background-image:linear-gradient(115deg,#68b7f5 0%,#3b94e8 26%,#256bd5 60%,#205fc6 100%);background-size:175% 100%;background-position:100% 50%;border-color:transparent;color:#fff;box-shadow:0 8px 20px #347cce2b}
 body .btn:is(.btn-ghost,.btn-outline-light):not(#aiRoleVideo):not(:where(#versions *,#cases *)):hover{background:#eaf3ff;border-color:#8eb7e8;color:#1768bf;box-shadow:0 6px 16px #347cce1c}
}
body .btn:not(:where(#versions *,#cases *)):active,body .nav-register:active{transform:translateY(0) scale(.98)}
body .btn:not(:where(#versions *,#cases *)):focus-visible,body .nav-register:focus-visible{outline:2px solid #4285dc;outline-offset:3px}
/* Keep the emphasis card scrollable, with a quiet blue-gray scrollbar. */
.ai-detail-preview,.ai-detail-preview .ai-ui-table-scroll{scrollbar-width:thin;scrollbar-color:#ccd8eb transparent}
.ai-detail-preview::-webkit-scrollbar,.ai-detail-preview .ai-ui-table-scroll::-webkit-scrollbar{width:4px;height:4px}
.ai-detail-preview::-webkit-scrollbar-track,.ai-detail-preview .ai-ui-table-scroll::-webkit-scrollbar-track{background:transparent}
.ai-detail-preview::-webkit-scrollbar-thumb,.ai-detail-preview .ai-ui-table-scroll::-webkit-scrollbar-thumb{background:#ccd8eb;border-radius:8px}
.ai-detail-preview::-webkit-scrollbar-thumb:hover,.ai-detail-preview .ai-ui-table-scroll::-webkit-scrollbar-thumb:hover{background:#b8c9e2}
.footer .footer-qr{gap:16px;align-items:center;line-height:1.7}
.footer .footer-qr img{display:block;width:128px;height:128px;flex:0 0 128px;max-width:none;border-radius:10px;border:1px solid #d8e3f2;background:#fff}
.footer .footer-qr span{flex:none;font-size:13px}
@media(max-width:767px){
 :is(.film-categories,#ai .ai-roles) button{padding-inline:12px;font-size:14px;gap:6px}
 .industry-chips button{padding-inline:12px;font-size:13px;gap:6px}
 .film-categories{overflow-x:auto;scrollbar-width:thin;scrollbar-color:#d2ddef transparent}
 .film-categories button{flex:none}
 .film-categories .film-companion{width:24px;height:24px;flex-basis:24px}
 #ai .ai-roles{width:100%}
 .industry-chips{padding:3px var(--gutter) 7px}
}
@media(prefers-reduced-motion:reduce){
 :is(.film-categories,#ai .ai-roles,.industry-chips) button,:is(.film-categories,#ai .ai-roles) button::after,body .btn:not(:where(#versions *,#cases *)),body .nav-register{transition:none!important}
 body .btn:not(:where(#versions *,#cases *)):hover,body .nav-register:hover{transform:none}
}

/* Compact home introduction; the full-size presentation stage is unchanged. */
#hero{padding-top:22px}
#hero .hero-heading{width:100%;max-width:100%;margin:0 auto}
#hero .hero-title-row{display:flex;align-items:center;justify-content:center;gap:2px;max-width:100%;margin:0 auto}
#hero h1.scene-headline{flex:0 1 auto;min-width:0;width:max-content;max-width:calc(100% - 82px);margin:0;white-space:normal;overflow-wrap:anywhere}
#hero h1 .scene-title-item{display:none}
#hero h1 .scene-title-item.is-active{display:block}
#hero .hero-title-character{display:block;position:relative;flex:none;width:80px;height:80px;margin-block:-8px;line-height:0;pointer-events:auto}
#hero .hero-companion-trigger>img,#hero .hero-companion-trigger>.companion-live{display:block;width:100%;height:100%;object-fit:contain}
#hero .hero-companion-trigger{position:relative;isolation:isolate}
#hero .hero-companion-trigger::before{content:"";position:absolute;z-index:-1;inset:12%;border-radius:50%;background:radial-gradient(ellipse,#aedcff38 0%,#d7d5ff1a 45%,transparent 72%);pointer-events:none}
#hero .hero-sub.scene-subhead{width:100%;margin-top:9px}
#hero .hero-proof{margin-top:10px}
#hero .proof-label{margin-top:1px}
#hero .proof-note{line-height:18px;margin-top:1px}
#hero .hero-proof+.hero-cta{margin-top:12px}
@media(min-width:1100px){#hero h1.scene-headline{font-size:clamp(44px,3.25vw,54px)}}
@media(min-width:768px) and (max-height:850px){#hero{padding-top:16px}}
@media(max-width:767px){
 #hero{padding-top:24px}
 #hero h1.scene-headline{max-width:100%}
 #hero .hero-title-character{display:none}
 #hero .hero-sub.scene-subhead{margin-top:10px}
 #hero .hero-proof{margin-top:12px}
 #hero .hero-proof+.hero-cta{margin-top:14px}
}

#hero .hero-companion-trigger{display:block;width:100%;height:100%;margin:0;padding:0;border:0;background:none;color:inherit;cursor:pointer;line-height:0}
#hero .hero-companion-trigger:focus-visible{outline:2px solid #2c7cde;outline-offset:3px;border-radius:12px}
#hero .hero-companion-bubble{position:absolute;z-index:4;left:calc(100% + 8px);top:50%;box-sizing:border-box;width:238px;padding:12px 15px;border:1px solid #dce6f7;border-radius:14px;background:#fff;box-shadow:0 8px 26px #3f6fa318;color:#344e72;text-align:left;text-decoration:none;line-height:1.6;opacity:0;visibility:hidden;pointer-events:none;transform:translate(6px,-50%) scale(.96);transform-origin:0 50%;transition:opacity .22s ease,transform .22s ease,visibility .22s}
#hero .hero-companion-bubble::before{content:"";position:absolute;left:-5px;top:calc(50% - 5px);width:9px;height:9px;border-left:1px solid #dce6f7;border-bottom:1px solid #dce6f7;background:#fff;transform:rotate(45deg)}
#hero .hero-companion-bubble.is-visible{opacity:1;visibility:visible;pointer-events:auto;transform:translate(0,-50%) scale(1)}
#hero .hero-bubble-copy{display:block;font-size:13px;font-weight:500;line-height:1.6}
#hero .hero-bubble-cta{display:flex;align-items:center;gap:4px;margin-top:5px;color:#2473d5;font-size:11px;font-weight:600;line-height:1.5}
#hero .hero-bubble-cta .ri{width:12px;height:12px;flex:none}
#hero .hero-companion-bubble:focus-visible{outline:2px solid #2c7cde;outline-offset:3px}
@media(prefers-reduced-motion:reduce){#hero .hero-companion-bubble{transition:none}}

/* Compact copy overlaps the clear area above the full-size presentation. */
#hero .proof-metric b{font-size:32px}
@media(min-width:768px){
 #hero{padding-top:46px}
 #hero .hero-copy{position:relative;z-index:3}
 #hero .hero-scene{margin-top:-40px}
}
@media(min-width:768px) and (max-height:850px){#hero{padding-top:40px}}
@media(min-width:768px) and (max-width:1099px){
 #hero .hero-scene{margin-top:-24px}
}
@media(min-width:768px) and (max-width:1200px){#hero .proof-metric b{font-size:29px}}
@media(max-width:767px){
 #hero{padding-top:36px}
 #hero .hero-scene{margin-top:-12px}
 #hero .proof-metric b{font-size:26px}
}

/* Each core value owns a visible preview; no shared sticky image. */
#values .values-grid{display:block}
#values .values-list{display:grid;gap:56px}
#values .value{display:grid;grid-template-columns:minmax(320px,.92fr) minmax(0,1.7fr);gap:48px;align-items:start;margin:0;padding:56px 0 0;border-top:1px solid var(--line)}
#values .value:first-child{padding-top:0;border-top:0}
#values .value-copy{min-width:0}
#values .value-points{gap:12px}
#values .value-points .value-point>button[data-feature]{min-height:88px;padding:20px 18px;align-items:center;font-size:17px;line-height:1.65}
#values .value-points button span{font-size:14px;padding-top:0}
#values .value h3{margin-top:0}
#values .value>.values-media{position:static;order:0;align-self:start;min-width:0;margin:0;padding:0;background:none}
@media(min-width:768px) and (max-width:1100px){
 #values .value{grid-template-columns:minmax(280px,1fr) minmax(0,1.3fr);gap:28px}
 #values .value-point{grid-template-columns:minmax(0,1fr)}
 #values .value-points .value-point>button[data-feature]{min-height:80px;padding:16px 14px;gap:10px;font-size:16px}
 #values .values-media .value-video{font-size:13px}
}
@media(max-width:767px){
 #values .values-list{gap:32px}
 #values .value{grid-template-columns:minmax(0,1fr);gap:20px;padding-top:32px}
 #values .value:first-child{padding-top:0}
 #values .value h3{font-size:27px}
 #values .value-desc{font-size:15px;margin-bottom:12px}
 #values .value-points{gap:10px}
 #values .value-points .value-point>button[data-feature]{min-height:64px;padding:14px 12px;font-size:16px}
 #values .value>.values-media{margin:0;padding:0}
 #values .feature-zoom{height:32px;right:10px;bottom:10px;padding-inline:10px;font-size:12px}
}

/* Compact brand-blue service band; open metrics without an enclosing card. */
#coverage{position:relative;isolation:isolate;overflow:hidden;padding-block:46px 42px;background:linear-gradient(115deg,#086fbe 0%,#237bd1 50%,#536ed1 100%);color:#fff}
#coverage::before,#coverage::after{content:"";position:absolute;z-index:0;width:880px;height:880px;right:-170px;top:-620px;border:1px solid #ffffff1f;border-radius:50%;box-shadow:0 0 0 74px #ffffff08,0 0 0 148px #ffffff06;pointer-events:none}
#coverage::after{width:620px;height:620px;left:-380px;right:auto;top:110px;border-color:#ffffff18;box-shadow:0 0 0 64px #ffffff06}
#coverage .coverage-grid{position:relative;z-index:1;display:block;isolation:auto;max-width:1304px}
#coverage .coverage-copy{position:relative;text-align:center}
#coverage .kicker{display:flex;justify-content:center;font-size:13px;line-height:20px;margin-bottom:10px;color:#fff}
#coverage #coverage-title{font-size:clamp(28px,2.15vw,38px);line-height:1.4;letter-spacing:-.025em;color:#fff;text-wrap:balance}
#coverage #coverage-title>span{display:inline}
#coverage .sec-lead{margin-top:12px;font-size:15px;line-height:1.7;color:#eff7ff;text-wrap:balance}
#coverage .cov-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;max-width:1120px;margin:30px auto 0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
#coverage .cov-stats>div{display:flex;flex-direction:column-reverse;align-items:center;justify-content:center;gap:10px;padding:0 20px;border:0}
#coverage .cov-stats>div+div{border-left:1px solid #ffffff38}
#coverage .cov-stats dt{font-size:14px;line-height:1.6;color:#eff7ff}
#coverage .cov-stats dd{line-height:1.15;white-space:nowrap;color:#fff}
#coverage .cov-stats dd b{font-size:44px;letter-spacing:-.025em;font-weight:600}
#coverage .cov-stats dd small{margin-left:5px;font-size:17px;font-weight:400;color:#eff7ff}
@media(min-width:768px) and (max-width:1100px){
 #coverage #coverage-title{max-width:740px;margin-inline:auto}
 #coverage .cov-stats>div{padding-inline:12px}
}
@media(max-width:767px){
 #coverage{padding-block:34px 30px}
 #coverage::before{width:540px;height:540px;top:-420px;right:-280px;box-shadow:0 0 0 48px #ffffff08,0 0 0 96px #ffffff06}
 #coverage::after{display:none}
 #coverage #coverage-title{font-size:24px;line-height:1.5}
 #coverage #coverage-title>span{display:block}
 #coverage .sec-lead{font-size:14px;margin-top:10px}
 #coverage .cov-stats{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:22px}
 #coverage .cov-stats>div{padding:16px 8px;gap:6px}
 #coverage .cov-stats>div:nth-child(odd){border-left:0}
 #coverage .cov-stats>div:nth-child(n+3){border-top:1px solid #ffffff38}
 #coverage .cov-stats dd b{font-size:34px}
 #coverage .cov-stats dd small{font-size:15px}
 #coverage .cov-stats dt{font-size:13px}
}
/* Product cards continue across the viewport instead of starting at the content gutter. */
#versions .version-track{padding-inline:24px;scroll-padding-inline:24px}
@media(max-width:767px){#versions .version-track{padding-inline:16px;scroll-padding-inline:16px}}

/* Complete five-row sheet; the source provides more than 2x the display resolution. */
#cases{padding-bottom:0}
#cases .logo-wall{display:block;margin-top:64px;padding:0 0 32px;background:#fff;mask-image:none;-webkit-mask-image:none}
#cases .logo-wall-title{margin:0 24px 28px;font-size:32px;font-weight:600;line-height:1.5;text-align:center;color:var(--ink)}
#cases .partner-marquee{--partner-width:1800px;width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain}
#cases .partner-marquee::-webkit-scrollbar{display:none}
#cases .partner-track{display:flex;width:max-content;animation:partner-slide 100s linear infinite;will-change:transform}
#cases .partner-sheet{display:block;flex:none;width:var(--partner-width);max-width:none;height:auto}
#cases .partner-marquee:is(:hover,:focus-within) .partner-track{animation-play-state:paused}
#cases .partner-marquee:focus-visible{outline:2px solid #4285dc;outline-offset:-3px}
@keyframes partner-slide{from{transform:translateX(0)}to{transform:translateX(calc(-1 * var(--partner-width)))}}
@media(max-width:767px){
 #cases .logo-wall{margin-top:40px;padding-bottom:24px}
 #cases .logo-wall-title{font-size:23px;margin:0 20px 20px}
 #cases .partner-marquee{--partner-width:1500px}
}
@media(prefers-reduced-motion:reduce){
 #cases .partner-track{animation:none;will-change:auto}
 #cases .partner-sheet[aria-hidden=true]{display:none}
}

/* Place the scene selector below the artwork so it cannot cover the demo UI. */
#hero .hero-scene{position:relative}
#hero .scene-tabs{position:relative;z-index:3;left:auto;bottom:auto;transform:none;margin:16px auto 24px;width:max-content;max-width:calc(100% - 32px);background:#f6f8fdf2;border-color:#dfe6f2;box-shadow:0 6px 24px #344b7812}
@media(max-width:767px){
 #hero .hero-scene{padding-bottom:0}
 #hero .scene-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:calc(100% - 32px);max-width:none;padding:4px;gap:0;border-radius:28px}
 #hero .scene-tabs button{width:100%;min-height:40px;padding:8px 4px;gap:4px;font-size:12px;white-space:nowrap}
 #hero .scene-tabs .ri{width:13px;height:13px;flex:none}
 #hero .scene-progress{left:12px;right:12px}
}

/* A restrained separator with equal space beside each product title. */
#hero .hero-title-separator{display:inline-block;box-sizing:border-box;width:8px;height:8px;margin-inline:.22em;padding:0;border:0;border-radius:50%;background:currentColor;vertical-align:.31em;overflow:hidden;text-indent:1em;white-space:nowrap;line-height:0}

@media(max-width:767px){#hero .hero-title-separator{width:6px;height:6px}}
@media(max-width:350px){#hero h1.scene-headline{font-size:28px}}