/* Main-site consistency overrides.
   Scope: homepage, academy, package pages, and system/product pages only.
   Do not load this stylesheet on the funnel step pages. */

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

html {
  overscroll-behavior-x: none;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

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

body {
  position: relative;
  min-width: 0;
  overscroll-behavior-x: none;
}

body > * {
  max-width: 100vw;
}

main,
section,
header,
footer,
.wrap,
.wrap-wide,
.container,
.page,
.page-shell,
.site-shell {
  max-width: 100%;
}

section,
.hero,
.section {
  overflow-x: clip;
}

#nav,
nav#nav,
nav.site-nav,
.site-nav,
header#nav,
header.site-nav,
.site-header,
.main-header,
body #nav.scrolled,
body #nav.nav-hidden {
  background: #fffaf5 !important;
  background-color: #fffaf5 !important;
  opacity: 1 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#nav,
nav#nav,
nav.site-nav,
.site-nav,
header#nav,
header.site-nav,
.site-header,
.main-header {
  z-index: 1000 !important;
}

.mobile-sticky-cta,
.fixed-bottom-cta,
.package-bottom-cta,
.bottom-demo-bar,
.sticky-demo-bar,
.mobile-bottom-actions,
.floating-demo,
.floating-booking,
.fixed-cta:not(#whatsapp-btn):not(.vapi-float),
.sticky-cta,
.bottom-cta,
.bottom-actions-fixed,
.site-bottom-actions,
.mobile-cta-bar,
.demo-floating,
.book-demo-floating,
.footer-sticky-cta,
.sticky-action-bar {
  display: none !important;
}

.package-demo::after,
a.package-demo::after,
.demo-link::after,
a.demo-link::after {
  content: none !important;
  display: none !important;
}

.top,
.top-urgency-bar,
.urgency-bar,
.announcement-bar {
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-align: center !important;
}

.top-urgency-inner,
.urgency-inner,
.top .inner,
.top-inner {
  max-width: 100% !important;
  margin-inline: auto !important;
  padding-inline: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  flex-wrap: wrap !important;
  gap: 8px 14px !important;
}

.top-urgency-inner > *,
.urgency-inner > *,
.top .inner > *,
.top-inner > *,
.discount-banner-inner > * {
  min-width: 0 !important;
}

.top-urgency-inner a,
.urgency-inner a,
.top .inner a,
.top-inner a {
  flex-shrink: 0 !important;
}

.discount-banner {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  z-index: 900 !important;
}

.discount-banner-inner {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding-inline: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  flex-wrap: wrap !important;
  gap: 8px 14px !important;
}

.discount-countdown {
  white-space: nowrap !important;
}

#whatsapp-btn {
  position: fixed !important;
  right: 18px !important;
  bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  z-index: 1200 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  max-width: calc(100vw - 36px) !important;
  overflow: hidden !important;
}

#whatsapp-btn svg {
  flex: 0 0 auto !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
}

#whatsapp-btn .wa-label {
  white-space: nowrap !important;
  line-height: 1 !important;
}

.vapi-float,
#vapi-widget {
  max-width: calc(100vw - 36px) !important;
}

.vapi-float {
  position: fixed !important;
  left: 18px !important;
  bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  z-index: 1199 !important;
}

body.discount-banner-visible #whatsapp-btn,
body.has-discount-banner #whatsapp-btn {
  bottom: calc(126px + env(safe-area-inset-bottom, 0px)) !important;
}

body.discount-banner-visible .vapi-float,
body.has-discount-banner .vapi-float,
body.discount-banner-visible #vapi-widget,
body.has-discount-banner #vapi-widget {
  bottom: calc(126px + env(safe-area-inset-bottom, 0px)) !important;
}

@media (max-width: 1100px) {
  #nav,
  nav#nav,
  nav.site-nav,
  .site-nav,
  header#nav,
  header.site-nav,
  .site-header,
  .main-header {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    background: #fffaf5 !important;
    background-color: #fffaf5 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
    overflow: visible !important;
  }

  #nav .nav-inner,
  .site-nav .nav-inner,
  .site-header .nav-inner,
  .main-header .nav-inner {
    width: 100% !important;
    max-width: 100% !important;
    height: 88px !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) 44px !important;
    align-items: center !important;
    padding: 0 18px !important;
    gap: 0 !important;
  }

  #nav .nav-inner::before,
  .site-nav .nav-inner::before,
  .site-header .nav-inner::before,
  .main-header .nav-inner::before {
    content: "" !important;
    grid-column: 1 !important;
    width: 44px !important;
    height: 44px !important;
    display: block !important;
  }

  #nav .nav-logo,
  .site-nav .nav-logo,
  .site-header .nav-logo,
  .main-header .nav-logo,
  nav .logo {
    grid-column: 2 !important;
    justify-self: center !important;
    align-self: center !important;
    max-width: min(270px, 58vw) !important;
    width: auto !important;
    margin: 0 auto !important;
    position: static !important;
    left: auto !important;
    transform: none !important;
  }

  #nav .nav-logo img,
  .site-nav .nav-logo img,
  .site-header .nav-logo img,
  .main-header .nav-logo img,
  nav .logo img {
    display: block !important;
    width: auto !important;
    max-width: min(270px, 58vw) !important;
    max-height: 76px !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  #nav .nav-hamburger,
  .site-nav .nav-hamburger,
  .site-header .nav-hamburger,
  .main-header .nav-hamburger,
  #nav .hamburger,
  .site-nav .hamburger,
  .site-header .hamburger,
  .main-header .hamburger,
  #nav .menu-toggle,
  .site-nav .menu-toggle,
  .site-header .menu-toggle,
  .main-header .menu-toggle,
  #nav .nav-toggle,
  .site-nav .nav-toggle,
  .site-header .nav-toggle,
  .main-header .nav-toggle {
    grid-column: 3 !important;
    justify-self: end !important;
    align-self: center !important;
    position: static !important;
    display: flex !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    transform: none !important;
  }

  #nav .nav-links,
  #nav .nav-actions,
  .site-nav .nav-links,
  .site-nav .nav-actions,
  .site-header .nav-links,
  .site-header .nav-actions,
  .main-header .nav-links,
  .main-header .nav-actions {
    display: none !important;
  }

  #nav .nav-mobile,
  .site-nav .nav-mobile,
  .site-header .nav-mobile,
  .main-header .nav-mobile {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    background: #fffaf5 !important;
    overflow-x: hidden !important;
  }
}

