/* ==========================================================================
   Venuralink — website stylesheet
   Derived from the approved brand system (tokens.css, Brand Identity deck).
   Colour use is governed by measured WCAG contrast — see ACCESSIBILITY below.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600&family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

/* --------------------------------------------------------------------------
   ACCESSIBILITY — measured contrast ratios against the brand palette.
   Navy on cream ........ 17.03:1  AAA  -> body copy, all sizes
   Cream on navy ........ 17.03:1  AAA  -> body copy on dark
   Amber on navy ......... 8.44:1  AAA  -> safe on dark only
   Copper on navy ........ 4.83:1  AA   -> body size ok on dark
   White on emerald ...... 4.58:1  AA   -> button labels ok
   Emerald on cream ...... 4.43:1       -> LARGE TEXT / headings only
   Copper on cream ....... 3.53:1       -> LARGE TEXT / accents only
   Amber on cream ........ 2.02:1  FAIL -> never used for text. Decorative only.
   Rule enforced below: emerald + copper never carry body copy on cream.
   -------------------------------------------------------------------------- */

:root{
  --emerald:#008751;
  --emerald-deep:#006C41;
  --copper:#C86D51;
  --copper-deep:#B85B35;
  --navy:#0A192F;
  --navy-2:#0F2340;
  --cream:#FDFBF7;
  --cream-2:#F6F1E7;
  --line:rgba(10,25,47,0.10);
  --line-strong:rgba(10,25,47,0.16);
  --ink-70:rgba(10,25,47,0.72);
  --ink-55:rgba(10,25,47,0.55);
  --ink-40:rgba(10,25,47,0.40);
  --white-70:rgba(253,251,247,0.72);
  --white-55:rgba(253,251,247,0.55);
  --white-15:rgba(253,251,247,0.15);
  --serif:'Playfair Display','Times New Roman',serif;
  --sans:'Inter',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --wrap:1200px;
  --gut:clamp(20px,5vw,64px);
}

*,*::before,*::after{box-sizing:border-box;}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}

body{
  margin:0;
  background:var(--cream);
  color:var(--navy);                 /* 17.03:1 — body copy is navy, always */
  font-family:var(--sans);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{max-width:100%;height:auto;display:block;}

/* ---------- skip link (keyboard + screen reader) ---------- */
.skip{
  position:absolute;left:-9999px;top:0;
  background:var(--navy);color:var(--cream);
  padding:14px 22px;z-index:999;border-radius:0 0 8px 0;
  font-weight:600;text-decoration:none;
}
.skip:focus{left:0;}

/* ---------- focus visibility (never removed) ---------- */
a:focus-visible,button:focus-visible,input:focus-visible,
textarea:focus-visible,select:focus-visible{
  outline:3px solid var(--emerald);
  outline-offset:3px;
  border-radius:3px;
}

/* ---------- layout ---------- */
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut);}
.section{padding:clamp(64px,9vw,124px) 0;}
.section--tight{padding:clamp(44px,6vw,76px) 0;}
.section--navy{background:var(--navy);color:var(--cream);}
.section--cream2{background:var(--cream-2);}

.rule{height:1px;background:var(--line);border:0;margin:0;}
.section--navy .rule{background:var(--white-15);}

/* ---------- type ---------- */
.eyebrow{
  font-size:12px;font-weight:600;letter-spacing:0.3em;text-transform:uppercase;
  color:var(--emerald-deep);                /* deepened for small-text contrast */
  margin:0 0 18px;
}
.section--navy .eyebrow{color:#7FD6AE;}      /* light emerald reads on navy */

h1,h2,h3,h4{font-family:var(--serif);font-weight:600;letter-spacing:-0.01em;margin:0;}
h1{font-size:clamp(40px,6.4vw,78px);line-height:1.06;}
h2{font-size:clamp(30px,4.4vw,54px);line-height:1.12;}
h3{font-size:clamp(21px,2.3vw,27px);line-height:1.22;}

/* accent word — italic, large sizes only (>=30px), so 3.53:1 is compliant */
.accent{font-style:italic;font-weight:500;color:var(--copper-deep);}
.section--navy .accent{color:#E8A98C;}

.lede{
  font-size:clamp(18px,2.1vw,23px);
  line-height:1.6;color:var(--ink-70);
  max-width:62ch;margin:22px 0 0;
}
.section--navy .lede{color:var(--white-70);}

p{margin:0 0 1.1em;}
p:last-child{margin-bottom:0;}

.tagline{
  font-family:var(--serif);font-style:italic;
  font-size:clamp(17px,1.9vw,21px);
  color:var(--copper-deep);margin:0;
}


/* ============================================================================
 * C49 F2 · Global :focus-visible — accessibility affordance for keyboard nav
 * --------------------------------------------------------------------------
 * The site previously relied on browser default focus rings. This adds a
 * clear copper 3-px outline for keyboard users while keeping mouse focus
 * unobtrusive. :focus-visible only fires on keyboard (Tab) traversal, not
 * on mouse clicks — the mouse click focus is invisible, as most users expect.
 * Applied globally with sensible per-element overrides where needed.
 * ============================================================================ */
:focus{outline:none;}
:focus-visible{
  outline:3px solid var(--copper);
  outline-offset:2px;
  border-radius:4px;
}
/* Buttons + form fields already have a rounded shape — keep the outline
   shaped to match their radius */
.btn:focus-visible,
.field input:focus-visible,
.field select:focus-visible,
.field textarea:focus-visible{
  outline:3px solid var(--copper);
  outline-offset:3px;
  border-radius:inherit;
}
/* Nav links: outline hugs the underline/pill shape */
.nav__links a:focus-visible,
.mega__col a:focus-visible,
.account__panel a:focus-visible,
.menu__panel a:focus-visible{
  outline:2px solid var(--copper-deep);
  outline-offset:4px;
  border-radius:3px;
}
/* Details summary: keep the outline just around the summary content */
summary:focus-visible{
  outline:3px solid var(--copper);
  outline-offset:2px;
  border-radius:6px;
}

/* ---------- header ---------- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(253,251,247,0.94);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex;align-items:center;justify-content:space-between;
  gap:28px;min-height:76px;
}
.nav__logo{display:flex;align-items:center;flex-shrink:0;}
.nav__logo img{width:170px;}
.nav__links{
  display:flex;align-items:center;gap:clamp(14px,2.4vw,34px);
  list-style:none;margin:0;padding:0;
}
.nav__links a{
  color:var(--navy);text-decoration:none;
  font-size:15px;font-weight:500;
  padding:8px 2px;border-bottom:2px solid transparent;
}
.nav__links a:hover{border-bottom-color:var(--copper);}
.nav__links a[aria-current="page"]{border-bottom-color:var(--emerald);font-weight:600;}
.nav__cta{flex-shrink:0;}

/* mobile nav: details/summary — works with zero JS */
.menu{display:none;}
.menu>summary{
  list-style:none;cursor:pointer;padding:10px;
  border:1px solid var(--line-strong);border-radius:8px;
}
.menu>summary::-webkit-details-marker{display:none;}
.menu__bars{display:block;width:22px;height:2px;background:var(--navy);position:relative;}
.menu__bars::before,.menu__bars::after{
  content:"";position:absolute;left:0;width:22px;height:2px;background:var(--navy);
}
.menu__bars::before{top:-7px;} .menu__bars::after{top:7px;}
.menu__panel{
  position:absolute;left:0;right:0;
  background:var(--cream);border-bottom:1px solid var(--line);
  padding:12px var(--gut) 22px;
}
.menu__panel ul{list-style:none;margin:0;padding:0;}
.menu__panel a{
  display:block;padding:14px 0;color:var(--navy);
  text-decoration:none;font-weight:500;font-size:17px;
  border-bottom:1px solid var(--line);
}
/* Signed-in identity card at the top of the mobile menu */
.menu__me{
  padding:14px 0;border-bottom:1px solid var(--line);
  display:flex;flex-direction:column;gap:2px;
}
.menu__me b{
  font-family:var(--serif);font-weight:500;font-size:18px;letter-spacing:-.005em;
  color:var(--navy);
}
.menu__me small{
  font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-55);
}
/* Sign out link in mobile menu — copper, matches desktop */
.menu__panel a[data-auth-signout]{color:var(--copper-deep)}

/* ---------- mega menu + account dropdown (details/summary, no JS) ----------
   .nav__drop is deliberately position:static so the absolutely-positioned
   .mega panel resolves against .site-header (which is sticky, therefore a
   positioned ancestor) and spans the full header width. Making .nav__drop
   relative would trap the panel at the width of its own button.            */
.nav__drop{position:static;}
.nav__drop>summary{
  list-style:none;cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;
  font-size:15px;font-weight:500;color:var(--navy);
  padding:9px 16px;border-radius:24px;border:1px solid transparent;
}
.nav__drop>summary::-webkit-details-marker{display:none;}
.nav__drop>summary::marker{content:'';}
.nav__drop>summary:hover{background:var(--cream-2);}
.nav__drop[open]>summary{background:var(--cream-2);border-color:var(--line-strong);}
.caret{
  width:8px;height:8px;flex-shrink:0;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg) translate(-2px,-2px);
}
.nav__drop[open] .caret{transform:rotate(-135deg) translate(-2px,-2px);}

