/* Vietnam GoEasy v267U public UI browser visual QA lock.
   Purpose: final small browser-readiness guards after public CSS consolidation pass 2.
   Scope: public customer-facing pages and Ads landing pages only; admin pages must not load this file. */

:root{
  --vge-ui-lock-safe-bottom: calc(18px + env(safe-area-inset-bottom));
}

html,body{
  max-width:100%;
  overflow-x:hidden;
}

body{
  -webkit-text-size-adjust:100%;
  text-rendering:optimizeLegibility;
}

img,svg,video,canvas,iframe{
  max-width:100%;
}

/* Prevent long references/emails/URLs from breaking mobile layouts. */
main,section,article,.container,.page-section,.card,.panel,.service-card,.trust-card,.lp-card,.fee-card,.order-card,.faq-card{
  overflow-wrap:anywhere;
}

/* Final tap target and keyboard focus polish. */
a,button,.btn,.lp-cta,.header-cta,.nav-cta,input,select,textarea,label[for]{
  -webkit-tap-highlight-color:rgba(16,185,129,.18);
}

a:focus-visible,button:focus-visible,.btn:focus-visible,.lp-cta:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid rgba(37,99,235,.45);
  outline-offset:3px;
}

button,.btn,.lp-cta,.header-cta,.nav-cta,.vge-mobile-menu-button,.vge-mobile-menu-close{
  min-height:44px;
}

/* Ensure tables/pricing blocks never cause horizontal page overflow. */
.table-wrap,.pricing-table-wrap,.fee-table-wrap,.pricing-table,.fee-table,.comparison-table{
  max-width:100%;
}

