/* ============================================================
   LANTANA — shared design system
   ============================================================ */

:root{
  /* surfaces */
  --cream:#F8F0E5;
  --cream-deep:#F4EBDF;
  --sand:#F3E0D2;
  --coffee:#3A2F26;
  --coffee-deep:#2C231C;
  --agave:#25372E;

  /* accents */
  --terracotta:#CB6A4A;
  --terracotta-deep:#B0563A;
  --olive:#6B6F4E;
  --blackberry:#4A3A5C;
  --gold:#B9873F;
  --gold-soft:#C9A15F;

  /* type */
  --display:'Zilla Slab', Georgia, serif;
  --ui:'Jost', system-ui, sans-serif;

  --fs-display:clamp(2.8rem, 9vw, 6.5rem);
  --fs-h2:clamp(1.9rem, 4vw, 3rem);
  --fs-h3:1.25rem;
  --fs-lead:clamp(1.05rem, 2vw, 1.25rem);
  --fs-body:1rem;
  --fs-eyebrow:0.68rem;

  --gut:clamp(20px, 5vw, 64px);
  --header-h:104px;
  --maxw:1240px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth;}
body{
  background:var(--cream); color:var(--coffee);
  font-family:var(--ui); font-weight:300; font-size:var(--fs-body);
  line-height:1.6; overflow-x:hidden;
}
img{max-width:100%; display:block;}
a{color:inherit;}

h1,h2,h3{
  font-family:var(--display); font-weight:700; line-height:1.02;
  letter-spacing:-0.02em; text-transform:uppercase;
}
.display{font-size:var(--fs-display); line-height:0.96;}
h2{font-size:var(--fs-h2);}
h3{font-size:var(--fs-h3); letter-spacing:-0.01em;}
.lead{font-size:var(--fs-lead); line-height:1.5;}

.eyebrow{
  font-family:var(--ui); font-weight:400; font-size:var(--fs-eyebrow);
  letter-spacing:0.32em; text-transform:uppercase; color:var(--gold);
  display:block; margin-bottom:14px;
}
.wrap{max-width:var(--maxw); margin:0 auto; padding-inline:var(--gut);}
.wrap--narrow{max-width:820px;}

/* ---------- section rhythm ---------- */
section{padding-block:clamp(64px,10vh,124px);}
.sec-head{max-width:720px; margin-bottom:clamp(36px,5vh,60px);}
.sec-head::before{
  content:""; display:block; width:56px; height:1px;
  background:var(--gold); margin-bottom:22px; opacity:.7;
}
.sec-head--center{margin-inline:auto; text-align:center;}
.sec-head--center::before{margin-inline:auto;}
.sec-head p{margin-top:16px; color:rgba(58,47,38,.78);}

.on-dark{background:var(--coffee); color:var(--sand);}
.on-agave{background:var(--agave); color:var(--sand);}
.on-sand{background:var(--sand);}
.on-plum{background:var(--blackberry); color:var(--cream);}
.on-dark .sec-head p,.on-agave .sec-head p,.on-plum .sec-head p{color:rgba(243,224,210,.78);}
.on-dark .eyebrow,.on-agave .eyebrow,.on-plum .eyebrow{color:var(--gold-soft);}

/* asymmetric split — image bleeds off the edge */
.split{display:grid; gap:clamp(28px,5vw,64px); align-items:center;}
@media (min-width:900px){
  .split{grid-template-columns:58fr 42fr;}
  .split--flip{grid-template-columns:42fr 58fr;}
  .split--flip .split__media{order:2;}
}
.split__media img{width:100%; height:100%; object-fit:cover; max-height:660px; border-radius:2px;}

/* ---------- buttons ---------- */
.btn{
  display:inline-block; padding:15px 34px; border-radius:2px;
  font-family:var(--ui); font-size:0.72rem; letter-spacing:0.22em;
  text-transform:uppercase; text-decoration:none; cursor:pointer;
  border:1px solid var(--terracotta); background:var(--terracotta); color:#fff;
  transition:background .22s,border-color .22s,color .22s;
}
.btn:hover{background:var(--terracotta-deep); border-color:var(--terracotta-deep);}
.btn--ghost{
  background:rgba(20,14,9,.34); color:var(--sand); border-color:rgba(243,224,210,.5);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
}
.btn--ghost:hover{background:var(--sand); color:var(--coffee); border-color:var(--sand);}
.btn--quiet{background:transparent; color:var(--coffee); border-color:var(--coffee);}
.btn--quiet:hover{background:var(--coffee); color:var(--cream);}

