/* ========================================================================== 
   COSTA RICA RELOCATION GROUP — ORIGINAL LOGO ONLY / V8
   The only logo image used is the user-supplied original PNG (Logo Final.png).
   No logo reconstruction and no raster assets cropped from the brand board.
   ========================================================================== */

/* Header: give the original stacked lockup enough breathing room. */

/* Keep the header pure white at all times, including after scroll. */
.site-header,
.site-header.scrolled {
  background: #ffffff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.site-header {
  height: 106px;
}

.site-header.scrolled {
  height: 92px;
}

.site-header .header-inner {
  justify-content: flex-start;
  align-items: center;
}

.site-header .brand-logo {
  flex: 0 0 auto;
  margin-right: clamp(2.4rem, 3.5vw, 4rem);
  align-self: center;
}

.site-header .header-logo-img {
  display: block;
  width: 150px;
  height: auto;
  max-width: 150px;
  max-height: 76px;
  object-fit: contain;
}

.site-header.scrolled .header-logo-img {
  width: 136px;
  max-width: 136px;
  max-height: 68px;
}

.site-header .main-nav {
  flex: 1 1 auto;
  justify-content: flex-start;
  gap: clamp(0.85rem, 1.15vw, 1.45rem);
  min-width: 0;
}

.site-header .header-actions {
  margin-left: auto;
  padding-left: 1.25rem;
  flex: 0 0 auto;
}

/* No derived logo watermark until an official transparent/isotipo asset is available. */
.hero::after,
.brand-watermark-hero::after {
  display: none !important;
  content: none !important;
}

/* Footer: typography only. We deliberately do not use a recreated or board-cropped logo. */
.footer-logo-wrap,
.footer-logo-img,
.compact-footer-logo {
  display: none !important;
}

.footer-brand-signature {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  margin: 0 0 0.9rem;
  line-height: 1;
}

.footer-brand-title {
  color: #FFFFFF;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(1.35rem, 1.7vw, 1.75rem);
  font-weight: 500;
  letter-spacing: 0.18em;
  white-space: nowrap;
}

.footer-brand-subtitle {
  margin-top: 0.38rem;
  color: var(--color-accent);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.32em;
  white-space: nowrap;
}

.footer-brand-signature--compact {
  align-items: center;
  width: 100%;
  margin-bottom: 1rem;
}

.site-footer {
  padding-top: 3.15rem;
  padding-bottom: 1.2rem;
}

.footer-top {
  gap: 2.1rem;
  margin-bottom: 2rem;
}

.footer-brand p {
  margin-top: 0.35rem;
  max-width: 315px;
}

.footer-bottom {
  padding-top: 1.1rem;
}

.legal-notice {
  margin-top: 0.8rem;
}

/* Mobile contact bar icon sizing. */
.mobile-sticky-inner .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.42rem;
}

