:root {
  --font-display: 'Montserrat', Arial, sans-serif;
  --font-body: 'Montserrat', Arial, sans-serif;
  --font-mono: var(--font-body);
}

body {
  overflow-x: hidden;  }
body.menu-open {
  overflow: hidden; }
p, h1, h2, h3 {
  margin: 0; text-wrap: pretty; }
h1, h2, h3 {
  text-wrap: balance; }
.container {
  width: min(1240px, calc(100% - 64px)); margin-inline: auto; }

.topnav { position: sticky;
  z-index: 100;
  top: 0;
  height: 84px;
  background: var(--nav-bg);
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(18px);}
.topnav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%; }
.logo-lockup { width: 174px; }
.desktop-nav { display: flex; align-items: center; gap: clamp(18px,2vw,32px); }
.desktop-nav a { position: relative; color: var(--muted); font-size: 13px; font-weight: 600; letter-spacing: .01em; }
.desktop-nav a::after { bottom: -8px; height: 1px; background: var(--accent); }
.desktop-nav a:hover, .desktop-nav a:focus-visible { color: var(--fg); }
.nav-contact { min-height: auto; padding: 0; background: transparent; border-bottom: 0; color: var(--muted) !important; }
.nav-contact::after { display: none; }
.menu-toggle, .menu-panel { display: none; }

