/* A single visual moves from the full hero into the design collection. */
body main>section.hero-reveal-stage:first-child{padding:0!important;border:0;position:relative;height:153svh;background:#f4f3ef;isolation:isolate;overflow:visible}
.hero-reveal-sticky{position:sticky;top:0;height:100svh;min-height:620px;overflow:hidden;isolation:isolate}
.reveal-collage{position:absolute;inset:0;background:#f4f3ef;z-index:0}
.hero-reveal-stage .reveal-media{position:absolute;inset:auto;top:0;left:0;width:100%;height:100%;z-index:1;overflow:hidden;transform-origin:center;will-change:width,height,left,top;border-radius:0;background:#e9e8e2}
.reveal-main-image{width:100%;height:100%;object-fit:cover;object-position:50% 50%;transform:scale(1.04);animation:reveal-image-settle 1.7s ease-out both}
.reveal-media-shade{position:absolute;inset:0;background:linear-gradient(90deg,#101010fa 5%,#101010f0 42%,#101010bd 65%,#10101080),linear-gradient(0deg,#101010d9,transparent 45%,#10101066);opacity:1}
.hero-reveal-stage .home-dark-hero{position:absolute;inset:0;min-height:0;height:100%;padding:calc(var(--header-expanded) + 45px) 0 100px;background:transparent;z-index:2;display:flex;align-items:center;overflow:visible;will-change:opacity,transform}
.hero-reveal-stage .hero-content{margin-top:0}
.hero-reveal-stage .home-dark-hero h1{max-width:1060px;font-size:clamp(58px,6.4vw,90px)}
.hero-word-mask{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.hero-word-mask>span{display:inline-block;animation:hero-word-enter .9s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(.08s + var(--word)*.10s)}
.hero-reveal-stage .home-hero-kicker{animation:hero-copy-enter .8s .35s both}
.hero-reveal-stage .hero-content>p{animation:hero-copy-enter .8s .48s both}
.hero-reveal-stage .dark-hero-actions{animation:hero-copy-enter .8s .58s both}
.hero-reveal-stage .hero-baseline{bottom:28px}
.reveal-message{position:absolute;top:42%;left:50%;width:min(100% - 60px,920px);transform:translate(-50%,-50%);text-align:center;opacity:0}
.reveal-message .radiarc-eyebrow{justify-content:center;margin-bottom:20px;color:#686860}
.reveal-message h2{font-size:clamp(40px,4.25vw,62px);line-height:1.06;color:#101010}
.reveal-message h2 em{color:var(--orange)}
.reveal-message p{font-size:18px;margin-top:23px;color:#62625b}
.reveal-tile{position:absolute;margin:0;width:clamp(130px,16vw,230px);height:clamp(100px,13vw,178px);overflow:hidden;border-radius:10px;background:#e4e4de;box-shadow:0 14px 38px #10101013;opacity:0;transform:translateY(30px) scale(.9);will-change:transform,opacity}
.reveal-tile img{width:100%;height:100%;object-fit:cover;object-position:top}
.tile-roof{left:5%;top:12%;transform:rotate(-6deg)}
.tile-hvac{right:6%;top:13%;transform:rotate(5deg)}
.tile-plumb{left:-4%;top:47%}
.tile-electric{right:-3%;top:46%}
.tile-home{left:15%;bottom:8%}
.tile-atomic{right:15%;bottom:8%}
.tile-static-main{display:none}
.reveal-disclosure{position:absolute;bottom:24px;left:20px;right:20px;text-align:center;font-size:15px;line-height:1.5;color:#71716a;opacity:0}
@keyframes hero-word-enter{from{transform:translateY(110%)}to{transform:translateY(0)}}
@keyframes hero-copy-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes reveal-image-settle{to{transform:scale(1)}}
@media(max-width:700px){
 body main>section.hero-reveal-stage:first-child{height:141svh}
 .hero-reveal-sticky{min-height:600px}
 .hero-reveal-stage .home-dark-hero{padding:calc(var(--header-expanded) + 26px) 0 90px;align-items:flex-start}
 .hero-reveal-stage .home-dark-hero h1{font-size:clamp(40px,10.4vw,60px)}
 .hero-reveal-stage .home-dark-hero .hero-content>p{max-width:350px;font-size:18px;margin:22px 0}
 .hero-reveal-stage .home-hero-kicker{margin-bottom:22px}
 .hero-reveal-stage .hero-baseline{bottom:24px}
 .reveal-media-shade{background:linear-gradient(90deg,#101010f5,#101010e8),linear-gradient(0deg,#101010f5,transparent 75%)}
 .reveal-main-image{object-position:58% center}
 .reveal-message{top:44%;width:calc(100% - 36px)}
 .reveal-message h2{font-size:clamp(34px,8.5vw,43px)}
 .reveal-message h2 br{display:none}
 .reveal-message .radiarc-eyebrow{font-size:15px!important;letter-spacing:.04em!important;margin-bottom:16px}
 .reveal-message p{font-size:16px;margin-top:18px;max-width:260px;margin-inline:auto}
 .reveal-tile{width:112px;height:90px;border-radius:7px}
 .tile-roof{left:7%;top:14%}.tile-hvac{right:7%;top:15%}
 .tile-plumb,.tile-electric{display:none}
 .tile-home{left:-9%;bottom:13%}.tile-atomic{right:-9%;bottom:12%}
 .reveal-disclosure{font-size:15px;bottom:22px}
}
/* Pause and reduced motion use a normal document flow with no pinned transition. */
body main>section.hero-reveal-stage.reveal-static:first-child{height:auto}
.reveal-static .hero-reveal-sticky{position:relative;height:auto;display:flex;flex-direction:column;min-height:0}
.reveal-static .home-dark-hero{position:relative;inset:auto;min-height:760px;height:auto;order:0;opacity:1!important;transform:none!important;pointer-events:auto!important}
.reveal-static .reveal-media{top:0!important;left:0!important;width:100%!important;height:760px!important;border-radius:0!important}
.reveal-static .reveal-media-shade{opacity:1!important}
.reveal-static .reveal-collage{position:relative;inset:auto;height:780px;order:1;z-index:3}
.reveal-static .reveal-message,.reveal-static .reveal-tile,.reveal-static .reveal-disclosure{opacity:1!important}
.reveal-static .reveal-tile{transform:none!important}
.reveal-static .tile-static-main{display:block;left:calc(50% - 110px);top:70%;width:220px;height:150px}
.reveal-static .hero-word-mask>span,.reveal-static .hero-content>*,.reveal-static .reveal-main-image{animation:none!important;transform:none}
@media(max-width:700px){.reveal-static .home-dark-hero{min-height:780px}.reveal-static .reveal-media{height:780px!important}.reveal-static .reveal-collage{height:720px}.reveal-static .tile-static-main{width:150px;height:106px;left:calc(50% - 75px);top:70%}}
@media(prefers-reduced-motion:reduce){.hero-reveal-stage *{animation:none!important;transition:none!important}}

/* Keep mockup lettering behind the copy; reveal the artwork as the copy leaves. */
@media(max-width:700px){
 body main>section.hero-reveal-stage:first-child{height:max(141svh,820px)}
 .hero-reveal-sticky{min-height:680px}
 .hero-reveal-stage .home-dark-hero{flex-direction:column;justify-content:flex-start;padding-bottom:24px}
 .hero-reveal-stage .hero-content{width:90%}
 .hero-reveal-stage .hero-baseline{position:relative;left:auto;bottom:auto;transform:none;width:90%;margin-top:22px;justify-content:flex-end}
 .hero-reveal-stage .hero-baseline>span{display:none}
 .hero-reveal-stage .hero-baseline button{padding:8px 0}
 .reveal-main-image{filter:blur(3px)}
 .reveal-static .reveal-main-image{filter:blur(3px)!important}
}
@media(min-width:701px){.reveal-media-shade{background:linear-gradient(90deg,#101010 0%,#101010fa 40%,#101010e6 58%,#10101080 82%),linear-gradient(0deg,#101010d9,transparent 50%,#10101080)}}
/* Mobile reveal uses compositor transforms instead of resizing a filtered image. */
@media(max-width:700px){
 .hero-reveal-stage:not(.reveal-static) .reveal-media{transform-origin:0 0;will-change:transform;backface-visibility:hidden}
 .hero-reveal-stage:not(.reveal-static) .reveal-main-image{object-fit:fill;animation:none;transform-origin:center;will-change:transform;backface-visibility:hidden}
 .hero-reveal-stage .home-dark-hero,.hero-reveal-stage .reveal-message{backface-visibility:hidden}
 .reveal-static .reveal-media{transform:none!important}
 .reveal-static .reveal-main-image{object-fit:cover;transform:none!important}
}
/* Give touch swipes a real pinned transition and a visible hold on the finished collage. */
@media(max-width:700px){body main>section.hero-reveal-stage:not(.reveal-static):first-child{height:220svh}}

/* Original Radiarc footage sits behind the hero, then gives way to the website collage. */
.home-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;visibility:hidden;pointer-events:none}
.home-hero-video.is-playing{visibility:visible}
.hero-reveal-stage .reveal-media-shade{background:linear-gradient(90deg,#101010ed 0%,#101010c9 43%,#10101066 75%,#10101040),linear-gradient(0deg,#101010b3,transparent 55%)}
.reveal-static .home-hero-video{opacity:1!important}
@media(max-width:700px){.hero-reveal-stage .reveal-media-shade{background:linear-gradient(90deg,#101010db,#10101099),linear-gradient(0deg,#101010b3,transparent 70%)}}