:root{
  --paper:#f7f6f1;
  --max:1024px;
}
*{box-sizing:border-box}
html{
  scroll-behavior:smooth;
  overflow-y:auto;
}
body{
  margin:0;
  min-height:100vh;
  overflow-x:hidden;
  background:var(--paper);
}
img{
  display:block;
  max-width:100%;
}
.page{
  width:min(100%,var(--max));
  margin-inline:auto;
  background:var(--paper);
}
.slice{
  position:relative;
  width:100%;
}
.slice-image{
  display:block;
  width:100%;
  height:auto;
  pointer-events:none;
  user-select:none;
}

/* ---------------- Mini AIRA: unchanged LOCKED behaviour ---------------- */
.hero-nav{
  position:absolute;
  inset:0;
  z-index:20;
  pointer-events:none;
}
.nav-label{
  position:absolute;
  top:5.1%;
  pointer-events:auto;
  text-decoration:none;
  color:#172836;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(12px,1.45vw,17px);
  line-height:1;
}
.nav-label.projects{left:62.0%}
.nav-label.studio{left:68.6%}
.nav-label.contacts{left:74.9%}

.nav-aira{
  position:absolute;
  z-index:25;
  top:.5%;
  left:64.4%;
  width:3.25%;
  min-width:25px;
  transform:translateX(-50%);
  pointer-events:none;
  transition:left .78s cubic-bezier(.22,.83,.3,1),top .78s cubic-bezier(.22,.83,.3,1);
}
.nav-aira img{
  width:100%;
  height:auto;
  transform-origin:center bottom;
}
.nav-aira.hop img{animation:airaHop .78s ease}
.nav-aira.pose-projects img{transform:rotate(-12deg) scale(.94)}
.nav-aira.pose-studio img{transform:translateY(2px) rotate(2deg) scale(.86)}
.nav-aira.pose-contacts img{transform:scaleX(-1) rotate(10deg) scale(.91)}

@keyframes airaHop{
  0%,100%{transform:translateY(0) rotate(0) scale(.90)}
  38%{transform:translateY(-19px) rotate(-8deg) scale(.86)}
  72%{transform:translateY(-3px) rotate(6deg) scale(.94)}
}

/* ---------------- EXPLORE · COLOR · RELAX ----------------
   One line only, integrated over the cleaned artwork.
   Width is matched to the text block above. */
.intro-explore-line{
  position:absolute;
  left:8.8%;
  bottom:6.0%;
  width:46.2%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#40576a;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(11px,1.18vw,16px);
  line-height:1;
  letter-spacing:.30em;
  white-space:nowrap;
  pointer-events:none;
}
.intro-explore-line .sep{
  letter-spacing:0;
  opacity:.85;
}

/* Standard static section flow. */
.coming-stage,
.mountain-stage{
  position:relative;
  width:100%;
  overflow:hidden;
}

/* Footer remains unchanged. */
.footer-hit{
  position:absolute;
  z-index:10;
  top:24%;
  height:46%;
}
.footer-hit.privacy{left:71%;width:5.6%}
.footer-hit.credits{left:78%;width:5.6%}
.footer-hit.instagram{left:87%;width:3.1%}
.footer-hit.youtube{left:93%;width:3.2%}

/* Mobile keeps the locked composition but adds breathing room,
   which also guarantees genuine vertical scroll. */
@media(max-width:760px){
  .hero .slice-image{
    width:118%;
    max-width:none;
    margin-left:-9%;
  }
  .intro{
    margin-top:5vh;
  }
  .intro .slice-image{
    width:110%;
    max-width:none;
    margin-left:-5%;
  }
  .intro-explore-line{
    left:8.5%;
    bottom:5.7%;
    width:49%;
    font-size:10px;
    letter-spacing:.22em;
  }
  .footer{
    margin-top:5vh;
  }
  .footer .slice-image{
    width:115%;
    max-width:none;
    margin-left:-7.5%;
  }
  .nav-label{font-size:clamp(8px,2.1vw,12px);top:5.0%}
  .nav-aira{
    width:4.2%;
    min-width:20px;
  }
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .nav-aira img{animation:none!important}
}