:root {
  --ink: #050505;
  --paper: #fff;
  --blue: #1796c9;
  --muted: #656565;
  --line: #e2e2e2;
  --soft: #f4f7f8;
  --serif: "Instrument Serif", Georgia, serif;
  --sans: "DM Sans", Arial, sans-serif;
  --max: 1240px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background-color: var(--paper); background-image: repeating-linear-gradient(135deg, transparent 0, transparent 43px, rgba(16,40,55,.045) 43px, rgba(16,40,55,.045) 44px); font: 16px/1.6 var(--sans); overflow-x: hidden; }
body.global-menu-open { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
.skip-link { position: fixed; z-index: 2000; top: 8px; left: 8px; padding: 10px 14px; background: var(--ink); color: #fff; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.shell { width: min(calc(100% - 48px), var(--max)); margin-inline: auto; }
.btn { display: inline-flex; min-height: 54px; align-items: center; justify-content: center; gap: 10px; padding: 0 24px; border: 1px solid var(--ink); border-radius: 999px; background: var(--ink); color: #fff; font-weight: 700; }
.btn--light { border-color: #fff; background: #fff; color: var(--ink); }
.section-title { max-width: 940px; margin: 0; font: 400 clamp(54px,7vw,88px)/.95 var(--serif); }
.section-title em { color: var(--blue); font-weight: 400; }

.about-hero { min-height: 720px; display: grid; align-items: center; padding: 170px 0 110px; text-align: center; }
.about-hero-inner { max-width: 1040px; margin-inline: auto; }
.about-label { display: inline-block; margin-bottom: 28px; padding: 8px 13px; border: 1px solid rgba(23,150,201,.4); color: var(--blue); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.about-hero h1 { margin: 0; font: 400 clamp(68px,9vw,118px)/.87 var(--serif); }
.about-hero h1 em { display: block; color: var(--blue); font-weight: 400; }
.about-hero p { max-width: 760px; margin: 34px auto 0; color: var(--muted); font-size: 20px; }

.mission { padding: 120px 0; background: var(--ink); color: #fff; }
.mission-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 90px; align-items: start; }
.mission h2 { margin: 0; font: 400 clamp(52px,6vw,82px)/.95 var(--serif); }
.mission h2 em { color: var(--blue); font-weight: 400; }
.mission-copy p { margin: 0 0 24px; color: rgba(255,255,255,.7); font-size: 18px; }
.mission-copy .opening { color: #fff; font: 400 34px/1.12 var(--serif); }

.management { padding: 132px 0; }
.management-head { max-width: 900px; margin: 0 auto 70px; text-align: center; }
.management-head .section-title { margin-inline: auto; }
.management-head p { max-width: 660px; margin: 24px auto 0; color: var(--muted); font-size: 18px; }
.management-grid { display: flex; max-width: 820px; margin-inline: auto; flex-direction: column; gap: 42px; align-items: center; text-align: center; }
.management-card { width: min(100%,380px); margin: 0; }
.management-card img { width: 100%; height: 460px; object-fit: cover; object-position: 50% 28%; border: 1px solid var(--line); }
.management-card figcaption { padding: 18px 8px 0; color: var(--ink); text-align: center; }
.management-card strong, .management-card span { display: block; }
.management-card span { margin-top: 5px; color: var(--muted); font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.management-copy h2 { margin: 0 0 26px; font: 400 clamp(45px,5vw,66px)/.98 var(--serif); }
.management-copy { width: 100%; }
.management-copy p { max-width: 720px; margin: 0 auto 20px; color: var(--muted); font-size: 17px; }
.management-facts { display: grid; max-width: 760px; margin: 34px auto 0; border-top: 1px solid var(--ink); text-align: left; }
.management-facts div { display: grid; grid-template-columns: 45px 1fr; gap: 18px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.management-facts span { color: var(--blue); font-size: 12px; font-weight: 700; }
.management-facts strong { font-size: 15px; }

.principles { padding: 132px 0; background: var(--soft); }
.principles .section-title { margin-inline: auto; text-align: center; }
.principle-grid { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 72px; border: 1px solid var(--line); background: #fff; }
.principle { min-height: 330px; padding: 42px 34px; }
.principle + .principle { border-left: 1px solid var(--line); }
.principle span { color: var(--blue); font-size: 12px; font-weight: 700; }
.principle h3 { margin: 62px 0 16px; font: 400 40px/1 var(--serif); }
.principle p { margin: 0; color: var(--muted); }

.about-cta { padding: 132px 0; background-color: var(--ink); background-image: repeating-linear-gradient(135deg,transparent 0,transparent 43px,rgba(23,150,201,.15) 43px,rgba(23,150,201,.15) 44px); color: #fff; text-align: center; }
.about-cta h2 { max-width: 920px; margin: 0 auto; font: 400 clamp(52px,7vw,88px)/.95 var(--serif); }
.about-cta h2 em { color: var(--blue); font-weight: 400; }
.about-cta p { max-width: 680px; margin: 28px auto 34px; color: rgba(255,255,255,.68); font-size: 18px; }

@media (max-width:820px) {
  .about-hero { min-height: auto; padding: 150px 0 96px; }
  .mission, .management, .principles, .about-cta { padding: 94px 0; }
  .mission-grid { grid-template-columns: 1fr; gap: 52px; }
  .management-grid { gap: 42px; }
  .management-card { width: min(100%,380px); margin-inline: auto; }
  .principle-grid { grid-template-columns: 1fr; }
  .principle { min-height: auto; }
  .principle + .principle { border-top: 1px solid var(--line); border-left: 0; }
  .principle h3 { margin-top: 34px; }
}
@media (max-width:560px) {
  .shell { width: min(calc(100% - 30px),var(--max)); }
  .about-hero h1 { font-size: 64px; }
  .about-hero p, .management-head p { font-size: 17px; }
  .mission-copy .opening { font-size: 30px; }
  .management-head { margin-bottom: 44px; }
  .management-copy h2 { font-size: 43px; }
}
