/* CRUDO / Mobile hardening — iPhone / Safari / small viewports
   Loaded last. Keeps desktop intact and removes fixed-position collisions on phones. */

html,body{max-width:100%;overflow-x:hidden}
img,svg,canvas,video{max-width:100%}

@supports (height:100dvh){
  .hero,.experiment-cover,.orbit-stage{min-height:100dvh}
}

@media (max-width:600px){
  :root{--mobile-x:20px;--pad:20px}

  html{scroll-padding-top:64px}
  body{min-width:0}

  .site-nav{
    height:64px!important;
    padding-left:max(var(--mobile-x),env(safe-area-inset-left))!important;
    padding-right:max(var(--mobile-x),env(safe-area-inset-right))!important;
  }
  .site-nav.nav-scrolled,.project-page .site-nav{height:58px!important}
  .nav-brand{width:clamp(92px,27vw,108px);height:24px}
  .nav-brand img{max-height:23px}
  .nav-menu{padding-right:2px}
  .mobile-menu{
    top:64px!important;
    max-height:calc(100dvh - 64px);
    overflow-y:auto;
    padding:24px max(var(--mobile-x),env(safe-area-inset-right)) calc(28px + env(safe-area-inset-bottom)) max(var(--mobile-x),env(safe-area-inset-left));
    font-size:clamp(25px,7.6vw,31px);
  }

  /* FRONT / hero: image and copy are now separate flow regions, never overlapping. */
  .hero{
    display:flex!important;
    min-height:auto!important;
    overflow:visible!important;
    flex-direction:column;
    align-items:stretch;
    gap:28px!important;
    padding:76px 14px calc(26px + env(safe-area-inset-bottom))!important;
  }
  .hero-reel{
    position:relative!important;
    inset:auto!important;
    order:1;
    width:100%!important;
    height:clamp(300px,45svh,410px)!important;
    min-height:300px!important;
    flex:0 0 auto;
    margin:0!important;
  }
  .hero-copy{
    position:relative!important;
    inset:auto!important;
    order:2;
    width:100%!important;
    max-width:none!important;
    padding:0 6px;
  }
  .hero .eyebrow{margin-bottom:18px;font-size:8px;line-height:1.35}
  .hero h1{
    width:100%;
    max-width:100%;
    font-size:clamp(49px,15.2vw,64px)!important;
    line-height:.82!important;
    letter-spacing:-.092em!important;
    overflow:visible;
  }
  .hero h1>span{
    display:block;
    max-width:100%;
    overflow:visible!important;
    padding-right:.12em!important;
    margin-right:0!important;
  }
  .hero-intro{
    max-width:285px!important;
    margin-top:24px!important;
    font-size:clamp(16px,4.5vw,19px)!important;
    line-height:1.18!important;
  }
  .hero .primary-link{margin-top:24px!important}
  .hero-meta{
    position:relative!important;
    inset:auto!important;
    order:3;
    margin:0 6px!important;
    padding-top:2px;
    font-size:7px!important;
  }
  .hero-wordmark{top:13px!important;left:13px!important;width:72px!important}
  .hero-controls{top:12px!important;right:12px!important}
  .hero-controls button{width:27px!important;height:27px!important}
  .hero-overlay{font-size:7px!important}

  /* STUDIO */
  .studio{
    gap:28px!important;
    padding:96px var(--mobile-x)!important;
  }
  .studio-copy{min-width:0}
  .studio-copy h2{
    max-width:100%;
    font-size:clamp(47px,14.5vw,62px)!important;
    line-height:.84!important;
    overflow-wrap:normal;
  }
  .studio-copy p{max-width:100%;font-size:clamp(17px,4.6vw,19px)!important;line-height:1.25}
  .brand-letters{min-height:150px!important}
  .brand-letter span{font-size:clamp(50px,16vw,68px)!important}

  /* WORK: one project per row on phones. Two-column editorial stack was too compressed. */
  .work{padding:92px var(--mobile-x)!important}
  .work-header{gap:14px!important;margin-bottom:46px!important}
  .work-header h2{
    max-width:100%;
    font-size:clamp(47px,14vw,60px)!important;
    line-height:.82!important;
  }
  .work-header>p:last-child{max-width:250px;font-size:14px!important}
  .work-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:none!important;
    grid-auto-rows:auto!important;
    gap:12px!important;
  }
  .work-card,.work-card--featured,.work-card--tower,.work-card--middle,.work-card--edge,.work-card--wide{
    grid-column:1!important;
    grid-row:auto!important;
  }
  .work-card figure,.work-card:not(.work-card--featured):not(.work-card--wide) figure{
    height:clamp(360px,112vw,500px)!important;
    min-height:0!important;
    aspect-ratio:auto;
  }
  .work-card figure>figcaption{
    display:grid!important;
    right:9px!important;
    bottom:9px!important;
    left:9px!important;
    padding:12px 13px!important;
    opacity:1!important;
    transform:none!important;
  }
  .work-card figure>figcaption small{font-size:6px!important;line-height:1.35}
  .work-card figure>figcaption h3{font-size:clamp(24px,7.2vw,31px)!important;line-height:.84!important}
  .work-card figure>figcaption b{font-size:20px!important}

  /* CONTACT */
  footer{gap:28px!important;padding:92px var(--mobile-x) calc(24px + env(safe-area-inset-bottom))!important}
  .footer-link{
    width:100%!important;
    max-width:100%;
    flex-wrap:wrap;
    gap:12px!important;
    font-size:clamp(31px,9.4vw,42px)!important;
    line-height:.9!important;
    overflow-wrap:anywhere;
  }
  .footer-link span{flex:0 0 auto}
  .footer-meta{gap:14px;margin-top:58px!important;line-height:1.35}

  /* STANDARD PROJECT PAGES */
  .project-sheet{padding-top:64px!important}
  .project-ledger{margin-inline:var(--mobile-x)!important}
  .project-canvas{
    min-height:clamp(430px,60svh,570px)!important;
    margin-inline:14px!important;
  }
  .project-overlay{padding:24px}
  .project-overlay h1{
    max-width:100%;
    font-size:clamp(48px,15vw,64px)!important;
    line-height:.78!important;
    letter-spacing:-.09em!important;
  }
  .project-overlay small{font-size:8px!important}
  .project-canvas figcaption{gap:14px;line-height:1.3}
  .project-opening{padding:48px var(--mobile-x)!important}
  .project-thesis{max-width:100%;font-size:clamp(19px,5.2vw,22px)!important;line-height:1.2!important}
  .project-facts{margin-inline:var(--mobile-x)!important;gap:20px 16px!important}
  .project-facts span{font-size:13px}
  .spatial-note{padding:88px var(--mobile-x) 54px!important}
  .spatial-note h2,.story-copy h2{
    max-width:100%;
    font-size:clamp(45px,14vw,59px)!important;
    line-height:.82!important;
  }
  .story-pair{padding:82px var(--mobile-x)!important;gap:38px!important}
  .story-frame--wide{margin-inline:14px!important;min-height:52svh!important}
  .story-pair--reverse .story-frame{height:52svh!important}
  .story-drawing{height:46svh!important}
  .next-threshold{padding:82px var(--mobile-x)!important}
  .next-threshold a{grid-template-columns:minmax(0,1fr) auto!important}
  .next-threshold h2{
    max-width:100%;
    font-size:clamp(48px,15vw,64px)!important;
    line-height:.76!important;
  }
  .next-threshold b{font-size:32px!important}

  /* LAB INDEX: preserve two-column icon field but prevent labels/canvas from colliding. */
  .experimental-index .orbit-stage{
    min-height:auto!important;
    padding:86px var(--mobile-x) 42px!important;
  }
  .orbit-kicker{font-size:8px!important;line-height:1.35}
  .orbit-field{
    width:100%!important;
    margin-top:38px!important;
    gap:20px 12px!important;
  }
  .orbit-core{width:64px!important;height:64px!important;margin-bottom:20px!important}
  .orbit-core small{bottom:-24px!important;font-size:7px!important}
  .orbit-project{min-width:0}
  .orbit-project img{inset:7%!important;width:86%!important;height:86%!important}
  .orbit-project>span{top:6px!important;left:6px!important;font-size:8px!important}
  .orbit-project>b{
    right:6px!important;
    bottom:7px!important;
    left:6px!important;
    font-size:clamp(15px,4.4vw,18px)!important;
    line-height:.86!important;
  }
  .attractor-cursor{display:none!important}

  /* LAB PROJECT */
  .experiment-cover{min-height:max(100svh,720px)!important}
  .project-back{top:82px!important;left:var(--mobile-x)!important}
  .project-ledger-dark{
    top:82px!important;
    right:var(--mobile-x)!important;
    left:var(--mobile-x)!important;
    padding-top:28px!important;
  }
  .project-cover-copy{
    right:var(--mobile-x)!important;
    bottom:112px!important;
    left:var(--mobile-x)!important;
    max-width:calc(100% - 40px)!important;
  }
  .project-cover-copy>p:first-child{margin-bottom:18px!important}
  .project-cover-copy h1{
    max-width:100%;
    font-size:clamp(46px,14vw,60px)!important;
    line-height:.78!important;
    letter-spacing:-.09em!important;
    overflow-wrap:break-word;
  }
  .project-cover-copy>p:last-child{
    max-width:92%!important;
    margin-top:22px!important;
    font-size:16px!important;
    line-height:1.22!important;
  }
  .project-cover-meta{right:var(--mobile-x)!important;bottom:24px!important;left:var(--mobile-x)!important}
  .project-brief,.project-outputs,.project-code{padding-left:var(--mobile-x)!important;padding-right:var(--mobile-x)!important}
  .project-brief h2,.project-outputs h2,.code-intro h2{
    max-width:100%;
    font-size:clamp(44px,13.5vw,58px)!important;
    line-height:.82!important;
  }
  .project-brief p:last-child{font-size:18px!important;line-height:1.24!important}
  .output-frame,.output-frame--wide{min-height:82vw!important}
  .output-frame--wide{min-height:118vw!important}
  .code-window pre{max-width:100%;overflow:auto;font-size:11px!important;line-height:1.6!important}
  .project-variables{grid-template-columns:1fr!important}
  .project-variables div:nth-child(odd),.project-variables div:nth-child(even){padding:16px 0!important;border-left:0!important}
}

