:root { --ink:#10100f; --bone:#f4f1e9; --paper:#fbfaf6; --muted:#716e66; --line:#d9d5ca; --orange:#ff5b35; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter,"Segoe UI",Arial,sans-serif; }
a { color:inherit; }
.nav-shell { position:sticky; top:0; z-index:20; height:78px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(22px,5vw,72px); background:rgba(251,250,246,.88); backdrop-filter:blur(18px); border-bottom:1px solid rgba(16,16,15,.08); }
.wordmark { display:flex; align-items:center; width:max-content; text-decoration:none; }.brand-logo { display:block; width:auto; height:32px; }.inverse .brand-logo { filter:invert(1); }
.nav-shell nav { display:flex; align-items:center; gap:32px; }.nav-shell nav a { text-decoration:none; font-size:12px; letter-spacing:.04em; }.nav-shell nav a:not(.nav-cta):hover { text-decoration:underline; text-underline-offset:5px; }
.nav-cta { display:flex; gap:28px; align-items:center; padding:13px 18px; background:var(--ink); color:white!important; text-transform:uppercase; font-size:9px!important; font-weight:800; letter-spacing:.13em!important; }
.hero { position:relative; height:calc(100vh - 78px); min-height:600px; overflow:hidden; background:#25241f; color:white; }.hero > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(10,10,9,.78) 0%,rgba(10,10,9,.35) 58%,rgba(10,10,9,.15)),linear-gradient(0deg,rgba(10,10,9,.5),transparent 55%); }
.hero-content { position:absolute; z-index:2; left:clamp(24px,8vw,125px); bottom:clamp(55px,10vh,110px); max-width:820px; }.overline { margin:0 0 19px; color:var(--orange); font-size:9px; font-weight:800; letter-spacing:.25em; }.overline.light { color:rgba(255,255,255,.65); }
.hero h1,.manifesto h2,.section-title h2,.process h2,.faq h2,.final-cta h2 { margin:0; font:400 clamp(53px,8vw,112px)/.83 Georgia,"Times New Roman",serif; letter-spacing:-.055em; }.hero h1 em,.manifesto h2 em,.final-cta h2 em { font-weight:400; color:var(--orange); }.hero-content > p:not(.overline) { max-width:570px; margin:27px 0 0; color:rgba(255,255,255,.78); font:17px/1.7 Georgia,serif; }.hero-actions { display:flex; align-items:center; gap:18px; margin-top:35px; flex-wrap:wrap; }.button { display:inline-flex; align-items:center; justify-content:center; gap:42px; min-height:54px; padding:0 24px; text-decoration:none; text-transform:uppercase; font-size:9px; font-weight:800; letter-spacing:.15em; transition:transform .2s,background .2s,color .2s; }.button:hover { transform:translateY(-2px); }.light-button { background:white; color:var(--ink); }.light-button:hover { background:var(--orange); color:white; }.outline-button { border:1px solid rgba(255,255,255,.75); color:white; }.outline-button:hover { background:white; color:var(--ink); }.text-link { color:white; text-underline-offset:6px; font-size:11px; }
.hero-index { position:absolute; right:clamp(25px,5vw,75px); bottom:50px; z-index:2; display:flex; align-items:flex-end; gap:15px; }.hero-index > span { font:italic 46px Georgia,serif; }.hero-index small { padding-bottom:7px; color:rgba(255,255,255,.55); font-size:7px; letter-spacing:.2em; line-height:1.5; }
.section-pad { padding:clamp(75px,11vw,160px) clamp(22px,7vw,110px); }.manifesto { display:grid; grid-template-columns:1fr 1fr; gap:clamp(50px,8vw,130px); max-width:1600px; margin:auto; }.manifesto h2,.section-title h2,.process h2,.faq h2 { font-size:clamp(42px,5.5vw,78px); line-height:.98; }.manifesto-copy > p { margin:24px 0 55px; max-width:650px; color:#4f4c45; font:20px/1.75 Georgia,serif; }.feature-row { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; border-top:1px solid var(--line); padding-top:25px; }.feature-row article b,.feature-row article span,.feature-row article small { display:block; }.feature-row article b { color:var(--orange); font-size:9px; letter-spacing:.15em; }.feature-row article span { margin-top:17px; font:17px Georgia,serif; }.feature-row article small { margin-top:7px; color:var(--muted); font-size:10px; }
.studios-section { background:var(--bone); }.section-title { max-width:1400px; margin:auto; display:flex; justify-content:space-between; align-items:end; gap:40px; }.section-title > p { max-width:360px; color:var(--muted); font:15px/1.7 Georgia,serif; }.editorial-grid { max-width:1400px; margin:80px auto 0; display:grid; grid-template-columns:repeat(2,1fr); align-items:start; gap:clamp(28px,6vw,90px); }.studio-story.offset { margin-top:130px; }.studio-image { position:relative; display:block; overflow:hidden; aspect-ratio:4/5; background:#ddd8cc; }.studio-image img { width:100%; height:100%; object-fit:cover; filter:saturate(.8); transition:transform .8s ease,filter .4s; }.studio-image:hover img { transform:scale(1.025); filter:saturate(1); }.image-tag { position:absolute; top:18px; left:18px; padding:8px 11px; background:rgba(255,255,255,.9); backdrop-filter:blur(8px); font-size:8px; font-weight:800; letter-spacing:.19em; }.studio-meta { display:flex; justify-content:space-between; align-items:start; gap:30px; margin-top:26px; }.studio-meta h3 { margin:0; font:400 clamp(28px,3vw,42px)/1 Georgia,serif; letter-spacing:-.035em; }.studio-meta p:not(.overline) { max-width:460px; margin:13px 0 0; color:var(--muted); font-size:12px; line-height:1.7; }.studio-rate { text-align:right; flex:0 0 auto; }.studio-rate small,.studio-rate strong,.studio-rate span { display:block; }.studio-rate small { color:var(--muted); font-size:8px; letter-spacing:.18em; }.studio-rate strong { margin-top:5px; font:26px Georgia,serif; }.studio-rate span { color:var(--muted); font-size:9px; }.amenities { display:flex; flex-wrap:wrap; gap:7px; margin-top:20px; }.amenities span { padding:6px 9px; border:1px solid #ccc6b9; color:#5f5b53; font-size:9px; }.studio-facts { display:flex; gap:20px; margin-top:17px; color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.08em; }.studio-actions { display:grid; grid-template-columns:1fr auto; align-items:center; margin-top:25px; border-top:1px solid #bfb9ad; border-bottom:1px solid #bfb9ad; }.studio-link { display:flex; justify-content:space-between; padding:16px 18px 16px 0; text-decoration:none; text-transform:uppercase; font-size:9px; font-weight:800; letter-spacing:.16em; }.studio-link:hover { color:var(--orange); }.quick-book { padding:16px 0 16px 18px; border-left:1px solid #bfb9ad; text-decoration:none; text-transform:uppercase; color:var(--orange); font-size:9px; font-weight:800; letter-spacing:.14em; }.image-skeleton { aspect-ratio:4/5; background:linear-gradient(110deg,#ddd8cc 20%,#ebe7de 40%,#ddd8cc 60%); background-size:200% 100%; animation:shine 1.4s infinite; }.image-skeleton.offset { margin-top:130px; }@keyframes shine { to{background-position-x:-200%;} }.load-error { grid-column:1/-1; }
.process { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(55px,10vw,150px); background:var(--ink); color:white; }.process ol { margin:0; padding:0; list-style:none; }.process li { display:grid; grid-template-columns:70px 1fr; gap:18px; padding:28px 0; border-top:1px solid rgba(255,255,255,.14); }.process li:last-child { border-bottom:1px solid rgba(255,255,255,.14); }.process li > span { color:var(--orange); font-size:9px; letter-spacing:.15em; }.process li b { font:26px Georgia,serif; }.process li p { margin:8px 0 0; color:rgba(255,255,255,.5); font-size:11px; }
.faq { max-width:1400px; margin:auto; display:grid; grid-template-columns:.7fr 1.3fr; gap:clamp(60px,10vw,160px); }.faq-list { border-top:1px solid var(--line); }.faq details { padding:24px 0; border-bottom:1px solid var(--line); }.faq summary { display:flex; justify-content:space-between; gap:30px; cursor:pointer; list-style:none; font:19px Georgia,serif; }.faq summary span { color:var(--orange); font:25px Arial; transition:transform .2s; }.faq details[open] summary span { transform:rotate(45deg); }.faq details p { max-width:650px; margin:14px 40px 0 0; color:var(--muted); font-size:12px; line-height:1.7; }
.final-cta { padding:clamp(80px,12vw,170px) 22px; text-align:center; color:white; background:#282722; }.final-cta h2 { font-size:clamp(52px,8vw,105px); }.final-cta .button { margin-top:40px; }
.detail-hero { position:relative; height:72vh; min-height:560px; overflow:hidden; color:white; background:#282722; }.detail-hero > img { width:100%; height:100%; object-fit:cover; }.detail-shade { position:absolute; inset:0; background:linear-gradient(0deg,rgba(10,10,9,.72),rgba(10,10,9,.06) 65%),linear-gradient(90deg,rgba(10,10,9,.38),transparent 60%); }.detail-title { position:absolute; left:clamp(22px,7vw,110px); bottom:clamp(45px,8vw,100px); max-width:900px; }.detail-title h1 { margin:0; font:400 clamp(54px,8vw,110px)/.85 Georgia,serif; letter-spacing:-.055em; }.detail-title > p:not(.overline) { max-width:650px; margin:20px 0 0; color:rgba(255,255,255,.78); font:16px/1.6 Georgia,serif; }.back-link { position:absolute; top:26px; left:clamp(22px,5vw,72px); color:white; text-decoration:none; text-transform:uppercase; font-size:8px; font-weight:800; letter-spacing:.15em; }
.detail-intro { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(55px,10vw,160px); max-width:1450px; margin:auto; }.detail-intro h2,.equipment-section h2,.rules-section h2,.detail-booking-cta h2 { margin:0; font:400 clamp(42px,5.5vw,76px)/.95 Georgia,serif; letter-spacing:-.045em; }.detail-copy > p { margin:24px 0 45px; color:#4f4c45; font:20px/1.75 Georgia,serif; }.detail-copy dl { display:grid; grid-template-columns:1fr 1fr; margin:0; border-top:1px solid var(--line); }.detail-copy dl div { padding:18px 0; border-bottom:1px solid var(--line); }.detail-copy dl div:nth-child(even) { padding-left:25px; border-left:1px solid var(--line); }.detail-copy dt { color:var(--muted); font-size:8px; text-transform:uppercase; letter-spacing:.15em; }.detail-copy dd { margin:7px 0 0; font:15px Georgia,serif; }
.equipment-section { display:grid; grid-template-columns:.7fr 1.3fr; gap:clamp(55px,10vw,150px); background:var(--bone); }.equipment-list { list-style:none; margin:0; padding:0; }.equipment-list li { display:grid; grid-template-columns:45px 1fr 1fr; gap:20px; align-items:center; padding:23px 0; border-top:1px solid #ccc7ba; }.equipment-list li:last-child { border-bottom:1px solid #ccc7ba; }.equipment-list span { color:var(--orange); font-size:8px; letter-spacing:.15em; }.equipment-list b { font:20px Georgia,serif; }.equipment-list p { margin:0; color:var(--muted); font-size:10px; }
.rules-section { max-width:1450px; margin:auto; display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(55px,10vw,150px); }.rules-heading > p:not(.overline) { max-width:420px; color:var(--muted); font:14px/1.7 Georgia,serif; }.rules-section ol { margin:0; padding:0; list-style:none; counter-reset:rules; }.rules-section li { counter-increment:rules; position:relative; padding:22px 0 22px 56px; border-top:1px solid var(--line); color:#48453f; font:16px/1.5 Georgia,serif; }.rules-section li:last-child { border-bottom:1px solid var(--line); }.rules-section li::before { content:counter(rules,decimal-leading-zero); position:absolute; left:0; top:25px; color:var(--orange); font:8px Arial,sans-serif; letter-spacing:.12em; }
.detail-booking-cta { display:flex; justify-content:space-between; align-items:end; gap:50px; padding:clamp(75px,10vw,140px) clamp(22px,7vw,110px); background:var(--ink); color:white; }.detail-booking-cta > div:last-child { text-align:right; }.detail-booking-cta > div:last-child p { color:#8c8981; font:18px Georgia,serif; }.detail-booking-cta .button { margin-top:12px; }.studio-error { min-height:70vh; padding:15vh 7vw; }.studio-error h1 { font:54px Georgia,serif; }.studio-error a { text-underline-offset:5px; }
footer { padding:60px clamp(22px,7vw,110px) 30px; display:grid; grid-template-columns:1fr 1fr auto; gap:40px; align-items:start; background:var(--ink); color:white; border-top:1px solid #33322e; }.inverse small { color:#77736c; }footer > p { max-width:340px; margin:0; color:#88847c; font:13px/1.65 Georgia,serif; }footer > div:nth-of-type(2) { display:flex; gap:25px; }footer > div a { color:#b5b1a9; text-decoration:none; font-size:10px; }footer > small { grid-column:1/-1; margin-top:35px; padding-top:20px; border-top:1px solid #2d2c28; color:#68655f; font-size:8px; letter-spacing:.12em; }
@media(max-width:850px){.nav-shell nav a:not(.nav-cta){display:none}.hero-index{display:none}.manifesto,.process,.faq,.detail-intro,.equipment-section,.rules-section{grid-template-columns:1fr}.manifesto-copy>p{margin-top:0}.editorial-grid{gap:25px}.studio-story.offset,.image-skeleton.offset{margin-top:70px}.section-title{display:block}.section-title>p{margin-top:20px}.process,.equipment-section,.rules-section{gap:55px}.detail-booking-cta{align-items:start;flex-direction:column}.detail-booking-cta>div:last-child{text-align:left}footer{grid-template-columns:1fr 1fr}footer>p{display:none}}
@media(max-width:580px){.nav-shell{height:68px}.nav-shell .brand-logo{height:22px}.nav-cta{gap:15px;padding:12px}.hero{height:calc(100svh - 68px);min-height:570px}.hero-content{left:22px;right:22px;bottom:55px}.hero h1{font-size:55px}.hero-content>p:not(.overline){font-size:14px}.hero-actions{align-items:flex-start;flex-direction:column}.section-pad{padding:75px 22px}.manifesto h2,.section-title h2,.process h2,.faq h2,.detail-intro h2,.equipment-section h2,.rules-section h2,.detail-booking-cta h2{font-size:44px}.manifesto-copy>p,.detail-copy>p{font-size:17px}.feature-row{grid-template-columns:1fr}.feature-row article{display:grid;grid-template-columns:28px 1fr;align-items:center}.feature-row article span{margin:0}.feature-row article small{grid-column:2}.editorial-grid{grid-template-columns:1fr;margin-top:50px}.studio-story.offset,.image-skeleton.offset{margin-top:25px}.studio-meta{display:block}.studio-rate{text-align:left;margin-top:18px}.studio-actions{grid-template-columns:1fr}.quick-book{border-left:0;border-top:1px solid #bfb9ad;padding-left:0}.process li b{font-size:21px}.faq{gap:45px}.detail-hero{height:68vh;min-height:500px}.detail-title h1{font-size:52px}.detail-copy dl{grid-template-columns:1fr}.detail-copy dl div:nth-child(even){padding-left:0;border-left:0}.equipment-list li{grid-template-columns:35px 1fr}.equipment-list p{display:none}footer{grid-template-columns:1fr}footer>div:nth-of-type(2){flex-wrap:wrap}}
