/* kurasuhub — Runway Editorial 2026 mobile */
@media (max-width:768px){
  .br-drawer{
    display:flex!important;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateX(10%);
    background:
      radial-gradient(ellipse 80% 50% at 10% 0%,rgba(139,21,56,.35),transparent 55%),
      rgba(10,10,10,.98);
    padding-top:calc(var(--nav-h) + env(safe-area-inset-top,0px) + 1.25rem);
    padding-bottom:calc(var(--pad) + env(safe-area-inset-bottom,0px));
    padding-left:max(var(--pad),env(safe-area-inset-left,0px));
    padding-right:max(var(--pad),env(safe-area-inset-right,0px));
    transition:opacity .42s var(--ease),visibility .42s,transform .48s var(--ease);
  }
  .br-drawer[hidden]{display:flex!important}
  .br-drawer.is-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
  }
  .br-drawer a{
    opacity:0;
    transform:translateY(26px);
    transition:opacity .5s var(--ease),transform .5s var(--ease),color .25s,padding-left .4s var(--ease);
  }
  .br-drawer.is-open a{opacity:1;transform:none}
  .br-drawer.is-open a:nth-child(1){transition-delay:.08s}
  .br-drawer.is-open a:nth-child(2){transition-delay:.14s}
  .br-drawer.is-open a:nth-child(3){transition-delay:.2s}
  .br-drawer.is-open a:nth-child(4){transition-delay:.26s}
  .br-drawer.is-open a:nth-child(5){transition-delay:.32s}
  .br-drawer.is-open a:nth-child(6){transition-delay:.38s}
  .br-drawer a[aria-current="page"]{color:var(--br-gold)}
  .br-drawer__cta{
    color:var(--br-ink)!important;
    background:var(--br-gold);
    border-bottom:0;
    margin-top:.85rem;
    justify-content:center;
    padding:.9rem 1rem;
    letter-spacing:.18em;
    font-family:var(--font-ui);
    font-size:.82rem;
    font-weight:700;
    text-transform:uppercase;
    box-shadow:0 6px 24px rgba(212,175,55,.3);
  }
  .br-drawer__meta{
    margin-top:1.5rem;
    opacity:0;
    transform:translateY(12px);
    transition:opacity .45s var(--ease) .42s,transform .45s var(--ease) .42s;
  }
  .br-drawer.is-open .br-drawer__meta{opacity:.7;transform:none}

  .br-nav{padding-top:calc(.65rem + env(safe-area-inset-top,0px));z-index:90}
  .br-burger{border-radius:0}

  .js [data-br] img,.js [data-br-clip] img{
    transform:scale(1.06);
    filter:saturate(.9);
    transition:transform 1.15s var(--ease),filter .85s ease;
  }
  .js [data-br].in img,.js [data-br-clip].in img{transform:scale(1);filter:none}

  .br-hero__center .br-hero__brand,
  .br-hero__center h1,
  .br-hero__center .br-hero__lead,
  .br-hero__center .br-hero__actions{animation:brRise .88s var(--ease) both}
  .br-hero__center h1{animation-delay:.1s}
  .br-hero__center .br-hero__lead{animation-delay:.18s}
  .br-hero__center .br-hero__actions{animation-delay:.28s}
  .br-hero__copy h2,.br-hero__copy p,.br-hero__copy .br-btn{animation:brRise .82s var(--ease) both}
  .br-hero__copy p{animation-delay:.12s}
  .br-hero__copy .br-btn{animation-delay:.22s}

  .br-btn:active,.br-link:active{transform:scale(.97)}
  .br-hero .br-btn,.br-cta .br-btn,.br-store .br-btn{width:100%}

  .br-hero__pane,.br-intro__media,.br-style__media,.br-spot__media,.br-spot__thumb,
  .br-dual__pane,.br-mosaic__cell,.br-film__frame,.br-card__media,.br-crop,.br-note__media,
  .br-faq__media,.br-season__media,.br-store,.br-cta,.br-categories__media{background:var(--br-ink-lift)}
  .br-store,.br-cta{min-height:62svh}
  .br-intro__media,.br-style__media,.br-spot__media,.br-faq__media{
    aspect-ratio:4/3;min-height:180px;max-height:none;overflow:hidden;
  }
  .br-dual__media,.br-mosaic__cell,.br-film__frame,.br-card__media,.br-crop,.br-note__media,.br-season__media,.br-spot__thumb,.br-categories__media{min-height:170px;overflow:hidden}
  .br-intro__media img,.br-style__media img,.br-spot__media img,.br-faq__media img,
  .br-dual__media img,.br-mosaic__cell img,.br-film__frame img,.br-card__media img,
  .br-crop img,.br-note__media img,.br-season__media img,.br-spot__thumb img,.br-categories__media img,
  .br-store__media img,.br-cta__media img{width:100%;height:100%;object-fit:cover}
  body.is-nav-open{overflow:hidden;touch-action:none}

  .br-hero--page .br-hero__center .br-hero__brand,
  .br-hero--page .br-hero__center h1,
  .br-hero--page .br-hero__center .br-hero__lead{animation:brRise .85s var(--ease) both}
  .br-hero--page .br-hero__center h1{animation-delay:.1s}
  .br-hero--page .br-hero__center .br-hero__lead{animation-delay:.18s}

  .br-intro,.br-split,.br-style,.br-spot,.br-faq,.br-feature,.br-map,.br-dual,.br-mosaic,.br-contact{gap:0}
  .br-intro__copy,.br-split__copy,.br-style__copy,.br-spot__copy{padding:1.75rem var(--pad) 2rem}
  .br-process,.br-arrivals,.br-notes,.br-team,.br-time,.br-price,.br-social,.br-fabric,.br-season,.br-topics,.br-voices,.br-categories{
    padding-left:max(var(--pad),env(safe-area-inset-left,0px));
    padding-right:max(var(--pad),env(safe-area-inset-right,0px));
  }

  .br-contact{grid-template-columns:1fr;min-height:auto}
  .br-contact__form-wrap{order:1;border-right:0;border-bottom:1px solid var(--br-line);padding:1.75rem max(var(--pad),env(safe-area-inset-left,0px)) 2rem max(var(--pad),env(safe-area-inset-right,0px))}
  .br-contact__aside{order:2;padding:1.75rem max(var(--pad),env(safe-area-inset-left,0px)) 2.25rem max(var(--pad),env(safe-area-inset-right,0px))}
  .br-form{max-width:none;gap:1.1rem}
  .br-form input,.br-form textarea{font-size:16px;padding:.9rem .2rem}
  .br-form .br-btn--gold{width:100%;min-width:0;justify-content:center;min-height:48px}
  .br-contact__shot{aspect-ratio:16/10;min-height:180px;margin-bottom:1.25rem}

  .br-foot{padding:2rem max(var(--pad),env(safe-area-inset-left,0px)) calc(1.5rem + env(safe-area-inset-bottom,0px)) max(var(--pad),env(safe-area-inset-right,0px))}
  .br-foot__split{font-size:.6rem;letter-spacing:.3em;margin-bottom:1.35rem}
  .br-foot__grid{gap:1.35rem}
  .br-foot__brand{font-size:1.5rem}
  .br-foot a{min-height:40px}
  .br-foot__copy{margin-top:1.4rem;font-size:.72rem}

  .br-feature__media,.br-split__media,.br-map__frame,.br-contact__shot,.br-team__media,.br-voices__face{
    aspect-ratio:16/10;min-height:180px;max-height:none;overflow:hidden;
    box-shadow:0 12px 32px rgba(0,0,0,.28);
  }
  .br-card__media,.br-note__media{min-height:200px;box-shadow:0 10px 28px rgba(0,0,0,.26)}
  .br-film__frame{flex:0 0 min(78vw,300px);min-height:220px;box-shadow:0 12px 36px rgba(0,0,0,.3)}
  .br-crop,.br-season__media,.br-spot__thumb,.br-categories__media{min-height:150px;overflow:hidden}
  .br-card:hover,.br-note:hover,.br-film__frame:hover,.br-categories__cell:hover{transform:none}
}

