/**
 * WordPress theme shell — scope hub styles without overriding global body/nav.
 * Loaded only on pages that use [twi_residency_hub].
 */

body.twi-residency-hub-page {
  overflow-x: visible;
  /* Fallback until JS measures header; inline style on body overrides when main.js runs */
  --twi-sticky-top: 86px;
  --twi-header-bottom: 0px;
  background:
    radial-gradient(ellipse 80% 50% at 50% -10%, var(--body-bg-gold), transparent 55%),
    linear-gradient(180deg, var(--bg-base) 0%, var(--bg-mid) 50%, var(--bg-soft) 100%) !important;
  color: inherit;
  letter-spacing: normal;
}

/*
 * Divi Theme Builder “canvas” fullscreen menu is position:fixed over the whole
 * viewport with overflow:scroll even while closed (opacity:0 / visibility:hidden).
 * That inert scrollport steals mouse-wheel events; middle-click autoscroll still
 * works because it bypasses hit-testing. Keep the canvas non-interactive until
 * .is-opened, then restore scrolling for the menu itself.
 */
body.twi-residency-hub-page .canvas-fullscreen-menu:not(.is-opened) {
  pointer-events: none !important;
  overflow: hidden !important;
}

body.twi-residency-hub-page .canvas-fullscreen-menu.is-opened {
  pointer-events: auto !important;
  overflow: auto !important;
}

body.twi-residency-hub-page #page-container,
body.twi-residency-hub-page #et-boc,
body.twi-residency-hub-page #main-content,
body.twi-residency-hub-page #content-area,
body.twi-residency-hub-page #left-area,
body.twi-residency-hub-page article.page,
body.twi-residency-hub-page .entry-content,
body.twi-residency-hub-page .et_pb_post_content,
body.twi-residency-hub-page #main-content .container {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

body.twi-residency-hub-page #page-container,
body.twi-residency-hub-page #et-boc,
body.twi-residency-hub-page #et-main-area,
body.twi-residency-hub-page #main-content {
  overflow: visible !important;
  transform: none !important;
}

body.twi-residency-hub-page #main-content,
body.twi-residency-hub-page #et-main-area {
  overflow: visible !important;
  height: auto;
  max-height: none;
}

body.twi-residency-hub-page #content-area,
body.twi-residency-hub-page #left-area,
body.twi-residency-hub-page article.page,
body.twi-residency-hub-page .entry-content {
  overflow: visible !important;
}

body.twi-residency-hub-page #main-content .container,
body.twi-residency-hub-page #content-area,
body.twi-residency-hub-page #left-area,
body.twi-residency-hub-page .et_pb_post_content,
body.twi-residency-hub-page .entry-content {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  width: 100% !important;
  float: none !important;
}

body.twi-residency-hub-page .entry-title,
body.twi-residency-hub-page .et_post_meta_wrapper,
body.twi-residency-hub-page .et_pb_title_container,
body.twi-residency-hub-page .et_pb_post_title,
body.twi-residency-hub-page .et_pb_module.et_pb_post_title {
  display: none !important;
}

body.admin-bar.twi-residency-hub-page {
  --twi-sticky-top: 118px;
}

@media (max-width: 782px) {
  body.admin-bar.twi-residency-hub-page {
    --twi-sticky-top: 100px;
  }
}

@media (max-width: 767px) {
  body.twi-residency-hub-page {
    --twi-sticky-top: 72px;
  }

  body.admin-bar.twi-residency-hub-page {
    --twi-sticky-top: 100px;
  }

  body.twi-residency-hub-page #et-main-area,
  body.twi-residency-hub-page #main-content,
  body.twi-residency-hub-page .twi-residency-hub.page {
    padding-top: 0 !important;
  }

  body.twi-residency-hub-page .twi-residency-hub .hero {
    padding-top: 0;
    margin-top: 0;
  }

  body.twi-residency-hub-page header.et-l--header .et_pb_section_0_tb_header {
    display: none !important;
  }
}

body.twi-residency-hub-page #twi-residency-hub,
body.twi-residency-hub-page .programs-section,
body.twi-residency-hub-page article.page,
body.twi-residency-hub-page .et_builder_inner_content {
  overflow: visible !important;
  transform: none !important;
}

body.twi-residency-hub-page .twi-residency-hub {
  overflow-x: visible;
  background: transparent;
  color: var(--text);
  font: 400 15px/1.55 var(--font-body);
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
}

body.twi-residency-hub-page .twi-residency-hub .hero h1,
body.twi-residency-hub-page .twi-residency-hub .stats-band__value,
body.twi-residency-hub-page .twi-residency-hub .testimonial-card__quote,
body.twi-residency-hub-page .twi-residency-hub .cta-card h2,
body.twi-residency-hub-page .twi-residency-hub .articles-section h2 {
  font-family: var(--twi-theme-heading-font, var(--twi-hero-h1-font-family, var(--et_font_heading, var(--et_global_heading_font, var(--font-display)))));
  font-weight: var(--twi-theme-heading-weight, var(--twi-hero-h1-font-weight, var(--et_global_heading_font_weight, 600)));
  color: var(--heading);
}

body.twi-residency-hub-page .twi-residency-hub .cta-card__label {
  font-family: var(--et_font_body, var(--et_gf_body_0, var(--font-body)));
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-accent);
}

body.twi-residency-hub-page .twi-residency-hub .hero h1 {
  letter-spacing: var(--et_global_heading_letter_spacing, -0.03em);
  line-height: var(--et_global_heading_line_height, 1.08);
}

