.scroll-hero{--hero-header-height:90px;background:var(--night);color:white;position:relative;min-height:650px}
.scroll-hero.motion-ready{height:calc(210svh - var(--hero-header-height));min-height:1100px}
.hero-stage{height:calc(100svh - var(--hero-header-height));min-height:620px;max-height:1100px;position:relative;overflow:hidden;isolation:isolate;--scene-clip:inset(10% 8% 10% 53% round 12px);--photo-scale:1;--photo-x:0%;--copy-opacity:1;--copy-y:0px;--door-angle:0deg;--door-opacity:1;--arrival-opacity:0;--arrival-y:24px;--progress:0%}
.motion-ready .hero-stage{position:sticky;top:var(--hero-header-height)}
.hero-backdrop{position:absolute;inset:0;background:radial-gradient(ellipse at 88% 40%,#175365 0%,#0a2f3c 35%,#082730 75%);z-index:-2}
.hero-backdrop:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(12.5% - 1px),#a4c4ce0a calc(12.5% - 1px),#a4c4ce0a 12.5%)}
.hero-scene{position:absolute;inset:0;clip-path:var(--scene-clip);z-index:-1;will-change:clip-path}
.hero-scene-photo,.hero-scene-photo img{display:block;height:100%;width:100%}
.hero-scene-photo img{object-fit:cover;object-position:55% 50%;transform:translateX(var(--photo-x)) scale(var(--photo-scale));will-change:transform}
.scene-shade{position:absolute;inset:0;background:linear-gradient(90deg,#061e2a88,transparent 68%),linear-gradient(0deg,#051d29d9,transparent 40%)}
.threshold{position:absolute;top:10%;bottom:10%;left:53%;right:8%;perspective:1000px;opacity:var(--door-opacity);pointer-events:none;z-index:1}
.threshold-frame{position:absolute;inset:0;border:10px solid #426977;border-bottom-width:6px;border-radius:12px;box-shadow:0 0 0 1px #abc4cd44,0 22px 70px #0007,inset 0 0 22px #0007}
.threshold-leaf{position:absolute;top:10px;bottom:6px;width:50%;background:linear-gradient(100deg,#143d4bf5,#315963fa);border:1px solid #648590;backface-visibility:hidden;display:flex;align-items:center;justify-content:center;transform-style:preserve-3d;box-shadow:inset 0 0 0 20px #ffffff03;overflow:hidden}
.threshold-left{left:10px;width:calc(50% - 10px);transform-origin:left center;transform:rotateY(var(--door-angle))}
.threshold-right{right:10px;width:calc(50% - 10px);transform-origin:right center;transform:rotateY(calc(-1 * var(--door-angle)))}
.threshold-leaf:before{content:'';position:absolute;inset:14px;border:1px solid #a8bfca20}
.threshold-leaf span{font:36px/1 var(--serif);letter-spacing:.09em;color:#f1eee5;opacity:.8}
.threshold-left span{font:10px var(--sans);letter-spacing:.2em}
.threshold-right i{position:absolute;left:12px;top:57%;height:65px;width:3px;background:var(--yellow);box-shadow:1px 0 8px #0005}
.scroll-hero-copy{position:relative;z-index:2;width:48%;max-width:760px;padding:clamp(50px,7vh,100px) 0 0 max(5%,calc((100vw - 1280px)/2));opacity:var(--copy-opacity);transform:translateY(var(--copy-y));visibility:visible}
.scroll-hero-copy[aria-hidden=true]{visibility:hidden}
.scroll-hero-copy h1{font-size:clamp(61px,6.1vw,96px);margin:27px 0 26px;line-height:1.06}
.scroll-hero-copy h1 em{color:var(--yellow)}
.scroll-hero-copy .hero-description{max-width:355px;font-size:13px;margin-bottom:27px;line-height:1.8}
.hero-scroll-cue{display:inline-flex;min-height:44px;align-items:center;gap:13px;font-size:10px;color:#c8dce0;margin-top:26px;padding:7px 0}
.hero-scroll-cue>span:last-child>span{margin-left:18px;font-size:15px}
.scroll-cue-line{width:25px;height:1px;background:var(--yellow)}
.hero-arrival{position:absolute;top:clamp(55px,8vh,115px);left:max(5%,calc((100vw - 1280px)/2));z-index:2;opacity:var(--arrival-opacity);transform:translateY(var(--arrival-y));max-width:590px}
.hero-arrival[aria-hidden=true]{visibility:hidden;pointer-events:none}
.hero-arrival h2{font-size:clamp(50px,5.5vw,86px);margin:20px 0 22px;line-height:1.05;text-shadow:0 2px 24px #0003}
.hero-arrival h2 em{color:var(--yellow)}
.hero-arrival>p:not(.eyebrow){font-size:13px;color:#f2f4ed;line-height:1.8;text-shadow:0 2px 6px #0008;margin-bottom:27px}
.hero-scroll-footer{position:absolute;bottom:25px;left:5%;right:5%;display:flex;justify-content:space-between;align-items:flex-end;gap:25px;z-index:3}
.hero-source{display:flex;flex-direction:column;gap:5px;max-width:290px}
.hero-source .eyebrow{font-size:9px;color:white;text-shadow:0 1px 6px #000}
.hero-source>span:last-child{font-size:8px;color:#d5e4e8;text-shadow:0 1px 6px #000;background:#082730b3;padding:3px 5px;align-self:flex-start}
.hero-progress{width:36%;max-width:370px}.hero-progress-labels{display:flex;gap:15px;justify-content:space-between;white-space:nowrap;font-size:7px;letter-spacing:.09em;color:#b2c3ca;text-shadow:0 1px 5px #000}
.hero-progress-labels .current{color:var(--yellow)}.hero-progress-track{height:1px;background:#b6ced366;margin-top:10px}.hero-progress-track>span{display:block;height:2px;width:var(--progress);background:var(--yellow)}
.hero-motion-toggle{min-height:44px;min-width:44px;padding:9px 12px;color:#e8eff1;border:1px solid #acc3cc77;background:#082730a6;font-size:9px;border-radius:0;white-space:nowrap}
.scroll-hero:not(.motion-ready) .threshold{display:none}.scroll-hero:not(.motion-ready) .hero-scene{clip-path:inset(0)}.scroll-hero:not(.motion-ready) .hero-progress,.scroll-hero:not(.motion-ready) .hero-motion-toggle{display:none}
.scroll-hero.motion-off{height:auto;min-height:0}.motion-off .hero-stage{position:relative;top:auto}.motion-off .hero-scene{clip-path:none}.motion-off .threshold,.motion-off .hero-progress,.motion-off .hero-arrival,.motion-off .hero-scroll-cue{display:none}.motion-off .scroll-hero-copy{opacity:1;transform:none;visibility:visible}.motion-off .scene-shade{background:linear-gradient(90deg,#082730eb,#08273060),linear-gradient(0deg,#082730cc,transparent 40%)}
@media(max-width:1100px){.scroll-hero-copy h1{font-size:67px}.scroll-hero-copy{width:50%;padding-left:5%}.scroll-hero-copy .hero-description{max-width:320px;font-size:12px}.threshold-leaf span{font-size:30px}.threshold-left span{font-size:9px}.hero-progress{width:32%}.hero-progress-labels{font-size:6px;gap:8px}.hero-source{max-width:225px}}
@media(max-width:820px){.hero-stage{min-height:570px}.scroll-hero-copy h1{font-size:56px}.scroll-hero-copy .hero-description{max-width:275px}.scroll-hero-copy .button{font-size:11px;padding:14px 18px;gap:20px}.hero-progress{display:none}.hero-arrival h2{font-size:65px}.hero-scroll-footer{bottom:22px}.hero-source{max-width:330px}}
@media(max-width:600px){.scroll-hero{--hero-header-height:70px}.scroll-hero.motion-ready{height:calc(190svh - var(--hero-header-height));min-height:1150px}.hero-stage{height:calc(100svh - var(--hero-header-height));min-height:650px;max-height:1000px;--scene-clip:inset(45% 9% 7% 9% round 12px)}.scroll-hero-copy{padding:29px 25px 0;width:100%;max-width:none}.scroll-hero-copy>.eyebrow{font-size:9px}.scroll-hero-copy h1{font-size:clamp(48px,13vw,69px);margin:17px 0 15px;line-height:1.03}.scroll-hero-copy .hero-description{font-size:11px;max-width:330px;line-height:1.65;margin-bottom:17px}.scroll-hero-copy .button{font-size:10px;min-height:48px;padding:12px 18px;gap:30px}.hero-scroll-cue{position:absolute;right:25px;bottom:-1px;margin:0;font-size:9px;gap:7px;max-width:75px;line-height:1.5}.hero-scroll-cue>span:last-child>span{margin-left:4px}.scroll-cue-line{display:none}.threshold{top:45%;bottom:7%;left:9%;right:9%}.threshold-frame{border-width:7px}.threshold-left{left:7px;width:calc(50% - 7px)}.threshold-right{right:7px;width:calc(50% - 7px)}.threshold-leaf{top:7px;bottom:7px}.threshold-leaf span{font-size:31px}.threshold-left span{font-size:10px}.hero-scene-photo img{object-position:53% center}.scene-shade{background:linear-gradient(0deg,#051d29e6,transparent 58%),linear-gradient(90deg,#051d295e,transparent 70%)}.hero-arrival{left:25px;right:25px;top:55px;max-width:none}.hero-arrival h2{font-size:clamp(50px,14vw,70px);margin:18px 0 24px}.hero-arrival>p:not(.eyebrow){font-size:12px;max-width:280px}.hero-scroll-footer{left:25px;right:25px;bottom:17px;gap:12px;align-items:flex-end}.hero-source{max-width:210px}.hero-source .eyebrow{font-size:7px}.hero-source>span:last-child{font-size:7px;line-height:1.5}.hero-motion-toggle{font-size:7px;padding:8px;max-width:100px;white-space:normal}.scroll-hero .hero-stage .button{position:relative;z-index:3}.motion-off .scroll-hero-copy{padding-top:65px}.motion-off .scroll-hero-copy h1{font-size:58px}.motion-off .scroll-hero-copy .hero-description{font-size:13px;margin-top:24px;margin-bottom:25px}.mobile-consult.at-hero{visibility:hidden;pointer-events:none;opacity:0}}
@media(max-width:600px) and (max-height:740px){.hero-stage{min-height:620px}.scroll-hero-copy h1{font-size:48px}.scroll-hero-copy{padding-top:24px}.scroll-hero-copy .hero-description{font-size:10px;max-width:310px;margin-bottom:13px}.hero-scroll-cue{display:none}}
/* A specific headline and a hero that fits shorter phone viewports. */
.scroll-hero-copy h1{font-size:clamp(52px,5.45vw,82px)}
.scroll-hero-copy .hero-description{font-size:14px}
.hero-source .eyebrow{font-size:10px}
.hero-source>span:last-child,.hero-progress-labels{font-size:9px}
.hero-motion-toggle{font-size:11px}
.hero-motion-toggle:disabled{cursor:default}
@media(max-width:1100px){.scroll-hero-copy h1{font-size:61px}.scroll-hero-copy .hero-description{font-size:13px}}
@media(max-width:820px){.scroll-hero-copy h1{font-size:52px}}
@media(max-width:600px){
  .scroll-hero.motion-ready{height:calc(185svh - var(--hero-header-height));min-height:0}
  .hero-stage{height:calc(100svh - var(--hero-header-height));min-height:0;max-height:none;--scene-clip:inset(50% 9% 10% 9% round 12px)}
  .scroll-hero-copy{padding:24px 20px 0}
  .scroll-hero-copy h1,.motion-off .scroll-hero-copy h1{font-size:clamp(35px,10.6vw,62px);margin:14px 0;line-height:1.05}
  .scroll-hero-copy .hero-description{font-size:12px;line-height:1.6;margin-bottom:15px;max-width:360px}
  .scroll-hero-copy .button{font-size:12px;gap:16px;min-height:48px;padding:12px 16px}
  .hero-scroll-cue{right:20px;font-size:10px;max-width:78px}
  .threshold{top:50%;bottom:10%}
  .hero-scroll-footer{left:20px;right:20px;bottom:12px;gap:8px}
  .hero-source{max-width:215px}
  .hero-source .eyebrow{font-size:9px}
  .hero-source>span:last-child{font-size:9px}
  .hero-motion-toggle{font-size:10px;padding:6px 8px;max-width:100px}
  .hero-arrival{left:20px;right:20px;top:42px}
  .hero-arrival h2{font-size:clamp(41px,12vw,65px)}
  .motion-off .scroll-hero-copy{padding-top:36px}
  .motion-off .scroll-hero-copy .hero-description{font-size:12px;margin:16px 0 20px}
}
@media(max-width:600px) and (max-height:740px){
  .scroll-hero-copy{padding-top:16px}
  .scroll-hero-copy h1{font-size:clamp(32px,10vw,46px);margin:10px 0}
  .scroll-hero-copy .hero-description{font-size:11px;line-height:1.45;margin-bottom:12px;max-width:335px}
  .hero-scroll-cue{display:none}
  .hero-source .eyebrow{font-size:8px}
  .hero-source>span:last-child{font-size:8px}
}
@media(min-width:601px) and (max-height:650px){
  .scroll-hero.motion-ready{height:calc(185svh - var(--hero-header-height));min-height:0}
  .hero-stage{min-height:0}
  .scroll-hero-copy{padding-top:24px}
  .scroll-hero-copy h1{font-size:44px;margin:16px 0}
  .scroll-hero-copy .hero-description{font-size:12px;margin-bottom:18px}
  .hero-scroll-cue{margin-top:12px}
  .hero-arrival{top:28px}
  .hero-arrival h2{font-size:48px}
  .hero-scroll-footer{bottom:12px}
}
@media(prefers-reduced-motion:reduce){.scroll-hero{height:auto!important;min-height:0!important}.hero-stage{position:relative!important;top:auto!important}.hero-scene{clip-path:none!important}.hero-scene-photo img{transform:none!important}.threshold,.hero-progress,.hero-arrival,.hero-scroll-cue{display:none!important}.scroll-hero-copy{opacity:1!important;transform:none!important;visibility:visible!important}.scene-shade{background:linear-gradient(90deg,#082730ee,#08273077)!important}}
/* A more prominent illustrated entrance: warm timber and brushed bronze. */
.hero-stage{--scene-clip:inset(6% 5% 7% 51% round 4px);--threshold-scale:1;--threshold-light:.2}
.hero-backdrop{background:radial-gradient(ellipse at 77% 46%,#31515a 0%,#123947 33%,#082730 72%)}
.threshold{top:6%;bottom:7%;left:51%;right:5%;perspective:1200px;transform:scale(var(--threshold-scale));transform-origin:50% 50%;will-change:transform,opacity}
.threshold:before{content:'';position:absolute;inset:-50px;background:radial-gradient(ellipse,#edc57a30 0%,#edc57a15 45%,transparent 72%);z-index:-1}
.threshold-light{position:absolute;inset:6px;background:linear-gradient(90deg,#e9bc7420,transparent 27%,#f6dba860 49%,#fff1d5d9 50%,#f6dba860 51%,transparent 73%,#e9bc7420);opacity:var(--threshold-light);box-shadow:inset 0 0 60px #f5d99c70}
.threshold-frame{border:12px solid #887151;border-bottom-width:9px;border-radius:4px;background:transparent;box-shadow:0 0 0 1px #efcf96a6,0 0 0 5px #302e27,0 28px 65px #0009,inset 0 0 0 2px #e7bf8255,inset 0 0 32px #0007}
.threshold-frame:before{content:'';position:absolute;inset:-10px;border:1px solid #f4d2a18c;border-radius:2px}
.threshold-frame:after{content:'';position:absolute;inset:0;border:2px solid #352e23;box-shadow:inset 0 0 0 1px #e5c6915c}
.threshold-leaf{top:12px;bottom:9px;border:1px solid #aa8358;border-radius:1px;background:linear-gradient(115deg,#ffffff12,transparent 32%,#00000032),repeating-linear-gradient(90deg,transparent 0px,transparent 9px,#f9d6a911 10px,transparent 11px,transparent 25px,#23170e18 26px,transparent 27px),linear-gradient(90deg,#765137,#986c47 49%,#715038);box-shadow:inset 4px 0 7px #efc79322,inset -4px 0 10px #25181180,0 8px 26px #0007}
.threshold-left{left:12px;width:calc(50% - 12px)}
.threshold-right{right:12px;width:calc(50% - 12px);background:linear-gradient(105deg,#ffffff10,transparent 42%,#00000040),repeating-linear-gradient(90deg,transparent 0px,transparent 9px,#f9d6a90d 10px,transparent 11px,transparent 25px,#23170e18 26px,transparent 27px),linear-gradient(90deg,#926842,#80583d 55%,#674a34)}
.threshold-leaf:before{inset:19px;border:1px solid #e6bd8455;border-radius:2px;box-shadow:inset 0 0 0 5px #281b140f}
.threshold-leaf:after{content:'';position:absolute;left:25px;right:25px;top:23px;height:35%;border-bottom:1px solid #e6bd8440;background:linear-gradient(180deg,#f8d3a205,transparent);pointer-events:none}
.threshold-leaf span{font:clamp(35px,3.7vw,57px)/1 var(--serif);letter-spacing:.06em;color:#ffe9c0;opacity:1;text-shadow:0 2px 2px #372316b3;position:absolute;top:43%;left:0;right:0;text-align:center}
.threshold-left span{font:600 12px/1 var(--sans);letter-spacing:.28em;color:#fff0d7;top:46%}
.threshold-leaf i{position:absolute;top:57%;height:clamp(90px,12vh,125px);width:9px;background:linear-gradient(90deg,#765734,#f0d5a0 34%,#b99059 65%,#6a4a2b);border:1px solid #c9a56d;border-radius:3px;box-shadow:4px 5px 10px #24170bbb,-1px -1px 2px #ffe1a578}
.threshold-left i{right:17px}.threshold-right i{left:17px}
@media(max-width:820px) and (min-width:601px){.threshold-leaf:before{inset:14px}.threshold-leaf:after{left:18px;right:18px}.threshold-left span{font-size:10px;letter-spacing:.22em}.threshold-leaf i{width:7px}.threshold-left i{right:12px}.threshold-right i{left:12px}}
@media(max-width:600px){
  .hero-stage{--scene-clip:inset(43% 12% 9% 12% round 4px)}
  .threshold{top:43%;bottom:9%;left:12%;right:12%;perspective:800px}
  .threshold-frame{border-width:8px;border-bottom-width:6px;box-shadow:0 0 0 1px #efcf96a6,0 0 0 3px #302e27,0 15px 30px #0008,inset 0 0 0 1px #e7bf8255}
  .threshold-frame:before{inset:-7px}.threshold-frame:after{border-width:1px}
  .threshold-leaf{top:8px;bottom:6px}.threshold-left{left:8px;width:calc(50% - 8px)}.threshold-right{right:8px;width:calc(50% - 8px)}
  .threshold-leaf:before{inset:12px;box-shadow:inset 0 0 0 4px #281b140f}.threshold-leaf:after{top:17px;left:17px;right:17px}
  .threshold-leaf span{font-size:38px}.threshold-left span{font-size:10px;letter-spacing:.23em}
  .threshold-leaf i{height:78px;width:7px;border-radius:2px}.threshold-left i{right:11px}.threshold-right i{left:11px}
}
@media(max-width:360px){.threshold-leaf span{font-size:31px}.threshold-left span{font-size:9px}.threshold-leaf i{height:63px;top:59%}}
@media(prefers-reduced-motion:reduce){.threshold{will-change:auto}}
