
:root{
  --ink:#0A0A0B; --ink2:#141416; --ink3:#1C1C20;
  --paper:#F7F5F1; --paper2:#EFEBE4;
  --gold:#C9A96A; --gold-dark:#8A6B2F; --rose:#E8CFC9;
  --line:rgba(255,255,255,.14); --line-d:rgba(10,10,11,.12);
  --pvh:0px;
  --disp:'Urbanist',system-ui,sans-serif; --body:'Poppins',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-weight:300;font-size:16px;line-height:1.75;overflow-x:hidden}
img{max-width:100%;display:block}
figure{margin:0}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--disp);font-weight:300;margin:0;line-height:1.08;letter-spacing:-.01em}
p{margin:0 0 1.1em}
em{font-style:italic}
.wrap{width:min(1220px,100% - 48px);margin-inline:auto}
@media(max-width:600px){.wrap{width:min(1220px,100% - 36px)}}

/* ---------- preview banner ---------- */
.pv-banner{position:fixed;top:0;left:0;right:0;z-index:200;background:#0A0A0B;color:#fff;
  display:flex;gap:14px;align-items:center;justify-content:center;flex-wrap:wrap;
  padding:9px 16px;font-size:14px;letter-spacing:.04em;border-bottom:1px solid rgba(255,255,255,.18)}
