/* LA FACTORY — V19 POLISH + TABLET
   Responsive precision, tablet 701–1100,
   spacing/typography consistency.
   Mobile navigation stability fix.
*/

:root{
  --section-space:clamp(96px,10vw,150px);
}

/* HERO SHARPNESS */

.hero-media{
  transform:none!important;
}

/* ACCESSIBILITY */

a,button{
  -webkit-tap-highlight-color:transparent;
}

a:focus-visible,
button:focus-visible{
  outline:2px solid #ff5b19;
  outline-offset:4px;
}

/* TABLET */

@media (min-width:701px) and (max-width:1100px){

  :root{
    --mp:42px;
    --pad:42px;
  }

  .site-header{
    height:74px!important;
    padding:0 var(--mp)!important;
    background:rgba(8,8,8,.90)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }

  .brand{
    position:relative;
    z-index:1002;
    font-size:13px!important;
  }

  .menu-toggle{
    display:block!important;
    position:relative;
    z-index:1002;
    width:44px!important;
    height:44px!important;
    padding:7px!important;
  }

  .menu-toggle span{
    display:block!important;
    width:26px!important;
    height:1px!important;
    background:#fff!important;
    margin:7px auto!important;
  }

  .nav{
    position:fixed!important;
    z-index:1001!important;
    inset:74px 0 0!important;
    width:100vw!important;
    height:calc(100dvh - 74px)!important;
    padding:26px var(--mp) 38px!important;
    background:#080808!important;
    display:none!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:0!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch;
  }

  .nav.open{
    display:flex!important;
  }

  .nav a{
    width:100%!important;
    min-height:58px!important;
    padding:14px 0!important;
    border-bottom:1px solid #242424!important;
    font-size:24px!important;
    line-height:1.05!important;
  }

  body.mobile-menu-open{
    overflow:hidden!important;
  }

  .eyebrow{
    font-size:10px!important;
    letter-spacing:.17em!important;
  }

  .hero h1{
    font-size:clamp(82px,13vw,126px)!important;
    line-height:.80!important;
  }

  .section-head{
    margin-bottom:64px!important;
  }

  .section-head h2,
  .manifesto-copy h2{
    font-size:clamp(52px,7.4vw,78px)!important;
    line-height:.94!important;
  }

  .system,
  .journey,
  .contact{
    padding-left:var(--mp)!important;
    padding-right:var(--mp)!important;
  }

  .hero{
    min-height:720px!important;
  }

  .hero-copy{
    left:var(--mp)!important;
    bottom:13vh!important;
  }

  .claim{
    font-size:15px!important;
    max-width:680px!important;
  }

  .manifesto{
    padding:110px var(--mp)!important;
  }

  .manifesto-copy{
    width:min(620px,72vw)!important;
  }

  .manifesto-copy>p:last-child{
    font-size:17px!important;
    line-height:1.62!important;
  }

  #system .section-head h2{
    display:grid!important;
    grid-template-columns:max-content 36px max-content!important;
    grid-template-rows:auto 28px auto!important;
    justify-content:start!important;
    align-items:center!important;
    column-gap:12px!important;
    row-gap:5px!important;
  }

  #system .section-head h2 span{
    position:static!important;
    white-space:nowrap!important;
  }

  #system .section-head h2 span:nth-of-type(1){
    grid-column:1!important;
    grid-row:1!important;
  }

  #system .section-head h2 span:nth-of-type(2){
    grid-column:3!important;
    grid-row:1!important;
  }

  #system .section-head h2 span:nth-of-type(3){
    grid-column:1!important;
    grid-row:3!important;
  }

  #system .section-head h2 span:nth-of-type(4){
    grid-column:3!important;
    grid-row:3!important;
  }

  #system .section-head h2 span::after{
    content:none!important;
  }

  #system .section-head h2 .system-arrow{
    display:block!important;
    color:#ff4b16!important;
    font-style:normal!important;
    font-size:.66em!important;
    line-height:1!important;
    width:36px!important;
    margin:0!important;
    text-align:center!important;
  }

  #system .section-head h2 .system-arrow:nth-of-type(1){
    grid-column:2!important;
    grid-row:1!important;
  }

  #system .section-head h2 .system-arrow:nth-of-type(2){
    grid-column:2!important;
    grid-row:2!important;
    transform:rotate(90deg)!important;
  }

  #system .section-head h2 .system-arrow:nth-of-type(3){
    grid-column:2!important;
    grid-row:3!important;
  }

  .direction{
    grid-template-columns:42px 74px minmax(0,1fr) 30px!important;
    gap:18px!important;
    min-height:150px!important;
  }

  .direction h3{
    font-size:clamp(24px,3.6vw,36px)!important;
  }

  .direction small{
    font-size:11px!important;
    line-height:1.5!important;
  }

  .betrained{
    grid-template-columns:minmax(0,1.15fr) minmax(240px,.75fr)!important;
    gap:7vw!important;
    padding:110px var(--mp)!important;
  }

  .bt-number{
    display:none!important;
  }

  .bt-main h2{
    font-size:clamp(78px,12vw,116px)!important;
  }

  .bt-data{
    margin-top:0!important;
    align-self:end!important;
  }

  .journey{
    grid-template-columns:1fr 1fr!important;
    gap:7vw!important;
    padding:120px var(--mp)!important;
  }

  .journey-copy{
    padding-top:80px!important;
  }

  .journey-line{
    display:block!important;
    left:50%!important;
  }

  .future{
    min-height:62vh!important;
    padding:90px var(--mp)!important;
  }

  .contact{
    grid-template-columns:1.15fr .85fr!important;
    gap:6vw!important;
    padding:110px var(--mp)!important;
  }

  footer{
    padding:30px var(--mp)!important;
  }

  .statement,
  .open-space,
  .status,
  .origin,
  .vision,
  .founder{
    padding-left:var(--mp)!important;
    padding-right:var(--mp)!important;
  }

  .research-grid,
  .form-grid,
  .network-grid,
  .route-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .research-card,
  .form-card,
  .network-card{
    min-height:340px!important;
  }

  .bt-intro,
  .bt-practice,
  .bt-facts,
  .bt-selection,
  .bt-calendar,
  .bt-fee,
  .bt-origin,
  .bt-action,
  .bt-venue{
    padding-left:var(--mp)!important;
    padding-right:var(--mp)!important;
  }

  .practice-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .bt-venue{
    grid-template-columns:1fr!important;
  }
}

