/* SuusStudio™ V0.3 · physical-phone layout hardening
   This file is loaded last. It intentionally keys off the v4-real-phone class set by v4-gpu-gate.js,
   so a physical Android/iPhone cannot accidentally inherit the desktop editorial geometry when Chrome
   exposes a wide layout viewport. */

html.v4-real-phone,
html.v4-real-phone body,
html.v4-real-phone #cinematic-root,
html.v4-real-phone .v4-shell{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  overflow-x:hidden!important;
}

html.v4-real-phone body{padding-bottom:88px!important}

html.v4-real-phone .v4-shell .v4-scene{
  min-height:auto!important;
  height:auto!important;
  padding:92px 18px 78px!important;
  overflow:hidden!important;
}

html.v4-real-phone .v4-shell .v4-scene::before{display:none!important}

html.v4-real-phone .v4-shell .v4-nav{
  height:58px!important;
  min-height:58px!important;
  padding:0 16px!important;
  grid-template-columns:1fr auto!important;
}

html.v4-real-phone .v4-shell .v4-nav>span{display:block!important}
html.v4-real-phone .v4-shell .v4-nav nav{
  position:fixed!important;
  z-index:160!important;
  left:10px!important;
  right:10px!important;
  top:auto!important;
  bottom:10px!important;
  min-height:58px!important;
  padding:5px!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:0!important;
  border:1px solid rgba(242,238,230,.18)!important;
  background:rgba(7,7,9,.97)!important;
  box-shadow:0 18px 56px rgba(0,0,0,.62)!important;
}
html.v4-real-phone .v4-shell .v4-nav nav a{
  min-width:0!important;
  min-height:48px!important;
  display:grid!important;
  place-items:center!important;
  padding:0 4px!important;
  font-size:clamp(.48rem,1.7vw,.62rem)!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
}

html.v4-real-phone .v4-shell .v4-hero{
  min-height:auto!important;
  height:auto!important;
  padding:102px 18px 86px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:34px!important;
}
html.v4-real-phone .v4-shell .v4-hero-copy{
  order:1!important;
  width:100%!important;
  max-width:100%!important;
  padding:46px 0 0!important;
}
html.v4-real-phone .v4-shell .v4-hero-copy h1{
  width:100%!important;
  max-width:100%!important;
  font-size:clamp(3.1rem,10.8vw,6.2rem)!important;
  line-height:.70!important;
  letter-spacing:-.052em!important;
}
html.v4-real-phone .v4-shell .v4-hero-copy h1 span{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  margin-left:0!important;
}
html.v4-real-phone .v4-shell .v4-hero-copy h1 span:nth-child(2){
  width:calc(100% - 14px)!important;
  margin-left:14px!important;
}
html.v4-real-phone .v4-shell .v4-hero-copy h2{
  width:min(92%,620px)!important;
  margin:34px 0 18px!important;
  padding-left:18px!important;
}
html.v4-real-phone .v4-shell .v4-hero-copy>a{margin-left:18px!important;min-height:48px!important}
html.v4-real-phone .v4-shell .v4-founder{
  order:2!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  margin:0!important;
  aspect-ratio:4/5!important;
}
html.v4-real-phone .v4-shell .v4-founder-label{display:none!important}

html.v4-real-phone .v4-shell .v4-scene-head{
  width:100%!important;
  margin:0 auto 38px!important;
  padding-top:28px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  row-gap:16px!important;
}
html.v4-real-phone .v4-shell .v4-scene-head>p,
html.v4-real-phone .v4-shell .v4-scene-head>h2,
html.v4-real-phone .v4-shell .v4-scene-head>span{grid-column:1!important}
html.v4-real-phone .v4-shell .v4-scene-head>h2{
  max-width:100%!important;
  font-size:clamp(2.65rem,8.8vw,5.3rem)!important;
  line-height:.80!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
}

html.v4-real-phone .v4-shell .v4-work{padding-left:0!important;padding-right:0!important}
html.v4-real-phone .v4-shell .v4-work>.v4-scene-head{padding-left:18px!important;padding-right:18px!important}
html.v4-real-phone .v4-shell .v4-work-scene,
html.v4-real-phone .v4-shell .v4-work-scene:nth-of-type(even){
  width:calc(100% - 36px)!important;
  height:auto!important;
  min-height:0!important;
  margin:0 auto 54px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:minmax(300px,52svh) auto!important;
}
html.v4-real-phone .v4-shell .v4-work-scene>.v4-photo,
html.v4-real-phone .v4-shell .v4-work-scene:nth-of-type(even)>.v4-photo{
  position:relative!important;
  inset:auto!important;
  grid-column:1!important;
  grid-row:1!important;
  min-height:300px!important;
  height:52svh!important;
  clip-path:none!important;
}
html.v4-real-phone .v4-shell .v4-work-title,
html.v4-real-phone .v4-shell .v4-work-scene:nth-of-type(even)>.v4-work-title{
  position:relative!important;
  inset:auto!important;
  grid-column:1!important;
  grid-row:2!important;
  padding:26px 22px 34px!important;
  transform:none!important;
  border-left:0!important;
  border-top:1px solid rgba(242,238,230,.16)!important;
}
html.v4-real-phone .v4-shell .v4-work-title h3{font-size:clamp(2.6rem,9.5vw,4.7rem)!important}

