/* Canonical home Hero and responsive header. Loaded after the legacy theme. */
body[data-page="home"] .hero {
  --hero-h: 720px; --copy-y: 218px; --stage-h: 310px; --visual-w: min(1000px, 86vw);
  position: relative !important; height: var(--hero-h) !important; min-height: var(--hero-h) !important;
  padding: 0 !important; overflow: hidden !important; isolation: isolate; border-radius: 0 !important;
  background: linear-gradient(180deg, #fff0e5 0%, #fff7f1 52%, #fffaf7 80%, #fff 100%) !important;
}
body[data-page="home"] .hero-ceiling {
  top: -300px !important; left: 50% !important; width: min(1320px, 125vw) !important; height: 445px !important;
  transform: translateX(-50%) !important; z-index: 0 !important;
}
body[data-page="home"] .hero-ceiling::before { bottom: -18px !important; width: min(800px, 78vw) !important; height: 225px !important; }
body[data-page="home"] .hero-ceiling::after, body[data-page="home"] .hero-ceiling span { display: none !important; }
body[data-page="home"] #hero-eyebrow {
  position: absolute !important; top: 58px !important; left: 50% !important; z-index: 5 !important;
  display: block !important; width: max-content !important; max-width: calc(100% - 32px) !important;
  margin: 0 !important; transform: translateX(-50%) !important; color: #805020 !important;
  font-size: 11px !important; font-weight: 800 !important; line-height: 1.4 !important;
  letter-spacing: .06em !important; text-align: center !important; white-space: nowrap !important;
}
body[data-page="home"] #hero-copy {
  position: absolute !important; top: var(--copy-y) !important; left: 50% !important; z-index: 4 !important;
  width: min(1080px, calc(100% - 32px)) !important; margin: 0 !important; padding: 0 !important;
  transform: translateX(-50%) !important; text-align: center !important;
}
body[data-page="home"] #hero-title {
  display: block !important; width: auto !important; max-width: 940px !important; margin: 0 auto !important; padding: 0 !important;
  font-size: clamp(38px, 3.55vw, 54px) !important; font-weight: 900 !important; line-height: 1.12 !important;
  letter-spacing: -1.35px !important; text-align: center !important; white-space: normal !important; text-wrap: balance;
}
body[data-page="home"] #hero-title-main, body[data-page="home"] #hero-title-accent { display: inline !important; }
body[data-page="home"] #hero-title { letter-spacing: 0 !important; font-family: Cairo, Arial, sans-serif !important; }
body[data-page="home"] #hero-title-accent { margin-inline-start: .18em !important; font-style: normal !important; }
body[data-page="home"] .hero-subtitle {
  width: min(650px, calc(100% - 20px)) !important; max-width: none !important; margin: 14px auto 0 !important;
  color: #6e6159 !important; font-size: 14px !important; line-height: 1.7 !important; text-align: center !important;
}
body[data-page="home"] .hero-cta {
  position: relative !important; z-index: 6 !important; display: inline-flex !important;
  min-height: 48px !important; margin: 30px auto 0 !important; padding-inline: 24px !important;
}
body[data-page="home"] .hero-stage {
  position: absolute !important; inset: auto 0 0 !important; z-index: 3 !important; width: 100% !important;
  height: var(--stage-h) !important; min-height: 0 !important; margin: 0 !important; transform: none !important;
  overflow: visible !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
}
body[data-page="home"] .hero-stage::before {
  content: "" !important; display: block !important; position: absolute !important; left: 50% !important; bottom: 10px !important;
  z-index: 1 !important; width: min(1080px, 88vw) !important; height: 100px !important; transform: translateX(-50%) !important;
  border-radius: 50% !important; background: radial-gradient(ellipse, rgba(255,250,239,.98), rgba(255,216,168,.5) 45%, rgba(250,167,74,.12) 64%, transparent 76%) !important;
  box-shadow: none !important;
}
body[data-page="home"] .stage-orbit { display: block !important; z-index: 2 !important; }
body[data-page="home"] .stage-orbit-outer { bottom: 14px !important; width: min(1040px, 85vw) !important; height: 108px !important; border: 1px solid rgba(250,167,74,.36) !important; }
body[data-page="home"] .stage-orbit-inner { bottom: 28px !important; width: min(820px, 68vw) !important; height: 76px !important; border: 1px solid rgba(255,213,160,.72) !important; }
body[data-page="home"] #hero-image {
  position: absolute !important; top: auto !important; right: auto !important; bottom: 15px !important; left: 50% !important;
  z-index: 3 !important; width: var(--visual-w) !important; max-width: 100% !important; height: auto !important;
  max-height: calc(var(--stage-h) - 20px) !important; margin: 0 !important; transform: translateX(-50%) !important;
  object-fit: contain !important; object-position: center bottom !important; background: transparent !important;
  border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  filter: drop-shadow(0 15px 14px rgba(70,33,13,.1)) !important; -webkit-mask-image: none !important; mask-image: none !important;
}
body[data-page="home"] .trust-shell { margin-top: 0 !important; }