/* PHONE POLISH */

@media (max-width:700px){

  :root{
    --mp:20px;
  }

  .section-head{
    margin-bottom:54px!important;
  }

  .system,
  .journey,
  .contact{
    padding-top:96px!important;
    padding-bottom:96px!important;
  }

  .manifesto{
    padding-top:96px!important;
    padding-bottom:82px!important;
  }

  .direction{
    min-height:132px!important;
  }

  .direction small{
    line-height:1.5!important;
  }

  .bt-main>p,
  .journey-copy>p,
  .contact-side>p{
    font-size:16px!important;
    line-height:1.65!important;
  }

  .cta{
    min-height:44px!important;
    align-items:center!important;
  }
}

/* NARROW PHONES */

@media (max-width:430px){

  #system .section-head h2{
    grid-template-columns:max-content 24px max-content!important;
    column-gap:6px!important;
  }

  #system .section-head h2 .system-arrow{
    width:24px!important;
    font-size:.66em!important;
  }
}

/* MOBILE MENU STABILITY
   Prevent fixed navigation from being clipped
   when the header changes on scroll.
*/

@media (max-width:1100px){

  .site-header,
  .site-header.scrolled{
    transform:none!important;
    filter:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    contain:none!important;
    overflow:visible!important;
    isolation:auto!important;
  }

  .site-header{
    z-index:2000!important;
  }

  .menu-toggle{
    z-index:2002!important;
  }

  .nav{
    z-index:2001!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }

  body.mobile-menu-open{
    overflow:hidden!important;
  }
}

/* MOTION / ACCESSIBILITY */

@media (prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto!important;
  }
}