.mobile-menu-toggle{display:none;}
/* V55 MOBILE FIX — mobile-only layout. Desktop (>=901px) is untouched. */
@media (max-width:900px){
  :root{--mobile-pad:20px;--mobile-gold:#c9984d;}
  *{min-width:0;}
  html{scroll-snap-type:none!important;scroll-behavior:smooth;overflow-x:hidden!important;}
  body{width:100%;max-width:100%;overflow-x:hidden!important;-webkit-text-size-adjust:100%;}
  body.mobile-menu-lock{overflow:hidden!important;}
  main,section,header,footer{max-width:100%;}
  img,video{max-width:100%;}

  .shell,.header-inner,.hero-content,.ai-grid,.projects>.shell,.contact-stage,.footer-inner{
    width:calc(100% - (var(--mobile-pad) * 2))!important;
    margin-left:auto!important;margin-right:auto!important;
  }

  /* Compact mobile header + menu */
  .site-header{
    position:sticky!important;top:0!important;z-index:500!important;height:64px!important;
    background:rgba(7,8,8,.96)!important;border-bottom:1px solid rgba(201,152,77,.18)!important;
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  }
  .site-header::before{display:none!important;}
  .header-inner{height:64px!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;}
  .site-header .brand{font-size:17px!important;gap:9px!important;white-space:nowrap!important;color:#f5f0e7!important;}
  .site-header .brand img{width:40px!important;height:40px!important;}
  .mobile-menu-toggle{display:inline-grid!important;place-items:center!important;flex:0 0 44px;width:44px;height:44px;border:1px solid rgba(201,152,77,.42);border-radius:50%;background:rgba(255,255,255,.025);color:#f4eee4;font:700 0/1 Arial;position:relative;z-index:3;}
  .mobile-menu-toggle::before,.mobile-menu-toggle::after,.mobile-menu-toggle span{content:"";position:absolute;width:18px;height:1.5px;background:currentColor;transition:transform .25s ease,opacity .25s ease;}
  .mobile-menu-toggle::before{transform:translateY(-6px)}
  .mobile-menu-toggle::after{transform:translateY(6px)}
  .site-header.mobile-menu-open .mobile-menu-toggle span{opacity:0}
  .site-header.mobile-menu-open .mobile-menu-toggle::before{transform:rotate(45deg)}
  .site-header.mobile-menu-open .mobile-menu-toggle::after{transform:rotate(-45deg)}
  .site-header .main-nav{display:none!important;position:fixed!important;left:0!important;right:0!important;top:64px!important;width:100%!important;margin:0!important;padding:14px var(--mobile-pad) calc(18px + env(safe-area-inset-bottom,0px))!important;background:rgba(7,8,8,.985)!important;border-bottom:1px solid rgba(201,152,77,.2)!important;grid-template-columns:1fr!important;gap:7px!important;box-shadow:0 18px 40px rgba(0,0,0,.4)!important;}
  .site-header.mobile-menu-open .main-nav{display:grid!important;}
  .site-header .main-nav a{display:flex!important;align-items:center!important;justify-content:flex-start!important;min-height:46px!important;padding:0 14px!important;border-radius:10px!important;background:rgba(255,255,255,.035)!important;color:#eee8de!important;font-size:11px!important;letter-spacing:.09em!important;white-space:normal!important;}
  .site-header .main-nav a.active{color:var(--mobile-gold)!important;}
  .site-header .main-nav a.active::after{display:none!important;}

  /* Every main section becomes natural document flow on phones. */
  .hero,.ai,.projects,.contacts{height:auto!important;min-height:0!important;overflow:hidden!important;}

  /* HERO */
  .hero{padding:0 0 42px!important;background:radial-gradient(circle at 60% 14%,#1a1814 0,#0e0e0c 38%,#080808 74%)!important;}
  .hero .ambient-lines,.hero-bear,.hero-quality,.hero-side-note{display:none!important;}
  .hero-vignette{display:none!important;}
  .hero-photo{position:relative!important;left:auto!important;top:auto!important;width:100%!important;height:330px!important;overflow:hidden!important;z-index:1!important;background:linear-gradient(180deg,#11100e,#090909)!important;}
  .hero-photo::after{content:""!important;display:block!important;position:absolute!important;inset:auto 0 0!important;height:34%!important;background:linear-gradient(180deg,transparent,#090909)!important;z-index:2!important;}
  .hero-photo img{position:absolute!important;left:50%!important;top:0!important;height:100%!important;width:auto!important;max-width:none!important;transform:translateX(-50%)!important;object-fit:contain!important;}
  .hero-content{height:auto!important;display:block!important;position:relative!important;z-index:3!important;padding:0!important;margin-top:-34px!important;}
  .hero-copy{padding:0!important;max-width:none!important;}
  .hero .eyebrow{font-size:11px!important;line-height:1.4!important;letter-spacing:.14em!important;}
  .hero h1{font-size:clamp(43px,12vw,54px)!important;line-height:.96!important;letter-spacing:-.045em!important;margin:14px 0 17px!important;gap:.02em!important;max-width:100%!important;}
  .hero h1>span,.hero h1>em{white-space:normal!important;line-height:.98!important;}
  .hero-copy p{font-size:16px!important;line-height:1.55!important;max-width:none!important;margin:0!important;color:#ddd8cf!important;}
  .hero-cta{margin-top:22px!important;gap:14px!important;font-size:12px!important;line-height:1.15!important;}
  .hero .play{width:54px!important;height:54px!important;font-size:23px!important;flex:0 0 54px!important;}

  /* AI — same future API form, only rearranged for a phone */
  .ai{padding:44px 0 50px!important;}
  .ai .ambient-lines,.ai-features{display:none!important;}
  .ai-grid{display:flex!important;flex-direction:column!important;gap:24px!important;padding:0!important;}
  .ai-copy{order:1!important;width:100%!important;}
  .ai .section-kicker{font-size:11px!important;letter-spacing:.14em!important;}
  .ai h2{font-size:clamp(42px,11vw,52px)!important;line-height:.95!important;margin:10px 0 16px!important;letter-spacing:-.045em!important;max-width:100%!important;}
  .ai-copy>p{font-size:16px!important;line-height:1.55!important;max-width:none!important;margin:0 0 22px!important;}
  .upload-button,.generate-button{box-sizing:border-box!important;width:100%!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;border-radius:16px!important;}
  .upload-button{min-height:58px!important;padding:14px 12px!important;font-size:11px!important;line-height:1.25!important;}
  .upload-note{font-size:11px!important;margin:9px 0 0!important;}
  .ai-controls{width:100%!important;max-width:none!important;margin-top:20px!important;}
  .ai-controls label{font-size:11px!important;}
  .ai-controls textarea{width:100%!important;min-height:118px!important;padding:15px!important;border-radius:15px!important;font-size:16px!important;resize:vertical!important;}
  .generate-button{min-height:58px!important;padding:14px!important;font-size:11px!important;letter-spacing:.10em!important;}
  .ai-status{font-size:11px!important;}
  .comparison{order:2!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:4/3!important;border-radius:18px!important;overflow:hidden!important;}
  .after-state strong{font-size:17px!important;}
  .divider button{width:42px!important;height:42px!important;}
  .tag{font-size:11px!important;}

  /* PORTFOLIO */
  .projects{padding:44px 0 52px!important;}
  .projects .ambient-lines{display:none!important;}
  .projects>.shell{padding-top:0!important;}
  .projects-head{display:block!important;margin:0 0 22px!important;}
  .projects .section-kicker{font-size:11px!important;}
  .projects h2{font-size:clamp(39px,10.6vw,50px)!important;line-height:.96!important;letter-spacing:-.045em!important;margin:9px 0 0!important;max-width:100%!important;}
  .projects-intro{margin-top:16px!important;}
  .projects-intro p{font-size:14px!important;line-height:1.5!important;}
  .projects-rule{margin-top:14px!important;}
  .project-grid{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;height:auto!important;}
  .project-card{height:280px!important;min-height:0!important;border-radius:18px!important;}
  .card-copy{left:18px!important;right:18px!important;bottom:18px!important;}
  .card-copy small{font-size:11px!important;}
  .card-copy h3{font-size:clamp(25px,7.7vw,31px)!important;line-height:1!important;margin:7px 0 8px!important;}
  .card-copy p{font-size:12px!important;line-height:1.4!important;max-width:100%!important;}

  /* CONTACTS */
  .contacts{padding:46px 0 54px!important;}
  .contacts .ambient-lines,.contact-orbit,.contact-art{display:none!important;}
  .contact-stage{display:block!important;padding:0!important;min-height:0!important;}
  .contact-copy h2{font-size:clamp(42px,11vw,52px)!important;line-height:.95!important;letter-spacing:-.04em!important;margin:12px 0 17px!important;max-width:100%!important;}
  .contact-copy>p{font-size:16px!important;line-height:1.55!important;max-width:none!important;}
  .contact-links{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;justify-content:stretch!important;margin-top:24px!important;}
  .contact-links a{width:auto!important;min-height:108px!important;padding:13px 8px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;border:1px solid rgba(201,152,77,.22)!important;border-radius:17px!important;background:rgba(255,255,255,.025)!important;font-size:11px!important;}
  .contact-links .contact-icon{width:54px!important;height:54px!important;margin:0 0 9px!important;}

  footer{height:auto!important;padding:18px 0 calc(20px + env(safe-area-inset-bottom,0px))!important;}
  .footer-inner{height:auto!important;display:grid!important;grid-template-columns:1fr!important;gap:14px!important;align-items:start!important;}
  .footer-inner .brand{font-size:16px!important;}
  .footer-inner .brand img{width:38px!important;height:38px!important;}
  .footer-inner nav{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px 16px!important;width:100%!important;}
  .footer-inner nav a{font-size:10px!important;}
  .copyright{font-size:9px!important;}
}

@media (max-width:380px){
  :root{--mobile-pad:16px;}
  .hero h1{font-size:41px!important;}
  .ai h2,.projects h2,.contact-copy h2{font-size:39px!important;}
  .project-card{height:250px!important;}
}


/* V56 — real iPhone comparison-slider ergonomics. */
@media (max-width:900px){
  .comparison{
    touch-action:pan-y!important;
    -webkit-user-select:none!important;
    user-select:none!important;
    cursor:ew-resize!important;
  }
  .comparison img,.comparison .after-wrap,.comparison .tag,.comparison .after-state{
    pointer-events:none!important;
    -webkit-user-drag:none!important;
  }
  .divider{
    width:56px!important;
    margin-left:-28px!important;
    transform:none!important;
    background:transparent!important;
    pointer-events:none!important;
  }
  .divider::before{
    content:"";
    position:absolute;
    top:0;bottom:0;left:50%;
    width:2px;
    transform:translateX(-50%);
    background:rgba(255,255,255,.86);
  }
  .divider button{
    width:52px!important;
    height:52px!important;
    pointer-events:none!important;
  }
}