/* ---------- TOKENS ---------- */
:root{
  --bg:#f7f7f6;
  --fg:#1e1e1e;
  --muted:#7a7a78;
  --border:#dcdcd8;
  --secondary:#efeeec;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',sans-serif;
  font-weight:300;
  background:var(--bg);
  color:var(--fg);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}

/* ---------- HELPERS ---------- */
.container{max-width:1280px;margin:0 auto;padding:0 1.5rem}
@media(min-width:1024px){.container{padding:0 3rem}}
.display{font-family:'Cormorant Garamond',serif;font-weight:300;letter-spacing:-.01em}
.italic,em{font-style:italic;font-weight:300}
.eyebrow{font-size:10px;letter-spacing:.25em;text-transform:uppercase}
.eyebrow-light{color:rgba(247,247,246,.6)}
.muted{color:var(--muted)}
.section{padding:7rem 1.5rem}
@media(min-width:768px){.section{padding:10rem 3rem}}

/* ---------- NAV ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:50;
  backdrop-filter:blur(12px);
  background:rgba(247,247,246,.7);
  border-bottom:1px solid rgba(220,220,216,.5);
}
.nav-inner{
  max-width:1280px;margin:0 auto;
  height:64px;padding:0 1.5rem;
  display:flex;align-items:center;justify-content:space-between;
}
@media(min-width:1024px){.nav-inner{padding:0 3rem}}
.logo{font-family:'Cormorant Garamond',serif;font-size:1.25rem}
.nav-links{display:none;gap:2.5rem;font-size:11px;letter-spacing:.25em;text-transform:uppercase}
@media(min-width:768px){.nav-links{display:flex}}
.nav-links a{transition:opacity .2s}
.nav-links a:hover{opacity:.6}
.nav-cta{
  font-size:11px;letter-spacing:.25em;text-transform:uppercase;
  border:1px solid var(--fg);padding:.5rem 1rem;transition:all .2s;
}
.nav-cta:hover{background:var(--fg);color:var(--bg)}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:100vh;display:flex;align-items:flex-end;padding-top:64px;overflow:hidden}
.hero-bg{position:absolute;inset:0;display:grid;grid-template-columns:1fr}
@media(min-width:768px){.hero-bg{grid-template-columns:7fr 5fr}}
.hero-bg-img{position:relative;background:var(--fg)}
.hero-bg-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(30,30,30,.6),transparent 60%)}
.hero-bg-blank{display:none;background:var(--bg)}
@media(min-width:768px){.hero-bg-blank{display:block}}

.hero-content{
  position:relative;width:100%;max-width:1280px;margin:0 auto;
  padding:0 1.5rem 4rem;display:grid;grid-template-columns:1fr;gap:1.5rem;
}
@media(min-width:768px){.hero-content{grid-template-columns:7fr 5fr;padding:0 3rem 6rem}}
.hero-left .eyebrow{color:rgba(247,247,246,.8);margin-bottom:1.5rem}
.hero-title{font-size:clamp(3.5rem,12vw,9rem);line-height:.9;color:var(--bg)}
.hero-right{display:flex;flex-direction:column;justify-content:flex-end}
@media(min-width:768px){.hero-right{padding-left:3rem}}
.hero-quote{border-left:1px solid rgba(30,30,30,.2);padding-left:1.5rem}
.hero-quote .eyebrow{margin-bottom:.75rem}
.hero-sub{font-size:clamp(1.25rem,2.2vw,1.875rem);line-height:1.3;margin-bottom:2rem}
.link-arrow{display:inline-flex;align-items:center;gap:.75rem;font-size:11px;letter-spacing:.25em;text-transform:uppercase}
.link-arrow span:first-child{border-bottom:1px solid var(--fg);padding-bottom:.25rem}
.link-arrow .arrow{transition:transform .2s}
.link-arrow:hover .arrow{transform:translateX(4px)}

.hero-foot-left,.hero-foot-right{
  position:absolute;bottom:1.5rem;font-size:10px;letter-spacing:.25em;text-transform:uppercase;
}
.hero-foot-left{left:1.5rem;color:rgba(247,247,246,.7)}
.hero-foot-right{right:1.5rem;color:var(--muted);display:none}
@media(min-width:768px){.hero-foot-left{left:3rem}.hero-foot-right{right:3rem;display:block}}

/* ---------- MARQUEE ---------- */
.marquee{border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:1.25rem 0;overflow:hidden}
.marquee-track{display:flex;gap:3rem;white-space:nowrap;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.5rem;animation:marquee 30s linear infinite}
@media(min-width:768px){.marquee-track{font-size:1.875rem}}
.marquee-group{display:flex;align-items:center;gap:3rem}
.marquee-dot{opacity:.3}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- PHILOSOPHY ---------- */
.philosophy{display:grid;grid-template-columns:1fr;gap:2rem}
@media(min-width:768px){.philosophy{grid-template-columns:repeat(12,1fr)}}
.col-4{grid-column:span 12}
.col-8{grid-column:span 12}
@media(min-width:768px){.col-4{grid-column:span 4}.col-8{grid-column:span 8}}
.h-lg{font-size:clamp(2rem,4vw,3.75rem);line-height:1.15;margin-bottom:2.5rem}
.h-xl{font-size:clamp(3rem,6vw,5rem);line-height:1}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;padding-top:2.5rem;border-top:1px solid var(--border)}
@media(min-width:768px){.stats{grid-template-columns:repeat(4,1fr)}}
.stat-num{font-size:clamp(1.875rem,3vw,2.5rem);margin-bottom:.5rem}