/* Short phones and landscape: prioritize collision-free layout over viewport-filling compositions. */
@media (max-width:600px) and (max-height:740px){
  .hero-reel{height:300px!important}
  .hero h1{font-size:clamp(46px,13.8vw,56px)!important}
  .experiment-cover{min-height:760px!important}
}

@media (max-height:520px) and (orientation:landscape){
  .site-nav{height:56px!important}
  .mobile-menu{top:56px!important;max-height:calc(100dvh - 56px)}
  .hero{padding-top:68px!important}
  .hero-reel{height:72dvh!important;min-height:260px!important}
  .hero h1{font-size:clamp(44px,10vw,60px)!important}
  .experimental-index .orbit-stage{padding-top:72px!important}
}

@media (hover:none),(pointer:coarse){
  .primary-link:hover,.work-card:hover,.footer-link:hover span,.nav-contact:hover{transform:none!important}
  .work-card:hover img{transform:none!important}
  .orbit-project:hover img{transform:scale(.95)!important}
}

/* =============================================================
   CRUDO / LAB — MOBILE CONSTELLATION ATLAS v2
   Purpose-built portrait composition for iPhone / touch devices.
   Projects remain independent PNG nodes: no project-to-project lines.
   ============================================================= */
@media (max-width: 850px){
  .experimental-index{
    --lab-mobile-gutter: clamp(18px, 5vw, 24px);
    background:#090908;
  }

  .experimental-index .site-nav{
    padding-left:max(var(--lab-mobile-gutter), env(safe-area-inset-left));
    padding-right:max(var(--lab-mobile-gutter), env(safe-area-inset-right));
  }

  .experimental-index .orbit-stage{
    position:relative;
    min-height:100svh!important;
    padding:
      calc(78px + env(safe-area-inset-top))
      max(var(--lab-mobile-gutter), env(safe-area-inset-right))
      calc(46px + env(safe-area-inset-bottom))
      max(var(--lab-mobile-gutter), env(safe-area-inset-left))!important;
    overflow:hidden;
    background:
      radial-gradient(ellipse 90% 32% at 50% 12%, rgba(var(--lab-red-rgb),.105), rgba(78,14,10,.045) 38%, transparent 72%),
      radial-gradient(ellipse 72% 24% at 50% 47%, rgba(var(--lab-red-rgb),.035), transparent 72%),
      linear-gradient(180deg,#090908 0%,#0b0909 45%,#090908 100%)!important;
  }

  .experimental-index .orbit-stage::before{
    z-index:1;
    inset:0;
    background:
      radial-gradient(ellipse 92% 30% at 50% 15%, rgba(var(--lab-red-rgb),.08), transparent 64%),
      linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.06) 66%,rgba(0,0,0,.38) 100%)!important;
    opacity:1;
  }

  .experimental-index .orbit-stage::after{
    z-index:1;
    background:radial-gradient(ellipse at 50% 42%,transparent 36%,rgba(0,0,0,.48) 100%);
  }

  .experimental-index .attractor-field{z-index:0;opacity:.92}

  .experimental-index .orbit-kicker{
    position:relative!important;
    z-index:5;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    width:100%;
    margin:0!important;
    color:rgba(245,245,243,.62)!important;
    font-size:7.5px!important;
    line-height:1!important;
    letter-spacing:.095em!important;
    white-space:nowrap;
  }
  .experimental-index .orbit-kicker::after{
    content:"08 PIEZAS";
    color:rgba(var(--lab-red-rgb),.88);
    letter-spacing:.11em;
  }

  .experimental-index .orbit-field{
    position:relative;
    z-index:3;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-auto-rows:clamp(132px,36vw,158px);
    column-gap:clamp(10px,3.8vw,18px)!important;
    row-gap:clamp(16px,4.5vw,24px)!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:clamp(30px,7.5vw,42px) 0 0!important;
    overflow:visible;
    transform:none!important;
  }

  .experimental-index .orbit-core{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    grid-column:1/-1;
    grid-row:auto;
    order:-1;
    width:68px!important;
    height:68px!important;
    margin:0 auto clamp(18px,5vw,28px)!important;
    border-color:rgba(255,255,255,.26)!important;
    background:rgba(15,13,13,.62)!important;
    box-shadow:
      0 0 0 11px rgba(var(--lab-red-rgb),.018),
      0 0 34px rgba(var(--lab-red-rgb),.105)!important;
    backdrop-filter:blur(10px);
    transform:none!important;
  }
  .experimental-index .orbit-core::before{inset:-30%!important;border-color:rgba(var(--lab-red-rgb),.18)!important}
  .experimental-index .orbit-core span{font-size:8px;letter-spacing:.045em}
  .experimental-index .orbit-core i{width:6px;height:6px;box-shadow:0 0 12px rgba(var(--lab-red-rgb),.62)}
  .experimental-index .orbit-core small{
    bottom:-21px!important;
    color:rgba(245,245,243,.5)!important;
    font-size:6.5px!important;
    letter-spacing:.11em!important;
  }

  .experimental-index .orbit-project,
  .experimental-index .orbit-project--01,
  .experimental-index .orbit-project--02,
  .experimental-index .orbit-project--03,
  .experimental-index .orbit-project--04,
  .experimental-index .orbit-project--05,
  .experimental-index .orbit-project--06,
  .experimental-index .orbit-project--07,
  .experimental-index .orbit-project--08{
    position:relative!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    display:block;
    width:100%!important;
    height:100%!important;
    min-width:0;
    aspect-ratio:auto!important;
    overflow:visible;
    border-radius:0!important;
    color:#fff;
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
    transform:none!important;
  }

  /* Stagger the right column to keep the orbital rhythm without collisions. */
  .experimental-index .orbit-project:nth-of-type(even){transform:translateY(clamp(10px,2.8vw,15px))!important}

  .experimental-index .orbit-project::before{
    z-index:-1;
    inset:16% 18% 25%;
    border-radius:50%!important;
    background:radial-gradient(circle,rgba(var(--lab-red-rgb),.10),transparent 70%)!important;
    opacity:.32;
    filter:blur(11px);
  }
  .experimental-index .orbit-project::after{
    top:41%;
    left:50%;
    width:3px;
    height:3px;
    background:rgba(245,245,243,.88)!important;
    box-shadow:0 0 0 5px rgba(245,245,243,.028)!important;
  }

  .experimental-index .orbit-project img{
    position:absolute!important;
    top:8px!important;
    right:auto!important;
    bottom:auto!important;
    left:50%!important;
    width:clamp(78px,24vw,104px)!important;
    height:clamp(78px,24vw,104px)!important;
    max-width:none!important;
    object-fit:contain;
    opacity:.94;
    filter:drop-shadow(0 8px 16px rgba(0,0,0,.3)) brightness(1.04)!important;
    transform:translateX(-50%) scale(.96)!important;
    transform-origin:center;
    transition:transform .2s ease,filter .2s ease,opacity .2s ease!important;
  }

  .experimental-index .orbit-project>span{
    top:3px!important;
    left:4px!important;
    color:rgba(var(--lab-red-rgb),.92)!important;
    font-size:7px!important;
    line-height:1;
    letter-spacing:.12em!important;
    text-shadow:none!important;
  }
  .experimental-index .orbit-project>span::after{
    display:inline-block;
    width:18px;
    height:1px;
    margin:0 0 2px 6px;
    background:rgba(var(--lab-red-rgb),.34);
    content:"";
  }

  .experimental-index .orbit-project>b{
    right:4px!important;
    bottom:7px!important;
    left:4px!important;
    display:block;
    max-width:calc(100% - 8px);
    color:rgba(248,248,246,.88)!important;
    font-family:var(--sans)!important;
    font-size:clamp(10.5px,2.85vw,12.5px)!important;
    font-weight:700!important;
    line-height:1.02!important;
    letter-spacing:-.025em!important;
    text-transform:uppercase;
    text-shadow:0 1px 9px rgba(0,0,0,.65)!important;
    opacity:1!important;
    transform:none!important;
  }

  .experimental-index .orbit-project:active::before{opacity:.85}
  .experimental-index .orbit-project:active img{
    opacity:1;
    filter:drop-shadow(0 8px 22px rgba(var(--lab-red-rgb),.16)) brightness(1.13)!important;
    transform:translateX(-50%) scale(.92)!important;
  }
  .experimental-index .orbit-project:active::after{
    background:rgba(var(--lab-red-rgb),.96)!important;
    box-shadow:0 0 0 7px rgba(var(--lab-red-rgb),.06),0 0 18px rgba(var(--lab-red-rgb),.32)!important;
  }

  /* Footer becomes a compact conclusion rather than a second full viewport. */
  .experimental-index .orbit-footer{
    gap:22px!important;
    padding:
      64px
      max(var(--lab-mobile-gutter), env(safe-area-inset-right))
      calc(24px + env(safe-area-inset-bottom))
      max(var(--lab-mobile-gutter), env(safe-area-inset-left))!important;
  }
  .experimental-index .orbit-footer .footer-link{
    font-size:clamp(29px,8.8vw,38px)!important;
    line-height:.92!important;
  }
  .experimental-index .orbit-footer .footer-meta{margin-top:38px!important}
}

