/* ============================================================
   ZOOMATIC VISUALS — "The Noir Edition"
   Luxury editorial design system · matte black / warm cream / gold
   ============================================================ */
:root{
  --ink:      #0C0A07;
  --coal:     #17130E;
  --coal-2:   #201A12;
  --cream:    #F1EBDF;
  --cream-2:  #E8E0CF;
  --gold:     #C7A25C;
  --gold-hi:  #E7CD8F;
  --gold-lo:  #8E7038;
  --mist:     rgba(241,235,223,.84);
  --mist-2:   rgba(241,235,223,.68);
  --ink-mut:  rgba(12,10,7,.72);
  --ink-mut2: rgba(12,10,7,.58);
  --hair:     rgba(199,162,92,.28);
  --hair-d:   rgba(241,235,223,.12);
  --hair-l:   rgba(12,10,7,.16);
  --serif: "Didot","Bodoni 72","Bodoni MT","Playfair Display",Georgia,serif;
  --sans: "Helvetica Neue",Helvetica,Arial,sans-serif;
  --gold-metal: linear-gradient(105deg,#8E7038 0%,#E7CD8F 38%,#C7A25C 55%,#9A7B41 82%,#C7A25C 100%);
  --pad: clamp(20px, 5vw, 72px);
}
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; overflow-x:clip; }
body{
  background:var(--ink);
  color:var(--cream);
  font-family:var(--sans);
  font-weight:300;
  font-size:15px;
  line-height:1.7;
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{ background:var(--gold); color:var(--ink); }
a{ color:inherit; text-decoration:none; }
img,svg{ max-width:100%; display:block; }
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

/* film grain over everything */
body::after{
  content:""; position:fixed; inset:-50%; z-index:2000; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
  opacity:.05; mix-blend-mode:overlay;
}

.skip{
  position:fixed; top:-60px; left:24px; z-index:3000;
  background:var(--gold); color:var(--ink); padding:10px 18px;
  font:600 11px/1 var(--sans); letter-spacing:.18em; text-transform:uppercase;
  transition:top .25s ease;
}
.skip:focus-visible{ top:16px; }

/* ---------- utility type ---------- */
.eyebrow{
  font:600 10.5px/1 var(--sans);
  letter-spacing:.34em; text-transform:uppercase;
  color:var(--gold);
  display:flex; align-items:center; gap:16px;
}
.eyebrow::before{ content:""; width:34px; height:1px; background:var(--gold); opacity:.7; flex:none; }
.eyebrow.center{ justify-content:center; }
.eyebrow.center::after{ content:""; width:34px; height:1px; background:var(--gold); opacity:.7; flex:none; }
.gold-word{
  background:var(--gold-metal);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  font-style:italic; padding-right:.06em;
}

/* ---------- nav ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 var(--pad);
  height:78px;
  border-bottom:1px solid transparent;
  transition:background .4s ease, border-color .4s ease, height .4s ease;
}
.nav.scrolled{
  background:rgba(12,10,7,.85);
  -webkit-backdrop-filter:blur(14px) saturate(1.2);
  backdrop-filter:blur(14px) saturate(1.2);
  border-bottom-color:var(--hair);
  height:66px;
}
.brand{ display:flex; align-items:center; gap:13px; }
.brand img{ width:44px; height:44px; flex:none; }
.brand-name{ font:400 13px/1.2 var(--sans); letter-spacing:.32em; text-transform:uppercase; }
.brand-name small{ display:block; font-size:8.5px; letter-spacing:.42em; color:var(--mist-2); margin-top:4px; }
.nav-links{ display:flex; gap:clamp(18px,3vw,40px); align-items:center; }
.nav-links a{
  font:500 10.5px/1 var(--sans); letter-spacing:.26em; text-transform:uppercase;
  color:var(--mist); padding:8px 0; position:relative; transition:color .3s;
}
.nav-links a::after{
  content:""; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:var(--gold); transform:scaleX(0); transform-origin:right;
  transition:transform .35s cubic-bezier(.2,.6,.2,1);
}
.nav-links a:hover{ color:var(--cream); }
.nav-links a:hover::after{ transform:scaleX(1); transform-origin:left; }
.nav-links a.active{ color:var(--cream); }
.nav-links a.active::after{ transform:scaleX(1); }
.nav-links a.nav-book{
  font:600 10.5px/1 var(--sans); letter-spacing:.26em; text-transform:uppercase;
  color:var(--ink); background:var(--gold-metal); white-space:nowrap;
  padding:14px 24px; transition:filter .3s, transform .3s;
}
.nav-links a.nav-book:hover{ filter:brightness(1.08); transform:translateY(-1px); color:var(--ink); }
.nav-links a.nav-book::after{ display:none; }
.menu-btn{ display:none; }

/* mobile menu overlay */
.m-menu{
  position:fixed; inset:0; z-index:1500; background:var(--ink);
  display:flex; flex-direction:column; justify-content:center; padding:0 var(--pad);
  opacity:0; visibility:hidden; transition:opacity .4s ease, visibility .4s;
}
body.menu-open .m-menu{ opacity:1; visibility:visible; }
body.menu-open{ overflow:hidden; }
.m-menu a{
  font-family:var(--serif); font-size:clamp(30px,8vw,50px); line-height:1.35;
  border-bottom:1px solid var(--hair-d); padding:13px 0; color:var(--cream);
}
.m-menu a span{ font:600 10px/1 var(--sans); letter-spacing:.3em; color:var(--gold); vertical-align:super; margin-right:14px; }
.m-close{
  position:absolute; top:22px; right:var(--pad); background:none; border:1px solid var(--hair);
  color:var(--cream); width:44px; height:44px; font-size:18px; cursor:pointer;
}

/* ---------- buttons ---------- */
.btn{
  font:600 11px/1 var(--sans); letter-spacing:.28em; text-transform:uppercase;
  padding:19px 34px; display:inline-block; transition:all .35s cubic-bezier(.2,.6,.2,1);
  border:1px solid transparent; cursor:pointer; text-align:center;
}
.btn-gold{ background:var(--gold-metal); color:var(--ink); }
.btn-gold:hover{ filter:brightness(1.09); transform:translateY(-2px); box-shadow:0 14px 34px -12px rgba(199,162,92,.45); }
.btn-ghost{ border-color:var(--hair); color:var(--cream); }
.btn-ghost:hover{ border-color:var(--gold); color:var(--gold-hi); background:rgba(199,162,92,.06); }
.btn-ink{ border:1px solid var(--ink); color:var(--ink); background:transparent; }
.btn-ink:hover{ background:var(--ink); color:var(--cream); }

/* ---------- plates (photo frames) ---------- */
.plate{
  position:relative; overflow:hidden; background:var(--coal);
}
.plate img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .8s cubic-bezier(.2,.6,.2,1);
}
.plate::before{
  content:""; position:absolute; inset:12px; border:1px solid rgba(199,162,92,.25);
  pointer-events:none; z-index:2;
}
.plate::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23g)' opacity='0.5'/%3E%3C/svg%3E");
  opacity:.06; mix-blend-mode:overlay;
}
a.plate-link:hover .plate img,
.work-item:hover .plate img{ transform:scale(1.035); }
.plate-cap{
  display:flex; justify-content:space-between; gap:16px; margin-top:14px;
  font:500 9px/1.6 var(--sans); letter-spacing:.26em; text-transform:uppercase; color:var(--mist-2);
}
.plate-cap em{ font-style:normal; color:var(--gold); }

