.vkids-hero.vkids-hero-with-mascots { padding:0 0 clamp(18px, 3vw, 32px); overflow:hidden; }
.vkids-hero-with-mascots .vkids-mascot-scene {
  position:relative; isolation:isolate; width:100%; margin:0 0 clamp(15px, 3vw, 26px);
  border-radius:inherit; overflow:hidden; background:#8b5cf6;
}
.vkids-hero-with-mascots .vkids-mascot-scene img {
  display:block; width:100%; max-width:none; height:auto; margin:0; border-radius:0;
}
.vkids-hero-with-mascots > :is(p, a) { margin-inline:clamp(16px, 4vw, 48px); }
.vkids-spark {
  position:absolute; color:#ffe16a; font-size:clamp(11px, 2.25vw, 30px);
  line-height:1; pointer-events:none; opacity:0;
}
.vkids-spark-rocket { left:85%; top:24%; }
.vkids-spark-star { left:92%; top:45%; }
.vkids-spark-book { left:60%; top:72%; }
@media (prefers-reduced-motion:no-preference) {
  .vkids-mascot-scene img { animation:vkids-mascots-enter 850ms ease-out both; }
  .vkids-spark { animation:vkids-spark-rise 950ms 2 both; }
  .vkids-spark-rocket { animation-delay:300ms; }
  .vkids-spark-star { animation-delay:600ms; }
  .vkids-spark-book { animation-delay:900ms; }
  @keyframes vkids-mascots-enter {
    from { transform:translateY(2%) scale(.985); opacity:.72; }
    to { transform:none; opacity:1; }
  }
  @keyframes vkids-spark-rise {
    0%, 100% { opacity:0; transform:translateY(5px) scale(.65); }
    48% { opacity:1; transform:translateY(-9px) scale(1.15); }
  }
}

.vkids-hero-links {
  display:flex; flex-wrap:wrap; gap:12px 24px;
  margin-inline:clamp(16px, 4vw, 48px);
}
.vkids-hero-links a { font-weight:700; text-underline-offset:4px; }
.vkids-colla {
  margin-block:clamp(30px, 5vw, 64px);
  padding:clamp(16px, 4vw, 38px);
  border-radius:24px;
  background:#f2eaff;
  color:#28134b;
}
.vkids-colla .vkids-colla-kicker {
  margin:0 0 6px; color:#6236ac; font-weight:700;
}
.vkids-colla h2 { margin:0 0 22px; font-size:clamp(28px, 4vw, 44px); line-height:1.1; }
.vkids-colla-grid { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:clamp(12px, 2vw, 20px); }
.vkids-character {
  min-width:0; background:#fff; border-radius:18px; overflow:hidden;
  border:1px solid #e3d7f4;
}
.vkids-character-gina { --portrait-color:#f8d56e; }
.vkids-character-aura { --portrait-color:#f8b8d8; }
.vkids-character-manel { --portrait-color:#ffc187; }
.vkids-character-ot { --portrait-color:#aac7ff; }
.vkids-portrait {
  aspect-ratio:2 / 3; overflow:hidden;
  background:radial-gradient(ellipse at center, var(--portrait-color), #291b3d 85%);
}
body.viu-public.vkids-page .vkids-portrait img {
  display:block; width:100% !important; height:100% !important;
  max-width:none !important; max-height:none !important;
  object-fit:contain !important; object-position:center !important;
}
.vkids-character-copy { padding:clamp(12px, 2vw, 20px); }
.vkids-character h3 { font-size:clamp(22px, 3vw, 30px); line-height:1.1; margin:0 0 10px; }
.vkids-character h3 span { display:block; margin-top:5px; font-size:.58em; color:#6236ac; }
.vkids-character p { font-size:1rem; line-height:1.5; margin:0; }
@media (max-width:800px) { .vkids-colla-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:350px) { .vkids-colla-grid { grid-template-columns:minmax(0,1fr); } }