.page-hero { position: relative; overflow: hidden; padding-block: 116px 124px; background: var(--accent); color: #fff; }
.page-hero::after {
  position: absolute;
  right: -80px;
  bottom: -150px;
  width: min(42vw,560px);
  aspect-ratio: 1;
  background: url('../../mrs-simbolo-branco.svg') center / contain no-repeat;
  content: '';
  opacity: .055;
}
.page-hero-grid { position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0,8fr) minmax(180px,3fr);
  gap: 48px;
  align-items: end;
}
.page-hero-copy { max-width: 850px; }
.page-hero .eyebrow, .people .eyebrow { margin: 0 0 26px; color: rgba(255,255,255,.56); font-size: 11px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.page-hero h1 { max-width: 780px; margin: 0; font: 800 clamp(56px,7vw,94px)/.92 var(--font-display); letter-spacing: -.05em; text-wrap: balance; }
.page-hero-copy p:not(.eyebrow) { max-width: 610px; margin: 34px 0 0; color: rgba(255,255,255,.7); font-size: 18px; line-height: 1.7; }
.hero-link { display: inline-block; margin-top: 38px; padding-bottom: 6px; border-bottom: 1px solid rgba(255,255,255,.64); color: #fff; font-size: 13px; font-weight: 800; }
.hero-mark { width: min(100%,220px); justify-self: end; opacity: .16; filter: brightness(0) invert(1); }

.people { padding-block: 128px 144px; background: var(--bg); }
.people-intro { display: grid; grid-template-columns: minmax(0,7fr) minmax(280px,4fr); gap: 48px; align-items: end; margin-bottom: 76px; }
.people .eyebrow { color: var(--muted); }
.people-intro h2 { max-width: 680px; margin: 0; font: 800 clamp(48px,5.2vw,74px)/.98 var(--font-display); letter-spacing: -.04em; text-wrap: balance; }
.people-intro-copy { max-width: 470px; justify-self: end; }
.people-intro-copy p { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.75; }

.people-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 48px 30px; align-items: start; }
.person-details { position: relative; min-width: 0; scroll-margin-top: 110px; perspective: none; transform-style: flat; }
.person-featured { grid-row: auto; }
.person-summary { display: block; }
.person-photo-wrap { position: relative; display: block; width: 100%; aspect-ratio: 4 / 5; overflow: hidden; background: var(--surface); backface-visibility: visible; transform: none; transition: none; }
.person-details:not(.person-featured) .person-photo-wrap { aspect-ratio: 4 / 5; }
.person-photo { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 18%; filter: saturate(.75) contrast(1.03); transition: transform .45s ease; }
.person-details:not(.person-featured) .person-photo { object-position: center 20%; }
.person-summary:hover .person-photo { transform: scale(1.015); }
.person-caption { display: block; padding-top: 18px; border-top: 1px solid var(--fg); opacity: 1; visibility: visible; }
.person-topline { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; }
.person-name { max-width: 480px; font: 800 clamp(25px,2.4vw,38px)/1.04 var(--font-display); letter-spacing: -.035em; }
.person-details:not(.person-featured) .person-name { font-size: clamp(25px,2.4vw,38px); }
.person-note { flex: 0 0 auto; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.person-role { display: block; max-width: 540px; margin-top: 10px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.person-bio { position: static; inset: auto; width: auto; aspect-ratio: auto; margin: 26px 0 0; padding: 26px 0 0; overflow: visible; background: transparent; border-top: 1px solid var(--border); color: #3f423f; font-size: 14px; line-height: 1.72; opacity: 1; visibility: visible; pointer-events: auto; backface-visibility: visible; transform: none; transition: none; }
.person-bio p { margin: 0; }
.person-bio p + p { margin-top: 16px; }
.person-details.is-info-open .person-photo-wrap, .person-details.is-info-open .person-caption, .person-details.is-info-dismissed .person-photo-wrap, .person-details.is-info-dismissed .person-caption { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }

@media (min-width: 981px) {
  .person-name { min-height: calc(3 * 1.04em); }
}

@media (max-width: 980px) {
  .container { width: min(100% - 40px,1240px); }
  .desktop-nav { display: none; }
  .menu-toggle { position: relative; z-index: 102; display: grid; width: 48px; height: 48px; place-items: center; padding: 0; background: transparent; border: 0; }
  .menu-glyph { position: relative; display: block; width: 24px; height: 16px; background: transparent; }
  .menu-glyph::before, .menu-glyph::after { position: absolute; left: 0; display: block; width: 24px; height: 2px; background: currentColor; content: ''; transition: top .2s ease, bottom .2s ease, transform .2s ease; }
  .menu-glyph::before { top: 3px; transform: none; }
  .menu-glyph::after { top: auto; bottom: 3px; }
  .menu-toggle[aria-expanded='true'] .menu-glyph { background: transparent; transform: none; }
  .menu-toggle[aria-expanded='true'] .menu-glyph::before { top: 7px; transform: rotate(45deg); }
  .menu-toggle[aria-expanded='true'] .menu-glyph::after { bottom: 7px; transform: rotate(-45deg); }
  .menu-panel { position: fixed; z-index: 99; inset: 84px 0 0; display: block; padding: 28px 20px max(32px,env(safe-area-inset-bottom)); background: var(--bg); color: var(--fg); visibility: hidden; opacity: 0; transition: opacity .2s ease, visibility .2s ease; }
  .menu-panel.is-open { visibility: visible; opacity: 1; }
  .menu-panel nav { display: grid; }
  .menu-panel a { display: flex; align-items: center; min-height: 60px; border-bottom: 1px solid var(--border); font: 400 30px var(--font-display); }
  .menu-panel a::after { color: var(--muted); }
  .page-hero-grid, .people-intro { grid-template-columns: 1fr; }
  .hero-mark { display: none; }
  .people-intro-copy { justify-self: start; }
  .people-grid { grid-template-columns: 1fr 1fr; gap: 64px 26px; }
  .person-featured { grid-column: auto; grid-row: auto; width: auto; }
  .person-details:not(.person-featured) .person-photo-wrap { aspect-ratio: 4 / 5; }
}

@media (max-width: 700px) {
  .container {
    width: min(100% - 32px,1240px);
  }
  .topnav {
    height: 72px;
  }
  .logo-lockup {
    width: 148px;
  }
  .menu-panel {
    inset-block-start: 72px;
  }
  .page-hero {
    padding-block: 88px 82px;
  }
  .page-hero h1 {
    font-size: clamp(48px,14vw,66px);
  }
  .page-hero-copy p:not(.eyebrow) {
    font-size: 16px;
  }
  .people {
    padding-block: 82px 96px;
  }
  .people-intro {
    gap: 28px; margin-bottom: 52px;
  }
  .people-intro h2 { font-size: clamp(42px,12vw,58px); }
  .people-grid { grid-template-columns: 1fr; gap: 58px; }
  .person-featured { width: auto; }
  .person-details:not(.person-featured) .person-photo-wrap { aspect-ratio: 4 / 5; }
  .person-name, .person-details:not(.person-featured) .person-name { font-size: 29px; }
  .person-topline { display: grid; gap: 8px; }
}