/* ---------- hero (home) ---------- */
.hero{
  min-height:100svh;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:clamp(24px,4vw,64px);
  align-items:center;
  padding:clamp(100px,12vh,136px) var(--pad) clamp(32px,5vh,64px);
  position:relative;
  overflow:hidden;
}
.hero::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(70% 55% at 18% 8%, rgba(199,162,92,.10), transparent 60%),
    radial-gradient(50% 40% at 88% 90%, rgba(199,162,92,.06), transparent 60%);
}
.hero-copy{ position:relative; z-index:2; }
.hero h1{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(44px, 5.6vw, 86px);
  line-height:1.04;
  letter-spacing:.005em;
  text-wrap:balance;
  margin:0 0 28px;
}
.hero-sub{
  max-width:52ch; color:var(--cream-2); font-size:17px; font-weight:400;
  line-height:1.7; letter-spacing:.005em;
  border-left:2px solid var(--gold); padding-left:24px;
}
.hero-actions{ display:flex; gap:18px; flex-wrap:wrap; margin-top:36px; }
.hero-meta{
  margin-top:clamp(28px,4.5vh,48px); display:flex; gap:28px; flex-wrap:wrap;
  font:600 10px/1.6 var(--sans); letter-spacing:.24em; text-transform:uppercase; color:var(--mist);
}
.hero-meta span{ display:flex; align-items:center; gap:10px; }
.hero-meta span::before{ content:"✦"; color:var(--gold); font-size:8px; }
.hero-stage{ position:relative; z-index:1; }
.ring{
  position:absolute; width:128%; aspect-ratio:1; left:50%; top:50%;
  transform:translate(-50%,-50%);
  color:var(--gold); opacity:.32; pointer-events:none;
}
.ring svg{ width:100%; height:100%; animation:spin 90s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.hero-stage figure{
  max-width:min(100%, calc((100svh - 300px) * 0.8));
  margin-inline:auto;
}
.hero-plate{ aspect-ratio:4/5; }
.hero-plate img{ object-position:center 22%; }
.folio{
  position:absolute; right:18px; top:50%; transform:translateY(-50%);
  writing-mode:vertical-rl; font:500 9px/1 var(--sans);
  letter-spacing:.5em; text-transform:uppercase; color:var(--mist-2);
}

/* ---------- interior page head ---------- */
.page-head{
  padding:170px var(--pad) clamp(56px,7vw,90px);
  position:relative;
}
.page-head::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(60% 70% at 22% 0%, rgba(199,162,92,.10), transparent 60%);
}
.page-head h1{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(44px,6.4vw,92px); line-height:1.03; letter-spacing:.005em;
  margin:26px 0 24px; max-width:14em; text-wrap:balance; position:relative;
}
.page-head .lede{
  max-width:58ch; color:var(--cream-2); font-size:16.5px; font-weight:400;
  line-height:1.7;
  border-left:2px solid var(--gold); padding-left:24px; position:relative;
}

/* ---------- ticker ---------- */
.tick{
  border-top:1px solid var(--hair); border-bottom:1px solid var(--hair);
  overflow:hidden; padding:16px 0; background:var(--ink); position:relative; z-index:3;
}
.tick-row{ display:flex; width:max-content; animation:tick 38s linear infinite; }
.tick:hover .tick-row{ animation-play-state:paused; }
@keyframes tick{ to{ transform:translateX(-50%); } }
.tick-row span{
  font-family:var(--serif); font-style:italic; font-size:15px; letter-spacing:.12em;
  color:var(--mist); padding:0 26px; display:flex; align-items:center; gap:52px; white-space:nowrap;
}
.tick-row span::after{ content:"✦"; font-style:normal; font-size:9px; color:var(--gold); }

/* ---------- shared section chrome ---------- */
section{ position:relative; }
section[id],[id].page-head,.sect-head[id]{ scroll-margin-top:clamp(80px,9vh,104px); }
.sect{ padding:clamp(84px,11vw,150px) var(--pad); }
.sect-head{
  display:flex; justify-content:space-between; align-items:flex-end; gap:32px;
  margin-bottom:clamp(44px,6vw,80px);
}
.sect-head h2{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(34px,4.6vw,64px); line-height:1.06; letter-spacing:.005em;
  max-width:15em; text-wrap:balance; margin-top:24px;
}
.sect-link{
  font:600 10px/1 var(--sans); letter-spacing:.28em; text-transform:uppercase;
  color:var(--gold); white-space:nowrap; padding-bottom:6px;
  border-bottom:1px solid var(--hair); transition:all .3s;
}
.sect-link:hover{ border-color:var(--gold); letter-spacing:.34em; }