.table-wrap,.pricing-table-wrap,.fee-table-wrap{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

table{
  max-width:100%;
}

/* Final header/menu browser lock. */
.site-header,.top-nav,.public-header,.lp-header{
  isolation:isolate;
}

.vge-mobile-menu-drawer{
  max-height:min(78vh,680px);
  overflow-y:auto;
  overscroll-behavior:contain;
  z-index:1200;
}

body.vge-mobile-menu-scroll-lock{
  overflow:hidden;
  touch-action:none;
}

/* Final hero guard: keep first viewport readable on mobile. */
.hero,.page-hero,.service-hero,.trust-hero,.lp-hero{
  overflow:hidden;
}

.hero h1,.page-hero h1,.service-hero h1,.trust-hero h1,.lp-hero h1{
  text-wrap:balance;
}

.hero p,.page-hero p,.service-hero p,.trust-hero p,.lp-hero p{
  text-wrap:pretty;
}

/* Final floating controls lock: only one priority surface should be active. */
body.vge-any-chat-open .whatsapp-float,
body.vge-any-chat-open .whatsapp-floating,
body.vge-any-chat-open .floating-whatsapp,
body.vge-any-chat-open .vge-whatsapp-float,
body.vge-any-chat-open .floating-contact,
body.vge-any-chat-open .lp-sticky-cta,
body.vge-any-chat-open .mobile-sticky-cta,
body.vge-any-chat-open .sticky-cta,
body.vge-mobile-menu-open .whatsapp-float,
body.vge-mobile-menu-open .whatsapp-floating,
body.vge-mobile-menu-open .floating-whatsapp,
body.vge-mobile-menu-open .vge-whatsapp-float,
body.vge-mobile-menu-open .floating-contact,
body.vge-mobile-menu-open .lp-sticky-cta,
body.vge-mobile-menu-open .mobile-sticky-cta,
body.vge-mobile-menu-open .sticky-cta,
body.vge-floating-controls-suppressed .whatsapp-float,
body.vge-floating-controls-suppressed .whatsapp-floating,
body.vge-floating-controls-suppressed .floating-whatsapp,
body.vge-floating-controls-suppressed .vge-whatsapp-float,
body.vge-floating-controls-suppressed .floating-contact,
body.vge-floating-controls-suppressed .lp-sticky-cta,
body.vge-floating-controls-suppressed .mobile-sticky-cta,
body.vge-floating-controls-suppressed .sticky-cta{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(12px) scale(.96)!important;
}

.vge-chatbot-widget,.vge-chatbot-panel,.vge-lsc-widget,.vge-lsc-panel{
  max-width:calc(100vw - 24px);
}

@media (max-width: 920px){
  body{
    padding-bottom:env(safe-area-inset-bottom);
  }

  .container,.lp-container,.page-container{
    width:min(100% - 32px, var(--container-max, 1180px));
  }

  .hero,.page-hero,.service-hero,.trust-hero,.lp-hero{
    min-height:auto;
  }

  .hero h1,.page-hero h1,.service-hero h1,.trust-hero h1,.lp-hero h1{
    font-size:clamp(2rem,8.7vw,3rem);
  }

  .hero-actions,.cta-row,.btn-row,.lp-hero-actions{
    width:100%;
  }

  .hero-actions > *,.cta-row > *,.btn-row > *,.lp-hero-actions > *{
    max-width:100%;
  }

  .whatsapp-float,.whatsapp-floating,.floating-whatsapp,.vge-whatsapp-float,.floating-contact{
    right:14px!important;
    bottom:var(--vge-ui-lock-safe-bottom)!important;
  }

  .lp-sticky-cta,.mobile-sticky-cta,.sticky-cta{
    left:12px;
    right:12px;
    bottom:var(--vge-ui-lock-safe-bottom);
    max-width:calc(100vw - 24px);
  }
}


/* v281G — desktop header / logo / navigation readability hotfix
   Goal: make the primary logo more prominent and increase nav label size/spacing
   without changing the locked public UI structure. Public pages only. */
@media (min-width: 901px){
  .topbar .container.nav,
  .topbar .nav{
    min-height: 82px !important;
    gap: 20px !important;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .topbar .brand.brand-logo,
  .topbar .brand-logo{
    flex: 0 0 auto;
    min-width: 220px;
  }

  .topbar .brand.brand-logo img,
  .topbar .brand-logo img,
  .topbar img.logo-dark{
    max-height: 54px !important;
    width: auto;
  }

  .topbar .navlinks{
    gap: 12px !important;
    margin-left: auto;
  }

  .topbar .navlinks a:not(.btn){
    padding: 10px 12px !important;
    font-size: 1.02rem !important;
    line-height: 1.16 !important;
    letter-spacing: 0.01em;
    font-weight: 780 !important;
  }

  .topbar .navlinks .nav-apply-btn,
  .topbar .navlinks a.btn,
  .topbar .navlinks a.lp-cta{
    min-height: 44px !important;
    padding: 11px 18px !important;
    font-size: 1rem !important;
    font-weight: 820 !important;
  }
}

@media (min-width: 901px) and (max-width: 1280px){
  .topbar .container.nav,
  .topbar .nav{
    min-height: 78px !important;
    gap: 16px !important;
  }

  .topbar .brand.brand-logo img,
  .topbar .brand-logo img,
  .topbar img.logo-dark{
    max-height: 50px !important;
  }

  .topbar .navlinks{
    gap: 8px !important;
  }

  .topbar .navlinks a:not(.btn){
    padding: 9px 10px !important;
    font-size: 0.95rem !important;
  }

  .topbar .navlinks .nav-apply-btn,
  .topbar .navlinks a.btn,
  .topbar .navlinks a.lp-cta{
    padding: 10px 16px !important;
    font-size: 0.95rem !important;
  }
}

@media (min-width: 901px) and (max-width: 1120px){
  .topbar .brand.brand-logo,
  .topbar .brand-logo{
    min-width: 190px;
  }

  .topbar .brand.brand-logo img,
  .topbar .brand-logo img,
  .topbar img.logo-dark{
    max-height: 46px !important;
  }

  .topbar .navlinks a:not(.btn){
    padding: 8px 8px !important;
    font-size: 0.88rem !important;
  }

  .topbar .navlinks .nav-apply-btn,
  .topbar .navlinks a.btn,
  .topbar .navlinks a.lp-cta{
    padding: 9px 13px !important;
    font-size: 0.9rem !important;
  }
}