@media (max-width: 430px){
  .experimental-index .orbit-field{
    grid-auto-rows:clamp(126px,35vw,146px);
    row-gap:15px!important;
  }
  .experimental-index .orbit-project img{
    width:clamp(74px,23vw,94px)!important;
    height:clamp(74px,23vw,94px)!important;
  }
}

@media (max-width: 380px){
  .experimental-index .orbit-stage{
    padding-left:16px!important;
    padding-right:16px!important;
  }
  .experimental-index .orbit-field{column-gap:8px!important}
  .experimental-index .orbit-project>b{font-size:10px!important}
}

@media (max-width:850px) and (orientation:landscape){
  .experimental-index .orbit-stage{
    padding-top:calc(68px + env(safe-area-inset-top))!important;
  }
  .experimental-index .orbit-field{
    grid-template-columns:repeat(4,minmax(0,1fr));
    grid-auto-rows:118px;
    margin-top:24px!important;
  }
  .experimental-index .orbit-core{
    grid-column:1/-1;
    width:58px!important;
    height:58px!important;
    margin-bottom:12px!important;
  }
  .experimental-index .orbit-project:nth-of-type(even){transform:none!important}
  .experimental-index .orbit-project img{width:72px!important;height:72px!important}
  .experimental-index .orbit-project>b{font-size:9px!important}
}
@media (max-width:850px){
  .experimental-index .orbit-stage{touch-action:pan-y}
}

