/*
Theme Name: Audience FM Radio
Theme URI: https://audiencefm.com/
Author: AWOBAZ DTS INC
Description: Production radio-first WordPress theme for Audience FM 105.5 with full responsive layout, sticky live player, Now Playing integration, accessibility and SEO-ready markup.
Version: 10.0.0
Text Domain: audiencefm
*/

/*
 Audience FM official palette sampled from supplied logo assets:
 Orange: #F69220
 Blue:   #2B2E80
*/

:root{
  --afm-orange:#F69220;
  --afm-orange-rgb:246,146,32;
  --afm-blue:#2B2E80;
  --afm-blue-rgb:43,46,128;

  --afm-bg:#141416;
  --afm-bg-deep:#0C0C0E;
  --afm-panel:#19191C;
  --afm-panel-2:#202024;
  --afm-line:#2A2A2F;
  --afm-line-soft:#222227;
  --afm-text:#FFFFFF;
  --afm-text-soft:#E8E8EA;
  --afm-muted:#9A9AA2;
  --afm-dim:#6F6F77;

  --afm-max:1160px;
  --afm-player-h:80px;
  --afm-font:"Avenir Next","Century Gothic","Futura","Inter","SF Pro Display","SF Pro Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

*{box-sizing:border-box}
html{background:var(--afm-bg);scroll-behavior:smooth}
body{
  margin:0;
  min-height:100%;
  padding-bottom:var(--afm-player-h);
  color:var(--afm-text);
  background:
    radial-gradient(ellipse at 14% 14%,rgba(var(--afm-orange-rgb),.075),transparent 34rem),
    radial-gradient(ellipse at 88% 48%,rgba(var(--afm-blue-rgb),.085),transparent 38rem),
    var(--afm-bg);
  font-family:var(--afm-font);
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto}
button,input{font:inherit}
button{color:inherit}
a{color:inherit;text-decoration:none}
.wrap{width:min(var(--afm-max),calc(100% - 52px));margin-inline:auto}
.skip-link{position:fixed;top:10px;left:10px;z-index:99999;padding:10px 14px;background:#fff;color:#111;transform:translateY(-150%)}
.skip-link:focus{transform:none}
.dot{
  display:inline-block;
  width:6px;height:6px;
  border-radius:999px;
  background:var(--afm-orange);
  box-shadow:0 0 0 4px rgba(var(--afm-orange-rgb),.08);
  flex:0 0 auto
}
::selection{background:var(--afm-orange);color:#111}

/* Header */
.site-header{
  height:92px;
  background:rgba(12,12,14,.94);
  border-bottom:1px solid var(--afm-line-soft);
  position:relative;
}
.site-header:after{
  content:"";
  position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent 0,rgba(var(--afm-orange-rgb),.52) 32%,rgba(var(--afm-blue-rgb),.52) 68%,transparent 100%);
  opacity:.44;
}
.header-row{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;min-width:0}
.brand img{
  display:block;
  width:268px;
  max-width:48vw;
  max-height:58px;
  object-fit:contain;
  object-position:left center
}
.header-live{
  display:flex;align-items:center;gap:8px;
  color:var(--afm-muted);
  font-size:9px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;white-space:nowrap
}
.header-live .dot{animation:afmLive 1.8s ease-in-out infinite}
.header-live span:nth-child(2){color:var(--afm-text-soft)}
.header-live strong{color:var(--afm-orange);font-size:9px;font-weight:850;letter-spacing:.12em}

/* Main radio screen */
.afm-main{min-height:calc(100svh - 92px - 50px - var(--afm-player-h));display:flex}
.afm-hero{
  position:relative;width:100%;display:flex;align-items:center;
  padding:58px 0 64px;overflow:hidden
}
.afm-hero:before{
  content:"";
  position:absolute;
  left:-190px;top:22%;
  width:360px;height:360px;border-radius:50%;
  border:1px solid rgba(var(--afm-orange-rgb),.055);
  box-shadow:0 0 0 60px rgba(var(--afm-orange-rgb),.012);
  pointer-events:none
}
.afm-hero:after{
  content:"";
  position:absolute;
  width:520px;height:520px;right:-260px;top:50%;
  transform:translateY(-50%);
  border:1px solid rgba(var(--afm-blue-rgb),.075);
  border-radius:50%;
  box-shadow:0 0 0 80px rgba(var(--afm-blue-rgb),.014);
  pointer-events:none
}
.afm-hero-grid{
  position:relative;z-index:1;
  display:grid;
  grid-template-columns:minmax(270px,360px) minmax(0,1fr);
  align-items:center;gap:74px
}

.afm-station-art{position:relative;min-width:0}
.afm-art-inner{
  position:relative;aspect-ratio:1/1;
  background:#fff;overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 28px 72px rgba(0,0,0,.34)
}
.afm-art-inner:after{
  content:"";
  position:absolute;inset:auto 0 0 0;height:3px;
  background:linear-gradient(90deg,var(--afm-orange) 0 56%,var(--afm-blue) 56% 100%);
  z-index:2
}
.afm-station-icon,.afm-current-art{position:absolute;inset:0;width:100%;height:100%}
.afm-station-icon{object-fit:contain;padding:18%;background:#fff}
.afm-current-art{object-fit:cover}
.afm-art-live{
  position:absolute;left:14px;bottom:14px;z-index:3;
  display:flex;align-items:center;gap:7px;height:29px;padding:0 11px;
  background:rgba(12,12,14,.92);color:#fff;
  border:1px solid rgba(255,255,255,.12);
  font-size:8px;font-weight:850;letter-spacing:.13em;text-transform:uppercase;
  backdrop-filter:blur(8px)
}
.afm-art-live .dot{box-shadow:none}

.afm-station-copy{min-width:0}
.afm-kicker{
  margin:0 0 12px;
  color:var(--afm-orange);
  font-size:10px;font-weight:850;letter-spacing:.24em;text-transform:uppercase
}
.afm-frequency{
  display:flex;align-items:baseline;gap:13px;margin:0;white-space:nowrap;
  line-height:1;font-variant-numeric:tabular-nums lining-nums
}
.afm-frequency-number{
  font-size:clamp(76px,8.1vw,118px);
  line-height:.82;font-weight:850;letter-spacing:-.064em;
  color:#fff;
  text-shadow:0 16px 42px rgba(var(--afm-orange-rgb),.09)
}
.afm-frequency-unit{
  font-size:clamp(22px,2.35vw,31px);
  line-height:1;font-weight:850;letter-spacing:-.025em;
  color:var(--afm-orange)
}
.afm-location{margin:18px 0 0;color:var(--afm-muted);font-size:14px;font-weight:550;line-height:1.45}

.afm-now-playing{
  margin-top:34px;padding:17px 0;
  border-top:1px solid var(--afm-line);
  border-bottom:1px solid var(--afm-line);
  display:grid;grid-template-columns:118px minmax(0,1fr);
  column-gap:20px;row-gap:4px;align-items:center
}
.afm-now-playing>span{
  grid-row:1/3;color:var(--afm-orange);
  font-size:8px;font-weight:850;letter-spacing:.17em;text-transform:uppercase
}
.afm-now-playing strong,.afm-now-playing small{
  display:block;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.afm-now-playing strong{font-size:19px;line-height:1.2;font-weight:750;letter-spacing:-.015em;color:#fff}
.afm-now-playing small{color:var(--afm-muted);font-size:11px;font-weight:550}

.afm-hero-listen{
  margin-top:25px;min-width:210px;height:58px;padding:0 20px 0 10px;
  border:1px solid rgba(var(--afm-orange-rgb),.84);
  background:var(--afm-orange);color:#101012;
  display:inline-flex;align-items:center;gap:12px;cursor:pointer;
  box-shadow:0 13px 34px rgba(var(--afm-orange-rgb),.18);
  transition:transform .18s ease,background .18s ease,box-shadow .18s ease
}
.afm-hero-listen:hover{
  transform:translateY(-2px);
  background:#fff;
  border-color:#fff;
  box-shadow:0 16px 38px rgba(0,0,0,.22)
}
.afm-hero-listen:focus-visible,.afm-dock-play:focus-visible,.social-icons a:focus-visible,.afm-dock-volume button:focus-visible{
  outline:2px solid var(--afm-orange);outline-offset:3px
}
.afm-play-icon{
  width:38px;height:38px;border-radius:999px;
  background:#111113;color:#fff;
  display:grid;place-items:center;flex:0 0 auto;
  transition:transform .18s ease,background .18s ease
}
.afm-hero-listen:hover .afm-play-icon{transform:scale(1.035);background:var(--afm-blue)}
.afm-play-icon svg{width:17px;height:17px;fill:#fff}
.afm-hero-listen-copy{text-align:left;line-height:1}
.afm-hero-listen-copy strong,.afm-hero-listen-copy small{display:block}
.afm-hero-listen-copy strong{font-size:10px;font-weight:850;letter-spacing:.11em}
.afm-hero-listen-copy small{margin-top:5px;color:rgba(17,17,19,.64);font-size:7px;font-weight:800;letter-spacing:.11em}
.afm-hero-listen:hover .afm-hero-listen-copy small{color:#6E6E76}

.afm-social-row{margin-top:34px;display:flex;align-items:center;gap:15px}
.afm-social-row>span{
  color:var(--afm-muted);font-size:7px;font-weight:850;letter-spacing:.16em;text-transform:uppercase
}
.social-icons{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.social-icons a{
  width:38px;height:38px;border:1px solid var(--afm-line);
  background:var(--afm-panel);color:#fff;
  display:grid;place-items:center;
  transition:background .16s ease,border-color .16s ease,transform .16s ease,color .16s ease,box-shadow .16s ease
}
.social-icons a:nth-child(odd):hover{
  background:var(--afm-orange);border-color:var(--afm-orange);color:#111;
  box-shadow:0 8px 22px rgba(var(--afm-orange-rgb),.17)
}
.social-icons a:nth-child(even):hover{
  background:var(--afm-blue);border-color:var(--afm-blue);color:#fff;
  box-shadow:0 8px 22px rgba(var(--afm-blue-rgb),.19)
}
.social-icons a:hover{transform:translateY(-2px)}
.social-icons svg{width:16px;height:16px;fill:currentColor}

/* Footer */
.site-footer{
  min-height:50px;background:var(--afm-bg-deep);
  border-top:1px solid var(--afm-line-soft);display:flex;align-items:center
}
.footer-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;padding:10px 0}
.footer-row small{color:var(--afm-dim);font-size:7px;letter-spacing:.07em}
.footer-row small:last-child{text-align:right}
.afm-credit{text-align:center;white-space:nowrap}
.afm-credit strong{color:var(--afm-text-soft);font-weight:850;letter-spacing:.08em}

/* Sticky live player */
.afm-dock{
  position:fixed;left:0;right:0;bottom:0;height:var(--afm-player-h);z-index:1000;
  background:
    linear-gradient(90deg,rgba(var(--afm-orange-rgb),.055),transparent 25%,transparent 72%,rgba(var(--afm-blue-rgb),.065)),
    rgba(8,8,10,.985);
  border-top:1px solid rgba(255,255,255,.10);
  box-shadow:0 -14px 38px rgba(0,0,0,.30);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)
}
.afm-dock:before{
  content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,var(--afm-orange) 0 54%,var(--afm-blue) 54% 100%);
  opacity:.86
}
.afm-dock-inner{
  width:min(1260px,calc(100% - 40px));height:100%;margin-inline:auto;
  display:grid;grid-template-columns:48px 160px minmax(220px,1fr) 82px 176px;
  align-items:center;gap:14px
}
.afm-dock-play{
  width:44px;height:44px;border:0;border-radius:999px;background:var(--afm-orange);
  display:grid;place-items:center;cursor:pointer;
  box-shadow:0 8px 24px rgba(var(--afm-orange-rgb),.15);
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease
}
.afm-dock-play:hover{
  transform:scale(1.045);background:#fff;
  box-shadow:0 0 0 6px rgba(var(--afm-orange-rgb),.08)
}
.afm-dock-play svg{width:17px;height:17px;fill:#111}
.afm-dock-station{display:flex;align-items:center;gap:9px;min-width:0}
.afm-dock-station img{width:25px;height:25px;object-fit:contain;flex:0 0 auto}
.afm-dock-station div{min-width:0}
.afm-dock-station small,.afm-dock-station strong{display:block;white-space:nowrap}
.afm-dock-station small{color:var(--afm-orange);font-size:6px;font-weight:850;letter-spacing:.11em}
.afm-dock-station small .dot{width:4px;height:4px;margin-right:4px;vertical-align:1px}
.afm-dock-station strong{margin-top:4px;font-size:9px;font-weight:850;letter-spacing:.055em}
.afm-dock-track{min-width:0}
.afm-dock-track-copy{display:flex;align-items:baseline;gap:9px;min-width:0}
.afm-dock-track-copy strong,.afm-dock-track-copy span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.afm-dock-track-copy strong{max-width:52%;font-size:11px;font-weight:750}
.afm-dock-track-copy span{max-width:42%;font-size:9px;color:var(--afm-muted)}
.afm-live-line{position:relative;height:2px;margin-top:9px;background:var(--afm-line);overflow:hidden}
.afm-live-line i{
  display:block;position:relative;width:100%;height:100%;
  background:linear-gradient(90deg,var(--afm-orange) 0 68%,var(--afm-blue) 68% 100%);
  overflow:hidden
}
.afm-live-line i:after{
  content:"";position:absolute;top:0;bottom:0;left:-28%;width:22%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.58),transparent);opacity:0
}
.afm-is-playing .afm-live-line i:after{opacity:.52;animation:afmSignal 2.8s linear infinite}
.afm-dock-state{display:flex;justify-content:center}
.afm-dock-state span{color:var(--afm-muted);font-size:7px;font-weight:850;letter-spacing:.11em;white-space:nowrap}
.afm-dock-volume{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.afm-dock-volume button{width:28px;height:28px;border:0;background:transparent;padding:0;display:grid;place-items:center;cursor:pointer}
.afm-dock-volume svg{width:16px;height:16px;fill:var(--afm-muted)}
.afm-dock-volume button:hover svg{fill:var(--afm-orange)}
.afm-dock-volume input{width:132px;accent-color:var(--afm-orange);cursor:pointer}

.afm-autoplay-blocked .afm-play-icon,.afm-autoplay-blocked .afm-dock-play{animation:afmTap 1.9s ease-in-out infinite}
.afm-reconnecting .afm-live-line i{opacity:.55}
.afm-is-playing .header-live .dot,.afm-is-playing .afm-art-live .dot,.afm-is-playing .afm-dock-station .dot{animation:afmLive 1.8s ease-in-out infinite}

@keyframes afmLive{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.48;transform:scale(.86)}}
@keyframes afmTap{0%,100%{box-shadow:0 0 0 0 rgba(var(--afm-orange-rgb),.14)}50%{box-shadow:0 0 0 8px rgba(var(--afm-orange-rgb),0)}}
@keyframes afmSignal{from{left:-28%}to{left:110%}}

/* Tablet */
@media(max-width:980px){
  :root{--afm-player-h:76px}
  .wrap{width:calc(100% - 40px)}
  .site-header{height:84px}
  .brand img{width:235px;max-height:52px}
  .afm-main{min-height:auto}
  .afm-hero{padding:48px 0 54px}
  .afm-hero-grid{grid-template-columns:minmax(225px,300px) minmax(0,1fr);gap:48px}
  .afm-frequency-number{font-size:clamp(66px,9vw,92px)}
  .afm-frequency-unit{font-size:clamp(20px,2.5vw,27px)}
  .afm-now-playing{grid-template-columns:106px minmax(0,1fr)}
  .afm-dock-inner{grid-template-columns:46px 145px minmax(180px,1fr) 72px;gap:12px}
  .afm-dock-volume{display:none}
}

/* Mobile */
@media(max-width:720px){
  :root{--afm-player-h:70px}
  body{
    padding-bottom:calc(var(--afm-player-h) + env(safe-area-inset-bottom,0px));
    background:
      radial-gradient(ellipse at 50% 10%,rgba(var(--afm-orange-rgb),.07),transparent 22rem),
      radial-gradient(ellipse at 90% 54%,rgba(var(--afm-blue-rgb),.06),transparent 20rem),
      var(--afm-bg)
  }
  .wrap{width:calc(100% - 28px)}
  .site-header{height:70px}
  .brand img{width:190px;max-width:68vw;max-height:44px}
  .header-live{gap:6px;font-size:7px}
  .header-live strong{display:none}
  .afm-hero{padding:22px 0 30px;align-items:flex-start}
  .afm-hero:before,.afm-hero:after{display:none}
  .afm-hero-grid{display:flex;flex-direction:column;gap:0}
  .afm-station-art{width:min(58vw,248px);margin-inline:auto}
  .afm-art-live{left:10px;bottom:10px;height:26px;padding:0 9px;font-size:7px}
  .afm-station-copy{width:100%;margin-top:21px;text-align:center}
  .afm-kicker{margin-bottom:8px;font-size:8px;letter-spacing:.22em}
  .afm-frequency{justify-content:center;gap:9px}
  .afm-frequency-number{font-size:clamp(58px,16vw,80px)}
  .afm-frequency-unit{font-size:clamp(18px,5vw,24px)}
  .afm-location{margin-top:9px;font-size:12px}
  .afm-now-playing{margin-top:19px;padding:14px 0;grid-template-columns:1fr;row-gap:4px;text-align:center}
  .afm-now-playing>span{grid-row:auto;margin-bottom:2px;font-size:7px}
  .afm-now-playing strong{font-size:16px}
  .afm-now-playing small{font-size:10px}
  .afm-hero-listen{height:52px;min-width:194px;margin-top:17px;padding-right:18px}
  .afm-play-icon{width:34px;height:34px}
  .afm-social-row{margin-top:21px;justify-content:center;flex-direction:column;gap:9px}
  .social-icons{justify-content:center}
  .social-icons a{width:37px;height:37px}
  .site-footer{min-height:64px}
  .footer-row{grid-template-columns:1fr;gap:4px;text-align:center;padding:9px 0}
  .footer-row small:last-child{text-align:center}
  .afm-credit{order:3}
  .afm-dock{height:calc(var(--afm-player-h) + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px)}
  .afm-dock-inner{width:calc(100% - 22px);grid-template-columns:42px minmax(0,1fr) auto;gap:10px}
  .afm-dock-play{width:40px;height:40px}
  .afm-dock-station{display:none}
  .afm-dock-track-copy{gap:7px}
  .afm-dock-track-copy strong{max-width:60%;font-size:10px}
  .afm-dock-track-copy span{max-width:36%;font-size:8px}
  .afm-live-line{margin-top:7px}
  .afm-dock-state span{font-size:6px;letter-spacing:.08em}
}

@media(max-width:430px){
  .site-header{height:62px}
  .brand img{width:165px}
  .wrap{width:calc(100% - 24px)}
  .afm-hero{padding-top:16px}
  .afm-station-art{width:min(55vw,212px)}
  .afm-station-copy{margin-top:17px}
  .afm-frequency-number{font-size:54px}
  .afm-frequency-unit{font-size:17px}
  .afm-now-playing{margin-top:15px;padding:12px 0}
  .afm-now-playing strong{font-size:15px}
  .afm-hero-listen{height:49px;min-width:184px}
  .social-icons a{width:35px;height:35px}
  .social-icons svg{width:15px;height:15px}
  .footer-row small,.afm-credit{font-size:6px}
  .afm-dock-inner{width:calc(100% - 18px);grid-template-columns:40px minmax(0,1fr) auto;gap:8px}
  .afm-dock-play{width:38px;height:38px}
  .afm-dock-state{max-width:58px;text-align:center}
}

@media(max-width:350px){
  .header-live{display:none}
  .brand img{width:158px;max-width:82vw}
  .afm-frequency-number{font-size:49px}
  .afm-frequency-unit{font-size:16px}
  .afm-dock-track-copy span{display:none}
  .afm-dock-track-copy strong{max-width:100%}
}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}


/* v10.0 — production responsive/accessibility refinement */
html,body{max-width:100%;overflow-x:hidden}
.afm-hero-grid>*,
.afm-station-copy,
.afm-dock-track,
.afm-dock-track-copy{min-width:0}
.afm-station-copy{overflow:hidden}
.afm-now-playing strong,
.afm-now-playing small{max-width:100%}
.afm-hero-listen,
.afm-dock-play,
.social-icons a,
.afm-dock-volume button{
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
.afm-dock{contain:layout paint}
.afm-current-art{background:#fff}
.afm-art-inner img{user-select:none;-webkit-user-drag:none}
.afm-hero-listen[aria-pressed="true"] .afm-play-icon{
  background:var(--afm-blue);
}
@supports (height:100dvh){
  .afm-main{min-height:calc(100dvh - 92px - 50px - var(--afm-player-h))}
}
@media (min-width:1280px){
  .afm-hero-grid{grid-template-columns:minmax(300px,390px) minmax(0,1fr);gap:86px}
  .afm-station-copy{max-width:680px}
}
@media (min-width:721px) and (max-width:860px){
  .afm-hero-grid{grid-template-columns:minmax(210px,270px) minmax(0,1fr);gap:36px}
  .afm-frequency-number{font-size:clamp(62px,8.6vw,78px)}
  .afm-now-playing{grid-template-columns:94px minmax(0,1fr);column-gap:14px}
  .afm-dock-inner{grid-template-columns:44px 126px minmax(150px,1fr) 68px}
  .afm-dock-station strong{font-size:8px}
}
@media (max-width:720px){
  .header-row{gap:12px}
  .afm-station-copy{overflow:visible}
  .afm-now-playing strong,
  .afm-now-playing small{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
  .afm-now-playing strong{-webkit-line-clamp:2}
  .afm-now-playing small{-webkit-line-clamp:1}
  .afm-dock-track-copy strong,
  .afm-dock-track-copy span{min-width:0}
}
@media (max-width:390px){
  .afm-station-art{width:min(52vw,190px)}
  .afm-frequency-number{font-size:50px}
  .afm-frequency-unit{font-size:16px}
  .afm-location{font-size:11px}
  .afm-social-row{margin-top:18px}
  .afm-dock-state{display:none}
  .afm-dock-inner{grid-template-columns:40px minmax(0,1fr)}
}
@media (orientation:landscape) and (max-height:600px) and (min-width:721px){
  :root{--afm-player-h:68px}
  .site-header{height:66px}
  .brand img{width:205px;max-height:42px}
  .afm-main{min-height:auto}
  .afm-hero{padding:24px 0 30px}
  .afm-hero-grid{grid-template-columns:190px minmax(0,1fr);gap:34px}
  .afm-frequency-number{font-size:64px}
  .afm-frequency-unit{font-size:19px}
  .afm-location{margin-top:8px}
  .afm-now-playing{margin-top:18px;padding:11px 0}
  .afm-hero-listen{height:48px;margin-top:14px}
  .afm-social-row{margin-top:16px}
  .social-icons a{width:34px;height:34px}
  .site-footer{min-height:42px}
}
@media print{
  .afm-dock,.header-live,.afm-hero-listen,.afm-social-row{display:none!important}
  body{padding-bottom:0;background:#fff;color:#111}
}