@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&family=Orbitron:wght@400;500;600;700;800&display=swap');
:root{--bg:#09090b;--panel:#131316;--fg:#f4f1ec;--muted:#a8a5a2;--line:rgba(255,255,255,.14);--red:#e21b2d;--gold:#c8a564;--max:1180px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.65 'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}.header{height:82px;padding:0 max(5vw,22px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px}.brand>b{width:38px;height:38px;border:1px solid var(--red);display:grid;place-items:center;font:800 22px Manrope}.brand strong{display:block;font:800 20px Manrope;letter-spacing:.13em;line-height:1}.brand small{display:block;color:var(--gold);font-size:8px;letter-spacing:.2em;margin-top:6px}nav{display:flex;gap:34px}nav a{font-size:13px;color:#c7c4c1}nav a:hover,nav a.active{color:#fff}nav a.active:after{content:'';display:block;height:2px;background:var(--red);margin-top:7px}.toggle{display:none}.hero{max-width:1500px;margin:auto;padding:70px max(5vw,24px);display:grid;grid-template-columns:.9fr 1.1fr;gap:5vw;align-items:center}.hero-copy{padding-left:2vw}.eyebrow{font-size:10px;letter-spacing:.18em;font-weight:700;color:var(--gold);margin:0 0 18px}.eyebrow:first-letter{color:var(--red)}h1,h2{font-family:Manrope,Arial,sans-serif;font-weight:500;letter-spacing:-.045em;line-height:1.08}h1{font-size:clamp(44px,5.5vw,74px);margin:0 0 24px}h1 em,h2 em{font-style:normal;color:var(--gold)}.hero-copy>p:not(.eyebrow){color:#c4c0bd;max-width:410px;font-size:17px}.actions{display:flex;align-items:center;gap:24px;margin-top:30px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 17px;background:var(--red);color:#fff;font-weight:700;font-size:12px;gap:15px;border:0;cursor:pointer}.btn:hover{background:#f02b3e}.btn.light{background:var(--fg);color:#111}.link{font-size:12px;font-weight:600}.link:hover{color:var(--gold)}.hero-image{border:1px solid var(--line);display:block;box-shadow:0 25px 80px #0008}.hero-image img{display:block;width:100%;height:auto}.intro,.social{max-width:var(--max);margin:auto;padding:80px 28px;display:grid;grid-template-columns:1fr .8fr;gap:10vw;border-top:1px solid var(--line)}h2{font-size:clamp(34px,4.2vw,54px);margin:0}.intro>div:nth-child(2){align-self:center;color:#c4c0bd;max-width:470px}.intro .link{display:inline-block;margin-top:12px;color:var(--fg)}.banner{min-height:300px;padding:58px max(10vw,35px);display:flex;align-items:center;background:linear-gradient(100deg,#080809ed,#08080977),url('/assets/scala-event-scena-desktop.webp') center/cover;border-block:1px solid var(--line)}.banner h2{font-size:clamp(35px,4.4vw,56px);margin:0 0 24px}.social{display:flex;justify-content:space-between;align-items:center}.social-links{width:min(420px,44%);border-top:1px solid var(--line)}.social-links a{display:flex;justify-content:space-between;padding:17px 0;border-bottom:1px solid var(--line)}.social-links b{color:var(--gold)}footer{border-top:1px solid var(--line);padding:23px max(5vw,22px);display:flex;align-items:center;justify-content:space-between;gap:18px;color:var(--muted);font-size:11px}.footbrand{font:800 16px Manrope;letter-spacing:.1em;color:var(--fg)}.footbrand span{font-size:9px;color:var(--gold)}footer div{display:flex;gap:18px}.heading{max-width:var(--max);margin:auto;padding:78px 28px 44px}.heading h1{font-size:clamp(46px,6.2vw,78px)}.heading>p:last-child{max-width:610px;color:#c4c0bd}.events{max-width:var(--max);margin:auto;padding:0 28px 45px}.event{display:grid;grid-template-columns:84px 1fr auto;gap:28px;align-items:center;padding:25px 0;border-top:1px solid var(--line)}.event:last-child{border-bottom:1px solid var(--line)}.date{height:87px;width:76px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex-direction:column}.date span{color:var(--gold);font-size:9px;letter-spacing:.15em}.date strong{font:600 34px Manrope;line-height:1.1}.date small{font-size:9px;color:var(--muted)}.event-copy .eyebrow{font-size:9px;margin:0 0 3px}.event-copy h2{font-size:24px;margin:0 0 6px;letter-spacing:-.02em}.event-copy>p:not(.eyebrow){font-size:13px;color:#c4c0bd;margin:0 0 9px}.event-copy>small{font-size:10px;color:var(--muted)}.event-note{max-width:var(--max);margin:auto;padding:0 28px 80px;display:flex;justify-content:space-between;color:var(--muted);font-size:12px}.contact{max-width:var(--max);margin:auto;padding:20px 28px 90px;display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw}.contact-copy h2{font-size:clamp(32px,3.7vw,46px)}.contact-copy>p:not(.eyebrow){max-width:410px;color:#c4c0bd;font-size:13px;margin:20px 0}.contact address{font-style:normal;color:var(--muted);font-size:13px;line-height:1.7;margin-top:30px}.contact address strong{color:var(--fg)}.contact address a,.contact-social a{color:var(--gold);display:inline-block;margin-top:8px;font-size:12px}.contact-social{display:flex;gap:18px}.form{background:var(--panel);padding:28px;border:1px solid var(--line)}.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form label{display:block;font-size:11px;font-weight:600;color:#ddd9d3;margin-bottom:16px}.form input,.form select,.form textarea{display:block;width:100%;margin-top:6px;padding:11px 12px;background:#0b0b0d;color:var(--fg);border:1px solid #ffffff26;border-radius:0;font:13px 'DM Sans',sans-serif}.form input:focus,.form select:focus,.form textarea:focus{outline:1px solid var(--gold)}.form textarea{resize:vertical}.status{font-size:11px;color:var(--gold);margin-bottom:0}@media(max-width:850px){.hero{grid-template-columns:1fr;gap:35px}.hero-copy{padding:0}.hero-image{max-width:740px}.intro{gap:5vw}.event{grid-template-columns:70px 1fr;gap:20px}.event>.btn{grid-column:2;justify-self:start}.contact{gap:5vw}}@media(max-width:620px){.header{height:70px;padding:0 18px}.brand>b{width:33px;height:33px}.brand strong{font-size:17px}.brand small{font-size:7px}.toggle{display:block;background:transparent;border:1px solid var(--line);color:#fff;padding:7px 11px}nav{display:none;position:absolute;z-index:5;top:69px;left:0;right:0;background:#111114;padding:17px 22px 22px;flex-direction:column;gap:13px;border-bottom:1px solid var(--line)}nav.open{display:flex}nav a.active:after{display:none}.hero{padding:45px 19px 52px}.hero h1{font-size:47px}.hero-copy>p:not(.eyebrow){font-size:15px}.actions{align-items:flex-start;flex-direction:column;gap:16px}.intro,.social{padding:57px 20px;grid-template-columns:1fr;gap:22px}.intro h2,.social h2{font-size:38px}.banner{padding:45px 22px;min-height:275px}.heading{padding:60px 20px 32px}.heading h1{font-size:48px}.events{padding:0 20px 38px}.event{grid-template-columns:56px 1fr;gap:12px;padding:20px 0}.date{width:55px;height:70px}.date strong{font-size:28px}.event-copy h2{font-size:20px}.event-copy>p:not(.eyebrow){font-size:12px}.event>.btn{font-size:11px;padding:11px 13px}.event-note{padding:0 20px 60px;flex-direction:column;gap:7px}.contact{grid-template-columns:1fr;padding:8px 20px 60px}.form{padding:21px 16px}.grid{grid-template-columns:1fr;gap:0}footer{padding:21px 18px;display:grid;grid-template-columns:1fr auto;gap:8px}footer>span{grid-column:1/-1;grid-row:2}footer div{justify-content:flex-end}}
/* Clearer type hierarchy and balanced page spacing across devices. */
h1{font-size:clamp(40px,4.7vw,62px);margin-bottom:18px}
h2{font-size:clamp(30px,3.2vw,42px)}
nav a{font-size:14px}
.hero{gap:4vw}
.hero h1{font-size:clamp(42px,4.8vw,64px)}
.intro,.social{padding-block:68px}
.banner h2{font-size:clamp(32px,3.7vw,46px)}
.heading{padding:62px 28px 38px}
.heading h1{font-size:clamp(40px,4.8vw,62px)}
.heading>p:last-child{margin-top:14px;line-height:1.7}
.event-copy h2{font-size:22px;line-height:1.2}
.contact-copy h2{font-size:clamp(30px,3.2vw,40px)}
@media(min-width:621px) and (max-width:980px){
  .header{height:76px}
  nav{gap:22px}
  .hero{padding-block:52px;grid-template-columns:.92fr 1.08fr}
  .hero-copy>p:not(.eyebrow){font-size:15px}
  .intro,.social{gap:5vw;padding-block:56px}
  .heading{padding-top:52px}
  .contact{grid-template-columns:1fr;gap:32px;padding-top:12px}
}
@media(max-width:850px){
  .hero{grid-template-columns:1fr;gap:30px}
  .hero-image{max-width:none}
  .intro h2,.social h2{font-size:clamp(30px,4.2vw,40px)}
}
@media(max-width:620px){
  nav a{font-size:14px}
  .hero{padding:40px 19px 46px}
  .hero h1{font-size:clamp(38px,10vw,46px);margin-bottom:14px}
  .eyebrow{margin-bottom:13px}
  .intro,.social{padding-block:48px;gap:18px}
  .intro h2,.social h2{font-size:32px}
  .banner h2{font-size:34px}
  .heading{padding:48px 20px 28px}
  .heading h1{font-size:clamp(38px,9vw,46px);margin-bottom:14px}
  .event-copy h2{font-size:19px}
  .contact{padding-top:4px}
  .contact-copy h2{font-size:30px}
}

/* Full program list with native, keyboard-accessible event disclosures. */
.program-events{max-width:var(--max);margin:0 auto;padding:0 28px 46px}
.program-event{display:grid;grid-template-columns:112px minmax(0,1fr) auto;grid-template-areas:"poster copy actions";gap:18px;align-items:center;padding:22px 0;border-top:1px solid var(--line)}
.program-event:last-child{border-bottom:1px solid var(--line)}
.program-event .date{display:none}
.event-details{grid-area:copy;min-width:0}
.event-details summary{cursor:pointer;list-style:none;display:block}
.event-details summary::-webkit-details-marker{display:none}
.event-details summary:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
.event-poster{grid-area:poster;position:relative;display:block;width:112px;height:112px;overflow:hidden;border:1px solid rgba(255,255,255,.18);border-radius:5px;background:#050608;box-shadow:0 4px 16px rgba(0,0,0,.38)}
.event-poster img{display:block;width:100%;height:100%;object-fit:contain}
.poster-date{position:absolute;z-index:1;top:5px;left:5px;display:flex;flex-direction:column;align-items:center;min-width:36px;padding:5px 6px 4px;background:rgba(6,7,10,.88);border:1px solid rgba(255,255,255,.3);border-radius:3px;color:#fff;text-align:center;line-height:1.05;box-shadow:0 2px 8px #0008}
.poster-date span{color:var(--gold);font-size:7px;letter-spacing:.12em;font-weight:700}
.poster-date strong{font:700 18px/1.05 Manrope,Arial,sans-serif}
.poster-date small{font-size:6px;color:#dedbd7}
.event-poster:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.event-poster-program{aspect-ratio:1/1;box-shadow:0 4px 16px rgba(0,0,0,.38)}
.event-poster-program img{height:100%;object-fit:contain}
.event-summary-copy{min-width:0}
.program-event .eyebrow{font-size:9px;margin:0 0 5px}
.program-event h2{font-size:22px;line-height:1.2;margin:0 0 6px;letter-spacing:-.02em}
.event-teaser{font-size:13px;color:#c4c0bd;margin:0 0 7px;line-height:1.55}
.details-hint{display:inline-flex;align-items:center;gap:8px;color:var(--gold);font-size:11px;font-weight:600}
.details-hint b{font-size:14px;transition:transform .2s ease}
.event-details[open] .details-hint b{transform:rotate(45deg)}
.event-more{padding:12px 14px;margin-top:11px;background:var(--panel);border-left:2px solid var(--gold);color:#c4c0bd;font-size:12px;line-height:1.65}
.event-more p{margin:0 0 8px}
.event-more a{color:var(--gold);font-weight:600}
.event-actions{grid-area:actions;display:flex;flex-direction:column;align-items:flex-end;gap:9px;min-width:136px}
.event-actions small{color:var(--muted);font-size:10px;text-align:right}
.program-event .btn{white-space:nowrap;padding:11px 13px;font-size:11px}
.lalka-program-event .lalka-poster{width:106px;height:142px}
.lalka-poster img{object-fit:contain}
.lalka-ticket-section{max-width:var(--max);margin:0 auto 80px;padding:0 28px}
.lalka-ticket-section h2{font-size:clamp(28px,3vw,40px);margin:0 0 12px}
.lalka-ticket-section>p{max-width:700px;color:#c4c0bd;font-size:14px}
.lalka-ticket-links{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.lalka-consent{margin-top:22px;padding:18px 20px;background:var(--panel);border:1px solid var(--line)}
.lalka-consent p{margin:10px 0 0;color:var(--muted);font-size:12px}
.lalka-consent p a{color:var(--gold);font-weight:600}
.lalka-embed{margin-top:24px;padding:24px;background:var(--panel);border:1px solid var(--line);min-height:130px}
.lalka-embed iframe{max-width:100%}
.lalka-fallback{margin-top:18px}
.lalka-event-info{max-width:var(--max);margin:auto;padding:0 28px 52px;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.lalka-event-info>div{padding:20px 22px;border:1px solid var(--line);background:var(--panel)}
.lalka-event-info h2{font-size:19px;margin:0 0 8px}
.lalka-event-info p{margin:0;color:#c4c0bd;font-size:13px}
.lalka-program-event .event-details{grid-area:copy}
.ticket-pending{color:var(--muted);font-size:10px;text-align:right}
.program-poster-inline{max-width:var(--max);margin:0 auto 54px;padding:0 28px;text-align:center}
.program-poster-inline img{display:block;width:min(100%,467px);height:auto;margin:0 auto;border:1px solid var(--line)}
.program-next{max-width:var(--max);margin:0 auto 42px;padding:22px 28px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1fr) 180px;gap:24px;align-items:center}
.program-next .event-poster{grid-area:auto;width:180px;height:220px}
.program-next-copy h2{font-size:24px;line-height:1.2;margin:0 0 8px}
.program-next-copy p:not(.eyebrow){color:#c4c0bd;font-size:13px}
@media(max-width:850px){
  .program-events{padding-inline:24px}
  .program-event{grid-template-columns:98px minmax(0,1fr) auto;gap:12px}
  .event-poster{width:98px;height:98px}
  .event-actions{min-width:116px}
}
@media(max-width:620px){
  .program-events{padding:0 20px 38px}
  .program-event{grid-template-columns:72px minmax(0,1fr);grid-template-areas:"poster copy" ". actions";gap:9px 12px;padding:18px 0}
  .event-poster{width:72px;height:72px}
  .poster-date{top:3px;left:3px;min-width:29px;padding:3px 4px}
  .poster-date span{font-size:6px}
  .poster-date strong{font-size:14px}
  .poster-date small{font-size:5px}
  .program-event h2{font-size:18px}
  .event-teaser{font-size:12px}
  .event-more{font-size:11px;padding:10px 11px}
  .event-actions{min-width:0;flex-direction:row;align-items:center;justify-content:space-between;gap:8px}
  .event-actions small{text-align:left}
  .ticket-pending{text-align:left}
  .program-event .btn{padding:10px 11px;font-size:10px}
  .lalka-program-event .lalka-poster{width:72px;height:96px}
  .lalka-ticket-section{padding:0 20px;margin-bottom:54px}
  .lalka-embed{padding:14px;min-height:110px}
  .lalka-event-info{padding:0 20px 38px;grid-template-columns:1fr;gap:12px}
  .program-poster-inline{padding:0 20px;margin-bottom:38px}
  .program-next{margin:0 20px 32px;padding:18px 0;grid-template-columns:minmax(0,1fr) 96px;gap:14px}
  .program-next .event-poster{width:96px;height:118px}
  .program-next-copy h2{font-size:20px}
}

/* SCALA wordmark, tighter home headline, and clearer navigation. */
.brand-logo{display:block;width:124px;height:36px;overflow:hidden;position:relative;flex:none}
.brand-logo img{display:block;width:248px;max-width:none;height:auto;position:absolute;left:-62px;top:0}
.brand>b{border-color:rgba(255,56,102,.72);box-shadow:0 0 12px rgba(255,35,89,.18)}
.hero h1{font-family:Manrope,Arial,sans-serif;font-weight:800;font-size:clamp(40px,4.7vw,61px);letter-spacing:-.025em;line-height:1.08}
nav{gap:20px}
nav a{display:inline-flex;align-items:center;padding:8px 11px;border:1px solid transparent;border-radius:2px;font-size:14px;transition:color .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease}
nav a:hover,nav a.active{color:#fff;border-color:rgba(200,165,100,.62);background:rgba(200,165,100,.07);box-shadow:0 0 13px rgba(200,165,100,.1)}
nav a.active:after{display:none}
.btn{background:#a91c3e;border:1px solid rgba(255,90,126,.48);box-shadow:0 0 16px rgba(239,28,83,.24),inset 0 0 0 1px rgba(255,255,255,.05);transition:background .2s ease,box-shadow .2s ease,transform .2s ease}
.btn:hover{background:#bf2450;box-shadow:0 0 21px rgba(239,28,83,.34);transform:translateY(-1px)}
.toggle{border:1px solid rgba(200,165,100,.65);border-radius:2px;background:rgba(200,165,100,.08);font:600 14px 'DM Sans',Arial,sans-serif;box-shadow:0 0 12px rgba(200,165,100,.12)}
.toggle:focus-visible,nav a:focus-visible,.btn:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
@media(max-width:850px){
  .brand-logo{width:116px;height:34px}
  .brand-logo img{width:232px;left:-58px}
}
@media(max-width:620px){
  .header{height:70px}
  .brand-logo{width:108px;height:32px}
  .brand-logo img{width:216px;left:-54px}
  .hero h1{font-size:clamp(27px,7.5vw,34px);line-height:1.14;letter-spacing:-.018em;margin-bottom:16px}
  nav{gap:9px}
  nav a{width:100%;padding:9px 11px;font-size:14px}
  nav a.active{background:rgba(200,165,100,.11)}
}

/* Compact program panel, keeping the original event page structure intact. */
.program-teaser{max-width:var(--max);margin:0 auto 42px;padding:18px 22px;display:grid;grid-template-columns:112px minmax(0,1fr);gap:24px;align-items:center;background:var(--panel);border:1px solid var(--line)}
.program-thumb{display:block;width:112px;border:1px solid var(--line);line-height:0}
.program-thumb img{display:block;width:100%;height:auto}
.program-teaser-copy h2{font-size:22px;margin:0 0 7px;letter-spacing:-.02em}
.program-teaser-copy>p:not(.eyebrow){font-size:12px;color:#c4c0bd;margin:0 0 9px}
.program-teaser-copy .eyebrow{margin-bottom:7px}
.program-poster-link{display:inline-block;margin-bottom:9px;color:var(--gold)}
.program-links{display:flex;flex-wrap:wrap;gap:7px 16px}
.program-links a{font-size:11px;font-weight:600;color:#e4dfd7}
.program-links a:hover{color:var(--gold)}
@media(max-width:620px){
  .program-teaser{margin:0 20px 32px;padding:13px;grid-template-columns:78px minmax(0,1fr);gap:13px;align-items:start}
  .program-thumb{width:78px}
  .program-teaser-copy h2{font-size:18px}
  .program-teaser-copy>p:not(.eyebrow){font-size:11px}
  .program-links{gap:7px 12px}
  .program-links a{font-size:10px}
}

/* Make the gold title line a smaller subtitle and align event actions beneath posters. */
h1 em,h2 em{display:block;font-size:.68em;line-height:1.18;letter-spacing:-.015em;margin-top:.1em}
.program-event{grid-template-columns:136px minmax(0,1fr);grid-template-areas:"poster copy" "actions copy";gap:10px 24px;align-items:start}
.event-poster{width:136px;height:176px}
.event-actions{grid-area:actions;min-width:0;width:100%;align-items:stretch;gap:8px}
.event-actions small,.ticket-pending{text-align:center}
.program-event .btn{width:100%;min-height:38px;white-space:normal;text-align:center;line-height:1.3}
.event-more{padding:16px 18px;font-size:13px;line-height:1.7}
@media(max-width:850px){
  .program-event{grid-template-columns:120px minmax(0,1fr);gap:10px 18px}
  .event-poster{width:120px;height:156px}
}
@media(max-width:620px){
  h1 em,h2 em{font-size:.68em}
  .program-events{padding:0 18px 38px}
  .program-event{grid-template-columns:92px minmax(0,1fr);grid-template-areas:"poster copy" "actions copy";gap:8px 13px;padding:18px 0}
  .event-poster{width:92px;height:120px}
  .event-actions{flex-direction:column;align-items:stretch;justify-content:flex-start}
  .event-actions small{text-align:center}
  .program-event .btn{padding:9px 7px;font-size:10px}
  .ticket-pending{text-align:center}
  .event-more{padding:13px 14px;font-size:12px}
}

/* Logo-inspired typography for the main white headlines, slightly reduced for balance. */
h1,h2{font-family:Orbitron,Manrope,Arial,sans-serif;font-weight:500;letter-spacing:-.035em}
.hero h1{font-size:clamp(35px,4.2vw,55px);font-weight:500;letter-spacing:-.025em}
.heading h1{font-size:clamp(38px,4.6vw,60px)}
.intro h2,.social h2{font-size:clamp(29px,3.6vw,46px)}
.banner h2{font-size:clamp(31px,3.6vw,46px)}
.contact-copy h2{font-size:clamp(29px,3.2vw,39px)}
.program-event h2{font-size:clamp(16px,1.55vw,20px)}
@media(max-width:620px){.hero h1{font-size:clamp(26px,7.1vw,32px)}.heading h1{font-size:clamp(34px,8.6vw,42px)}.intro h2,.social h2{font-size:clamp(28px,8vw,34px)}.banner h2{font-size:clamp(29px,8vw,34px)}.contact-copy h2{font-size:29px}.program-event h2{font-size:16px}}

/* Slightly smaller white headlines in a geometric font close to the SCALA wordmark. */
h1,h2{font-family:Orbitron,Manrope,Arial,sans-serif;font-weight:500;letter-spacing:-.035em}
.hero h1{font-size:clamp(35px,4.2vw,55px);font-weight:500;letter-spacing:-.025em}
.heading h1{font-size:clamp(38px,4.6vw,60px)}
.intro h2,.social h2{font-size:clamp(29px,3.6vw,46px)}
.banner h2{font-size:clamp(31px,3.6vw,46px)}
.contact-copy h2{font-size:clamp(29px,3.2vw,39px)}
.program-event h2{font-size:clamp(16px,1.55vw,20px)}
@media(max-width:620px){.hero h1{font-size:clamp(26px,7.1vw,32px)}.heading h1{font-size:clamp(34px,8.6vw,42px)}.intro h2,.social h2{font-size:clamp(28px,8vw,34px)}.banner h2{font-size:clamp(29px,8vw,34px)}.contact-copy h2{font-size:29px}.program-event h2{font-size:16px}}
.contact-social a{display:flex;align-items:center;gap:9px;color:var(--gold);font-size:13px;font-weight:600}
.contact-social svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.contact-social svg path{fill:currentColor;stroke:none}
.contact-social svg .icon-dot{fill:currentColor;stroke:none}
.contact-social a:hover{color:#f0d29c}

/* Compact homepage details and illuminated social icons. */
.hero-image picture{display:block}
.intro{padding-block:34px}
.intro-title{font-size:clamp(20px,2.4vw,30px)!important;line-height:1.2;white-space:nowrap;letter-spacing:-.025em}
.social{padding-block:30px}
.social-links{display:flex;align-items:center;justify-content:flex-end;gap:24px;width:auto;border:0}
.social-links a{display:inline-flex;align-items:center;gap:8px;padding:0;border:0;color:var(--gold);font-size:12px;font-weight:700;transition:color .2s ease,filter .2s ease}
.social-links svg{display:block;width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px rgba(200,165,100,.52))}
.social-links svg path{fill:currentColor;stroke:none}
.social-links svg .icon-dot{fill:currentColor;stroke:none}
.social-links a:hover{color:#f2d49c;filter:drop-shadow(0 0 7px rgba(200,165,100,.62))}
@media(max-width:620px){.intro,.social{padding-block:22px}.intro-title{font-size:clamp(18px,5.3vw,24px)!important}.social-links{gap:14px}.social-links a{gap:5px;font-size:10px}.social-links svg{width:23px;height:23px}}


/* Use the original SCALA wordmark in the header and footer. */
.brand{gap:0}
.brand-mark{display:block;width:150px;height:auto;flex:none}
.footbrand{display:inline-flex;align-items:center;line-height:0}
.footbrand img{display:block;width:168px;height:auto}
@media(max-width:850px){.brand-mark{width:140px}}
@media(max-width:620px){.brand-mark{width:124px}.footbrand img{width:150px}}


/* Homepage: make the main SCALA image the lead, with its text and actions below. */
.hero{display:flex;flex-direction:column;align-items:center;gap:24px;padding-block:48px 56px}
.hero-image{width:100%;max-width:1040px}
.hero-copy{width:100%;padding:0;text-align:center}
.hero-copy>p:not(.eyebrow){max-width:650px;margin-inline:auto}
.hero h1{max-width:850px;margin:0 auto 18px;font-size:clamp(38px,4.7vw,58px)}
.hero .actions{justify-content:center;margin-top:22px}
@media(max-width:620px){.hero{gap:18px;padding:26px 19px 40px}.hero h1{font-size:clamp(28px,8vw,38px);margin-bottom:13px}.hero-copy>p:not(.eyebrow){font-size:15px}.hero .actions{align-items:center;gap:14px;margin-top:18px}}


/* Refine homepage headline hierarchy and soften the contact heading. */
.hero h1{max-width:980px;font-size:clamp(29px,3.3vw,42px);line-height:1.16;margin-bottom:12px}
.hero-tagline{max-width:320px;margin:0 auto!important;font-size:clamp(18px,1.75vw,21px)!important;line-height:1.32;color:var(--fg)!important}
.hero-tagline em{color:var(--gold)}
.hero-welcome{margin:7px auto 0!important;font-size:13px!important;color:var(--muted)!important}
.hero .actions{margin-top:18px}
.heading h1{font-size:clamp(34px,3.7vw,48px);line-height:1.15}
.contact-social{flex-direction:column;align-items:flex-start;gap:6px}
.contact-social a{margin-top:0}
@media(max-width:620px){.hero h1{font-size:clamp(25px,6.8vw,30px);line-height:1.18;margin-bottom:10px}.hero-tagline{font-size:17px!important}.hero-welcome{font-size:12px!important}.hero .actions{margin-top:15px}.heading h1{font-size:clamp(30px,8vw,36px);line-height:1.16}}

/* Final size adjustments from the live review. */
.hero-tagline{font-size:16px!important;max-width:300px}
.contact-copy h2{font-size:clamp(26px,2.5vw,34px)}
@media(max-width:620px){.hero-tagline{font-size:15px!important}.contact-copy h2{font-size:27px}}

/* Keep the main offer in the same refined gold typography as the eyebrow. */
.hero h1{max-width:1020px;margin-bottom:10px;color:var(--gold);font-family:'DM Sans',Arial,sans-serif;font-size:clamp(12px,1vw,14px);font-weight:600;letter-spacing:.14em;line-height:1.8;text-transform:uppercase}
@media(max-width:620px){.hero h1{font-size:12px;letter-spacing:.11em;line-height:1.7}}

/* Keep the homepage offer and tagline as a quiet gold signature. */
.hero h1{color:var(--gold);font-family:'DM Sans',Arial,sans-serif;font-size:clamp(13px,1.15vw,15px);font-weight:500;letter-spacing:.12em;line-height:1.55;text-transform:none;max-width:100%;margin-bottom:5px}
.hero-tagline{font-size:14px!important;line-height:1.35;max-width:min(100%,360px);letter-spacing:0}
/* Give the contact page the same restrained hierarchy. */
.heading h1{font-family:'DM Sans',Arial,sans-serif;font-size:clamp(27px,3vw,35px);font-weight:400;letter-spacing:-.025em;line-height:1.24}
.heading h1 em{font-size:.82em;font-weight:400}
.contact-copy h2{font-family:'DM Sans',Arial,sans-serif;font-size:clamp(27px,2.7vw,34px);font-weight:400;letter-spacing:-.025em;line-height:1.25}
@media(max-width:620px){.hero h1{font-size:13px;letter-spacing:.08em;line-height:1.45}.hero-tagline{font-size:13px!important}.heading h1{font-size:28px}.heading h1 em{font-size:.8em}.contact-copy h2{font-size:27px}}

/* Refined hero and contact typography requested in the latest review. */
.hero h1{
  max-width:100%;
  margin:0 auto 8px;
  color:var(--gold);
  font-family:'DM Sans',Arial,sans-serif;
  font-size:clamp(14px,1.25vw,16px);
  font-weight:500;
  letter-spacing:.035em;
  line-height:1.55;
  text-transform:none;
}
.hero-tagline{
  max-width:340px;
  font-size:15px!important;
  font-weight:400;
  line-height:1.4;
  color:#d5d0c8!important;
}
.hero-tagline em{color:var(--gold);font-weight:400}
.heading h1{
  font-family:'DM Sans',Arial,sans-serif;
  font-size:clamp(30px,3vw,38px);
  font-weight:400;
  letter-spacing:-.025em;
  line-height:1.22;
  color:#e3dfd8;
}
.heading h1 em{color:var(--gold);font-weight:400}
.contact-copy h2{
  font-family:'DM Sans',Arial,sans-serif;
  font-size:clamp(25px,2.4vw,31px);
  font-weight:400;
  letter-spacing:-.02em;
  line-height:1.25;
  color:#e3dfd8;
}
@media(max-width:620px){
  .hero h1{font-size:13px;letter-spacing:.025em;line-height:1.5}
  .hero-tagline{max-width:290px;font-size:14px!important}
  .heading h1{font-size:29px;line-height:1.24}
  .contact-copy h2{font-size:25px;line-height:1.3}
}

/* One shared headline system across the home, program, and contact pages. */
:root{--title-size:clamp(24px,2.4vw,30px)}
h1,h2{
  font-family:Orbitron,Manrope,Arial,sans-serif;
  font-size:var(--title-size);
  font-weight:500;
  letter-spacing:-.03em;
  line-height:1.2;
}
.hero h1,.intro-title,.social h2,.heading h1,.contact-copy h2,.banner h2{
  font-family:Orbitron,Manrope,Arial,sans-serif;
  font-size:var(--title-size);
  font-weight:500;
  letter-spacing:-.03em;
  line-height:1.2;
}
h1 em,h2 em{
  display:inline;
  font-size:inherit;
  line-height:inherit;
  letter-spacing:inherit;
  font-weight:inherit;
}
.hero h1{
  max-width:1020px;
  margin:0 auto 8px;
  color:var(--gold);
  text-transform:none;
}
.hero-tagline{font-size:15px!important}
.hero-tagline em{font-size:inherit;color:var(--gold)}
.intro-title{white-space:normal!important}
.program-event h2{font-size:clamp(16px,1.55vw,20px)}
@media(max-width:620px){
  :root{--title-size:25px}
  h1,h2,.hero h1,.intro-title,.social h2,.heading h1,.contact-copy h2,.banner h2{font-size:var(--title-size)}
  .hero h1{font-size:var(--title-size);line-height:1.22}
  .hero-tagline{font-size:14px!important}
  .program-event h2{font-size:16px}
}

/* Final approved hierarchy: refined gold homepage label and softer contact headings. */
.hero h1{max-width:100%;margin:0 auto 5px;color:var(--gold);font-family:'DM Sans',Arial,sans-serif;font-size:clamp(13px,1.15vw,15px);font-weight:500;letter-spacing:.12em;line-height:1.55;text-transform:none}
.hero-tagline{max-width:min(100%,360px);font-size:14px!important;line-height:1.35;letter-spacing:0}
.heading h1{font-family:'DM Sans',Arial,sans-serif;font-size:clamp(27px,3vw,35px);font-weight:400;letter-spacing:-.025em;line-height:1.24}
.heading h1 em{font-size:.82em;font-weight:400}
.contact-copy h2{font-family:'DM Sans',Arial,sans-serif;font-size:clamp(27px,2.7vw,34px);font-weight:400;letter-spacing:-.025em;line-height:1.25}
@media(max-width:620px){.hero h1{font-size:13px;letter-spacing:.08em;line-height:1.45}.hero-tagline{font-size:13px!important}.heading h1{font-size:28px}.heading h1 em{font-size:.8em}.contact-copy h2{font-size:27px}}

/* Match the gold SCALA wordmark in the social title to the adjacent icons. */
.social h2 em{font-size:26px;line-height:1.15;letter-spacing:-.02em}
@media(max-width:620px){.social h2 em{font-size:23px}}

/* Final font consistency pass: page titles use the same SCALA-inspired face. */
h1,h2,.eyebrow,
.hero h1,.intro-title,.social h2,.heading h1,.contact-copy h2,.banner h2,
.program-event h2{
  font-family:Orbitron,Manrope,Arial,sans-serif!important;
}
h1 em,h2 em,.hero-tagline em{
  font-family:inherit!important;
  font-style:normal!important;
}
.heading h1 em{font-size:inherit!important}
.social h2 em{
  font-family:Orbitron,Manrope,Arial,sans-serif!important;
  font-size:26px!important;
  font-style:normal!important;
}
@media(max-width:620px){.social h2 em{font-size:23px!important}}

/* Shared type scale for primary page titles and descriptive copy. */
:root{--page-title-size:clamp(28px,3vw,36px);--description-size:14px}
.hero h1,.heading h1,.contact-copy h2,.intro-title,.social h2{
  font-family:Orbitron,Manrope,Arial,sans-serif!important;
  font-size:var(--page-title-size)!important;
  font-weight:500;
  letter-spacing:-.025em;
  line-height:1.2;
}
.hero h1 em,.heading h1 em,.contact-copy h2 em,.intro-title em,.social h2 em{
  font-family:inherit!important;
  font-size:inherit!important;
  font-style:normal!important;
}
.social h2 em{
  display:block;
  font-size:12px!important;
  line-height:1.2;
  letter-spacing:.02em;
}
.hero-tagline,.hero-welcome,
.intro>div:nth-child(2)>p:not(.eyebrow),
.heading>p:last-child,
.contact-copy>p:not(.eyebrow),
.program-event .event-teaser,
.program-next-copy>p:not(.eyebrow),
.event-more,.event-note{
  font-family:'DM Sans',Arial,sans-serif!important;
  font-size:var(--description-size)!important;
}
@media(max-width:620px){
  :root{--page-title-size:28px;--description-size:14px}
  .social h2 em{font-size:10px!important}
}

/* Reduce the home lead line by 40% and all other main titles by 20%. */
:root{--page-title-size:clamp(22.4px,2.4vw,28.8px)}
.hero h1{font-size:clamp(16.8px,1.8vw,21.6px)!important}
@media(max-width:620px){
  :root{--page-title-size:22.4px}
  .hero h1{font-size:16.8px!important}
}
/* On-page poster preview for events without ticket links. */
.poster-preview{width:min(980px,calc(100% - 32px));max-width:980px;padding:0;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:#131316;color:var(--fg);box-shadow:0 24px 90px rgba(0,0,0,.7)}
.poster-preview::backdrop{background:rgba(0,0,0,.82);backdrop-filter:blur(4px)}
.poster-preview-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.9fr);gap:clamp(24px,4vw,54px);align-items:center;padding:42px}
.poster-preview-content>img{display:block;max-width:100%;max-height:76vh;width:auto;height:auto;object-fit:contain;justify-self:center;border:1px solid rgba(255,255,255,.12);box-shadow:0 12px 36px rgba(0,0,0,.4)}
.poster-preview-copy h2{font-size:clamp(28px,4vw,44px);margin:0 0 16px}
.poster-preview-copy>p:not(.eyebrow){color:#c4c0bd;font-size:14px;margin:0 0 24px}
.poster-preview-close{position:absolute;top:10px;right:12px;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:#09090b;color:var(--fg);font-size:28px;line-height:1;cursor:pointer}
.poster-preview-close:focus-visible,.poster-preview .btn:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
@media(max-width:620px){.poster-preview{width:calc(100% - 20px)}.poster-preview-content{grid-template-columns:1fr;gap:20px;padding:54px 20px 22px}.poster-preview-content>img{max-height:48vh}.poster-preview-copy h2{font-size:27px}.poster-preview-copy>p:not(.eyebrow){font-size:13px;margin-bottom:18px}.poster-preview-copy .btn{width:100%}}


/* Refine footer scale and present social/maps as icon links. */
.footbrand img{width:130px}
.contact-social{display:flex;flex-direction:row;align-items:center;gap:18px;margin-top:24px}
.contact-social a{display:grid;place-items:center;width:48px;height:48px;margin:0;padding:0;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:#131316;color:#fff;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.contact-social a:hover{transform:translateY(-2px);border-color:rgba(200,165,100,.55);box-shadow:0 0 18px rgba(200,165,100,.3)}
.contact-social a:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.contact-social svg{display:block;width:30px;height:30px;fill:none;stroke:none;filter:drop-shadow(0 2px 5px rgba(0,0,0,.28))}
.contact-social .icon-instagram{width:31px;height:31px}
.contact-social .icon-facebook{width:31px;height:31px}
.contact-social .icon-google-maps{width:34px;height:34px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:620px){.footbrand img{width:112px}.contact-social{gap:14px}.contact-social a{width:46px;height:46px}}
.contact-social .icon-facebook path{fill:#fff}
.contact-social .icon-google-maps path:nth-of-type(1){fill:#34a853}
.contact-social .icon-google-maps path:nth-of-type(2){fill:#fbbc04}
.contact-social .icon-google-maps path:nth-of-type(3){fill:#4285f4}
.contact-social .icon-google-maps path:nth-of-type(4){fill:#ea4335}
.contact-social .icon-google-maps circle{fill:#fff}

/* Contact details follow the inquiry form; footer keeps only the brand and key links. */
.contact{grid-template-columns:1fr;gap:28px;max-width:850px}
.contact-copy{max-width:680px}
.contact-details{border-top:1px solid var(--line);padding-top:22px}
.contact-details .eyebrow{margin-bottom:10px}
.contact-details address{margin-top:0}
.contact-details .contact-social{margin-top:14px}
footer{display:flex;justify-content:space-between;align-items:center}
@media(max-width:620px){footer{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:12px;padding:21px 18px}footer div{justify-content:flex-end;gap:14px}}

/* Keep the home calls to action centered and the footer aligned to the page grid. */
.hero-copy{text-align:center;display:flex;flex-direction:column;align-items:center}
.hero-copy h1{max-width:620px}
.hero-copy>p:not(.eyebrow){margin-inline:auto}
.actions{flex-direction:column;align-items:center;justify-content:center;gap:13px;margin-top:28px}
.actions .link{display:block;text-align:center}
footer{padding-inline:max(28px,calc((100vw - 1180px)/2 + 28px));white-space:nowrap}
footer div{align-items:center;gap:24px}
.contact{display:block;max-width:1180px}
.contact-main{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;align-items:start}
.contact-copy{max-width:none}
.contact .form{min-width:0}
.contact-details{margin-top:30px}
@media(max-width:850px){.contact-main{gap:5vw}}
@media(max-width:620px){
 .hero-copy{align-items:center;text-align:center}
 .actions{align-items:center;width:100%}
 .actions .btn{min-width:190px}
 footer{padding:21px 18px;white-space:normal;gap:12px}
 footer div{gap:14px}
 .contact-main{grid-template-columns:1fr;gap:22px}
 .contact-copy{max-width:100%}
 .contact .form{width:100%}
}

/* Put the contact introduction and form together in the left column. */
.contact-main{grid-template-columns:minmax(0,1.2fr) minmax(240px,.8fr);gap:clamp(28px,6vw,76px);align-items:start}
.contact-left{min-width:0}
.contact-left .contact-copy{margin-bottom:22px}
.contact-left .contact-copy>p:not(.eyebrow){max-width:480px}
.contact-details{margin-top:0;border-top:0;padding-top:4px}
@media(max-width:760px){.contact-main{grid-template-columns:1fr}.contact-details{margin-top:10px;border-top:1px solid var(--line);padding-top:22px}}

/* Tablet composition: keep culture and social copy in the left column, reserving the right for a future photo. */
@media(min-width:621px) and (max-width:1366px){
 .header{padding-inline:max(5vw,24px)}
 .hero{padding-inline:max(5vw,24px)}
 .intro{grid-template-columns:1fr 1fr;gap:18px 5vw;align-items:start}
 .intro>div:nth-child(2){grid-column:1;align-self:start}
 .intro>div:nth-child(2)>p{margin-top:0}
 .social{display:grid;grid-template-columns:1fr 1fr;gap:18px 5vw;align-items:start}
 .social-links{grid-column:1;width:100%;max-width:420px}
}

/* Align the tablet header and hero image to one shared content frame. */
@media(min-width:621px) and (max-width:1366px){
 .header{max-width:1500px;margin-inline:auto;padding-inline:max(5vw,24px)}
 .hero{padding-inline:max(5vw,24px)}
 .social{display:grid;grid-template-columns:1fr 1fr;gap:18px 5vw;align-items:start}
 .social-links{grid-column:1;display:flex;align-items:center;justify-content:flex-start;gap:24px;width:100%;max-width:420px;border-top:0}
 .social-links a{display:inline-flex;justify-content:flex-start;align-items:center;gap:9px;padding:8px 0;border-bottom:0}
}
@media(min-width:900px) and (max-width:1366px){
 .hero{grid-template-columns:.9fr 1.1fr}
 .hero-image{grid-column:2;grid-row:1;max-width:none}
 .hero-copy{grid-column:1;grid-row:1;padding-left:0}
}


/* Event list: poster on the left, expandable copy and ticket action on the right. */
.program-event{
  grid-template-columns:136px minmax(0,1fr);
  grid-template-areas:"poster copy" "poster actions";
  gap:10px 24px;
  align-items:start;
}
.program-event .event-poster{width:136px;height:176px}
.program-event .event-teaser{display:block}
.program-event .event-actions{grid-area:actions;min-width:0;width:100%;align-items:stretch}
.program-event .event-actions small{display:none}
.program-event .btn{width:min(100%,260px);min-height:40px;text-align:center}
@media(max-width:850px){
  .program-event{grid-template-columns:120px minmax(0,1fr);gap:10px 18px}
  .program-event .event-poster{width:120px;height:156px}
}
@media(max-width:620px){
  .program-event{grid-template-columns:92px minmax(0,1fr);grid-template-areas:"poster copy" "poster actions";gap:8px 13px;padding:18px 0}
  .program-event .event-poster{width:92px;height:120px}
  .program-event .event-actions{flex-direction:column;align-items:stretch;justify-content:flex-start}
  .program-event .btn{padding:10px 9px;font-size:11px}
}


/* Event cards: group the poster and ticket action on the left; keep dates and other small print above the copy on the right. */
.program-event{
  grid-template-columns:136px minmax(0,1fr);
  grid-template-areas:"media meta" "media copy";
  gap:8px 24px;
  align-items:start;
}
.program-event .event-media{grid-area:media;display:flex;flex-direction:column;align-items:stretch;gap:8px;min-width:0}
.program-event .event-poster{width:100%;height:176px;align-self:stretch}
.program-event .event-meta{grid-area:meta;margin:0;color:var(--muted);font-size:11px;line-height:1.45;text-align:left}
.program-event .event-details{grid-area:copy;min-width:0}
.program-event .event-actions{width:100%;min-width:0;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0}
.program-event .event-actions .btn{width:100%;max-width:none;min-height:40px;white-space:normal}
.program-event .ticket-pending{width:100%;text-align:center}
@media(max-width:850px){
  .program-event{grid-template-columns:120px minmax(0,1fr);gap:8px 18px}
  .program-event .event-poster{height:156px}
}
@media(max-width:620px){
  .program-event{grid-template-columns:92px minmax(0,1fr);grid-template-areas:"media meta" "media copy";gap:7px 13px;padding:18px 0}
  .program-event .event-poster{height:120px}
  .program-event .event-meta{font-size:10px;line-height:1.4}
  .program-event .event-actions .btn{padding:10px 7px;font-size:10px}
}


/* Keep poster artwork clear; place each compact date beside the ticket action. */
.program-event .event-actions .btn{display:flex;justify-content:space-between;align-items:center;gap:5px;padding:10px 8px}
.program-event .btn-label{min-width:0;text-align:left}
.program-event .ticket-date{display:inline-flex;align-items:center;justify-content:center;flex:none;margin-left:auto;padding-left:6px;border-left:1px solid rgba(255,255,255,.42);color:#fff;font-size:9px;font-weight:700;line-height:1.2;letter-spacing:.02em;white-space:nowrap}
.program-event .ticket-pending{display:flex;justify-content:space-between;align-items:center;gap:5px}
@media(max-width:620px){
 .program-event .event-actions .btn{padding:9px 5px;font-size:9px;gap:3px}
 .program-event .ticket-date{padding-left:4px;font-size:8px}
}


/* Make the numeric day and month abbreviation prominent across the full button height. */
.program-event .event-actions .btn{align-items:stretch;min-height:52px;padding:4px 8px}
.program-event .btn-label{flex:1;align-self:center;line-height:1.15}
.program-event .ticket-date{flex-direction:column;align-self:stretch;justify-content:center;gap:2px;min-width:34px;margin-left:4px;padding:2px 0 2px 7px;border-left:1px solid rgba(255,255,255,.5);line-height:1;text-align:center}
.program-event .ticket-day{font-size:16px;font-weight:800;line-height:1}
.program-event .ticket-month{font-size:8px;font-weight:700;letter-spacing:.04em;line-height:1}
.program-event .ticket-pending .ticket-date{min-height:38px}
@media(max-width:620px){
 .program-event .event-actions .btn{min-height:50px;padding:3px 5px;font-size:9px}
 .program-event .ticket-date{min-width:30px;margin-left:3px;padding-left:5px}
 .program-event .ticket-day{font-size:15px}
 .program-event .ticket-month{font-size:7px}
}


/* Stack the event date above the ticket action and remove the side-by-side layout. */
.program-event .event-actions .btn{flex-direction:column;justify-content:center;align-items:center;gap:3px;min-height:64px;padding:5px 8px;text-align:center}
.program-event .btn-label{order:2;flex:none;text-align:center;line-height:1.15}
.program-event .ticket-date{order:1;align-self:center;justify-content:center;gap:1px;min-width:0;margin:0;padding:0;border:0;text-align:center}
.program-event .ticket-day{font-size:16px;line-height:1}
.program-event .ticket-month{font-size:8px;line-height:1}
.program-event .ticket-pending{flex-direction:column;justify-content:center;min-height:58px;gap:3px;text-align:center}
.program-event .ticket-pending .ticket-date{order:1;min-height:0}
.program-event .ticket-pending>span:first-child{order:2}
@media(max-width:620px){
 .program-event .event-actions .btn{min-height:60px;padding:4px 5px;gap:3px;font-size:9px}
 .program-event .ticket-day{font-size:15px}
 .program-event .ticket-month{font-size:7px}
}

/* Show each event's summary beside the poster; keep supplemental information under a plus toggle. */
.program-event{
  grid-template-columns:136px minmax(0,1fr);
  grid-template-areas:"media copy";
  gap:8px 24px;
  align-items:start;
}
.program-event .event-media{grid-area:media}
.program-event .event-details{grid-area:copy;min-width:0}
.program-event .event-teaser{margin:8px 0 10px}
.program-event .event-description{font-size:13px;line-height:1.6;color:#c4c0bd;margin:0 0 10px}
.event-extra{margin-top:6px}
.event-extra summary{cursor:pointer;list-style:none}
.event-extra summary::-webkit-details-marker{display:none}
.event-extra summary::marker{content:""}
.event-extra summary:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.event-extra[open] .details-hint b{transform:rotate(45deg)}
.event-extra-meta{border-top:1px solid var(--line);padding-top:8px;margin-top:10px!important;color:var(--gold)}
@media(max-width:850px){
  .program-event{grid-template-columns:120px minmax(0,1fr);gap:8px 18px}
}
@media(max-width:620px){
  .program-event{grid-template-columns:92px minmax(0,1fr);grid-template-areas:"media copy";gap:7px 13px;padding:18px 0}
}