:root{
  --radius-xl:1.25rem; --ring:rgba(255,255,255,0.10);
  --fs-h1:clamp(2rem,4.5vw,3.5rem);
  --fs-h2:clamp(1.5rem,3vw,2.25rem);
  --fs-h3:clamp(1.125rem,2vw,1.375rem);
  --fs-lead:clamp(1rem,1.2vw,1.125rem);
  --lh-tight:1.15; --lh-normal:1.5;
}
html{scroll-behavior:smooth}
.hero-title{
  font-size:clamp(1.6rem,3vw,2.3rem);
  line-height:var(--lh-tight);
  font-weight:800;
  letter-spacing:-.02em;
}

/* Brand block in hero */
.casino-hero-brand{
  display:flex;
  align-items:center;
  gap:0.75rem;
  margin-bottom:1.5rem;
}

.casino-hero-logo{
  width:3.5rem;
  height:3.5rem;
  border-radius:9999px;
  border:1px solid rgba(255,255,255,0.14);
  box-shadow:0 16px 40px rgba(15,23,42,0.9);
}

.casino-hero-name{
  font-size:clamp(2.1rem,3.9vw,3rem);
  font-weight:800;
  line-height:1.05;
  letter-spacing:-0.03em;
  color:#fff;
}
.lead{font-size:var(--fs-lead);line-height:var(--lh-normal);color:rgba(255,255,255,.82);max-width:42rem}
.h2{font-size:var(--fs-h2);font-weight:800;line-height:1.2;letter-spacing:-.01em}
.h3{font-size:var(--fs-h3);font-weight:800;line-height:1.25}
.h4{font-weight:800;font-size:1.05rem;line-height:1.25}
.muted{color:rgba(255,255,255,.78)}

/* Buttons */
.premium-btn,.soft-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:44px;padding:.9rem 1.1rem;border-radius:1rem;font-size:1rem;line-height:1.2;white-space:nowrap;font-weight:700;}
.premium-btn{color:#0f172a;background-image:linear-gradient(90deg,#fb7185,#fbbf24);box-shadow:0 12px 40px rgba(251,113,133,.35);transition:transform .2s ease,box-shadow .2s ease}
.premium-btn.big{padding:1.05rem 1.25rem;border-radius:1.1rem}
.premium-btn:hover{transform:translateY(-1px);box-shadow:0 14px 46px rgba(251,113,133,.42)}
.premium-btn:active{transform:translateY(0) scale(.99)}
.premium-btn .shine{position:absolute;inset:0;background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.35) 20%,transparent 40%);transform:translateX(-120%);transition:transform .8s ease;border-radius:inherit;pointer-events:none}
.premium-btn:hover .shine{transform:translateX(120%)}
.premium-btn.attention{animation:pulse-btn 1.8s infinite}
@keyframes pulse-btn{0%{box-shadow:0 0 0 0 rgba(251,113,133,.6)}70%{box-shadow:0 0 0 15px rgba(251,113,133,0)}100%{box-shadow:0 0 0 0 rgba(251,113,133,0)}}
.soft-btn{font-weight:700;color:white;border:1px solid var(--ring);background:rgba(255,255,255,.06);backdrop-filter:blur(6px)}

/* Cards */
.glass-tile,.feature-card{border-radius:var(--radius-xl);padding:1.15rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(6px)}
.feature-card p{color:rgba(255,255,255,.78)}

/* Appear */
.will-animate{opacity:0;transform:translateY(12px)}
.will-animate.is-visible{opacity:1;transform:none;transition:opacity .6s ease,transform .6s ease}
.will-animate.delay-100{transition-delay:.1s}.will-animate.delay-200{transition-delay:.2s}.will-animate.delay-300{transition-delay:.3s}.will-animate.delay-400{transition-delay:.4s}
.logo-float{animation:float 4s ease-in-out infinite}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-4px)}100%{transform:translateY(0)}}
.dot-ping{height:.5rem;width:.5rem;border-radius:9999px;background:#34d399;box-shadow:0 0 0 0 rgba(52,211,153,.7);animation:ping 2s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(52,211,153,.7)}70%{box-shadow:0 0 0 12px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}

/* Header shadow */
#site-header.header-shadow{box-shadow:0 6px 30px rgba(0,0,0,.25)}

/* Grid overlay */
.pointer-grid{position:absolute;inset:0;background:
radial-gradient(circle at 20% 30%,rgba(255,255,255,.08) 0 1px,transparent 1px) 0 0/40px 40px,
radial-gradient(circle at 60% 70%,rgba(255,255,255,.06) 0 1px,transparent 1px) 0 0/48px 48px;opacity:.25;pointer-events:none}


.hero-card{
  aspect-ratio:16/9;
}

.hero-variant-1 .hero-card,
.hero-variant-3 .hero-card,
.hero-variant-5 .hero-card,
.hero-variant-7 .hero-card,
.hero-variant-9 .hero-card{
  background:rgba(15,23,42,0.72);
}

.hero-variant-2 .hero-card,
.hero-variant-4 .hero-card,
.hero-variant-6 .hero-card,
.hero-variant-8 .hero-card,
.hero-variant-10 .hero-card{
  background:rgba(15,23,42,0.9);
}


@media (min-width:1024px){
  .hero-card{
    aspect-ratio:1/1;
  }
}
.hero-card-link{
  display:block;
  width:100%;
  height:100%;
  text-decoration:none;
  color:inherit;
}

/* Media slot */
.media-slot,.media-slot>img,.media-slot>video{display:block;width:100%;height:100%;object-fit:cover}
@media (min-width:640px){.media-slot,.media-slot>img,.media-slot>video{height:100%}}

/* Sticky mobile CTA */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;padding:calc(env(safe-area-inset-bottom) + .75rem) .75rem .75rem;background:linear-gradient(180deg,rgba(2,6,23,0),rgba(2,6,23,.85) 30%,rgba(2,6,23,.95));backdrop-filter:blur(6px);border-top:1px solid rgba(255,255,255,.08);z-index:60}

