/* Overview layout belongs to the panel and stays intact while it fades out. */
.feature-context,.feature-chapter-title,.feature-chapter-rule{display:none}
.overview-heading[hidden],.overview-controls[hidden]{display:none!important}
.scene-aion-art{background-image:url('assets/aion2-astral-archive-preview.webp');background-position:center;background-size:cover}
.scene-backdrop[data-family=aion] .scene-aion-art{opacity:1}
.scene-backdrop .hero-world{opacity:1}.scene-aion-art{transition:opacity 1.15s cubic-bezier(.4,0,.2,1)}

.overview-heading{position:fixed;z-index:4;top:clamp(92px,12svh,160px);left:315px;right:110px;text-align:center;pointer-events:none;color:#fff;text-shadow:0 2px 5px #020914,0 0 20px #02091466}
.overview-kicker{display:block;font:600 10px/1.5 Noto,Arial,sans-serif;letter-spacing:.22em;color:#d6efff;margin-bottom:12px}
.overview-heading :is(h1,h2){font:400 clamp(40px,3.8vw,76px)/1.08 Almendra,Marcellus,Georgia,serif;letter-spacing:.02em;margin:0;text-shadow:0 2px 4px #020914,0 0 35px #99dbff33}
.overview-heading-rule{display:flex;align-items:center;justify-content:center;gap:17px;width:260px;max-width:70%;margin:15px auto 0;color:#dffaff;font-size:15px;text-shadow:0 0 14px #89e4ff}
.overview-heading-rule:before,.overview-heading-rule:after{content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,#cbebff99);box-shadow:0 0 9px #9adaff33}
.overview-heading-rule:after{transform:rotate(180deg)}
.scene-mode #product-tour.scene-panel,.scene-mode #companion.scene-panel{inset:clamp(225px,28svh,330px) 110px 220px 315px;padding:0!important;overflow:visible}
.scene-mode .feature-browser{position:relative;isolation:isolate;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none}
.scene-mode .feature-preview{display:grid;grid-template-columns:minmax(270px,.74fr) minmax(0,1.3fr);gap:clamp(30px,3vw,80px);height:100%;max-width:1700px;margin:auto;align-items:center}
.scene-mode .feature-description{grid-column:1;grid-row:1;padding:18px 0;border:0;background:none;overflow:auto;max-height:100%;scrollbar-width:thin;scrollbar-color:#c2e6ff55 transparent;text-shadow:0 2px 5px #020914,0 0 16px #020914aa}
.scene-mode .feature-description>.eyebrow{display:none}
.scene-mode .feature-description>h3{font:400 clamp(22px,1.8vw,34px)/1.38 Marcellus,Georgia,serif;max-width:560px;color:#fff;text-wrap:balance}
.scene-mode .feature-description>p{font:400 clamp(13px,1vw,17px)/1.9 Noto,Arial,sans-serif;max-width:530px;color:#edf3fa;margin-top:24px}
.scene-mode .tour-actions{margin-top:28px;gap:14px}
.scene-mode .tour-actions>.button{min-height:46px;padding:12px 23px;border:1px solid #cceaff88;border-radius:25px;background:linear-gradient(110deg,#15374db3,#242e48b3);box-shadow:inset 0 1px 0 #d5ecff22,0 0 20px #83caff12;color:white;font:400 12px/1.3 Marcellus,Georgia,serif;text-transform:uppercase;letter-spacing:.06em;transition:background .25s,border-color .25s,box-shadow .25s}
.scene-mode .tour-actions>.button:hover{border-color:#edfbff;background:linear-gradient(110deg,#205573d9,#3b3c64d9);box-shadow:0 0 25px #83caff33}
.scene-mode .tour-actions>.button:focus-visible{outline:2px solid #d5f3ff;outline-offset:5px}
.scene-mode .feature-visual{grid-column:2;grid-row:1;position:relative;aspect-ratio:1440/1000;width:100%;height:auto;max-height:100%;overflow:visible;background:#03091366;border:1px solid #cbe8f255;box-shadow:0 20px 60px #0004;align-self:center}
.scene-mode .feature-visual>img{width:100%;height:auto;max-height:100%;object-fit:contain;animation:none}
.scene-mode .feature-visual:before,.scene-mode .feature-visual:after{content:'';position:absolute;z-index:2;pointer-events:none;left:50%;top:-5px;width:9px;height:9px;transform:translateX(-50%) rotate(45deg);background:#c6eafa;box-shadow:0 0 14px #a9e6ff77;clip-path:polygon(0 0,60% 40%,100% 100%,40% 60%)}
.scene-mode .feature-visual:after{top:auto;bottom:-5px;transform:translateX(-50%) rotate(225deg)}
.scene-mode .capture-label{left:0;bottom:-27px;background:none;border:0;padding:0;color:#dcebf3;font-size:8px;letter-spacing:.13em;text-shadow:0 1px 4px #000}
.scene-mode .feature-enter{animation:none}
.scene-mode .tour-step-list{font-size:13px;line-height:1.8;color:#cddce9;margin-top:20px}
.scene-mode .tour-step-list [aria-current=step]{color:#fff}
/* Build tools stay in the same overview stage, with their existing screen tabs. */
.scene-mode #companion .app-showcase{border:0;background:none;box-shadow:none}
.scene-mode #companion .showcase-toolbar{display:none}
.scene-mode #companion .showcase-tabs{background:none;border:0;justify-content:center;padding:0 0 20px}
.scene-mode #companion .showcase-tabs button{background:transparent;border-color:#bddff844;color:#d7e9f5}
.scene-mode #companion .showcase-tabs button[aria-selected=true]{color:#fff;border-color:#d7efff99;background:#84caff14}
.scene-mode #companion .capture-caption{background:none;border:0;text-shadow:0 2px 6px #020914}
.scene-mode #companion .capture-caption h3{color:white}
.scene-mode #companion .capture-caption p{color:#e8f0f7}
.scene-mode #companion .capture-note{background:none;border:0;color:#c4d9e8}
/* A persistent, labelled feature track echoes the side menu selection. */
.overview-controls{position:fixed;z-index:21;left:315px;right:110px;bottom:67px;display:flex;align-items:flex-start;gap:16px;max-width:1300px;margin-inline:auto;color:#e6f1f7}
.overview-options{position:relative;display:flex;flex:1;min-width:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;isolation:isolate;padding:9px 0 0}
.overview-options::-webkit-scrollbar{display:none}
.overview-options:before{content:'';position:absolute;top:26px;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#c4e2ed77 9%,#c4e2ed77 91%,transparent);z-index:-1}
.overview-options button{position:relative;display:flex;flex:1 0 0;min-width:85px;flex-direction:column;align-items:center;gap:13px;text-align:center;padding:0 8px 8px;color:#c5d2dc;font:400 11px/1.45 Noto,Arial,sans-serif;text-shadow:0 2px 4px #000;transition:color .25s}
.overview-diamond{display:grid;place-items:center;width:35px;height:35px;font:22px/1 Georgia,serif;color:#bfdae7;transition:color .25s,filter .25s,transform .25s}
.overview-options button.active{color:white}
.overview-options button.active .overview-diamond{color:#f1fcff;transform:scale(1.2);filter:drop-shadow(0 0 5px #c9f5ff) drop-shadow(0 0 12px #88d5ff)}
.overview-options button.active .overview-diamond:before{content:'';position:absolute;width:17px;height:17px;transform:rotate(45deg);border:1px solid #c1eeff88}
.overview-options button:hover{color:white}.overview-options button:hover .overview-diamond{color:#edfbff;filter:drop-shadow(0 0 7px #9adfff)}
.overview-options button:focus-visible{outline:1px solid #ccefff;outline-offset:-2px;border-radius:2px}
.overview-arrow{border:0;background:none;padding:9px 3px 8px;font:44px/.85 Georgia,serif;color:#dcebf3;min-width:32px;cursor:pointer;text-shadow:0 0 12px #b0e5ff44;transition:color .2s,filter .2s}
.overview-arrow:hover{color:white;filter:drop-shadow(0 0 7px #9bdfff)}.overview-arrow:focus-visible{outline:1px solid #ccefff;outline-offset:3px}
@media(min-width:1800px){.overview-heading{left:355px;right:170px}.scene-mode #product-tour.scene-panel,.scene-mode #companion.scene-panel{left:355px;right:170px;bottom:220px}.overview-controls{left:355px;right:170px;bottom:87px}.overview-options button{font-size:13px;min-width:100px}.overview-diamond{font-size:25px}}
@media(max-height:800px) and (min-width:761px){.overview-heading{top:85px}.overview-heading :is(h1,h2){font-size:45px}.overview-kicker{font-size:9px;margin-bottom:8px}.overview-heading-rule{margin-top:10px}.scene-mode #product-tour.scene-panel,.scene-mode #companion.scene-panel{top:195px;bottom:185px}.scene-mode .feature-description>h3{font-size:23px}.scene-mode .feature-description>p{font-size:13px;margin-top:17px}.scene-mode .tour-actions{margin-top:18px}.overview-controls{bottom:55px}}
@media(max-width:1100px) and (min-width:761px){.overview-heading{left:285px;right:65px}.scene-mode #product-tour.scene-panel,.scene-mode #companion.scene-panel{left:285px;right:65px;top:210px;bottom:150px;overflow:auto}.scene-mode .feature-preview{display:flex;flex-direction:column;height:auto;min-height:100%;gap:30px}.scene-mode .feature-description{overflow:visible;order:1;padding:0}.scene-mode .feature-description>h3{font-size:22px}.scene-mode .feature-description>p{font-size:13px}.scene-mode .feature-visual{order:2;max-width:650px;max-height:none;margin-bottom:30px}.overview-controls{left:285px;right:65px}}
@media(max-width:760px){.overview-heading{top:77px;left:22px;right:22px}.overview-heading :is(h1,h2){font-size:38px}.overview-kicker{font-size:8px;margin-bottom:9px}.overview-heading-rule{width:180px;margin-top:10px;font-size:12px}.scene-mode #product-tour.scene-panel,.scene-mode #companion.scene-panel{inset:190px 23px 160px;overflow:auto;scrollbar-width:thin;scrollbar-color:#c1e5ff44 transparent}.scene-mode .feature-preview{display:flex;flex-direction:column;gap:27px;height:auto;min-height:100%}.scene-mode .feature-description{order:1;padding:0;overflow:visible;flex:none}.scene-mode .feature-description>h3{font-size:22px;line-height:1.4}.scene-mode .feature-description>p{font-size:13px;line-height:1.85;margin-top:16px}.scene-mode .tour-actions{margin-top:20px}.scene-mode .tour-actions>.button{font-size:10px;min-height:42px}.scene-mode .feature-visual{order:2;max-height:none;flex:none;width:100%;margin-bottom:30px}.scene-mode .capture-label{font-size:7px;bottom:-21px}.overview-controls{left:20px;right:20px;bottom:57px;gap:5px}.overview-options button{flex:0 0 106px;font-size:10px;min-width:106px;gap:9px}.overview-diamond{font-size:21px}.overview-arrow{min-width:24px;font-size:36px}.scene-mode #companion .capture-caption{padding:14px 0}.scene-mode #companion .showcase-tabs{padding-bottom:15px}}
@media(prefers-reduced-motion:reduce){.overview-options button,.overview-diamond,.overview-arrow{transition:none}}

/* The bottom track is local to the selected category. */
.overview-options button{border:0;background:none;cursor:pointer}.overview-options button>span:last-child{display:block}
.overview-arrow:disabled{opacity:.3;cursor:default;filter:none}
.scene-mode.overview-steps-ready .guide-navigation,.scene-mode.overview-steps-ready .tour-step-list{display:none!important}
.scene-mode.overview-steps-ready #companion .showcase-tabs{display:none!important}
.chapter-rail .chapter-features>a.feature-active>span:last-child{color:#fff;font-weight:650;text-shadow:0 1px 3px #020817,0 0 9px #aeeaff,0 0 18px #6acfff77}
.chapter-rail .chapter-features>a.feature-active>span:first-child{color:#e8fbff;text-shadow:0 0 5px #fff,0 0 13px #86ddff;font-weight:700}

@media(prefers-reduced-motion:reduce){.scene-backdrop .hero-world,.scene-aion-art{transition:none}}

/* Focused, unaltered interface captures for the Auto Explore story. */
.explore-presentation[hidden],.explore-slide-meta[hidden],.explore-outcome[hidden]{display:none!important}
.scene-mode .feature-visual[data-explore-presenting]{background:none;border:0;box-shadow:none;aspect-ratio:1.55;overflow:visible}
.scene-mode .feature-visual[data-explore-presenting]>img,.scene-mode .feature-visual[data-explore-presenting]>.guide-arrow{display:none}
.scene-mode .feature-visual[data-explore-presenting]:before,.scene-mode .feature-visual[data-explore-presenting]:after{display:none}
.explore-presentation{position:relative;isolation:isolate;width:100%;aspect-ratio:1.55;max-height:100%;flex:none;overflow:visible}
.explore-presentation:before{content:'';position:absolute;inset:5% 1%;pointer-events:none;z-index:-1;background:radial-gradient(ellipse,#7bd4ff20,transparent 67%);filter:blur(20px)}
.explore-part{position:absolute;margin:0;min-width:0}
.explore-part figcaption{position:absolute;left:0;right:0;top:-25px;font:600 9px/1.5 Noto,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#e4f2fc;text-shadow:0 1px 5px #020816;white-space:nowrap}
.app-source-cut{position:relative;overflow:hidden;width:100%;background:#0c1821;border:1px solid #bad9ed5c;border-radius:3px;box-shadow:0 18px 50px #02081266,0 0 24px #89d2ff12}
.app-source-cut>img{position:absolute;display:block;max-width:none!important;height:auto!important;margin:0;pointer-events:none;user-select:none}
.explore-presentation[data-layout=overview] .explore-part-route{left:0;top:29%;width:65%;z-index:2}
.explore-presentation[data-layout=overview] .explore-part-compass{right:0;top:0;width:43%;z-index:3}
.explore-presentation[data-layout=overview] .explore-part-map{right:0;bottom:0;width:44%;z-index:3}
.explore-presentation[data-layout=open] .explore-part-panel{left:0;top:23%;width:100%}
.explore-presentation[data-layout=options] .explore-part-panel{left:9%;top:7%;width:82%}
.explore-presentation[data-layout=follow] .explore-part-compass{left:29%;top:8%;width:42%}
.explore-presentation[data-layout=follow] .explore-part-map{left:23%;bottom:0;width:54%}
.scene-mode [data-active-feature=explore] .feature-description{padding-right:10px}
.explore-slide-meta{display:block;color:#c5e9ff;font:600 10px/1.5 Noto,Arial,sans-serif;letter-spacing:.16em;margin-bottom:18px}
.scene-mode [data-active-feature=explore] .feature-description>h3{font-size:clamp(25px,2vw,39px);line-height:1.26;text-wrap:balance}
.scene-mode [data-active-feature=explore] .feature-description>.explore-outcome{color:#c8ebff;font-size:clamp(12px,.85vw,14px);line-height:1.6;max-width:450px;margin-top:26px;padding-top:18px;border-top:1px solid #c0deed44}
.scene-mode [data-active-feature=explore] .tour-actions{display:none}
.scene-mode .feature-visual[data-explore-presenting]>.capture-label{bottom:-34px;color:#d2e4f0;letter-spacing:.1em}
@media(max-height:800px) and (min-width:761px){.explore-slide-meta{font-size:9px;margin-bottom:12px}.scene-mode [data-active-feature=explore] .feature-description>h3{font-size:25px}.scene-mode [data-active-feature=explore] .feature-description>p{font-size:12px;line-height:1.8}.scene-mode [data-active-feature=explore] .feature-description>.explore-outcome{font-size:11px;margin-top:18px;padding-top:12px}.explore-part figcaption{font-size:8px;top:-21px}}
@media(max-width:760px){.explore-presentation{min-height:0}.scene-mode .feature-visual[data-explore-presenting]{aspect-ratio:1.55}.explore-slide-meta{font-size:8px;margin-bottom:12px}.scene-mode [data-active-feature=explore] .feature-description>h3{font-size:25px}.scene-mode [data-active-feature=explore] .feature-description>.explore-outcome{font-size:12px;margin-top:18px;padding-top:13px}.explore-part figcaption{font-size:6px;letter-spacing:.06em;top:-18px}.scene-mode .feature-visual[data-explore-presenting]>.capture-label{bottom:-27px;font-size:6px}.app-source-cut{box-shadow:0 10px 25px #02081255}}

/* One animated background persists throughout the AION 2 overview. */
.overview-background-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0;transition:opacity .5s ease;pointer-events:none}
.overview-background-video.ready{opacity:1}
.scene-aion-art:after{z-index:1;pointer-events:none}
/* Floating rail glows share the page crossfade's 1.15 second timing. */
.chapter-rail.glow-motion-ready>[data-section-link].active:after{display:none}
.chapter-active-glow,.chapter-feature-glow{position:absolute;left:-36px;top:0;width:190px;height:60px;z-index:-1;pointer-events:none;opacity:0;filter:blur(9px);background:radial-gradient(ellipse at 25% 50%,#dff8ff88,#8edbff33 32%,transparent 68%);transition:transform 1.15s cubic-bezier(.4,0,.2,1),opacity 1.15s cubic-bezier(.4,0,.2,1)}
.chapter-feature-glow{left:0;width:180px;height:40px;filter:blur(7px);background:radial-gradient(ellipse at 26% 50%,#e8faff40,#a0dfff15 35%,transparent 70%)}
.chapter-rail a,.chapter-rail a>span{transition:color 1.15s cubic-bezier(.4,0,.2,1),text-shadow 1.15s cubic-bezier(.4,0,.2,1)}
@media(prefers-reduced-motion:reduce){.overview-background-video,.chapter-active-glow,.chapter-feature-glow,.chapter-rail a,.chapter-rail a>span{transition:none}}

/* Use the homepage's viewport centre, with symmetric room for the side rail. */
:root{--overview-side-space:300px}
.overview-heading,.overview-controls{left:var(--overview-side-space);right:var(--overview-side-space)}
.scene-mode #product-tour.scene-panel,.scene-mode #companion.scene-panel{left:var(--overview-side-space);right:var(--overview-side-space)}
.scene-mode .feature-preview{grid-template-columns:minmax(240px,.74fr) minmax(0,1.3fr)}
@media(min-width:1800px){:root{--overview-side-space:355px}}
@media(min-width:761px) and (max-width:1279px){:root{--overview-side-space:65px}}
@media(max-width:760px){:root{--overview-side-space:23px}.overview-controls{left:20px;right:20px}.overview-heading{left:22px;right:22px}}

/* One fixed vignette covers both films; only the opaque background images blend. */
.scene-aion-art:after{content:none}

/* Showcase media: exact native captures with alpha, no rectangular backdrop. */
.scene-mode .tour-actions{display:none}
.explore-presentation[data-layout^=showcase-]{aspect-ratio:1280/900}
.scene-mode .feature-visual[data-explore-presenting]:has(.explore-presentation[data-layout^=showcase-]){aspect-ratio:1280/900}
.explore-capture{position:absolute;margin:0;min-width:0}
.explore-capture img{display:block;width:100%;height:auto;max-width:100%;filter:drop-shadow(0 5px 12px #02091655)}
.explore-capture figcaption{position:absolute;top:-23px;left:0;right:0;color:#eef8ff;font:600 9px/1.5 Noto,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;text-shadow:0 1px 4px #020812;white-space:nowrap}
[data-layout=showcase-overview] .capture-plan{left:0;top:28%;width:54%}
[data-layout=showcase-overview] .capture-compass{left:66%;top:5%;width:29%}
[data-layout=showcase-overview] .capture-target{left:66%;top:25%;width:29%}
[data-layout=showcase-overview] .capture-map{left:62%;bottom:5%;width:36%}
[data-layout=showcase-plan] .capture-plan{left:0;top:25%;width:100%}
[data-layout=showcase-elevation] .capture-above{left:0;top:6%;width:51%}
[data-layout=showcase-elevation] .capture-below{right:0;top:32%;width:51%}
[data-layout=showcase-elevation] .capture-target{left:0;top:47%;width:33%}
[data-layout=showcase-elevation] .capture-map{right:0;bottom:0;width:43%}
.explore-demo{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:none}
.explore-demo-toggle{position:absolute;left:2%;bottom:1%;border:1px solid #cdeaff77;border-radius:22px;padding:10px 17px;background:#0b2339a6;color:white;font:400 11px/1.4 Marcellus,serif;letter-spacing:.04em;cursor:pointer;box-shadow:inset 0 1px 0 #ffffff1a}
.explore-demo-toggle:hover{border-color:#effaff;background:#133952bb}.explore-demo-toggle:focus-visible{outline:2px solid #d9f5ff;outline-offset:4px}
.explore-demo-caption{position:absolute;right:2%;bottom:2%;max-width:58%;font:9px/1.5 Noto,Arial,sans-serif;color:#e6f3ff;text-align:right;text-shadow:0 1px 4px #000}
.explore-content-types{display:block;margin-top:17px;font:600 10px/1.7 Noto,Arial,sans-serif;color:#cde7f8;letter-spacing:.025em}
@media(max-height:800px) and (min-width:761px){.explore-capture figcaption{font-size:7px;top:-19px}.explore-content-types{font-size:8px;line-height:1.8}.explore-demo-toggle{font-size:9px;padding:8px 12px}.explore-demo-caption{font-size:7px}}
@media(max-width:760px){.explore-capture figcaption{font-size:6px;letter-spacing:.03em;top:-16px}.explore-content-types{font-size:9px}.explore-demo-toggle{font-size:9px;padding:8px 11px}.explore-demo-caption{font-size:6px}.explore-presentation[data-layout^=showcase-]{margin-top:15px}}