/* cream variants */
.cream-s{ background:var(--cream); color:var(--ink); }
.cream-s .eyebrow{ color:var(--gold-lo); }
.cream-s .eyebrow::before,.cream-s .eyebrow.center::after{ background:var(--gold-lo); }
.cream-s .sect-link{ color:var(--gold-lo); border-color:var(--hair-l); }
.cream-s .sect-link:hover{ border-color:var(--gold-lo); }
.cream-s .plate{ box-shadow:0 30px 60px -30px rgba(12,10,7,.45); }
.cream-s .step{ border-top-color:var(--hair-l); }
.cream-s .step-no{ color:var(--gold-lo); }
.cream-s .step p{ color:var(--ink-mut); }

/* ---------- home work grid ---------- */
.work-grid{
  display:grid; grid-template-columns:repeat(12,1fr);
  gap:clamp(18px,2.6vw,40px); align-items:start;
}
.work-item{ position:relative; }
.wi-a{ grid-column:1/8; }  .wi-a .plate{ aspect-ratio:16/11; }
.wi-b{ grid-column:8/13; margin-top:clamp(40px,6vw,110px); } .wi-b .plate{ aspect-ratio:4/5; }
.wi-c{ grid-column:1/6; margin-top:clamp(-20px,-2vw,-60px); } .wi-c .plate{ aspect-ratio:1/1; }
.wi-d{ grid-column:6/13; margin-top:clamp(30px,5vw,90px); } .wi-d .plate{ aspect-ratio:16/10; }
.work-cap{
  display:flex; justify-content:space-between; gap:14px; margin-top:16px;
  font:500 9.5px/1.7 var(--sans); letter-spacing:.24em; text-transform:uppercase; color:var(--ink-mut);
}
.work-cap b{ font-weight:600; color:var(--ink); }
.work-cap em{ font-style:normal; color:var(--gold-lo); }

/* ---------- services ---------- */
.svc-grid{
  display:grid; grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--hair-d); border-left:1px solid var(--hair-d);
}
.svc{
  border-right:1px solid var(--hair-d); border-bottom:1px solid var(--hair-d);
  padding:clamp(26px,3vw,42px); min-height:190px;
  display:flex; flex-direction:column; justify-content:space-between; gap:26px;
  transition:background .4s;
  position:relative; overflow:hidden; color:inherit;
}
.svc::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background:var(--gold-metal); transform:scaleX(0); transform-origin:left;
  transition:transform .45s cubic-bezier(.2,.6,.2,1);
}
.svc:hover{ background:rgba(199,162,92,.05); }
.svc:hover::after{ transform:scaleX(1); }
.svc-no{ font-family:var(--serif); font-style:italic; font-size:15px; color:var(--gold); }
.svc h3{ font-family:var(--serif); font-weight:400; font-size:clamp(20px,1.9vw,26px); line-height:1.2; margin-bottom:8px; }
.svc p{ font-size:12.5px; color:var(--mist-2); letter-spacing:.03em; }

/* ---------- about split ---------- */
.about{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(32px,5vw,90px); align-items:center; }
.about .plate{ aspect-ratio:3/4; max-width:440px; }
.about .plate img{ object-position:50% 18%; }
.about-copy h2{
  font-family:var(--serif); font-weight:400; font-size:clamp(30px,3.6vw,52px);
  line-height:1.12; margin:24px 0 26px; text-wrap:balance;
}
.about-copy p{ color:var(--ink-mut); max-width:56ch; }
.about-copy p + p{ margin-top:16px; }
.about-sign{ margin-top:34px; font-family:var(--serif); font-style:italic; font-size:22px; color:var(--gold-lo); }
.about-cred{ margin-top:10px; font:600 9.5px/1.8 var(--sans); letter-spacing:.26em; text-transform:uppercase; color:var(--ink-mut2); }
.dark-about .about-copy p{ color:var(--mist); }
.dark-about .about-sign{ color:var(--gold); }
.dark-about .about-cred{ color:var(--mist-2); }

/* ---------- voices ---------- */
.quote-main{ max-width:900px; margin:0 auto; text-align:center; }
.quote-mark{
  font-family:var(--serif); font-size:120px; line-height:.4; color:var(--gold);
  display:block; margin:40px auto 34px; opacity:.9;
}
.quote-main blockquote{
  font-family:var(--serif); font-weight:400; font-size:clamp(24px,3.2vw,42px);
  line-height:1.32; text-wrap:balance;
}
.quote-main figcaption{
  margin-top:30px; font:600 10px/1.9 var(--sans); letter-spacing:.3em; text-transform:uppercase; color:var(--gold);
}
.quote-main figcaption small{ display:block; font-weight:500; color:var(--mist-2); letter-spacing:.24em; }
.quote-row{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,3vw,48px);
  max-width:960px; margin:clamp(48px,6vw,80px) auto 0;
  border-top:1px solid var(--hair-d); padding-top:clamp(36px,4vw,56px);
}
.quote-sm blockquote{ font-family:var(--serif); font-style:italic; font-size:17.5px; line-height:1.55; color:var(--mist); }
.quote-sm figcaption{ margin-top:16px; font:600 9px/1.8 var(--sans); letter-spacing:.28em; text-transform:uppercase; color:var(--gold); }

