/* ═══════════════════════════════════════════════════
   GDEA RADIO FM 92.3  |  SHARED STYLESHEET
   Kiniun — The Lion Has Roared
═══════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700;900&family=Cinzel:wght@400;600;700;900&family=Crimson+Pro:ital,wght@0,300;0,400;0,600;1,300;1,400&family=Orbitron:wght@400;700;900&display=swap');

:root {
  --red:     #C41E3A;
  --dred:    #8B0000;
  --blood:   #6B0000;
  --gold:    #D4AF37;
  --glite:   #F5D76E;
  --teal:    #00CED1;
  --tdark:   #008B8B;
  --ink:     #070707;
  --d1:      #0D0D0D;
  --d2:      #141414;
  --d3:      #1C1C1C;
  --d4:      #252525;
  --smoke:   #E8E0D0;
  --cream:   #F5F0E8;
  --muted:   #9A8F80;
  --fd: 'Cinzel Decorative', serif;
  --fh: 'Cinzel', serif;
  --fb: 'Crimson Pro', serif;
  --ft: 'Orbitron', monospace;
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { background:var(--ink); color:var(--smoke); font-family:var(--fb); font-size:1.08rem; line-height:1.72; overflow-x:hidden; }
img { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; }
button,input,textarea,select { font-family:inherit; }
::-webkit-scrollbar { width:5px; }
::-webkit-scrollbar-track { background:var(--d1); }
::-webkit-scrollbar-thumb { background:var(--red); border-radius:3px; }

/* ─── NAVBAR ─── */
.navbar { position:fixed; top:0; left:0; right:0; z-index:1000; display:flex; align-items:center; justify-content:space-between; padding:0 2.5rem; height:68px; background:rgba(7,7,7,.94); backdrop-filter:blur(20px); border-bottom:1px solid rgba(196,30,58,.25); transition:all .3s; }
.navbar.scrolled { height:58px; background:rgba(7,7,7,.99); border-bottom-color:rgba(212,175,55,.3); }
.nav-brand { display:flex; align-items:center; gap:.8rem; }
.nav-logo { width:44px; height:44px; border-radius:50%; border:2px solid var(--red); overflow:hidden; flex-shrink:0; box-shadow:0 0 14px rgba(196,30,58,.4); }
.nav-logo img { width:100%; height:100%; object-fit:cover; }
.nav-brand-text { display:flex; flex-direction:column; line-height:1.1; }
.nav-brand-title { font-family:var(--fh); font-size:.82rem; font-weight:700; letter-spacing:.13em; color:var(--cream); }
.nav-brand-freq { font-family:var(--ft); font-size:.6rem; color:var(--teal); letter-spacing:.08em; }
.nav-links { display:flex; gap:1.8rem; list-style:none; }
.nav-links a { font-family:var(--fh); font-size:.68rem; font-weight:600; letter-spacing:.17em; text-transform:uppercase; color:var(--muted); transition:color .3s; position:relative; padding-bottom:4px; }
.nav-links a::after { content:''; position:absolute; bottom:0; left:0; right:0; height:1px; background:var(--gold); transform:scaleX(0); transition:transform .3s; }
.nav-links a:hover, .nav-links a.active { color:var(--gold); }
.nav-links a:hover::after, .nav-links a.active::after { transform:scaleX(1); }
.live-btn { display:flex; align-items:center; gap:.45rem; padding:.42rem 1rem; background:var(--red); border-radius:30px; font-family:var(--ft); font-size:.6rem; letter-spacing:.1em; color:#fff; border:none; cursor:pointer; box-shadow:0 0 14px rgba(196,30,58,.4); transition:all .3s; }
.live-btn:hover { background:#e01f3f; box-shadow:0 0 26px rgba(196,30,58,.7); }
.live-dot { width:7px; height:7px; border-radius:50%; background:#fff; animation:pdot 1.2s ease-in-out infinite; }
@keyframes pdot { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.4;transform:scale(.7)} }
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; }
.hamburger span { width:25px; height:2px; background:var(--smoke); display:block; transition:.3s; }
.mob-menu { display:none; position:fixed; top:68px; left:0; right:0; background:rgba(7,7,7,.98); backdrop-filter:blur(20px); padding:1.5rem 2rem; z-index:999; border-bottom:1px solid rgba(196,30,58,.3); flex-direction:column; }
.mob-menu.open { display:flex; }
.mob-menu a { padding:.9rem 0; font-family:var(--fh); font-size:.82rem; font-weight:600; letter-spacing:.15em; text-transform:uppercase; color:var(--smoke); border-bottom:1px solid rgba(255,255,255,.05); transition:color .3s; }
.mob-menu a:hover { color:var(--gold); }

/* ─── PLAYER STRIP ─── */
.pstrip { position:relative; background:linear-gradient(90deg,#0a0000,var(--blood),#0a0000); border-top:1px solid rgba(196,30,58,.5); border-bottom:1px solid rgba(196,30,58,.5); padding:1.1rem 2.5rem; display:flex; align-items:center; gap:2rem; flex-wrap:wrap; justify-content:center; overflow:hidden; }
.pstrip::before { content:''; position:absolute; inset:0; background:repeating-linear-gradient(90deg,transparent 0,transparent 3px,rgba(255,255,255,.012) 3px,rgba(255,255,255,.012) 4px); }
.p-info { display:flex; align-items:center; gap:1rem; }
.p-logo { width:44px; height:44px; border-radius:50%; border:2px solid var(--red); overflow:hidden; flex-shrink:0; box-shadow:0 0 12px rgba(196,30,58,.4); }
.p-logo img { width:100%; height:100%; object-fit:cover; }
.p-name { font-family:var(--fh); font-size:.72rem; font-weight:700; letter-spacing:.1em; color:var(--cream); }
.p-now { font-size:.82rem; color:var(--muted); }
.p-now span { color:var(--teal); font-style:italic; }
.p-ctrls { display:flex; align-items:center; gap:1rem; }
.play-btn { width:44px; height:44px; border-radius:50%; background:var(--red); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .3s; box-shadow:0 0 16px rgba(196,30,58,.5); }
.play-btn:hover { background:#e01f3f; box-shadow:0 0 28px rgba(196,30,58,.8); transform:scale(1.06); }
.vol-wrap { display:flex; align-items:center; gap:.5rem; }
.vol-wrap label { font-family:var(--ft); font-size:.58rem; color:var(--muted); letter-spacing:.1em; }
.vol-slider { -webkit-appearance:none; appearance:none; width:86px; height:3px; background:linear-gradient(90deg,var(--teal) var(--vl,70%),rgba(255,255,255,.15) var(--vl,70%)); border-radius:2px; cursor:pointer; outline:none; }
.vol-slider::-webkit-slider-thumb { -webkit-appearance:none; width:13px; height:13px; border-radius:50%; background:var(--teal); cursor:pointer; box-shadow:0 0 6px rgba(0,206,209,.6); }
.waveform { display:flex; align-items:center; gap:3px; height:30px; }
.wb { width:3px; border-radius:2px; background:var(--red); animation:wv .8s ease-in-out infinite; }
.wb:nth-child(1){height:8px;animation-delay:0s}
.wb:nth-child(2){height:18px;animation-delay:.1s}
.wb:nth-child(3){height:26px;animation-delay:.2s}
.wb:nth-child(4){height:20px;animation-delay:.15s}
.wb:nth-child(5){height:12px;animation-delay:.3s}
.wb:nth-child(6){height:22px;animation-delay:.1s}
.wb:nth-child(7){height:8px;animation-delay:.25s}
@keyframes wv { 0%,100%{transform:scaleY(.35)} 50%{transform:scaleY(1)} }
.pstrip.paused .wb { animation-play-state:paused; }

/* ─── PAGE HERO (inner pages) ─── */
.phero { padding-top:68px; position:relative; min-height:300px; display:flex; align-items:flex-end; overflow:hidden; }
.phero-bg { position:absolute; inset:0; background-size:cover; background-position:center; filter:brightness(.32); }
.phero-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,7,7,.88) 0%,rgba(7,7,7,.3) 55%,transparent 100%); }
.phero-content { position:relative; z-index:2; padding:2.5rem 6vw 3rem; max-width:680px; }
.phero-label { font-family:var(--ft); font-size:.6rem; letter-spacing:.35em; color:var(--teal); text-transform:uppercase; margin-bottom:.5rem; display:flex; align-items:center; gap:.7rem; }
.phero-label::before { content:''; width:26px; height:1px; background:var(--teal); }
.phero-title { font-family:var(--fd); font-size:clamp(2rem,5vw,3.6rem); font-weight:900; line-height:1; color:transparent; background:linear-gradient(135deg,#fff 0%,var(--glite) 50%,var(--gold) 100%); -webkit-background-clip:text; background-clip:text; margin-bottom:.5rem; }
.phero-sub { font-size:1rem; color:rgba(232,224,208,.78); max-width:460px; line-height:1.6; }
.phero-crumb { margin-top:1rem; font-family:var(--ft); font-size:.57rem; color:var(--muted); letter-spacing:.15em; }
.phero-crumb a { color:var(--teal); }
.phero-crumb a:hover { color:var(--gold); }

/* ─── LAYOUT HELPERS ─── */
section { padding:5.5rem 2.5rem; }
.container { max-width:1200px; margin:0 auto; }
.sec-label { font-family:var(--ft); font-size:.6rem; letter-spacing:.35em; color:var(--teal); text-transform:uppercase; margin-bottom:.55rem; display:flex; align-items:center; gap:.7rem; }
.sec-label::before { content:''; width:26px; height:1px; background:var(--teal); }
.sec-title { font-family:var(--fh); font-size:clamp(1.8rem,3.5vw,2.8rem); font-weight:700; line-height:1.1; color:var(--cream); margin-bottom:.9rem; }
.sec-title em { font-style:normal; color:transparent; background:linear-gradient(90deg,var(--red),var(--gold)); -webkit-background-clip:text; background-clip:text; }
.sec-intro { color:var(--muted); max-width:560px; margin-bottom:2.8rem; font-size:1rem; }
.gold-rule { display:flex; align-items:center; gap:1rem; margin:1.5rem 0; }
.gold-rule::before,.gold-rule::after { content:''; flex:1; height:1px; }
.gold-rule::before { background:linear-gradient(90deg,transparent,rgba(212,175,55,.35)); }
.gold-rule::after  { background:linear-gradient(90deg,rgba(212,175,55,.35),transparent); }
.gold-rule span { color:var(--gold); font-size:.9rem; }

/* ─── BUTTONS ─── */
.btn { display:inline-flex; align-items:center; gap:.55rem; padding:.82rem 2rem; font-family:var(--fh); font-size:.72rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; border:none; cursor:pointer; transition:all .3s; position:relative; overflow:hidden; }
.btn::before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent); transform:translateX(-100%); transition:transform .5s; }
.btn:hover::before { transform:translateX(100%); }
.btn-red  { background:var(--red);  color:#fff; box-shadow:0 4px 18px rgba(196,30,58,.35); }
.btn-red:hover  { background:#e01f3f; box-shadow:0 6px 28px rgba(196,30,58,.6); transform:translateY(-1px); }
.btn-gold { background:var(--gold); color:var(--ink); box-shadow:0 4px 18px rgba(212,175,55,.3); }
.btn-gold:hover { background:var(--glite); box-shadow:0 6px 28px rgba(212,175,55,.55); transform:translateY(-1px); }
.btn-teal { background:var(--tdark); color:#fff; box-shadow:0 4px 18px rgba(0,139,139,.3); }
.btn-teal:hover { background:var(--teal); box-shadow:0 6px 28px rgba(0,206,209,.5); transform:translateY(-1px); }
.btn-outline { background:transparent; color:var(--cream); border:1px solid rgba(232,216,192,.28); }
.btn-outline:hover { border-color:var(--gold); color:var(--gold); background:rgba(212,175,55,.06); }

/* ─── FORM STYLES ─── */
.fcard { background:var(--d2); border:1px solid rgba(255,255,255,.06); padding:2.5rem; position:relative; overflow:hidden; }
.fcard::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; }
.fcard.red-top::before  { background:linear-gradient(90deg,var(--red),var(--gold)); }
.fcard.teal-top::before { background:linear-gradient(90deg,var(--teal),var(--gold)); }
.fcard.gold-top::before { background:linear-gradient(90deg,var(--gold),var(--teal)); }
.f-title { font-family:var(--fh); font-size:1.2rem; font-weight:700; color:var(--cream); margin-bottom:.3rem; }
.f-sub { font-size:.88rem; color:var(--muted); margin-bottom:2rem; }
.fg { margin-bottom:1.25rem; }
.fg label { display:block; font-family:var(--fh); font-size:.62rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); margin-bottom:.4rem; }
.fg label .req { color:var(--red); }
.fc { width:100%; padding:.78rem 1rem; background:var(--d4); border:1px solid rgba(255,255,255,.08); color:var(--smoke); font-family:var(--fb); font-size:1rem; outline:none; transition:all .3s; border-radius:0; }
.fc::placeholder { color:rgba(154,143,128,.45); }
.fc:focus { border-color:var(--red); box-shadow:0 0 0 2px rgba(196,30,58,.14); background:#180c0c; }
.fc.err { border-color:#ff4444; box-shadow:0 0 0 2px rgba(255,68,68,.12); }
.fc.ok  { border-color:#44cc88; box-shadow:0 0 0 2px rgba(68,204,136,.12); }
textarea.fc { resize:vertical; min-height:110px; }
select.fc option { background:var(--d4); }
.ferr { font-size:.75rem; color:#ff7070; margin-top:.3rem; display:none; }
.ferr.show { display:block; }
.frow { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.fsub { width:100%; padding:.9rem; font-family:var(--fh); font-size:.72rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; border:none; cursor:pointer; transition:all .3s; margin-top:.4rem; }
.fsub.red  { background:var(--red);  color:#fff; }
.fsub.red:hover  { background:#e01f3f; box-shadow:0 4px 20px rgba(196,30,58,.4); }
.fsub.teal { background:var(--tdark); color:#fff; }
.fsub.teal:hover { background:var(--teal); box-shadow:0 4px 20px rgba(0,206,209,.35); }
.fsub.gold { background:var(--gold); color:var(--ink); }
.fsub.gold:hover { background:var(--glite); box-shadow:0 4px 20px rgba(212,175,55,.4); }
.fok { display:none; padding:1rem 1.4rem; background:rgba(68,204,136,.1); border:1px solid rgba(68,204,136,.3); color:#88ffbb; font-size:.9rem; margin-top:1rem; text-align:center; }
.fok.show { display:block; }

/* ─── REVEAL ANIMATIONS ─── */
.rev { opacity:0; transform:translateY(28px); transition:opacity .7s ease,transform .7s ease; }
.rev.vis { opacity:1; transform:translateY(0); }
.rev.d1 { transition-delay:.1s; }
.rev.d2 { transition-delay:.2s; }
.rev.d3 { transition-delay:.3s; }
.rev.d4 { transition-delay:.4s; }

/* ─── SCRIPTURE BAND ─── */
.sbband { background:linear-gradient(90deg,#0a0000,var(--blood) 30%,var(--dred) 50%,var(--blood) 70%,#0a0000); padding:3.5rem 2.5rem; text-align:center; }
.sbband blockquote { font-family:var(--fd); font-size:clamp(.95rem,2.3vw,1.55rem); color:#fff; line-height:1.55; margin-bottom:.8rem; max-width:800px; margin-left:auto; margin-right:auto; }
.sbband cite { font-family:var(--ft); font-size:.63rem; color:var(--gold); letter-spacing:.3em; text-transform:uppercase; font-style:normal; }

/* ─── FOOTER ─── */
footer { background:#050505; border-top:1px solid rgba(196,30,58,.2); padding:4rem 2.5rem 2rem; }
.fgrid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:3rem; max-width:1200px; margin:0 auto; padding-bottom:2.5rem; border-bottom:1px solid rgba(255,255,255,.05); }
.f-brand-name { font-family:var(--fd); font-size:1.25rem; font-weight:700; color:transparent; background:linear-gradient(90deg,var(--cream),var(--gold)); -webkit-background-clip:text; background-clip:text; margin-bottom:.3rem; }
.f-brand-freq { font-family:var(--ft); font-size:.65rem; color:var(--teal); letter-spacing:.12em; margin-bottom:.9rem; }
.f-tagline { font-size:.87rem; color:var(--muted); margin-bottom:1.3rem; line-height:1.6; }
.f-motto { font-family:var(--fd); font-size:.72rem; color:var(--red); letter-spacing:.1em; margin-bottom:1.2rem; }
.f-social { display:flex; gap:.7rem; }
.soc-btn { width:35px; height:35px; background:var(--d3); border:1px solid rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; color:var(--muted); transition:all .3s; cursor:pointer; }
.soc-btn:hover { background:var(--red); border-color:var(--red); color:#fff; transform:translateY(-2px); }
.f-col-title { font-family:var(--fh); font-size:.68rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--cream); margin-bottom:1.2rem; }
.f-links { list-style:none; }
.f-links li { margin-bottom:.55rem; }
.f-links a { font-size:.86rem; color:var(--muted); transition:color .3s; }
.f-links a:hover { color:var(--gold); }
.f-bottom { max-width:1200px; margin:1.8rem auto 0; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; font-size:.76rem; color:var(--muted); }
.f-bottom-motto { font-family:var(--fd); font-size:.68rem; color:var(--red); letter-spacing:.1em; }

/* ─── RESPONSIVE ─── */
@media(max-width:1024px) { .fgrid { grid-template-columns:1fr 1fr; } }
@media(max-width:768px) {
  .nav-links,.live-btn { display:none; }
  .hamburger { display:flex; }
  section { padding:3.5rem 1.5rem; }
  .frow { grid-template-columns:1fr; }
  .fgrid { grid-template-columns:1fr; gap:2rem; }
  .pstrip { gap:1.2rem; }
}