/* SOW Phase 1 conversion + layout reliability fixes */

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Trust strip: proof band after the hero (not between nav and hero). */
.site-trust-strip{
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;
  width:min(1180px, calc(100% - 36px));
  margin:28px auto 8px;padding:0;
  position:relative;z-index:4;
  box-sizing:border-box;
}
body.home-page .site-trust-strip{display:none}
.site-trust-strip .trust-chip{
  display:flex;flex-direction:column;justify-content:center;gap:6px;
  padding:16px 14px;border-radius:18px;min-height:92px;
  background:linear-gradient(145deg,#fffffff0,#f3e8ffd9);border:1px solid #ffffffd0;
  box-shadow:0 12px 30px #704a9818;text-align:left;
}
.site-trust-strip strong{font-size:13px;letter-spacing:.01em;color:#2a1d38;line-height:1.25}
.site-trust-strip span{font-size:12px;line-height:1.45;color:var(--muted,#6b5a73)}

/* Hero owns the first viewport again — strip no longer sits above it. */
html.js body.gloria-inner:has(.site-trust-strip) .page-hero{
  margin-top:0!important;
  padding:72px 0 88px!important;
  min-height:min(760px, calc(100svh - 96px))!important;
  align-items:center!important;
}

.sidebar-quote-form{display:grid;gap:10px;margin:0 0 18px}
.sidebar-quote-label{margin:0;font-size:12px;font-weight:750;letter-spacing:.04em;text-transform:uppercase;color:var(--muted,#6b5a73)}
.sidebar-quote-form input,
.sidebar-quote-form select{
  width:100%;box-sizing:border-box;min-height:46px;border-radius:14px;border:1px solid #dfd3e5;
  padding:0 14px;font:inherit;background:#fffc;color:inherit
}
.sidebar-quote-form .sidebar-honey{position:absolute;left:-9999px;opacity:0;height:0;width:0}
.sidebar-quote-submit{width:100%;justify-content:center;text-align:center;border:0;cursor:pointer}
.sidebar-quote-status{min-height:1.2em;margin:0;font-size:12px;color:var(--muted,#6b5a73)}
.sidebar-quote-full{font-size:12px;font-weight:650;color:var(--purple2,#8239f2);text-decoration:none}

.chat-lead-form{display:grid;gap:8px;margin-top:10px;padding:12px;border-radius:16px;background:#f7ecffd9;border:1px solid #e6d6f3}
.chat-lead-form input,.chat-lead-form select{
  min-height:42px;border-radius:12px;border:1px solid #dfd3e5;padding:0 12px;font:inherit;background:#fff
}
.chat-lead-form button{
  min-height:44px;border:0;border-radius:999px;cursor:pointer;font:inherit;font-weight:750;
  background:var(--purple2,#8239f2);color:#fff
}
.chat-lead-status{margin:0;font-size:12px;color:var(--muted,#6b5a73)}

/* Footer must stay visible even if liquid-glass entrance script is delayed/fails. */
html.js body .footer:not(.liquid-entered),
html body .footer{
  opacity:1!important;
  transform:none!important;
  filter:none!important;
  visibility:visible!important;
}

/* Don't leave the hero loading pill stuck over the scene forever. */
.g-hero-art.is-ready .g-load,
.g-hero-art.is-unavailable .g-load,
.g-load[hidden]{display:none!important}
body.home-page.scripts-ready .g-load{display:none!important}

/* Keep floating hero props / water behind copy so they don't cover headlines/CTAs. */
body.home-page .hero-realistic-tools,
body.gloria-living-home .hero-realistic-tools{
  z-index:1!important;
  pointer-events:none!important;
}
body.home-page #g-wide-water,
body.gloria-living-home #g-wide-water,
body.home-page .g-hero > canvas,
body.gloria-living-home .g-hero > canvas{
  z-index:1!important;
  pointer-events:none!important;
}
body.home-page .g-hero-content,
body.gloria-living-home .g-hero-content{
  position:relative;
  z-index:5!important;
}
body.home-page .g-hero-content a,
body.gloria-living-home .g-hero-content a{
  pointer-events:auto!important;
}
body.home-page .g-hero-side,
body.gloria-living-home .g-hero-side{
  z-index:6!important;
}

/*
  Bubbles were painting over inner-page hero tags (breadcrumbs/eyebrow) because
  sitewide-experience.css elevates .bubble-scene above the page-hero stacking context.
  Selectors must beat html body.gloria-inner .bubble-scene { z-index:3 !important }.
*/
/* Redundant with the global navbar — hide visual breadcrumbs sitewide. */
html body nav.breadcrumbs,
html body .breadcrumbs{
  display:none!important;
}
html.js body.bubble-active > .bubble-scene,
html.js body.gloria-inner.bubble-active > .bubble-scene,
html.js body.gloria-living-home.bubble-active > .bubble-scene,
html.js body.gloria-inner > .bubble-scene,
html.js body.gloria-living-home > .bubble-scene{
  z-index:0!important;
}
html.js body.bubble-active > main,
html.js body.gloria-inner.bubble-active > main,
html.js body.gloria-living-home.bubble-active > main{
  position:relative;
  z-index:1!important;
}
html.js body.gloria-inner.bubble-active > main > .page-hero,
html.js body.bubble-active > main > .page-hero{
  position:relative!important;
  z-index:2!important;
  isolation:isolate!important;
}
html.js body .page-hero > .page-hero-overlay,
html.js body .page-hero .page-hero-copy{
  position:relative!important;
  z-index:3!important;
}
html.js body > .site-trust-strip,
html.js body .site-trust-strip{
  position:relative!important;
  z-index:6!important;
}

/*
  Footer and content sections were both at z-index:4, so the footer painted over the
  sticky quote form / CTA. Keep page content above the footer; bubbles stay at 0.
*/
html.js body.gloria-inner.bubble-active > main > section:not(.page-hero),
html.js body.gloria-inner > main > section:not(.page-hero){
  position:relative!important;
  z-index:3!important;
}
html.js body.gloria-inner.bubble-active > .footer,
html.js body.gloria-inner > .footer,
html.js body > .footer{
  z-index:2!important;
  position:relative;
}

/* Quote sidebar: stick under the header and never hide behind the footer. */
@media (min-width:901px){
  html.js body.gloria-inner .content-grid{
    align-items:start!important;
  }
  html.js body.gloria-inner .content-grid > .sidebar{
    position:sticky!important;
    top:calc(var(--nav-height, 104px) + 24px)!important;
    z-index:5!important;
    align-self:start!important;
    max-height:calc(100svh - var(--nav-height, 104px) - 48px);
    overflow:auto;
    overscroll-behavior:contain;
  }
  html.js body.gloria-inner .content-grid > .sidebar .booking-panel{
    position:relative!important;
    top:auto!important;
    max-height:none;
  }
  html.js body.gloria-inner main > section:has(.content-grid){
    padding-bottom:clamp(72px,9vw,140px)!important;
  }
}

/* Content cards clear the fixed header when scrolled into view. */
html.js body.gloria-inner main > section:not(.page-hero){
  scroll-margin-top:calc(var(--nav-height, 104px) + 20px);
}
html.js body.gloria-inner .content-grid .content-card,
html.js body.gloria-inner .content-grid .detail-article{
  scroll-margin-top:calc(var(--nav-height, 104px) + 20px);
}

/* Ask Gloria dock above footer / mobile bars */
.site-assistance{z-index:1200!important}
.gloria-chat{z-index:1201!important}
.mobile-actionbar{z-index:1100!important}

/* Sidebar quote submit should read as the primary CTA, not a washed glass button. */
html.js body.gloria-inner .sidebar-quote-form .sidebar-quote-submit.booking-primary,
html.js body .sidebar-quote-form .sidebar-quote-submit{
  color:#fff!important;
  background:linear-gradient(120deg,#a050ff,#8135f5 54%,#c46df3)!important;
  background-image:linear-gradient(120deg,#a050ff,#8135f5 54%,#c46df3)!important;
  border:1px solid #dfb5ff!important;
  box-shadow:inset 0 2px 7px #ffffff70,0 10px 24px #7635cf2e!important;
  justify-content:center!important;
}
html.js body.gloria-inner .sidebar-quote-form .sidebar-quote-submit:hover{
  background-image:linear-gradient(120deg,#ab60ff,#8a42f7 54%,#cb78f5)!important;
}
html.js body.gloria-inner .booking-panel:has(.sidebar-quote-form) .booking-panel-head h2{
  font-size:clamp(26px,2.4vw,34px)!important;
  line-height:1.12!important;
  margin:10px 0 8px!important;
}
html.js body.gloria-inner .booking-panel:has(.sidebar-quote-form) .booking-panel-head p{
  margin:0 0 8px!important;
  font-size:13px!important;
}

@media (prefers-reduced-motion:reduce){
  html.js body .site-enter.site-pending{opacity:1!important;translate:none!important}
}
.img-failed{opacity:.35;filter:grayscale(.2)}
.detail-tile-image.img-failed{
  background:linear-gradient(135deg,#f3e9fb,#e7d7f6);
  min-height:140px;
}

@media (max-width:900px){
  .site-trust-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:10px auto 14px;width:min(100% - 28px,1180px)}
  .site-trust-strip .trust-chip{min-height:84px;padding:14px 12px}
  .site-trust-strip .trust-chip:last-child{grid-column:1 / -1}
  html.js body.gloria-inner .content-grid > .sidebar{
    position:relative!important;
    top:auto!important;
    max-height:none;
    overflow:visible;
  }
}
@media (max-width:520px){
  .site-trust-strip{grid-template-columns:1fr}
  .site-trust-strip .trust-chip:last-child{grid-column:auto}
}

/* Specialty coverflow: opaque rectangular cards, no blink/ghost/warp. */
html.js body.gloria-living-home .cinematic-section:has(.ring-scroll):after{
  opacity:0!important;
  pointer-events:none!important;
}
html.js body.gloria-living-home .specialty-ring,
html.js body.gloria-living-home .cinematic-section .specialty-ring{
  opacity:1!important;
  will-change:auto!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  filter:none!important;
  background:radial-gradient(ellipse at 85% 88%,#dc9bf840,transparent 55%),radial-gradient(ellipse at 14% 10%,#c8a6ff38,transparent 50%),linear-gradient(125deg,#fcfaff,#f3e9ff 52%,#f8f0ff)!important;
  overflow:visible;
}
html.js body.gloria-living-home .ring-stage,
html.js body.gloria-living-home .ring-stage.js-ready{
  transform-style:flat!important;
  perspective:1400px;
  overflow:visible;
}
html.js body.gloria-living-home .ring-stage.js-ready > .ring-card,
html.js body.gloria-living-home article.ring-card{
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
  transform-style:flat!important;
  background:#fff!important;
  border-radius:28px!important;
  filter:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  overflow:hidden!important;
  isolation:isolate;
  -webkit-box-reflect:none!important;
  mix-blend-mode:normal!important;
  box-shadow:0 18px 42px rgba(88,40,140,.14)!important;
}
html.js body.gloria-living-home .ring-card.active{
  box-shadow:0 28px 64px rgba(88,40,140,.22)!important;
}
html.js body.gloria-living-home .ring-card:before,
html.js body.gloria-living-home .ring-card:after{
  content:none!important;
  display:none!important;
}
html.js body.gloria-living-home .ring-card > img.photo{
  opacity:1!important;
  background:#e9dff5!important;
  object-fit:cover!important;
}
html.js body.gloria-living-home .ring-card > .body{
  background:linear-gradient(90deg,#fcfaff 0%,#fcfaffe8 48%,#fcfaff00)!important;
  backdrop-filter:none!important;
  max-width:72%!important;
}
html.js body.gloria-living-home .ring-reflection,
html.js body.gloria-living-home .ring-stage .pool{
  display:none!important;
}

/* Our Services coverflow (replaces glass card grid + old specialty ring). */
html.js body.gloria-living-home .g-services .services-ring{
  margin-top:28px;
}
html.js body.gloria-living-home .g-services .services-ring-lead{
  margin:0 0 14px;
  max-width:46rem;
  color:rgba(34,18,41,.68);
  font-size:1.05rem;
  line-height:1.55;
}
html.js body.gloria-living-home .g-services .specialty-ring{
  min-height:auto;
  padding:28px 28px 36px!important;
}
html.js body.gloria-living-home .g-services .ring-head .h2,
html.js body.gloria-living-home .g-services .ring-head h2{
  display:none;
}
/* Residential stays available but visually secondary to B2B focus services. */
html.js body.gloria-living-home .ring-card.ring-card--soft{
  opacity:.78!important;
  filter:saturate(.92)!important;
  box-shadow:0 12px 28px rgba(88,40,140,.10)!important;
}
html.js body.gloria-living-home .ring-card.ring-card--soft.active{
  opacity:.9!important;
  box-shadow:0 18px 40px rgba(88,40,140,.14)!important;
}
html.js body.gloria-living-home .ring-card.ring-card--soft .body h3:after{
  content:"Available on request";
  display:block;
  margin-top:6px;
  font-size:.68rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(88,40,140,.55);
  font-weight:600;
}

/* Focus nav megas (Janitorial / Services). */
html body .site-global-header .mega.mega-focus,
html body .site-global-header .mega.mega-services{
  width:min(760px,92vw)!important;
}

/* Consent title sits clearly above the box (not clipped on the border). */
html body fieldset.consent-box{
  position:relative!important;
  margin-top:1.75rem!important;
  overflow:visible!important;
  padding-top:1.15rem!important;
}
html body fieldset.consent-box > legend{
  position:absolute!important;
  top:-1.35rem!important;
  left:0!important;
  float:none!important;
  width:auto!important;
  max-width:calc(100% - 12px)!important;
  margin:0!important;
  padding:0 .2rem!important;
  line-height:1.25!important;
  background:transparent!important;
  color:#3d2a52!important;
  font-weight:800!important;
  font-size:14px!important;
  white-space:normal!important;
  transform:none!important;
}

/* Branded preferred-date picker (replaces native calendar chrome). */
html body .gloria-date{
  position:relative;
}
html body .gloria-date-trigger{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:52px;
  padding:14px 16px;
  border-radius:14px;
  border:1px solid #dcc9f0;
  background:#f7f1ff;
  color:#2f223c;
  font:inherit;
  font-weight:600;
  text-align:left;
  cursor:pointer;
  box-shadow:none;
}
html body .gloria-date-trigger.is-placeholder{color:#7a6b88;font-weight:500}
html body .gloria-date-trigger[aria-expanded="true"],
html body .gloria-date-trigger:focus-visible{
  outline:3px solid rgba(130,57,242,.35);
  outline-offset:2px;
  border-color:#b78ae8;
  background:#fff;
}
html body .gloria-date-trigger svg{flex:0 0 auto;opacity:.72}
html body .gloria-date-panel{
  position:absolute;
  z-index:40;
  left:0;
  right:0;
  top:calc(100% + 8px);
  padding:14px;
  border-radius:18px;
  border:1px solid #e4d4f5;
  background:#fff;
  box-shadow:0 22px 50px rgba(70,30,120,.16);
}
html body .gloria-date-panel[hidden]{display:none!important}
html body .gloria-date-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:10px;
}
html body .gloria-date-head strong{
  font-size:14px;
  color:#2f223c;
}
html body .gloria-date-nav{
  width:34px;height:34px;border-radius:999px;
  border:1px solid #e0d0f0;background:#f7f1ff;color:#6b3cb8;
  display:inline-grid;place-items:center;cursor:pointer;
}
html body .gloria-date-dow{
  display:grid;grid-template-columns:repeat(7,1fr);gap:2px;
  margin-bottom:4px;text-align:center;
  font-size:10px;font-weight:700;letter-spacing:.04em;color:#8a7a9a;text-transform:uppercase;
}
html body .gloria-date-grid{
  display:grid;grid-template-columns:repeat(7,1fr);gap:4px;
}
html body .gloria-date-grid button{
  aspect-ratio:1;border:0;border-radius:12px;background:transparent;
  color:#32243e;font:inherit;font-weight:650;cursor:pointer;
}
html body .gloria-date-grid button:hover{background:#f1e7fc}
html body .gloria-date-grid button.is-muted{color:#b3a6c0}
html body .gloria-date-grid button.is-today{box-shadow:inset 0 0 0 1.5px #c39aef}
html body .gloria-date-grid button.is-selected{background:linear-gradient(135deg,#9b5de8,#7b3fd1);color:#fff}
html body .gloria-date-grid button:disabled{opacity:.35;cursor:not-allowed}
html body .gloria-date-foot{
  display:flex;justify-content:space-between;gap:8px;margin-top:12px;
}
html body .gloria-date-foot button{
  border:0;background:transparent;color:#7b3fd1;font:inherit;font-weight:700;cursor:pointer;padding:6px 4px;
}
html body .quote-native-date{position:absolute!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important}

/* Quote page conversion layout: form in first viewport */
/* Quote page: kill tall inner-page hero so the form fills the first viewport. */
html body.gloria-inner:has(#quick-quote) .page-hero,
html.js body.gloria-inner:has(#quick-quote) .page-hero,
html body.gloria-inner:has(#quick-quote):has(.site-trust-strip) .page-hero,
html.js body.gloria-inner:has(#quick-quote):has(.site-trust-strip) .page-hero{
  min-height:0!important;
  height:auto!important;
  max-height:none!important;
  padding:108px 0 10px!important;
  margin:0!important;
  align-items:flex-start!important;
  display:block!important;
  border-radius:0!important;
  overflow:visible!important;
}
html body.gloria-inner:has(#quick-quote) .page-hero-bg,
html body.gloria-inner:has(#quick-quote) .page-hero-shade{display:none!important}
html body.gloria-inner:has(#quick-quote) .page-hero-copy{
  max-width:720px!important;
  padding:0!important;
}
html body.gloria-inner:has(#quick-quote) .page-hero .h1{
  font-size:clamp(28px,3.4vw,40px)!important;
  line-height:1.12!important;
  margin:8px 0 0!important;
}
html body.gloria-inner:has(#quick-quote) .page-hero-copy .lead{
  margin:10px 0 0!important;
  max-width:42rem;
  font-size:16px!important;
  line-height:1.5!important;
}
html body.gloria-inner:has(#quick-quote) .section-sm,
html body.gloria-inner:has(#quick-quote) main>section:not(.page-hero){
  padding-top:8px!important;
  padding-bottom:48px!important;
}
html body.gloria-inner:has(#quick-quote) .site-trust-strip{display:none!important}
body:has(#quick-quote) .quote-card-intro{display:grid;gap:6px;margin:0 0 8px}
body:has(#quick-quote) .quote-card-kicker{
  margin:0;color:#7a31bd;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
}
body:has(#quick-quote) .quote-card-intro h2{
  margin:0!important;max-width:none!important;font-size:clamp(22px,2.6vw,30px)!important;line-height:1.15;letter-spacing:-.03em;color:#2f2039;
}
body:has(#quick-quote) .quote-card-intro p{margin:0!important;font-size:15px!important;color:#6b5a73!important}
body:has(#quick-quote) #quick-quote{margin-top:14px}
body:has(#quick-quote) #quick-quote .choice-card{min-height:128px;padding:18px}
body:has(#quick-quote) #quick-quote .service-picker{margin-top:2px}
body:has(#quick-quote) #quick-quote .quote-step{gap:18px}
@media(max-width:600px){
  html body.gloria-inner:has(#quick-quote) .page-hero{padding:88px 0 6px!important}
  html body.gloria-inner:has(#quick-quote) .page-hero .breadcrumbs{display:none}
  html body.gloria-inner:has(#quick-quote) .page-hero .h1{font-size:30px!important}
  html body.gloria-inner:has(#quick-quote) .page-hero-copy .lead{font-size:14px!important}
  body:has(#quick-quote) .quote-card-intro{display:none}
  body #quick-quote{margin-top:0}
  body #quick-quote .quote-progress{gap:9px;padding:13px 12px}
  body #quick-quote .quote-step{gap:16px}
  body #quick-quote .quote-step-heading p{font-size:14px!important}
  body #quick-quote .choice-card{min-height:0}
}
