.institutional-page {
  background: var(--paper);
}

.institutional-page .main-navigation a[aria-current="page"]::after {
  transform: scaleX(1);
}

.institutional-hero {
  position: relative;
  min-height: 620px;
  overflow: hidden;
  background: #4d4e4a;
  color: var(--off-white);
}

.institutional-hero > img,
.institutional-hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.institutional-hero > img {
  object-fit: cover;
  object-position: center 32%;
}

.institutional-hero-shade {
  background: rgba(30, 23, 19, 0.67);
}

.institutional-hero .container {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: 620px;
  flex-direction: column;
  justify-content: space-between;
  padding-top: 36px;
  padding-bottom: 70px;
}

.institutional-breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.institutional-breadcrumb li {
  color: rgba(245, 240, 232, 0.76);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
}

.institutional-breadcrumb li + li::before {
  margin-right: 8px;
  color: var(--caramel);
  content: "/";
}

.institutional-breadcrumb a:hover {
  color: var(--white);
}

.institutional-hero-copy {
  max-width: 760px;
}

.institutional-hero-copy .eyebrow {
  color: #d6b58f;
}

.institutional-hero-copy h1 {
  max-width: 720px;
  margin: 16px 0 20px;
  color: var(--off-white);
  font-size: 76px;
  line-height: 0.94;
}

.institutional-hero-copy > p:last-of-type {
  max-width: 660px;
  margin: 0;
  color: rgba(245, 240, 232, 0.9);
  font-size: 17px;
  line-height: 1.8;
}

.institutional-section {
  padding: 104px 0;
}

.institutional-intro {
  display: grid;
  align-items: start;
  gap: 90px;
  grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
}

.institutional-intro h2,
.contact-main h2,
.institutional-band h2 {
  margin: 14px 0 0;
  font-size: 54px;
  line-height: 1;
}

.institutional-prose {
  max-width: 720px;
}

.institutional-prose p {
  margin: 0 0 22px;
  color: #62564e;
  font-size: 15px;
  line-height: 1.9;
}

.institutional-prose p:first-child {
  color: var(--coffee);
  font-family: var(--font-display);
  font-size: 29px;
  line-height: 1.35;
}

.institutional-facts {
  border-top: 1px solid rgba(74, 52, 40, 0.2);
  border-bottom: 1px solid rgba(74, 52, 40, 0.2);
  background: var(--off-white);
}

.institutional-facts dl {
  display: grid;
  margin: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.institutional-facts div {
  min-height: 126px;
  padding: 30px 28px;
  border-right: 1px solid rgba(74, 52, 40, 0.18);
}

.institutional-facts div:last-child {
  border-right: 0;
}

.institutional-facts dt {
  margin-bottom: 10px;
  color: var(--olive);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
}

.institutional-facts dd {
  margin: 0;
  color: var(--coffee);
  font-family: var(--font-display);
  font-size: 24px;
  line-height: 1.2;
}

.institutional-band {
  background: var(--coffee);
  color: var(--off-white);
}

.institutional-band .container {
  display: grid;
  align-items: center;
  gap: 80px;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.65fr);
}

.institutional-band h2 {
  color: var(--off-white);
}

.institutional-band p {
  margin: 0 0 24px;
  color: rgba(245, 240, 232, 0.82);
  line-height: 1.8;
}

.contact-main {
  display: grid;
  gap: 90px;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
}

.contact-main > div:first-child p:last-child {
  max-width: 430px;
  color: #62564e;
  line-height: 1.8;
}

.contact-channels {
  border-top: 1px solid rgba(74, 52, 40, 0.22);
}

.contact-channel {
  display: grid;
  min-height: 132px;
  align-items: center;
  gap: 30px;
  grid-template-columns: 100px minmax(0, 1fr) auto;
  border-bottom: 1px solid rgba(74, 52, 40, 0.22);
}

.contact-channel small {
  color: var(--olive);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
}

.contact-channel strong {
  color: var(--coffee);
  font-family: var(--font-display);
  font-size: 29px;
  font-weight: 500;
}

.contact-channel b {
  color: var(--caramel);
  font-size: 20px;
}

.contact-channel:hover strong,
.contact-channel:focus-visible strong {
  color: var(--olive-dark);
}

