/* ============ public site ============ */
.container{width:100%; max-width:var(--max); margin:0 auto; padding-inline:var(--pad);}
.section{padding-block:56px;}
.section + .section{border-top:1px solid var(--line);}
.kicker{font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--brass); font-weight:700; margin:0 0 12px;}
.h2{font-family:var(--display); font-weight:600; font-size:clamp(28px, 6.4vw, 44px); line-height:1.05;
  letter-spacing:-.02em; margin:0 0 18px; text-transform:lowercase;}
.lead{color:var(--ink-2); font-size:16px; line-height:1.6; margin:0; max-width:56ch;}
.muted{color:var(--muted);}

/* ---------- header ---------- */
.site-header{position:absolute; inset:0 0 auto 0; z-index:20;}
.site-header .bar{display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:64px;}
.wordmark{font-family:var(--display); font-weight:700; font-size:16px; letter-spacing:-.01em; text-decoration:none;
  text-transform:lowercase; display:inline-flex; align-items:baseline; gap:2px; text-shadow:0 1px 10px rgba(0,0,0,.45);}
.wordmark i{font-style:normal; color:var(--brass);}
.nav{display:none;}
.ig-pill{display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:600; color:var(--ink);
  border:1px solid rgba(255,255,255,.28); border-radius:999px; padding:7px 12px; text-decoration:none;
  background:rgba(0,0,0,.28);}
.ig-pill svg{width:15px; height:15px;}
.header-cta{display:none;}

/* ---------- hero (mobile: photo on top fading into the copy) ---------- */
.hero{position:relative; isolation:isolate;}
.hero > .container{display:flex; flex-direction:column; padding-inline:0;}
.hero-side{order:0; position:relative;}
.hero-side::after{content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(13,12,11,.62) 0%, rgba(13,12,11,0) 20%, rgba(13,12,11,0) 58%, rgba(13,12,11,.85) 86%, var(--bg) 100%);}
.hero-media{position:relative; aspect-ratio:390/450; overflow:hidden;}
.hero-media img{width:100%; height:100%; object-fit:cover; object-position:50% 30%;}
.hero-scrim{display:none;}
.hero-copy{order:1; position:relative; z-index:1; margin-top:-56px; padding:0 var(--pad) 36px;}
.eyebrow{display:inline-flex; align-items:center; gap:10px; color:var(--brass); font-size:12.5px; letter-spacing:.14em;
  text-transform:uppercase; font-weight:700; margin:0 0 14px;}
.eyebrow::before{content:""; width:22px; height:1px; background:currentColor;}
.hero h1{font-family:var(--display); font-weight:600; font-size:clamp(30px, 8.6vw, 72px); line-height:1.02;
  letter-spacing:-.025em; margin:0 0 16px; text-wrap:balance;}
.hero .lead{color:#e4ded3; margin-bottom:24px;}
.hero-ctas{display:flex; gap:10px; flex-wrap:wrap;}
.hero-meta{display:flex; flex-wrap:wrap; gap:8px 18px; margin:22px 0 0; padding:0; list-style:none; font-size:13px; color:var(--ink-2);}
.hero-meta li{display:inline-flex; align-items:center; gap:8px;}
.hero-meta svg{width:15px; height:15px; color:var(--brass); flex:none;}
.hero-caption{display:none;}

/* ---------- works ---------- */
.works-head{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:22px;}
.works-head .h2{margin:0;}
.link-arrow{display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:700; color:var(--ink-2);
  text-decoration:none; white-space:nowrap; border-bottom:1px solid var(--line-2); padding-bottom:3px;}
.link-arrow:hover{color:var(--ink); border-color:var(--brass);}
.works{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px; margin:0;}
.work{margin:0; position:relative; border-radius:10px; overflow:hidden; aspect-ratio:3/4; background:var(--surface);}
.work img{width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.2,1);}
.work figcaption{position:absolute; left:0; right:0; bottom:0; padding:28px 12px 10px; font-size:12px; font-weight:600;
  color:var(--ink); background:linear-gradient(180deg, transparent, rgba(0,0,0,.72)); opacity:0; transition:opacity .25s ease;}
.works-note{margin:14px 0 0; font-size:12.5px; color:var(--muted);}

/* ---------- approach ---------- */
.approach{display:grid; gap:26px;}
.approach-figure{display:none; margin:0;}
.who{display:flex; align-items:center; gap:14px; margin-bottom:20px;}
.who img{width:60px; height:60px; border-radius:50%; object-fit:cover; border:1.5px solid var(--brass); flex:none;}
.who b{display:block; font-size:17px; font-weight:800;}
.who span{display:block; font-size:13px; color:var(--muted);}
.quote{font-family:var(--display); font-weight:500; font-size:clamp(20px, 5.2vw, 30px); line-height:1.28;
  letter-spacing:-.015em; margin:0 0 18px; text-wrap:pretty;}
