/* Página institucional dedicada. As seções editoriais existentes permanecem
   carregadas como fallback; esta camada cuida apenas do novo hero e da história. */
.ier-about-document {
  width: 100%;
  overflow-x: clip;
  overflow-y: auto;
  scrollbar-width: none;
}

.ier-about-document::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.ier-about-page {
  margin: 0;
  overflow-x: clip;
  overflow-y: visible;
  background: #f5f7fa;
  color: #132c47;
}

.ier-about-page header.index-header:not(.ier-header-scrolled),
.ier-about-page header.index-header:not(.ier-header-scrolled) nav {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.ier-about-page header.index-header:not(.ier-header-scrolled) .header-item,
.ier-about-page header.index-header:not(.ier-header-scrolled) .ier-project-trigger {
  color: #fff;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .48);
}

.ier-about-page header.index-header:not(.ier-header-scrolled) #header-logo img {
  filter: drop-shadow(0 2px 9px rgba(0, 0, 0, .5));
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.about-video-hero {
  position: relative;
  isolation: isolate;
  width: 100%;
  height: 100svh;
  min-height: 680px;
  overflow: hidden;
  background: #061c37;
  color: #fff;
}

.about-video-hero__media,
.about-video-hero__shade {
  position: absolute;
  inset: 0;
}

.about-video-hero__media {
  z-index: -3;
  overflow: hidden;
  background: #020a12;
}

.about-video-hero__media iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  width: max(100vw, 177.78vh);
  height: max(100vh, 56.25vw);
  min-width: 100%;
  min-height: 100%;
  border: 0;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.about-video-hero__shade {
  z-index: -2;
  background:
    linear-gradient(180deg, rgba(1, 10, 20, .58) 0%, rgba(1, 10, 20, .1) 33%, rgba(1, 10, 20, .08) 56%, rgba(1, 10, 20, .72) 100%),
    linear-gradient(90deg, rgba(1, 10, 20, .48), transparent 48%);
  pointer-events: none;
}

.about-video-hero__content {
  position: absolute;
  left: clamp(24px, 7vw, 130px);
  bottom: clamp(92px, 13vh, 138px);
  z-index: 2;
  width: min(760px, calc(100% - 48px));
}

.about-video-hero__content > p {
  margin: 0 0 14px;
  color: #ffb064;
  font-size: clamp(.82rem, .9vw, 1rem);
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.about-video-hero__content h1 {
  max-width: 12ch;
  margin: 0;
  color: #fff;
  font-size: clamp(3rem, 6vw, 5.8rem);
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: .94;
  text-wrap: balance;
  text-shadow: 0 4px 24px rgba(0, 0, 0, .32);
}

.about-video-hero__content > span {
  display: block;
  margin-top: 20px;
  color: rgba(255, 255, 255, .9);
  font-size: clamp(1rem, 1.25vw, 1.2rem);
  font-weight: 600;
}

.about-video-sound {
  position: absolute;
  right: clamp(22px, 4vw, 70px);
  bottom: clamp(92px, 12vh, 128px);
  z-index: 4;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  background: #fff;
  color: #082e54;
  font: inherit;
  font-weight: 750;
  cursor: pointer;
  box-shadow: 0 6px 8px rgba(0, 0, 0, .18);
  transition: transform .24s cubic-bezier(.22, 1, .36, 1), background-color .24s ease;
}

.about-video-sound[hidden] { display: none; }
.about-video-sound:hover { transform: translateY(-2px); background: #f2f6fa; }
.about-video-sound:focus-visible { outline: 3px solid #ff9a42; outline-offset: 4px; }

.about-video-scroll {
  position: absolute;
  right: 50%;
  bottom: 28px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: .86rem;
  font-weight: 650;
  text-decoration: none;
  transform: translateX(50%);
}

.about-video-scroll i { animation: about-scroll-cue 1.8s ease-in-out infinite; }

@keyframes about-scroll-cue {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(5px); }
}

.about-story {
  padding: clamp(76px, 10vw, 150px) max(24px, calc((100vw - 1240px) / 2));
  background: #f5f7fa;
}

.about-story__intro {
  display: grid;
  grid-template-columns: minmax(180px, .42fr) minmax(360px, 1.05fr) minmax(280px, .8fr);
  gap: clamp(28px, 5vw, 78px);
  align-items: start;
  padding-bottom: clamp(52px, 7vw, 88px);
}

.about-story__since {
  margin: 10px 0 0;
  color: #e56820;
  font-size: .92rem;
  font-weight: 800;
}

.about-story__intro h2 {
  margin: 0;
  color: #082e54;
  font-size: clamp(2.6rem, 4.7vw, 5rem);
  letter-spacing: -.04em;
  line-height: .98;
  text-wrap: balance;
}

.about-story__intro > p:last-child {
  max-width: 58ch;
  margin: 6px 0 0;
  color: #3e556b;
  font-size: clamp(1rem, 1.15vw, 1.13rem);
  line-height: 1.72;
  text-wrap: pretty;
}

.about-story__chapters {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid #aebcca;
  border-bottom: 1px solid #aebcca;
}

.about-story__chapters article {
  padding: clamp(32px, 4.5vw, 60px) clamp(22px, 3.5vw, 46px);
}

.about-story__chapters article + article { border-left: 1px solid #aebcca; }
.about-story__chapters article:first-child { padding-left: 0; }
.about-story__chapters article:last-child { padding-right: 0; }

.about-story__chapters span {
  color: #e56820;
  font-size: .82rem;
  font-weight: 800;
}

.about-story__chapters h3 {
  margin: 13px 0 18px;
  color: #082e54;
  font-size: clamp(1.5rem, 2vw, 2.15rem);
  letter-spacing: -.03em;
  line-height: 1.05;
}

.about-story__chapters p {
  max-width: 42ch;
  margin: 0;
  color: #455c70;
  font-size: .98rem;
  line-height: 1.68;
  text-wrap: pretty;
}

.about-story blockquote {
  max-width: 19ch;
  margin: clamp(60px, 8vw, 105px) auto 0;
  color: #082e54;
  font-size: clamp(2.2rem, 4.2vw, 4.4rem);
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1;
  text-align: center;
  text-wrap: balance;
}

.ier-about-page .about-history { padding-top: 0; }
.ier-about-page .about-chapter { scroll-margin-top: 90px; }

@media (max-width: 1100px) {
  .ier-about-page .ier-header-social,
  .ier-about-page .index-header-items > a[href*="techroyer"] { display: none; }
}

@media (max-width: 899px) {
  .ier-about-page .ier-donate { display: none; }
  .about-video-hero { min-height: 640px; }
  .about-video-hero__content { bottom: 118px; }
  .about-video-hero__content h1 { max-width: 11ch; font-size: clamp(2.9rem, 9vw, 4.8rem); }
  .about-video-sound { right: 22px; bottom: 76px; }
  .about-video-scroll { right: auto; bottom: 28px; left: 24px; transform: none; }
  .about-story__intro { grid-template-columns: 1fr; gap: 24px; }
  .about-story__since { margin: 0; }
  .about-story__intro > p:last-child { max-width: 66ch; }
  .about-story__chapters { grid-template-columns: 1fr; }
  .about-story__chapters article { padding: 36px 0; }
  .about-story__chapters article + article { border-top: 1px solid #aebcca; border-left: 0; }
}

@media (max-width: 599px) {
  .ier-about-page header.index-header nav { overflow-x: visible; }
  .ier-about-page .index-header-items > a[href*="colaboradores"] { display: none; }
  .ier-about-page .index-header-items { min-width: 0; }
  .about-video-hero { height: 100svh; min-height: 610px; }
  .about-video-hero__media iframe { width: max(100vw, 177.78svh); height: max(100svh, 56.25vw); }
  .about-video-hero__shade { background: linear-gradient(180deg, rgba(1, 10, 20, .62) 0%, rgba(1, 10, 20, .12) 31%, rgba(1, 10, 20, .7) 100%); }
  .about-video-hero__content { left: 20px; bottom: 132px; width: calc(100% - 40px); }
  .about-video-hero__content > p { margin-bottom: 10px; font-size: .72rem; }
  .about-video-hero__content h1 { max-width: 10ch; font-size: clamp(2.55rem, 12.8vw, 3.75rem); line-height: .97; }
  .about-video-hero__content > span { margin-top: 14px; font-size: .92rem; }
  .about-video-sound { right: 18px; bottom: 76px; min-height: 44px; padding-inline: 15px; font-size: .86rem; }
  .about-video-scroll { left: 20px; font-size: .78rem; }
  .about-story { padding: 68px 20px 76px; }
  .about-story__intro { padding-bottom: 46px; }
  .about-story__intro h2 { font-size: clamp(2.35rem, 11vw, 3.35rem); }
  .about-story__intro > p:last-child { font-size: .98rem; line-height: 1.65; }
  .about-story blockquote { margin-top: 58px; font-size: clamp(2rem, 10vw, 3rem); }
}

@media (prefers-reduced-motion: reduce) {
  .about-video-scroll i { animation: none; }
  .about-video-sound { transition: none; }
}

/* Tablet enhancement: the former hidden CTA remains the fallback below 761px. */
@media (min-width: 761px) and (max-width: 899px) {
  .ier-about-page .ier-donate {
    display: inline-flex;
    right: 14px;
    width: clamp(158px, 21vw, 174px);
    height: 43px;
    min-height: 43px;
    background-position: -15px -8px;
    background-size: 191px 58px;
  }

  .ier-about-page header.index-header .index-header-items > a.ier-donate:hover,
  .ier-about-page header.index-header .index-header-items > a.ier-donate:focus-visible {
    background-position: -15px -8px !important;
    background-size: 191px 58px !important;
  }
}
