/* Chakra Petch: official Alcatraz font, self-hosted (no Google Fonts, GDPR) */
@font-face{font-family:"Chakra Petch";src:url("../fonts/chakra-petch-medium.woff") format("woff");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url("../fonts/chakra-petch-semibold.woff") format("woff");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url("../fonts/chakra-petch-bold.woff") format("woff");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url("../fonts/chakra-petch-bolditalic.woff") format("woff");font-weight:700;font-style:italic;font-display:swap}
html{-webkit-text-size-adjust:100%}
body{margin:0}
img{max-width:100%}
[hidden]{display:none!important}

/* Layout: one long mobile-first page, black ground, orange for actions and dates, cell-corner frames on section heads.
   Colours: Alcatraz Branding 2026 (colors.pdf). Titles/headlines: Chakra Petch (official Alcatraz font). */
:root{
  --bg:#000000;          /* brand black  CMYK 0/0/0/100 */
  --fg:#ffffff;          /* brand white  CMYK 0/0/0/0 */
  --accent:#f06e32;      /* brand orange CMYK 0/70/90/0 */
  --line:#424242;        /* brand grey   CMYK 0/0/0/90 */
  --panel:#141414;       /* tint of brand black/grey, for surfaces */
  --muted:#bdbdbd;       /* tint of brand white, for secondary text */
  --on-accent:#000000;
  --ok:#ffffff;
  --display:"Chakra Petch","Arial Narrow","Helvetica Neue",sans-serif;
  --body:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:"Chakra Petch","Arial Narrow",sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{background:var(--bg);color:var(--fg);font-family:var(--body);font-size:1rem;line-height:1.55}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
a{color:var(--fg);text-underline-offset:3px;text-decoration-color:var(--accent)}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.wrap{max-width:68rem;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3{font-family:var(--display);text-transform:uppercase;line-height:1;text-wrap:balance;margin:0;letter-spacing:0;font-weight:700}
h2{font-size:clamp(2rem,7vw,3.5rem);hyphens:auto;overflow-wrap:break-word}
h3{font-size:1.4rem}
p{margin:0}
.label{font-family:var(--mono);font-weight:600;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.lead{font-size:1.125rem;max-width:38rem}

.draft{background:repeating-linear-gradient(-45deg,var(--accent) 0 12px,var(--bg) 12px 24px);padding:3px 0}
.draft span{display:block;background:var(--line);color:var(--fg);font-family:var(--mono);font-size:.72rem;text-align:center;padding:4px 16px;letter-spacing:.08em;text-transform:uppercase}

header{position:sticky;top:env(safe-area-inset-top,0px);z-index:9;background:var(--bg);border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;gap:12px;padding-block:10px}
.logo{font-family:var(--display);font-weight:700;font-style:italic;font-size:1.2rem;text-decoration:none;color:var(--fg);text-transform:uppercase;letter-spacing:.02em;white-space:nowrap}
.logo b{font-weight:700;color:var(--accent)}
@media (max-width:420px){header .logo{font-size:1rem}.lang button{min-width:36px;padding:8px 8px}}
nav{display:none;gap:20px;margin-left:auto}
nav a{color:var(--fg);text-decoration:none;font-weight:600;font-size:.9rem}
nav a:hover{color:var(--accent)}
.lang{display:flex;margin-left:auto;border:1px solid var(--line)}
nav + .lang{margin-left:16px}
.lang button{background:none;border:0;color:var(--muted);font:700 .85rem var(--mono);padding:8px 10px;cursor:pointer;min-width:40px}
.lang button[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
@media (min-width:900px){nav{display:flex}}

/* prison-cell framing for section heads (echoes the festival's corner decorations) */
.frame{position:relative;padding:18px 20px}
.frame::before,.frame::after{content:"";position:absolute;width:28px;height:28px;border:0 solid var(--accent)}
.frame::before{top:0;left:0;border-top-width:3px;border-left-width:3px}
.frame::after{bottom:0;right:0;border-bottom-width:3px;border-right-width:3px}

.hero{padding-block:64px 72px;border-bottom:1px solid var(--line);background:
  linear-gradient(90deg,rgba(0,0,0,.85) 0%,rgba(0,0,0,.4) 38%,rgba(0,0,0,0) 62%),
  url("../img/hero-bash.jpg") right center/auto 100% no-repeat,var(--bg)}
@media (max-width:859px){.hero{background:
  linear-gradient(180deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,.55) 50%,var(--bg) 100%),
  url("../img/hero-bash-m.jpg") center top/cover no-repeat,var(--bg)}}
.hero .dossier{background:rgba(0,0,0,.6);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.hero .lead,.hero h1,.hero .label{text-shadow:0 2px 14px rgba(0,0,0,.9)}
.hero h1{font-size:clamp(2.6rem,12vw,5.8rem);font-weight:700;font-style:italic;line-height:.92;margin-block:14px 22px}
.hero h1 span{display:block;color:var(--accent)}
.hero-grid{display:grid;gap:28px}
@media (min-width:860px){.hero-grid{grid-template-columns:1.4fr 1fr;align-items:end}}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.sponsor{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin-top:32px}
.sponsor img{height:64px;width:auto;max-width:100%;filter:drop-shadow(0 2px 10px rgba(0,0,0,.8))}
.sponsor img.alc{height:64px;margin-right:4px}
.sponsor img.rt{height:38px;margin-left:8px}
@media (max-width:420px){.sponsor img,.sponsor img.alc{height:52px}.sponsor img.rt{height:30px;margin-left:0}}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;font:700 1rem var(--display);text-transform:uppercase;letter-spacing:.04em;text-decoration:none;border:2px solid var(--accent);cursor:pointer}
.btn-primary{background:var(--accent);color:var(--on-accent)}
.btn-primary:hover{background:transparent;color:var(--accent)}
.btn-ghost{background:transparent;color:var(--accent)}
.btn-ghost:hover{background:var(--accent);color:var(--on-accent)}

.dossier{border:2px solid var(--fg);padding:18px;background:var(--panel);font-family:var(--mono);font-size:.85rem;display:grid;gap:12px;margin:0}
.dossier .row{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed var(--line);padding-bottom:10px}
.dossier .row:last-child{border:0;padding:0}
.dossier dt{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.72rem}
.dossier dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}
.count{font-family:var(--display);font-size:4.2rem;font-weight:700;line-height:1;font-variant-numeric:tabular-nums;color:var(--accent)}

section{padding-block:64px;border-bottom:1px solid var(--line)}
.sec-head{display:grid;gap:12px;margin-bottom:32px;max-width:44rem}

.steps{list-style:none;margin:0;padding:0;display:grid}
.step{display:grid;grid-template-columns:3.2rem 1fr;gap:14px;padding:20px 0;border-top:1px solid var(--line)}
.step:last-child{border-bottom:1px solid var(--line)}
.step .n{font-family:var(--display);font-size:2.6rem;font-weight:700;line-height:1;color:var(--line)}
.step .body{display:grid;gap:6px;min-width:0}
.date{font-family:var(--mono);font-weight:600;font-size:.9rem;font-variant-numeric:tabular-nums;color:var(--accent)}
.tbc{font-family:var(--mono);font-weight:600;font-size:.78rem;color:var(--fg);background:var(--line);border:1px dashed var(--fg);padding:1px 6px;justify-self:start}
.step.final .n{color:var(--accent)}
@media (min-width:860px){.steps{grid-template-columns:repeat(5,1fr)}.step{grid-template-columns:1fr;border-top:4px solid var(--line);border-bottom:0!important;padding:18px 16px 0 0}.step.final{border-top-color:var(--accent)}}

/* semifinal gig list */
.gigs{list-style:none;margin:0;padding:0;display:grid;border-top:2px solid var(--accent)}
.gig{display:grid;grid-template-columns:5.5rem 1fr;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.gig .d{font-family:var(--display);font-weight:700;font-size:2rem;color:var(--accent);line-height:.9;font-variant-numeric:tabular-nums}
.gig .d small{display:block;font:500 .7rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.gig .w{display:grid;gap:2px;min-width:0}
.gig .club{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:1.2rem}
.gig .city{color:var(--muted);font-size:.95rem}
.gig .free{justify-self:start;margin-top:6px;font:700 .72rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--on-accent);background:var(--accent);padding:2px 8px}
.gig .map{justify-self:start;margin-top:4px;font:700 .78rem var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--accent);text-decoration:none}
.gig .map:hover{text-decoration:underline}
.gig.open .d{color:var(--line)}
@media (min-width:760px){.gig{grid-template-columns:7rem 1fr auto}}

.apply-grid{display:grid;gap:36px}
@media (min-width:960px){.apply-grid{grid-template-columns:1.25fr 1fr;align-items:start}}
.notice{border-left:4px solid var(--accent);background:var(--panel);padding:14px 16px;margin-bottom:24px;font-size:.95rem}
form{display:grid;gap:22px}
fieldset{border:0;padding:0;margin:0;display:grid;gap:16px}
legend{font-family:var(--display);font-size:1.35rem;font-weight:700;text-transform:uppercase;margin-bottom:6px;padding:0}
.field{display:grid;gap:6px;min-width:0}
.two{display:grid;gap:16px}
@media (min-width:600px){.two{grid-template-columns:1fr 1fr}}
label{font-weight:600;font-size:.92rem}
.req{color:var(--muted)}
.hint{font-size:.82rem;color:var(--muted)}
input[type=text],input[type=email],input[type=tel],input[type=url],textarea{width:100%;background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:0;padding:12px;font:inherit;font-size:1rem}
input:focus,textarea:focus{border-color:var(--accent);outline:none}
textarea{min-height:9rem;resize:vertical}
.file{border:2px dashed var(--line);padding:18px;text-align:center;display:grid;gap:6px}
.file:hover{border-color:var(--accent)}
.file input{width:100%;font-size:.85rem;color:var(--muted)}
.err{color:var(--accent);font-size:.85rem;font-weight:600}
.check{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-weight:400;font-size:.92rem}
.check input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--accent)}
.radios{display:flex;flex-wrap:wrap;gap:10px}
.radios label{display:flex;align-items:center;gap:8px;border:1px solid var(--line);padding:10px 14px;cursor:pointer;font-weight:600}
.radios input{accent-color:var(--accent);width:18px;height:18px;margin:0}
.radios label:has(input:checked){border-color:var(--accent)}
.minor{border:1px solid var(--line);background:var(--panel);padding:16px;display:grid;gap:14px}
.counter{font-family:var(--mono);font-size:.75rem;color:var(--muted);text-align:right}
.form-msg{padding:14px 16px;border:2px solid var(--ok);color:var(--ok);font-weight:600}
.form-msg.bad{border-color:var(--accent);color:var(--accent)}

