:root {
  --black: #0c0c0d;
  --forest: #0c0c0d;
  --cream: #ffffff;
  --sand: #f4c62d;
  --orange: #cf2028;
  --yellow: #f4c62d;
  --blue: #75c4dc;
  --white: #ffffff;
  --pad: clamp(24px, 5vw, 80px);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; background: var(--cream); color: var(--black); font-family: Manrope, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button { font: inherit; }
section[id] { scroll-margin-top: 84px; }
em { font-weight: 500; }

.skip-link { position: fixed; z-index: 100; top: 10px; left: 10px; padding: 12px 16px; transform: translateY(-160%); background: var(--yellow); color: var(--black); font-weight: 700; }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 3px solid var(--yellow); outline-offset: 4px; }

.site-header { position: fixed; z-index: 30; top: 0; left: 0; width: 100%; height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 0 var(--pad); color: var(--white); background: rgba(12, 12, 13, .97); border-bottom: 1px solid rgba(255, 255, 255, .2); box-shadow: 0 8px 30px rgba(0, 0, 0, .12); }
.brand { position: relative; z-index: 3; flex: none; display: flex; align-items: center; justify-content: center; min-height: 62px; padding: 11px 20px 11px 17px; background: var(--white); color: var(--black); box-shadow: 0 5px 18px rgba(0, 0, 0, .18); }
.brand-wordmark { display: inline-flex; align-items: flex-start; font: 800 31px/1 Manrope, Arial, sans-serif; letter-spacing: -.075em; white-space: nowrap; }
.brand-wordmark sup { margin: -2px 0 0 3px; font: 700 10px/1 Manrope, Arial, sans-serif; letter-spacing: 0; }
.site-nav { display: flex; align-items: center; gap: clamp(16px, 2.4vw, 42px); }
.site-nav a { padding: 14px 0; font: 500 12px/1.2 "DM Mono", monospace; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; opacity: .82; transition: opacity .2s, color .2s; }
.site-nav a:hover, .site-nav a:focus-visible { opacity: 1; color: var(--yellow); }
.menu-toggle { display: none; position: relative; z-index: 4; width: 44px; height: 44px; flex: none; padding: 0; border: 0; background: transparent; color: inherit; cursor: pointer; }
.menu-toggle span { position: absolute; right: 4px; width: 29px; height: 2px; background: currentColor; transition: transform .25s, top .25s; }
.menu-toggle span:first-child { top: 16px; }
.menu-toggle span:last-child { top: 26px; }
.menu-toggle[aria-expanded="true"] span:first-child { top: 21px; transform: rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { top: 21px; transform: rotate(-45deg); }

.eyebrow, .section-number { margin: 0; font: 500 12px/1.5 "DM Mono", monospace; letter-spacing: .1em; text-transform: uppercase; }
.hero { min-height: 710px; height: 100svh; max-height: 1050px; display: grid; grid-template-columns: 63% 37%; overflow: hidden; background: var(--forest); color: var(--white); }
.hero-copy { min-width: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 130px var(--pad) clamp(50px, 7vh, 88px); }
.hero-eyebrow { margin-bottom: clamp(32px, 5vh, 60px); color: var(--yellow); }
.hero-eyebrow span { padding: 0 6px; color: rgba(255, 255, 255, .55); }
.hero h1 { max-width: 1020px; margin: 0; font: 500 clamp(57px, 6.1vw, 105px)/.92 Newsreader, Georgia, serif; letter-spacing: -.057em; text-wrap: balance; }
.hero h1 em { color: var(--yellow); }
.hero-lead { max-width: 620px; margin: 32px 0 0; font-size: clamp(18px, 1.55vw, 23px); font-weight: 600; line-height: 1.45; }
.hero-meta { max-width: 730px; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: clamp(35px, 6vh, 65px); padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .28); }
.hero-meta p { max-width: 300px; margin: 0; color: rgba(255, 255, 255, .75); font: 500 12px/1.6 "DM Mono", monospace; text-transform: uppercase; letter-spacing: .06em; }
.hero-visual { position: relative; min-width: 0; overflow: hidden; border-left: 1px solid rgba(255, 255, 255, .18); }
.hero-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 48%, rgba(0, 0, 0, .5)); pointer-events: none; }
.orbit { position: absolute; z-index: 1; width: 110%; aspect-ratio: 1; border: 1px solid rgba(255, 249, 224, .4); border-radius: 48%; transform: rotate(-24deg); pointer-events: none; }
.orbit-one { top: -10%; left: -44%; }
.orbit-two { width: 80%; right: -35%; bottom: -24%; transform: rotate(30deg); }
.image-caption { position: absolute; z-index: 2; right: 26px; bottom: 24px; left: 26px; margin: 0; color: var(--white); font: 500 11px/1.5 "DM Mono", monospace; letter-spacing: .09em; text-transform: uppercase; }
.image-caption span { color: var(--yellow); }