.quote::before{content:"«"; color:var(--brass);} .quote::after{content:"»"; color:var(--brass);}
.facts{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1px; margin:26px 0 0; padding:0;
  background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden;}
.facts div{background:var(--bg); padding:14px 12px;}
.facts dt{font-family:var(--display); font-weight:600; font-size:17px; color:var(--ink); white-space:nowrap;}
.facts dd{margin:4px 0 0; font-size:12px; color:var(--muted); line-height:1.35;}

/* ---------- prices ---------- */
.prices{display:grid; gap:22px;}
.price-list{list-style:none; margin:0; padding:0; border-top:1px solid var(--line);}
.price-list li{display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:baseline; gap:4px 16px;
  padding:18px 0; border-bottom:1px solid var(--line);}
.price-name{font-size:17px; font-weight:700;}
.price-dur{grid-column:1; font-size:13px; color:var(--muted);}
.price-val{grid-column:2; grid-row:1 / span 2; align-self:center; font-family:var(--display); font-weight:600; font-size:20px; color:var(--brass); white-space:nowrap;}
.price-val.req{font-family:var(--text); font-size:14px; font-weight:700; color:var(--ink-2);}
.prices .btn{justify-self:start;}

/* ---------- booking ---------- */
.booking-head{margin-bottom:24px;}
.booking-head .h2{margin-bottom:12px;}
.booker{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:18px; display:grid; grid-template-columns:minmax(0,1fr); gap:0;}
.booker-col{min-width:0;}
.booker-col + .booker-col{border-top:1px solid var(--line); padding-top:18px;}
#bookingForm.is-pending{display:none;}
.booker.is-done{grid-template-columns:minmax(0,1fr)!important;}
.booker.is-done .booker-col:first-child{display:none;}
.booker.is-done .booker-col + .booker-col{border:0; padding-top:0;}
.step{padding:6px 0 14px;}
.step + .step{border-top:1px solid var(--line); padding-top:18px;}
.step-head{display:flex; align-items:center; gap:10px; margin:0 0 12px; font-size:13px; font-weight:800; letter-spacing:.02em;}
.step-n{width:24px; height:24px; border-radius:50%; display:inline-grid; place-items:center; font-size:12px;
  border:1px solid var(--line-2); color:var(--muted); font-weight:800; flex:none;}
.step.done .step-n{background:var(--brass); border-color:var(--brass); color:var(--brass-ink);}
.step-value{margin-left:auto; font-weight:600; color:var(--muted); font-size:12.5px;}

.picks{display:flex; flex-wrap:wrap; gap:8px;}
.pick{appearance:none; cursor:pointer; text-align:left; border:1px solid var(--line); background:var(--surface-2);
  color:var(--ink-2); padding:10px 14px; border-radius:999px; min-height:46px; display:inline-flex; align-items:center; gap:8px;
  font-size:14px; font-weight:700; transition:border-color .15s ease, background .15s ease, color .15s ease;}
.pick-meta{font-weight:600; color:var(--muted); font-size:12.5px;}
.pick:hover{border-color:var(--line-2);}
.pick[aria-pressed="true"]{border-color:var(--brass); background:var(--brass-soft); color:var(--ink);}
.pick[aria-pressed="true"] .pick-meta{color:var(--brass);}

.cal-week{display:none;}
.days{display:flex; gap:8px; overflow-x:auto; padding:2px 2px 6px; margin:0 -2px; scrollbar-width:none; scroll-snap-type:x proximity;}
.days::-webkit-scrollbar{display:none;}
.day{appearance:none; flex:none; width:58px; min-height:68px; border-radius:12px; border:1px solid var(--line);
  background:var(--surface-2); color:var(--muted); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px;
  cursor:pointer; font-size:11.5px; font-weight:600; scroll-snap-align:start; transition:border-color .15s ease, background .15s ease;}
.day b{font-size:18px; font-weight:800; color:var(--ink); line-height:1.15;}
.day:hover{border-color:var(--line-2);}
.day[aria-pressed="true"]{border-color:var(--brass); background:var(--brass-soft);}
.day[aria-pressed="true"] b{color:var(--brass);}
.day:disabled{opacity:.28; cursor:default;}
.day.is-today span:first-child{color:var(--brass);}
.day-pad{display:none;}

