@font-face{font-family:Manrope;src:url('../assets/fonts/manrope-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url('../assets/fonts/manrope-600.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:Manrope;src:url('../assets/fonts/manrope-700.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Barlow;src:url('../assets/fonts/barlow-condensed-800.ttf') format('truetype');font-weight:800;font-display:swap}
:root{--blue:#0648db;--navy:#081e6b;--yellow:#ffe52d;--red:#e72c35;--white:#fff;--player-height:94px;--safe-bottom:env(safe-area-inset-bottom,0px);font-family:Manrope,sans-serif;color:var(--white);background:var(--blue);color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;min-width:280px;background:var(--blue) url('../assets/images/background.jpg') center/cover fixed no-repeat}
button,input,a{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-underline-offset:4px}
button,input{font:inherit}
button{cursor:pointer}
button:disabled{cursor:wait;opacity:.5}
button,a,input{touch-action:manipulation}
:focus-visible{outline:3px solid var(--yellow);outline-offset:5px}
::selection{color:var(--navy);background:var(--yellow)}
.icon{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.icon-library{position:absolute;width:0;height:0;overflow:hidden}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link{position:fixed;top:12px;left:12px;z-index:100;background:var(--yellow);color:var(--navy);padding:12px;transform:translateY(-200%)}
.skip-link:focus{transform:none}
.page-shell{min-height:100svh;display:flex;flex-direction:column;padding-bottom:calc(var(--player-height) + var(--safe-bottom));overflow:hidden}
.site-header{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;padding:24px 4%}
.contact-trigger{display:inline-flex;align-items:center;gap:16px;min-height:48px;text-decoration:none;font-weight:700;font-size:18px;transition:color .2s}
.contact-trigger>.icon{width:30px;height:30px}
.contact-trigger:hover{color:var(--yellow)}
.menu-divider{padding:0 4px;opacity:.7}
.social-links{display:flex;gap:26px}
.social-links a{display:grid;place-items:center;min-width:44px;min-height:48px;transition:transform .2s,color .2s}
.social-links .icon{width:34px;height:34px}
.social-links a:hover{color:var(--yellow);transform:translateY(-3px)}
.radio-stage{position:relative;display:grid;place-items:center;flex:1;min-height:300px}
.logo-scene{width:100%;height:100%;min-height:inherit;position:absolute;inset:0;display:flex;align-items:center;justify-content:center;perspective:1100px;touch-action:pan-y}
.logo-plane{position:relative;flex-shrink:0;width:min(100vw,calc((100svh - 180px)*1.7778),1600px);aspect-ratio:16/9;transform-style:flat;will-change:transform}
.scene-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
/* Escalas equivalentes à perspectiva original: 1100 / (1100 - profundidade).
   A composição gira em um único plano, sem seis superfícies 3D independentes. */
.scene-bg1{transform:scale(.96069869)}
.scene-bg2{transform:scale(.97517730)}
.scene-bg3{transform:scale(.99277978)}
.scene-bg4{transform:scale(1.01851852)}
.scene-fg1{transform:scale(1.03578154)}
.scene-logo{transform:scale(1.07632094)}
.site-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:20px 4%;font-size:11px;position:relative;z-index:6;color:#fff;text-shadow:0 1px 4px #03144c}
.site-footer p{margin:0}
.radio-player{position:fixed;z-index:5;inset:auto 0 0;background:linear-gradient(110deg,#050782,#175cd8);padding-bottom:var(--safe-bottom);isolation:isolate}
.player-controls{min-height:var(--player-height);display:flex;align-items:center;gap:24px;padding-right:4%;position:relative;z-index:1}
.play-button{width:96px;align-self:stretch;flex-shrink:0;border:0;background:var(--red);color:white;display:grid;place-items:center;transition:background .2s}
.play-button:hover{background:#c6192c}
.play-button .icon{width:34px;height:34px}
.play-button:focus-visible{outline-offset:-8px}
.station-info{min-width:0}
.station-title{display:flex;gap:18px;align-items:center}
.station-title>strong{font-family:Barlow,sans-serif;font-size:30px;line-height:1.1;letter-spacing:.01em}
.live-label{font-size:10px;font-weight:700;letter-spacing:.12em;display:flex;align-items:center;gap:7px;white-space:nowrap}
.live-label>span{width:6px;height:6px;background:#a9c0f4;border-radius:50%}
[data-state=playing] .live-label>span{background:var(--yellow)}
#player-status{font-size:12px;margin:6px 0 0;color:#e0edff;line-height:1.5}
.volume-controls{margin-left:auto;display:flex;gap:10px;align-items:center}
.icon-button{display:grid;place-items:center;background:transparent;border:0;color:inherit;width:44px;height:44px;flex-shrink:0}
.icon-button:hover{color:var(--yellow)}
#volume{--volume:75%;width:100px;height:44px;cursor:pointer;appearance:none;background:transparent;accent-color:var(--yellow)}
#volume::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(to right,var(--yellow) var(--volume),#7189d6 var(--volume))}
#volume::-webkit-slider-thumb{appearance:none;width:14px;height:14px;border-radius:50%;background:var(--yellow);margin-top:-5px}
#volume::-moz-range-track{height:4px;background:#7189d6}
#volume::-moz-range-progress{height:4px;background:var(--yellow)}
#volume::-moz-range-thumb{width:14px;height:14px;border:0;background:var(--yellow)}
.sound-waves{position:absolute;left:0;bottom:calc(var(--player-height) - 2px + var(--safe-bottom));width:100%;height:150px;pointer-events:none;opacity:0;transition:opacity .5s;z-index:-1}
.sound-waves path{fill:#ff0f7b}
.sound-waves path:nth-child(1){fill-opacity:.35}
.sound-waves path:nth-child(2){fill-opacity:.5}
.sound-waves path:nth-child(3){fill-opacity:.6}
.sound-waves path:nth-child(4){fill-opacity:.8}
[data-state=playing] .sound-waves{opacity:1}
[data-state=connecting] .play-button .icon{opacity:.55}
.contact-dialog{color-scheme:light;border:0;padding:0;width:min(620px,calc(100% - 32px));max-height:calc(100dvh - 40px);margin:auto;border-radius:14px;color:var(--navy);background:#fff;box-shadow:0 24px 90px #00134b66;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#95b0e8 #f0f5ff}
.contact-dialog::backdrop{background:#020d44b8;backdrop-filter:blur(6px)}
.contact-dialog[open]{animation:dialog-arrive .25s cubic-bezier(.16,1,.3,1)}
.dialog-heading{position:relative;background:var(--navy);color:#fff;padding:30px 70px 30px 32px}
.dialog-heading h2{font-size:24px;line-height:1.35;margin:0;letter-spacing:-.02em;font-weight:700}
.close-button{position:absolute;top:16px;right:16px;border-radius:50%;background:#ffffff12}
.dialog-content{padding:26px 32px 30px}
.contact-group+.contact-group{margin-top:24px}
.contact-group h3{font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 8px;color:#4c6188}
.contact-link{display:flex;gap:16px;align-items:center;min-height:60px;padding:10px 0;text-decoration:none;border-bottom:1px solid #e5ebf5;transition:color .2s}
.contact-link>.icon:first-child{color:#c82333}
.contact-link>span{min-width:0;overflow-wrap:anywhere}
.contact-link strong{display:block;font-size:18px;font-variant-numeric:tabular-nums}
.contact-link small{display:block;color:#4c6188;font-size:12px;margin-top:3px}
.contact-link:hover{color:var(--blue)}
.contact-arrow{margin-left:auto;width:19px;height:19px}
.email-link{min-height:48px;font-size:14px;font-weight:600}
.company-info{display:flex;align-items:flex-start;gap:16px;margin-top:28px;font-size:13px;line-height:1.7}
.company-info>.icon{margin-top:4px;color:var(--blue)}
.company-info p{margin:0}
.company-info strong{font-size:15px}
.company-info .company-id{margin-top:10px;font-size:12px;color:#4c6188;font-variant-numeric:tabular-nums}
.company-info .developer-credit{margin-top:8px;font-size:11px;color:#4c6188}
.developer-credit a{text-decoration:none}
.developer-credit a:hover{text-decoration:underline;color:var(--blue)}
.developer-credit strong{font-size:inherit;font-weight:600}
body.dialog-open{overflow:hidden}
.noscript-note{padding:24px}
@keyframes dialog-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(min-width:1024px){.scene-logo{transform:scale(1.20547945)}}
@media(min-width:1800px){.site-header{padding-top:32px}.contact-trigger{font-size:20px}}
@media(max-width:760px){
  :root{--player-height:90px}
  .site-header{padding:20px;gap:12px;flex-wrap:wrap}
  .contact-trigger{font-size:14px;gap:10px}
  .contact-trigger>.icon{width:24px}
  .social-links{gap:10px}
  .social-links .icon{width:26px;height:26px}
  .logo-plane{width:145vw;max-width:1050px}
  .site-footer{padding:18px 20px;flex-direction:column;gap:6px;text-align:center;font-size:10px}
  .player-controls{gap:14px;padding-right:12px}
  .play-button{width:76px}
  .station-title{gap:10px}
  .station-title>strong{font-size:26px}
  #player-status{font-size:11px;max-width:270px}
  #volume{width:70px}
  .volume-controls{gap:0}
  .sound-waves{height:120px}
}
@media(max-width:520px){
  .site-header{justify-content:center;gap:2px;padding:14px 16px}
  .site-header nav{display:flex;justify-content:center;width:100%}
  .social-links{gap:22px}
  .social-links a{min-height:44px}
  .logo-plane{width:170vw}
  .radio-stage{min-height:310px}
  .player-controls{gap:12px}
  .play-button{width:65px}
  #volume{display:none}
  .volume-controls{margin-left:auto}
  .station-title{gap:10px}
  .station-title>strong{font-size:25px}
  .live-label{font-size:8px;letter-spacing:.06em}
  #player-status{max-width:240px;font-size:10px}
  .dialog-heading{padding:26px 58px 26px 22px}
  .dialog-heading h2{font-size:21px}
  .dialog-content{padding:20px 22px 24px}
  .contact-link{gap:12px}
  .email-link{font-size:12px}
  .company-info{gap:12px;font-size:12px}
  .close-button{right:10px;top:10px}
}
@media(max-height:600px) and (min-width:600px){
  .site-header{padding:10px 4%}
  .radio-stage{min-height:210px}
  .logo-plane{width:min(85vw,650px)}
  .site-footer{padding:10px 4%}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .logo-plane{transform:none!important;will-change:auto}
}