/* ---------- rates ---------- */
.rate-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2.4vw,36px); }
.rate{
  border:1px solid var(--hair-l); padding:clamp(28px,3vw,44px);
  display:flex; flex-direction:column;
  transition:all .4s cubic-bezier(.2,.6,.2,1); position:relative; background:transparent;
}
.rate:hover{ border-color:var(--gold-lo); transform:translateY(-6px); box-shadow:0 30px 50px -34px rgba(12,10,7,.4); }
.rate-kind{ font:600 9.5px/1 var(--sans); letter-spacing:.3em; text-transform:uppercase; color:var(--gold-lo); }
.rate h3{ font-family:var(--serif); font-weight:400; font-size:clamp(22px,2vw,28px); margin:18px 0 6px; }
.rate-price{
  font-family:var(--serif); font-size:clamp(40px,4vw,54px); line-height:1;
  margin:18px 0 22px; font-variant-numeric:lining-nums;
}
.rate-price sup{ font-size:.45em; top:-.7em; position:relative; color:var(--gold-lo); }
.rate ul{ list-style:none; border-top:1px solid var(--hair-l); padding-top:20px; margin-top:auto; }
.rate li{ font-size:12.5px; color:var(--ink-mut); padding:5px 0; display:flex; gap:12px; align-items:baseline; }
.rate li::before{ content:"✦"; font-size:9px; color:var(--gold-lo); flex:none; position:relative; top:1px; }
.rate .btn{ margin-top:26px; }
.rate-feat{ background:var(--ink); color:var(--cream); border-color:var(--ink); }
.rate-feat .rate-kind{ color:var(--gold); }
.rate-feat li{ color:var(--mist); }
.rate-feat li::before{ color:var(--gold); }
.rate-feat ul{ border-color:var(--hair-d); }
.rate-feat .rate-price sup{ color:var(--gold); }
.invest-foot{
  display:flex; align-items:center; justify-content:center; gap:26px; flex-wrap:wrap;
  margin-top:clamp(40px,5vw,64px);
}
.invest-foot p{ font-family:var(--serif); font-style:italic; font-size:15px; color:var(--ink-mut); }
.pay-note{
  text-align:center; margin-top:26px;
  font:500 9px/1.8 var(--sans); letter-spacing:.28em; text-transform:uppercase; color:var(--ink-mut2);
}

/* ---------- steps ---------- */
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(18px,2.4vw,36px); }
.step{ border-top:1px solid var(--hair-d); padding-top:22px; }
.step-no{ font-family:var(--serif); font-style:italic; font-size:16px; color:var(--gold); }
.step h3{ font-family:var(--serif); font-weight:400; font-size:clamp(19px,1.8vw,24px); margin:12px 0 10px; }
.step p{ font-size:13px; color:var(--mist-2); }

/* ---------- FAQ ---------- */
.faq{ max-width:820px; margin:0 auto; }
.faq details{ border-bottom:1px solid var(--hair-l); }
.faq summary{
  cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:baseline; gap:20px;
  padding:24px 4px; font-family:var(--serif); font-size:clamp(18px,1.8vw,23px); font-weight:400;
  transition:color .3s;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; font-family:var(--sans); font-weight:300; font-size:22px; color:var(--gold-lo); transition:transform .3s; flex:none; }
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq summary:hover{ color:var(--gold-lo); }
.faq details p{ padding:0 4px 26px; color:var(--ink-mut); max-width:62ch; }

/* ---------- portfolio ---------- */
.filters{
  display:flex; gap:10px 8px; flex-wrap:wrap;
  padding:0 var(--pad) clamp(34px,4vw,50px);
  position:relative;
}
.filter-btn{
  background:none; border:1px solid var(--hair-d); color:var(--mist);
  font:600 10px/1 var(--sans); letter-spacing:.24em; text-transform:uppercase;
  padding:13px 20px; cursor:pointer; transition:all .3s;
}
.filter-btn:hover{ border-color:var(--gold); color:var(--gold-hi); }
.filter-btn.active{ background:var(--gold-metal); color:var(--ink); border-color:transparent; }
.filter-count{ color:var(--gold-lo); margin-left:8px; font-weight:500; }
.filter-btn.active .filter-count{ color:rgba(12,10,7,.55); }

.masonry{
  columns:3; column-gap:clamp(18px,2.2vw,32px);
  padding:0 var(--pad) clamp(60px,8vw,100px);
}
.g-item{
  break-inside:avoid; margin-bottom:clamp(18px,2.2vw,32px);
  display:block; position:relative;
}
.g-item.hidden{ display:none; }
.g-item .plate::before{ inset:10px; }
.g-item figcaption{
  display:flex; justify-content:space-between; gap:12px; margin-top:12px;
  font:500 9px/1.7 var(--sans); letter-spacing:.24em; text-transform:uppercase; color:var(--mist-2);
}
.g-item figcaption em{ font-style:normal; color:var(--gold); }
.g-item .plate{ cursor:zoom-in; }

/* ---------- instagram note ---------- */
.ig-note{
  text-align:center; padding:0 var(--pad) clamp(70px,9vw,110px);
  font-family:var(--serif); font-style:italic; font-size:clamp(17px,1.6vw,21px);
  color:var(--mist);
}
.ig-note a{
  color:var(--gold-hi); border-bottom:1px solid var(--hair);
  transition:border-color .3s, color .3s; font-style:normal;
  font:600 12px/1 var(--sans); letter-spacing:.24em; text-transform:uppercase;
  padding-bottom:4px; margin-left:10px; vertical-align:middle;
}
.ig-note a:hover{ border-color:var(--gold); color:var(--cream); }

/* ---------- lightbox ---------- */
.lb{
  position:fixed; inset:0; z-index:2500; background:rgba(6,5,3,.96);
  display:none; align-items:center; justify-content:center; flex-direction:column;
  padding:clamp(16px,4vw,56px);
}
.lb.open{ display:flex; }
.lb img{
  max-width:min(92vw,1400px); max-height:78vh; object-fit:contain;
  border:1px solid var(--hair);
}
.lb-cap{
  margin-top:20px; display:flex; align-items:center; gap:26px;
  font:500 10px/1.7 var(--sans); letter-spacing:.26em; text-transform:uppercase; color:var(--mist);
}
.lb-cap em{ font-style:normal; color:var(--gold); }
.lb-count{ color:var(--mist-2); }
.lb-btn{
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(12,10,7,.6); border:1px solid var(--hair); color:var(--cream);
  width:52px; height:52px; font-size:20px; cursor:pointer; transition:all .3s;
}
.lb-btn:hover{ border-color:var(--gold); color:var(--gold-hi); }
.lb-prev{ left:clamp(10px,2vw,30px); }
.lb-next{ right:clamp(10px,2vw,30px); }
.lb-close{
  position:absolute; top:22px; right:clamp(16px,3vw,40px);
  background:none; border:1px solid var(--hair); color:var(--cream);
  width:46px; height:46px; font-size:17px; cursor:pointer; transition:all .3s;
}
.lb-close:hover{ border-color:var(--gold); color:var(--gold-hi); }

