/* Mobile corrections requested after publishing. Loaded last on every page. */
.mobile-work-toggle{display:none}

@media (max-width:700px){
  /* Contact: a true single-column mobile flow. The form is visibly below the intro. */
  [data-page="contact"] .contact-hero{
    padding:104px 0 64px!important;
    overflow:hidden!important;
  }
  [data-page="contact"] .contact-grid{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
  }
  [data-page="contact"] .contact-copy{
    width:100%!important;
    max-width:none!important;
    margin:0 0 30px!important;
    padding:0!important;
    position:static!important;
    text-align:left!important;
    transform:none!important;
  }
  [data-page="contact"] .contact-copy h1{
    font-size:clamp(2.55rem,13vw,3.65rem)!important;
    line-height:.94!important;
    margin:0 0 20px!important;
    text-align:left!important;
  }
  [data-page="contact"] .contact-copy h1 br{display:none!important}
  [data-page="contact"] .contact-copy p{
    max-width:34rem!important;
    font-size:.98rem!important;
    line-height:1.55!important;
    margin:0 0 12px!important;
  }
  [data-page="contact"] .contact-methods{margin-top:14px!important}
  [data-page="contact"] .mail-link{font-size:1rem!important;margin-top:0!important}
  [data-page="contact"] .contact-form-column{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    transform:none!important;
  }
  [data-page="contact"] .project-form{
    width:100%!important;
    margin:0!important;
    padding:20px!important;
    border-radius:18px!important;
    gap:16px!important;
  }
  [data-page="contact"] .project-form label{font-size:12px!important;gap:7px!important}
  [data-page="contact"] .project-form input,
  [data-page="contact"] .project-form select,
  [data-page="contact"] .project-form textarea{
    min-height:48px!important;
    padding:13px!important;
    font-size:16px!important;
  }

  /* Homepage work: show four compact samples first, then let visitors choose to expand. */
  [data-page="home"] .production-section{padding-bottom:70px!important}
  [data-page="home"] .production-video-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  [data-page="home"] .production-video-grid .portfolio-card{
    border-radius:12px!important;
  }
  [data-page="home"] .production-video-grid .portfolio-card:nth-child(n+5){display:none!important}
  [data-page="home"] .production-video-grid.is-expanded .portfolio-card:nth-child(n+5){display:block!important}
  [data-page="home"] .portfolio-card .production-video-tile{
    aspect-ratio:1/1!important;
  }
  [data-page="home"] .portfolio-caption{
    padding:10px 10px 11px!important;
  }
  [data-page="home"] .portfolio-caption h3{
    font-size:.82rem!important;
    line-height:1.15!important;
  }
  [data-page="home"] .portfolio-caption p{
    display:none!important;
  }
  .mobile-work-toggle{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:max-content;
    margin:22px auto 0;
    padding:11px 16px;
    border:1px solid rgba(13,13,13,.22);
    border-radius:999px;
    background:transparent;
    color:#0d0d0d;
    font:inherit;
    font-size:.9rem;
    font-weight:700;
    cursor:pointer;
  }

  /* Footer: logo first, then three clean link groups side-by-side. */
  .site-footer{padding:48px 0 24px!important}
  .site-footer .footer-main{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:28px 14px!important;
    padding-bottom:30px!important;
  }
  .site-footer .footer-brand{
    grid-column:1/-1!important;
    padding-bottom:20px!important;
    border-bottom:1px solid rgba(255,255,255,.12)!important;
  }
  .site-footer .footer-brand img{width:150px!important}
  .site-footer .footer-brand p{
    max-width:22rem!important;
    margin-top:12px!important;
    font-size:.88rem!important;
    line-height:1.5!important;
  }
  .site-footer .footer-col{
    min-width:0!important;
    gap:9px!important;
  }
  .site-footer .footer-col>span{
    margin:0 0 4px!important;
    font-size:9px!important;
    letter-spacing:.12em!important;
  }
  .site-footer .footer-col a{
    font-size:11px!important;
    line-height:1.35!important;
    overflow-wrap:anywhere!important;
  }
  .site-footer .footer-bottom{
    margin-top:0!important;
    padding-top:18px!important;
    flex-direction:row!important;
    justify-content:space-between!important;
    align-items:flex-start!important;
    gap:14px!important;
    font-size:10px!important;
  }
  .site-footer .footer-bottom span:last-child{text-align:right!important}
}

@media (max-width:390px){
  .site-footer .footer-main{gap:24px 10px!important}
  .site-footer .footer-col a{font-size:10px!important}
}

/* Mobile testimonial marquee — approximately 50% smaller than desktop cards. */
@media (max-width:700px){
  .testimonial-marquee-track{
    gap:.6rem!important;
    padding-inline:.6rem!important;
  }
  .testimonial-marquee-card{
    width:190px!important;
    max-width:48vw!important;
  }
  .testimonial-marquee-card img{
    aspect-ratio:16/10!important;
  }
  .testimonial-marquee-card>div{
    padding:.68rem .68rem .75rem!important;
  }
  .testimonial-marquee-card p{
    font-size:.72rem!important;
    line-height:1.38!important;
    margin:0 0 .48rem!important;
  }
  .testimonial-marquee-card span{
    font-size:.62rem!important;
  }
}