.contact-notice {
  margin: 28px 0 0;
  padding-left: 18px;
  border-left: 2px solid var(--caramel);
  color: #62564e;
  font-size: 12px;
  line-height: 1.7;
}

@media (max-width: 960px) {
  .institutional-hero,
  .institutional-hero .container {
    min-height: 560px;
  }

  .institutional-hero-copy h1 {
    font-size: 62px;
  }

  .institutional-intro,
  .contact-main {
    gap: 56px;
  }

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

  .institutional-facts div:nth-child(2) {
    border-right: 0;
  }

  .institutional-facts div:nth-child(-n + 2) {
    border-bottom: 1px solid rgba(74, 52, 40, 0.18);
  }
}

@media (max-width: 760px) {
  .institutional-hero,
  .institutional-hero .container {
    min-height: 520px;
  }

  .institutional-hero > img {
    object-position: 58% center;
  }

  .institutional-hero .container {
    padding-top: 24px;
    padding-bottom: 48px;
  }

  .institutional-hero-copy h1 {
    font-size: 48px;
  }

  .institutional-hero-copy > p:last-of-type {
    font-size: 14px;
  }

  .institutional-section {
    padding: 72px 0;
  }

  .institutional-intro,
  .contact-main,
  .institutional-band .container {
    grid-template-columns: 1fr;
  }

  .institutional-intro h2,
  .contact-main h2,
  .institutional-band h2 {
    font-size: 42px;
  }

  .institutional-prose p:first-child {
    font-size: 25px;
  }

  .contact-channel {
    min-height: 112px;
    gap: 10px 20px;
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .contact-channel small {
    grid-column: 1 / -1;
    align-self: end;
  }

  .contact-channel strong {
    align-self: start;
    font-size: 24px;
  }
}

@media (max-width: 430px) {
  .institutional-hero-copy h1 {
    font-size: 41px;
  }

  .institutional-facts dl {
    grid-template-columns: 1fr;
  }

  .institutional-facts div,
  .institutional-facts div:nth-child(2) {
    min-height: 0;
    border-right: 0;
    border-bottom: 1px solid rgba(74, 52, 40, 0.18);
  }

  .institutional-facts div:last-child {
    border-bottom: 0;
  }

  .contact-channel strong {
    font-size: 21px;
  }
}

/* Readability typography pass */
.institutional-hero-copy > p:last-of-type {
  font-size: 18px;
}

.institutional-prose p {
  font-size: 17px;
  line-height: 1.85;
}

.contact-notice {
  font-size: 14px;
  line-height: 1.75;
}

.institutional-breadcrumb li,
.institutional-facts dt,
.contact-channel small {
  font-size: 11px;
}

@media (max-width: 760px) {
  .institutional-hero-copy > p:last-of-type {
    font-size: 15px;
  }

  .institutional-prose p {
    font-size: 16px;
  }
}

/* Client-approved larger typography */
.institutional-hero-copy > p:last-of-type {
  font-size: 19px;
  line-height: 1.78;
}

.institutional-prose p {
  font-size: 18px;
  line-height: 1.9;
}

.contact-notice {
  font-size: 16px;
  line-height: 1.78;
}

.institutional-breadcrumb li,
.institutional-facts dt,
.contact-channel small {
  font-size: 12px;
}

@media (max-width: 760px) {
  .institutional-hero-copy > p:last-of-type,
  .institutional-prose p {
    font-size: 17px;
  }

  .contact-notice {
    font-size: 16px;
  }
}

/* Método Reencontrar */
.institutional-method {
  background: #F5F0E8;
  scroll-margin-top: calc(var(--header-height) + 20px);
}

.institutional-method-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: clamp(44px, 7vw, 110px);
  align-items: start;
}

.institutional-method h2 {
  max-width: 680px;
  margin: 18px 0 0;
}

.institutional-method blockquote {
  margin: 28px 0;
  padding: 4px 0 4px 24px;
  border-left: 2px solid #A67C52;
  color: #4A3428;
  font-family: var(--font-display);
  font-size: clamp(27px, 2.2vw, 36px);
  line-height: 1.2;
}

.institutional-method .button {
  margin-top: 12px;
}

@media (max-width: 820px) {
  .institutional-method-layout {
    grid-template-columns: 1fr;
  }
}
