/* ============================================================
   951 Luxury Restrooms — Design System
   Palette: onyx black, champagne gold, marble cream, LED sapphire
   ============================================================ */
:root{
  --ink:#0B0B0F;
  --coal:#111116;
  --panel:#16161d;
  --panel-2:#1c1c25;
  --gold:#C9A24B;
  --gold-2:#E8CD8A;
  --gold-deep:#8f6f2a;
  --cream:#F2EDE3;
  --muted:#B9B3A6;
  --sapphire:#4257ff;
  --line:rgba(201,162,75,.22);
  --line-soft:rgba(255,255,255,.07);
  --grad-gold:linear-gradient(115deg,#a97f2f 0%,#e8cd8a 45%,#c9a24b 70%,#8f6f2a 100%);
  --shadow-lg:0 30px 60px -20px rgba(0,0,0,.7);
  --shadow-gold:0 12px 40px -12px rgba(201,162,75,.35);
  --radius:18px;
  --font-display:"Playfair Display",Georgia,serif;
  --font-body:"Jost","Inter",system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;counter-reset:sec}
body{
  background:var(--ink);
  color:var(--cream);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  position:relative;
}
/* Fine film-grain texture — the single detail that separates a
   flat vector template from something that feels art-directed. */
body::before{
  content:"";position:fixed;inset:0;z-index:1;pointer-events:none;
  opacity:.045;mix-blend-mode:overlay;
  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.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{width:min(1180px,92%);margin-inline:auto}

::selection{background:var(--gold);color:#14110a}

/* ---------- Typography ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:.65rem;
  font-size:.78rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--gold-2);font-weight:500;
}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--grad-gold)}
h1,h2,h3,.display{font-family:var(--font-display);font-weight:800;line-height:1.12;color:#fff}
h1{font-size:clamp(2.4rem,5.2vw,4.1rem);letter-spacing:-.01em}
h2{font-size:clamp(1.9rem,3.6vw,2.9rem);letter-spacing:-.01em}
h3{font-size:1.25rem;font-weight:700}
.gold-text{
  background:var(--grad-gold);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.lead{color:var(--muted);font-size:1.08rem;max-width:56ch}
.section-head{max-width:640px;margin-bottom:3.2rem;position:relative;padding-left:2.5rem}
.section-head .lead{margin-top:1rem}
.section-head::before{
  counter-increment:sec;
  content:counter(sec,decimal-leading-zero);
  position:absolute;left:0;top:.1rem;
  font-family:var(--font-display);font-weight:800;font-size:.95rem;
  color:transparent;-webkit-text-stroke:1px rgba(201,162,75,.55);
  letter-spacing:.05em;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  padding:1rem 1.9rem;border-radius:999px;position:relative;
  font-weight:600;font-size:.95rem;letter-spacing:.04em;
  transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease,background .3s ease,color .3s ease;
  cursor:pointer;border:none;font-family:var(--font-body);
}
.btn svg{flex:none;transition:transform .3s ease}
.btn:active{transform:translateY(0) scale(.97)}
.btn-gold{
  background:var(--grad-gold);color:#171204;
  box-shadow:var(--shadow-gold);
}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 20px 55px -12px rgba(201,162,75,.6),0 2px 0 rgba(255,255,255,.15) inset}
.btn-gold:hover svg{transform:rotate(-8deg) scale(1.05)}
.btn-ghost{
  background:transparent;color:var(--cream);
  border:1px solid rgba(242,237,227,.28);
}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold-2);transform:translateY(-2px);box-shadow:0 12px 30px -16px rgba(201,162,75,.3)}
.btn-dark{
  background:#101014;color:var(--gold-2);border:1px solid var(--line);
}
.btn-dark:hover{background:#17171d;transform:translateY(-2px);border-color:rgba(201,162,75,.4)}

/* ---------- Header / Nav ---------- */
/* IMPORTANT: backdrop-filter must NOT be applied directly to .top. Per spec,
   filter/backdrop-filter on an element makes it the containing block for its
   own fixed-position descendants — and .links (the fullscreen mobile menu)
   lives inside .top. On real phones (Safari especially) that collapsed the
   "fullscreen" mobile menu down to the height of the nav bar the instant you
   scrolled, making it unusable. The blur glass effect lives on a ::before
   pseudo-element instead, so .top itself never gets backdrop-filter and
   .links continues to position against the real viewport. */
.top{
  position:fixed;inset:0 0 auto 0;z-index:100;
  transition:border-color .3s ease,box-shadow .3s ease;
  border-bottom:1px solid transparent;
}
.top::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:rgba(9,9,12,.82);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  opacity:0;transition:opacity .3s ease;
}
.top.scrolled{
  border-bottom-color:var(--line-soft);
  box-shadow:0 10px 40px -20px rgba(0,0,0,.8);
}
.top.scrolled::before{opacity:1}
.nav{display:flex;align-items:center;justify-content:space-between;padding:.9rem 0}
.brand{display:flex;align-items:center;gap:.8rem;font-family:var(--font-display);font-weight:800;font-size:1.05rem;line-height:1.15;color:#fff}
.brand small{display:block;font-family:var(--font-body);font-weight:500;font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-2)}
.links{display:flex;align-items:center;gap:2rem;font-size:.92rem;font-weight:500}
.links a:not(.btn){position:relative;padding:.3rem 0;color:rgba(242,237,227,.85);transition:color .2s}
.links a:not(.btn):hover,.links a.active{color:var(--gold-2)}
.links a:not(.btn)::after{
  content:"";position:absolute;left:0;bottom:0;width:0;height:1.5px;
  background:var(--grad-gold);transition:width .25s ease;
}
.links a:not(.btn):hover::after,.links a.active::after{width:100%}
.brand svg,.brand-mark{transition:transform .5s cubic-bezier(.16,1,.3,1)}
.brand:hover svg,.brand:hover .brand-mark{transform:rotate(8deg)}
.brand-mark{object-fit:contain;flex:none;width:64px;height:64px;filter:drop-shadow(0 4px 14px rgba(201,162,75,.25))}
.links .btn{padding:.7rem 1.4rem;font-size:.85rem}
.menu-btn{display:none;background:none;border:none;cursor:pointer;padding:.4rem;z-index:110}
.menu-btn svg{width:28px;height:28px;stroke:var(--cream)}

/* ---------- Hero ---------- */
.hero{
  position:relative;min-height:100svh;
  display:flex;align-items:center;
  padding:8.5rem 0 5rem;
  isolation:isolate;overflow:hidden;
}
.hero-media{position:absolute;inset:0;z-index:-2;background:var(--coal)}
.hero-media video,.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 38%}
.hero-scrim{
  position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(90deg,rgba(9,9,13,.96) 0%,rgba(9,9,13,.82) 38%,rgba(9,9,13,.55) 62%,rgba(9,9,13,.72) 100%),
    linear-gradient(0deg,var(--ink) 0%,rgba(11,11,15,0) 30%),
    radial-gradient(120% 90% at 50% 50%,transparent 55%,rgba(0,0,0,.45) 100%);
}
.hero-grid{
  display:grid;grid-template-columns:1.15fr .85fr;gap:4rem;align-items:center;
}
.hero h1{margin:1.2rem 0 1.4rem}
.hero .lead{font-size:1.13rem}
.hero-points{list-style:none;margin:1.8rem 0 2.2rem;display:grid;gap:.75rem}
.hero-points li{display:flex;gap:.8rem;align-items:flex-start;color:rgba(242,237,227,.92);font-size:1rem}
.hero-points svg{flex:none;margin-top:.2rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}
.hero-sub{margin-top:1.4rem;font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(242,237,227,.55)}

/* ---------- Quote card ---------- */
.quote-card{
  background:rgba(17,17,23,.88);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:2.1rem 2rem;
  box-shadow:var(--shadow-lg),0 0 0 1px rgba(201,162,75,.06) inset;
  position:relative;
}
.quote-card::before{
  content:"";position:absolute;inset:0 0 auto 0;height:3px;border-radius:18px 18px 0 0;
  background:var(--grad-gold);
}
.quote-card h3{font-size:1.45rem;margin-bottom:.35rem}
.quote-card p{color:var(--muted);font-size:.92rem;margin-bottom:1.4rem}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.form-grid .full{grid-column:1/-1}
label{display:block;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-2);margin-bottom:.4rem;font-weight:600}
input,select,textarea{
  width:100%;padding:.85rem 1rem;
  background:#0d0d12;border:1px solid var(--line-soft);border-radius:10px;
  color:var(--cream);font-family:var(--font-body);font-size:.95rem;
  transition:border-color .2s,box-shadow .2s;
  appearance:none;-webkit-appearance:none;
}
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='%23C9A24B' stroke-width='2'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center}
input::placeholder,textarea::placeholder{color:rgba(185,179,166,.5)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,162,75,.15)}
textarea{resize:vertical;min-height:96px}
.form-note{font-size:.78rem;color:rgba(185,179,166,.65);margin-top:.9rem;text-align:center}
.quote-card .btn{width:100%;margin-top:1.1rem}

