/*
Theme Name: Рибка радио
Template: radio-jockey
Version: 1.0
*/
:root{--rr-navy:#0b2540;--rr-blue:#14598f;--rr-yellow:#ffc933}
.rr-head{background:var(--rr-navy);color:#fff}
.rr-head a{color:#fff;text-decoration:none}
.rr-head .wp-block-site-title a{font-weight:800;font-size:1.5rem}
.rr-head .wp-block-navigation a:hover{color:var(--rr-yellow)}
.rr-foot{background:var(--rr-navy);color:#b9cfe2;text-align:center;padding:28px 16px}
.rr-foot a{color:#fff}
.rr-hero{background:radial-gradient(circle at 50% -10%,#12426b,#0b2540 62%);color:#eaf3fb;text-align:center;padding:56px 16px 64px}
.rr-hero h1{margin:0;font-size:clamp(30px,6vw,52px);color:#fff}
.rr-hero p.sub{color:#9db8cf;margin:8px 0 26px}
.rr-box{max-width:560px;margin:0 auto;background:#ffffff12;border:1px solid #ffffff22;border-radius:22px;padding:28px 20px}
#rr-play{width:132px;height:132px;border-radius:50%;border:0;background:var(--rr-yellow);color:#0b2540;font-size:54px;cursor:pointer;animation:rrp 2s infinite}
#rr-play.on{animation:none;background:#fff}
@keyframes rrp{0%{box-shadow:0 0 0 0 #ffc93388}70%{box-shadow:0 0 0 22px #ffc93300}100%{box-shadow:0 0 0 0 #ffc93300}}
.rr-live{margin-top:14px;font-size:13px;letter-spacing:.12em;color:var(--rr-yellow);font-weight:700}
.rr-np{margin:6px 0 0;font-size:19px;min-height:28px;color:#fff}
.rr-li{color:#9db8cf;font-size:14px;margin-top:6px}
.rr-btn{display:inline-block;margin:18px 6px 0;padding:14px 22px;border-radius:14px;font-weight:700;text-decoration:none;border:1px solid #ffffff44;color:#fff}
.rr-btn.pri{background:var(--rr-yellow);border-color:var(--rr-yellow);color:#0b2540}
.rr-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;max-width:1000px;margin:40px auto;padding:0 16px}
.rr-card{background:#f3f6f9;border-radius:16px;padding:22px}
.rr-card h3{margin:0 0 8px;color:var(--rr-blue)}
.rr-news{max-width:1000px;margin:10px auto 40px;padding:0 16px}.rr-news .wp-block-rss{list-style:none;padding:0}.rr-news .wp-block-rss li{margin:0 0 18px}
/* rr-scena */
.rr-hero.rr-hs{position:relative;overflow:hidden;padding-bottom:270px;background:linear-gradient(#5cb8f0,#bfe8fb 62%,#e9f7ff);color:#0b2540;transition:background .6s}
.rr-hs h1{color:#0b2540}.rr-hs p.sub{color:#1d4a70}
.rr-hero.rr-hs[data-t=night]{background:linear-gradient(#050d22,#0e2347 60%,#1b3a68);color:#eaf3fb}
.rr-hs[data-t=night] h1{color:#fff}.rr-hs[data-t=night] p.sub{color:#9db8cf}
.rr-hs>.rr-box,.rr-hs>.rr-btn,.rr-hs>h1,.rr-hs>p{position:relative;z-index:5}

.rr-sun,.rr-moon,.rr-stars{position:absolute;transition:opacity .6s}
.rr-sun{top:34px;right:12%;width:90px;height:90px;border-radius:50%;background:radial-gradient(#fff6b0,#ffd23a 60%,#ffb800);box-shadow:0 0 0 14px rgba(255,214,58,.25),0 0 70px 30px rgba(255,214,58,.5);animation:rr-puls 5s ease-in-out infinite}
.rr-moon{top:34px;right:12%;width:80px;height:80px;border-radius:50%;background:#f4f1dc;box-shadow:inset -16px -4px 0 0 #d9d4b4,0 0 60px 20px rgba(220,230,255,.35);opacity:0}
.rr-stars{inset:0;opacity:0;background-image:radial-gradient(2px 2px at 10% 20%,#fff,transparent),radial-gradient(2px 2px at 25% 60%,#fff,transparent),radial-gradient(1.5px 1.5px at 40% 30%,#fff,transparent),radial-gradient(2px 2px at 55% 15%,#fff,transparent),radial-gradient(1.5px 1.5px at 68% 50%,#fff,transparent),radial-gradient(2px 2px at 78% 25%,#fff,transparent),radial-gradient(1.5px 1.5px at 90% 55%,#fff,transparent),radial-gradient(1.5px 1.5px at 33% 8%,#fff,transparent);animation:rr-mig 4s ease-in-out infinite}
.rr-hero[data-t=night] .rr-sun{opacity:0}
.rr-hero[data-t=night] .rr-moon,.rr-hero[data-t=night] .rr-stars{opacity:1}
.rr-oblak{position:absolute;height:26px;width:90px;border-radius:30px;background:#fff;opacity:.85;animation:rr-oblak 60s linear infinite}
.rr-oblak:before{content:"";position:absolute;left:14px;top:-14px;width:40px;height:40px;border-radius:50%;background:#fff}
.rr-oblak.b{top:90px;animation-duration:85s;animation-delay:-30s;transform:scale(.7)}
.rr-oblak.a{top:50px;left:-120px}
.rr-hero[data-t=night] .rr-oblak{opacity:.12}
.rr-lodka{position:absolute;left:50%;bottom:48px;width:min(430px,70vw);margin-left:-215px;animation:rr-lulee 4s ease-in-out infinite;transform-origin:50% 90%;z-index:2;pointer-events:none}
.rr-lodka img{width:100%;display:block;transition:filter .6s}
.rr-hero[data-t=night] .rr-lodka img{filter:brightness(.55) saturate(.8)}
.rr-lodka svg{position:absolute;left:0;top:0;width:100%;height:auto;overflow:visible}
.rr-vala{position:absolute;left:0;bottom:0;width:200%;height:90px;z-index:3;animation:rr-vala 9s linear infinite;pointer-events:none}
.rr-vala.v2{bottom:-14px;height:80px;animation-duration:6s;animation-direction:reverse;z-index:4}
.rr-hero[data-t=night] .rr-vala path{fill:#12335e}
.rr-hero[data-t=night] .rr-vala.v2 path{fill:#0b2540}

@keyframes rr-vala{to{transform:translateX(-50%)}}
@keyframes rr-lulee{0%,100%{transform:translateY(0) rotate(-1.2deg)}50%{transform:translateY(7px) rotate(1.2deg)}}
@keyframes rr-oblak{to{transform:translateX(120vw)}}
@keyframes rr-puls{50%{transform:scale(1.06)}}
@keyframes rr-mig{50%{opacity:.6}}
@keyframes rr-poplavak{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
.rr-pop{animation:rr-poplavak 2.4s ease-in-out infinite}

/* rr-zvuk */
.rr-vol{margin-top:14px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:20px}
.rr-vol input{width:min(220px,60vw);accent-color:#ffc933;cursor:pointer}
/* rr-luna */
.rr-hs .rr-moon{background:none;box-shadow:none;filter:drop-shadow(0 0 22px rgba(220,230,255,.45))}
/* rr-luna2 */
@media (max-width:700px){.rr-hs .rr-moon,.rr-hs .rr-sun{top:10px;right:10px;width:46px;height:46px}.rr-hs .rr-moon svg{width:46px;height:46px}.rr-hs .rr-sun{box-shadow:0 0 0 6px rgba(255,214,58,.25),0 0 30px 12px rgba(255,214,58,.5)}}
/* rr-sreda */
.rr-hs .rr-lodka{left:50%!important;right:auto!important;margin:0!important;bottom:62px;width:min(430px,78vw);max-width:none;animation:rr-lulee2 4s ease-in-out infinite}
@keyframes rr-lulee2{0%,100%{transform:translateX(-50%) translateY(0) rotate(-1.2deg)}50%{transform:translateX(-50%) translateY(7px) rotate(1.2deg)}}
/* rr-znamence */
.rr-lodka .zn{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.zn .sl{animation:znv var(--d,1.6s) ease-in-out infinite;animation-delay:var(--l,0s)}
@keyframes znv{0%,100%{transform:translateY(calc(var(--a,2px)*-1))}50%{transform:translateY(var(--a,2px))}}
.zn .vis{transform-origin:14px 62px;transition:transform 1s}
.zn.tish .vis{transform:rotate(-78deg);animation:znl 4s ease-in-out infinite}
@keyframes znl{50%{transform:rotate(-70deg)}}
@media (prefers-reduced-motion:reduce){.zn .sl,.zn.tish .vis{animation:none}}

.zn.tish .vis,.zn.tish .sl{transform:none!important;animation:none!important}

/* rr-vreme */
.rr-hs .rr-oblak:before{background:inherit}
.rr-hs .rr-oblak{transition:opacity .8s,background .8s}
.rr-hs .rr-dazhd,.rr-hs .rr-sneg,.rr-hs .rr-mulia,.rr-hs .rr-svk{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .8s;z-index:3}
.rr-hs .rr-dazhd{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90'%3E%3Cpath d='M10 4l-4 14M52 30l-4 14M80 8l-4 14M30 60l-4 14M70 66l-4 14' stroke='%23cfe4f7' stroke-width='1.6' stroke-linecap='round' opacity='.75'/%3E%3C/svg%3E");background-size:90px 90px;animation:rr-pad .55s linear infinite}
.rr-hs .rr-dazhd.b{background-size:60px 60px;animation-duration:.4s;opacity:0}
.rr-hs .rr-sneg{background-image:radial-gradient(3px 3px at 20% 30%,#fff,transparent),radial-gradient(2.5px 2.5px at 60% 70%,#fff,transparent),radial-gradient(3px 3px at 85% 20%,#fff,transparent),radial-gradient(2px 2px at 40% 90%,#fff,transparent);background-size:110px 110px;animation:rr-sn 6s linear infinite}
.rr-hs .rr-mulia{background:linear-gradient(rgba(220,228,235,.0),rgba(220,228,235,.55) 55%,rgba(220,228,235,.35))}
.rr-hs .rr-svk{background:#fff;z-index:6}
.rr-hs[data-w=rain] .rr-dazhd,.rr-hs[data-w=storm] .rr-dazhd,.rr-hs[data-w=rain] .rr-dazhd.b,.rr-hs[data-w=storm] .rr-dazhd.b{opacity:1}
.rr-hs[data-w=snow] .rr-sneg{opacity:1}
.rr-hs[data-w=fog] .rr-mulia{opacity:1}
.rr-hs[data-w=storm] .rr-svk{animation:rr-svk 7s infinite}
.rr-hs[data-w=rain] .rr-sun,.rr-hs[data-w=storm] .rr-sun,.rr-hs[data-w=snow] .rr-sun{opacity:.0}
.rr-hs[data-w=cloud] .rr-sun{opacity:.35;filter:blur(2px)}
.rr-hs[data-w=fog] .rr-sun{opacity:.4;filter:blur(4px)}
.rr-hs[data-t=night][data-w=rain] .rr-moon,.rr-hs[data-t=night][data-w=storm] .rr-moon,.rr-hs[data-t=night][data-w=snow] .rr-moon{opacity:.08}
.rr-hs[data-t=night][data-w=cloud] .rr-moon{opacity:.4;filter:blur(1px)}
.rr-hs[data-t=night][data-w=fog] .rr-moon{opacity:.35;filter:blur(3px)}
.rr-hs[data-t=night][data-w=rain] .rr-stars,.rr-hs[data-t=night][data-w=storm] .rr-stars,.rr-hs[data-t=night][data-w=snow] .rr-stars,.rr-hs[data-t=night][data-w=cloud] .rr-stars,.rr-hs[data-t=night][data-w=fog] .rr-stars{opacity:0}
.rr-hs[data-t=day][data-w=cloud],.rr-hs[data-t=day][data-w=fog]{background:linear-gradient(#8fb3cf,#c4d6e3 62%,#e4ecf1)}
.rr-hs[data-t=day][data-w=rain],.rr-hs[data-t=day][data-w=snow]{background:linear-gradient(#6f8294,#9aabb8 62%,#c3ced6)}
.rr-hs[data-t=day][data-w=storm]{background:linear-gradient(#4a5967,#74838f 62%,#9aa7b0)}
.rr-hs[data-t=night][data-w=cloud],.rr-hs[data-t=night][data-w=fog]{background:linear-gradient(#0b1428,#1a2a45 60%,#2a3f5f)}
.rr-hs[data-t=night][data-w=rain],.rr-hs[data-t=night][data-w=snow]{background:linear-gradient(#070d1a,#121e33 60%,#1f3048)}
.rr-hs[data-t=night][data-w=storm]{background:linear-gradient(#04070f,#0c1424 60%,#16233a)}
.rr-hs[data-w=cloud] .rr-oblak,.rr-hs[data-w=fog] .rr-oblak{background:#f3f6f9;opacity:.9}
.rr-hs[data-w=rain] .rr-oblak,.rr-hs[data-w=snow] .rr-oblak{background:#8a98a6;opacity:.95}
.rr-hs[data-w=storm] .rr-oblak{background:#56626e;opacity:.97}
.rr-hs[data-t=night][data-w=cloud] .rr-oblak,.rr-hs[data-t=night][data-w=fog] .rr-oblak{background:#4a5b73;opacity:.7}
.rr-hs[data-t=night][data-w=rain] .rr-oblak,.rr-hs[data-t=night][data-w=snow] .rr-oblak{background:#2c3a4e;opacity:.9}
.rr-hs[data-t=night][data-w=storm] .rr-oblak{background:#1b2535;opacity:.95}
.rr-hs[data-w=clear] .rr-oblak.x{opacity:0}
.rr-hs .rr-oblak.x{top:20px;animation:rr-oblak 70s linear infinite}
@keyframes rr-pad{to{background-position:-30px 90px}}
@keyframes rr-sn{to{background-position:30px 110px}}
@keyframes rr-svk{0%,92%,96%,100%{opacity:0}93%{opacity:.7}94%{opacity:.1}95%{opacity:.55}}

/* rr-slunce */
.rr-hs .rr-sun,.rr-hs .rr-moon{transition:left 1.5s ease,top 1.5s ease,opacity .6s,filter .6s;margin:0}
.rr-hs .rr-sun.low{background:radial-gradient(#fff2c0,#ff9d2e 62%,#ff6a1a);box-shadow:0 0 0 14px rgba(255,140,40,.25),0 0 80px 34px rgba(255,120,40,.5)}
.rr-hs[data-d=dusk][data-t=day][data-w=clear]{background:linear-gradient(#f7a76a,#fbd3a0 58%,#cfe6f5)}
.rr-hs[data-d=dusk][data-t=night][data-w=clear]{background:linear-gradient(#1f2350,#7a4a7f 62%,#f28a5c)}
/* rr-talisman */
#rrb .rrb-lg{display:flex;align-items:center}
#rrb .rrb-lg img{height:58px;width:auto;margin:-8px 0 -10px;display:block;filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}
@media (max-width:640px){#rrb .rrb-lg img{height:46px;margin:-6px 0 -8px}}
/* rr-tal-css */
.rr-hs h1 .rr-tal,.rr-hs .rr-tal{height:1.5em;width:auto;vertical-align:-.3em;margin-right:.15em;display:inline-block}
