/* Stars Dance Hallandale — Lobby TV display.
   Fixed 1920×1080 stage, scaled to fill any 16:9 screen.
   Type sized for a 50" panel read from 8–14 feet: nothing below 30px. */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Outfit:wght@300;400;500;600;700&display=swap');
:root{
  --ink:#1A0A33;--aubergine:#3C2060;--gold:#FFB347;--gold-soft:#F7E8B0;
  --cream:#FFFAF2;--lavender:#F5F0FF;--purple:#C9A8E0;--teal:#7ECAC3;--muted:#6B5D8A;
  --soft:#D8CCEC;--rule:rgba(255,250,242,.18);
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;background:#000}
body{font-family:'Outfit',system-ui,sans-serif;color:var(--cream);cursor:none}
#stage{position:absolute;left:50%;top:50%;width:1920px;height:1080px;transform-origin:50% 50%;background:var(--ink);overflow:hidden}

/* ---------- slides ---------- */
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease;pointer-events:none;display:grid;z-index:1}
.slide.on{opacity:1;z-index:2}
.pad{padding:96px 112px 152px}

/* ---------- shared type ---------- */
.eyebrow{font-size:26px;letter-spacing:.22em;text-transform:uppercase;font-weight:600;color:var(--gold);display:flex;align-items:center;gap:20px}
.eyebrow::before{content:"";width:64px;height:3px;background:var(--gold);flex:none}
.tag{align-self:start;justify-self:start;font-size:24px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;padding:12px 26px;border-radius:999px;background:rgba(255,179,71,.16);color:var(--gold);border:2px solid rgba(255,179,71,.5)}
.tag.teal{background:rgba(126,202,195,.14);color:var(--teal);border-color:rgba(126,202,195,.45)}
.tag.purple{background:rgba(201,168,224,.14);color:var(--purple);border-color:rgba(201,168,224,.45)}
h1,h2,h3{font-family:'Playfair Display',Georgia,serif;font-weight:600;line-height:1.04;letter-spacing:-.015em;margin:0}
.xl{font-size:132px}
.lg{font-size:96px}
.md{font-size:64px}
.lead{font-size:44px;line-height:1.42;color:var(--soft);margin:0;max-width:34ch;text-wrap:pretty}
.body{font-size:38px;line-height:1.5;color:var(--soft);margin:0;max-width:38ch;text-wrap:pretty}
.note{font-size:30px;line-height:1.45;color:var(--purple);margin:0;max-width:52ch}
.datelab{font-size:28px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--purple)}

/* ---------- brand / welcome ---------- */
.s-brand{place-content:center;justify-items:center;text-align:center;gap:40px;background:radial-gradient(120% 90% at 50% 0%,#4A2775 0%,var(--ink) 62%)}
.s-brand img{height:190px;width:auto}
.s-brand .rule{width:220px;height:3px;background:var(--gold)}
.s-brand .kicker{font-size:40px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-soft);font-weight:500}

/* ---------- news ---------- */
.s-news{grid-template-columns:1.15fr .85fr;background:linear-gradient(115deg,var(--ink) 0%,var(--ink) 52%,#2A1148 100%)}
.s-news .col{align-content:center;display:grid;gap:34px}
.s-news .art{position:relative;overflow:hidden}
.s-news .art img{width:100%;height:100%;object-fit:cover}
.s-news .art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ink) 0%,rgba(26,10,51,.55) 34%,rgba(26,10,51,0) 100%)}
.s-news ul{margin:0;padding:0;list-style:none;display:grid;gap:26px}
.s-news li{font-size:40px;line-height:1.44;color:var(--cream);display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:start;max-width:30ch;text-wrap:pretty}
.s-news li::before{content:"";width:14px;height:14px;border-radius:50%;background:var(--gold);margin-top:20px}

