/* Blush theme -- dark luxury, gold + accent (matches the client-approved
   mockup, 2026-10-05). Structure lives in /_static/base.css; this file only
   styles. --gold / --accent-2 / --accent-2-text / --bg / --font-script / --font-accent come from
   the site's theme settings (inline :root in base.html). */
:root {
  --bg-2: #0d090b; --fg: #f4ede6; --muted: #b9aca5; --line: #2b2026;
  --gold-light: color-mix(in srgb, var(--gold) 55%, #fff6dc);
  --gold-deep: color-mix(in srgb, var(--gold) 75%, #6b4a12);
  --accent: var(--gold); --on-accent: #140e0c;
  --font-head: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-body: "Montserrat", -apple-system, "Segoe UI", Roboto, sans-serif;
  --radius: 2px; --maxw: 1180px;
  --wm-gradient: linear-gradient(100deg, var(--gold-light) 0%, var(--gold) 26%, var(--gold-deep) 36%,
    var(--accent-2) 48%, color-mix(in srgb, var(--accent-2) 70%, #ff9ccc) 60%, var(--gold) 74%, var(--gold-light) 90%);
}
body { background: var(--bg); }
::selection { background: var(--accent-2); color: #fff; }

/* ---- the type wordmark (header, hero, footer) ---- */
.wm-script { font-family: var(--font-script); font-weight: 400; text-transform: none; letter-spacing: 0;
  background: var(--wm-gradient); -webkit-background-clip: text; background-clip: text; color: transparent;
  -webkit-text-fill-color: transparent; padding: 0 .18em .08em .12em; line-height: 1.15;
  filter: drop-shadow(0 2px 10px rgba(0,0,0,.55)); }
.wm-word { font-family: var(--font-head); font-weight: 500; color: var(--gold-light); letter-spacing: .38em;
  text-transform: uppercase; }
.wm-word sup { color: var(--gold); margin-left: -1em; letter-spacing: 0; vertical-align: .9em; font-size: .38em; }
.sep { color: var(--accent-2-text); opacity: 1; }

/* ---- header ---- */
.site-head { position: sticky; background: #000; backdrop-filter: none; border-bottom: 1px solid #16100f; }
.site-head .wrap { max-width: 1460px; }
.head-row { min-height: 76px; gap: 28px; }
.brand { flex: 0 0 auto; }
.brand img { max-height: 56px; }
.wordmark--head { flex-direction: row; align-items: center; gap: 4px; }
.wordmark--head .wm-script { font-size: 50px; line-height: 1.2; }
.wm-stack { display: flex; flex-direction: column; gap: 4px; padding-top: 2px; }
.wordmark--head .wm-word { font-size: 23px; line-height: 1; letter-spacing: .36em; }
.brand-sub { font: 500 10.5px/1 var(--font-body); letter-spacing: .1em; text-transform: uppercase; color: var(--fg); white-space: nowrap; }
.site-nav { flex: 1 1 auto; justify-content: flex-end; gap: clamp(18px, 3vw, 50px); }
.site-nav a { font: 500 13.5px/1 var(--font-body); letter-spacing: .06em; color: var(--fg); padding: 8px 0; }
.site-nav a:hover, .site-nav a.is-current { color: var(--accent-2-text); }
.site-nav a.is-current:not(.btn) { box-shadow: inset 0 -2px 0 var(--accent-2-text); }
.site-nav a.btn--members, .btn--members { background: transparent; color: var(--fg) !important; border: 1px solid var(--gold);
  border-radius: 2px; padding: 13px 26px; margin-left: clamp(0px, 1.5vw, 24px); letter-spacing: .08em; font-weight: 500; }
.btn--members:hover, .site-nav a.btn--members.is-current { background: var(--gold); color: #000 !important; }
.head-social { gap: 22px; margin-left: clamp(10px, 2vw, 30px); }
.head-social svg { width: 30px; height: 30px; }
.nav-burger span, .nav-burger span::before, .nav-burger span::after { background: var(--gold); }

/* ---- buttons ---- */
.btn { border-radius: 2px; background: linear-gradient(135deg, var(--gold), var(--gold-light)); border-color: var(--gold);
  font-weight: 500; }
.btn--ghost { background: transparent; color: var(--gold); }
.btn--outline { background: transparent; color: var(--fg); border: 1px solid var(--accent-2); padding: 13px 30px;
  font: 500 13px/1 var(--font-body); letter-spacing: .12em; }
.btn--outline:hover { background: var(--accent-2); color: #fff; filter: none; }

/* ---- hero ---- */
.hero { padding: 90px 0 80px; border-bottom: 1px solid var(--line); background: #000; }
.hero h1 { font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
.hero--title h1::after { content: ""; display: block; width: 90px; height: 1px; margin: 22px auto 0;
  background: linear-gradient(90deg, var(--gold), var(--accent-2)); }
.hero--left h1::after { margin-left: 0; }
.hero .hero-bg { opacity: .35; }
.hero--title.hero--img { --hero-center-dim: .7; }
.hero--title .hero-slide--split .hero-bg { opacity: .55; }
.eyebrow { color: var(--gold); letter-spacing: .4em; font-size: 12px; }
.hero-sub { color: var(--muted); }

/* wordmark hero: the full brand lockup over the split Wine Room / Speakeasy */
.hero--wordmark { min-height: clamp(470px, 33vw, 640px); padding: 26px 0 64px; display: flex; align-items: center;
  border-bottom: 0; --hero-center-dim: .82; --hero-split-fade: 50%; }
.hero--wordmark .hero-inner { width: 100%; }
/* halves at roughly the mockup's scale; the right one stops short of the edge
   so the side text sits on dark, as in the mockup */
.hero--wordmark .hero-slide--split .hero-bg { width: 39%; opacity: 1; }
.hero--wordmark .hero-slide:not(.hero-slide--split) .hero-bg { opacity: .6; }
.hero--wordmark .hero-arrow { top: 64%; }
.hero--wordmark .hero-slide--split .hero-bg--right { right: 6.5%;
  -webkit-mask-image: linear-gradient(270deg, transparent 0, #000 9%, #000 52%, transparent);
          mask-image: linear-gradient(270deg, transparent 0, #000 9%, #000 52%, transparent); }
.hero--wordmark .hero-slides::after { background: radial-gradient(ellipse 34% 70% at 50% 48%, rgba(0,0,0,.78), rgba(0,0,0,.1) 100%); }
.wordmark--hero { margin: 0; font-weight: 400; }
.wordmark--hero .wm-script { font-size: clamp(110px, 13.2vw, 230px); line-height: 1; padding: 0 .2em .06em .14em; margin-bottom: -.06em; }
.wordmark--hero .wm-word { display: flex; align-items: center; gap: .55em; font-size: clamp(22px, 2.6vw, 40px);
  letter-spacing: .42em; line-height: 1; padding-left: .42em; }
.wordmark--hero .wm-word::before, .wordmark--hero .wm-word::after { content: ""; width: clamp(40px, 5.2vw, 84px); height: 1px; background: var(--gold); }
.wordmark--hero .wm-word::after { margin-left: -.3em; }
.wordmark--hero .wm-word sup { margin-left: -2.5em; } /* cancel the flex gap + trailing letter-spacing */
.hero-eyebrow { font: 400 clamp(17px, 1.75vw, 27px)/1.2 var(--font-head); letter-spacing: .1em; text-transform: uppercase;
  color: var(--fg); margin-top: 12px; }
.hero-eyebrow .sep { padding: 0 .9em; }
.hero-script { font-family: var(--font-accent); color: var(--accent-2); font-size: clamp(40px, 4.3vw, 68px); line-height: 1.05;
  margin: 10px 0 4px; text-shadow: 0 2px 14px rgba(0,0,0,.6); }
.hero--wordmark .hero-sub { font: 500 clamp(15px, 1.5vw, 22px)/1.2 var(--font-head); letter-spacing: .5em; color: var(--gold);
  text-transform: uppercase; margin-top: 10px; padding-left: .5em; }
.hero-side { right: clamp(18px, 1.6vw, 30px); top: 30%; transform: none; font: 500 14px/1.65 var(--font-head);
  letter-spacing: .12em; color: var(--fg); }
.hero-side::after { content: ""; display: block; width: 36px; height: 1px; background: var(--gold); margin-top: 16px; }
.hero-arrow { color: #fff; } .hero-arrow-ico { width: 36px; height: 36px; stroke-width: 1.1; }
.hero-arrow--prev { left: 24px; } .hero-arrow--next { right: 24px; }
.hero-dots { bottom: 22px; } .hero-dot { width: 30px; height: 3px; background: rgba(255,255,255,.55); }
.hero-dot.is-active { background: var(--accent-2); }

/* ---- features strip ---- */
.features { background: #000; padding: 22px 0 18px; border-bottom: 1px solid color-mix(in srgb, var(--gold) 70%, transparent); }
.features .wrap { max-width: 1260px; }
.feat + .feat { border-left: 1px solid var(--accent-2); }
.feat { padding: 2px 12px; display: flex; flex-direction: column; justify-content: center; }
.feat-icon { color: var(--gold); width: 32px; height: 32px; margin-bottom: 9px; stroke-width: 1.3; }
.feat-label { font: 500 12.5px/1.5 var(--font-body); letter-spacing: .14em; color: var(--fg); }
.features .sec-h { font-size: 26px; }

/* ---- split panels (Wine Room / Speakeasy) ---- */
.split { background: #000; }
.split-panel { min-height: 250px; }
.split-panel--side .split-bg { -webkit-mask-image: linear-gradient(90deg, transparent, #000 22%); mask-image: linear-gradient(90deg, transparent, #000 22%); }
.split-panel:nth-child(1) { background: radial-gradient(120% 140% at 15% 110%, color-mix(in srgb, var(--accent-2) 30%, #000) 0%, #120408 45%, #060203 80%); }
.split-panel:nth-child(2) { background: radial-gradient(120% 140% at 20% 0%, color-mix(in srgb, var(--gold) 26%, #000) 0%, #120a04 45%, #050302 80%); }
.split-panel + .split-panel { border-left: 1px solid color-mix(in srgb, var(--gold) 70%, transparent); }
.split-panel--side .split-bg { width: 44%; object-position: left center; }
.split-h { font: 400 clamp(28px, 2.9vw, 46px)/1.05 var(--font-head); letter-spacing: .02em; text-transform: uppercase; color: var(--fg); }
.split-sub { font: 500 13.5px/1.4 var(--font-body); letter-spacing: .07em; color: var(--fg); }
.split-inner { padding: 40px clamp(22px, 5.6vw, 92px); }

/* ---- generic blocks in the Blush look ---- */
.blk.rich, .blk.grid, .blk.video, .blk.form-blk, .blk.image { border-top: 1px solid #120d10; }
.sec-h { font-weight: 500; color: var(--gold); text-align: center; letter-spacing: .06em; text-transform: uppercase; }
.sec-h::after { content: ""; display: block; width: 60px; height: 1px; margin: 16px auto 0; background: var(--accent-2); }
.rich h2, .rich h3 { color: var(--gold); font-weight: 500; letter-spacing: .04em; }
.rich .wrap { font-size: 17px; }
.rich a { color: var(--accent-2-text); }
.card { background: linear-gradient(180deg, #120c10, #080507); border-color: var(--line); }
.card h3 { font-size: 26px; font-weight: 500; color: var(--gold); text-transform: uppercase; letter-spacing: .04em; }
.card .btn--ghost { color: var(--fg); border-color: var(--accent-2); }
.cols-2 .card:nth-child(1) { border-top: 1px solid var(--gold); }
.cols-2 .card:nth-child(2) { border-top: 1px solid var(--accent-2); }
.card-img--empty { background: radial-gradient(circle at 30% 30%, color-mix(in srgb, var(--accent-2) 28%, #0b0709), #080507); }
.video-frame--empty { background: radial-gradient(circle at 50% 40%, #1a0e13, #050304); border-color: var(--line); color: var(--gold); }
.site-form input, .site-form select, .site-form textarea { border-radius: 2px; background: #0b0709; }
.fld em { color: var(--accent-2-text); }
.form-msg--ok { background: color-mix(in srgb, var(--accent-2) 14%, transparent); border-color: var(--accent-2); }

/* ---- footer ---- */
.site-foot { background: #000; border-top: 1px solid color-mix(in srgb, var(--gold) 50%, transparent); margin-top: 0; }
.wordmark--foot { align-items: flex-start; }
.wordmark--foot .wm-script { font-size: 52px; padding-left: 0; }
.wordmark--foot .wm-word { font-size: 16px; margin-top: -2px; }
.foot-logo { max-height: 70px; width: auto; }
.foot-tag { color: var(--accent-2-text); font-size: 13px; margin-top: 10px; letter-spacing: .08em; }
.foot-h { font-size: 11px; letter-spacing: .28em; text-transform: uppercase; color: var(--gold); margin-bottom: 8px; }
.foot-social svg { width: 24px; height: 24px; }

/* ---- age gate ---- */
html.ag-on .agegate { background: radial-gradient(ellipse 70% 60% at 50% 45%, rgba(40,6,10,.55), rgba(0,0,0,.82) 75%);
  -webkit-backdrop-filter: blur(16px) brightness(.7); backdrop-filter: blur(16px) brightness(.7); }
.ag-panel { position: relative; background: linear-gradient(180deg, rgba(18,8,11,.94), rgba(5,3,4,.96));
  border: 1px solid color-mix(in srgb, var(--gold) 70%, transparent); border-radius: 2px; padding: 46px 40px 38px; }
.ag-panel::before { content: ""; position: absolute; inset: 7px; border: 1px solid color-mix(in srgb, var(--gold) 22%, transparent);
  pointer-events: none; }
.ag-logo { max-width: min(250px, 72%); margin-bottom: 22px; }
.ag-brand { font-family: var(--font-script); font-weight: 400; color: var(--gold); font-size: 64px; }
.ag-h { font: 500 clamp(22px, 2.6vw, 30px)/1.15 var(--font-head); color: var(--gold); letter-spacing: .14em; text-transform: uppercase; }
.ag-h::after { content: ""; display: block; width: 70px; height: 1px; margin: 16px auto 0;
  background: linear-gradient(90deg, var(--gold), var(--accent-2)); }
.ag-msg { color: var(--fg); opacity: .85; font-size: 15px; letter-spacing: .02em; margin-top: 18px; }
.ag-actions .btn { padding: 15px 26px; font: 500 12.5px/1 var(--font-body); letter-spacing: .14em; }
.ag-actions .ag-enter { color: #120c08; }
.ag-actions .btn--outline { color: var(--fg); }
.ag-declined { color: var(--fg); font: 400 20px/1.4 var(--font-head); letter-spacing: .03em; }
.ag-noscript { background: #000; color: var(--gold); letter-spacing: .1em; border-bottom-color: #16100f; }

/* ---- menu viewer ---- */
.mviewer { background: radial-gradient(90% 120% at 100% 0%, color-mix(in srgb, var(--accent-2) 16%, #000) 0%, #070304 50%, #000 85%);
  border-top: 1px solid #120d10; }
.mv-eyebrow { color: var(--gold); letter-spacing: .4em; font-size: 12px; }
.mv-h { font: 500 clamp(34px, 3.8vw, 54px)/1.05 var(--font-head); letter-spacing: .06em; text-transform: uppercase; color: var(--fg); }
.mv-h::after { content: ""; display: block; width: 80px; height: 1px; margin-top: 20px;
  background: linear-gradient(90deg, var(--gold), var(--accent-2)); }
.mv-intro { color: var(--muted); font-size: 16px; }
.mv-highlights { border-left: 1px solid var(--accent-2); padding-left: 20px; }
.mv-hl-title { font: 500 15px/1.3 var(--font-body); letter-spacing: .14em; color: var(--gold); }
.mv-hl-text { font-size: 14px; color: var(--muted); }
.mv-pages a { color: var(--gold); letter-spacing: .14em; text-transform: uppercase; }
.mv-preview { border: 1px solid color-mix(in srgb, var(--gold) 70%, transparent); border-radius: 2px;
  box-shadow: 0 0 0 7px #000, 0 0 0 8px color-mix(in srgb, var(--gold) 25%, transparent), 0 30px 70px rgba(0,0,0,.7); }
.mv-preview-tag { color: var(--gold-light); font-weight: 500; }
.mv-text { border-color: color-mix(in srgb, var(--gold) 45%, transparent); border-radius: 2px; background: rgba(0,0,0,.4); }
.mv-text summary { color: var(--gold); }
.mv-text summary:hover { color: var(--gold-light); }
.mv-text-body h3 { color: var(--gold); font: 500 22px/1.2 var(--font-head); letter-spacing: .12em; text-transform: uppercase;
  border-bottom: 1px solid color-mix(in srgb, var(--accent-2) 60%, transparent); padding-bottom: 8px; }
.mv-text-body .rich, .mv-text-body { font-size: 15px; }
.mv-text-body strong { color: var(--fg); letter-spacing: .06em; }
.mv-text-body em { color: var(--muted); }
.mv-text-body small { color: var(--muted); }
.mv-overlay { background: #050304; }
.mv-bar { border-bottom-color: color-mix(in srgb, var(--gold) 35%, transparent); background: #000; }
.mv-title { color: var(--gold); font-family: var(--font-body); }
.mv-tool, .mv-tab { border-color: color-mix(in srgb, var(--gold) 45%, transparent); color: var(--fg); font-family: var(--font-body); }
.mv-tool:hover, .mv-tool:focus-visible, .mv-tab:focus-visible { border-color: var(--gold); color: var(--gold-light); }
.mv-tab.is-active { background: var(--gold); border-color: var(--gold); color: #120c08; }
.mv-close:hover { border-color: var(--accent-2); color: #fff; background: var(--accent-2); }
.rich-social { justify-content: center; }

/* ---- tablet / mobile ---- */
@media (max-width: 1180px) {
  .site-nav { gap: 22px; }
  .site-nav a { font-size: 12.5px; }
  .site-nav a.btn--members { padding: 11px 16px; }
  .head-social { gap: 14px; } .head-social svg { width: 24px; height: 24px; }
}
@media (max-width: 860px) {
  .head-row { min-height: 64px; gap: 12px; }
  .wordmark--head .wm-script { font-size: 38px; }
  .wordmark--head .wm-word { font-size: 16px; }
  .brand-sub { font-size: 8.5px; letter-spacing: .06em; }
  .site-nav { background: #000; gap: 4px; padding: 10px 22px 22px; border-bottom: 1px solid var(--line); }
  .site-nav a { font-size: 15px; padding: 12px 0; }
  .site-nav a.btn--members { margin: 10px 0 0; }
  .head-social { gap: 12px; margin-left: auto; } .head-social svg { width: 22px; height: 22px; }
  .hero--wordmark { min-height: 520px; padding: 40px 0 60px; --hero-split-fade: 40%; }
  .hero--wordmark .hero-slide--split .hero-bg { width: 60%; opacity: .5; }
  .hero--wordmark .hero-slide--split .hero-bg--right { right: 0; }
  .hero--wordmark .hero-slides::after { background: radial-gradient(ellipse 70% 60% at 50% 50%, rgba(0,0,0,.7), rgba(0,0,0,.25) 100%); }
  .hero--wordmark .hero-arrow { top: auto; bottom: 4px; transform: none; }
  .split-panel--side .split-bg { width: 62%; opacity: .4; }
  .hero-eyebrow .sep { padding: 0 .5em; }
  .feat + .feat { border-left: 0; }
  .feat { padding: 10px 6px; }
  .feat:nth-child(3n+2), .feat:nth-child(3n+3) { border-left: 1px solid color-mix(in srgb, var(--accent-2) 70%, transparent); }
  .split-panel + .split-panel { border-left: 0; border-top: 1px solid color-mix(in srgb, var(--gold) 70%, transparent); }
  .split-panel { min-height: 250px; }
}
@media (max-width: 760px) {
  .wordmark--foot { align-items: center; }
  .ag-panel { padding: 36px 22px 28px; }
  .ag-actions .btn { width: 100%; }
  .mv-h::after { margin-left: auto; margin-right: auto; }
  .mv-highlights { border-left: 0; padding-left: 0; }
}
@media (max-width: 420px) {
  .wordmark--head .wm-script { font-size: 34px; }
  .wordmark--head .wm-word { font-size: 14px; letter-spacing: .3em; }
  .head-social { display: none; }
  .hero-script { font-size: 38px; }
  .hero--wordmark .hero-sub { letter-spacing: .38em; }
}