/* Periscope Media — base styles, fonts, keyframes & animations */
html { scroll-behavior: smooth; }
body { margin: 0; -webkit-font-smoothing: antialiased; }
*, *::before, *::after { box-sizing: border-box; }

@keyframes pmPulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.5; transform: scale(1.35); } }
@keyframes pmMarquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
@keyframes pmBlink { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes pmFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes pmRise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: translateY(0); } }
@keyframes pmLensPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.45; } }
@keyframes pmGlowPulse { 0%, 100% { box-shadow: 0 6px 24px rgba(247, 148, 29, 0.35); } 50% { box-shadow: 0 8px 42px rgba(247, 148, 29, 0.65); } }
@keyframes pmBars { from { transform: scaleY(0.25); } to { transform: scaleY(1); } }
@keyframes pmDash { to { stroke-dashoffset: -40; } }
@keyframes pmRing { 0% { transform: scale(1); opacity: 0.5; } 100% { transform: scale(1.9); opacity: 0; } }

[data-anim="lens"]  { animation: pmLensPulse 2.6s ease-in-out infinite; }
[data-anim="pulse"] { animation: pmPulse 2s ease-in-out infinite; }
[data-anim="glow"]  { animation: pmGlowPulse 2.8s ease-in-out infinite; }
[data-anim="marquee"] { animation: pmMarquee 32s linear infinite; }
[data-anim="blink"] { animation: pmBlink 1.05s step-end infinite; }
[data-anim="float"] { animation: pmFloat 6s ease-in-out infinite; }
[data-anim="ring"]  { animation: pmRing 1.8s ease-out infinite; }
[data-anim="ring2"] { animation: pmRing 2.2s ease-out infinite; }
[data-anim="dash"]  { animation: pmDash 1.4s linear infinite; }
[data-anim="dash2"] { animation: pmDash 1.8s linear infinite; }
[data-anim="risein"] { animation: pmRise 0.5s cubic-bezier(0.16, 1, 0.3, 1) both; }
[data-anim="rise1"] { animation: pmRise 0.7s cubic-bezier(0.16, 1, 0.3, 1) both; }
[data-anim="rise2"] { animation: pmRise 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both; }
[data-anim="rise3"] { animation: pmRise 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both; }
[data-anim="rise4"] { animation: pmRise 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.3s both; }
[data-anim="rise5"] { animation: pmRise 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.4s both; }
[data-anim="rise6"] { animation: pmRise 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.25s both; }
[data-anim="float-a"] { animation: pmFloat 5.5s ease-in-out infinite; }
[data-anim="float-b"] { animation: pmFloat 6.2s ease-in-out -1.2s infinite; }
[data-anim="float-c"] { animation: pmFloat 5.8s ease-in-out -2.4s infinite; }
[data-anim="float-d"] { animation: pmFloat 6.5s ease-in-out -0.8s infinite; }
[data-anim="float-e"] { animation: pmFloat 5.2s ease-in-out -3s infinite; }
[data-anim="float-f"] { animation: pmFloat 6s ease-in-out -1.8s infinite; }

[data-bars] { transform-origin: bottom; }
[data-bars="1"] { animation: pmBars 1.6s ease-in-out 0s infinite alternate; }
[data-bars="2"] { animation: pmBars 1.8s ease-in-out -0.5s infinite alternate; }
[data-bars="3"] { animation: pmBars 1.5s ease-in-out -0.9s infinite alternate; }
[data-bars="4"] { animation: pmBars 1.7s ease-in-out -0.3s infinite alternate; }
[data-bars="5"] { animation: pmBars 1.9s ease-in-out -1.2s infinite alternate; }

/* ---- hover / focus / active states (converted from the design) ---- */
.hv0:hover { color: #1A1A2E; }
.hv1:hover { transform: translateY(-2px); box-shadow: 0 8px 26px rgba(247, 148, 29, 0.5); }
.hv2:hover { transform: translateY(-3px); }
.hv3:hover { border-color: rgba(247, 148, 29, 0.5); background: rgba(247, 148, 29, 0.05); }
.hv4:hover { box-shadow: 0 14px 40px rgba(20, 20, 40, 0.08); transform: translateY(-4px); border-color: rgba(247, 148, 29, 0.4); }
.hv5:hover { border-color: #F7941D; box-shadow: 0 12px 32px rgba(247, 148, 29, 0.14); transform: translateY(-4px); }
.hv6:hover { border-color: #F7941D; background: rgba(247, 148, 29, 0.07); }
.hv7:hover { border-color: #F7941D; box-shadow: 0 12px 30px rgba(247, 148, 29, 0.13); transform: translateY(-4px); }
.hv8:hover { transform: translateY(-2px); }
.hv9:hover { color: #fff; }
.hv10:hover { border-color: #F7941D; color: #d97d0d; }
.hv11:hover { border-color: rgba(247, 148, 29, 0.6); background: rgba(247, 148, 29, 0.08); }
.hv12:hover { border-color: #F7941D; box-shadow: 0 14px 36px rgba(247, 148, 29, 0.13); transform: translateY(-4px); }
.hv13:hover { background: #F7941D; color: #fff; }
.hv14:hover { color: #d97d0d; }
.ff0:focus { border-color: #F7941D; }
.hv15:hover { color: #fff; border-color: rgba(255,255,255,0.5); }