/*
Theme Name:   Mad Cow Comedy
Theme URI:    https://madcowcomedy.nl
Author:       Mad Cow Comedy
Author URI:   https://madcowcomedy.nl
Description:  Custom theme for Mad Cow Comedy, built to work with the Confirmed Show Events plugin. Provides the homepage, standalone content pages, a Workshops post type and archive, and themed overrides of the plugin's event archive/detail pages.
Version:      1.3.4
Requires at least: 6.0
Requires PHP: 7.4
License:      All Rights Reserved
Text Domain:  mad-cow-comedy

This stylesheet's design rules below this header are carried over verbatim
from the supplied static HTML build (style.css) so the site design is
reproduced exactly. Relative url() paths (assets/images/..., assets/icons/...,
assets/fonts/...) are unchanged and resolve correctly because this file
lives at the theme root, same as in the original static build.
*/

:root{--pink:#ff46a2;--blush:#f9a3d5;--cream:#f6e9f0;--thistle:#e8c6db;--black:#050505;--shell:75em}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--black);font-family:Figtree,Arial,sans-serif;background:#fff}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}button,input{font:inherit}.shell{width:min(var(--shell),calc(100% - 3em));margin-inline:auto}.sr-only{position:absolute;width:.0625em;height:.0625em;padding:0;margin:-.0625em;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.site-header{position:absolute;z-index:10;inset:0 0 auto;height:6em;background:rgba(0,0,0,.9);backdrop-filter:blur(.5em)}.header-inner{height:6em;display:flex;align-items:center;justify-content:flex-end}.brand{position:absolute;left:1.5em;top:0;width:12.5em;filter:drop-shadow(0 .25em .5em rgba(0,0,0,.08))}.main-nav{display:flex;gap:3em}.main-nav a{color:#fff;font-size:1.25em;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.menu-toggle{display:none}.hero{height:45em;background:#111 url('assets/images/hero.png') center/cover no-repeat;color:#fff}.hero-inner{position:relative;height:100%}.hero-copy{position:absolute;top:15.5em;left:0;width:47.8125em}.hero h1,.section-heading h2,.about-section h2,.newsletter h2{font-family:Montserrat,sans-serif;margin:0;letter-spacing:-.01em}.hero h1{font-size:3em;line-height:1.17;font-weight:600}.hero h1 strong{font-weight:800}.hero p{font-size:1.75em;line-height:2.25em;font-style:italic;font-weight:500;max-width:44.1875em;margin:1em 0 2em}.button{display:inline-flex;align-items:center;justify-content:center;border:0;text-transform:uppercase;font-weight:800;letter-spacing:.04em;cursor:pointer}.button-pink{min-height:4.5em;padding:1.25em 2.25em;border-radius:1em;background:var(--pink);color:#fff;font-size:1.125em}.button-dark{min-height:3.5em;padding:1em 1.875em;border-radius:1em;background:#000;color:#fff;font-size:1em}.section{padding:7em 0 7.5em}.section-heading{text-align:center;margin:0 auto 4em;max-width:63.75em}.section-heading h2{font-size:3em;line-height:3.5em;font-weight:600}.section-heading h2 strong{font-weight:800}.section-heading p{font-size:1.5em;line-height:1.75em;font-style:italic;font-weight:500;margin:.5em 0 0}.card-rail{display:grid;grid-template-columns:repeat(3,1fr);gap:3.75em}.event-card,.service-card{border-radius:2em;overflow:hidden}.event-card{padding:0 .25em 1.5em;background:linear-gradient(#ffd300,#f6e9f0 61%)}.event-pink{background:linear-gradient(var(--pink),#f6e9f0 61%)}.event-pink .event-date{color:#fff}.event-date{text-align:center;font-weight:700;font-size:1.25em;text-transform:uppercase;height:3.75em;padding-top:1em}.event-date sup{font-size:.64em}.event-card>img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:1.5em}.card-body{padding:1.25em}.card-body h3{font-size:1.75em;line-height:2em;margin:0 0 1em}.meta{display:flex;gap:.5em;align-items:center;margin:.5em 0;font-size:1em}.meta img{width:1.5em;height:1.5em}.event-card .button,.service-card .button{width:100%;margin-top:1.25em}.outline-link{display:flex;width:max-content;gap:.75em;align-items:center;margin:3em auto 0;border:.0625em solid;padding:.5em 1em .5em 1.25em;border-radius:1em;font-weight:700}.services-section{background:var(--blush)}.service-card{background:#fff;padding:.25em .25em 1.5em}.service-card>img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:1.75em}.service-card p{font-size:1em;line-height:1.25em;min-height:3.75em;margin:0}.reviews-section{padding-bottom:7.25em}.about-section{background:var(--blush);padding:7em 0}.about-grid{display:grid;grid-template-columns:30.375em 1fr;gap:5em;align-items:center}.about-photo{background:#fff;padding:1.25em;border-radius:2.25em;transform:rotate(-2deg)}.about-photo img{border:.0625em solid;border-radius:1.5em}.about-section h2{font-size:3em;line-height:3.5em}.about-section h3{font-size:1.375em;line-height:1.75em}.about-section p{font-size:1.125em;line-height:1.625em}.newsletter{padding:7em 0 6.25em}.newsletter-grid{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:4.375em}.newsletter h2{font-size:2.625em;line-height:1.2;font-weight:600}.newsletter p{font-size:1.25em;font-style:italic}.subscribe-form{display:grid;grid-template-columns:1fr auto;border:.0625em solid #a9869c;padding:.5em;border-radius:1.25em}.subscribe-form input{border:0;outline:0;padding:0 1.125em;font-size:1.125em;min-width:0}.site-footer{position:relative;background:#fff;padding:19.375em 0 2em;overflow:hidden}.milk{position:absolute;inset:0;background:url('assets/images/milk.svg') center top/cover no-repeat}.footer-grid,.footer-bottom{position:relative}.footer-grid{display:grid;grid-template-columns:1.7fr repeat(2,1fr);gap:3.125em}.footer-brand{grid-row:span 2;display:flex;flex-direction:column;gap:.625em;font-size:1.25em;font-weight:700}.footer-brand>img{width:12.5em;margin-bottom:.9375em}.footer-grid details{display:flex;flex-direction:column}.footer-grid summary{list-style:none;text-transform:uppercase;font-size:1.125em;font-weight:800;margin-bottom:.75em}.footer-grid details a{display:block;font-size:1.125em;line-height:1.75em;margin-bottom:.375em}.footer-bottom{border-top:.0625em solid;margin-top:3.5em;padding-top:2em;display:flex;justify-content:space-between}.footer-bottom nav{display:flex;gap:1.5em}.footer-bottom p,.footer-bottom a{font-size:.875em}

@media(max-width:56.25em){.shell{width:min(100% - 4em,43.75em)}.site-header{height:3.75em}.header-inner{height:3.75em}.brand{left:1em;width:7.5em}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:.3125em;position:absolute;right:1em;top:.75em;width:2.25em;height:2.25em;border:0;background:transparent}.menu-toggle span:not(.sr-only){display:block;width:1.375em;height:.125em;background:#fff;margin:auto}.main-nav{display:none;position:absolute;top:3.75em;left:0;right:0;background:rgba(0,0,0,.96);padding:1.75em 2em;flex-direction:column;gap:1.25em}.main-nav.is-open{display:flex}.main-nav a{font-size:1em}.hero{height:62em;background-position:59% center}.hero-copy{top:9em;left:0;width:100%}.hero h1{font-size:2em;line-height:2.25em;max-width:21.125em}.hero p{font-size:1.125em;line-height:1.5em;max-width:21.75em;margin:.75em 0 1.5em}.button-pink{height:3.75em;min-height:3.75em;width:100%;font-size:1em}.section{padding:5em 0 5.375em}.section-heading{margin-bottom:3em}.section-heading h2{font-size:2em;line-height:2.25em}.section-heading p{font-size:1.125em;line-height:1.5em;margin-top:.75em}.card-rail{display:flex;overflow-x:auto;gap:1em;width:calc(100% + 2em);padding:0 2em .75em;margin-left:-2em;scroll-snap-type:x mandatory;scrollbar-width:none}.card-rail::-webkit-scrollbar{display:none}.event-card,.service-card{min-width:19.25em;scroll-snap-align:start}.event-card{padding-bottom:1.25em}.event-date{font-size:1em;height:3em;padding-top:.75em}.card-body{padding:1em 1.25em 0}.card-body h3{font-size:1.25em;line-height:1.5em;margin-bottom:.75em}.meta{font-size:.875em}.meta img{width:1.25em;height:1.25em}.button-dark{min-height:3em;border-radius:.875em;font-size:.875em}.outline-link{margin-top:1.25em}.services-section{padding-top:5em}.service-card{padding-bottom:1.25em}.service-card p{font-size:.875em;line-height:1.125em}.about-section{padding:5em 0}.about-grid{display:flex;flex-direction:column;gap:2.75em}.about-photo{padding:.875em}.about-section h2{font-size:2em;line-height:2.25em}.about-section h3{font-size:1.125em;line-height:1.5em}.about-section p{font-size:1em;line-height:1.375em}.newsletter{padding:4.75em 0}.newsletter-grid{display:block}.newsletter h2{font-size:2em;line-height:2.25em}.newsletter p{font-size:1.125em;line-height:1.5em}.subscribe-form{grid-template-columns:1fr;height:9em;padding:.5em}.subscribe-form input{padding:.75em}.site-footer{padding:11.25em 0 1.75em}.footer-grid{display:block}.footer-brand{margin-bottom:3em}.footer-brand>img{width:12.25em}.footer-grid details{border:0;margin:0;padding:.75em 0}.footer-grid summary{display:flex;justify-content:space-between;margin:0;cursor:pointer}.footer-grid summary:after{content:'›';transform:rotate(90deg);font-size:1.375em}.footer-grid details:not([open]) summary:after{transform:rotate(0)}.footer-grid details a{font-size:1em;margin-top:.5em}.footer-bottom{display:block;margin-top:1.75em;padding-top:1.25em}.footer-bottom nav{display:none}.footer-bottom p{font-size:.75em}.milk{background-size:auto 100%;background-position:center top}}
@media(max-width:26.25em){.shell{width:calc(100% - 4em)}.hero-copy{left:0}.about-photo{width:100%}.footer-brand a{font-size:1.125em}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Final supplied production assets */
.hero{background-image:url('assets/images/hero.jpg')}
.outline-link img{width:1.25em;height:1.25em}


.about-photo{padding:0;background:transparent;transform:none}
.about-photo img{width:100%;border:0;border-radius:0}
.subscribe-form{grid-template-columns:auto 1fr auto;align-items:center}
.subscribe-form .mc4wp-form-fields{display:contents}
.subscribe-form .mc4wp-response:empty{display:none}
.input-icon{padding-left:.75em}
.input-icon img{width:1.5em;height:1.5em}
.footer-brand a{display:flex;align-items:center;gap:.75em}
.footer-brand a img{width:1.5em;height:1.5em;flex:0 0 1.5em}
.footer-icon{display:block;width:1.5em;height:1.5em;flex:0 0 1.5em;background-position:center;background-repeat:no-repeat;background-size:contain}
.footer-icon-email{background-image:url('assets/icons/email.svg')}
.footer-icon-call{background-image:url('assets/icons/call.svg')}
.footer-icon-instagram{background-image:url('assets/icons/instagram.svg')}
.footer-icon-facebook{background-image:url('assets/icons/facebook.svg')}

@media(max-width:56.25em){
  .hero{background-image:url('assets/images/hero-mob.jpg');background-position:center 35%;background-size:cover}
  .subscribe-form{grid-template-columns:auto 1fr}
  .subscribe-form .button{grid-column:1/-1}
  .about-photo{padding:0}
}

/* Locally hosted Figma typefaces. WOFF2 (converted from the original
   TTFs -- Figtree ~59% smaller, Montserrat ~70% smaller) instead of
   TrueType, and font-display:block instead of swap: swap paints text
   in the fallback font immediately and re-renders once the custom
   font arrives, which is the visible flash/reflow this is meant to
   avoid; block holds text invisible for a short window (~3s, well
   above what these now-small files need) so it only ever paints in
   the correct font. The four weights preloaded in
   MCC_Theme_Setup::preload_fonts() (body copy, nav/buttons, headings)
   are what actually keep that window short in practice -- block alone
   just changes what happens while waiting. */
@font-face{font-family:Figtree;src:url('assets/fonts/Figtree-Regular.woff2') format('woff2');font-style:normal;font-weight:400;font-display:block}
@font-face{font-family:Figtree;src:url('assets/fonts/Figtree-Medium.woff2') format('woff2');font-style:normal;font-weight:500;font-display:block}
@font-face{font-family:Figtree;src:url('assets/fonts/Figtree-MediumItalic.woff2') format('woff2');font-style:italic;font-weight:500;font-display:block}
@font-face{font-family:Figtree;src:url('assets/fonts/Figtree-SemiBold.woff2') format('woff2');font-style:normal;font-weight:600;font-display:block}
@font-face{font-family:Figtree;src:url('assets/fonts/Figtree-Bold.woff2') format('woff2');font-style:normal;font-weight:700;font-display:block}
@font-face{font-family:Figtree;src:url('assets/fonts/Figtree-ExtraBold.woff2') format('woff2');font-style:normal;font-weight:800;font-display:block}
@font-face{font-family:Montserrat;src:url('assets/fonts/Montserrat-SemiBold.woff2') format('woff2');font-style:normal;font-weight:600;font-display:block}
@font-face{font-family:Montserrat;src:url('assets/fonts/Montserrat-ExtraBold.woff2') format('woff2');font-style:normal;font-weight:800;font-display:block}

/* Figma button and review refinements */
.outline-link{min-height:2.75em;gap:.625em;padding:.4375em 1em .4375em 1.25em;border:.0625em solid #000;border-radius:1em;background:#fff;font-family:Figtree,Arial,sans-serif;font-size:1em;font-weight:700;line-height:1.75em;letter-spacing:-.01em}
.outline-link img{width:1.25em;height:1.25em;flex:0 0 1.25em}








@media(max-width:56.25em){
  
  
  
  
  
}

/* Explicit Figma typography audit */
body{font-family:Figtree,Arial,sans-serif;font-weight:400}
.hero h1,.section-heading h2,.newsletter h2{font-family:Montserrat,Arial,sans-serif;font-weight:600}
.hero h1 strong,.section-heading h2 strong,.newsletter h2 strong{font-weight:800}
.about-section h2{font-family:Montserrat,Arial,sans-serif;font-weight:800}
.hero p,.section-heading p,.newsletter p{font-family:Figtree,Arial,sans-serif;font-style:italic;font-weight:500}
.main-nav a,.button{font-family:Figtree,Arial,sans-serif;font-weight:800}
.event-date,.card-body h3{font-family:Figtree,Arial,sans-serif;font-weight:700}
.meta,.service-card p{font-family:Figtree,Arial,sans-serif;font-weight:500}



.about-section h3{font-family:Figtree,Arial,sans-serif;font-weight:700}
.about-section p{font-family:Figtree,Arial,sans-serif;font-weight:400;line-height:1.75em}
.subscribe-form input{font-family:Figtree,Arial,sans-serif;font-size:1.25em;font-weight:500;line-height:1.75em}
.footer-brand a{font-family:Figtree,Arial,sans-serif;font-weight:700}
.footer-grid summary{font-family:Figtree,Arial,sans-serif;font-weight:800}
.footer-grid details a{font-family:Figtree,Arial,sans-serif;font-weight:500}
.footer-bottom p{font-family:Figtree,Arial,sans-serif;font-weight:400}
.footer-bottom a{font-family:Figtree,Arial,sans-serif;font-weight:600}
.footer-bottom nav li{list-style:none}
.footer-bottom nav li:not(:first-child)::before{content:'•';margin-right:1.5em}

@media(max-width:56.25em){
  .about-section p{font-size:1em;line-height:1.375em}
  .subscribe-form input{font-size:1em;line-height:1.5em}
}

/* Newsletter layout from desktop through tablet and mobile */
@media(min-width:68.8125em){
  .newsletter-grid{grid-template-columns:1fr 1fr;align-items:center;gap:4.375em}
  .newsletter h2{font-size:3em;line-height:3.5em}
  .newsletter p{font-size:1.5em;line-height:1.75em;margin:.75em 0 0}
  .subscribe-form{height:4.5em}
}

@media(min-width:56.3125em) and (max-width:68.75em){
  .newsletter{height:auto;min-height:26.25em;padding:4.5em 0}
  .newsletter-grid{display:block}
  .newsletter h2{font-size:2.625em;line-height:3em;white-space:nowrap}
  .newsletter p{font-size:1.25em;line-height:1.75em;margin:.5em 0 0}
  .subscribe-form{height:4.5em;margin-top:3em}
}

@media(max-width:56.25em){
  .newsletter h2{font-size:2em;line-height:2.25em}
  .newsletter p{font-size:1.125em;line-height:1.5em;margin:.75em 0 0}
  .subscribe-form{margin-top:2.5em}
}

/* Mobile show heading flow from the 25.125em Figma artboard */
@media(max-width:56.25em){
  .shows-section .section-heading{width:calc(100% + 1em);max-width:22.125em;margin-left:0;margin-right:0;text-align:left}
  .shows-section .section-heading .desktop-break{display:none}
  .events{width:calc(100% + 4em);margin-left:-2em;padding-left:1.5em;padding-right:1.5em;scroll-padding-left:1.5em}
  .services{width:calc(100% + 4em);margin-left:-2em;padding-left:2em;padding-right:2em;scroll-padding-left:2em}
}

/* Figma mobile navigation, node 137:706 */
.main-nav-links{display:flex;gap:3em}
.main-nav-links li{list-style:none}
.mobile-legal{display:none}
.menu-icon{width:2.25em;height:2.25em}
.menu-icon-open{display:none}

@media(max-width:56.25em){
  html:has(body.menu-open),body.menu-open{overflow:hidden}
  .menu-toggle{z-index:102;width:2.25em;height:2.25em;padding:0}
  .menu-toggle .menu-icon{position:absolute;inset:0;width:2.25em;height:2.25em}
  .menu-toggle[aria-expanded="true"] .menu-icon-closed{display:none}
  .menu-toggle[aria-expanded="true"] .menu-icon-open{display:block}
  .site-header:has(.menu-toggle[aria-expanded="true"]){position:fixed;height:100dvh;background:#000}
  .site-header:has(.menu-toggle[aria-expanded="true"]) .brand{display:none}
  .main-nav{z-index:101;position:fixed;inset:0;top:0;height:100dvh;background:#000;padding:12.5em 3em 2.5em;overflow:auto}
  .main-nav.is-open{display:flex;justify-content:flex-start}
  .main-nav-links{display:flex;flex-direction:column;gap:2.25em}
  .main-nav a{font-size:1.5em;line-height:2em;letter-spacing:.04em;font-weight:800}
  .main-nav-links .current{color:var(--pink)}
  .mobile-legal{display:flex;flex-direction:column;gap:2em;margin-top:12.75em}
  .mobile-legal a{font-size:1.25em;line-height:1.75em;letter-spacing:-.01em;font-weight:600;text-transform:none}
}

/* Figma artboard geometry: desktop 90em.
   .shows-section/.events/.event-card are deliberately height:auto, not
   a Figma-exact fixed value like the sections around them: the section
   only ever showed exactly 3 events (one grid row) when this was
   written, but the homepage now shows up to 6 (two rows of the
   3-column grid, see front-page.php), and a fixed height sized for one
   row clips or overlaps the second -- with overflow:visible, the box
   itself stays fixed height while row 2's content and the "See all
   shows" button below it visually spill into whatever comes after,
   which is exactly what "completely broken" looked like report to
   report: the next section's background starting mid-row-2, and the
   button overlapping card content instead of sitting below it. Every
   other breakpoint already got a fixed->auto patch for this same
   reason at some point (search this file for ".event-card{height:auto"
   to see them) except this one, the widest-reaching (unbounded
   min-width, so it's also what every one of those patches was
   overriding rather than replacing) -- fixing it here directly instead
   of adding yet another narrow override window.

   .shows-section's padding is now symmetric (7.5em 0, was 7.5em 0 0)
   for the same reason: the old fixed height was taller than 3 events'
   worth of content, and that leftover space -- not any actual bottom
   padding, there wasn't any -- was the only thing separating the
   button from .services-section below. Auto height collapses that
   leftover space to nothing, so without an explicit bottom padding the
   button sits flush against the next section's background. */
@media(min-width:56.3125em){
  .shows-section{padding:7.5em 0}
  .shows-section .section-heading{margin-bottom:4em}
  .services-section{height:61.25em;padding:7.5em 0 0}
  .services-section .section-heading{margin-bottom:3.75em}
  .services,.service-card{height:36.75em}
  /* Auto, not the Figma-exact fixed height the sections above still
     use: the reviews section now renders a live Trustindex widget
     (see front-page.php) whose real height varies with however many
     reviews it shows, not the old mockup's fixed 3-card layout this
     was tuned for -- same fix, and same reasoning, as .shows-section
     above and its own comment. */
  .reviews-section{padding:7.5em 0}
  .reviews-section .section-heading{margin-bottom:4em}
  
  
  .about-section{height:45em;padding:5.625em 0}
  .newsletter{height:26.25em;padding:7em 0 0}
  .site-footer{height:50em;padding-top:12.625em}
}

/* Figma artboard geometry: mobile 25.125em */
@media(max-width:56.25em){
  .shows-section{padding:5em 0}
  .shows-section .section-heading{margin-bottom:2.5em}
  .services-section{height:53.5em;padding:5em 0 0}
  .services-section .section-heading{margin-bottom:1.75em}
  .services,.service-card{height:30.75em}
  .reviews-section{padding:6.75em 0}
  .reviews-section .section-heading{margin-bottom:.25em}
  
  
  .about-section{height:68.4375em;padding:5em 0 0}
  .newsletter{height:24.75em;padding:5em 0 0}
  .site-footer{height:52.5em;padding:7.5em 0 1.75em}
  .footer-grid details a{display:none}
  .footer-grid details{padding:.75em 0}
  .footer-bottom{margin-top:1.75em}
}

/* Figma footer composition */
@media(min-width:56.3125em){
  .site-footer{position:relative}
  .site-footer .milk{background-position:center top;background-size:100% 100%;background-repeat:no-repeat}
  .footer-grid{position:relative;height:28.125em;display:block}
  .footer-brand{position:absolute;left:-1.25em;top:0;width:18.75em;display:flex;gap:.5em}
  .footer-brand>img{width:12.5em;height:12.5em;object-fit:contain;margin:0 0 1em}
  .footer-brand a{height:2em;line-height:1.75em;font-size:1.25em}
  .footer-brand a:nth-of-type(3){margin-top:.5em}
  .footer-grid details{position:absolute;width:19em;margin:0;padding:0}
  .footer-grid details:nth-of-type(1){left:31.25em;top:7.5em}
  .footer-grid details:nth-of-type(2){left:56em;top:7.5em}
  .footer-grid details:nth-of-type(3){left:31.25em;top:15em}
  .footer-grid details:nth-of-type(4){left:56em;top:15em}
  .footer-grid summary{font-size:1.125em;line-height:1.75em;margin:0 0 .75em}
  .footer-grid details a{font-size:1.25em;line-height:1.75em;margin:0 0 .5em}
  .footer-bottom{position:absolute;left:50%;top:40.75em;width:75em;height:6.25em;transform:translateX(-50%);margin:0;padding-top:2.5em}
  .footer-bottom p{margin:0;font-size:1.125em;line-height:1.75em}
  .footer-bottom nav{gap:1.5em}
  .footer-bottom a{font-size:1.125em;line-height:1.75em;font-weight:600}
}

@media(max-width:56.25em){
  .site-footer .milk{background-position:center top;background-size:100% 100%;background-repeat:no-repeat}
  .site-footer{height:auto;min-height:52.5em;padding:7.5em 0 1em}
  .footer-grid{position:relative;left:auto;top:auto;width:21.125em;min-height:38.75em;height:auto;transform:none;display:flex;flex-direction:column;gap:1.5em;padding-top:24.75em}
  .footer-brand{position:absolute;inset:0 auto auto 0;width:21.125em;height:21.5em;margin:0;display:block}
  .footer-brand>img{position:absolute;left:0;top:0;width:12.25em;height:12.25em;object-fit:contain;margin:0}
  .footer-brand a{position:absolute;left:0;width:max-content;height:1.75em;font-size:1.125em;line-height:1.75em}
  .footer-brand a:nth-of-type(1){top:11.5em}
  .footer-brand a:nth-of-type(2){top:14em}
  .footer-brand a:nth-of-type(3){top:16.5em;margin:0}
  .footer-brand a:nth-of-type(4){top:19em}
  .footer-grid details{position:relative;left:auto;top:auto;width:21.125em;height:auto;margin:0;padding:0}
  .footer-grid details:nth-of-type(1),.footer-grid details:nth-of-type(2),.footer-grid details:nth-of-type(3),.footer-grid details:nth-of-type(4){left:auto;top:auto}
  .footer-grid summary{height:1.75em;font-size:1em;line-height:1.75em}
  .footer-grid summary:after{content:"";width:1.25em;height:1.25em;background:url('assets/icons/dropdown.svg') center/contain no-repeat;transform:none;transition:transform .2s ease}
  .footer-grid details[open] summary:after{transform:rotate(180deg)}
  .footer-grid details a{display:block;font-size:1em;line-height:1.5em;margin:.5em 0 0;padding-right:1.75em}
  .footer-grid details:not([open]) a{display:none}
  .footer-bottom{position:relative;left:auto;top:auto;width:21.125em;height:4.25em;transform:none;margin:1em auto 0;padding-top:1.25em}
  .footer-bottom p{margin:0;font-size:.75em;line-height:1.25em;white-space:nowrap}
}

/* Final Figma corrections: event bands, review assets, and newsletter typography */


.review-rating{display:flex;align-items:center;gap:.5em;height:1.5em;flex:0 0 1.5em}
.verified-icon{width:1.5em;height:1.5em;object-fit:contain}













.reviews-section{position:relative}





.event-date sup{display:inline-block;margin:0 .1875em 0 .0625em}
.about-section h3{font-family:Figtree,Arial,sans-serif;font-style:italic;font-weight:500}
.about-section h3 strong{font-weight:800}

@media(min-width:56.3125em){
  .header-inner{width:100%;max-width:none;margin:0;padding-inline:5em}
  .footer-brand{left:0}
  .event-card{padding:0 .25em 1.5em}
  .event-date{height:3.75em;padding:1em 0 0;line-height:1.75em}
  
  
  .newsletter{height:26.25em;padding:7.5em 0 0}
  .newsletter-grid{display:flex;width:50em;max-width:100%;height:13.75em;flex-direction:column;align-items:center;gap:3em;margin-inline:auto}
  .newsletter-grid>div{width:47.125em;max-width:100%}
  .newsletter h2{font-family:Montserrat,Arial,sans-serif;font-size:3em;font-weight:600;line-height:3.5em;letter-spacing:-.03em;white-space:nowrap}
  .newsletter h2 strong{font-weight:800}
  .newsletter p{margin:.5em 0 0;font-family:Figtree,Arial,sans-serif;font-size:1.5em;font-style:italic;font-weight:500;line-height:1.75em;text-align:center}
  .subscribe-form{display:grid;width:50em;max-width:100%;height:5em;grid-template-columns:1.5em minmax(0,1fr) 15.4375em;gap:1em;align-items:center;padding:.25em .1875em .25em 1.5em}
  .input-icon{padding:0}
  .subscribe-form input{height:1.75em;padding:0;font-family:Figtree,Arial,sans-serif;font-size:1.5em;font-weight:500;line-height:1.75em;letter-spacing:-.015em}
  .subscribe-form .button{width:15.4375em;height:4.5em;min-height:4.5em;border-radius:1em;font-size:1.125em}
}

@media(min-width:56.3125em) and (max-width:84.9375em){
  
}

@media(max-width:56.25em){
  .events{scroll-snap-type:x proximity}
  .event-card,.service-card{flex:0 0 19.25em}
  .event-card{padding:0 .25em 1.25em}
  .event-date{display:flex;height:3em;align-items:center;justify-content:center;padding:0;font-size:1em;line-height:1.5em;letter-spacing:-.01em}
  .event-card>img{width:18.75em;height:18.75em;border-radius:1.5em;object-fit:cover}
  .event-card .card-body{padding:1.25em 1.25em 0}
  .services-section .section-heading{margin-bottom:2.5em}
  .services,.service-card{height:32em}
  .service-card .card-body{padding:1.25em 1.25em 0}
  .service-card .card-body h3{margin-bottom:.5em}
  .reviews-section{padding:5em 0}
  .reviews-section .section-heading{margin-bottom:2em}
  
  
  
  
  
  
  
  
  
  
  
  
  
  .review-rating{height:1.5em}
  
  
  
  .newsletter{height:29.75em;padding:5em 0 0}
  .newsletter-grid{display:flex;width:21.125em;height:19.75em;flex-direction:column;align-items:stretch;gap:2.5em;margin-inline:auto}
  .newsletter-grid>div{width:21.125em}
  .newsletter h2{height:4.5em;font-family:Montserrat,Arial,sans-serif;font-size:2em;font-weight:600;line-height:2.25em;letter-spacing:-.02em}
  .newsletter h2 strong{font-weight:800}
  .newsletter p{margin:.75em 0 0;font-family:Figtree,Arial,sans-serif;font-size:1.125em;font-style:italic;font-weight:500;line-height:1.5em}
  .subscribe-form{position:relative;display:block;width:21.125em;height:9em;margin:0;padding:0;border-radius:1.25em}
  .input-icon{position:absolute;left:1.25em;top:1.5em;padding:0}
  .subscribe-form input{position:absolute;left:3.5em;top:1.5em;width:15.875em;height:1.75em;padding:0;font-family:Figtree,Arial,sans-serif;font-size:1.25em;font-weight:500;line-height:1.75em;letter-spacing:-.0125em}
  .subscribe-form .button{position:absolute;left:.4375em;top:4.6875em;width:20.125em;height:3.75em;min-height:3.75em;border-radius:.875em;font-size:1em}
}

/* Em-based type ratios keep text metrics stable at every breakpoint. */
.hero p{line-height:1.285714}
.section-heading h2{line-height:1.166667}
.section-heading p{line-height:1.166667}
.card-body h3{line-height:1.142857;margin-bottom:.571429em}
.about-section h2{line-height:1.166667}
.about-section h3{line-height:1.272727}
.about-section p{line-height:1.555556}
.outline-link{line-height:1.75}






.footer-brand{font-size:1em}
.footer-brand a{height:1.6em;line-height:1.4;gap:.6em}
.footer-icon{width:1.2em;height:1.2em;flex-basis:1.2em}
.footer-grid summary{line-height:1.555556}
.footer-grid details a{line-height:1.4}
.footer-bottom p,.footer-bottom a{line-height:1.555556}
.button-pink{min-height:4em;padding:1.111111em 2em;border-radius:.888889em}
.button{white-space:nowrap}

@media(min-width:56.3125em){
  .shows-section .section-heading,.reviews-section .section-heading{margin-bottom:3.75em}
  .event-date{height:3em;padding-top:.8em;line-height:1.4}
  .newsletter h2{line-height:1.166667;letter-spacing:-.01em}
  .newsletter p{line-height:1.166667}
  .subscribe-form input{height:1.166667em;line-height:1.166667;letter-spacing:-.01em}
  .subscribe-form .button{width:13.722222em;height:4em;min-height:4em;border-radius:.888889em}
  .footer-brand>img{width:12.5em;height:12.5em}
}

/* Tablet navigation uses the same accessible menu interaction as mobile. */
@media(max-width:68.75em){
  html:has(body.menu-open),body.menu-open{overflow:hidden}
  .site-header{height:3.75em}
  .header-inner{height:3.75em;width:100%;max-width:none;margin:0;padding:0}
  .brand{left:1em;width:7.5em}
  .menu-toggle{display:flex;z-index:102;position:absolute;right:1em;top:.75em;width:2.25em;height:2.25em;padding:0;border:0;background:transparent}
  .menu-toggle .menu-icon{position:absolute;inset:0;width:2.25em;height:2.25em}
  .menu-toggle[aria-expanded="true"] .menu-icon-closed{display:none}
  .menu-toggle[aria-expanded="true"] .menu-icon-open{display:block}
  .site-header:has(.menu-toggle[aria-expanded="true"]){position:fixed;height:100dvh;background:#000}
  .site-header:has(.menu-toggle[aria-expanded="true"]) .brand{display:none}
  .main-nav{display:none;z-index:101;position:fixed;inset:0;height:100dvh;background:#000;padding:12.5em 3em 2.5em;overflow:auto;flex-direction:column}
  .main-nav.is-open{display:flex;justify-content:flex-start}
  .main-nav-links{display:flex;flex-direction:column;gap:2.25em}
  .main-nav a{font-size:1.5em;line-height:1.333333;letter-spacing:.04em;font-weight:800}
  .main-nav-links .current{color:var(--pink)}
  .mobile-legal{display:flex;flex-direction:column;gap:2em;margin-top:12.75em}
  .mobile-legal a{font-size:1.25em;line-height:1.4;letter-spacing:-.01em;font-weight:600;text-transform:none}
}

/* Tablet layout: flowing sections and swipeable cards without clipping. */
@media(min-width:56.3125em) and (max-width:68.75em){
  .shell{width:calc(100% - 3em)}
  .hero{height:40em;background-position:58% center}
  .hero-copy{top:11em;width:34em}
  .hero h1{font-size:2.5em;line-height:1.2}
  .hero p{font-size:1.375em;line-height:1.363636;max-width:30em}
  .button-pink{font-size:1em;min-height:3.75em;padding:1.25em 2.25em;border-radius:1em}
  .shows-section,.services-section,.reviews-section{height:auto;padding:5em 0}
  .section-heading{max-width:48em;margin-bottom:3em}
  .section-heading h2{font-size:2.5em;line-height:1.2}
  .section-heading p{font-size:1.25em;line-height:1.4}
  .card-rail{display:flex;width:calc(100% + 3em);margin-left:-1.5em;padding:0 1.5em .75em;gap:1.5em;overflow-x:auto;scroll-snap-type:x proximity;scroll-padding-left:1.5em;scrollbar-width:none}
  .event-card,.service-card{flex:0 0 22.5em;scroll-snap-align:start}
  
  .outline-link{margin-top:2em}
  
  
  
  .about-section{height:auto;min-height:45em;padding:5em 0}
  .about-grid{grid-template-columns:minmax(18em,23em) minmax(0,1fr);gap:2.5em;align-items:center}
  .about-section h2{font-size:2.5em;line-height:1.2}
  .about-section h3{font-size:1.25em;line-height:1.4}
  .about-section p{font-size:1em;line-height:1.5}
  .newsletter{height:auto;min-height:26.25em;padding:6em 0}
}

/* Compact desktop spacing keeps the full navigation and three-card grids usable. */
@media(min-width:68.8125em) and (max-width:84.9375em){
  .header-inner{padding-inline:2em}
  .main-nav-links{gap:2em}
  .main-nav a{font-size:1.0625em}
  .events,.services{gap:2em}
}

/* Keep the shared milk artwork fluid without distorting its horizontal proportions. */
.site-footer>.milk{background-position:center top;background-size:cover;background-repeat:no-repeat}

/* Desktop footer headings are labels; accordion interaction is reserved for tablet/mobile. */
@media(min-width:56.3125em){
  .footer-grid summary{pointer-events:none;cursor:default}
}

/* Responsive footer for smaller desktop windows. */
@media(min-width:68.8125em) and (max-width:84.9375em){
  .site-footer{height:auto;min-height:0;padding:12em 0 3em}
  .site-footer .milk{background-size:100% 100%;background-position:center top}
  .footer-grid{position:relative;height:auto;display:grid;grid-template-columns:minmax(16.5em,1.05fr) minmax(14em,.9fr) minmax(19em,1.15fr);gap:1.5em 2em}
  .footer-brand{position:relative;left:auto;top:auto;width:auto;min-width:0;height:auto;grid-row:span 2;display:flex;gap:.5em}
  .footer-brand>img{width:10.5em;height:10.5em;margin:0 0 .75em}
  .footer-brand a{height:1.555556em;font-size:1.125em;line-height:1.555556}
  .footer-grid details,.footer-grid details:nth-of-type(1),.footer-grid details:nth-of-type(2),.footer-grid details:nth-of-type(3),.footer-grid details:nth-of-type(4){position:relative;left:auto;top:auto;width:auto;margin:0;padding:0}
  .footer-grid summary{font-size:1em;line-height:1.5;margin:0 0 .75em}
  .footer-grid details a{font-size:1em;line-height:1.5;margin:0 0 .5em}
  .footer-bottom{position:relative;left:auto;top:auto;width:calc(100% - 3em);height:auto;transform:none;margin:2em auto 0;padding:1.5em 0 0;gap:1.5em;align-items:flex-start}
  .footer-bottom p,.footer-bottom a{font-size:1em;line-height:1.5}
  .footer-bottom nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.75em 1.5em}
}

@media(max-width:56.25em){
  .shows-section .section-heading,.reviews-section .section-heading{height:10.5em}
  .services-section .section-heading{height:9.75em}
  .section-heading h2{line-height:1.125}
  .section-heading p{line-height:1.333333}
  .card-body h3{line-height:1.2;margin-bottom:.6em}
  .meta{gap:.571429em}
  .meta img{width:1.428571em;height:1.428571em}
  .button-dark{min-height:3.428571em}
  .about-section h2{line-height:1.125}
  .about-section h3{line-height:1.333333}
  .about-section p{line-height:1.375}
  
  
  
  
  
  
  
  
  .newsletter h2{height:2.25em;line-height:1.125;letter-spacing:-.01em}
  .newsletter p{line-height:1.333333}
  .subscribe-form input{left:2.8em;top:1.2em;width:12.7em;height:1.4em;line-height:1.4;letter-spacing:-.01em}
  .footer-brand{font-size:1em}
  .footer-brand a{height:1.555556em;line-height:1.555556;gap:.666667em}
  .footer-brand a:nth-of-type(1){top:10.222222em}
  .footer-brand a:nth-of-type(2){top:12.444444em}
  .footer-brand a:nth-of-type(3){top:14.666667em}
  .footer-brand a:nth-of-type(4){top:16.888889em}
  .footer-icon{width:1.333333em;height:1.333333em;flex-basis:1.333333em}
  .footer-grid summary{line-height:1.75}
  .footer-grid details a{line-height:1.5}
  .footer-bottom p{line-height:1.666667}
}

/* Mid-size tablets get flowing content instead of phone-height constraints. */
@media(min-width:37.5em) and (max-width:56.25em){
  .shell{width:calc(100% - 6em);max-width:none}
  .shows-section,.services-section,.reviews-section{height:auto;padding:5em 0}
  .shows-section .section-heading,.services-section .section-heading,.reviews-section .section-heading{width:auto;max-width:44em;height:auto;margin:0 auto 3em;text-align:center}
  .section-heading h2{font-size:2.25em;line-height:1.166667}
  .section-heading p{font-size:1.125em;line-height:1.333333}
  .card-rail,.events,.services{width:calc(100vw - 3em);margin-left:0;padding-left:0;padding-right:0;gap:2em;scroll-padding-left:0}
  
  .about-section{height:auto;min-height:43em;padding:5em 0}
  .about-grid{display:grid;grid-template-columns:minmax(16em,18em) minmax(0,1fr);gap:2em;align-items:center}
  .about-photo{width:100%}
  .about-section h2{font-size:2.25em;line-height:1.166667}
  .about-section h3{font-size:1.125em;line-height:1.333333}
  .about-section p{font-size:1em;line-height:1.5}
  .newsletter{height:auto;min-height:26.25em;padding:5em 0}
  .newsletter-grid.shell{width:min(50em,calc(100% - 3em));height:auto;align-items:center;gap:3em}
  .newsletter-grid>div{width:100%;text-align:center}
  .newsletter h2{height:auto;font-size:2.25em;line-height:1.166667}
  .newsletter p{font-size:1.125em;line-height:1.333333}
  .subscribe-form{position:relative;display:grid;width:100%;height:5em;grid-template-columns:1.5em minmax(0,1fr) 15em;gap:1em;align-items:center;margin:0;padding:.25em .1875em .25em 1.5em}
  .input-icon{position:static;padding:0}
  .subscribe-form input{position:static;width:auto;height:1.4em;padding:0;font-size:1.25em;line-height:1.4}
  .subscribe-form .button{position:static;grid-column:auto;width:15em;height:4em;min-height:4em;border-radius:1em;font-size:1em}
  .site-footer{height:auto;min-height:42em;padding:7.5em 0 1em}
  .site-footer .milk{background-size:cover;background-position:center top}
  .footer-grid{width:calc(100% - 3em);min-height:21.5em;height:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.5em 2em;padding-top:0}
  .footer-brand{position:relative;inset:auto;width:auto;height:21.5em;grid-row:1 / span 4;margin:0}
  .footer-grid details,.footer-grid details:nth-of-type(1),.footer-grid details:nth-of-type(2),.footer-grid details:nth-of-type(3),.footer-grid details:nth-of-type(4){position:relative;left:auto;top:auto;width:auto;height:auto;margin:0;padding:0}
  .footer-bottom{width:calc(100% - 3em);margin:2em auto 0}
  .footer-bottom p{font-size:.875em;line-height:1.428571}
}

/* Keep ordinal suffixes compact and aligned in every event-card date. */
.event-card>.event-image-link{
  display:block;
  width:100%
}
.event-card>.event-image-link>img{
  width:100%;
  height:auto;
  aspect-ratio:1;
  object-fit:cover;
  border-radius:1.5em
}
.event-date{
  white-space:nowrap
}
.event-date sup{
  display:inline-block;
  margin:0 .1875em 0 .0625em;
  font-size:.64em;
  line-height:0;
  vertical-align:.5em
}

/* Shared FAQ module: injected on pages that do not provide a Figma-specific version. */
.shared-faq{padding:7.5em 0;background:var(--blush)}
.shared-module-heading{text-align:center;margin:0 auto 3em}
.shared-module-heading h2{margin:0;font-family:Montserrat,Arial,sans-serif;font-size:3em;line-height:1.166667;font-weight:600;letter-spacing:-.01em}
.shared-module-heading h2 strong{font-weight:800}
.shared-module-heading p{margin:.5em 0 0;font-size:1.5em;line-height:1.166667;font-style:italic;font-weight:500}
.shared-faq .faq-list{display:grid;gap:1em}
.shared-faq details{overflow:hidden;border-radius:2em;background:#fff}
.shared-faq summary{position:relative;display:flex;min-height:4.333333em;align-items:center;padding:1.333333em 3.75em 1.333333em 1.5em;list-style:none;font-size:1.5em;line-height:1.166667;font-weight:600;cursor:pointer}
.shared-faq summary::-webkit-details-marker{display:none}
.shared-faq summary:after{position:absolute;right:1.5em;top:1.5em;width:1.333333em;height:1.333333em;background:url('assets/icons/icon-plus.svg') center/contain no-repeat;content:""}
.shared-faq details[open] summary:after{background-image:url('assets/icons/icon-minus.svg')}
.shared-faq details.is-closing summary:after{background-image:url('assets/icons/icon-plus.svg')}
.shared-faq .faq-answer{padding:0 5.75em 2em 1.8em;font-size:1.25em;line-height:1.4}
.shared-faq .faq-answer p{margin:0 0 1.2em}.shared-faq .faq-answer p:last-child{margin-bottom:0}
.shared-faq .faq-answer a{color:var(--pink);font-weight:700;text-decoration:underline}
.shared-newsletter{background:#fff}

@media(max-width:68.75em){
  .shared-faq{padding:6em 0}
  .shared-module-heading{text-align:left}
  .shared-module-heading h2{font-size:2.5em;line-height:1.2}
  .shared-module-heading p{font-size:1.25em;line-height:1.4}
}
@media(max-width:37.4375em){
  .shared-faq{padding:5em 0}
  .shared-module-heading h2{font-size:2em;line-height:1.125}
  .shared-module-heading p{font-size:1.125em;line-height:1.333333}
  .shared-faq details{border-radius:1.5em}
  .shared-faq summary{min-height:4em;padding:1.2em 3.4em 1.2em 1.2em;font-size:1.25em;line-height:1.2}
  .shared-faq summary:after{right:1.2em;top:1.2em;width:1.6em;height:1.6em}
  .shared-faq .faq-answer{padding:0 3.6875em 1.5em 1.5em;font-size:1em;line-height:1.5}
}

/* Newsletter input focus treatment. */
.subscribe-form{transition:border-color .25s ease}
.subscribe-form:focus-within{border-color:var(--black)}

/* Final interaction, typography, and CTA refinements. */
.main-nav a{transition:color .25s ease}
.main-nav a:hover{color:#ff46a2}
.button{transition:background-color .25s ease}
.button-pink:hover{background-color:#ff57ab}
.button-dark:hover{background-color:#242424}
.subscribe-form .button{white-space:nowrap;word-break:normal;text-wrap:nowrap}
.outline-link{min-height:3.125em;gap:.625em;padding:.625em 1.625em .625em 1.875em}
.about-section h2{font-weight:600}
.about-section h2 strong{font-weight:800}
.about-section h3{font-style:italic;font-weight:500}
.about-section h3 strong{font-style:italic;font-weight:800}

@media(min-width:56.3125em){
  .event-date{display:flex;height:3em;min-height:3em;align-items:center;justify-content:center;padding:.8em 0;line-height:1.4}
}

@media(min-width:37.5em) and (max-width:68.75em){
  .newsletter-grid.shell{width:calc(100% - 3em);max-width:none}
  .subscribe-form{width:100%;max-width:none}
}

/* Force the supplied ExtraBold face before applying the requested italic slant. */
@font-face{font-family:FigtreeExtraBold;src:url('assets/fonts/Figtree-ExtraBold.woff2') format('woff2');font-style:normal;font-weight:800;font-display:block}
.about-section h3 strong{font-family:FigtreeExtraBold,Figtree,Arial,sans-serif;font-style:italic;font-weight:800}

/* Keep the newsletter control inset evenly around its action on tablet and desktop. */
@media(min-width:37.5em){
  .subscribe-form{padding:.25em .25em .25em 1.5em}
}

/* Correct the converted mobile heading line-height so the CTA stays inside the hero. */
@media(max-width:56.25em){
  .hero{overflow:hidden}
  .hero h1{line-height:1.125}
  .hero p{line-height:1.333333}
}

@media(max-width:37.4375em){
  .about-section{height:auto;min-height:0;padding:5em 0}
}

/* Mouse-drag affordance for overflowing card rails. */
.card-rail.is-draggable{cursor:grab;overscroll-behavior-inline:contain}
.card-rail.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.card-rail.is-dragging img{pointer-events:none}

/* Reliable touch swiping on card rails. The events rail wraps its
   image and title in full-size <a> tags (the services rail doesn't --
   its cards only link via the small CTA button), and on touch browsers
   a linked <img> is natively draggable/long-press-previewable, which
   can hijack a swipe that starts on the picture instead of letting it
   scroll the rail. The drag/callout suppression below stops iOS/
   Android's own image-drag and press-and-hold link preview from
   competing with that swipe on first touch.

   touch-action:pan-x is scoped to just the image link, not the whole
   .card-rail -- a touch-action restriction on an ancestor can only be
   narrowed by a descendant, never widened back, so putting it on the
   rail restricted EVERY descendant equally, including the "Info &
   Tickets" / CTA buttons. Worse, it made the browser commit to a
   horizontal-pan gesture on any tiny finger jitter during a tap,
   swallowing real taps on those buttons as micro-scrolls instead of
   clicks (services cards, which have no linked image at all, were
   just as affected since they share this same class). Scoping it to
   .event-image-link keeps the swipe fix where the actual risk is
   (a touch starting on the picture) without touching the buttons. */
.card-rail a,.card-rail img{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.card-rail img{-webkit-user-drag:none;user-drag:none}
.card-rail .event-image-link{touch-action:pan-x}

/* Latest CTA and service-card spacing refinements. */
.outline-link{font-size:1.2em;font-weight:600}
.service-card p{font-weight:400}
.service-card .button{margin-top:2em}

@media(min-width:56.3125em){
  .hero p{margin-bottom:1.5em}
}

@media(min-width:80em){
  .about-grid{grid-template-columns:28.75em minmax(0,1fr)}
}

/* Preserve the service-card bottom inset after increasing the CTA gap. */
@media(min-width:56.3125em){
  .services-section{height:62em}
  .services,.service-card{height:37.5em}
}

@media(max-width:56.25em){
  .services-section{height:54.25em}
  .services,.service-card{height:31.5em}
}

@media(min-width:37.5em) and (max-width:56.25em){
  .services-section{height:auto}
}

/* Phone alignment and footer artwork refinements. */
@media(max-width:37.4375em){
  .shows-section .section-heading,.services-section .section-heading,.reviews-section .section-heading{
    width:100%;
    max-width:none;
    margin-left:0;
    margin-right:0;
    text-align:left;
  }

  .site-footer{
    background:var(--thistle);
  }

  .site-footer .milk{
    background-position:center top;
    background-size:56.25em 31.25em;
    background-repeat:no-repeat;
  }

  .footer-grid summary:after{
    width:1em;
    height:1em;
    flex:0 0 1em;
  }
}

/* Compact Ticket Alerts spacing on portrait tablets. */
@media(min-width:37.5em) and (max-width:68.75em){
  .newsletter{height:25rem;min-height:25rem;padding:6rem 0 0}
}

/* Dedicated Figma tablet layout: 46.5em artboard with 3em gutters. */
@media(min-width:37.5em) and (max-width:56.25em){
  html,body{overflow-x:clip}
  .shell{width:calc(100% - 6em);max-width:none}

  .site-header,.header-inner{height:4.5em}
  .brand{left:1.5em;top:0;width:9em}
  .menu-toggle{right:1.5em;top:1.125em;width:2.25em;height:2.25em}

  .hero{height:46.5em;background-position:center 68%}
  .hero-copy{top:10em;left:0;width:100%}
  .hero h1{max-width:38.0625em;font-size:2.5em;line-height:1.2}
  .hero p{max-width:37.6875em;margin:.8em 0 1.6em;font-size:1.25em;line-height:1.4}
  .hero .button-pink{width:12.9375em;height:4em;min-height:4em;font-size:1em}

  .shows-section{height:auto;min-height:73.125em;padding:6em 0}
  .services-section{height:auto;min-height:58.5em;padding:6em 0}
  .reviews-section{height:auto;min-height:56.25em;padding:6em 0}

  .shows-section .section-heading,.services-section .section-heading,.reviews-section .section-heading{
    display:flex;
    width:100%;
    max-width:none;
    height:auto;
    flex-direction:column;
    gap:.5em;
    margin:0 auto 3em;
    text-align:center;
  }
  .shows-section .section-heading{max-width:35.625em}
  .services-section .section-heading{max-width:36.125em}
  .reviews-section .section-heading{max-width:36.625em}
  .section-heading h2{font-size:2.25em;line-height:1.222222}
  .section-heading p{margin:0;font-size:1.25em;line-height:1.4}
  .reviews-section .section-heading h2{min-height:2.666667em}

  .card-rail,.events,.services{
    width:calc(100vw - 3em);
    margin-left:0;
    padding:0 3em .75em 0;
    gap:2em;
    scroll-padding-left:0;
  }
  .event-card,.service-card{flex:0 0 22.5em;min-width:22.5em}
  .event-card{display:flex;height:auto;padding:0 .25em 1.5em;flex-direction:column}
  .event-date{height:3.75em;min-height:3.75em;padding:0;font-size:1.125em;line-height:1.555556}
  .event-card>img{width:22em;height:22em;border-radius:1.5em}
  .event-card .card-body{display:flex;min-height:0;flex:1;flex-direction:column;padding:1.5em 1.25em 0}
  .event-card .card-body h3{font-size:1.5em;line-height:1.166667}
  .event-card .meta{font-size:1em;line-height:1.25}
  .event-card .meta img{width:1.5em;height:1.5em}
  .event-card .button{height:3.5em;min-height:3.5em;margin-top:auto;font-size:1em}

  .service-card{display:flex;height:36.75em;padding:.25em .25em 1.5em;flex-direction:column}
  .service-card>img{width:22em;height:22em;border-radius:1.75em}
  .service-card .card-body{display:flex;min-height:0;flex:1;flex-direction:column;padding:1.5em 1.25em 0}
  .service-card .card-body h3{font-size:1.5em;line-height:1.166667}
  .service-card p{min-height:0;font-size:1em;line-height:1.25}
  .service-card .button{height:3.5em;min-height:3.5em;margin-top:auto;font-size:1em}
  .outline-link{margin-top:2.5em}

  
  
  
  
  
  
  
  
  

  
  
  
  
  
  
  

  .about-section{height:auto;min-height:49.75em;padding:6em 0}
  .about-grid{display:grid;grid-template-columns:15.571875em minmax(0,1fr);grid-template-rows:6.5em 10.75em auto auto auto;column-gap:2.0625em;row-gap:0;align-items:start}
  .about-grid>div:last-child{display:contents}
  .about-photo{grid-column:1;grid-row:1/span 2;width:15.571875em;height:17.25em}
  .about-photo img{width:100%;height:100%;object-fit:contain}
  .about-section h2{grid-column:2;grid-row:1;margin:.888889em 0 0;font-size:2.25em;line-height:1.222222}
  .about-section h3{grid-column:2;grid-row:2;margin:1.65em 0 0;font-size:1.25em;line-height:1.4}
  .about-section p{grid-column:1/-1;margin:1.555556em 0 0;font-size:1.125em;line-height:1.555556}
  .about-section p:first-of-type{margin-top:2.666667em}

  .newsletter{height:auto;min-height:30em;padding:6em 0}
  .newsletter-grid.shell{display:flex;width:calc(100% - 6em);height:auto;flex-direction:column;gap:3em;align-items:center}
  .newsletter-grid>div{width:100%;text-align:center}
  .newsletter h2{height:auto;font-size:2.25em;line-height:1.222222;white-space:normal}
  .newsletter p{margin:.5em 0 0;font-size:1.25em;line-height:1.4}
  .subscribe-form{position:relative;display:grid;width:100%;height:5em;grid-template-columns:1.5em minmax(0,1fr) 15.4375em;grid-template-rows:1fr;gap:1em;align-items:center;margin:0;padding:.25em .25em .25em 1.5em}
  .input-icon{position:static;padding:0}
  .subscribe-form input{position:static;width:100%;height:1.4em;padding:0;font-size:1.25em;line-height:1.4}
  .subscribe-form .button{position:static;width:100%;max-width:none;height:auto;min-height:0;grid-column:auto;align-self:stretch;border-radius:1em;font-size:1em}

  .site-footer{height:45em;min-height:45em;padding:12.6875em 0 0;background:var(--thistle)}
  .site-footer .milk{background-position:-4.5em top;background-size:81em 45em;background-repeat:no-repeat}
  .footer-grid{position:relative;width:calc(100% - 6em);min-height:0;height:21.5em;display:block;padding:0}
  .footer-brand{position:absolute;inset:0 auto auto 0;width:16.4375em;height:21.5em;display:block;margin:0;font-size:1em}
  .footer-brand>img{position:absolute;left:0;top:0;width:12.25em;height:12.25em;object-fit:contain;margin:0}
  .footer-brand a{position:absolute;left:0;width:max-content;height:1.75em;font-size:1.125em;line-height:1.555556}
  .footer-brand a:nth-of-type(1){top:10em}
  .footer-brand a:nth-of-type(2){top:12.444444em}
  .footer-brand a:nth-of-type(3){top:14.888889em;margin:0}
  .footer-brand a:nth-of-type(4){top:17.333333em}
  .footer-icon{width:1.333333em;height:1.333333em;flex-basis:1.333333em}
  .footer-grid details,.footer-grid details:nth-of-type(1),.footer-grid details:nth-of-type(2),.footer-grid details:nth-of-type(3),.footer-grid details:nth-of-type(4){position:absolute;left:24.375em;width:16.125em;height:1.75em;margin:0;padding:0}
  .footer-grid details:nth-of-type(1){top:11em}
  .footer-grid details:nth-of-type(2){top:13.925em}
  .footer-grid details:nth-of-type(3){top:16.9375em}
  .footer-grid details:nth-of-type(4){top:19.775em}
  .footer-grid summary{height:1.75em;margin:0;font-size:1em;line-height:1.75}
  .footer-grid summary:after{width:1em;height:1em;flex:0 0 1em;font-size:1em}
  .footer-grid details a{display:none}
  .footer-bottom{position:absolute;left:50%;top:38em;width:calc(100% - 6em);height:5em;transform:translateX(-50%);margin:0;padding-top:2.25em}
  .footer-bottom p{font-size:1.125em;line-height:1.555556}
  .footer-bottom nav{display:none}
}

/* Figma open-menu layouts and exact exported drip artwork. */
@media(max-width:68.75em){
  .main-nav{isolation:isolate;overflow:hidden}
  .main-nav>*{position:relative;z-index:1}
  .main-nav:after{content:"";position:absolute;z-index:0;left:0;top:73.75dvh;width:71.8125em;height:40.125em;background:url('assets/images/menu-milk-tablet.svg') left top/100% 100% no-repeat;pointer-events:none}
  .menu-toggle[aria-expanded="true"] .menu-icon-open{content:url('assets/icons/menu-open-tablet.svg')}
}

@media(min-width:37.5em) and (max-width:68.75em){
  .site-header:has(.menu-toggle[aria-expanded="true"]),.main-nav{height:100dvh}
  .main-nav{padding:11.25em 6em 0}
  .main-nav-links{gap:2.5em}
  .main-nav a{font-size:1.75em;line-height:1.285714}
  .mobile-legal{gap:1.75em;margin-top:7.5em}
  .mobile-legal a{font-size:1.5em;line-height:1.333333}
  .menu-toggle{right:1.5em;top:1.125em}
}

@media(max-width:37.4375em){
  .main-nav{padding:7.5em 3em 0}
  .main-nav-links{gap:2.25em}
  .main-nav a{font-size:1.5em;line-height:1.333333}
  .mobile-legal{gap:1.5em;margin-top:7.5em}
  .mobile-legal a{font-size:1.25em;line-height:1.4}
  .main-nav:after{top:73.75dvh;left:-.375em;width:39.125em;height:50.8125em;background-image:url('assets/images/menu-milk-mobile.svg')}
  .menu-toggle[aria-expanded="true"] .menu-icon-open{content:url('assets/icons/menu-open-mobile.svg')}
}

/* Keep the desktop newsletter control inside its shell at every zoom level. */
@media(min-width:56.3125em){
  .newsletter{
    overflow-x:clip;
  }

  .newsletter-grid.shell{
    width:min(50em,calc(100% - 3em));
    max-width:none;
  }

  .subscribe-form{
    width:100%;
    max-width:none;
    min-width:0;
    grid-template-columns:1.5em minmax(0,1fr) minmax(13.5em,15.4375em);
    grid-template-rows:1fr;
  }

  .subscribe-form input{
    width:100%;
    min-width:0;
  }

  .subscribe-form .button{
    width:100%;
    max-width:15.4375em;
    height:auto;
    min-height:0;
    min-width:0;
    padding-inline:1em;
    align-self:stretch;
  }
}

/* One shared mobile footer frame on every page. */
@media(max-width:37.4375em){
  .site-footer{position:relative;min-height:52.5rem;padding:0 0 5.25rem;overflow:hidden}
  .site-footer>.footer-grid.shell{width:calc(100% - 4rem);margin:0 auto;padding-top:32.25rem}
  .site-footer>.footer-bottom.shell{
    position:absolute;
    left:2rem;
    right:auto;
    top:auto;
    bottom:0;
    width:calc(100% - 4rem);
    height:5.25rem;
    margin:0;
    padding:1.5rem 0 2rem;
    transform:none
  }
  .site-footer>.footer-bottom.shell p{margin:0;white-space:nowrap}
}

/* Final responsive polish: lighter hero italic, tighter rails, and fluid footer artwork. */
@font-face{
  font-family:FigtreeRegular;
  src:url('assets/fonts/Figtree-Regular.woff2') format('woff2');
  font-style:normal;
  font-weight:400;
  font-display:block;
}

.hero p{
  font-family:FigtreeRegular,Figtree,Arial,sans-serif;
  font-style:italic;
  font-weight:400;
}

@media(min-width:68.8125em){
  .hero-copy{top:14.5em}
}

@media(min-width:56.3125em) and (max-width:68.75em){
  .hero-copy{top:10em}
}

@media(max-width:56.25em){
  .card-rail,.events,.services{
    padding-right:0;
    padding-bottom:0;
  }
}

@media(min-width:37.5em) and (max-width:56.25em){
  .hero-copy{top:10em}


  .site-footer{
    height:auto;
    min-height:39em;
    padding:10em 0 1.5em;
    background:var(--thistle);
  }

  .site-footer .milk{
    background-image:
      url('assets/images/milk.svg'),
      linear-gradient(to bottom,#fff 0,#fff 10.625em,var(--thistle) 10.625em,var(--thistle) 100%);
    background-position:center top,center top;
    background-size:62.5em 34.722222em,100% 100%;
    background-repeat:no-repeat,no-repeat;
  }

  .footer-grid{
    position:relative;
    width:calc(100% - 6em);
    min-height:0;
    height:auto;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-rows:repeat(4,auto);
    gap:1.5em 3em;
    padding:0;
  }

  .footer-brand{
    position:static;
    width:auto;
    height:auto;
    grid-column:1;
    grid-row:1 / span 4;
    display:flex;
    flex-direction:column;
    gap:.75em;
    margin:0;
  }

  .footer-brand>img{
    position:static;
    width:10em;
    height:10em;
    margin:0 0 .5em;
    object-fit:contain;
  }

  .footer-brand a,.footer-brand a:nth-of-type(1),.footer-brand a:nth-of-type(2),.footer-brand a:nth-of-type(3),.footer-brand a:nth-of-type(4){
    position:static;
    width:max-content;
    max-width:100%;
    height:auto;
    margin:0;
    font-size:1em;
    line-height:1.5;
  }

  .footer-grid details,.footer-grid details:nth-of-type(1),.footer-grid details:nth-of-type(2),.footer-grid details:nth-of-type(3),.footer-grid details:nth-of-type(4){
    position:static;
    width:auto;
    height:auto;
    grid-column:2;
    margin:0;
    padding:0;
  }

  .footer-grid summary{
    height:auto;
    min-height:1.75em;
    margin:0;
  }

  .footer-bottom{
    position:relative;
    left:auto;
    top:auto;
    width:calc(100% - 6em);
    height:auto;
    transform:none;
    margin:2em auto 0;
    padding:1.5em 0 0;
  }

  .footer-bottom p{
    margin:0;
    font-size:.875em;
    line-height:1.428571;
  }
}

@media(max-width:37.4375em){
  .site-footer{
    min-height:0;
    padding:6.5em 0 2em;
  }

  .site-footer .milk{
    background-color:#fff;
    background-image:url('assets/images/milk.svg');
    background-position:center top;
    background-size:50em 27.777778em;
    background-repeat:no-repeat;
  }

  .footer-grid{
    width:calc(100% - 4em);
    max-width:21.125em;
    min-height:0;
    padding-top:23.75em;
  }

  .footer-brand{width:100%}

  .footer-grid details,.footer-grid details:nth-of-type(1),.footer-grid details:nth-of-type(2),.footer-grid details:nth-of-type(3),.footer-grid details:nth-of-type(4){width:100%}

  .footer-bottom{
    width:calc(100% - 2em);
    max-width:21.125em;
    height:auto;
    margin:2em auto 0;
    padding:1.5em 0 0;
  }

  .footer-bottom p{
    font-size:.96em;
    line-height:1.5;
    white-space:nowrap;
  }

  .outline-link{
    width:100%;
    max-width:none;
    height:2.777778em;
    min-height:2.777778em;
    justify-content:center;
    gap:.555556em;
    padding:0 .888889em 0 1.333333em;
    border-width:.055556em;
    border-radius:.888889em;
    font-size:1.125em;
    font-weight:700;
    line-height:1.555556;
  }

  .outline-link img{
    width:1.333333em;
    height:1.333333em;
    flex:0 0 1.333333em;
  }
}

/* Fluid open-menu spacing keeps the Figma rhythm across viewport heights. */
@media(min-width:37.5em) and (max-width:68.75em){
  .main-nav{
    padding:
      clamp(8em,15.9dvh,11.25em)
      clamp(3em,12.9vw,6em)
      clamp(10em,calc(45dvh - 13.125em),18.75em);
  }

  .main-nav-links{gap:clamp(2em,3.53dvh,2.5em)}

  .mobile-legal{
    gap:clamp(1.5em,2.47dvh,1.75em);
    margin-top:clamp(5em,10.6dvh,7.5em);
  }

  .main-nav:after{
    top:auto;
    bottom:0;
    left:0;
    width:71.8125em;
    height:clamp(10em,calc(45dvh - 13.125em),18.75em);
    background-size:71.8125em 40.125em;
  }
}

@media(max-width:37.4375em){
  .main-nav{
    padding:
      clamp(6em,15.5dvh,7.5em)
      clamp(2em,12vw,3em)
      clamp(5em,calc(44dvh - 10.5em),15em);
  }

  .main-nav-links{gap:clamp(1.5em,4.65dvh,2.25em)}

  .mobile-legal{
    gap:clamp(1.125em,3.1dvh,1.5em);
    margin-top:clamp(4em,calc(20dvh - 4.1em),7.5em);
  }

  .main-nav:after{
    top:auto;
    bottom:0;
    left:-.375em;
    width:39.125em;
    height:clamp(5em,calc(44dvh - 10.5em),15em);
    background-size:39.125em 50.8125em;
  }
}

/* Fluid menu interaction using the supplied Figma icon artwork. */
@media(max-width:68.75em){
  .menu-toggle{
    transition:transform .2s ease;
    -webkit-tap-highlight-color:transparent;
  }

  .menu-toggle:active{transform:scale(.94)}

  .menu-toggle .menu-icon-closed,.menu-toggle .menu-icon-open,.menu-toggle[aria-expanded="true"] .menu-icon-closed,.menu-toggle[aria-expanded="true"] .menu-icon-open{
    display:block;
    opacity:1;
    transform:rotate(0) scale(1);
    transition:
      opacity .22s ease,
      transform .48s cubic-bezier(.22,1,.36,1);
    will-change:opacity,transform;
  }

  .menu-toggle .menu-icon-open{
    opacity:0;
    transform:rotate(-90deg) scale(.72);
  }

  .menu-toggle[aria-expanded="true"] .menu-icon-closed{
    opacity:0;
    transform:rotate(90deg) scale(.72);
  }

  .menu-toggle[aria-expanded="true"] .menu-icon-open{
    opacity:1;
    transform:rotate(0) scale(1);
  }

  .main-nav,.main-nav.is-open{
    display:flex;
  }

  .main-nav{
    visibility:hidden;
    opacity:0;
    pointer-events:none;
    clip-path:inset(0 0 100% 0);
    transform:translateY(-.75em);
    transition:
      visibility 0s linear .58s,
      opacity .32s ease,
      clip-path .58s cubic-bezier(.22,1,.36,1),
      transform .58s cubic-bezier(.22,1,.36,1);
    will-change:opacity,clip-path,transform;
  }

  .main-nav.is-open{
    visibility:visible;
    opacity:1;
    pointer-events:auto;
    clip-path:inset(0);
    transform:translateY(0);
    transition-delay:0s;
  }

  .main-nav-links a,.mobile-legal a{
    opacity:0;
    transform:translateY(.75em);
    transition:
      opacity .32s ease,
      color .25s ease,
      transform .48s cubic-bezier(.22,1,.36,1);
  }

  .main-nav.is-open .main-nav-links a,.main-nav.is-open .mobile-legal a{
    opacity:1;
    transform:translateY(0);
  }

  .main-nav.is-open .main-nav-links a:nth-child(1){transition-delay:.1s}
  .main-nav.is-open .main-nav-links a:nth-child(2){transition-delay:.15s}
  .main-nav.is-open .main-nav-links a:nth-child(3){transition-delay:.2s}
  .main-nav.is-open .main-nav-links a:nth-child(4){transition-delay:.25s}
  .main-nav.is-open .mobile-legal a:nth-child(1){transition-delay:.3s}
  .main-nav.is-open .mobile-legal a:nth-child(2){transition-delay:.35s}
  .main-nav.is-open .mobile-legal a:nth-child(3){transition-delay:.4s}

  .main-nav:after{
    opacity:0;
    transform:translateY(2em);
    transition:
      opacity .4s ease .12s,
      transform .68s cubic-bezier(.22,1,.36,1) .12s;
    will-change:opacity,transform;
  }

  .main-nav.is-open:after{
    opacity:1;
    transform:translateY(0);
  }
}

@media(prefers-reduced-motion:reduce){
  .menu-toggle,.menu-toggle .menu-icon,.main-nav,.main-nav:after,.main-nav-links a,.mobile-legal a{
    transition-duration:.01s;
    transition-delay:0s;
  }
}

/* Let the menu surface provide the visible fade instead of an instant header fill. */
@media(max-width:68.75em){
  .site-header{transition:background-color .32s ease}
  .site-header:has(.menu-toggle[aria-expanded="true"]){background:transparent}
  .main-nav{background-color:#000}
}

/* Consistent scroll-rail gutters, end spacing, and breathing room below. */
@media(max-width:37.4375em){
  .section>.shell{width:calc(100% - 4em)}

  /* Keep the longest service copy from consuming the CTA's bottom inset. */
  .service-card{
    display:flex;
    flex-direction:column;
    padding-bottom:1.5em;
  }

  .service-card .card-body{
    display:flex;
    min-height:0;
    flex:1;
    flex-direction:column;
  }

  .service-card .button{margin-top:auto}

  .card-rail,.events,.services{
    width:calc(100vw - 2em);
    margin-left:0;
    padding:0 0 1.5em;
    scroll-padding-inline:0;
  }

  .card-rail:after{
    content:"";
    display:block;
    width:2em;
    height:.0625em;
    flex:0 0 2em;
  }
}

/* Content-responsive service cards: equal rows without an artificial CTA gap. */
@media(max-width:84.9375em){
  .services{
    height:auto;
    align-items:stretch;
  }

  .service-card{
    display:flex;
    height:auto;
    min-height:0;
    flex-direction:column;
    padding-bottom:1.5em;
  }

  .service-card .card-body{
    display:flex;
    min-height:0;
    flex:1;
    flex-direction:column;
  }

  .service-card p{margin-bottom:2em}
  .service-card .button{margin-top:auto}
}

@media(min-width:37.5em) and (max-width:56.25em){
  .card-rail,.events,.services{
    width:calc(100vw - 3em);
    margin-left:0;
    padding:0 0 1.5em;
    scroll-padding-inline:0;
  }

  .card-rail:after{
    content:"";
    display:block;
    width:3em;
    height:.0625em;
    flex:0 0 3em;
  }
}

@media(min-width:56.3125em) and (max-width:68.75em){
  .section>.shell,.about-section>.shell,.site-footer>.shell{
    width:calc(100% - 9em);
    max-width:none;
  }

  .newsletter-grid.shell{width:min(50em,calc(100% - 9em))}

  .card-rail,.events,.services{
    width:calc(100vw - 4.5em);
    margin-left:0;
    padding:0 0 1.5em;
    scroll-padding-inline:0;
  }

  .card-rail:after{
    content:"";
    display:block;
    width:4.5em;
    height:.0625em;
    flex:0 0 4.5em;
  }
}

@media(min-width:68.8125em) and (max-width:84.9375em){
  .section>.shell,.about-section>.shell,.site-footer>.shell{
    width:calc(100% - 10em);
    max-width:none;
  }

  .newsletter-grid.shell{width:min(50em,calc(100% - 10em))}
}

/* One professional gutter system for landscape tablets and compact desktops. */
@media(min-width:56.3125em) and (max-width:84.9375em){
  :root{
    --responsive-gutter:clamp(4.5em,6.25vw,5em);
    --responsive-inline-space:clamp(9em,12.5vw,10em);
  }

  .shell,.section>.shell,.about-section>.shell,.site-footer>.shell,.header-inner.shell{
    width:calc(100% - var(--responsive-inline-space));
    max-width:none;
    margin-inline:auto;
  }

  .header-inner.shell{padding-inline:0}
  .newsletter-grid.shell{width:min(50em,calc(100% - var(--responsive-inline-space)))}
  .footer-bottom.shell{width:calc(100% - var(--responsive-inline-space))}
}

/* Compact-desktop cards scale from their content instead of desktop artboard heights. */
@media(min-width:56.3125em) and (max-width:84.9375em){
  .shows-section,.services-section{
    height:auto;
    min-height:0;
    padding:6em 0;
  }

  .events{
    height:auto;
    align-items:stretch;
  }

  .event-card{
    display:flex;
    height:auto;
    min-height:0;
    flex-direction:column;
    padding-bottom:1.5em;
  }

  .event-card .card-body,.service-card .card-body{
    display:flex;
    min-height:0;
    flex:1;
    flex-direction:column;
    padding:1.25em 1.25em 0;
  }

  .event-card .card-body h3,.service-card .card-body h3{
    font-size:clamp(1.25em,1.9vw,1.5em);
  }

  .event-card .meta:last-of-type{margin-bottom:1.25em}
  .event-card .button{margin-top:auto}
}

@media(min-width:56.3125em) and (max-width:68.75em){
  .card-rail,.events,.services{
    width:calc(100vw - var(--responsive-gutter));
  }

  .card-rail:after{
    width:var(--responsive-gutter);
    flex-basis:var(--responsive-gutter);
  }
}

/* Responsive rails: cards determine the rail height and retain both edge gutters. */
@media(max-width:68.75em){
  .shows-section,.services-section,.reviews-section{
    height:auto;
    min-height:0;
    padding-bottom:5em;
  }

  .card-rail,.events,.services{
    height:auto;
    min-height:0;
    align-items:stretch;
    padding-bottom:2em;
    overflow-x:auto;
    overflow-y:hidden;
    overscroll-behavior-inline:contain;
    scroll-snap-type:x mandatory;
  }

  .card-rail>article,.event-card,.service-card{
    height:auto;
    min-height:0;
    align-self:stretch;
    scroll-snap-align:start;
    scroll-snap-stop:always;
  }

  

  
  .card-rail::-webkit-scrollbar{display:none}
}

@media(min-width:37.5em) and (max-width:68.75em){
  .shows-section,.services-section,.reviews-section{padding-bottom:6em}
}

/* Exact tablet footer composition from Figma node 182:322. */
@media(min-width:37.5em) and (max-width:68.75em){
  .site-footer{
    font-size:min(1em,2.150538vw);
    height:45em;
    min-height:45em;
    padding:6.9375em 0 0;
  }

  .site-footer .milk{
    background-image:url('assets/images/milk.svg');
    background-color:#fff;
    background-position:calc(50% - 4.5em) top;
    background-size:81em 45em;
    background-repeat:no-repeat;
  }

  .footer-grid{
    position:relative;
    width:calc(100% - 6em);
    min-height:0;
    height:21.5em;
    display:block;
    padding:0;
  }

  .footer-brand{
    position:absolute;
    inset:0 auto auto 0;
    width:16.4375em;
    height:21.5em;
    display:block;
    margin:0;
    font-size:1em;
  }

  .footer-brand>img{
    position:absolute;
    left:0;
    top:0;
    width:12.25em;
    height:12.25em;
    object-fit:contain;
    margin:0;
    margin-left:0;
  }

  .footer-brand a,.footer-brand a:nth-of-type(1),.footer-brand a:nth-of-type(2),.footer-brand a:nth-of-type(3),.footer-brand a:nth-of-type(4){
    position:absolute;
    left:0;
    width:max-content;
    height:1.555556em;
    margin:0;
    font-size:1.125em;
    line-height:1.555556;
  }

  .footer-brand a:nth-of-type(1){top:10em}
  .footer-brand a:nth-of-type(2){top:12.444444em}
  .footer-brand a:nth-of-type(3){top:14.888889em}
  .footer-brand a:nth-of-type(4){top:17.333333em}
  .footer-icon{width:1.333333em;height:1.333333em;flex-basis:1.333333em}

  .footer-grid details,.footer-grid details:nth-of-type(1),.footer-grid details:nth-of-type(2),.footer-grid details:nth-of-type(3),.footer-grid details:nth-of-type(4){
    position:relative;
    left:auto;
    top:11em;
    width:16.125em;
    min-height:1.75em;
    height:auto;
    margin:0 0 1.175em auto;
    padding:0;
  }

  .footer-grid summary{
    display:flex;
    justify-content:space-between;
    height:1.75em;
    min-height:1.75em;
    align-items:center;
    margin:0;
    font-size:1em;
    line-height:1.75;
  }

  .footer-grid summary:after{content:"";width:1.25em;height:1.25em;flex:0 0 1.25em;background:url('assets/icons/dropdown.svg') center/contain no-repeat;transform:none;transition:transform .2s ease}
  .footer-grid details[open] summary:after{transform:rotate(180deg)}
  .footer-grid details a{display:block}
  .footer-grid details:not([open]) a{display:none}

  .footer-bottom{
    position:absolute;
    left:50%;
    top:32.25em;
    width:calc(100% - 6em);
    height:5em;
    transform:translateX(-50%);
    margin:0;
    padding-top:2.25em;
  }

  .footer-bottom p{margin:0;font-size:1.125em;line-height:1.555556}
  .footer-bottom nav{display:none}
}

/* Landscape tablets retain the requested 4.5em side gutters. */
@media(min-width:56.3125em) and (max-width:68.75em){
  .footer-grid,.footer-bottom{width:calc(100% - var(--responsive-inline-space))}
}

/* The supplied logo has transparent edge space; this optical offset aligns its artwork. */
@media(max-width:37.4375em){
  .footer-brand>img{left:-1.5em}

  .events:after,.services:after{
    width:max(0em,calc(100% - 20.25em));
    flex-basis:max(0em,calc(100% - 20.25em));
  }

  

}

@media(min-width:37.5em) and (max-width:56.25em){
  .events:after,.services:after{
    width:max(0em,calc(100% - 24.5em));
    flex-basis:max(0em,calc(100% - 24.5em));
  }

  
}

@media(min-width:56.3125em) and (max-width:68.75em){
  .site-footer .milk{background-color:#fff}

  .card-rail,.events,.services{gap:2em}

  .events:after,.services:after{
    width:max(0em,calc(100% - 24.5em));
    flex-basis:max(0em,calc(100% - 24.5em));
  }

  
}

@media(max-width:84.9375em){
  .event-card .meta:last-of-type{margin-bottom:2em}
}

@media(min-width:56.3125em){
  .footer-brand>img{margin-left:-1.5em}
}

@media(min-width:56.3125em) and (max-width:84.9375em){
  .site-footer .milk{background-color:#fff}
}

/* Desktop and compact-desktop cards follow Figma's centered three-column row. */
@media(min-width:68.8125em) and (max-width:84.9375em){
  .card-rail,.events,.services{
    display:grid;
    width:100%;
    margin-left:0;
    padding:0;
    overflow:visible;
    grid-template-columns:repeat(3,minmax(0,1fr));
    scroll-snap-type:none;
  }

  .events,.services{gap:clamp(2.5em,4.166667vw,3.75em)}
  
  .card-rail:after{content:none}

  .event-card,.service-card{
    width:auto;
    min-width:0;
    max-width:none;
    flex:none;
    scroll-snap-align:none;
  }
}

/* Footer labels remain single-line at the Figma menu sizes. */
.footer-grid details:nth-of-type(2) a:first-of-type{white-space:nowrap}

/* Scroll-entry motion is enabled by JavaScript and remains inert without it. */
@media(prefers-reduced-motion:no-preference){
  .reveal-on-scroll{
    opacity:0;
    transform:translateY(1.5em);
    transition:
      opacity .55s ease var(--reveal-delay,0s),
      transform .7s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0s);
    will-change:opacity,transform;
  }

  .reveal-on-scroll.is-visible{
    opacity:1;
    transform:translateY(0);
  }
}

/* Final shared footer geometry: one component, matched to the supplied desktop/tablet/mobile references. */
@media(min-width:37.5em) and (max-width:56.25em){
  .site-footer{height:46.5em;min-height:46.5em;padding-top:14.9375em;padding-bottom:0}
  .site-footer .milk{background-position:center top;background-size:62.5em 46.5em}
  .footer-brand{top:-1.75em}
  .footer-brand>img{top:1em;width:8em;height:8em}
  .footer-brand a:nth-of-type(1){top:11em}
  .footer-brand a:nth-of-type(2){top:13.444444em}
  .footer-brand a:nth-of-type(3){top:15.888889em}
  .footer-brand a:nth-of-type(4){top:18.333333em}
  .footer-grid details,.footer-grid details:nth-of-type(1),.footer-grid details:nth-of-type(2),.footer-grid details:nth-of-type(3),.footer-grid details:nth-of-type(4){top:10.5em}
  .footer-bottom{position:absolute;left:50%;top:39.6875em;width:calc(100% - 6em);transform:translateX(-50%);margin:0;padding-top:2.25em}
}

@media(max-width:37.4375em){
  .site-footer{height:47.6875em;min-height:47.6875em;padding:7.5em 0 0}
  .footer-brand{top:-2.75em}
  .footer-brand>img{left:0;top:.3125em;width:8em;height:8em}
  .footer-brand a:nth-of-type(1){top:9.472222em}
  .footer-brand a:nth-of-type(2){top:11.694444em}
  .footer-brand a:nth-of-type(3){top:13.916667em}
  .footer-brand a:nth-of-type(4){top:16.138889em}
  .footer-grid{gap:1.125em;padding-top:18.75em}
  .footer-bottom{position:absolute;left:50%;top:39.25em;width:calc(100% - 2em);transform:translateX(-50%);margin:0;padding-top:2.125em}
}

/* Small desktops keep the complete desktop footer composition instead of the tablet accordion. */
@media(min-width:68.8125em) and (max-width:84.9375em){
  .site-footer{height:41.5em;min-height:41.5em;padding:12.25em 0 0}
  .site-footer .milk{background-position:center top;background-size:100% 100%;background-repeat:no-repeat}

  .site-footer>.footer-grid.shell{position:relative;display:block;width:calc(100% - var(--responsive-gutter) - 2em);height:22em;margin-left:var(--responsive-gutter);margin-right:2em;padding:0}
  .footer-brand{position:absolute;left:0;top:-2.5em;width:20em;height:22em;display:block}
  .footer-brand>img{position:absolute;left:0;top:1.375em;width:9em;height:9em;margin:0 0 0 -.5em;object-fit:contain}
  .footer-brand a,.footer-brand a:nth-of-type(1),.footer-brand a:nth-of-type(2),.footer-brand a:nth-of-type(3),.footer-brand a:nth-of-type(4){position:absolute;left:0;width:max-content;height:2em;margin:0;font-size:1.125em;line-height:1.555556}
  .footer-brand a:nth-of-type(1){top:9.5em}
  .footer-brand a:nth-of-type(2){top:11.75em}
  .footer-brand a:nth-of-type(3){top:14.5625em}
  .footer-brand a:nth-of-type(4){top:16.8125em}

  .footer-grid details,.footer-grid details:nth-of-type(1),.footer-grid details:nth-of-type(2),.footer-grid details:nth-of-type(3),.footer-grid details:nth-of-type(4){position:absolute;width:21em;height:auto;margin:0;padding:0}
  .footer-grid details:nth-of-type(1){left:22.5em;top:3.375em}
  .footer-grid details:nth-of-type(2){left:auto;right:0;top:3.375em}
  .footer-grid details:nth-of-type(3){left:22.5em;top:10.375em}
  .footer-grid details:nth-of-type(4){left:auto;right:0;top:10.375em}
  .footer-grid summary{height:auto;min-height:0;margin:0 0 .75em;font-size:1em;line-height:1.75em}
  .footer-grid summary:after{display:none}
  .footer-grid details a,.footer-grid details:not([open]) a{display:block;margin:0 0 .25em;padding:0;font-size:1.125em;line-height:1.75em}

  .site-footer>.footer-bottom.shell{position:absolute;left:var(--responsive-gutter);top:36em;width:calc(100% - var(--responsive-gutter) - 2em);height:4.5em;transform:none;margin:0 2em 0 0;padding-top:1.5em}
  .footer-bottom p{margin:0;font-size:1em;line-height:1.75em}
  .footer-bottom nav{display:flex;gap:1.5em}
  .footer-bottom a{font-size:1em;line-height:1.75em;font-weight:600}
}

/* Final background override: scale uniformly at every breakpoint. */
.site-footer>.milk{background-position:center top;background-size:cover;background-repeat:no-repeat}

/* Figma desktop rhythm: add breathing room before the second menu row. */
@media(min-width:68.8125em) and (max-width:84.9375em){
  .footer-grid details:nth-of-type(3),.footer-grid details:nth-of-type(4){top:12.375em}
}

@media(min-width:84.9376em){
  .footer-grid details:nth-of-type(3),.footer-grid details:nth-of-type(4){top:17em}
}

/* Exact mobile footer coordinates from the 402 × 840 Figma component. */
@media(max-width:37.4375em){
  .site-footer{
    position:relative;
    height:52.5rem;
    min-height:52.5rem;
    padding:0
  }
  .site-footer>.milk{
    background-color:transparent;
    background-image:url('assets/images/footer-milk-mobile.svg');
    background-position:center top;
    background-size:100% 100%;
    background-repeat:no-repeat
  }
  .site-footer>.footer-grid.shell{
    position:absolute;
    left:2rem;
    top:0;
    display:block;
    width:calc(100% - 4rem);
    max-width:none;
    height:45rem;
    margin:0;
    padding:0
  }
  .site-footer .footer-brand{
    position:absolute;
    left:0;
    top:0;
    display:block;
    width:100%;
    height:28.25rem;
    margin:0
  }
  .site-footer .footer-brand>img{
    position:absolute;
    left:0;
    top:7.5rem;
    width:9rem;
    height:9rem;
    margin:0
  }
  .site-footer .footer-brand a,.site-footer .footer-brand a:nth-of-type(1),.site-footer .footer-brand a:nth-of-type(2),.site-footer .footer-brand a:nth-of-type(3),.site-footer .footer-brand a:nth-of-type(4){
    position:absolute;
    left:0;
    width:max-content;
    height:1.75rem;
    margin:0;
    font-size:1.125rem;
    line-height:1.555556
  }
  .site-footer .footer-brand a:nth-of-type(1){top:19rem}
  .site-footer .footer-brand a:nth-of-type(2){top:21.5rem}
  .site-footer .footer-brand a:nth-of-type(3){top:24rem}
  .site-footer .footer-brand a:nth-of-type(4){top:26.5rem}
  .site-footer .footer-grid details,.site-footer .footer-grid details:nth-of-type(1),.site-footer .footer-grid details:nth-of-type(2),.site-footer .footer-grid details:nth-of-type(3),.site-footer .footer-grid details:nth-of-type(4){
    position:absolute;
    left:0;
    width:100%;
    height:auto;
    margin:0;
    padding:0
  }
  .site-footer .footer-grid details:nth-of-type(1){top:32.25rem}
  .site-footer .footer-grid details:nth-of-type(2){top:35.5rem}
  .site-footer .footer-grid details:nth-of-type(3){top:38.75rem}
  .site-footer .footer-grid details:nth-of-type(4){top:42rem}
  .site-footer>.footer-bottom.shell{
    position:absolute;
    left:2rem;
    top:47.25rem;
    width:calc(100% - 4rem);
    height:3.25rem;
    transform:none;
    margin:0;
    padding:1.5rem 0 0
  }
  .site-footer .footer-bottom p{
    margin:0;
    font-size:1rem;
    line-height:1.75rem;
    white-space:nowrap
  }
}

/* Shared, responsive home link over the visible footer logo. */
.footer-brand .footer-logo-link{
  position:absolute;
  z-index:3;
  top:0;
  left:0;
  width:12.5em;
  height:12.5em
}
.footer-brand .footer-logo-link a,.footer-brand .footer-logo-link a:nth-of-type(1){
  position:static;
  display:block;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  font-size:0;
  line-height:0
}
.footer-brand .footer-logo-link a:focus-visible{
  border-radius:1rem;
  outline:.125rem solid #000;
  outline-offset:.25rem
}
@media(max-width:37.4375em){
  .footer-brand .footer-logo-link{top:7.5rem;width:9rem;height:9rem}
}
@media(min-width:37.5em) and (max-width:56.25em){
  .footer-brand .footer-logo-link{top:1em;width:8em;height:8em}
}
@media(min-width:56.3125em) and (max-width:68.75em){
  .footer-brand .footer-logo-link{width:12.25em;height:12.25em}
}
@media(min-width:68.8125em) and (max-width:84.9375em){
  .footer-brand .footer-logo-link{top:1.375em;left:-.5em;width:9em;height:9em}
}

/* Center the small-desktop footer on one shared Figma gutter. */
@media(min-width:68.8125em) and (max-width:84.9375em){
  .site-footer>.footer-grid.shell{
    width:calc(100% - (var(--responsive-gutter) * 2));
    margin-left:var(--responsive-gutter);
    margin-right:var(--responsive-gutter)
  }
  .site-footer>.footer-bottom.shell{
    left:var(--responsive-gutter);
    width:calc(100% - (var(--responsive-gutter) * 2));
    margin-right:var(--responsive-gutter)
  }
}

/* Fluid phone layout: preserve the 402px Figma geometry without clipping narrower screens. */
@media(max-width:37.4375em){
  .newsletter-grid.shell{
    width:calc(100% - 4rem);
    max-width:21.125rem
  }
  .newsletter-grid>div,.subscribe-form{width:100%}
  .subscribe-form input{width:calc(100% - 4.75rem)}
  .subscribe-form .button{width:calc(100% - .875rem)}

  .site-footer{
    height:auto;
    min-height:52.5rem;
    padding:0;
    background:var(--thistle)
  }
  .site-footer>.milk{
    background-size:100% 52.5rem
  }
  .site-footer>.footer-grid.shell{
    position:relative;
    left:auto;
    top:auto;
    width:calc(100% - 4rem);
    min-height:47.25rem;
    height:auto;
    margin:0 auto;
    padding:32.25rem 0 0
  }
  .site-footer .footer-grid details,.site-footer .footer-grid details:nth-of-type(1),.site-footer .footer-grid details:nth-of-type(2),.site-footer .footer-grid details:nth-of-type(3),.site-footer .footer-grid details:nth-of-type(4){
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    height:auto;
    margin:0 0 1.5rem;
    padding:0
  }
  .site-footer .footer-grid details:last-of-type{margin-bottom:2rem}
  .site-footer>.footer-bottom.shell{
    position:relative;
    left:auto;
    top:auto;
    width:calc(100% - 4rem);
    min-height:5.25rem;
    height:auto;
    transform:none;
    margin:0 auto;
    padding:1.5rem 0 2rem
  }
}

/* Clear interaction affordances across navigation, CTAs, footer groups, and cards. */
a[href],button,summary,[role="button"]{cursor:pointer}

/* Simple menu motion: one short fade-and-slide with a clean icon crossfade. */
@media(max-width:68.75em){
  .main-nav{
    clip-path:none;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-1rem);
    transition:opacity .25s ease,transform .25s ease,visibility 0s linear .25s
  }
  .main-nav.is-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
    transition-delay:0s
  }
  .main-nav-links a,.mobile-legal a,.main-nav.is-open .main-nav-links a,.main-nav.is-open .mobile-legal a{
    opacity:1;
    transform:none;
    transition:color .2s ease;
    transition-delay:0s
  }
  .main-nav:after,.main-nav.is-open:after{
    opacity:1;
    transform:none;
    transition:none
  }
  .menu-toggle .menu-icon-closed,.menu-toggle .menu-icon-open,.menu-toggle[aria-expanded="true"] .menu-icon-closed,.menu-toggle[aria-expanded="true"] .menu-icon-open{
    transition:opacity .18s ease,transform .25s ease
  }
}

/* Keep every contact icon and its label on one centered row. */
.site-footer .footer-brand>a{
  display:flex;
  flex-flow:row nowrap;
  align-items:center;
  justify-content:flex-start;
  white-space:nowrap
}
.site-footer .footer-brand>a .footer-icon{
  display:block;
  align-self:center;
  margin:0
}
.input-icon{
  display:flex;
  align-items:center;
  justify-content:center
}

/* Preserve the supplied mobile milk artwork's aspect ratio and white cut-outs. */
@media(max-width:37.4375em){
  .site-footer{
    background:linear-gradient(to bottom,#fff 0 7.5rem,var(--thistle) 7.5rem)
  }
  .site-footer>.milk{
    background-color:transparent;
    background-image:url('assets/images/footer-milk-mobile.svg');
    background-position:center top;
    background-size:25.125rem 52.5rem;
    background-repeat:repeat-x
  }
  /* Use a real grid row for the field so the icon and text share one centerline. */
  .subscribe-form{
    display:grid;
    grid-template-columns:2rem minmax(0,1fr);
    grid-template-rows:4.25rem 3.75rem;
    gap:0 .75rem;
    align-items:center;
    padding:.5rem
  }
  .subscribe-form .input-icon{
    position:static;
    grid-column:1;
    grid-row:1;
    width:2rem;
    height:2rem;
    margin-left:.25rem
  }
  .subscribe-form .input-icon img{width:1.5rem;height:1.5rem}
  .subscribe-form input{
    position:static;
    grid-column:2;
    grid-row:1;
    align-self:center;
    width:100%;
    height:2rem;
    padding:0;
    line-height:2rem
  }
  .subscribe-form .button{
    position:static;
    grid-column:1/-1;
    grid-row:2;
    align-self:stretch;
    width:100%;
    height:3.75rem;
    min-height:3.75rem
  }
}

/* Final mobile rail geometry: cards always snap inside equal viewport gutters. */
@media(max-width:37.4375em){
  .card-rail,.events,.services{
    width:100vw;
    max-width:none;
    margin-left:-2rem;
    padding:0 2rem 2rem;
    scroll-padding-inline:2rem;
  }
  .card-rail:after{content:none}
  .event-card,.service-card{
    flex:0 0 min(22.5rem,calc(100vw - 4rem));
    width:min(22.5rem,calc(100vw - 4rem));
    min-width:min(22.5rem,calc(100vw - 4rem));
    max-width:min(22.5rem,calc(100vw - 4rem));
  }
  .event-card>img,.service-card>img{
    width:100%;
    height:auto;
    aspect-ratio:1;
    object-fit:cover
  }
}

/* Final shared tablet geometry: a consistent 48px Figma gutter. */
@media(min-width:37.5em) and (max-width:56.25em){
  :root{--tablet-page-gutter:3rem}
  .shell,.section>.shell,.hero-inner.shell,.about-section>.shell,.newsletter-grid.shell,.content-hero>.shell,.content-details>.shell,.site-footer>.footer-grid.shell,.site-footer>.footer-bottom.shell{
    width:calc(100% - (var(--tablet-page-gutter) * 2));
    max-width:none;
    margin-left:auto;
    margin-right:auto
  }
}

/* Fluid tablet Ticket Alerts: balanced gaps without fixed-height empty space. */
@media(min-width:37.5em) and (max-width:68.75em){
  .newsletter{
    height:auto;
    min-height:0;
    padding:clamp(4rem,7vw,5rem) 0 clamp(4.5rem,8vw,5.5rem)
  }
  .newsletter-grid.shell{
    display:flex;
    width:min(50rem,calc(100% - 6rem));
    height:auto;
    flex-direction:column;
    align-items:center;
    gap:clamp(2rem,4vw,2.5rem)
  }
  .newsletter-grid>div{width:100%;text-align:center}
  .newsletter-grid .subscribe-form{width:100%;margin:0}
}

/* Exact homepage mobile show-card geometry from Figma node 127:210.
   Image/button sizing below is fluid (100% of the card's own content
   box) rather than the original hardcoded px, so it always fills
   exactly to the card's inner edge regardless of the card's border
   width -- see the "invisible" 4px hover border added to .event-card
   in custom.css, which the original fixed 18.75rem figure didn't
   account for and which pushed the image 8px past the card's right
   edge (touching/clipping it) on every phone. Card height is a floor
   (min-height), not a fixed height, so a longer real title/venue than
   the Figma mockup's sample text grows the card instead of overlapping
   the meta rows and clipping the button against the card's
   overflow:hidden edge. */
@media(max-width:37.4375em){
  .shows-section .events{
    width:100vw;
    margin-left:-2rem;
    padding:0 1.5rem 2rem;
    gap:1rem;
    scroll-padding-inline:1.5rem
  }
  .shows-section .event-card{
    display:flex;
    flex:0 0 19.25rem;
    width:19.25rem;
    min-width:19.25rem;
    max-width:19.25rem;
    height:auto;
    min-height:35.5rem;
    align-self:flex-start;
    flex-direction:column;
    padding:0 .25rem 1.5rem;
    border-radius:2rem
  }
  .shows-section .event-date{
    display:flex;
    height:3rem;
    min-height:3rem;
    flex:0 0 3rem;
    align-items:center;
    justify-content:center;
    padding:0;
    font-size:1rem;
    line-height:1.5rem
  }
  .shows-section .event-card>.event-image-link,.shows-section .event-card>img{
    display:block;
    width:100%;
    aspect-ratio:1;
    flex:0 0 auto;
    border-radius:1.5rem;
    overflow:hidden
  }
  .shows-section .event-card>.event-image-link>img,.shows-section .event-card>img{
    width:100%;
    height:100%;
    aspect-ratio:1;
    object-fit:cover;
    border-radius:1.5rem
  }
  .shows-section .event-card .card-body{
    display:flex;
    min-height:0;
    flex:1;
    flex-direction:column;
    padding:1.25rem 1.25rem 0
  }
  .shows-section .event-card .card-body h3{
    min-height:3rem;
    margin:0 0 .75rem;
    font-size:1.25rem;
    line-height:1.5rem;
    letter-spacing:-.0125rem
  }
  .shows-section .event-card .meta{
    gap:.5rem;
    margin:0 0 .5rem;
    font-size:.875rem;
    line-height:1.125rem;
    letter-spacing:-.00875rem
  }
  .shows-section .event-card .meta img{width:1.25rem;height:1.25rem}
  .shows-section .event-card .meta:last-of-type{margin-bottom:1rem}
  .shows-section .event-card .button{
    width:100%;
    height:3rem;
    min-height:3rem;
    margin-top:auto;
    border-radius:.875rem;
    font-size:.875rem
  }
}

/* Final tablet homepage: compact About spacing and fully visible snapped cards. */
@media(min-width:37.5em) and (max-width:68.75em){
  .about-section{height:auto;min-height:0;padding:6em 0}
  .events{scroll-snap-type:x mandatory;scroll-padding-inline-start:0}
  .events .event-card{scroll-snap-align:start;scroll-snap-stop:always}
  .events .event-card>.event-image-link{
    display:block;
    width:22em;
    height:22em;
    min-height:22em;
    flex:0 0 22em;
    overflow:hidden;
    border-radius:1.5em
  }
  .events .event-card>.event-image-link>img{
    display:block;
    width:100%;
    height:100%;
    max-width:none;
    object-fit:cover;
    object-position:center;
    border-radius:1.5em
  }
}

/* Exact tablet slider viewport from Figma 182:322: 48px start, full width, no tail. */
@media(min-width:37.5em) and (max-width:56.25em){
  .card-rail,.events,.services{
    width:calc(100vw - 3em);
    max-width:none;
    margin-left:0;
    margin-right:0;
    padding:0;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-padding-inline:0;
    scroll-snap-type:x mandatory;
    overscroll-behavior-inline:contain
  }
  .events,.services{gap:2em}
  
  .card-rail:after,.events:after,.services:after{content:none!important;display:none!important;width:0!important;flex-basis:0!important}
  .card-rail>article,.events>article,.services>article{margin-inline:0;scroll-snap-align:start;scroll-snap-stop:always}
}

/* Tablet sliders use two complete mobile-proportioned cards per viewport. */
@media(min-width:37.5em) and (max-width:56.25em){
  .card-rail,.events,.services{
    width:100%;
    max-width:100%;
    margin-inline:0;
    padding:0 0 2rem;
    gap:2rem;
    scroll-padding-inline:0
  }
  .card-rail>article,.events>article,.services>article,.event-card,.service-card{
    flex:0 0 calc((100% - 2rem)/2);
    width:calc((100% - 2rem)/2);
    min-width:calc((100% - 2rem)/2);
    max-width:calc((100% - 2rem)/2)
  }
  .event-card,.service-card{height:auto;min-height:0;aspect-ratio:auto}
  .event-card>.event-image-link,.event-card>img,.service-card>img{
    width:100%;
    height:auto;
    min-height:0;
    aspect-ratio:1;
    object-fit:cover;
    flex:0 0 auto
  }
  .event-card>.event-image-link{display:block;overflow:hidden}
  .events .event-card>.event-image-link{
    width:100%;
    height:auto;
    min-height:0;
    aspect-ratio:1
  }
  .event-card>.event-image-link>img{
    width:100%;
    height:100%;
    object-fit:cover
  }
  .card-rail,.events,.services{overflow-y:visible}
}

/* Landscape tablet: lower the footer content to balance the remaining bottom space. */
@media(min-width:56.3125em) and (max-width:68.75em){
  .site-footer>.footer-grid.shell{transform:translateY(3.5rem)}
  .site-footer>.footer-bottom.shell{transform:translate(-50%,3.5rem)}
}

/* Tablet homepage: native swipe rail, no added controls, equal linked images. */
@media(min-width:37.5em) and (max-width:56.25em){
  .events .event-card>.event-image-link{
    width:100%;
    height:auto;
    min-height:0;
    aspect-ratio:1;
    flex:0 0 auto
  }
}