/* CRUDO / Mobile media + natural scrolling fix — 2026-09-08 */
@media (max-width:600px){
  /* Safari/iPhone: free scrolling. Never force section snapping on touch screens. */
  html{
    scroll-snap-type:none!important;
    scroll-behavior:auto!important;
    scroll-padding-top:calc(64px + env(safe-area-inset-top))!important;
    overscroll-behavior-y:auto!important;
    -webkit-overflow-scrolling:touch;
  }
  body{
    overflow-y:visible!important;
    overscroll-behavior-y:auto!important;
    touch-action:pan-y!important;
    -webkit-overflow-scrolling:touch;
  }
  .hero,.studio,.work,footer,
  .project-sheet>*,.experimental-index .orbit-stage,.experiment-sheet>*{
    scroll-snap-align:none!important;
    scroll-snap-stop:normal!important;
  }

  /* Media frames: size around the image instead of making giant desktop-derived boxes. */
  .hero-reel{
    height:auto!important;
    min-height:0!important;
    aspect-ratio:4 / 5!important;
    max-height:none!important;
  }
  .hero-slide,.hero-slide img{
    width:100%!important;
    height:100%!important;
  }
  .hero-slide img{
    object-fit:cover!important;
    object-position:center center!important;
  }

  .work-card figure,
  .work-card:not(.work-card--featured):not(.work-card--wide) figure{
    height:auto!important;
    min-height:0!important;
    aspect-ratio:4 / 5!important;
  }
  .work-card figure>img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    object-fit:cover!important;
    object-position:center center!important;
  }

  .project-canvas{
    height:auto!important;
    min-height:0!important;
    aspect-ratio:4 / 5!important;
  }
  .project-canvas>img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
  }

  .story-frame--wide,
  .story-pair--reverse .story-frame{
    height:auto!important;
    min-height:0!important;
    aspect-ratio:4 / 5!important;
  }
  .story-frame>img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
  }

  /* LAB output canvases get compact mobile proportions too. */
  .output-frame,.output-frame--wide{
    min-height:0!important;
    height:auto!important;
    aspect-ratio:1 / 1!important;
  }
  .output-frame--wide{aspect-ratio:4 / 5!important}

  /* The LAB index remains vertically scrollable even while pointer/touch events are present. */
  .experimental-index .orbit-stage,
  .experimental-index .orbit-field,
  .experimental-index .orbit-project{
    touch-action:pan-y!important;
  }
}