html.v4-real-phone .v4-shell .v4-world-stack,
html.v4-real-phone .v4-shell .v4-service-rail,
html.v4-real-phone .v4-shell .v4-price-stage,
html.v4-real-phone .v4-shell .v4-corridor,
html.v4-real-phone .v4-shell .v4-labs,
html.v4-real-phone .v4-shell .v4-pilot{
  width:100%!important;
  max-width:100%!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
html.v4-real-phone .v4-shell .v4-world-stack{display:grid!important;grid-template-columns:1fr!important;gap:0!important}
html.v4-real-phone .v4-shell .v4-world,
html.v4-real-phone .v4-shell .v4-world:nth-child(even){
  width:100%!important;
  min-height:190px!important;
  height:auto!important;
  display:grid!important;
  grid-template-columns:minmax(118px,30%) minmax(0,1fr)!important;
  grid-template-rows:auto!important;
  gap:0!important;
  margin:0!important;
  overflow:hidden!important;
}
html.v4-real-phone .v4-shell .v4-world>img,
html.v4-real-phone .v4-shell .v4-world:nth-child(even)>img{
  position:relative!important;
  inset:auto!important;
  grid-column:1!important;
  grid-row:1!important;
  width:100%!important;
  height:100%!important;
  min-height:190px!important;
  object-fit:cover!important;
  clip-path:none!important;
  transform:none!important;
}
html.v4-real-phone .v4-shell .v4-world>div,
html.v4-real-phone .v4-shell .v4-world:nth-child(even)>div{
  position:relative!important;
  inset:auto!important;
  grid-column:2!important;
  grid-row:1!important;
  padding:20px 16px!important;
  min-width:0!important;
  transform:none!important;
}
html.v4-real-phone .v4-shell .v4-world h3{font-size:clamp(1.7rem,6.8vw,3rem)!important}

html.v4-real-phone .v4-shell .v4-service-rail,
html.v4-real-phone .v4-shell .v4-price-stage,
html.v4-real-phone .v4-shell .v4-system-group>div,
html.v4-real-phone .v4-shell .v4-labs,
html.v4-real-phone .v4-shell .v4-pilot{
  display:grid!important;
  grid-template-columns:1fr!important;
}
html.v4-real-phone .v4-shell .v4-material,
html.v4-real-phone .v4-shell .v4-price,
html.v4-real-phone .v4-shell .v4-system-group article,
html.v4-real-phone .v4-shell .v4-labs a{
  min-height:0!important;
  height:auto!important;
}
html.v4-real-phone .v4-shell .v4-price.is-focus{transform:none!important}

html.v4-real-phone .v4-shell .v4-corridor{
  display:grid!important;
  grid-template-columns:1fr!important;
  padding:0!important;
}
html.v4-real-phone .v4-shell .v4-corridor article{
  min-height:0!important;
  height:auto!important;
  grid-template-columns:44px minmax(0,1fr)!important;
  padding:24px 18px!important;
  transform:none!important;
}
html.v4-real-phone .v4-shell .v4-corridor article p{grid-column:2!important}

html.v4-real-phone .v4-shell .v4-about{
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  gap:34px!important;
}
html.v4-real-phone .v4-shell .v4-about-photo{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:4/5!important;
}
html.v4-real-phone .v4-shell .v4-about-copy h2{font-size:clamp(3.6rem,12vw,7rem)!important}

html.v4-real-phone .v4-shell .v4-drone-stage,
html.v4-real-phone .v4-shell .v4-ai-wall{
  min-height:0!important;
  height:auto!important;
}
html.v4-real-phone .v4-shell .v4-drone-image{height:360px!important;min-height:360px!important}
html.v4-real-phone .v4-shell .v4-ai-wall{display:flex!important;flex-direction:column!important;gap:18px!important}
html.v4-real-phone .v4-shell .v4-ai-collective{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:16/10!important;
}
html.v4-real-phone .v4-shell .v4-ai-nodes{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:auto!important;
  display:flex!important;
  gap:8px!important;
  overflow-x:auto!important;
  padding:8px 0!important;
}
html.v4-real-phone .v4-shell .v4-ai-nodes button,
html.v4-real-phone .v4-shell .v4-ai-nodes button:nth-child(n){
  position:relative!important;
  inset:auto!important;
  flex:0 0 128px!important;
  width:128px!important;
  height:82px!important;
  transform:none!important;
}
html.v4-real-phone .v4-shell .v4-ai-focus{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  transform:none!important;
}

html.v4-real-phone .v4-shell .v4-contact{
  min-height:0!important;
  height:auto!important;
  padding-top:110px!important;
  padding-bottom:120px!important;
}
html.v4-real-phone .v4-shell .v4-contact>h2{font-size:clamp(3.5rem,12vw,7rem)!important}
html.v4-real-phone .v4-shell .v4-contact>div{display:flex!important;flex-direction:column!important;gap:0!important}
html.v4-real-phone .v4-shell .v4-contact footer{grid-template-columns:1fr!important;gap:14px!important}

/* The floating portfolio proof link must sit above the bottom nav instead of fighting it. */
html.v4-real-phone .v4-public-proof-link{
  left:14px!important;
  right:14px!important;
  bottom:82px!important;
  justify-content:center!important;
  min-height:48px!important;
}
