/* Miboooo shared styles */
html { scroll-behavior: smooth; }
body { background: #FFF7EA; }

.paper-grid {
  background-image:
    linear-gradient(rgba(74,59,50,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(74,59,50,.045) 1px, transparent 1px);
  background-size: 28px 28px;
}

.hero-glow {
  background:
    radial-gradient(600px 420px at 12% 18%, rgba(249,168,192,.28), transparent 65%),
    radial-gradient(560px 420px at 88% 12%, rgba(247,208,107,.25), transparent 65%),
    radial-gradient(640px 480px at 70% 85%, rgba(185,220,201,.22), transparent 65%);
}

.sticker-border { border: 3px solid #fff; box-shadow: 0 8px 20px rgba(74,59,50,.15); }

.float-slow { animation: floaty 6s ease-in-out infinite; }
.float-slower { animation: floaty 8s ease-in-out infinite reverse; }
@keyframes floaty { 0%,100% { transform: translateY(0) rotate(var(--r,0deg)); } 50% { transform: translateY(-10px) rotate(var(--r,0deg)); } }

.btn-pop { transition: transform .12s ease, box-shadow .12s ease; }
.btn-pop:hover { transform: translate(-1px,-2px); box-shadow: 0 5px 0 rgba(74,59,50,.9); }
.btn-pop:active { transform: translate(0,1px); box-shadow: 0 2px 0 rgba(74,59,50,.9); }

.hero-video-mask { border-radius: 2rem; overflow: hidden; border: 3px solid #fff; box-shadow: 0 18px 44px rgba(74,59,50,.18); }

details.faq summary::-webkit-details-marker { display: none; }
details.faq summary { cursor: pointer; list-style: none; }