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

body {
  min-width: 0;
}

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

svg {
  overflow: hidden;
}

input,
select,
textarea,
button {
  max-width: 100%;
}

#top *,
#hero *,
#card *,
section * {
  box-sizing: border-box;
}

#wrap {
  width: 100% !important;
  padding-left: clamp(14px, 4vw, 24px) !important;
  padding-right: clamp(14px, 4vw, 24px) !important;
}

#top,
section,
footer,
#card,
#hero,
#publicos,
#checkup,
#faq {
  max-width: 100%;
}

#topnav,
#heroCheckup,
#cardSlides,
#heroPhoto,
#margemGrid,
#reviewsLayout,
#cantinhoGrid {
  max-width: 100%;
}

@media (max-width: 980px) {
  #top {
    align-items: center !important;
    gap: 10px !important;
  }

  #topnav {
    order: 3 !important;
    flex: 1 0 100% !important;
    width: 100% !important;
    margin: 0 !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
  }

  #top > a[aria-label='Início'] img {
    width: clamp(132px, 38vw, 158px) !important;
  }

  #mobMenu {
    flex: none !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }

  #mobMenu > div {
    left: auto !important;
    right: 0 !important;
    min-width: min(82vw, 260px) !important;
  }

  #top > nav:last-child {
    flex: 1 1 auto !important;
    justify-content: flex-end !important;
    min-width: 0 !important;
    gap: 10px !important;
  }

  #hero {
    padding-left: clamp(20px, 5vw, 34px) !important;
    padding-right: clamp(20px, 5vw, 34px) !important;
  }

  #heroPhoto {
    opacity: 0.32 !important;
    width: 100% !important;
  }

  #heroPhoto img {
    right: 0 !important;
    max-width: none !important;
  }

  #heroCheckup {
    justify-self: center !important;
    width: 100% !important;
    max-width: 420px !important;
  }

  #heroTitle,
  #margemTitle {
    max-width: 100% !important;
    overflow-wrap: anywhere;
  }

  #heroGrid,
  #card,
  #checkupGrid,
  #verifyBox,
  #heroCheckup,
  #reviewsLayout,
  #margemGrid,
  #faqGrid,
  #cantinhoGrid,
  #banksLayout,
  #prodHero,
  #alertaGrid,
  #compareGrid {
    width: 100% !important;
  }

  #heroCard {
    width: 100% !important;
    justify-self: center !important;
  }

  #publicosGrid,
  #produtosGrid,
  #trustStripGrid,
  #porqueHomeGrid,
  #porqueGrid,
  #footerGrid,
  #bancosGrid,
  #prodGrid,
  #analisaRow,
  #cuMetrics,
  #trust,
  #banksWall,
  #canaisGrid,
  #equipeGrid,
  #comparaGrid {
    width: 100% !important;
  }

  #card input,
  #card select,
  #card button,
  #card a,
  #card [style*='min-width'],
  form input,
  form select,
  form textarea,
  form button {
    min-width: 0 !important;
  }

  #card [style*='grid-template-columns:repeat'],
  #card [style*='grid-template-columns: repeat'] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  #top {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;
  }

  #topnav {
    grid-column: 1 / -1 !important;
    display: none !important;
  }

  #top > a[aria-label='Início'] {
    min-width: 0 !important;
  }

  #top > a[aria-label='Início'] img {
    width: clamp(128px, 48vw, 150px) !important;
  }

  #mobMenu {
    grid-column: 2 !important;
    grid-row: 1 !important;
    margin: 0 !important;
  }

  #top > nav:last-child {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    justify-content: space-between !important;
  }

  #top > nav:last-child > a,
  #top > nav:last-child > div {
    min-width: 0 !important;
  }

  #top a[href^='tel:'] {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    padding: 8px 10px !important;
  }

  #top a[href^='tel:'] span[style*='font-size:17px'],
  #top a[aria-label='Falar no WhatsApp'] span[style*='font-size:17px'] {
    font-size: 14px !important;
  }

  #top a[aria-label='Falar no WhatsApp'] {
    padding: 8px 10px !important;
  }

  #top div[style*='position:absolute'][style*='width:300px'],
  #top div[style*='position: absolute'][style*='width: 300px'] {
    left: auto !important;
    right: 0 !important;
    width: min(300px, calc(100vw - 28px)) !important;
    transform: translateY(-8px) scale(0.96) !important;
  }

  #top > div[aria-hidden='true'][style*='width:440px'],
  #top > div[aria-hidden='true'][style*='width: 440px'] {
    display: none !important;
  }

  #top a[aria-label='Falar no WhatsApp'] span[style*='min-width:150px'] {
    min-width: 0 !important;
  }

  #hero {
    border-radius: 20px !important;
  }

  #heroPhoto {
    display: none !important;
  }

  #heroCheckup {
    margin: 4px auto 0 !important;
    padding: 18px 16px !important;
  }

  #cardSlides {
    overflow: hidden !important;
  }

  #heroTitle,
  #margemTitle {
    font-size: clamp(25px, 8vw, 34px) !important;
    line-height: 1.08 !important;
  }

  #hero p,
  section p {
    overflow-wrap: anywhere;
  }

  #publicosGrid,
  #produtosGrid,
  #trustStripGrid,
  #porqueHomeGrid,
  #porqueGrid,
  #footerGrid,
  #bancosGrid,
  #prodGrid,
  #analisaRow,
  #cuMetrics,
  #trust,
  #banksWall,
  #canaisGrid,
  #equipeGrid,
  #comparaGrid {
    grid-template-columns: 1fr !important;
  }

  #heroGrid,
  #margemGrid,
  #reviewsLayout,
  #cantinhoGrid,
  #card {
    grid-template-columns: 1fr !important;
  }

  #bancosGrid,
  #banksWall {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #card {
    border-radius: 18px !important;
  }

  #card [style*='grid-template-columns'],
  form [style*='grid-template-columns'] {
    grid-template-columns: 1fr !important;
  }

  #card [style*='display:flex'],
  form [style*='display:flex'],
  #card [style*='display: flex'],
  form [style*='display: flex'] {
    flex-wrap: wrap !important;
  }

  #card a,
  #card button,
  form button,
  form a {
    width: 100%;
    justify-content: center !important;
  }

  #card button[data-kind],
  #card button[data-val],
  #card button[data-gloss] {
    flex: 1 1 120px !important;
    width: auto !important;
    min-width: 0 !important;
    white-space: normal !important;
  }

  #footerGrid > div {
    border-left: 0 !important;
    padding-left: 0 !important;
  }

  #adcCookieBar {
    padding: 14px !important;
  }

  #adcCookieBar > div,
  #cookieBar > div {
    align-items: stretch !important;
  }

  #adcCookieBar button,
  #cookieBar button {
    flex: 1 1 140px !important;
  }
}

