/* ════════════════════════════════════════════════════════════════
   HELLOJET — SYSTÈME RESPONSIVE INTERNATIONAL
   Standards: Apple HIG · Material Design 3 · Bootstrap 5 · Tailwind
   ════════════════════════════════════════════════════════════════ */

/* RESET UNIVERSEL */
*, *::before, *::after { box-sizing: border-box; }

html {
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

html, body {
  width: 100%;
  max-width: 100vw;
  overflow-x: hidden;
}

img, video, picture, svg { max-width: 100%; }

/* GARDE-FOU UNIVERSEL ANTI-DEBORD */
* { max-width: 100%; }
img, iframe, video, embed, object { max-width: 100%; height: auto; }
table { width: 100%; max-width: 100%; }
pre, code { max-width: 100%; overflow-x: auto; }

/* VARIABLES GLOBALES — fluid + breakpoint progressive */
:root {
  --safe-margin: 20px;
  --container-pad: 20px;
  --section-padding-y: 60px;
  --gap-sm: 12px;
  --gap-md: 16px;
  --gap-lg: 24px;
  --gap-xl: 32px;
  --container-xl: 1200px;
  --container-xxl: 1400px;
  --container-xxxl: 1600px;
  --hero-text-max: 800px;
  --hero-config-max: 1100px;
  --grid-max: 1320px;
}

@media (min-width: 480px) {
  :root { --section-padding-y: 72px; }
}
@media (min-width: 768px) {
  :root { --container-pad: 32px; --section-padding-y: 80px; }
}
@media (min-width: 1024px) {
  :root { --section-padding-y: 96px; --hero-text-max: 900px; }
}
@media (min-width: 1280px) {
  :root { --container-pad: 48px; --section-padding-y: 100px; }
}
@media (min-width: 1536px) {
  :root { --container-pad: 64px; --section-padding-y: 110px; --grid-max: 1440px; }
}
@media (min-width: 1920px) {
  :root { --container-pad: 80px; --section-padding-y: 120px; --grid-max: 1500px; --hero-text-max: 1000px; --hero-config-max: 1150px; }
}
@media (min-width: 2560px) {
  :root { --container-pad: 120px; --section-padding-y: 140px; --grid-max: 1680px; --hero-text-max: 1100px; --hero-config-max: 1200px; }
}

/* CONTAINER UNIVERSEL — pattern Andy Bell width:min() */
.container,
.section-container,
.hero-container,
.destinations-container,
.why-container,
.features-container,
.results-container,
.payment-container {
  width: min(var(--container-xl), 100% - var(--safe-margin) * 2);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}

@media (min-width: 1280px) {
  .container,
  .destinations-container,
  .why-container,
  .features-container {
    max-width: var(--container-xxl);
  }
}

@media (min-width: 1920px) {
  .container,
  .destinations-container,
  .why-container,
  .features-container {
    max-width: var(--container-xxxl);
  }
}

/* HERO — centrage strict */
.hero-content {
  width: min(var(--hero-text-max), 100% - var(--safe-margin) * 2);
  margin-inline: auto;
  text-align: center;
}

.hero-bottom {
  width: min(var(--hero-config-max), 100% - var(--safe-margin) * 2);
  margin-inline: auto;
}

.trust-badges,
.trust-signals {
  width: min(var(--hero-config-max), 100% - var(--safe-margin) * 2);
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--gap-sm);
}

/* iOS Safe Area (notch) */
@supports (padding: max(0px)) {
  .nav,
  .site-header {
    padding-left: max(var(--container-pad), env(safe-area-inset-left));
    padding-right: max(var(--container-pad), env(safe-area-inset-right));
  }
  .hero-video-section,
  .hero-section {
    padding-left: max(var(--container-pad), env(safe-area-inset-left));
    padding-right: max(var(--container-pad), env(safe-area-inset-right));
  }
}

/* Accessibilité — focus visible */
:focus-visible {
  outline: 2px solid var(--green, #00a878);
  outline-offset: 2px;
}

::selection {
  background: var(--green, #00a878);
  color: white;
}

/* Motion réduite */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Print */
@media print {
  .nav, .hero-bg-video, .config-shell, footer { display: none !important; }
}