/* Deal Timer */
.deal-timer{margin-top:1rem;display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}
.deal-timer .badge{display:inline-flex;align-items:center;gap:.4rem;background:rgba(251,113,133,.1);border:1px solid rgba(251,113,133,.35);padding:.35rem .6rem;border-radius:.75rem;font-weight:800;color:#fecaca}
.deal-timer .digits{font-variant-numeric:tabular-nums;letter-spacing:.04em;font-weight:800;font-size:clamp(1.35rem,3.4vw,1.8rem);padding:.2rem .6rem;border-radius:.75rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);box-shadow:0 6px 26px rgba(251,113,133,.18)}
.deal-timer .sub{opacity:.75}

/* PUSH popup */
.push{position:fixed;right:1rem;bottom:1rem;z-index:70;display:grid;grid-template-columns:auto 1fr;gap:.9rem;align-items:center;padding:.9rem;border-radius:1rem;background:rgba(2,6,23,.96);border:1px solid rgba(255,255,255,.08);box-shadow:0 20px 60px rgba(0,0,0,.45);transform:translateY(24px);opacity:0;pointer-events:none;transition:transform .45s cubic-bezier(.22,1,.36,1),opacity .45s}
.push.show{transform:translateY(0);opacity:1;pointer-events:auto}
.push .push-img{width:72px;height:72px;border-radius:.9rem;object-fit:cover;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04)}
.push .push-close{position:absolute;top:.4rem;right:.55rem;width:28px;height:28px;border-radius:9999px;display:grid;place-items:center;color:#fff9;backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.12)}
.push .push-body h3{font-weight:800;margin:0 0 .25rem}
.push .push-body p{margin:0 0 .6rem;color:#cbd5e1}
@media (max-width:640px){
  .push{left:.75rem;right:.75rem;grid-template-columns:1fr;justify-items:center;text-align:center}
  .push .push-img{width:96px;height:96px}
}


.push.push-full{
  inset:0;
  right:auto;
  bottom:auto;
  left:0;
  top:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:1.5rem;
  background:radial-gradient(circle at top, rgba(248,250,252,0.06), transparent 55%), rgba(15,23,42,0.96);
  backdrop-filter:blur(18px);
}
.push.push-full .push-body{
  max-width:32rem;
  text-align:center;
}
.push.push-full .push-img{
  display:none;
}
/* Reduce motion */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .logo-float{animation:none}
  .will-animate,.will-animate.is-visible{transition:none!important;opacity:1!important;transform:none!important}
  .premium-btn .shine{display:none}
  .premium-btn.attention{animation:none}
}


.scroll-hint{
  position:fixed;
  left:50%;
  bottom:2.4rem;
  transform:translateX(-50%);
  z-index:60;
  display:inline-flex;
  align-items:center;
  gap:.7rem;
  padding:.8rem 1.4rem;
  border-radius:999px;
  background:rgba(239,68,68,0.97);
  color:#f9fafb;
  font-size:.9rem;
  font-weight:700;
  border:1px solid rgba(248,250,252,0.7);
  box-shadow:0 0 22px rgba(248,113,113,0.9), 0 22px 45px rgba(0,0,0,0.85);
  opacity:1;
  transition:opacity .3s ease, transform .3s ease;
  pointer-events:none;
  animation:scroll-hint-glow 1.6s infinite ease-in-out;
}


.scroll-hint-icon{
  width:2.2rem;
  height:2.2rem;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:2px solid rgba(248,250,252,0.9);
  background:rgba(127,29,29,0.95);
  font-size:1.3rem;
  line-height:1;
  animation:scroll-hint-bounce 1.1s infinite;
}


.scroll-hint-text{
  display:block;
  white-space:normal;
  line-height:1.15;
  text-align:center;  /* <-- это выравнивает обе строки по центру */
  white-space:nowrap;
}

.scroll-hint--hidden{
  opacity:0;
  transform:translateX(-50%) translateY(10px);
}

