/* V4: SCV Suds v25 dimensions, SO-CAL SPOOKY artwork and atmosphere. */
:root{--blue:#632881;--ink:#21102d;--yellow:#ff952f;--paper:#f6e9d4;--pink:#ffc37a;--line:#81618e;--sign-gold:#ff952f;--sign-navy:#180921;--sign-cream:#fff0d2;--sign-font:'Spooky Sign',Georgia,serif}
body{background-color:var(--paper);color:var(--ink)}
.topbar,.hero.hero-banner,.city-deck,.site-footer{background:radial-gradient(ellipse at 25% 0,#48205d,transparent 65%),linear-gradient(#210d2d,#100719);border-color:#b96b30;box-shadow:inset 0 1px 0 #ffb65355}
.hero-panorama .hero-banner-art{object-fit:cover;object-position:center}
.topbar .nav-emblem,.site-footer .foot-nav a,.city-deck .city-sign{background:#281035;color:#fff0d2;text-shadow:0 2px 0 #09030e;box-shadow:0 4px 0 #120719,0 7px 0 #763c23,0 12px 15px #14082066}
.topbar .nav-emblem{height:82px;min-height:82px;padding:12px 18px 20px}
.topbar .nav-emblem img{width:100%;height:50px;aspect-ratio:auto;object-fit:contain}
.city-deck .city-sign{background:#281035 url('./brand/region-button-face.webp') center/100% 100% no-repeat}
.city-deck .city-sign.active,.city-deck .city-sign[aria-pressed=true]{background:#281035 url('./brand/region-button-face.webp') center/100% 100% no-repeat;color:#fff5dd;box-shadow:0 0 0 2px #ffc37a,0 4px 0 #120719,0 7px 0 #763c23}
/* Draw the original frame in a fixed-width border, keeping ornament out of the text. */
.topbar .nav-emblem,.site-footer .foot-nav a,.featured-preview,.directory .filters,.directory .split>.directory-map,.card,.info-card,.listing-hero{position:relative;isolation:isolate}
.topbar .nav-emblem::before,.site-footer .foot-nav a::before,.featured-preview::before,.directory .filters::before,.directory .split>.directory-map::before,.card::before,.info-card::before,.listing-hero::before{content:'';position:absolute;inset:-3px;z-index:2;pointer-events:none;border:23px solid transparent;border-image:url('./brand/spooky-frame.webp') 250 180 160 180 / 23px / 0 stretch;filter:drop-shadow(0 2px 2px #0008)}
.topbar .nav-emblem::before,.site-footer .foot-nav a::before{border-image-width:18px}
.directory .filters,.featured-preview,.directory .split>.directory-map,.directory #cards .card,.curated-cards .card{border-color:#c67a3a;background:linear-gradient(145deg,#cb873f,#4d2530 40%,#21102d);box-shadow:0 3px 0 #713c21,0 7px 0 #180b22,0 12px 20px #16082033}
.directory .filters .search-row,.directory .filters .filter-body,.featured-preview-body,.directory-map .map-enamel,.directory #cards .card-body,.curated-cards .card-body{background:radial-gradient(ellipse at 0 0,#42204f,transparent 65%),linear-gradient(135deg,#291435,#160c20);color:#fff0d2;box-shadow:inset 0 1px 0 #c6a2db44,inset 0 -2px 0 #08040d88}
.directory .filters .finder-category{color:#ffc07c;-webkit-text-stroke:0;text-shadow:none}
.directory .filters .chip,.directory .filters .reset{background:linear-gradient(#59306d,#2e153e);border-color:#9f758c;color:#fff0d2;text-shadow:0 2px #170920;box-shadow:0 3px #14081d,0 5px #7b462e}
.directory .filters .chip.active,.directory .filters .chip[aria-pressed=true]{background:linear-gradient(#d8fba0,#afdb58);color:#21102d;text-shadow:none;border-color:#deffad}
.directory .filters input,.directory .filters select{background:#fff5e4;color:#281333}
.directory .filters .sort-wrap{color:#fff0d2}
.directory .filters .search-wrap input::placeholder{color:#644c6e}
.directory-intro{max-width:900px;margin:0 auto 24px;text-align:center}
.directory #cards .card::after{content:none}
.directory #cards .card-body>.card-desc{grid-column:1;grid-row:2;font-size:14px;line-height:1.5;margin:8px 0}
.directory #cards .card-top{display:contents}
.directory #cards .card-top>div{min-width:0}
.directory #cards .card-date{font-size:14px;font-weight:700;color:#ffc07c;margin:8px 0 5px}
.directory #cards .card-category{font-size:12px;line-height:1.5;color:#d0b9d9}
.directory #cards .card .card-body{padding:10px 16px 12px}
.directory #cards h3,.curated-cards h3{color:#fff0d2;text-shadow:0 2px 0 #14071d}
.directory #cards .hood{color:#c8ff85}
.directory #cards .card:not(.coming-listing) .card-rail{grid-row:1/6}
.directory #cards .thumb{border-color:#c58954;min-width:0}
.directory #cards .svc span,.svc span{background:#eee0c9;color:#362040;border-color:#ba9063}
.directory #cards .actions a,.directory #cards .actions button{background:linear-gradient(#4b265e,#291337);color:#fff0d2;border-color:#b58364;box-shadow:0 3px 0 #100617}
.directory #cards .actions .btn-dir,.primary,.btn-featured{background:linear-gradient(#ffbe68,#ed822c);color:#25112d;border-color:#eabe83;text-shadow:none}
.directory #cards .card.selected{border-color:#ffc37a;box-shadow:0 0 0 2px #a8632a,0 7px 0 #180b22,0 0 20px #ff952f33}
.featured-preview-top{background:linear-gradient(#57223c,#2d132e);border-color:#9a5d45;color:#fff0d2}
.featured-preview-top h2{color:#ffc07c;text-shadow:0 2px #180b22}
.featured-pitch{border-color:#aa7a6b66}.featured-benefits li,.demo-services,.demo-tagline{color:#efe0d2}
.demo-copy h3{color:#ffc07c;text-shadow:0 2px #180b22}.demo-label{background:#c8ff85;color:#22102e;display:inline-block}
.demo-photo{border-color:#c58954;background:#21102d;box-shadow:0 4px #14081b}
.demo-photo figcaption{background:#180b22;color:#fff0d2}
.featured-contact{background:linear-gradient(#ffc784,#eb8d3a);color:#24112d;border-color:#ffe0a9;text-shadow:none;box-shadow:0 3px #814520,0 6px #180b22}
.directory .directory-map #dir-map{display:block;width:100%;height:520px;min-height:340px;border:0;border-radius:0;background:#efe4cc}
.directory .directory-map #dir-map[hidden]{display:none}
.map-stage{border:2px solid #c58954;border-radius:9px;overflow:hidden;background:#1b0e25}
.map-selected{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:12px 14px;color:#fff0d2;border-top:1px solid #9f758c}
.map-selected-kicker{font-size:11px;letter-spacing:1px;color:#ffc07c;font-weight:800}
.map-selected strong{flex:1;min-width:180px;font-size:16px}
.map-selected a{background:#ffb861;color:#21102d;padding:8px 11px;border-radius:6px;font-size:14px;font-weight:700;text-decoration:none}
.map-picker-wrap{padding:18px 4px 2px}.map-picker-wrap>p{font-size:14px;text-align:center;margin-bottom:12px;color:#d0b9d9}
.map-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.directory-map .map-pin{display:block;width:auto;height:auto;min-width:0;padding:10px;border:1px solid #9e778b;border-radius:7px;background:linear-gradient(#4b265e,#281335);color:#fff0d2;text-align:left;font:700 14px/1.3 var(--body);box-shadow:0 3px #110817}
.map-pin small{display:block;margin-top:4px;font:400 11px/1.4 var(--body);color:#d0b9d9}
.directory-map .map-pin.active{background:#c8e78c;color:#21102d;border-color:#dbffa2}.map-pin.active small{color:#392945}
.map-empty{grid-column:1/-1;padding:16px;text-align:center;color:#fff0d2}
.directory-answers{margin-bottom:40px;padding-inline:28px;border-top:2px solid #aa6939}
.site-footer{padding-top:24px;border-top:5px solid #ac6933}
.site-footer::before{background:radial-gradient(ellipse at 80% 25%,#81358a26,transparent 45%)}
.site-footer .footer-brand img{margin:0;mask-image:none;object-fit:contain}
.site-footer .foot-nav a{font-size:17px;min-height:64px;padding:9px 10px 16px;-webkit-text-stroke:0;text-shadow:0 2px #100717}
.footer-valley{border-color:#775268;background:none}.footer-valley span{color:#d8b98f}.footer-valley span::before{color:#c8ff85}
.site-footer .foot-copy{color:#d3bfd9}.foot-copy a{color:#fff0d2}
.page{background:transparent}.page h1{color:#351442;text-shadow:0 2px #fff4dc}.page h2{line-height:1.15}
.listing-hero{padding:24px;margin:22px 0 30px;border:2px solid #ac744d;border-radius:14px;background:linear-gradient(130deg,#32173f,#180e21);color:#f8ecd8}
.listing-hero h1{color:#ffc481;text-shadow:0 2px #110719}
.listing-hero .listing-grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:40px;align-items:center}
.listing-hero .listing-photo{height:320px;margin:0;border:1px solid #b68152;border-radius:9px;overflow:hidden}
.listing-photo img{width:100%;height:100%;object-fit:cover}
.listing-lede{font-size:17px;line-height:1.65;max-width:70ch;margin-bottom:24px}
.listing-hero .listing-lede{margin-bottom:0}
.info-card{background:#2a1637;color:#f8ecd8;border:2px solid #ac744d;border-radius:12px;margin-bottom:24px}
.info-card .body{padding:24px}.info-card h2{font-size:28px;color:#ffc481;margin-bottom:16px}.info-card p+p{margin-top:16px}.info-kicker{font-size:12px;letter-spacing:1.5px;font-weight:800;color:#c8ff85;margin-bottom:10px}
.spooky-note{background:#e9dbc2;border-left:4px solid #aa5f2f;color:#321b3e;padding:15px 18px;margin:18px 0;font-size:14px;line-height:1.6}
.info-card .spooky-note{background:#1c1027;color:#f8ecd8}.spooky-note strong{color:inherit}
.actions a{border-radius:6px;min-height:41px}.listing-hero .actions a:not(.primary){border-color:#bb8a6c;color:#fff0d2}
.curated-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.curated-cards .card{padding:6px;border:3px solid #ac744d;border-radius:17px;display:flex}
.curated-cards .card-body{border-radius:9px;padding:16px;display:flex;flex-direction:column;width:100%}
.curated-cards h3{font:900 clamp(25px,2.2vw,33px)/1.13 'Spooky Emblem',Georgia,serif;margin:8px 0}
.curated-cards .hood{color:#c8ff85}.curated-cards .card-date{color:#ffc481;font-size:14px;font-weight:700;margin:8px 0}
.curated-cards .card-desc{font-size:14px;line-height:1.5;margin:8px 0}.curated-cards .actions{margin-top:auto;padding-top:16px}.curated-cards .actions a{border-color:#b68152;color:#fff0d2}.curated-cards .actions .btn-dir{background:#ffb861;color:#21102d}
.spooky-editorial{margin:auto;padding-inline:20px}.spooky-editorial .wrap{width:100%}
button:focus-visible,a:focus-visible{outline:3px solid #ce7532;outline-offset:5px}
@media(max-width:1200px){.site-footer .foot-nav a{font-size:15px;min-height:62px}}
@media(max-width:1160px){.topbar .nav-emblem{height:80px;min-height:80px}}
@media(max-width:1050px){.map-picker{grid-template-columns:repeat(3,minmax(0,1fr))}.directory #cards .card .card-body{padding:10px 12px 12px}}
@media(max-width:760px){.topbar .nav-emblem{height:76px;min-height:76px}}
@media(max-width:700px){.map-picker{grid-template-columns:repeat(2,minmax(0,1fr))}.directory .directory-map #dir-map{height:340px;min-height:300px}.map-selected a{width:100%;text-align:center}.curated-cards{grid-template-columns:1fr;gap:23px}.listing-hero{padding:20px}.listing-hero .listing-grid{grid-template-columns:1fr;gap:24px}.listing-hero .listing-photo{height:250px}.info-card .body{padding:20px}.info-card h2{font-size:24px}.site-footer .foot-nav a{font-size:15px;min-height:64px}.directory-intro{font-size:15px}.directory-answers{padding-inline:16px}.featured-pitch{border-color:#aa7a6b66}}
@media(max-width:390px){.map-picker{grid-template-columns:1fr}.directory #cards .card:not(.coming-listing) .card-body{grid-template-columns:minmax(0,1fr) 90px}.directory #cards h3{font-size:24px}.directory #cards .card-desc{font-size:13px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
/* Live lettering avoids the old labels being rendered twice inside a second sign. */
.topbar .nav-emblem span{font-size:inherit;line-height:1.15}
body{background-image:radial-gradient(ellipse at 0 20%,#79528d14,transparent 48%),url('./brand/parchment-texture.svg');background-size:100% 900px,480px 480px}
.directory .finder-heading h2{display:grid;place-items:center;aspect-ratio:2043/370;line-height:1.1;background:radial-gradient(ellipse at top,#4f285a,#21102d);color:#ffc481;border:2px solid #b87f49;border-radius:12px;font:900 clamp(22px,3.8vw,54px)/1.1 'Spooky Emblem',Georgia,serif;letter-spacing:1px;text-transform:uppercase;padding:16px 24px;text-shadow:0 2px #100719}
.directory .finder-heading h2::before{content:'';position:absolute;inset:-3px;border:22px solid transparent;border-image:url('./brand/spooky-frame.webp') 250 180 160 180 / 22px / 0 stretch;pointer-events:none}
/* Final parity and legibility adjustments after browser measurements. */
.featured-preview+.directory{padding-top:48px}
.directory .directory-map #dir-map{height:460px;min-height:340px}
.map-picker{max-height:140px;overflow-y:auto;padding:2px 4px 5px;scrollbar-color:#b88c5f #261334;scrollbar-width:thin}
.source-label{background:#ffc37a;color:#21102d}
.listing-photo img{object-fit:contain;background:#1c0d26}
.site-footer .foot-nav a::before{border-image-width:12px}
.info-card::before{border-image-width:17px}
@media(max-width:700px){.directory .directory-map #dir-map{height:340px;min-height:300px}.map-picker{max-height:156px}}

/* V5 — one SO-CAL-style sign face for every clickable tile. The hero lettering
   is raster artwork; the bundled variable serif supplies the live-text match. */
:root{--tile-font:'Spooky Emblem',Georgia,serif}
.topbar .nav-emblem,.topbar .nav-emblem span,
.city-deck .city-sign,
.directory .filters .chip,.directory .filters .reset,
.directory #cards .actions a,.directory #cards .actions button,
.curated-cards .actions a,.actions a,.actions button,
.primary,.btn-featured,.featured-contact,
.directory-map .map-pin,.map-selected a,
.site-footer .foot-nav a{
 font-family:var(--tile-font);font-weight:900;font-stretch:75%;
 font-optical-sizing:none;font-variation-settings:'wdth' 75,'opsz' 144,'wght' 900,'GRAD' 100;
 text-transform:uppercase;letter-spacing:.25px;line-height:1.15;
 -webkit-text-stroke:0;paint-order:stroke fill;
}
.topbar .nav-emblem,.city-deck .city-sign,.site-footer .foot-nav a{
 color:#ffdda1;text-shadow:0 1px 0 #bd864a,0 2px 0 #1b0b21,1px 3px 0 #0c0512;
}
.directory-map .map-pin small{font:400 11px/1.4 var(--body);text-transform:none;letter-spacing:0}
.directory .filters .chip{white-space:normal;text-wrap:balance}
body{background-image:radial-gradient(ellipse at 0 20%,#6b453721,transparent 48%),url('./brand/parchment-texture.svg');background-size:100% 900px,640px 640px}

/* V6 — weathered haunted-mansion stone in place of yellow parchment. */
body{background-color:#b5b9bd;background-image:radial-gradient(ellipse at 0 20%,#3e48532b,transparent 48%),url('./brand/weathered-stone.svg');background-size:100% 900px,640px 640px}
.page h1{text-shadow:0 2px #d8dcdf}
.listing-hero h1{text-shadow:0 2px #110719}
.spooky-note{background:#a5aaaf}
.info-card .spooky-note{background:#1c1027}

/* V7 — soot-dark, distressed brick across every page. */
body{background-color:#17191b;background-image:radial-gradient(ellipse at 50% 0,#090b0d00 15%,#02030555 100%),url('./brand/weathered-black-brick.svg');background-size:100% 1400px,720px 360px;color:#eee7dc}
.page h1{color:#ffc481;text-shadow:0 2px #09070c}
.page h2,.page h3,.directory-answers h2,.directory-answers h3{color:#ffdda1}
.page .eyebrow,.page .eyebrow a,.crumb a{color:#d8b6e9}
.directory-intro,.directory-answers,.results-toolbar{color:#eee7dc;text-shadow:0 1px 2px #000}
.directory-intro a,.directory-answers a,.page>.wrap>p>a{color:#ffd19a}
.results-toolbar{border-color:#85715f}.results-toolbar h3{color:#ffdda1}
.directory-answers{border-color:#85715f}
.spooky-note{background:#24272a;color:#eee7dc;border-color:#bc804a}
.info-card .spooky-note{background:#1c1027}
.directory #cards .empty{background:#252029;color:#eee7dc;border-color:#8b6247}
.directory #cards .empty .index{color:#ffba70}.empty p{color:#ded0e5}
.skip{color:#21102d}

/* V8 — centered, readable, embossed lettering with restrained surface wear. */
.topbar .nav-emblem,.city-deck .city-sign,
.directory .filters .chip,.directory .filters .reset,
.directory #cards .actions a,.directory #cards .actions button,
.curated-cards .actions a,.actions a,.actions button,
.primary,.btn-featured,.featured-contact,
.directory-map .map-pin,.map-selected a,.site-footer .foot-nav a{
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 text-align:center;text-indent:0;white-space:normal;text-wrap:balance;
 font-weight:850;font-stretch:90%;font-variation-settings:'wdth' 90,'opsz' 48,'wght' 850,'GRAD' 50;
 letter-spacing:.35px;line-height:1.25;text-shadow:none;
}
.topbar .nav-emblem span{font-weight:inherit;font-stretch:inherit;font-variation-settings:inherit;line-height:inherit}
.topbar .nav-emblem{height:auto;min-height:82px;padding:16px 18px}
.city-deck .city-sign{padding:14px 16px}
.site-footer .foot-nav a{padding:16px 12px}
.directory .filters .chip{padding:10px 12px;font-size:20px}
.directory .filters .reset{padding:12px;font-size:15px}
.directory #cards .card:not(.coming-listing) .actions a,
.directory #cards .card:not(.coming-listing) .actions button{font-size:15px;min-height:46px;padding:10px 7px}
.actions a,.actions button,.map-selected a{font-size:15px}
.directory-map .map-pin{font-size:15px;padding:12px 10px;gap:5px}
.directory-map .map-pin small{width:100%;text-align:center;margin:0;line-height:1.4;text-shadow:none}
.tile-label{display:block;max-width:100%;min-width:0;text-align:center;overflow-wrap:normal;color:#ffe4b0;
 filter:drop-shadow(0 -1px 0 #fff3d144) drop-shadow(0 1px 0 #573820) drop-shadow(0 2px 0 #100713) drop-shadow(0 3px 2px #0009);
}
@supports (background-clip:text){
 .tile-label{background-image:url('./brand/letter-weathering.svg'),linear-gradient(#fff3d9 12%,#ffe0a7 48%,#e5b974 100%);background-size:120px 60px,100% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
}
.directory .filters .chip.active .tile-label,
.directory .filters .chip[aria-pressed=true] .tile-label,
.city-deck .city-sign.active .tile-label,
.directory #cards .actions .btn-dir .tile-label,
.curated-cards .actions .btn-dir .tile-label,
.primary .tile-label,.btn-featured .tile-label,.featured-contact .tile-label,
.directory-map .map-pin.active .tile-label,.map-selected a .tile-label{
 color:#291b2f;-webkit-text-fill-color:currentColor;background:none;
 filter:drop-shadow(0 1px 0 #fff3ccaa) drop-shadow(0 -1px 0 #1b0d2433);
}
/* Region signs remain dark when selected, unlike the lime filter tiles. */
.city-deck .city-sign.active .tile-label{color:#fff1c9;filter:drop-shadow(0 1px 0 #573820) drop-shadow(0 2px 1px #000)}
@media(max-width:1160px){.topbar .nav-emblem{min-height:80px}}
@media(max-width:700px){
 .topbar .nav-emblem{min-height:76px;padding:16px 13px}
 .site-footer .foot-nav a{font-size:16px;min-height:70px;padding:15px 12px}
 .city-deck .city-sign{font-size:19px;min-height:76px;padding:14px 12px}
 .directory .filters .chip{font-size:19px;padding:10px 12px}
 .directory #cards .card:not(.coming-listing) .actions a,
 .directory #cards .card:not(.coming-listing) .actions button{font-size:14px;padding:10px 6px}
}
@supports (background-clip:text){
 .directory .filters .chip.active .tile-label,
 .directory .filters .chip[aria-pressed=true] .tile-label,
 .directory #cards .actions .btn-dir .tile-label,
 .curated-cards .actions .btn-dir .tile-label,
 .primary .tile-label,.btn-featured .tile-label,.featured-contact .tile-label,
 .directory-map .map-pin.active .tile-label,.map-selected a .tile-label{
  background-image:url('./brand/letter-weathering.svg'),linear-gradient(#39273e,#211427);background-size:120px 60px,100% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
 }
 .city-deck .city-sign.active .tile-label{background-image:url('./brand/letter-weathering.svg'),linear-gradient(#fff3d9,#e5b974);background-size:120px 60px,100% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
}
/* Keep long single-word actions readable inside the reference's narrow rail. */
@media(max-width:1050px){
 .directory #cards .card:not(.coming-listing) .actions a,
 .directory #cards .card:not(.coming-listing) .actions button{font-size:13px;letter-spacing:0;font-stretch:75%;font-variation-settings:'wdth' 75,'opsz' 32,'wght' 850,'GRAD' 50}
 .directory #cards .actions .tile-label{filter:drop-shadow(0 -1px 0 #fff3d122) drop-shadow(0 1px 0 #573820) drop-shadow(0 2px 1px #0009)}
 .directory #cards .actions .btn-dir .tile-label{filter:drop-shadow(0 1px 0 #fff3ccaa)}
}
@media(max-width:700px){
 .directory #cards .card:not(.coming-listing) .actions a,
 .directory #cards .card:not(.coming-listing) .actions button{padding-inline:4px}
}
@media(max-width:380px){
 .site-footer .foot-nav a{font-size:15px;font-stretch:75%;font-variation-settings:'wdth' 75,'opsz' 32,'wght' 850,'GRAD' 50;letter-spacing:.1px;padding-inline:10px}
}

/* Expanded event directory: rows fit their own content rather than the longest event. */
.directory #cards{grid-auto-rows:auto}
.directory #cards .card-date{overflow-wrap:anywhere}
.all-event-links{columns:2;column-gap:36px;line-height:1.6;padding-left:22px}
.all-event-links li{break-inside:avoid;margin:0 0 12px}
.all-event-links a{color:#ffdda1}
@media(max-width:700px){.all-event-links{columns:1}}

.map-selected a[hidden]{display:none}

/* V10: transparent illustrated event finder sign */
.directory .finder-heading h2{display:block;position:relative;aspect-ratio:auto;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;filter:none;line-height:0;text-shadow:none}
.directory .finder-heading h2::before,.directory .finder-heading h2::after{display:none;content:none}
.directory .finder-heading .finder-ribbon-art{display:block;width:100%;height:auto;max-width:100%;object-fit:contain}

/* V13: matching banner dimensions and a shared web-and-bat tile treatment. */
:root{--banner-purple:radial-gradient(ellipse at 25% 0,#48205d,transparent 65%),linear-gradient(#210d2d,#100719);--banner-tile-height:88px;--banner-columns:4}
.topbar,.hero-banner-base.city-deck{padding:0;background:var(--banner-purple);border-top:1px solid #b96b30;border-bottom:2px solid #b96b30;box-shadow:inset 0 1px 0 #ffb65355}
.topbar .nav,.city-deck .city-banner{display:block;width:100%;max-width:none;margin:0;padding:0;background:none;border:0}
.topbar .navlinks.nav-emblem-group,.city-deck .city-scroll{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/4);gap:16px;width:94%;max-width:1500px;margin:0 auto;padding:14px 4px 18px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#9f718c #210d2d;box-sizing:border-box}
.topbar .nav-emblem,.city-deck .city-sign,.site-footer .foot-nav a{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;width:100%;height:var(--banner-tile-height);min-height:var(--banner-tile-height);padding:20px 25px;border:1px solid #b17b58;border-radius:9px;background:url('./brand/haunted-ironwork-tile.svg') center/100% 100% no-repeat,linear-gradient(145deg,#40204f,#20102c);box-shadow:0 3px 0 #120719;color:#ffe4b0;font-size:21px;transform:none;scroll-snap-align:start}
.topbar .nav-emblem::before,.site-footer .foot-nav a::before{display:none}
.city-deck .city-sign:first-child{grid-column:auto;justify-self:stretch;width:100%}
.city-deck .city-sign.active,.city-deck .city-sign[aria-pressed=true]{background:url('./brand/haunted-ironwork-tile.svg') center/100% 100% no-repeat,linear-gradient(145deg,#57305f,#291533);box-shadow:inset 0 0 0 2px #ffc17d,0 3px 0 #120719}
.city-deck .city-sign[aria-pressed=true]::after,.topbar .nav-emblem[aria-current=page]::after{top:6px;right:7px;width:17px;height:17px;font-size:11px}
.topbar .nav-emblem:hover,.topbar .nav-emblem:nth-child(even):hover,.city-deck .city-sign:hover{transform:none;filter:brightness(1.15)}
.directory .filters .chip,.directory .filters .reset,.actions a,.actions button,.primary,.btn-featured,.featured-contact,.directory-map .map-pin,.map-selected a{background-image:url('./brand/haunted-ironwork-tile.svg'),linear-gradient(#4b265e,#291337);background-size:100% 100%;background-position:center;border-radius:9px}
.directory .filters .chip.active,.directory .filters .chip[aria-pressed=true],.directory #cards .actions .btn-dir,.curated-cards .actions .btn-dir,.primary,.btn-featured,.featured-contact,.directory-map .map-pin.active,.map-selected a{background-image:url('./brand/haunted-ironwork-tile.svg'),linear-gradient(#ffc784,#eb8d3a)}
.directory .filters .chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));width:100%;align-items:stretch}
.directory .filters .chip{min-height:64px;padding:16px 20px}
@media(max-width:700px){
 :root{--banner-tile-height:88px}
 .topbar .navlinks.nav-emblem-group,.city-deck .city-scroll{width:94%;max-width:1500px;grid-template-columns:none;grid-auto-columns:calc((100% - 14px)/2);gap:14px;padding:14px 4px 18px}
 .topbar .nav-emblem,.city-deck .city-sign,.site-footer .foot-nav a{height:88px;min-height:88px;font-size:17px;padding:18px 16px}
}
.topbar .navlinks.nav-emblem-group,.city-deck .city-scroll{justify-content:start;scrollbar-gutter:stable;overflow-x:scroll}

/* V16: wrought iron scrollwork, aged bronze edges and restrained corner webs. */
.topbar .nav-emblem,.city-deck .city-sign,.site-footer .foot-nav a{border-color:#281e1c;border-radius:16px;box-shadow:0 3px 0 #09060d,0 5px 8px #0006}
.directory #cards .actions a,.directory #cards .actions button,.curated-cards .actions a,.actions a,.actions button,.directory .filters .chip,.directory .filters .reset,.directory-map .map-pin,.primary,.btn-featured,.featured-contact,.map-selected a{background-image:url('./brand/haunted-ironwork-tile.svg'),linear-gradient(#3f2749,#1c1225);background-size:100% 100%;background-position:center;background-repeat:no-repeat;border-color:#765239;border-radius:12px;box-shadow:0 3px 0 #100a13}
.directory #cards .actions .btn-dir,.curated-cards .actions .btn-dir,.directory .filters .chip.active,.directory .filters .chip[aria-pressed=true],.directory-map .map-pin.active,.primary,.btn-featured,.featured-contact,.map-selected a{background-image:url('./brand/haunted-ironwork-tile.svg'),linear-gradient(#ffc784,#eb8d3a)}

/* V17: supplied purple, skull and bat frame across clickable tiles and venues. */
.topbar .nav-emblem,.city-deck .city-sign,.city-deck .city-sign.active,.city-deck .city-sign[aria-pressed=true],.site-footer .foot-nav a,
.directory #cards .actions a,.directory #cards .actions button,.curated-cards .actions a,.actions a,.actions button,
.directory .filters .chip,.directory .filters .reset,.directory-map .map-pin,.primary,.btn-featured,.featured-contact,.map-selected a,
.directory .filters .chip.active,.directory .filters .chip[aria-pressed=true],.directory #cards .actions .btn-dir,.curated-cards .actions .btn-dir,.directory-map .map-pin.active{
 background:transparent url('./brand/purple-bat-frame.png') center/100% 100% no-repeat;border-color:transparent;box-shadow:none;border-radius:0;color:#ffe4b0;
}
.topbar .nav-emblem,.city-deck .city-sign,.site-footer .foot-nav a{padding-inline:13%}
.directory .filters .chip{padding:20px 22px;min-height:72px}
.directory #cards .actions a,.directory #cards .actions button,.actions a,.actions button{min-height:56px;padding:15px 12px}
.directory #cards .card:not(.coming-listing) .actions a,.directory #cards .card:not(.coming-listing) .actions button{min-height:56px;padding:15px 9px;font-size:12px}
.primary,.btn-featured,.featured-contact,.map-selected a{padding:20px 28px}
.directory-map .map-pin{padding:22px 18px}
.directory .filters .chip.active,.city-deck .city-sign.active,.directory-map .map-pin.active{filter:drop-shadow(0 0 4px #ffac4b)}
.directory .filters .chip.active .tile-label,.directory .filters .chip[aria-pressed=true] .tile-label,
.directory #cards .actions .btn-dir .tile-label,.curated-cards .actions .btn-dir .tile-label,.primary .tile-label,.btn-featured .tile-label,.featured-contact .tile-label,.directory-map .map-pin.active .tile-label,.map-selected a .tile-label{
 background:none;color:#ffe4b0;-webkit-text-fill-color:#ffe4b0;filter:drop-shadow(0 2px 1px #000)
}
.directory-map .map-pin.active small{color:#e9d2ee}
.directory #cards .card,.curated-cards .card,.listing-hero{position:relative;background:none;border:0;box-shadow:none;padding:32px 25px;isolation:isolate}
.directory #cards .card::before,.curated-cards .card::before,.listing-hero::before{display:block;content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;border:34px solid transparent;border-image:url('./brand/purple-bat-frame.png') 180 230 180 230 fill / 34px 28px / 0 stretch;filter:none}
.directory #cards .card .card-body,.curated-cards .card-body{background:transparent;box-shadow:none;border-radius:0;padding:8px}
.directory #cards .card.selected{box-shadow:0 0 0 2px #d7a162;border-radius:20px}
@media(max-width:700px){
 .topbar .nav-emblem,.city-deck .city-sign,.site-footer .foot-nav a{font-size:15px;padding-inline:15px}
 .directory #cards .card,.curated-cards .card,.listing-hero{padding:28px 19px}
 .directory #cards .card:not(.coming-listing) .card-body{grid-template-columns:minmax(0,1fr) 90px;column-gap:8px}
}
.directory #cards .card,.curated-cards .card,.listing-hero{padding-top:42px;padding-bottom:44px}
@media(max-width:700px){.directory #cards .card,.curated-cards .card,.listing-hero{padding-top:38px;padding-bottom:40px}}
.directory #cards .card.selected{padding:42px 25px 44px;box-shadow:none;filter:drop-shadow(0 0 3px #d7a162)}
@media(max-width:700px){.directory #cards .card.selected{padding:38px 19px 40px}}

/* V18: grouped city and neighborhood filtering. */
.city-filter-line{align-items:center}
.city-select-wrap{flex:1;min-width:0;width:100%}
.directory .filters #city-filter{display:block;width:100%;max-width:100%;min-height:52px;padding:12px 36px 12px 14px;border:2px solid #bb8754;border-radius:8px;background:#21102d;color:#ffe4b0;font:600 16px/1.4 var(--body);text-overflow:ellipsis}
.city-select-wrap p{font-size:13px;line-height:1.5;color:#d6bedf;margin:8px 0 0}
@media(max-width:700px){.city-filter-line{display:flex;flex-direction:column;align-items:stretch;gap:10px}.directory .filters #city-filter{font-size:16px}}

/* V20: explicit search submission alongside spelling-tolerant live results. */
.event-search-form{display:flex;align-items:center;gap:8px;flex:1;min-width:0;margin:0;padding-right:8px}
.event-search-form .search-wrap{min-width:0;flex:1}
.search-submit{flex:0 0 104px;min-height:60px;padding:16px 15px;border:0;background:transparent url('./brand/purple-bat-frame.png') center/100% 100% no-repeat;color:#ffe4b0;font:800 16px/1.2 var(--tile-font);text-transform:uppercase}
@media(max-width:700px){.event-search-form{padding:8px;gap:4px}.event-search-form .search-wrap{padding:0 4px;gap:4px}.search-submit{flex-basis:86px;font-size:14px}.event-search-form input{font-size:16px}}

/* V21 seasonal shopping, pumpkin outings and film screenings. */
.season-explore{padding:36px 0 12px;color:#ffe4b0;text-align:center}
.season-explore h2{font:850 clamp(25px,3vw,38px)/1.2 var(--tile-font);margin:0 0 20px}
.season-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.season-link{display:flex;align-items:center;justify-content:center;min-height:110px;padding:26px 28px;background:url('./brand/purple-bat-frame.png') center/100% 100% no-repeat;text-decoration:none;font:850 22px/1.2 var(--tile-font);text-transform:uppercase}
.season-lede{margin:24px 0 32px;max-width:65ch}
@media(max-width:700px){.season-links{grid-template-columns:1fr;gap:6px}.season-link{min-height:100px;font-size:21px}.season-explore{padding-top:26px}}

/* Expanded seasonal directories */
.season-region{margin:36px 0}.season-region>h2{margin-bottom:20px}.season-region .card h3{font-size:1.25rem;line-height:1.35;overflow-wrap:anywhere}.season-region .card-body{height:100%;display:flex;flex-direction:column}.season-region .card-body .actions{margin-top:auto}.season-region .card-body p{overflow-wrap:anywhere}

/* V24 supplied section artwork; keep natural proportions and alpha.
   ".page h1" (app.css) sets max-width:950px and margin:12px 0 22px with a
   class+type selector — one specificity notch above the plain ".art-page-
   title" class below, so it was winning and leaving the art flush left and
   uncapped at 950px instead of centered at 850px. ".page h1.art-page-title"
   matches the same element with higher specificity to make sure the centered
   version wins regardless of file order. */
.section-header-art{display:block;width:100%;height:auto;object-fit:contain;margin:0 auto}
.art-page-title,
.page h1.art-page-title{width:100%;max-width:850px;margin:0 auto 24px;padding:0;line-height:0;text-align:center}
.season-links .season-art-link{padding:0;min-height:0;background:none;border:0;box-shadow:none;transform:none}
.season-art-link::before,.season-art-link::after{display:none}
.season-art-link:focus-visible{outline:3px solid #ffca70;outline-offset:5px;border-radius:10px}
.featured-preview .featured-preview-top:has(.art-section-title),.directory-map .map-heading:has(.art-section-title){padding:10px 16px;justify-content:center;align-items:center}
.featured-preview-top .art-section-title{display:block;width:100%;max-width:510px;margin:0;padding:0;line-height:0;font-size:inherit;letter-spacing:normal;text-shadow:none;-webkit-text-stroke:0}
.featured-preview-top .art-section-title::before,.featured-preview-top .art-section-title::after{display:none}
.directory-map .map-heading .art-section-title{max-width:460px}
@media(max-width:700px){.art-page-title{margin-bottom:18px}.season-links .season-art-link{max-width:480px;width:100%;margin:auto}.featured-preview .featured-preview-top:has(.art-section-title),.directory-map .map-heading:has(.art-section-title){padding:8px 10px}}

/* V25 text-only header artwork: crop transparent canvas, preserve lettering. */
.featured-preview-top .art-section-title{aspect-ratio:4.5 / 1;overflow:hidden}
.featured-preview-top .art-section-title .section-header-art{width:100%;height:100%;object-fit:cover;object-position:center 54%}

/* V26 centered location tiles with a protected text area. */
.directory #cards .card,.directory #cards .card.selected,.curated-cards .card{padding:48px 38px;text-align:center}
.directory #cards .card .card-body,.directory #cards .card:not(.coming-listing) .card-body,.curated-cards .card .card-body{display:flex;flex-direction:column;align-items:stretch;gap:10px;width:100%;height:100%;padding:12px 10px;background:#210e2b;border-radius:12px;text-align:center}
.directory #cards .card .card-top,.curated-cards .card .card-top{display:block;margin:0;text-align:center}
.directory #cards .card .card-top>div,.curated-cards .card .card-top>div{width:100%}
.directory #cards .card h3,.curated-cards .card h3,.season-region .card h3{font-family:'Spooky Emblem',Georgia,serif;font-size:24px;font-weight:900;line-height:1.3;letter-spacing:0;margin:8px 0;text-align:center;overflow-wrap:anywhere;color:#fff0d2;text-shadow:0 2px 2px #100716}
.directory #cards .card p,.curated-cards .card p,.directory #cards .card .addr{font-size:15px;line-height:1.55;text-align:center;margin:4px 0;max-width:none;overflow-wrap:anywhere}
.directory #cards .card .hood,.curated-cards .card .hood{font-size:12px;font-weight:700;line-height:1.5;letter-spacing:.7px;text-align:center;margin:0 0 6px}
.directory #cards .card .svc,.directory #cards .card .stars,.curated-cards .card .svc{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:6px 0}
.directory #cards .card:not(.coming-listing) .card-rail{display:flex;flex-direction:column;align-items:center;align-self:stretch;width:100%;margin-top:auto;padding-top:12px;gap:12px}
.directory #cards .card:not(.coming-listing) .card-rail .thumb{width:130px;max-width:100%;margin:0 auto}
.directory #cards .card .card-rail .thumb img{height:90px;object-fit:cover}
.directory #cards .card:not(.coming-listing) .card-rail .actions,.curated-cards .card .actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;justify-content:center;margin-top:auto;padding-top:10px}
.directory #cards .card:not(.coming-listing) .actions a,.directory #cards .card:not(.coming-listing) .actions button,.curated-cards .card .actions a{display:flex;align-items:center;justify-content:center;text-align:center;min-height:70px;padding:20px 22px;font-size:13px;line-height:1.3;white-space:normal;overflow-wrap:anywhere}
.curated-cards .card .actions>a:only-child{grid-column:1/-1;justify-self:center;width:min(100%,210px)}
.directory-map .map-pin{padding:22px 28px;text-align:center;align-items:center;justify-content:center;line-height:1.4}
@media(max-width:700px){.directory #cards .card,.directory #cards .card.selected,.curated-cards .card{padding:44px 30px}.directory #cards .card .card-body,.directory #cards .card:not(.coming-listing) .card-body,.curated-cards .card .card-body{padding:12px 8px}}
@media(max-width:380px){.directory #cards .card:not(.coming-listing) .card-rail .actions{grid-template-columns:1fr}}
.directory #cards .card .hood,.curated-cards .card .hood{display:block;width:100%;text-align:center}

/* V27 six category navigation links. */
.topbar .navlinks.nav-emblem-group{grid-auto-columns:calc((100% - 80px)/6)}
.topbar .nav-emblem{font-size:18px}
.topbar .nav-emblem[aria-current="page"]{filter:drop-shadow(0 0 4px #ffc36a)}
@media(max-width:1050px){.topbar .navlinks.nav-emblem-group{grid-auto-columns:calc((100% - 32px)/3)}}
@media(max-width:700px){.topbar .navlinks.nav-emblem-group{grid-auto-columns:calc((100% - 14px)/2)}}

/* V28: first featured panel matches the Suds reference geometry. */
.featured-haunt-example .featured-preview-top:has(.art-section-title){height:74px;min-height:74px;padding:10px 22px 14px;box-sizing:border-box}
.featured-haunt-example .featured-preview-top .art-section-title{height:48px;width:240px;max-width:100%;aspect-ratio:auto}
.featured-haunt-example .featured-preview-top .section-header-art{object-fit:cover;object-position:center 54%}
.featured-haunt-example .featured-preview-body{align-items:center}
.featured-haunt-example .demo-copy .demo-label{font-size:9px;line-height:1.4;margin-bottom:10px;padding:5px 7px}
.featured-haunt-example .demo-photo img{object-fit:cover;object-position:center;background:#24112e}
.featured-haunt-example .featured-wash-scene img{width:100%;aspect-ratio:2 / 1;object-fit:contain;filter:drop-shadow(0 5px 8px #09030c66)}
.featured-haunt-example .featured-contact{min-height:46px;padding:9px 22px;font-size:16px}
@media(max-width:760px){.featured-haunt-example .featured-preview-top:has(.art-section-title){height:82px;min-height:82px;padding:12px 18px}.featured-haunt-example .featured-preview-top .art-section-title{height:54px;width:270px}}

/* V29: isolated SCV Suds showcase geometry, themed for a fictional haunt.
   Inner width W = min(1610px, .96 viewport) - 20px.
   Body usable width U = W - 44px padding - 36px gaps.
   Desktop columns = U * (1.2,1.15,1) / 3.35; scene height = middle / 2.
   Outer height = 20px frame + 74px title + 41px body padding + scene.
*/
.haunt-showcase{box-sizing:border-box;position:relative;isolation:isolate;width:min(1610px,96%);max-width:none;margin:42px auto 0;border:3px solid #ffc928;border-radius:18px;padding:7px;color:#fff2cd;background:linear-gradient(155deg,#fff0b0 0%,#ffbf28 22%,#ed6b22 52%,#ffda57 77%,#fff0b0 100%);box-shadow:0 0 0 2px #fff2ba,0 4px 0 #c66621,0 9px 0 #190d27,0 15px 28px #14052266}
/* v66: Featured-haunt ad is now a single self-contained transparent banner
   image (frame + copy all baked in), so no panel/border/background around it
   -- it sits directly on the page's brick backdrop. One in the body (replacing
   the old built-out .haunt-showcase) and one above the footer. */
.featured-haunt-banner{box-sizing:border-box;width:min(1610px,96%);max-width:none;margin:42px auto 0;background:none;border:0;padding:0}
.featured-haunt-banner .featured-haunt-link{display:block;line-height:0;border-radius:0}
.featured-haunt-banner .featured-haunt-link:hover{filter:brightness(1.06)}
/* v67: keep full width but squash height 12% (natural ~2171x724 -> ~2171x637)
   via aspect-ratio + object-fit:fill. */
.featured-haunt-banner img{display:block;width:100%;height:auto;aspect-ratio:2171/637;object-fit:fill}
.featured-haunt-bottom{margin:52px auto 56px}
.featured-haunt-mid{margin:34px auto 40px}
.back-to-top-art{display:block;width:clamp(120px,13vw,210px);margin:0 auto 60px;line-height:0}
.back-to-top-art img{display:block;width:100%;height:auto;aspect-ratio:1024/1536}
.back-to-top-art:hover{filter:brightness(1.08)}
.showcase-heading{box-sizing:border-box;display:flex;justify-content:center;align-items:center;min-height:74px;height:74px;padding:10px 175px 14px;border-top:2px solid #d598ee;border-bottom:2px solid #ffc94d;border-radius:9px 9px 0 0;background:radial-gradient(ellipse at 50% 0%,#7c39a7,transparent 65%),linear-gradient(#542275,#29113c);box-shadow:inset 0 1px 0 #ffffff55}
.showcase-heading h2{position:relative;margin:0;font-family:'Spooky Emblem',Georgia,serif;font-weight:900;font-stretch:85%;font-optical-sizing:none;font-variation-settings:'wdth' 85,'opsz' 144,'wght' 900,'GRAD' 50;font-size:clamp(30px,3vw,46px);line-height:1.02;letter-spacing:1.2px;text-align:center;text-transform:uppercase;color:#fff0c5;-webkit-text-stroke:.65px #fff9e9;paint-order:stroke fill;text-shadow:0 1px #ffc34c,0 2px #da8427,1px 3px #794095,2px 4px #210c32,3px 5px #210c32,0 7px 10px #0d031f}
.showcase-heading h2::before,.showcase-heading h2::after{content:'✦';position:absolute;top:8px;color:#fff9d6;font:26px/1 Georgia,serif;-webkit-text-stroke:0;text-shadow:0 0 12px #d79def}
.showcase-heading h2::before{left:-37px}.showcase-heading h2::after{right:-37px}
.showcase-body{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,1.15fr) minmax(290px,1fr);gap:18px;align-items:center;padding:18px 22px 23px;border-radius:0 0 9px 9px;background:linear-gradient(105deg,#512369 0%,#301440 40%,#301440 72%,#211032 100%);box-shadow:inset 0 -3px 0 #16062180}
.showcase-business{display:flex;align-items:center;gap:16px;min-width:0}
.showcase-photo{position:relative;flex:0 0 140px;width:140px;height:128px;margin:0;overflow:hidden;border:2px solid #ffdc70;border-radius:13px;background:#301440;box-shadow:0 0 0 2px #2b153f,0 4px 0 #140a23,0 0 18px #cc86ef33}
.showcase-photo img{width:100%;height:100%;object-fit:cover;object-position:67% center}
.showcase-photo figcaption{position:absolute;left:0;bottom:0;padding:3px 7px;background:#281137e8;color:white;font:700 9px/1.3 var(--body);text-transform:uppercase;letter-spacing:.6px;border-radius:0 5px 0 0}
.showcase-copy{min-width:0}.showcase-label{display:inline-block;font:700 9px/1.4 var(--body);letter-spacing:.7px;text-transform:uppercase;background:#fff0c5;color:#30103d;border-radius:4px;padding:5px 7px;margin-bottom:10px}
.showcase-copy h3{font-family:'Spooky Emblem',Georgia,serif;font-weight:900;font-variation-settings:'wdth' 85,'opsz' 100,'wght' 900,'GRAD' 30;font-size:clamp(25px,1.9vw,31px);line-height:1.13;color:#fff0cf;text-shadow:0 2px #2b0d38,1px 3px #2b0d38;margin:0;overflow-wrap:break-word}
.showcase-tagline{font-size:16px;line-height:1.5;margin:10px 0;color:#fff2cd}.showcase-services{font-size:12px;line-height:1.6;margin:0;color:#efd7f8}
.showcase-scene{display:grid;place-items:center;min-width:0}.showcase-scene img{display:block;width:100%;max-width:none;height:auto;max-height:230px;aspect-ratio:2/1;object-fit:contain;mix-blend-mode:lighten}
.showcase-pitch{border-left:1px solid #bd8ee666;padding-left:18px;min-width:0}.showcase-pitch ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}.showcase-pitch li{position:relative;padding-left:26px;font-size:16px;line-height:1.4;font-weight:700;color:#fff2cf}
.showcase-pitch li::before{content:'✦';position:absolute;left:0;top:1px;width:13px;color:#ffdf85;text-shadow:0 0 5px #df98ff;font-size:18px}.showcase-pitch li:last-child::before{top:15px}
.showcase-contact{display:inline-flex;align-items:center;justify-content:center;gap:15px;padding:9px 14px;border:2px solid #fff0c5;border-radius:8px;background:linear-gradient(#fff0a6,#ffb928 55%,#f2a120);color:#30103d;font-family:'Spooky Emblem',Georgia,serif;font-weight:900;font-variation-settings:'wdth' 85,'opsz' 60,'wght' 900,'GRAD' 30;font-size:16px;line-height:1.3;text-decoration:none;box-shadow:0 3px #c2641c,0 6px #260c31;white-space:normal}
.showcase-contact:hover{filter:brightness(1.1)}.showcase-contact:focus-visible{outline:3px solid white;outline-offset:5px}
@media(max-width:1100px){.showcase-body{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}.showcase-scene img{max-height:210px}.showcase-pitch{grid-column:1/-1;border-left:0;border-top:1px solid #bd8ee666;padding:16px 0 0}.showcase-business{flex-direction:column;align-items:flex-start;gap:12px}.showcase-photo{flex-basis:auto;width:140px;height:84px}}
@media(max-width:1000px){.showcase-heading{padding-inline:145px}.showcase-heading h2{font-size:32px;letter-spacing:.6px}.showcase-pitch li{font-size:14px}.showcase-contact{font-size:15px;gap:8px}}
@media(max-width:760px){.haunt-showcase{margin-top:34px;padding:5px}.showcase-heading{padding:12px 96px;height:82px;min-height:82px}.showcase-heading h2{font-size:29px}.showcase-heading h2::before,.showcase-heading h2::after{display:none}.showcase-body{padding:15px 18px 22px}.showcase-pitch li{font-size:16px}.showcase-contact{font-size:16px}}
@media(max-width:700px){.showcase-body{grid-template-columns:minmax(0,1fr);gap:12px}.showcase-business{flex-direction:row;align-items:center;gap:14px}.showcase-photo{width:34%;flex:0 0 34%;height:130px}.showcase-copy h3{font-size:24px}.showcase-scene{width:100%;max-width:520px;justify-self:center}.showcase-scene img{max-height:none}}
@media(max-width:400px){.showcase-heading{padding-inline:78px}.showcase-heading h2{font-size:26px}.showcase-contact{font-size:15px;padding-inline:10px}}
/* Preserve the illustration's contrast; soften only its outside edge. */
.showcase-scene img{mix-blend-mode:normal;mask-image:linear-gradient(to right,transparent,#000 2%,#000 98%,transparent)}
.showcase-heading{height:auto}
@media(max-width:760px){.showcase-heading{height:auto}}
@media(max-width:700px){.showcase-contact{width:100%}}
.showcase-body{background:linear-gradient(105deg,#512369 0%,#32113b 34%,#32113b 74%,#211032 100%)}
.showcase-scene img{mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 3%,#000 97%,transparent);mask-composite:intersect}

/* V30: all eight discovery links in the top navigation. */
.topbar .navlinks.nav-emblem-group{grid-auto-columns:calc((100% - 112px)/8)}
.topbar .nav-emblem{font-size:16px;line-height:1.2}
@media(max-width:1250px){.topbar .navlinks.nav-emblem-group{grid-auto-columns:calc((100% - 48px)/4)}}
@media(max-width:700px){.topbar .navlinks.nav-emblem-group{grid-auto-columns:calc((100% - 14px)/2)}}

/* V31: one framed finder panel containing its title and all controls. */
.directory .filters .finder-filter-header{padding:22px 24px 18px;background:radial-gradient(ellipse at top,#42204f,#21102d);border-radius:10px 10px 0 0}
.directory .filters .finder-heading{display:block;width:min(640px,100%);max-width:100%;margin:0 auto 10px;padding:0}
.directory .filters .finder-heading::before,.directory .filters .finder-heading::after{display:none;content:none}
.directory .filters .finder-heading h2{width:100%;margin:0;padding:0}
.directory .filters .directory-intro{max-width:950px;margin:0 auto;text-align:center;font-size:14px;line-height:1.5;padding:0;color:#fff0d2}
.directory .filters .search-row{border-radius:0}
@media(max-width:700px){.directory .filters .finder-filter-header{padding:20px 18px 14px}.directory .filters .directory-intro{font-size:13px}}

/* V32: accessible text, source facts and crawlable regional navigation. */
.skip-link{position:fixed;top:8px;left:8px;z-index:10000;transform:translateY(-160%);padding:12px 18px;background:#fff0c5;color:#21102d;font-weight:700;border:2px solid #ffb42c}
.skip-link:focus{transform:translateY(0)}
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #ffdd8d;outline-offset:4px}
.listing-breadcrumbs{font-size:14px;line-height:1.6;margin:0 0 20px;overflow-wrap:anywhere}.listing-breadcrumbs span{margin:0 4px}
.listing-facts,.related-listings{width:94%;max-width:1200px;margin:28px auto;padding:22px;border:1px solid #bd8a54;border-radius:12px;background:#21102d;color:#fff0d2}
.listing-facts h2,.related-listings h2{margin:0 0 18px}.listing-facts dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.listing-facts dl>div{border-bottom:1px solid #bd8a5444;padding-bottom:10px;min-width:0}.listing-facts dt{font-weight:700;color:#ffd6a2}.listing-facts dd{margin:5px 0 0;overflow-wrap:anywhere;line-height:1.5}.listing-facts p{margin-top:16px;font-size:14px}.related-listings ul{padding-left:22px;line-height:1.8}.region-directory{padding-block:28px}.region-directory p{line-height:2}
.topbar .navlinks.nav-emblem-group{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(8,minmax(0,1fr));overflow:visible;scrollbar-gutter:auto}
.city-deck .city-scroll{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(4,minmax(0,1fr));overflow:visible;scrollbar-gutter:auto}
.topbar,.city-deck,.city-banner{height:auto;max-height:none}
@media(max-width:1250px){.topbar .navlinks.nav-emblem-group{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:700px){.listing-facts dl{grid-template-columns:1fr}.topbar .navlinks.nav-emblem-group,.city-deck .city-scroll{grid-template-columns:repeat(2,minmax(0,1fr))}.listing-facts,.related-listings{padding:18px}}
/* Keep the keyboard shortcut offscreen until focused, even during scrolling. */
.skip-link{left:-10000px;transform:none}
.skip-link:focus{left:8px;transform:none}
@media(max-width:700px){.directory .filters .chip{font-size:16px;line-height:1.15;padding-inline:14px}.directory .filters .chip .tile-label{white-space:normal;overflow-wrap:anywhere}.sort-wrap select{font-size:14px;max-width:200px}.directory .filters .sort-wrap{min-width:0}}
@media(max-width:360px){.directory .filters .chip{font-size:14px}}
.directory .filters .sort-wrap select{width:190px;max-width:100%}

/* V33: uniform compact event rectangles measured against SCV Suds v25. */
.curated-cards{width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.season-region,.region-directory{min-width:0}
body .directory #cards .card.event-card,body .directory #cards .card.event-card.selected,body .curated-cards .card.event-card{height:350px;min-height:350px;padding:24px 22px;text-align:center;display:block}
body .event-card::before{border-image-width:26px 22px}
body .directory #cards .card.event-card .card-body,body .directory #cards .card.event-card:not(.coming-listing) .card-body,body .curated-cards .card.event-card .card-body{display:grid;grid-template-columns:minmax(0,1fr) 130px;grid-template-rows:auto auto auto 1fr;column-gap:16px;row-gap:5px;align-items:start;align-content:start;height:100%;padding:0;background:#210e2b;border-radius:8px}
body .event-card .grad-bar{display:none}
body .directory #cards .card.event-card .card-top,body .curated-cards .card.event-card .card-top{display:block;grid-column:1;grid-row:1;margin:0;min-width:0}
body .directory #cards .card.event-card h3,body .curated-cards .card.event-card h3{font-size:24px;line-height:1.18;margin:3px 0 6px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
body .directory #cards .card.event-card p,body .curated-cards .card.event-card p,body .directory #cards .card.event-card .addr,body .curated-cards .card.event-card .addr{font-size:14px;line-height:1.4;margin:3px 0}
body .directory #cards .card.event-card .hood,body .curated-cards .card.event-card .hood{margin:0;font-size:11px;line-height:1.4}
body .event-card .card-date,body .event-card .card-category,body .event-card .addr{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
body .directory #cards .card.event-card .card-desc,body .curated-cards .card.event-card .card-desc{grid-column:1;grid-row:2;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin:2px 0;font-size:13px;line-height:1.4}
body .event-card .addr{grid-column:1;grid-row:3}
body .directory #cards .card.event-card .svc,body .curated-cards .card.event-card .svc{grid-column:1;grid-row:4;display:flex;flex-wrap:nowrap;justify-content:center;gap:4px;margin:3px 0 0;max-height:29px;overflow:hidden;min-width:0}
body .event-card .svc span{font-size:11px;padding:3px 5px;white-space:nowrap}
body .directory #cards .card.event-card:not(.coming-listing) .card-rail,body .curated-cards .card.event-card .card-rail{grid-column:2;grid-row:1/-1;display:flex;flex-direction:column;align-items:stretch;align-self:start;gap:8px;width:130px;margin:0;padding:0;min-width:0}
body .directory #cards .card.event-card:not(.coming-listing) .card-rail .thumb,body .curated-cards .card.event-card .card-rail .thumb{display:block;width:100%;margin:0;height:92px;flex:none;border-radius:9px;overflow:hidden;border:2px solid #e5b56a}
body .event-card .card-rail .thumb img{width:100%;height:100%!important;object-fit:cover;display:block}
body .directory #cards .card.event-card:not(.coming-listing) .card-rail .actions,body .curated-cards .card.event-card .card-rail .actions{display:flex;flex-direction:column;align-items:stretch;gap:6px;padding:0;margin:0;width:100%}
body .directory #cards .card.event-card:not(.coming-listing) .actions a,body .directory #cards .card.event-card:not(.coming-listing) .actions button,body .curated-cards .card.event-card .actions a{width:100%;min-height:44px;height:44px;padding:9px 13px;font-size:11px;line-height:1.15;letter-spacing:0}
@media(min-width:701px) and (max-width:1100px){body .directory #cards .card.event-card,body .directory #cards .card.event-card.selected,body .curated-cards .card.event-card{height:440px;min-height:440px}body .directory #cards .card.event-card h3,body .curated-cards .card.event-card h3{font-size:21px}}
@media(max-width:700px){.curated-cards{grid-template-columns:1fr;gap:23px}body .directory #cards .card.event-card,body .directory #cards .card.event-card.selected,body .curated-cards .card.event-card{height:468px;min-height:468px;padding:26px 20px}body .directory #cards .card.event-card .card-body,body .directory #cards .card.event-card:not(.coming-listing) .card-body,body .curated-cards .card.event-card .card-body{grid-template-columns:minmax(0,1fr) 90px;column-gap:10px}body .directory #cards .card.event-card:not(.coming-listing) .card-rail,body .curated-cards .card.event-card .card-rail{width:90px}body .directory #cards .card.event-card:not(.coming-listing) .card-rail .thumb,body .curated-cards .card.event-card .card-rail .thumb{height:65px}body .directory #cards .card.event-card h3,body .curated-cards .card.event-card h3{font-size:20px;-webkit-line-clamp:4}body .directory #cards .card.event-card:not(.coming-listing) .actions a,body .directory #cards .card.event-card:not(.coming-listing) .actions button,body .curated-cards .card.event-card .actions a{height:54px;min-height:54px;font-size:10px;padding:10px 9px}body .directory #cards .card.event-card .svc,body .curated-cards .card.event-card .svc{flex-wrap:wrap;max-height:56px}}
.page .wrap:has(.curated-cards){width:min(1610px,96%)}
/* Keep complete event names readable; shorten only the summary copy. */
body .directory #cards .card.event-card h3,body .curated-cards .card.event-card h3{display:block;overflow:visible;-webkit-line-clamp:unset}
@media(max-width:1100px){body .directory #cards .card.event-card h3,body .curated-cards .card.event-card h3{font-size:18px;line-height:1.2}}
@media(min-width:701px) and (max-width:1100px){.curated-cards{gap:22px}body .directory #cards .card.event-card .card-body,body .directory #cards .card.event-card:not(.coming-listing) .card-body,body .curated-cards .card.event-card .card-body{grid-template-columns:minmax(0,1fr) 100px;column-gap:12px}body .directory #cards .card.event-card:not(.coming-listing) .card-rail,body .curated-cards .card.event-card .card-rail{width:100px}}

/* V34: a fitted outer frame and plain, readable card action buttons. */
body .directory #cards .card.event-card::before,
body .curated-cards .card.event-card::before{
 inset:0;z-index:2;border:24px solid transparent;
 border-image:url('./brand/purple-bat-frame.png') 180 230 180 230 / 24px 20px / 0 stretch;
 pointer-events:none;filter:none;
}
body .directory #cards .card.event-card::after,
body .curated-cards .card.event-card::after{
 content:'';position:absolute;inset:12px;z-index:-1;width:auto;height:auto;
 border:0;border-radius:16px;background:#210e2b;box-shadow:none;pointer-events:none;
}
body .directory #cards .card.event-card .card-body,
body .directory #cards .card.event-card:not(.coming-listing) .card-body,
body .curated-cards .card.event-card .card-body{background:transparent}
body .directory #cards .card.event-card:not(.coming-listing) .actions a,
body .directory #cards .card.event-card:not(.coming-listing) .actions button,
body .curated-cards .card.event-card .actions a{
 background:#432253;border:1px solid #b78cbb;border-radius:6px;
 box-shadow:0 2px 0 #100818;color:#fff4df;
 font-family:var(--body);font-size:13px;font-weight:700;font-stretch:normal;
 font-variation-settings:normal;text-transform:none;text-shadow:none;
 padding:7px 8px;line-height:1.2;letter-spacing:0;
}
body .event-card .actions .tile-label{
 background:none;color:inherit;-webkit-text-fill-color:currentColor;
 filter:none;text-shadow:none;white-space:normal;overflow-wrap:normal;
}
body .directory #cards .card.event-card:not(.coming-listing) .actions .btn-dir,
body .curated-cards .card.event-card .actions .btn-dir{background:#f6d393;border-color:#ffe8bc;color:#281332}
body .event-card .actions a:hover,body .event-card .actions button:hover{filter:brightness(1.15)}
body .event-card .actions a:focus-visible,body .event-card .actions button:focus-visible{outline:3px solid #ffdd8d;outline-offset:3px}
@media(max-width:700px){
 body .directory #cards .card.event-card:not(.coming-listing) .actions a,
 body .directory #cards .card.event-card:not(.coming-listing) .actions button,
 body .curated-cards .card.event-card .actions a{font-size:12px;padding:7px 5px}
}
body .directory #cards .card.event-card .actions .tile-label,
body .curated-cards .card.event-card .actions .tile-label{background:none;color:inherit;-webkit-text-fill-color:currentColor;filter:none;text-shadow:none}

/* V35: denser three-column directories with content-sized rows. */
body .directory #cards,body .curated-cards{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:auto;gap:18px;align-items:stretch}
body .directory #cards .card.event-card,body .directory #cards .card.event-card.selected,body .curated-cards .card.event-card{height:auto;min-height:0;padding:24px 22px}
body .directory #cards .card.event-card .card-body,
body .directory #cards .card.event-card:not(.coming-listing) .card-body,
body .curated-cards .card.event-card .card-body{grid-template-columns:minmax(0,1fr) 100px;grid-template-rows:auto auto auto 1fr;column-gap:12px;row-gap:4px;height:100%;min-height:0}
body .directory #cards .card.event-card h3,body .curated-cards .card.event-card h3{font-size:20px;line-height:1.18;margin:3px 0 5px}
body .directory #cards .card.event-card p,body .curated-cards .card.event-card p,body .directory #cards .card.event-card .addr,body .curated-cards .card.event-card .addr{font-size:13px;line-height:1.4;margin:2px 0}
body .directory #cards .card.event-card:not(.coming-listing) .card-rail,body .curated-cards .card.event-card .card-rail{width:100px;gap:8px}
body .directory #cards .card.event-card:not(.coming-listing) .card-rail .thumb,body .curated-cards .card.event-card .card-rail .thumb{height:72px}
body .directory #cards .card.event-card:not(.coming-listing) .actions a,
body .directory #cards .card.event-card:not(.coming-listing) .actions button,
body .curated-cards .card.event-card .actions a{height:44px;min-height:44px;font-size:12px;padding:6px 5px}
@media(max-width:1100px){body .directory #cards,body .curated-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){body .directory #cards,body .curated-cards{grid-template-columns:minmax(0,1fr);gap:16px}body .directory #cards .card.event-card h3,body .curated-cards .card.event-card h3{font-size:18px}body .directory #cards .card.event-card .card-body,body .directory #cards .card.event-card:not(.coming-listing) .card-body,body .curated-cards .card.event-card .card-body{grid-template-columns:minmax(0,1fr) 90px;column-gap:10px}body .directory #cards .card.event-card:not(.coming-listing) .card-rail,body .curated-cards .card.event-card .card-rail{width:90px}}
body .directory #cards .card.event-card .svc,body .curated-cards .card.event-card .svc{flex-wrap:wrap;max-height:none;overflow:visible;align-content:start}
body .event-card .svc span{max-width:100%;white-space:normal;overflow-wrap:anywhere;text-align:center}

/* V36: compact finder controls inside the existing spooky outer frame. */
body .directory .filters .finder-filter-header{padding:16px 24px 12px}
body .directory .filters .finder-heading{width:min(460px,100%);margin:0 auto 4px}
body .directory .filters .directory-intro{font-size:13px;line-height:1.45;max-width:960px}
body .directory .filters .search-row{padding:12px 24px;gap:12px}
body .directory .filters .filter-body{padding:0 24px 18px}
body .directory .filters .filter-line{grid-template-columns:110px minmax(0,1fr);gap:12px;padding:10px 0;margin:0;align-items:start}
body .directory .filters .filter-label{min-width:0;margin:0;font-size:16px;line-height:1.3;padding-top:10px}
body .directory .filters .chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:7px;width:100%}
body .directory .filters .chip,body .directory .filters .reset,body .directory .filters .search-submit{
 position:relative;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:5px;
 min-height:44px;height:auto;width:auto;padding:8px 10px;
 background:#432253;border:1px solid #b78cbb;border-radius:6px;box-shadow:0 2px 0 #100818;
 color:#fff4df;font-family:var(--body);font-size:13px;font-weight:700;font-stretch:normal;
 font-variation-settings:normal;line-height:1.2;letter-spacing:0;text-transform:none;text-shadow:none;filter:none;
}
body .directory .filters .chip.active,body .directory .filters .chip[aria-pressed=true],body .directory .filters .search-submit{background:#f6d393;border-color:#ffe8bc;color:#281332;filter:none}
body .directory .filters .chip::before,body .directory .filters .chip::after,body .directory .filters .reset::before,body .directory .filters .reset::after{content:none}
body .directory .filters .chip[aria-pressed=true]::before{content:'✓';position:static;display:inline;width:auto;height:auto;margin:0;padding:0;border:0;border-radius:0;background:none;color:inherit;box-shadow:none;font:700 13px/1 var(--body);transform:none}
body .directory .filters .chip .tile-label,body .directory .filters .chip.active .tile-label,body .directory .filters .chip[aria-pressed=true] .tile-label,body .directory .filters .reset .tile-label,body .directory .filters .search-submit .tile-label{background:none;color:inherit;-webkit-text-fill-color:currentColor;filter:none;text-shadow:none;white-space:normal;overflow-wrap:normal}
body .directory .filters .chip:hover,body .directory .filters .reset:hover,body .directory .filters .search-submit:hover{filter:brightness(1.12)}
body .directory .filters .finder-tools{gap:10px}
body .directory .filters .search-submit{flex:0 0 84px}
body .directory .filters .sort-wrap select{height:44px;padding:7px 20px 7px 8px}
@media(max-width:900px){body .directory .filters .search-row{flex-wrap:wrap}body .directory .filters .finder-tools{width:100%;justify-content:space-between;flex-wrap:wrap}}
@media(max-width:700px){body .directory .filters .finder-filter-header{padding:18px 20px 10px}body .directory .filters .search-row{padding:10px 20px}body .directory .filters .filter-body{padding:0 20px 20px}body .directory .filters .filter-line{grid-template-columns:minmax(0,1fr);gap:7px;padding:9px 0}body .directory .filters .filter-label{padding:0;font-size:15px}body .directory .filters .chips{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}body .directory .filters .chip{font-size:12px;padding:7px 6px}body .directory .filters .finder-tools .sort-wrap{flex-direction:row;align-items:center}body .directory .filters .sort-wrap select{width:170px}body .directory .filters .finder-tools .reset{font-size:12px}}
body .directory .filters .chip.active,body .directory .filters .chip[aria-pressed=true]{border-radius:6px}
body .directory .filters .chip[aria-pressed=true]::after{content:none}
@media(max-width:700px){body .directory .filters .finder-tools .sort-wrap{font-family:var(--body);font-size:12px;gap:6px}body .directory .filters .sort-wrap select{width:150px;font-size:12px}}

/* V37: use the hero-button lettering throughout every button and button-like link. */
button,input[type=button],input[type=submit],input[type=reset],[role=button],
.nav-emblem,.city-sign,.actions a,.primary,.btn-featured,.featured-contact,.showcase-contact,
.directory-map .map-pin,.map-selected a,.site-footer .foot-nav a{
 font-family:var(--tile-font)!important;
 font-weight:850!important;font-stretch:90%!important;
 font-optical-sizing:none!important;
 font-variation-settings:'wdth' 90,'opsz' 48,'wght' 850,'GRAD' 50!important;
}

/* V38: one hero-style text treatment for every button label. */
button,[role=button],.nav-emblem,.city-sign,.actions a,.primary,.btn-featured,.featured-contact,.showcase-contact,.directory-map .map-pin,.map-selected a,.site-footer .foot-nav a{
 text-transform:uppercase!important;letter-spacing:.35px!important;line-height:1.25!important;
 color:#ffe4b0!important;text-shadow:none!important;
}
button .tile-label,[role=button] .tile-label,.nav-emblem .tile-label,.city-sign .tile-label,.actions .tile-label,.primary .tile-label,.btn-featured .tile-label,.featured-contact .tile-label,.showcase-contact .tile-label,.directory-map .map-pin .tile-label,.map-selected a .tile-label,.site-footer .foot-nav .tile-label{
 font-family:var(--tile-font)!important;font-weight:850!important;font-stretch:90%!important;font-variation-settings:'wdth' 90,'opsz' 48,'wght' 850,'GRAD' 50!important;
 color:#ffe4b0!important;-webkit-text-fill-color:#ffe4b0!important;background:none!important;
 text-transform:uppercase!important;letter-spacing:.35px!important;text-shadow:none!important;
 filter:drop-shadow(0 -1px 0 #fff3d144) drop-shadow(0 1px 0 #573820) drop-shadow(0 2px 0 #100713) drop-shadow(0 3px 2px #0009)!important;
}
@supports(background-clip:text){
 button .tile-label,[role=button] .tile-label,.nav-emblem .tile-label,.city-sign .tile-label,.actions .tile-label,.primary .tile-label,.btn-featured .tile-label,.featured-contact .tile-label,.showcase-contact .tile-label,.directory-map .map-pin .tile-label,.map-selected a .tile-label,.site-footer .foot-nav .tile-label{
 background-image:url('./brand/letter-weathering.svg'),linear-gradient(#fff3d9 12%,#ffe0a7 48%,#e5b974 100%)!important;background-size:120px 60px,100% 100%!important;background-clip:text!important;-webkit-background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important;
 }
}
/* Dark faces keep cream lettering readable while gold edges signal primary/selected actions. */
body .directory #cards .card.event-card:not(.coming-listing) .actions .btn-dir,body .curated-cards .card.event-card .actions .btn-dir,
body .directory .filters .chip.active,body .directory .filters .chip[aria-pressed=true],body .directory .filters .search-submit,.showcase-contact{background:#432253;border-color:#f6d393}

/* V39: full-width event copy, with links below and no thumbnail boxes. */
body .directory #cards .card.event-card .card-body,
body .directory #cards .card.event-card:not(.coming-listing) .card-body,
body .curated-cards .card.event-card .card-body{display:flex;flex-direction:column;align-items:stretch;gap:6px;grid-template-columns:none;height:100%}
body .directory #cards .card.event-card:not(.coming-listing) .card-rail,
body .curated-cards .card.event-card .card-rail{width:100%;margin-top:auto;padding-top:8px;display:block;align-self:stretch}
body .directory #cards .card.event-card:not(.coming-listing) .card-rail .actions,
body .curated-cards .card.event-card .card-rail .actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;width:100%}
body .event-card .card-rail .actions>a:last-child:nth-child(odd){grid-column:1/-1}
body .directory #cards .card.event-card .card-desc,
body .curated-cards .card.event-card .card-desc{-webkit-line-clamp:3}

/* V40: compact, single-row event actions. */
body .directory #cards .card.event-card:not(.coming-listing) .card-rail .actions,
body .curated-cards .card.event-card .card-rail .actions{display:flex;flex-direction:row;flex-wrap:nowrap;gap:5px;align-items:stretch;justify-content:center}
body .directory #cards .card.event-card:not(.coming-listing) .actions a,
body .directory #cards .card.event-card:not(.coming-listing) .actions button,
body .curated-cards .card.event-card .actions a{flex:1 1 0;min-width:0;width:auto;height:38px;min-height:38px;padding:5px 4px;font-size:11px;line-height:1.15!important}
body .event-card .actions .tile-label{letter-spacing:0!important;line-height:1.15;overflow-wrap:normal}
body .directory #cards .card.event-card:not(.coming-listing) .card-rail,
body .curated-cards .card.event-card .card-rail{padding-top:5px}
@media(max-width:700px){body .directory #cards .card.event-card:not(.coming-listing) .actions a,body .directory #cards .card.event-card:not(.coming-listing) .actions button,body .curated-cards .card.event-card .actions a{font-size:10px;height:44px;min-height:44px;padding:4px 2px}body .directory #cards .card.event-card:not(.coming-listing) .card-rail .actions,body .curated-cards .card.event-card .card-rail .actions{gap:4px}}
@media(max-width:360px){body .directory #cards .card.event-card:not(.coming-listing) .actions a,body .directory #cards .card.event-card:not(.coming-listing) .actions button,body .curated-cards .card.event-card .actions a{font-size:9px;padding-inline:1px}}

/* V41: prominent event titles without the repeated green region heading. */
body .directory #cards .card.event-card h3,body .curated-cards .card.event-card h3{font-size:26px;line-height:1.16;margin:2px 0 9px;text-wrap:balance;overflow-wrap:break-word}
@media(max-width:1100px){body .directory #cards .card.event-card h3,body .curated-cards .card.event-card h3{font-size:24px}}
@media(max-width:700px){body .directory #cards .card.event-card h3,body .curated-cards .card.event-card h3{font-size:22px}}

/* V42: the finder and map form one compact workspace above the event grid. */
#directory .finder-map-row{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:18px;align-items:stretch;margin-bottom:22px}
#directory .finder-map-row>.filters{margin:0;min-width:0}
#directory .finder-map-row .finder-filter-header{padding:14px 20px 8px}
#directory .finder-map-row .finder-heading{width:min(290px,100%);margin:0 auto 2px}
#directory .finder-map-row .directory-intro{font-size:12px;line-height:1.4}
#directory .finder-map-row .search-row{padding:8px 20px;display:flex;flex-wrap:wrap;gap:8px}
#directory .finder-map-row #event-search-form{width:100%;flex:1 1 100%}
#directory .finder-map-row .finder-tools{width:100%;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
#directory .finder-map-row .sort-wrap{font-size:12px;font-family:var(--body);flex-direction:row;align-items:center}
#directory .finder-map-row .filter-body{padding:0 20px 18px}
#directory .finder-map-row .filter-line{grid-template-columns:minmax(0,1fr);gap:5px;padding:7px 0}
#directory .finder-map-row .filter-label{padding:0;font-size:14px}
#directory .finder-map-row .chips{grid-template-columns:repeat(auto-fit,minmax(105px,1fr));gap:5px}
#directory .finder-map-row .chip{font-size:11px;min-height:40px;padding:6px 4px}
#directory .finder-map-row #city-filter{min-height:40px;padding:7px 10px;font-size:13px}
#directory .finder-map-row .city-filter-help{font-size:11px;margin:4px 0 0}
#directory .finder-map-row #spooky-map{position:relative;top:auto;grid-column:auto;grid-row:auto;align-self:stretch;min-width:0;width:100%;height:auto;max-height:none;margin:0;padding:18px;border:1px solid #b9814c;background:#21102d;isolation:isolate;border-radius:12px}
#directory .finder-map-row #spooky-map::before{content:'';position:absolute;inset:-3px;z-index:2;pointer-events:none;border:23px solid transparent;border-image:url('./brand/spooky-frame.webp') 250 180 160 180 / 23px / 0 stretch}
#directory .finder-map-row .map-enamel{height:100%;display:flex;flex-direction:column;padding:0;overflow:hidden;box-shadow:none;background:#21102d}
#directory .finder-map-row .map-heading{margin:0;padding:0 10px;min-height:64px;flex:0 0 64px}
#directory .finder-map-row .map-heading .art-section-title{width:100%;max-width:360px}
#directory .finder-map-row .map-stage{display:flex;flex-direction:column;flex:1;min-height:360px}
#directory .finder-map-row #dir-map{display:block;position:static;width:100%;height:100%;min-height:280px;flex:1;border:0;aspect-ratio:auto}
#directory .finder-map-row #dir-map[hidden]{display:none}
#directory .finder-map-row .map-selected{position:static;display:flex;flex-wrap:wrap;gap:6px;padding:10px;flex:0 0 auto}
#directory .finder-map-row .map-selected strong{font-size:14px;min-width:0;flex:1 1 100%}
#directory .finder-map-row .map-selected a{width:100%;min-height:40px;padding:7px 10px;background:#432253;border:1px solid #b78cbb;border-radius:6px;font-size:12px}
#directory .finder-map-row .map-selected a[hidden]{display:none}
#directory>.split{display:block}
@media(max-width:1000px){#directory .finder-map-row{grid-template-columns:minmax(0,1fr)}#directory .finder-map-row .map-stage{min-height:380px}#directory .finder-map-row #dir-map{height:300px;min-height:300px;flex:none}}
@media(max-width:700px){#directory .finder-map-row .chips{grid-template-columns:repeat(2,minmax(0,1fr))}#directory .finder-map-row .chip{min-height:44px}#directory .finder-map-row .finder-heading{width:min(240px,100%)}}

/* V43: one shared frame, with a half-height map and full-width lower filters. */
#directory .finder-map-row{position:relative;isolation:isolate;padding:20px 24px;gap:10px 20px;background:#21102d;border-radius:12px;border:1px solid #b9814c;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}
#directory .finder-map-row::before{content:'';position:absolute;inset:-3px;z-index:2;pointer-events:none;border:23px solid transparent;border-image:url('./brand/spooky-frame.webp') 250 180 160 180 / 23px / 0 stretch}
#directory .finder-map-row>.filters,#directory .finder-map-row .filter-body{display:contents}
#directory .finder-map-row>.filters::before,#directory .finder-map-row>.filters::after,#directory .finder-map-row #spooky-map::before,#directory .finder-map-row #spooky-map::after{display:none;content:none}
#directory .finder-map-row .finder-filter-header{grid-column:1/-1;grid-row:1;padding:0 0 8px;background:none;border-radius:0}
#directory .finder-map-row .search-row{grid-column:1;grid-row:2;padding:0;background:none;box-shadow:none;border:0}
#directory .finder-map-row .filter-line{padding:6px 0;border:0;background:none}
#directory .finder-map-row .filter-line:has([data-region-filter]){grid-column:1;grid-row:3}
#directory .finder-map-row .filter-line:has(#city-filter){grid-column:1;grid-row:4}
#directory .finder-map-row .filter-line:has([data-category]){grid-column:1/-1;grid-row:5;border-top:1px solid #b78cbb44}
#directory .finder-map-row .filter-line:has([data-audience]){grid-column:1/-1;grid-row:6;border-top:1px solid #b78cbb44}
#directory .finder-map-row #spooky-map{grid-column:2;grid-row:2/5;align-self:start;border:0;border-radius:0;padding:0;background:none;box-shadow:none}
#directory .finder-map-row .map-enamel{height:auto;background:none;border-radius:8px}
#directory .finder-map-row .map-stage{min-height:0;flex:none}
#directory .finder-map-row #dir-map{height:283px;min-height:283px;max-height:283px;flex:none}
#directory .finder-map-row .map-selected{padding:8px;gap:5px}
#directory .finder-map-row .map-selected a{min-height:36px}
@media(max-width:1000px){#directory .finder-map-row{grid-template-columns:minmax(0,1fr);padding:20px;gap:8px}#directory .finder-map-row .search-row,#directory .finder-map-row .filter-line{grid-column:1}#directory .finder-map-row #spooky-map{grid-column:1;grid-row:7}#directory .finder-map-row #dir-map{height:150px;min-height:150px;max-height:150px}}

/* V44: replacement headings and map below every filter in the shared frame. */
#directory .finder-map-row{grid-template-columns:minmax(0,1fr);gap:8px}
#directory .finder-map-row .search-row,#directory .finder-map-row .filter-line{grid-column:1}
#directory .finder-map-row #spooky-map{grid-column:1;grid-row:7;width:100%;margin-top:6px}
#directory .finder-map-row .finder-filter-header{padding:0 0 6px}
#directory .finder-map-row .finder-heading{width:min(480px,100%);margin:0 auto}
#directory .finder-map-row .finder-heading h2{height:100px;display:flex;align-items:center;justify-content:center;overflow:hidden}
#directory .finder-map-row .finder-ribbon-art{display:block;width:100%;height:auto;max-height:none;flex:none}
#directory .finder-map-row .map-stage{border:1px solid #b9814c}
#directory .finder-map-row .map-empty-state{padding:18px;text-align:center;font-size:14px;color:#fff0d2}
#directory .finder-map-row .map-empty-state[hidden]{display:none}
.showcase-heading .replacement-featured-title{display:flex;align-items:center;justify-content:center;overflow:hidden;width:min(460px,100%);height:90px;margin:0 auto}
.showcase-heading .replacement-featured-title::before,.showcase-heading .replacement-featured-title::after{content:none;display:none}
.replacement-featured-art{width:100%;height:auto;max-height:none;display:block;flex:none}
.showcase-heading:has(.replacement-featured-title){padding-top:0;padding-bottom:0;height:auto;min-height:90px}
@media(max-width:700px){#directory .finder-map-row .finder-heading h2{height:72px}.showcase-heading:has(.replacement-featured-title){padding:0 34px;min-height:72px}.showcase-heading .replacement-featured-title{height:72px}}
.showcase-heading .replacement-featured-title{width:min(400px,100%)}

/* V45: orderly filter rows with content-sized, raised enamel buttons. */
#directory .finder-map-row .search-row{display:flex;flex-wrap:nowrap;align-items:center;gap:12px;padding:0 0 14px;border-bottom:1px solid #e2bcdf33}
#directory .finder-map-row #event-search-form{width:auto;flex:1 1 0;min-width:0}
#directory .finder-map-row .finder-tools{width:auto;flex:0 0 auto;flex-wrap:nowrap;gap:10px}
#directory .finder-map-row .filter-line{display:grid;grid-template-columns:115px minmax(0,1fr);align-items:center;gap:14px;padding:14px 0;border-top:1px solid #e2bcdf33}
#directory .finder-map-row .filter-label{font-size:14px;line-height:1.3;text-align:left;padding:0;margin:0}
#directory .finder-map-row .chips{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:10px 9px;min-width:0;width:auto}
#directory .finder-map-row .chip{flex:0 0 auto;width:auto;max-width:100%;min-width:0;min-height:40px;height:auto;padding:7px 10px;border:2px solid #f5bd57;border-radius:8px;background:linear-gradient(180deg,#703a86 0%,#4d2361 45%,#32143f 100%);box-shadow:inset 0 1px 0 #fff0c9cc,inset 0 0 0 2px #a76bbe66,0 3px 0 #9f571e,0 6px 0 #10051a,0 8px 9px #0005;font-size:14px;white-space:nowrap;text-wrap:nowrap;transform:none}
#directory .finder-map-row .chip .tile-label{white-space:nowrap;text-wrap:nowrap;overflow-wrap:normal}
#directory .finder-map-row .chip:hover{background:linear-gradient(#824d99,#502465);filter:brightness(1.08);transform:translateY(-1px)}
#directory .finder-map-row .chip:active{transform:translateY(2px);box-shadow:inset 0 1px 0 #fff0c966,0 1px 0 #9f571e,0 3px 0 #10051a}
#directory .finder-map-row .chip[aria-pressed=true]{background:linear-gradient(#8a4b84,#592456);border-color:#ffe8ab;box-shadow:inset 0 1px 0 #fff3cc,inset 0 0 0 2px #e8c17480,0 3px 0 #bb7028,0 6px 0 #10051a,0 0 9px #edb94e44}
#directory .finder-map-row .chip:focus-visible{outline:3px solid #fff1bf;outline-offset:5px}
#directory .finder-map-row .city-filter-control{min-width:0}
#directory .finder-map-row #city-filter{width:min(100%,520px);display:block;min-height:44px}
#directory .finder-map-row .search-submit,#directory .finder-map-row .reset{border:2px solid #f5bd57;border-radius:8px;background:linear-gradient(#703a86,#32143f);box-shadow:inset 0 1px 0 #fff0c999,0 3px 0 #9f571e,0 5px 0 #10051a}
@media(max-width:1100px){#directory .finder-map-row .search-row{flex-wrap:wrap}#directory .finder-map-row #event-search-form{flex-basis:100%;width:100%}#directory .finder-map-row .finder-tools{width:100%;justify-content:space-between}#directory .finder-map-row .filter-line{grid-template-columns:95px minmax(0,1fr)}}
@media(max-width:700px){#directory .finder-map-row .filter-line{grid-template-columns:minmax(0,1fr);gap:10px;padding:13px 0}#directory .finder-map-row .chips{gap:10px 8px}#directory .finder-map-row .chip{font-size:12px;min-height:44px;padding:7px 8px}#directory .finder-map-row .finder-tools{flex-wrap:wrap}#directory .finder-map-row .filter-label{font-size:14px}}

/* V46: city selection alongside search, with a compact responsive toolbar. */
#directory .finder-map-row .search-row{display:grid;grid-template-columns:minmax(240px,1fr) minmax(230px,280px) auto;align-items:center}
#directory .finder-map-row #event-search-form{width:100%;min-width:0}
#directory .finder-map-row .search-city{min-width:0}
#directory .finder-map-row .search-city #city-filter{width:100%;height:46px;min-height:46px;margin:0;background:#fff5df;color:#291334;border:2px solid #edb656;border-radius:8px;padding:8px 28px 8px 12px;font-size:14px;box-shadow:0 3px 0 #10051a}
#directory .finder-map-row .filter-line:has([data-category]){grid-row:4}
#directory .finder-map-row .filter-line:has([data-audience]){grid-row:5}
#directory .finder-map-row #spooky-map{grid-row:6}
@media(max-width:1200px){#directory .finder-map-row .search-row{grid-template-columns:minmax(0,1fr) minmax(230px,.7fr)}#directory .finder-map-row .finder-tools{grid-column:1/-1;width:100%;justify-content:flex-end}}
@media(max-width:600px){#directory .finder-map-row .search-row{grid-template-columns:minmax(0,1fr)}#directory .finder-map-row .finder-tools{justify-content:space-between}}

/* V47: link hover color, site-wide. #c8ff55 sits at a yellow-green hue
   (~79°) close enough to the site's gold/amber accents (#ffc37a, #ffe4b0,
   ~30-45°) that on a gold-trimmed tile it read as more of the same yellow
   than a distinct hover color. Moved to a true neon green (#39ff14,
   ~111°) — same acid/electric energy, far enough from gold on the color
   wheel to actually pop against it instead of blending in.

   Blanket rule: every <a> turns its text this green on hover, nav/button
   tiles included (their span/label text inherits color from the anchor).
   The !important beats every earlier per-page color/text-fill declaration,
   including the ones on the boxed tiles that set their own cream/gold text
   color, so this doesn't get quietly out-cascaded page by page. Tiles keep
   their own lift/brightness transform underneath — only the text color
   changes. Logos and image-based nav art can't recolor via CSS and are
   unaffected; that's a raster-image limit, not a bug. */
:root{--link-hover:#39ff14}

/* The boxed tiles set their label color with 2-class !important rules
   (.site-footer .foot-nav a, .nav-emblem .tile-label, etc. — up to 0,2,1
   specificity). :hover chained three times is a harmless no-op behavior-wise
   but pushes this rule's specificity to 0,3,1 so it wins everywhere,
   whatever page or tile it's on, without hunting down every selector. */
a:hover:hover:hover,
a:hover:hover:hover *{
  color:var(--link-hover)!important;
  -webkit-text-fill-color:var(--link-hover)!important;
  text-decoration:none!important;
}
.directory #cards h3 a:hover,
.curated-cards h3 a:hover{
  text-decoration-color:var(--link-hover)!important;
}

/* Every boxed button-like control site-wide: city banner tiles, "Show on
   map", and the region/experience/intensity filter chips plus "Reset
   filters" and "Search" in the finder. None of these are <a> tags, so the
   blanket a:hover rule above never reaches them — same !important-beating
   logic (:hover chained to outrank the V38 button color rule) applied
   directly to each.

   app.js wraps every one of these labels in a <span class="tile-label"> at
   runtime for the gold-gradient text treatment (background-clip:text + a
   transparent -webkit-text-fill-color, V38, !important) — that's invisible
   in the raw HTML source, only in the live DOM, and it means setting color
   on the button itself never reaches the label: the span paints its own
   fill from its own rule, not by inheriting the button's. Every entry
   below is listed twice — once for the button, once for its .tile-label —
   at specificity high enough to beat that gradient rule. */
.city-deck .city-sign:hover:hover,
.city-deck .city-sign:hover:hover .tile-label,
.btn-map:hover:hover,
.btn-map:hover:hover .tile-label,
.chip:hover:hover,
.chip:hover:hover .tile-label,
.reset:hover:hover,
.reset:hover:hover .tile-label,
.search-submit:hover:hover,
.search-submit:hover:hover .tile-label{
  color:var(--link-hover)!important;
  -webkit-text-fill-color:var(--link-hover)!important;
}

/* V49: the nav-logo treatment from index.html and haunted-houses/index.html,
   ported here so it applies to every other page too — this file loads
   everywhere, category.css only loads on those two. Duplicates the rules
   category.css already carries for those two pages (harmless — same
   values, later cascade position, no conflict) so the whole site's topbar
   matches exactly instead of only the two rebuilt pages.

   .topbar .nav was display:block (V8, above) because the old layout had
   nothing beside the tile row to lay out — every other page still had a
   full-width nav-emblem-group and no logo sibling. Now that every page
   gets the logo, the row needs to go back to a flex pairing. */
.topbar .nav{
  display:flex;
  align-items:center;
  gap:20px;
  width:100%;
  max-width:none;
  margin:0;
  padding:14px 20px 18px;
  box-sizing:border-box;
}
.topbar .nav-logo{
  flex:0 0 auto;
  display:block;
  line-height:0;
  padding:0;
  background:none;
  border:0;
  box-shadow:none;
  border-radius:0;
  transition:filter .18s ease;
}
.topbar .nav-logo::before{content:none}
.topbar .nav-logo img{
  display:block;
  width:auto;
  height:110px;
  object-fit:contain;
}
.topbar .nav-logo:hover{filter:brightness(1.12)}
.topbar .nav-logo:focus-visible{outline:3px solid var(--sign-cream,#fff0d2);outline-offset:4px}

.topbar .navlinks.nav-emblem-group{
  flex:1 1 auto;
  min-width:0;
  width:auto;
  max-width:none;
  margin:0;
  padding:14px 4px 18px 0;
  justify-content:flex-start;
  overflow-x:auto;
  overflow-y:hidden;
}

@media(max-width:760px){
  .topbar .nav{gap:14px;padding:10px 14px 14px}
  .topbar .nav-logo img{height:81px}
}
@media(max-width:460px){
  .topbar .nav-logo img{height:66px}
}

/* V54: every label is now 2 lines (explicit <br> in the markup itself,
   between the two words of each label -- CSS alone can't force a break at
   a specific word for short labels like "Theme Parks"), and all 11 tiles
   go back to fitting on a single row instead of V52's 8-on-row-one/3-on-
   row-two wrap. A 2-line label no longer needs a tile wide enough for a
   whole word pair, so the row can go back to a CSS GRID single row --
   closer to the pre-V52 design -- instead of V52's flex-wrap, which only
   existed to let a short last row wrap and re-center. Just recalibrated
   for 11 columns instead of 8, with a lower floor (70px vs 112px) since
   there's less room per tile to go around. grid's minmax(floor,1fr) does
   the same container-relative equal-sizing job flexbox's calc() did in
   V52: it fills the row exactly at typical desktop widths (roughly
   1150px+), and only floors out -- triggering the horizontal scrollbar
   below, rather than wrapping to a second row -- on unusually narrow
   desktop windows. Same block, same values, in both files — see
   category.css's copy for why it's duplicated. */
@media(min-width:1000px){
  .topbar .navlinks.nav-emblem-group{
    display:grid!important;
    grid-template-columns:repeat(11,minmax(70px,1fr))!important;
    align-content:flex-start;
    width:100%;
    max-width:none;
    padding-inline:8px;
    padding-block:10px 16px;
    gap:clamp(4px,0.45vw,9px);
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:thin;
    scrollbar-color:#9f718c #210d2d;
  }
  .topbar .nav-emblem{
    width:auto;
    min-width:0;
    height:101px;min-height:101px;
    /* Fixed padding, not a small clamp() sliver -- reserves the ornate
       frame's footprint so the label never paints under it. The frame is a
       ::before overlay (border-image, see the shared card-frame rule near
       the top of this file) painted 18px in from the tile's edge, pulled
       out 3px by its own negative inset. Its opaque scrollwork reaches
       ~15px in AT THE CORNERS but thins to only ~9-12px along the mid-edges
       (measured from the source webp's alpha) -- and the centered 2-line
       label sits in that vertical mid-band, well clear of the corners, so
       even the 10%-larger V57 text (which slightly overflows this padding
       box) still stays off the visible frame. */
    padding:16px;
    /* Lets the label size below be set relative to THIS tile's own
       resolved width (cqw) instead of the viewport (vw) -- container-
       relative, same philosophy as the width formula above, and the only
       way one shared rule can satisfy every label. Longest one sitewide
       ("Spooky Movie Screenings", 3 words) needs the label noticeably
       smaller than the rest to stay at 2 lines; sizing every tile off
       cqw keeps all 11 the same size while satisfying that worst case. */
    container-type:inline-size;
  }
  /* Higher specificity than the sitewide .topbar .nav-emblem{font-size...}
     rule further down this file, so it wins regardless of source order.
     V55.1: "as large as possible without touching the frame" -- the 16px
     padding above already reserves the frame's own footprint, so this only
     has to solve for the widest safe font within what's left. cqw is
     relative to the tile's full width (not its padded content box), so the
     formula nets out that fixed 32px (16px each side) before scaling: found
     by measuring, in a headless browser, the largest font that still keeps
     the longest of these 10 labels' two lines ("Trunk-or-" / "Treats" is
     the tightest) inside the padding box at 9 tile widths from the 70px
     floor up to a very wide monitor, then fitting a line through those
     points with a small safety margin so no tested width comes out over.
     min() caps it at the tile-height-driven ceiling (2 lines at
     line-height 1.1 fits under 101px - 32px of padding up to ~31px) so an
     extremely wide browser window can't blow past that either.
     V57: 10% bigger text, boxes unchanged -- coefficient x1.10 (0.15 ->
     0.165, Movie Screenings 0.11 -> 0.121, cap 30 -> 33px). V58: a further
     5% on top, boxes unchanged, and Jimmy explicitly OK with text touching
     the inner frame this time -- coefficient x1.05 (0.165 -> 0.17325,
     Movie Screenings 0.121 -> 0.12705, cap 33 -> 34.65px). V59: another 5%
     on the 10 standard tiles (0.17325 -> 0.1819125, cap -> 36.3825px), and
     10% on Movie Screenings alone (it read too small vs its neighbours):
     0.12705 -> 0.139755, cap -> 38.115px. Same content-box cqw base and
     -32px offset; 16px padding unchanged. Frame-touching still allowed;
     hard limits still enforced are 2-line + single-row + no spill past the
     tile box (Movie Screenings' "Spooky Movie" line is the width-limited
     one, re-checked at this larger size). */
  /* V60: one font-size rule for ALL 11 tiles -- Jimmy asked for every tile
     to match the size of the standard tiles (e.g. "Cemetery Walks"). The
     v57-v59 Movie-Screenings-only smaller rule is gone; Movie Screenings
     now uses this exact same size as the rest. Consequence, accepted per
     "don't worry about inner frames touching text": on the 244 pages whose
     label is 3 words ("Spooky Movie Screenings"), the "Spooky Movie" line
     is wider than any 2-word label, so at very wide windows (>=1800px) that
     one tile wraps to 3 lines instead of 2 -- it still stays inside its own
     box (no spill onto neighbours), it just stacks taller. Below ~1700px
     (the common desktop range) it stays 2 lines like the others. */
  .topbar .navlinks.nav-emblem-group .nav-emblem span{
    font-size:min(calc((100cqw - 32px) * 0.1819125), 36.3825px);
    line-height:1.1;
  }
}
/* Tablet: same flex-wrap/centered treatment as desktop, just smaller tiles.
   3-4 rows here instead of 2, which is fine -- there's room for it and it
   still reads as a centered block rather than the old single-row scroll. */
@media(min-width:760px) and (max-width:999px){
  /* The tile block is now taller than the logo -- align-items:center (the
     base .topbar .nav rule) would float the logo in the middle of that
     stack, so pin it to the top here instead. */
  .topbar .nav{align-items:flex-start}
  .topbar .navlinks.nav-emblem-group{
    display:flex!important;
    flex-flow:row wrap!important;
    grid-auto-flow:unset!important;
    grid-template-columns:none!important;
    justify-content:center!important;
    align-content:flex-start;
    gap:8px 10px;
    width:94%;
    max-width:640px;
    margin:0 auto;
    padding:10px 4px 14px;
    overflow:visible;
    scrollbar-width:thin;
    scrollbar-color:#9f718c #210d2d;
  }
  .topbar .nav-emblem{
    flex:0 0 clamp(104px,28vw,150px);
    width:auto;min-width:0;
    scroll-snap-align:unset;
    padding:12px 9px;
  }
}
/* Phone: a wrapped multi-row stack gets very tall at this width with not
   much payoff, so this keeps the pre-V52 single-row sideways scroll instead
   -- same tiles, same artwork, just scrolled rather than stacked. */
@media(max-width:759px){
  .topbar .navlinks.nav-emblem-group{
    display:grid!important;
    grid-auto-flow:column!important;
    grid-template-columns:none!important;
    grid-auto-columns:clamp(116px,21vw,196px);
    gap:12px;
    width:94%;
    margin:0 auto;
    padding:12px 4px 14px;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x proximity;
    scrollbar-width:thin;
    scrollbar-color:#9f718c #210d2d;
  }
  .topbar .nav-emblem{width:100%;min-width:0;scroll-snap-align:start;padding:14px 9px}
}
.topbar .nav-emblem{font-size:clamp(12.5px,1.2vw,19px);line-height:1.14}
.topbar .nav-emblem span{
  display:flex;align-items:center;justify-content:center;
  text-align:center;
  overflow-wrap:break-word;
  hyphens:none;
  width:100%;height:100%;
}

/* V50: footer rebuilt to match the top nav — the wordmark logo, bare and
   unframed, paired left-to-right with the link row in a flex layout. This
   replaces the old "footer-brand" graphic (a separate masked house-and-moon
   image with its own multi-breakpoint grid position, laid down across many
   V## layers above) and the region-name banner underneath it, both removed
   from the HTML. The old footer-brand/footer-valley rules above are left in
   place — harmless once nothing in the markup matches them — rather than
   hunted down across every layer. !important is needed here because those
   old rules set the same properties at several breakpoints without it;
   this block has no media queries of its own so it wins at every width. */
.site-footer .footer-top{
  display:flex!important;
  align-items:center!important;
  gap:24px!important;
  grid-template-columns:none!important;
  width:100%;max-width:none;
  margin:0;
  padding:0 0 28px!important;
  text-align:left!important;
}
.site-footer .footer-logo{
  flex:0 0 auto;
  display:block;
  line-height:0;
  margin:0!important;
  padding:0;
  background:none;
  border:0;
  box-shadow:none;
  border-radius:0;
  justify-self:auto!important;
  transition:filter .18s ease;
  filter:drop-shadow(0 4px 6px #0006);
}
.site-footer .footer-logo img{
  display:block;
  width:auto!important;
  max-width:none!important;
  height:110px;
  object-fit:contain;
  margin:0!important;
  mask-image:none!important;
  -webkit-mask-image:none!important;
}
.site-footer .footer-logo:hover{filter:drop-shadow(0 4px 6px #0006) brightness(1.12)}
.site-footer .footer-logo:focus-visible{outline:3px solid var(--sign-cream,#fff0d2);outline-offset:4px}

/* Grid, not flex — same fix as the nav-emblem-group tiles above. Each tile
   carries its own width:100% from the shared .foot-nav a rule (further up
   this file), which is fine in a grid cell (100% of the cell) but becomes
   "100% of the whole row" the instant the container is flex, forcing every
   tile onto its own line. repeat(6,...) matches exactly the six links left
   after dropping Featured placement. */
.site-footer .foot-nav{
  flex:1 1 auto!important;
  display:grid!important;
  grid-template-columns:repeat(6,minmax(150px,1fr))!important;
  grid-auto-flow:row!important;
  justify-content:start!important;
  justify-self:auto!important;
  gap:12px!important;
  width:100%;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  overflow-x:auto;
  overflow-y:hidden;
}
/* Capsules sized to match the top nav's tiles exactly, not scaled down for
   the footer's own layout: same font clamp, line-height, height and padding
   as .topbar .nav-emblem at the same 1000px breakpoint (further up this
   file), so a footer link and a nav tile read as identical in scale. */
.site-footer .foot-nav a{font-size:clamp(12.5px,1.2vw,19px);line-height:1.14}
.site-footer .foot-nav a span{
  display:flex;align-items:center;justify-content:center;
  text-align:center;
  overflow-wrap:break-word;
  hyphens:none;
  width:100%;height:100%;
}
@media(min-width:1000px){
  .site-footer .foot-nav a{
    width:100%;min-width:0;
    height:101px;min-height:101px;
    padding:10px clamp(5px,0.55vw,11px);
  }
}
@media(max-width:999px){
  .site-footer .foot-nav a{
    width:100%;min-width:0;
    height:88px;min-height:88px;
    padding:14px 9px;
  }
}

@media(max-width:900px){
  .site-footer .foot-nav{grid-template-columns:repeat(3,minmax(150px,1fr))!important}
}
@media(max-width:760px){
  .site-footer .footer-top{flex-direction:column!important;align-items:center;gap:16px;text-align:center!important}
  .site-footer .footer-logo img{height:81px}
  .site-footer .foot-nav{grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%}
}
@media(max-width:460px){
  .site-footer .footer-logo img{height:66px}
}
@media(max-width:420px){
  .site-footer .foot-nav{grid-template-columns:1fr!important}
}

/* Mailbox illustration (List Your Haunt page). Decorative only -- the
   page's own heading/copy already carry the real content, so this is
   alt="" the same way the header-art images are. */
.page-mailbox-art{display:block;width:100%;max-width:260px;height:auto;margin:0 auto 32px}
@media(max-width:700px){.page-mailbox-art{max-width:210px;margin-bottom:24px}}

/* Contact page: copy on the left, mailbox art (2x the List Your Haunt
   size) on the right. Single column under 860px, art on top -- matches
   how every other page puts its art before its text. */
.contact-layout{display:grid;grid-template-columns:1fr minmax(0,520px);gap:56px;align-items:start;margin-top:8px}
.contact-layout.listyours{align-items:center}
.contact-layout .contact-copy p{margin:0 0 20px}
.contact-layout .contact-copy p:last-child{margin-bottom:0}
/* v64: Contact + List Yours now put the body copy in the shared ornate
   frame (.info-card) in this same two-column layout (frame left, mailbox
   right). Drop the card's default bottom margin so it centers cleanly
   against the mailbox art. */
.contact-layout .info-card{margin-bottom:0;width:100%}
/* v65: the "Email a listing request" capsule was a full-width flex block
   filling the frame; shrink it to fit its label like every other link
   capsule (inline-flex, auto width). And on List Yours the mailbox art was
   taller than the frame beside it -- cap its width so its height matches the
   frame and the two sit flush at the bottom. */
.contact-layout .info-card .primary{display:inline-flex;width:auto}
.contact-layout.listyours .contact-mailbox-art{max-width:420px}
.contact-mailbox-art{display:block;width:100%;max-width:520px;height:auto;margin:0 auto}
@media(max-width:860px){
  .contact-layout{grid-template-columns:1fr;gap:8px}
  .contact-mailbox-art{order:-1;max-width:300px;margin:0 auto 28px}
}