@media (max-width:480px){
  .br-hero__pane{aspect-ratio:3/4;min-height:0;max-height:none}
  .br-hero__center{padding-top:1.25rem;padding-bottom:1.4rem}
  .br-hero__brand{letter-spacing:.14em}
  .br-drawer a{font-size:clamp(1.6rem,8vw,2.35rem)}
  .br-intro__media,.br-style__media,.br-spot__media,.br-dual__pane,.br-mosaic__cell,.br-faq__media{aspect-ratio:4/3;min-height:160px;max-height:none;overflow:hidden}
  .br-hero--page .br-hero__center h1{font-size:1.28rem}
  .br-hero--page .br-hero__lead{font-size:.92rem}
  .br-contact__form-wrap,.br-contact__aside{padding-top:1.5rem;padding-bottom:1.75rem}
  .br-form textarea{min-height:7rem}
  .br-foot__grid{grid-template-columns:1fr;gap:1.2rem}
  .br-foot__editorial{letter-spacing:.28em}
  .br-foot__mast,.br-foot__brand-block{text-align:center}
  .br-foot__social{align-items:center}
  .br-feature__media,.br-split__media,.br-map__frame,.br-contact__shot,.br-intro__media,.br-style__media,.br-spot__media,.br-faq__media{aspect-ratio:4/3;min-height:160px}
  .br-card__media,.br-note__media,.br-film__frame{min-height:180px}
  .br-film__frame{flex-basis:82vw}
}

@keyframes brRise{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:none}
}

@media (prefers-reduced-motion:reduce){
  .br-drawer,.br-drawer a,.br-drawer__meta,.js [data-br] img,
  .br-hero__center .br-hero__brand,.br-hero__center h1,.br-hero__center .br-hero__lead,.br-hero__center .br-hero__actions,
  .br-hero__copy h2,.br-hero__copy p,.br-hero__copy .br-btn,
  .br-hero--page .br-hero__center .br-hero__brand,.br-hero--page .br-hero__center h1,.br-hero--page .br-hero__center .br-hero__lead{
    animation:none!important;transition:none!important;opacity:1!important;transform:none!important;filter:none!important;visibility:visible!important;
  }
}