.acknowledgement { display: grid; grid-template-columns: .55fr 1.4fr 1.35fr; align-items: start; gap: clamp(26px, 4vw, 70px); padding: clamp(55px, 7vw, 100px) var(--pad); background: var(--cream); color: var(--forest); }
.acknowledgement .eyebrow { margin-top: 9px; color: var(--orange); }
.acknowledgement h2 { max-width: 550px; margin: 0; font: 500 clamp(27px, 2.6vw, 39px)/1.08 Newsreader, Georgia, serif; letter-spacing: -.035em; }
.acknowledgement > p:last-child { max-width: 550px; margin: 0; font-size: 16px; line-height: 1.75; }
.principle-band { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 20px; overflow: hidden; padding: 20px var(--pad); background: var(--yellow); color: var(--forest); font: 700 clamp(12px, 1.2vw, 17px)/1.2 Manrope, Arial, sans-serif; letter-spacing: .06em; white-space: nowrap; }
.principle-band b { color: var(--orange); font-weight: 400; }

.story-section { position: relative; }
.theme-cream { background: var(--cream); color: var(--black); }
.theme-forest { background: var(--forest); color: var(--white); }
.theme-sand { background: var(--sand); color: var(--black); }
.theme-blue { background: var(--blue); color: var(--black); }
.section-head { min-height: 325px; display: grid; grid-template-columns: minmax(170px, 22%) minmax(0, 1fr); align-items: end; gap: clamp(32px, 5vw, 88px); padding: clamp(75px, 9vw, 135px) var(--pad) 52px; border-bottom: 1px solid currentColor; }
.section-number { align-self: start; margin-top: 8px; }
.theme-forest .section-number { color: var(--yellow); }
.section-head h2 { max-width: 1100px; margin: 0; font: 500 clamp(51px, 5.5vw, 89px)/.94 Newsreader, Georgia, serif; letter-spacing: -.055em; text-wrap: balance; }
.section-head h2 em { color: var(--orange); }
.theme-forest .section-head h2 em { color: var(--yellow); }
.theme-blue .section-head h2 em { color: var(--forest); }
.section-body { padding: clamp(55px, 7vw, 108px) var(--pad) clamp(80px, 10vw, 150px); }
.copy-block { padding-top: 18px; border-top: 1px solid currentColor; }
.copy-block p, .split-intro > p:last-child, .community-outro { max-width: 710px; margin: 0 0 21px; font-size: clamp(16px, 1.22vw, 19px); line-height: 1.75; }
.copy-block p:last-child { margin-bottom: 0; }
.copy-block strong { font-weight: 800; }
.intro-text { max-width: 850px; margin: 0; font: 500 clamp(29px, 3.1vw, 48px)/1.12 Newsreader, Georgia, serif; letter-spacing: -.03em; }

.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 65px clamp(40px, 8vw, 145px); }
.pull-quote { grid-column: 1 / -1; max-width: 1120px; margin: 50px 0 0; padding-left: clamp(25px, 4vw, 65px); border-left: 5px solid var(--orange); color: var(--forest); font: 500 clamp(34px, 4.1vw, 65px)/1.03 Newsreader, Georgia, serif; letter-spacing: -.04em; }
.purpose-grid { display: grid; grid-template-columns: 1.3fr .7fr; align-items: end; gap: clamp(35px, 7vw, 120px); }
.purpose-grid .copy-block { border-color: rgba(255, 255, 255, .6); }
.purpose-grid .copy-block p { color: rgba(255, 255, 255, .84); }
.section-media { position: relative; height: clamp(390px, 53vw, 750px); margin: 0; overflow: hidden; background: var(--black); }
.section-media img { width: 100%; height: 100%; object-fit: cover; }
.section-media figcaption { position: absolute; right: var(--pad); bottom: 26px; left: var(--pad); max-width: 420px; padding: 13px 16px; background: rgba(12, 12, 13, .86); color: var(--white); font: 500 12px/1.5 "DM Mono", monospace; letter-spacing: .03em; }
.media-inset { width: calc(100% - var(--pad) * 2); height: clamp(360px, 45vw, 620px); margin: 0 var(--pad) var(--pad); }