.pv-banner span{opacity:.86}
.pv-short{white-space:nowrap}
.pv-cta{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:999px;
  background:var(--gold);color:#0A0A0B;font-size:14px;font-weight:500;text-decoration:none;letter-spacing:.06em;text-indent:.06em}

/* ---------- nav ---------- */
.nav{position:fixed;top:var(--pvh);left:0;right:0;z-index:150;display:flex;align-items:center;justify-content:space-between;
  gap:18px;padding:16px 28px;transition:background .35s ease,padding .35s ease,border-color .35s;
  border-bottom:1px solid transparent}
.nav.stuck{background:rgba(10,10,11,.94);backdrop-filter:blur(10px);border-bottom-color:var(--line);padding:11px 28px}
.nav .brand{display:flex;align-items:center;min-height:44px}
.nav .brand img{height:46px;width:auto;transition:height .35s}
.nav.stuck .brand img{height:38px}
.nlinks{display:flex;align-items:center;gap:26px}
.nlinks a{display:inline-flex;align-items:center;min-height:44px;color:#fff;text-decoration:none;font-size:14px;letter-spacing:.12em;
  text-transform:uppercase;opacity:.82;transition:opacity .2s,color .2s}
.nlinks a:hover{opacity:1;color:var(--gold)}
.nlinks a.on{opacity:1;color:var(--gold)}
.nav-cta{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 22px;border:1px solid var(--gold);
  border-radius:999px;color:var(--gold);text-decoration:none;font-size:14px;letter-spacing:.14em;text-indent:.14em;text-transform:uppercase;
  transition:background .25s,color .25s}
.nav-cta:hover{background:var(--gold);color:#0A0A0B}
.burger{display:none;width:46px;height:46px;align-items:center;justify-content:center;flex-direction:column;gap:5px;
  background:none;border:0;cursor:pointer;padding:0}
.burger i{display:block;width:24px;height:1.5px;background:#fff}
.mobile-nav{position:fixed;inset:0;z-index:400;background:#0A0A0B;display:none;flex-direction:column;padding:22px}
.mobile-nav.open{display:flex}
.mn-top{display:flex;align-items:center;justify-content:space-between}
.mn-top img{height:44px;width:auto}
.mn-close{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:none;border:0;color:#fff;font-size:28px;cursor:pointer;line-height:1}
.mn-links{display:flex;flex-direction:column;margin-top:14px;overflow-y:auto}
.mn-links a{display:flex;align-items:center;min-height:56px;color:#fff;text-decoration:none;font-family:var(--disp);
  font-size:22px;letter-spacing:.02em;border-bottom:1px solid rgba(255,255,255,.1)}
.mn-foot{margin-top:auto;padding-top:18px;display:flex;flex-direction:column;gap:12px}
.mn-foot a{display:inline-flex;align-items:center;justify-content:center;min-height:52px;border-radius:999px;text-decoration:none;
  font-size:14px;letter-spacing:.14em;text-indent:.14em;text-transform:uppercase}
.mn-foot .b1{background:var(--gold);color:#0A0A0B}
.mn-foot .b2{border:1px solid rgba(255,255,255,.4);color:#fff}
@media(max-width:1120px){.nlinks{display:none}.burger{display:flex}.nav-cta{display:none}}

/* ---------- shared bits ---------- */
.eyebrow{font-family:var(--body);font-size:13.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-dark);margin:0 0 18px}
.sec-dark .eyebrow,.eyebrow.on-dark{color:var(--gold)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 34px;border-radius:999px;text-decoration:none;
  font-size:14px;letter-spacing:.16em;text-indent:.16em;text-transform:uppercase;transition:transform .25s,background .25s,color .25s;font-weight:400}
.btn:hover{transform:translateY(-2px)}
.btn-gold{background:var(--gold);color:#0A0A0B}
.btn-ink{background:var(--ink);color:#fff}
.btn-ghost{border:1px solid rgba(255,255,255,.45);color:#fff}
.btn-ghost-d{border:1px solid rgba(10,10,11,.3);color:var(--ink)}
section{padding:110px 0}
@media(max-width:760px){section{padding:74px 0}}
.sec-dark{background:var(--ink);color:#fff}
.sec-ink2{background:var(--ink2);color:#fff}
.sec-tint{background:var(--paper2)}
.sec-head{max-width:760px}
.sec-head h2{font-size:clamp(34px,4.6vw,58px)}
.sec-head p{margin-top:20px;font-size:17px;opacity:.8}
.sec-dark .sec-head p,.sec-ink2 .sec-head p{opacity:.72}
.rule{height:1px;background:var(--line-d);margin:0}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* ---------- hero ---------- */
header.hero{position:relative;background:var(--ink);color:#fff;overflow:hidden}
header.hero .hero-in{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;
  padding-top:180px;padding-bottom:110px}
header.hero .h-copy h1{font-size:clamp(44px,6.4vw,86px);font-weight:200;letter-spacing:-.02em}
header.hero .h-copy h1 em{font-style:italic;color:var(--gold)}
header.hero .h-copy p.lede{margin-top:26px;font-size:18px;line-height:1.85;color:rgba(255,255,255,.76);max-width:52ch}
.h-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}
.h-pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:38px}
.h-pills span{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border:1px solid var(--line);border-radius:999px;
  font-size:14px;letter-spacing:.08em;color:rgba(255,255,255,.78)}
.h-media{position:relative}
.h-media img{width:100%;height:min(72vh,660px);object-fit:cover;border-radius:2px}
.h-media .tagline{position:absolute;left:-28px;bottom:34px;background:var(--gold);color:#0A0A0B;padding:14px 22px;
  font-size:14px;letter-spacing:.18em;text-transform:uppercase}
header.hero .glow{position:absolute;width:620px;height:620px;border-radius:50%;top:-220px;right:-160px;
  background:radial-gradient(circle,rgba(201,169,106,.16),transparent 65%);pointer-events:none}
@media(max-width:900px){header.hero .glow,.cta .glow{width:260px;height:260px;top:-90px;right:0;left:auto;transform:none}}
@media(max-width:980px){
  header.hero .hero-in{grid-template-columns:1fr;gap:38px}
  header.hero .hero-in{padding-top:176px;padding-bottom:70px}
  .h-media .tagline{left:12px}
  .h-media img{height:56vh;min-height:340px}
}

/* page hero (interior) */
header.phero{position:relative;background:var(--ink);color:#fff;overflow:hidden}
header.phero .ph-bg{position:absolute;inset:0}
header.phero .ph-bg img{width:100%;height:100%;object-fit:cover;opacity:.34}
header.phero .ph-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,10,11,.86),rgba(10,10,11,.72) 55%,rgba(10,10,11,.95))}
header.phero .ph-in{position:relative;padding-top:200px;padding-bottom:96px;max-width:820px}
header.phero h1{font-size:clamp(38px,5.6vw,72px);font-weight:200}
header.phero p{margin-top:22px;font-size:17.5px;color:rgba(255,255,255,.78);max-width:60ch}
header.phero .ph-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
@media(max-width:980px){header.phero .ph-in{padding-top:180px;padding-bottom:64px}}

/* marquee */
.marq{background:var(--ink2);color:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:0}
.marq-track{display:flex;gap:56px;white-space:nowrap;padding:20px 0;animation:sl 34s linear infinite;will-change:transform}
.marq-track span{font-family:var(--disp);font-size:16px;letter-spacing:.28em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.marq-track span b{color:var(--gold);font-weight:400}
@keyframes sl{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marq-track{animation:none}}
@media(max-width:900px){.marq{display:none}}

/* service cards */
.svc{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:56px}
.svc a{position:relative;display:block;text-decoration:none;color:#fff;overflow:hidden;background:var(--ink3);min-height:380px}
.svc a img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.62;transition:transform .8s ease,opacity .5s}
.svc a:hover img{transform:scale(1.06);opacity:.75}
.svc .s-in{position:relative;height:100%;min-height:380px;display:flex;flex-direction:column;justify-content:flex-end;padding:30px;
  background:linear-gradient(180deg,rgba(10,10,11,.15),rgba(10,10,11,.9))}
.svc h3{font-size:27px}
.svc p{margin:10px 0 16px;font-size:15px;color:rgba(255,255,255,.76)}
.svc .more{font-size:13.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
@media(max-width:980px){.svc{grid-template-columns:repeat(2,1fr)}}
@media(max-width:660px){.svc{grid-template-columns:1fr}}

/* menu grid (drips / shots) */
.menu{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:52px}
.menu .card{background:#fff;border:1px solid var(--line-d);display:flex;flex-direction:column;transition:transform .4s ease,box-shadow .4s ease}
.sec-dark .menu .card,.sec-ink2 .menu .card{background:var(--ink3);border-color:var(--line);color:#fff}
.menu .card:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(10,10,11,.14)}
.menu .ph{background:#0A0A0B;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden}
.menu .ph img{width:100%;height:100%;object-fit:contain}
.menu .c-in{padding:26px 26px 30px;display:flex;flex-direction:column;flex:1}
.menu h3{font-size:24px}
.menu .price{margin-top:8px;font-size:15px;letter-spacing:.06em;color:var(--gold-dark)}
.sec-dark .menu .price,.sec-ink2 .menu .price{color:var(--gold)}
.menu .desc{margin-top:14px;font-size:15px;line-height:1.7;opacity:.82}
.menu .ing{margin-top:auto;padding-top:18px;font-size:14px;letter-spacing:.02em;opacity:.68;border-top:1px solid var(--line-d)}
.sec-dark .menu .ing,.sec-ink2 .menu .ing{border-top-color:var(--line)}
.menu .ing b{font-weight:500;letter-spacing:.14em;text-transform:uppercase;font-size:12.5px;display:block;margin-bottom:6px;opacity:.9}
@media(max-width:980px){.menu{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.menu{grid-template-columns:1fr}}

/* chips (add-ons) */
.chips{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:44px}
.chip{border:1px solid var(--line);padding:22px 24px;background:#17171A}
.chip .ct{display:flex;justify-content:space-between;gap:14px;align-items:baseline}
.chip h4{font-size:20px}
.chip .cp{font-size:14.5px;color:var(--gold);white-space:nowrap}
.chip p{margin:8px 0 0;font-size:14.5px;color:#C8C8CC;line-height:1.65}
@media(max-width:760px){.chips{grid-template-columns:1fr}}

/* split feature */
.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.split.rev .sp-media{order:2}
.split .sp-media img{width:100%;height:min(66vh,600px);object-fit:cover}
.split h2{font-size:clamp(30px,3.8vw,50px)}
.split p{margin-top:18px;font-size:16.5px;opacity:.82}
.split ul{list-style:none;padding:0;margin:24px 0 0}
.split li{padding:12px 0 12px 30px;position:relative;font-size:16px;border-bottom:1px solid var(--line-d)}
.sec-dark .split li,.sec-ink2 .split li{border-bottom-color:var(--line)}
.split li::before{content:"";position:absolute;left:0;top:21px;width:12px;height:1px;background:var(--gold)}
@media(max-width:900px){.split{grid-template-columns:1fr;gap:32px}.split.rev .sp-media{order:0}.split .sp-media img{height:52vh;min-height:320px}}

/* process */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:56px}
.step{padding:34px 30px;border:1px solid var(--line)}
.step .n{font-family:var(--disp);font-size:44px;color:var(--gold);line-height:1}
.step h3{margin-top:14px;font-size:23px}
.step p{margin:12px 0 0;font-size:15px;color:rgba(255,255,255,.72)}
@media(max-width:860px){.steps{grid-template-columns:1fr}}

/* team */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:56px}
.tm .tp{aspect-ratio:4/5;overflow:hidden;background:var(--ink3)}
.tm .tp img{width:100%;height:100%;object-fit:cover;object-position:top center}
.tm h3{margin-top:20px;font-size:24px}
.tm .role{font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-dark);margin-top:8px}
.sec-dark .tm .role{color:var(--gold)}
.tm p{margin-top:14px;font-size:15px;line-height:1.75;opacity:.82}
@media(max-width:900px){.team{grid-template-columns:1fr;gap:44px}}

/* reviews */
.revs{column-count:3;column-gap:24px;margin-top:52px}
.rev-c{break-inside:avoid;margin-bottom:24px;padding:28px;border:1px solid var(--line);background:#17171A}
.rev-c .stars{color:var(--gold);letter-spacing:.22em;font-size:14px}
.rev-c p{margin:14px 0 16px;font-size:15.5px;line-height:1.75;color:#EDEDEF}
.rev-c .who{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:#9C9CA1}
@media(max-width:980px){.revs{column-count:2}}
@media(max-width:640px){.revs{column-count:1}}

/* CTA band */
.cta{background:var(--ink);color:#fff;text-align:center;position:relative;overflow:hidden}
.cta .glow{position:absolute;width:700px;height:700px;border-radius:50%;left:50%;top:-260px;transform:translateX(-50%);
  background:radial-gradient(circle,rgba(201,169,106,.18),transparent 65%);pointer-events:none}
.cta h2{font-size:clamp(32px,4.6vw,58px);font-weight:200;position:relative}
.cta p{margin-top:20px;color:rgba(255,255,255,.74);position:relative}
.cta .btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:34px;position:relative}

/* form */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:34px}
.form-grid .full{grid-column:1/-1}
label{display:block;font-size:13px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:8px;opacity:.75}
input,textarea,select{width:100%;min-height:52px;background:#17171A;border:1px solid var(--line);color:#fff;
  padding:14px 16px;font-family:var(--body);font-size:16px;border-radius:2px}
textarea{min-height:150px;resize:vertical}
input::placeholder,textarea::placeholder{color:rgba(255,255,255,.38)}
.form-note{margin-top:16px;font-size:14px;color:rgba(255,255,255,.55)}
@media(max-width:700px){.form-grid{grid-template-columns:1fr}}

/* contact detail cards */
.cinfo{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:44px}
.cinfo .ci{border:1px solid var(--line);padding:30px}
.cinfo .ci h3{font-size:21px}
.cinfo .ci a,.cinfo .ci p{display:inline-flex;align-items:center;min-height:44px;margin:8px 0 0;font-size:16px;
  color:var(--gold);text-decoration:none;overflow-wrap:anywhere}
.cinfo .ci p{color:rgba(255,255,255,.75)}
@media(max-width:860px){.cinfo{grid-template-columns:1fr}}

/* footer */
footer{background:#050506;color:#fff;padding:76px 0 34px}
.f-top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:44px}
.f-top img.flogo{height:74px;width:auto}
.f-top p{margin-top:20px;font-size:15px;color:rgba(255,255,255,.62);max-width:40ch}
.f-col h4{font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-family:var(--body);font-weight:500}
.f-col a{display:inline-flex;align-items:center;min-height:40px;color:rgba(255,255,255,.72);text-decoration:none;font-size:15px;overflow-wrap:anywhere}
.f-col a:hover{color:#fff}
.f-col nav{display:flex;flex-direction:column;margin-top:8px}
.f-bot{margin-top:56px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;
  gap:16px;flex-wrap:wrap;font-size:14px;color:rgba(255,255,255,.45)}
@media(max-width:860px){.f-top{grid-template-columns:1fr;gap:30px}}

@media(max-width:900px){
  header.hero .glow, section.cta .glow{width:240px;height:240px;top:-80px;right:0;left:auto;transform:none}
}

@media(min-width:981px){.chips.three{grid-template-columns:repeat(3,1fr)}}
