/* Reference-matched sections. The approved masthead and hero live in vwr-home-match.css. */
.hm { --hm-section-space: clamp(32px,3.6vw,64px); }
.hm-section { padding: var(--hm-section-space) 8.6%; }
[data-page-type="home"] #main-content .hm .hm-section h2 { font-size: clamp(28px,2.85vw,46px) !important; line-height: 1.07 !important; font-weight: 800; margin: 0 0 16px !important; letter-spacing: -.035em !important; }
[data-page-type="home"] #main-content .hm .hm-section h3 { font-size: clamp(16px,1.35vw,21px) !important; line-height: 1.2 !important; font-weight: 750; }
.hm-section .hm-kicker { font-size: 12px; margin: 0 0 10px; letter-spacing: .12em; }
.hm-section .hm-lede { font-size: 15px; line-height: 1.45; }
.hm-section .hm-btn { min-height: 46px; border-radius: 4px; font-size: 13px; padding: 12px 22px; width: fit-content; }
.hm-section a:focus-visible,.hm-section button:focus-visible,.hm-section summary:focus-visible { outline: 3px solid #ff7836; outline-offset: 4px; }
.hm-section img { max-width: 100%; }
.hm-section [hidden] { display: none !important; }

/* Offer bar in the strip under the hero. Wording comes from config/home-offers.php. */
[data-page-type="home"] .hm-benefits {
  background: #fff;
  color: #10283b;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 8px 32px;
  align-items: center;
  padding: 20px 8.6% 16px;
  border-top: 2px solid #ff7836;
  border-bottom: 1px solid #e8e8e2;
}
[data-page-type="home"] .hm-benefits__item { display: flex; align-items: center; gap: 14px; min-width: 0; }
[data-page-type="home"] .hm-benefits__icon { width: 44px; height: 44px; flex: 0 0 44px; display: grid; place-items: center; }
[data-page-type="home"] .hm-benefits__icon img { width: 40px; height: 40px; object-fit: contain; display: block; }
[data-page-type="home"] .hm-benefits p { display: block; margin: 0; }
[data-page-type="home"] .hm-benefits strong { display: block; margin: 0; color: #10283b; font-size: 18px; font-weight: 750; line-height: 1.2; letter-spacing: -.02em; }
[data-page-type="home"] .hm-benefits p span { display: block; margin-top: 3px; color: #63707b; font-size: 13px; line-height: 1.35; font-weight: 500; }
[data-page-type="home"] .hm-benefits .hm-btn {
  grid-column: 3;
  grid-row: 1;
  width: fit-content;
  min-height: 46px;
  border-radius: 4px;
  font-size: 13px;
  font-weight: 700;
  padding: 12px 22px;
  background: #ff7836;
  color: #fff;
  white-space: nowrap;
}
[data-page-type="home"] .hm-benefits .hm-btn:hover { background: #e86222; }
[data-page-type="home"] .hm-benefits .hm-btn:focus-visible { outline: 3px solid #f99026; outline-offset: 3px; }
[data-page-type="home"] .hm-benefits small { grid-column: 1 / -1; margin: 0; color: #71808a; font-size: 11px; line-height: 1.4; }

/* Services: photo, price pill, icon badge, Learn more. One panel opens under the grid. */
.hm-services { background: #f7f6f3; }
.hm-services > .hm-lede { max-width: 600px; margin-bottom: 8px; }
.hm-services__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 22px; margin-top: 28px; align-items: stretch; }
.hm-svc { grid-column: span 2; }
.hm-svc:nth-child(4) { grid-column: 2 / span 2; }
.hm-svc:nth-child(5) { grid-column: 4 / span 2; }
.hm-svc { background: #fff; border-radius: 8px; box-shadow: 0 8px 22px rgba(16,40,59,.07); display: flex; flex-direction: column; position: relative; cursor: pointer; min-width: 0; }
.hm-svc.is-active { outline: 2px solid var(--hm-orange); box-shadow: 0 16px 36px rgba(16,40,59,.14); }
.hm-svc__media { position: relative; aspect-ratio: 4/3; overflow: hidden; border-radius: 8px 8px 0 0; background: #e7ece8; }
.hm-svc__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hm-svc__price { position: absolute; top: 14px; right: 14px; z-index: 2; margin: 0; display: inline-flex; align-items: baseline; gap: 5px; background: var(--hm-orange); color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; line-height: 1; padding: 7px 11px; border-radius: 4px; box-shadow: 0 4px 14px rgba(0,0,0,.25); }
.hm-svc__price strong { font-size: 14px; font-weight: 800; letter-spacing: .02em; text-transform: none; }
.hm-svc__icon { position: relative; z-index: 2; align-self: flex-start; width: 76px; height: 76px; margin: -38px 0 0 18px; border-radius: 50%; background: #fff; border: 3px solid #fff; box-shadow: 0 6px 16px rgba(16,40,59,.16); display: grid; place-items: center; overflow: hidden; }
.hm-svc__icon img { width: 78%; height: 78%; object-fit: contain; display: block; }
.hm-svc__body { padding: 10px 22px 22px; display: flex; flex-direction: column; flex: 1; min-width: 0; }
.hm-svc__body h3 { margin: 0 0 10px; }
.hm-svc__body p { margin: 0 0 18px; color: var(--hm-muted); font-size: 14px; line-height: 1.4; flex: 1; }
.hm-svc__more { appearance: none; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; font: inherit; font-weight: 800; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--hm-orange); display: inline-flex; align-items: center; gap: 8px; width: fit-content; }
.hm-svc__more svg { width: 16px; height: 16px; }
.hm-svc-detail { max-height: 0; opacity: 0; overflow: hidden; margin-top: 0; border-radius: 12px; background: #fff; border: 1px solid transparent; position: relative; }
.hm-svc-detail.is-open { max-height: 1800px; opacity: 1; margin-top: 28px; border-color: #e4e6e1; box-shadow: 0 12px 32px rgba(16,40,59,.1); }
.hm-svc-detail__close { position: absolute; top: 16px; right: 16px; z-index: 3; width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(255,255,255,.95); color: var(--hm-ink); display: grid; place-items: center; box-shadow: 0 4px 12px rgba(0,0,0,.12); cursor: pointer; }
.hm-svc-detail__close svg { width: 18px; height: 18px; }
.hm-svc-detail__grid { display: grid; grid-template-columns: 1fr 1.2fr; }
.hm-svc-detail__media { position: relative; min-height: 360px; overflow: hidden; border-radius: 12px 0 0 12px; }
.hm-svc-detail__media img { width: 100%; height: 100%; min-height: 360px; object-fit: cover; display: block; }
.hm-svc-detail__tag { position: absolute; left: 24px; bottom: 24px; margin: 0; background: var(--hm-orange); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; padding: 8px 14px; border-radius: 4px; }
.hm-svc-detail__body { padding: 40px 56px 40px 40px; }
.hm-svc-detail__body .hm-kicker { margin-bottom: 8px; }
[data-page-type="home"] #main-content .hm .hm-svc-detail h3 { font-size: clamp(24px, 2.2vw, 32px) !important; line-height: 1.1 !important; margin: 0 0 12px !important; }
.hm-svc-detail__lead { margin: 0 0 22px; color: var(--hm-muted); font-size: 15px; line-height: 1.55; }
.hm-svc-detail__label { margin: 0 0 12px; font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.hm-svc-detail__checks { list-style: none; margin: 0 0 24px; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 24px; }
.hm-svc-detail__checks li { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.4; }
.hm-svc-detail__checks svg { width: 18px; height: 18px; color: var(--hm-orange); flex: 0 0 18px; margin-top: 1px; }
.hm-svc-detail__meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: #e4e6e1; border-radius: 8px; overflow: hidden; margin: 0 0 10px; }
.hm-svc-detail__meta div { background: #f6f5f2; padding: 14px 16px; }
.hm-svc-detail__meta dt { font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--hm-muted); }
.hm-svc-detail__meta dd { margin: 6px 0 0; font-size: 16px; font-weight: 800; color: var(--hm-navy, #10283b); }
.hm-svc-detail__note { margin: 0 0 20px; color: #71808a; font-size: 12px; line-height: 1.4; }
.hm-svc-detail__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hm-svc-detail__explore { display: inline-flex; align-items: center; min-height: 46px; padding: 12px 18px; border: 1px solid #d7ddd8; border-radius: 4px; color: var(--hm-ink); font-size: 13px; font-weight: 750; text-decoration: none; background: #fff; }

/* Separate conversion offers, below the approved hero and service introduction. */
.hm-offers { background: #fff; display: grid; grid-template-columns: 1fr 1fr auto; gap: 20px 32px; align-items: center; padding-top: 28px; padding-bottom: 24px; border-block: 1px solid #e8e8e2; }
.hm-offers > div { display: flex; gap: 16px; align-items: center; }
.hm-offers__icon { display: grid; place-items: center; width: 44px; height: 44px; color: var(--hm-orange); flex-shrink: 0; }
.hm-offers__icon svg { width: 32px; height: 32px; }
.hm-offers__icon img { width: 40px; height: 40px; object-fit: contain; display: block; }
.hm-offers strong { display: block; font-size: 19px; line-height: 1.2; }
.hm-offers p span { display: block; color: var(--hm-muted); font-size: 13px; margin-top: 5px; }
.hm-offers small { grid-column: 1/-1; color: #71808a; font-size: 11px; }

/* Side-by-side comparison, with an exact shared image viewport. */
.hm-ba { display: grid; grid-template-columns: .85fr 1.4fr; gap: 0 7%; background: #eeece7; align-content: center; }
.hm-ba > .hm-kicker,.hm-ba > h2,.hm-ba > .hm-lede,.hm-ba > .hm-ba__cta { grid-column: 1; }
.hm-ba > .hm-lede { max-width: 380px; }
.hm-ba__cta { justify-self: start; margin-top: 20px; }
.hm-ba__list { grid-column: 2; grid-row: 1/5; margin: 0; align-self: center; }
.hm-ba__pair { margin: 0; }
.hm .vwr-ba__compare { aspect-ratio: 2.45/1; border-radius: 4px; }
.hm .vwr-ba__img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hm .vwr-ba__label { font-size: 12px; border-radius: 3px; background: #092435; padding: 6px 10px; }
.hm .vwr-ba__handle { width: 38px; height: 38px; }
.hm-ba__pair figcaption { text-align: right; font-size: 10px; margin-top: 8px; }

/* Editorial photograph and numbered reasons, using the same architectural texture. */
.hm-why { position: relative; isolation: isolate; background: #092435; display: grid; grid-template-columns: .95fr 1.18fr; gap: 0 6%; color: #fff; overflow: hidden; }
.hm-why::before { content: ''; position: absolute; z-index: -1; inset: 0; background: url('/assets/images/plans/iso-home.webp') center / cover no-repeat; opacity: .22; pointer-events: none; }
.hm-why > .hm-kicker,.hm-why > h2,.hm-why > .hm-why__slider,.hm-why > .hm-btn { grid-column: 2; }
.hm-why__slider { min-width: 0; margin: 12px 0 4px; }
[data-page-type="home"] #main-content .hm .hm-why .vwr-pi__card-content h3 { color: #fff !important; font-size: 22px !important; margin: 0 0 6px !important; }
.hm-why .vwr-pi__card-content p { color: rgba(255,255,255,.86); font-size: 15px; margin: 0; }
.hm-why > h2 { max-width: 440px; }
.hm-why__photo { grid-column: 1; grid-row: 1/5; width: 100%; height: 100%; min-height: 360px; margin: 0; border-radius: 4px; object-fit: cover; object-position: center; }
.hm-why ol { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 24px; margin: 20px 0; }
.hm-why li { grid-template-columns: auto 1fr; gap: 14px; padding: 0; border: 0; }
.hm-why li > span { font-size: 32px; line-height: 1; }
.hm-why p { font-size: 13px; line-height: 1.4; color: #c3cfd6; margin-top: 8px; }
.hm-why > .hm-btn { justify-self: center; width: fit-content; margin-top: 12px; margin-inline: auto; }

/* Even 4:3 project grid. Three photos per room fill a row when a filter is on. */
.hm-gallery { text-align: center; background: #fff; padding-inline: 5.8%; }
.hm-gallery .hm-kicker { margin-bottom: 6px; }
.hm-filters { justify-content: center; margin: 12px 0 20px; gap: 8px; }
.hm-filters button { padding: 5px 20px; font-size: 12px; min-height: 30px; font-weight: 650; }
.hm-filters button[aria-pressed="true"] { background: var(--hm-orange); border-color: var(--hm-orange); color: #fff; }
.hm-gallery__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: none; grid-auto-rows: auto; gap: 10px; margin: 0; }
.hm-gallery .hm-gallery__grid > .hm-shot { position: relative; width: 100%; aspect-ratio: 4 / 3; grid-column: auto; grid-row: auto; border-radius: 3px; }
.hm-gallery .hm-gallery__grid > .hm-shot img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hm-gallery__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 12px; }
.hm-gallery__note { text-align: left; font-size: 12px; margin: 0; line-height: 1.4; }
.hm-gallery__foot .hm-btn { display: flex; margin: 0; flex: 0 0 auto; min-height: 32px; font-size: 12px; padding: 6px 14px; border-color: #e4e7e9; }
.hm-banner { padding: 0; min-height: 174px; }
.hm-banner > div { min-height: 174px; justify-content: center; align-items: center; padding: 32px 24px; background: #09243566; gap: 18px; }
[data-page-type="home"] #main-content .hm .hm-banner h2 { margin: 0 !important; font-size: clamp(28px,2.5vw,40px) !important; text-align: center; }

/* The process reads left to right with a quiet connecting rule. */
.hm-process { background: #fff; }
.hm-process ol { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 28px; margin-top: 28px; }
.hm-process li { display: grid; grid-template-columns: auto 1fr; gap: 12px 16px; position: relative; padding: 0; }
.hm-process__n { font-size: 24px; width: auto; line-height: 1; }
.hm-process__icon { width: 34px; height: 30px; display: block; border: 0; border-radius: 0; background: none; }
.hm-process__icon svg, .hm-process__icon img { width: 30px; height: 30px; object-fit: contain; display: block; }
.hm-process li > div { grid-column: 1/-1; }
.hm-process li::before { display: block; content: ''; width: calc(100% - 100px); height: 1px; background: #c6cdd1; position: absolute; top: 14px; left: 90px; bottom: auto; }
.hm-process p { font-size: 12px; line-height: 1.4; margin-top: 8px; }
[data-page-type="home"] #main-content .hm .hm-process h3 { font-size: 14px !important; }

.hm-faq { display: grid; grid-template-columns: .75fr 1.4fr; gap: 8%; background: #fff; }
.hm-faq__intro > p:last-child { font-size: 13px; line-height: 1.4; color: #536570; }
.hm-faq__intro a { color: inherit; text-decoration: none; }
.hm-faq__list { border: 1px solid #dfe4e7; border-radius: 4px; overflow: hidden; align-self: start; }
.hm-faq__item { border-color: #dfe4e7; }
.hm-faq__item:last-child { border: 0; }
.hm-faq__item button { min-height: 44px; padding: 12px 18px; font-size: 13px; line-height: 1.35; }
.hm-faq__item button[aria-expanded="true"] svg { transform: rotate(45deg); }
.hm-faq__item div { padding: 0 18px 14px; font-size: 13px; line-height: 1.5; }

/* Customer video sits directly underneath FAQ, loads the MP4 only on request. */
.hm-testimonial { display: grid; grid-template-columns: 1.25fr .75fr; column-gap: 10%; row-gap: 36px; align-items: center; background: #f2f0eb; min-width: 0; }
.hm-testimonial__copy > p:not(.hm-kicker) { color: var(--hm-muted); max-width: 430px; font-size: 15px; line-height: 1.5; margin-bottom: 24px; }
.hm-testimonial__frame { position: relative; aspect-ratio: 480/848; max-width: 340px; width: 100%; justify-self: center; margin: 10px; background: #092435; border-radius: 12px; overflow: hidden; box-shadow: -7px -7px 0 #f99026; }
.hm-testimonial video { display: block; width: 100%; height: 100%; object-fit: cover; }
.hm-testimonial__play { position: absolute; inset: 0; display: flex; flex-direction: column; gap: 12px; align-items: center; justify-content: center; color: #fff; border: 0; background: linear-gradient(transparent,#09243533); font-size: 13px; font-weight: 750; cursor: pointer; }
.hm-testimonial__play svg { background: var(--hm-orange); border-radius: 50%; width: 64px; height: 64px; padding: 16px; }
.hm-testimonial__frame.is-playing .hm-testimonial__play { display: none; }

/* Closing quotation card and compact matching footer. */
.hm-enquiry { position: relative; background: #092435; color: #fff; grid-template-columns: 1fr 1fr; align-items: center; gap: 10%; padding-top: 48px; background-image: linear-gradient(110deg,#092435b8,#092435d0),url('/assets/images/plans/iso-kitchen.webp'); background-size: auto, cover; background-position: center, center; background-repeat: no-repeat; }
.hm-enquiry::before { content: ''; position: absolute; left: 0; right: 0; top: -16px; height: 20px; background: var(--hm-orange); clip-path: polygon(0 80%,100% 0,100% 14%,0 100%); }
.hm-enquiry__copy h2 { max-width: 440px; }
.hm-enquiry__copy a { display: flex; align-items: center; gap: 14px; font-size: 16px; margin-top: 8px; }
.hm-enquiry__copy a svg { width: 26px; height: 26px; }
.hm-enquiry__copy a:first-of-type { font-size: 24px; }
.hm-enquiry form { background: #fff; color: var(--hm-ink); border-radius: 5px; padding: 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; box-shadow: 0 8px 24px #0002; }
.hm-enquiry form > h3 { grid-column: 1/-1; margin: 0 0 2px; }
.hm-enquiry label { display: flex; flex-direction: column; gap: 5px; min-width: 0; font-size: 12px; font-weight: 650; }
.hm-enquiry input,.hm-enquiry select,.hm-enquiry textarea { background: #fff; border: 1px solid #dfe4e7; border-radius: 3px; color: var(--hm-ink); font-size: 13px; padding: 9px 10px; min-height: 40px; }
.hm-enquiry textarea { min-height: 70px; }
.hm-form__message, .hm-form__budget { grid-column: 1/-1; position: relative; }
.hm-form__optional { position: absolute; top: 0; right: 0; color: #7b8790; font-weight: 400; }
.hm-enquiry form > .hm-btn,.hm-form-status,.hm-form__privacy,.hm-enquiry form > .cf-turnstile { grid-column: 1/-1; width: 100%; }
.hm-form__privacy { font-size: 10px; color: #78848c; text-align: center; }
.hm-form-status:empty { display: none; }
.hm-footer { padding: 32px 8.6%; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; border-top: 1px solid #ffffff22; color: #fff; font-family: 'Plus Jakarta Sans',sans-serif; }
.hm-footer__brand img { width: 224px; height: auto; margin-bottom: 20px; }
.hm-footer h3 { color: #fff; font-family: inherit !important; font-size: 12px; letter-spacing: 0 !important; margin-bottom: 12px; font-weight: 750; }
.hm-footer a,.hm-footer p { color: #b4c4ce; font-size: 12px; line-height: 1.6; text-decoration: none; }
.hm-footer ul { list-style: none; margin: 0; padding: 0; }
.hm-footer a:hover { color: var(--hm-orange); }
.hm-footer__contact a { display: flex; gap: 8px; align-items: center; overflow-wrap: anywhere; }
.hm-footer__contact svg { width: 16px; height: 16px; flex: 0 0 auto; }
[data-page-type="home"] #main-content + footer { background: #092435 !important; padding-bottom: 0; }

@media (min-width:1600px) { .hm-section { padding-inline: max(8.6%,calc((100% - 1325px)/2)); } }
@media (max-width:1023px) {
 .hm-section { padding: 36px 24px; }
 .hm-services__grid { grid-template-columns: 1fr 1fr; gap: 16px; }
 .hm-svc, .hm-svc:nth-child(-n+3), .hm-svc:nth-child(n+4) { grid-column: auto; }
 .hm-svc:last-child { grid-column: 1 / -1; }
 .hm-svc-detail__grid { grid-template-columns: 1fr; }
 .hm-svc-detail__media, .hm-svc-detail__media img { min-height: 220px; height: 220px; border-radius: 12px 12px 0 0; }
 .hm-svc-detail__body { padding: 24px 24px 28px; }
 .hm-svc-detail__checks { grid-template-columns: 1fr; }
 .hm-offers { grid-template-columns: 1fr 1fr; }
 .hm-offers .hm-btn { grid-column: 1/-1; }
 [data-page-type="home"] .hm-benefits { grid-template-columns: 1fr 1fr; padding: 18px 24px 14px; }
 [data-page-type="home"] .hm-benefits .hm-btn { grid-column: 1 / -1; grid-row: auto; justify-self: start; }
 .hm-ba { gap: 0 5%; }
 .hm-why { gap: 0 5%; }
 .hm-why__photo { min-height: 320px; }
 .hm-why ol { gap: 20px 16px; grid-template-columns: 1fr; }
 .hm-why li > span { font-size: 26px; }
 .hm-why li p { font-size: 12px; }
 .hm-process ol { gap: 16px; }
 .hm-process li::before { display: none; }
 .hm-enquiry { gap: 5%; }
 .hm-enquiry form { padding: 18px; }
 .hm-footer { padding-inline: 24px; gap: 24px; grid-template-columns: 1fr 1fr; }
}
@media (max-width:639px) {
 [data-page-type="home"] #main-content .hm .hm-section h2 { font-size: 28px !important; margin-bottom: 12px !important; }
 .hm-section { padding: 28px 24px; }
 .hm-section .hm-kicker { font-size: 10px; margin-bottom: 7px; }
 .hm-section .hm-lede { font-size: 13px; }
 .hm-section .hm-btn { min-height: 42px; font-size: 12px; width: 100%; }
 [data-page-type="home"] .hm-benefits { grid-template-columns: 1fr; gap: 14px; padding: 16px 24px 14px; }
 [data-page-type="home"] .hm-benefits .hm-btn { grid-column: 1; grid-row: auto; width: 100%; }
 [data-page-type="home"] .hm-benefits strong { font-size: 16px; }
 .hm-services__grid { grid-template-columns: 1fr; gap: 16px; margin-top: 18px; }
 .hm-svc, .hm-svc:nth-child(-n+3), .hm-svc:nth-child(n+4) { grid-column: auto; }
 .hm-svc__icon { width: 64px; height: 64px; margin: -32px 0 0 14px; }
 .hm-svc__body { padding: 8px 16px 18px; }
 .hm-svc__price { top: 10px; right: 10px; }
 .hm-svc-detail__meta { grid-template-columns: 1fr; }
 .hm-svc-detail__actions .hm-btn, .hm-svc-detail__explore { width: 100%; justify-content: center; }
 .hm-offers { grid-template-columns: 1fr; gap: 18px; }
 .hm-offers strong { font-size: 18px; }
 .hm-offers small { font-size: 10px; }
 .hm-ba { display: block; }
 .hm-ba__list { margin-top: 20px; }
 .hm .vwr-ba__compare { aspect-ratio: 2/1; }
 .hm .vwr-ba__label { font-size: 10px; }
 .hm-why { display: flex; flex-direction: column; }
 .hm-why > .hm-btn { align-self: center; width: fit-content; margin-inline: auto; }
 .hm-why__photo { min-height: 0; height: auto; aspect-ratio: 16/9; margin: 8px 0 20px; order: 0; }
 .hm-why ol { margin: 0; gap: 0; }
 .hm-why li { padding: 16px 0; border-bottom: 1px solid #ffffff22; }
 .hm-why li:last-child { border-bottom: 0; }
 .hm-why li p { font-size: 12px; }
 .hm-gallery__grid { grid-template-columns: 1fr 1fr; grid-template-rows: none; gap: 6px; }
 .hm-gallery__foot { flex-direction: column; align-items: stretch; }
 .hm-gallery__foot .hm-btn { width: 100%; justify-content: center; }
 .hm-filters { gap: 6px; }
 .hm-filters button { padding: 5px 13px; font-size: 11px; }
 .hm-gallery__note { font-size: 11px; }
 .hm-banner,.hm-banner > div { min-height: 172px; }
 .hm-banner > div { padding: 24px; }
 .hm-banner .hm-btn { width: fit-content; }
 .hm-process ol { grid-template-columns: 1fr; gap: 24px; margin-top: 20px; }
 .hm-process li { grid-template-columns: 30px 36px 1fr; gap: 12px; align-items: start; }
 .hm-process li > div { grid-column: 3; }
 .hm-process p { font-size: 12px; margin-top: 5px; }
 .hm-faq { grid-template-columns: 1fr; gap: 24px; }
 .hm-faq__item button { font-size: 12px; padding: 12px; }
 .hm-faq__item div { padding: 0 12px 14px; font-size: 12px; }
 .hm-testimonial { grid-template-columns: 1fr; gap: 24px; }
 .hm-testimonial__frame { max-width: 290px; }
 .hm-testimonial__copy > p:not(.hm-kicker) { font-size: 13px; }
 .hm-enquiry { grid-template-columns: 1fr; gap: 24px; padding-top: 36px; }
 .hm-enquiry__copy a { font-size: 12px; }
 .hm-enquiry__copy a:first-of-type { font-size: 22px; }
 .hm-enquiry form { grid-template-columns: 1fr; padding: 18px; }
 .hm-enquiry form > * { grid-column: 1 !important; }
 .hm-footer { gap: 28px 20px; padding: 28px 24px; }
 .hm-footer__brand { grid-column: 1/-1; }
 .hm-footer__brand img { width: 180px; margin-bottom: 12px; }
 .hm-footer__contact { grid-column: 1/-1; }
 [data-page-type="home"] #main-content + footer { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion:no-preference) {
 .hm-faq__item button svg { transition: transform .2s ease; }
 .hm-svc, .hm-svc__media img, .hm-svc-detail { transition: transform .3s ease, box-shadow .3s ease, max-height .55s cubic-bezier(.2,.7,.2,1), opacity .35s ease, margin-top .55s cubic-bezier(.2,.7,.2,1); }
 .hm-svc:hover { transform: translateY(-6px); box-shadow: 0 16px 36px rgba(16,40,59,.12); }
 .hm-svc:hover .hm-svc__media img { transform: scale(1.04); }
 .hm-shot img { transition: opacity .2s ease; }
 .hm-shot:hover img { opacity: .92; }
}

/* Full-bleed banner must not inherit generic mobile section padding. */
.hm-banner.hm-section { padding: 0; }
@media (min-width:1024px) {
 .hm-services { padding-top: 36px; padding-bottom: 36px; }
 .hm-services > .hm-lede { display: none; }
}

@media (min-width:1024px) and (max-width:1199px) {
 .hm-hero__actions { gap: 8px; }
 .hm-hero__actions .hm-btn { font-size: 11px; padding: 10px 11px; min-height: 40px; }
}

/* Restored Spotless Google review cards under the customer video. */
.hm-grev { grid-column: 1 / -1; min-width: 0; overflow: hidden; }
.hm-grev__track { display: flex; width: max-content; animation: hm-grev-marquee 42s linear infinite; }
.hm-grev:hover .hm-grev__track,
.hm-grev:focus-within .hm-grev__track { animation-play-state: paused; }
.hm-grev__set { display: flex; gap: 16px; padding-right: 16px; }
.hm-grev__card { width: 320px; flex: 0 0 auto; margin: 0; padding: 18px 18px 16px; background: #fff; color: #3c4043; border: 0; border-right: 5px solid #f99026; border-radius: 4px; box-shadow: 0 0 10px rgba(16, 13, 11, 0.18); display: flex; flex-direction: column; gap: 8px; min-height: 196px; }
.hm-grev__top { display: flex; align-items: flex-start; gap: 12px; }
.hm-grev__avatar { width: 40px; height: 40px; border-radius: 50%; color: #fff; display: grid; place-items: center; font-size: 18px; font-weight: 500; line-height: 1; flex: 0 0 auto; }
.hm-grev__avatar--blue { background: #1a73e8; }
.hm-grev__avatar--red { background: #ea4335; }
.hm-grev__avatar--green { background: #34a853; }
.hm-grev__avatar--yellow { background: #f9ab00; }
.hm-grev__avatar--purple { background: #9334e6; }
.hm-grev__avatar--coral { background: #e67c73; }
.hm-grev__who { display: flex; flex-direction: column; justify-content: center; min-width: 0; flex: 1 1 auto; min-height: 40px; }
.hm-grev__who strong { font-size: 16px; font-weight: 500; color: #202124; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hm-grev__who small { font-size: 13px; font-weight: 400; color: #70757a; line-height: 1.3; }
.hm-grev__g { margin-left: auto; flex: 0 0 auto; width: 18px; height: 18px; }
.hm-grev__g-icon, .hm-grev__star { display: block; }
.hm-grev__stars { display: flex; align-items: center; gap: 1px; line-height: 1; }
.hm-grev__star { width: 16px; height: 16px; }
.hm-grev__card blockquote { margin: 0; color: #3c4043; font-size: 15px; line-height: 1.5; font-style: normal; font-weight: 400; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
@keyframes hm-grev-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (max-width: 639px) { .hm-grev__card { width: 260px; min-height: 180px; } }
@media (prefers-reduced-motion: reduce) {
 .hm-grev__track { animation: none; flex-wrap: wrap; width: auto; }
 .hm-grev__set[aria-hidden="true"] { display: none; }
 .hm-grev { overflow: visible; }
}

/* Portrait video collection: no video requests until a visitor presses play. */
.hm-work{background:#f5f4f1;color:#142b3d}.hm-work__heading{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:28px}.hm-work__heading>p{max-width:340px;color:#60717c;font-size:14px;line-height:1.6}.hm-work__rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.hm-work .hm-reel{display:block;position:relative;isolation:isolate;aspect-ratio:9/16;border:0;padding:0;overflow:hidden;border-radius:16px;background:#092435;color:white;text-align:left;cursor:pointer;text-decoration:none;box-shadow:0 12px 30px #10283b12}.hm-reel>img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}.hm-reel:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#0004,transparent 32%,#0002 52%,#031722eb)}.hm-reel__badge{position:absolute;top:18px;left:18px;display:flex;align-items:center;gap:7px;padding:8px 12px;border:1px solid #ffffff55;border-radius:100px;background:#09243555;backdrop-filter:blur(10px);font-size:10px;font-weight:750;letter-spacing:.06em;text-transform:uppercase}.hm-reel__badge svg{width:12px;height:12px}.hm-reel__play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:62px;height:62px;display:grid;place-items:center;border:1px solid #ffffffaa;border-radius:50%;background:#ffffff22;backdrop-filter:blur(8px)}.hm-reel__play svg{width:25px;height:25px;margin-left:3px}.hm-reel__caption{position:absolute;bottom:25px;left:24px;right:24px;display:flex;flex-direction:column;gap:10px}.hm-reel__caption small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#ffc29e;font-weight:750}.hm-reel__caption strong{font-size:clamp(20px,2.2vw,32px);line-height:1.12;letter-spacing:-.035em}.hm-reel__caption>span{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #ffffff44;padding-top:13px;font-size:12px;font-weight:650}.hm-work__hint{font-size:11px;color:#60717c;text-align:center;margin:18px 0 0}.hm-reel:focus-visible{outline:3px solid #ff7836;outline-offset:5px}
.hm-reel-player{position:fixed;inset:0;margin:auto;width:min(840px,100%);max-width:100%;height:min(94dvh,1000px);max-height:100dvh;padding:24px 70px 84px;border:1px solid #ffffff22;border-radius:20px;background:#081c28;color:white;overflow:hidden}.hm-reel-player::backdrop{background:#020c13eb;backdrop-filter:blur(12px)}.hm-reel-player__film{height:100%;display:flex;justify-content:center;position:relative}.hm-reel-player video{height:100%;width:100%;object-fit:contain;display:block;min-height:0;border-radius:10px;background:#000}.hm-reel-player__close,.hm-reel-player__prev,.hm-reel-player__next{position:absolute;z-index:2;border:1px solid #ffffff44;background:#ffffff15;color:white;border-radius:50%;width:40px;height:40px;display:grid;place-items:center;cursor:pointer;font:30px/1 system-ui}.hm-reel-player__close{top:12px;right:12px}.hm-reel-player__prev{left:15px;top:45%}.hm-reel-player__next{right:15px;top:45%}.hm-reel-player__footer{position:absolute;bottom:16px;left:70px;right:70px;display:flex;justify-content:space-between;align-items:center;gap:16px}.hm-reel-player__footer h3{font:700 13px/1.3 'Plus Jakarta Sans',sans-serif;margin:4px 0 0;color:#fff}.hm-reel-player__footer [data-reel-count]{font-size:10px;color:#b4c4ce}.hm-reel-player__footer .hm-btn{font-size:11px;padding:12px 14px;min-height:40px}.hm-reel-player [role=status]{position:absolute;inset:40% 12px auto;background:#092435;padding:16px;text-align:center}.hm-reel-player [hidden]{display:none!important}
@media(max-width:767px){.hm-work__heading{display:block;margin-bottom:22px}.hm-work__heading>p{margin-top:12px;font-size:13px}.hm-work__rail{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 4px 18px;scrollbar-width:thin;scrollbar-color:#ff7836 #deded7}.hm-work .hm-reel{flex:0 0 80%;scroll-snap-align:center;max-width:340px}.hm-reel__caption{left:20px;right:20px;bottom:22px}.hm-reel__caption strong{font-size:26px}.hm-reel-player{height:100dvh;width:100%;border:0;border-radius:0;padding:52px 36px 90px}.hm-reel-player__prev{left:2px;width:30px}.hm-reel-player__next{right:2px;width:30px}.hm-reel-player__footer{left:20px;right:20px;bottom:max(18px,env(safe-area-inset-bottom))}.hm-reel-player__footer h3{max-width:150px;font-size:12px}}
@media(prefers-reduced-motion:no-preference){.hm-reel>img{transition:transform .5s ease}.hm-reel:hover>img{transform:scale(1.035)}.hm-reel__play{transition:background .2s ease}.hm-reel:hover .hm-reel__play{background:#ff7836}}

.hm-wizard{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:auto auto;align-items:center;column-gap:12px}
.hm-wizard__track{grid-column:2;grid-row:1;position:relative;display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:10px calc(50% - min(190px,39vw)) 14px;-webkit-overflow-scrolling:touch}
.hm-wizard__track:focus-visible{outline:3px solid #ff7836;outline-offset:4px}
.hm-wizard__track::-webkit-scrollbar{display:none}
.hm-wizard__slide{position:relative;flex:0 0 min(380px,78vw);aspect-ratio:9/16;scroll-snap-align:center;overflow:hidden;border-radius:18px;background:#092435;color:#fff;box-shadow:0 16px 36px #10283b18;transform:scale(.9);opacity:.62;transition:transform .35s ease,opacity .35s ease}
.hm-wizard__slide.is-active{transform:none;opacity:1}
.hm-wizard__slide video{width:100%;height:100%;object-fit:cover;display:block;background:#000}
.hm-wizard__slide:after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#0005,transparent 24%,transparent 48%,#031722e6)}
.hm-wizard__progress,.hm-wizard__sound,.hm-wizard__caption{position:absolute;z-index:2}
.hm-wizard__progress{top:14px;left:16px;right:16px;height:3px;border-radius:99px;background:#ffffff55;overflow:hidden}
.hm-wizard__progress>span{display:block;height:100%;width:100%;background:#ff7836;transform:scaleX(0);transform-origin:left center}
.hm-wizard__sound{top:28px;right:14px;width:40px;height:40px;display:grid;place-items:center;border:1px solid #ffffff66;border-radius:50%;background:#09243599;color:#fff;cursor:pointer}
.hm-wizard__sound svg{width:18px;height:18px}
.hm-wizard__sound .is-on{display:none}
.hm-wizard__sound[aria-pressed="true"] .is-muted{display:none}
.hm-wizard__sound[aria-pressed="true"] .is-on{display:block}
.hm-wizard__caption{left:18px;right:18px;bottom:18px;display:flex;flex-direction:column;gap:6px;pointer-events:none}
.hm-wizard__caption small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#ffc29e;font-weight:750}
.hm-wizard__caption strong{font-size:clamp(22px,2vw,30px);line-height:1.12;letter-spacing:-.03em}
.hm-wizard__arrow{width:44px;height:44px;border:1px solid #d7dde2;border-radius:50%;background:#fff;color:#10283b;font:28px/1 Georgia,serif;cursor:pointer}
.hm-wizard__arrow--prev{grid-column:1;grid-row:1}
.hm-wizard__arrow--next{grid-column:3;grid-row:1}
.hm-wizard__dots{grid-column:1/-1;grid-row:2;display:flex;justify-content:center;gap:8px;margin-top:8px}
.hm-wizard__dots button{width:8px;height:8px;padding:0;border:0;border-radius:99px;background:#c5ced4;cursor:pointer}
.hm-wizard__dots button[aria-selected="true"]{width:22px;background:#ff7836}
.hm-work__more{margin:14px 0 0;text-align:center}
.hm-work__more a{color:#10283b;font-size:13px;font-weight:700;text-underline-offset:3px}
@media(max-width:767px){.hm-wizard{grid-template-columns:minmax(0,1fr)}.hm-wizard__arrow{display:none}.hm-wizard__track{grid-column:1;padding-inline:calc(50% - min(150px,38vw))}.hm-wizard__slide{flex-basis:min(300px,76vw)}.hm-wizard__caption strong{font-size:24px}}
@media(prefers-reduced-motion:reduce){.hm-wizard__slide{transition:none}}
.hm-banner .hm-banner__call { display: none; }
@media (max-width: 767px) {
  .hm-banner .hm-banner__quote { display: none; }
  .hm-banner .hm-banner__call { display: inline-flex; }
}