@media (max-width:430px){
  .hero-reel,.work-card figure,.project-canvas,.story-frame--wide,.story-pair--reverse .story-frame{
    aspect-ratio:3 / 4!important;
  }
}


/* CRUDO / Mobile navigation CTA — integrated as a menu row, not a header pill. */
@media (max-width:850px){
  .mobile-menu .mobile-menu-cta{
    display:flex;
    width:100%;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-top:4px;
    padding-top:20px;
    border-top:1px solid rgba(22,22,22,.16);
    color:inherit;
    transition:opacity 180ms cubic-bezier(.23,1,.32,1),transform 140ms cubic-bezier(.23,1,.32,1);
  }
  .mobile-menu .mobile-menu-cta span{
    flex:0 0 auto;
    font-size:.78em;
    line-height:1;
    transform:translateY(-1px);
  }
  .mobile-menu .mobile-menu-cta:active{transform:scale(.98);opacity:.72}
  .experiment-mobile .mobile-menu-cta{border-top-color:rgba(255,255,255,.18)}
}

@media (hover:hover) and (pointer:fine) and (max-width:850px){
  .mobile-menu .mobile-menu-cta:hover{opacity:.68}
}

/* =============================================================
   CRUDO / iOS natural-scroll hardening — 2026-09-09
   Keep touch scrolling native and keep the conversation CTA only
   inside the mobile dropdown.
   ============================================================= */