/* ---------- schedule ---------- */
.s-sched{background:var(--ink);grid-template-rows:auto auto auto;align-content:start;gap:40px}
.s-sched .top{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;border-bottom:3px solid var(--rule);padding-bottom:30px}
.s-sched .dayname{font-family:'Playfair Display',serif;font-size:88px;font-weight:600;line-height:1}
.s-sched .season{font-size:32px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:600;text-align:right}
.s-sched table{width:100%;border-collapse:collapse}
.s-sched th{font-size:24px;letter-spacing:.16em;text-transform:uppercase;color:var(--purple);text-align:left;font-weight:700;padding:0 0 20px}
.s-sched td{font-size:38px;padding:18px 0;border-top:2px solid rgba(255,250,242,.1);vertical-align:baseline}
.s-sched tr td:first-child{font-weight:600;color:var(--gold);white-space:nowrap;width:230px}
.s-sched tr td:nth-child(2){font-family:'Playfair Display',serif;font-size:42px;color:var(--cream)}
.s-sched tr td:nth-child(3){color:var(--soft);width:300px}
.s-sched tr td:nth-child(4){color:var(--muted);text-align:right;width:220px;font-size:32px}
.s-sched .foot{display:grid;gap:8px}
.s-sched .foot p{font-size:26px;line-height:1.35;color:var(--purple);margin:0}
.s-sched .more{font-size:28px;color:var(--muted);letter-spacing:.1em;text-transform:uppercase}
/* density steps: one day always fits on one slide */
.s-sched.dn2{gap:30px}.s-sched.dn2 .dayname{font-size:72px}.s-sched.dn2 td{font-size:31px;padding:12px 0}.s-sched.dn2 tr td:nth-child(2){font-size:34px}.s-sched.dn2 .top{padding-bottom:22px}
.s-sched.dn3{gap:24px}.s-sched.dn3 .dayname{font-size:62px}.s-sched.dn3 td{font-size:27px;padding:9px 0}.s-sched.dn3 tr td:nth-child(2){font-size:29px}.s-sched.dn3 .top{padding-bottom:18px}.s-sched.dn3 th{padding-bottom:14px}
.s-sched.dn4{gap:20px}.s-sched.dn4 .dayname{font-size:54px}.s-sched.dn4 td{font-size:24px;padding:6px 0}.s-sched.dn4 tr td:nth-child(2){font-size:26px}.s-sched.dn4 .top{padding-bottom:14px}.s-sched.dn4 th{padding-bottom:10px;font-size:20px}.s-sched.dn4 tr td:first-child{width:190px}

/* ---------- season calendar ---------- */
.s-dates td.when{font-family:'Outfit',sans-serif;font-size:38px;font-weight:600;color:var(--gold);width:52%;white-space:normal}
.s-dates td.what{font-family:'Playfair Display',serif;font-size:44px;color:var(--cream);text-align:right}
.s-dates tr td:first-child{width:52%}

/* ---------- programme ---------- */
.s-prog{grid-template-columns:1.1fr .9fr;background:linear-gradient(115deg,var(--ink) 0%,var(--ink) 50%,#2A1148 100%)}
.s-prog .col{align-content:center;display:grid;gap:30px}
.s-prog .entry{font-size:28px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--gold);padding:12px 26px;border:2px solid rgba(255,179,71,.5);border-radius:999px;justify-self:start;background:rgba(255,179,71,.12)}
.s-prog .body{font-size:40px;max-width:26ch;color:var(--cream)}
.s-prog .art{position:relative;overflow:hidden}
.s-prog .art img{width:100%;height:100%;object-fit:cover}
.s-prog .art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ink) 0%,rgba(26,10,51,.5) 38%,rgba(26,10,51,0) 100%)}

/* ---------- season facts ---------- */
.s-season{grid-template-columns:1fr 1fr;background:var(--ink)}
.s-season .col{align-content:center;display:grid;gap:44px}
.s-season dl{margin:0;display:grid;gap:34px}
.s-season .pair{display:grid;gap:8px;border-left:5px solid var(--gold);padding-left:32px}
.s-season dt{font-size:28px;letter-spacing:.18em;text-transform:uppercase;color:var(--purple);font-weight:600}
.s-season dd{margin:0;font-family:'Playfair Display',serif;font-size:64px;line-height:1.08}
.s-season .art{position:relative;overflow:hidden}
.s-season .art img{width:100%;height:100%;object-fit:cover}
.s-season .art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ink) 0%,rgba(26,10,51,.4) 40%,rgba(26,10,51,0) 100%)}