/* ---------- ticker ---------- */
.ticker{background:var(--coffee); color:var(--sand); padding:9px 0; overflow:hidden; white-space:nowrap;}
.ticker__track{display:inline-flex; animation:slide 36s linear infinite;}
.ticker span{font-size:0.66rem; letter-spacing:0.28em; text-transform:uppercase; padding:0 26px; font-weight:400;}
@keyframes slide{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ---------- header ---------- */
header.site{position:sticky; top:0; z-index:100; background:var(--coffee);}
header.site .bar{height:var(--header-h); display:flex; align-items:center; justify-content:space-between; gap:20px;}
header.site .brand img{height:72px; width:auto;}
header.site nav{display:flex; gap:clamp(12px,2vw,30px); align-items:center;}
header.site nav a{
  font-size:0.7rem; letter-spacing:0.18em; text-transform:uppercase; text-decoration:none;
  color:var(--sand); white-space:nowrap; padding-bottom:2px;
  border-bottom:1px solid transparent; transition:border-color .2s;
}
header.site nav a:hover{border-color:var(--gold-soft);}
header.site nav a.nav-cta{
  border:1px solid var(--terracotta); background:var(--terracotta); color:#fff;
  padding:10px 18px; border-radius:2px;
}
header.site nav a.nav-cta:hover{background:var(--terracotta-deep); border-color:var(--terracotta-deep);}
@media (max-width:900px){ header.site nav a.hide-sm{display:none;} header.site .brand img{height:52px;} }

/* ---------- footer ---------- */
footer.site{background:var(--coffee); color:rgba(243,224,210,.72); padding-block:clamp(46px,7vh,72px) 30px;}
footer.site .cols{
  display:grid; gap:clamp(28px,5vw,50px); grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  padding-bottom:clamp(30px,5vh,46px); border-bottom:1px solid rgba(243,224,210,.16);
}
footer.site img.mark{width:190px; margin-bottom:16px;}
footer.site h4{
  font-family:var(--ui); font-size:0.66rem; letter-spacing:0.24em; text-transform:uppercase;
  color:var(--gold-soft); margin-bottom:16px; font-weight:400;
}
footer.site ul{list-style:none; display:flex; flex-direction:column; gap:11px;}
footer.site a{text-decoration:none; font-size:0.9rem; transition:color .2s;}
footer.site a:hover{color:var(--sand);}
footer.site .tel{font-size:1.05rem; color:var(--sand); letter-spacing:.02em;}
footer.site .legal{
  margin-top:26px; display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap;
  font-size:0.72rem; color:rgba(243,224,210,.5); line-height:1.6;
}
footer.site .warn{max-width:680px;}

/* ---------- age gate ---------- */
#gate{position:fixed; inset:0; z-index:200; display:flex; align-items:center; justify-content:center;
      padding:var(--gut); text-align:center; overflow:hidden;}
#gate[hidden]{display:none;}
#gate .gbg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
#gate::after{content:""; position:absolute; inset:0;
  background:linear-gradient(to bottom,rgba(30,20,12,.62),rgba(30,20,12,.78));}
#gate .inner{position:relative; z-index:2; max-width:440px;}
#gate img.mark{width:min(64vw,260px); margin:0 auto clamp(26px,5vh,40px);}
#gate h2{font-size:clamp(1.45rem,5.2vw,1.95rem); color:#FBF5EC;}
#gate p{margin-top:14px; font-size:.92rem; color:rgba(251,245,236,.75);}
#gate .row{display:flex; gap:12px; justify-content:center; margin-top:30px; flex-wrap:wrap;}
#gate .deny{margin-top:24px; font-size:.9rem; color:var(--sand); display:none;}
#gate.denied .deny{display:block;}
#gate.denied .row{display:none;}

/* ---------- motion ---------- */
html.js [data-reveal]{
  opacity:0; transform:translateY(8px);
  transition:opacity .25s ease-out, transform .25s ease-out;
}
html.js [data-reveal].is-in{opacity:1; transform:none;}
body{transition:opacity .12s ease;}
body.is-leaving{opacity:0;}

@media (prefers-reduced-motion: reduce){
  html.js [data-reveal]{opacity:1; transform:none; transition:none;}
  body,body.is-leaving{transition:none; opacity:1;}
  .ticker__track{animation:none;}
  html{scroll-behavior:auto;}
}