.artist{border:2px solid var(--fg);background:var(--panel);position:sticky;top:calc(env(safe-area-inset-top,0px) + 80px)}
.artist .tag{display:flex;justify-content:space-between;gap:8px;padding:8px 12px;background:var(--accent);color:var(--on-accent);font:700 .75rem var(--mono);text-transform:uppercase;letter-spacing:.08em}
.photo{aspect-ratio:4/3;max-width:100%;background:
  repeating-linear-gradient(90deg,transparent 0 46px,rgba(66,66,66,.5) 46px 52px),var(--bg);display:grid;place-items:center;color:var(--muted);font-family:var(--mono);font-size:.8rem;overflow:hidden}
.photo img{width:100%;height:100%;object-fit:cover}
.artist .inner{padding:18px;display:grid;gap:12px;min-width:0}
.artist h3{font-size:2rem;overflow-wrap:anywhere}
.artist .bio{font-size:.95rem;white-space:pre-line;overflow-wrap:anywhere}
.links{display:flex;flex-wrap:wrap;gap:8px}
.links a{font:700 .8rem var(--mono);text-transform:uppercase;border:1px solid var(--accent);padding:6px 10px;text-decoration:none}
.artist .music{border-top:1px solid var(--line);padding-top:12px;display:grid;gap:10px}
@media (max-width:959px){.artist{position:static}}

