/* ===== dedicated mobile layer ===== */
@media(max-width:880px){
  /* never scroll sideways */
  html,body{overflow-x:clip}

  /* calm mobile motion: keep one short hero entrance, remove continuous motion */
  #loader{display:none}
  .grain,.marquee .track,.jpoint .dot::after,.scroll-hint::after,.world .float-prod{animation:none}
  .world .float-prod{transform:rotate(var(--r,0deg))}
  .marquee .track{transform:translateX(-10%)}
  .scroll-hint::after{transform:scaleY(1)}
  .giant-track{transform:translateX(-10%);will-change:auto}
  .world .visual .layer img,.world .inner,.world .bgnum{will-change:auto}
  .w-detsu .date-rain img{will-change:auto}
  .w-tora .pour,.w-mizab .mercy{display:none}
  .w-mizab .mercy-line{opacity:.82}

  /* header */
  header{min-height:64px;padding:8px 18px}
  .h-actions{gap:16px}

  /* hero: sun rises clear of the title, everything stacked + readable */
  .hero{padding:calc(64px + 14px) 20px 0}
  .meta-row{font-size:10px;letter-spacing:.04em}
  .hero-suns{width:46vw;top:7.5vh;right:-13vw}
  .hero-grid{padding-top:31vh}
  h1{font-size:clamp(3rem,14.5vw,4.6rem);letter-spacing:-.06em}
  h1 .indented{margin-left:8vw}
  .hero-sub{font-size:.82rem;letter-spacing:.1em;margin-top:2.4vh}
  .hero-cards{gap:.7rem;margin:1.6rem 0 0}
  .hero-cards figure{width:clamp(74px,22vw,96px)}
  .hero-intro{margin-top:2.4rem;gap:1.4rem;padding-bottom:10vh}
  .hero-intro p{font-size:1.02rem;max-width:100%}
  .hero-actions{flex-direction:row;flex-wrap:wrap;gap:14px;align-items:center}
  .btn{min-height:50px}
  .t-link{padding:12px 0}

  /* manifesto */
  .manifesto{padding:84px 20px}
  .manifesto h2{font-size:clamp(2.4rem,11vw,3.6rem);max-width:16ch}
  .kanji-bg{font-size:9rem;top:2%;right:-4%}
  .manifesto .cols{margin-top:2.6rem;gap:1.6rem}
  .manifesto .cols .big{font-size:1.05rem}

  /* giant scroller */
  .giant{padding:56px 0}
  .giant-track span{font-size:clamp(3rem,16vw,4.6rem)}
  .giant-track i{font-size:2.2rem}

  /* journey */
  .journey{padding:72px 20px 64px}
  .j-head{margin-bottom:2.6rem}
  .j-head h3{font-size:clamp(2.2rem,10.5vw,3.4rem)}
  .j-head p{font-size:.9rem}
  .jmap{height:56vh;min-height:380px}

  /* numbers */
  .numbers>div{padding:34px 2vw}
  .numbers .n{font-size:2.4rem}
  .numbers small{font-size:.68rem;letter-spacing:.03em;margin-top:.7rem}

  /* brand worlds: single column, copy first, composed visual */
  .world{min-height:100svh;padding:64px 20px}
  .world .bgnum{font-size:9rem;top:1vh;left:-2%}
  .world .tag{font-size:10px;letter-spacing:.2em;padding:.4rem .95rem;margin-bottom:1.4rem}
  .brand-logo{width:150px;margin-bottom:1.6rem}
  .world h3 .sub{margin-top:1rem;font-size:.62rem;letter-spacing:.32em}
  .world .desc{font-size:1rem;max-width:100%;margin-top:1.6rem}
  .world .cta{margin-top:2rem;padding:10px 0 .45rem}
  .world .visual{height:54vh;margin-top:2.2rem}

  /* TORA composition */
  .w-tora .l1{width:74%;height:64%;top:0;left:0}
  .w-tora .l2{width:56%;height:42%;bottom:0;right:0}
  .w-tora .p1{width:30%;left:4%}
  .w-tora .p2{width:24%;right:6%}

  /* DETSU composition + falling dates sized for phones */
  .w-detsu .date-rain img{max-width:46px}
  .w-detsu .l1{width:78%;height:60%;top:0;right:0}
  .w-detsu .l2{width:56%;height:38%;bottom:2%;left:0}
  .w-detsu .p1{width:28%;left:8%}
  .w-detsu .p2{width:26%;right:6%}

  /* MIZAB composition + mercy line centered */
  .w-mizab .l1{width:72%;height:64%;left:0}
  .w-mizab .l2{width:54%;height:44%}
  .w-mizab .p1{width:22%;left:4%}
  .w-mizab .p2{width:20%;right:6%}
  .w-mizab .mercy-line{left:50%;bottom:7%;font-size:.92rem}

  /* principles */
  .principles{padding:72px 20px 64px}
  .principles h2{font-size:clamp(2.2rem,10vw,3.4rem);margin-bottom:2.6rem}
  .principles article{min-height:190px;padding:14px 14px 20px}
  .principles article h4{font-size:1.15rem}

  /* contact */
  .contact{padding:56px 20px 26px}
  .contact .meta-row{font-size:9px;letter-spacing:.03em}
  .contact-main{margin-top:3rem}
  .contact-main h2{font-size:clamp(2.6rem,12.5vw,4rem)}
  .contact-link{font-size:clamp(1.3rem,6vw,2rem);padding:16px 0;margin-top:2.6rem}

  /* footer */
  footer{min-height:92px;padding:14px 20px}

  /* clean tap targets */
  .world .cta,.t-link,.h-contact,.contact-link,.btn{-webkit-tap-highlight-color:transparent}
}