:root {
  --bg:#080808;
  --surface:#111;
  --surface-alt:#181818;
  --text:#fff;
  --muted:#aaa;
  --border:rgba(255,255,255,.15);
  --accent:#b7ff00;
  --max-width:1240px;
  color-scheme:dark;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-synthesis:none;
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:100px;
}

body {
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-size:16px;
  line-height:1.7;
}

a {
  color:inherit;
  text-decoration:none;
}

button {
  font:inherit;
}

img {
  display:block;
  max-width:100%;
  height:auto;
}

svg {
  display:block;
}

h1,h2,h3,p,figure {
  margin:0;
}

p+p {
  margin-top:1.15rem;
}

h2 {
  font-size:clamp(2.2rem,4.1vw,3.6rem);
  line-height:1.09;
  letter-spacing:-.045em;
  font-weight:650;
  margin-bottom:1.5rem;
}

h3 {
  line-height:1.35;
}

p {
  color:var(--muted);
}

a,button {
  -webkit-tap-highlight-color:transparent;
}

a:focus-visible,button:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:6px;
}

a:hover {
  color:var(--accent);
}

[hidden] {
  display:none!important;
}

.container {
  width:min(var(--max-width),calc(100% - 40px));
  margin-inline:auto;
}

.accent {
  color:var(--accent);
}

.muted {
  color:var(--muted);
}

.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

.skip-link {
  position:fixed;
  left:20px;
  top:-100px;
  z-index:100;
  background:var(--accent);
  color:#080808;
  padding:12px 20px;
}

.skip-link:focus {
  top:10px;
}

.site-header {
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(8,8,8,.96);
  border-bottom:1px solid var(--border);
}

.header-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:78px;
  gap:24px;
}

.brand {
  display:inline-flex;
  align-items:center;
  line-height:1.1;
  font-size:1.25rem;
  font-weight:850;
  letter-spacing:-.05em;
  flex-shrink:0;
}

.brand [data-brand]>span {
  font-weight:500;
  letter-spacing:-.04em;
}

.brand img {
  width:auto;
  max-width:170px;
  max-height:55px;
  object-fit:contain;
}

#navigation {
  display:flex;
  align-items:center;
  gap:30px;
  font-size:.9rem;
}

#navigation .nav-cta {
  border:1px solid #545454;
  padding:9px 18px;
  font-size:.75rem;
  font-weight:650;
  letter-spacing:.06em;
  min-height:44px;
  display:flex;
  gap:24px;
  align-items:center;
}

.menu-toggle {
  background:none;
  color:#fff;
  border:1px solid #555;
  min-height:44px;
  padding:8px 12px;
  align-items:center;
  gap:12px;
}

.hamburger {
  width:18px;
  height:10px;
  border-top:1px solid;
  border-bottom:1px solid;
}

.hero {
  position:relative;
  isolation:isolate;
  min-height: min(900px,87svh);
  display:flex;
  align-items:center;
  overflow:hidden;
}

.hero-image,.hero-shade {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:-2;
  object-fit:cover;
  object-position:60% 50%;
}

.hero-shade {
  z-index:-1;
  background:linear-gradient(90deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.72) 38%,rgba(0,0,0,.22) 100%),linear-gradient(0deg,#080808 0%,transparent 30%);
}

.hero-content {
  padding-block:65px 110px;
}

.eyebrow,.section-kicker,.hero-bottom,.hero-osd,.discipline-strip,.photo-frame figcaption,.time {
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  letter-spacing:.09em;
  font-size:.75rem;
}

.eyebrow {
  display:flex;
  align-items:center;
  gap:9px;
  color:#d3d3d3;
  flex-wrap:wrap;
}

.status-dot {
  width:6px;
  height:6px;
  flex-shrink:0;
  background:var(--accent);
  display:inline-block;
}

.hero h1 {
  font-size:clamp(4rem,8.8vw,8rem);
  letter-spacing:-.065em;
  line-height:.88;
  font-weight:850;
  margin:29px 0 25px;
}

.title-dot {
  color:var(--accent);
}

