html{max-width:100%;overflow-x:hidden}
body{max-width:100%;min-width:0;overflow-x:hidden}
img,video{max-width:100%;height:auto}
svg{max-width:100%;height:auto}
#container{max-width:100%;min-width:0}
video[autoplay]{object-fit:cover}

@media (max-width:800px){
  header{position:relative;z-index:30}
  #main-nav{max-width:100vw}
  #menu-wrapper{width:100vw;max-width:100%;overflow:auto}
  #plan{width:100%;max-width:100%;transform:none!important}
  #plan>a{transform:scale(.72)}
  main{max-width:100%;padding-left:18px;padding-right:18px}
  main h1{max-width:100%;font-size:clamp(34px,11vw,64px);line-height:1.02}
  #intro{max-width:100%;font-size:16px}
  #bgvid{width:100%;min-width:100%;height:100dvh;object-fit:cover}
  #videos{display:grid!important;grid-template-columns:1fr 1fr;gap:10px}
  #videos a,#videos video{width:100%!important;height:auto!important}
  #img-wrapper{max-width:100%}
  footer{max-width:100%;padding-left:18px;padding-right:18px}
  .liens{font-size:32px!important}
  #creation,#comparaison,#recensement,#essai,#rayon,#champignon,
  .creation,.comparaison,.recensement,.essai,.rayon,.champignon{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}
  svg[width]{min-width:720px}
  #menu-wrapper svg[width],header svg[width],#img-wrapper svg[width]{min-width:0}
}

@media (max-width:480px){
  #videos{grid-template-columns:1fr}
  #main-nav li a{font-size:15px}
  #menu-wrapper h1{font-size:24px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}