@media (max-width:850px){
  /* notch-adaptive.css used to re-display this via .site-nav>.nav-contact */
  .site-nav > .nav-contact{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
  .mobile-menu .mobile-menu-cta{
    display:flex!important;
  }
}

@media (hover:none) and (pointer:coarse){
  html,body{
    scroll-snap-type:none!important;
    scroll-snap-stop:normal!important;
    scroll-behavior:auto!important;
    overscroll-behavior-y:auto!important;
    touch-action:auto!important;
  }
  html{
    overflow-x:hidden!important;
    overflow-y:auto!important;
    height:auto!important;
  }
  body{
    overflow-x:hidden!important;
    overflow-y:visible!important;
    min-height:100%!important;
    height:auto!important;
  }
  body *,
  .hero,.studio,.work,footer,
  .project-sheet,.project-sheet>*,
  .experimental-index .orbit-stage,.experimental-index .orbit-field,
  .experiment-sheet,.experiment-sheet>*{
    scroll-snap-align:none!important;
    scroll-snap-stop:normal!important;
  }
  /* Don't let full-screen sections behave like gesture traps on iOS. */
  .project-sheet,.project-opening,.project-facts,.spatial-note,
  .story-pair,.next-threshold,
  .experimental-index .orbit-stage,.experiment-sheet{
    touch-action:pan-y!important;
  }
  figure,img,canvas{
    touch-action:pan-y!important;
  }
}