.hero-subtitle {
  font-size:clamp(1.25rem,2vw,1.65rem);
  line-height:1.4;
  color:#fff;
  font-weight:500;
  letter-spacing:-.015em;
}

.hero-lead {
  max-width:465px;
  font-size:.95rem;
  color:#ccc;
}

.actions {
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  margin-top:30px;
}

.button {
  min-height:50px;
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  font-size:.75rem;
  font-weight:750;
  letter-spacing:.035em;
  padding:15px 22px;
  transition:background .15s,color .15s;
}

.primary {
  color:#080808;
  background:var(--accent);
}

.primary:hover {
  background:#d1ff60;
  color:#080808;
}

.secondary {
  border:1px solid #777;
  background:rgba(0,0,0,.2);
}

.hero-bottom {
  position:absolute;
  bottom:24px;
  left:0;
  right:0;
  display:flex;
  justify-content:space-between;
  color:#bbb;
}

.hero-bottom a {
  display:flex;
  gap:25px;
}

.hero-osd {
  position:absolute;
  inset:40px 4% 90px auto;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:space-between;
  color:#ddd;
  font-size:.7rem;
  pointer-events:none;
}

.osd-cross {
  font-size:4rem;
  font-weight:200;
  opacity:.4;
  position:absolute;
  top:45%;
  right:17vw;
}

.hero-original-logo {
  margin-top:22px;
}

.hero-original-logo img {
  width:auto;
  max-width:220px;
  max-height:90px;
  object-fit:contain;
}

.hero:has(.hero-original-logo:not([hidden])) h1 {
  font-size:clamp(3.5rem,7vw,6rem);
  margin-top:20px;
}

.discipline-strip {
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  color:#d0d0d0;
}

.discipline-strip .container {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  min-height:68px;
}

.discipline-strip i {
  color:#626262;
  font-style:normal;
}

.section {
  padding-block:92px;
}

.section-kicker {
  display:flex;
  justify-content:space-between;
  gap:20px;
  color:#999;
  margin-bottom:42px;
  font-size:.75rem;
}

.section-kicker>span:first-child {
  color:#dedede;
}

.split {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:start;
}

.intro {
  font-size:1.4rem;
  line-height:1.45;
  font-weight:500;
  color:#e5e5e5;
  margin-bottom:22px;
  letter-spacing:-.02em;
}

.about-split .intro {
  font-size:1.7rem;
}

.text-link {
  display:inline-flex;
  align-items:center;
  gap:24px;
  font-size:.75rem;
  font-weight:650;
  letter-spacing:.06em;
  min-height:44px;
  margin-top:24px;
}

.photo-frame {
  align-self:stretch;
  display:flex;
  flex-direction:column;
  min-width:0;
  margin-top:7px;
}

.photo-frame img {
  width:100%;
  height:100%;
  min-height:350px;
  max-height:530px;
  object-fit:cover;
  filter:saturate(.55);
  background:#181818;
}

.photo-frame figcaption {
  display:flex;
  justify-content:space-between;
  gap:15px;
  color:#aaa;
  padding-top:15px;
  font-size:.65rem;
}

.surface {
  background:var(--surface);
}

.explanation {
  margin-bottom:50px;
}

.explanation h2 {
  font-size:clamp(2.4rem,4.6vw,4.2rem);
}

.cards {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--border);
  border-left:1px solid var(--border);
}

.card {
  padding:25px 24px 30px;
  border-right:1px solid var(--border);
  border-bottom:1px solid var(--border);
  transition:background .2s;
}

.card:hover {
  background:#181818;
}

.card-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:30px;
}

.card-top>span {
  font-family:monospace;
  color:#999;
  font-size:.75rem;
}

