@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700;800;900&family=New+Rocker&family=Oswald:wght@400;500;600;700&display=swap');
:root {
  color-scheme: dark;
  --black: #070606;
  --ink: #0e0908;
  --panel: #120b0a;
  --panel-soft: #1d1110;
  --oxblood: #570c0e;
  --blood: #b41b22;
  --crimson: #ef302f;
  --copper: #a56b41;
  --gold: #d7b987;
  --pale: #f1dfbc;
  --muted: #b19c82;
  --border: #6b4734;
  --shadow: 0 22px 60px rgba(0,0,0,.72);
  --serif: 'Cinzel', Georgia, 'Times New Roman', serif;
  --rock: 'New Rocker', Georgia, serif;
  --sans: 'Oswald', 'Arial Narrow', Impact, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 105px; }
body { margin: 0; background: var(--black); color: var(--pale); font-family: var(--sans); font-size: 16px; line-height: 1.5; min-width: 320px; overflow-x: clip; }
body::before { content: ''; position: fixed; inset: 0; pointer-events: none; opacity: .15; z-index: 70; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' seed='8' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.2' filter='url(%23n)'/%3E%3C/svg%3E"); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .7; }
a, button, input { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid #f1bf69; outline-offset: 4px; }
button:focus:not(:focus-visible), a:focus:not(:focus-visible) { outline: none; }
img, svg { max-width: 100%; }
.shell { width: min(100% - 56px, 1500px); margin-inline: auto; }
.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; }
.skip-link { position: fixed; top: 8px; left: 8px; padding: 12px 18px; background: #fff; color: #000; transform: translateY(-160%); z-index: 300; }
.skip-link:focus { transform: none; }
.svg-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon { display: inline-block; width: 22px; height: 22px; flex: 0 0 auto; }
.icon-sm { width: 16px; height: 16px; }

/* Forged announcement and sticky header */
.announcement { display: flex; gap: clamp(10px,2.5vw,33px); align-items: center; justify-content: center; min-height: 36px; padding: 6px 15px; color: #f1d4a9; text-align: center; letter-spacing: .25em; font: 600 12px/1.4 var(--serif); background: repeating-linear-gradient(135deg, transparent 0 9px, rgba(0,0,0,.13) 9px 11px), linear-gradient(90deg,#2f0607,#6f0b0d 34%,#3f0809 67%,#220405); border-bottom: 1px solid #bf633c; box-shadow: inset 0 -1px #230505; }
.announcement-deco { color: #db9f62; letter-spacing: .05em; white-space: nowrap; }
.announcement-divider { color: #f26b49; }
.site-header { position: sticky; z-index: 90; top: 0; background: rgba(7,6,6,.97); border-bottom: 1px solid rgba(177,109,63,.65); box-shadow: 0 10px 30px rgba(0,0,0,.75); backdrop-filter: blur(14px); }
.header-inner { min-height: 91px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.brand { display: block; width: clamp(232px,24vw,338px); min-width: 214px; height: 80px; position: relative; flex: 0 0 auto; }
.brand-fallback, .brand-original { position: absolute; inset: 0; transition: opacity .22s ease; }
.brand-fallback { display: flex; align-items: center; gap: 5px; opacity: 1; }
.brand-fallback img { width: 66px; filter: drop-shadow(0 0 7px rgba(218,55,38,.5)); }
.brand-letters { display: flex; flex-direction: column; white-space: nowrap; line-height: 1; }
.brand-letters strong { font-family: var(--rock); font-size: clamp(24px,2.25vw,37px); letter-spacing: -.035em; color:#efdbb3; text-shadow: 1px 3px 3px #000, 0 0 15px rgba(198,72,41,.35); }
.brand-letters small { font-size: 17px; color: var(--crimson); letter-spacing: .57em; margin-top: 7px; text-align: center; font-weight: 700; }
.brand-original { width: 100%; height: 100%; object-fit: contain; object-position: left center; opacity: 0; }
.brand.logo-loaded .brand-original { opacity: 1; }
.brand.logo-loaded .brand-fallback { opacity: 0; }
.main-nav { display: flex; align-items: center; justify-content: center; gap: clamp(15px,2.25vw,38px); margin-left: auto; white-space: nowrap; }
.main-nav > a { position: relative; font: 700 clamp(14px,1.1vw,18px)/1 var(--serif); text-transform: uppercase; color: #e7d3bb; letter-spacing: -.035em; padding-block: 36px; transition: color .18s ease; }
.main-nav a:hover, .main-nav a:focus-visible { color: #fff; }
.main-nav a.nav-current::after, .main-nav a:hover::after { content: ''; position: absolute; bottom: 26px; height: 3px; width: 60%; background: var(--crimson); transform: skewX(-38deg); left: 20%; box-shadow: 0 0 12px var(--crimson); }
.main-nav a span { color: var(--gold); margin-left: 2px; }
.header-actions { display: flex; align-items: center; gap: 12px; }
.btn-metal { position: relative; isolation: isolate; display: inline-flex; align-items: center; justify-content: center; gap: 13px; padding: 15px 19px; min-height: 57px; color: #1b0f09; border: 2px ridge #ebd1a3; border-radius: 6px; background: linear-gradient(145deg,#f3d7a4 0%,#bd8f62 37%,#d4b17c 48%,#a56c41 100%); box-shadow: 0 0 0 3px #322019, 0 0 0 4px #97714a, inset 0 1px rgba(255,255,255,.4), 0 7px 20px #000; font: 800 17px/1 var(--serif); white-space: nowrap; }
.btn-metal:hover { filter: brightness(1.13); }
.btn-metal:active { transform: translateY(1px); }
.mobile-menu-toggle { display:none; width: 44px; height: 44px; align-items:center; justify-content: center; color: var(--gold); background: #1a0d0b; border: 1px solid var(--border); border-radius: 3px; }
.mobile-menu-toggle .menu-close { display: none; }
.mobile-menu-toggle[aria-expanded="true"] .menu-close { display: block; }
.mobile-menu-toggle[aria-expanded="true"] .menu-open { display: none; }

/* Hero */
.hero { position: relative; isolation: isolate; background: #0b0707 url('../images/hero-metal-legacy.jpg') center 42% / cover no-repeat; min-height: 555px; overflow: hidden; }
@supports (background-image: image-set(url('../images/hero-metal-legacy.webp') type('image/webp'))) { .hero { background-image: image-set(url('../images/hero-metal-legacy.webp') type('image/webp'), url('../images/hero-metal-legacy.jpg') type('image/jpeg')); } }
.hero::before { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(6,4,4,.92) 0%,rgba(7,3,3,.69) 22%,rgba(7,4,4,.05) 48%,rgba(7,4,4,.3) 68%,rgba(5,4,4,.81) 100%),linear-gradient(0deg,rgba(4,3,3,.95),transparent 23%,transparent 79%,rgba(0,0,0,.35)); }
.hero-overlay { position: absolute; z-index: 1; inset: 0; pointer-events: none; background: radial-gradient(ellipse 58% 84% at 53% 44%,transparent 10%,rgba(0,0,0,.2) 70%,rgba(0,0,0,.55) 100%); }
.hero-inner { position: relative; z-index: 2; min-height: 555px; display: grid; grid-template-columns: minmax(0,1fr) minmax(350px,408px); gap: clamp(28px,4vw,70px); align-items: center; padding-block: 70px 80px; }
.hero-content { max-width: 570px; align-self: center; transform: translateY(-12px); }
.eyebrow { display: flex; align-items: center; gap: 12px; color: #f5ca84; font: 700 14px/1.4 var(--serif); letter-spacing: .16em; text-shadow: 0 2px 10px #000; }
.red-line { width: 30px; height: 3px; background: var(--crimson); box-shadow: 0 0 8px var(--crimson); }
.hero h1 { margin: 19px 0 14px; color: #f4deb9; font-family: var(--rock); font-size: clamp(57px,6.4vw,105px); font-weight: 400; line-height: .97; letter-spacing: -.065em; text-shadow: 3px 5px 2px #100b09, 7px 10px 15px #000, 0 0 30px rgba(0,0,0,.8); }
.hero h1 span { display: inline-block; color:#f1cf9e; text-shadow: 3px 5px 2px #100b09,7px 10px 15px #000,0 0 30px rgba(0,0,0,.8); }
.hero-tagline { margin: 16px 0 0; font: 500 clamp(19px,2.1vw,27px)/1.4 Georgia,serif; color: #f2dfc1; text-shadow: 0 3px 10px #000; }
.hero-tagline em { color: #f3d2a4; }
.hero-subline { color: #c3ae97; font: 400 16px/1.5 var(--sans); letter-spacing: .025em; margin-top: 8px; }
.text-link { display: inline-flex; align-items: center; gap: 11px; margin-top: 16px; padding-bottom: 5px; color: var(--pale); border-bottom: 2px solid #ac2827; text-transform: uppercase; font: 600 13px var(--serif); letter-spacing: .08em; }
.text-link:hover { color: white; }
.text-link .icon { color: var(--crimson); }
.hero-bottom-edge { position: absolute; bottom: 0; left: 0; width: 100%; height: 7px; background: linear-gradient(0deg,#140b07,#b22722 45%,#48201a 80%,transparent); box-shadow: 0 0 22px rgba(236,39,32,.55); }

/* Radio widget: real HTMLAudioElement + real nowplaying endpoint */
.radio-panel { position: relative; border: 3px ridge #936b47; padding: 19px 25px 16px; color: var(--pale); background: linear-gradient(135deg,rgba(31,19,16,.95),rgba(10,8,8,.97) 36%,rgba(20,10,10,.97)); box-shadow: inset 0 0 0 2px #170d09, inset 0 0 36px rgba(0,0,0,.83), 0 20px 60px #000, 0 0 16px rgba(218,51,29,.1); outline: 2px solid #241714; outline-offset: 4px; }
.radio-panel::before { content: ''; pointer-events: none; position: absolute; inset: 8px; border: 1px solid rgba(150,101,60,.27); }
.panel-corner { position: absolute; z-index: 2; border: 2px solid #d7aa76; background: #27130d; border-radius: 50%; width: 9px; height: 9px; box-shadow: inset 0 0 2px #000; }
.panel-corner-tl { top: 5px; left: 5px; }.panel-corner-tr { top: 5px; right: 5px; }.panel-corner-bl { bottom: 5px; left: 5px; }.panel-corner-br { bottom: 5px; right: 5px; }
.radio-heading { display: flex; gap: 9px; justify-content: center; align-items: center; color: #ead0a7; text-align: center; font: 700 clamp(17px,1.3vw,21px)/1.3 var(--serif); letter-spacing: .085em; padding: 2px 0 17px; white-space: nowrap; }
.radio-heading span { color: #df613b; font-family: Georgia,serif; font-size: 22px; }
.onair-row { display:flex; align-items:center; gap: 14px; border-top:1px solid rgba(189,140,92,.32); border-bottom:1px solid rgba(189,140,92,.32); padding: 13px 0; color: #d6bfa0; font: 500 11px/1 var(--serif); letter-spacing: .1em; white-space: nowrap; }
.live-badge { display:inline-flex; align-items:center; gap:8px; background: linear-gradient(120deg,#8d0f13,#c02829); color: white; border: 1px solid #8b1e1b; padding: 7px 10px; font: 700 13px/1 var(--serif); border-radius: 2px; }
.live-dot, .dock-dot { display:inline-block; width: 9px; height: 9px; background: white; border-radius: 50%; box-shadow: 0 0 10px 3px rgba(244,74,54,.45); }
.onair-rule { height: 1px; flex: 1 1 auto; background: #8b674c; }
.radio-main { display:flex; align-items:center; gap:22px; margin:23px 0 14px; }
.main-play { display: flex; flex-shrink: 0; align-items:center; justify-content:center; width: 92px; height: 92px; padding: 0; border-radius: 50%; border: 3px solid #ff4a3f; color: white; background: radial-gradient(circle at 50% 38%,#250808,#080607 70%); box-shadow: 0 0 0 4px #190906, 0 0 22px 2px rgba(236,39,32,.73), inset 0 0 15px rgba(217,40,32,.6); transition: transform .18s ease,box-shadow .18s ease; }
.main-play:hover { transform: scale(1.05); box-shadow: 0 0 0 4px #190906, 0 0 35px 3px rgba(236,39,32,.8); }
.main-play .icon { width:36px; height:36px; }
.play-shape { margin-left: 5px; }
.pause-shape { display: none; }
body.is-playing .play-shape { display: none; }
body.is-playing .pause-shape { display: inline-block; margin-left: 0; }
.track-info { min-width: 0; flex:1; border-left: 1px solid #67432d; padding-left: 19px; }
.track-label { display:block; font: 700 12px/1.4 var(--serif); letter-spacing: .13em; color: #f6cf88; }
.track-title { color: #fff3e4; margin: 7px 0 0; font: italic 500 18px/1.35 Georgia,serif; overflow-wrap: anywhere; max-height: 3.9em; overflow: hidden; }
.player-status { margin:7px 0 0; font: 400 12px/1.3 var(--sans); color: #b69b7c; }
.visualizer { height: 65px; display:grid; grid-template-columns: repeat(32,minmax(0,1fr)); align-items: center; gap: 3px; margin: 4px 0 12px; }
.visualizer span { display:block; height: var(--h); min-height: 3px; max-height: 54px; background: linear-gradient(0deg,#9b0d0e,#fc3838); transform:scaleY(.54); transform-origin:center; box-shadow: 0 0 5px rgba(229,31,32,.32); border-radius: 2px; }
.visualizer span:nth-child(n+25) { background: #74655c; box-shadow: none; }
body.is-playing .visualizer span { animation: wave 800ms ease-in-out calc(var(--i)*-71ms) infinite alternate; }
@keyframes wave { from { transform: scaleY(.23) } to { transform: scaleY(1) } }
.radio-controls { display:flex; align-items:center; gap: 13px; border-top:1px solid #4c2b24; padding-top:13px; }
.icon-button { color: var(--gold); background: none; border:0; padding: 5px; display:inline-flex; align-items:center; justify-content:center; }
.icon-button:hover { color:white; }
.icon-button .icon { width: 22px; height: 22px; }
.muted-icon { display:none; }
body.is-muted .muted-icon { display:inline-block; }
body.is-muted .unmuted-icon { display:none; }
.volume-slider { flex:1; min-width:0; cursor: pointer; height: 6px; accent-color: #b82827; background: linear-gradient(90deg,#c51b22,#7d1514 72%,#3b3530 73%); appearance: none; border-radius: 5px; }
.volume-slider::-webkit-slider-thumb { appearance:none; background:linear-gradient(145deg,#ffe3b7,#a76e44); width:20px; height:20px; border-radius:50%; border:2px solid #4e3022; box-shadow: 0 0 0 2px #1a0d09; }
.volume-slider::-moz-range-thumb { background:#d7af78; width:17px; height:17px; border-radius:50%; border:2px solid #4e3022; }
.share-button { margin-left:auto; }
.player-bottom { display:flex; align-items:center; justify-content:space-between; gap:7px; margin-top:13px; border-top:1px solid rgba(164,105,63,.3); padding-top:11px; font: 500 10px/1.5 var(--sans); color: #ae927b; letter-spacing: .06em; }
.player-bottom a { white-space:nowrap; color: #e9c48d; }
.player-bottom a:hover { color:white; }
.player-bottom span { text-align: right; overflow-wrap:anywhere; }

/* Weekly shows */
.schedule-section { position:relative; padding: 34px 0 64px; background: radial-gradient(ellipse 80% 40% at 50% 0,rgba(94,13,12,.45),transparent 72%),linear-gradient(#0f0908,#090707 70%,#0c0706); }
.schedule-section::after { content:''; position:absolute; bottom:0; width:100%; height:2px; background:linear-gradient(90deg,transparent,#a52827,transparent); }
.section-heading { display:flex; align-items:center; justify-content:center; gap:22px; margin-inline:auto; }
.heading-copy { text-align:center; min-width:0; }
.section-kicker { margin:0 0 7px; color:#d94d3e; letter-spacing:.28em; text-transform:uppercase; font:600 11px/1.3 var(--serif); }
.section-heading h2 { color: var(--pale); font: 700 clamp(25px,3.6vw,49px)/1.12 var(--serif); letter-spacing:-.03em; margin:0; text-shadow: 0 3px 13px #000, 0 0 18px rgba(180,67,47,.35); }
.heading-copy > img { display:block; margin:9px auto 0; width:30px; height:30px; }
.heading-rule { position:relative; flex: 1 1 70px; max-width: 190px; height:2px; background:linear-gradient(90deg,transparent,#be8e58); }
.heading-rule:last-child { transform:rotate(180deg); }
.heading-rule::after { content:'◆'; position:absolute; color:var(--gold); top:-8px; right:0; font-size:11px; }
.section-intro { margin: 7px 0 25px; text-align:center; color:#ad9581; font:400 14px var(--sans); }
.schedule-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); align-items:stretch; gap: 12px; }
.day-card { position:relative; overflow:hidden; display:flex; flex-direction:column; min-width:0; min-height: 294px; background: linear-gradient(172deg,rgba(75,21,18,.13),rgba(4,4,4,.88) 40%),radial-gradient(circle at 50% 120%,rgba(90,37,26,.22),transparent 70%),#110a09; border:2px ridge #876042; box-shadow:inset 0 0 0 3px #1b0c08,0 12px 28px #000; transition:transform .18s,border-color .18s; }
.day-card:hover { border-color:#d5a470; transform:translateY(-3px); }
.day-card::before, .day-card::after { content:'◈'; position:absolute; color:#be9263; font-size:10px; line-height:1; z-index:2; }
.day-card::before { top:4px; left:5px; }.day-card::after { top:4px; right:5px; }
.day-header { position:relative; min-height:55px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; padding:10px 6px 7px; background:repeating-linear-gradient(-20deg,rgba(0,0,0,.1) 0 6px,transparent 6px 12px),linear-gradient(125deg,#430c0e,#7c1319 46%,#34090b); border-bottom:1px solid #a16c4f; }
.day-header h3 { color:#ffdeb4; font:700 clamp(12px,1.15vw,18px)/1.3 var(--serif); margin:0; text-align:center; letter-spacing:-.03em; }
.day-index { position:absolute; top:4px; left:8px; font:600 10px var(--sans); color:#ecc2a6; opacity:.9; }
.day-body { padding:20px 10px 35px; display:flex; flex-direction:column; justify-content:flex-start; flex:1 1 auto; align-items:stretch; }
.show-item { text-align:center; position:relative; }
.show-item + .show-item { margin-top: 15px; border-top:1px solid #75402b; padding-top:16px; }
.show-item + .show-item::before { content:'✦'; background:#110a09; color:#bb8c5d; font-size:12px; position:absolute; top:-10px; left:50%; transform:translateX(-50%); padding-inline:5px; }
.show-item h4 { margin:0 0 9px; color:#ffe0bb; font:600 clamp(15px,1.4vw,20px)/1.22 var(--rock); overflow-wrap:anywhere; text-shadow:0 2px 7px #000; }
.show-item time { display:block; color:#fff0d6; font:500 14px/1.35 var(--sans); white-space:nowrap; }
.show-item > span:not(.all-day-label) { display:block; color:#b6a18d; font:400 12px/1.4 var(--sans); margin-top:7px; }
.show-item strong { font-weight:500; color:#e1c398; }
.all-day-label { display:block; margin-top:18px; color:#d39a64; font:600 12px var(--serif); letter-spacing:.09em; }
.card-ornament { display:block; position:absolute; bottom:-20px; left:50%; transform:translateX(-50%); font-size:75px; line-height:1; color:#c79e6e; opacity:.13; pointer-events:none; filter:sepia(.5); }
.day-card.is-today { border-color:#d14d39; box-shadow:inset 0 0 0 3px #220b09,0 0 18px rgba(221,29,36,.3); }
.day-card.is-today .day-header::after { content:'ΣΗΜΕΡΑ'; color:white; font:600 8px var(--sans); position:absolute; top:2px; right:3px; letter-spacing:.06em; }

/* DJs */
.djs-section { background: linear-gradient(90deg,#140b08,#24100d 51%,#120907); border-block:1px solid #402019; padding:51px 0; }
.djs-inner { display:grid; grid-template-columns:minmax(240px,.8fr) minmax(300px,1.2fr); gap:50px; align-items:center; }
.djs-inner h2 { font:700 clamp(30px,3.5vw,44px)/1.1 var(--serif); margin:0 0 8px; color:#f2d5a7; }
.djs-inner p:not(.section-kicker) { max-width:500px; margin:0; font-size:16px; color:#c7af99; }
.djs-inner p em { color:#eac596; }
.djs-list { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:9px; }
.djs-list span { padding:10px 17px; border:1px solid #66503b; color:#e9cfab; background:linear-gradient(120deg,rgba(86,22,18,.3),rgba(6,5,5,.68)); text-transform:uppercase; font:500 12px/1.4 var(--serif); white-space:nowrap; }

/* Community */
.community-section { padding:58px 0 76px; background:radial-gradient(ellipse 85% 110% at 50% 100%,rgba(93,11,15,.3),transparent 75%),#090606; }
.section-heading.compact { margin-bottom:30px; }
.community-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:17px; }
.community-card { display:flex; align-items:center; gap:18px; position:relative; padding:23px 20px; min-height:115px; border:1px solid #66452d; background:linear-gradient(140deg,#2d1511,#100b09 45%,#120b0a); box-shadow:inset 0 0 0 2px #170b08,0 10px 30px rgba(0,0,0,.5); transition:transform .18s,border-color .18s; }
.community-card.highlighted { background:radial-gradient(circle at 4% 50%,rgba(185,32,26,.5),transparent 50%),linear-gradient(115deg,#3b0c0b,#180a09); border-color:#c72e2b; box-shadow:0 0 25px rgba(230,33,29,.16); }
.community-card:hover { transform:translateY(-4px); border-color:#dbaf77; }
.community-icon { display:flex; flex:0 0 54px; height:54px; align-items:center; justify-content:center; background:rgba(0,0,0,.3); border:1px solid #9b6b48; color:#d9b185; font: 36px/1 var(--serif); }
.community-card.highlighted .community-icon { color:#ff634a; border-color:#df4840; }
.community-icon .icon { width:30px; height:30px; }
.community-card h3 { margin:0 0 4px; font:700 clamp(15px,1.7vw,22px)/1.2 var(--serif); color:var(--pale); }
.community-card p { margin:0; color:#bba48d; font:400 13px/1.4 var(--sans); }
.arrow-icon { margin-left:auto; width:22px; color:#d96b44; }

/* MyCyberTeam.gr — official logo on restrained metal partner panel; radio remains primary. */
.sponsor-section {
  position: relative; isolation: isolate; overflow: hidden;
  padding: clamp(24px, 3vw, 42px) 0;
  border-top: 2px solid #a33c2f; border-bottom: 1px solid #5b3028;
  background: radial-gradient(ellipse 90% 220% at 45% -55%,rgba(134,34,29,.33),transparent 65%),#090809;
}
.sponsor-section::before {
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background: repeating-linear-gradient(118deg,transparent 0 64px,rgba(207,124,79,.035) 65px,transparent 66px 130px);
}
.sponsor-inner {
  position:relative; display:flex; align-items:center; justify-content:space-between; gap:clamp(28px,4vw,70px);
  max-width:1240px; margin:0 auto;
  padding:clamp(25px,3.4vw,40px) clamp(22px,4.6vw,70px);
  background:linear-gradient(100deg,rgba(45,17,19,.97),rgba(23,17,19,.97) 56%,rgba(14,15,18,.98));
  border:1px solid #855342;
  box-shadow:inset 0 0 0 1px rgba(8,6,7,.95),0 18px 48px rgba(0,0,0,.65),0 0 25px rgba(147,34,31,.13);
  border-radius:3px;
}
.sponsor-inner::before {
  content:""; position:absolute; top:0; left:3%; right:3%; height:2px;
  background:linear-gradient(90deg,transparent,#d99b66 23%,#f2c58d 50%,#9a332e 87%,transparent);
}
.sponsor-inner::after { content:""; position:absolute; bottom:9px; right:11px; width:37px; height:12px; border-bottom:1px solid #b37d5b; border-right:1px solid #b37d5b; opacity:.55; pointer-events:none; }
.sponsor-brand-group { display:flex; align-items:center; flex: 1 1 auto; gap:clamp(16px,2.8vw,31px); min-width:0; }
.sponsor-logo { flex:0 0 auto; display:flex; align-items:center; justify-content:center; width:clamp(128px,12vw,172px); }
.sponsor-logo img { display:block; width:100%; height:auto; object-fit:contain; filter:drop-shadow(0 12px 15px rgba(0,0,0,.52)); }
.sponsor-content { min-width:0; }
.sponsor-kicker { display:flex; flex-wrap:wrap; align-items:center; gap:8px; color:#efbd91;
  font:700 clamp(11px,1vw,13px)/1.4 var(--sans); letter-spacing:.16em; }
.sponsor-led { width:8px; height:8px; border-radius:50%; background:#fa5045; box-shadow:0 0 14px rgba(250,80,69,.8); }
.sponsor-kicker-line { width:23px; height:1px; background:rgba(223,165,108,.55); }
.sponsor-brand-name { margin:8px 0 6px; white-space:nowrap; color:#f8e8d6;
  font:800 clamp(32px,4vw,54px)/1.08 var(--sans); letter-spacing:.015em; text-shadow:0 4px 14px #080606; }
.sponsor-brand-name strong { color:#ffac76; font-weight:800; }
.sponsor-brand-name em { color:#e7bd84; font:700 .52em/1 var(--sans); font-style:normal; letter-spacing:.015em; margin-left:2px; }
.sponsor-services { margin:0; color:#ddbb9e; font:500 clamp(12px,1.1vw,15px)/1.6 var(--sans); letter-spacing:.13em; }
.sponsor-services span { color:#ff7555; padding:0 9px; font-size:.8em; }
.sponsor-action { flex:0 1 300px; min-width:240px; display:flex; flex-direction:column; align-items:flex-start; gap:15px;
  padding:2px 0 2px clamp(22px,3vw,42px); border-left:1px solid rgba(186,113,75,.42); }
.sponsor-message { margin:0; color:#c7b19b; font:400 clamp(13px,1.2vw,17px)/1.45 Georgia,serif; }
.sponsor-message strong { color:#f9d6ac; font-weight:600; }
.sponsor-link { display:inline-flex; gap:12px; align-items:center; justify-content:center; padding:13px 19px;
  min-height:48px; max-width:100%; border:1px solid #d8a573;
  border-radius:2px; color:#fff0db; background:linear-gradient(120deg,#8b2924,#481b1a 80%);
  font:700 13px/1.15 var(--sans); letter-spacing:.055em; text-decoration:none;
  box-shadow:inset 0 1px rgba(255,218,172,.2),0 8px 18px rgba(0,0,0,.35);
  transition:transform .18s ease,background-color .18s ease,border-color .18s ease;
}
.sponsor-link .icon { width:18px; height:18px; transition:transform .18s ease; }
.sponsor-link:hover { transform:translateY(-2px); border-color:#ffe1b6; background:linear-gradient(120deg,#aa372b,#622624); }
.sponsor-link:hover .icon { transform:translateX(3px); }
.sponsor-link:focus-visible, .footer-sponsor a:focus-visible { outline:3px solid #ffca82; outline-offset:4px; }
.footer-sponsor { display:inline-flex; gap:8px; align-items:center; color:#b7a08c; font:600 11px/1.4 var(--sans); letter-spacing:.07em; }
.footer-bottom .footer-sponsor a { color:#f3c791; font:700 12px/1.4 var(--sans); text-decoration:none; letter-spacing:.02em; }
.footer-bottom .footer-sponsor a:hover { color:#fff; text-decoration:underline; }
@media (max-width:1060px) {
  .sponsor-inner { gap:24px; padding:25px 29px; }
  .sponsor-action { flex-basis:245px; min-width:210px; padding-left:22px; }
  .sponsor-brand-name { font-size:clamp(31px,3.5vw,43px); }
  .sponsor-logo { width:130px; }
}
@media (max-width:760px) {
  .sponsor-section { padding:22px 0; }
  .sponsor-inner { flex-direction:column; align-items:stretch; gap:18px; padding:23px; }
  .sponsor-brand-group { justify-content:center; }
  .sponsor-logo { width:146px; }
  .sponsor-content { flex:0 1 auto; }
  .sponsor-brand-name { font-size:clamp(29px,6vw,44px); }
  .sponsor-action { min-width:0; flex:auto; flex-direction:row; align-items:center; justify-content:space-between; gap:16px;
    padding:17px 0 0; border-left:0; border-top:1px solid rgba(186,113,75,.38); }
  .sponsor-message { font-size:13px; }
  .sponsor-link { padding:12px 15px; }
}
@media (max-width:470px) {
  .sponsor-inner { padding:22px 17px; }
  .sponsor-brand-group { gap:12px; flex-direction:column; align-items:center; text-align:center; }
  .sponsor-logo { width:142px; max-width:55%; }
  .sponsor-kicker { justify-content:center; }
  .sponsor-kicker { font-size:10px; letter-spacing:.09em; gap:5px; }
  .sponsor-kicker-line { width:9px; }
  .sponsor-brand-name { font-size:clamp(26px,7vw,34px); }
  .sponsor-services { font-size:10px; letter-spacing:.08em; }
  .sponsor-services span { padding:0 4px; }
  .sponsor-action { flex-direction:column; align-items:stretch; text-align:center; gap:14px; }
  .sponsor-message { font-size:14px; }
  .sponsor-link { width:100%; font-size:12px; }
  .footer-sponsor { flex-wrap:wrap; }
}
@media (prefers-reduced-motion:reduce) {
  .sponsor-link,.sponsor-link .icon { transition:none; }
  .sponsor-link:hover,.sponsor-link:hover .icon { transform:none; }
}

/* Footer */
.site-footer { background:#070606; border-top:1px solid #7b2c23; }
.footer-main { display:flex; align-items:center; justify-content:space-between; gap:34px; padding-block:27px; }
.footer-brand { display:flex; gap:13px; align-items:center; }
.footer-brand > div { display:flex; flex-direction:column; }
.footer-brand strong { font:700 17px var(--serif); color:#dec396; }
.footer-brand span { font:500 10px var(--sans); color:#ba725c; letter-spacing:.2em; }
.footer-social { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:17px; align-items:center; }
.footer-social a { text-transform:uppercase; font:600 12px var(--serif); color:#bea78d; }
.footer-social a:hover { color:white; }
.footer-social .donate-link { color:#f7cd8d; border:1px solid #96704d; padding:11px 14px; background:#2b1913; }
.footer-bottom { border-top:1px solid #2d201a; background:#050505; }
.footer-bottom .shell { min-height:50px; display:flex; justify-content:space-between; align-items:center; gap:20px; }
.footer-bottom small, .footer-bottom a { color:#bd9d8a; font:500 11px var(--sans); letter-spacing:.05em; }
.footer-bottom a:hover { color:white; }

/* Mobile playback remains accessible while scrolling */
.mobile-dock { display:none; }
.toast { position:fixed; z-index:200; right:20px; bottom:20px; width:min(360px,calc(100% - 40px)); border:1px solid #b37546; background:#25110e; color:#fbe8cf; padding:12px 16px; box-shadow:0 10px 25px #000; font:500 14px var(--sans); transform:translateY(150%); opacity:0; pointer-events:none; transition:transform .2s,opacity .2s; }
.toast.show { transform:translateY(0); opacity:1; }

@media (max-width: 1350px) {
  .shell { width:min(100% - 44px,1400px); }
  .header-inner { gap:13px; }
  .brand { width:275px; min-width:238px; }
  .main-nav { gap:20px; }
  .main-nav > a { font-size:15px; }
  .btn-metal { font-size:14px; padding:12px 13px; min-height:51px; gap:9px; }
  .hero h1 { font-size:clamp(61px,6.5vw,91px); }
  .schedule-grid { gap:8px; }
  .day-body { padding:18px 7px 40px; }
  .day-header h3 { font-size:13px; }
}
@media (max-width: 1080px) {
  .mobile-menu-toggle { display:flex; }
  .site-header { top:0; }
  .header-inner { min-height:82px; }
  .brand { height:72px; width:284px; }
  .main-nav { display:none; position:absolute; left:0; right:0; top:100%; margin:0; background:rgba(12,7,7,.99); border-bottom:2px solid var(--border); padding:14px max(24px,calc((100% - 950px)/2)); box-shadow:0 16px 25px #000; }
  .main-nav.is-open { display:flex; flex-direction:column; align-items:stretch; gap:0; }
  .main-nav > a { font-size:16px; padding:14px; border-bottom:1px solid #3d2620; }
  .main-nav a.nav-current::after, .main-nav a:hover::after { bottom:7px; left:14px; width:37px; }
  .hero-inner { grid-template-columns:minmax(0,1fr) minmax(320px,390px); gap:20px; }
  .hero h1 { font-size:clamp(55px,7vw,77px); }
  .radio-panel { padding:18px; }
  .schedule-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
  .day-card { min-height:265px; }
  .day-header h3 { font-size:17px; }
  .show-item h4 { font-size:19px; }
}
@media (max-width: 820px) {
  .announcement { min-height:31px; font-size:10px; letter-spacing:.13em; gap:11px; }
  .announcement-deco { display:none; }
  .shell { width:min(100% - 30px,720px); }
  .header-inner { min-height:77px; }
  .brand { height:70px; min-width:0; width:min(265px,calc(100vw - 196px)); }
  .brand-fallback img { width:53px; }
  .brand-letters strong { font-size:clamp(18px,4.2vw,26px); }
  .brand-letters small { font-size:11px; letter-spacing:.48em; }
  .header-listen { min-height:44px; padding:10px 12px; font-size:12px; }
  .header-listen .icon-sm { display:none; }
  .header-listen > .icon:first-child { width:18px; }
  .hero { background-position:62% top; }
  .hero::before { background:linear-gradient(180deg,rgba(5,4,4,.48),rgba(5,4,4,.6) 31%,rgba(5,4,4,.9) 70%,#080606 100%),linear-gradient(90deg,rgba(0,0,0,.9),transparent 90%); }
  .hero-inner { min-height:0; display:flex; flex-direction:column; gap:43px; align-items:stretch; padding-block:65px 60px; }
  .hero-content { transform:none; max-width:600px; }
  .hero h1 { font-size:clamp(59px,11vw,88px); }
  .hero-tagline { font-size:23px; }
  .radio-panel { width:min(100%,540px); align-self:center; }
  .schedule-section { padding-top:45px; }
  .schedule-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .djs-inner { grid-template-columns:1fr; gap:25px; }
  .djs-list { justify-content:flex-start; }
  .community-grid { grid-template-columns:1fr; gap:12px; }
  .community-card { min-height:97px; }
  .footer-main { flex-direction:column; align-items:flex-start; }
  .footer-social { justify-content:flex-start; }
}
@media (max-width: 620px) {
  html { scroll-padding-top:85px; }
  body { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  .announcement { font-size:9px; letter-spacing:.08em; }
  .announcement-divider { display:none; }
  .header-inner { min-height:67px; gap:7px; }
  .brand { height:62px; width:calc(100vw - 151px); }
  .brand-fallback img { width:44px; }
  .brand-letters strong { font-size:clamp(18px,4.5vw,27px); }
  .brand-letters small { margin-top:4px; font-size:10px; }
  .header-listen { padding:8px 10px; min-height:42px; width:43px; }
  .header-listen [data-play-label] { display:none; }
  .mobile-menu-toggle { width:42px; height:42px; }
  .header-actions { gap:8px; }
  .hero { background-position:60% top; }
  .hero-inner { padding-block:52px 65px; gap:44px; }
  .eyebrow { font-size:11px; letter-spacing:.11em; }
  .hero h1 { margin-top:17px; font-size:clamp(52px,11vw,79px); line-height:1.04; }
  .hero-tagline { font-size:clamp(17px,5vw,22px); }
  .hero-subline { font-size:14px; }
  .radio-heading { font-size:clamp(13px,4vw,19px); letter-spacing:.04em; }
  .radio-panel { padding:16px; outline-offset:1px; }
  .main-play { width:75px; height:75px; }
  .main-play .icon { width:27px; height:27px; }
  .radio-main { gap:12px; }
  .track-info { padding-left:13px; }
  .track-title { font-size:16px; }
  .visualizer { gap:2px; }
  .onair-row { gap:9px; }
  .onair-row > span:last-child { font-size:10px; }
  .heading-rule { flex-basis:20px; }
  .section-heading { gap:11px; }
  .section-heading h2 { font-size:clamp(25px,6vw,34px); }
  .schedule-section { padding-bottom:53px; }
  .schedule-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .day-card { min-height:260px; }
  .day-header h3 { font-size:clamp(13px,4vw,18px); }
  .day-body { padding:19px 9px 35px; }
  .show-item h4 { font-size:clamp(15px,4.2vw,20px); }
  .show-item time { font-size:13px; }
  .djs-section { padding:38px 0; }
  .community-section { padding:48px 0; }
  .footer-social { gap:15px; }
  .footer-bottom .shell { flex-direction:column; align-items:flex-start; justify-content:center; padding-block:12px; gap:6px; }
  .mobile-dock { position:fixed; display:flex; visibility:hidden; pointer-events:none; opacity:0; transform:translateY(110%); transition:opacity .18s, transform .18s, visibility .18s; bottom:0; left:0; right:0; z-index:95; min-height:76px; align-items:center; justify-content:space-between; gap:14px; padding:11px max(18px,env(safe-area-inset-left)) calc(10px + env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-right)); border-top:2px solid #af392a; background:linear-gradient(120deg,rgba(32,12,10,.98),rgba(7,6,6,.98)); box-shadow:0 -8px 28px #000; }
  .mobile-dock.is-visible { visibility:visible; pointer-events:auto; opacity:1; transform:none; }
  .dock-copy { display:grid; grid-template-columns:11px auto; column-gap:9px; align-items:center; min-width:0; }
  .dock-dot { background:#ef3b38; width:8px; height:8px; }
  .dock-title { color:#efcf9b; font:700 13px/1.3 var(--serif); }
  .dock-copy small { grid-column:2; color:#dfb39c; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:260px; font:500 11px var(--sans); }
  .dock-play { flex:0 0 50px; height:50px; border:2px solid #e7503c; border-radius:50%; background:#1b0b0a; box-shadow:0 0 12px #9c1f18; color:white; display:flex; align-items:center; justify-content:center; }
  .dock-play .icon { width:22px; height:22px; }
  .toast { bottom:calc(89px + env(safe-area-inset-bottom)); right:12px; }
}
@media (max-width: 390px) {
  .brand-letters strong { font-size:18px; }
  .brand-fallback img { width:38px; }
  .radio-heading { font-size:13px; }
  .onair-row > span:last-child { letter-spacing:0; font-size:9px; }
  .radio-panel { padding:12px 14px; }
  .show-item h4 { font-size:15px; }
  .day-card { min-height:258px; }
  .day-header h3 { font-size:13px; }
  .dock-title { font-size:11px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; }
}


/* Current-show live chat — compact and consistent with the metal player. */
.hero-links { display:flex; flex-wrap:wrap; gap:18px 28px; align-items:center; }
.chat-hero-link { color:var(--pale); }
.live-chat-section { padding:48px 0 60px; background:radial-gradient(ellipse 50% 90% at 2% 20%,rgba(119,16,17,.22),transparent 70%), linear-gradient(180deg,#0d0707,#130907); border-top:1px solid rgba(161,76,54,.4); border-bottom:1px solid #44251a; }
.live-chat-grid { display:grid; grid-template-columns:minmax(250px, .9fr) minmax(0, 1.65fr); gap:clamp(22px,4vw,64px); align-items:center; }
.chat-intro h2 { font:800 clamp(38px,4.7vw,67px)/1.12 var(--serif); margin:12px 0; color:var(--pale); text-shadow:2px 3px 0 #5e1713; }
.chat-intro h2 span { color:#ef4f38; }
.chat-tagline { font:500 clamp(17px,2vw,24px)/1.4 var(--rock); margin:12px 0 28px; color:#d6b28b; }
.chat-live-dot { display:inline-block; border-radius:50%; width:8px; height:8px; background:#f3443f; box-shadow:0 0 12px #e53b32; margin-right:6px; }
.chat-show { padding:14px 18px; background:linear-gradient(110deg,rgba(80,16,13,.6),rgba(19,12,10,.7)); border-left:3px solid #cf3a2b; display:flex; flex-direction:column; gap:3px; }
.chat-show > span { color:#d0a370; font:600 11px var(--serif); letter-spacing:.2em; }
.chat-show strong { color:#ffe6bb; font:700 18px var(--serif); overflow-wrap:anywhere; }
.chat-show small { color:#c7ac8b; font:400 12px var(--sans); }
.chat-disclaimer { color:#bba28e; font:400 14px/1.55 var(--sans); max-width:430px; }
.chat-panel { background:linear-gradient(135deg,#1b0e0c 0%,#080707 80%); border:1px solid #805135; box-shadow:0 0 0 4px #100909, 0 18px 45px #0008, inset 0 0 34px #0009; min-width:0; }
.chat-panel-header { display:flex; align-items:center; justify-content:space-between; gap:10px; background:linear-gradient(90deg,#410d0e,#1f0d0b); border-bottom:1px solid #875137; padding:13px 18px; }
.chat-panel-header strong { color:#f6dbaf; font:700 18px/1.3 var(--serif); letter-spacing:.075em; }
.chat-panel-header span[role=status] { color:#8dd59e; font:600 11px var(--sans); white-space:nowrap; }
.chat-panel-header span.chat-offline { color:#eaa47c; }
.chat-join { min-height:260px; padding:35px clamp(16px,3vw,42px); display:flex; justify-content:center; flex-direction:column; }
.chat-join label { color:#f2c28b; letter-spacing:.14em; font:700 17px var(--serif); }
.chat-join p { color:#c5a891; margin:9px 0 20px; }
.chat-join-controls, .chat-form { display:flex; gap:9px; align-items:stretch; }
.chat-join input, .chat-form input { min-width:0; flex:1; border:1px solid #78503d; background:#090707; color:#fff2dc; padding:12px 15px; border-radius:2px; font:500 16px/1.4 var(--sans); }
.chat-join input::placeholder, .chat-form input::placeholder { color:#b5a092; opacity:1; }
.chat-primary-button { border:1px solid #bc5338; color:#ffe4c1; background:linear-gradient(140deg,#aa201d,#641615); padding:10px 17px; border-radius:2px; font:700 13px/1.5 var(--serif); white-space:nowrap; }
.chat-primary-button:hover:not(:disabled) { filter:brightness(1.2); }
.chat-conversation { padding:0 15px 15px; }
.chat-conversation-top { min-height:41px; display:flex; align-items:center; justify-content:space-between; gap:8px; color:#c4a487; font:400 12px var(--sans); }
.chat-conversation-top strong { color:#f9d7ab; }
.chat-conversation-top button { border:0; background:transparent; padding:7px; color:#f5bd84; font:500 12px var(--sans); text-decoration:underline; }
.chat-messages { height:265px; overflow-y:auto; overscroll-behavior:contain; padding:12px 15px; border:1px solid #442c22; background:rgba(4,4,4,.8); scrollbar-color:#7e2c22 #120b09; }
.chat-message { margin-bottom:13px; }
.chat-message-meta { display:flex; align-items:baseline; gap:12px; }
.chat-message-meta strong { color:#f2c086; font:600 13px var(--serif); overflow-wrap:anywhere; }
.chat-message-meta time { color:#ac9483; font:400 11px var(--sans); }
.chat-message p { margin:3px 0 0; font:400 15px/1.4 var(--sans); color:#f3e2cf; white-space:pre-wrap; overflow-wrap:anywhere; }
.chat-empty { margin:70px 0; text-align:center; color:#c5a88a; font:500 15px/1.5 var(--sans); }
.chat-form { margin-top:10px; }
.chat-form input { padding:11px 13px; }
.chat-panel-footer { border-top:1px solid #38251f; padding:9px 14px; display:flex; justify-content:space-between; gap:10px; align-items:center; font:400 11px/1.5 var(--sans); color:#bc9e89; }
.chat-panel-footer .chat-error { color:#ffb59c; }
.chat-poll-indicator { color:#dcb78e; white-space:nowrap; }
[hidden] { display:none !important; }
@media (max-width: 920px) { .live-chat-grid { grid-template-columns:1fr; } .chat-intro { max-width:700px; } .chat-disclaimer { max-width:700px; } }
@media (max-width: 490px) { .live-chat-section { padding:32px 0 44px; } .chat-intro h2 { font-size:40px; } .chat-join { padding:26px 16px; } .chat-join-controls, .chat-form { flex-direction:column; } .chat-primary-button { min-height:44px; } .chat-messages { height:230px; } .chat-panel-header { padding:12px; } .chat-panel-header strong { font-size:14px; } .chat-panel-header span[role=status] { font-size:10px; } }

@media (max-width:620px) { body.chat-input-active .mobile-dock { opacity:0; visibility:hidden; pointer-events:none; transform:translateY(110%); } }


/* 2026-11-07 · Hair/headbang/letter heat v2 · No raster retouch or font substitution.
   Keep the immutable .hero background as reduced-motion and load-failure fallback.
   Its duplicate (unchanged WEBP/JPG pixels) tilts as a single gentle 'camera' headbang,
   not a fabricated skull cutout. Realistic flame wisps ride the identical motion clock. */
.hero-artwork-motion {
  position:absolute; inset:-1px; z-index:0; pointer-events:none;
  background:#0b0707 url('../images/hero-metal-legacy.jpg') center 42% / cover no-repeat;
  transform-origin:62% 58%;
  animation: metal-headbang 3.2s cubic-bezier(.33,.02,.63,1) infinite;
  will-change:transform;
}
@supports (background-image: image-set(url('../images/hero-metal-legacy.webp') type('image/webp'))) {
  .hero-artwork-motion { background-image:image-set(url('../images/hero-metal-legacy.webp') type('image/webp'),url('../images/hero-metal-legacy.jpg') type('image/jpeg')); }
}
/* The face, hair and body share a gentle nod (no altered artwork or doubling of facial features).
   Movement resolves cleanly to the first frame at the end of each cycle. */
@keyframes metal-headbang {
  0%,100% { transform:translate3d(0,0,0) scale(1.035) rotate(0deg); }
  14% { transform:translate3d(0,5px,0) scale(1.038) rotate(.4deg); }
  35% { transform:translate3d(-1px,-10px,0) scale(1.048) rotate(-.85deg); }
  53% { transform:translate3d(1px,4px,0) scale(1.04) rotate(.35deg); }
  74% { transform:translate3d(0,-8px,0) scale(1.045) rotate(-.55deg); }
  88% { transform:translate3d(0,2px,0) scale(1.036) rotate(.14deg); }
}
/* Photo-coordinate 1600x900 SVG; no chunky red ribbons, no flames over the face. */
.hero-flame-motion {
  position:absolute; inset:0; z-index:1; overflow:hidden;
  pointer-events:none; user-select:none;
  opacity:.82; mix-blend-mode:screen; transform-origin:62% 58%;
  -webkit-mask-image:linear-gradient(90deg,transparent 5%,#000 22%,#000 47%,rgba(0,0,0,.68) 54%,transparent 65%);
  mask-image:linear-gradient(90deg,transparent 5%,#000 22%,#000 47%,rgba(0,0,0,.68) 54%,transparent 65%);
  animation:metal-headbang 3.2s cubic-bezier(.33,.02,.63,1) infinite,
            metal-flame-pulse 3.2s ease-in-out infinite;
}
.hero-flame-motion img {
  display:block; width:100%; height:100%; max-width:none;
  object-fit:cover; object-position:center 42%;
  transform-origin:62% 53%;
  animation:metal-flame-sway 3.2s cubic-bezier(.25,.13,.58,.94) infinite;
  will-change:transform;
}
@keyframes metal-flame-sway {
  0%,100% { transform:translate3d(0,0,0) skewX(0deg) scale(1); }
  14% { transform:translate3d(4px,8px,0) skewX(.8deg) scale(1.005); }
  35% { transform:translate3d(9px,5px,0) skewX(1.1deg) scale(1.007); }
  48% { transform:translate3d(-16px,-8px,0) skewX(-2deg) scale(1.02); }
  72% { transform:translate3d(5px,4px,0) skewX(.75deg) scale(1.006); }
  89% { transform:translate3d(-6px,-3px,0) skewX(-.9deg) scale(1.009); }
}
@keyframes metal-flame-pulse {
  0%,100% { opacity:.69; }
  14% { opacity:.74; }
  35% { opacity:.82; }
  49% { opacity:.98; }
  74% { opacity:.79; }
}
/* Heat-light on the EXISTING letterforms, not a new typeface or rasterized headline.
   Bright original text stays legible; an aria-neutral CSS paint only lights the
   flame-facing right edges. Pseudo-content is decorative and pointer-safe. */
.hero h1 .hero-title-line {
  position:relative; isolation:isolate; -webkit-text-fill-color:currentColor;
}
.hero h1 .hero-title-line-first { color:#f4deb9; }
.hero h1 .hero-title-line-second { color:#f1cf9e; }
/* Light bleeding out of heated letter edges; the actual glyphs remain intact. */
.hero h1 .hero-title-line::before {
  content:attr(data-burn);
  position:absolute; inset:0; display:block; pointer-events:none;
  white-space:nowrap; color:#ff451d; text-shadow:none;
  -webkit-mask-image:linear-gradient(90deg,transparent 49%,rgba(0,0,0,.27) 62%,#000 95%);
  mask-image:linear-gradient(90deg,transparent 49%,rgba(0,0,0,.27) 62%,#000 95%);
  mix-blend-mode:screen;
  animation:metal-ember-halo 3.2s ease-in-out infinite;
}
@keyframes metal-ember-halo {
  0%,100% { opacity:.13; filter:blur(2px); }
  14% { opacity:.23; filter:blur(3px); }
  35% { opacity:.46; filter:blur(4px); }
  48% { opacity:.63; filter:blur(5px) drop-shadow(0 0 8px rgba(243,57,16,.48)); }
  74% { opacity:.34; filter:blur(3px); }
}
.hero h1 .hero-title-line::after {
  content:attr(data-burn);
  position:absolute; inset:0; display:block; width:100%;
  pointer-events:none; user-select:none; white-space:nowrap;
  color:#ffac64; text-shadow:none;
  background:linear-gradient(105deg,transparent 0%,#ffd18b 51%,#ff7c2e 72%,#ffd67c 86%,#d92719 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  -webkit-mask-image:linear-gradient(90deg,transparent 46%,rgba(0,0,0,.2) 61%,#000 92%);
  mask-image:linear-gradient(90deg,transparent 46%,rgba(0,0,0,.2) 61%,#000 92%);
  mix-blend-mode:screen;
  animation:metal-letter-heat 3.2s ease-in-out infinite;
}
.hero h1 .hero-title-line-second::after { animation-delay:-.08s; }
@keyframes metal-letter-heat {
  0%,100% { opacity:.21; filter:drop-shadow(0 0 1px rgba(255,74,24,.25)); }
  14% { opacity:.36; filter:drop-shadow(0 0 3px rgba(255,85,29,.4)); }
  35% { opacity:.62; filter:drop-shadow(0 0 5px rgba(255,83,23,.6)); }
  48% { opacity:.85; filter:drop-shadow(0 0 9px rgba(255,78,17,.8)) drop-shadow(0 0 14px rgba(230,40,15,.32)); }
  74% { opacity:.47; filter:drop-shadow(0 0 4px rgba(255,88,30,.46)); }
}
@media (max-width:700px) {
  .hero-flame-motion { opacity:.67; }
  .hero-artwork-motion,.hero-flame-motion { transform-origin:69% 55%; }
}
@media (prefers-reduced-motion:reduce) {
  /* No photo/headbang drift, no SVG/SMIL fire, no animated lettering. */
  .hero-artwork-motion,.hero-flame-motion { display:none !important; }
  .hero h1 .hero-title-line::before,.hero h1 .hero-title-line::after { display:none !important; }
}