/* ---------- trial ---------- */
.s-trial{place-content:center;justify-items:center;text-align:center;gap:38px;background:radial-gradient(110% 100% at 50% 110%,#4A2775 0%,var(--ink) 60%)}
.s-trial .lead,.s-trial .body{max-width:30ch;text-align:center}
.s-trial .phone{font-family:'Playfair Display',serif;font-size:88px;color:var(--gold);line-height:1}

/* ---------- contact ---------- */
.s-contact{grid-template-columns:1fr 1fr;background:var(--ink)}
.s-contact .col{align-content:center;display:grid;gap:30px}
.s-contact .line{font-size:42px;line-height:1.4;color:var(--cream)}
.s-contact .phone{font-family:'Playfair Display',serif;font-size:96px;color:var(--gold);line-height:1}
.s-contact .art{position:relative;overflow:hidden}
.s-contact .art img{width:100%;height:100%;object-fit:cover}
.s-contact .art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ink) 0%,rgba(26,10,51,.45) 42%,rgba(26,10,51,0) 100%)}

/* ---------- photo: studio group portrait on white, never cropped ---------- */
.s-studio{background:var(--lavender);place-items:center;padding:0}
.s-studio .shot{position:absolute;inset:0 0 96px;display:grid;place-items:center}
.s-studio .shot img{width:92%;height:100%;min-height:0;min-width:0;object-fit:contain;align-self:center;justify-self:center}
.s-studio.on .shot img{animation:easein 1400ms cubic-bezier(.22,.8,.3,1) both}
@keyframes easein{0%{opacity:0;transform:scale(1.015)}100%{opacity:1;transform:scale(1)}}
.s-studio .mark{position:absolute;left:0;right:0;bottom:52px;display:flex;justify-content:center;align-items:baseline;gap:22px}
.s-studio .mark .w{font-size:26px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);font-weight:600}
.s-studio .mark .c{font-family:'Playfair Display',serif;font-size:34px;color:var(--ink)}

/* ---------- photo: feature ---------- */
.s-photo{background:#0B0418;place-items:center}
.s-photo .frame{position:absolute;inset:0;overflow:hidden}
.s-photo .frame img{position:absolute;left:50%;top:50%;width:auto;height:118%;transform:translate(-50%,-50%);will-change:transform}
.s-photo.on .frame img{animation:drift 32s ease-in-out both}
.s-photo .blur{position:absolute;inset:0;overflow:hidden;z-index:-1}
.s-photo .blur img{position:absolute;left:50%;top:50%;width:112%;height:112%;object-fit:cover;transform:translate(-50%,-50%);filter:blur(48px) saturate(1.25) brightness(.5)}
@keyframes drift{0%{transform:translate(-50%,-50%) scale(1.02)}100%{transform:translate(-50%,-50%) scale(1.11)}}
.cap{position:absolute;left:112px;bottom:152px;display:grid;gap:14px;max-width:26ch;z-index:3}
.cap .t{font-family:'Playfair Display',serif;font-size:56px;line-height:1.1;text-shadow:0 4px 28px rgba(0,0,0,.75)}
.cap .s{font-size:28px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:600;text-shadow:0 2px 18px rgba(0,0,0,.8)}
.scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,4,24,.82) 0%,rgba(11,4,24,.3) 42%,rgba(11,4,24,0) 68%),linear-gradient(0deg,rgba(11,4,24,.7) 0%,rgba(11,4,24,0) 40%);z-index:2}