/* full-width mega panel */
.mega{
  position:absolute;left:0;right:0;top:100%;
  background:var(--cream);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  box-shadow:0 18px 40px rgba(10,25,47,0.09);
  z-index:120;
}
.mega__inner{
  max-width:var(--wrap);margin:0 auto;padding:40px var(--gut) 44px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,60px);
}
.mega__col h4{
  font-family:var(--sans);font-size:11px;font-weight:600;
  letter-spacing:0.28em;text-transform:uppercase;
  color:var(--ink-55);margin:0 0 18px;
}
.mega__col ul{list-style:none;margin:0;padding:0;}
.mega__col li{margin-bottom:3px;}
.mega__col a{
  display:block;padding:9px 0;color:var(--navy);
  text-decoration:none;font-size:16px;font-weight:500;
}
.mega__col a:hover{color:var(--copper-deep);}
.mega__col a small{
  display:block;font-size:13px;font-weight:400;
  color:var(--ink-55);margin-top:2px;
}
.mega__foot{
  border-top:1px solid var(--line);background:var(--cream-2);
}
.mega__foot .wrap{
  display:flex;flex-wrap:wrap;gap:16px;
  align-items:center;justify-content:space-between;
  padding-top:18px;padding-bottom:18px;
}
.mega__foot p{margin:0;font-size:15px;color:var(--ink-70);}

/* compact account dropdown */
.account{position:relative;}
.account>summary{
  list-style:none;cursor:pointer;
  display:inline-flex;align-items:center;gap:9px;
  font-size:15px;font-weight:500;color:var(--navy);
  padding:10px 18px;border-radius:26px;
  border:1px solid var(--line-strong);background:var(--cream);
}
.account>summary::-webkit-details-marker{display:none;}
.account>summary::marker{content:'';}
.account>summary:hover{border-color:var(--navy);}
.account__panel{
  position:absolute;right:0;top:calc(100% + 10px);
  width:290px;background:var(--cream);
  border:1px solid var(--line);border-radius:14px;
  box-shadow:0 18px 44px rgba(10,25,47,0.16);
  padding:10px;z-index:130;
}
.account__panel a{
  display:block;padding:13px 14px;border-radius:9px;
  color:var(--navy);text-decoration:none;
  font-size:16px;font-weight:600;line-height:1.3;
}
.account__panel a small{
  display:block;font-size:13px;font-weight:400;
  color:var(--ink-55);margin-top:3px;
}
.account__panel a:hover{background:var(--cream-2);}
.account__sep{height:1px;background:var(--line);margin:9px 12px;}
.avatar{
  width:22px;height:22px;border-radius:50%;flex-shrink:0;
  border:1.6px solid currentColor;position:relative;
}
.avatar::before{
  content:'';position:absolute;left:50%;top:4.5px;
  width:7px;height:7px;border-radius:50%;
  border:1.6px solid currentColor;transform:translateX(-50%);
}
.avatar::after{
  content:'';position:absolute;left:50%;bottom:1.5px;
  width:13px;height:8px;border-radius:50% 50% 0 0;
  border:1.6px solid currentColor;border-bottom:0;transform:translateX(-50%);
}

/* small dropdown (Help) — needs its own containing block, unlike .mega */
.nav__drop--sm{position:relative;}
.drop-sm{
  position:absolute;left:0;top:calc(100% + 10px);
  width:272px;background:var(--cream);
  border:1px solid var(--line);border-radius:14px;
  box-shadow:0 18px 44px rgba(10,25,47,0.16);
  padding:10px;z-index:130;
}
.drop-sm a{
  display:block;padding:13px 14px;border-radius:9px;
  color:var(--navy);text-decoration:none;
  font-size:16px;font-weight:600;line-height:1.3;
}
.drop-sm a small{
  display:block;font-size:13px;font-weight:400;
  color:var(--ink-55);margin-top:3px;
}
.drop-sm a:hover{background:var(--cream-2);}

/* search item in the nav */
.nav__links a.nav__search{display:inline-flex;align-items:center;gap:8px;}
.nav__search svg{width:16px;height:16px;flex-shrink:0;}

/* venue search band */
.searchband{
  display:flex;flex-wrap:wrap;gap:12px;align-items:center;
  background:var(--cream);border:1px solid var(--line-strong);
  border-radius:34px;padding:9px 9px 9px 24px;max-width:760px;
}
.searchband input{
  flex:1 1 260px;border:0;background:transparent;
  font-family:var(--sans);font-size:16px;color:var(--navy);
  padding:12px 0;min-width:0;
}
.searchband input:focus{outline:none;}
.searchband input::placeholder{color:var(--ink-40);}

/* backdrop so clicking outside closes the menu */
.nav__drop[open] .mega::after,
.account[open] .account__panel::after{content:none;}