/* ---------- Photo strip (marquee) ---------- */
.strip{
  overflow:hidden;background:var(--coal);
  border-block:1px solid var(--line-soft);
  padding:1.4rem 0;position:relative;
}
.strip::before,.strip::after{
  content:"";position:absolute;top:0;bottom:0;width:110px;z-index:2;pointer-events:none;
}
.strip::before{left:0;background:linear-gradient(90deg,var(--ink),transparent)}
.strip::after{right:0;background:linear-gradient(270deg,var(--ink),transparent)}
.strip-track{
  display:flex;gap:1.1rem;width:max-content;
  animation:marquee 45s linear infinite;
  will-change:transform;
}
.strip:hover .strip-track{animation-play-state:paused}
.strip-track img{
  height:250px;width:auto;object-fit:cover;
  border-radius:14px;border:1px solid var(--line-soft);
}
@keyframes marquee{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .strip-track{animation:none;overflow-x:auto}
  .strip{overflow-x:auto}
}

/* ---------- Trust bar ---------- */
.trustbar{border-block:1px solid var(--line-soft);background:var(--coal)}
.trust-items{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding:1.5rem 0;
}
.trust-items div{display:flex;align-items:center;gap:.9rem;justify-content:center;font-size:.9rem;color:rgba(242,237,227,.85);letter-spacing:.02em}
.trust-items svg{flex:none}