.card svg {
  width:38px;
  height:38px;
  stroke:#ccc;
  stroke-width:1.3;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.card h3 {
  font-size:1rem;
  letter-spacing:.04em;
  margin-bottom:13px;
}

.card p {
  font-size:.9rem;
  line-height:1.65;
}

.association-details {
  border:1px solid var(--border);
  padding:32px;
}

.association-details h3 {
  font-size:.95rem;
  letter-spacing:.02em;
  margin-bottom:13px;
}

.association-details p {
  font-size:.9rem;
}

.association-details dl {
  margin:25px 0 0;
}

.association-details dl div {
  display:flex;
  justify-content:space-between;
  gap:18px;
  padding:12px 0;
  border-top:1px solid var(--border);
  font-size:.9rem;
}

.association-details dt {
  color:#999;
}

.association-details dd {
  margin:0;
  text-align:right;
}

.history {
  margin-top:80px;
}

.history h3 {
  font-size:1.25rem;
  margin-bottom:32px;
}

.timeline {
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns:repeat(4,1fr);
}

.timeline li {
  position:relative;
  border-top:1px solid #444;
  padding:27px 24px 0 0;
}

.timeline li:before {
  content:"";
  width:7px;
  height:7px;
  background:#888;
  position:absolute;
  top:-4px;
  left:0;
}

.timeline li:last-child:before {
  background:var(--accent);
}

.time {
  display:block;
  margin-bottom:16px;
  font-size:.85rem;
}

.timeline p {
  font-size:.9rem;
  line-height:1.65;
}

.community {
  background:#151515;
  border-block:1px solid var(--border);
  position:relative;
  overflow:hidden;
}

.community-inner {
  position:relative;
  padding-block:74px 80px;
}

.community h2 {
  font-size:clamp(2.7rem,6.6vw,5.7rem);
  margin-block:30px 25px;
  max-width:800px;
}

.community p {
  max-width:620px;
}

.community .intro {
  font-size:1.2rem;
}

.community .button {
  margin-top:28px;
}

.community-marker {
  font-family:monospace;
  position:absolute;
  right:20px;
  top:20%;
  font-size:12rem;
  font-weight:200;
  color:#353535;
  line-height:1;
  pointer-events:none;
}

.contact-details h3 {
  font-size:1.6rem;
  letter-spacing:-.03em;
}

.contact-details>p {
  margin-top:4px;
}

.contact-links a {
  border-bottom:1px solid var(--border);
  min-height:60px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding-block:12px;
}

.contact-links a span {
  font-size:.9rem;
  color:#aaa;
}

.contact-links a strong {
  font-weight:500;
  overflow-wrap:anywhere;
}

.contact-pending {
  border-top:1px solid var(--border);
  padding-top:20px;
  font-size:.9rem;
  margin-top:25px!important;
}

.lmt {
  border-top:1px solid var(--border);
  padding-block:33px 45px;
  display:flex;
  gap:60px;
  align-items:center;
  justify-content:space-between;
}

.lmt>div {
  max-width:760px;
}

.lmt h2 {
  font-size:1.1rem;
  letter-spacing:.03em;
  margin-bottom:10px;
}

.lmt p {
  font-size:.85rem;
}

.lmt p+p {
  margin-top:5px;
}

.lmt .text-link {
  flex-shrink:0;
  margin:0;
}

.site-footer {
  border-top:1px solid var(--border);
  padding-block:40px 22px;
  background:#0c0c0c;
}

.footer-top {
  display:flex;
  justify-content:space-between;
  gap:30px;
  margin-bottom:42px;
}

.footer-top p {
  font-size:.85rem;
  margin-top:16px;
}

.footer-top nav {
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  gap:25px;
  font-size:.85rem;
}

.footer-top nav a {
  min-height:44px;
}

.footer-bottom {
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px 25px;
  border-top:1px solid var(--border);
  padding-top:20px;
  font-size:.75rem;
  color:#999;
}

.footer-separator {
  margin-inline:14px;
}

@media(min-width:1440px) {
  .hero-content {
    padding-top:70px;
  }
  .hero-osd {
    right:max(4%,calc((100vw - 1240px)/2));
  }
}

@media(max-width:1023px) {
  .split {
    gap:40px;
  }
  .cards {
    grid-template-columns:repeat(2,1fr);
  }
  #navigation {
    gap:18px;
  }
  .section {
    padding-block:70px;
  }
  .hero-osd {
    display:none;
  }
  .hero h1 {
    font-size:6rem;
  }
  .hero {
    min-height:790px;
  }
  .lmt {
    gap:30px;
  }
  .community-marker {
    font-size:8rem;
    top:50px;
  }
}

