/* Restore the supplied reference composition using real links and preserved assets.
   Scoped to the homepage; detailed services and other pages remain intact. */
.reference-homepage .site-header .brand-logo { padding:3px;background:#fff9eb;border:1px solid #c4a46a; }
.reference-homepage .luxury-hero { height:clamp(510px,63svh,610px);min-height:0; }
/* The first graphic now uses the requested cover framing. Image files and the
   established hero/gallery dimensions remain unchanged. */
.reference-homepage .luxury-slide--full-graphic img { position:absolute;inset:0;width:100%;height:100%;max-width:none;padding:0;object-fit:cover!important;object-position:center!important;object-view-box:none; }
.reference-homepage .luxury-hero:has(.luxury-slide--full-graphic.is-active) .luxury-copy { visibility:hidden;pointer-events:none; }
.reference-homepage .luxury-hero:has(.luxury-slide--full-graphic.is-active) .luxury-copy h1 { visibility:visible;clip-path:inset(50%); }
/* The ninth owner graphic already carries its own hero composition. Remove
   the duplicate DOM copy on that slide only, while keeping its heading
   available to assistive technology. */
.reference-homepage .luxury-hero:has(.luxury-slide[data-slide-key="hot-tub-cleaning"].is-active) .luxury-copy { visibility:hidden;pointer-events:none; }
.reference-homepage .luxury-hero:has(.luxury-slide[data-slide-key="hot-tub-cleaning"].is-active) .luxury-copy h1 { visibility:visible;clip-path:inset(50%); }
[data-graphic-rect] { position:absolute;z-index:4;background:transparent;border:0;padding:0;pointer-events:none; }
.luxury-slide--full-graphic:not(.is-active) [data-graphic-rect] { visibility:hidden; }
.luxury-slide--full-graphic.is-active [data-graphic-rect] { pointer-events:auto; }
.luxury-slide--full-graphic [data-graphic-rect]:focus-visible { outline:2px solid #fffdf8;outline-offset:2px; }
/* Service photographs use the same aspect-preserving cover framing. */
.reference-homepage .luxury-slide:not(.luxury-slide--owner) { overflow:hidden; }
.reference-homepage .luxury-slide:not(.luxury-slide--owner)::before { content:"";position:absolute;inset:-18px;background-image:var(--scene-photo);background-size:cover;background-position:center;filter:blur(18px);opacity:.78; }
.reference-homepage .luxury-slide:not(.luxury-slide--owner) img { position:relative;width:100%;height:100%;padding:0;object-fit:cover!important;object-position:center!important; }
.reference-homepage .luxury-hero-inner { height:100%;min-height:0;padding:125px 0 70px;align-items:center; }
.reference-homepage .luxury-copy { width:min(710px,53%);padding:24px 28px;border-radius:28px;border-color:#ffffffd9;background:rgba(255,255,255,.80);backdrop-filter:blur(9px);box-shadow:0 0 0 1px #ffffff66,0 0 28px #ffffff80,0 0 60px #ffffff40; }
.reference-homepage .luxury-copy h1 { font-size:clamp(42px,3.5vw,56px);line-height:1.05;letter-spacing:-.035em;margin-bottom:16px; }
.reference-homepage .luxury-copy .eyebrow { margin-bottom:14px;font-size:10px;line-height:1.7;letter-spacing:.14em; }
.reference-homepage .luxury-copy>p:not(.eyebrow) { font-size:15px;line-height:1.6;margin:0;max-width:600px; }
.reference-homepage .luxury-actions { margin-top:20px;gap:18px;flex-wrap:nowrap; }
.reference-homepage .luxury-actions .btn { border-radius:40px;padding:13px 24px;min-height:48px; }
.reference-homepage .luxury-services-button { min-height:48px;padding:12px 22px; }
.reference-homepage .luxury-hero[data-carousel] .luxury-carousel-bar { top:auto;bottom:55px;left:5%;right:5%;flex-direction:row;align-items:center;justify-content:space-between; }
.reference-homepage .luxury-controls { order:1;border-radius:20px; }
.reference-homepage .luxury-hero:has([data-slide-key="exterior-painting"].is-active) .luxury-copy { margin-left:0; }
.opening-features { z-index:2;margin:-28px auto 0;width:calc(100% - 72px);max-width:1600px;color:#fffdf8; }
.opening-features>div { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;min-height:72px;border:1px solid #d6c594;border-radius:16px;background:rgba(40,92,69,.90);backdrop-filter:blur(12px);box-shadow:0 5px 18px #142b4210;padding:14px 0; }
.opening-features span { display:flex;gap:14px;align-items:center;justify-content:center;padding:0 18px;font-size:14px;font-weight:600;line-height:1.4;min-height:38px; }
.opening-features span+span { border-left:1px solid #c4a46aaa; }
.opening-features svg { flex:none;color:#e8d6a7; }
.opening-services { padding:22px 20px 24px;scroll-margin-top:95px;background:#fffdf8; }
.opening-sr-only { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap; }
.opening-service-grid { display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;max-width:1640px;margin:auto; }
.opening-service-card { display:flex;flex-direction:column;min-width:0;border:1px solid #c4a46a;border-radius:20px;overflow:hidden;background:#123f30;color:#fffdf8;box-shadow:0 4px 12px #142b420c;transition:transform .18s ease; }
.opening-service-card:hover { transform:translateY(-3px); }
.opening-service-card:focus-visible { outline:3px solid #285c45;outline-offset:4px; }
.opening-service-photo { position:relative;height:142px;overflow:hidden;background:#ecefe6; }
.opening-service-photo img { width:100%;height:100%;object-fit:cover; }
.opening-spa-placeholder { height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;color:#285c45;background:#f0eee5;font-size:12px;line-height:1.5; }
.opening-spa-placeholder svg { width:34px;height:34px; }
.opening-service-label { position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;text-align:center;min-height:104px;padding:7px 8px 12px;background:#123f30; }
.opening-service-label::before { content:"";position:absolute;top:-13px;left:-7%;width:114%;height:28px;border-top:2px solid #c4a46a;border-radius:50% 50% 0 0;background:#123f30; }
.opening-service-label>svg,.opening-service-label>h3,.opening-service-label>p { position:relative;z-index:1; }
.opening-service-label>svg { color:#e3cc92;width:26px;height:26px;margin-bottom:5px; }
.opening-service-label h3 { color:#fffdf8;font:600 18px/1.15 Manrope,Arial,sans-serif;margin:0 0 3px;letter-spacing:-.025em; }
.opening-service-label p { color:#fffdf8;font:400 14px/1.35 Manrope,Arial,sans-serif;margin:0; }
.opening-image-note { max-width:1640px;margin:12px auto 0;color:#52645b;font-size:10px;line-height:1.5;text-align:right; }
.opening-image-note a { color:#285c45;text-decoration:underline; }
.opening-support-slot .engagement { display:flex;align-items:center;justify-content:flex-end;gap:14px;padding-top:10px; }
.reference-homepage .opening-support-slot .guide-launch,.reference-homepage .opening-support-slot .measurement-launch { position:static;margin:0;box-shadow:none; }
.opening-support-slot .measurement-launch { order:0; }.opening-support-slot .guide-launch { order:1; }
.reference-homepage #service-details { scroll-margin-top:95px; }
/* Global scroll-padding already reserves the fixed header. */
.reference-homepage [id^="service-"] { scroll-margin-top:8px; }
@media(min-width:1800px){.opening-service-photo{height:165px}.opening-service-label{min-height:112px}}
@media(max-width:1100px){
 .reference-homepage .luxury-copy { width:min(690px,78%); }
 .reference-homepage .luxury-hero { height:auto; }
 .reference-homepage .luxury-hero-inner { height:auto;padding:185px 0 95px; }
 .opening-service-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .opening-features { width:calc(100% - 40px); }
 .opening-features span { font-size:12px;gap:8px;padding:0 12px; }
 .opening-features svg { width:24px;height:24px; }
}
@media(max-width:600px){
 .reference-homepage .luxury-hero-inner { padding:190px 0 90px; }
 .reference-homepage .luxury-copy { width:100%;padding:22px 20px;border-radius:22px; }
 .reference-homepage .luxury-copy h1 { font-size:36px; }
 .reference-homepage .luxury-copy .eyebrow { min-height:30px;margin-bottom:12px; }
 .reference-homepage .luxury-copy>p:not(.eyebrow) { font-size:13px;line-height:1.65; }
 .reference-homepage .luxury-actions { flex-wrap:wrap;gap:12px; }
 .reference-homepage .luxury-actions .btn { padding:13px 20px; }
 .reference-homepage .luxury-hero[data-carousel] .luxury-carousel-bar { top:95px;bottom:auto;left:auto;right:5%;flex-direction:column;align-items:flex-end;gap:8px; }
 .reference-homepage .luxury-controls { order:-1; }
 .opening-features { width:calc(100% - 32px); }
 .opening-features>div { grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 0;padding:16px 0;border-radius:14px; }
 .opening-features span { justify-content:flex-start;padding:0 12px;font-size:11px; }
 .opening-features span:nth-child(3) { border-left:0; }
 .opening-service-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:14px; }
 .opening-services { padding:20px 16px; }
 .opening-service-photo { height:130px; }
 .opening-service-label { min-height:110px;padding:8px 8px 14px; }
 .opening-service-label h3 { font-size:16px; }.opening-service-label p { font-size:12px; }
 .opening-image-note { text-align:left;font-size:10px; }
}
@media(prefers-reduced-motion:reduce){.opening-service-card{transition:none}}

/* Uniform aspect-preserving cover sizing and softened natural color for every carousel image. */
.reference-homepage [data-carousel] [data-slide] img { position:absolute;inset:0;width:100%;height:100%;max-width:none;padding:0;object-fit:cover!important;object-position:center!important;filter:saturate(.9); }
.reference-homepage .luxury-slide:not(.luxury-slide--owner)::before { display:none; }
/* The first supplied graphic already pictures this strip and card row. */
.reference-homepage:has(.luxury-slide--full-graphic.is-active) .opening-features,
.reference-homepage:has(.luxury-slide--full-graphic.is-active) .opening-service-grid,
.reference-homepage:has(.luxury-slide--full-graphic.is-active) .opening-image-note { display:none; }
/* The standalone strip, opening-service row, and note belong to the first-slide
   graphic, which already shows them. Do not repeat them beneath later slides. */
.reference-homepage:not(:has(.luxury-slide--full-graphic.is-active)) .opening-service-grid,
.reference-homepage:not(:has(.luxury-slide--full-graphic.is-active)) .opening-image-note { display:none; }
.reference-homepage:not(:has(.luxury-slide--full-graphic.is-active)) .opening-services { padding:0; }
.reference-homepage:not(:has(.luxury-slide--full-graphic.is-active)) .opening-features { display:none; }
/* Provenance labels are first-slide overlays only. Keep the controls anchored
   to the right when the label is removed so the carousel bar does not shift. */
.reference-homepage:not(:has(.luxury-slide--full-graphic.is-active)) .luxury-provenance,
.reference-homepage .luxury-slide:not(.luxury-slide--full-graphic) figcaption { display:none; }
.reference-homepage:not(:has(.luxury-slide--full-graphic.is-active)) .luxury-carousel-bar { justify-content:flex-end; }
.reference-homepage:has(.luxury-slide--full-graphic.is-active) .opening-services { padding:0; }
/* Full-bleed first banner. Its aspect ratio reserves the height, so the image
   spans the viewport and the content below cannot shift after load. On shorter
   viewports the cover crop is anchored to the bottom so the pictured service
   cards stay above the fold. Controls sit at the top-right, clear of the cards
   and the floating help controls. */
.reference-homepage:has(.luxury-slide--full-graphic.is-active) .luxury-hero {
  width:100%;
  height:auto;
  aspect-ratio:1671 / 941;
  box-sizing:border-box;
  padding-bottom:0;
  min-height:0;
  max-height:100svh;
}
.reference-homepage [data-carousel] .luxury-slide--full-graphic img {
  object-fit:cover!important;
  object-position:center bottom!important;
  padding:0;
  box-sizing:border-box;
  background:#f8f7f3;
}
.reference-homepage .luxury-hero:has(.luxury-slide--full-graphic.is-active) .luxury-carousel-bar {
  top:95px;
  bottom:auto;
  left:auto;
  right:5%;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
}
.graphic-main-quote,.graphic-main-services { min-width:44px;min-height:44px; }
@media(max-width:600px){
  /* Keep the desktop-only control strip on small screens so the pictured cards
     are never hidden behind the controls or the fixed mobile action bar. */
  .reference-homepage:has(.luxury-slide--full-graphic.is-active) .luxury-hero {
    box-sizing:content-box;
    padding-bottom:54px;
    max-height:calc(100svh - 54px);
  }
  .reference-homepage [data-carousel] .luxury-slide--full-graphic img { padding:0 0 54px; }
  .reference-homepage .luxury-hero:has(.luxury-slide--full-graphic.is-active) .luxury-carousel-bar {
    top:auto;
    bottom:1px;
    left:5%;
    right:5%;
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
  }
}
