.concept-hero{position:relative;isolation:isolate;overflow:hidden;min-height:700px;border-bottom:1px solid var(--rule)}
.concept-content{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr);gap:80px;padding-top:70px;padding-bottom:200px}
.concept-hero h1{font-size:clamp(40px,4.5vw,68px)!important;line-height:1.06!important;letter-spacing:-.045em;margin:20px 0 25px}
.concept-hero h1 em{display:block;margin-top:10px;font-weight:400}
.concept-engine{font-size:19px;line-height:1.55;max-width:510px;margin:0 0 30px}
.concept-products{padding-top:15px}
.concept-products>span{font:11px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.13em;color:var(--muted);display:block;margin-bottom:23px}
.concept-product{padding:21px 0;border-top:1px solid var(--rule-dark)}
.concept-product h2{font-size:28px;margin:0 0 10px;line-height:1.2}
.concept-product h2 a{display:flex;justify-content:space-between;align-items:center;color:var(--ink);text-decoration:none}
.concept-product p{font-size:17px;line-height:1.55;max-width:360px;margin:0;color:var(--ink-2)}
.concept-product small{display:block;font:10px/1.5 var(--mono);letter-spacing:.04em;color:var(--accent);margin-top:13px}
.concept-art{position:absolute;z-index:0;pointer-events:none;mix-blend-mode:var(--hero-blend,multiply);inset:180px 0 -70px;mask-image:linear-gradient(to bottom,transparent,#000 62%,#000 83%,transparent);opacity:.68}
.concept-art img,.concept-art video{width:100%;height:100%;object-fit:cover;object-position:center 56%;display:block}
.concept-art .img-dark{display:none}.dark .concept-art .img-light{display:none}.dark .concept-art .img-dark{display:block}
.concept-foot{position:absolute;z-index:2;bottom:30px;left:0;right:0;display:flex;justify-content:space-between;font:11px/1.5 var(--mono);color:var(--ink-2)}
.hero-exploration .workflow-hero,.hero-home .workflow-hero{padding-top:38px}
.concept-b .concept-content{padding-top:80px;padding-bottom:150px;grid-template-columns:1.1fr 1fr;gap:90px}
.concept-b .concept-products{padding:24px 30px;background:color-mix(in srgb,var(--paper) 88%,transparent);border:1px solid var(--rule)}
.concept-b .concept-product:first-of-type{border:0;padding-top:0}
.concept-b .concept-art{inset:130px -10% -180px 10%;transform:perspective(1100px) rotateX(17deg) rotateZ(-7deg);opacity:.42;mask-image:linear-gradient(to bottom,transparent,#000 60%,transparent)}
.concept-b .concept-art img{object-position:center 75%}
.concept-c .concept-content{padding-top:60px;padding-bottom:230px;grid-template-columns:1.3fr .85fr}
.concept-c .concept-art{inset:210px -15% -180px;opacity:.75;mask-image:linear-gradient(to bottom,transparent,#000 58%,transparent)}
.concept-c .concept-art video{object-position:center 55%}
.concept-c .concept-products{border-left:1px solid var(--rule);padding-left:35px}
.concept-d .concept-content{grid-template-columns:1.1fr 1fr;gap:70px;padding-bottom:190px}
.concept-d .concept-products{display:grid;grid-template-columns:1fr 1fr;gap:22px;padding-top:70px}
.concept-d .concept-products>span{grid-column:1/-1;margin:0;align-self:end}
.concept-d .concept-product{padding:24px 0}.concept-d .concept-product p{font-size:16px}
.concept-d .concept-art{inset:150px 0 -150px;opacity:.48;mask-image:linear-gradient(to bottom,transparent,#000 70%,transparent)}
.concept-b .concept-art{opacity:.25;mask-image:linear-gradient(to bottom,transparent,transparent 20%,#000 70%,transparent)}
.concept-b .concept-products{background:color-mix(in srgb,var(--paper) 97%,transparent)}
.concept-d .concept-art{inset:330px 0 -140px;opacity:.3;mask-image:linear-gradient(to bottom,transparent,#000 75%,transparent)}
.concept-d h1{font-size:clamp(40px,4vw,58px)!important}
.concept-foot{background:color-mix(in srgb,var(--paper) 90%,transparent);padding-top:9px;padding-bottom:9px}
/* These SPX plates already match the page. Multiplying would tint cream twice.
   Fade the whole container, as on Platform, to keep both text columns clear. */
.concept-a .concept-art,.concept-c .concept-art{inset:195px -25px -35px;mix-blend-mode:normal;opacity:1;mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.08) 25%,rgba(0,0,0,.32) 48%,#000 78%,transparent 100%)}
.concept-a .concept-art img,.concept-c .concept-art video{object-position:center 50%}
.dark .concept-a .concept-art,.dark .concept-c .concept-art{mix-blend-mode:normal}
.concept-review-switch{position:fixed;bottom:14px;right:20px;z-index:99;display:flex;align-items:center;gap:16px;background:var(--ink);color:var(--paper);padding:14px 18px;font:12px var(--mono);box-shadow:0 3px 20px #0002}
.concept-review-switch a{color:inherit;text-decoration:none}.concept-review-switch a[aria-current]{text-decoration:underline;text-underline-offset:5px}.concept-review-switch>span{opacity:.6}
@media(max-width:480px){.concept-review-switch{bottom:8px;right:8px;left:8px;justify-content:space-between;gap:8px;padding:14px 10px;font-size:10px}}
.concept-review-link{position:fixed;bottom:14px;right:20px;z-index:99;background:var(--ink);color:var(--paper);padding:10px 16px;font:12px var(--mono);box-shadow:0 3px 20px #0002;text-decoration:none}
.hero-gallery{max-width:1500px;margin:auto;padding:50px 35px}
.hero-gallery h1{font-size:48px;line-height:1.12;margin:16px 0}.hero-gallery>p{max-width:760px;font-size:20px;line-height:1.6}
.hero-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px 28px;margin-top:40px}
.hero-choice{border:1px solid var(--rule);background:var(--card);text-decoration:none;color:var(--ink);display:block}
.hero-choice img{width:100%;height:auto;display:block;border-bottom:1px solid var(--rule)}
.hero-choice div{padding:22px}.hero-choice h2{font-size:26px;margin:0 0 12px}.hero-choice p{font-size:17px;line-height:1.5;margin:0;color:var(--ink-2)}
.hero-choice:hover{border-color:var(--accent)}
.hero-choice small{font:11px var(--mono);color:var(--accent);display:block;margin-top:16px}
@media(max-width:900px){.concept-content,.concept-b .concept-content,.concept-c .concept-content,.concept-d .concept-content{gap:35px;grid-template-columns:1fr 1fr}.concept-hero h1{font-size:42px!important}.concept-d .concept-products{grid-template-columns:1fr;padding-top:0;gap:0}.concept-products>span{font-size:10px}.concept-product p{font-size:16px}.concept-b .concept-products{padding:20px}.concept-c .concept-products{padding-left:20px}}
@media(max-width:650px){.concept-content,.concept-b .concept-content,.concept-c .concept-content,.concept-d .concept-content{grid-template-columns:1fr;padding-top:38px;padding-bottom:125px;gap:30px}.concept-hero h1{font-size:42px!important}.concept-engine{font-size:17px}.concept-products,.concept-c .concept-products{padding:0;border-left:0}.concept-d .concept-products{grid-template-columns:1fr 1fr;gap:18px}.concept-art{inset:280px -30% -40px;opacity:.23}.concept-b .concept-art{opacity:.18}.concept-c .concept-art{inset:380px -80% -160px;opacity:.28}.concept-d .concept-art{inset:300px -50% -70px;opacity:.2}.concept-foot{flex-wrap:wrap;gap:12px;font-size:10px;bottom:24px}.concept-hero{min-height:0}.hero-choice-grid{grid-template-columns:1fr}.hero-gallery{padding:30px 18px}.hero-gallery h1{font-size:36px}.concept-review-link{font-size:10px;right:10px;bottom:8px}}
/* On phones the complete graph sits below the headline instead of stretching
   a landscape background over the entire tall hero. Keep the native ratio. */
@media(max-width:650px){
 .concept-a,.concept-c{display:grid;grid-template-columns:minmax(0,1fr);padding-bottom:30px}
 .concept-a .concept-content,.concept-c .concept-content{display:contents}
 .concept-a .concept-title,.concept-c .concept-title{grid-row:1;width:calc(100% - 44px);margin:0 auto;padding-top:38px}
 .concept-a .concept-art,.concept-c .concept-art{position:relative;grid-row:2;inset:auto;width:100%;height:auto;aspect-ratio:12/5;margin:22px 0 0;transform:none;opacity:1;mask-image:linear-gradient(to bottom,transparent,#000 9%,#000 95%,transparent)}
 .concept-a .concept-art img,.concept-c .concept-art video{width:100%;height:100%;object-fit:contain;object-position:center}
 .concept-a .concept-foot,.concept-c .concept-foot{position:static;grid-row:3;width:calc(100% - 44px);margin:5px auto 24px;padding:0;background:none;gap:7px;font-size:9px}
 .concept-a .concept-products,.concept-c .concept-products{grid-row:4;width:calc(100% - 44px);margin:0 auto;padding:0;border:0}
 .concept-a .concept-products>span,.concept-c .concept-products>span{margin-bottom:14px}
}