/* ---------- GALLERY ---------- */
.gallery-section{background:var(--fg);color:var(--bg);padding:7rem 0}
@media(min-width:768px){.gallery-section{padding:10rem 0}}
.gallery-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:4rem}
.gallery-head h2{margin-top:1rem}
.gallery-vol{display:none}
@media(min-width:768px){.gallery-vol{display:block}}
.gallery-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1rem}
@media(min-width:768px){.gallery-grid{gap:1.5rem}}
.gallery-item{position:relative;overflow:hidden}
.gallery-item img{width:100%;height:100%;object-fit:cover;filter:transition:transform .7s}
.gallery-item:hover img{transform:scale(1.05)}
.gallery-item figcaption{
  position:absolute;bottom:.75rem;left:.75rem;
  font-size:10px;letter-spacing:.25em;text-transform:uppercase;
  color:rgba(247,247,246,.9);mix-blend-mode:difference;
}
.g1{grid-column:span 6;aspect-ratio:4/5}
.g2{grid-column:span 6;aspect-ratio:4/5}
.g3{grid-column:span 12;aspect-ratio:3/5}
.g4{grid-column:span 7;aspect-ratio:16/10}
.g5{grid-column:span 5;aspect-ratio:4/5}
@media(min-width:768px){
  .g1{grid-column:span 5}
  .g2{grid-column:span 4;margin-top:6rem}
  .g3{grid-column:span 3}
  .g4{grid-column:span 7}
  .g5{grid-column:span 5}
}

/* ---------- SERVICES ---------- */
.services-head{display:grid;grid-template-columns:1fr;gap:2rem;margin-bottom:5rem}
@media(min-width:768px){.services-head{grid-template-columns:repeat(12,1fr)}}
.services-list{border-top:1px solid var(--fg)}
.service{
  display:grid;grid-template-columns:repeat(12,1fr);gap:1rem;
  padding:2.5rem .5rem;border-bottom:1px solid var(--border);
  transition:background .2s;
}
@media(min-width:768px){.service{gap:2rem;padding:3.5rem .5rem}}
.service:hover{background:rgba(239,238,236,.5)}
.service-n{grid-column:span 2;font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--muted);padding-top:.75rem}
.service-title{grid-column:span 10;font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(1.875rem,3.5vw,3rem);line-height:1.1}
.service-desc{grid-column:span 12;font-size:.875rem;line-height:1.6;color:var(--muted)}
.service-dur{grid-column:span 12;display:flex;align-items:flex-start;padding-top:.75rem;font-size:10px;letter-spacing:.25em;text-transform:uppercase}
@media(min-width:768px){
  .service-n{grid-column:span 1}
  .service-title{grid-column:span 5}
  .service-desc{grid-column:span 4}
  .service-dur{grid-column:span 2;justify-content:flex-end}
}

/* ---------- BOOKING ---------- */
.booking{position:relative;background:var(--fg);color:var(--bg);padding:7rem 0;overflow:hidden}
@media(min-width:768px){.booking{padding:10rem 0}}
.booking-grid{position:relative;z-index:10;display:grid;grid-template-columns:1fr;gap:2rem}
@media(min-width:768px){.booking-grid{grid-template-columns:7fr 5fr}}
.booking-right{display:flex;flex-direction:column;justify-content:flex-end;gap:2rem}
@media(min-width:768px){.booking-right{padding-left:3rem}}
.booking-text{font-size:1rem;color:rgba(247,247,246,.7);line-height:1.6}
.btn-outline-light{
  display:inline-flex;align-items:center;gap:.75rem;
  font-size:11px;letter-spacing:.25em;text-transform:uppercase;
  border:1px solid var(--bg);padding:1rem 1.5rem;width:fit-content;transition:all .2s;
}
.btn-outline-light:hover{background:var(--bg);color:var(--fg)}
.booking-bg-letter{
  position:absolute;bottom:-4rem;right:-4rem;
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:20rem;line-height:1;color:rgba(247,247,246,.05);
  pointer-events:none;user-select:none;display:none;
}
@media(min-width:768px){.booking-bg-letter{display:block}}

/* ---------- FOOTER ---------- */
.footer{border-top:1px solid var(--border)}
.footer-grid{padding:4rem 1.5rem;display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}
@media(min-width:768px){.footer-grid{grid-template-columns:5fr 3fr 2fr 2fr;padding:4rem 3rem}}
.footer-brand{grid-column:span 2}
@media(min-width:768px){.footer-brand{grid-column:span 1}}
.footer-logo{font-size:1.875rem}
.footer-h{margin-bottom:1rem}
.footer-list li{font-size:.875rem;margin-bottom:.5rem}
.footer-bottom{
  display:flex;flex-direction:column;gap:.5rem;
  padding:1.5rem;border-top:1px solid var(--border);
  font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--muted);
}
@media(min-width:768px){.footer-bottom{flex-direction:row;justify-content:space-between;padding:1.5rem 3rem}}