/* ---------- auth pages ---------- */
.auth{
  min-height:calc(100vh - 200px);
  display:grid;grid-template-columns:1.05fr 0.95fr;
}
.auth__form{padding:clamp(40px,6vw,80px) var(--gut);max-width:640px;justify-self:end;width:100%;}
.auth__aside{
  background:var(--navy);color:var(--cream);
  padding:clamp(40px,6vw,80px) var(--gut);
  display:flex;flex-direction:column;justify-content:center;
}
.auth__aside h2{margin-bottom:20px;}
.auth__aside .lede{color:var(--white-70);}
.auth__aside ul{list-style:none;margin:34px 0 0;padding:0;}
.auth__aside li{
  position:relative;padding-left:30px;margin-bottom:16px;
  color:var(--white-70);font-size:16px;line-height:1.55;
}
.auth__aside li::before{
  content:'';position:absolute;left:0;top:9px;
  width:13px;height:2px;background:#E8A98C;
}
.auth__aside strong{color:var(--cream);}

.tabs{display:flex;gap:8px;background:var(--cream-2);padding:6px;border-radius:30px;margin-bottom:34px;}
.tabs a{
  flex:1;text-align:center;padding:12px 10px;border-radius:24px;
  text-decoration:none;font-size:15px;font-weight:600;color:var(--ink-70);
}
.tabs a[aria-current="page"]{background:var(--cream);color:var(--navy);box-shadow:0 2px 8px rgba(10,25,47,0.08);}