.split-intro { display: grid; grid-template-columns: 1.2fr .8fr; align-items: end; gap: clamp(35px, 8vw, 135px); margin-bottom: clamp(55px, 7vw, 105px); }
.split-intro > p:last-child { padding-top: 18px; border-top: 1px solid rgba(12, 12, 13, .6); }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--forest); border-left: 1px solid var(--forest); }
.feature-grid li { min-height: 190px; display: flex; flex-direction: column; justify-content: space-between; gap: 25px; padding: clamp(22px, 2.5vw, 38px); border-right: 1px solid var(--forest); border-bottom: 1px solid var(--forest); font-size: clamp(17px, 1.4vw, 21px); font-weight: 600; line-height: 1.4; }
.feature-grid span { color: var(--orange); font: 500 12px/1 "DM Mono", monospace; letter-spacing: .06em; }

.community-body { display: grid; grid-template-columns: .95fr 1.05fr; gap: 70px clamp(45px, 8vw, 135px); }
.community-body .intro-text { max-width: 690px; }
.community-list-wrap .eyebrow { padding: 0 0 18px; border-bottom: 1px solid currentColor; }
.community-list { margin: 0; padding: 0; list-style: none; }
.community-list li { padding: 15px 0; border-bottom: 1px solid rgba(12, 12, 13, .35); font-size: clamp(17px, 1.3vw, 20px); font-weight: 600; line-height: 1.4; }
.community-outro { grid-column: 1 / -1; max-width: 970px; margin: 0; padding-top: 20px; border-top: 1px solid currentColor; font-size: clamp(19px, 1.7vw, 25px); font-weight: 600; }

.legacy-body { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(50px, 9vw, 140px); }
.legacy-body .intro-text { max-width: 520px; }
.timeline { border-top: 1px solid var(--forest); }
.timeline > div { display: grid; grid-template-columns: 100px 1fr 1.5fr; gap: 18px; padding: 24px 0 28px; border-bottom: 1px solid var(--forest); }
.timeline span { padding-top: 6px; color: var(--orange); font: 500 12px/1.4 "DM Mono", monospace; text-transform: uppercase; }
.timeline h3 { margin: 0; color: var(--forest); font: 500 clamp(25px, 2.2vw, 36px)/1.06 Newsreader, Georgia, serif; letter-spacing: -.035em; }
.timeline p { max-width: 410px; margin: 0; font-size: 16px; line-height: 1.65; }

.vision-section { min-height: 680px; background: var(--orange); color: var(--white); }
.vision-copy { min-height: 680px; display: grid; grid-template-columns: 1.3fr .7fr; grid-template-rows: auto 1fr; align-items: end; gap: clamp(60px, 8vw, 120px); padding: clamp(70px, 8vw, 130px) var(--pad); }
.vision-copy .section-number { color: var(--white); }
.vision-copy .section-number { grid-column: 1 / -1; align-self: start; }
.vision-copy h2 { max-width: 1050px; margin: 0; font: 500 clamp(55px, 6vw, 96px)/.94 Newsreader, Georgia, serif; letter-spacing: -.055em; }
.vision-copy h2 em { color: var(--forest); }
.vision-copy > p:last-child { max-width: 640px; margin: 0; padding-top: 21px; border-top: 1px solid rgba(255, 255, 255, .65); font-size: clamp(17px, 1.3vw, 20px); line-height: 1.68; }

.values-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--forest); border-left: 1px solid var(--forest); }
.values-grid article { min-height: 250px; display: flex; flex-direction: column; padding: clamp(24px, 2.7vw, 42px); border-right: 1px solid var(--forest); border-bottom: 1px solid var(--forest); }
.values-grid span { margin-bottom: auto; color: var(--orange); font: 500 12px/1 "DM Mono", monospace; }
.values-grid h3 { margin: 35px 0 12px; color: var(--forest); font: 500 clamp(30px, 2.8vw, 43px)/1 Newsreader, Georgia, serif; letter-spacing: -.04em; }
.values-grid p { max-width: 330px; margin: 0; font-size: 16px; line-height: 1.6; }

.closing-section { min-height: 800px; display: flex; flex-direction: column; align-items: flex-start; padding: clamp(85px, 9vw, 145px) var(--pad) 75px; background: var(--black); color: var(--white); }
.closing-section .section-number { color: var(--yellow); }
.closing-section h2 { max-width: 1280px; margin: clamp(60px, 8vw, 125px) 0 clamp(60px, 8vw, 110px); font: 500 clamp(57px, 6.4vw, 105px)/.91 Newsreader, Georgia, serif; letter-spacing: -.055em; text-wrap: balance; }
.closing-section h2 em { display: block; margin-top: .08em; color: var(--yellow); }
.closing-bottom { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 8vw, 140px); }
.closing-bottom p { max-width: 600px; margin: 0; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .48); font-size: clamp(16px, 1.2vw, 19px); line-height: 1.72; }
.brand-note { max-width: 760px; margin: 70px 0 0; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .48); color: var(--yellow); font-size: 16px; line-height: 1.6; }
.site-link { display: inline-block; margin-top: 70px; padding: 15px 20px; background: var(--yellow); color: var(--forest); font: 700 13px/1.2 "DM Mono", monospace; letter-spacing: .03em; transition: background .2s, transform .2s; }
.site-link:hover { background: var(--white); transform: translateY(-2px); }
.site-footer { min-height: 85px; display: flex; justify-content: space-between; align-items: center; gap: 30px; padding: 23px var(--pad); border-top: 1px solid rgba(255, 255, 255, .18); background: var(--black); color: var(--white); }
.site-footer p { margin: 0; font: 500 12px/1.6 "DM Mono", monospace; letter-spacing: .02em; }
.site-footer strong { margin-right: 14px; color: var(--yellow); }
.site-footer span { color: rgba(255, 255, 255, .7); }