@media (max-width: 520px) {
  #wrap {
    padding: 10px 12px 14px !important;
  }

  #top {
    margin-bottom: 12px !important;
  }

  #top > nav:last-child {
    gap: 8px !important;
  }

  #top a[href^='tel:'] span[style*='line-height'],
  #top a[aria-label='Falar no WhatsApp'] span[style*='line-height'] {
    display: none !important;
  }

  #top a[href^='tel:'],
  #top a[aria-label='Falar no WhatsApp'] {
    flex: 1 1 0 !important;
    justify-content: center !important;
  }

  #hero {
    padding: 22px 16px !important;
  }

  #heroCheckup {
    max-width: 100% !important;
  }

  #heroCheckup [style*='font-size:22px'],
  #heroCheckup [style*='font-size:24px'],
  #heroCheckup [style*='font-size:26px'] {
    font-size: clamp(18px, 6vw, 22px) !important;
  }

  #heroCard {
    padding: 18px 16px !important;
    max-width: 100% !important;
  }

  #card {
    padding: 14px !important;
  }

  #card input[type='range'] {
    width: 100% !important;
  }

  #card [style*='grid-template-columns:repeat'],
  #card [style*='grid-template-columns: repeat'] {
    grid-template-columns: 1fr !important;
  }

  #fabLabel {
    display: none !important;
  }

  #heroMarquee,
  #heroSlide {
    max-width: 100% !important;
    overflow: hidden !important;
  }

  #hero div[style*='top:-140px'][style*='right:-80px'],
  #hero div[style*='top: -140px'][style*='right: -80px'],
  section div[style*='top:-80px'][style*='right:-80px'],
  section div[style*='top: -80px'][style*='right: -80px'],
  div[style*='right:-80px'],
  div[style*='right: -80px'] {
    display: none !important;
  }

  #hero svg[viewBox='0 0 400 300'],
  section svg[viewBox='0 0 400 300'] {
    display: none !important;
  }

  #heroMarquee .hm-track {
    animation: none !important;
    display: grid !important;
    gap: 8px !important;
    grid-template-columns: 1fr 1fr !important;
    max-width: 100% !important;
    transform: none !important;
    width: 100% !important;
  }

  #heroMarquee .hm-track > span {
    justify-content: center !important;
    white-space: normal !important;
  }

  #heroMarquee .hm-track > span:nth-child(n + 7) {
    display: none !important;
  }

  #solGrid {
    grid-template-columns: 1fr !important;
  }

  #docsGrid,
  #passosGrid {
    grid-template-columns: 1fr !important;
  }

  div[style*='right:-60px'],
  div[style*='right: -60px'],
  div[style*='right:-90px'],
  div[style*='right: -90px'],
  div[style*='inset:12px -10px -10px 16px'],
  div[style*='inset: 12px -10px -10px 16px'] {
    display: none !important;
  }

  #reviewsLayout {
    overflow: hidden !important;
  }

  #reviewsLayout > div:last-child {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  #reviewsLayout > div:last-child > div:last-child {
    contain: layout paint !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    overflow: hidden !important;
  }

  #reviewsLayout div[style*='scroll-snap-align'],
  #reviewsLayout div[style*='scroll-snap-align: start'] {
    width: 100% !important;
  }

  #reviewsLayout div[style*='scroll-snap-align']:nth-child(n + 4),
  #reviewsLayout div[style*='scroll-snap-align: start']:nth-child(n + 4) {
    display: none !important;
  }

  #cantinhoGrid,
  #cantinhoGrid > * {
    min-width: 0 !important;
    width: 100% !important;
  }

  #cantinhoGrid [data-guide],
  #cantinhoGrid [data-gstage],
  #cantinhoGrid [data-gframe] {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  #cantinhoGrid [data-gtabs] {
    flex-wrap: nowrap !important;
    max-width: 100% !important;
    overflow-x: auto !important;
  }

  #cantinhoGrid [data-gcap] {
    white-space: nowrap !important;
  }

  [style*='width:380px'],
  [style*='width: 380px'],
  [style*='width:420px'],
  [style*='width: 420px'],
  [style*='width:330px'],
  [style*='width: 330px'] {
    width: 100% !important;
    max-width: 100% !important;
  }

  [style*='min-width:260px'],
  [style*='min-width:280px'],
  [style*='min-width:300px'] {
    min-width: 0 !important;
  }

  [style*='font-size:30px'],
  [style*='font-size:32px'],
  [style*='font-size:34px'] {
    font-size: clamp(23px, 7vw, 30px) !important;
  }
}
