/* Impeccable adapt — restructure per context (phone / tablet / touch / print).
   Not a pixel scale of desktop. Identity stays Ink / Action. */

/* ── Shared: never use 100vw as a layout width ── */
html,
body,
.site-header,
body > main,
.ds-shell,
.ds-main {
  max-width: 100%;
}

html,
body,
body > main,
.site-header {
  max-width: 100% !important;
}

.ds-drawer.vt-slideover {
  width: min(26.5rem, calc(100% - 1.5rem));
  max-width: min(26.5rem, calc(100% - 1.5rem));
}

/* Course cards: readable measure. 16.5rem packed 4 skinny columns. */
.services-catalog-section .grid,
#services-grid,
#services-preview-grid,
#merch-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 22.5rem), 1fr));
  gap: clamp(1.25rem, 2.5vw, 1.75rem);
}

@media (min-width: 1100px) {
  .services-catalog-section .grid,
  #services-grid,
  #services-preview-grid,
  #merch-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* ── Touch / stylus: thumbs, not hover ── */
@media (pointer: coarse) {
  .ds-topbar__icon-btn,
  .ds-topbar__burger,
  .ds-topbar__site,
  .ds-nav__item,
  .ds-nav__sub-trigger,
  .ds-spotlight-trigger,
  .nav__toggle,
  .footer-socials a,
  .cmtb-onboard-path__skip,
  .cmtb-offline button {
    min-width: 44px;
    min-height: 44px;
  }

  /* Icon-only account control is intentional ≤900px (ds-public-nav). On tablet
     desktop nav (901px+) the full « Mon compte » label must not be crushed. */
  @media (max-width: 900px) {
    body:not(.ds-body):not(.admin-body) .site-header .nav__cta .nav__account {
      width: 44px !important;
      height: 44px !important;
      min-height: 44px !important;
    }
  }

  .btn,
  .btn--sm,
  a.btn {
    min-height: 44px;
  }

  input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='range']),
  select,
  textarea {
    font-size: max(1rem, 16px);
    min-height: 44px;
  }

  textarea {
    min-height: 6.5rem;
  }
}

@media (hover: none) {
  .service-card:hover,
  .newsroom-card:hover,
  .coach-card:hover,
  .account-kpi:hover,
  .footer-socials a:hover {
    transform: none;
  }

  .btn:active,
  a.btn:active,
  .ds-nav__item:active,
  .nav__link:active {
    opacity: 0.88;
  }
}

/* ── Phone: one column, primary job first ── */
@media (max-width: 767px) {
  .cmtb-onboard-path__inner {
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
  }

  .cmtb-onboard-path__actions {
    margin-left: 0;
    width: 100%;
  }

  .cmtb-onboard-path__actions .btn {
    flex: 1 1 auto;
    justify-content: center;
  }

  body.lp-home .hero__cta,
  .cta-band .hero__cta {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.65rem;
  }

  body.lp-home .hero__cta .btn,
  .cta-band .hero__cta .btn {
    width: 100%;
    justify-content: center;
  }

  .form-row,
  .glass-form .form-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.75rem;
  }

  .form-field--birth-tripart__grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.ds-body--account .sz-kpi-row,
  body.ds-body--account .account-kpi-grid.sz-kpi-row,
  body.ds-body--admin .admin-kpi-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  @media (min-width: 380px) {
    body.ds-body--account .sz-kpi-row,
    body.ds-body--account .account-kpi-grid.sz-kpi-row,
    body.ds-body--admin .admin-kpi-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
  }

  .admin-table-scroll,
  .account-table-wrap,
  table {
    max-width: 100%;
  }

  .admin-table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  body.pub-page .page-hero,
  body.pub-page .pub-hero {
    min-height: 0 !important;
  }
}

