@media (max-width: 1200px) {
  .container,
  .site-header__inner {
    padding-inline: var(--page-padding-tablet);
  }

  .logo-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .project__content,
  .section-heading,
  .text-block {
    grid-column: 1 / span 5;
  }

  .project__media,
  .image-stack {
    grid-column: 7 / -1;
  }
}

@media (max-width: 992px) {
  :root {
    --header-height: 76px;
    --space-xl: 92px;
    --space-2xl: 120px;
  }

  .hero {
    min-height: auto;
  }

  .video-section {
    min-height: auto;
    padding-block: 72px;
  }

  .video-section__frame {
    width: 100%;
    max-height: none;
  }

  .video-section__inner {
    padding-inline: var(--page-padding-tablet);
  }

  .hero__content,
  .hero__media,
  .about-copy,
  .section-heading,
  .text-block,
  .image-stack,
  .project__content,
  .project__media,
  .project[data-layout="text-right"] .project__content,
  .project[data-layout="text-right"] .project__media,
  .contact__headline,
  .contact__links {
    grid-column: 1 / -1;
    grid-row: auto;
  }

  h1 {
    max-width: 11ch;
    font-size: clamp(3.5rem, 11vw, 5.8rem);
  }

  .hero__media,
  .image-stack,
  .project__media {
    margin-top: var(--space-md);
  }

  .section--about .editorial-grid {
    min-height: auto;
  }

  .about-copy {
    gap: 40px;
  }

  .testimonial-grid {
    grid-template-columns: 1fr;
  }

  .testimonial-grid blockquote {
    min-height: 118px;
  }
}

@media (max-width: 768px) {
  .container,
  .site-header__inner {
    padding-inline: var(--page-padding-mobile);
  }

  .video-section__inner {
    padding-inline: var(--page-padding-mobile);
  }

  .site-header__inner {
    min-height: var(--header-height);
  }

  .brand img {
    width: 104px;
  }

  .menu-toggle {
    display: grid;
  }

  .site-nav {
    position: absolute;
    top: calc(100% + 1px);
    left: var(--page-padding-mobile);
    right: var(--page-padding-mobile);
    display: none;
    padding: var(--space-sm);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-medium);
    background: rgba(0, 0, 0, 0.94);
  }

  .site-nav.is-open {
    display: grid;
  }

  .site-nav a {
    padding: 12px;
  }

  .section {
    padding-block: 78px;
  }

  h1 {
    font-size: clamp(3rem, 15vw, 5.2rem);
  }

  h2 {
    font-size: clamp(2.7rem, 12vw, 4.7rem);
  }

  h3 {
    font-size: clamp(2.5rem, 11vw, 4.4rem);
  }

  .hero__image,
  .hero__image--wide,
  .image-stack img {
    aspect-ratio: 16 / 9;
  }

  .logo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .logo-grid img {
    height: 124px;
    padding: 34px 24px;
  }

  .project {
    gap: var(--space-sm);
    padding-top: var(--space-md);
  }

  .project__media {
    grid-template-columns: 1fr;
  }

  .project__cover,
  .project__gallery-image {
    aspect-ratio: 16 / 10;
  }

  .project__logo {
    max-width: 180px;
  }
}

@media (max-width: 480px) {
  :root {
    --space-md: 24px;
    --space-lg: 48px;
  }

  .button {
    width: 100%;
  }

  .logo-grid {
    grid-template-columns: 1fr;
  }

  .logo-grid img {
    height: 112px;
  }

  .contact__links {
    font-size: 1.18rem;
  }
}

/* Ajustes responsivos v2. */
@media (max-width: 1200px) {
  .logo-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 992px) {
  .brands-grid .section-heading,
  .logo-grid,
  .testimonial-grid,
  .contact__panel {
    grid-column: 1 / -1;
  }

  h1 {
    max-width: 12ch;
    font-size: clamp(3.2rem, 9.6vw, 5rem);
  }

  .logo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 34px;
  }

  .logo-grid img {
    height: 52px;
  }

  .contact__panel {
    margin-top: var(--space-md);
  }
}

@media (max-width: 768px) {
  h1 {
    font-size: clamp(2.8rem, 13vw, 4.5rem);
  }

  h2 {
    font-size: clamp(2.35rem, 10vw, 4rem);
  }

  .hero__image,
  .hero__image--wide {
    aspect-ratio: 16 / 7.2;
  }

  .image-stack img {
    aspect-ratio: 16 / 8;
  }

  .contact__panel {
    grid-template-columns: 1fr;
  }

  .contact__qr {
    width: 118px;
  }

  .contact__headline img {
    width: clamp(240px, 72vw, 330px);
  }
}

@media (max-width: 480px) {
  .logo-grid {
    grid-template-columns: 1fr;
  }

  .logo-grid img {
    height: 48px;
    object-position: left center;
  }
}

/* Mantem a navegacao textual durante a rolagem. */
@media (max-width: 768px) {
  .site-header__inner {
    gap: 18px;
  }

  .menu-toggle {
    display: none !important;
  }

  .site-nav,
  .site-nav.is-open {
    position: static;
    display: flex !important;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 14px 18px;
    padding: 0;
    border: 0;
    background: transparent;
  }

  .site-nav a {
    padding: 8px 0;
  }

  .brand img {
    width: clamp(116px, 22vw, 148px) !important;
  }
}

/* Ajuste responsivo marcas e feedbacks. */
@media (max-width: 1200px) {
  .brands-grid {
    grid-template-columns: 1fr;
  }

  .brands-copy,
  .logo-grid {
    grid-column: 1 / -1;
  }

  .logo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .logo-card img {
    width: 220px;
    height: 72px;
    max-width: 76%;
    object-position: center;
  }
}

