/* =========================================================================
   The Iceland Bathing Expedition — flagship event site
   Howl at the Moon Sauna Co. × Wandering Roots
   Brand: Epilogue (headings) + Poppins (body) · teal #3AA8C1 · gold #C8A44D
   Deep-night + cream editorial system. Body 18px min, big type by default.
   ========================================================================= */

/* ---------- Fonts ---------- */
@import url('https://fonts.googleapis.com/css2?family=Epilogue:wght@400;500;600;700&family=Poppins:wght@300;400;500;600&family=Pacifico&display=swap');

/* ---------- Tokens ---------- */
:root{
  --teal:#3AA8C1;        --teal-dk:#2b7f95;    --teal-deep:#0e2a30;
  --night:#0a1316;       --night-2:#101f24;    --ink:#152a30;
  --gold:#D8B038;        --gold-lt:#E6C558;   /* matched to Howl logo brass */
  --pink:#F93262;
  --cream:#FBF7EF;       --cream-2:#F4ECDD;    --paper:#FFFFFF;
  --muted:#5f6f73;       --muted-lt:rgba(233,238,241,.72);
  --line:rgba(20,40,45,.12);
  --maxw:1200px;         --radius:5px;
  --shadow-sm:0 2px 14px rgba(10,19,22,.08);
  --shadow-md:0 18px 50px rgba(10,19,22,.16);
  --shadow-lg:0 34px 90px rgba(10,19,22,.28);
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- Reset ---------- */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0; background:var(--cream); color:var(--ink);
  font-family:'Poppins',system-ui,sans-serif;
  font-size:18px; line-height:1.65; font-weight:400;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; height:auto; display:block;}
a{color:var(--teal-dk); text-decoration:none;}
a:hover{color:var(--teal);}
h1,h2,h3,h4{font-family:'Epilogue',serif; font-weight:600; line-height:1.12; color:var(--ink); margin:0 0 .5em; letter-spacing:-.01em;}
h1{font-size:clamp(2.6rem,6vw,4.6rem); font-weight:700;}
h2{font-size:clamp(2rem,3.8vw,3rem);}
h3{font-size:clamp(1.3rem,2vw,1.6rem);}
p{margin:0 0 1.1em;}
.script{font-family:'Pacifico',cursive; font-weight:400; letter-spacing:0;}