/* The WhatsApp mark's handset is visually high/left inside its own speech bubble. */
html body a#whatsapp-btn#whatsapp-btn svg,
html body a#tfs-whatsapp-btn#tfs-whatsapp-btn svg,
html body a.tfs-whatsapp-floating.tfs-whatsapp-floating svg,
#whatsapp-btn svg,
#tfs-whatsapp-btn svg,
.tfs-whatsapp-floating svg {
  transform: none !important;
}

html body a#whatsapp-btn#whatsapp-btn svg path:first-child,
html body a#tfs-whatsapp-btn#tfs-whatsapp-btn svg path:first-child,
html body a.tfs-whatsapp-floating.tfs-whatsapp-floating svg path:first-child,
#whatsapp-btn svg path:first-child,
#tfs-whatsapp-btn svg path:first-child,
.tfs-whatsapp-floating svg path:first-child {
  transform: translate(0.9px, 0.8px) !important;
  transform-origin: center center !important;
}

@media (max-width: 768px) {
  .top-urgency-inner,
  .urgency-inner,
  .top .inner,
  .top-inner {
    min-height: 58px !important;
    padding-block: 8px !important;
    line-height: 1.2 !important;
  }

  #nav,
  nav#nav,
  nav.site-nav,
  .site-nav,
  header#nav,
  header.site-nav,
  .site-header,
  .main-header {
    top: 58px !important;
  }

  .discount-banner-inner {
    min-height: 116px !important;
    flex-direction: column !important;
    padding: 12px !important;
  }

  body.discount-banner-visible #whatsapp-btn,
  body.has-discount-banner #whatsapp-btn {
    bottom: calc(150px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.discount-banner-visible .vapi-float,
  body.has-discount-banner .vapi-float,
  body.discount-banner-visible #vapi-widget,
  body.has-discount-banner #vapi-widget {
    bottom: calc(150px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

@media (max-width: 560px) {
  .top-urgency-inner,
  .urgency-inner,
  .top .inner,
  .top-inner {
    min-height: 66px !important;
  }

  #nav,
  nav#nav,
  nav.site-nav,
  .site-nav,
  header#nav,
  header.site-nav,
  .site-header,
  .main-header {
    top: 66px !important;
  }

  #nav .nav-inner,
  .site-nav .nav-inner,
  .site-header .nav-inner,
  .main-header .nav-inner {
    height: 86px !important;
    padding-inline: 14px !important;
  }

  #nav .nav-logo img,
  .site-nav .nav-logo img,
  .site-header .nav-logo img,
  .main-header .nav-logo img,
  nav .logo img {
    max-width: min(250px, 62vw) !important;
    max-height: 70px !important;
  }

  .discount-banner-inner {
    min-height: 128px !important;
    gap: 6px !important;
  }

  #whatsapp-btn {
    right: 12px !important;
    bottom: calc(14px + env(safe-area-inset-bottom, 0px)) !important;
    width: 56px !important;
    min-width: 56px !important;
    max-width: 56px !important;
    height: 56px !important;
    padding: 0 !important;
  }

  #whatsapp-btn .wa-label {
    display: none !important;
  }

  .vapi-float,
  #vapi-widget {
    left: 12px !important;
    max-width: calc(100vw - 88px) !important;
  }

  body.discount-banner-visible #whatsapp-btn,
  body.has-discount-banner #whatsapp-btn,
  body.discount-banner-visible .vapi-float,
  body.has-discount-banner .vapi-float,
  body.discount-banner-visible #vapi-widget,
  body.has-discount-banner #vapi-widget {
    bottom: calc(156px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* Final scoped main-site mobile/tablet consistency guard.
   Scope remains homepage, academy, package pages, and product/system pages only. */
html,
body {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

main,
section,
header,
footer,
.wrap,
.wrap-wide,
.container,
.page,
.page-shell,
.site-shell,
.hero,
.system-hero,
.page-hero,
.academy-hero,
.package-hero,
.hero-grid,
.section,
.flagship-shell,
.package-grid,
.pricing-grid,
.products-rail,
.product-video-track,
.product-previews-track,
.testimonial-track,
.trust-track,
.trust-scroll,
.carousel,
.slider,
.marquee {
  max-width: 100% !important;
}

section,
.hero,
.system-hero,
.page-hero,
.academy-hero,
.package-hero {
  overflow-x: clip !important;
}

#nav,
#nav.scrolled,
#nav.nav-hidden,
nav#nav,
body > nav#nav,
nav.site-nav,
.site-nav,
.site-header,
.main-header,
#tfs-nav {
  background: #fffaf5 !important;
  background-color: #fffaf5 !important;
  opacity: 1 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  z-index: 9990 !important;
}

.mobile-sticky-cta,
.tfs-mobile-sticky-cta,
.sticky-demo-bar,
.bottom-cta-bar,
.fixed-demo-bar,
.tfs-bottom-cta,
.mobile-bottom-cta,
.package-bottom-offer,
.package-sticky-offer,
.starter-bottom-offer,
.growth-bottom-offer,
.premium-bottom-offer,
.system-bottom-offer,
.sticky-package-offer,
.fixed-bottom-cta,
.bottom-demo-cta,
.mobile-demo-cta {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.package-demo::after,
.package-demo:after,
.demo-link::after,
.demo-link:after,
a[data-en="Prefer to see a demo first?"]::after,
a[data-en="Prefer to see a demo first?"]:after,
a[data-es*="demo primero"]::after,
a[data-es*="demo primero"]:after {
  content: none !important;
  display: none !important;
}

.top,
.urgency-bar,
.top-urgency-bar,
.tfs-urgency-bar,
.funnel-urgency-bar,
.announcement-bar {
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-align: center !important;
}

.urgency-inner,
.top-urgency-inner,
.tfs-urgency-inner,
.funnel-urgency-inner,
.top-inner,
.top .inner {
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: auto !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  flex-wrap: wrap !important;
  gap: 8px 12px !important;
}

.discount-banner {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  z-index: 9900 !important;
}

.discount-banner-inner {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  flex-wrap: wrap !important;
  gap: 8px 12px !important;
}

#whatsapp-btn,
#tfs-whatsapp-btn,
.tfs-whatsapp-floating {
  position: fixed !important;
  right: max(16px, env(safe-area-inset-right)) !important;
  bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  z-index: 10020 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  max-width: calc(100vw - 32px) !important;
  overflow: hidden !important;
}

#whatsapp-btn svg,
#whatsapp-btn img,
#tfs-whatsapp-btn svg,
#tfs-whatsapp-btn img,
.tfs-whatsapp-floating svg,
.tfs-whatsapp-floating img {
  flex: 0 0 auto !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
}

#vapi-widget,
.vapi-float,
.float-ai,
.ai-assistant-floating {
  position: fixed !important;
  left: max(16px, env(safe-area-inset-left)) !important;
  bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  z-index: 10010 !important;
  max-width: min(190px, calc(100vw - 112px)) !important;
}

body.discount-banner-visible #whatsapp-btn,
body.discount-banner-visible #tfs-whatsapp-btn,
body.discount-banner-visible .tfs-whatsapp-floating,
body.discount-banner-visible #vapi-widget,
body.discount-banner-visible .vapi-float,
body.discount-banner-visible .float-ai,
body.discount-banner-visible .ai-assistant-floating,
body.has-discount-banner #whatsapp-btn,
body.has-discount-banner #tfs-whatsapp-btn,
body.has-discount-banner .tfs-whatsapp-floating,
body.has-discount-banner #vapi-widget,
body.has-discount-banner .vapi-float,
body.has-discount-banner .float-ai,
body.has-discount-banner .ai-assistant-floating {
  bottom: calc(148px + env(safe-area-inset-bottom, 0px)) !important;
}

@media (max-width: 1100px) {
  #nav,
  #nav.scrolled,
  #nav.nav-hidden,
  nav#nav,
  body > nav#nav,
  nav.site-nav,
  .site-nav,
  .site-header,
  .main-header,
  #tfs-nav {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    background: #fffaf5 !important;
    background-color: #fffaf5 !important;
    border-bottom: 1px solid rgba(5, 5, 5, 0.18) !important;
  }

  #nav .nav-inner,
  body > nav#nav .nav-inner,
  .site-nav .nav-inner,
  .site-header .nav-inner,
  .main-header .nav-inner,
  #tfs-nav .tfs-nav-inner,
  .site-nav-inner {
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) 44px !important;
    align-items: center !important;
    justify-items: center !important;
    gap: 0 !important;
    padding-inline: 14px !important;
  }

  #nav .nav-inner::before,
  body > nav#nav .nav-inner::before,
  .site-nav .nav-inner::before,
  .site-header .nav-inner::before,
  .main-header .nav-inner::before,
  #tfs-nav .tfs-nav-inner::before,
  .site-nav-inner::before {
    content: "" !important;
    grid-column: 1 !important;
    width: 44px !important;
    height: 44px !important;
    display: block !important;
  }

  #nav .nav-logo,
  body > nav#nav .nav-logo,
  .site-nav .nav-logo,
  .site-header .nav-logo,
  .main-header .nav-logo,
  #tfs-nav .tfs-nav-logo,
  .site-nav-logo,
  nav .logo {
    position: static !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    grid-column: 2 !important;
    justify-self: center !important;
    align-self: center !important;
    width: auto !important;
    max-width: min(260px, 58vw) !important;
    margin: 0 auto !important;
    text-align: center !important;
  }

  #nav .nav-logo img,
  body > nav#nav .nav-logo img,
  .site-nav .nav-logo img,
  .site-header .nav-logo img,
  .main-header .nav-logo img,
  #tfs-nav .tfs-nav-logo img,
  .site-nav-logo img,
  nav .logo img {
    display: block !important;
    height: auto !important;
    width: auto !important;
    max-width: min(260px, 58vw) !important;
    max-height: 76px !important;
    margin: 0 auto !important;
    object-fit: contain !important;
  }

  #nav .nav-hamburger,
  body > nav#nav .nav-hamburger,
  .site-nav .nav-hamburger,
  .site-header .nav-hamburger,
  .main-header .nav-hamburger,
  #tfs-nav .tfs-nav-hamburger,
  .site-nav-hamburger,
  .nav-hamburger,
  .hamburger,
  .menu-toggle,
  .nav-toggle {
    display: flex !important;
    position: static !important;
    grid-column: 3 !important;
    justify-self: end !important;
    align-self: center !important;
    transform: none !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
  }
}

@media (max-width: 768px) {
  .urgency-inner,
  .top-urgency-inner,
  .tfs-urgency-inner,
  .funnel-urgency-inner,
  .top-inner,
  .top .inner {
    min-height: 58px !important;
    padding: 8px 12px !important;
    line-height: 1.2 !important;
  }

  #nav,
  #nav.scrolled,
  #nav.nav-hidden,
  nav#nav,
  body > nav#nav,
  nav.site-nav,
  .site-nav,
  .site-header,
  .main-header,
  #tfs-nav {
    top: 58px !important;
  }

  .discount-banner-inner {
    min-height: 126px !important;
    padding: 12px !important;
    flex-direction: column !important;
  }
}

