/* About route — single editorial section + contact footer */

.about-page-section {
  padding-bottom: clamp(96px, 14vh, 160px);
}

.about-page-inner {
  row-gap: 0;
}

.about-opening-figures {
  grid-column: 6 / span 6;
  width: 100%;
  margin: clamp(40px, 5vw, 72px) 0 0;
}

.about-opening-figure {
  position: relative;
  align-self: start;
  min-width: 0;
  aspect-ratio: .8;
  margin: 0;
  overflow: hidden;
  border-radius: 18px;
  background: #dedbd5;
}

.about-opening-figure img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 38%;
  filter: grayscale(1);
}

.about-page-inner .about-scale-focus,
.about-page-inner .about-beyond-focus,
.about-page-inner .about-closing-line {
  grid-column: 6 / span 6;
  width: 100%;
  min-width: 0;
}

.about-page-inner .about-logos-inner {
  grid-column: 1 / -1;
  width: 100%;
  max-width: 1244px;
  margin-left: auto;
  margin-right: auto;
}

.about-page-block {
  margin-top: clamp(48px, 6vh, 72px);
}

.about-page-block.about-closing-line {
  margin-top: clamp(64px, 10vh, 120px);
}

.about-page-block.about-logos-inner {
  margin-top: clamp(56px, 7vh, 88px);
}

.about-scale-focus h3 {
  margin: 0;
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 500;
  letter-spacing: -0.042em;
  line-height: 1.14;
}

.about-scale-focus p {
  margin: clamp(18px, 2.2vw, 24px) 0 0;
  color: var(--page-muted);
  font-size: clamp(17px, 1.5vw, 21px);
  font-weight: 400;
  letter-spacing: -0.03em;
  line-height: 1.28;
}

.about-logos-inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 16px;
  align-items: start;
}

.about-logos-label {
  grid-column: 2 / span 3;
  margin: 0;
  color: var(--page-muted);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.015em;
  line-height: 1.35;
}

.about-logo-grid {
  grid-column: 6 / span 6;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: minmax(var(--about-logo-cell-min-h, 88px), auto);
  align-items: stretch;
  gap: 16px;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.about-logo-item {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: var(--about-logo-cell-min-h, 88px);
  padding: clamp(20px, 2.5vw, 28px) clamp(16px, 2vw, 20px);
  border: 1px solid var(--adhemas-line, #e7e5e1);
  border-radius: 16px;
  background: transparent;
}

.about-logo-optical {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  height: var(--about-logo-mark-h, clamp(28px, 3.2vw, 38px));
  transform: scale(var(--logo-optical-scale, 1));
}

.about-logo-mark {
  display: block;
  width: auto;
  max-width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  filter: brightness(0);
  opacity: 0.58;
}

.about-logo-item[data-brand="cit"] { --logo-optical-scale: 0.86; }
.about-logo-item[data-brand="coca-cola"] { --logo-optical-scale: 2.35; }
.about-logo-item[data-brand="bradesco"] { --logo-optical-scale: 0.94; }
.about-logo-item[data-brand="johnson-johnson"] { --logo-optical-scale: 1; }
.about-logo-item[data-brand="porto-seguro"] { --logo-optical-scale: 0.96; }
.about-logo-item[data-brand="iheart-media"] { --logo-optical-scale: 0.88; }

.about-beyond-focus h3 {
  margin: 0;
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 500;
  letter-spacing: -0.042em;
  line-height: 1.14;
}

.about-beyond-focus p {
  margin: clamp(18px, 2.2vw, 24px) 0 0;
  color: var(--page-muted);
  font-size: clamp(17px, 1.5vw, 21px);
  font-weight: 400;
  letter-spacing: -0.03em;
  line-height: 1.28;
}

.about-closing-line {
  margin: 0;
  max-width: none;
  color: var(--page-foreground);
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 500;
  letter-spacing: -0.042em;
  line-height: 1.14;
}

.about-page-block {
  transition: transform var(--adhemas-motion-reveal-duration) var(--adhemas-motion-ease),
    opacity var(--adhemas-motion-opacity-duration) ease;
}

body.motion-ready .about-page-block:not(.is-revealed) {
  opacity: 0;
  transform: translateY(var(--adhemas-motion-reveal-distance));
}

@media (max-width: 767px) {
  .about-opening-figures {
    grid-column: 1 / -1;
    margin-top: 32px;
  }

  .about-opening-figure {
    border-radius: 14px;
  }

  .about-page-inner .about-scale-focus,
  .about-page-inner .about-beyond-focus,
  .about-page-inner .about-closing-line {
    grid-column: 1 / -1;
  }

  .about-scale-focus h3,
  .about-beyond-focus h3 {
    font-size: clamp(20px, 5.5vw, 26px);
  }

  .about-scale-focus p,
  .about-beyond-focus p {
    font-size: 17px;
  }

  .about-logos-inner {
    display: block;
  }

  .about-logos-label {
    margin-bottom: 28px;
  }

  .about-logo-grid {
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
  }

  .about-logo-item {
    min-height: 72px;
    padding: 16px 12px;
  }

  .about-logo-optical {
    height: 26px;
  }

  .about-closing-line {
    font-size: clamp(20px, 5.5vw, 26px);
  }
}

@media (prefers-reduced-motion: reduce) {
  body:not([data-motion-preview="true"]) .about-page-block {
    transition-duration: 0s !important;
    transform: none !important;
    opacity: 1 !important;
  }
}
