/* Immersive hero: original project photography, accessible HTML copy. */
.hero--immersive{position:relative;isolation:isolate;display:block;max-width:none;overflow:hidden;background:#132f2e}
.hero--immersive .hero-visual{position:absolute;inset:0;z-index:-2;margin:0;overflow:hidden;background:#193d3c}
.hero--immersive .hero-visual img{width:100%;height:100%;min-height:0;aspect-ratio:auto;object-fit:cover;object-position:center 44%}
.hero--immersive::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(9,28,29,.93) 0%,rgba(12,31,31,.79) 31%,rgba(13,32,32,.56) 51%,rgba(13,32,32,.10) 76%,rgba(13,32,32,.04) 100%),linear-gradient(0deg,rgba(8,25,25,.75),transparent 36%)}
.hero--immersive .hero-copy{position:relative;display:flex;align-items:flex-start;justify-content:center;min-height:760px;min-height:clamp(760px,calc(100svh - 104px),940px);padding:66px max(56px,calc((100vw - 1248px)/2)) 76px;width:100%;gap:0}
.hero--immersive .eyebrow{font-size:12px;letter-spacing:.13em;color:var(--champagne);margin:0}
.hero--immersive .fine-rule{width:120px;margin:23px 0 28px;background:linear-gradient(90deg,var(--gold) 0 88%,#d7ad6e40 88%)}
.hero--immersive .hero-project{font-size:13px;letter-spacing:.29em;text-transform:uppercase;color:var(--gold);margin:0 0 22px}
.hero--immersive h1{font-size:clamp(48px,4.45vw,72px);line-height:1.2;letter-spacing:-.035em;font-weight:400;color:#f2dfbc;max-width:850px;text-wrap:initial}
.hero--immersive .hero-intro{font-size:16px;line-height:1.85;color:#f6f1e7;max-width:660px;margin:32px 0 0;text-wrap:pretty}
.hero--immersive .hero-actions{display:flex;flex-direction:row;flex-wrap:wrap;gap:16px;margin:30px 0 0;align-items:stretch;width:auto}
.hero--immersive .button{min-height:58px;padding:15px 26px;font-size:15px;gap:20px;border-radius:2px}
.hero--immersive .button-gold{background:linear-gradient(110deg,#e9c37d,#d7ad6e);color:#193d3c;border:1px solid #ebcb91}
.hero--immersive .button-gold:hover{background:#e9cd92}
.hero--immersive .button-outline{border:1px solid #d7ad6e;background:#102c2c66;color:#f0d6a6;font-size:13px;text-transform:uppercase;letter-spacing:.035em}
.hero--immersive .button-outline:hover{background:#193d3cd9;color:#fff}
.hero-facts{display:grid;grid-template-columns:106px 130px 158px 218px;gap:0;margin:54px 0 0;color:#f0d6a6}
.hero-facts>div{display:flex;flex-direction:column;position:relative;padding:0 22px;text-align:center;justify-content:flex-start}
.hero-facts>div:first-child{padding-left:0}
.hero-facts>div+div::before{content:"";position:absolute;left:0;top:16px;bottom:12px;width:1px;background:#d7ad6e80}
.hero-facts dd{order:-1;margin:0 0 8px;font:500 35px/1.2 var(--serif);white-space:nowrap;letter-spacing:-.025em}
.hero-facts dd>span{font-size:25px}
.hero-facts dt{font-size:11px;line-height:1.7;text-transform:uppercase;color:#f6eedf}
.hero-facts .hero-fact-price{padding-right:0}
.hero-fact-price dt{font-weight:500;font-size:12px}
.hero-fact-price dt>span{display:block;font-size:10px;font-weight:400;text-transform:none;white-space:nowrap}
.hero--immersive .hero-visual figcaption{position:absolute;right:28px;bottom:20px;background:#102c2ce6;color:#e3e9e2;padding:7px 12px;font-size:10px;letter-spacing:.025em;margin:0}
@media(min-width:1600px){.hero--immersive .hero-copy{padding-left:max(80px,calc((100vw - 1440px)/2))}}
@media(min-width:768px) and (max-width:1100px){.hero--immersive .hero-copy{padding-inline:40px;min-height:760px}.hero--immersive h1{font-size:52px}.hero--immersive .hero-visual img{object-position:65% center}.hero--immersive::before{background:linear-gradient(90deg,#091c1ded,rgba(12,31,31,.76) 55%,rgba(12,31,31,.2)),linear-gradient(0deg,#081919aa,transparent 40%)}.hero--immersive .hero-intro{max-width:570px}.hero--immersive .button{padding-inline:22px}}
@media(max-width:767px){.hero--immersive .hero-copy{padding:40px 24px 62px;min-height:790px;justify-content:flex-start}.hero--immersive .hero-visual img{height:100%;object-fit:cover;object-position:58% center}.hero--immersive::before{background:linear-gradient(90deg,rgba(9,28,29,.91),rgba(9,28,29,.6)),linear-gradient(0deg,rgba(9,28,29,.85),rgba(9,28,29,.06) 80%)}.hero--immersive .eyebrow{font-size:10px;letter-spacing:.09em}.hero--immersive .fine-rule{margin:20px 0 25px;width:90px}.hero--immersive .hero-project{font-size:11px;letter-spacing:.24em;margin:0 0 20px}.hero--immersive h1{font-size:clamp(34px,8.8vw,48px);line-height:1.24;max-width:100%;letter-spacing:-.04em}.hero--immersive .hero-intro{font-size:16px;line-height:1.8;margin-top:24px;max-width:480px}.hero-desktop-break{display:none}.hero--immersive .hero-actions{margin-top:26px;flex-direction:column;gap:12px;width:100%}.hero--immersive .button{font-size:15px;min-height:54px;padding:13px 16px;gap:16px;width:100%}.hero--immersive .button-outline{font-size:12px}.hero-facts{grid-template-columns:1fr 1fr;row-gap:22px;width:100%;max-width:460px;margin-top:32px}.hero-facts>div{padding:0 12px}.hero-facts>div:first-child{padding-left:12px}.hero-facts>div:nth-child(3)::before{display:none}.hero-facts>div:nth-child(n+3){padding-top:16px;border-top:1px solid #d7ad6e40}.hero-facts>div:nth-child(4)::before{top:28px}.hero-facts dd{font-size:31px;margin-bottom:6px}.hero-facts dd>span{font-size:22px}.hero-facts dt{font-size:10px}.hero-fact-price dt>span{white-space:normal;font-size:10px}.hero--immersive .hero-visual figcaption{right:auto;left:24px;bottom:18px;font-size:9px;padding:0;background:transparent;color:#d4ded7}.hero--immersive .hero-fact-price{padding-right:0}}

.hero--immersive .hero-visual picture{display:block;width:100%;height:100%}
/* Mobile: show the project photograph first, followed by a separate text panel. */
@media(max-width:767px){
 .hero--immersive{display:flex;flex-direction:column;background:var(--green)}
 .hero--immersive::before{display:none}
 .hero--immersive .hero-visual{position:relative;inset:auto;z-index:auto;order:0;width:100%;flex:none;overflow:hidden}
 .hero--immersive .hero-visual picture{height:auto}
 .hero--immersive .hero-visual img{display:block;width:100%;height:auto;min-height:0;aspect-ratio:1304/1292;object-fit:contain;object-position:center}
 .hero--immersive .hero-visual figcaption{left:auto;right:12px;bottom:12px;max-width:calc(100% - 24px);padding:6px 10px;background:#102c2ee6;color:#fff;font-size:9px}
 .hero--immersive .hero-copy{order:1;min-height:0;padding:36px 24px 42px;background:var(--green)}
}