.times{display:grid; grid-template-columns:repeat(auto-fill, minmax(76px, 1fr)); gap:8px;}
.time{appearance:none; cursor:pointer; min-height:46px; border-radius:var(--r-sm); border:1px solid var(--line);
  background:var(--surface-2); color:var(--ink); font-weight:700; font-size:15px; font-variant-numeric:tabular-nums;
  transition:border-color .15s ease, background .15s ease;}
.time:hover{border-color:var(--line-2);}
.time[aria-pressed="true"]{border-color:var(--brass); background:var(--brass); color:var(--brass-ink);}
.placeholder{margin:0; padding:16px; border:1px dashed var(--line-2); border-radius:var(--r-sm); color:var(--muted); font-size:13.5px; text-align:center;}
.skeleton{height:46px; border-radius:var(--r-sm); background:linear-gradient(90deg, var(--surface-2), var(--surface-3), var(--surface-2));
  background-size:200% 100%; animation:shimmer 1.1s linear infinite;}
@keyframes shimmer{to{background-position:-200% 0;}}

.summary{display:flex; flex-wrap:wrap; gap:4px 10px; align-items:baseline; margin:4px 0 14px; padding:12px 14px;
  background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-sm); font-size:14px;}
.summary b{font-weight:800;}
.summary .sum-price{margin-left:auto; color:var(--brass); font-weight:800;}
.form-foot .btn{width:100%;}
.fineprint{font-size:12px; color:var(--muted); margin:10px 0 0; text-align:center;}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}

.success{display:none; padding:8px 2px;}
.success.show{display:block;}
.success-icon{width:52px; height:52px; border-radius:50%; background:var(--brass); color:var(--brass-ink); display:grid; place-items:center; margin-bottom:16px;}
.success-icon svg{width:26px; height:26px;}
.success h3{font-family:var(--display); font-weight:600; font-size:24px; letter-spacing:-.015em; margin:0 0 6px; text-transform:lowercase;}
.success p{margin:0 0 18px; color:var(--ink-2);}
.ticket{list-style:none; margin:0 0 18px; padding:0; border:1px solid var(--line); border-radius:var(--r); overflow:hidden;}
.ticket li{display:flex; justify-content:space-between; gap:16px; padding:12px 14px; font-size:14px;}
.ticket li + li{border-top:1px solid var(--line);}
.ticket span{color:var(--muted);}
.ticket b{text-align:right; font-weight:700;}
.success-actions{display:flex; flex-wrap:wrap; gap:10px;}

/* ---------- visit ---------- */
.visit{display:grid; gap:24px;}
.visit-photo{margin:0; border-radius:var(--r); overflow:hidden; aspect-ratio:4/3;}
.visit-photo img{width:100%; height:100%; object-fit:cover;}
.place-name{font-size:13px; color:var(--muted); font-weight:600; margin:0 0 4px;}
.address{font-family:var(--display); font-weight:600; font-size:clamp(22px, 5.6vw, 34px); letter-spacing:-.02em; line-height:1.1; margin:0 0 18px;}
.hours{list-style:none; margin:0 0 22px; padding:0; max-width:360px;}
.hours li{display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid var(--line); font-size:15px;}
.hours li span:last-child{font-weight:700; font-variant-numeric:tabular-nums;}
.hours li.closed span:last-child{color:var(--muted); font-weight:600;}
.visit-actions{display:flex; flex-wrap:wrap; gap:10px;}
.langs{margin:18px 0 0; font-size:13.5px; color:var(--muted);}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line); padding-block:28px 40px;}
.site-footer .container{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 24px;}
.site-footer p{margin:0; font-size:12.5px; color:var(--muted);}
.site-footer a{color:var(--ink-2);}

/* mobile sticky CTA */
.mobile-cta{position:fixed; left:12px; right:12px; bottom:calc(12px + env(safe-area-inset-bottom)); z-index:30;
  transform:translateY(140%); transition:transform .25s ease; box-shadow:0 10px 30px rgba(0,0,0,.5);}
.mobile-cta.show{transform:none;}
.mobile-cta .btn{width:100%;}

/* ================= tablet ================= */
@media (min-width: 720px){
  .section{padding-block:80px;}
  .hero-media{aspect-ratio:auto; height:min(62vh, 620px);}
  .hero-media img{object-position:50% 22%;}
  .works{grid-template-columns:repeat(4, minmax(0,1fr)); gap:10px;}
  .work:nth-child(9){display:none;}
  .facts dt{font-size:20px;}
}

