/* One document-space surface, starting below the rendered monitor table. */
body.editorial{
 --page-gradient-start:300svh;--page-gradient-rise:4400px;
 background-color:#080a0d;
 background-image:radial-gradient(ellipse at 105% 110%,#65cddd 0%,#b3dce2 35%,#e4edef00 72%),linear-gradient(180deg,#080a0d 0px,#20262b calc(var(--page-gradient-rise)*.15),#4a555e calc(var(--page-gradient-rise)*.35),#8a969e calc(var(--page-gradient-rise)*.55),#cbd4d9 calc(var(--page-gradient-rise)*.78),#f1f1f1 var(--page-gradient-rise));
 background-size:100% 1600px,100% calc(100% - var(--page-gradient-start));
 background-position:center bottom,0 var(--page-gradient-start);
 background-repeat:no-repeat;
}
.editorial :is(.intro,.product-explanations,.explore,.poster-functions,.software,.buy,.faq,.trade-finale,#site-footer){background:transparent;color:#102029}
.editorial .intro-showcase .intro-line h2{color:#f1f5f7}
.editorial .intro-showcase .intro-line h2 span{color:#b5f2fa}
.editorial :is(.explore,.poster-functions,.software,.buy) h2 span{color:#087f94}
.editorial :is(.section-heading>p,.poster-card p,.software-copy>p,#software-info p,.ownership p,.checkout-note){color:#344e5b}
.editorial :is(.software .included,.software-copy .compatibility,.key-detail small,.key-pager,.detail-top,.ownership article>span){color:#375d6a}
.editorial :is(#software-info h3,.software-copy .inline-link,.poster-card .inline-link,.software-tabs button){color:#12687b}
.editorial .software-tabs button[aria-selected=true]{background:#112c37;color:#baf6ff}
.editorial :is(.explanation-stage,.spec-rail,.spec-rail>div,.key-detail,.ownership article,.questions details,.legal-footer-links){border-color:#25485435}
.editorial .package-info{background:transparent;color:#102029}
.editorial :is(.price,.price>span,.package-info>ul,.key-detail h3,.key-detail>p){color:#102029}
.editorial .package-info .button{background:#102c38;color:#ecfbff}
.editorial .key-detail select{background:#dae5e9;color:#102029;border-color:#47616e55}
/* Product images and video frames retain their authored pixels; they don't repaint sections. */
.editorial .connected-poster{background:transparent}

.editorial #key-category{color:#087f94}

/* A black start and a long fade through the introduction and film sequence. */
.editorial .monitor-scroll-hero,.editorial .monitor-under-table{background:#080a0d}
.editorial .gradient-on-dark{color:#edf4f6}
.editorial .gradient-on-dark :is(h2,h3,p,.eyebrow,.explanation-copy p,.spec-rail b){color:#edf4f6}
.editorial .gradient-on-dark :is(.spec-rail span,.explanation-links a){color:#a4eaf4}
.editorial .spec-rail.gradient-on-dark span{color:#a4eaf4}
.editorial .spec-rail.gradient-on-dark b{color:#edf4f6}
.editorial .gradient-on-dark :is(.explanation-links a),.editorial .spec-rail.gradient-on-dark,.editorial .spec-rail.gradient-on-dark>div,.editorial .explanation-stage.gradient-on-dark{border-color:#bdd8e24d}

/* Extend and feather the hero surface beneath the rendered desk. */
.editorial .monitor-under-table{top:calc(var(--desk-top,90%) - 260px);background:linear-gradient(180deg,#080a0d00 0%,#080a0d28 28%,#080a0d99 62%,#080a0d 100%);min-height:300px}
.editorial .monitor-screen-overlay{border-radius:3px}
/* Subtle architectural guides continue through the document. */
body.editorial{position:relative;isolation:isolate}
body.editorial::before{content:"";position:absolute;inset:var(--page-gradient-start,300svh) 3vw 0;z-index:-1;pointer-events:none;border-inline:1px solid #80979f24;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),#80979f24 calc(25% - 1px),#80979f24 25%)}
.editorial .monitor-scroll-viewport::before{content:none}
/* Film cards: visual above concise title, fine frames and registration corners. */
.editorial .film-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding:12px 3vw 110px}
.editorial .film-card-grid .explanation{margin:0;min-width:0;position:relative;padding:12px;border:1px solid #d9f4f14d;background:#c8e7ef0a}
.editorial .film-card-grid .explanation::before,.editorial .film-card-grid .explanation::after{content:"+";position:absolute;top:-12px;left:-7px;font:20px/20px monospace;color:#a2dce7;pointer-events:none}
.editorial .film-card-grid .explanation::after{top:auto;left:auto;bottom:-10px;right:-7px}
.editorial .film-card-grid .explanation-stage{display:flex;flex-direction:column;gap:0;padding:0;border:0;height:100%;background:transparent}
.editorial .film-card-grid .explanation-screen{order:0;max-width:none;width:100%;margin:0 0 24px;aspect-ratio:16/9;flex:none;border-radius:0}
.editorial .film-card-grid .explanation-heading{order:1;width:100%;padding:0 6px}
.editorial .film-card-grid .explanation-heading .eyebrow{font:16px/1.2 monospace!important;color:#a2dce7;margin:0 0 12px}
.editorial .film-card-grid .explanation-heading h3{font-family:inherit;font-weight:500;letter-spacing:-.055em;line-height:1.05;text-transform:none;font-size:clamp(29px,2.8vw,52px);max-width:none;color:#f4fafb}
.editorial .film-card-grid .explanation-copy{order:2;max-width:none;padding:16px 6px 20px}
.editorial .film-card-grid .explanation-copy p{font-size:clamp(16px,1.3vw,21px)!important;line-height:1.4;color:#cfdee3}
.editorial .film-card-grid .play-disc{width:52px;height:52px}
@media(min-width:801px) and (max-width:1150px){.editorial .film-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.editorial .film-card-grid .explanation-heading h3{font-size:42px}}
@media(max-width:800px){.editorial .film-card-grid{grid-template-columns:1fr;gap:34px;padding:12px 24px 70px}.editorial .film-card-grid .explanation-heading h3{font-size:40px}.editorial .film-card-grid .explanation-copy p{font-size:18px!important}.editorial .monitor-under-table{top:calc(var(--desk-top,90%) - 180px);min-height:230px}}
/* Keep card text readable across both dark and light portions of the page. */
.editorial .film-card-grid .explanation{background:#eef4f2ed;border-color:#ffffffa8}
.editorial .film-card-grid .explanation-heading h3{color:#102029}
.editorial .film-card-grid .explanation-heading .eyebrow{color:#087f94}
.editorial .film-card-grid .explanation-copy p{color:#344e5b}
.editorial .film-card-grid .explanation::before,.editorial .film-card-grid .explanation::after{color:#50a9ba}


/* Oversized section wordmark and restrained silver-to-ink card headings. */
.editorial .explanation-intro{position:relative;padding:80px 3vw 0;overflow:hidden}
.editorial #explanations-title{font-family:TMDisplay,Impact,sans-serif;font-size:20vw;font-weight:400;line-height:.77;letter-spacing:-.01em;color:#fff;white-space:nowrap;margin:0;text-transform:uppercase}
.editorial .film-card-grid{position:relative;padding-top:0;margin-top:-8px}
.editorial .film-card-grid .explanation-heading h3{font-family:Arial,Helvetica,sans-serif;font-weight:500;font-size:clamp(29px,2.8vw,54px);letter-spacing:-.03em;line-height:1.05;background:linear-gradient(90deg,#90999b 0%,#505c60 35%,#071317 100%);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
@media(min-width:801px) and (max-width:1150px){.editorial .film-card-grid .explanation-heading h3{font-size:48px}}
@media(max-width:800px){.editorial .explanation-intro{padding:70px 24px 0}.editorial #explanations-title{font-size:19vw;line-height:.85}.editorial .film-card-grid{margin-top:-3px}.editorial .film-card-grid .explanation-heading h3{font-size:42px}}
.editorial .film-card-grid .explanation-heading h3{width:fit-content;max-width:100%}
.editorial #explanations-title{transform:scaleX(1.3);transform-origin:left center;width:max-content}

/* Light below the desk, gradually descending into the dark footer. */
body.editorial{background-image:linear-gradient(180deg,#f1f1f1 0%,#e3eaed 28%,#a1b1b9 45%,#41545e 60%,#14252d 78%,#080a0d 100%);background-size:100% calc(100% - var(--page-gradient-start));background-position:0 var(--page-gradient-start);background-repeat:no-repeat}
.editorial .monitor-scroll-hero{background:#f1f1f1}
.editorial .monitor-under-table{background:linear-gradient(180deg,#f1f1f100 0%,#f1f1f12b 28%,#f1f1f1a6 65%,#f1f1f1 100%)}
.editorial .intro-showcase .intro-line h2{color:#102029}
.editorial .intro-showcase .intro-line h2 span{color:#087f94}
.editorial #explanations-title{font-size:20vw;line-height:.74;letter-spacing:-.01em;transform:none;width:auto}
.editorial .surface-dark{color:#edf4f6}
.editorial .surface-dark :is(h2,h3,h4,p,summary,li,.price,.price>span,.package-info,.key-detail h3,.key-detail>p,.footer-bottom,.footer-top,.footer-top>a,.legal-footer-links a){color:#edf4f6}
.editorial .surface-dark :is(h2 span,.eyebrow,.included,.compatibility,.inline-link,.detail-top,.key-pager,.key-detail small,.ownership article>span,.contact-pending){color:#93dce7}
.editorial .surface-dark :is(.key-detail,.ownership article,.questions details,.legal-footer-links){border-color:#bdd8e24d}
.editorial .surface-dark .package-info .button{background:#b5edf5;color:#102029}
.editorial .surface-dark .finale-action{background:#b5edf5;color:#102029}
.editorial #site-footer.surface-dark .editorial-wordmark{color:#e5f0f3}
.editorial #site-footer.surface-dark .editorial-wordmark em{color:#88dbe8}
.editorial #site-footer.surface-dark :is(.brand span,.brand small,.footer-top>a,.footer-bottom>span,.footer-bottom>a){color:#b2dce5}

/* Real guide elements avoid fractional background stripes and negative stacking. */
body.editorial::before{content:none}
.editorial main,.editorial #site-footer{position:relative;z-index:1}
.background-guides{position:fixed;inset:0 3vw;z-index:0;pointer-events:none;overflow:hidden;clip-path:inset(var(--guide-top,100vh) 0 0);contain:layout paint}
.background-guides>i{position:absolute;top:0;bottom:0;left:calc(var(--track)*25%);width:1px;background:rgba(112,145,156,.28);transform:translateX(-.5px)}
.background-guides>i:first-child{transform:none}.background-guides>i:last-child{transform:translateX(-1px)}
.background-guides>i::after{content:"";position:absolute;top:-200px;left:-1px;width:3px;height:180px;background:linear-gradient(180deg,transparent,#39cfe066 40%,#4de9ff 82%,#d0fcff 92%,transparent);filter:drop-shadow(0 0 5px #19b7d4);animation:guide-travel var(--travel) linear var(--delay) infinite}
@keyframes guide-travel{0%{transform:translateY(0);opacity:0}8%{opacity:.85}65%{opacity:.85}77%,100%{transform:translateY(calc(100vh + 400px));opacity:0}}
.background-guides.guides-paused>i::after{animation-play-state:paused;opacity:0}
@media(prefers-reduced-motion:reduce){.background-guides>i::after{display:none}}

/* Reference geometry: seven 1px lines, 24px outer inset at a 1440px viewport. */
.background-guides{inset:0 max(16px,1.666667vw)}
.background-guides>i{left:calc(var(--track)*(100% - 1px)/6);transform:none}
.background-guides>i:last-child{transform:none}
.background-guides>i::after{content:none;animation:none}
.guide-glow{position:absolute;top:0;left:0;width:1px;height:192px;opacity:0;background:linear-gradient(180deg,#39d9f000,#39d9f0 50%,#39d9f000);pointer-events:none}
@media(prefers-reduced-motion:reduce){.guide-glow{display:none}}

/* Square interactive sculpture areas, matching the reference card proportion. */
.editorial .film-card-grid .explanation-screen{aspect-ratio:1;overflow:hidden;background:linear-gradient(180deg,#68747b 0%,#a4b0b5 52%,#e3e9e9 100%);margin-bottom:22px}
.editorial .film-card-grid .explanation-screen>video{display:none}
.card-3d{position:absolute;inset:0;touch-action:pan-y;outline-offset:-4px}
.card-3d>img{width:100%;height:100%;object-fit:contain;display:block}
.card-3d-ready>img{visibility:hidden}
.card-scene-canvas{position:fixed;inset:0;z-index:2;pointer-events:none;width:100%;height:100%}
.editorial .film-card-grid .explanation-play{inset:50% auto auto 50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;background:transparent;z-index:3;padding:0}
.editorial .film-card-grid .play-disc{width:54px;height:54px;background:#0a202bd9;border:1px solid #effbffb3;color:#fff}
.editorial .film-card-grid .explanation-play:hover .play-disc{background:#087f94}
#card-film-dialog{position:fixed;inset:0;margin:auto;width:min(94vw,1440px);max-height:94vh;padding:0;border:0;background:#070b0e;color:#fff;overflow:visible}
#card-film-dialog::backdrop{background:#03090eee;backdrop-filter:blur(12px)}
#card-film-dialog video{display:block;width:100%;max-height:88vh;aspect-ratio:16/9;object-fit:contain}
#card-film-dialog .film-close{position:absolute;right:10px;top:10px;z-index:1;width:44px;height:44px;border-radius:50%;background:#09141fe6;color:white;font-size:28px}
#card-film-dialog .film-status:empty{display:none}

/* Stronger grotesk weight for the sculpted video cards. */
.editorial .film-card-grid .explanation-heading h3{font-weight:700;letter-spacing:-.04em}

/* Keep the loop close to the headline; align specifications with the existing guides. */
@media(min-width:801px){
 .editorial .intro-showcase .keypad-loop{transform:translateX(-9vw)}
 .editorial .spec-rail{width:calc((100vw - 2 * max(16px,1.666667vw) - 1px) * 2 / 3);margin:35px auto 0;padding:22px 0}
 .editorial .spec-rail>div{gap:14px;padding:10px 16px;justify-content:center}
 .editorial .spec-rail>div:first-child,.editorial .spec-rail>div:last-child{padding:10px 16px}
 .editorial .spec-rail span{max-width:12ch}
}
.editorial .spec-rail>div{border-left:0!important;border-right:0!important}
@media(min-width:801px) and (max-width:1100px){.editorial .spec-rail{width:100%}.editorial .spec-rail>div{gap:10px;padding:10px 8px}}

/* Compact explorer: one aligned information column, with no extra divider. */
.editorial #product{padding-top:55px;--explorer-ink:#102029;--explorer-muted:#34515c;--explorer-accent:#087f94}
.editorial #product.surface-dark{--explorer-ink:#edf4f6;--explorer-muted:#c1d2da;--explorer-accent:#93dce7}
.editorial #product .section-heading{margin-bottom:12px}
.editorial #product .section-heading .eyebrow{margin-bottom:10px}
.editorial #product .explorer{grid-template-columns:minmax(0,2fr) minmax(0,1fr);min-height:0;align-items:start}
.editorial #product .product-stage{min-height:0;height:clamp(650px,52vw,820px)}
.editorial #product .key-detail{display:flex;flex-direction:column;gap:12px;border:0;padding:0 22px 20px;align-self:start;color:var(--explorer-ink)}
.editorial #product .key-detail .explorer-instruction{font:700 clamp(25px,2.3vw,38px)/1.12 Arial,sans-serif;letter-spacing:-.035em;margin:0 0 10px;color:var(--explorer-ink)}
.editorial #product .explorer-instruction span{color:var(--explorer-accent)}
.editorial #product .detail-top{color:var(--explorer-muted);gap:15px}
.editorial #product #key-category{color:var(--explorer-accent)}
.editorial #product .key-detail select{margin:0;padding:10px 12px;color:#102029;background:#e5edf0}
.editorial #product #key-title{font-size:clamp(28px,2.7vw,42px);line-height:1.1;margin:3px 0 0;color:var(--explorer-ink)}
.editorial #product #key-description{min-height:0;margin:0;color:var(--explorer-ink);line-height:1.4!important}
.editorial #product #key-demo{margin:0;min-width:0;width:100%}
.editorial #product #key-demo>svg{display:block;width:100%;height:auto}
.editorial #product .demo-note{color:var(--explorer-muted);letter-spacing:0;line-height:1.35!important;margin-top:8px}
.editorial #product .key-pager{margin:0;padding-top:4px;color:var(--explorer-ink);letter-spacing:0}
.editorial #product .key-pager button{border-color:var(--explorer-muted)}
.editorial #product .view-tools{bottom:16px}
@media(min-width:1101px){
 .editorial #product{padding-left:max(16px,1.666667vw);padding-right:max(16px,1.666667vw)}
 .editorial #product .section-heading{padding-left:28px}
 .editorial #product .key-detail{padding-left:24px;padding-right:24px}
}
@media(max-width:800px){
 .editorial #product{padding-top:35px}
 .editorial #product .explorer{grid-template-columns:1fr}
 .editorial #product .product-stage{height:480px}
 .editorial #product .key-detail{padding:12px 0 0;gap:12px}
 .editorial #product .key-detail .explorer-instruction{font-size:28px}
 .editorial #product .section-heading{margin-bottom:0}
}

/* Shared Companion accent and a larger, steady product view. */
.editorial :is(h2 span,.explorer-instruction span){background:linear-gradient(#87dce8,#329bad);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;color:#329bad}
.editorial .spec-rail span{font-weight:700}
@media(min-width:801px){
 .editorial #product .explorer{grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:24px}
 .editorial #product .product-stage{height:clamp(800px,62vw,980px)}
 .editorial #product .key-detail{padding-left:12px;padding-right:12px}
}
@media(max-width:800px){.editorial #product .product-stage{height:520px}}

/* Large left-aligned companion heading above the updated desk render. */
.editorial #software .section-heading{margin-bottom:18px;align-items:flex-end}
@media(max-width:800px){.editorial #software .section-heading{margin-bottom:8px;align-items:flex-start}}

/* Align the companion title with the left speaker, beside the monitor. */
@media(min-width:801px){
 .editorial #software{position:relative}
 .editorial #software .section-heading{position:absolute;z-index:2;left:var(--pad);width:30%;top:auto;bottom:calc(100% - 110px - 22vw);display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin:0}
 .editorial #software .section-heading h2{font-size:clamp(70px,8.5vw,150px);line-height:.98;letter-spacing:-.035em}
 .editorial #software .section-heading .eyebrow{margin-bottom:10px}
 .editorial #software .included{white-space:normal;font-size:14px!important;line-height:1.35}
}

/* Three clear ownership steps with shared vertical rhythm. */
.editorial .ownership{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;margin:48px auto 0;max-width:1180px}
.editorial .ownership article{display:grid;grid-template-rows:32px 64px auto;align-content:start;gap:14px;padding:24px 0 0;border-top:1px solid #91adba80}
.editorial .ownership article>span{font:700 24px/32px Arial,sans-serif;letter-spacing:-.03em;color:#74ddeb}
.editorial .ownership article h3{font:700 clamp(25px,2.2vw,32px)/1.05 Arial,sans-serif;letter-spacing:-.035em;margin:0;max-width:18ch;color:#edf4f6}
.editorial .ownership article p{font-size:18px!important;font-weight:500;line-height:1.5!important;margin:0;max-width:32ch;color:#d5e1e7}
@media(max-width:800px){
 .editorial .ownership{grid-template-columns:1fr;gap:28px;margin-top:32px}
 .editorial .ownership article{grid-template-columns:42px minmax(0,1fr);grid-template-rows:auto auto;gap:10px 16px;padding-top:22px}
 .editorial .ownership article>span{grid-row:1 / 3;font-size:23px;line-height:29px}
 .editorial .ownership article h3{grid-column:2;font-size:28px;line-height:1.12;max-width:none}
 .editorial .ownership article p{grid-column:2;font-size:17px!important;max-width:36ch}
}

.editorial #buy .ownership article p{color:#d5e1e7}
.editorial #buy .ownership article>span{color:#93dce7}

/* Cinematic title reveal; final styling and layout remain authored by each section. */
.cinematic-title{transform-origin:left center}
.cinematic-title-pending{opacity:0}
.cinematic-title>span{display:inline-block}
@media(prefers-reduced-motion:reduce){.cinematic-title-pending{opacity:1}}

.cinematic-title>.title-first-line{display:inline-block;font:inherit;letter-spacing:inherit;color:inherit}

/* Align content to the seven existing guides (six columns). */
.editorial .intro .spec-rail,.editorial .intro .spec-rail>div,.editorial #buy .ownership article{border:0!important}
@media(min-width:1101px){
 .editorial .intro{padding-left:max(16px,1.666667vw);padding-right:max(16px,1.666667vw);display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:center;column-gap:0}
 .editorial .intro-showcase{display:contents}
 .editorial .intro-showcase .intro-line{grid-column:1 / 3;padding-left:28px}
 .editorial .intro-showcase .intro-line h2{font-size:clamp(90px,8.8vw,180px)}
 .editorial .intro-showcase .keypad-loop{grid-column:3 / 6;transform:none;width:100%;max-width:none;margin:0;aspect-ratio:1}
 .editorial .intro .spec-rail{grid-column:6 / 7;display:flex;flex-direction:column;width:auto;gap:30px;margin:0;padding:0 16px}
 .editorial .intro .spec-rail>div{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:12px;padding:0!important}
 .editorial .intro .spec-rail b{font-size:clamp(38px,3.5vw,64px);min-width:1.3em}
 .editorial .intro .spec-rail span{font:700 clamp(14px,1.12vw,20px)/1.3 Arial,sans-serif;max-width:12ch}
 .editorial #buy .ownership{width:calc(100vw - 2 * max(16px,1.666667vw));max-width:none;position:relative;left:50%;transform:translateX(-50%);grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
 .editorial #buy .ownership article{padding:16px 28px 0}
}
.editorial #software .connected-poster{position:relative;isolation:isolate}
.editorial #software .connected-poster img{position:relative;z-index:1}
.monitor-pulsar{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}

/* Consistent title gutter, compact ownership steps, and a display-style instruction. */
.editorial #product .section-heading{padding-left:0;margin-left:0;margin-bottom:20px}
.editorial #product{padding-left:var(--pad);padding-right:var(--pad)}
.editorial #product .key-detail .explorer-instruction{font:400 clamp(36px,3.1vw,52px)/1.04 TMDisplay,Impact,sans-serif;text-transform:uppercase;letter-spacing:-.02em;margin-bottom:18px}
@media(min-width:1101px){
 .editorial #buy .ownership{width:calc((100vw - 2 * max(16px,1.666667vw))*2/3);max-width:1080px;gap:24px}
 .editorial #buy .ownership article{padding:12px 0 0;grid-template-rows:32px 64px auto;gap:12px}
 .editorial #buy .ownership article h3{font-size:28px}
}
@media(max-width:800px){.editorial #product{padding-left:24px;padding-right:24px}.editorial #product .key-detail .explorer-instruction{font-size:38px}}