/* Product UI — stay on hub sans (cards, quick compare, filters) */
body.twi-residency-hub-page .twi-residency-hub .quick-comparison__title {
  font-family: var(--font-body);
  font-weight: 700;
}

body.twi-residency-hub-page .twi-residency-hub a:not([class]) {
  color: var(--text-accent);
}

body.twi-residency-hub-page #left-area {
  padding-bottom: 0;
}

body.twi-residency-hub-page article.page {
  padding: 0;
}

body.twi-residency-hub-page .twi-residency-hub ul,
body.twi-residency-hub-page .twi-residency-hub ol {
  list-style: none !important;
  padding-left: 0 !important;
}

body.twi-residency-hub-page .twi-residency-hub .how-steps {
  counter-reset: none;
}

body.twi-residency-hub-page .twi-residency-hub .how-steps > li::before,
body.twi-residency-hub-page .twi-residency-hub .how-steps > li::marker {
  content: none !important;
}

body.twi-residency-hub-page .twi-residency-hub .program-card--signature .program-card__highlights {
  list-style: none !important;
  padding-left: 0 !important;
  line-height: 1.25 !important;
}

body.twi-residency-hub-page .twi-residency-hub .program-card--signature .program-card__highlights li {
  margin-bottom: 2px !important;
}

body.twi-residency-hub-page .twi-residency-hub .program-card__highlights li::marker {
  content: none !important;
}

body.twi-residency-hub-page .twi-residency-hub .testimonial-card blockquote,
body.twi-residency-hub-page .twi-residency-hub .testimonial-card__quote {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  quotes: none;
}

body.twi-residency-hub-page .twi-residency-hub.page {
  padding-top: 0;
}

body.twi-residency-hub-page #main-footer,
body.twi-residency-hub-page #main-footer .container,
body.twi-residency-hub-page .et-l--footer {
  font-family: var(--et_font_body, var(--et_gf_body_0, "Open Sans", Arial, sans-serif)) !important;
  letter-spacing: normal;
}

body.twi-residency-hub-page .compare-bar,
body.twi-residency-hub-page .compare-bar .btn,
body.twi-residency-hub-page .compare-bar .btn-clear-filters,
body.twi-residency-hub-page .compare-panel,
body.twi-residency-hub-page .compare-panel .compare-panel__close {
  font-family: var(--font-body) !important;
}

body.twi-residency-hub-page .filter-toolbar__brand {
  display: none !important;
}

@media (min-width: 1024px) {
  body.twi-residency-hub-page .twi-residency-hub .hero {
    margin-top: -20px;
    padding-top: 28px;
    padding-bottom: 56px;
  }
}

@media (max-width: 767px) {
  body.twi-residency-hub-page .twi-residency-hub .hero {
    padding-top: 0;
    padding-bottom: 28px;
    margin-top: 0;
  }

  /* Divi container gap removed — title gets its own breathing room below nav */
  body.twi-residency-hub-page .twi-residency-hub .hero__copy {
    padding-top: 20px;
  }

  body.twi-residency-hub-page .twi-residency-hub .hero__copy .eyebrow {
    margin-top: 0;
    margin-bottom: 18px;
  }
}

body.twi-residency-hub-page .twi-residency-hub .program-card__flags > .flag-rect {
  width: 36px;
  border-radius: 4px;
  overflow: hidden;
}

body.twi-residency-hub-page .twi-residency-hub .program-card__flags .flag-stack .flag-rect {
  overflow: visible;
}

body.twi-residency-hub-page .twi-residency-hub .program-card__flags .flag-rect .fi {
  display: block;
  width: 36px;
  height: auto;
  aspect-ratio: 3 / 2;
  background-size: cover;
  background-position: center;
  border-radius: 0;
}

body.twi-residency-hub-page .twi-residency-hub .qc-dest__flag {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  overflow: hidden;
}

body.twi-residency-hub-page .twi-residency-hub .qc-dest__flag .fi {
  display: block;
  width: 26px !important;
  height: 26px !important;
  min-width: 26px;
  min-height: 26px;
  background-size: cover;
  background-position: center;
}

/* Sticky explorer toolbar — CSS sticky; JS sets --twi-sticky-top from Divi TB header */
body.twi-residency-hub-page .filter-section {
  position: sticky !important;
  top: var(--twi-sticky-top, 86px);
  z-index: 90;
  background: transparent;
}

body.twi-residency-hub-page header.et-l--header,
body.twi-residency-hub-page header.et-l--header .et_pb_sticky_module,
body.twi-residency-hub-page header.et-l--header .et_pb_section--with-menu,
body.twi-residency-hub-page header.et-l--header .et_mobile_menu,
body.twi-residency-hub-page header.et-l--header .nav li ul {
  z-index: 100000 !important;
}

@media (min-width: 768px) {
  body.twi-residency-hub-page .filter-toolbar__row {
    flex-wrap: nowrap;
  }
}

body.twi-residency-hub-page .twi-residency-hub .compare-col__flag .flag-rect,
body.twi-residency-hub-page .compare-col__flag .flag-rect {
  width: 36px;
  border-radius: 4px;
  overflow: hidden;
}

body.twi-residency-hub-page .twi-residency-hub .compare-col__flag .flag-rect .fi,
body.twi-residency-hub-page .compare-col__flag .flag-rect .fi {
  display: block;
  width: 36px !important;
  height: auto !important;
  min-width: 36px;
  aspect-ratio: 3 / 2;
  background-size: cover;
  background-position: center;
  border-radius: 0;
}