:root{--cacao:#412e27;--cacao-dark:#2d201b;--cream:#f3e9df;--cream-soft:#e7d8ca;--line:rgba(243,233,223,.42)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cacao-dark);color:var(--cream);font-family:"DM Sans",sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{height:88px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:180px 1fr 180px;align-items:center;padding:0 42px;position:relative;z-index:20;background:var(--cacao-dark)}.brand{height:66px;width:66px;display:block}.brand img,.footer-brand img{height:100%;width:100%;object-fit:contain}.desktop-nav{justify-self:center;display:flex;gap:52px;text-transform:uppercase;font-size:12px;letter-spacing:.2em}.desktop-nav a{padding:35px 0 9px;position:relative}.desktop-nav a:after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--cream);transition:.25s}.desktop-nav a:hover:after,.desktop-nav a.active:after{right:0}.header-cta,.button{border:1px solid var(--cream);text-transform:uppercase;letter-spacing:.17em;font-size:12px;font-weight:600}.header-cta{justify-self:end;padding:16px 31px;background:var(--cream);color:var(--cacao)}.menu-toggle{display:none}
.hero{min-height:600px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:49% 51%;background:var(--cacao)}.hero-copy{padding:61px 6vw 44px;display:flex;flex-direction:column;align-items:flex-start}.eyebrow,.opening{text-transform:uppercase;letter-spacing:.28em;font-size:11px;font-weight:600}.hero-logo{width:min(330px,75%);height:210px;object-fit:cover;object-position:center;margin:10px 0 14px;mix-blend-mode:normal}.hero-intro{font-family:"Italiana",serif;font-size:23px;line-height:1.3;max-width:530px;margin:0 0 24px}.button{background:var(--cream);color:var(--cacao);padding:17px 25px;min-width:278px;display:flex;justify-content:space-between;transition:.2s}.button:hover,.header-cta:hover{background:transparent;color:var(--cream)}.opening{margin:20px 2px 0;font-size:10px}.hero-photo{background:url('assets/barre-lounge.jpg') center 34%/cover no-repeat}
.method{padding:40px 5.3vw 34px;background:var(--cacao-dark);border-bottom:1px solid var(--line)}.method-heading{display:grid;grid-template-columns:58% 42%;align-items:end}.method h1,.waitlist h2{font:400 clamp(48px,6vw,78px)/.98 "Italiana",serif;margin:14px 0 35px;color:var(--cream)}.method-heading>p{font:400 18px/1.4 "Italiana",serif;max-width:460px;margin:0 0 37px;padding-left:50px;border-left:1px solid var(--line)}.classes{display:grid;grid-template-columns:repeat(4,1fr)}.classes article{padding:0 34px;text-align:center;border-left:1px solid var(--line)}.classes article:first-child{border-left:0}.classes span{display:block;text-align:left;font-size:12px}.classes h2{font:400 27px/1.1 "Italiana",serif;margin:18px 0 8px}.classes p,.classes small{display:block;text-transform:uppercase;letter-spacing:.2em;font-size:11px}.classes small{margin-top:15px}
.stats{height:120px;display:grid;grid-template-columns:repeat(4,1fr);align-items:center;border-bottom:1px solid var(--line);background:var(--cacao-dark)}.stats div{text-align:center;border-left:1px solid var(--line)}.stats div:first-child{border-left:0}.stats strong{display:block;font:400 42px/1 "Italiana",serif}.stats span{display:block;margin-top:10px;text-transform:uppercase;letter-spacing:.2em;font-size:10px}
.waitlist{min-height:390px;display:grid;grid-template-columns:49% 51%;border-bottom:1px solid var(--line)}.waitlist-copy{padding:53px 5.5vw;background:var(--cacao-dark)}.waitlist h2{margin:14px 0 12px}.waitlist-copy>p:not(.eyebrow):not(.form-message){font:400 18px/1.4 "Italiana",serif;max-width:450px}.waitlist form{display:flex;max-width:470px;height:57px;margin-top:25px;border:1px solid var(--cream)}.waitlist input{flex:1;min-width:0;background:transparent;color:var(--cream);border:0;padding:0 21px;outline:none}.waitlist input::placeholder{color:var(--cream-soft)}.waitlist button{width:66px;border:0;border-left:1px solid var(--cream);color:var(--cacao);background:var(--cream);font-size:24px;cursor:pointer}.waitlist button:hover{background:transparent;color:var(--cream)}.form-message{font-size:12px!important;margin:9px 0 0}.waitlist-photo{background:url('assets/barre-class.jpg') center 60%/cover no-repeat}
footer{padding:24px 5.5vw 34px;background:var(--cacao-dark)}.footer-top{height:70px;display:grid;grid-template-columns:160px 1fr 160px;align-items:center;border-bottom:1px solid var(--line)}.footer-brand{width:56px;height:56px}.footer-top nav{justify-self:center;display:flex;gap:42px;text-transform:uppercase;font-size:10px;letter-spacing:.18em}.instagram{justify-self:end;text-transform:uppercase;font-size:11px;letter-spacing:.12em}.footer-bottom{display:grid;grid-template-columns:1fr 1fr 1fr;padding-top:25px;text-transform:uppercase;letter-spacing:.22em;font-size:10px;line-height:1.6}.footer-bottom p:nth-child(2){text-align:center}.footer-bottom p:last-child{text-align:right}.mobile-nav{display:none}
@media(max-width:850px){.site-header{height:74px;padding:0 20px;grid-template-columns:1fr auto}.brand{width:55px;height:55px}.desktop-nav,.header-cta{display:none}.menu-toggle{display:block;width:42px;height:42px;border:0;background:none;padding:10px}.menu-toggle span{display:block;height:1px;background:var(--cream);margin:7px 0;transition:.25s}.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(4px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-4px) rotate(-45deg)}.mobile-nav{position:fixed;z-index:15;inset:74px 0 auto;background:var(--cream);color:var(--cacao);padding:30px;display:flex;flex-direction:column;gap:24px;text-transform:uppercase;letter-spacing:.18em;font-size:12px;transform:translateY(-140%);transition:.3s}.mobile-nav.open{transform:none}.hero{grid-template-columns:1fr;min-height:auto}.hero-copy{padding:46px 24px}.hero-logo{width:250px;height:195px}.hero-intro{font-size:20px}.hero-photo{min-height:500px}.method{padding:42px 24px}.method-heading{grid-template-columns:1fr}.method-heading>p{padding:0;border:0;margin-bottom:40px}.classes{grid-template-columns:1fr 1fr;gap:35px 0}.classes article:nth-child(3){border-left:0}.stats{height:auto;grid-template-columns:1fr 1fr;padding:30px 0;gap:28px}.stats div:nth-child(3){border-left:0}.waitlist{grid-template-columns:1fr}.waitlist-copy{padding:50px 24px}.waitlist-photo{min-height:500px;grid-row:1}.footer-top{grid-template-columns:1fr auto}.footer-top nav{display:none}.footer-bottom{grid-template-columns:1fr 1fr}.footer-bottom p:nth-child(2){display:none}}
@media(max-width:520px){.hero-photo,.waitlist-photo{min-height:410px}.hero-logo{width:225px;height:175px}.classes{grid-template-columns:1fr}.classes article,.classes article:nth-child(3){border-left:0;border-top:1px solid var(--line);padding:25px 10px}.classes article:first-child{border-top:0}.classes span{text-align:center}.method h1,.waitlist h2{font-size:50px}.stats strong{font-size:34px}.stats span{font-size:8px}.button{min-width:100%}.footer-bottom{grid-template-columns:1fr}.footer-bottom p:last-child{text-align:left}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Motion and interaction layer */
body{overflow-x:hidden}
.reveal{opacity:0;transform:translateY(42px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.visible{opacity:1;transform:none}
.hero-copy>*{opacity:0;animation:heroIn .8s cubic-bezier(.2,.7,.2,1) forwards}
.hero-copy>*:nth-child(2){animation-delay:.12s}.hero-copy>*:nth-child(3){animation-delay:.22s}.hero-copy>*:nth-child(4){animation-delay:.32s}.hero-copy>*:nth-child(5){animation-delay:.42s}
.hero-photo{animation:photoIn 1.2s cubic-bezier(.2,.7,.2,1) both}
.button span{transition:transform .25s}.button:hover span{transform:translateX(7px)}
.classes article{transition:transform .3s,color .3s}.classes article:hover{transform:translateY(-7px);color:#fff}
@keyframes heroIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes photoIn{from{opacity:0;transform:scale(1.035)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}.hero-copy>*,.hero-photo{opacity:1;animation:none}}

/* Reference hero: one continuous photograph with a soft editorial blend. */
.hero{position:relative;isolation:isolate;display:block;min-height:clamp(600px,calc(100svh - 88px),760px);overflow:hidden;background:var(--cacao-dark)}
.hero::after{content:"";position:absolute;z-index:-2;inset:0 0 0 auto;width:68%;background:url('assets/barre-lounge.jpg') center 38%/cover no-repeat;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.16) 9%,rgba(0,0,0,.55) 20%,#000 36%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.16) 9%,rgba(0,0,0,.55) 20%,#000 36%)}
.hero::before{display:none}
.hero-copy{position:relative;width:48%;min-height:clamp(600px,calc(100svh - 88px),760px);padding:7.1vh 5.5vw 5vh;background:transparent}
.hero-logo{width:min(610px,100%);height:auto;margin:19px 0 22px;object-fit:contain;object-position:left center}
.hero-intro{max-width:650px;margin-bottom:30px;font-size:clamp(22px,1.55vw,30px);line-height:1.35}
.hero .button{min-width:min(414px,100%);padding:22px 30px;background:var(--cream);color:var(--cacao);border-color:var(--cream);font-size:13px}
.hero .button:hover{background:transparent;color:var(--cream)}
.hero .opening{margin-top:27px}
.hero-photo{display:none}

@media(max-width:850px){.hero{display:grid;grid-template-rows:auto auto;min-height:auto}.hero::after{position:relative;z-index:auto;inset:auto;width:100%;height:auto;min-height:500px;background-position:center;background-size:cover;-webkit-mask-image:none;mask-image:none}.hero-copy{width:100%;min-height:auto;padding:42px 30px;background:var(--cacao-dark)}.hero-logo{width:min(520px,100%);margin:16px 0 22px}.hero-intro{max-width:580px;font-size:21px}}
@media(max-width:520px){.hero::after{min-height:410px;background-position:59% center}.hero-copy{padding:38px 24px}.hero-logo{width:100%;margin:14px 0 20px}.hero .button{min-width:100%}}