/* ---------- Sections ---------- */
.section{padding:6.5rem 0}
.section.tint{background:var(--coal)}

/* Amenities */
.amenity-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.amenity{
  background:var(--panel);border:1px solid var(--line-soft);border-radius:var(--radius);
  padding:1.8rem 1.5rem;transition:transform .35s cubic-bezier(.16,1,.3,1),border-color .3s ease,background .3s ease,box-shadow .35s ease;
}
.amenity:hover{transform:translateY(-6px);border-color:var(--line);background:var(--panel-2);box-shadow:var(--shadow-lg)}
.amenity .icon{
  width:52px;height:52px;border-radius:14px;display:grid;place-items:center;
  background:rgba(201,162,75,.1);border:1px solid var(--line);margin-bottom:1.2rem;
  transition:transform .35s cubic-bezier(.16,1,.3,1),background .3s ease;
}
.amenity:hover .icon{transform:scale(1.08) rotate(-4deg)}
/* First tile reads as the flagship amenity — breaks the uniform-grid feel */
.amenity:first-child{
  background:linear-gradient(160deg,rgba(201,162,75,.09),var(--panel) 60%);
  border-color:var(--line);
}
.amenity:first-child .icon{background:rgba(201,162,75,.18)}
.amenity h3{font-size:1.05rem;margin-bottom:.45rem;font-family:var(--font-body);font-weight:600;letter-spacing:.01em}
.amenity p{font-size:.88rem;color:var(--muted);line-height:1.55}

