:root { color: #1e302f; background: #e7e4d9; font-family: Arial, sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; }
a { color: inherit; }
button { font: inherit; }
.hero { min-height: min(820px, 100svh); position: relative; color: #f8f5e9; display: flex; flex-direction: column; overflow: hidden; background: #445f60; }
.hero-image, .hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-image { object-fit: cover; object-position: center 54%; }
.hero-shade { background: linear-gradient(90deg, rgba(13,35,37,.79), rgba(16,42,45,.30) 65%, rgba(15,36,38,.12)), linear-gradient(0deg, rgba(14,31,34,.45), transparent 32%); }
.masthead, .hero-copy, .hero-caption { position: relative; z-index: 1; }
.masthead { display: flex; align-items: center; justify-content: space-between; padding: 30px clamp(24px, 5vw, 80px); }
.brand { text-decoration: none; font-size: 25px; font-weight: 700; letter-spacing: -.08em; }
.brand span { color: #cbe1d7; margin-left: 2px; }
.languages { display: flex; gap: 3px; border: 1px solid rgba(255,255,255,.45); padding: 4px; border-radius: 100px; }
.languages button { border: 0; background: none; color: #fff; padding: 6px 10px; border-radius: 100px; cursor: pointer; font-size: 12px; letter-spacing: .08em; }
.languages button[aria-pressed="true"] { background: #f1eee4; color: #1b3638; }
.hero-copy { max-width: 740px; margin: auto 0 auto clamp(24px, 8.5vw, 136px); padding: 55px 24px 70px 0; }
.eyebrow, .section-kicker, .story-number { text-transform: uppercase; letter-spacing: .2em; font-size: 11px; font-weight: 700; }
h1, h2 { font-family: Georgia, serif; font-weight: 400; }
h1 { margin: 17px 0 22px; font-size: clamp(66px, 9vw, 146px); line-height: .99; letter-spacing: -.045em; }
.hero-lead { max-width: 480px; font-family: Georgia, serif; font-size: clamp(20px, 2.25vw, 29px); line-height: 1.42; }
.primary-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 55px; margin-top: 25px; padding: 18px 20px; min-width: 265px; background: #e9e5d6; color: #183234; font-size: 13px; font-weight: 700; text-decoration: none; }
.primary-link:hover, .primary-link:focus-visible { background: #fff; }
.hero-caption { align-self: flex-end; padding: 0 clamp(24px, 5vw, 80px) 23px; text-align: right; text-transform: uppercase; letter-spacing: .16em; font-size: 10px; }
.story { max-width: 1300px; margin: 0 auto; padding: clamp(72px, 10vw, 150px) clamp(24px, 8vw, 120px); display: grid; grid-template-columns: 1fr 2fr; gap: 40px; }
.story-number { padding-top: 7px; color: #6e8682; }
.story-copy { max-width: 700px; }
.section-kicker { color: #68827c; }
h2 { margin: 15px 0 25px; font-size: clamp(44px, 5vw, 76px); line-height: 1.1; }
.story-copy > p:not(.section-kicker) { max-width: 570px; font-family: Georgia, serif; font-size: clamp(20px, 2.1vw, 27px); line-height: 1.55; }
.facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; border-top: 1px solid #a7b8b0; border-bottom: 1px solid #a7b8b0; padding: 24px 0; margin: 47px 0 33px; }
.facts div { display: flex; flex-direction: column; gap: 7px; }
.facts strong { font-family: Georgia, serif; font-size: 23px; font-weight: 400; }
.facts span { color: #60736e; font-size: 11px; line-height: 1.4; }
.text-link { font-size: 13px; font-weight: 700; text-underline-offset: 5px; }
footer { display: flex; justify-content: space-between; padding: 30px clamp(24px, 5vw, 80px); background: #1e3635; color: #e9e5d6; font-size: 12px; }
footer a { text-decoration: none; }
@media (max-width: 700px) {
  .hero { min-height: 100svh; }
  .hero-image { object-position: 59% center; }
  .hero-shade { background: linear-gradient(0deg, rgba(13,35,37,.86), rgba(13,35,37,.36) 75%); }
  .masthead { padding-top: 20px; }
  .hero-copy { margin: auto 24px 55px; padding: 0; }
  h1 { font-size: clamp(64px, 14vw, 100px); }
  .hero-lead { font-size: 21px; }
  .hero-caption { display: none; }
  .story { display: block; padding: 70px 24px 90px; }
  .story-number { margin-bottom: 32px; }
  .facts { gap: 12px; }
  .facts strong { font-size: 18px; }
}
@media (prefers-reduced-motion: no-preference) {
  .primary-link, .languages button { transition: background-color .18s ease; }
}