@media (max-width: 1050px) {
  .site-header { height: 70px; }
  section[id] { scroll-margin-top: 70px; }
  .brand { min-height: 54px; padding: 9px 15px 9px 12px; }
  .brand-wordmark { font-size: 27px; }
  .menu-toggle { display: block; }
  .site-nav { position: fixed; top: 70px; right: 0; bottom: 0; left: 0; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 10px; overflow-y: auto; padding: 35px var(--pad) 70px; background: var(--forest); visibility: hidden; transform: translateY(-110%); transition: transform .3s, visibility .3s; }
  .site-nav.open { visibility: visible; transform: translateY(0); }
  .site-nav a { width: 100%; padding: 12px 0; font: 500 clamp(29px, 4vw, 42px)/1 Newsreader, Georgia, serif; letter-spacing: -.03em; text-transform: none; }
  .hero { grid-template-columns: 60% 40%; }
  .hero h1 { font-size: clamp(58px, 6.6vw, 80px); }
  .acknowledgement { grid-template-columns: 1fr 1fr; }
  .acknowledgement .eyebrow { grid-column: 1 / -1; }
  .legacy-body { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .hero { height: auto; max-height: none; grid-template-columns: 1fr; grid-template-rows: auto 370px; }
  .hero-copy { padding: 130px var(--pad) 55px; }
  .hero-eyebrow { margin-bottom: 45px; }
  .hero h1 { font-size: clamp(55px, 11.2vw, 83px); }
  .hero-visual { border-left: 0; border-top: 1px solid rgba(255, 255, 255, .18); }
  .hero-visual img { object-position: center 55%; }
  .acknowledgement { grid-template-columns: 1fr; gap: 22px; }
  .acknowledgement .eyebrow { grid-column: auto; }
  .principle-band { justify-content: flex-start; min-height: 70px; }
  .section-head { min-height: 280px; grid-template-columns: 1fr; gap: 28px; padding: 70px var(--pad) 45px; }
  .section-head h2 { font-size: clamp(49px, 9vw, 70px); }
  .section-body { padding: 55px var(--pad) 90px; }
  .about-grid, .purpose-grid, .split-intro, .community-body, .closing-bottom { grid-template-columns: 1fr; gap: 38px; }
  .pull-quote { margin-top: 22px; }
  .feature-grid, .values-grid { grid-template-columns: 1fr 1fr; }
  .community-outro { grid-column: auto; }
  .section-media { height: 430px; }
  .media-inset { height: 400px; }
  .vision-copy { min-height: 650px; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 55px; }
  .closing-section { min-height: 0; }
}

@media (max-width: 520px) {
  .hero { grid-template-rows: auto 300px; }
  .hero-copy { padding-top: 125px; }
  .hero h1 { font-size: clamp(51px, 12.2vw, 65px); }
  .hero-lead { margin-top: 26px; }
  .hero-meta { grid-template-columns: 1fr; gap: 12px; margin-top: 36px; }
  .section-head { min-height: 250px; }
  .section-head h2 { font-size: clamp(46px, 11vw, 58px); }
  .intro-text { font-size: 34px; }
  .pull-quote { font-size: 40px; }
  .feature-grid, .values-grid { grid-template-columns: 1fr; }
  .feature-grid li { min-height: 145px; }
  .timeline > div { grid-template-columns: 1fr; gap: 7px; }
  .timeline h3 { margin: 4px 0; }
  .section-media { height: 300px; }
  .media-inset { height: 290px; }
  .vision-copy { min-height: 590px; padding-top: 70px; padding-bottom: 70px; }
  .vision-copy h2 { font-size: clamp(51px, 11.5vw, 67px); }
  .closing-section h2 { font-size: clamp(53px, 11.4vw, 66px); }
  .site-footer { align-items: flex-start; flex-direction: column; gap: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .site-nav, .menu-toggle span, .site-link { transition: none; }
}