/* Showcase / editorial split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.split .lead{margin-top:1.1rem}
.frame{
  position:relative;border-radius:var(--radius);overflow:hidden;
  border:1px solid var(--line);box-shadow:var(--shadow-lg);
}
.frame img,.frame video{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.16,1,.3,1),filter .5s ease}
.frame:hover img{transform:scale(1.035)}
/* Gallery-style corner brackets — reads as photography portfolio, not stock template */
.frame::before,.frame::after{
  content:"";position:absolute;width:26px;height:26px;z-index:2;pointer-events:none;
  border-color:rgba(232,205,138,.85);border-style:solid;border-width:0;
  transition:width .35s ease,height .35s ease;
}
.frame::before{top:12px;left:12px;border-top-width:1.5px;border-left-width:1.5px}
.frame::after{bottom:12px;right:12px;border-bottom-width:1.5px;border-right-width:1.5px}
.frame:hover::before,.frame:hover::after{width:34px;height:34px}
.frame-tag{
  position:absolute;left:1.1rem;bottom:1.1rem;z-index:2;
  background:rgba(9,9,12,.78);backdrop-filter:blur(8px);
  border:1px solid var(--line);border-radius:999px;
  padding:.45rem 1rem;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-2);
}
.stat-row{display:flex;gap:2.6rem;margin-top:2rem;flex-wrap:wrap}
.stat-row div{position:relative;padding-left:2.6rem}
.stat-row div:first-child{padding-left:0}
.stat-row div:not(:first-child)::before{
  content:"";position:absolute;left:0;top:.2rem;bottom:.2rem;width:1px;
  background:linear-gradient(180deg,transparent,var(--line),transparent);
}
.stat-row b{display:block;font-family:var(--font-display);font-size:2rem;color:var(--gold-2)}
.stat-row span{font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.checklist{list-style:none;display:grid;gap:.8rem;margin-top:1.6rem}
.checklist li{display:flex;gap:.85rem;align-items:flex-start;color:rgba(242,237,227,.9)}
.checklist svg{flex:none;margin-top:.25rem}

/* Gallery */
.masonry{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
.g-item{position:relative;overflow:hidden;border-radius:var(--radius);border:1px solid var(--line-soft);background:var(--panel);transition:border-color .3s ease}
.g-item:hover{border-color:var(--line)}
.g-item img,.g-item video{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.16,1,.3,1)}
.g-item:hover img{transform:scale(1.045)}
.g-item .frame-tag{pointer-events:none}
.g-item::before,.g-item::after{
  content:"";position:absolute;width:0;height:0;z-index:2;pointer-events:none;
  border-color:rgba(232,205,138,.85);border-style:solid;border-width:0;
  transition:width .35s ease,height .35s ease;
}
.g-item::before{top:10px;left:10px;border-top-width:1.5px;border-left-width:1.5px}
.g-item::after{bottom:10px;right:10px;border-bottom-width:1.5px;border-right-width:1.5px}
.g-item:hover::before,.g-item:hover::after{width:22px;height:22px}
.lightbox-trigger{cursor:zoom-in}
.lightbox-trigger:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}

