/* Zaarya-parity overrides + motion. Loaded after theme.css */
:root{--ease:cubic-bezier(.22,1,.36,1);--red-grad:linear-gradient(135deg,#d01212 0%,#b00606 55%,#8f0000 100%);--gold-grad:linear-gradient(135deg,#f6d453,#e2a812)}
body{font-family:var(--font);background-color:#fff8f5;background-image:radial-gradient(ellipse 80% 40% at 50% -8%,rgba(196,8,8,.10),transparent),radial-gradient(ellipse 60% 30% at 100% 20%,rgba(232,185,35,.12),transparent);padding-bottom:64px}
h1,h2,h3,.svc-title,.brand span{font-family:var(--font);text-transform:uppercase;letter-spacing:-.01em}
/* top bar: square tinted buttons like Zaarya */
.hbtn{width:44px;height:44px;border-radius:14px;border:1.5px solid #f0d9a0;background:#fff7e6;color:#c40808}
.hbtn-wa{background:#e9fbf3;border-color:#a8ecd0;color:#0e9f6e}
.brand img{width:34px;height:34px;border-radius:10px;background:var(--red-grad);padding:5px}
.brand span{font-size:22px;font-weight:800;color:#c40808}.brand span em{color:#e2a812}
/* service card */
.svc{border:1.5px solid #f3d6d6;border-radius:26px;background:#fff;box-shadow:0 10px 26px -18px rgba(155,0,0,.35)}
.svc-cat{background:#fdecec;color:#b00606}
.svc-ends{background:var(--red-grad);color:#fff;box-shadow:0 6px 14px -6px rgba(155,0,0,.6)}
.svc-ends b{color:#fff}
.svc-cta{background:var(--red-grad);color:#fff;border-radius:18px;box-shadow:0 12px 22px -10px rgba(176,6,6,.75);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.svc-cta:hover{transform:translateY(-2px);box-shadow:0 16px 26px -10px rgba(176,6,6,.85)}
.svc-meta{border-top:1.5px dashed #ecc9c9}.svc-meta>span{color:#4a1010}.svc-meta>span svg{color:#b00606}
.svc-meta .tg-popular{background:#f3cf4a;color:#6b3e00}.svc-meta .tg-hot{background:#f97316;color:#fff}
.svc-meta .tg-new{background:#2563eb;color:#fff}.svc-meta .tg-sale{background:#10a56b;color:#fff}
.svc-meta .tg-trending{background:#0ea5e9;color:#fff}.svc-meta .tg-premium{background:#2a0505;color:#f3cf4a;border:1px solid #8a6a10}
/* balance + add funds */
.balance{background:var(--red-grad);border-radius:26px;box-shadow:0 18px 30px -16px rgba(155,0,0,.8)}
.btn-add{background:var(--gold-grad);color:#5a3500;box-shadow:0 10px 18px -8px rgba(226,168,18,.8)}
.btn-app{background:var(--gold-grad);color:#5a3500}
.balance-chips span.hot{background:#f3cf4a;color:#5a3500}
/* flash strip: moving diagonal stripes */
.flash{background:repeating-linear-gradient(135deg,#a50000 0 22px,#c40c0c 22px 44px);background-size:62px 62px;animation:stripes 2.4s linear infinite;border-radius:20px}
@keyframes stripes{to{background-position:62px 0}}
/* marquee strip */
.marquee{background:linear-gradient(90deg,#8f0000,#d4a017 50%,#8f0000);background-size:200% 100%;animation:shimmer 6s linear infinite}
@keyframes shimmer{to{background-position:-200% 0}}
/* categories */
.cat-chip{border:1.5px solid #f3d6d6;border-radius:20px;background:#fff;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s}
.cat-chip:active{transform:scale(.94)}
.cat-chip.active{border-color:#c40808;background:#fff4f4;box-shadow:0 10px 20px -12px rgba(196,8,8,.6)}
/* bottom ticker (always visible) */
.ticker{position:fixed;left:0;right:0;bottom:0;z-index:45;height:56px;overflow:hidden;display:flex;align-items:center;max-width:28rem;margin:0 auto;color:#fff;font-weight:800;text-transform:uppercase;letter-spacing:.01em;
background:linear-gradient(90deg,#8f0000,#c40c0c 30%,#d4a017 50%,#c40c0c 70%,#8f0000);background-size:200% 100%;animation:shimmer 7s linear infinite}
.ticker-track{display:flex;gap:44px;white-space:nowrap;animation:tick 16s linear infinite;will-change:transform}
.ticker-track span{display:inline-flex;align-items:center;gap:10px;font-size:20px;text-shadow:0 2px 6px rgba(0,0,0,.25)}
@keyframes tick{to{transform:translateX(-50%)}}
/* drawer + modal polish */
#menuDrawer:not(.hidden) #menuDrawerPanel{animation:drawerIn .45s var(--ease)}
@keyframes drawerIn{from{transform:translateX(-100%)}to{transform:none}}
.modal-backdrop,#menuDrawer>div:first-child{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.menu-row:hover,.menu-row:active{background:#fdecec;color:#b00606}
.btn-gradient{background:var(--red-grad)}
/* entrance: staggered rise for cards */
.js .svc,.js .cat-chip{opacity:0;transform:translateY(18px) scale(.98)}
.js .svc.rise,.js .cat-chip.rise{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:calc(var(--i,0)*55ms)}
/* ripple */
.rip{position:absolute;border-radius:50%;pointer-events:none;background:rgba(255,255,255,.45);transform:scale(0);animation:rip .6s ease-out forwards}
@keyframes rip{to{transform:scale(1);opacity:0}}
@media (prefers-reduced-motion:reduce){.flash,.marquee,.ticker,.ticker-track{animation:none}.js .svc,.js .cat-chip{opacity:1;transform:none}}