@media (max-width: 560px) {
  .urgency-inner,
  .top-urgency-inner,
  .tfs-urgency-inner,
  .funnel-urgency-inner,
  .top-inner,
  .top .inner {
    min-height: 66px !important;
  }

  #nav,
  #nav.scrolled,
  #nav.nav-hidden,
  nav#nav,
  body > nav#nav,
  nav.site-nav,
  .site-nav,
  .site-header,
  .main-header,
  #tfs-nav {
    top: 66px !important;
  }

  #nav .nav-inner,
  body > nav#nav .nav-inner,
  .site-nav .nav-inner,
  .site-header .nav-inner,
  .main-header .nav-inner,
  #tfs-nav .tfs-nav-inner,
  .site-nav-inner {
    min-height: 86px !important;
  }

  #whatsapp-btn,
  #tfs-whatsapp-btn,
  .tfs-whatsapp-floating {
    right: max(12px, env(safe-area-inset-right)) !important;
    width: 56px !important;
    min-width: 56px !important;
    height: 56px !important;
    padding: 0 !important;
    gap: 0 !important;
  }

  #whatsapp-btn .wa-label,
  #tfs-whatsapp-btn .tfs-wa-label,
  .tfs-whatsapp-floating span {
    display: none !important;
  }

  #vapi-widget,
  .vapi-float,
  .float-ai,
  .ai-assistant-floating {
    left: max(12px, env(safe-area-inset-left)) !important;
    max-width: calc(100vw - 92px) !important;
  }

  body.discount-banner-visible #whatsapp-btn,
  body.discount-banner-visible #tfs-whatsapp-btn,
  body.discount-banner-visible .tfs-whatsapp-floating,
  body.discount-banner-visible #vapi-widget,
  body.discount-banner-visible .vapi-float,
  body.discount-banner-visible .float-ai,
  body.discount-banner-visible .ai-assistant-floating,
  body.has-discount-banner #whatsapp-btn,
  body.has-discount-banner #tfs-whatsapp-btn,
  body.has-discount-banner .tfs-whatsapp-floating,
  body.has-discount-banner #vapi-widget,
  body.has-discount-banner .vapi-float,
  body.has-discount-banner .float-ai,
  body.has-discount-banner .ai-assistant-floating {
    bottom: calc(156px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* Final Vercel-scope guard: homepage mobile header is the source of truth. */
#nav,
#nav.scrolled,
#nav.nav-hidden,
nav#nav,
body > nav#nav,
body #nav,
body #nav.scrolled,
body #nav.nav-hidden,
body nav#nav,
body > nav#nav,
nav.site-nav,
.site-nav,
.site-header,
.main-header,
#tfs-nav,
body nav.site-nav,
body .site-nav,
body .site-header,
body .main-header,
body #tfs-nav,
#nav .nav-mobile,
.site-nav .nav-mobile,
.site-header .nav-mobile,
.main-header .nav-mobile,
body #nav .nav-mobile,
body .site-nav .nav-mobile,
body .site-header .nav-mobile,
body .main-header .nav-mobile {
  background: #fff !important;
  background-color: #fff !important;
  opacity: 1 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.btn[data-missing-stripe="true"] {
  cursor: not-allowed !important;
  background: #f4f4f4 !important;
  border-color: #cfcfcf !important;
  color: #555 !important;
  box-shadow: none !important;
  pointer-events: auto !important;
}

.btn[data-missing-stripe="true"]:hover {
  transform: none !important;
}

@media (max-width: 768px) {
  .final,
  section.final,
  footer {
    padding-bottom: calc(104px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .final .actions a[href*="calendly.com"],
  section.final .actions a[href*="calendly.com"],
  .final .actions a[href*="wa.me"],
  section.final .actions a[href*="wa.me"] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* Focused mobile/tablet fit pass for the main site and product pages. */
html,
body {
  max-width: 100% !important;
  overflow-x: hidden !important;
}

body {
  position: relative !important;
}

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

.marquee,
.t-grid,
.walk-card,
.hero,
.section,
.pricing,
.testimonials,
.tools-band,
.academy-detail,
.final,
footer {
  max-width: 100% !important;
  overflow-x: clip !important;
}

@supports not (overflow: clip) {
  .marquee,
  .t-grid,
  .walk-card,
  .hero,
  .section,
  .pricing,
  .testimonials,
  .tools-band,
  .academy-detail,
  .final,
  footer {
    overflow-x: hidden !important;
  }
}

.price-card .btn,
.custom-tier-actions .btn,
.hero .actions .btn,
.bonus .actions .btn,
.final .actions .btn {
  min-height: 48px !important;
  text-align: center !important;
  line-height: 1.05 !important;
}

.custom-tier-actions {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  margin-top: auto !important;
}

.hero h1,
#hero h1,
.hero .hxl,
.hero .hl,
.hero .hm,
.hero .headline-xl,
.hero .headline-lg,
.hero .hero-title,
.hero .hero-h1,
#hero .hxl,
#hero .hl,
#hero .hm,
#hero .headline-xl,
#hero .headline-lg,
#hero .hero-title,
#hero .hero-h1 {
  max-width: 100% !important;
  overflow: visible !important;
  text-wrap: balance !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.hero h1 .line,
#hero h1 .line,
.hero .hero-h1 .line,
#hero .hero-h1 .line {
  overflow: visible !important;
  max-width: 100% !important;
  padding-right: 0.08em !important;
}

.hero h1 span,
#hero h1 span,
.hero .hxl span,
.hero .hl span,
.hero .hm span,
.hero .headline-xl span,
.hero .headline-lg span,
.hero .hero-title span,
.hero .hero-h1 span,
#hero .hxl span,
#hero .hl span,
#hero .hm span,
#hero .headline-xl span,
#hero .headline-lg span,
#hero .hero-title span,
#hero .hero-h1 span {
  max-width: 100% !important;
  overflow: visible !important;
}

@media (min-width: 681px) and (max-width: 1050px) {
  .wrap {
    width: min(100% - 48px, 920px) !important;
  }

  .hero h1,
  #hero h1,
  .hero .hxl,
  .hero .headline-xl,
  .hero .hero-title,
  .hero .hero-h1,
  #hero .hxl,
  #hero .headline-xl,
  #hero .hero-title,
  #hero .hero-h1 {
    font-size: clamp(48px, 9vw, 82px) !important;
    line-height: 0.9 !important;
    letter-spacing: 0 !important;
    width: min(100%, 11ch) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .hero-grid,
  .head,
  .trust,
  .t-head,
  .bonus {
    gap: 34px !important;
  }

  .features,
  .price-grid,
  .academy-grid,
  .tools-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .price-grid:has(.price-card:nth-child(3)) {
    grid-template-columns: 1fr !important;
  }

  .price-card,
  .feature-card,
  .academy-course,
  .tool-cell,
  .blackbox {
    min-width: 0 !important;
  }

  .process-row {
    grid-template-columns: 78px minmax(0, 0.78fr) minmax(0, 1fr) !important;
    gap: 22px !important;
  }

  .process-row > div:last-child {
    display: none !important;
  }

  .process-row p {
    grid-column: auto !important;
    margin: 0 !important;
  }

  [class*="orb"],
  [class*="energy-orb"],
  .tfs-energy-orb,
  .hero-orb {
    display: none !important;
  }
}

/* Final floating-button alignment guard.
   Keeps WhatsApp and the AI assistant on the same baseline when the discount banner is visible. */
:root {
  --tfs-float-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  --tfs-float-bottom-with-banner: calc(148px + env(safe-area-inset-bottom, 0px));
}

#whatsapp-btn,
#tfs-whatsapp-btn,
.tfs-whatsapp-floating,
.vapi-float,
.float-ai,
.ai-assistant-floating {
  bottom: var(--tfs-float-bottom) !important;
}

.vapi-float vapi-widget {
  bottom: auto !important;
}

body.discount-banner-visible #whatsapp-btn,
body.discount-banner-visible #tfs-whatsapp-btn,
body.discount-banner-visible .tfs-whatsapp-floating,
body.discount-banner-visible .vapi-float,
body.discount-banner-visible .float-ai,
body.discount-banner-visible .ai-assistant-floating,
body.has-discount-banner #whatsapp-btn,
body.has-discount-banner #tfs-whatsapp-btn,
body.has-discount-banner .tfs-whatsapp-floating,
body.has-discount-banner .vapi-float,
body.has-discount-banner .float-ai,
body.has-discount-banner .ai-assistant-floating {
  bottom: var(--tfs-float-bottom-with-banner) !important;
}

body.discount-banner-visible .vapi-float vapi-widget,
body.has-discount-banner .vapi-float vapi-widget {
  bottom: auto !important;
}

@media (max-width: 768px) {
  :root {
    --tfs-float-bottom-with-banner: calc(156px + env(safe-area-inset-bottom, 0px));
  }

  #whatsapp-btn,
  #tfs-whatsapp-btn,
  .tfs-whatsapp-floating,
  .vapi-float,
  .float-ai,
  .ai-assistant-floating {
    bottom: var(--tfs-float-bottom) !important;
  }

  body.discount-banner-visible #whatsapp-btn,
  body.discount-banner-visible #tfs-whatsapp-btn,
  body.discount-banner-visible .tfs-whatsapp-floating,
  body.discount-banner-visible .vapi-float,
  body.discount-banner-visible .float-ai,
  body.discount-banner-visible .ai-assistant-floating,
  body.has-discount-banner #whatsapp-btn,
  body.has-discount-banner #tfs-whatsapp-btn,
  body.has-discount-banner .tfs-whatsapp-floating,
  body.has-discount-banner .vapi-float,
  body.has-discount-banner .float-ai,
  body.has-discount-banner .ai-assistant-floating {
    bottom: var(--tfs-float-bottom-with-banner) !important;
  }
}

@media (max-width: 560px) {
  :root {
    --tfs-float-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
    --tfs-float-bottom-with-banner: calc(166px + env(safe-area-inset-bottom, 0px));
  }
}

/* Final banner/floating layout: buttons stay aligned at the bottom, banner sits above them. */
:root {
  --tfs-floating-control-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  --tfs-discount-banner-bottom: calc(128px + env(safe-area-inset-bottom, 0px));
}

.discount-banner {
  position: fixed !important;
  bottom: var(--tfs-discount-banner-bottom) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  box-sizing: border-box !important;
  background: #f5bf22 !important;
  color: #070709 !important;
  border-top: 2px solid #070709 !important;
  border-bottom: 2px solid #070709 !important;
  box-shadow: 0 -8px 34px rgba(0, 0, 0, 0.28) !important;
  z-index: 900 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(140%) !important;
  transition: transform 0.32s ease, opacity 0.32s ease !important;
}

.discount-banner.visible,
body.discount-banner-visible .discount-banner,
body.has-discount-banner .discount-banner {
  transform: none !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.discount-banner-inner {
  width: min(100%, 1180px) !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 14px 18px !important;
  box-sizing: border-box !important;
}

.discount-kicker,
.discount-banner strong,
.discount-banner a {
  font-family: var(--font-d, "Barlow Condensed", Impact, sans-serif) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: #070709 !important;
}

.discount-kicker {
  font-size: 11px !important;
}

.discount-banner strong {
  font-size: 16px !important;
  font-style: italic !important;
}

.discount-countdown {
  font-family: var(--font-d, "Barlow Condensed", Impact, sans-serif) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  background: #070709 !important;
  color: #f5bf22 !important;
  padding: 7px 12px !important;
  line-height: 1 !important;
  min-width: 104px !important;
  text-align: center !important;
}

.discount-banner a {
  font-size: 12px !important;
  text-decoration: underline !important;
  text-underline-offset: 5px !important;
}

#whatsapp-btn,
#tfs-whatsapp-btn,
.tfs-whatsapp-floating,
.vapi-float,
.float-ai,
.ai-assistant-floating,
body.discount-banner-visible #whatsapp-btn,
body.discount-banner-visible #tfs-whatsapp-btn,
body.discount-banner-visible .tfs-whatsapp-floating,
body.discount-banner-visible .vapi-float,
body.discount-banner-visible .float-ai,
body.discount-banner-visible .ai-assistant-floating,
body.has-discount-banner #whatsapp-btn,
body.has-discount-banner #tfs-whatsapp-btn,
body.has-discount-banner .tfs-whatsapp-floating,
body.has-discount-banner .vapi-float,
body.has-discount-banner .float-ai,
body.has-discount-banner .ai-assistant-floating {
  bottom: var(--tfs-floating-control-bottom) !important;
}

@media (max-width: 560px) {
  :root {
    --tfs-floating-control-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
    --tfs-discount-banner-bottom: calc(128px + env(safe-area-inset-bottom, 0px));
  }

  .discount-banner-inner {
    gap: 8px 12px !important;
    padding: 12px !important;
  }

  .discount-banner strong {
    font-size: 13px !important;
  }

  .discount-countdown {
    font-size: 18px !important;
    min-width: 92px !important;
  }
}

@media (max-width: 680px) {
  .wrap {
    width: min(100% - 32px, 460px) !important;
  }

  .hero h1,
  #hero h1,
  .hero .hxl,
  .hero .headline-xl,
  .hero .hero-title,
  .hero .hero-h1,
  #hero .hxl,
  #hero .headline-xl,
  #hero .hero-title,
  #hero .hero-h1 {
    font-size: clamp(46px, 17vw, 70px) !important;
    line-height: 0.92 !important;
    letter-spacing: 0 !important;
    width: min(100%, 5.45em) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .hero h1 .line,
  #hero h1 .line,
  .hero .hero-h1 .line,
  #hero .hero-h1 .line {
    padding-right: 0.12em !important;
    margin-right: -0.04em !important;
  }

  .hero,
  .section {
    text-align: center !important;
  }

  .hero-grid,
  .head,
  .trust,
  .t-head,
  .bonus,
  .features,
  .price-grid,
  .academy-grid,
  .tools-grid,
  .stats,
  .proof {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .head,
  .t-head {
    align-items: center !important;
    gap: 22px !important;
    margin-bottom: 34px !important;
  }

  .feature-card,
  .price-card,
  .academy-course,
  .tool-cell,
  .blackbox,
  .bonus {
    min-width: 0 !important;
    padding-inline: 22px !important;
  }

  .price-card .btn,
  .custom-tier-actions .btn,
  .hero .actions .btn,
  .bonus .actions .btn,
  .final .actions .btn {
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  .process-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    justify-items: center !important;
    text-align: center !important;
    padding: 26px 0 !important;
  }

  .process-num {
    width: 58px !important;
    min-height: 46px !important;
    display: inline-grid !important;
    place-items: center !important;
    font-size: 38px !important;
  }

  .process-row h3 {
    margin: 0 0 6px !important;
    overflow-wrap: anywhere !important;
  }

  .process-row b {
    display: block !important;
    margin-bottom: 4px !important;
  }

  .process-row p {
    grid-column: auto !important;
    width: min(100%, 36rem) !important;
    margin: 0 auto !important;
  }

  .process-row > div:last-child {
    display: none !important;
  }

  .t-grid {
    margin-inline: 0 !important;
  }

  .t-track {
    max-width: 100% !important;
  }

  .t-card {
    width: min(300px, calc(100vw - 48px)) !important;
    flex-basis: min(300px, calc(100vw - 48px)) !important;
  }

  [class*="orb"],
  [class*="energy-orb"],
  .tfs-energy-orb,
  .hero-orb {
    max-width: 44vw !important;
    opacity: 0.55 !important;
  }
}

html body #discount-banner.discount-banner,
html body .discount-banner {
  bottom: calc(104px + env(safe-area-inset-bottom, 0px)) !important;
}

html body a#whatsapp-btn#whatsapp-btn,
html body a#tfs-whatsapp-btn#tfs-whatsapp-btn,
html body a.tfs-whatsapp-floating.tfs-whatsapp-floating {
  width: 66px !important;
  min-width: 66px !important;
  max-width: 66px !important;
  height: 66px !important;
  min-height: 66px !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
}

html body a#whatsapp-btn#whatsapp-btn svg,
html body a#whatsapp-btn#whatsapp-btn img,
html body a#tfs-whatsapp-btn#tfs-whatsapp-btn svg,
html body a#tfs-whatsapp-btn#tfs-whatsapp-btn img,
html body a.tfs-whatsapp-floating.tfs-whatsapp-floating svg,
html body a.tfs-whatsapp-floating.tfs-whatsapp-floating img {
  width: 31px !important;
  height: 31px !important;
}

@media (max-width: 680px) {
  html body a#whatsapp-btn#whatsapp-btn,
  html body a#tfs-whatsapp-btn#tfs-whatsapp-btn,
  html body a.tfs-whatsapp-floating.tfs-whatsapp-floating {
    width: 62px !important;
    min-width: 62px !important;
    max-width: 62px !important;
    height: 62px !important;
    min-height: 62px !important;
  }

  html body a#whatsapp-btn#whatsapp-btn svg,
  html body a#whatsapp-btn#whatsapp-btn img,
  html body a#tfs-whatsapp-btn#tfs-whatsapp-btn svg,
  html body a#tfs-whatsapp-btn#tfs-whatsapp-btn img,
  html body a.tfs-whatsapp-floating.tfs-whatsapp-floating svg,
  html body a.tfs-whatsapp-floating.tfs-whatsapp-floating img {
    width: 30px !important;
    height: 30px !important;
  }
}

@media (max-width: 430px) {
  .wrap {
    width: min(100% - 28px, 402px) !important;
  }

  .hero h1,
  #hero h1,
  .hero .hxl,
  .hero .headline-xl,
  .hero .hero-title,
  .hero .hero-h1,
  #hero .hxl,
  #hero .headline-xl,
  #hero .hero-title,
  #hero .hero-h1 {
    font-size: clamp(43px, 16.4vw, 62px) !important;
    width: min(100%, 5.25em) !important;
  }

  .hero,
  .section {
    padding-inline: 0 !important;
  }

  .hxl,
  .hl,
  .hm {
    overflow-wrap: anywhere !important;
  }

  .marquee div {
    gap: 24px !important;
  }

  .marquee span {
    font-size: 22px !important;
  }

  .feature-card,
  .price-card,
  .academy-course,
  .tool-cell,
  .blackbox,
  .bonus {
    padding-inline: 18px !important;
  }

  [class*="orb"],
  [class*="energy-orb"],
  .tfs-energy-orb,
  .hero-orb {
    display: none !important;
  }
}

@media (max-width: 1700px) {
  #nav {
    background: #fff !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
  }

  #nav .nav-inner,
  #nav.site-nav .nav-inner,
  #nav .site-nav-inner,
  body > nav#nav .nav-inner {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) 44px !important;
    align-items: center !important;
    gap: 0 !important;
    width: 100% !important;
  }

  #nav .nav-inner::before,
  #nav.site-nav .nav-inner::before,
  #nav .site-nav-inner::before,
  body > nav#nav .nav-inner::before {
    content: "" !important;
    display: block !important;
    width: 44px !important;
    height: 44px !important;
    grid-column: 1 !important;
  }

  #nav .nav-logo,
  #nav.site-nav .nav-logo,
  #nav .logo,
  body > nav#nav .logo {
    grid-column: 2 !important;
    justify-self: center !important;
    align-self: center !important;
    position: static !important;
    transform: none !important;
    margin: 0 auto !important;
    max-width: min(280px, 58vw) !important;
    min-width: 0 !important;
    z-index: 2 !important;
  }

  #nav .nav-logo img,
  #nav.site-nav .nav-logo img,
  #nav .logo img,
  body > nav#nav .logo img {
    display: block !important;
    width: min(280px, 58vw) !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }

  #nav .nav-links,
  #nav.site-nav .nav-links,
  #nav .links,
  body > nav#nav .links,
  #nav .nav-actions,
  #nav.site-nav .nav-actions,
  #nav .actions,
  body > nav#nav .actions {
    display: none !important;
  }

  #nav .nav-hamburger,
  #nav.site-nav .nav-hamburger,
  #nav .hamburger,
  body > nav#nav .hamburger {
    display: inline-flex !important;
    grid-column: 3 !important;
    justify-self: end !important;
    align-self: center !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 3 !important;
  }

  #nav .nav-mobile,
  #nav.site-nav .nav-mobile,
  body > nav#nav .nav-mobile {
    background: #fff !important;
    max-height: calc(100vh - var(--tfs-nav-total-offset, 104px)) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
  }
}