/* Photo lightbox */
.lightbox-overlay{
  position:fixed;inset:0;z-index:200;
  background:rgba(5,5,7,.92);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;padding:3rem 1.2rem;
  opacity:0;pointer-events:none;transition:opacity .3s ease;
}
.lightbox-overlay.open{opacity:1;pointer-events:auto}
.lightbox-overlay img{
  max-width:min(92vw,1100px);max-height:86vh;width:auto;height:auto;
  border-radius:14px;border:1px solid var(--line);box-shadow:var(--shadow-lg);
  transform:scale(.96);transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.lightbox-overlay.open img{transform:scale(1)}
.lightbox-close{
  position:absolute;top:1.5rem;right:1.5rem;width:44px;height:44px;border-radius:50%;
  display:grid;place-items:center;background:rgba(255,255,255,.06);border:1px solid var(--line);
  color:var(--cream);cursor:pointer;transition:background .25s,transform .3s,color .25s;
}
.lightbox-close svg{width:18px;height:18px}
.lightbox-close:hover{background:var(--grad-gold);color:#171204;transform:rotate(90deg)}

/* Video tour */
.phone-frame{
  width:min(340px,86vw);margin-inline:auto;
  border-radius:34px;border:1px solid var(--line);
  padding:.65rem;background:linear-gradient(160deg,#1b1b22,#0e0e13);
  box-shadow:var(--shadow-lg);
}
.phone-frame video{border-radius:26px;width:100%;background:#000}

/* Event cards */
.event-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.event-card{
  position:relative;border-radius:var(--radius);overflow:hidden;
  border:1px solid var(--line-soft);background:var(--panel);
  padding:2rem 1.7rem;min-height:230px;display:flex;flex-direction:column;justify-content:flex-end;
  transition:transform .3s ease,border-color .3s ease;
}
.event-card:hover{transform:translateY(-6px);border-color:var(--line)}
.event-card .num{
  position:absolute;top:1.2rem;right:1.4rem;
  font-family:var(--font-display);font-size:2.6rem;font-weight:800;
  color:transparent;-webkit-text-stroke:1px rgba(201,162,75,.35);
}
.event-card h3{margin-bottom:.5rem}
.event-card p{font-size:.9rem;color:var(--muted)}

/* Steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.step{
  background:var(--panel);border:1px solid var(--line-soft);border-radius:var(--radius);
  padding:2rem 1.7rem;position:relative;
}
.step b{display:block;font-family:var(--font-display);font-size:1.2rem;color:#fff;margin:.9rem 0 .5rem}
.step p{font-size:.92rem;color:var(--muted)}
.step .badge{
  width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  background:var(--grad-gold);color:#171204;font-weight:700;font-family:var(--font-display);font-size:1.1rem;
}

/* Service area */
.chips{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.8rem}
.chip{
  padding:.6rem 1.15rem;border-radius:999px;font-size:.88rem;
  border:1px solid var(--line);color:rgba(242,237,227,.88);
  background:rgba(201,162,75,.05);transition:background .25s,color .25s,transform .25s,box-shadow .25s;
}
.chip:hover{background:var(--grad-gold);color:#171204;transform:translateY(-2px);box-shadow:0 10px 24px -10px rgba(201,162,75,.5)}

/* CTA band */
.cta-band{
  position:relative;border-radius:calc(var(--radius) + 6px);overflow:hidden;
  padding:4.5rem 3rem;text-align:center;isolation:isolate;
  border:1px solid var(--line);
  background:
    radial-gradient(700px 300px at 50% -10%,rgba(201,162,75,.22),transparent 70%),
    linear-gradient(160deg,#15151c,#0c0c11);
}
.cta-band h2{max-width:18ch;margin-inline:auto}
.cta-band p{color:var(--muted);margin:1.1rem auto 2rem;max-width:48ch}
.cta-band .hero-cta{justify-content:center}

/* Page hero (subpages) */
.page-hero{
  padding:11rem 0 5rem;position:relative;isolation:isolate;overflow:hidden;
  background:
    radial-gradient(900px 420px at 85% 0%,rgba(201,162,75,.14),transparent 65%),
    radial-gradient(600px 300px at 0% 100%,rgba(66,87,255,.08),transparent 60%),
    var(--coal);
  border-bottom:1px solid var(--line-soft);
}
.page-hero h1{margin:1.1rem 0 1rem;max-width:18ch}
.page-hero .lead{max-width:60ch}

/* Contact */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:3.5rem;align-items:start}
.info-card{
  background:var(--panel);border:1px solid var(--line-soft);border-radius:var(--radius);
  padding:1.6rem 1.6rem;display:flex;gap:1.1rem;align-items:flex-start;margin-bottom:1rem;
  transition:border-color .3s;
}
.info-card:hover{border-color:var(--line)}
.info-card .icon{width:46px;height:46px;flex:none;border-radius:12px;display:grid;place-items:center;background:rgba(201,162,75,.1);border:1px solid var(--line)}
.info-card b{display:block;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-2);margin-bottom:.25rem;font-weight:600}
.info-card a{font-size:1.05rem;transition:color .2s}
.info-card a:hover{color:var(--gold-2)}
.socials{display:flex;gap:.8rem;margin-top:1.4rem}
.socials a{
  width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  border:1px solid var(--line);transition:background .25s,transform .25s;
}
.socials a:hover{background:var(--grad-gold);transform:translateY(-3px)}
.socials a:hover svg path{fill:#171204}

/* Footer */
.footer{border-top:1px solid var(--line-soft);background:#08080b;padding:4.5rem 0 2rem;position:relative;overflow:hidden;isolation:isolate}
.footer::after{
  content:"951";position:absolute;left:50%;bottom:-6.5rem;transform:translateX(-50%);
  font-family:var(--font-display);font-weight:800;font-size:min(24vw,17rem);line-height:1;
  color:transparent;-webkit-text-stroke:1px rgba(201,162,75,.09);
  pointer-events:none;z-index:-1;letter-spacing:-.02em;white-space:nowrap;
}
.footer .wrap{position:relative}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2.5rem;margin-bottom:3rem}
.foot-grid h4{font-size:.78rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-2);margin-bottom:1.1rem;font-weight:600}
.foot-grid a,.foot-grid p{display:block;color:var(--muted);font-size:.93rem;margin-bottom:.55rem;transition:color .2s}
.foot-grid a:hover{color:var(--gold-2)}
.foot-bottom{
  border-top:1px solid var(--line-soft);padding-top:1.6rem;
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  font-size:.82rem;color:rgba(185,179,166,.6);
}

/* Sticky mobile call bar */
.callbar{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:90;
  background:rgba(9,9,12,.9);backdrop-filter:blur(14px);
  border-top:1px solid var(--line);padding:.7rem .9rem;
  gap:.7rem;
}
.callbar .btn{flex:1;padding:.85rem 1rem;font-size:.9rem}

/* Reveal animation — .reveal is ALWAYS fully visible (opacity:1, no transform,
   no transition-based hiding). Content never depends on JavaScript to appear.
   When script.js runs and a section scrolls into view, it adds .in, which
   plays a one-time slide-in flourish via @keyframes — purely decorative. */
.reveal{opacity:1}
.reveal.in{animation:reveal-in .7s cubic-bezier(.16,1,.3,1)}
@keyframes reveal-in{
  from{opacity:.55;transform:translateY(22px)}
  to{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){
  .reveal.in{animation:none}
  html{scroll-behavior:auto}
}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .hero-grid{grid-template-columns:1fr;gap:3rem}
  .amenity-grid{grid-template-columns:repeat(2,1fr)}
  .trust-items{grid-template-columns:repeat(2,1fr)}
  .event-grid,.steps{grid-template-columns:repeat(2,1fr)}
  .split,.contact-grid{grid-template-columns:1fr;gap:2.5rem}
  .foot-grid{grid-template-columns:1fr 1fr}
  .masonry{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  body{font-size:15.5px}
  .menu-btn{display:block}
  .links{
    position:fixed;inset:0;background:rgba(8,8,11,.97);
    flex-direction:column;justify-content:center;gap:1.8rem;font-size:1.2rem;
    opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:105;
  }
  .links.open{opacity:1;pointer-events:auto}

  /* Tighter vertical rhythm end to end — mobile shouldn't feel like an
     endless scroll of desktop-sized whitespace. */
  .section{padding:3rem 0}
  .section-head{margin-bottom:2.2rem;padding-left:1.8rem}
  .hero{min-height:auto;padding:6.2rem 0 2.8rem}
  .hero .lead{font-size:1rem}
  .hero-points{margin:1.3rem 0 1.6rem;gap:.55rem}
  .hero-sub{margin-top:1rem}
  .quote-card{padding:1.6rem 1.4rem}

  /* Two-up grids read faster and cut page length roughly in half vs. one
     card per row, without cramming the content. */
  .amenity-grid,.event-grid,.masonry{grid-template-columns:repeat(2,1fr);gap:.8rem}
  .steps{grid-template-columns:1fr;gap:1rem}
  .amenity{padding:1.3rem 1.1rem}
  .amenity h3{font-size:.95rem}
  .amenity p{font-size:.82rem}
  .event-card{padding:1.4rem 1.1rem;min-height:170px}
  .event-card .num{font-size:1.9rem}

  .form-grid{grid-template-columns:1fr}
  .trust-items{grid-template-columns:1fr;justify-items:start;padding:1.1rem 0;gap:.7rem}
  .trust-items div{justify-content:flex-start}
  .split{gap:1.8rem}
  .cta-band{padding:2.6rem 1.4rem}
  .callbar{display:flex}
  .footer{padding:3rem 0 6rem}
  .foot-grid{grid-template-columns:1fr;gap:1.8rem;margin-bottom:2rem}
  .page-hero{padding:7.5rem 0 3rem}
  .footer::after{bottom:-4.5rem;font-size:28vw}
  .brand-mark{width:52px;height:52px}
  .strip-track img{height:170px}
  .strip{padding:1rem 0}
}
