.staging-bar {
  display: none !important;
}

main figure img,
.model-photo-carousel img,
.installation-carousel img,
.gallery img,
.curated-gallery img,
.real-homes-gallery img {
  cursor: zoom-in;
}

/* Final rescue QA: keep source photography whole instead of forcing it into
   a fixed, cropped card. */
.variant-page .variant-media figure,
.duo-classic-page .duo-classic-media figure,
.three-story-enclosure-gallery figure {
  aspect-ratio: auto !important;
  height: auto !important;
  background: transparent !important;
  overflow: visible !important;
}

.variant-page .variant-media img,
.duo-classic-page .duo-classic-media img,
.three-story-enclosure-gallery img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
  background: #edf1ef !important;
}

/* The factory disclaimer remains visible without the stray orange rule. */
.factory-brochures-disclaimer p {
  border-left: 0 !important;
  padding-left: 0 !important;
}

/* Keep Heather's portrait truly circular, including the green backdrop. */
.about-hero img {
  width: min(68%, 360px) !important;
  height: min(68vw, 360px) !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 50% !important;
}

/* Desktop About page: keep the founder caption visually tied to the portrait
   and trim the oversized team/contact block below it. */
@media (min-width: 901px) {
  .about-hero figcaption {
    right: max(24px, calc(50% - 180px)) !important;
    bottom: max(42px, calc(50% - 205px)) !important;
  }

  .about-team-link {
    max-width: 1148px !important;
    margin: 0 auto 76px !important;
    overflow: hidden !important;
    border-radius: 0 0 28px 28px !important;
  }

  .about-team-link > div {
    padding-block: 76px !important;
  }

  .about-team-link aside {
    padding: 48px !important;
  }
}

/* Gallery framing should be a quiet neutral, never a stray black edge. */
.alta-page .model-photo-carousel figure,
.three-story-enclosure-gallery figure {
  background: #edf1ef !important;
}

/* On narrow screens this is a stacked feature, not a squeezed two-column card. */
@media (max-width: 900px) {
  .duo-classic-page .duo-classic-install {
    grid-template-columns: 1fr !important;
    width: calc(100% - 32px) !important;
    margin-inline: auto !important;
  }

  .duo-classic-page .duo-classic-install figure {
    padding: 14px !important;
  }
}

/* Final gallery polish: model photos and installed-home carousels need one
   consistent rounded frame, never a black letterbox or an empty fixed-height
   shell around a perfectly valid portrait photo. */
.model-photo-carousel figure {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  padding: 10px !important;
  background: #e8f0eb !important;
  border: 2px solid #9caf9f !important;
  border-radius: 28px !important;
  box-shadow: 0 14px 28px rgba(42, 55, 51, .12) !important;
}

.model-photo-carousel figure img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 18px !important;
  background: transparent !important;
}

.installation-page--landing .installation-carousel figure,
.installation-page--builddown .installation-carousel figure {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
}

.installation-page--landing .installation-carousel img,
.installation-page--builddown .installation-carousel img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
}

/* Home model cards are meant to read as finished cards, not loose images
   floating inside a second white rectangle. */
.brand-model {
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 28px !important;
  box-shadow: 0 14px 28px rgba(42, 55, 51, .12) !important;
}

.brand-model > img {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  clip-path: none !important;
  border-radius: 0 !important;
  object-fit: cover !important;
  background: transparent !important;
}

/* FAQ filters and answer groups now follow the same soft, deliberate card
   language as the rest of the finished site. */
.faq-topic-buttons button {
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 8px 16px rgba(42, 55, 51, .08) !important;
}

.faq-list details {
  margin: 0 0 14px !important;
  background: #f8faf8 !important;
  border: 1px solid #b5c5bd !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 10px 22px rgba(42, 55, 51, .08) !important;
}

.faq-list details summary {
  min-height: 0 !important;
  padding: 22px 24px !important;
  border: 0 !important;
  border-radius: 20px !important;
  background: #f8faf8 !important;
}

.faq-list details[open] summary {
  border-radius: 20px 20px 0 0 !important;
  border-bottom: 1px solid #d7e0da !important;
}

.faq-list .faq-answer {
  padding: 0 24px 22px !important;
  background: #f8faf8 !important;
}

/* Landing and build-down are supplied in mixed portrait and landscape ratios.
   Frame them consistently, but never crop a finished installation just to
   force every photo into the same box. */
.installation-page--landing .installation-carousel figure,
.installation-page--builddown .installation-carousel figure {
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  box-sizing: border-box !important;
  padding: 10px !important;
  overflow: hidden !important;
  background: #e8f0eb !important;
  border: 2px solid #9caf9f !important;
  border-radius: 28px !important;
  box-shadow: 0 14px 28px rgba(42, 55, 51, .12) !important;
}

.installation-page--landing .installation-carousel img,
.installation-page--builddown .installation-carousel img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: min(72vh, 820px) !important;
  object-fit: contain !important;
  object-position: center center !important;
  border-radius: 18px !important;
}

/* Trio Alta galleries: let the frame follow the actual photo rather than
   leaving a tall, empty shell around a portrait or landscape installation. */