/* ---------- Layout ---------- */
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 clamp(20px,5vw,48px);}
.wrap.tight{max-width:820px;}
section{padding:clamp(64px,9vw,120px) 0; position:relative;}
.eyebrow{font-family:'Poppins',sans-serif; text-transform:uppercase; letter-spacing:.04em; font-size:.8rem; font-weight:600; color:var(--teal-dk); margin-bottom:16px;}
.section-cream{background:var(--cream-2);}
.section-paper{background:var(--paper);}
.section-night{background:var(--night); color:#eaf1f2;}
.section-night h1,.section-night h2,.section-night h3{color:#f4f7f7;}
.section-night .eyebrow{color:var(--gold-lt);}
.section-teal{background:linear-gradient(160deg,var(--teal-deep),var(--night));color:#eaf1f2;}
.section-teal h2,.section-teal h3{color:#fff;}
.section-teal .eyebrow{color:var(--gold-lt);}
.lead{font-size:clamp(1.25rem,2vw,1.55rem); line-height:1.5; color:var(--ink); font-weight:400;}
.muted{color:var(--muted);}
.center{text-align:center;}
.grid{display:grid; gap:clamp(20px,3vw,36px);}
.g2{grid-template-columns:repeat(2,1fr);}
.g3{grid-template-columns:repeat(3,1fr);}
.g4{grid-template-columns:repeat(4,1fr);}
.middle{align-items:center;}

/* ---------- Buttons ---------- */
.btn{display:inline-flex; align-items:center; gap:.5em; font-family:'Poppins',sans-serif;
  font-weight:600; font-size:1rem; letter-spacing:.01em; padding:15px 30px; border-radius:var(--radius);
  border:1.5px solid transparent; cursor:pointer; transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s,color .25s;}
.btn-primary{background:var(--teal); color:#fff; box-shadow:0 10px 26px rgba(58,168,193,.34);}
.btn-primary:hover{background:var(--teal-dk); color:#fff; transform:translateY(-2px); box-shadow:0 16px 34px rgba(58,168,193,.42);}
.btn-gold{background:var(--gold); color:#20160a; box-shadow:0 10px 26px rgba(200,164,77,.34);}
.btn-gold:hover{background:var(--gold-lt); color:#20160a; transform:translateY(-2px);}
.btn-ghost{background:transparent; color:var(--teal-dk); border-color:var(--teal);}
.btn-ghost:hover{background:var(--teal); color:#fff; transform:translateY(-2px);}
.btn-ghost-lt{background:transparent; color:#eaf1f2; border-color:rgba(234,241,242,.5);}
.btn-ghost-lt:hover{background:rgba(255,255,255,.12); color:#fff; border-color:#fff;}
.cta-row{display:flex; flex-wrap:wrap; gap:16px; margin-top:28px;}
.center .cta-row{justify-content:center;}

/* ---------- Header / nav ---------- */
.nav{position:fixed; top:0; left:0; right:0; z-index:100; display:flex; align-items:center; justify-content:space-between;
  padding:16px clamp(20px,5vw,48px); transition:background .35s var(--ease),box-shadow .35s var(--ease),padding .35s var(--ease);}
.nav.solid{background:rgba(10,19,22,.94); backdrop-filter:blur(10px); box-shadow:0 6px 24px rgba(0,0,0,.28); padding-top:11px; padding-bottom:11px;}
.nav-logo{display:flex; align-items:center; gap:12px;}
.nav-logo img{height:46px; width:auto; transition:height .35s var(--ease);}
.nav.solid .nav-logo img{height:40px;}
.nav-links{display:flex; align-items:center; gap:28px;}
.nav-links a{font-family:'Poppins',sans-serif; font-size:.94rem; font-weight:500; color:#f2f6f6; letter-spacing:.02em; opacity:.9; transition:opacity .2s;}
.nav-links a:hover{opacity:1; color:#fff;}
.nav-links a.on{color:var(--gold-lt); opacity:1;}
.nav-cta{padding:11px 22px; font-size:.92rem;}
.nav-toggle{display:none; background:none; border:0; cursor:pointer; padding:6px;}
.nav-toggle span{display:block; width:26px; height:2px; background:#fff; margin:5px 0; transition:.3s;}
.nav-scrim{position:fixed; inset:0; background:rgba(10,19,22,.6); opacity:0; visibility:hidden; transition:.3s; z-index:98;}

/* ---------- Hero ---------- */
.hero{position:relative; min-height:100svh; display:flex; align-items:center; justify-content:center; text-align:center; color:#fff; overflow:hidden;}
.hero-media{position:absolute; inset:0; z-index:0;}
.hero-media img,.hero-media video{width:100%; height:100%; object-fit:cover;}
.hero-scrim{position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,rgba(8,16,18,.42) 0%,rgba(8,16,18,.30) 40%,rgba(8,16,18,.72) 100%);}
.hero-scrim::after{content:""; position:absolute; inset:0; background:radial-gradient(120% 80% at 50% 20%,rgba(58,168,193,.20),transparent 60%);}
.hero-inner{position:relative; z-index:2; max-width:940px; padding:120px clamp(20px,5vw,40px) 90px;}
.hero-script{width:min(70vw,520px); margin:0 auto 8px; filter:drop-shadow(0 6px 30px rgba(0,0,0,.4));}
.hero .eyebrow{color:var(--gold-lt); letter-spacing:.05em;}
.hero h1{color:#fff; font-size:clamp(2.5rem,6.5vw,5rem); text-shadow:0 4px 40px rgba(0,0,0,.35); margin-bottom:.35em;}
.hero .sub{font-size:clamp(1.15rem,2.1vw,1.45rem); line-height:1.55; max-width:660px; margin:0 auto 8px; color:rgba(255,255,255,.92); font-weight:300;}
.hero .cta-row{justify-content:center;}
.hero-solo{font-size:1.02rem; line-height:1.5; color:#fff; font-weight:500; max-width:600px; margin:16px auto 0;
  padding:12px 20px; border-radius:999px; background:rgba(58,168,193,.22); border:1px solid rgba(216,176,56,.5);}
.hero-reassure{font-size:.92rem; color:rgba(255,255,255,.72); margin-top:20px;}
/* Hero deposit line (23 Aug). The price and the $999 deposit both sat ~44% down the page, where only
   about one visitor in six ever reached them — so five in six never learned the first step is $999
   rather than $6,600. Quieter than .hero-solo on purpose: it reassures, it does not shout a discount. */
.hero-deposit{font-size:1rem; line-height:1.5; color:#fff; font-weight:400; max-width:600px;
  margin:16px auto 0; padding:10px 18px; border-radius:999px;
  background:rgba(0,0,0,.28); border:1px solid rgba(255,255,255,.28);}
.hero-deposit b{font-weight:700;}
.hero-scroll{position:absolute; bottom:26px; left:50%; transform:translateX(-50%); z-index:2; color:rgba(255,255,255,.7); font-size:.75rem; letter-spacing:.2em; text-transform:uppercase; animation:bob 2.4s var(--ease) infinite;}
@keyframes bob{0%,100%{transform:translate(-50%,0);}50%{transform:translate(-50%,8px);}}

/* page hero (interior pages, shorter) */
.phero{position:relative; min-height:58svh; display:flex; align-items:flex-end; color:#fff; overflow:hidden;}
.phero-media{position:absolute; inset:0; z-index:0;}
.phero-media img{width:100%; height:100%; object-fit:cover;}
.phero::before{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,rgba(8,16,18,.35),rgba(8,16,18,.78));}
.phero .wrap{position:relative; z-index:2; padding-top:130px; padding-bottom:56px;}
.phero .eyebrow{color:var(--gold-lt);}
.phero h1{color:#fff; margin-bottom:.2em;}
.phero p{color:rgba(255,255,255,.9); max-width:60ch; font-size:1.15rem;}

/* ---------- Cards ---------- */
.card{background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:32px 28px; box-shadow:var(--shadow-sm); transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.card:hover{transform:translateY(-4px); box-shadow:var(--shadow-md);}
.section-night .card,.section-teal .card{background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.12); color:#eaf1f2;}
.section-night .card h3,.section-teal .card h3{color:#fff;}
.card .num{font-family:'Epilogue',serif; font-size:2.2rem; font-weight:700; color:var(--teal); line-height:1; margin-bottom:12px;}
.card p{margin:0; color:var(--muted); font-size:1rem;}
.section-night .card p{color:var(--muted-lt);}

/* ---------- Figure / captioned image ---------- */
figure.shot{margin:0; border-radius:16px; overflow:hidden; box-shadow:var(--shadow-md); position:relative; background:#0c1417;}
figure.shot img{width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease);}
figure.shot:hover img{transform:scale(1.04);}
figure.shot.tall img{aspect-ratio:4/5;}
figure.shot.wide img{aspect-ratio:16/10;}
figure.shot figcaption{position:absolute; left:0; right:0; bottom:0; padding:26px 20px 16px; color:#fff; font-size:.88rem;
  background:linear-gradient(0deg,rgba(8,16,18,.72),transparent); letter-spacing:.01em;}

/* ---------- Day-by-day timeline ---------- */
.days{margin-top:40px; display:grid; gap:28px;}
.day{display:grid; grid-template-columns:120px 1fr; gap:28px; align-items:start; padding-bottom:28px; border-bottom:1px solid var(--line);}
.day:last-child{border-bottom:0;}
.day .dnum{font-family:'Epilogue',serif;}
.day .dnum b{display:block; font-size:2.6rem; font-weight:700; color:var(--teal); line-height:1;}
.day .dnum span{display:block; font-size:.82rem; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); margin-top:6px;}
.day .dbody h3{margin-bottom:.35em;}
.day .dbody p{margin:0; color:var(--ink);}
.day .dtag{display:inline-block; margin-top:12px; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--teal-dk); background:rgba(58,168,193,.12); padding:5px 12px; border-radius:999px;}

/* ---------- Rooms ---------- */
.rooms{display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:36px;}
/* position:relative is REQUIRED here, not optional. .room-badge is absolutely
   positioned; without a positioned card it escapes to the nearest positioned
   ancestor and the "Only N left" chip renders OUTSIDE the card, at the top-left
   of the section. It used to be declared only on .room.soldout and .room.lastone,
   so SOLD OUT sat correctly while every AVAILABLE room's scarcity badge floated
   away — on /, /go, /book and /itinerary alike. Fixed 2026-08-20. */
.room{position:relative; background:var(--paper); border:1px solid var(--line); border-radius:14px; overflow:hidden; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.room:hover{transform:translateY(-4px); box-shadow:var(--shadow-md);}
.room img{aspect-ratio:4/3; object-fit:cover; width:100%;}
.room .rbody{padding:22px 20px; display:flex; flex-direction:column; flex:1;}
.room h3{font-size:1.15rem; margin-bottom:6px;}
.room .price{font-family:'Epilogue',serif; font-size:1.9rem; font-weight:700; color:var(--teal-dk); margin:6px 0 2px;}
.room .rmeta{font-size:.9rem; color:var(--muted); margin:0 0 14px;}
.room .btn{margin-top:auto;}

/* ---------- Testimonials ---------- */
.quotes{columns:3; column-gap:26px; margin-top:34px;}
.quote{break-inside:avoid; background:var(--paper); border:1px solid var(--line); border-left:3px solid var(--gold); border-radius:10px; padding:24px 24px; margin-bottom:26px; box-shadow:var(--shadow-sm);}
.quote p{font-size:1.05rem; line-height:1.55; color:var(--ink); margin:0 0 12px; font-style:italic;}
.quote .who{font-size:.84rem; color:var(--muted); font-style:normal; font-weight:500;}
.stars{color:var(--gold); letter-spacing:.1em;}

/* ---------- Include list ---------- */
.incl{list-style:none; padding:0; margin:26px 0 0; display:grid; grid-template-columns:1fr 1fr; gap:14px 34px;}
.incl li{position:relative; padding-left:32px; font-size:1.05rem;}
.incl li::before{content:"✦"; position:absolute; left:0; top:1px; color:var(--gold); font-size:1.1rem;}

/* ---------- For-you-if ---------- */
.fit{display:grid; grid-template-columns:1fr 1fr; gap:26px; margin-top:30px;}
.fit .col{background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:30px; box-shadow:var(--shadow-sm);}
.fit .col ul{list-style:none; padding:0; margin:14px 0 0;}
.fit .col li{padding:9px 0 9px 32px; position:relative; border-bottom:1px solid var(--line); font-size:1.02rem;}
.fit .col li:last-child{border-bottom:0;}
.fit .yes li::before{content:"✓"; position:absolute; left:0; color:var(--teal); font-weight:700;}
.fit .no li::before{content:"–"; position:absolute; left:2px; color:var(--muted); font-weight:700;}

/* ---------- Gallery ---------- */
.gallery{columns:3; column-gap:16px; margin-top:34px;}
.gallery figure{margin:0 0 16px; break-inside:avoid; border-radius:12px; overflow:hidden; box-shadow:var(--shadow-sm); position:relative;}
.gallery img{width:100%; transition:transform 1s var(--ease);}
.gallery figure:hover img{transform:scale(1.05);}
/* Real-footage video wall — uniform grid, always tiles clean (no masonry holes) */
.vidwall{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:26px;}
.vidwall figure{margin:0; border-radius:12px; overflow:hidden; box-shadow:var(--shadow-md); aspect-ratio:4/5; position:relative;}
.vidwall video{width:100%; height:100%; object-fit:cover; display:block; transition:transform 1s var(--ease);}
.vidwall figure:hover video{transform:scale(1.05);}
@media(max-width:900px){.vidwall{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.vidwall{grid-template-columns:1fr;}}

/* ---------- FAQ ---------- */
.faq details{border-bottom:1px solid var(--line); padding:6px 0;}
.faq summary{list-style:none; cursor:pointer; padding:18px 44px 18px 0; position:relative; font-family:'Epilogue',serif; font-weight:600; font-size:1.18rem; color:var(--ink);}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+"; position:absolute; right:6px; top:14px; font-size:1.7rem; color:var(--teal); font-weight:400; transition:transform .3s var(--ease);}
.faq details[open] summary::after{transform:rotate(45deg);}
.faq details p{margin:0 0 20px; color:var(--ink); max-width:70ch; font-size:1.02rem;}

/* ---------- Moon strip ---------- */
.mn-row{display:flex; flex-wrap:wrap; justify-content:center; gap:18px; margin:34px auto 0; max-width:900px;}
.mn{margin:0; display:flex; flex-direction:column; align-items:center; gap:9px; width:82px;}
.mn svg{width:62px; height:62px; filter:drop-shadow(0 0 12px rgba(244,236,221,.14));}
.mn-new{opacity:.6;}
.mn figcaption{display:flex; flex-direction:column; line-height:1.3; text-align:center;}
.mn-day{font-weight:600; font-size:1rem; color:#f3ecdd;}
.mn-date{font-size:.82rem; color:rgba(233,238,241,.6);}

/* ---------- CTA band ---------- */
.band{background:linear-gradient(160deg,var(--teal-deep),var(--night)); color:#fff; text-align:center;}
.band h2{color:#fff;}
.band p{color:rgba(255,255,255,.86); max-width:56ch; margin-left:auto; margin-right:auto;}

/* ---------- Sticky book bar ---------- */
.sticky{position:fixed; left:0; right:0; bottom:0; z-index:90; transform:translateY(110%); transition:transform .4s var(--ease);
  background:rgba(10,19,22,.96); backdrop-filter:blur(8px); border-top:1px solid rgba(255,255,255,.1);
  display:flex; align-items:center; justify-content:space-between; gap:18px; padding:14px clamp(18px,5vw,40px); flex-wrap:wrap;}
.sticky.show{transform:translateY(0);}
.sticky span{color:#eaf1f2; font-size:.95rem; font-weight:500;}

/* ---------- Footer ---------- */
footer.site{background:var(--night); color:#c9d4d6; padding:64px 0 40px;}
footer.site .fgrid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; margin-bottom:36px;}
footer.site img.flogo{height:64px; width:auto; margin-bottom:16px;}
footer.site h4{color:#fff; font-size:.86rem; text-transform:uppercase; letter-spacing:.05em; margin-bottom:16px;}
footer.site a{color:#c9d4d6; display:block; padding:5px 0; font-size:.96rem;}
footer.site a:hover{color:var(--gold-lt);}
footer.site .fbot{border-top:1px solid rgba(255,255,255,.1); padding-top:22px; font-size:.82rem; color:rgba(201,212,214,.6); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}

/* ---------- Reveal on scroll (no-JS safe: only hidden once body.js-anim is set) ---------- */
body.js-anim .reveal{opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease),transform .7s var(--ease);}
body.js-anim .reveal.in{opacity:1; transform:none;}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .g3,.g4,.rooms{grid-template-columns:1fr 1fr;}
  .quotes,.gallery{columns:2;}
  .fit{grid-template-columns:1fr;}
  footer.site .fgrid{grid-template-columns:1fr 1fr;}
}
@media(max-width:680px){
  body{font-size:17px;}
  .nav-links{position:fixed; top:0; right:0; height:100dvh; width:min(80vw,320px); flex-direction:column; align-items:flex-start;
    gap:8px; background:var(--night); padding:96px 32px 32px; transform:translateX(110%); transition:transform .35s var(--ease); z-index:99;}
  .nav-links.open{transform:none;}
  .nav-links a{font-size:1.1rem; padding:10px 0;}
  .nav-toggle{display:block; z-index:100;}
  .nav-scrim.open{opacity:1; visibility:visible;}
  .g2,.g3,.g4,.rooms{grid-template-columns:1fr;}
  .quotes,.gallery{columns:1;}
  .incl{grid-template-columns:1fr;}
  .day{grid-template-columns:1fr; gap:8px;}
  .day .dnum{display:flex; align-items:baseline; gap:12px;}
  .day .dnum b{font-size:1.8rem;}
  .day .dnum span{margin-top:0;}
  .phero{min-height:52svh;}
  /* Sharpen the first mobile screen: tighten hero spacing, trim the long paragraph,
     keep the solo-traveler reassurance + CTA above the fold (median mobile visit ~6s). */
  .hero-inner{padding:70px 20px 64px;}
  .hero-script{width:min(52vw,300px); margin-bottom:4px;}
  .hero h1{font-size:2.05rem; margin-bottom:.25em;}
  .hero-tagline{display:none;}
  .hero .sub{font-size:1rem; line-height:1.4;}
  .sub-more{display:none;}
  .hero-solo{font-size:.96rem; margin-top:14px; padding:10px 18px;}
  .hero-deposit{font-size:.94rem; margin-top:12px; padding:9px 16px;}
  .hero .cta-row{margin-top:18px;}
  .hero-reassure{margin-top:12px;}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none !important; scroll-behavior:auto;}
  .reveal{opacity:1; transform:none; transition:none;}
}

/* ============ PHOTO CAROUSELS (Experience + House) ============ */
.pcar-wrap{position:relative; margin-top:26px;}
.pcar{
  display:flex; gap:14px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  padding:4px 2px 6px;
  scrollbar-width:none;
}
.pcar::-webkit-scrollbar{display:none;}
.pcar figure{
  position:relative;
  flex:0 0 86%;
  max-width:640px;
  margin:0;
  scroll-snap-align:start;
  border-radius:14px;
  overflow:hidden;
  box-shadow:var(--shadow-sm);
  background:#e9eef0;
}
.pcar img,
.pcar video{
  display:block; width:100%;
  aspect-ratio:3/2;
  object-fit:cover;
}
.pcar figcaption{
  position:absolute; left:0; right:0; bottom:0;
  padding:30px 16px 13px;
  font-family:'Poppins',system-ui,sans-serif;
  font-size:.92rem; line-height:1.35; color:#fff;
  background:linear-gradient(to top,rgba(15,26,30,.74),rgba(15,26,30,0));
}
.pcar-btn{
  display:none;
  position:absolute; top:calc(50% - 20px); transform:translateY(-50%);
  z-index:5;
  width:46px; height:46px; border-radius:50%;
  border:0; cursor:pointer;
  background:rgba(255,255,255,.94); color:#1f2d33;
  font-size:1.5rem; line-height:1;
  box-shadow:0 3px 12px rgba(0,0,0,.2);
  align-items:center; justify-content:center;
  transition:background .2s var(--ease);
}
.pcar-btn:hover{background:#fff;}
.pcar-prev{left:-8px;}
.pcar-next{right:-8px;}
.pcar-count{
  margin-top:12px; text-align:center;
  font-family:'Epilogue',sans-serif;
  font-size:.78rem; letter-spacing:.16em;
  color:#8a97a0;
}
@media(min-width:760px){
  .pcar-btn{display:flex;}
  .pcar figure{flex-basis:56%;}
}
@media(min-width:1100px){
  .pcar figure{flex-basis:42%;}
}
/* Itinerary day-by-day as a carousel (reuses .pcar mechanics) */
.pcar.pcar-days figure{
  background:#fff;
  border:1px solid #e7ecee;
  padding:24px 24px 26px;
  display:flex; flex-direction:column;
}
.pcar.pcar-days .dnum{ display:flex; align-items:baseline; gap:12px; margin-bottom:12px; }
.pcar.pcar-days .dnum b{ font-family:'Epilogue',sans-serif; font-weight:800; font-size:2.1rem; color:var(--gold,#D8B038); line-height:1; }
.pcar.pcar-days .dnum span{ font-family:'Epilogue',sans-serif; letter-spacing:.1em; text-transform:uppercase; font-size:.82rem; color:#8a97a0; }
.pcar.pcar-days h3{ font-family:'Epilogue',sans-serif; font-size:1.3rem; margin:0 0 10px; line-height:1.2; }
.pcar.pcar-days p{ font-size:1.12rem; line-height:1.55; margin:0; color:#3a4a4e; }

/* Room availability badges (sold out / scarcity) — added for live availability */
.room.soldout{ position:relative; }
.room.soldout img{ filter:grayscale(.45) brightness(.82); }
.room-badge{ position:absolute; top:12px; left:12px; z-index:2;
  background:var(--ink); color:#fff; font-family:'Poppins',sans-serif; font-weight:600;
  font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; padding:6px 12px; border-radius:999px; }
.btn-soldout{ background:#c9d2d4; color:#5f6f73 !important; cursor:not-allowed; pointer-events:none; text-align:center; }
.room.lastone{ position:relative; }
.room-badge-left{ background:var(--gold); color:#3a2e05; }

/* A hidden element must actually be hidden: the browser's [hidden] rule loses to
   any class-based display declaration. The /qa page leaked its live Join button
   this exact way (2026-08-20). Keep this last. */
[hidden]{display:none !important;}

/* Hero framing on phones.
   The hero video is object-fit:cover, so a narrow viewport crops to the middle of
   the frame — which is exactly where the bather is, putting the headline on top of
   the person instead of the water. Shifting the crop window left keeps the copy
   over water and steam and leaves the bather readable at the right edge.
   Desktop is untouched: it has the width to show the whole frame. (2026-08-22) */
@media (max-width:760px){
  .hero-media img, .hero-media video{ object-position:30% 50%; }
}

/* Hero offer line (28 Aug). The ads promise "$1,000 off"; /go/ never carried that
   promise, so pointing them here would have broken it at the first screen. Styled
   warmer than .hero-deposit because this one IS the offer, but deliberately not
   louder than the email button - /go/ converts at 8-15% precisely because the email
   ask is the primary action, and /solo/ proved that demoting it costs everything. */
.hero-offer{font-size:1.02rem; line-height:1.5; color:#fff; font-weight:400; max-width:600px;
  margin:12px auto 0; padding:12px 20px; border-radius:999px;
  background:rgba(216,176,56,.20); border:1px solid rgba(216,176,56,.65);}
.hero-offer b{font-weight:700;}