.mobile-contact-icon {
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.mobile-contact-icon svg {
  width: 18px;
  height: 18px;
  display: block;
  stroke: currentColor;
}

@media (max-width: 1200px) and (min-width: 769px) {
  .site-header .brand-logo {
    margin-right: 2rem;
  }

  .site-header .header-logo-img {
    width: 132px;
    max-width: 132px;
    max-height: 67px;
  }

  .site-header.scrolled .header-logo-img {
    width: 122px;
    max-width: 122px;
    max-height: 62px;
  }

  .site-header .main-nav {
    gap: 0.68rem;
  }

  .site-header .nav-link {
    font-size: 0.87rem;
  }

  .site-header .header-actions {
    padding-left: 0.75rem;
  }
}

@media (max-width: 1024px) and (min-width: 769px) {
  .site-header {
    height: 94px;
  }

  .site-header.scrolled {
    height: 84px;
  }

  .site-header .header-logo-img {
    width: 120px;
    max-width: 120px;
    max-height: 61px;
  }

  .site-header .brand-logo {
    margin-right: 1.45rem;
  }

  .site-header .main-nav {
    gap: 0.44rem;
  }

  .site-header .nav-link {
    font-size: 0.82rem;
  }

  .site-header .header-actions .btn {
    padding-left: 0.8rem;
    padding-right: 0.8rem;
  }
}

@media (max-width: 768px) {
  .site-header,
  .site-header.scrolled {
    height: 82px;
  }

  .site-header .header-inner {
    justify-content: space-between;
    align-items: center;
  }

  .site-header .brand-logo {
    margin-right: 0;
    height: 100%;
    display: flex;
    align-items: center;
  }

  .site-header .header-logo-img,
  .site-header.scrolled .header-logo-img {
    width: 100px;
    max-width: 100px;
    max-height: 54px;
    height: auto;
    object-fit: contain;
  }

  .mobile-toggle {
    margin-left: auto;
  }

  .site-footer {
    padding-top: 2.75rem;
    padding-bottom: 1.1rem;
  }

  .footer-top {
    margin-bottom: 1.65rem;
  }

  .footer-brand-signature {
    margin-bottom: 0.7rem;
  }

  .footer-brand-title {
    font-size: 1.35rem;
  }

  .footer-brand-subtitle {
    font-size: 0.67rem;
  }
}

@media (max-width: 360px) {
  .site-header .header-logo-img,
  .site-header.scrolled .header-logo-img {
    width: 92px;
    max-width: 92px;
    max-height: 50px;
  }

  .mobile-contact-icon,
  .mobile-contact-icon svg {
    width: 16px;
    height: 16px;
  }
}


/* ========================================================================== 
   V11 SEO / CONVERSION CONTENT SUPPORT
   ========================================================================== */
.seo-feature-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
  margin: 2rem 0 2.5rem;
}
.seo-feature-card {
  border: 1px solid var(--color-border);
  border-radius: 14px;
  padding: 1.4rem;
  background: #fff;
}
.seo-feature-card h3 { margin-bottom: .55rem; font-size: 1.05rem; }
.seo-feature-card p { margin: 0; }
.seo-check-list, .seo-number-list {
  display: flex;
  flex-direction: column;
  gap: .85rem;
  margin: 1.35rem 0 2.4rem;
  padding-left: 1.25rem;
}
.seo-check-list li, .seo-number-list li { padding-left: .25rem; }
.cta-actions { display:flex; flex-wrap:wrap; gap: .9rem; justify-content:center; margin-top:1.25rem; }
.resource-intro-copy { text-align:left; }
.official-sources-section { border-top: 1px solid var(--color-border); }
.official-sources-section h2 { font-size: 1.35rem; margin-bottom: .65rem; }
.official-sources-section p { font-size: .94rem; }
.official-sources-list { margin-top: .9rem; padding-left: 1.2rem; display:flex; flex-direction:column; gap:.45rem; }
.official-sources-list a { text-decoration: underline; text-underline-offset: 2px; }

/* Desktop footer headings keep their established visual style. */
.footer-accordion-toggle {
  appearance: none;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-transform: inherit;
  letter-spacing: inherit;
  width: 100%;
  text-align: left;
  cursor: default;
}
.footer-accordion-icon { display:none; }

@media (max-width: 768px) {
  .seo-feature-grid { grid-template-columns: 1fr; gap: .9rem; }
  .seo-feature-card { padding: 1.1rem; }
  .cta-actions { flex-direction:column; align-items:stretch; }
  .cta-actions .btn { width:100%; }

  /* Compact mobile footer: crawlable links stay in HTML, users expand only what they need. */
  .site-footer .footer-top { gap: 0; }
  .site-footer .footer-col { border-top: 1px solid rgba(255,255,255,.09); }
  .site-footer .footer-col:last-child { border-bottom: 1px solid rgba(255,255,255,.09); }
  .site-footer .footer-col h4 { margin:0; }
  .site-footer .footer-col h4::after { display:none; }
  .footer-accordion-toggle {
    min-height: 52px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    cursor:pointer;
    color:#fff;
  }
  .footer-accordion-icon { display:inline-block; color:var(--color-accent); font-size:1.35rem; line-height:1; transition:transform .2s ease; }
  .site-footer .footer-col .footer-links { display:none; padding: .2rem 0 1.15rem; }
  .site-footer .footer-col.is-open .footer-links { display:flex; }
  .site-footer .footer-col.is-open .footer-accordion-icon { transform:rotate(45deg); }
  .site-footer { padding-top: 2.6rem; }
  .site-footer .footer-brand { margin-bottom: 1.4rem; }
}