.alta-page .alta-gallery .model-photo-carousel figure,
.alta-page .trio-full-door-option .model-photo-carousel figure {
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  box-sizing: border-box !important;
  padding: 12px !important;
  overflow: hidden !important;
  border: 2px solid #b5c5bd !important;
  border-radius: 28px !important;
  box-shadow: 0 14px 30px rgba(25, 42, 36, .15) !important;
}

.alta-page .alta-gallery .model-photo-carousel figure {
  background: #53665e !important;
}

.alta-page .trio-full-door-option .model-photo-carousel figure {
  background: #f8faf8 !important;
  border-color: #a8bbc3 !important;
}

.alta-page .alta-gallery .model-photo-carousel img,
.alta-page .trio-full-door-option .model-photo-carousel img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}

/* The lower About blocks are distinct conversations, not invisible white
   sections on a white canvas. */
.about-team-link {
  max-width: 1148px !important;
  margin: 22px auto 34px !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  box-shadow: 0 16px 34px rgba(42, 55, 51, .12) !important;
}

.about-team-link > div {
  background: #e5efe7 !important;
}

.about-team-link aside {
  background: #383c3f !important;
}

.about-cta {
  max-width: 1148px !important;
  margin: 0 auto 76px !important;
  padding: clamp(64px, 8vw, 104px) 24px !important;
  background: #e7f0f4 !important;
  border: 1px solid #bfd3dc !important;
  border-radius: 28px !important;
  box-shadow: 0 14px 30px rgba(42, 55, 51, .10) !important;
}

/* Keep the top of Heather's hair inside the circular frame. */
.about-hero img {
  object-position: center 20% !important;
}

/* Duo Vista's portrait hero must remain whole on desktop; it is not a
   decorative background image to be clipped into a fixed-height cover. */
.variant-page .variant-hero > img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #f3f5f3 !important;
  border-radius: 22px !important;
}

/* The Duo Classic deserves a real product hero, not a small landscape room
   shot. Use the complete portrait installation at an intentional desktop size. */
@media (min-width: 801px) {
  .duo-classic-page .duo-classic-hero > img {
    width: 100% !important;
    height: clamp(620px, 56vw, 760px) !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center center !important;
    background: #f3f5f3 !important;
    border-radius: 22px !important;
  }

  .duo-classic-page .duo-classic-hero {
    min-height: 0 !important;
    align-items: center !important;
  }
}

@media (max-width: 900px) {
  .about-team-link,
  .about-cta {
    margin-inline: 16px !important;
  }

  .about-team-link {
    margin-bottom: 26px !important;
  }

  .about-cta {
    margin-bottom: 46px !important;
  }
}

/* Give the About-page principles and team invitation a clear, warm visual
   structure. White cards on a white canvas read like missing content. */
.about-page {
  background: #f6f7f3 !important;
}

.about-principles {
  background: transparent !important;
  gap: 18px !important;
  max-width: 1148px !important;
  margin: 0 auto !important;
  padding: 22px 0 !important;
}

.about-principles article {
  background: #edf3e7 !important;
  border: 1px solid #c9d8c2 !important;
  border-radius: 24px !important;
  box-shadow: 0 14px 28px rgba(42, 55, 51, .10) !important;
}

.about-principles article:nth-child(2) {
  background: #383c3f !important;
  border-color: #383c3f !important;
}

.about-principles article:nth-child(3) {
  background: #e7f0f4 !important;
  border-color: #c4d9e1 !important;
}

.about-credentials {
  background: transparent !important;
  gap: 16px !important;
  padding: 18px 0 8px !important;
}

.about-credentials article {
  border: 1px solid #d7ddd5 !important;
  border-radius: 20px !important;
  box-shadow: 0 10px 22px rgba(42, 55, 51, .08) !important;
}

.about-credentials article:nth-child(1) { background: #eef4e9 !important; }
.about-credentials article:nth-child(2) { background: #e7f0f4 !important; }
.about-credentials article:nth-child(3) { background: #f5eee2 !important; }
.about-credentials article:nth-child(4) { background: #e9f1ed !important; }

.about-team-link {
  border-radius: 28px !important;
  overflow: hidden !important;
}

.about-team-link > div {
  background: #dfece4 !important;
}

@media (max-width: 900px) {
  .about-principles {
    margin-inline: 16px !important;
    padding: 14px 0 !important;
  }

  .about-credentials {
    margin-inline: 16px !important;
    padding-inline: 0 !important;
  }
}

/* Good Housekeeping: the source desktop grid lets the first promise card
   intrude into the heading on a phone. Make this section a deliberate vertical
   sequence at mobile sizes so the statement has room to breathe. */
@media (max-width: 700px) {
  .gh-page .gh-meaning {
    display: block !important;
    padding: 72px 40px 48px !important;
  }

  .gh-page .gh-meaning > header {
    position: relative !important;
    z-index: 1 !important;
    display: block !important;
    margin: 0 0 34px !important;
    padding: 0 !important;
  }

  .gh-page .gh-meaning > header h2 {
    margin: 14px 0 0 !important;
    line-height: 1.04 !important;
  }

  .gh-page .gh-meaning > div {
    position: relative !important;
    z-index: 1 !important;
    display: block !important;
    margin: 0 !important;
  }

  .gh-page .gh-meaning > div > article {
    position: relative !important;
    margin: 0 !important;
  }
}