/* ---------- season-packet boards ---------- */
.s-board{background:var(--ink);grid-template-rows:auto 1fr auto;align-content:start;gap:40px}
.s-board .top{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;border-bottom:3px solid var(--rule);padding-bottom:28px}
.s-board .dayname{font-family:'Playfair Display',serif;font-size:82px;font-weight:600;line-height:1}
.s-board .season{font-size:30px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:600;text-align:right}
.s-board .cols{display:grid;gap:64px;align-content:start;min-height:0;overflow:hidden}
.s-board .col{display:grid;gap:40px;align-content:start;min-width:0}
.s-board .group{display:grid;gap:6px;align-content:start}
.s-board .glabel{font-size:24px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--gold);padding-bottom:12px}
.s-board .r{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:12px 0;border-top:2px solid rgba(255,250,242,.1)}
.s-board .r .n{font-size:30px;line-height:1.25;color:var(--cream);text-wrap:pretty}
.s-board .r .v{font-size:28px;line-height:1.25;color:var(--gold-soft);text-align:right;flex:none;max-width:52%}
.s-board .cnote{font-size:24px;line-height:1.4;color:var(--purple);margin:14px 0 0;text-wrap:pretty}
.s-board .bfoot{font-size:24px;line-height:1.4;color:var(--purple);margin:0;max-width:150ch}
.s-board.dates .r{align-items:baseline}
.s-board.dates .r .n{font-weight:600;color:var(--gold);flex:none;width:220px}
.s-board.dates .r .v{font-family:'Playfair Display',serif;font-size:32px;color:var(--cream);text-align:left;max-width:none;flex:1 1 auto}
.s-board.bd2{gap:30px}.s-board.bd2 .dayname{font-size:68px}.s-board.bd2 .cols{gap:52px}.s-board.bd2 .col{gap:32px}.s-board.bd2 .r{padding:9px 0}.s-board.bd2 .r .n{font-size:27px}.s-board.bd2 .r .v{font-size:25px}.s-board.bd2.dates .r .v{font-size:28px}
.s-board.bd3{gap:26px}.s-board.bd3 .dayname{font-size:58px}.s-board.bd3 .cols{gap:44px}.s-board.bd3 .col{gap:26px}.s-board.bd3 .r{padding:7px 0}.s-board.bd3 .r .n{font-size:25px}.s-board.bd3 .r .v{font-size:24px}.s-board.bd3.dates .r .n{width:190px}.s-board.bd3.dates .r .v{font-size:26px}
.s-board.bd4{gap:22px}.s-board.bd4 .dayname{font-size:50px}.s-board.bd4 .top{padding-bottom:18px}.s-board.bd4 .cols{gap:38px}.s-board.bd4 .col{gap:22px}.s-board.bd4 .group{gap:4px}.s-board.bd4 .glabel{font-size:21px;padding-bottom:8px}.s-board.bd4 .r{padding:5px 0}.s-board.bd4 .r .n{font-size:23px}.s-board.bd4 .r .v{font-size:22px}.s-board.bd4 .cnote{font-size:21px;margin-top:10px}.s-board.bd4.dates .r .n{width:170px}.s-board.bd4.dates .r .v{font-size:24px}

/* ---------- class portraits, several to a screen ---------- */
.s-group{background:var(--lavender);padding:0}
.s-group .grid{position:absolute;inset:118px 72px 132px;display:flex;flex-direction:column;gap:28px;justify-content:center;align-items:center}
.s-group .row{display:flex;gap:28px;justify-content:center;flex:0 0 auto;min-height:0}
.s-group .cell{flex:0 0 auto;height:100%;min-width:0}
.s-group .cell img{height:100%;width:auto;object-fit:contain;display:block}
.s-group.on .cell img{animation:easein 1400ms cubic-bezier(.22,.8,.3,1) both}
.s-group.on .row:nth-child(2) .cell img{animation-delay:180ms}
.s-group .mark{position:absolute;left:0;right:0;bottom:56px;display:flex;justify-content:center;align-items:baseline;gap:22px}
.s-group .mark .w{font-size:24px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);font-weight:600}
.s-group .mark .c{font-family:'Playfair Display',serif;font-size:32px;color:var(--ink)}

/* ---------- results: award graphic shown whole on a dark, blurred field ---------- */
.s-result{background:#0B0418}
.s-result .blur{position:absolute;inset:0;overflow:hidden;z-index:0}
.s-result .blur img{position:absolute;left:50%;top:50%;width:112%;height:112%;object-fit:cover;transform:translate(-50%,-50%);filter:blur(56px) saturate(1.2) brightness(.38)}
.s-result .shot{position:absolute;inset:132px 96px 176px;display:grid;place-items:center;z-index:2}
.s-result .shot img{width:100%;height:100%;min-width:0;min-height:0;object-fit:contain}
.s-result.on .shot img{animation:easein 1400ms cubic-bezier(.22,.8,.3,1) both}
.s-result .rmark{position:absolute;left:0;right:0;bottom:96px;z-index:3;display:flex;justify-content:center;align-items:baseline;gap:22px;padding:0 96px}
.s-result .rmark .k{font-size:24px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);font-weight:700}
.s-result .rmark .t{font-family:'Playfair Display',serif;font-size:34px;color:var(--cream)}

