/**
 * Post-Webflow mobile overrides for the production homepage.
 * Loaded after la-villa-belle-rive.webflow.css so these win over broken
 * `var(--<unknown|variable-…>)` padding rules in the export.
 * Re-link after each Webflow re-export (see POST-WEBFLOW-EDIT-LOG.md).
 */

/* Restore padding-card (base export uses an invalid CSS variable) */
.padding-card {
  padding: var(--_sizes---card--card-padding);
}

/* Fix image-strip negative offset (export uses undefined --35rem / --size-gap--sm) */
.ix_hero-offset-left {
  margin-left: calc(-1 * (var(--_sizes---width--sm) + var(--_sizes---gap--sm-gap)));
}

/* Hero: center “Votre événement, notre expertise” */
.hero-expertise {
  text-align: center;
  align-items: center;
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}

.hero-expertise .subheading {
  text-align: center;
}

/* Evénements privés / pro — visible outer + inner padding
   (.bg is white with 0 gap, so section padding alone looked empty) */
.section-event {
  padding-top: var(--_sizes---section--section-padding-vertical) !important;
  padding-bottom: var(--_sizes---section--section-padding-vertical) !important;
}

.section-event .grid_2-col.bg {
  padding: var(--_sizes---spacing--2x);
  grid-column-gap: var(--_sizes---spacing--2x);
  grid-row-gap: var(--_sizes---spacing--2x);
  box-sizing: border-box;
}

.section-event .header.margin-bottom_none {
  padding: var(--_sizes---spacing--1x) var(--_sizes---spacing--1x) 0;
  margin-bottom: 0;
}

.heading_hero.mid {
  margin-top: 0;
  margin-bottom: var(--_typography---h2-heading--h2-margin-bottom);
}

/* Form contact details (Téléphone / Adresse / Email) — center */
#Form .contact-details {
  width: 100%;
  align-items: center;
  text-align: center;
}

#Form .contact-details > li {
  display: flex;
  justify-content: center;
  width: 100%;
}

#Form .contact-details .flex_horizontal {
  justify-content: center;
  align-items: center;
  text-align: center;
}

#Form .contact-details .flex-child_expand {
  text-align: center;
}

#Form .contact-details .icon {
  margin-left: auto;
  margin-right: auto;
}

/* Hero stats card (220 pers. / 4 salles / 127 m²) — center content */
.hero-overlay .card,
.hero-overlay .card_body {
  text-align: center;
  align-items: center;
}

.hero-overlay .card_body .grid_3-col .content-block {
  text-align: center;
  justify-items: center;
}

.hero-overlay .logo_group {
  justify-content: center;
}

/* FAQ: intro full width above questions (export kept it to ~1/3 grid) */
#FAQ {
  overflow-x: clip;
}

#FAQ .container {
  max-width: 100%;
  overflow-x: clip;
}
#FAQ .w-layout-grid.grid_3-col {
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  max-width: 100%;
}

#FAQ .w-layout-grid.grid_3-col > .grid-item-manual {
  grid-column: 1 / -1 !important;
  grid-row: auto !important;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

#FAQ .flex_vertical,
#FAQ .ix-link-wrapper,
#FAQ .accordion.w-dropdown,
#FAQ .w-dropdown {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

#FAQ .accordion_toggle {
  height: auto;
  min-height: 3.25rem;
  box-sizing: border-box;
}

#FAQ .accordion_toggle .paragraph_large {
  flex: 1 1 auto;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

#FAQ .accordion_content,
#FAQ .accordion_content.w--open,
#FAQ .w-dropdown-list {
  position: static !important;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

#FAQ .accordion_content .rich-text,
#FAQ .accordion_content p {
  overflow-wrap: anywhere;
  word-break: break-word;
  max-width: 100%;
}

.faq-header,
.faq-header.is-align-center {
  text-align: center;
  align-items: center;
  padding-left: 0;
  padding-right: 0;
  width: 100%;
  max-width: none;
}

.faq-header .eyebrow,
.faq-header .subheading,
.faq-header .rich-text {
  text-align: center;
  max-width: none;
}