@media(max-width:767px) {
  html {
    scroll-padding-top:85px;
  }
  .container {
    width:calc(100% - 40px);
  }
  .header-inner {
    min-height:70px;
    flex-wrap:wrap;
    gap:0;
  }
  .brand {
    font-size:1.15rem;
  }
  .brand img {
    max-width:145px;
    max-height:48px;
  }
  #navigation {
    flex-basis:100%;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding-block:10px 20px;
  }
  #navigation>a {
    padding:12px 0;
    min-height:44px;
  }
  #navigation .nav-cta {
    margin-top:10px;
    padding:12px 16px;
    justify-content:space-between;
  }
  .js-ready .menu-toggle {
    display:flex;
  }
  .js-ready #navigation:not(.is-open) {
    display:none;
  }
  .hero {
    min-height:760px;
  }
  .hero-content {
    padding-block:50px 100px;
  }
  .hero h1 {
    font-size:clamp(3.5rem,14vw,6rem);
    margin-block:28px 24px;
  }
  .hero-shade {
    background:linear-gradient(90deg,rgba(0,0,0,.87),rgba(0,0,0,.45)),linear-gradient(0deg,#080808,transparent 60%);
  }
  .hero-image {
    object-position:60% center;
  }
  .eyebrow {
    font-size:.65rem;
    letter-spacing:.035em;
    gap:7px;
  }
  .hero-subtitle {
    font-size:1.3rem;
  }
  .hero-lead {
    font-size:.9rem;
    max-width:440px;
  }
  .actions {
    gap:12px;
    margin-top:26px;
  }
  .button {
    font-size:.7rem;
    padding:15px 18px;
    gap:17px;
  }
  .hero-bottom {
    font-size:.6rem;
    letter-spacing:.03em;
  }
  .hero-bottom a {
    gap:10px;
  }
  .discipline-strip .container {
    min-height:60px;
    gap:9px;
  }
  .discipline-strip {
    font-size:.6rem;
    letter-spacing:.02em;
  }
  .discipline-strip i {
    font-size:.65rem;
  }
  .section {
    padding-block:58px;
  }
  .section-kicker {
    margin-bottom:30px;
    font-size:.65rem;
    letter-spacing:.04em;
  }
  .section-kicker>span:last-child {
    display:none;
  }
  .split {
    grid-template-columns:1fr;
    gap:32px;
  }
  .intro {
    font-size:1.3rem;
  }
  .about-split .intro {
    font-size:1.5rem;
  }
  .photo-frame img {
    height:auto;
    aspect-ratio:1;
    min-height:0;
    max-height:none;
  }
  .photo-frame figcaption {
    font-size:.6rem;
  }
  .explanation {
    margin-bottom:35px;
    gap:15px;
  }
  .explanation h2 {
    font-size:2.8rem;
  }
  .card {
    padding:20px 17px 25px;
  }
  .card-top {
    margin-bottom:24px;
  }
  .card p {
    font-size:.85rem;
  }
  .card h3 {
    font-size:.9rem;
  }
  .association-details {
    padding:23px;
  }
  .association-details dl div {
    font-size:.85rem;
  }
  .history {
    margin-top:45px;
  }
  .timeline {
    grid-template-columns:1fr;
  }
  .timeline li {
    border-top:0;
    border-left:1px solid #444;
    padding:0 0 30px 25px;
  }
  .timeline li:before {
    left:-4px;
    top:7px;
  }
  .timeline li:last-child {
    padding-bottom:0;
  }
  .time {
    margin-bottom:8px;
  }
  .community-inner {
    padding-block:55px 60px;
  }
  .community h2 {
    font-size:3.4rem;
  }
  .community-marker {
    display:none;
  }
  .community .intro {
    font-size:1.1rem;
  }
  .community .button {
    max-width:100%;
  }
  .contact-links a {
    align-items:start;
    flex-direction:column;
    gap:2px;
  }
  .lmt {
    flex-direction:column;
    align-items:flex-start;
    gap:20px;
  }
  .footer-top {
    flex-direction:column;
    gap:26px;
    margin-bottom:25px;
  }
  .footer-top nav {
    gap:10px 24px;
  }
  .footer-bottom {
    flex-direction:column;
    font-size:.7rem;
  }
  .hero-original-logo img {
    max-height:70px;
    max-width:180px;
  }
}

