/* ---------- Hero (sticky, curtain scrolls over it) ---------- */
.hero{position:sticky;top:0;height:100svh;min-height:560px;background:var(--c-obsidian);color:var(--c-cream);overflow:hidden;z-index:0}
.hero__img{position:absolute;inset:0;transform:scale(1.2);will-change:transform}
.hero__img img{width:100%;height:100%;object-fit:cover;object-position:center}
/* Cream type needs a floor to sit on. A bottom scrim only, so the image stays open at the top. */
.hero__img::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(17,17,16,.18) 0%,rgba(17,17,16,0) 30%,rgba(17,17,16,.62) 100%)}
.hero__content{position:absolute;left:0;right:0;bottom:48px;padding:0 var(--pad-x);display:flex;flex-direction:column;align-items:center;gap:24px}
.hero__tagline{max-width:300px;text-align:center;color:var(--c-cream)}
.hero__kicker{color:var(--c-cream);opacity:.82;text-align:center}
.hero__title{width:100%;max-width:var(--container);min-width:0;text-align:center;font:200 min(10.6vw,180px)/1.05 var(--f-sans);letter-spacing:.16em;text-indent:.16em;text-transform:uppercase;color:var(--c-cream);overflow-wrap:break-word}
@media (max-width:1199.98px){.hero__content{bottom:36px}.hero__title{font-size:9.6vw}}
@media (max-width:809.98px){.hero__content{bottom:28px;gap:16px}.hero__tagline{max-width:220px}.hero__title{font-size:10.2vw;letter-spacing:.14em;text-indent:.14em}}

/* ---------- Scroller: the cream curtain ---------- */
.scroller{position:relative;z-index:2;background:var(--c-bg);padding-top:var(--gap-section);display:flex;flex-direction:column;gap:var(--gap-section)}
.sec{padding:0 var(--pad-x);display:flex;flex-direction:column;gap:var(--gap-inner)}
.sec__head{display:flex;flex-direction:column;gap:20px;max-width:var(--container);width:100%;margin:0 auto}
.sec__inner{max-width:var(--container);width:100%;margin:0 auto}

/* ---------- About ---------- */
.about{position:relative;isolation:isolate}
.about__text{max-width:800px;display:flex;flex-direction:column;gap:30px;position:relative;z-index:1}
.about__text p{max-width:min(600px,100%)}
.about__media{margin:0 calc(var(--pad-x) * -1);display:flex;justify-content:flex-end}
.about__media .img{flex:0 0 80%;aspect-ratio:1.778}
.about__mark{position:absolute;bottom:0;left:var(--pad-x);height:820px;width:auto;color:var(--c-light);opacity:.3;pointer-events:none;z-index:-1}
@media (max-width:1199.98px){.about__text{max-width:600px}.about__media .img{aspect-ratio:auto;height:365px}.about__mark{height:560px}}
@media (max-width:809.98px){.about__text{gap:14px}.about__media .img{height:198px}.about__mark{height:320px;top:44%;bottom:auto}}

/* ---------- Pillar cards ---------- */
.pillars__list{max-width:1660px;width:100%;margin:0 auto;display:flex;flex-direction:column;gap:var(--gap-list)}
.pillar{display:flex;gap:20px;position:relative;isolation:isolate}
.pillar__text{flex:1;display:flex;flex-direction:column;gap:20px;position:relative;padding-bottom:330px;z-index:2}
.pillar__text .h4{max-width:min(250px,100%)}
.pillar__text p{max-width:min(350px,100%)}
.pillar__small{position:absolute;left:0;bottom:0;width:70%;height:300px;z-index:2}
.pillar__main{flex:1.5;aspect-ratio:1.178;z-index:1}
.pillar__mark{position:absolute;top:58%;left:49%;height:460px;width:auto;color:var(--c-light);opacity:.22;pointer-events:none;z-index:-1}
@media (max-width:1199.98px){
  .pillar{flex-direction:column;gap:22px}
  .pillar__main{order:-1;aspect-ratio:auto;height:688px;flex:none}
  .pillar__text{padding-bottom:0}
  .pillar__small{position:relative;width:70%;height:300px;margin-top:10px}
  .pillar__mark{display:none}
}
@media (max-width:809.98px){.pillar{gap:14px}.pillar__main{height:331px}.pillar__small{height:220px}}

