/* Immersive hero trial. The previous typographic version is backed up separately. */
.phase1 .hero-shell{background:#c6dce5 url('assets/hero-landscape-desktop.webp') center 55%/cover no-repeat;position:relative;isolation:isolate;color:#173747}
.phase1 .hero-shell::before{background:linear-gradient(180deg,#edf6ff70 0%,#eef7ff30 48%,#15392914 100%);background-size:100% 100%;pointer-events:none}
.phase1 .hero-shell::after{display:block;content:'';position:absolute;bottom:0;left:0;right:0;height:90px;background:linear-gradient(transparent,#f5f4ed);pointer-events:none;z-index:-1}
.phase1 .hero-shell header{border-bottom-color:#17374720;height:86px}
.phase1 .hero-shell .site-nav a{color:#173747}
.phase1 .product-hero.immersive-hero{display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px 5vw 68px;max-width:1500px;min-height:730px}
.immersive-position{font-size:9px;letter-spacing:1.5px;margin:0 0 24px;color:#173747;display:flex;align-items:center;gap:12px;padding:10px 16px;border:1px solid #ffffff80;border-radius:30px;background:#f2f8ff8c;backdrop-filter:blur(14px)}
.phase1 .immersive-hero h1{font-size:clamp(54px,6.7vw,98px);letter-spacing:-.055em;line-height:1.02;font-weight:400;color:#163746;text-shadow:0 1px 20px #effaff70}
.phase1 .immersive-hero h1 em{color:#163746;white-space:normal}
.immersive-description{font-size:14px;line-height:1.65;max-width:62ch;margin:24px 0 0;color:#1b3e50;text-shadow:0 1px 7px #f5fcff}
.immersive-projects{display:flex;justify-content:center;align-items:center;width:min(790px,100%);gap:18px;padding:36px 20px 30px;perspective:1400px}
.immersive-card{display:block;position:relative;padding:8px;border:1px solid #ffffffcf;border-radius:13px;width:48%;max-width:350px;background:#f3f8f2c4;backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 #fff,0 20px 45px #14334338;text-align:left;transition:transform .35s ease,box-shadow .35s ease;transform-origin:50% 75%}
.immersive-card img{display:block;width:100%;height:auto;border-radius:7px}
.immersive-relay{transform:rotate(-7deg) rotateY(7deg);z-index:1}
.immersive-rove{transform:translateY(12px) rotate(7deg) rotateY(-7deg);z-index:2}
.immersive-caption{display:flex;justify-content:space-between;align-items:center;color:#163746;padding:12px 8px 5px;gap:14px}
.immersive-caption strong{display:block;font-size:17px;font-weight:500;letter-spacing:-.4px;margin-bottom:4px}.immersive-caption small{display:block;font-size:9px;color:#395868}.immersive-caption>span:last-child{font-size:24px}
.immersive-actions{flex-direction:row;align-items:center;justify-content:center;gap:18px;margin-top:8px;z-index:2}
.immersive-actions .product-button{background:#f6f9f0;border:1px solid #fff;color:#163746;border-radius:999px;box-shadow:0 8px 25px #173c3226;min-height:50px;gap:28px}
.immersive-actions .product-button:hover{background:#fff}.immersive-actions .product-contact{background:#f4f8f1db;border:1px solid #ffffffb0;border-radius:999px;padding:14px 20px;min-height:50px;color:#163746;backdrop-filter:blur(12px)}
.immersive-footnote{font-size:9px;letter-spacing:.6px;color:#173747;margin:20px 0 0;padding:8px 12px;border-radius:20px;background:#f3f7efb8;backdrop-filter:blur(10px)}
@media(hover:hover) and (pointer:fine){.immersive-card:hover,.immersive-card:focus-visible{transform:translateY(-9px) rotate(0deg);box-shadow:inset 0 1px 0 #fff,0 25px 55px #14334345;z-index:3}}
.phase1 .immersive-card:focus-visible{outline:2px solid #163746;outline-offset:6px}
@media(max-width:760px){
 .phase1 .hero-shell{background-image:url('assets/hero-landscape-mobile.webp');background-position:center center}
 .phase1 .hero-shell header{height:74px}.phase1 .product-hero.immersive-hero{padding:26px 6vw 54px;min-height:0}
 .immersive-position{font-size:7px;letter-spacing:.7px;gap:8px;margin-bottom:23px;padding:9px 12px}
 .phase1 .immersive-hero h1{font-size:clamp(42px,11vw,72px);line-height:1.04;letter-spacing:-.055em}
 .immersive-description{font-size:12px;line-height:1.7;margin-top:20px;max-width:36ch}.desktop-break{display:none}
 .immersive-projects{flex-direction:column;gap:20px;width:100%;padding:30px 4px 22px}
 .immersive-card{width:84%;max-width:350px;padding:6px;border-radius:11px}
 .immersive-relay{transform:translateX(-9px) rotate(-3deg)}.immersive-rove{transform:translateX(9px) rotate(3deg)}
 .immersive-caption{padding:10px 7px 5px}.immersive-caption strong{font-size:16px}.immersive-caption small{font-size:9px}
 .immersive-actions{order:1;flex-direction:column;gap:10px;margin-top:22px}.immersive-actions .product-button,.immersive-actions .product-contact{min-width:220px;justify-content:space-between;font-size:12px}
 .immersive-projects{order:2}
 .immersive-footnote{order:3;font-size:8px;letter-spacing:0;line-height:1.6;max-width:100%;margin-top:16px}
}
@media(prefers-reduced-motion:reduce){.immersive-card{transition:none!important}.immersive-card:hover{transform:none!important}}

/* One editorial language: landscape, ink, solid controls. */
.phase1 .product-hero.immersive-hero{padding:52px 5vw 72px;min-height:600px;justify-content:center}
.immersive-position{background:none;border:0;border-radius:0;backdrop-filter:none;padding:0;margin-bottom:30px;font-size:11px;letter-spacing:1.5px}
.phase1 .immersive-hero h1{font-size:clamp(56px,6.7vw,96px);letter-spacing:-.035em;line-height:1.03;text-shadow:none}
.phase1 .immersive-hero h1 em{color:#173747;font-weight:400;display:inline-block;background:#f5f4ed;padding:0 .12em .06em;margin-top:.06em}
.immersive-description{font-size:17px;line-height:1.6;margin-top:26px;text-shadow:none;max-width:62ch}
.phase1 .immersive-actions{margin-top:30px;gap:24px}
.immersive-actions .product-button{background:#173747;color:#f5f4ed;border:1px solid #173747;border-radius:6px;box-shadow:none;padding:16px 22px;min-height:52px;font-size:16px;gap:28px}
.immersive-actions .product-button:hover{background:#264b59;color:#f5f4ed}
.immersive-actions .product-contact{background:none;border:0;border-bottom:1px solid #173747;border-radius:0;backdrop-filter:none;padding:12px 0;min-height:52px;font-size:16px;color:#173747}
.immersive-footnote{background:none;backdrop-filter:none;border-radius:0;padding:0;font-size:11px;letter-spacing:.3px;margin-top:28px}
.immersive-actions a:focus-visible{outline:2px solid #173747;outline-offset:5px}
@media(max-width:760px){
.phase1 .product-hero.immersive-hero{padding:38px 6vw 48px;min-height:0}
.immersive-position{font-size:9px;letter-spacing:.6px;margin-bottom:24px;gap:8px}
.phase1 .immersive-hero h1{font-size:clamp(40px,10.4vw,72px);letter-spacing:-.035em;line-height:1.1}
.immersive-description{font-size:16px;line-height:1.6;margin-top:24px;max-width:35ch}
.phase1 .immersive-actions{margin-top:26px;gap:12px}
.immersive-actions .product-button,.immersive-actions .product-contact{font-size:15px;min-width:220px}
.immersive-footnote{font-size:10px;margin-top:26px;max-width:30ch;line-height:1.6}
}

.phase1 .immersive-hero h1 em{background:none;padding:0;margin-top:.08em}
.phase1 .immersive-hero h1{font-size:clamp(46px,5.3vw,78px);max-width:1200px;text-wrap:balance}
.immersive-description{max-width:66ch}
@media(max-width:760px){.phase1 .immersive-hero h1{font-size:clamp(36px,9.4vw,60px);line-height:1.08}}

/* Glass controls, requested for both hero actions. */
.phase1 .immersive-actions .product-button,
.phase1 .immersive-actions .product-contact{background:#f4f8f1cc;color:#173747;border:1px solid #ffffffb3;border-radius:999px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:none;padding:16px 22px;min-height:52px}
@media(hover:hover){.phase1 .immersive-actions .product-button:hover,.phase1 .immersive-actions .product-contact:hover{background:#f4f8f1e6}}
