/* vop-r75q-ops
   Reference photo is 4:3 with no beige plate.
   Visit-room copy is inset from the phone edge.
   About contact sits on the footer with no cream void.
   Collection filter strip uses the page ground.
   Palette, logo, type ladder and the live theme stay unchanged. */

/* 1. Add the reference: 4:3 cover, layer height equals the photo. */
body.vop-pass-r75q.template-contacts #main-content #f-section-reference .f-image-with-text__image,
body.vop-pass-r75q.template-contacts #main-content .vop-contact-reference .f-image-with-text__image,
body.vop-pass-r75q.template-contacts #main-content #f-section-reference f-image-layer,
body.vop-pass-r75q.template-contacts #main-content .vop-contact-reference f-image-layer,
body.vop-pass-r75q.template-contacts #main-content #f-section-reference .f-image-with-text__image-wrapper,
body.vop-pass-r75q.template-contacts #main-content .vop-contact-reference .f-image-with-text__image-wrapper,
body.vop-pass-r75q.template-contacts #main-content #f-section-reference responsive-image,
body.vop-pass-r75q.template-contacts #main-content .vop-contact-reference responsive-image,
body.vop-pass-r75q.template-contacts #main-content #f-section-reference .f-image,
body.vop-pass-r75q.template-contacts #main-content .vop-contact-reference .f-image,
body.vop-pass-r75q.template-contacts #main-content #f-section-reference .f-image-with-text__image-first,
body.vop-pass-r75q.template-contacts #main-content .vop-contact-reference .f-image-with-text__image-first {
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  --offset-top: 0% !important;
  --aspect-ratio: 1.333333 !important;
  --aspect-ratio-mobile: 1.333333 !important;
  padding: 0 !important;
  position: relative !important;
  overflow: hidden !important;
  align-self: start !important;
}

body.vop-pass-r75q.template-contacts #main-content #f-section-reference responsive-image:before,
body.vop-pass-r75q.template-contacts #main-content .vop-contact-reference responsive-image:before,
body.vop-pass-r75q.template-contacts #main-content #f-section-reference .f-image:before,
body.vop-pass-r75q.template-contacts #main-content .vop-contact-reference .f-image:before,
body.vop-pass-r75q.template-contacts #main-content #f-section-reference .f-image-with-text__image-first:before,
body.vop-pass-r75q.template-contacts #main-content .vop-contact-reference .f-image-with-text__image-first:before {
  display: none !important;
  padding-top: 0 !important;
  content: none !important;
}

body.vop-pass-r75q.template-contacts #main-content #f-section-reference img,
body.vop-pass-r75q.template-contacts #main-content .vop-contact-reference img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 16px !important;
  background: transparent !important;
}

/* 2. See it in the room: phone copy is not flush to the edge. */
@media screen and (max-width: 767px) {
  body.vop-pass-r75q.template-contacts #main-content #f-section-visit-room .container,
  body.vop-pass-r75q.template-contacts #main-content .vop-contact-visit .container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  body.vop-pass-r75q.template-contacts #main-content #f-section-visit-room .f-image-with-text__inner,
  body.vop-pass-r75q.template-contacts #main-content .vop-contact-visit .f-image-with-text__inner {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.vop-pass-r75q.template-contacts #main-content #f-section-visit-room .f-image-with-text__image,
  body.vop-pass-r75q.template-contacts #main-content #f-section-visit-room .f-image-with-text__content,
  body.vop-pass-r75q.template-contacts #main-content .vop-contact-visit .f-image-with-text__image,
  body.vop-pass-r75q.template-contacts #main-content .vop-contact-visit .f-image-with-text__content {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.vop-pass-r75q.template-contacts #main-content #f-section-visit-room .f-image-with-text__content,
  body.vop-pass-r75q.template-contacts #main-content #f-section-visit-room .f-content-box,
  body.vop-pass-r75q.template-contacts #main-content .vop-contact-visit .f-image-with-text__content,
  body.vop-pass-r75q.template-contacts #main-content .vop-contact-visit .f-content-box {
    padding-left: 4px !important;
    padding-right: 4px !important;
    box-sizing: border-box !important;
  }
}

/* 3. About: delete the cream band between the last card and the footer. */
body.vop-pass-r75q.template-page #main-content .section_id_write,
body.vop-pass-r75q.template-page #main-content .section_id_write > section.f-section,
body.vop-pass-r75q.template-page #main-content .vop-about-contact,
body.vop-pass-r75q.template-page #main-content .vop-about-contact .container,
body.vop-pass-r75q.template-page #main-content .vop-about-contact .f-section-py,
body.vop-pass-r75q.template-page #main-content .vop-about-contact .f-richtext {
  --section-padding-bottom: 0px !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  min-height: 0 !important;
}

body.vop-pass-r75q.template-page #main-content .section_id_write > section.f-section.vop-about-contact {
  padding: 8px 0 0 !important;
}

body.vop-pass-r75q.template-page #main-content .vop-about-contact .f-richtext__button,
body.vop-pass-r75q.template-page #main-content .vop-about-contact .f-rich-text__images,
body.vop-pass-r75q.template-page #main-content .vop-about-contact .f-rich-text__image,
body.vop-pass-r75q.template-page #main-content .section_id_write .f-richtext__button,
body.vop-pass-r75q.template-page #main-content .section_id_write .f-rich-text__images {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.vop-pass-r75q.template-page #main-content,
body.vop-pass-r75q.template-page .f-footer,
body.vop-pass-r75q.template-page .page_container > div:last-child {
  margin-top: 0 !important;
  padding-bottom: 0 !important;
}

/* 4. Collection filter strip matches the page ground. Dropdowns stay readable. */
body.vop-pass-r75q.template-collection #main-content .section_id_main,
body.vop-pass-r75q.template-collection #main-content .f-collection,
body.vop-pass-r75q.template-collection #main-content #CollectionProductGrid,
body.vop-pass-r75q.template-collection #main-content .f-collection-toolbar,
body.vop-pass-r75q.template-collection #main-content .f-collection-toolbar--wrapper,
body.vop-pass-r75q.template-collection #main-content .f-toolbar--left,
body.vop-pass-r75q.template-collection #main-content .f-toolbar--right,
body.vop-pass-r75q.template-collection #main-content .f-collection-products,
body.vop-pass-r75q.template-collection #main-content .f-collection-content {
  --color-background: 246, 241, 232 !important;
  background: #F6F1E8 !important;
  background-color: #F6F1E8 !important;
}