@media (max-width: 1023px) {
  :root { --header-height: 78px; }
  body { overflow-x: clip; }
  .site-header { height: 78px !important; padding: 0 !important; background: rgba(255,255,255,.98) !important; }
  .header-inner { display: grid !important; grid-template-columns: 46px minmax(0,1fr) 46px !important; align-items: center !important; gap: 10px !important; height: 100% !important; }
  .desktop-nav, .header-quote, .search-button { display: none !important; }
  .menu-button {
    position: static !important; display: inline-grid !important; grid-column: 3 !important; grid-row: 1 !important;
    width: 46px !important; height: 46px !important; margin: 0 !important; visibility: visible !important; transform: none !important;
  }
  html[dir="ltr"] .menu-button { grid-column: 1 !important; }
  .header-inner > .brand {
    position: static !important; grid-column: 2 !important; grid-row: 1 !important; justify-self: center !important;
    margin: 0 !important; transform: none !important;
  }
  .header-inner > .brand .brand-logo { width: min(162px,45vw) !important; height: 52px !important; }
  .header-actions { grid-column: 1 !important; grid-row: 1 !important; visibility: hidden !important; pointer-events: none !important; }
  html[dir="ltr"] .header-actions { grid-column: 3 !important; }
  .mobile-drawer { right: 0 !important; left: auto !important; width: min(350px,86vw) !important; transform: translateX(105%) !important; }
  .mobile-drawer.open { transform: translateX(0) !important; }
  html[dir="ltr"] .mobile-drawer { right: auto !important; left: 0 !important; transform: translateX(-105%) !important; }
  html[dir="ltr"] .mobile-drawer.open { transform: translateX(0) !important; }
  body[data-page="home"] .hero { --hero-h: 700px; --copy-y: 205px; --stage-h: 275px; --visual-w: min(800px,94vw); }
  body[data-page="home"] #hero-title { max-width: calc(100vw - 44px) !important; font-size: clamp(31px,4.8vw,40px) !important; }
}

@media (max-width: 620px) {
  html, body { width: 100%; max-width: 100%; overflow-x: hidden !important; }
  body[data-page="home"] .hero { --hero-h: 570px; --copy-y: 165px; --stage-h: 200px; --visual-w: 96vw; border-radius: 0 0 26px 26px !important; }
  body[data-page="home"] .hero-ceiling { top: -210px !important; width: 165vw !important; height: 350px !important; }
  body[data-page="home"] .hero-ceiling::before { bottom: -7px !important; width: 112vw !important; height: 150px !important; }
  body[data-page="home"] #hero-eyebrow { top: 100px !important; font-size: 9.5px !important; }
  body[data-page="home"] #hero-copy { width: calc(100% - 20px) !important; }
  body[data-page="home"] #hero-title { max-width: calc(100vw - 28px) !important; font-size: clamp(24px,7vw,29px) !important; line-height: 1.16 !important; letter-spacing: 0 !important; }
  body[data-page="home"] #hero-title-main, body[data-page="home"] #hero-title-accent { display: block !important; }
  body[data-page="home"] #hero-title-accent { margin-inline-start: 0 !important; margin-top: 3px !important; }
  body[data-page="home"] .hero-subtitle { width: calc(100vw - 40px) !important; margin-top: 12px !important; font-size: 11px !important; }
  body[data-page="home"] .hero-cta { min-height: 46px !important; margin-top: 24px !important; }
  body[data-page="home"] .hero-stage::before { width: 108vw !important; height: 68px !important; bottom: 4px !important; }
  body[data-page="home"] .stage-orbit-outer { width: 105vw !important; height: 74px !important; bottom: 7px !important; }
  body[data-page="home"] .stage-orbit-inner { width: 80vw !important; height: 48px !important; bottom: 19px !important; }
  body[data-page="home"] #hero-image { bottom: 10px !important; max-height: 185px !important; }
}

@media (max-width: 390px) {
  body[data-page="home"] .hero { --hero-h: 555px; --stage-h: 188px; }
  body[data-page="home"] #hero-title { font-size: clamp(23px,6.8vw,27px) !important; }
  body[data-page="home"] #hero-image { max-height: 172px !important; }
}
