/*
 * Terrasse Debois — consolidated visual coherence layer.
 * Loaded after the migrated component styles so spacing, shells and component
 * proportions stay consistent across the commercial pages.
 */

:root {
  --tdb-shell: 1200px;
  --tdb-radius: 10px;
  --tdb-radius-lg: 12px;
  --tdb-line: rgba(75, 98, 78, .16);
  --tdb-shadow-soft: 0 12px 34px rgba(48, 64, 50, .055);
}

/* One commercial reading width across templates. */
.home-container,
.quote-container,
.local-container,
.services-container,
.core-container,
.shared-realisations,
.guide-cards,
.site-header--source-parity .site-header__inner {
  width: min(calc(100% - 40px), var(--tdb-shell)) !important;
}

/* The header should frame the page, not dominate it. */
@media (min-width: 992px) {
  .site-header--source-parity .site-header__inner {
    padding-block: 11px !important;
  }

  .site-header--source-parity .site-brand--mark img {
    width: 80px !important;
    height: 80px !important;
  }

  .site-header--source-parity .desktop-nav li {
    margin-left: 14px !important;
  }

  .site-header--source-parity .desktop-nav a {
    padding: 10px 13px !important;
    font-size: 12px !important;
  }

  .site-header--source-parity .site-header__actions {
    margin-left: 18px !important;
  }

  .site-header--source-parity .header-contact {
    padding: 12px 17px !important;
    border-width: 1px !important;
    font-size: 12px !important;
    letter-spacing: .04em !important;
    white-space: nowrap;
  }
}

/* Three spacing levels instead of giving every block the same visual weight. */
.home-section {
  padding-block: 80px !important;
}

.local-section,
.quote-section,
.services-section,
.core-section {
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}

.home-heading,
.local-heading,
.quote-heading,
.services-heading,
.core-heading,
.shared-realisations__heading,
.guide-cards__heading {
  margin-bottom: 28px !important;
}

.home-section-cta,
.local-link-row {
  margin-top: 30px !important;
}

/* Keep a common shape language across migrated templates. */
.project-card,
.realisation-card,
.guide-card,
.service-card,
.material-card,
.guarantee-card,
.shared-realisation-card,
.quote-card,
.quote-review,
.quote-form-card,
.core-card,
.core-checkpoints,
.local-form-card,
.local-zone-image,
.budget-highlight,
.home-zones__copy,
.home-method-proof,
.home-trust-note,
.review-card,
.google-review {
  border-radius: var(--tdb-radius) !important;
}

.project-card,
.realisation-card,
.guide-card,
.service-card,
.material-card,
.shared-realisation-card,
.quote-card,
.quote-review,
.quote-form-card,
.core-card,
.local-form-card {
  border: 1px solid var(--tdb-line) !important;
  box-shadow: none !important;
}

/* Image geometry follows content type: project/service = 4:3, editorial = 16:10. */
.project-card__image,
.project-card > img,
.realisation-card__image,
.realisation-card > img,
.service-card__image,
.material-card > img,
.card-media,
.shared-realisation-card__media {
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  min-height: 0 !important;
}

.project-card__image img,
.project-card > img,
.realisation-card__image img,
.realisation-card > img,
.service-card__image img,
.material-card > img,
.card-media img,
.shared-realisation-card__media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.guide-card__image,
.guide-card__media {
  aspect-ratio: 16 / 10 !important;
}

/* Method / reassurance blocks should read as information, not as another SaaS grid. */
.home-number-grid {
  gap: 0 24px !important;
}

.home-number-grid article {
  min-height: 0 !important;
  padding: 18px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--tdb-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.home-trust__cards {
  gap: 0 24px !important;
}

.home-trust__cards article {
  min-height: 0 !important;
  padding: 20px 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, .24) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.guarantee-grid {
  gap: 0 26px !important;
}

.guarantee-card {
  display: grid !important;
  grid-template-columns: 62px 1fr !important;
  align-items: center !important;
  column-gap: 16px !important;
  padding: 20px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--tdb-line) !important;
  border-radius: 0 !important;
  text-align: left !important;
  background: transparent !important;
  box-shadow: none !important;
}

.guarantee-card img {
  grid-row: 1 / span 2 !important;
  width: 62px !important;
  height: 62px !important;
  margin: 0 !important;
  object-fit: contain !important;
}

.guarantee-card h3,
.guarantee-card p {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.guarantee-card h3 {
  margin-bottom: 4px !important;
}

/* Keep location / quote blocks visually lighter than the portfolio. */
.home-zones__links {
  gap: 8px !important;
}

.home-zones__links a,
.home-zones__links .semantic-current-location {
  min-height: 70px !important;
  border-radius: 8px !important;
}

.home-contact__map,
.home-contact__map iframe {
  min-height: 480px !important;
}

/* The local portfolio is evidence; the rest of the page should not visually compete with it. */
.shared-realisation-card__body,
.guide-card__body,
.project-card__body,
.realisation-card__body,
.service-card__body,
.material-card > div {
  padding: 20px !important;
}

.shared-realisation-card p,
.material-card p,
.guide-card p,
.project-card p {
  line-height: 1.6 !important;
}

/* Remove the serif detour that made the zones/editorial pages feel like another website. */
body[data-migration-route="/zones-intervention/"] .source-page--zone h1,
body[data-migration-route="/zones-intervention/"] .source-page--zone h2,
body[data-migration-route="/zones-intervention/"] .source-page--zone h3 {
  font-family: 'Quicksand', ui-sans-serif, system-ui, sans-serif !important;
  letter-spacing: -.03em !important;
}

/* Shared buttons: compact and consistent, without pill-like landing-page styling. */
.button,
.local-button,
.quote-button,
.services-button,
.core-button,
.header-contact {
  border-radius: 8px !important;
}

/* Reduce visual repetition in review rails. */
.review-card,
.google-review,
.quote-review,
.services-review-card {
  min-height: 0 !important;
  box-shadow: none !important;
}

/* Headings stay important without consuming an excessive share of short sections. */
.local-heading h2,
.quote-heading h2,
.services-heading h2,
.core-heading h2,
.shared-realisations__heading h2,
.guide-cards__heading h2 {
  font-size: clamp(30px, 3.5vw, 42px) !important;
}

@media (max-width: 960px) {
  .home-container,
  .quote-container,
  .local-container,
  .services-container,
  .core-container,
  .shared-realisations,
  .guide-cards {
    width: min(calc(100% - 32px), var(--tdb-shell)) !important;
  }

  .home-section {
    padding-block: 64px !important;
  }

  .local-section,
  .quote-section,
  .services-section,
  .core-section {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
  }
}

@media (max-width: 640px) {
  .home-container,
  .quote-container,
  .local-container,
  .services-container,
  .core-container,
  .shared-realisations,
  .guide-cards {
    width: min(calc(100% - 30px), var(--tdb-shell)) !important;
  }

  .home-section,
  .local-section,
  .quote-section,
  .services-section,
  .core-section {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }

  .guarantee-card {
    grid-template-columns: 50px 1fr !important;
  }

  .guarantee-card img {
    width: 50px !important;
    height: 50px !important;
  }

  .home-contact__map,
  .home-contact__map iframe {
    min-height: 330px !important;
  }
}