/* ---------- Services (numbered rows) ---------- */
.services__rows{display:flex;flex-direction:column;gap:20px;max-width:var(--container);width:100%;margin:0 auto}
.srow{display:flex;gap:50px;padding-top:20px;border-top:1px solid var(--c-rule);background:var(--c-bg);position:relative}
.srow:nth-child(1){z-index:1}.srow:nth-child(2){z-index:2}.srow:nth-child(3){z-index:3}.srow:nth-child(4){z-index:4}
.srow__title{flex:1.2;display:flex;gap:50px;align-items:flex-start}
.srow__num{min-width:24px}
.srow__body{flex:2;display:flex;gap:50px;align-items:flex-start}
.srow__body p{flex:1;max-width:min(400px,100%)}
.srow__img{flex:1;aspect-ratio:1.55}
.services__outro{display:flex;flex-direction:column;align-items:center;text-align:center;gap:30px;max-width:var(--container);width:100%;margin:0 auto}
.services__outro .h5{max-width:min(620px,100%);padding-top:40px;font-style:italic}
@media (max-width:1199.98px){
  .srow{flex-direction:column;gap:30px}
  .srow__body{flex-direction:column;align-items:stretch}
  .srow__img{aspect-ratio:auto;height:252px;width:100%}
}
@media (max-width:809.98px){.srow{gap:14px}.srow__title{gap:20px}.srow__body{gap:14px}.services__outro{gap:20px}}