@media (max-width: 359px) {
  body:not(.ds-body):not(.admin-body) .nav__brand-wordmark {
    display: none;
  }

  .container {
    padding-left: max(0.75rem, env(safe-area-inset-left, 0px));
    padding-right: max(0.75rem, env(safe-area-inset-right, 0px));
  }

  body.ds-body--account .sz-kpi-row,
  body.ds-body--account .account-kpi-grid.sz-kpi-row,
  body.ds-body--admin .admin-kpi-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* ── Landscape phone: don’t lock a tall hero; keep booking controls reachable ── */
@media (orientation: landscape) and (max-height: 500px) {
  body.lp-home .hero,
  body.lp-home .hero--stage,
  body.pub-page .page-hero,
  body.pub-page .pub-hero,
  body.ds-booking-body .page-hero {
    min-height: 0 !important;
    padding-bottom: 1rem !important;
  }

  .booking__nav {
    position: sticky;
    bottom: 0;
    z-index: 5;
    padding-bottom: max(0.5rem, env(safe-area-inset-bottom, 0px));
    background: var(--bg-0, #08090c);
  }
}

/* ── Tablet: two-up where it earns width; keep drawer nav on dashboards ── */
@media (min-width: 768px) and (max-width: 1023px) {
  body.lp-home .lp-who__grid {
    grid-template-columns: minmax(10rem, 0.7fr) minmax(0, 1.3fr);
    align-items: start;
  }

  .services-catalog-section .grid,
  #services-grid,
  #services-preview-grid,
  #merch-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .form-row:not(:has(.form-field--birth-tripart)) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
  }

  body.ds-booking-body .booking-pay-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Compact public nav before hamburger (901px) */
@media (min-width: 901px) and (max-width: 1180px) {
  body:not(.ds-body):not(.admin-body) .nav__links {
    gap: 0.2rem;
  }

  body:not(.ds-body):not(.admin-body) .nav__link {
    padding-inline: 0.45rem;
    font-size: 0.86rem;
  }
}

/* ── Wide desktop: use width, don’t stretch to 4K ── */
@media (min-width: 1280px) {
  body:not(.ds-body):not(.admin-body) .container {
    max-width: min(var(--container-max, 1200px), 100%);
  }

  body.ds-body .ds-main > * {
    max-width: min(var(--ds-content-max, 72rem), 100%);
  }
}

/* ── Forced colors / high contrast ── */
@media (forced-colors: active) {
  .btn,
  .nav__link,
  .ds-nav__item {
    border: 1px solid CanvasText;
  }
}

/* ── Print: the lesson / legal text, not the app chrome ── */
@media print {
  .site-header,
  .site-footer,
  .cmtb-onboard-path,
  .cmtb-skip,
  .cmtb-offline,
  .site-banner,
  .cm-chat-root,
  .nav__toggle,
  .ds-sidebar,
  .ds-topbar,
  .ds-drawer-backdrop,
  .scroll-progress {
    display: none !important;
  }

  body,
  body > main,
  body.ds-body,
  html.ds-shell-root {
    height: auto !important;
    overflow: visible !important;
    background: #fff !important;
    color: #111 !important;
  }

  a[href]::after {
    content: none;
  }
}

/* ── Footer: brand first, then lists — never five slivers ── */
@media (max-width: 1099px) {
  .footer-grid--expanded {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .footer-brand--lead {
    grid-column: 1 / -1;
  }
}

@media (max-width: 479px) {
  .footer-grid--expanded {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 900px) {
  .coachs-top-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Home “where” facts: 4-up only when each cell can breathe */
@media (max-width: 639px) {
  .lp-where__grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (min-width: 640px) and (max-width: 959px) {
  .lp-where__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Inner-page 3-up choice grids: one column until tablet is truly wide */
@media (max-width: 859px) {
  .pub-choice-grid,
  .pub-value-grid,
  body.pub-page #comparaison .grid.grid-3 {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Booking formula cards: one column on the smallest phones */
@media (max-width: 419px) {
  .mobile-card-selector__list.booking-choice-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Session detail meta: two-up, then four when the rail is gone */
@media (max-width: 899px) {
  .sd-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 419px) {
  .sd-meta {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Dashboard KPIs: 4-up starts too early at 900px */
@media (max-width: 1099px) {
  body.ds-body--account [data-tab-panel="overview"] .account-kpi-grid.sz-kpi-row,
  body.ds-body--admin .admin-kpi-grid,
  body.ds-body--admin #vt-ops-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 379px) {
  body.ds-body--account [data-tab-panel="overview"] .account-kpi-grid.sz-kpi-row,
  body.ds-body--admin .admin-kpi-grid,
  body.ds-body--admin #vt-ops-kpis {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Last-cascade lock: titles clear the floating nav. Hero owns clearance; do not pull it up. */
body.pub-page > main,
body.ds-booking-body > main,
body.page-legal > main,
body.lp-home > main {
  padding-top: 0 !important;
}

body.account-auth-page > main,
body.season-lock-body > main {
  padding-top: var(--site-header-offset) !important;
}

body.pub-page main > .page-hero,
body.pub-page main > .pub-hero,
body.pub-page main > section.page-hero,
body.ds-booking-body main > .page-hero,
body.page-legal main > .page-hero,
body.page-legal main > .page-hero--legal,
body.lp-home .hero,
body.lp-home .hero--stage {
  margin-top: 0 !important;
  padding-top: var(--page-hero-pad-top) !important;
}