@media (max-width: 768px) {
  .brands-copy h2 {
    font-size: clamp(3rem, 13vw, 4.8rem);
  }

  .logo-card {
    min-height: 118px;
  }

  .logo-card img {
    width: 190px;
    height: 64px;
    max-width: 78%;
  }
}

@media (max-width: 560px) {
  .logo-grid {
    grid-template-columns: 1fr;
  }

  .logo-card--wide {
    grid-column: auto;
  }
}

/* Refinamento responsivo marcas e pessoas. */
@media (max-width: 1200px) {
  .brands-copy {
    gap: 18px;
  }

  .brands-copy h2 {
    font-size: clamp(2.35rem, 5.5vw, 4.1rem);
  }

  .logo-card {
    background: transparent;
  }

  .logo-card:nth-child(1) img {
    width: 205px;
    height: auto;
  }

  .logo-card:nth-child(2) img {
    width: 218px;
    height: auto;
  }

  .logo-card:nth-child(3) img {
    width: 218px;
    height: auto;
  }

  .logo-card:nth-child(4) img {
    width: 214px;
    height: auto;
  }

  .logo-card:nth-child(5) img {
    width: 220px;
    height: auto;
  }
}

@media (max-width: 768px) {
  .brands-copy h2 {
    font-size: clamp(2.35rem, 10vw, 4rem);
  }

  .feedback-title {
    max-width: 280px;
  }
}

/* Finalizacao responsiva marcas e pessoas. */
@media (max-width: 1200px) {
  .section--brands .brands-grid {
    grid-template-columns: 1fr;
    row-gap: 48px;
  }

  .section--brands .brands-copy,
  .section--brands .logo-grid {
    grid-column: 1 / -1;
    width: min(100%, 590px);
    justify-self: start;
    padding-top: 18px;
    gap: 42px 70px;
  }

  .section--brands .brands-copy h2 {
    font-size: clamp(2.35rem, 4.4vw, 4.1rem);
  }

  .section--brands .logo-card {
    background: transparent !important;
  }

  .section--brands .logo-card img,
  .section--brands .logo-card--wide img {
    width: 220px;
    height: 62px;
    max-width: 100%;
  }
}

@media (max-width: 768px) {
  .section--brands .brands-copy h2 {
    font-size: clamp(2.35rem, 10vw, 4rem);
    white-space: normal;
  }

  .section--brands .logo-grid {
    padding-top: 0;
    gap: 34px;
  }
}

/* Finalizacao responsiva da tela de contato. */
@media (max-width: 992px) {
  .contact__grid {
    grid-template-columns: 1fr;
    gap: 46px;
  }

  .contact__headline {
    gap: 34px;
  }

  .contact__headline > img {
    width: clamp(190px, 34vw, 270px) !important;
  }

  .contact__brand-row {
    grid-template-columns: clamp(112px, 20vw, 150px) minmax(0, 1fr);
    gap: 28px;
  }

  .contact__headline h2 {
    font-size: clamp(2.3rem, 8vw, 4.5rem);
  }

  .contact__panel {
    justify-content: flex-start;
  }
}

@media (max-width: 620px) {
  .contact {
    min-height: auto;
    padding-block: 72px;
  }

  .contact__brand-row {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .contact__qr {
    width: 132px;
  }

  .contact__headline h2 {
    max-width: 10.5ch;
  }

  .contact__links {
    font-size: 1rem;
  }
}

@media (max-width: 992px) {
  .contact__headline {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .contact__top-row {
    grid-template-columns: repeat(2, clamp(120px, 22vw, 154px));
  }

  .contact__logo,
  .contact__headline > img,
  .contact__qr {
    width: clamp(120px, 22vw, 154px) !important;
    height: clamp(120px, 22vw, 154px);
  }

  .contact__headline h2 {
    max-width: 22ch !important;
    font-size: clamp(1.9rem, 5.8vw, 3.15rem) !important;
  }

  .contact__links {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

@media (max-width: 560px) {
  .contact__top-row {
    grid-template-columns: repeat(2, minmax(108px, 1fr));
    gap: 22px;
  }

  .contact__logo,
  .contact__headline > img,
  .contact__qr {
    width: min(100%, 132px) !important;
    height: 132px;
  }

  .contact__headline h2 {
    font-size: clamp(1.85rem, 9.6vw, 2.65rem) !important;
  }
}

@media (max-width: 620px) {
  .contact__links {
    display: flex !important;
    flex-wrap: wrap;
    gap: 18px !important;
  }

  .contact__icon-link {
    width: 44px;
    height: 44px;
  }
}

@media (max-width: 620px) {
  .contact__grid {
    min-height: calc(100vh - 132px);
    gap: 36px !important;
  }

  .contact__headline h2 {
    font-size: clamp(1.45rem, 7vw, 2.4rem) !important;
    max-width: 18ch !important;
    white-space: normal;
  }

  .contact__links {
    justify-content: center !important;
    gap: 22px !important;
  }

  .contact__icon-link {
    width: 40px;
    height: 40px;
  }
}

@media (max-width: 620px) {
  .contact {
    padding-block: 84px 56px !important;
  }

  .contact__grid {
    width: min(100%, 360px);
    justify-items: start !important;
    gap: 54px !important;
  }

  .contact__headline {
    justify-items: start !important;
    text-align: left !important;
    gap: 28px !important;
  }

  .contact__headline h2 {
    max-width: 330px !important;
    text-align: left !important;
    font-size: clamp(1.7rem, 8vw, 2.42rem) !important;
    line-height: 0.96 !important;
    white-space: normal !important;
  }

  .contact__links {
    justify-content: flex-start !important;
    gap: 20px !important;
  }
}