/* JOY'S BOX V29 — mobile-first flow + studio contact statement */
:root{
  --v29-ink:#15130f;
  --v29-paper:#efebe1;
  --v29-gold:#b18c32;
  --v29-line:rgba(21,19,15,.14);
  --v29-ease:cubic-bezier(.16,1,.3,1);
}

/* New brand statement — holds the removed intro copy + contact CTA. */
.studio-note-v29{
  position:relative;
  padding:clamp(108px,9vw,160px) var(--pad) clamp(92px,8vw,138px);
  background:var(--v29-paper);
  color:var(--v29-ink);
  overflow:hidden;
  isolation:isolate;
}
.studio-note-v29::before{
  content:"";position:absolute;inset:auto -12vw -36vw auto;width:64vw;height:64vw;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(177,140,50,.09),rgba(177,140,50,0) 68%);
}
.studio-note-v29__top{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding-bottom:18px;border-bottom:1px solid var(--v29-line);
}
.studio-note-v29__top .section-kicker{margin:0}
.studio-note-v29__index{font:700 7px/1 var(--sans);letter-spacing:.18em;color:#8e8063}
.studio-note-v29__grid{
  display:grid;grid-template-columns:minmax(0,1.16fr) minmax(330px,.54fr);gap:clamp(48px,8vw,140px);align-items:end;
  padding:clamp(58px,6vw,92px) 0 clamp(52px,5vw,76px);
}
.studio-note-v29__headline-wrap{position:relative;min-width:0}
.studio-note-v29__headline{
  margin:0;font:600 clamp(78px,9.4vw,158px)/.72 var(--cond);letter-spacing:-.055em;text-transform:uppercase;color:var(--v29-ink);
}
.studio-note-v29__headline i{font-family:var(--serif);font-weight:400;font-style:italic;text-transform:none;color:var(--v29-gold);letter-spacing:-.035em;white-space:nowrap}
.studio-note-v29__line{width:clamp(70px,10vw,160px);height:1px;background:var(--v29-gold);margin-top:clamp(28px,3vw,46px);transform-origin:left center}
.studio-note-v29__copy{align-self:end;padding-bottom:8px}
.studio-note-v29__copy p{max-width:52ch;margin:0 0 18px;color:#5d574f;font:500 13px/1.78 var(--sans)}
.studio-note-v29__copy p:first-child{color:#28241f}
.studio-note-v29__cta{
  width:100%;margin-top:clamp(26px,3vw,44px);padding:18px 0;border-top:1px solid var(--v29-ink);border-bottom:1px solid var(--v29-ink);
  display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--v29-ink);text-decoration:none;
  font:700 11px/1 var(--sans);letter-spacing:.15em;transition:color .35s ease,padding .45s var(--v29-ease),background .35s ease;
}
.studio-note-v29__cta b{font:400 24px/1 var(--sans);transition:transform .45s var(--v29-ease)}
.studio-note-v29__cta:hover{padding-left:16px;padding-right:16px;background:var(--v29-ink);color:#f2ede2}
.studio-note-v29__cta:hover b{transform:translate(3px,-3px)}
.studio-note-v29__rail{
  display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr auto;gap:14px;align-items:center;
  color:#7f766a;font:700 7px/1 var(--sans);letter-spacing:.16em;white-space:nowrap;
}
.studio-note-v29__rail i{display:block;height:1px;background:var(--v29-line)}

/* The manifesto is now intentionally the first section after the hero. */
.manifesto#about{scroll-margin-top:72px}

@media(max-width:900px){
  /* Keep the mobile experience animated, but GPU-light and touch-native. */
  body{touch-action:pan-y pinch-zoom}
  a,button{touch-action:manipulation}
  .section-kicker{font-size:7px!important;letter-spacing:.17em!important;line-height:1.25!important}

  /* VISION / VALUES / MISSION — swipeable second scene after hero. */
  .manifesto#about{padding:78px 0 82px!important;overflow:hidden!important}
  .manifesto#about>.section-kicker{padding:0 18px!important;margin-bottom:28px!important}
  .manifesto#about .manifesto__cards{
    display:flex!important;grid-template-columns:none!important;gap:12px!important;
    overflow-x:auto!important;overflow-y:hidden!important;padding:0 18px 14px!important;
    scroll-snap-type:x mandatory!important;scroll-padding-left:18px!important;
    -webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;
    scrollbar-width:none;
  }
  .manifesto#about .manifesto__cards::-webkit-scrollbar{display:none}
  .manifesto#about .manifest-card{
    flex:0 0 min(84vw,390px)!important;width:min(84vw,390px)!important;
    height:min(68svh,590px)!important;min-height:500px!important;max-height:590px!important;
    scroll-snap-align:start!important;scroll-snap-stop:always!important;margin:0!important;
    border-radius:20px!important;
  }
  .manifesto#about .manifest-card:last-child{margin-right:5vw!important}
  .manifesto#about .manifest-card__content{padding:21px!important}
  .manifesto#about .manifest-card__content h3{font-size:clamp(39px,10.4vw,51px)!important;line-height:.84!important}
  .manifesto#about .manifest-card__content p{max-width:34ch!important}

  /* Brand statement + contact. */
  .studio-note-v29{padding:82px 18px 76px!important}
  .studio-note-v29::before{width:120vw;height:120vw;right:-52vw;bottom:-46vw}
  .studio-note-v29__top{padding-bottom:14px}
  .studio-note-v29__grid{grid-template-columns:1fr!important;gap:34px!important;padding:42px 0 40px!important}
  .studio-note-v29__headline{font-size:clamp(58px,15.5vw,82px)!important;line-height:.75!important;max-width:100%}
  .studio-note-v29__headline i{white-space:normal!important}
  .studio-note-v29__line{margin-top:24px;width:86px}
  .studio-note-v29__copy{padding:0!important}
  .studio-note-v29__copy p{font-size:12px!important;line-height:1.72!important;margin-bottom:14px!important}
  .studio-note-v29__cta{min-height:58px;margin-top:24px!important;padding:16px 0!important;font-size:9px!important}
  .studio-note-v29__cta b{font-size:22px}
  .studio-note-v29__rail{grid-template-columns:auto 1fr auto!important;row-gap:13px!important;font-size:6px!important;white-space:normal}
  .studio-note-v29__rail span:nth-of-type(3),.studio-note-v29__rail span:nth-of-type(4),.studio-note-v29__rail i:nth-of-type(2),.studio-note-v29__rail i:nth-of-type(3){display:none}

  /* Every large image remains lively on touch without scroll-scrub jank. */
  html.v29-mobile-motion .v29-media-reveal img{
    transform:scale(1.035)!important;transform-origin:center!important;
    transition:transform 1.05s var(--v29-ease)!important;
  }
  html.v29-mobile-motion .v29-media-reveal.v29-in img{transform:scale(1)!important}
  html.v29-mobile-motion .v29-copy-reveal{
    opacity:.001;transform:translateY(15px);
    transition:opacity .5s ease,transform .7s var(--v29-ease)!important;
  }
  html.v29-mobile-motion .v29-copy-reveal.v29-in{opacity:1;transform:none}

  /* Re-introduce subtle motion to mobile sections that V28 intentionally flattened. */
  html.v29-mobile-motion .manifest-card.v29-in,
  html.v29-mobile-motion .process-panel.v29-in,
  html.v29-mobile-motion .archive-card.v29-in,
  html.v29-mobile-motion .showreel-card-v13.v29-in,
  html.v29-mobile-motion .market-card.v29-in{
    box-shadow:0 16px 38px rgba(0,0,0,.12)!important;
  }

  /* Less visual crowding and more reliable tap targets across the whole page. */
  .service-row,.why-list article,.capability-grid>div{min-height:64px!important}
  .text-link,.closing-v17__mail,.studio-note-v29__cta{touch-action:manipulation}
  .showreel-card-v13__play{pointer-events:none}
  .archive-card__top,.archive-card__bottom,.story-frame__top,.story-frame__copy{pointer-events:none}
  .market-card,.showreel-card-v13,.detail-fragment-v24{touch-action:manipulation}

  /* Mobile headings: prevent clipping on narrow iPhones. */
  .headline,.display-title,.work-archive__head h2,.details-v24__title h2,.showreels-v13__head h2,
  .clients-v23__title-row .headline,.process-triptych__intro h2,.studio-note-v29__headline{
    overflow:visible!important;word-break:normal!important;overflow-wrap:normal!important;
  }
}

@media(max-width:430px){
  .manifesto#about>.section-kicker{padding-left:16px!important;padding-right:16px!important}
  .manifesto#about .manifesto__cards{padding-left:16px!important;padding-right:16px!important;scroll-padding-left:16px!important}
  .manifesto#about .manifest-card{flex-basis:86vw!important;width:86vw!important;min-height:470px!important}
  .studio-note-v29{padding-left:16px!important;padding-right:16px!important}
  .studio-note-v29__headline{font-size:15vw!important}
}

@media(prefers-reduced-motion:reduce){
  .studio-note-v29__line,.studio-note-v29__cta,.studio-note-v29__cta b,
  html.v29-mobile-motion .v29-media-reveal img,html.v29-mobile-motion .v29-copy-reveal{transition:none!important}
}
@media(max-width:900px){
  .manifest-card.v29-touch,.archive-card.v29-touch,.process-panel.v29-touch,.market-card.v29-touch,.showreel-card-v13.v29-touch,.detail-fragment-v24.v29-touch{
    transform:scale(.992)!important;transition:transform .18s ease!important;
  }
}