/* ============================================================================
   FindMagic — shared design system
   One source of truth for the landing page AND the discovery pages.
   ============================================================================ */
:root {
  --ground:#120A0C; --ground-2:#1A1013; --ground-3:#221419;
  --ink:#F3E7D0; --ink-soft:#D8C4A6; --muted:#A08C82;
  --wine:#7C1420; --wine-deep:#560D16; --gold:#C9A24B; --gold-bright:#EDD293;
  --accent-ink:#EAD199; --line:rgba(201,162,75,0.24); --line-soft:rgba(201,162,75,0.13);
  --panel-shadow:rgba(0,0,0,0.55); --spot:rgba(201,162,75,0.16); --vignette:rgba(0,0,0,0.62);
  --maxw:1120px; --frame-inset:18px; --radius:3px;
  --font-display:"Didot","Bodoni 72","Bodoni MT","Big Caslon","Hoefler Text",Georgia,"Times New Roman",serif;
  --font-body:"Optima","Palatino Linotype","Palatino","Gill Sans","Segoe UI",-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
}
@media (prefers-color-scheme: light) {
  :root {
    --ground:#EDE2C7; --ground-2:#E5D7B6; --ground-3:#F5EED8;
    --ink:#241318; --ink-soft:#4A342B; --muted:#6E5748;
    --wine:#7C1420; --wine-deep:#5A0E18; --gold:#B98F34; --gold-bright:#8A6A1E;
    --accent-ink:#7C5A14; --line:rgba(124,20,32,0.26); --line-soft:rgba(124,20,32,0.14);
    --panel-shadow:rgba(90,60,20,0.16); --spot:rgba(185,143,52,0.20); --vignette:rgba(120,90,40,0.10);
  }
}
:root[data-theme="light"] {
  --ground:#EDE2C7; --ground-2:#E5D7B6; --ground-3:#F5EED8; --ink:#241318; --ink-soft:#4A342B; --muted:#6E5748;
  --wine:#7C1420; --wine-deep:#5A0E18; --gold:#B98F34; --gold-bright:#8A6A1E; --accent-ink:#7C5A14;
  --line:rgba(124,20,32,0.26); --line-soft:rgba(124,20,32,0.14); --panel-shadow:rgba(90,60,20,0.16); --spot:rgba(185,143,52,0.20); --vignette:rgba(120,90,40,0.10);
}
:root[data-theme="dark"] {
  --ground:#120A0C; --ground-2:#1A1013; --ground-3:#221419; --ink:#F3E7D0; --ink-soft:#D8C4A6; --muted:#A08C82;
  --wine:#7C1420; --wine-deep:#560D16; --gold:#C9A24B; --gold-bright:#EDD293; --accent-ink:#EAD199;
  --line:rgba(201,162,75,0.24); --line-soft:rgba(201,162,75,0.13); --panel-shadow:rgba(0,0,0,0.55); --spot:rgba(201,162,75,0.16); --vignette:rgba(0,0,0,0.62);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body { margin:0; background:var(--ground); color:var(--ink); font-family:var(--font-body); font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden; }
::selection { background:var(--wine); color:var(--gold-bright); }
h1,h2,h3 { font-family:var(--font-display); font-weight:400; text-wrap:balance; margin:0; }
a { color:inherit; }
.eyebrow { font-family:var(--font-body); text-transform:uppercase; letter-spacing:0.36em; font-size:0.72rem; font-weight:600; color:var(--accent-ink); }
.suit { font-family:Georgia, serif; }

.frame { position:fixed; inset:var(--frame-inset); border:1px solid var(--line); pointer-events:none; z-index:60; box-shadow:inset 0 0 0 3px rgba(0,0,0,0.12); }
.frame span { position:absolute; width:26px; height:26px; color:var(--gold); font:15px/26px Georgia,serif; text-align:center; background:var(--ground); }
.frame .tl{top:-13px;left:-13px;} .frame .tr{top:-13px;right:-13px;} .frame .bl{bottom:-13px;left:-13px;} .frame .br{bottom:-13px;right:-13px;}
@media (max-width:640px){ .frame{ display:none; } }

/* magician-page immersive topbar */
.topbar { position:fixed; top:0; left:0; right:0; z-index:55; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:0.75rem clamp(1.2rem,4vw,3rem); background:color-mix(in srgb, var(--ground) 88%, transparent); backdrop-filter:blur(9px); border-bottom:1px solid var(--line-soft); transform:translateY(-110%); transition:transform .4s ease; }
.topbar.show { transform:translateY(0); }
.topbar .name { font-family:var(--font-display); font-size:1.15rem; letter-spacing:.03em; }
.topbar .name small { font-family:var(--font-body); letter-spacing:.28em; text-transform:uppercase; font-size:.55rem; color:var(--muted); display:block; }

.btn { display:inline-flex; align-items:center; gap:.55rem; font-family:var(--font-body); font-weight:600; font-size:.82rem; letter-spacing:.12em; text-transform:uppercase; padding:.85rem 1.5rem; border-radius:var(--radius); text-decoration:none; cursor:pointer; border:1px solid transparent; transition:transform .18s ease, background .25s ease, color .25s ease, box-shadow .25s ease; }
/* Wine fill is dark in BOTH themes, so the text is a FIXED bright gold. */
.btn-primary { background:var(--wine); color:#FBEEC8; font-weight:700; border-color:color-mix(in srgb, var(--gold) 72%, transparent); box-shadow:0 8px 26px -10px color-mix(in srgb, var(--wine) 80%, black), inset 0 0 0 1px color-mix(in srgb, var(--gold) 26%, transparent); }
.btn-primary:hover { background:var(--wine-deep); color:#FFF7E4; transform:translateY(-2px); box-shadow:0 14px 34px -12px var(--wine), inset 0 0 0 1px color-mix(in srgb, var(--gold) 40%, transparent); }
.btn-primary .arrow { color:var(--gold-bright); }
.btn-ghost { background:transparent; color:var(--accent-ink); border-color:var(--line); }
.btn-ghost:hover { border-color:var(--gold); background:color-mix(in srgb, var(--gold) 10%, transparent); transform:translateY(-2px); }
.btn-sm { padding:.6rem 1rem; font-size:.72rem; }
.btn:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, button:focus-visible { outline:2px solid var(--gold); outline-offset:3px; }

section { position:relative; }
.wrap { max-width:var(--maxw); margin:0 auto; padding:0 clamp(1.2rem,5vw,3rem); }
.section-pad { padding:clamp(4rem,9vw,7rem) 0; }
.section-head { text-align:center; margin-bottom:2.8rem; }
.section-head .eyebrow { display:block; margin-bottom:.9rem; }
.section-head h2 { font-size:clamp(2rem,5vw,3rem); line-height:1.05; letter-spacing:.01em; }

.hero { min-height:100svh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:6rem clamp(1.2rem,5vw,3rem) 4rem; position:relative; overflow:hidden; }
.hero::before { content:""; position:absolute; inset:0; z-index:0; background:radial-gradient(120% 90% at 50% 8%, var(--spot), transparent 55%), radial-gradient(140% 120% at 50% 120%, var(--vignette), transparent 60%); }
.hero > * { position:relative; z-index:1; }
.hero .verified { display:inline-flex; align-items:center; gap:.5rem; font-size:.68rem; letter-spacing:.22em; text-transform:uppercase; color:var(--accent-ink); border:1px solid var(--line); padding:.35rem .8rem; border-radius:100px; margin-bottom:1.6rem; }
.hero .verified .dot { color:var(--gold); }
.hero-eyebrow { margin-bottom:1.4rem; }
.hero h1 { font-size:clamp(3.4rem,13vw,8.5rem); line-height:0.9; letter-spacing:.01em; margin:0; text-shadow:0 2px 40px color-mix(in srgb, var(--gold) 22%, transparent); }
.hero .subtitle { font-family:var(--font-display); font-style:italic; font-size:clamp(1.2rem,3.6vw,1.9rem); color:var(--ink-soft); margin-top:1.1rem; letter-spacing:.02em; }
.hero-cta { display:flex; flex-wrap:wrap; gap:.9rem; justify-content:center; margin-top:2.2rem; }
.hero-cta .btn { padding:1rem 1.8rem; font-size:.86rem; }
.hero .verified.unclaimed { color:var(--muted); }
.hero .verified.unclaimed .dot { color:var(--muted); }
.hero-meta { display:flex; flex-wrap:wrap; gap:.6rem 2.2rem; justify-content:center; margin-top:2.6rem; color:var(--muted); font-size:.82rem; letter-spacing:.04em; }
.hero-meta b { color:var(--ink); font-weight:600; }
.hero-meta .star { color:var(--gold); }
.scroll-cue { margin-top:3rem; z-index:1; color:var(--muted); font-size:.62rem; letter-spacing:.3em; text-transform:uppercase; display:flex; flex-direction:column; align-items:center; gap:.5rem; }
@media (max-height:680px){ .scroll-cue { display:none; } }
.scroll-cue .line { width:1px; height:34px; background:linear-gradient(var(--gold), transparent); animation:pulse 2.4s ease-in-out infinite; }
@keyframes pulse { 0%,100%{opacity:.3; transform:scaleY(.7);} 50%{opacity:1; transform:scaleY(1);} }

.nowplaying { border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:linear-gradient(color-mix(in srgb, var(--wine) 14%, transparent), transparent); }
.nowplaying .wrap { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.2rem; padding-top:1.4rem; padding-bottom:1.4rem; }
.nowplaying .np-label { display:flex; align-items:center; gap:.7rem; }
.nowplaying .np-pulse { width:9px; height:9px; border-radius:50%; background:var(--wine); animation:ring 2.2s infinite; }
@keyframes ring { 0%{ box-shadow:0 0 0 0 color-mix(in srgb, var(--wine) 70%, transparent);} 70%{ box-shadow:0 0 0 12px transparent;} 100%{ box-shadow:0 0 0 0 transparent;} }
.nowplaying .np-title { font-family:var(--font-display); font-size:clamp(1.1rem,2.6vw,1.5rem); }
.nowplaying .np-title span { color:var(--muted); font-family:var(--font-body); font-size:.8rem; letter-spacing:.04em; }

.shows-list { display:flex; flex-direction:column; gap:0; border-top:1px solid var(--line-soft); }
.show { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:1.6rem; padding:1.5rem .4rem; border-bottom:1px solid var(--line-soft); transition:background .25s ease, padding-left .25s ease; }
.show:hover { background:color-mix(in srgb, var(--gold) 6%, transparent); padding-left:1rem; }
.show .date { text-align:center; min-width:76px; }
.show .date .mon { display:block; font-family:var(--font-body); text-transform:uppercase; letter-spacing:.18em; font-size:.66rem; color:var(--accent-ink); }
.show .date .day { display:block; font-family:var(--font-display); font-size:2.3rem; line-height:1; }
.show .date .dow { display:block; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-top:.2rem; }
.show .info h3 { font-size:1.35rem; letter-spacing:.01em; }
.show .info h3 a { text-decoration:none; }
.show .info h3 a:hover { color:var(--accent-ink); }
.show .info .venue { color:var(--muted); font-size:.9rem; margin-top:.25rem; }
.show .info .venue .city { color:var(--accent-ink); }
.show .info .byline { color:var(--muted); font-size:.82rem; margin-top:.15rem; }
.show .info .byline a { color:var(--accent-ink); text-decoration:none; }
.show .act { display:flex; flex-direction:column; align-items:flex-end; gap:.5rem; }
.show .price { font-size:.8rem; color:var(--muted); letter-spacing:.04em; }
.show .tag { font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--accent-ink); border:1px solid var(--line); border-radius:100px; padding:.25rem .6rem; }
.show.private { background:color-mix(in srgb, var(--wine) 7%, transparent); }
@media (max-width:620px){ .show{ grid-template-columns:auto 1fr; grid-template-areas:"date info" "act act"; row-gap:1rem; } .show .date{grid-area:date;} .show .info{grid-area:info;} .show .act{grid-area:act; align-items:flex-start; flex-direction:row; justify-content:space-between; width:100%;} }
.travel-note { margin-top:1.8rem; text-align:center; color:var(--muted); font-size:.92rem; }
.travel-note a { color:var(--accent-ink); text-underline-offset:3px; }
.empty-note { text-align:center; color:var(--muted); padding:2rem 0; }

.experience .grid { display:grid; grid-template-columns:1.3fr 1fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
@media (max-width:820px){ .experience .grid{ grid-template-columns:1fr; } }
.experience p { color:var(--ink-soft); margin:0 0 1.1rem; }
.experience .lead-cap::first-letter { font-family:var(--font-display); float:left; font-size:4.2rem; line-height:.8; padding:.1rem .5rem 0 0; color:var(--accent-ink); }
.pullquote { border-left:2px solid var(--gold); padding:.4rem 0 .4rem 1.6rem; font-family:var(--font-display); font-style:italic; font-size:1.5rem; line-height:1.35; color:var(--ink); }
.stat-stack { display:grid; gap:1.3rem; }
.stat { border:1px solid var(--line-soft); border-radius:var(--radius); padding:1.3rem 1.4rem; background:var(--ground-2); }
.stat .n { font-family:var(--font-display); font-size:2.6rem; line-height:1; color:var(--accent-ink); font-variant-numeric:tabular-nums; }
.stat .l { font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-top:.5rem; }

.specialties { background:var(--ground-2); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); }
.spec-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
@media (max-width:780px){ .spec-grid{ grid-template-columns:1fr; } }
.spec { border:1px solid var(--line-soft); border-radius:var(--radius); padding:2rem 1.8rem; background:var(--ground-3); transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.spec:hover { transform:translateY(-4px); border-color:var(--gold); box-shadow:0 20px 40px -24px var(--panel-shadow); }
.spec .glyph { font-family:Georgia,serif; font-size:2rem; color:var(--gold); }
.spec h3 { font-size:1.4rem; margin:1rem 0 .6rem; }
.spec p { color:var(--muted); font-size:.95rem; margin:0; }

.gallery-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:.8rem; }
@media (max-width:900px){ .gallery-grid{ grid-template-columns:repeat(2,1fr); } }
.tile { position:relative; aspect-ratio:3/4; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line-soft); display:flex; align-items:flex-end; padding:1rem; color:#F3E7D0; isolation:isolate; }
.tile::before { content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(120% 80% at 30% 20%, color-mix(in srgb, var(--gold) 28%, transparent), transparent 60%), linear-gradient(160deg, var(--wine-deep), #0c0709 78%); }
.tile:nth-child(2)::before { background:radial-gradient(120% 80% at 70% 30%, color-mix(in srgb, var(--gold) 22%, transparent), transparent 55%), linear-gradient(200deg, #241014, #0c0709); }
.tile:nth-child(3)::before { background:radial-gradient(130% 90% at 40% 80%, color-mix(in srgb, var(--wine) 55%, transparent), transparent 60%), linear-gradient(160deg, #1a0d12, #060405); }
.tile:nth-child(4)::before { background:radial-gradient(120% 80% at 60% 20%, color-mix(in srgb, var(--gold) 30%, transparent), transparent 55%), linear-gradient(200deg, #2a1410, #080506); }
.tile .big-suit { position:absolute; z-index:-1; right:-10px; bottom:-18px; font:8rem/1 Georgia,serif; color:rgba(243,231,208,0.08); }
.tile .cap { font-family:var(--font-display); font-size:1.15rem; text-shadow:0 2px 10px rgba(0,0,0,.6); }
.tile .cap small { display:block; font-family:var(--font-body); font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-bright); margin-bottom:.2rem; }

.praise-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
@media (max-width:820px){ .praise-grid{ grid-template-columns:1fr; } }
.quote { border:1px solid var(--line-soft); border-radius:var(--radius); padding:1.8rem; background:var(--ground-2); display:flex; flex-direction:column; }
.quote .stars { color:var(--gold); letter-spacing:.2em; font-size:.8rem; margin-bottom:.9rem; }
.quote blockquote { margin:0; font-family:var(--font-display); font-size:1.16rem; line-height:1.5; color:var(--ink); font-style:italic; }
.quote .by { margin-top:auto; padding-top:1.2rem; font-size:.8rem; color:var(--muted); letter-spacing:.04em; }
.quote .by b { color:var(--accent-ink); font-weight:600; display:block; font-style:normal; letter-spacing:.02em; }

.hire { background:radial-gradient(90% 120% at 15% 0%, color-mix(in srgb, var(--wine) 16%, transparent), transparent 55%), var(--ground-2); border-top:1px solid var(--line); }
.hire .grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(2rem,5vw,4rem); align-items:start; }
@media (max-width:820px){ .hire .grid{ grid-template-columns:1fr; } }
.hire h2 { font-size:clamp(2rem,5vw,3rem); line-height:1.02; }
.hire .sell { color:var(--ink-soft); margin:1.2rem 0; }
.hire .checklist { list-style:none; padding:0; margin:1.4rem 0 0; display:grid; gap:.7rem; }
.hire .checklist li { display:flex; gap:.7rem; align-items:baseline; color:var(--ink-soft); font-size:.95rem; }
.hire .checklist li::before { content:"\2726"; color:var(--gold); }
form { display:grid; gap:1rem; }
.hire form, .discover form { background:var(--ground-3); border:1px solid var(--line); border-radius:var(--radius); padding:clamp(1.4rem,3vw,2rem); }
.field { display:grid; gap:.4rem; }
.row2 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media (max-width:520px){ .row2{ grid-template-columns:1fr; } }
label { font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); font-weight:600; }
input, select, textarea { font-family:var(--font-body); font-size:.95rem; color:var(--ink); background:var(--ground); border:1px solid var(--line-soft); border-radius:var(--radius); padding:.8rem .9rem; width:100%; transition:border-color .2s ease, box-shadow .2s ease; }
input::placeholder, textarea::placeholder { color:color-mix(in srgb, var(--muted) 80%, transparent); }
input:focus, select:focus, textarea:focus { border-color:var(--gold); box-shadow:0 0 0 3px color-mix(in srgb, var(--gold) 18%, transparent); outline:none; }
textarea { resize:vertical; min-height:92px; }
.honeypot { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.form-foot { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.form-foot .fine { font-size:.74rem; color:var(--muted); max-width:30ch; }
.form-error { color:#e5a3a3; font-size:.82rem; margin:0; }
.form-success { text-align:center; padding:2.5rem 1.5rem; background:var(--ground-3); border:1px solid var(--gold); border-radius:var(--radius); }
.form-success .big-tick { font-size:2.4rem; color:var(--gold); }
.form-success h3 { font-size:1.6rem; margin:.6rem 0 .5rem; }
.form-success p { color:var(--muted); margin:0; font-size:.95rem; }

footer { border-top:1px solid var(--line); background:var(--ground); }
.foot-grid { display:flex; flex-wrap:wrap; gap:2rem; justify-content:space-between; align-items:flex-start; padding:clamp(2.5rem,6vw,4rem) 0 1.5rem; }
footer .name { font-family:var(--font-display); font-size:1.8rem; }
footer .name small { display:block; font-family:var(--font-body); font-size:.6rem; letter-spacing:.3em; text-transform:uppercase; color:var(--muted); margin-top:.3rem; }
.foot-col h4 { font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); margin:0 0 .8rem; font-family:var(--font-body); font-weight:600; }
.foot-col a { display:block; color:var(--ink-soft); text-decoration:none; font-size:.92rem; padding:.2rem 0; }
.foot-col a:hover { color:var(--accent-ink); }
.foot-bar { border-top:1px solid var(--line-soft); padding:1.2rem 0 2rem; display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; align-items:center; font-size:.78rem; color:var(--muted); }
.powered b { color:var(--accent-ink); font-family:var(--font-display); font-size:1rem; letter-spacing:.02em; }
.foot-bar .claim { color:var(--accent-ink); text-decoration:none; border-bottom:1px solid var(--line); padding-bottom:2px; }

.claim-section { background:radial-gradient(90% 120% at 50% 0%, color-mix(in srgb, var(--gold) 12%, transparent), transparent 60%), var(--ground-2); border-top:1px solid var(--line); text-align:center; }
.claim-section .inner { max-width:640px; margin:0 auto; }
.claim-section .eyebrow { display:block; margin-bottom:1rem; }
.claim-section h2 { font-size:clamp(1.8rem,4.5vw,2.6rem); line-height:1.1; }
.claim-section p { color:var(--ink-soft); margin:1.1rem auto 0; }
.claim-section .claim-perks { list-style:none; padding:0; margin:1.8rem 0; display:flex; flex-wrap:wrap; gap:.7rem 1.4rem; justify-content:center; color:var(--muted); font-size:.9rem; }
.claim-section .claim-perks li::before { content:"\2726"; color:var(--gold); margin-right:.5rem; }
.claim-section .claim-actions { display:flex; flex-wrap:wrap; gap:.9rem; justify-content:center; margin-top:1.4rem; }

.js .reveal { opacity:0; transform:translateY(22px); }
.js .reveal.in { opacity:1; transform:none; transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
@media (prefers-reduced-motion: reduce){ .js .reveal{ opacity:1 !important; transform:none !important; } .scroll-cue .line, .np-pulse{ animation:none !important; } * { animation-duration:.001ms !important; transition-duration:.05ms !important; } }

/* ============================================================================
   DISCOVERY PAGES — site chrome, hero, search, cards, filters
   ============================================================================ */
.site-nav { position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.9rem clamp(1.2rem,5vw,3rem); background:color-mix(in srgb, var(--ground) 90%, transparent); backdrop-filter:blur(9px); border-bottom:1px solid var(--line-soft); }
.site-nav .brand { font-family:var(--font-display); font-size:1.35rem; letter-spacing:.02em; text-decoration:none; display:inline-flex; align-items:center; gap:.55rem; }
.site-nav .brand .suit { color:var(--gold); font-size:.9rem; letter-spacing:-.1em; }
.site-nav nav { display:flex; align-items:center; gap:1.5rem; }
.site-nav nav a { text-decoration:none; color:var(--ink-soft); font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; }
.site-nav nav a:hover { color:var(--accent-ink); }
@media (max-width:720px){ .site-nav nav a.hide-sm { display:none; } }

.site-hero { position:relative; text-align:center; padding:clamp(3.2rem,8vw,6rem) 0 clamp(2rem,5vw,3.5rem); overflow:hidden; }
.site-hero::before { content:""; position:absolute; inset:0; z-index:0; background:radial-gradient(110% 90% at 50% -10%, var(--spot), transparent 55%); }
.site-hero > * { position:relative; z-index:1; }
.site-hero h1 { font-size:clamp(2.6rem,7vw,5rem); line-height:1; letter-spacing:.01em; margin:1rem 0 0; }
.site-hero .lede { max-width:52ch; margin:1.2rem auto 0; color:var(--ink-soft); font-size:1.05rem; }

.page-hero { text-align:center; padding:clamp(2.4rem,6vw,3.6rem) 0 1.6rem; border-bottom:1px solid var(--line-soft); position:relative; overflow:hidden; }
.page-hero::before { content:""; position:absolute; inset:0; z-index:0; background:radial-gradient(120% 100% at 50% -20%, var(--spot), transparent 55%); }
.page-hero > * { position:relative; z-index:1; }
.page-hero h1 { font-size:clamp(2.2rem,5.5vw,3.6rem); line-height:1.02; margin-top:.6rem; }
.page-hero .sub { color:var(--muted); margin-top:.8rem; font-size:.95rem; letter-spacing:.03em; }

.discover { max-width:820px; margin:2.2rem auto 0; text-align:left; }
.discover-form { display:grid; grid-template-columns:1.5fr 1fr 1fr auto; gap:.8rem; align-items:end; }
@media (max-width:720px){ .discover-form { grid-template-columns:1fr 1fr; } .discover-form .go { grid-column:1 / -1; } .discover-form .go .btn { width:100%; justify-content:center; } }
.discover .hint { color:var(--muted); font-size:.78rem; margin:.9rem 0 0; text-align:center; }

.city-row { display:flex; flex-wrap:wrap; gap:.6rem; justify-content:center; margin-top:1.6rem; }
.city-pill { text-decoration:none; border:1px solid var(--line); border-radius:100px; padding:.5rem 1.05rem; font-size:.82rem; color:var(--ink-soft); letter-spacing:.03em; transition:border-color .2s, background .2s, color .2s; }
.city-pill:hover { border-color:var(--gold); color:var(--accent-ink); background:color-mix(in srgb, var(--gold) 8%, transparent); }

.card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
@media (max-width:900px){ .card-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .card-grid { grid-template-columns:1fr; } }
.card { display:flex; flex-direction:column; border:1px solid var(--line-soft); border-radius:var(--radius); background:var(--ground-2); padding:1.5rem; text-decoration:none; color:inherit; transition:transform .2s, border-color .2s, box-shadow .2s; }
.card:hover { transform:translateY(-4px); border-color:var(--gold); box-shadow:0 22px 44px -26px var(--panel-shadow); }
.card .card-top { display:flex; align-items:baseline; justify-content:space-between; gap:.6rem; }
.card .card-city { font-size:.64rem; letter-spacing:.18em; text-transform:uppercase; color:var(--accent-ink); }
.card .card-rating { font-size:.8rem; color:var(--muted); white-space:nowrap; }
.card .card-rating .star { color:var(--gold); }
.card h3 { font-family:var(--font-display); font-size:1.7rem; line-height:1.02; margin:.5rem 0 0; }
.card .card-tag { font-family:var(--font-display); font-style:italic; color:var(--ink-soft); font-size:1rem; margin-top:.35rem; }
.card .chips { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:1rem; }
.card .card-foot { margin-top:auto; padding-top:1.3rem; display:flex; align-items:center; justify-content:space-between; gap:.6rem; }
.card .view { color:var(--accent-ink); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; }
.card .gig-badge { font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-bright); border:1px solid var(--line); border-radius:100px; padding:.2rem .55rem; }

.chip { font-size:.64rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); border:1px solid var(--line-soft); border-radius:100px; padding:.25rem .6rem; display:inline-block; }

.filters { display:flex; flex-wrap:wrap; gap:1rem 1.4rem; align-items:end; margin:1.8rem 0 2.4rem; padding:1.2rem 1.3rem; border:1px solid var(--line-soft); border-radius:var(--radius); background:var(--ground-2); }
.filters form { background:none; border:none; padding:0; display:flex; flex-wrap:wrap; gap:1rem; align-items:end; }
.filters .field { min-width:160px; }
.filter-chips { display:flex; flex-wrap:wrap; gap:.5rem; }
.filter-chips a { text-decoration:none; }
.filter-chips a.chip.active { border-color:var(--gold); color:var(--accent-ink); background:color-mix(in srgb, var(--gold) 12%, transparent); }

.result-count { color:var(--muted); font-size:.85rem; letter-spacing:.04em; margin-bottom:1.2rem; }
.empty { text-align:center; color:var(--muted); padding:3rem 1rem; border:1px dashed var(--line-soft); border-radius:var(--radius); }
.empty a { color:var(--accent-ink); }
.section-title { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; margin:0 0 1.4rem; }
.section-title h2 { font-size:clamp(1.6rem,4vw,2.3rem); }
.section-title a { color:var(--accent-ink); font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; text-decoration:none; white-space:nowrap; }
.band { text-align:center; background:radial-gradient(90% 120% at 50% 0%, color-mix(in srgb, var(--wine) 16%, transparent), transparent 60%), var(--ground-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.band h2 { font-size:clamp(1.8rem,4.5vw,2.6rem); }
.band p { color:var(--ink-soft); max-width:48ch; margin:1rem auto 0; }
.band .btn { margin-top:1.6rem; }

/* A retired magician is history worth keeping, not a booking opportunity. */
.gig-badge.retired { background: transparent; color: var(--muted); border: 1px solid var(--line); }

/* --- Venue cards: for a traveller, a walk-in bar beats a ticketed show ------ */
.venue-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1.4rem; }
.venue-card { display:flex; flex-direction:column; border:1px solid var(--line);
  border-radius:var(--radius); overflow:hidden;
  background:color-mix(in srgb, var(--ground-3) 55%, transparent);
  transition:transform .2s ease, border-color .25s ease; }
.venue-card:hover { transform:translateY(-3px); border-color:var(--accent-ink); }
.venue-card .vc-img { display:block; aspect-ratio:16/9; overflow:hidden; background:var(--ground-2); }
.venue-card .vc-img img { width:100%; height:100%; object-fit:cover; display:block; }
.venue-card .vc-body { padding:1.1rem 1.2rem 1.2rem; display:flex; flex-direction:column; gap:.35rem; flex:1; }
.venue-card .vc-type { font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--accent-ink); }
.venue-card h3 { font-size:1.15rem; margin:0; }
.venue-card h3 a { text-decoration:none; }
.venue-card h3 a:hover { text-decoration:underline; text-underline-offset:3px; }
.venue-card .vc-where { margin:0; font-size:.88rem; color:var(--muted); }
.venue-card .vc-on { margin:.2rem 0 0; font-size:.88rem; color:var(--ink-soft); }
.venue-card .vc-on.vc-muted { color:var(--muted); }
.venue-card .vc-actions { display:flex; gap:.5rem; flex-wrap:wrap; margin-top:auto; padding-top:.9rem; }

/* --- Directory search + pager ---------------------------------------------- */
.filters .field-search { flex:1 1 220px; min-width:200px; }
.filters .field-search input { width:100%; padding:.6rem .7rem; font:inherit; font-size:.95rem;
  color:var(--ink); background:var(--ground-3); border:1px solid var(--line); border-radius:var(--radius); }
.filters .field-search input:focus { outline:2px solid var(--accent-ink); outline-offset:1px; }
.pager { display:flex; align-items:center; justify-content:center; gap:1.4rem;
  margin-top:2.6rem; font-size:.9rem; color:var(--muted); }
.pager a { color:var(--accent-ink); text-decoration:none; }
.pager a:hover { text-decoration:underline; text-underline-offset:3px; }