:root {
  --ink: #0a0a0a;
  --paper: #f1eee6;
  --warm: #d8d1c5;
  --acid: #F5BE00;
  --white: #f8f6ef;
  --grey: #747168;
  --line: #bbb5aa;
  --max: 1480px;
  --pad: clamp(22px, 4.3vw, 72px);
  --serif: Georgia, "Times New Roman", serif;
  --sans: Arial, Helvetica, sans-serif;
  --mono: "Courier New", Courier, monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { cursor: pointer; }
.wrap { width: min(var(--max), 100%); margin: 0 auto; padding-inline: var(--pad); }
.mono { font-family: var(--mono); font-size: 11px; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; }
.nowrap { white-space: nowrap; }

.nav { position: fixed; z-index: 50; inset: 0 0 auto; background: var(--ink); color: var(--white); border-bottom: 1px solid #222; }
.nav__in { height: 80px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { font-size: 18px; font-weight: 700; letter-spacing: -.035em; }
.nav__links { display: flex; align-items: center; gap: 34px; font-size: 18px; letter-spacing: -.02em; }
.nav__links a { opacity: .72; transition: opacity .2s ease; }
.nav__links a:hover { opacity: 1; }
.nav__toggle { display: none; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: inherit; align-items: center; justify-content: center; flex-direction: column; gap: 7px; }
.nav__toggle span { width: 22px; height: 1.5px; background: currentColor; transition: transform .2s ease, opacity .2s ease; transform-origin: center; }

.hero-shell { background: var(--ink); padding-top: 80px; border-bottom: 1px solid #202020; }
.hero { width: min(1400px, 100%); min-height: calc(100svh - 80px); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; }
.hero__copy { background: var(--paper); padding: clamp(42px, 5vw, 72px) clamp(28px, 4vw, 56px); display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.hero__kicker { display: flex; gap: 14px; align-items: center; color: #4f4d47; }
.hero__kicker::before { content: ""; width: 42px; height: 1px; background: currentColor; }
.hero h1 { font: 400 clamp(38px, 5.1vw, 86px)/.9 var(--serif); letter-spacing: -.055em; margin: 22px 0 24px; max-width: 760px; }
.hero h1 em { font-weight: 400; font-style: italic; }
.hero__lead { font-size: clamp(17px, 1.3vw, 21px); line-height: 1.48; letter-spacing: -.02em; max-width: 660px; margin: 0; color: #262522; }
.logic { display: grid; grid-template-columns: repeat(5, auto); justify-content: start; align-items: center; gap: 10px; margin-top: 34px; font: 700 11px/1.2 var(--mono); letter-spacing: .055em; text-transform: uppercase; }
.logic span:not(:last-child)::after { content: "→"; margin-left: 12px; color: #8a867d; }
.hero__foot { display: flex; gap: 22px; flex-wrap: wrap; padding-top: 34px; color: #6e6a62; font-size: 13px; }
.hero__portrait { position: relative; min-height: 100%; overflow: hidden; background: #050607; }
.hero__portrait img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 36% center; filter: saturate(.76) contrast(1.04); }
.hero__portrait::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.55)); }
.hero__caption { position: absolute; z-index: 2; bottom: 32px; left: 32px; right: 32px; color: #f3f0e8; font: 700 11px/1.5 var(--mono); text-transform: uppercase; letter-spacing: .05em; }

.impact { background: var(--ink); color: var(--white); padding: clamp(88px, 10vw, 140px) 0; }
.impact__head { display: grid; grid-template-columns: minmax(180px, .65fr) minmax(0, 1.35fr); gap: 40px; align-items: end; margin-bottom: 62px; }
.impact h2 { font: 400 clamp(54px, 7vw, 104px)/.82 var(--serif); letter-spacing: -.055em; margin: 0; }
.impact__intro { font-size: 17px; line-height: 1.55; color: #aaa69e; max-width: 700px; margin: 0; }
.impact-grid { display: grid; grid-template-columns: repeat(12, 1fr); border-top: 1px solid #343434; border-left: 1px solid #343434; }
.impact-story { position: relative; min-height: 350px; padding: 28px 28px 32px; border-right: 1px solid #343434; border-bottom: 1px solid #343434; display: flex; flex-direction: column; justify-content: space-between; transition: background .2s ease; }
.impact-story:hover { background: #111; }
.impact-story.feature { grid-column: span 8; min-height: 460px; }
.impact-story.side { grid-column: span 4; min-height: 460px; }
.impact-story.third { grid-column: span 4; }
.impact-story.wide { grid-column: span 12; min-height: 330px; }
.impact-id { color: #6e6b64; }
.impact-number { font: 400 clamp(42px, 5vw, 84px)/.9 var(--serif); letter-spacing: -.045em; color: var(--acid); margin: 34px 0 14px; }
.impact-story.feature .impact-number { font-size: clamp(58px, 6.8vw, 108px); }
.impact-story.wide .impact-number { font-size: clamp(52px, 6vw, 96px); }
.impact-money { color: var(--acid); font: 700 11px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .04em; margin: -4px 0 18px; }
.impact-story h3 { font-size: clamp(22px, 1.9vw, 32px); line-height: 1.08; letter-spacing: -.035em; margin: 0 0 10px; max-width: 760px; font-weight: 500; }
.impact-story p { font-size: 14px; line-height: 1.55; color: #aaa79f; max-width: 720px; margin: 0; }
.impact-link, .footer__dossier { margin-top: 30px; display: inline-flex; align-items: center; gap: 14px; font-size: 12px; border: 0; border-bottom: 1px solid #575757; padding: 0 0 4px; align-self: flex-start; background: none; color: inherit; }
.impact-link:hover, .footer__dossier:hover { color: var(--acid); border-color: var(--acid); }

.thesis { padding: clamp(110px, 14vw, 200px) 0; border-bottom: 1px solid var(--line); }
.thesis__top { display: grid; grid-template-columns: .66fr 1.34fr; gap: 70px; }
.thesis h2 { font: 400 clamp(54px, 7vw, 108px)/.88 var(--serif); letter-spacing: -.05em; margin: 0; max-width: 950px; }
.thesis h2 em { font-style: italic; font-weight: 400; }
.thesis__body { margin-top: 80px; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; border-top: 1px solid var(--ink); padding-top: 34px; }
.thesis__body p { font-size: clamp(18px, 1.7vw, 27px); line-height: 1.42; letter-spacing: -.025em; margin: 0; max-width: 720px; }
.thesis__rule { font: 400 clamp(28px, 3.4vw, 58px)/1 var(--serif); letter-spacing: -.035em; color: #4e4b45; }
.thesis__flow { margin-top: 78px; padding: 26px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; gap: 15px 24px; flex-wrap: wrap; align-items: center; font: 700 11px var(--mono); text-transform: uppercase; letter-spacing: .055em; }
.thesis__flow span:not(:last-child)::after { content: "→"; margin-left: 24px; color: #8e897f; }

.multiply { background: var(--acid); padding: clamp(92px, 10vw, 150px) 0; border-bottom: 1px solid var(--ink); }
.multiply__grid { display: grid; grid-template-columns: .55fr 1.45fr; gap: 70px; }
.multiply h2 { font: 400 clamp(54px, 7vw, 112px)/.86 var(--serif); letter-spacing: -.055em; margin: 0 0 45px; max-width: 1000px; }
.multiply__lead { font-size: clamp(19px, 1.7vw, 27px); line-height: 1.42; max-width: 850px; margin: 0; }
.multiply__list { margin-top: 60px; border-top: 1px solid rgba(0,0,0,.55); }
.multiply__item { display: grid; grid-template-columns: 52px 1fr 1fr; gap: 25px; padding: 27px 0; border-bottom: 1px solid rgba(0,0,0,.35); align-items: start; }
.multiply__item h3 { font-size: 19px; line-height: 1.25; margin: 0; letter-spacing: -.025em; }
.multiply__item p { font-size: 14px; line-height: 1.55; margin: 0; color: #34342f; }

.experience { padding: clamp(100px, 12vw, 175px) 0; background: var(--warm); }
.experience__head { display: grid; grid-template-columns: .72fr 1.28fr; gap: 70px; margin-bottom: 78px; }
.experience h2 { font: 400 clamp(58px, 7vw, 116px)/.84 var(--serif); letter-spacing: -.055em; margin: 0; }
.experience__head p { font-size: 18px; line-height: 1.55; max-width: 690px; margin: 8px 0 0; }
.experience-lines { border-top: 1px solid #989186; }
.experience-line { display: grid; grid-template-columns: 220px 1fr minmax(260px, .65fr); gap: 38px; padding: 31px 0; border-bottom: 1px solid #989186; align-items: start; }
.experience-line h3 { font: 400 clamp(28px, 2.8vw, 48px)/1 var(--serif); letter-spacing: -.035em; margin: 0; }
.experience-line p { font-size: 14px; line-height: 1.58; color: #504c44; margin: 3px 0 0; max-width: 660px; }

.mentor { padding: clamp(110px, 14vw, 200px) 0; background: var(--paper); }
.mentor__grid { display: grid; grid-template-columns: .62fr 1.38fr; gap: 70px; }
.mentor h2 { font: 400 clamp(56px, 7vw, 116px)/.86 var(--serif); letter-spacing: -.055em; margin: 0 0 38px; max-width: 1050px; }
.mentor__text { font-size: clamp(19px, 1.65vw, 27px); line-height: 1.42; letter-spacing: -.02em; max-width: 880px; margin: 0; }
.mentor__text + .mentor__text { margin-top: 20px; }
.cta { display: inline-flex; margin-top: 48px; align-items: center; justify-content: space-between; gap: 42px; min-width: 320px; border: 1px solid var(--ink); border-radius: 999px; padding: 18px 22px; font-size: 14px; transition: .2s ease; }
.cta:hover { background: var(--ink); color: var(--paper); }

.about { background: #d8d2c8; padding: clamp(90px, 10vw, 145px) 0; border-top: 1px solid var(--ink); }
.about__grid { display: grid; grid-template-columns: .62fr 1.38fr; gap: 70px; }
.about h2 { font: 400 clamp(50px, 6vw, 94px)/.9 var(--serif); letter-spacing: -.05em; margin: 0; }
.about p { font-size: 20px; line-height: 1.55; letter-spacing: -.015em; margin: 0; max-width: 900px; }
.about p + p { margin-top: 20px; color: #58544c; font-size: 16px; }

footer { background: var(--ink); color: var(--white); padding: clamp(84px, 10vw, 145px) 0 34px; }
.footer__top { display: grid; grid-template-columns: 1.35fr .65fr; gap: 70px; align-items: end; }
footer h2 { font: 400 clamp(48px, 6.5vw, 104px)/.86 var(--serif); letter-spacing: -.055em; margin: 0; max-width: 1080px; }
.footer__aside { display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.footer__aside a { font-size: 15px; border-bottom: 1px solid #555; padding-bottom: 4px; }
.footer__dossier { margin-top: 0; font-size: 15px; }
.footer__base { display: flex; justify-content: space-between; gap: 25px; margin-top: 110px; padding-top: 22px; border-top: 1px solid #333; color: #777; font: 11px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .04em; }

.modal { position: fixed; z-index: 100; inset: 0; background: rgba(0,0,0,.78); display: none; align-items: center; justify-content: center; padding: 24px; backdrop-filter: blur(8px); }
.modal.open { display: flex; }
.modal__box { width: min(540px, 100%); background: var(--paper); padding: 30px; border: 1px solid var(--ink); }
.modal__close { float: right; background: none; border: 0; font-size: 25px; }
.modal h3 { font: 400 52px/.9 var(--serif); letter-spacing: -.04em; margin: 22px 0 15px; }
.modal p { font-size: 14px; line-height: 1.55; color: #666159; margin: 0 0 24px; }
.pass { display: flex; border: 1px solid var(--ink); }
.pass input { flex: 1; min-width: 0; border: 0; background: transparent; padding: 16px; font: 14px var(--mono); outline: 0; }
.pass button { border: 0; border-left: 1px solid var(--ink); background: var(--acid); padding: 0 20px; font-weight: 700; }
.error { min-height: 18px; color: #922d2d; font: 11px/1.3 var(--mono); margin-top: 10px; }

@media (max-width: 1050px) {
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .hero__copy { padding-left: var(--pad); }
  .hero__portrait { height: 68svh; min-height: 520px; }
  .impact__head, .thesis__top, .multiply__grid, .experience__head, .mentor__grid, .about__grid, .footer__top { grid-template-columns: 1fr; }
  .impact-story.feature, .impact-story.side, .impact-story.third, .impact-story.wide { grid-column: span 12; min-height: 360px; }
  .thesis__body { grid-template-columns: 1fr; gap: 38px; }
  .multiply__item { grid-template-columns: 45px 1fr; }
  .multiply__item p { grid-column: 2; }
  .experience-line { grid-template-columns: 160px 1fr; }
  .experience-line p { grid-column: 2; }
  .nowrap { white-space: normal; }
}

@media (max-width: 900px) {
  .brand { position: relative; z-index: 2; }
  .nav__toggle { display: inline-flex; position: relative; z-index: 2; margin-right: -11px; }
  .nav__toggle:focus-visible { outline: 1px solid var(--acid); outline-offset: 2px; }
  .nav__links {
    position: fixed;
    z-index: 1;
    top: 80px;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    height: calc(100svh - 80px);
    padding: 10px var(--pad) 24px;
    overflow-y: auto;
    background: var(--ink);
    border-top: 1px solid #2a2a2a;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-10px);
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
  }
  .nav__links a {
    display: block;
    width: 100%;
    padding: 18px 0;
    border-bottom: 1px solid #2a2a2a;
    font-size: 20px;
    line-height: 1.2;
    letter-spacing: -.025em;
    opacity: 1;
  }
  .nav__links a:nth-child(4) { color: var(--acid); }
  .nav.menu-open .nav__links { visibility: visible; opacity: 1; transform: translateY(0); pointer-events: auto; }
  .nav.menu-open .nav__toggle span:first-child { transform: translateY(4.25px) rotate(45deg); }
  .nav.menu-open .nav__toggle span:last-child { transform: translateY(-4.25px) rotate(-45deg); }
  body.menu-open { overflow: hidden; }
}

@media (max-width: 680px) {
  .nav__in { height: 72px; }
  .nav__links { top: 72px; height: calc(100svh - 72px); }
  .hero-shell { padding-top: 72px; }
  .hero__copy { padding-top: 40px; padding-bottom: 40px; }
  .hero h1 { font-size: 48px; }
  .logic { grid-template-columns: 1fr; gap: 8px; }
  .logic span:not(:last-child)::after { content: "↓"; margin-left: 12px; }
  .hero__portrait { height: 56svh; min-height: 360px; }
  .impact { padding-top: 80px; }
  .impact h2 { font-size: 64px; }
  .impact-grid { border-left: 0; }
  .impact-story { border-left: 1px solid #343434; padding: 24px 20px 28px; }
  .impact-number, .impact-story.feature .impact-number, .impact-story.wide .impact-number { font-size: 50px; }
  .experience-line { grid-template-columns: 1fr; gap: 12px; }
  .experience-line p { grid-column: auto; }
  .multiply__item { grid-template-columns: 38px 1fr; }
  .footer__base { flex-direction: column; }
  .footer__top { gap: 50px; }
  .cta { min-width: 0; width: 100%; }
}