/* V14 — Consistent desktop dropdown navigation on every page */
@media (min-width: 993px) {
  .site-header .nav-dropdown {
    padding-bottom: 0.35rem;
    margin-bottom: -0.35rem;
  }
  .site-header .dropdown-menu {
    top: calc(100% - 0.1rem);
  }
  .site-header .dropdown-item.active {
    color: var(--color-accent);
    font-weight: 700;
    background: rgba(173, 138, 75, 0.08);
  }
}

/* ========================================================================== 
   V15 — ALWAYS-VISIBLE QUICK CONTACTS
   Desktop: Text + WhatsApp + Call as compact icon-only actions.
   Mobile: Text icon in header; sticky footer remains WhatsApp + Call + Text.
   ========================================================================== */

.site-header .header-inner {
  max-width: 1480px;
}

.header-quick-contact {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  margin-right: 0.15rem;
  padding-left: 0.8rem;
  padding-right: 0.85rem;
  border-left: 1px solid #E2E8F0;
  border-right: 1px solid #E2E8F0;
  flex: 0 0 auto;
}

.header-contact-icon,
.mobile-header-text {
  position: relative;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #D8E0E8;
  border-radius: 50%;
  color: var(--color-primary);
  background: #FFFFFF;
  box-shadow: 0 1px 2px rgba(11,31,56,.05);
  text-decoration: none;
  transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.header-contact-icon svg,
.mobile-header-text svg {
  width: 17px;
  height: 17px;
  display: block;
  flex: 0 0 auto;
}

.header-contact-whatsapp {
  color: #1BAA59;
}

.header-contact-whatsapp svg {
  width: 18px;
  height: 18px;
}

.header-contact-icon:hover,
.header-contact-icon:focus-visible,
.mobile-header-text:hover,
.mobile-header-text:focus-visible {
  background: #F8FAFC;
  border-color: #B8C5D2;
  color: var(--color-primary);
  box-shadow: 0 2px 7px rgba(11,31,56,.10);
  transform: translateY(-1px);
  outline: none;
}

.header-contact-whatsapp:hover,
.header-contact-whatsapp:focus-visible {
  color: #128C4A;
  border-color: rgba(27,170,89,.38);
  background: #F4FBF7;
}

.header-contact-icon::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 50%;
  top: calc(100% + 8px);
  transform: translate(-50%, -2px);
  padding: 0.38rem 0.55rem;
  border-radius: 5px;
  background: var(--color-primary-dark);
  color: #fff;
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
  z-index: 1200;
}

.header-contact-icon:hover::after,
.header-contact-icon:focus-visible::after {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}

.mobile-header-text {
  position: relative;
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: var(--color-primary);
  background: transparent;
  text-decoration: none;
  transition: background-color .18s ease, color .18s ease, transform .18s ease;
}

.header-contact-icon svg,
.mobile-header-text svg {
  width: 20px;
  height: 20px;
  display: block;
}

.header-contact-whatsapp {
  color: #1FBF63;
}

.header-contact-icon:hover,
.header-contact-icon:focus-visible,
.mobile-header-text:hover,
.mobile-header-text:focus-visible {
  background: #F4F7FA;
  color: var(--color-primary);
  outline: none;
}

.header-contact-whatsapp:hover,
.header-contact-whatsapp:focus-visible {
  color: #159B4E;
}

.header-contact-icon::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 50%;
  top: calc(100% + 7px);
  transform: translate(-50%, -2px);
  padding: 0.35rem 0.52rem;
  border-radius: 5px;
  background: var(--color-primary-dark);
  color: #fff;
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
  z-index: 1200;
}

