﻿/* ============================================================
   INFINITY WRITER - RESPONSIVE
   ============================================================ */


/* ============================================================
   TABLETTES / PETITS ECRANS
   ============================================================ */

@media (max-width: 900px) {

  .hub-page {
    overflow: auto;
  }

  .hub {
    grid-template-columns: 1fr;
    gap: 30px;
    padding-top: 7vh;
  }

  .hub h1 {
    font-size: clamp(48px, 12vw, 72px);
  }

  .destination-nav {
    min-height: auto;
  }

  .hub-footer {
    position: static;
    padding: 20px 4vw;
  }

  .content-main {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}


/* ============================================================
   ACCESSIBILITE - REDUCTION DES ANIMATIONS
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }

  .intro__video {
    transform: none;
  }
}