/* ---------- CTA ---------- */
.cta{ text-align:center; padding:clamp(110px,15vw,200px) var(--pad); overflow:hidden; }
.cta::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(55% 60% at 50% 45%, rgba(199,162,92,.12), transparent 65%);
  pointer-events:none;
}
.cta h2{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(42px,7vw,104px); line-height:1.04; text-wrap:balance;
  max-width:11em; margin:28px auto 30px; position:relative;
}
.cta p{ color:var(--mist); max-width:46ch; margin:0 auto 44px; position:relative; }
.cta .hero-actions{ justify-content:center; margin-top:0; position:relative; }

/* ---------- contact ---------- */
.contact-grid{
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(36px,6vw,100px); align-items:start;
}
.c-form h2,.c-info h2{
  font-family:var(--serif); font-weight:400; font-size:clamp(26px,2.8vw,38px); margin:20px 0 30px;
}
.field{ margin-bottom:22px; }
.field label{
  display:block; font:600 9.5px/1 var(--sans); letter-spacing:.28em; text-transform:uppercase;
  color:var(--ink-mut); margin-bottom:10px;
}
.field label i{ font-style:normal; color:var(--gold-lo); }
.field input,.field select,.field textarea{
  width:100%; background:transparent; border:1px solid var(--hair-l);
  color:var(--ink); font:300 15px/1.5 var(--sans); padding:15px 16px;
  transition:border-color .3s; border-radius:0; -webkit-appearance:none; appearance:none;
}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%238E7038' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 16px center;
}
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--gold-lo); }
.field textarea{ min-height:130px; resize:vertical; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-note{ font-size:12px; color:var(--ink-mut2); margin:6px 0 24px; }
.form-status{
  display:none; margin-top:18px; padding:14px 18px; border:1px solid var(--gold-lo);
  font-size:13px; color:var(--ink-mut);
}
.form-status.show{ display:block; }
.c-list{ list-style:none; border-top:1px solid var(--hair-l); }
.c-list li{
  display:grid; grid-template-columns:130px 1fr; gap:18px;
  padding:16px 0; border-bottom:1px solid var(--hair-l); align-items:baseline;
}
.c-list dt,.c-list .k{
  font:600 9.5px/1.8 var(--sans); letter-spacing:.28em; text-transform:uppercase; color:var(--gold-lo);
}
.c-list .v{ font-size:14.5px; color:var(--ink); }
.c-list .v a{ border-bottom:1px solid var(--hair-l); transition:border-color .3s; }
.c-list .v a:hover{ border-color:var(--gold-lo); }
.map-ph{
  margin-top:34px; aspect-ratio:16/8; border:1px solid var(--hair-l);
  display:flex; align-items:center; justify-content:center; text-align:center;
  background:
    radial-gradient(80% 90% at 30% 10%, rgba(199,162,92,.14), transparent 55%),
    linear-gradient(160deg,#E8E0CF, #DDD3BE);
}
.map-ph p{ font:500 10px/2 var(--sans); letter-spacing:.3em; text-transform:uppercase; color:var(--ink-mut2); padding:0 20px; }

/* ---------- footer ---------- */
footer{ border-top:1px solid var(--hair); padding:clamp(56px,7vw,90px) var(--pad) 34px; background:var(--ink); }
.foot-top{
  display:grid; grid-template-columns:1.7fr 1fr 1fr;
  gap:clamp(28px,4vw,56px); padding-bottom:clamp(44px,5vw,64px);
}
.foot-brand img{ width:190px; margin:-14px 0 8px -8px; }
.foot-brand p{ color:var(--mist-2); font-size:13px; max-width:32ch; }
.foot-tag{ margin-top:18px; font-family:var(--serif); font-style:italic; font-size:15px; color:var(--gold); }
.foot-col h4{
  font:600 9.5px/1 var(--sans); letter-spacing:.3em; text-transform:uppercase;
  color:var(--gold); margin-bottom:20px;
}
.foot-col a,.foot-col span{
  display:block; padding:5px 0; color:var(--mist); font-size:13px; transition:color .3s;
}
.foot-col a:hover{ color:var(--gold-hi); }
.foot-bar{
  border-top:1px solid var(--hair-d); padding-top:26px;
  display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap;
  font:500 9px/1.8 var(--sans); letter-spacing:.24em; text-transform:uppercase; color:var(--mist-2);
}

/* ---------- floating book (mobile) ---------- */
.fab{
  position:fixed; right:18px; bottom:calc(18px + env(safe-area-inset-bottom)); z-index:1200;
  display:none; background:var(--gold-metal); color:var(--ink);
  font:600 11px/1 var(--sans); letter-spacing:.22em; text-transform:uppercase;
  padding:17px 26px; box-shadow:0 18px 40px -12px rgba(0,0,0,.6);
}

/* ---------- reveals ---------- */
.rv{ opacity:0; transform:translateY(26px); transition:opacity .9s ease, transform .9s cubic-bezier(.2,.6,.2,1); }
.rv.in{ opacity:1; transform:none; }
@keyframes riseIn{ from{ opacity:0; transform:translateY(30px); } to{ opacity:1; transform:none; } }
@keyframes plateIn{ from{ clip-path:inset(0 0 100% 0); } to{ clip-path:inset(0 0 0% 0); } }
.hero h1{ animation:riseIn 1s .2s both; }
.hero-sub{ animation:riseIn 1s .4s both; }
.hero-actions{ animation:riseIn 1s .55s both; }
.hero-meta{ animation:riseIn 1s .7s both; }
.hero-stage .plate{ animation:plateIn 1.2s .35s cubic-bezier(.2,.6,.2,1) both; }
.hero-stage .plate-cap{ animation:riseIn 1s 1.1s both; }
.ring{ animation:riseIn 1.6s .8s both; }
.page-head .eyebrow{ animation:riseIn .8s .1s both; }
.page-head h1{ animation:riseIn .9s .25s both; }
.page-head .lede{ animation:riseIn .9s .45s both; }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation:none!important; transition:none!important; }
  html{ scroll-behavior:auto; }
  .rv{ opacity:1; transform:none; }
}