/* ---------- Banner (full-bleed, dark) ---------- */
.banner{position:relative;background:var(--c-obsidian);color:var(--c-cream);overflow:hidden}
.banner__img{position:relative;aspect-ratio:1.6;overflow:hidden}
.banner__img img{position:absolute;top:0;left:0;width:100%;height:105%;object-fit:cover;will-change:transform}
.banner__img::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(17,17,16,.3) 0%,rgba(17,17,16,.06) 38%,rgba(17,17,16,.6) 100%)}
.banner__blur{position:absolute;left:0;right:0;bottom:0;height:25%;pointer-events:none}
.banner__blur i{position:absolute;inset:0;backdrop-filter:blur(var(--b));-webkit-backdrop-filter:blur(var(--b));-webkit-mask-image:linear-gradient(to bottom,transparent var(--m0),#000 var(--m1));mask-image:linear-gradient(to bottom,transparent var(--m0),#000 var(--m1))}
.banner__blur i:nth-child(1){--b:2px;--m0:0%;--m1:40%}
.banner__blur i:nth-child(2){--b:6px;--m0:30%;--m1:70%}
.banner__blur i:nth-child(3){--b:14px;--m0:60%;--m1:100%}
.banner__words{position:absolute;inset:0;display:flex;align-items:center;padding:0 var(--pad-x);pointer-events:none}
.banner__words span{flex:1;font:200 var(--fs-h2)/1.15 var(--f-sans);letter-spacing:var(--ls-display);text-transform:uppercase;color:var(--c-cream);opacity:.8}
.banner__words span:nth-child(2){text-align:center}
.banner__words span:nth-child(3){text-align:right}
.banner__foot{position:absolute;left:var(--pad-x);right:var(--pad-x);bottom:50px;display:flex;justify-content:space-between;align-items:flex-end;gap:30px}
.banner__foot .h4{max-width:min(600px,100%)}
@media (max-width:1199.98px){.banner__img{aspect-ratio:auto;height:507px}.banner__foot .h4{max-width:500px}}
@media (max-width:809.98px){
  .banner__img{height:auto;aspect-ratio:.867;min-height:450px}
  .banner__words{flex-direction:column;justify-content:center;align-items:flex-start;gap:0}
  .banner__words span{flex:none}
  .banner__words span:nth-child(2),.banner__words span:nth-child(3){text-align:left}
  .banner__foot{bottom:20px;flex-direction:column;align-items:flex-start;gap:20px}
  .banner__foot .h4{max-width:390px}
}

/* ---------- Activities (sticky image + hover list) ---------- */
.activities__grid{display:flex;gap:50px;align-items:flex-start;max-width:var(--container);width:100%;margin:0 auto}
.activities__media{flex:1;position:sticky;top:100px;aspect-ratio:.75;max-height:70vh;overflow:hidden}
.activities__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s ease}
.activities__media img.is-active{opacity:1}
.activities__list{flex:1.5;display:flex;flex-direction:column}
.activity{padding:40px 0;border-bottom:1px solid var(--c-rule);color:var(--c-light);transition:color .4s ease;cursor:default}
.activity.is-active{color:var(--c-obsidian)}
.activity .h3{color:inherit}
.activities__outro{padding-top:var(--gap-inner);display:flex;flex-direction:column;gap:30px}
.activities__outro p{max-width:min(350px,100%)}
@media (max-width:1199.98px){.activities__grid{gap:30px}.activities__media{aspect-ratio:auto;height:363px;max-height:none}.activities__outro{padding-top:60px}}
@media (max-width:809.98px){.activities__grid{flex-direction:column}.activities__media{position:relative;top:0;width:100%;height:363px}.activity{padding:20px 0}.activities__outro{padding-top:30px;gap:20px}.activities__outro p{max-width:300px}}

/* ---------- Gallery slideshow ---------- */
.gallery{padding:0;gap:var(--gap-inner);overflow:hidden}
.gallery .sec__head{padding:0 var(--pad-x)}
.gallery .sec__head p{max-width:min(500px,100%)}
.slideshow{position:relative;width:100%;display:flex;justify-content:center}
.slideshow__viewport{width:36%;position:relative}
.slideshow__track{display:flex;gap:10px;will-change:transform;transition:transform .8s var(--ease-expo);cursor:grab}
.slideshow__track.is-dragging{transition:none;cursor:grabbing}
.slide{flex:0 0 100%;aspect-ratio:1.21;overflow:hidden;user-select:none}
.slide img{pointer-events:none}
.slideshow__btn{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;background:rgba(17,17,16,.28);color:var(--c-cream);display:flex;align-items:center;justify-content:center;z-index:2;transition:background .3s}
.slideshow__btn:hover{background:rgba(17,17,16,.5)}
.slideshow__btn--prev{left:20px}.slideshow__btn--next{right:20px}
.slideshow__btn svg{width:16px;height:16px}
@media (max-width:1199.98px){.slideshow__viewport{width:50%}}
@media (max-width:809.98px){.slideshow__viewport{width:90%}}

/* ---------- Reserve / Apply block ---------- */
.reserve{position:relative;z-index:2;background:var(--c-bg);margin-top:var(--gap-section);overflow:hidden}
.reserve__img{aspect-ratio:1.5;overflow:hidden;filter:brightness(.8);position:relative}
.reserve__img img{position:absolute;top:0;left:0;width:100%;height:105%;object-fit:cover;will-change:transform}
.reserve__wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:0 var(--pad-x)}
.reserve__card>*{max-width:100%}
.reserve__card{width:100%;max-width:min(800px,100%);min-width:0;min-height:600px;padding:60px;background:var(--c-cream);color:var(--c-obsidian);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:30px}
.reserve__card .h2{max-width:100%}
.reserve__card p{max-width:min(450px,100%)}
@media (max-width:1199.98px){.reserve__img{aspect-ratio:auto;height:540px}.reserve__card{max-width:min(600px,100%);min-height:400px}}
@media (max-width:809.98px){.reserve__img{height:auto;aspect-ratio:.78;min-height:450px}.reserve__card{min-height:300px;padding:30px;gap:20px}}