.band-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr))}
.band{border:1px solid var(--line);background:var(--panel);display:grid}
.band .photo{aspect-ratio:1}
.band .inner{padding:14px;display:grid;gap:4px}
.band h3{font-size:1.5rem}
.empty{border:2px dashed var(--line);padding:24px;color:var(--muted);display:grid;gap:8px;align-content:center}

.rules{display:grid;gap:12px;max-width:44rem}
details{border:1px solid var(--line);background:var(--panel)}
summary{cursor:pointer;padding:16px;font-family:var(--display);font-weight:700;font-size:1.05rem;list-style:none;display:flex;justify-content:space-between;gap:12px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:var(--mono);color:var(--accent)}
details[open] summary::after{content:"–"}
details .dbody{padding:0 16px 16px;display:grid;gap:8px;color:var(--muted)}
details .dbody ul{margin:0;padding-left:1.2em;display:grid;gap:4px}

.club-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr))}
.club-card{background:var(--panel);border-top:4px solid var(--accent);display:grid;align-content:start}
.club-photos{display:grid;grid-template-columns:2fr 1fr;gap:2px}
.club-photos .ph,.club-photos img{aspect-ratio:4/3;width:100%;object-fit:cover;background:repeating-linear-gradient(90deg,transparent 0 22px,rgba(66,66,66,.5) 22px 26px),var(--bg);display:grid;place-items:center;color:var(--muted);font:600 .7rem var(--mono);text-transform:uppercase;letter-spacing:.06em;text-align:center}
.club-photos .ph:nth-child(2){aspect-ratio:auto}
.club-photos.one{grid-template-columns:1fr}
.club-photos.one img{aspect-ratio:2/1;object-fit:cover;object-position:center 40%}
.club-body{padding:18px;display:grid;gap:8px;min-width:0}
.club-body .map{justify-self:start;font:700 .78rem var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--accent);text-decoration:none}
.club-body .map:hover{text-decoration:underline}
.press{margin-top:24px;color:var(--muted)}
.p-grid{display:grid;gap:16px}
@media (min-width:760px){.p-grid{grid-template-columns:repeat(3,1fr)}}
.p-card{border-top:4px solid var(--accent);background:var(--panel);padding:20px;display:grid;gap:10px;align-content:start}
.mail{font-family:var(--mono);font-size:.95rem;user-select:all;overflow-wrap:anywhere}
.logos{display:grid;grid-template-columns:repeat(auto-fill,minmax(8rem,1fr));gap:12px;margin-top:28px}
.logos div{aspect-ratio:3/2;border:1px dashed var(--line);display:grid;place-items:center;color:var(--muted);font:600 .72rem var(--mono);text-transform:uppercase}
.privacy{display:grid;gap:14px;max-width:44rem}
.privacy dl{display:grid;gap:10px;margin:0}
.privacy dt{font-family:var(--display);font-weight:700;text-transform:uppercase}
.privacy dd{margin:0;color:var(--muted)}
.privacy dd.addr{margin-top:6px;color:var(--fg);font-variant-numeric:tabular-nums}

