/* carpet-build/patch-page-style.js */
/* plain white light blocks: the #hero is excluded (it carries the video poster) */
.hero-section:not(#hero), .hero-bg, .bg-\[\#F1F1F1\], .bg-\[\#f1f1f1\] { background: #fff !important; }
/* the footer's wrapper keeps its bottom padding (room for the fixed request bar) in the footer colour */
div:has(> footer.cx-footer) { background: #0E0E0F !important; padding-top: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
#hero { margin-bottom: clamp(72px, 9vw, 150px); }

/* ---- header (client 2026-10-09: "make the header beautiful") ----
   over the hero video: dark glass + white text; past the hero (html.cx-scrolled, set by cx/hero-video.js): white glass */
nav.fixed[data-v-d9263a22] { background: rgba(14, 14, 15, .3) !important; border: 1px solid rgba(255, 255, 255, .16) !important;
  box-shadow: none !important; -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%);
  padding: 10px 10px 10px 28px !important; color: #fff;
  transition: background-color .45s, border-color .45s, box-shadow .45s, color .45s; }
nav.fixed[data-v-d9263a22] > img { height: 46px; width: auto; }
nav.fixed[data-v-d9263a22] > ul { gap: 30px; }
nav.fixed[data-v-d9263a22] > ul > li { color: inherit; font-size: 15px; letter-spacing: .01em; }
nav.fixed[data-v-d9263a22] > ul > li > a { position: relative; color: inherit; }
nav.fixed[data-v-d9263a22] > ul > li > a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -5px; height: 1.5px;
  background: #2FDACA; transition: right .35s cubic-bezier(.2, .7, .2, 1); }
nav.fixed[data-v-d9263a22] > ul > li > a:hover::after { right: 0; }
nav.fixed[data-v-d9263a22] > ul > li.group > img { filter: invert(1); transition: transform .3s, filter .45s; }
nav.fixed[data-v-d9263a22] > ul > li.group > div { border-radius: 22px !important; border-color: rgba(14, 14, 15, .06) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .18) !important; margin-top: 14px; }
nav.fixed[data-v-d9263a22] > ul > li.group > div::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
/* phone = pill button (cx/hero-video.js makes it call) */
nav.fixed[data-v-d9263a22] > p { display: inline-flex; align-items: center; gap: 10px; padding: 12px 22px 12px 18px; border-radius: 9999px;
  background: #fff; color: #0E0E0F; font-weight: 600 !important; font-size: 15px; cursor: pointer; white-space: nowrap;
  transition: background-color .3s, color .3s, transform .3s; }
nav.fixed[data-v-d9263a22] > p::before { content: ""; width: 16px; height: 16px; flex: none; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1l-2.3 2.2Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1l-2.3 2.2Z'/%3E%3C/svg%3E") center / contain no-repeat; }
nav.fixed[data-v-d9263a22] > p:hover { background: #2FDACA; color: #0E0E0F; transform: translateY(-1px); }
/* past the hero */
html.cx-scrolled nav.fixed[data-v-d9263a22] { background: rgba(255, 255, 255, .86) !important; border-color: rgba(14, 14, 15, .06) !important;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .08) !important; color: #0E0E0F; }
html.cx-scrolled nav.fixed[data-v-d9263a22] > ul > li.group > img { filter: none; }
html.cx-scrolled nav.fixed[data-v-d9263a22] > p { background: #0E0E0F; color: #fff; }
html.cx-scrolled nav.fixed[data-v-d9263a22] > p:hover { background: #2FDACA; color: #0E0E0F; }
/* phones: the logo strip floats transparent over the hero video, white burger (dark again while the menu panel is open) */
@media (max-width: 767px) {
  div.md\:hidden.w-full.flex[data-v-d9263a22] { position: absolute; top: 0; left: 0; right: 0; background: transparent !important; }
  div.md\:hidden.w-full.flex[data-v-d9263a22] > button img { filter: invert(1); transition: filter .3s; }
  div.md\:hidden.w-full.flex[data-v-d9263a22]:has(+ div.opacity-100) > button img { filter: none; }
  #hero.hero-section { min-height: 100vh !important; min-height: 100svh !important; }
}