@media (max-width: 820px) {
  footer a {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 44px !important;
  }
}

/* Final WhatsApp floating button treatment: larger icon-only circle with optical icon centering. */
#whatsapp-btn,
#tfs-whatsapp-btn,
.tfs-whatsapp-floating {
  width: 66px !important;
  min-width: 66px !important;
  max-width: 66px !important;
  height: 66px !important;
  min-height: 66px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  display: inline-grid !important;
  place-items: center !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  background: #25d366 !important;
  color: #fff !important;
  border: 2px solid rgba(255, 255, 255, 0.78) !important;
  box-shadow: 0 16px 40px rgba(37, 211, 102, 0.34) !important;
  overflow: visible !important;
  line-height: 0 !important;
}

#whatsapp-btn::after,
#tfs-whatsapp-btn::after,
.tfs-whatsapp-floating::after {
  display: none !important;
  content: none !important;
}

#whatsapp-btn .wa-label,
#tfs-whatsapp-btn .tfs-wa-label,
.tfs-whatsapp-floating .wa-label,
.tfs-whatsapp-floating span {
  display: none !important;
}

#whatsapp-btn svg,
#whatsapp-btn img,
#tfs-whatsapp-btn svg,
#tfs-whatsapp-btn img,
.tfs-whatsapp-floating svg,
.tfs-whatsapp-floating img {
  display: block !important;
  width: 31px !important;
  height: 31px !important;
  min-width: 31px !important;
  min-height: 31px !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
  color: #fff !important;
  fill: currentColor !important;
  transform: translate(0.5px, -0.5px) !important;
  transform-origin: center center !important;
}

#whatsapp-btn:hover,
#tfs-whatsapp-btn:hover,
.tfs-whatsapp-floating:hover {
  background: #1ebe5d !important;
  border-color: #fff !important;
  box-shadow: 0 20px 52px rgba(37, 211, 102, 0.46) !important;
  transform: translateY(-2px) !important;
}

@media (max-width: 680px) {
  #whatsapp-btn,
  #tfs-whatsapp-btn,
  .tfs-whatsapp-floating {
    width: 62px !important;
    min-width: 62px !important;
    max-width: 62px !important;
    height: 62px !important;
    min-height: 62px !important;
  }

  #whatsapp-btn svg,
  #whatsapp-btn img,
  #tfs-whatsapp-btn svg,
  #tfs-whatsapp-btn img,
  .tfs-whatsapp-floating svg,
  .tfs-whatsapp-floating img {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
  }
}