/* ============================================================
   HERO — split layout + 3D book constellation
   ============================================================ */

/* split the hero into title (right) + constellation (left) */
.hero--split .hero__grid{
  position:relative; z-index:3; height:100%;
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  align-items:center; gap:clamp(20px,4vw,64px);
}
.hero__copy{ display:flex; flex-direction:column; }
/* title a touch smaller now that it shares the stage */
.hero--split h1{ font-size:clamp(2.4rem,5.6vw,5.4rem); line-height:.96; }
.hero--split .hero__sub{ margin-top:1.5rem; }

/* ---------------- Constellation stage ---------------- */
.constel{
  position:relative; width:100%; height:min(78vh,720px);
  perspective:1300px; perspective-origin:50% 45%;
}
.constel__lines{ position:absolute; inset:0; z-index:1; pointer-events:none; display:none; }
.constel__space{
  position:absolute; inset:0; z-index:2;
  transform-style:preserve-3d;
  transform:translateZ(0);
  will-change:transform;
}
/* each cover sits at the centre then is pushed into 3D by JS (inline transform) */
.cover{
  position:absolute; top:50%; left:50%; width:var(--cw,150px);
  margin-left:calc(var(--cw,150px) / -2);
  transform-style:preserve-3d;
  will-change:transform;
  cursor:pointer;
}
.cover img{
  display:block; width:100%; height:auto;
  filter:drop-shadow(0 24px 30px rgba(0,0,0,.55));
  /* no reflection beneath the covers — show the book only */
  animation:coverFloat var(--fdur,7s) var(--ease,ease-in-out) var(--fdelay,0s) infinite;
  transition:filter .4s;
}
@keyframes coverFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-7px); }
}
/* gentle highlight on the cover the cursor is nearest (set by JS) */
.cover.is-near img{ filter:drop-shadow(0 28px 40px rgba(201,162,75,.4)); }

/* hero CTA + footer tagline */
.hero__cta{ margin-top:1.9rem; }
.ftr__tagline{ font-family:var(--sans); font-weight:400; color:var(--gold); }

/* ---------------- Responsive ---------------- */
@media(max-width:920px){
  .hero{ height:auto; min-height:auto; }
  .hero--split .hero__grid{
    grid-template-columns:1fr; gap:6px; min-height:100vh;
    padding-block:78px 40px; align-content:center;
  }
  /* books FIRST, title below */
  .constel{ order:1; height:min(46vh,400px); margin-bottom:8px; }
  .hero__copy{ order:2; text-align:center; align-items:center; }
  .hero__kick{ justify-content:center; }
  .hero--split h1{ font-size:clamp(2.1rem,8.5vw,3.4rem); }
  .hero--split .hero__sub{ margin-inline:auto; }
  .hero__cta{ margin-top:1.3rem; }
  .hero__bottom{ display:none; }   /* hide scroll cue on small screens */
}
@media(max-width:480px){
  .constel{ height:min(40vh,320px); }
  .hero--split .hero__grid{ padding-block:70px 32px; }
}
@media (prefers-reduced-motion:reduce){
  .cover img{ animation:none; }
}