/* JOY'S BOX V38 — mobile luxury refinement.
   V30 desktop stays untouched. V36 process + hero polish stay intact. */
:root{--v38-gold:#d7b760;--v38-paper:#efe8db;--v38-ease:cubic-bezier(.16,1,.3,1)}
.journey-v38{display:none}

@media(max-width:900px){
  /* MILESTONES — a substantial cinematic card: wide, but with enough height to feel premium. */
  html.v38-mobile .story-v2 .story-pin{min-height:650px!important}
  html.v38-mobile .story-v2 .story-track{gap:12px!important;padding-left:15px!important;padding-right:15px!important}
  html.v38-mobile .story-frame{
    flex:0 0 92vw!important;width:92vw!important;height:82vw!important;min-height:320px!important;max-height:390px!important;
    aspect-ratio:auto!important;border-radius:22px!important;
    box-shadow:0 26px 68px rgba(38,27,8,.18)!important;
  }
  html.v38-mobile .story-frame__shade{
    background:linear-gradient(180deg,rgba(3,3,3,.10) 0%,rgba(3,3,3,.03) 37%,rgba(3,3,3,.87) 100%),linear-gradient(90deg,rgba(0,0,0,.20),transparent 62%)!important;
  }
  html.v38-mobile .story-frame__top{left:18px!important;right:18px!important;top:18px!important;font-size:6.4px!important;letter-spacing:.15em!important}
  html.v38-mobile .story-frame__copy{left:18px!important;right:18px!important;bottom:22px!important;grid-template-columns:.92fr 1.08fr!important;gap:16px!important;align-items:end!important}
  html.v38-mobile .story-frame__copy>strong{font-size:clamp(78px,24.5vw,104px)!important;line-height:.61!important;letter-spacing:-.055em!important}
  html.v38-mobile .story-frame[data-year="2023-2024"] .story-frame__copy>strong{font-size:clamp(57px,17.8vw,76px)!important;letter-spacing:-.045em!important}
  html.v38-mobile .story-frame__copy small{font-size:6px!important;letter-spacing:.17em!important;margin-bottom:8px!important;color:var(--v38-gold)!important}
  html.v38-mobile .story-frame__copy h3{font-size:clamp(31px,8.5vw,41px)!important;line-height:.80!important;letter-spacing:-.025em!important}
  html.v38-mobile .story-frame__note{right:18px!important;bottom:10px!important;font-size:5px!important;letter-spacing:.12em!important;opacity:.68!important}
  html.v38-mobile .story-frame:not(.is-active){opacity:.38!important;transform:scale(.94)!important;filter:saturate(.72) brightness(.80)!important}
  html.v38-mobile .story-frame.is-active{transform:scale(1)!important;opacity:1!important;filter:none!important}

  /* PORTFOLIO TICKERS — no manual scroller, no stopped mobile state. WAAPI owns transform. */
  .portfolio-marquee{overflow:hidden!important;scrollbar-width:none!important;-webkit-overflow-scrolling:auto!important}
  .portfolio-marquee .marquee__inner{display:flex!important;width:max-content!important;min-width:max-content!important;gap:20px!important;padding-right:0!important;animation:none!important;transform:none;will-change:transform!important}
  .portfolio-marquee span{font-size:clamp(36px,10.2vw,49px)!important;white-space:nowrap!important}
  .portfolio-marquee i{font-size:13px!important;flex:none!important}

  /* CLIENTS — restore the desktop identity wall exactly as moving two-direction rails. */
  html.v38-mobile .clients-v23{padding:92px 0 92px!important;overflow:hidden!important}
  html.v38-mobile .clients-v23__head{padding:0 18px!important}
  html.v38-mobile .clients-v23__title-row{grid-template-columns:1fr!important;gap:22px!important}
  html.v38-mobile .clients-v23__wall{
    margin-top:42px!important;border-top:1px solid var(--v23-line)!important;border-bottom:1px solid var(--v23-line)!important;
    overflow:hidden!important;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)!important;mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)!important;
  }
  html.v38-mobile .client-rail-v23{overflow:hidden!important;padding:0!important;margin:0!important;border-bottom:1px solid var(--v23-line)!important}
  html.v38-mobile .client-rail-v23--b{border-bottom:0!important}
  html.v38-mobile .client-rail-v23__track{display:flex!important;grid-template-columns:none!important;gap:0!important;width:max-content!important;animation:none!important;transform:none;will-change:transform!important}
  html.v38-mobile .client-chip-v23,
  html.v38-mobile .client-chip-v23[aria-hidden="true"]{
    display:grid!important;flex:0 0 auto!important;width:210px!important;height:142px!important;padding:22px 30px!important;
    border:0!important;border-right:1px solid var(--v23-line)!important;background:rgba(255,255,255,.08)!important;opacity:1!important;transform:none!important;
  }
  html.v38-mobile .client-chip-v23::before{display:block!important}
  html.v38-mobile .client-chip-v23 img{max-width:145px!important;max-height:76px!important;filter:grayscale(1) contrast(.9)!important;opacity:.66!important;transform:scale(.96)!important}
  html.v38-mobile .clients-v23__footer{padding:18px 18px 0!important}

  /* NEW GUEST JOURNEY — luxury editorial scroll component, no snake/map UI. */
  html.v38-mobile .journey{padding:0!important;overflow:visible!important;background:#0a0a09!important;min-height:0!important}
  html.v38-mobile .journey>.journey__copy,
  html.v38-mobile .journey>.journey__map{display:none!important}
  html.v38-mobile .journey-v38{display:block!important;position:relative!important;color:#f3eee5!important;background:#0a0a09!important;isolation:isolate!important}
  html.v38-mobile .journey-v38::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 78% 15%,rgba(207,169,79,.08),transparent 24%),linear-gradient(180deg,#10100f 0,#090908 100%)}
  html.v38-mobile .journey-v38__intro{position:relative;z-index:2;padding:94px 18px 48px!important}
  html.v38-mobile .journey-v38__intro .section-kicker{margin-bottom:18px!important}
  html.v38-mobile .journey-v38__intro h2{margin:0!important;font:600 clamp(54px,14.4vw,76px)/.78 var(--cond)!important;letter-spacing:-.045em!important;text-transform:uppercase!important;color:#f3eee5!important}
  html.v38-mobile .journey-v38__intro h2 i{font:400 1.02em/.76 var(--serif)!important;text-transform:none!important;color:var(--v38-gold)!important;letter-spacing:-.02em!important}
  html.v38-mobile .journey-v38__intro p{margin:22px 0 0!important;max-width:31ch!important;color:#9d988f!important;font:500 12px/1.6 var(--sans)!important}
  html.v38-mobile .journey-v38__scroll{position:relative!important;height:520svh!important}
  html.v38-mobile .journey-v38__sticky{position:sticky!important;top:0!important;height:100svh!important;min-height:640px!important;display:flex!important;align-items:center!important;padding:72px 12px 24px!important;overflow:hidden!important}
  html.v38-mobile .journey-v38__topline{position:absolute;z-index:8;left:18px;right:18px;top:calc(19px + env(safe-area-inset-top));display:flex;justify-content:space-between;gap:16px;color:rgba(255,255,255,.54);font:700 5.6px/1.25 var(--sans);letter-spacing:.14em;text-transform:uppercase}
  html.v38-mobile .journey-v38__topline span:last-child{text-align:right;color:rgba(215,183,96,.72)}
  html.v38-mobile .journey-v38__stage{position:relative;width:100%;height:min(77svh,650px);min-height:540px;border-radius:25px;overflow:hidden;background:#131210;border:1px solid rgba(255,255,255,.11);box-shadow:0 32px 86px rgba(0,0,0,.44);isolation:isolate}
  html.v38-mobile .journey-v38__stage::before{content:"";position:absolute;z-index:5;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(215,183,96,.10),inset 0 -120px 100px rgba(0,0,0,.10);pointer-events:none}
  html.v38-mobile .journey-v38__media,html.v38-mobile .journey-v38__image,html.v38-mobile .journey-v38__image img{position:absolute;inset:0;width:100%;height:100%}
  html.v38-mobile .journey-v38__image{margin:0;opacity:0;clip-path:inset(6% 6% 6% 6% round 18px);transform:scale(1.035);transition:opacity .48s ease,clip-path .82s var(--v38-ease),transform 1.15s var(--v38-ease);z-index:0}
  html.v38-mobile .journey-v38__image.is-active{opacity:1;clip-path:inset(0 0 0 0 round 24px);transform:scale(1);z-index:1}
  html.v38-mobile .journey-v38__image.is-before{opacity:0;clip-path:inset(0 0 100% 0 round 24px);transform:scale(1.015)}
  html.v38-mobile .journey-v38__image img{object-fit:cover;object-position:center;transform:translate3d(0,var(--v38-img-y,0px),0) scale(1.035);filter:saturate(.78) contrast(1.03) brightness(.84);transition:transform .12s linear}
  html.v38-mobile .journey-v38__scrim{position:absolute;z-index:2;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.10) 0%,rgba(0,0,0,.04) 37%,rgba(0,0,0,.88) 100%),linear-gradient(90deg,rgba(0,0,0,.33),transparent 58%);pointer-events:none}
  html.v38-mobile .journey-v38__ghost{position:absolute;z-index:2;right:14px;top:31px;color:rgba(255,255,255,.10);font:600 clamp(116px,34vw,154px)/.72 var(--cond);letter-spacing:-.065em;pointer-events:none;transition:opacity .3s ease}
  html.v38-mobile .journey-v38__chapters{position:absolute;z-index:6;left:18px;right:56px;bottom:24px;height:140px}
  html.v38-mobile .journey-v38__chapter{position:absolute;inset:0;display:grid;grid-template-columns:30px 1fr;gap:11px;align-items:end;opacity:0;transform:translate3d(0,24px,0);transition:opacity .32s ease,transform .58s var(--v38-ease);pointer-events:none}
  html.v38-mobile .journey-v38__chapter.is-active{opacity:1;transform:none}
  html.v38-mobile .journey-v38__chapter>b{align-self:start;margin-top:55px;color:var(--v38-gold);font:700 8px/1 var(--sans);letter-spacing:.12em}
  html.v38-mobile .journey-v38__chapter small{display:block;margin-bottom:7px;color:var(--v38-gold);font:700 6px/1 var(--sans);letter-spacing:.16em}
  html.v38-mobile .journey-v38__chapter h3{margin:0;color:#fff;font:600 clamp(47px,13vw,66px)/.74 var(--cond);letter-spacing:-.035em;text-transform:uppercase}
  html.v38-mobile .journey-v38__chapter p{margin:9px 0 0;color:#d2cec5;font:500 10px/1.45 var(--sans)}
  html.v38-mobile .journey-v38__rail{position:absolute;z-index:7;right:14px;top:50%;transform:translateY(-50%);display:grid;gap:13px}
  html.v38-mobile .journey-v38__rail span{display:flex;align-items:center;justify-content:flex-end;gap:7px;color:rgba(255,255,255,.28);font:700 5.5px/1 var(--sans);letter-spacing:.08em;transition:color .28s ease}
  html.v38-mobile .journey-v38__rail i{display:block;width:8px;height:1px;background:currentColor;transition:width .38s var(--v38-ease),background .28s ease}
  html.v38-mobile .journey-v38__rail span.is-active{color:var(--v38-gold)}
  html.v38-mobile .journey-v38__rail span.is-active i{width:22px}
  html.v38-mobile .journey-v38__progress{position:absolute;z-index:8;left:18px;right:18px;bottom:11px;height:1px;background:rgba(255,255,255,.19);overflow:hidden}
  html.v38-mobile .journey-v38__progress i{display:block;width:100%;height:100%;background:var(--v38-gold);transform:scaleX(var(--v38-progress,0));transform-origin:left;will-change:transform}
}

@media(max-width:430px){
  html.v38-mobile .story-frame{flex-basis:92vw!important;width:92vw!important;height:82vw!important;min-height:318px!important}
  html.v38-mobile .journey-v38__stage{height:76svh;min-height:525px}
}