.faq-header .heading_primary {
  max-width: none;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* Footer: broken .grid (.25fr) made brand overflow the tagline */
.footer .grid {
  display: grid;
  grid-template: none;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  grid-template-rows: auto;
  grid-column-gap: var(--_sizes---spacing--2x);
  grid-row-gap: var(--_sizes---spacing--2x);
  align-items: start;
}

.footer .grid > .w-layout-blockcontainer,
.footer .grid > .w-container {
  display: none;
}

.footer .nav_logo {
  height: auto;
  max-width: 100%;
}

.footer .nav_logo .paragraph_large {
  font-size: 1.25rem;
  line-height: 1.3;
  white-space: normal;
}

.footer .paragraph_xlarge.margin-right_medium {
  margin-top: var(--_sizes---spacing--0-5x);
  margin-right: 0;
  max-width: 28ch;
}

/* ---------- Tablet (≤991px) ---------- */
@media screen and (max-width: 991px) {
  .section:not(.is-full-screen) {
    padding-top: var(--_sizes---spacing--3x);
    padding-bottom: var(--_sizes---spacing--3x);
  }

  .section-event {
    padding-top: var(--_sizes---spacing--3x) !important;
    padding-bottom: var(--_sizes---spacing--3x) !important;
  }

  .section-event .grid_2-col.bg {
    padding: var(--_sizes---spacing--2x) var(--_sizes---spacing--1-5x);
    grid-row-gap: var(--_sizes---spacing--1-5x);
  }

  .section-event .header.margin-bottom_none {
    padding: var(--_sizes---spacing--1x) 0 0;
  }

  /* Center form contact list when columns stack */
  #Form .header.margin-bottom_none.left {
    align-items: center;
    text-align: center;
  }

  #Form .contact-details .flex_horizontal.mobile-l-vertical {
    flex-direction: column;
    align-items: center;
  }

  .padding_section {
    padding-top: var(--_sizes---spacing--3x);
    padding-bottom: var(--_sizes---spacing--3x);
  }

  /* Center hero column when stacked */
  .hero-overlay .grid_2-col.tablet-1-col {
    justify-items: center;
  }

  .hero-overlay .grid_2-col.tablet-1-col > .grid-item-manual {
    width: 100%;
    max-width: 36rem;
  }

  .hero-overlay .card {
    margin-left: auto;
    margin-right: auto;
  }

  .card_header {
    padding: var(--_sizes---card--card-padding) var(--_sizes---card--card-padding) 0;
  }

  .padding-card {
    padding: var(--_sizes---card--card-padding);
  }

  .heading_hero {
    font-size: 2.5rem;
  }

  .heading_hero.mid {
    font-size: var(--_typography---h2-heading--h2-size);
  }

  .grid_2-col.gap-xlarge.tablet-1-col,
  .gap-xlarge.tablet-1-col {
    grid-column-gap: var(--_sizes---gap--md-gap);
    grid-row-gap: var(--_sizes---gap--md-gap);
  }

  .ix_hero-offset-left {
    margin-left: 0;
  }

  .ix_hero-offset-left .flex-child_no-shrink {
    flex: 1 1 0;
    min-width: 0;
    max-width: 40%;
  }

  /* FAQ stacks: keep intro centered above accordion */
  #FAQ .faq-header {
    margin-bottom: var(--_sizes---spacing--1-5x);
  }

  .footer .grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .footer .paragraph_xlarge.margin-right_medium {
    max-width: none;
  }
}

/* ---------- Mobile landscape (≤767px) ---------- */
@media screen and (max-width: 767px) {
  .section:not(.is-full-screen) {
    padding-top: var(--_sizes---spacing--2x);
    padding-bottom: var(--_sizes---spacing--2x);
  }

  .section-event {
    padding-top: var(--_sizes---spacing--2x) !important;
    padding-bottom: var(--_sizes---spacing--2x) !important;
  }

  .section-event .grid_2-col.bg {
    padding: var(--_sizes---spacing--1-5x) var(--_sizes---spacing--1x);
    grid-row-gap: var(--_sizes---spacing--1-5x);
  }

  .padding_section {
    padding-top: var(--_sizes---spacing--2x);
    padding-bottom: var(--_sizes---spacing--2x);
  }

  .card_header {
    padding: var(--_sizes---card--card-padding-sm) var(--_sizes---card--card-padding-sm) 0;
  }

  .padding-card {
    padding: var(--_sizes---card--card-padding-sm);
  }

  .heading_hero {
    font-size: 2.25rem;
  }

  .heading_hero.mid {
    font-size: 1.75rem;
  }

  .grid_2-col.gap-xlarge.tablet-1-col,
  .gap-xlarge.tablet-1-col {
    grid-column-gap: var(--_sizes---gap--sm-gap);
    grid-row-gap: var(--_sizes---gap--sm-gap);
  }

  .form_item.is-half {
    min-width: 0;
    width: 100%;
  }

  .ix_hero-offset-left .flex-child_no-shrink {
    max-width: 45%;
  }

  .header.margin-bottom_none {
    padding-left: 0;
    padding-right: 0;
  }
}

/* ---------- Mobile portrait (≤479px) ---------- */
@media screen and (max-width: 479px) {
  .section:not(.is-full-screen) {
    padding-top: var(--_sizes---spacing--1-5x);
    padding-bottom: var(--_sizes---spacing--1-5x);
  }

  .section-event {
    padding-top: var(--_sizes---spacing--2x) !important;
    padding-bottom: var(--_sizes---spacing--1-5x) !important;
  }

  .section-event .grid_2-col.bg {
    padding: var(--_sizes---spacing--1-5x) var(--_sizes---spacing--1x);
    grid-row-gap: var(--_sizes---spacing--1x);
  }

  .padding_section {
    padding-top: var(--_sizes---spacing--1-5x);
    padding-bottom: var(--_sizes---spacing--1-5x);
  }

  .card_header {
    padding: var(--_sizes---card--card-padding-sm) var(--_sizes---card--card-padding-sm) 0;
  }

  .padding-card {
    padding: var(--_sizes---card--card-padding-sm);
  }

  .heading_hero {
    font-size: 2rem;
  }

  .heading_hero.mid {
    font-size: 1.5rem;
  }

  .button {
    white-space: normal;
    text-align: center;
  }

  .ix_hero-offset-left .flex-child_no-shrink {
    max-width: 55%;
  }

  /* Keep contact rows stacked+centered (Webflow resets mobile-l-vertical to row at 479) */
  #Form .contact-details .flex_horizontal.mobile-l-vertical {
    flex-flow: column;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
}
