@media (min-width: 575px) {
    :root {
      --fontsize-1: 4rem;
      --fontsize-2: 3.4rem;
      --fontsize-5: 2rem;
    }
  
    /* Banner */
  
    .container {
      max-width: 540px;
      width: 100%;
      margin-inline: auto;
    }

    /* Banner-hero */
  
    .hero-text { --fontsize-5: 2rem; }
  
}
  

@media (min-width: 768px) {
    :root {
      --fontsize-1: 5rem;
      --fontsize-2: 4rem;
    }
  
  
    /* Banner */
  
    .container { max-width: 750px; }

    /* Banner-hero */
  
    .hero-banner {
      max-width: max-content;
      margin-inline: auto;
    }

    /* Altera */
  
    .altera-tab .tab-content { grid-template-columns: 1fr 1fr; }

    /* Introdução */
  
    .instruction { overflow: hidden; }
  
    .instruction .section-text {
      max-width: 40ch;
      margin-inline: auto;
    }
  
    .instruction-list { grid-template-columns: 1fr 1fr; }
  
    .instruction-card { position: relative; }
  
    .instruction-card::after {
      content: "";
      width: 160px;
      height: 12px;
      background-image: url('../img/connect-line.png');
      background-repeat: no-repeat;
      background-size: contain;
      background-position: center;
      position: absolute;
      top: 50px;
      right: -95px;
    }
  
    .instruction-list > li:nth-child(even) .instruction-card::after {
      display: none;
    }
  
    /* Aplicativo */
  
    .app-banner { max-width: max-content; }

    /* Rodapé */
  
    .footer-top .container { grid-template-columns: repeat(3, 1fr); }
  
    .footer-brand { grid-column: 1 / 3; }
  
    .footer-bottom .container {
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
  
    .copyright { margin-block-end: 0; }
}
  
  
@media (min-width: 992px) {
  
    /* Banner */
  
    .container { max-width: 960px; }
  
    /* Cabeçalho */
  
    .header { padding-block: 5px; }
  
    .header.active { top: -60px; }
  
    .header > .container { gap: 50px; }
  
    .nav-altera-btn { display: none; }
  
    .navbar,
    .navbar.active {
      all: unset;
      margin-inline-end: auto;
    }
  
    .navbar-list {
      display: flex;
      align-items: center;
    }
  
    .navbar-item:not(:last-child) { border-block-end: none; }
  
    .navbar-link {
      font-size: var(--fs-7);
      padding: 15px 12px;
    }
  
    .navbar-link:is(:hover, :focus, .active) {
      background-color: var(--azul);
      color: var(--branco);
    }
  
    /* Banner-hero */
  
    .hero .container {
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: center;
      gap: 30px;
    }
  
    .hero-content { margin-block-end: 0; }

    /* Mercado preços */
  
    .market-tab { padding-block-end: 0; }
  
    /* Aplicativo */
  
    .app { padding-block: 0; }
  
    .app .container {
      display: grid;
      grid-template-columns: 0.8fr 1fr;
      align-items: flex-end;
      gap: 30px;
    }
  
    .app-banner { margin-block-start: 0; }
  
    .app-content { margin-block: 50px; }
  
}
  
  
@media (min-width: 1200px) {
    :root {
      --fontsize-1: 6.4rem;
      --fontsize-2: 4.8rem;
  
    }

    /* Banner */
                    
    .container { max-width: 1280px; }

    /* Cabeçalho */
  
    .header.active { top: -64px; }
  
    .navbar-link { font-size: unset; }
  
    /* Banner-hero */
  
    .hero .container { gap: 100px; }

    /* Altera */
  
    .trend-tab .tab-content { grid-template-columns: repeat(4, 1fr); }
  
    /* Introdução */
  
    .instruction-list { grid-template-columns: repeat(4, 1fr); }
  
    .instruction-list > li:nth-child(even) .instruction-card::after {
      display: block;
    }
  
    .instruction-list > li:last-child .instruction-card::after {
      display: none;
    }

    /* Aplicativo */
  
    :is(.app) .container { gap: 60px; }

    .app-content { margin-block: 100px; }
  
  
  
    /* Rodapé */
  
    .footer-top { padding-block: 100px 90px; }
  
    .footer-top .container { grid-template-columns: 1fr 0.5fr 0.5fr 0.5fr 0.5fr; }
  
    .footer-brand { grid-column: auto; }
  
  }