/* ---------- wall — scrim protects chrome at BOTH edges, whatever the photo ---------- */
.s-wall{background:#0B0418}
.s-wall img{width:100%;height:100%;object-fit:cover}
.s-wall .scrim{background:linear-gradient(180deg,rgba(11,4,24,.7) 0%,rgba(11,4,24,.2) 15%,rgba(11,4,24,0) 26%),linear-gradient(0deg,rgba(11,4,24,.82) 0%,rgba(11,4,24,0) 30%)}

/* ---------- photo: mosaic ---------- */
.s-mosaic{background:#0B0418;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr);gap:10px;padding:10px}
.s-mosaic .cell{position:relative;overflow:hidden;background:#150726}
.s-mosaic .cell img{width:100%;height:100%;object-fit:cover;transform:scale(1.04)}
.s-mosaic.on .cell img{animation:mos 32s ease-in-out both}
.s-mosaic .cell:nth-child(2n) img{animation-direction:alternate-reverse}
@keyframes mos{0%{transform:scale(1.02)}100%{transform:scale(1.14)}}
.s-mosaic::before{content:"";position:absolute;left:0;right:0;top:0;height:240px;background:linear-gradient(180deg,rgba(11,4,24,.72) 0%,rgba(11,4,24,0) 100%);z-index:3;pointer-events:none}
.s-mosaic::after{content:"";position:absolute;left:0;right:0;bottom:0;height:190px;background:linear-gradient(0deg,rgba(11,4,24,.8) 0%,rgba(11,4,24,0) 100%);z-index:3;pointer-events:none}
.mosaic-title{position:absolute;left:64px;bottom:80px;z-index:5;font-size:30px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-weight:700;text-shadow:0 2px 20px rgba(0,0,0,.95)}

/* ---------- chrome — lives inside the scaled stage.
   The bottom strip is ONE flex row with three cells, so its tenants can never
   overlap at any slide count. ---------- */
#chrome{position:absolute;inset:0;z-index:20;pointer-events:none}
#mark{position:absolute;top:52px;right:64px;display:flex;align-items:center;gap:22px}
#mark img{height:74px;width:auto;opacity:.96;filter:drop-shadow(0 3px 22px rgba(0,0,0,.85))}
#clock{position:absolute;top:56px;left:64px;font-size:32px;font-weight:500;letter-spacing:.06em;color:var(--cream);opacity:.92;text-shadow:0 2px 5px rgba(0,0,0,.92),0 2px 24px rgba(0,0,0,.9);font-variant-numeric:tabular-nums}
#bar{position:absolute;left:0;bottom:0;height:7px;background:var(--gold);width:0;box-shadow:0 0 24px rgba(255,179,71,.6)}
#strip{position:absolute;left:64px;right:64px;bottom:32px;display:flex;align-items:center;justify-content:space-between;gap:56px}
#strip>*{min-width:0}
#dots{display:flex;gap:12px;flex:0 1 auto;overflow:hidden;margin-left:auto}
#dots i{width:12px;height:12px;border-radius:50%;background:rgba(255,250,242,.32);transition:background .4s,transform .4s;box-shadow:0 1px 6px rgba(0,0,0,.65);flex:none}
#dots i.on{background:var(--gold);transform:scale(1.45)}
#count{font-size:26px;letter-spacing:.16em;font-weight:700;color:var(--gold);font-variant-numeric:tabular-nums;text-shadow:0 2px 14px rgba(0,0,0,.95);white-space:nowrap;margin-left:auto}
#count[hidden]{display:none}
.no-chrome #clock,.no-chrome #mark{display:none}
/* light slides (studio portraits): dark chrome, no dark glow */
.light-chrome #clock{color:var(--muted);text-shadow:none}
.light-chrome #count{color:var(--aubergine);text-shadow:none}
.light-chrome #dots i{background:rgba(26,10,51,.22);box-shadow:none}
.light-chrome #dots i.on{background:var(--aubergine)}
.light-chrome #mark img{mix-blend-mode:normal;filter:brightness(0);opacity:.74}
.light-chrome #bar{background:var(--aubergine);box-shadow:none}

/* ---------- setup notice — its own cell in the strip ---------- */
#setup{font-size:20px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,250,242,.52);font-weight:600;text-shadow:0 1px 10px rgba(0,0,0,.95);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:0 1 auto}
#setup[hidden]{display:none}

/* ---------- single-column info slides (no side art available) ----------
   Overrides sit last so they beat the component rules they relax. */
.slide.solo{grid-template-columns:1fr}
.slide.solo .col{max-width:1400px}
.slide.solo .lead,.slide.solo .body{max-width:46ch}
.slide.solo.s-news li{max-width:44ch}
.slide.solo.s-prog .body{max-width:44ch}
.slide.solo .note{max-width:60ch}