/* ---------- responsive ---------- */
@media (max-width:1120px){
  .masonry{ columns:2; }
}
@media (max-width:1060px){
  .svc-grid{ grid-template-columns:1fr 1fr; }
  .foot-top{ grid-template-columns:1fr 1fr; }
  .steps{ grid-template-columns:1fr 1fr; row-gap:40px; }
}
@media (max-width:860px){
  .nav-links{ display:none; }
  .menu-btn{
    display:inline-flex; align-items:center; gap:12px; background:none; border:none; cursor:pointer;
    color:var(--cream); font:600 10.5px/1 var(--sans); letter-spacing:.3em; text-transform:uppercase;
  }
  .menu-btn i{ width:26px; height:1px; background:var(--gold); display:block; position:relative; }
  .menu-btn i::before{ content:""; position:absolute; top:-7px; left:0; width:26px; height:1px; background:var(--gold); }
  .hero{ grid-template-columns:1fr; padding-top:130px; gap:56px; }
  .folio{ display:none; }
  .hero-stage{ max-width:430px; }
  .work-grid > *{ grid-column:1/13!important; margin-top:0!important; }
  .about{ grid-template-columns:1fr; }
  .about .plate{ max-width:100%; }
  .rate-grid{ grid-template-columns:1fr; }
  .quote-row{ grid-template-columns:1fr; }
  .sect-head{ flex-direction:column; align-items:flex-start; }
  .contact-grid{ grid-template-columns:1fr; }
  .fab{ display:block; }
  .page-head{ padding-top:140px; }
}
@media (max-width:700px){
  .masonry{ columns:1; }
}
@media (max-width:560px){
  .svc-grid{ grid-template-columns:1fr; }
  .svc{ min-height:0; }
  .foot-top{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .field-row{ grid-template-columns:1fr; }
  .hero h1{ font-size:clamp(40px,11.5vw,54px); }
}

/* ============================================================
   PREMIUM MICROINTERACTIONS  (appended · later rules win by cascade)
   ============================================================ */

/* ---- gold cursor follower (fine pointer only; additive, native cursor stays) ---- */
.cursor-ring{
  position:fixed; top:0; left:0; z-index:6000; width:34px; height:34px;
  margin:-17px 0 0 -17px; border:1.5px solid var(--gold); border-radius:50%;
  pointer-events:none; opacity:0;
  transition:width .35s cubic-bezier(.2,.6,.2,1), height .35s cubic-bezier(.2,.6,.2,1),
             margin .35s cubic-bezier(.2,.6,.2,1), background-color .35s, border-color .35s, opacity .45s;
}
.cursor-ring.is-hover{ width:66px; height:66px; margin:-33px 0 0 -33px; background:rgba(199,162,92,.10); border-color:var(--gold-hi); }
.cursor-ring.is-down{ width:24px; height:24px; margin:-12px 0 0 -12px; }
@media (hover:none),(pointer:coarse){ .cursor-ring{ display:none!important; } }

/* ---- light-sheen sweep on gold CTAs ---- */
.btn-gold, .nav-links a.nav-book, .fab{ position:relative; overflow:hidden; }
.btn-gold::before, .nav-links a.nav-book::before, .fab::before{
  content:""; position:absolute; top:0; left:-140%; width:65%; height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,252,244,.5), transparent);
  transform:skewX(-18deg); pointer-events:none; transition:left .65s cubic-bezier(.2,.6,.2,1);
}
.btn-gold:hover::before, .nav-links a.nav-book:hover::before, .fab:hover::before{ left:160%; }
.btn-gold, .nav-links a.nav-book{ will-change:transform; }

/* ---- nav auto-hide on scroll ---- */
.nav{ transition:background .4s ease, border-color .4s ease, height .4s ease, transform .5s cubic-bezier(.2,.6,.2,1); }
.nav.nav-hidden{ transform:translateY(-100%); }

/* ---- scroll clip-reveal for framed photographs ---- */
@media (prefers-reduced-motion:no-preference){
  .rv:has(.plate){ transform:none; }
  .rv .plate{ clip-path:inset(0 0 101% 0); transition:clip-path 1.05s cubic-bezier(.2,.6,.2,1); }
  .rv.in .plate{ clip-path:inset(0 0 0 0); }
}

/* ---- hover polish ---- */
.svc:hover h3{ color:var(--gold); transition:color .35s; }
.filter-btn{ transition:all .3s cubic-bezier(.2,.6,.2,1); }
.g-item .plate,.work-item .plate{ transition:transform .8s cubic-bezier(.2,.6,.2,1), box-shadow .5s ease; }
.g-item:hover .plate{ box-shadow:0 26px 60px -30px rgba(0,0,0,.7); }
.rate,.svc,.step{ transition:transform .45s cubic-bezier(.2,.6,.2,1), background .4s, border-color .4s, box-shadow .45s; }

/* ---- portfolio filter pulse ---- */
#gallery{ transition:opacity .3s ease; }
#gallery.is-filtering{ opacity:.35; }