.auth-note{
  background:var(--cream-2);border-left:3px solid var(--copper);
  padding:16px 20px;border-radius:0 10px 10px 0;
  font-size:14px;color:var(--ink-70);margin-bottom:28px;line-height:1.55;
}
.auth-note strong{color:var(--navy);}
.auth-msg{
  padding:15px 18px;border-radius:10px;font-size:15px;
  margin-bottom:22px;display:none;line-height:1.5;
}
.auth-msg--error{background:rgba(200,109,81,0.12);border:1px solid var(--copper);color:#8F3D1C;}
.auth-msg--ok{background:rgba(0,135,81,0.10);border:1px solid var(--emerald);color:#00603A;}
.auth-msg[data-show]{display:block;}

.auth__alt{margin-top:26px;font-size:15px;color:var(--ink-70);}
.auth__alt a{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:3px;}

/* ---------- WhatsApp float ---------- */
.wa-float{
  position:fixed;right:22px;bottom:22px;z-index:200;
  display:none;align-items:center;gap:11px;
  background:#25D366;color:#0A192F;
  padding:14px 22px 14px 18px;border-radius:32px;
  text-decoration:none;font-weight:600;font-size:15px;
  box-shadow:0 8px 26px rgba(10,25,47,0.24);
}
.wa-float[data-ready]{display:inline-flex;}
.wa-float:hover{background:#1FBA5A;}
.wa-float svg{width:22px;height:22px;flex-shrink:0;}
@media (max-width:600px){
  .wa-float{right:14px;bottom:14px;padding:14px;}
  .wa-float span{display:none;}
}

/* ---------- social icons ---------- */
.social{display:flex;gap:12px;margin:22px 0 0;padding:0;list-style:none;}
.social li{margin:0;}
.social a{
  display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:50%;
  border:1px solid var(--white-15);color:var(--cream);
}
.social a:hover{background:var(--white-15);border-color:var(--cream);}
.social svg{width:19px;height:19px;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);font-size:15px;font-weight:600;
  padding:15px 28px;border-radius:30px;
  text-decoration:none;cursor:pointer;border:1.5px solid transparent;
  transition:transform .12s ease, background-color .12s ease, color .12s ease;
}
.btn:active{transform:translateY(1px);}
.btn--primary{background:var(--emerald);color:#fff;}        /* 4.58:1 */
.btn--primary:hover{background:var(--emerald-deep);}
.btn--secondary{background:transparent;color:var(--navy);border-color:var(--navy);}
.btn--secondary:hover{background:var(--navy);color:var(--cream);}
.btn--emphasis{background:var(--copper-deep);color:#fff;}
.btn--emphasis:hover{background:#A04D2C;}
.btn--onnavy{background:var(--cream);color:var(--navy);}
.btn--onnavy:hover{background:#fff;}
.btn--ghostnavy{background:transparent;color:var(--cream);border-color:var(--white-15);}
.btn--ghostnavy:hover{border-color:var(--cream);}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px;}

/* ---------- hero ---------- */
.hero{padding:clamp(56px,8vw,110px) 0 clamp(52px,7vw,92px);}
.hero__grid{
  display:grid;grid-template-columns:1.05fr 0.95fr;
  gap:clamp(32px,6vw,80px);align-items:center;
}
.hero__mark{justify-self:center;width:min(100%,430px);}

/* ---------- grid / cards ---------- */
.grid{display:grid;gap:clamp(18px,2.4vw,30px);}
.grid--2{grid-template-columns:repeat(2,1fr);}
.grid--3{grid-template-columns:repeat(3,1fr);}
.grid--4{grid-template-columns:repeat(4,1fr);}

.card{
  background:var(--cream);
  border:1px solid var(--line);
  border-radius:14px;
  padding:clamp(22px,2.8vw,34px);
}
.section--cream2 .card{background:var(--cream);}
.section--navy .card{
  background:var(--navy-2);border-color:var(--white-15);color:var(--cream);
}
.card__num{
  font-family:var(--serif);font-style:italic;font-size:34px;
  color:var(--copper-deep);line-height:1;margin:0 0 14px;
}
.section--navy .card__num{color:#E8A98C;}
.card h3{margin:0 0 10px;}
.card p{color:var(--ink-70);font-size:16px;margin:0;}
.section--navy .card p{color:var(--white-70);}

/* ---------- demo banner + sample labels (honesty layer) ---------- */
.demo-banner{
  background:var(--navy);color:var(--cream);
  font-size:14px;text-align:center;
  padding:11px var(--gut);line-height:1.5;
}
.demo-banner strong{color:#E8A98C;}

.sample-flag{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--cream-2);
  border:1px solid var(--copper);
  color:var(--copper-deep);
  font-size:12px;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;
  padding:6px 13px;border-radius:20px;
}
.sample-note{
  background:var(--cream-2);
  border-left:3px solid var(--copper);
  padding:18px 22px;border-radius:0 10px 10px 0;
  font-size:15px;color:var(--ink-70);
}

/* ---------- venue cards (sample listings) ---------- */
.venue{
  border:1px solid var(--line);border-radius:14px;
  background:var(--cream);overflow:hidden;
  display:flex;flex-direction:column;
}
.venue__media{
  aspect-ratio:4/3;position:relative;
  display:flex;align-items:flex-end;padding:16px;
}
.venue__media--a{background:linear-gradient(135deg,#0A6B47 0%,#7BB894 100%);}
.venue__media--b{background:linear-gradient(135deg,#5A2A1E 0%,#C86D51 100%);}
.venue__media--c{background:linear-gradient(135deg,#0A6B47 0%,#7BB894 50%,#C86D51 100%);}
.venue__media--d{background:linear-gradient(135deg,#0F2340 0%,#3E5C82 100%);}
.venue__body{padding:22px;display:flex;flex-direction:column;gap:8px;flex:1;}
.venue__meta{
  font-size:13px;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;
  color:var(--ink-55);margin:0;
}
.venue__body h3{margin:0;}
.venue__desc{font-size:15px;color:var(--ink-70);margin:0;flex:1;}
.venue__foot{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;border-top:1px solid var(--line);padding-top:14px;margin-top:6px;
}
.badge{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(0,135,81,0.10);border:1px solid var(--emerald);
  color:var(--emerald-deep);
  font-size:12px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;
  padding:5px 11px;border-radius:16px;
}
.capacity{font-family:var(--serif);font-size:19px;font-weight:600;color:var(--navy);}

/* ---------- stat / spec rows ---------- */
.spec{display:grid;grid-template-columns:180px 1fr;gap:18px;padding:18px 0;border-bottom:1px solid var(--line);}
.section--navy .spec{border-color:var(--white-15);}
.spec dt{font-size:13px;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:var(--ink-55);margin:0;}
.section--navy .spec dt{color:var(--white-55);}
.spec dd{margin:0;color:var(--ink-70);}
.section--navy .spec dd{color:var(--white-70);}

/* ---------- forms ---------- */
.field{display:flex;flex-direction:column;gap:8px;margin-bottom:20px;}
.field label{font-size:14px;font-weight:600;color:var(--navy);}
.field .hint{font-size:13px;color:var(--ink-55);font-weight:400;}
.field input,.field textarea,.field select{
  font-family:var(--sans);font-size:16px;color:var(--navy);
  background:var(--cream);
  border:1px solid var(--line-strong);border-radius:10px;
  padding:14px 16px;width:100%;
}
.field textarea{min-height:150px;resize:vertical;}
.req{color:var(--copper-deep);}

/* ---------- mission statement ---------- */
.mission{
  max-width:24ch;
  font-family:var(--serif);
  font-size:clamp(34px,5vw,62px);
  line-height:1.1;
  letter-spacing:-0.01em;
  margin:0;
}
.mission em{font-style:italic;font-weight:500;color:#E8A98C;}
.mission-body{max-width:60ch;}
.mission-words{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,2vw,26px);
  list-style:none;margin:36px 0 0;padding:0;
}
.mission-words li{
  font-family:var(--sans);font-size:14px;font-weight:400;
  line-height:1.5;letter-spacing:0;text-transform:none;
  color:var(--white-70);
  padding-top:14px;border-top:2px solid #E8A98C;
}
@media (max-width:600px){
  .mission-words{grid-template-columns:1fr;gap:20px;}
}
.mission-words strong{
  display:block;font-family:var(--serif);font-style:italic;
  font-size:23px;font-weight:500;letter-spacing:0;text-transform:none;
  color:var(--cream);margin-bottom:7px;
}

/* ---------- FAQ (details/summary, no JS) ---------- */
.faq{max-width:900px;margin:0;}
.faq-group{margin-bottom:52px;}
.faq-group__title{
  font-family:var(--sans);font-size:12px;font-weight:600;
  letter-spacing:0.3em;text-transform:uppercase;
  color:var(--emerald-deep);
  padding-bottom:12px;margin:0 0 4px;
  border-bottom:2px solid var(--emerald);
}
.qa{border-bottom:1px solid var(--line);}
.qa > summary{
  list-style:none;cursor:pointer;
  display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  padding:22px 0;
  font-family:var(--serif);font-size:clamp(18px,2vw,22px);font-weight:600;
  line-height:1.32;color:var(--navy);
}
.qa > summary::-webkit-details-marker{display:none;}
.qa > summary::marker{content:'';}
.qa > summary:hover{color:var(--copper-deep);}
.qa__sign{
  flex-shrink:0;position:relative;
  width:22px;height:22px;margin-top:5px;
}
.qa__sign::before,.qa__sign::after{
  content:'';position:absolute;background:var(--emerald);
  left:50%;top:50%;
}
.qa__sign::before{width:16px;height:2px;transform:translate(-50%,-50%);}
.qa__sign::after{
  width:2px;height:16px;transform:translate(-50%,-50%);
  transition:opacity .14s ease;
}
.qa[open] .qa__sign::after{opacity:0;}
.qa__body{padding:0 0 26px;max-width:74ch;}
.qa__body p{color:var(--ink-70);font-size:16px;}
.qa__body ul{margin:0 0 4px;padding-left:0;list-style:none;}
.qa__body li{
  position:relative;padding-left:26px;margin-bottom:11px;
  color:var(--ink-70);font-size:16px;line-height:1.6;
}
.qa__body li::before{
  content:'';position:absolute;left:2px;top:10px;
  width:9px;height:2px;background:var(--copper);
}
.qa__body strong{color:var(--navy);}

/* ---------- amenity / capability chips ---------- */
.chips{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:26px 0 0;padding:0;}
.chips li{
  font-size:14px;font-weight:500;color:var(--navy);
  background:var(--cream);border:1px solid var(--line-strong);
  padding:9px 16px;border-radius:22px;
}
.section--navy .chips li{
  background:transparent;border-color:var(--white-15);color:var(--cream);
}

/* ---------- footer ---------- */
.site-footer{background:var(--navy);color:var(--cream);padding:clamp(48px,6vw,76px) 0 34px;}
.footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(26px,4vw,54px);}
.site-footer img{width:210px;margin-bottom:20px;}
.site-footer h4{
  font-family:var(--sans);font-size:12px;font-weight:600;
  letter-spacing:0.28em;text-transform:uppercase;
  color:var(--white-55);margin:0 0 16px;
}
.site-footer ul{list-style:none;margin:0;padding:0;}
.site-footer li{margin-bottom:11px;}
.site-footer a{color:var(--cream);text-decoration:none;font-size:15px;}
.site-footer a:hover{text-decoration:underline;text-underline-offset:4px;}
.footer__base{
  margin-top:44px;padding-top:24px;border-top:1px solid var(--white-15);
  display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;
  font-size:13px;color:var(--white-55);
}


/* ============================================================================
 * C49c · Footer "Signed in as X · Sign out" strip
 * --------------------------------------------------------------------------
 * Shown only when a user is signed in (JS toggles). Sits directly above
 * the copyright bar, keeps the visual weight low, gives a clear sign-out
 * fallback so users don't have to hunt the header dropdown.
 * ============================================================================ */
.footer__signedin{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px;
  padding:14px 0;margin-top:8px;
  border-top:1px solid rgba(255,255,255,0.08);
  font-family:var(--sans);font-size:13.5px;color:var(--white-55);
}
.footer__signedin b{
  color:var(--cream);font-weight:600;
}
.footer__signedin a[data-auth-signout]{
  color:#E8A98C;text-decoration:none;font-weight:600;
  border-bottom:1px solid transparent;padding-bottom:1px;
}
.footer__signedin a[data-auth-signout]:hover{
  border-bottom-color:#E8A98C;
}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .mega__inner{grid-template-columns:repeat(2,1fr);gap:28px;}
  .auth{grid-template-columns:1fr;}
  .auth__form{justify-self:stretch;max-width:none;}
  .auth__aside{order:-1;padding-top:44px;padding-bottom:44px;}
}
@media (max-width:1000px){
  .hero__grid{grid-template-columns:1fr;text-align:left;}
  .hero__mark{order:-1;width:min(100%,320px);justify-self:start;}
  .grid--4{grid-template-columns:repeat(2,1fr);}
  .grid--3{grid-template-columns:repeat(2,1fr);}
  .footer__grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:900px){
  .nav__links,.nav__cta{display:none;}
  .menu{display:block;}
}
@media (max-width:760px){
  .grid--2,.grid--3,.grid--4{grid-template-columns:1fr;}
  .footer__grid{grid-template-columns:1fr;}
  .spec{grid-template-columns:1fr;gap:6px;}
  .mega__inner{grid-template-columns:1fr;}
  body{font-size:16px;}
}

/* ---------- motion + print ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *{transition:none!important;animation:none!important;}
}
@media print{
  .site-header,.site-footer,.demo-banner,.btn{display:none;}
  body{background:#fff;}
}


/* ==========================================================================
   V2 ADDITIONS — Concepts 01, 02, 03, 04, 06, 11
   These live alongside the original components and don't override any of them.
   ========================================================================== */

:root{
  --amber:#E8B84A;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;
}

/* ---------- CONCEPT 01 · Kinetic hero -------------------------------------
   Reuses .hero + adds an italic copper cycling word and an event-type ticker.
   Doesn't change existing .hero__grid — this is purely additive.            */
.kinetic-word{
  display:inline-block;position:relative;
  font-style:italic;font-weight:500;
  color:var(--copper-deep);
  min-width:7.5ch;
  transition:transform .34s cubic-bezier(.6,.05,.2,1), opacity .34s ease;
  will-change:transform,opacity;
}
.kinetic-word.--out{transform:translateY(-14px);opacity:0}
.kinetic-word.--in {transform:translateY(14px); opacity:0}
.hero__ticker{
  margin-top:36px;padding:14px 0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  overflow:hidden;position:relative;
}
.hero__ticker::before,
.hero__ticker::after{
  content:"";position:absolute;top:0;bottom:0;width:80px;pointer-events:none;z-index:2;
}
.hero__ticker::before{left:0;background:linear-gradient(to right,var(--cream),transparent);}
.hero__ticker::after {right:0;background:linear-gradient(to left, var(--cream),transparent);}
.hero__ticker-track{
  display:inline-flex;gap:44px;white-space:nowrap;
  animation:tickerscroll 48s linear infinite;
  font-family:var(--mono);font-size:12px;letter-spacing:.18em;
  color:var(--ink-55);text-transform:uppercase;
  padding-left:44px;
}
.hero__ticker-track span::before{content:"◆  ";color:var(--copper-deep);margin-right:8px}
@keyframes tickerscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}


/* ---------- CONCEPT 02 · City wordmarks (used on venues.html) ------------- */
.citywords{margin:0 0 8px;padding:0}
.citywords__nav{
  display:flex;gap:0;border-bottom:1px solid var(--line);
  margin:0 0 26px;flex-wrap:wrap;
}
.citywords__tab{
  font-family:var(--serif);font-style:italic;font-weight:500;
  font-size:clamp(28px,6.4vw,72px);line-height:1;letter-spacing:-.02em;
  padding:14px 22px 22px;color:var(--ink-40);
  border-bottom:3px solid transparent;
  cursor:pointer;transition:color .2s ease, border-color .2s ease;
  background:transparent;border-top:0;border-left:0;border-right:0;
  font-family:var(--serif);
}
.citywords__tab:hover{color:var(--ink-70)}
.citywords__tab.on{color:var(--navy);border-bottom-color:var(--copper)}
.citywords__meta{
  display:flex;gap:36px 44px;flex-wrap:wrap;
  font-family:var(--mono);font-size:11px;color:var(--ink-55);
  letter-spacing:.16em;text-transform:uppercase;margin:0 0 14px;
}
.citywords__meta div{min-width:8ch}
.citywords__meta b{
  display:block;font-family:var(--serif);font-style:normal;font-weight:500;
  font-size:30px;color:var(--navy);letter-spacing:-.01em;margin-top:6px;
}


/* ---------- CONCEPT 03 · Verified Stamp (used on about.html) ------------- */
.stamp-block{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,60px);
  align-items:center;margin-top:44px;
}
@media (max-width:800px){.stamp-block{grid-template-columns:1fr}}
.stamp{
  aspect-ratio:1/1;max-width:340px;margin:0 auto;
  position:relative;display:grid;place-items:center;cursor:default;
}
.stamp svg{width:100%;height:100%;overflow:visible;
  filter:drop-shadow(0 6px 20px rgba(200,109,81,.18));
  transition:transform .6s ease;
}
.stamp:hover svg{animation:stampspin 24s linear infinite}
@keyframes stampspin{to{transform:rotate(360deg)}}
.stamp__ring{fill:none;stroke:var(--copper-deep);stroke-width:2}
.stamp__ring--inner{stroke-dasharray:2 4}
.stamp text{fill:var(--copper-deep);font-family:var(--serif);font-weight:500;letter-spacing:.02em}
.stamp__center{
  position:absolute;text-align:center;color:var(--copper-deep);
  font-family:var(--serif);pointer-events:none;
}
.stamp__center small{
  font-family:var(--mono);font-style:normal;font-size:10px;
  letter-spacing:.32em;text-transform:uppercase;display:block;
}
.stamp__center b{
  display:block;font-family:var(--serif);font-style:italic;font-weight:500;
  font-size:34px;letter-spacing:-.01em;line-height:1;margin:6px 0 8px;
}
.stamp-list{list-style:none;margin:0;padding:0}
.stamp-list li{
  display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:flex-start;
  padding:14px 0;border-bottom:1px solid var(--line);
}
.stamp-list li:last-child{border-bottom:0}
.stamp-list .n{
  font-family:var(--mono);font-size:11px;color:var(--copper-deep);
  letter-spacing:.2em;padding-top:6px;min-width:34px;
}
.stamp-list b{font-family:var(--serif);font-weight:600;font-size:18px;display:block;margin-bottom:2px;color:var(--navy)}
.stamp-list p{margin:0;color:var(--ink-70);font-size:14.5px;line-height:1.55}


/* ---------- CONCEPT 04 · Fit Meter (5-dot signal bars) ------------------- */
.fit-block{
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,56px);
  align-items:start;margin-top:44px;
}
@media (max-width:900px){.fit-block{grid-template-columns:1fr}}
.fitcard{
  background:var(--cream);border:1px solid var(--line);border-radius:14px;
  padding:26px 26px 22px;display:grid;gap:16px;
}
.section--cream2 .fitcard{background:var(--cream)}
.fitcard__head{
  display:flex;justify-content:space-between;align-items:baseline;gap:14px;
}
.fitcard__head h3{margin:0;font-family:var(--serif);font-weight:600;font-size:22px}
.fitcard__head h3 em{color:var(--copper-deep);font-style:italic;font-weight:500;font-size:.72em}
.fitcard__meta{
  font-family:var(--mono);font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-55);
}
.fit{
  display:grid;grid-template-columns:110px 1fr 56px;gap:14px;align-items:center;
}
.fit__label{
  font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;
  font-size:10.5px;color:var(--ink-70);
}
.fit__bar{display:flex;gap:5px}
.fit__dot{flex:1;height:8px;background:var(--line);border-radius:2px}
.fit__dot.on{background:var(--emerald)}
.fit__dot.warn{background:var(--amber)}
.fit__val{
  font-family:var(--mono);font-size:11px;color:var(--ink-55);
  text-align:right;letter-spacing:.04em;
}
.fit__score{
  display:flex;justify-content:space-between;align-items:baseline;
  margin-top:8px;padding-top:14px;border-top:1px solid var(--line);
  gap:14px;
}
.fit__score b{
  font-family:var(--serif);font-size:36px;font-weight:500;color:var(--emerald-deep);
  letter-spacing:-.01em;line-height:1;
}
.fit__score span{
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-55);text-align:right;
}


/* ---------- CONCEPT 06 · Venue card V2 (image + big capacity) ------------
   Applied by adding `venue--v2` to the existing .venue element.            */
.venue.venue--v2{
  display:flex;flex-direction:column;
}
.venue--v2 .venue__media{
  aspect-ratio:5/4;padding:0;position:relative;overflow:hidden;
}
/* Striped placeholder — sits over the existing gradient */
.venue--v2 .venue__media::before{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(
    135deg,
    rgba(253,251,247,.10) 0 2px,
    transparent 2px 12px);
  pointer-events:none;
}
.venue--v2 .venue__media .ph{
  position:absolute;bottom:12px;left:12px;z-index:1;
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--cream);background:rgba(10,25,47,.55);
  padding:5px 10px;border-radius:20px;
  backdrop-filter:blur(4px);
}
.venue--v2 .venue__body{padding:22px 22px 20px;gap:0}
.venue__capbig{
  font-family:var(--serif);font-weight:500;
  font-size:52px;line-height:.9;letter-spacing:-.02em;
  color:var(--navy);margin:0;
}
.venue__capbig small{
  display:block;margin-top:8px;
  font-family:var(--mono);font-size:11px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;color:var(--ink-55);
}
.venue--v2 .venue__name{
  font-family:var(--serif);font-size:19px;font-weight:600;
  margin:16px 0 4px;letter-spacing:-.01em;
}
.venue--v2 .venue__meta{
  font-family:var(--mono);font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-55);
  margin:0 0 14px;font-weight:500;
}
.venue__amenities{
  display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;
}
.amen{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;
  padding:5px 10px;border-radius:6px;
  background:rgba(0,135,81,.10);color:var(--emerald-deep);
  display:inline-flex;align-items:center;gap:6px;
}
.amen::before{
  content:"";width:6px;height:6px;background:var(--emerald);border-radius:50%;
}

.venue--v2 .venue__foot{
  margin-top:16px;padding-top:14px;
}
.verified-chip{
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--copper-deep);display:inline-flex;align-items:center;gap:8px;
}
.verified-chip::before{
  content:"";width:12px;height:12px;border-radius:50%;
  background:var(--copper);
  box-shadow:0 0 0 2px var(--cream), 0 0 0 3px var(--copper-deep);
}
.venue__price{
  font-family:var(--mono);font-size:11px;color:var(--ink-55);
  letter-spacing:.16em;text-transform:uppercase;
}


/* ---------- CONCEPT 11 · Command-bar search (with typewriter) ------------ */
.cmd-search{
  padding:18px 12px 18px 22px;background:var(--cream);
  border:1px solid var(--line-strong);border-radius:60px;
  display:flex;align-items:center;gap:14px;
  max-width:820px;
}
.cmd-search__icon{
  width:20px;height:20px;color:var(--ink-55);flex-shrink:0;
}
.cmd-search__inputwrap{
  flex:1;min-width:0;display:flex;align-items:center;position:relative;
  font-family:var(--mono);font-size:15px;color:var(--navy);
}
.cmd-search__input{
  font-family:var(--mono);font-size:15px;color:var(--navy);
  background:transparent;border:0;outline:0;width:100%;padding:10px 0;
}
.cmd-search__input::placeholder{color:var(--ink-40)}
.cmd-search__ghost{
  position:absolute;left:0;top:50%;transform:translateY(-50%);
  pointer-events:none;color:var(--ink-40);white-space:nowrap;
  overflow:hidden;max-width:100%;
}
.cmd-search__ghost::after{
  content:"▊";color:var(--copper);margin-left:2px;
  animation:cmdblink 1.05s steps(2) infinite;
}
@keyframes cmdblink{50%{opacity:0}}
.cmd-search__cta{
  flex-shrink:0;background:var(--emerald);color:var(--cream);
  border:0;border-radius:60px;padding:12px 22px;
  font-family:var(--sans);font-size:14px;font-weight:600;
  cursor:pointer;letter-spacing:.02em;
}
.cmd-search__cta:hover{background:var(--emerald-deep)}
.cmd-search__hints{
  margin:16px 0 0;display:flex;gap:8px;flex-wrap:wrap;padding:0;list-style:none;
}
.cmd-search__hints li{
  font-family:var(--mono);font-size:11px;color:var(--ink-55);
  padding:5px 10px;background:var(--cream-2);border-radius:20px;
  border:1px solid var(--line);cursor:pointer;letter-spacing:.02em;
}
.cmd-search__hints li:hover{border-color:var(--copper);color:var(--copper-deep)}
.cmd-search__hints li kbd{
  font-family:var(--mono);color:var(--copper-deep);
  background:transparent;border:0;padding:0;
}


/* ---------- Reduced motion honours the animation shutdown above --------- */
@media (prefers-reduced-motion:reduce){
  .kinetic-word,
  .hero__ticker-track,
  .stamp:hover svg,
  .cmd-search__ghost::after{
    animation:none!important;transition:none!important;
  }
}




/* ==========================================================================
   V2 ADDITIONS (round 2) — appended at file end to sidestep a parser
   dropout observed when these rules lived mid-file. Same declarations.
   ========================================================================== */

/* Neutral factual trade-off chip — replaces amber .warn for factual notes
   like "no on-site parking" or "limited shade" that aren't warnings.       */
.amen.note {
  background: rgba(10, 25, 47, 0.06);
  color: var(--ink-70);
}
.amen.note::before {
  background: var(--ink-40);
}

/* Mini Fit Meter — 3-dot compact form for venue cards.                     */
.fit-mini {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px 14px;
  padding: 12px 0 4px;
  margin: 0 0 4px;
}
.fit-mini__row {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.fit-mini__label {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-55);
}
.fit-mini__bar {
  display: flex;
  gap: 3px;
}
.fit-mini__dot {
  flex: 1;
  height: 5px;
  background: var(--line);
  border-radius: 2px;
}
.fit-mini__dot.on {
  background: var(--emerald);
}
.fit-mini__dot.warn {
  background: var(--amber);
}

/* Visually-hidden utility — a11y/SEO fallback text hidden from sighted UI. */
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


/* ==========================================================================
   V3 ADDITIONS — signed-in header state (auth-state.js)
   ========================================================================== */

/* Filled avatar circle (replaces the outline avatar when a user is signed in) */
.avatar.avatar--filled{
  background:var(--emerald);color:var(--cream);
  border:0;
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.02em;
}
.avatar.avatar--filled::before,
.avatar.avatar--filled::after{display:none}
.avatar.avatar--filled.avatar--lg{
  width:40px;height:40px;font-size:14px;
}

/* Signed-in dropdown header block */
.account__signedin{
  display:flex;align-items:center;gap:12px;padding:12px 14px;
}
.account__signedin > div{display:flex;flex-direction:column;gap:1px;min-width:0}
.account__signedin b{
  font-family:var(--sans);font-weight:600;font-size:14px;color:var(--navy);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px;
}
.account__signedin small{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-55);font-weight:500;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px;
}
.account__role{
  display:inline-block;margin-top:6px;padding:2px 8px;border-radius:20px;
  background:rgba(200,109,81,.14);color:var(--copper-deep);
  font-family:var(--mono);font-size:9.5px;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;width:fit-content;
}
.account__signout{color:var(--copper-deep) !important}
.account__signout small{color:var(--ink-55)}

/* Section label between profile and workspaces */
.account__group-title{
  margin:6px 14px 4px;
  font-family:var(--mono);font-size:9.5px;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;color:var(--ink-40);
}

/* Workspace switcher items — visually distinct from the profile link */
.account__workspace{
  position:relative;padding-left:52px !important;
}
.account__ws-badge{
  position:absolute;left:14px;top:50%;transform:translateY(-50%);
  padding:3px 7px;border-radius:5px;
  font-family:var(--mono);font-size:9px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;
  display:inline-block;line-height:1.2;
}
.account__ws-badge--admin{background:var(--navy);color:var(--cream)}
.account__ws-badge--host{background:rgba(0,135,81,.14);color:var(--emerald-deep)}
.account__ws-badge--em{background:rgba(200,109,81,.14);color:var(--copper-deep)}
.account__ws-badge--vendor{background:rgba(232,184,74,.24);color:#7A5A0F}

/* Coming-soon workspace: dim + no hover */
.account__workspace--soon{
  color:var(--ink-40) !important;cursor:not-allowed;
}
.account__workspace--soon:hover{background:transparent !important}
.account__workspace--soon small{color:var(--ink-40) !important}
.account__workspace--soon .account__ws-badge{opacity:.6}

/* -------- Recently viewed venues (renders inside /profile.html) -------- */
.rv-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.rv-item{
  position:relative;background:var(--cream);border:1px solid var(--line);
  border-radius:10px;overflow:hidden;transition:border-color .15s ease;
}
.rv-item:hover{border-color:var(--ink-40)}
.rv-item__link{
  display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;
  padding:10px 42px 10px 10px;text-decoration:none;color:var(--navy);min-height:64px;
}
.rv-item__media{
  width:64px;height:64px;border-radius:7px;flex-shrink:0;
  background:repeating-linear-gradient(135deg,rgba(253,251,247,.10) 0 2px,transparent 2px 10px),
             linear-gradient(160deg,#0A6B47 0%,#7BB894 100%);
}
.rv-item__media--b{background:repeating-linear-gradient(135deg,rgba(253,251,247,.10) 0 2px,transparent 2px 10px),linear-gradient(160deg,#5A2A1E 0%,#C86D51 100%)}
.rv-item__media--c{background:repeating-linear-gradient(135deg,rgba(253,251,247,.10) 0 2px,transparent 2px 10px),linear-gradient(160deg,#0A6B47 0%,#7BB894 50%,#C86D51 100%)}
.rv-item__media--d{background:repeating-linear-gradient(135deg,rgba(253,251,247,.10) 0 2px,transparent 2px 10px),linear-gradient(160deg,#0F2340 0%,#3E5C82 100%)}
.rv-item__body{display:flex;flex-direction:column;gap:2px;min-width:0}
.rv-item__name{
  font-family:var(--serif);font-weight:600;font-size:16px;letter-spacing:-.005em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.rv-item__meta{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-55);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.rv-item__cap{
  font-family:var(--serif);font-weight:500;color:var(--copper-deep);font-size:13px;letter-spacing:-.005em;
}
.rv-item__cap em{
  font-style:normal;color:var(--ink-55);font-family:var(--mono);
  font-size:10px;letter-spacing:.14em;text-transform:uppercase;margin-left:6px;
}
.rv-item__when{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--ink-40);
  white-space:nowrap;padding-left:14px;
}
.rv-item__remove{
  position:absolute;right:8px;top:50%;transform:translateY(-50%);
  width:28px;height:28px;border-radius:50%;background:transparent;
  color:var(--ink-40);font-size:20px;cursor:pointer;
  display:grid;place-items:center;border:0;transition:background .15s ease,color .15s ease;
}
.rv-item__remove:hover{background:var(--cream-2);color:var(--copper-deep)}
.rv-more{
  display:block;margin:12px auto 0;padding:10px 22px;
  background:transparent;color:var(--ink-55);border:1px dashed var(--line-strong);
  border-radius:10px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;cursor:pointer;
}
.rv-more:hover{border-color:var(--copper-deep);color:var(--copper-deep)}
.rv-empty{
  padding:32px 24px;text-align:center;background:var(--cream);
  border:1px dashed var(--line-strong);border-radius:12px;
}
.rv-empty__title{
  font-family:var(--serif);font-weight:500;font-size:18px;margin:0 0 6px;letter-spacing:-.005em;
}
.rv-empty__body{color:var(--ink-70);font-size:14px;margin:0 0 20px;line-height:1.55}

/* ==========================================================================
   Password UX — eye toggle + strength meter
   ========================================================================== */

/* Wrapper turns the input into a positioning container for the eye button. */
.pw-wrap{
  position:relative;display:block;
}
.pw-wrap > input{
  width:100%;
  /* padding-right reserved by JS via inline style — 44px */
}

/* Eye toggle
   ---
   IMPORTANT: use very high specificity + !important on layout properties.
   Some pages (auth-callback.html) style ALL buttons inside their card as
   full-width primary buttons via `.card button`. Without this override,
   the eye button gets stretched to 100% and swallows the input. */
.pw-wrap > button.pw-eye,
.pw-eye{
  position:absolute !important;
  right:8px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:34px !important;
  height:34px !important;
  min-width:0 !important;
  max-width:34px !important;
  border-radius:6px !important;
  border:0 !important;
  background:transparent !important;
  color:var(--ink-55) !important;
  display:grid !important;
  place-items:center !important;
  cursor:pointer;
  transition:color .15s ease, background .15s ease;
  padding:0 !important;
  margin:0 !important;
  box-shadow:none !important;
  font-size:inherit !important;
  line-height:1 !important;
}
.pw-eye:hover{color:var(--navy) !important;background:var(--cream-2) !important}
.pw-eye:focus-visible{
  outline:2px solid var(--emerald);outline-offset:2px;
}
.pw-eye svg{display:block;pointer-events:none;width:20px;height:20px}

/* Strength meter — hidden until the input has a value */
.pw-meter{
  margin-top:8px;
  opacity:0;transform:translateY(-4px);
  transition:opacity .18s ease, transform .18s ease;
  pointer-events:none;max-height:0;overflow:hidden;
}
.pw-meter.--visible{
  opacity:1;transform:translateY(0);pointer-events:auto;max-height:60px;
}
.pw-meter__bar{
  display:grid;grid-template-columns:repeat(4,1fr);gap:4px;height:6px;
}
.pw-meter__bar i{
  background:var(--line);border-radius:3px;
  transition:background .18s ease;
}
/* Colour the pips based on score. Data-score on the bar drives it. */
.pw-meter__bar[data-score="1"] i:nth-child(-n+1){background:#B84545}
.pw-meter__bar[data-score="2"] i:nth-child(-n+2){background:var(--amber)}
.pw-meter__bar[data-score="3"] i:nth-child(-n+3){background:var(--emerald)}
.pw-meter__bar[data-score="4"] i{background:var(--emerald-deep)}

.pw-meter__labels{
  display:flex;justify-content:space-between;gap:14px;
  margin-top:6px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;
}
.pw-meter__label{
  font-weight:600;color:var(--navy);text-transform:uppercase;letter-spacing:.16em;
}
.pw-meter__bar[data-score="0"] + .pw-meter__labels .pw-meter__label,
.pw-meter__bar[data-score="1"] + .pw-meter__labels .pw-meter__label{color:#B84545}
.pw-meter__bar[data-score="2"] + .pw-meter__labels .pw-meter__label{color:#7A5A0F}
.pw-meter__bar[data-score="3"] + .pw-meter__labels .pw-meter__label,
.pw-meter__bar[data-score="4"] + .pw-meter__labels .pw-meter__label{color:var(--emerald-deep)}
.pw-meter__hint{
  color:var(--ink-55);font-weight:400;letter-spacing:0;text-transform:none;
  text-align:right;
}


/* ---------- Checkbox pills (used in vendor registration & similar) ----- */
.check-grid{
  /* Consumers set their own grid; this just handles vertical rhythm. */
  margin:6px 0 0;
}
.check{
  display:flex;align-items:center;gap:10px;
  font-size:14.5px;color:var(--navy);
  padding:10px 14px;border:1px solid var(--line-strong);border-radius:8px;
  cursor:pointer;background:var(--cream);
  transition:border-color .12s ease, background .12s ease;
  user-select:none;
}
.check:hover{border-color:var(--copper)}
.check input[type="checkbox"]{
  width:16px;height:16px;accent-color:var(--emerald);flex-shrink:0;cursor:pointer;
}
.check:has(input:checked){
  background:rgba(0,135,81,0.06);
  border-color:var(--emerald);
  color:var(--emerald-deep);
  font-weight:500;
}
/* Fallback for older browsers without :has() */
.check input:checked ~ *{color:var(--emerald-deep)}



/* ==========================================================================
   COMMIT 17 · Session A polish (added 10 Sept 2026)
   Three additive concerns:
     P1 · [data-reveal] scroll-in fade-up (mirrors category-grid pattern)
     P2 · Hover-lift on .venue cards (venues.html + vendors.html)
     P6 · Filter pill states — hover-lift + selected × dismissal
   All rules opt-in via existing selectors or data attrs.
   Motion honoured by prefers-reduced-motion at file end.
   ========================================================================== */

/* --- P1 · Scroll-reveal ---------------------------------------------------
   REMOVED in Commit 18 — the on-scroll fade-in caused perceived "empty
   bands" as users scrolled quickly past mid-page sections. reveal.js
   still ships but no elements opt in via data-reveal.
   -------------------------------------------------------------------------- */

/* --- P2 · Hover-lift on venue cards -------------------------------------
   .venue is used on venues.html + vendors.html grids. Non-touch devices
   get a subtle translate + shadow + copper border on hover. Never triggers
   on touch screens (hover:none media query check).
   ------------------------------------------------------------------------ */
.venue{
  transition:
    transform .3s cubic-bezier(.2,.7,.2,1),
    box-shadow .3s cubic-bezier(.2,.7,.2,1),
    border-color .3s ease;
  will-change:transform;
}
@media (hover:hover) and (pointer:fine){
  .venue:hover{
    transform:translateY(-4px);
    box-shadow:
      0 20px 42px -14px rgba(10,25,47,.22),
      0 8px 16px -8px rgba(10,25,47,.14);
    border-color:var(--copper);
  }
  .venue:hover .venue__media{
    /* Slight scale on the media block underneath, adds depth on hover.
       Guarded by :hover so no motion on touch. */
    transform:scale(1.015);
  }
}
.venue__media{
  transition:transform .4s cubic-bezier(.2,.7,.2,1);
  will-change:transform;
}
/* Guard: pending / recruiter fill cards shouldn't lift — they aren't
   really destinations, just brand placeholders. */
.venue--recruit,
.venue--pending{
  transition:none;
}
@media (hover:hover) and (pointer:fine){
  .venue--recruit:hover,
  .venue--pending:hover{transform:none;box-shadow:none;border-color:var(--line)}
  .venue--recruit:hover .venue__media,
  .venue--pending:hover .venue__media{transform:none}
}

/* --- P6 · Filter pill states --------------------------------------------
   Two upgrades to .chips li (used on venues.html + faq / anywhere .chips
   appears):
     · Hover: translate up 1px, copper border
     · [aria-pressed="true"] or .--on: filled navy pill with subtle × affordance
   Doesn't touch existing single-line li styling — additive.
   ------------------------------------------------------------------------ */
.chips li{
  transition:
    transform .18s cubic-bezier(.2,.7,.2,1),
    border-color .18s ease,
    color .18s ease,
    background-color .18s ease;
  cursor:pointer;
}
@media (hover:hover) and (pointer:fine){
  .chips li:hover{
    transform:translateY(-1px);
    border-color:var(--copper);
    color:var(--copper-deep);
  }
}
.chips li[aria-pressed="true"],
.chips li.--on{
  background:var(--navy);
  color:var(--cream);
  border-color:var(--navy);
  padding-right:34px;
  position:relative;
}
.chips li[aria-pressed="true"]::after,
.chips li.--on::after{
  content:"×";
  position:absolute;right:14px;top:50%;transform:translateY(-52%);
  font-size:16px;font-family:var(--sans);opacity:.72;line-height:1;
  transition:opacity .18s ease;
}
.chips li[aria-pressed="true"]:hover::after,
.chips li.--on:hover::after{opacity:1}

/* Reduced motion — Commit 17 additions honour the shutdown */
@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1!important;transform:none!important;transition:none!important}
  .venue,.venue__media,.chips li{transition:none!important;transform:none!important}
}


/* ==========================================================================
   COMMIT 18 · Signin "You're signed in as EMAIL" overflow fix
   ---
   auth.js injects a <div class="vr-signedin-card" data-vr-signedin-card>
   containing an <h2> with an inline <em> holding the raw user email.
   Every element there has an inline style attribute set by JS, so we
   need !important to override. Long emails like "mytemitope@outlook.com"
   have no spaces to break on; overflow-wrap:anywhere is what tells the
   browser to break the string anywhere it must.
   ========================================================================== */
[data-vr-signedin-card] h2,
[data-vr-signedin-card] h2 em,
.vr-signedin-card h2,
.vr-signedin-card h2 em{
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  min-width:0 !important;
}
/* Belt & braces on the card wrapper itself so the flex/grid parent
   (auth__form column) doesn't refuse to shrink the card's h2. */
[data-vr-signedin-card],
.vr-signedin-card{
  min-width:0 !important;
  max-width:100% !important;
}