footer{padding-block:40px 120px;color:var(--muted);font-size:.88rem}
footer .wrap{display:grid;gap:18px}
footer .links-f{display:flex;flex-wrap:wrap;gap:18px}
footer .powered{border-top:1px solid var(--line);padding-top:16px;font-size:.8rem;letter-spacing:.04em}
footer button.linklike{background:none;border:0;color:var(--accent);font:inherit;text-decoration:underline;cursor:pointer;padding:0}

.cookie{position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--fg);color:var(--bg);padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));padding-top:16px;box-shadow:0 -8px 30px rgba(0,0,0,.6)}
.cookie .wrap{display:grid;gap:12px}
.cookie p{font-size:.9rem;max-width:48rem}
.cookie a{color:var(--bg);font-weight:700}
.cookie .row{display:flex;flex-wrap:wrap;gap:10px}
.cookie .btn{min-height:44px;font-size:.85rem;border-color:var(--bg)}
.cookie .btn-primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.cookie .btn-primary:hover{background:var(--bg);border-color:var(--bg);color:var(--fg)}
.cookie .btn-ghost{color:var(--bg)}
.cookie .btn-ghost:hover{background:var(--bg);color:var(--fg)}
.cookie .opts{display:grid;gap:8px;font-size:.88rem}
.cookie .check input{accent-color:var(--bg)}

.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.btn[disabled]{opacity:.6;cursor:progress}
.opt{font-family:var(--body);font-size:.85rem;font-weight:400;text-transform:none;color:var(--muted)}

/* ===== Fan page (bands/) ===== */
nav a[aria-current="page"]{color:var(--accent)}
.demo-bar{background:repeating-linear-gradient(-45deg,var(--accent) 0 12px,var(--bg) 12px 24px);padding:3px 0}
.demo-bar span{display:block;background:var(--line);color:var(--fg);font:600 .72rem var(--mono);text-align:center;padding:4px 16px;letter-spacing:.08em;text-transform:uppercase}
.fan-hero{padding-block:48px 40px;background:
  linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,.55) 55%,var(--bg) 100%),
  linear-gradient(90deg,var(--bg) 0%,rgba(0,0,0,.55) 45%,rgba(0,0,0,0) 80%),
  url("../img/hero-bash-m.jpg") right -190px top/auto 100% no-repeat,var(--bg)}
@media (min-width:560px) and (max-width:859px){.fan-hero{background:
  linear-gradient(180deg,rgba(0,0,0,.3) 0%,rgba(0,0,0,.5) 60%,var(--bg) 100%),
  linear-gradient(90deg,var(--bg) 0%,var(--bg) 42%,rgba(0,0,0,.4) 62%,rgba(0,0,0,0) 85%),
  url("../img/hero-bash-m.jpg") right top/auto 100% no-repeat,var(--bg)}}
@media (min-width:860px){.fan-hero{min-height:620px;height:620px;display:flex;align-items:center;background:
  linear-gradient(90deg,var(--bg) 0,var(--bg) calc(50% + 20px),rgba(0,0,0,.4) calc(50% + 90px),rgba(0,0,0,0) calc(50% + 190px)),
  linear-gradient(0deg,var(--bg) 0,rgba(0,0,0,0) 90px),
  linear-gradient(90deg,rgba(0,0,0,0) 72%,var(--bg) 99%) left calc(50vw + 20px) center/685px 100% no-repeat,
  url("../img/hero-bash.jpg") left calc(50vw + 20px) center/685px 620px no-repeat,var(--bg)}
  .fan-hero>.wrap{width:100%}}
.fan-hero .sec-head{margin-bottom:0}
.fan-title{font-size:clamp(2.6rem,12vw,5.2rem);font-style:italic;line-height:.92;color:var(--fg)}
.fan-hero .lead,.fan-hero .fan-title,.fan-hero .label{text-shadow:0 2px 14px rgba(0,0,0,.9)}

.semis-sec{padding-block:48px}
.semis-top{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:20px}
.car-nav{display:flex;gap:8px}
.car-btn{width:48px;height:48px;background:transparent;color:var(--accent);border:2px solid var(--accent);font:700 1.2rem var(--display);cursor:pointer}
.car-btn:hover:not([disabled]){background:var(--accent);color:var(--on-accent)}
.car-btn[disabled]{opacity:.3;cursor:default}

