* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:30px
}
body {
  margin:0;
  color:var(--ink);
  background:var(--surface);
  font:16px/1.65 var(--font-body)
}
a {
  color:inherit
}
a:focus-visible,button:focus-visible {
  outline:3px solid var(--gold);
  outline-offset:5px
}
.wrap {
  max-width:var(--max);
  padding:0 32px;
  margin:auto
}
.skip {
  position:absolute;
  left:-9999px;
  top:12px;
  z-index:20;
  padding:12px;
  background:var(--sand);
  color:var(--navy)
}
.skip:focus {
  left:12px
}
.nav {
  background:var(--navy);
  color:var(--sand)
}
.navinner {
  min-height:100px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  border-bottom:1px solid #ffffff20
}
.logo {
  display:inline-flex;
  flex-shrink:0
}
.logo img {
  width:166px;
  height:auto;
  display:block
}
.navlinks {
  display:flex;
  align-items:center;
  gap:28px
}
.navlinks a {
  text-decoration:none;
  font-size:.88rem
}
.navlinks>a:not(.btn):hover {
  color:#e6b466
}
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:50px;
  padding:14px 22px;
  border-radius:4px;
  font-weight:650;
  text-decoration:none;
  line-height:1.35;
  transition:background .2s
}
.btn.primary {
  background:var(--gold);
  color:var(--navy)
}
.btn.primary:hover {
  background:#e0a94e
}
.btn.ghost {
  border:1px solid #ffffff50;
  color:var(--sand)
}
.btn.ghost:hover {
  background:#ffffff10
}
.btn.white {
  background:var(--sand);
  color:var(--navy)
}
.menu-toggle {
  display:none
}
.hero {
  background:var(--navy);
  color:var(--sand);
  padding:85px 0 90px
}
.hero-grid {
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:70px;
  align-items:center
}
.eyebrow,.kicker {
  font-size:.69rem;
  letter-spacing:.18em;
  font-weight:750;
  text-transform:uppercase
}
.eyebrow {
  color:#e0b16a
}
.hero h1 {
  font-size:clamp(3.2rem,5.3vw,4.7rem);
  line-height:1.08;
  letter-spacing:-.055em;
  font-weight:600;
  margin:25px 0
}
.hero h1 em {
  font-family:Georgia,serif;
  font-weight:400;
  color:#dfaf65;
  letter-spacing:-.055em
}
.hero p {
  font-size:1.05rem;
  color:var(--text-on-dark);
  max-width:510px;
  line-height:1.8
}
.actions {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:30px
}
.discipline-strip {
  background:var(--sand);
  border-bottom:1px solid var(--line);
  font-size:.75rem
}
.discipline-strip>.wrap {
  min-height:68px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px
}
.discipline-strip span {
  font-weight:600
}
.discipline-strip b {
  margin:0 13px;
  color:#927141
}
.section {
  padding:92px 0
}
.intro {
  max-width:780px
}
.kicker {
  color:var(--gold-text)
}
h2 {
  font-size:clamp(2rem,3.5vw,2.85rem);
  line-height:1.18;
  letter-spacing:-.045em;
  font-weight:600;
  margin:16px 0 24px
}
h3 {
  font-size:1.15rem;
  line-height:1.4;
  font-weight:650;
  margin:0 0 13px
}
p {
  margin:0 0 18px
}
.muted {
  color:var(--muted)
}
.tint {
  background:var(--surface-soft)
}
.split {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px
}
.panel {
  background:var(--navy);
  color:var(--sand);
  padding:30px;
  border-radius:6px;
  margin-top:30px
}
.panel p {
  color:var(--text-on-dark);
  font-size:.9rem
}
.panel .btn {
  font-size:.85rem
}
.links {
  display:grid;
  align-content:start;
  border-top:1px solid var(--line);
  margin-top:8px
}
.resource {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  text-decoration:none;
  padding:23px 4px;
  border-bottom:1px solid var(--line)
}
.resource strong {
  display:block;
  font-size:.98rem;
  font-weight:600
}
.resource small {
  display:block;
  color:var(--muted);
  font-size:.8rem;
  margin-top:4px
}
.resource:hover {
  background:#f7efdd
}
.arrow {
  font-size:1.4rem;
  color:var(--gold-text)
}
.banner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:50px
}
.banner>div {
  max-width:720px
}
.banner .btn {
  flex-shrink:0
}
.banner h2 {
  margin-top:14px
}
.banner p {
  font-size:.92rem;
  margin-bottom:0
}
.footer {
  background:var(--navy);
  color:var(--sand);
  padding:50px 0 25px
}
.footgrid {
  display:flex;
  justify-content:space-between;
  gap:35px
}
.footgrid p {
  font-size:.8rem
}
.footgrid strong {
  font-size:.8rem
}
.social {
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  font-size:.8rem
}
.social a {
  text-underline-offset:4px
}
.tiny {
  font-size:.7rem;
  color:#b9b9c1;
  border-top:1px solid #ffffff20;
  padding-top:22px;
  margin-top:35px;
  max-width:1100px
}
@media(min-width:1400px) {
  .hero {
  padding:105px 0 110px
}
}
@media(max-width:1000px) {
  .navlinks {
  gap:16px
}
.navlinks a {
  font-size:.78rem
}
.hero-grid {
  gap:32px
}
.split {
  gap:35px
}
.banner {
  gap:25px
}
}
@media(max-width:900px) {
  .wrap {
  padding:0 22px
}
.navinner {
  min-height:80px;
  flex-wrap:wrap;
  gap:0
}
.logo img {
  width:145px
}
.menu-toggle {
  display:flex;
  align-items:center;
  gap:15px;
  background:transparent;
  border:1px solid #ffffff50;
  border-radius:4px;
  color:var(--sand);
  font:inherit;
  font-size:.85rem;
  min-height:44px;
  padding:8px 13px
}
.navlinks {
  display:none;
  width:100%;
  flex-direction:column;
  align-items:stretch;
  padding:20px 0;
  gap:0
}
.navlinks.is-open {
  display:flex
}
.navlinks a {
  font-size:1rem;
  padding:13px 0
}
.navlinks .btn {
  margin-top:12px
}
.hero {
  padding:58px 0 65px
}
.hero-grid,.split {
  grid-template-columns:1fr;
  gap:45px
}
.hero h1 {
  font-size:clamp(3rem,10.5vw,4.5rem)
}
.hero p {
  font-size:1rem
}
.discipline-strip>.wrap {
  align-items:flex-start;
  flex-direction:column;
  gap:7px;
  padding-top:18px;
  padding-bottom:18px
}
.discipline-strip b {
  margin:0 7px
}
.section {
  padding:65px 0
}
.banner,.footgrid {
  flex-direction:column;
  align-items:flex-start
}
.banner {
  gap:28px
}
.links {
  margin-top:0
}
.footer {
  padding-top:40px
}
}
@media(max-width:460px) {
  .hero .actions {
  flex-direction:column;
  align-items:stretch
}
.discipline-strip {
  font-size:.68rem
}
.banner .btn {
  width:100%
}
.panel {
  padding:25px
}
.hero h1 {
  font-size:3.1rem
}
}
@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto
}
* {
  transition:none!important
}
}
.eco-intro {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:75px;
  align-items:end;
  margin-bottom:40px
}
.eco-intro h2 {
  margin-bottom:0;
  font-size:clamp(2.3rem,4vw,3.5rem)
}
.eco-intro p {
  font-size:.95rem;
  margin-bottom:0;
  max-width:470px
}
.ecosystem-grid {
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  border-top:1px solid #d3cbbd;
  border-left:1px solid #d3cbbd
}
.eco-card {
  grid-column:span 3;
  border-right:1px solid #d3cbbd;
  border-bottom:1px solid #d3cbbd;
  padding:23px;
  display:flex;
  flex-direction:column;
  min-width:0
}
.eco-card:nth-child(n+5) {
  grid-column:span 4
}
.eco-number {
  display:flex;
  align-items:center;
  justify-content:space-between;
  font:9px/1.4 Consolas,monospace;
  color:#686359;
  margin-bottom:42px
}
.eco-number span {
  font-size:11px;
  color:var(--ink)
}
.eco-card h3 {
  font-size:1.15rem;
  letter-spacing:-.04em;
  margin-bottom:4px
}
.eco-verb {
  font-size:.75rem;
  margin-bottom:9px
}
.eco-card p {
  font-size:.8rem;
  color:var(--muted);
  line-height:1.65;
  margin-bottom:16px
}
.eco-card a,.eco-status {
  font-size:.69rem;
  margin-top:auto;
  line-height:1.6
}
.eco-card a {
  text-underline-offset:4px;
  font-weight:650
}
.eco-status {
  color:#6c655a
}
.eco-dark {
  background:var(--navy);
  color:var(--sand)
}
.eco-dark p {
  color:var(--text-on-dark)
}
.eco-dark .eco-number,.eco-dark .eco-number span {
  color:#e0b16a
}
.eco-dark .eco-status {
  color:#ddbc89
}
.eco-card.eco-journey {
  grid-column:1/-1
}
.eco-journey h3 {
  font-size:1.5rem
}
.eco-journey p {
  margin-bottom:0
}
.ecosystem-note {
  font-size:.76rem;
  color:var(--muted);
  margin:20px 0 0;
  max-width:900px
}
@media(max-width:900px) {
  .eco-intro {
  gap:35px
}
.eco-card {
  grid-column:span 6
}
.eco-card:nth-child(n+5) {
  grid-column:span 6
}
.eco-card:nth-child(7) {
  grid-column:1/-1
}
}
@media(max-width:600px) {
  .eco-intro {
  grid-template-columns:1fr;
  gap:22px
}
.eco-intro h2 {
  font-size:2.35rem
}
.eco-card,.eco-card:nth-child(n+5) {
  grid-column:1/-1
}
.eco-number {
  margin-bottom:28px
}
.eco-card {
  padding:25px
}
.eco-card p {
  font-size:.88rem
}
.eco-status,.eco-card a {
  font-size:.75rem
}
}
.hero-grid {
  grid-template-columns:1.05fr 1fr;
  gap:55px
}
.hero h1 {
  font-size:clamp(3rem,4.6vw,4.1rem)
}
.hero h1 em {
  font-family:inherit;
  font-style:normal;
  font-weight:600;
  letter-spacing:inherit
}
.hero p.hero-secondary {
  font-size:.9rem;
  color:#b9b9c1
}
.hero-signoff {
  border-top:1px solid #ffffff20;
  padding-top:22px;
  margin-top:30px;
  display:flex;
  flex-direction:column;
  gap:5px;
  font-size:.75rem
}
.hero-signoff span {
  color:#b9b9c1;
  font-size:.7rem
}
.scene-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px
}
.scene-label {
  font:9px/1.5 Consolas,monospace;
  letter-spacing:.1em;
  color:#e1c28e
}
.scene-dot {
  height:7px;
  width:7px;
  background:var(--gold);
  border-radius:50%
}
@media(max-width:1000px) {
  .hero-grid {
  gap:30px
}
.hero h1 {
  font-size:3.1rem
}
}
@media(max-width:900px) {
  .hero-grid {
  grid-template-columns:1fr;
  gap:40px
}
.hero h1 {
  font-size:clamp(2.7rem,9.5vw,4rem)
}
}
.navlinks a[aria-current="page"] { color: #dfaf65; text-decoration: underline; text-underline-offset: 7px; }
/* Keep the expanded multipage navigation comfortable on smaller laptops. */
@media(max-width:1100px) {
  .nav .navinner { min-height: 80px; flex-wrap: wrap; gap: 0; }
  .nav .menu-toggle { display: flex; align-items: center; gap: 15px; background: transparent; border: 1px solid #ffffff50; border-radius: 4px; color: var(--sand); font: inherit; font-size: .85rem; min-height: 44px; padding: 8px 13px; }
  .nav .navlinks { display: none; width: 100%; flex-direction: column; align-items: stretch; padding: 20px 0; gap: 0; }
  .nav .navlinks.is-open { display: flex; }
  .nav .navlinks a { font-size: .9rem; padding: 13px 0; min-height: 48px; }
  .nav .navlinks .btn { margin-top: 12px; }
  html:not(.js) .nav .menu-toggle { display: none; }
  html:not(.js) .nav .navlinks { display: flex; }
}