/* Mobile presentation only. Desktop and tablet rules remain in their original files. */
@media (max-width:700px) {
  .page {
    --mobile-tile-height:clamp(240px,calc((100vw - 60px) * .75),330px);
    max-width:520px;
    padding:0 clamp(20px,7.46vw,30px);
  }
  .topbar {height:88px}
  .work-menu {top:22px}
  .work-toggle {height:44px;padding:0 14px;gap:8px;font-size:14px}
  .monogram,.contact-link,.contact-link:is(:hover,:focus-visible) {width:44px;height:44px;flex:none}
  .contact-label {display:none}
  .contact-link:is(:hover,:focus-visible) {gap:0}
  .grid {display:flex;flex-direction:column;gap:24px;max-width:none;margin:0}
  .grid>.tile,.grid>.next-pair,.grid>.playground-slot {width:100%;flex:none;min-width:0}
  .tile {border-radius:24px;border-width:2px}
  .intro.intro-bio {height:auto;min-height:0;padding:24px;gap:24px;justify-content:flex-start;font-weight:400}
  .intro-bio h1 {font-size:24px;line-height:1.3;margin:0}
  .intro-bio p {font-size:18px;line-height:1.3;margin:0;overflow-wrap:break-word}
  .intro-bio h1 strong,.intro-bio p strong {font-weight:600}
  .intro-bio .bio-equation {margin:0}
  .intro-bio .bio-closing {padding-top:4px}

  /* Stack the two NextMove surfaces; the pitch can no longer cover the N tile. */
  .next-pair {display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(2,var(--mobile-tile-height));gap:24px;height:auto;--nm-tile-gap:24px}
  .next-pair .tile {position:relative;inset:auto;width:100%;height:var(--mobile-tile-height)}
  .next-pair .nm-brand {grid-column:1;grid-row:1}
  .next-pair .tile.nm-play {grid-column:1;grid-row:2;left:auto;width:100%;opacity:1;pointer-events:auto;background:#fff;border-color:#f0f1f5}
  .next-pair .nm-play-rest {display:none}
  .next-pair .nm-play::after {display:none}
  .next-pair.is-expanded .nm-brand {opacity:1;pointer-events:auto}
  .next-pair.is-expanded .nm-play {background:#f6f8fa;border-color:#e0e5ea}
  .nm-logo-art {transform:scale(1.25)}
  .nm-brand.is-engaged .nm-logo-art {transform:translateY(-56px) scale(1)}
  .next-pair .nm-filmstrip {display:none}
  /* One set of seven cards handles stack, spread and travel; no layer swap. */
  /* Center the 64px row between the raised logo and the visible corner arrow. */
  .nm-mobile-loop {position:absolute;left:0;right:0;top:calc(75% - 63px);height:64px;opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity .3s ease,transform .5s var(--nm-motion)}
  .nm-mobile-loop-track {position:absolute;left:calc(50% - 240px);display:flex;width:max-content;height:100%}
  .nm-mobile-loop-group {display:flex;flex:none;gap:10px;padding-right:10px;height:100%}
  .nm-mobile-loop-group>span {position:relative;display:block;flex:none;width:60px;height:64px;border:1px solid #9ebfe8;border-radius:5px;overflow:hidden;background:#fff;transform:translate(var(--stack-offset),var(--stack-y)) rotate(var(--stack-angle));transition:transform .7s var(--nm-motion) var(--spread-delay)}
  .nm-mobile-loop img {display:block;width:100%;height:100%;object-fit:cover;object-position:top;filter:saturate(.2);transition:filter .3s ease}
  .nm-brand.is-engaged .nm-mobile-loop {opacity:1;transform:translateY(0)}
  .nm-brand.is-spread .nm-mobile-loop-group>span {transform:translate(0,0) rotate(0)}
  .nm-brand:not(.is-spread) .nm-mobile-loop-group>span {transition:none}
  .nm-brand.is-framed .nm-mobile-loop img {filter:saturate(1)}
  .nm-brand.is-framed .nm-mobile-loop-track {animation:nm-mobile-screen-loop 22s linear infinite}
  .nm-brand.is-loop-paused .nm-mobile-loop-track {animation-play-state:paused}
  @keyframes nm-mobile-screen-loop {to{transform:translateX(-50%)}}
  .next-pair .nm-play .nm-pitch-window {width:88%;max-width:360px;aspect-ratio:1.9}

  /* Mobile: restore the vivid turf, retaining the shared color-and-motion timeline. */
  .nm-play {--nm-color-duration:1.2s;--nm-play-delay:calc(var(--nm-color-duration) - .7s);--nm-shot-delay:calc(var(--nm-color-duration) + 4.1s)}
  .nm-play .nm-pitch-grass {
    display:block;
    position:absolute;inset:12px;z-index:1;pointer-events:none;
    border:1px solid #699652;border-radius:12px;
    background:linear-gradient(155deg,#ffffff18,transparent 48%,#20462616),
      repeating-linear-gradient(90deg,#ffffff10 0 12.5%,#1948240b 12.5% 25%),
      linear-gradient(135deg,#79a961,#6b9d51 60%,#608f48);
    box-shadow:inset 0 1px 3px #24452c25,inset 0 -1px 0 #ffffff36;
    -webkit-mask-image:linear-gradient(90deg,#000 0 40%,transparent 60% 100%);
    mask-image:linear-gradient(90deg,#000 0 40%,transparent 60% 100%);
    -webkit-mask-size:250% 100%;mask-size:250% 100%;
    -webkit-mask-position:100% 0;mask-position:100% 0;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  }
  .nm-play.is-grass-painting .nm-pitch-grass {animation:nm-grass-reveal var(--nm-color-duration) cubic-bezier(.25,.65,.3,1) both!important}
  @keyframes nm-grass-reveal {
    from {-webkit-mask-position:100% 0;mask-position:100% 0}
    to {-webkit-mask-position:0% 0;mask-position:0% 0}
  }
  .nm-play .nm-pitch {z-index:2}
  .next-pair.is-expanded .nm-play.is-grass-painting .nm-field-lines {filter:none;animation:nm-field-color var(--nm-color-duration) cubic-bezier(.25,.65,.3,1) both!important}
  .next-pair.is-expanded .nm-play.is-grass-painting .nm-team {animation:nm-team-color var(--nm-color-duration) cubic-bezier(.25,.65,.3,1) both!important}
  .next-pair.is-expanded .nm-play.is-grass-painting .nm-opponents {animation:nm-opponent-color var(--nm-color-duration) cubic-bezier(.25,.65,.3,1) both!important}
  .next-pair.is-expanded .nm-play.is-grass-painting .nm-corner {animation:nm-corner-intro var(--nm-color-duration) ease-out both,nm-corner-glow 2.2s var(--nm-color-duration) ease-in-out infinite!important}
  .next-pair.is-expanded .nm-play.is-grass-painting .nm-corner:nth-of-type(2),.next-pair.is-expanded .nm-play.is-grass-painting .nm-corner:nth-of-type(4) {animation-delay:0s,calc(var(--nm-color-duration) + .2s)!important}
  @keyframes nm-field-color {from{color:#b8bec1}to{color:#f4f8ee}}
  @keyframes nm-team-color {from{fill:#acb3b7;stroke:#f2f4f4}to{fill:#2563eb;stroke:#fff}}
  @keyframes nm-opponent-color {from{fill:#c7ccce;stroke:#f2f4f4}to{fill:#cbd3dc;stroke:#fff}}
  @keyframes nm-corner-intro {from{opacity:0}to{opacity:.3}}
  /* One shared CSS timeline keeps the reveal and play synchronized, including replay. */
  .next-pair.is-expanded .nm-play .nm-ball {transition:opacity var(--nm-color-duration) linear!important}
  .next-pair.is-expanded .nm-play.is-grass-painting .nm-pass-path{opacity:0;animation:nm-mobile-pass 1.5s var(--nm-color-duration) ease-in-out forwards!important}
  /* The approved receiving position holds briefly, then the ball is shot into goal. */
  .next-pair.is-expanded .nm-play.is-grass-painting .nm-run-path{opacity:0;animation:nm-mobile-dashes 4.4s var(--nm-color-duration) linear forwards!important}
  .next-pair.is-expanded .nm-play.is-grass-painting .nm-runner{animation:nm-run-cycle 8.8s var(--nm-play-delay) ease-in-out .5 both!important}
  .next-pair.is-expanded .nm-play.is-grass-painting .nm-ball{opacity:1;animation:nm-ball-cycle 8.8s var(--nm-play-delay) ease-in-out .5 both,nm-shot .68s var(--nm-shot-delay) cubic-bezier(.15,.65,.35,1) forwards!important}
  .next-pair.is-expanded .nm-play.is-grass-painting .nm-target{animation:nm-possession 8.8s var(--nm-play-delay) ease-in-out .5 both,nm-shot-possession .22s var(--nm-shot-delay) ease-out forwards!important}
  .next-pair.is-expanded .nm-play.is-grass-painting .nm-shot-path{animation:nm-shot-trail 1s var(--nm-shot-delay) ease-out forwards!important}
  .next-pair.is-expanded .nm-play.is-grass-painting .nm-opponents circle{animation:nm-defend 8.8s var(--nm-color-duration) ease-in-out .5 both!important}
  @keyframes nm-mobile-pass{from{opacity:.65}to{stroke-dashoffset:0;opacity:.65}}
  @keyframes nm-mobile-dashes{from{opacity:.65}to{stroke-dashoffset:-54;opacity:.65}}

  /* The complete phone is visible before the visitor touches the card. */
  .phone-tile.hum-showcase {height:clamp(460px,145vw,600px);background:#fff;overflow:hidden}
  .phone-tile.hum-showcase .hum-device {width:min(68%,230px);left:50%!important;top:50%!important;border-radius:33px;transform:translate(-50%,-50%) perspective(1800px) rotateY(-12deg)!important}
  .phone-tile.hum-showcase.is-engaged .hum-device {transform:translate(-50%,-50%) perspective(1800px) rotateY(0deg)!important}
  .phone-tile.hum-showcase .hum-viewport {border-radius:27px}
  .hum-splash-idle-title {position:absolute;left:50%;top:50%;display:block;color:#ff0066;font-size:38px;font-weight:700;line-height:1;letter-spacing:-2px;transform:translate(-50%,-50%);opacity:1;pointer-events:none;transition:opacity .3s linear}
  .hum-showcase.is-engaged .hum-splash-idle-title {opacity:0}
  .tile.hum-brand {height:var(--mobile-tile-height);overflow:hidden}
  .hum-brand-symbol {width:132px;height:130px}
  .hum-brand.is-raised .hum-brand-symbol {transform:translate(-50%,calc(-50% - 30px)) scale(.84)}
  .hum-brand-word {top:calc(50% + 30px);font-size:44px}

  /* Visible controls, with a 44px touch target around each quiet circular arrow. */
  .nm-project-link,.hum-project-link,.hum-brand .hum-project-link {
    display:flex;align-items:center;justify-content:center;left:8px;bottom:8px;
    width:44px;height:44px;max-width:none;gap:0!important;
    opacity:1;visibility:visible;pointer-events:auto;transform:none;
  }
  .next-pair>.nm-project-link:not(.mobile-pitch-link) {top:calc(var(--mobile-tile-height) - 52px);bottom:auto}
  .nm-link-icon,.hum-link-icon {width:36px;height:36px;border:2px solid #efeff1;background:#fff;color:#a2a2a7;box-shadow:none}
  .nm-link-icon svg,.hum-link-icon svg {width:22px;height:22px}
  .nm-one-liner,.hum-one-liner {display:none!important}
  .tile-action {opacity:1;transform:none}

  /* The sheet floats independently; the two controls stay in the bottom corners. */
  .tile.cv-tile {height:var(--mobile-tile-height);min-height:258px;background:#fff;border-color:var(--line)}
  .tile.cv-tile .cv-art {
    translate:0 -23px;transform:scale(1.12);scale:1!important;
    animation:cv-mobile-float 4s ease-in-out infinite;
  }
  .cv-tile .cv-lines {opacity:1}
  .cv-tile .cv-lines i {
    background:#d6c8ef;border-color:#b4a7c5;
    animation:cv-mobile-ink 21s ease-in-out infinite;
  }
  .cv-tile .cv-actions {left:6px;right:6px;bottom:6px;height:46px;opacity:1;visibility:visible;transform:none}
  .cv-tile .cv-actions :is(a,button) {background:#fff;border:2px solid #dedee0;box-shadow:none}
  .cv-tile .cv-actions .cv-download {width:44px;height:44px;color:#111}
  .cv-tile .cv-actions .cv-open {min-width:138px;height:46px;padding:0 16px;gap:8px;font-size:18px;font-weight:500;color:#59595b}
  .cv-tile .cv-open svg {color:#111}
  .cv-tile .cv-open::before {display:none}
  .cv-tile .cv-actions :is(a,button):active {background:#f5f5f7;border-color:#c9c9ce}
  @keyframes cv-mobile-float {
    0%,100% {translate:0 -28px}
    50% {translate:0 -18px}
  }
  @keyframes cv-mobile-ink {
    0%,100% {background-color:#d6c8ef;border-color:#b4a7c5}
    33% {background-color:#cccaf6;border-color:#aaa8ca}
    66% {background-color:#f3b4a6;border-color:#c99b92}
    83% {background-color:#e9bed0;border-color:#bea0b0}
  }
  .chess-tile {min-height:300px;padding:24px;gap:24px}
  .chess-ratings {width:min(100%,200px)}
  .chess-play {background:#111;color:#fff;border-color:#202020}
  .chess-play img {filter:grayscale(1) brightness(0) invert(1)}
  .podcasts-tile {height:300px;min-height:300px}
  .nm-table-tile {height:258px;min-height:258px;overflow:hidden}
  /* Keep the same sheet size throughout the reveal, clipping Shots on the right. */
  .nm-table-viewport {inset:0 -84px -1px 0;border-radius:0;box-shadow:none}
  .nm-table-tile.is-engaged .nm-table-viewport {transform:none}
  .nm-stats {font-size:15px}
  .playground-slot {min-height:280px}
  .playground-slot>.tile {height:280px;min-height:280px}
  .song-deck {width:calc(100% - 40px)}
  .home-footer {display:flex;justify-content:center;align-items:center;min-height:0;margin:0 0 24px;padding:24px 0 0;font-size:14px;font-weight:400;line-height:20px;text-align:center;color:#25242966}
  .home-footer .footer-contact {display:none}
}