/* mobile: swipeable carousel, one semifinal per slide, next one peeks in */
.semis{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-inline:calc(-1 * max(16px,env(safe-area-inset-left,0px)));padding-inline:max(16px,env(safe-area-inset-left,0px));scroll-padding-inline:max(16px,env(safe-area-inset-left,0px))}
.semis::-webkit-scrollbar{display:none}
.semis:focus-visible{outline-offset:-3px}
.semi{flex:0 0 min(86%,26rem);scroll-snap-align:start;background:var(--panel);border-top:4px solid var(--accent);padding:16px;display:grid;gap:14px;align-content:start;min-width:0}
.semi.open{border-top-color:var(--line)}
.semi-h{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center}
.semi-h .d{font-family:var(--display);font-weight:700;font-size:2.2rem;color:var(--accent);line-height:.9;font-variant-numeric:tabular-nums}
.semi-h .d small{display:block;font:500 .7rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.semi-h .d.open{color:var(--line)}
.semi-h .w{display:grid;gap:2px;min-width:0}
.semi-h .no{font:600 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.semi-h .up{font-weight:700;color:var(--on-accent);background:var(--fg);padding:0 6px}
.semi-h .club{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:1.25rem;line-height:1.05;overflow-wrap:anywhere}
.semi-h .city{color:var(--muted);font-size:.95rem}
.semi-meta{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}
.semi-meta .free{font:700 .72rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--on-accent);background:var(--accent);padding:2px 8px}
.semi-meta .map{font:700 .75rem var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--accent);text-decoration:none}
.semi-meta .map:hover{text-decoration:underline}

.lineup{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bcard{display:grid;gap:2px;text-decoration:none;color:var(--fg);min-width:0}
.bcard .bph{aspect-ratio:1;font-size:.7rem;margin-bottom:6px;outline:1px solid var(--line);outline-offset:-1px}
.bcard .bph img{transition:transform .25s ease}
.bcard .nm{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:1rem;line-height:1.1;overflow-wrap:anywhere}
.bcard .gn{font-size:.78rem;color:var(--muted);line-height:1.3}
a.bcard:hover .nm,a.bcard:focus-visible .nm{color:var(--accent)}
a.bcard:hover .bph{outline:2px solid var(--accent);outline-offset:-2px}
a.bcard:hover .bph img{transform:scale(1.04)}
.bcard.tbd .nm{color:var(--muted)}
.bcard.tbd .bph{outline-style:dashed}

.car-dots{display:flex;justify-content:center;gap:4px;margin-top:14px}
.car-dots button{width:32px;height:32px;padding:0;background:none;border:0;cursor:pointer;display:grid;place-items:center}
.car-dots span{width:10px;height:10px;background:var(--line);transition:width .2s ease,background .2s ease}
.car-dots button[aria-current="true"] span{width:24px;background:var(--accent)}
.semis-note{margin-top:12px}

/* desktop: all semifinals visible in a grid */
@media (min-width:900px){
  .semis{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;overflow:visible;margin-inline:0;padding-inline:0}
  .semi{flex:none}
  .car-nav,.car-dots{display:none}
}

.final-teaser{padding-block:48px}
.final-grid{display:grid;gap:16px}
.final-body{display:grid;gap:8px;max-width:38rem}
@media (min-width:760px){.final-grid{grid-template-columns:1fr 2fr;align-items:start}}

/* ===== Artist page (bands/band.html) ===== */
.artist-page{padding-block:24px 64px}
.back{display:inline-block;font:700 .8rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--accent);text-decoration:none;padding:8px 0;margin-bottom:12px}
.back:hover{text-decoration:underline}
.ap{display:grid;gap:0;border:2px solid var(--fg);background:var(--panel)}
.ap-photo{aspect-ratio:3/2}
.ap-body{padding:20px;display:grid;gap:14px;min-width:0;align-content:start}
.ap-name{font-size:clamp(2.2rem,10vw,4rem);font-style:italic;line-height:.95;overflow-wrap:anywhere}
.ap-gig{display:grid;gap:2px;justify-self:start;border-left:4px solid var(--accent);padding:6px 12px;background:var(--bg);text-decoration:none;color:var(--fg)}
.ap-gig .lbl{font:600 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.ap-gig .when{font:700 1.1rem var(--display);color:var(--accent);font-variant-numeric:tabular-nums}
.ap-gig .where{font-weight:600}
.ap-gig:hover .where{text-decoration:underline;text-decoration-color:var(--accent)}
.ap-bio{white-space:pre-line;overflow-wrap:anywhere;max-width:40rem}
.ap-block{border-top:1px solid var(--line);padding-top:14px;display:grid;gap:10px}
.ap-block .links a{padding:10px 14px;font-size:.85rem}
.ap-block .links a:hover{background:var(--accent);color:var(--on-accent)}
@media (min-width:900px){
  .ap{grid-template-columns:1.1fr 1fr}
  .ap-photo{aspect-ratio:auto;min-height:24rem;position:relative}
  .ap-photo img{position:absolute;inset:0}
  .ap-body{padding:28px}
}
.ap-more{border:0;padding-block:40px 0}
.ap-more-t{font-size:clamp(1.6rem,5vw,2.4rem);margin-bottom:16px}
.lineup-more{grid-template-columns:repeat(auto-fill,minmax(9rem,1fr));max-width:44rem}
.ap-missing{margin-top:12px;justify-items:start}

/* ===== Festival page (festival/): 2027 gravekeeper key visual =====
   Night-blue fog and lantern glow taken from the 2027 visual; brand black/orange/white stay the base. */
.fest{
  --night:#07141d;       /* deep night blue from the 2027 visual */
  --fog:#16303f;         /* fog blue */
  --lantern:#f2a33a;     /* lantern glow, warm sister of the brand orange */
}
.fx-hero{position:relative;overflow:hidden;padding-block:0;background:var(--night);border-bottom:1px solid var(--line)}
.fx-hero-img{height:min(92vw,30rem);background:
  linear-gradient(180deg,rgba(7,20,29,0) 55%,var(--night) 100%),
  url("../img/hero-bash-m.jpg") center 18%/cover no-repeat}
.fx-hero-in{position:relative;display:grid;gap:14px;padding-block:0 48px;margin-top:-56px}
.fx-title{font-size:clamp(2.6rem,12vw,6rem);font-style:italic;line-height:.9;text-shadow:0 2px 18px rgba(0,0,0,.9)}
.fx-title span{display:block;color:var(--accent)}
.fx-date{font:700 clamp(1.1rem,4vw,1.5rem) var(--display);text-transform:uppercase;color:var(--lantern);letter-spacing:.02em}
.fx-facts{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px 28px}
.fx-facts li{display:grid;gap:0}
.fx-facts b{font:700 2rem var(--display);line-height:1;font-variant-numeric:tabular-nums}
.fx-facts span{font:600 .72rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.fx-tnote{margin-top:-4px}
@media (min-width:860px){
  .fx-hero{min-height:38rem;display:grid;align-items:center;background:
    radial-gradient(28rem 28rem at 62% 58%,rgba(242,163,58,.14),transparent 70%),var(--night)}
  .fx-hero-img{position:absolute;top:0;bottom:0;right:0;left:auto;height:auto;aspect-ratio:1800/1630;max-width:72%;background:
    linear-gradient(0deg,var(--night) 0%,rgba(7,20,29,0) 28%),
    url("../img/hero-bash.jpg") center/cover no-repeat;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 38%);mask-image:linear-gradient(90deg,transparent 0,#000 38%)}
  .fx-hero-in{margin-top:0;padding-block:72px;width:100%}
  .fx-hero-in>*{max-width:30rem}
}
@media (min-width:1000px){.stages{grid-template-columns:repeat(5,1fr)}}

.fx-morgue{background:linear-gradient(180deg,var(--night),var(--bg))}
.fx-morgue-grid{display:grid;gap:8px}
.fx-morgue-body{display:grid;gap:14px;max-width:40rem}
.fx-morgue-body .ctas{margin-top:8px}
@media (min-width:860px){.fx-morgue-grid{grid-template-columns:1fr 1.4fr;align-items:start;gap:40px}.fx-morgue .sec-head{margin-bottom:0}}

.fx-lineup-grid{display:grid;gap:36px}
@media (min-width:900px){.fx-lineup-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);align-items:start}}
.fx-poster{margin:0;display:grid;gap:10px;align-content:start}
.fx-poster img{width:100%;height:auto;display:block;border:2px solid var(--fg);background:var(--panel)}
.fx-poster-ph{aspect-ratio:2/3;max-width:100%;border:2px dashed var(--line);display:grid;place-items:center;color:var(--muted);font:600 .8rem var(--mono);text-transform:uppercase;letter-spacing:.08em;background:
  radial-gradient(60% 40% at 50% 60%,rgba(242,163,58,.12),transparent 70%),var(--night)}
.fx-poster figcaption a{font:700 .78rem var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--accent);text-decoration:none}
.fx-poster figcaption a:hover{text-decoration:underline}
.fx-names{display:grid;gap:18px;justify-items:start;min-width:0}
.fx-names .sec-head{margin-bottom:0}
.names{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 0;font-family:var(--display);font-weight:700;text-transform:uppercase;line-height:1.15}
.names li{font-size:1rem;color:var(--muted)}
.names li.b{font-size:clamp(1.3rem,4.5vw,1.9rem);color:var(--fg)}
.names li:not(:last-child)::after{content:"·";color:var(--accent);margin-inline:.45em;font-size:1rem}