.header-contact-icon:hover::after,
.header-contact-icon:focus-visible::after {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}

.mobile-header-text {
  display: none;
}

@media (max-width: 1200px) and (min-width: 769px) {
  .site-header .header-inner {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .header-quick-contact {
    gap: 0.3rem;
    padding-left: 0.55rem;
    padding-right: 0.55rem;
  }

  .header-contact-icon {
    width: 32px;
    height: 32px;
  }

  .header-contact-icon svg {
    width: 15.5px;
    height: 15.5px;
  }

  .header-contact-whatsapp svg {
    width: 16.5px;
    height: 16.5px;
  }
}

/* At compact tablet widths, keep the highest-value US/Canada quick action visible
   without overcrowding the full desktop navigation. */
@media (max-width: 1100px) and (min-width: 769px) {
  .header-contact-whatsapp,
  .header-contact-call {
    display: none;
  }
}

@media (max-width: 768px) {
  .mobile-header-text {
    display: inline-flex;
    width: 42px;
    height: 42px;
    margin-left: auto;
    margin-right: 0.15rem;
  }

  .mobile-header-text svg {
    width: 22px;
    height: 22px;
  }

  .mobile-toggle {
    margin-left: 0.1rem !important;
  }
}


/* V17 — refined quick contact + footer contact rows */
.footer-contact-stack {
  margin-top: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.footer-contact-row {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  width: fit-content;
  color: #FFFFFF;
  text-decoration: none;
}

.footer-contact-row:hover,
.footer-contact-row:focus-visible {
  color: #FFFFFF;
  opacity: 0.94;
  text-decoration: none;
  outline: none;
}

.footer-contact-row svg {
  width: 16px;
  height: 16px;
  color: var(--color-accent);
  flex: 0 0 16px;
}

.footer-contact-copy {
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
}

.footer-contact-label {
  color: #94A3B8;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.1;
  text-transform: uppercase;
}

.footer-contact-value {
  color: #FFFFFF;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.2;
}

.header-contact-whatsapp svg {
  width: 17px;
  height: 17px;
}


/* V18 — robust quick-contact sizing and simplified footer contacts */
.header-contact-icon, .header-contact-icon svg { box-sizing: border-box; }
.header-contact-icon svg { width:18px !important; height:18px !important; max-width:18px !important; max-height:18px !important; flex:0 0 18px !important; }
.header-contact-whatsapp { color:#20B858; }
.header-contact-whatsapp svg { width:18px !important; height:18px !important; }
.footer-contact-stack { margin-top:1.35rem; display:flex; flex-direction:column; align-items:flex-start; gap:.55rem; }
.footer-contact-text-row { display:inline-flex; align-items:baseline; gap:.48rem; font-size:.88rem; line-height:1.35; text-decoration:none; width:auto; }
.footer-contact-text-label { color:#94A3B8; font-weight:600; }
.footer-contact-text-value { color:#FFFFFF; font-weight:600; }
.footer-contact-text-row:hover .footer-contact-text-value, .footer-contact-text-row:focus-visible .footer-contact-text-value { color:var(--color-accent); }


/* V21 — footer realignment + refined header icons */
.header-contact-icon {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
}
.header-contact-icon svg {
  width: 21px !important;
  height: 21px !important;
  max-width: 21px !important;
  max-height: 21px !important;
  flex: 0 0 21px !important;
}
.header-contact-whatsapp {
  color: #22C55E !important;
}
.header-contact-whatsapp svg {
  width: 21px !important;
  height: 21px !important;
}
.footer-contact-stack {
  margin-top: 1.35rem !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 0.65rem !important;
}
.footer-contact-text-row {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  text-decoration: none !important;
  font-size: 0.95rem !important;
  line-height: 1.4 !important;
  width: fit-content !important;
}
.footer-contact-text-label {
  color: #94A3B8 !important;
  font-weight: 600 !important;
}
.footer-contact-text-value {
  color: #FFFFFF !important;
  font-weight: 600 !important;
}
.footer-contact-text-row:hover .footer-contact-text-value,
.footer-contact-text-row:focus-visible .footer-contact-text-value {
  color: var(--color-accent) !important;
}


/* V22 — visual polish: tighter header alignment + stacked footer contact rows */
.site-header .header-actions {
  gap: 0.9rem !important;
  padding-left: 1rem !important;
}
.header-quick-contact {
  gap: 0.52rem !important;
  margin-right: 0 !important;
  padding-left: 0.72rem !important;
  padding-right: 0.72rem !important;
}
.header-contact-icon {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
}
.header-contact-icon svg {
  width: 22px !important;
  height: 22px !important;
  max-width: 22px !important;
  max-height: 22px !important;
  flex: 0 0 22px !important;
}
.header-contact-whatsapp {
  color: #22C55E !important;
}
.header-contact-whatsapp svg {
  width: 22px !important;
  height: 22px !important;
}
.footer-contact-stack {
  margin-top: 1.35rem !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 0.5rem !important;
}
.footer-contact-stack > div {
  display: block !important;
  width: 100% !important;
}
.footer-contact-stack > a.footer-contact-text-row {
  display: flex !important;
  width: 100% !important;
  align-items: center !important;
}
.footer-contact-text-row {
  gap: 0.5rem !important;
  font-size: 0.95rem !important;
  line-height: 1.45 !important;
  text-decoration: none !important;
}
.footer-contact-text-label {
  min-width: 5.4rem !important;
  color: #94A3B8 !important;
  font-weight: 600 !important;
}
.footer-contact-text-value {
  color: #FFFFFF !important;
  font-weight: 600 !important;
}
.footer-contact-text-row + .footer-contact-text-row {
  margin-top: 0.08rem !important;
}
@media (max-width: 1200px) and (min-width: 769px) {
  .site-header .header-actions {
    gap: 0.72rem !important;
    padding-left: 0.85rem !important;
  }
  .header-quick-contact {
    gap: 0.4rem !important;
    padding-left: 0.55rem !important;
    padding-right: 0.55rem !important;
  }
  .header-contact-icon {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
  }
  .header-contact-icon svg,
  .header-contact-whatsapp svg {
    width: 19px !important;
    height: 19px !important;
    max-width: 19px !important;
    max-height: 19px !important;
  }
}


/* V23 — FINAL VISUAL QA */
.site-header .header-actions {
  display:flex !important;
  align-items:center !important;
  gap:.85rem !important;
  padding-left:.95rem !important;
}
.header-quick-contact {
  display:inline-flex !important;
  align-items:center !important;
  gap:.5rem !important;
  margin-right:0 !important;
  padding-left:.7rem !important;
  padding-right:.7rem !important;
}
.header-contact-icon {
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  min-height:44px !important;
  flex:0 0 44px !important;
}
.header-contact-icon svg,
.header-contact-whatsapp svg {
  width:22px !important;
  height:22px !important;
  max-width:22px !important;
  max-height:22px !important;
  flex:0 0 22px !important;
}
.header-contact-whatsapp { color:#22C55E !important; }

.footer-top {
  display:grid !important;
  grid-template-columns:2fr 1fr 1fr 1fr 1.25fr !important;
  align-items:start !important;
}
.footer-brand { min-width:0 !important; }
.footer-contact-stack {
  margin-top:1.35rem !important;
  display:block !important;
}
.footer-contact-line {
  display:block !important;
  width:100% !important;
  margin-top:.55rem !important;
}
.footer-contact-line:first-child { margin-top:0 !important; }
.footer-contact-line--whatsapp { margin-bottom:.25rem !important; }
.footer-contact-text-row {
  display:inline-flex !important;
  align-items:center !important;
  gap:.55rem !important;
  width:auto !important;
  max-width:100% !important;
  font-size:.93rem !important;
  line-height:1.35 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}
.footer-contact-text-label {
  display:inline-block !important;
  min-width:4.8rem !important;
  color:#94A3B8 !important;
  font-weight:600 !important;
}
.footer-contact-text-value {
  display:inline-block !important;
  color:#FFFFFF !important;
  font-weight:600 !important;
}
.footer-contact-text-row:hover .footer-contact-text-value,
.footer-contact-text-row:focus-visible .footer-contact-text-value { color:var(--color-accent) !important; }

@media (max-width:768px) {
  .footer-top { display:block !important; }
  .footer-contact-text-row { white-space:normal !important; }
  .footer-contact-line { margin-top:.62rem !important; }
}

@media (max-width:1200px) and (min-width:769px) {
  .site-header .header-actions { gap:.65rem !important; padding-left:.75rem !important; }
  .header-quick-contact { gap:.36rem !important; padding-left:.5rem !important; padding-right:.5rem !important; }
  .header-contact-icon {
    width:38px !important; height:38px !important; min-width:38px !important; min-height:38px !important; flex-basis:38px !important;
  }
  .header-contact-icon svg,
  .header-contact-whatsapp svg {
    width:19px !important; height:19px !important; max-width:19px !important; max-height:19px !important;
  }
}


/* V25 — MOBILE HEADER HARD RESET
   On mobile the desktop quick-contact group and Plan Your Move button must not
   participate in layout. Keep only: logo | Text | menu. */
@media screen and (max-width: 768px) {
  html, body {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .site-header,
  .site-header.scrolled {
    height: 78px !important;
    min-height: 78px !important;
    max-height: 78px !important;
  }

  .site-header .header-inner {
    width: 100% !important;
    max-width: 100% !important;
    height: 78px !important;
    min-height: 78px !important;
    padding-left: 16px !important;
    padding-right: 12px !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    overflow: visible !important;
  }

  .site-header .brand-logo {
    flex: 0 0 auto !important;
    width: auto !important;
    height: 100% !important;
    margin: 0 auto 0 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
  }

  .site-header .header-logo-img,
  .site-header.scrolled .header-logo-img {
    width: 96px !important;
    max-width: 96px !important;
    max-height: 54px !important;
    height: auto !important;
    object-fit: contain !important;
  }

  /* Desktop-only header actions must be completely absent on mobile. */
  .site-header .header-actions,
  .site-header .header-quick-contact,
  .site-header .header-actions .btn,
  .site-header .header-contact-icon {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
  }

  /* One quick action in the mobile header: Text. */
  .site-header .mobile-header-text {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    flex: 0 0 40px !important;
    margin: 0 2px 0 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #D8E0E8 !important;
    border-radius: 999px !important;
    background: #FFFFFF !important;
    color: var(--color-primary) !important;
    box-shadow: 0 1px 2px rgba(11,31,56,.05) !important;
  }

  .site-header .mobile-header-text svg {
    width: 20px !important;
    height: 20px !important;
    max-width: 20px !important;
    max-height: 20px !important;
  }

  .site-header .mobile-toggle {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    flex: 0 0 42px !important;
    margin: 0 !important;
    padding: 8px !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .site-header .mobile-toggle svg {
    width: 24px !important;
    height: 24px !important;
  }

  /* Mobile menu panel follows the actual 78px header. */
  .site-header .main-nav.open {
    max-height: calc(100dvh - 78px) !important;
  }

  body.mobile-menu-open::before {
    top: 78px !important;
  }
}

@media screen and (max-width: 360px) {
  .site-header .header-inner {
    padding-left: 12px !important;
    padding-right: 8px !important;
    gap: 4px !important;
  }
  .site-header .header-logo-img,
  .site-header.scrolled .header-logo-img {
    width: 88px !important;
    max-width: 88px !important;
  }
  .site-header .mobile-header-text {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    flex-basis: 38px !important;
  }
  .site-header .mobile-toggle {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    flex-basis: 40px !important;
  }
}


/* V25B — mobile viewport containment */
@media screen and (max-width: 768px) {
  .site-header,
  .hero,
  .section,
  .site-footer,
  .mobile-sticky-bar {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .site-header .container,
  .hero .container,
  .section .container,
  .site-footer .container {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}


/* V26 — mobile sticky contact icon refinement */
@media screen and (max-width: 768px) {
  .mobile-sticky-inner .mobile-contact-icon,
  .mobile-sticky-inner .mobile-contact-icon svg {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    max-width: 20px !important;
    max-height: 20px !important;
    flex: 0 0 20px !important;
  }

  .mobile-sticky-inner .mobile-contact-icon--whatsapp svg {
    fill: currentColor !important;
    stroke: none !important;
  }

  .mobile-sticky-inner .mobile-contact-icon--text svg {
    fill: none !important;
    stroke: none !important;
  }

  .mobile-sticky-inner .btn-message .mobile-contact-icon--text {
    color: var(--color-primary) !important;
  }

  .mobile-sticky-inner .btn {
    gap: 0.48rem !important;
  }
}


/* V27 — simplified conversion-first navigation + persistent mobile brand header */
.nav-mobile-cta {
  display: none;
}

@media screen and (max-width: 768px) {
  :root {
    --mobile-header-height: 80px;
  }

  html {
    scroll-padding-top: var(--mobile-header-height);
  }

  body {
    padding-top: var(--mobile-header-height) !important;
  }

  .site-header,
  .site-header.scrolled {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: var(--mobile-header-height) !important;
    min-height: var(--mobile-header-height) !important;
    max-height: var(--mobile-header-height) !important;
    background: #FFFFFF !important;
    z-index: 1200 !important;
    box-shadow: 0 1px 7px rgba(11,31,56,.08) !important;
  }

  .site-header .header-inner {
    height: var(--mobile-header-height) !important;
    min-height: var(--mobile-header-height) !important;
    padding: 0 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
  }

  .site-header .brand-logo {
    margin: 0 auto 0 0 !important;
    padding: 0 !important;
    height: var(--mobile-header-height) !important;
    display: flex !important;
    align-items: center !important;
    flex: 0 1 auto !important;
  }

  .site-header .header-logo-img,
  .site-header.scrolled .header-logo-img {
    width: 118px !important;
    max-width: 118px !important;
    max-height: 62px !important;
    height: auto !important;
    object-fit: contain !important;
  }

  /* Mobile header is intentionally only the full CRRG logo + hamburger. */
  .site-header .mobile-header-text,
  .site-header .header-actions,
  .site-header .header-quick-contact,
  .site-header .header-actions .btn,
  .site-header .header-contact-icon {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  .site-header .mobile-toggle {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    flex: 0 0 44px !important;
    margin: 0 !important;
    padding: 9px !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--color-primary) !important;
  }

  .site-header .mobile-toggle svg {
    width: 26px !important;
    height: 26px !important;
  }

  /* Drawer sits directly beneath the fixed mobile header. */
  .site-header .main-nav.open {
    position: fixed !important;
    top: var(--mobile-header-height) !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: none !important;
    max-height: calc(100dvh - var(--mobile-header-height)) !important;
    padding: 0.7rem 1.25rem calc(1.5rem + env(safe-area-inset-bottom)) !important;
    overflow-y: auto !important;
    background: #FFFFFF !important;
    z-index: 1195 !important;
  }

  body.mobile-menu-open::before {
    top: var(--mobile-header-height) !important;
  }

  .site-header .main-nav.open > .nav-link,
  .site-header .main-nav.open .nav-dropdown > .dropdown-trigger {
    min-height: 54px !important;
    font-size: 1.02rem !important;
  }

  .nav-mobile-cta {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 50px !important;
    margin-top: 1rem !important;
    padding: 0.85rem 1rem !important;
    border-radius: 8px !important;
    background: var(--color-accent) !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    text-decoration: none !important;
  }
}

@media screen and (max-width: 360px) {
  .site-header .header-logo-img,
  .site-header.scrolled .header-logo-img {
    width: 108px !important;
    max-width: 108px !important;
  }
}