/* ================= desktop ================= */
@media (min-width: 1024px){
  body{font-size:16.5px;}
  .mobile-cta{display:none;}

  .site-header{position:sticky; inset:auto; top:0; background:rgba(13,12,11,.94); border-bottom:1px solid var(--line);}
  .site-header .bar{min-height:72px;}
  .wordmark{font-size:18px; text-shadow:none;}
  .nav{display:flex; gap:30px; margin-left:auto;}
  .nav a{font-size:14px; font-weight:600; color:var(--ink-2); text-decoration:none; padding:6px 0; border-bottom:1px solid transparent;}
  .nav a:hover{color:var(--ink); border-color:var(--brass);}
  .site-header .ig-pill{background:transparent; border-color:var(--line-2);}
  .header-cta{display:inline-flex; min-height:42px; padding:0 18px; font-size:14px;}

  .hero{min-height:auto; display:block; overflow:visible; padding-block:56px 72px;}
  .hero > .container{display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:64px; align-items:center; padding-inline:var(--pad);}
  .hero-side::after{display:none;}
  .hero-copy{padding:0; margin:0; order:1;}
  .hero h1{font-size:clamp(42px, 4.1vw, 60px); line-height:1.04; margin-bottom:22px;}
  .hero .lead{font-size:18px; color:var(--ink-2); margin-bottom:32px;}
  .hero-ctas .btn{min-height:54px; padding:0 28px;}
  .hero-meta{margin-top:40px; padding-top:22px; border-top:1px solid var(--line); gap:10px 28px; font-size:14px;}
  .hero-side{order:2; position:relative;}
  .hero-media{position:relative; inset:auto; z-index:auto; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:4/5; height:auto;
    box-shadow:0 30px 80px -30px rgba(0,0,0,.8);}
  .hero-media img{object-position:50% 30%;}
  .hero-caption{display:flex; justify-content:space-between; gap:12px; margin:14px 2px 0; font-size:12.5px; color:var(--muted);}
  .hero-caption b{color:var(--ink-2); font-weight:700;}

  .works{grid-template-columns:repeat(6, minmax(0,1fr)); gap:12px;}
  .work:nth-child(9){display:block;}
  .work--feature{grid-column:span 2; grid-row:span 2; aspect-ratio:auto;}
  .work figcaption{opacity:1; font-size:13px; padding:40px 16px 14px;}
  .work:hover img{transform:scale(1.035);}
  .works-note{display:none;}

  .approach{grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:72px; align-items:center;}
  .approach-figure{display:block; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:4/5;}
  .approach-figure img{width:100%; height:100%; object-fit:cover;}
  .quote{font-size:clamp(26px, 2.5vw, 34px);}
  .approach .lead{font-size:17px;}

  .prices{grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:72px; align-items:start;}
  .price-list li{padding:22px 0;}
  .price-name{font-size:19px;}
  .price-val{font-size:24px;}

  .booking-head{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:72px; align-items:end; margin-bottom:28px;}
  .booking-head .h2{margin:0;}
  .booker{grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0; padding:0; overflow:hidden;}
  .booker-col{padding:30px 32px;}
  .booker-col + .booker-col{border-top:0; border-left:1px solid var(--line); background:var(--bg-2); padding-top:30px;}
  #bookingForm.is-pending{display:block; opacity:.45; pointer-events:none;}
  .day span:first-child{display:none;}
  .day.is-today::after{content:""; width:4px; height:4px; border-radius:50%; background:var(--brass); margin-top:3px;}
  .picks{display:grid; gap:8px;}
  .pick{border-radius:var(--r-sm); justify-content:space-between; padding:14px 16px; font-size:15px;}
  .cal-week{display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:6px; margin-bottom:6px;
    font-size:11.5px; color:var(--faint); font-weight:700; text-align:center; text-transform:uppercase; letter-spacing:.06em;}
  .days{display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:6px; overflow:visible; padding:0; margin:0;}
  .day, .day-pad{width:auto; min-height:54px;}
  .day-pad{display:block;}
  .day b{font-size:16px;}
  .day span:last-child{display:none;}
  .day.month-start span:last-child{display:block; color:var(--brass);}
  .times{grid-template-columns:repeat(4, minmax(0,1fr));}
  .booker.is-done .booker-col + .booker-col{padding:44px 40px; background:var(--surface);}
  .booker.is-done .success{max-width:560px; margin:0 auto;}

  .visit{grid-template-columns:minmax(0,6fr) minmax(0,6fr); gap:72px; align-items:center;}
  .visit-photo{aspect-ratio:4/5; border-radius:var(--r-lg); order:2;}
}

@media (min-width: 1280px){
  .hero{padding-block:72px 96px;}
}