.fx-stages{background:linear-gradient(180deg,var(--bg),var(--night))}
.stages{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,14rem),1fr))}
.stages li{background:var(--panel);border-top:4px solid var(--line);padding:18px;display:grid;gap:8px;align-content:start}
.stages li p{color:var(--muted);font-size:.95rem}
.stages li.hl{border-top-color:var(--accent);background:linear-gradient(180deg,rgba(240,110,50,.14),var(--panel) 70%)}
.stages li.hl h3{color:var(--accent)}
.stages li.bar{border-top-style:dashed}

.fx-tickets{background:var(--night)}
.fx-tix{display:grid;gap:28px}
.fx-tix h2{margin-block:8px 10px}
.fx-tix-links{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center}
.fx-link{font:700 .85rem var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--fg);text-decoration:none;border-bottom:2px solid var(--accent);padding-bottom:2px}
.fx-link:hover{color:var(--accent)}
.fx-social{display:grid;gap:10px;border-top:1px solid var(--fog);padding-top:20px}
.fx-social .links a:hover{background:var(--accent);color:var(--on-accent)}
.fx-mayhem{font:700 italic clamp(1.4rem,5vw,2rem) var(--display);text-transform:uppercase;color:var(--accent);line-height:1;text-shadow:0 2px 14px rgba(0,0,0,.9)}
.fan-fest{margin-top:14px;font:600 .75rem var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.fan-fest a{color:var(--accent);text-decoration:none}
.fan-fest a:hover{text-decoration:underline}

/* ---- UNDER ONE FLAG title (fan page): Belgian tricolour banners + steel plate ---- */
:root{--be-black:#0b0b0b;--be-yellow:#fdda24;--be-red:#ef3340}
.uof{display:flex;width:fit-content;max-width:100%;align-items:stretch;gap:0;margin:0 auto 28px 0;font-weight:700}
.uof-flag{flex:0 0 clamp(18px,3vw,34px);
  background:linear-gradient(90deg,var(--be-black) 0 33.4%,var(--be-yellow) 33.4% 66.7%,var(--be-red) 66.7% 100%);
  box-shadow:inset 1px 0 0 var(--line);
  clip-path:polygon(0 0,100% 0,100% 86%,88% 100%,76% 90%,64% 100%,52% 88%,40% 100%,28% 91%,16% 100%,0 89%)}
.uof-plate{flex:1 1 auto;min-width:0;position:relative;display:grid;justify-items:center;align-content:center;gap:clamp(6px,1vw,10px);
  padding:clamp(10px,1.6vw,18px) clamp(10px,1.6vw,18px);
  background:linear-gradient(180deg,rgba(66,66,66,.35),rgba(20,20,20,.6));
  border-block:2px solid var(--line)}
.uof-k{font-family:var(--display);font-style:italic;font-weight:700;text-transform:uppercase;white-space:nowrap;line-height:1;
  font-size:clamp(.72rem,2.6vw,1.2rem);letter-spacing:.32em;margin-right:-.32em;color:var(--fg);text-shadow:0 2px 0 #000}
.uof-k b{color:var(--accent);font-weight:700}
.uof-t{font-family:var(--display);font-style:italic;text-transform:uppercase;white-space:nowrap;line-height:.95;letter-spacing:.01em;
  font-size:clamp(1.35rem,6vw,3.1rem);color:var(--fg);text-shadow:0 3px 0 #000,0 0 22px rgba(0,0,0,.9)}
.uof-t b{font-weight:700;color:var(--accent)}
.uof-rule{display:block;width:min(60%,320px);height:6px;
  background:linear-gradient(90deg,var(--be-black) 0 33.4%,var(--be-yellow) 33.4% 66.7%,var(--be-red) 66.7% 100%);
  box-shadow:0 0 0 1px var(--line)}

/* ---- Sponsors + tickets in the footer (all pages) ---- */
.foot-spons{display:grid;gap:12px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.foot-spons .sponsor{margin-top:0}
.foot-spons .fan-fest{margin-top:0}

/* ---- Mobile menu (hamburger) ---- */
.menu-btn{display:inline-grid;place-items:center;flex:0 0 auto;width:42px;height:38px;margin-left:8px;background:none;border:1px solid var(--line);color:var(--fg);cursor:pointer;padding:0}
.menu-btn span,.menu-btn span::before,.menu-btn span::after{display:block;width:20px;height:2px;background:currentColor;position:relative;transition:transform .2s,top .2s,background .2s}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0}
.menu-btn span::before{top:-6px}.menu-btn span::after{top:6px}
.menu-open .menu-btn{border-color:var(--accent);color:var(--accent)}
.menu-open .menu-btn span{background:transparent}
.menu-open .menu-btn span::before{top:0;transform:rotate(45deg)}
.menu-open .menu-btn span::after{top:0;transform:rotate(-45deg)}
@media (max-width:899px){
  header .lang{margin-left:auto}
  .menu-open header nav{display:flex;flex-direction:column;gap:0;position:absolute;top:100%;left:0;right:0;margin:0;
    background:var(--bg);border-bottom:2px solid var(--accent);padding:4px 16px 12px;box-shadow:0 18px 30px rgba(0,0,0,.7)}
  .menu-open header nav a{padding:14px 0;border-bottom:1px solid var(--line);font-family:var(--display);font-size:1.05rem;text-transform:uppercase;letter-spacing:.04em}
  .menu-open header nav a:last-child{border-bottom:0}
}
@media (max-width:380px){header .logo{font-size:.9rem}.lang button{min-width:32px;padding:8px 5px}.menu-btn{margin-left:6px}}
@media (min-width:900px){.menu-btn{display:none}}

/* ---- Home hero: small Belgian flag detail next to the Z of "ALCATRAZ" ---- */
.hero h1 .be-flag{display:inline-block;width:.42em;height:.3em;margin-left:.14em;vertical-align:.4em;
  background:linear-gradient(90deg,var(--be-black) 0 33.4%,var(--be-yellow) 33.4% 66.7%,var(--be-red) 66.7% 100%);
  box-shadow:0 0 0 2px var(--line);transform:skewX(-10deg)}

/* ---- Fan page: "AND SO IT BEGINS" above the UNDER ONE FLAG banner ---- */
.uof-pre{width:fit-content;white-space:nowrap;margin:0 0 12px;font-family:var(--display);font-style:italic;font-weight:700;text-transform:uppercase;
  font-size:clamp(1rem,3.4vw,1.6rem);letter-spacing:.14em;line-height:1;color:var(--fg);text-shadow:0 2px 12px rgba(0,0,0,.9)}

/* ---- Fan page, phones: wider UNDER ONE FLAG banner so the text has room ---- */
@media (max-width:559px){
  .uof{width:100%}
  .uof-flag{flex-basis:20px}
  .uof-plate{padding:14px 12px}
  .uof-t{font-size:min(8vw,2.1rem)}
  .uof-k{font-size:min(3.2vw,.85rem);letter-spacing:.3em;margin-right:-.3em}
}

/* ---- Footer sponsors, phones: "Powered by" on top, logos stacked ---- */
@media (max-width:599px){
  .foot-spons .sponsor{flex-direction:column;align-items:flex-start;gap:16px}
  .foot-spons .sponsor img,.foot-spons .sponsor img.alc,.foot-spons .sponsor img.rt{margin:0}
  .foot-spons .sponsor img.alc{height:60px}
  .foot-spons .sponsor img{height:56px}
  .foot-spons .sponsor img.rt{height:34px}
}

.final-body .fan-fest{margin-top:14px}

/* ---- Sponsor row: Graviton Management logo after Rock Tribune ---- */
.sponsor img.grv{height:46px;margin-left:8px}
@media (max-width:599px){.foot-spons .sponsor img.grv{height:46px;margin:0}}

footer p.copy{margin-bottom:-14px}

/* ---- Fan page: UNDER ONE FLAG banner image (17 Oct 2026, replaces the CSS banner) ---- */
.uof-img{margin:0 0 26px;line-height:0}
.uof-img img{display:block;width:min(100%,600px);height:auto;
  -webkit-mask-image:radial-gradient(ellipse 72% 78% at 50% 50%,#000 78%,transparent 100%);
          mask-image:radial-gradient(ellipse 72% 78% at 50% 50%,#000 78%,transparent 100%)}
@media (max-width:559px){.uof-img img{width:100%}}

/* ---- Fan page: "And so it begins…" as the opening line of the intro text (under the banner) ---- */
.fan-hero .sec-head .uof-pre{width:auto;white-space:normal;margin:0 0 10px;font-size:clamp(1.15rem,2.6vw,1.6rem);letter-spacing:.12em}

/* ---- Fan page: square UNDER ONE FLAG banner (17 Oct 2026): small, so the gravekeeper stays visible ---- */
.uof-img img{width:300px;max-width:100%;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent),linear-gradient(180deg,transparent,#000 3%,#000 97%,transparent);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent),linear-gradient(180deg,transparent,#000 3%,#000 97%,transparent);
  mask-composite:intersect}
@media (max-width:559px){.uof-img img{width:200px}}

/* ---- Fan page: wider UNDER ONE FLAG banner, ends just before the gravekeeper (17 Oct 2026) ---- */
.uof-img img{width:min(520px,calc(50vw - 16px))}
@media (min-width:560px) and (max-width:859px){.uof-img img{width:300px}}
@media (max-width:559px){.uof-img img{width:215px}}

/* ---- Fan page: UNDER ONE FLAG banner is a transparent PNG (17 Oct 2026): no edge fade needed ---- */
.uof-img img{-webkit-mask-image:none;mask-image:none;filter:drop-shadow(0 6px 18px rgba(0,0,0,.6))}

/* ---- Fan page header (17 Oct 2026): ALCATRAZ BASH 2027 + tagline UNDER ONE FLAG + thick Belgian bar.
        Replaces the banner image. Left edge lines up with the intro text (frame padding 20px). ---- */
.fan-head{display:grid;width:fit-content;max-width:100%;gap:10px;margin:0 0 26px;padding-left:20px}
.fan-h1{font-family:var(--display);font-style:italic;font-weight:700;text-transform:uppercase;line-height:.92;
  font-size:clamp(2.6rem,9vw,4.6rem);margin:0;color:var(--fg);text-shadow:0 2px 14px rgba(0,0,0,.9)}
.fan-h1 span{display:block;color:var(--accent)}
.fan-tag{margin:6px 0 0;font-family:var(--display);font-style:italic;font-weight:700;text-transform:uppercase;
  font-size:clamp(1.05rem,2.6vw,1.5rem);letter-spacing:.2em;line-height:1;color:var(--fg);text-shadow:0 2px 12px rgba(0,0,0,.9)}
.be-bar{display:block;height:10px;width:100%;margin-top:4px;transform:skewX(-14deg);
  background:linear-gradient(90deg,var(--be-black) 0 33.4%,var(--be-yellow) 33.4% 66.7%,var(--be-red) 66.7% 100%);
  box-shadow:0 0 0 1px var(--line),0 4px 14px rgba(0,0,0,.6)}

/* ---- Home hero: thick Belgian bar under BASH 2027 (replaces the small flag, 17 Oct 2026) ---- */
.hero h1{width:fit-content;max-width:100%}
.hero h1 .be-flag{display:none}
.hero h1 .be-bar{height:12px;margin-top:16px;margin-left:.06em}