@media(max-width:374px) {
  .container {
    width:calc(100% - 32px);
  }
  .hero h1 {
    font-size:3.3rem;
  }
  .hero {
    min-height:800px;
  }
  .actions {
    flex-direction:column;
    align-items:stretch;
    max-width:290px;
  }
  .discipline-strip .container {
    flex-wrap:wrap;
    justify-content:center;
    column-gap:12px;
  }
  .discipline-strip {
    font-size:.6rem;
  }
  .card {
    padding-inline:13px;
  }
  .community h2 {
    font-size:3rem;
  }
}

.menu-toggle {
  display:none;
}

.brand img {
  width:136px;
  height:auto;
}

.hero-original-logo img {
  width:220px;
  height:auto;
}

.discipline-strip .container {
  flex-wrap:wrap;
  row-gap:10px;
  padding-block:12px;
}

@media(max-width:767px) {
  .js-ready .menu-toggle {
    display:flex;
  }
  h2,h3,p,dd {
    overflow-wrap:anywhere;
  }
  .hero h1,.hero:has(.hero-original-logo:not([hidden])) h1 {
    font-size:min(14vw,6rem);
  }
  .hero-subtitle {
    overflow-wrap:anywhere;
  }
  .community h2 {
    font-size:min(14vw,3.4rem);
  }
  .hero-bottom {
    flex-wrap:wrap;
    gap:10px;
  }
  .button {
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .cards {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .card h3 {
    overflow-wrap:anywhere;
  }
  .association-details dl div {
    flex-wrap:wrap;
  }
  .association-details dd {
    text-align:left;
  }
  .explanation h2 {
    font-size:min(12vw,2.8rem);
  }
}

.hero .hero-original-logo {
  margin-top:0;
  margin-bottom:22px;
}
.hero h1,.hero:has(.hero-original-logo:not([hidden])) h1 {
  font-size:clamp(2.5rem,4.7vw,4.25rem);
  line-height:1.06;
  letter-spacing:-.045em;
  max-width:740px;
  margin-block:24px;
}
.hero-subtitle {
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:.85rem;
  letter-spacing:.07em;
}
.credits-back {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  font-size:.9rem;
}
.credits-page h1 {
  font-size:clamp(2.3rem,4.7vw,4rem);
  line-height:1.12;
  letter-spacing:-.045em;
  margin-bottom:28px;
}
.credits-page>.intro,.credits-page>p,.credit-brand {
  max-width:850px;
}
.credit-item {
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:48px;
  padding-block:48px;
  border-bottom:1px solid var(--border);
}
.credit-item:first-of-type {
  margin-top:32px;
  border-top:1px solid var(--border);
}
.credit-item img {
  width:100%;
  height:auto;
}
.credit-item h2,.credit-brand h2 {
  font-size:1.6rem;
  letter-spacing:-.02em;
}
.credit-item p a {
  text-decoration:underline;
  text-underline-offset:3px;
}
.credit-brand {
  padding-top:48px;
}
@media(max-width:767px) {
  .hero h1,.hero:has(.hero-original-logo:not([hidden])) h1 {
    font-size:clamp(1.9rem,9vw,3.2rem);
    overflow-wrap:anywhere;
  }
  .hero-subtitle {
    font-size:.75rem;
    letter-spacing:.025em;
  }
  .credit-item {
    grid-template-columns:minmax(0,1fr);
    gap:26px;
    padding-block:34px;
  }
  .credits-page h1,.credits-page a {
    overflow-wrap:anywhere;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
  }
}