/* ---- lightbox: smooth fade + scale (cascade override of display toggle) ---- */
.lb{ display:flex; opacity:0; visibility:hidden; pointer-events:none;
     transition:opacity .45s ease, visibility .45s; }
.lb.open{ opacity:1; visibility:visible; pointer-events:auto; }
.lb img{ transform:scale(.94); transition:transform .6s cubic-bezier(.2,.6,.2,1); }
.lb.open img{ transform:scale(1); }
.lb-btn,.lb-close{ transition:all .3s cubic-bezier(.2,.6,.2,1); }

@media (prefers-reduced-motion:reduce){
  .cursor-ring{ display:none!important; }
  .rv .plate{ clip-path:none!important; }
  .btn-gold::before,.nav-links a.nav-book::before,.fab::before{ display:none; }
  .nav.nav-hidden{ transform:none; }
}

/* ============================================================
   LEGAL PAGES (privacy / terms)
   ============================================================ */
.legal{ max-width:62rem; margin:0 auto; }
.legal .eff{ font:600 10px/1.6 var(--sans); letter-spacing:.24em; text-transform:uppercase; color:var(--ink-mut2); margin-bottom:30px; }
.legal-note{
  border:1px solid var(--hair-l); border-left:2px solid var(--gold-lo);
  padding:18px 22px; margin-bottom:46px; font-size:13.5px; color:var(--ink-mut); background:rgba(199,162,92,.04);
}
.legal-note b{ color:var(--ink); font-weight:600; }
.legal h2{
  font-family:var(--serif); font-weight:400; font-size:clamp(23px,2.5vw,31px);
  margin:46px 0 14px; color:var(--ink); text-wrap:balance;
}
.legal h2:first-of-type{ margin-top:0; }
.legal h3{
  font:600 11px/1.5 var(--sans); letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold-lo); margin:26px 0 8px;
}
.legal p{ color:var(--ink-mut); margin-bottom:14px; max-width:70ch; }
.legal ul{ list-style:none; margin:0 0 16px; padding:0; }
.legal li{ color:var(--ink-mut); padding:6px 0 6px 24px; position:relative; max-width:68ch; }
.legal li::before{ content:"✦"; position:absolute; left:0; top:8px; font-size:9px; color:var(--gold-lo); }
.legal a{ color:var(--gold-lo); border-bottom:1px solid var(--hair-l); transition:border-color .3s; }
.legal a:hover{ border-color:var(--gold-lo); }
.legal-toc{ display:flex; flex-wrap:wrap; gap:10px 14px; margin-bottom:44px; }
.legal-toc a{
  font:600 10px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-lo); border:1px solid var(--hair-l); padding:11px 15px; transition:all .3s;
}
.legal-toc a:hover{ border-color:var(--gold-lo); background:rgba(199,162,92,.06); }

/* footer legal links */
.foot-legal{ display:flex; gap:22px; }
.foot-legal a{ color:var(--mist-2); transition:color .3s; }
.foot-legal a:hover{ color:var(--gold-hi); }

/* ---- photo booth 3-up steps (own responsive rules; placed last to win the .steps tie) ---- */
.steps-booth{ grid-template-columns:repeat(3,1fr); }
@media (max-width:1060px){ .steps-booth{ grid-template-columns:1fr 1fr; } }
@media (max-width:860px){ .steps-booth{ grid-template-columns:1fr; } }

/* ============================================================
   BOOKING FLOW
   ============================================================ */
.bk-step{ margin-bottom:clamp(48px,6vw,76px); }
.bk-step-label{
  display:flex; align-items:center; gap:14px; margin-bottom:26px;
  font:600 10.5px/1 var(--sans); letter-spacing:.3em; text-transform:uppercase; color:var(--gold-lo);
}
.bk-step-label b{
  font-family:var(--serif); font-style:italic; font-weight:400; font-size:15px;
  letter-spacing:0; text-transform:none; color:var(--gold-lo);
}

/* option cards (session + payment) */
.bk-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.8vw,22px); }
.bk-grid.two{ grid-template-columns:repeat(2,1fr); }
.bk-opt{ position:relative; display:block; cursor:pointer; }
.bk-opt input{
  position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; inset:0;
}
.bk-card{
  border:1px solid var(--hair-l); padding:clamp(22px,2.4vw,30px);
  min-height:100%; display:flex; flex-direction:column; gap:8px;
  background:transparent;
  transition-property:border-color, background-color, box-shadow, transform;
  transition-duration:.35s; transition-timing-function:cubic-bezier(.2,.6,.2,1);
}
.bk-opt:hover .bk-card{ border-color:var(--gold-lo); background:rgba(199,162,92,.05); }
.bk-opt input:focus-visible + .bk-card{ outline:2px solid var(--gold); outline-offset:3px; }
.bk-opt input:checked + .bk-card{
  border-color:var(--ink); background:var(--ink);
  box-shadow:0 18px 40px -22px rgba(12,10,7,.55);
}
.bk-opt input:active + .bk-card{ transform:scale(.96); }
.bk-kind{
  font:600 9.5px/1 var(--sans); letter-spacing:.3em; text-transform:uppercase; color:var(--gold-lo);
}
.bk-name{
  font-family:var(--serif); font-weight:400; font-size:clamp(19px,1.9vw,24px); color:var(--ink);
  text-wrap:balance;
}
.bk-price{
  font-family:var(--serif); font-size:clamp(26px,2.6vw,34px); color:var(--ink);
  font-variant-numeric:tabular-nums; margin-top:auto; padding-top:12px;
}
.bk-price sup{ font-size:.45em; color:var(--gold-lo); }
.bk-desc{ font-size:12.5px; color:var(--ink-mut); }
.bk-opt input:checked + .bk-card .bk-name,
.bk-opt input:checked + .bk-card .bk-price{ color:var(--cream); }
.bk-opt input:checked + .bk-card .bk-kind,
.bk-opt input:checked + .bk-card .bk-price sup{ color:var(--gold); }
.bk-opt input:checked + .bk-card .bk-desc{ color:var(--mist); }

