/* Premium hero motion layer — visual enhancement only */
.heros-banner {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.heros-banner::before,
.heros-banner::after {
  content: "";
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  pointer-events: none;
}

.heros-banner::before {
  top: -210px;
  right: -130px;
  width: 520px;
  height: 520px;
  background: radial-gradient(circle, rgba(198,147,113,.22), rgba(175,127,96,.05) 55%, transparent 72%);
  animation: heroGlowDrift 9s ease-in-out infinite alternate;
}

.heros-banner::after {
  bottom: 20px;
  left: -170px;
  width: 400px;
  height: 400px;
  border: 1px solid rgba(175,127,96,.13);
  background: radial-gradient(circle, rgba(255,255,255,.09), transparent 67%);
  animation: heroOrbDrift 12s ease-in-out infinite alternate;
}

.heros-banner > .container > .row {
  position: relative;
  z-index: 2;
  align-items: center;
}

.heros-hading h1 {
  animation: heroContentReveal .8s cubic-bezier(.2,.8,.2,1) both;
}

.heros-hading > p {
  animation: heroContentReveal .8s .12s cubic-bezier(.2,.8,.2,1) both;
}

.heros-hading .stats {
  animation: heroContentReveal .8s .24s cubic-bezier(.2,.8,.2,1) both;
}

.heros-hading .stat {
  position: relative;
  transition: transform .3s ease, filter .3s ease;
}

.heros-hading .stat:hover {
  z-index: 2;
  transform: translateY(-6px) scale(1.035);
  filter: drop-shadow(0 10px 16px rgba(70,45,33,.14));
}

.hero-book-stage {
  --hero-rx: 2deg;
  --hero-ry: -7deg;
  --hero-mx: 50%;
  --hero-my: 50%;
  position: relative;
  z-index: 2;
  display: grid;
  min-height: 540px;
  place-items: center;
  perspective: 1200px;
  transform-style: preserve-3d;
  animation: heroStageReveal 1s .14s cubic-bezier(.2,.8,.2,1) both;
}

.hero-book-stage::before {
  content: "";
  position: absolute;
  inset: 3% 0 2%;
  z-index: -2;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 42px;
  background:
    radial-gradient(circle at var(--hero-mx) var(--hero-my), rgba(255,255,255,.38), transparent 25%),
    radial-gradient(circle at 55% 42%, rgba(223,174,139,.46), rgba(95,53,35,.16) 52%, rgba(36,20,14,.08) 72%);
  box-shadow: inset 0 0 70px rgba(255,255,255,.14), 0 35px 80px rgba(38,22,15,.24);
  backdrop-filter: blur(5px);
  transform: translateZ(-45px) rotate(-3deg);
  animation: heroHaloPulse 5s ease-in-out infinite;
}

.hero-book-stage::after {
  content: "";
  position: absolute;
  right: 9%;
  bottom: 7%;
  left: 10%;
  z-index: -1;
  height: 17%;
  border-radius: 50%;
  background: rgba(42,27,19,.33);
  filter: blur(25px);
  opacity: .65;
  transform: translateZ(-60px) rotate(-2deg);
  animation: heroShadowBreathe 4.8s ease-in-out infinite;
}

.hero-book-stage img {
  position: relative;
  z-index: 2;
  width: min(108%, 720px);
  max-height: 590px;
  object-fit: contain;
  will-change: transform, filter;
  filter: drop-shadow(0 20px 14px rgba(23,12,8,.30)) drop-shadow(0 48px 40px rgba(25,13,8,.36));
  transform: rotateX(var(--hero-rx)) rotateY(var(--hero-ry)) translate3d(0,0,34px);
  transform-style: preserve-3d;
  transition: transform .18s ease-out, filter .35s ease;
  animation: heroBooksFloat 5.2s ease-in-out infinite;
}

.hero-orbit {
  position: absolute;
  z-index: 1;
  border: 1px solid rgba(235,197,171,.65);
  border-radius: 50%;
  pointer-events: none;
  transform-style: preserve-3d;
}

.hero-orbit-one {
  width: 91%;
  height: 40%;
  transform: rotateX(68deg) rotateZ(-10deg) translateZ(8px);
  box-shadow: 0 0 28px rgba(218,166,129,.24);
  animation: heroOrbitSpin 12s linear infinite;
}

.hero-orbit-two {
  width: 72%;
  height: 72%;
  border-color: rgba(255,255,255,.34);
  transform: rotateY(68deg) rotateZ(14deg) translateZ(-12px);
  animation: heroOrbitSpinReverse 15s linear infinite;
}

.hero-spark {
  position: absolute;
  z-index: 3;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #f4d4bd;
  box-shadow: 0 0 0 7px rgba(244,212,189,.10), 0 0 24px #f4c9aa;
  pointer-events: none;
  animation: heroSparkPulse 2.8s ease-in-out infinite;
}

.hero-spark-one {
  top: 13%;
  right: 8%;
}

.hero-spark-two {
  bottom: 20%;
  left: 5%;
  width: 8px;
  height: 8px;
  animation-delay: -1.2s;
}

.hero-book-stage:hover img {
  filter: drop-shadow(0 24px 18px rgba(46,28,20,.22)) drop-shadow(0 48px 42px rgba(46,28,20,.28));
}

.heros-banner .formbanners {
  position: relative;
  z-index: 5;
  animation: heroFormReveal .85s .38s cubic-bezier(.2,.8,.2,1) both;
}

.heros-banner .formbanners form {
  transition: transform .35s ease, box-shadow .35s ease;
}

.heros-banner .formbanners form:hover {
  transform: translateY(-5px);
  box-shadow: 0 24px 55px rgba(55,34,24,.15);
}

@keyframes heroContentReveal {
  from { opacity: 0; transform: translate3d(-28px,22px,0); }
  to { opacity: 1; transform: translate3d(0,0,0); }
}

@keyframes heroStageReveal {
  from { opacity: 0; transform: translate3d(34px,20px,0) scale(.94); }
  to { opacity: 1; transform: translate3d(0,0,0) scale(1); }
}

@keyframes heroFormReveal {
  from { opacity: 0; transform: translateY(25px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes heroBooksFloat {
  0%, 100% { transform: rotateX(var(--hero-rx)) rotateY(var(--hero-ry)) translate3d(0,0,34px); }
  50% { transform: rotateX(var(--hero-rx)) rotateY(var(--hero-ry)) translate3d(0,-13px,48px); }
}

@keyframes heroHaloPulse {
  0%, 100% { opacity: .82; transform: translateZ(-45px) rotate(-3deg) scale(.98); }
  50% { opacity: 1; transform: translateZ(-45px) rotate(1deg) scale(1.025); }
}

@keyframes heroOrbitSpin {
  to { transform: rotateX(68deg) rotateZ(350deg) translateZ(8px); }
}

@keyframes heroOrbitSpinReverse {
  to { transform: rotateY(68deg) rotateZ(-346deg) translateZ(-12px); }
}

@keyframes heroSparkPulse {
  0%, 100% { opacity: .45; transform: scale(.75); }
  50% { opacity: 1; transform: scale(1.25); }
}

@keyframes heroShadowBreathe {
  0%, 100% { opacity: .55; transform: translateZ(-60px) scale(.92); }
  50% { opacity: .72; transform: translateZ(-60px) scale(1.04); }
}

@keyframes heroGlowDrift {
  from { transform: translate3d(0,0,0) scale(.96); }
  to { transform: translate3d(-35px,35px,0) scale(1.07); }
}

@keyframes heroOrbDrift {
  from { transform: translate3d(0,0,0); }
  to { transform: translate3d(45px,-30px,0); }
}

@media (max-width: 991.98px) {
  .hero-book-stage { min-height: 430px; }
}

@media (max-width: 767.98px) {
  .hero-book-stage {
    min-height: 350px;
    margin-top: 18px;
    perspective: 800px;
  }

  .hero-book-stage::before { inset: 5% 3% 5%; }
  .hero-book-stage img { max-height: 390px; }
  .hero-orbit { opacity: .55; }

  .heros-hading .stat:hover,
  .heros-banner .formbanners form:hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .heros-banner::before,
  .heros-banner::after,
  .heros-hading h1,
  .heros-hading > p,
  .heros-hading .stats,
  .hero-book-stage,
  .hero-book-stage::before,
  .hero-book-stage::after,
  .hero-book-stage img,
  .hero-orbit,
  .hero-spark,
  .heros-banner .formbanners {
    animation: none !important;
  }

  .hero-book-stage img {
    transform: translateZ(0);
    transition: none;
  }
}