/* ==========================================================================
   Responsive — Cabinet Dentaire de Satigny
   Desktop-first: maquette = 1728px, scale down
   ========================================================================== */

/* --- Large desktop (< 1728px) --- */
@media (max-width: 108rem) {
  .quick-info {
    min-width: 100%;
  }
}

/* --- Desktop (< 1440px) --- */
@media (max-width: 90rem) {
  .nav__menu {
    margin-left: 4rem;
    gap: 2rem;
  }

  .service-card {
    width: 100%;
    max-width: 30rem;
  }

  .services-grid__items {
    padding: 0 5%;
  }

  .footer__top {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }

  .nav__submenu-card {
    flex: 1 1 calc(50% - 1rem);
  }
}

/* --- Tablet (< 1024px) --- */
@media (max-width: 64rem) {
  :root {
    --fs-hero: 3.5rem;
    --fs-80: 3rem;
    --fs-50: 2.25rem;
    --fs-44: 2rem;
    --fs-26: 1.375rem;
    --fs-24: 1.25rem;
    --nav-height: 4.5rem;
  }

  body {
    font-size: var(--fs-20);
  }

  /* Nav - mobile */
  .nav {
    padding: 0 1.5rem;
  }

  .nav__menu,
  .nav__actions {
    display: none;
  }

  .nav__hamburger {
    display: flex;
  }

  .nav--open .nav__menu {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: var(--nav-height);
    left: 0;
    right: 0;
    background: var(--color-white);
    padding: 2rem 1.5rem;
    box-shadow: 0 8px 32px rgba(0,0,0,0.1);
    gap: 0;
    margin-left: 0;
    z-index: 100;
  }

  .nav--open .nav__item {
    height: auto;
    padding: 1rem 0;
    border-bottom: 1px solid var(--color-accent-light);
  }

  .nav--open .nav__actions {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: auto;
    left: 0;
    right: 0;
    background: var(--color-white);
    padding: 1rem 1.5rem;
    gap: 1rem;
  }

  .nav--open .nav__submenu {
    position: static;
    box-shadow: none;
    padding: 0.5rem 0 0 1rem;
    display: block;
  }

  .nav--open .nav__submenu--cards {
    position: static;
    width: 100%;
    padding: 1rem 0;
    margin-left: 0;
    transform: none;
    border-radius: 0;
  }

  .nav:has(.nav__item:hover .nav__submenu--cards)::after {
    display: none;
  }

  .nav__submenu-grid {
    flex-direction: column;
    gap: 1rem;
  }

  .nav__submenu-card {
    padding: 1.5rem 1rem;
    min-width: auto;
    max-width: none;
    flex: 1 1 auto;
  }

  .nav__submenu-card-image {
    width: 80px;
  }

  .nav__submenu-card-title {
    font-size: var(--fs-20);
  }

  .nav__submenu-card-subtitle {
    font-size: var(--fs-14);
  }

  .nav__submenu-card-arrow {
    width: 32px;
    height: 32px;
    bottom: 1rem;
    right: 1rem;
  }

  /* Quick links */
  .quick-links {
    flex-direction: column;
    padding: 1.5rem;
  }

  .quick-link {
    width: 100%;
  }

  .quick-info {
    min-width: 100%;
  }

  .quick-info__image {
    display: none;
  }

  /* Services grid */
  .services-grid__items {
    flex-direction: column;
    align-items: center;
  }

  .service-card {
    width: 100%;
    max-width: none;
  }

  /* Reviews */
  .reviews__grid {
    grid-template-columns: 1fr;
  }

  /* CTA section */
  .cta-section {
    flex-direction: column;
  }

  .cta-section__image {
    width: 100%;
    height: 20rem;
  }

  .cta-section__bg {
    padding: 3rem 2rem;
  }

  /* Contact */
  .contact-body {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  /* FAQ */
  .faq {
    padding: 2rem 1.5rem;
  }

  /* Urgence quick links — hérite du responsive .quick-links */

  .dual-list__grid {
    grid-template-columns: 1fr;
  }

  /* Process */
  .process__steps {
    grid-template-columns: 1fr;
  }

  /* Service showcase */
  .service-showcase__grid {
    grid-template-columns: 1fr;
  }

  /* Related */
  .related-services__grid {
    grid-template-columns: 1fr;
  }

  /* Info sections */
  .info-section__columns {
    grid-template-columns: 1fr;
  }

  /* Team */
  .team__row {
    grid-template-columns: 1fr;
    gap: 1.5rem;
    margin-bottom: 2rem;
  }

  .team__category {
    margin-bottom: 0;
  }

  /* Buttons */
  .btn {
    padding: 1rem 2.5rem;
    font-size: var(--fs-20);
  }

  .hero__buttons {
    flex-direction: column;
    align-items: center;
  }

  .services-grid__buttons {
    flex-direction: column;
    align-items: center;
  }

  /* Footer */
  .footer__top {
    grid-template-columns: 1fr 1fr;
  }

  .footer__bottom {
    flex-direction: column;
    gap: 1rem;
    text-align: center;
  }
}

/* --- Mobile (< 640px) --- */
@media (max-width: 40rem) {
  :root {
    --fs-hero: 2.5rem;
    --fs-80: 2.25rem;
    --fs-50: 1.75rem;
    --fs-44: 1.5rem;
    --fs-26: 1.25rem;
    --fs-24: 1.125rem;
    --fs-23: 1.125rem;
  }

  .hero--page .hero__grid {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .hero--image-left .hero__grid {
    grid-template-columns: 1fr;
  }

  .hero--page .hero__image {
    order: -1;
    max-height: 50vh;
  }

  .hero--page .hero__image img {
    max-height: 50vh;
  }

  .hero--page .hero__content,
  .page-content,
  .service-detail,
  .process,
  .service-showcase,
  .team,
  .facilities,
  .affiliations,
  .info-section,
  .related-services,
  .warning-signs,
  .dual-list,
  .urgence-relief,
  .urgence-warning {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .footer {
    padding: 3rem 1.25rem;
  }

  .footer__top {
    grid-template-columns: 1fr;
  }

  .footer__col--empty {
    display: none;
  }

  .reviews {
    padding: 3rem 1.25rem;
  }

  .member-card--empty {
    display: none;
  }

  /* Team modal mobile */
  .team-modal__card {
    padding: 1.5rem;
    max-height: 95vh;
  }

  .team-modal__body {
    flex-direction: column;
    gap: 1.25rem;
  }

  .team-modal__photo-col {
    flex: none;
    width: 160px;
    margin: 0 auto;
  }

  .team-modal__footer {
    flex-direction: column;
    gap: 0.75rem;
  }

  .team-modal__footer-right {
    width: 100%;
    flex-direction: column;
  }

  .team-modal__btn--next,
  .team-modal__btn--close {
    width: 100%;
    text-align: center;
  }

  .team-modal__btn--prev {
    padding-left: 1.5rem;
    align-self: center;
  }

  /* Gallery mobile */
  .gallery[data-count="2"],
  .gallery[data-count="3"],
  .gallery[data-count="4"] {
    grid-template-columns: 1fr 1fr;
  }

  .gallery[data-count="5"] .gallery__row--top,
  .gallery[data-count="5"] .gallery__row--bottom {
    grid-template-columns: 1fr 1fr;
  }

  .gallery[data-count="5"] .gallery__item {
    height: 12rem;
  }

  .gallery[data-count="5"] .gallery__row--bottom .gallery__item {
    height: 10rem;
  }

  .gallery[data-count="3"] .gallery__item:first-child {
    grid-row: span 1;
    grid-column: span 2;
  }

  .gallery--portrait {
    max-width: 80%;
  }

  .gallery--cycle {
    grid-template-columns: 1fr 1fr;
  }

  .gallery__item--span2,
  .gallery__item--span3 {
    grid-column: span 1;
  }

  .gallery__item--span6 {
    grid-column: span 2;
  }

  .gallery[data-count="1"] .gallery__item {
    min-height: 200px;
  }

  .services-overview {
    padding: 2rem 1.25rem;
    flex-direction: column;
  }

  .services-overview__card {
    min-width: 100%;
  }

  .warning-signs__list {
    grid-template-columns: 1fr;
  }

  .urgence-relief__grid {
    grid-template-columns: 1fr;
  }

  .quick-links {
    padding: 1rem;
  }

  .affiliations__grid {
    justify-content: center;
  }
}