/* Presentación institucional de la portada, con la tipografía y las tintas de la marca. */
.company {
  --company-ink: #173a3d;
  --company-teal: #00676c;
  --company-rule: #b7cdca;
  background: #f1f6f5;
  color: var(--company-ink);
  padding-block: clamp(48px, 5.5vw, 80px);
  font: 400 17px/1.65 "Segoe UI", Arial, sans-serif;
}
.company-inner {
  width: min(1200px, calc(100% - 80px));
  margin-inline: auto;
}
.company-intro, .company-team {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.12fr);
  column-gap: clamp(40px, 6vw, 88px);
}
.company h2, .company h3, .company p, .company ul { margin: 0; }
.company h2, .company h3 {
  font-family: "Trebuchet MS", "Segoe UI", sans-serif;
  color: var(--company-ink);
  font-weight: 700;
  letter-spacing: -.035em;
}
.company h2 { font-size: clamp(38px, 4vw, 58px); line-height: 1.08; }
.company h3 { font-size: clamp(23px, 2.1vw, 29px); line-height: 1.2; }
.company .company-motto {
  max-width: 25ch;
  margin-top: 20px;
  font-size: clamp(20px, 1.65vw, 25px);
  line-height: 1.45;
  color: var(--company-teal);
  text-wrap: balance;
}
.company-story p { max-width: 67ch; }
.company-story p + p { margin-top: 1em; }
.company-team {
  margin-top: clamp(36px, 4vw, 56px);
  padding-top: clamp(28px, 3vw, 44px);
  border-top: 1px solid var(--company-rule);
  font-size: 16px;
}
.company-role { font-size: 14px; font-weight: 600; color: var(--company-teal); }
.company-team .company-role { margin-top: 5px; }
.company-team p:not(.company-role) { margin-top: 15px; max-width: 64ch; }
.company-team ul {
  margin-top: 14px;
  padding: 0;
  list-style: none;
}
.company-team li { display: flex; gap: 12px; align-items: baseline; padding-block: 4px; }
.company-team li::before {
  content: "";
  width: 6px;
  height: 6px;
  align-self: start;
  flex: 0 0 auto;
  margin-top: .7em;
  background: var(--company-teal);
}
.company .text-link { margin-top: 12px; gap: 8px; color: inherit; }
.company .text-link:hover { color: var(--company-teal); }
.company a:focus-visible { outline: 3px solid var(--company-teal); outline-offset: 4px; }
.company .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 1100px) {
  .company-inner { width: calc(100% - 64px); }
}
@media (max-width: 899px) {
  .company-inner { width: calc(100% - 48px); }
}
@media (max-width: 760px) {
  .company-intro, .company-team { grid-template-columns: 1fr; row-gap: 26px; }
  .company .company-motto { margin-top: 12px; }
  .company-team { row-gap: 32px; }
}
@media (max-width: 600px) {
  .company { font-size: 16px; }
  .company-inner { width: calc(100% - 40px); }
}