
/* =========================================================
   MIKHAIL V13.11.18.5 — HOME RESPONSIVE HERO BALANCE
   Fluid correction for all viewport widths.
   Reduces oversized hero film and excessive vertical black space.
   ========================================================= */

/* Desktop / wide display:
   keep the hero elegant, but stop the film from filling the screen. */
.maison-home .v13-hero{
  width:min(92vw,1440px)!important;
  max-width:1440px!important;
  min-height:0!important;
  grid-template-columns:minmax(0,1fr) minmax(280px,390px)!important;
  justify-content:center!important;
  align-items:center!important;
  column-gap:clamp(42px,5vw,88px)!important;
  padding-top:clamp(30px,3.2vw,52px)!important;
  padding-bottom:clamp(30px,3.2vw,52px)!important;
}

.maison-home .v13-hero-copy{
  width:min(100%,650px)!important;
  max-width:650px!important;
  padding:0!important;
  justify-self:end!important;
}

.maison-home .v13-hero h1{
  font-size:clamp(48px,4.15vw,72px)!important;
  line-height:.96!important;
}

.maison-home .v13-hero p{
  max-width:560px!important;
}

/* Main hero video reduced substantially from the previous responsive size. */
.maison-home .v13-film-shell{
  width:100%!important;
  max-width:390px!important;
  justify-self:start!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

.maison-home .v13-film{
  width:min(100%,390px)!important;
  max-width:390px!important;
  height:auto!important;
  aspect-ratio:4/5!important;
  max-height:min(58vh,500px)!important;
  margin:0!important;
}

.maison-home .v13-film video,
.maison-home .v13-film img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  object-fit:cover!important;
}

/* Keep the rest of the homepage vertically tighter as screen width grows. */
.maison-home .v13-manifesto,
.maison-home .v13-close{
  padding-top:clamp(38px,4vw,64px)!important;
  padding-bottom:clamp(38px,4vw,64px)!important;
}

/* Standard desktop / laptop */
@media (max-width:1500px){
  .maison-home .v13-hero{
    width:min(91vw,1240px)!important;
    grid-template-columns:minmax(0,1fr) minmax(280px,350px)!important;
    column-gap:clamp(34px,4vw,66px)!important;
  }
  .maison-home .v13-film-shell,
  .maison-home .v13-film{
    max-width:350px!important;
  }
  .maison-home .v13-film{
    max-height:min(56vh,450px)!important;
  }
}

/* Narrow desktop / tablet landscape:
   retain two columns while they comfortably fit. */
@media (max-width:1120px) and (min-width:861px){
  .maison-home .v13-hero{
    width:min(92vw,980px)!important;
    grid-template-columns:minmax(0,1fr) minmax(250px,310px)!important;
    column-gap:32px!important;
  }
  .maison-home .v13-hero-copy{
    justify-self:start!important;
  }
  .maison-home .v13-film-shell,
  .maison-home .v13-film{
    max-width:310px!important;
  }
}

/* Tablet and mobile:
   stack naturally, with the film much smaller than the text block. */
@media (max-width:860px){
  .maison-home .v13-hero{
    width:min(92vw,720px)!important;
    grid-template-columns:1fr!important;
    row-gap:28px!important;
    padding-top:30px!important;
    padding-bottom:38px!important;
  }
  .maison-home .v13-hero-copy{
    width:100%!important;
    max-width:640px!important;
    justify-self:center!important;
  }
  .maison-home .v13-film-shell{
    width:min(72vw,330px)!important;
    max-width:330px!important;
    justify-self:center!important;
  }
  .maison-home .v13-film{
    width:100%!important;
    max-width:330px!important;
    max-height:none!important;
  }
}

@media (max-width:520px){
  .maison-home .v13-film-shell{
    width:min(78vw,300px)!important;
  }
  .maison-home .v13-film{
    max-width:300px!important;
  }
  .maison-home .v13-hero h1{
    font-size:clamp(43px,13vw,58px)!important;
  }
}