/* summary panel */
.bk-summary{
  border:1px solid var(--hair-l); border-left:2px solid var(--gold-lo);
  padding:clamp(26px,3vw,38px); background:rgba(199,162,92,.04);
}
.bk-row{
  display:flex; justify-content:space-between; align-items:baseline; gap:20px;
  padding:13px 0; border-bottom:1px solid var(--hair-l);
}
.bk-row:last-of-type{ border-bottom:none; }
.bk-row dt{ font:600 10px/1.6 var(--sans); letter-spacing:.24em; text-transform:uppercase; color:var(--ink-mut); }
.bk-row dd{
  font-family:var(--serif); font-size:clamp(20px,2vw,26px); color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.bk-row dd small{
  display:block; font-family:var(--sans); font-size:11px; letter-spacing:.06em;
  color:var(--ink-mut2); text-align:right; margin-top:3px; font-variant-numeric:normal;
}
.bk-row.total dd{ color:var(--gold-lo); }
.bk-note{
  margin-top:22px; padding-top:20px; border-top:1px solid var(--hair-l);
  font-size:12.5px; color:var(--ink-mut); text-wrap:pretty;
}

/* embed slot */
.bk-embed{
  border:1px solid var(--hair-l); min-height:340px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px;
  text-align:center; padding:clamp(30px,4vw,50px);
  background:
    radial-gradient(70% 80% at 50% 0%, rgba(199,162,92,.10), transparent 60%),
    var(--cream-2);
}
.bk-embed p{ font-size:13.5px; color:var(--ink-mut); max-width:52ch; text-wrap:pretty; }
.bk-embed .bk-embed-title{
  font-family:var(--serif); font-size:clamp(21px,2.2vw,27px); color:var(--ink); text-wrap:balance;
}
.bk-embed code{
  font:500 11.5px/1.7 ui-monospace,Menlo,Consolas,monospace; color:var(--gold-lo);
  background:rgba(12,10,7,.05); padding:3px 8px; word-break:break-all;
}

@media (max-width:900px){
  .bk-grid,.bk-grid.two{ grid-template-columns:1fr; }
}

/* ============================================================
   NATIVE BOOKING CALENDAR
   ============================================================ */
.cal-wrap{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(20px,3vw,40px); }
.cal{ border:1px solid var(--hair-l); padding:clamp(18px,2.2vw,26px); background:rgba(255,255,255,.35); }
.cal-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
.cal-month{
  font-family:var(--serif); font-size:clamp(18px,1.9vw,23px); color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.cal-nav{ display:flex; gap:6px; }
.cal-nav button{
  width:40px; height:40px; border:1px solid var(--hair-l); background:transparent; cursor:pointer;
  color:var(--ink); font:400 16px/1 var(--sans); display:flex; align-items:center; justify-content:center;
  transition-property:border-color,background-color,color; transition-duration:.3s;
}
.cal-nav button:hover:not(:disabled){ border-color:var(--gold-lo); background:rgba(199,162,92,.08); }
.cal-nav button:disabled{ opacity:.28; cursor:not-allowed; }
.cal-dow{
  display:grid; grid-template-columns:repeat(7,1fr); gap:4px; margin-bottom:6px;
}
.cal-dow span{
  text-align:center; font:600 9.5px/1 var(--sans); letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-mut2); padding:8px 0;
}
.cal-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.cal-day{
  aspect-ratio:1; min-height:42px; border:1px solid transparent; background:transparent;
  font:400 14px/1 var(--sans); color:var(--ink); cursor:pointer;
  font-variant-numeric:tabular-nums;
  display:flex; align-items:center; justify-content:center;
  transition-property:border-color,background-color,color,transform; transition-duration:.25s;
  transition-timing-function:cubic-bezier(.2,.6,.2,1);
}
.cal-day:hover:not(:disabled){ border-color:var(--gold-lo); background:rgba(199,162,92,.1); }
.cal-day:active:not(:disabled){ transform:scale(.96); }
.cal-day[aria-selected="true"]{ background:var(--ink); color:var(--cream); border-color:var(--ink); }
.cal-day:disabled{ color:var(--ink-mut2); opacity:.34; cursor:not-allowed; }
.cal-day.is-empty{ border:none; cursor:default; pointer-events:none; }
.cal-legend{
  margin-top:16px; padding-top:14px; border-top:1px solid var(--hair-l);
  font:400 11.5px/1.6 var(--sans); color:var(--ink-mut2);
}

/* time slots */
.slots-panel{ display:flex; flex-direction:column; }
.slots-title{
  font:600 10px/1 var(--sans); letter-spacing:.28em; text-transform:uppercase;
  color:var(--gold-lo); margin-bottom:16px;
}
.slots{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.slot{
  border:1px solid var(--hair-l); background:transparent; cursor:pointer;
  padding:14px 10px; min-height:44px;
  font:500 13px/1 var(--sans); color:var(--ink); font-variant-numeric:tabular-nums;
  transition-property:border-color,background-color,color,transform; transition-duration:.25s;
  transition-timing-function:cubic-bezier(.2,.6,.2,1);
}
.slot:hover{ border-color:var(--gold-lo); background:rgba(199,162,92,.08); }
.slot:active{ transform:scale(.96); }
.slot[aria-pressed="true"]{ background:var(--ink); color:var(--cream); border-color:var(--ink); }
.slots-empty{ font-size:13px; color:var(--ink-mut2); text-wrap:pretty; }

/* request status */
.bk-status{
  display:none; margin-top:20px; padding:16px 20px;
  border:1px solid var(--gold-lo); background:rgba(199,162,92,.07);
  font-size:13.5px; color:var(--ink-mut); text-wrap:pretty;
}
.bk-status.show{ display:block; }
.bk-actions{ display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin-top:26px; }
.bk-actions .btn:disabled{ opacity:.4; cursor:not-allowed; }

@media (max-width:900px){
  .cal-wrap{ grid-template-columns:1fr; }
}