/* ==========================================================
   ROSARIO ANTHONY — HOMEPAGE V1.1
========================================================== */

:root {

  --canvas: #f2efe8;
  --canvas-dark: #e6e1d7;
  --canvas-light: #f8f6f1;

  --ink: #171714;
  --muted: #69675f;

  --dark: #171714;
  --dark-soft: #20201c;

  --light: #f4f1e9;
  --light-muted: #a8a59d;

  --accent: #7a2f35;

  --line: rgba(23,23,20,.16);
  --line-dark: rgba(23,23,20,.30);
  --line-light: rgba(244,241,233,.17);

  --serif: "Instrument Serif", Georgia, serif;
  --sans: "DM Sans", Arial, sans-serif;

  --page-padding: clamp(24px,4vw,72px);

  /* TYPOGRAPHIC HIERARCHY */

  --type-display: clamp(5.2rem,8vw,9.2rem);
  --type-section: clamp(3.9rem,6vw,6.8rem);
  --type-feature: clamp(2.6rem,3.7vw,4.4rem);
  --type-project: clamp(2.1rem,3vw,3.6rem);
  --type-item: clamp(1.7rem,2.2vw,2.7rem);
}


/* ==========================================================
   RESET
========================================================== */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--canvas);
  color: var(--ink);

  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.5;

  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body.menu-open {
  overflow: hidden;
}

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

button {
  font: inherit;
}

img {
  max-width: 100%;
}


/* ==========================================================
   SHARED
========================================================== */

.section-label {
  display: flex;
  gap: 16px;

  color: var(--muted);

  font-size: .67rem;
  font-weight: 600;

  letter-spacing: .13em;
  text-transform: uppercase;
}

.section-label span:first-child {
  color: var(--ink);
}

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

.light-label span:first-child {
  color: var(--light);
}


.text-link {
  width: fit-content;

  display: inline-flex;
  align-items: center;
  gap: 10px;

  padding-bottom: 5px;

  border-bottom: 1px solid currentColor;

  font-size: .84rem;
}

.text-link span,
.light-link span {
  transition: transform 180ms ease;
}

.text-link:hover span,
.light-link:hover span {
  transform: translate(3px,-3px);
}


/* ==========================================================
   HEADER
========================================================== */

.site-header {
  height: 90px;

  padding: 0 var(--page-padding);

  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;

  border-bottom: 1px solid var(--line);

  position: relative;
  z-index: 100;

  background: var(--canvas);
}

.logo {
  font-family: var(--serif);
  font-size: 1.38rem;
  letter-spacing: -.02em;
}

.desktop-nav {
  display: flex;
  gap: 34px;
  align-items: center;
}

.desktop-nav a,
.contact-link {
  font-size: .84rem;
}

.desktop-nav a {
  color: var(--muted);
  transition: color 180ms ease;
}

.desktop-nav a:hover {
  color: var(--ink);
}

.contact-link {
  justify-self: end;

  display: flex;
  gap: 8px;
}

.contact-link span {
  transition: transform 180ms ease;
}

.contact-link:hover span {
  transform: translate(3px,-3px);
}

.menu-button {
  display: none;
  border: 0;
  background: transparent;
  cursor: pointer;
}


/* ==========================================================
   MOBILE MENU
========================================================== */

.mobile-menu {
  position: fixed;
  inset: 72px 0 0;

  z-index: 90;

  padding: 40px var(--page-padding);

  background: var(--dark);
  color: var(--light);

  display: none;
  flex-direction: column;
  justify-content: space-between;
}

.mobile-menu.open {
  display: flex;
}

.mobile-menu nav {
  display: flex;
  flex-direction: column;
}

.mobile-menu nav a {
  display: flex;
  justify-content: space-between;
  align-items: baseline;

  padding: 17px 0;

  border-bottom: 1px solid var(--line-light);

  font-family: var(--serif);
  font-size: clamp(2.7rem,12vw,4.8rem);
  line-height: 1;
}

.mobile-menu nav span {
  font-family: var(--sans);
  font-size: .65rem;
}

.mobile-menu-footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;

  color: var(--light-muted);
  font-size: .7rem;
}


/* ==========================================================
   HERO
========================================================== */

.hero {
  min-height: calc(100vh - 90px);

  padding:
    34px
    var(--page-padding)
    0;

  display: flex;
  flex-direction: column;
}

.hero-grid {
  flex: 1;

  display: grid;

  grid-template-columns:
    minmax(0,1.55fr)
    minmax(300px,.65fr);

  gap: clamp(48px,7vw,120px);

  align-items: center;

  padding: 48px 0;
}

.hero-copy h1 {
  max-width: 920px;

  font-family: var(--serif);

  font-size: clamp(4rem,7.1vw,8.5rem);

  font-weight: 400;

  line-height: .91;
  letter-spacing: -.045em;
}

.hero-copy h1 em {
  color: var(--accent);
  font-weight: 400;
}

.hero-description {
  max-width: 820px;

  margin-top: clamp(44px,5vw,76px);

  display: grid;

  grid-template-columns:
    minmax(190px,.8fr)
    minmax(280px,1.2fr);

  gap: 40px;
}

.discipline-line {
  font-size: .72rem;

  letter-spacing: .08em;
  line-height: 1.8;

  text-transform: uppercase;
}

.discipline-line span {
  margin: 0 4px;
  color: var(--accent);
}

.intro-copy {
  max-width: 480px;
  color: var(--muted);
}

.hero-description .text-link {
  margin-top: 28px;
}


/* HERO IMAGE */

.hero-portrait {
  position: relative;

  height: min(70vh,760px);
  min-height: 500px;

  overflow: hidden;

  background: var(--canvas-dark);
}

.hero-portrait img {
  width: 100%;
  height: 100%;

  display: block;

  object-fit: cover;
  object-position: center;

  filter:
    saturate(.88)
    contrast(1.02);
}

.portrait-caption {
  position: absolute;

  left: 18px;
  right: 18px;
  bottom: 15px;

  display: flex;
  justify-content: space-between;

  color: rgba(255,255,255,.84);

  font-size: .6rem;
  font-weight: 500;

  letter-spacing: .1em;
  text-transform: uppercase;

  text-shadow: 0 1px 10px rgba(0,0,0,.25);
}


.current-status {
  min-height: 82px;

  display: flex;
  align-items: center;

  gap: clamp(40px,7vw,120px);

  border-top: 1px solid var(--line);
}

.status-item {
  display: flex;
  gap: 18px;

  font-size: .74rem;
}

.status-label {
  color: var(--muted);

  letter-spacing: .08em;
  text-transform: uppercase;
}


/* ==========================================================
   EVIDENCE
========================================================== */

.evidence {
  padding:
    52px
    var(--page-padding)
    72px;

  background: var(--dark);
  color: var(--light);
}

.section-heading {
  margin-top: 120px;
}

.section-heading p {
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .13em;
}

.evidence-grid {
  margin-top: 38px;

  display: grid;
  grid-template-columns: repeat(3,1fr);

  border-top: 1px solid var(--line-light);
  border-bottom: 1px solid var(--line-light);
}

.evidence-item {
  min-height: 360px;

  padding: 42px 42px 54px 0;

  border-right: 1px solid var(--line-light);
}

.evidence-item:not(:first-child) {
  padding-left: 42px;
}

.evidence-item:last-child {
  border-right: 0;
}

.number {
  font-family: var(--serif);

  font-size: clamp(5rem,8vw,9rem);

  line-height: .9;
  letter-spacing: -.05em;
}

.evidence-item h3 {
  margin-top: 44px;

  font-size: .67rem;

  letter-spacing: .12em;
  text-transform: uppercase;
}

.evidence-item p {
  max-width: 260px;

  margin-top: 14px;

  color: var(--light-muted);

  font-size: .84rem;
}

.evidence-note {
  margin-top: 22px;

  color: var(--light-muted);

  font-size: .68rem;
}


/* ==========================================================
   WORK AREAS
========================================================== */

.work-areas {
  padding:
    52px
    var(--page-padding)
    140px;
}

.work-intro {
  margin-top: 130px;

  display: grid;

  grid-template-columns:
    minmax(0,1.45fr)
    minmax(260px,.55fr);

  gap: 80px;

  align-items: end;
}

.work-intro h2 {
  max-width: 900px;

  font-family: var(--serif);

  font-size: var(--type-section);

  font-weight: 400;

  line-height: .94;
  letter-spacing: -.04em;
}

.work-intro h2 em {
  color: var(--accent);
  font-weight: 400;
}

.work-intro > p {
  max-width: 420px;

  margin-bottom: 10px;

  color: var(--muted);
}


.areas-list {
  margin-top: 110px;

  border-top: 1px solid var(--line);
}

.area-row {
  min-height: 190px;

  display: grid;

  grid-template-columns:
    80px
    1.2fr
    1fr
    40px;

  gap: 30px;

  align-items: center;

  border-bottom: 1px solid var(--line);

  transition:
    background 220ms ease,
    padding 220ms ease;
}

.area-row:hover {
  padding-left: 18px;
  padding-right: 18px;

  background: var(--canvas-dark);
}

.area-number {
  color: var(--muted);

  font-size: .67rem;
  letter-spacing: .1em;
}

.area-title h3 {
  font-family: var(--serif);

  font-size: clamp(2.4rem,3.7vw,4.3rem);

  font-weight: 400;

  line-height: 1;
}

.area-title p {
  margin-top: 12px;
  color: var(--muted);
}

.area-tags {
  display: flex;
  flex-wrap: wrap;

  gap: 7px 18px;

  color: var(--muted);

  font-size: .7rem;

  letter-spacing: .08em;
  text-transform: uppercase;
}

.area-arrow {
  justify-self: end;

  font-size: 1.2rem;

  transition: transform 180ms ease;
}

.area-row:hover .area-arrow {
  transform: translate(4px,-4px);
}


/* ==========================================================
   SELECTED WORK
========================================================== */

.selected-work {
  padding:
    52px
    var(--page-padding)
    160px;

  background: var(--canvas-light);
}


/* CHAPTER OPENER */

.work-heading-row {
  margin-top: 120px;

  display: flex;

  justify-content: space-between;
  align-items: end;

  gap: 60px;
}

.work-heading-row h2 {
  max-width: 1050px;

  font-family: var(--serif);

  font-size: var(--type-display);

  font-weight: 400;

  line-height: .86;
  letter-spacing: -.055em;
}

.work-heading-row h2 em {
  color: var(--accent);
  font-weight: 400;
}


/* FEATURED CASE */

.featured-case {
  margin-top: 165px;
}

.case-heading {
  display: grid;
  grid-template-columns: 1fr auto;

  gap: 40px;

  align-items: start;

  margin-bottom: 42px;
}

.eyebrow {
  margin-bottom: 22px;

  color: var(--muted);

  font-size: .66rem;
  font-weight: 600;

  letter-spacing: .11em;
  text-transform: uppercase;
}

.case-heading h3 {
  max-width: 760px;

  font-family: var(--serif);

  font-size: var(--type-feature);

  font-weight: 400;

  line-height: .98;
  letter-spacing: -.03em;
}


/* FEATURED IMAGE */

.featured-image {
  width: 100%;
  height: min(72vh,820px);

  display: block;

  overflow: hidden;

  background: var(--ink);
}

.featured-image img {
  width: 100%;
  height: 100%;

  display: block;

  object-fit: cover;
  object-position: center;

  transition:
    transform 800ms cubic-bezier(.2,.7,.2,1);
}

.featured-image:hover img {
  transform: scale(1.015);
}


/* CASE INFORMATION */

.case-details {
  padding-top: 30px;

  display: grid;

  grid-template-columns:
    .8fr
    1.3fr
    .5fr;

  gap: 50px;
}

.case-meta {
  display: flex;
  flex-wrap: wrap;

  align-content: start;

  gap: 6px 15px;

  color: var(--muted);

  font-size: .67rem;

  letter-spacing: .08em;
  text-transform: uppercase;
}

.case-description p {
  max-width: 580px;

  color: var(--muted);
}

.case-description .text-link {
  margin-top: 26px;
}

.case-stat {
  justify-self: end;

  display: flex;
  flex-direction: column;

  text-align: right;
}

.case-stat strong {
  font-family: var(--serif);

  font-size: 4.8rem;
  font-weight: 400;

  line-height: .8;
}

.case-stat span {
  margin-top: 12px;

  color: var(--muted);

  font-size: .68rem;

  letter-spacing: .1em;
  text-transform: uppercase;
}


/* SECONDARY CASES */

.secondary-cases {
  margin-top: 170px;

  display: grid;

  grid-template-columns:
    1.15fr
    .75fr;

  gap: clamp(50px,9vw,150px);

  align-items: start;
}

.project-card-offset {
  margin-top: 190px;
}

.project-image {
  width: 100%;

  aspect-ratio: 4 / 3;

  display: block;

  overflow: hidden;

  background: var(--canvas-dark);
}

.project-card-offset .project-image {
  aspect-ratio: 4 / 5;
}

.project-image img {
  width: 100%;
  height: 100%;

  display: block;

  object-fit: cover;

  transition:
    transform 700ms cubic-bezier(.2,.7,.2,1);
}

.project-image:hover img {
  transform: scale(1.018);
}

.project-index {
  margin-top: 22px;

  color: var(--muted);

  font-size: .65rem;
  font-weight: 500;

  letter-spacing: .08em;
  text-transform: uppercase;
}

.project-card h3 {
  max-width: 640px;

  margin-top: 20px;

  font-family: var(--serif);

  font-size: var(--type-project);

  font-weight: 400;

  line-height: .99;
  letter-spacing: -.025em;
}

.project-card-offset h3 {
  max-width: 500px;
}

.project-bottom {
  margin-top: 30px;

  padding-top: 18px;

  border-top: 1px solid var(--line);

  display: flex;
  justify-content: space-between;

  gap: 30px;

  color: var(--muted);

  font-size: .66rem;

  letter-spacing: .05em;
  text-transform: uppercase;
}

.project-bottom a {
  color: var(--ink);
}


/* ==========================================================
   EXPERIENCE
========================================================== */

.experience {
  padding:
    52px
    var(--page-padding)
    105px;

  background: var(--dark);
  color: var(--light);
}

.experience-intro {
  margin-top: 125px;

  display: grid;

  grid-template-columns:
    1.3fr
    .7fr;

  gap: 100px;

  align-items: end;
}

.experience-intro h2 {
  max-width: 850px;

  font-family: var(--serif);

  font-size: var(--type-section);

  font-weight: 400;

  line-height: .93;
  letter-spacing: -.04em;
}

.experience-intro h2 em {
  color: #b98589;
  font-weight: 400;
}

.experience-intro p {
  max-width: 430px;

  color: var(--light-muted);
}


.timeline {
  margin-top: 130px;

  border-top: 1px solid var(--line-light);
}

.timeline-row {
  min-height: 210px;

  display: grid;

  grid-template-columns:
    .55fr
    1.2fr
    .8fr
    1.25fr
    30px;

  gap: 30px;

  align-items: center;

  border-bottom: 1px solid var(--line-light);
}

.timeline-date,
.timeline-location {
  color: var(--light-muted);

  font-size: .66rem;

  letter-spacing: .07em;
  text-transform: uppercase;
}

.timeline-main h3 {
  font-family: var(--serif);

  font-size: clamp(1.9rem,2.7vw,3rem);

  font-weight: 400;

  line-height: 1;
}

.timeline-main p {
  margin-top: 9px;

  color: var(--light-muted);

  font-size: .8rem;
}

.timeline-description p {
  max-width: 420px;

  color: var(--light-muted);

  font-size: .84rem;
}

.timeline-arrow {
  justify-self: end;

  transition: transform 180ms ease;
}

.timeline-row:hover .timeline-arrow {
  transform: translate(4px,-4px);
}

.experience-footer {
  margin-top: 50px;

  display: flex;
  gap: 40px;
}

.light-link {
  display: inline-flex;
  gap: 9px;

  padding-bottom: 5px;

  border-bottom: 1px solid var(--light);

  font-size: .8rem;
}

.light-link.secondary {
  color: var(--light-muted);
  border-color: var(--light-muted);
}


/* ==========================================================
   THINKING
========================================================== */

.thinking {
  padding:
    52px
    var(--page-padding)
    140px;
}

.thinking-header {
  margin-top: 125px;

  display: grid;

  grid-template-columns:
    1.4fr
    .6fr;

  gap: 100px;

  align-items: end;
}

.thinking-header h2 {
  max-width: 900px;

  font-family: var(--serif);

  font-size: var(--type-section);

  font-weight: 400;

  line-height: .93;
  letter-spacing: -.04em;
}

.thinking-header h2 em {
  color: var(--accent);
  font-weight: 400;
}

.thinking-header > p {
  max-width: 390px;

  color: var(--muted);
}


/* FEATURED ESSAY */

.featured-essay {
  margin-top: 130px;

  padding: 35px 0 45px;

  border-top: 1px solid var(--line-dark);
  border-bottom: 1px solid var(--line-dark);

  display: grid;

  grid-template-columns:
    .5fr
    1.6fr
    .55fr;

  gap: 50px;
}

.essay-label {
  color: var(--muted);

  font-size: .66rem;

  letter-spacing: .1em;
  text-transform: uppercase;
}

.essay-content h3 {
  max-width: 800px;

  font-family: var(--serif);

  font-size: var(--type-feature);

  font-weight: 400;

  line-height: .97;
  letter-spacing: -.03em;
}

.essay-content p {
  max-width: 650px;

  margin-top: 32px;

  color: var(--muted);
}

.essay-meta {
  display: flex;
  flex-direction: column;

  align-items: flex-end;

  gap: 10px;

  color: var(--muted);

  font-size: .68rem;

  text-align: right;
}

.essay-meta a {
  margin-top: auto;

  color: var(--ink);
}


/* ARTICLES */

.article-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);

  border-bottom: 1px solid var(--line-dark);
}

.article-card {
  min-height: 470px;

  padding: 35px 38px 32px 0;

  border-right: 1px solid var(--line);

  display: flex;
  flex-direction: column;
}

.article-card:not(:first-child) {
  padding-left: 38px;
}

.article-card:last-child {
  border-right: 0;
}

.article-number {
  color: var(--muted);

  font-size: .65rem;
}

.article-card h3 {
  margin-top: 70px;

  font-family: var(--serif);

  font-size: var(--type-item);

  font-weight: 400;

  line-height: 1;
  letter-spacing: -.025em;
}

.article-card > p {
  max-width: 360px;

  margin-top: 26px;

  color: var(--muted);

  font-size: .84rem;
}

.article-card > div {
  margin-top: auto;

  display: flex;
  justify-content: space-between;

  gap: 20px;

  color: var(--muted);

  font-size: .66rem;

  text-transform: uppercase;
  letter-spacing: .05em;
}

.article-card > div a {
  color: var(--ink);
}

.section-action {
  margin-top: 45px;

  display: flex;
  justify-content: flex-end;
}


/* ==========================================================
   ABOUT
========================================================== */

.about {
  background: var(--canvas-light);
}

.about-image {
  width: 100%;

  height: min(90vh,950px);

  overflow: hidden;

  background: var(--ink);
}

.about-image img {
  width: 100%;
  height: 100%;

  display: block;

  object-fit: cover;
  object-position: center 35%;

  filter:
    grayscale(100%)
    contrast(1.03);
}

.image-caption {
  padding:
    10px
    var(--page-padding)
    0;

  display: flex;
  justify-content: space-between;

  color: var(--muted);

  font-size: .62rem;

  letter-spacing: .08em;
  text-transform: uppercase;
}

.about-content {
  padding:
    52px
    var(--page-padding)
    145px;
}

.about-grid {
  margin-top: 115px;

  display: grid;

  grid-template-columns:
    1.35fr
    .65fr;

  gap: 100px;
}

.about-grid h2 {
  max-width: 920px;

  font-family: var(--serif);

  font-size: var(--type-section);

  font-weight: 400;

  line-height: .92;
  letter-spacing: -.04em;
}

.about-grid h2 em {
  color: var(--accent);
  font-weight: 400;
}

.about-copy {
  padding-top: 10px;
}

.about-copy p {
  margin-bottom: 24px;

  color: var(--muted);
}

.about-copy .about-emphasis {
  color: var(--ink);

  font-family: var(--serif);

  font-size: 1.6rem;

  line-height: 1.15;
}

.about-copy .text-link {
  margin-top: 15px;
}


/* ==========================================================
   CONTACT
========================================================== */

.contact-section {
  padding:
    52px
    var(--page-padding)
    140px;

  background: var(--canvas-dark);
}

.contact-heading {
  margin-top: 120px;

  display: grid;

  grid-template-columns:
    1.4fr
    .6fr;

  gap: 100px;

  align-items: end;
}

.contact-heading h2 {
  max-width: 980px;

  font-family: var(--serif);

  font-size: var(--type-display);

  font-weight: 400;

  line-height: .88;
  letter-spacing: -.05em;
}

.contact-heading h2 em {
  color: var(--accent);
  font-weight: 400;
}

.contact-heading p {
  max-width: 420px;

  color: var(--muted);
}


.contact-options {
  margin-top: 120px;

  border-top: 1px solid var(--line-dark);
}

.contact-option {
  min-height: 145px;

  display: grid;

  grid-template-columns:
    80px
    1fr
    40px;

  gap: 30px;

  align-items: center;

  border-bottom: 1px solid var(--line-dark);

  transition:
    padding 220ms ease,
    background 220ms ease;
}

.contact-option:hover {
  padding-left: 18px;
  padding-right: 18px;

  background: var(--canvas);
}

.option-number {
  color: var(--muted);

  font-size: .66rem;
}

.contact-option h3 {
  font-family: var(--serif);

  font-size: clamp(2rem,3vw,3.4rem);

  font-weight: 400;

  line-height: 1;
}

.contact-option p {
  margin-top: 10px;

  color: var(--muted);

  font-size: .82rem;
}

.option-arrow {
  justify-self: end;

  transition: transform 180ms ease;
}

.contact-option:hover .option-arrow {
  transform: translate(4px,-4px);
}


/* ==========================================================
   FOOTER
========================================================== */

.site-footer {
  padding:
    70px
    var(--page-padding)
    30px;

  background: var(--dark);
  color: var(--light);
}

.footer-top {
  min-height: 330px;

  display: grid;

  grid-template-columns:
    1.5fr
    .5fr;

  gap: 80px;
}

.footer-name {
  font-family: var(--serif);

  font-size: clamp(3.2rem,6vw,7rem);

  line-height: 1;
  letter-spacing: -.04em;
}

.footer-top > div:first-child p {
  margin-top: 20px;

  color: var(--light-muted);

  font-size: .75rem;
}

.footer-nav {
  display: grid;

  grid-template-columns:
    1fr
    1fr;

  gap: 50px;
}

.footer-nav > div {
  display: flex;
  flex-direction: column;

  align-items: flex-start;

  gap: 12px;
}

.footer-nav span {
  margin-bottom: 12px;

  color: var(--light-muted);

  font-size: .64rem;

  text-transform: uppercase;
  letter-spacing: .1em;
}

.footer-nav a {
  font-size: .8rem;
}

.footer-bottom {
  padding-top: 25px;

  border-top: 1px solid var(--line-light);

  display: flex;
  justify-content: space-between;

  gap: 30px;

  color: var(--light-muted);

  font-size: .65rem;
}


/* ==========================================================
   REVEAL
========================================================== */

.reveal {
  opacity: 0;

  transform: translateY(22px);

  transition:
    opacity 750ms cubic-bezier(.2,.7,.2,1),
    transform 750ms cubic-bezier(.2,.7,.2,1);
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width:1050px) {

  .desktop-nav,
  .contact-link {
    display: none;
  }

  .site-header {
    grid-template-columns: 1fr auto;
  }

  .menu-button {
    display: block;
  }


  .hero-grid {
    grid-template-columns: 1fr .55fr;
    gap: 40px;
  }

  .hero-description {
    grid-template-columns: 1fr;
  }


  .work-intro,
  .experience-intro,
  .thinking-header,
  .about-grid,
  .contact-heading {
    grid-template-columns: 1fr;

    gap: 35px;
  }


  .area-row {
    grid-template-columns:
      55px
      1.2fr
      .8fr
      30px;
  }


  .timeline-row {
    grid-template-columns:
      .5fr
      1.2fr
      .8fr
      30px;
  }

  .timeline-description {
    grid-column: 2 / 4;

    padding-bottom: 30px;
  }


  .featured-essay {
    grid-template-columns:
      .4fr
      1.6fr;
  }

  .essay-meta {
    grid-column: 2;

    align-items: flex-start;

    flex-direction: row;

    text-align: left;
  }

  .essay-meta a {
    margin-top: 0;
    margin-left: auto;
  }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width:760px) {

  :root {
    --page-padding: 20px;

    --type-display: clamp(3.8rem,15vw,5.8rem);
    --type-section: clamp(3.2rem,13vw,5rem);
    --type-feature: clamp(2.6rem,11vw,4rem);
    --type-project: clamp(2.3rem,10vw,3.5rem);
    --type-item: clamp(2rem,8vw,2.8rem);
  }


  .site-header {
    height: 72px;
  }


  /* HERO */

  .hero {
    min-height: auto;

    padding-top: 26px;
  }

  .hero-grid {
    display: flex;
    flex-direction: column;

    align-items: stretch;

    padding: 58px 0 0;
  }

  .hero-copy h1 {
    font-size: clamp(3.7rem,16vw,5.8rem);
  }

  .hero-description {
    margin-top: 42px;
    gap: 22px;
  }

  .hero-portrait {
    height: 65vh;
    min-height: 460px;

    margin-top: 20px;
  }

  .current-status {
    padding: 25px 0;

    flex-direction: column;
    align-items: flex-start;

    gap: 14px;
  }

  .status-item {
    flex-direction: column;
    gap: 4px;
  }


  /* EVIDENCE */

  .section-heading {
    margin-top: 80px;
  }

  .evidence-grid {
    grid-template-columns: 1fr;
  }

  .evidence-item,
  .evidence-item:not(:first-child) {
    min-height: 270px;

    padding: 38px 0;

    border-right: 0;

    border-bottom:
      1px solid var(--line-light);
  }

  .evidence-item:last-child {
    border-bottom: 0;
  }


  /* WORK AREAS */

  .work-areas {
    padding-bottom: 90px;
  }

  .work-intro {
    margin-top: 85px;
  }

  .areas-list {
    margin-top: 75px;
  }

  .area-row {
    min-height: auto;

    padding: 30px 0;

    grid-template-columns:
      35px
      1fr
      25px;

    gap: 15px;
  }

  .area-row:hover {
    padding-left: 0;
    padding-right: 0;

    background: transparent;
  }

  .area-tags {
    grid-column: 2;

    margin-top: 10px;
  }

  .area-arrow {
    grid-column: 3;
    grid-row: 1;
  }


  /* SELECTED WORK */

  .selected-work {
    padding-bottom: 100px;
  }

  .work-heading-row {
    margin-top: 85px;

    align-items: flex-start;
    flex-direction: column;
  }

  .featured-case {
    margin-top: 110px;
  }

  .case-heading {
    margin-bottom: 30px;
  }

  .featured-image {
    height: auto;

    aspect-ratio: 4 / 5;
  }

  .case-details {
    grid-template-columns: 1fr;

    gap: 30px;
  }

  .case-stat {
    justify-self: start;

    text-align: left;
  }

  .secondary-cases {
    margin-top: 105px;

    grid-template-columns: 1fr;

    gap: 95px;
  }

  .project-card-offset {
    margin-top: 0;
  }


  /* EXPERIENCE */

  .experience {
    padding-bottom: 80px;
  }

  .experience-intro {
    margin-top: 85px;
  }

  .timeline {
    margin-top: 90px;
  }

  .timeline-row {
    padding: 30px 0;

    grid-template-columns:
      1fr
      25px;

    gap: 15px;
  }

  .timeline-date,
  .timeline-main,
  .timeline-location,
  .timeline-description {
    grid-column: 1;
  }

  .timeline-main {
    margin-top: 12px;
  }

  .timeline-location {
    margin-top: 8px;
  }

  .timeline-description {
    padding-bottom: 0;

    margin-top: 15px;
  }

  .timeline-arrow {
    grid-column: 2;
    grid-row: 1;
  }

  .experience-footer {
    flex-direction: column;
    align-items: flex-start;
  }


  /* THINKING */

  .thinking {
    padding-bottom: 90px;
  }

  .thinking-header {
    margin-top: 85px;
  }

  .featured-essay {
    margin-top: 90px;

    display: block;
  }

  .essay-content {
    margin-top: 60px;
  }

  .essay-meta {
    margin-top: 45px;

    display: flex;
    flex-direction: column;

    gap: 8px;
  }

  .essay-meta a {
    margin: 20px 0 0;
  }

  .article-grid {
    grid-template-columns: 1fr;
  }

  .article-card,
  .article-card:not(:first-child) {
    min-height: 420px;

    padding: 35px 0;

    border-right: 0;

    border-bottom:
      1px solid var(--line);
  }


  /* ABOUT */

  .about-image {
    height: 70vh;
  }

  .about-image img {
    object-position: center;
  }

  .image-caption {
    flex-direction: column;
    gap: 3px;
  }

  .about-content {
    padding-bottom: 90px;
  }

  .about-grid {
    margin-top: 85px;
  }


  /* CONTACT */

  .contact-section {
    padding-bottom: 90px;
  }

  .contact-heading {
    margin-top: 85px;
  }

  .contact-options {
    margin-top: 85px;
  }

  .contact-option {
    min-height: auto;

    padding: 28px 0;

    grid-template-columns:
      35px
      1fr
      25px;

    gap: 15px;
  }

  .contact-option:hover {
    padding-left: 0;
    padding-right: 0;

    background: transparent;
  }

  .contact-option h3 {
    font-size: 2.3rem;
  }


  /* FOOTER */

  .site-footer {
    padding-top: 55px;
  }

  .footer-top {
    min-height: 500px;

    grid-template-columns: 1fr;
  }

  .footer-nav {
    align-self: end;
  }

  .footer-bottom {
    flex-direction: column;
  }

}


/* ==========================================================
   REDUCED MOTION
========================================================== */

@media (prefers-reduced-motion:reduce) {

  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
  }

}
/* ==========================================================
   LOCAL IMAGE INTEGRATION — HOMEPAGE V1.2
   Keeps the original V1.1 visual system intact.
========================================================== */

.hero-portrait img {
  object-position: center 30%;
}

.project-card-large .project-image img {
  object-position: center 35%;
}

.case-image-placeholder,
.project-image-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 8px;
  padding: clamp(24px, 4vw, 56px);
  background: var(--dark);
  color: var(--light);
}

.case-image-placeholder span,
.project-image-placeholder span {
  font-family: var(--serif);
  font-size: clamp(2.4rem, 4.5vw, 5.5rem);
  line-height: .95;
  letter-spacing: -.035em;
}

.case-image-placeholder small,
.project-image-placeholder small {
  max-width: 360px;
  color: var(--light-muted);
  font-size: .67rem;
  line-height: 1.5;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.about-image img {
  filter: none;
  object-position: center 35%;
}


/* ==========================================================
   MULTI-PAGE SYSTEM + EDITORIAL TAGS
========================================================== */
.area-tags,.discipline-line,.project-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.area-tags span,.discipline-line .tag,.project-tags span{display:inline-flex;align-items:center;width:fit-content;padding:6px 10px 5px;border:1px solid rgba(23,23,20,.22);border-radius:2px;color:var(--muted);font-size:.58rem;font-weight:500;line-height:1;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}.discipline-line{max-width:none}.discipline-line .tag{color:var(--ink);border-color:rgba(23,23,20,.28);background:rgba(255,255,255,.18)}.project-bottom{align-items:flex-start}.project-bottom .project-tags{max-width:70%}
.inner-hero,.case-hero{padding:48px var(--page-padding) clamp(90px,12vw,170px);border-bottom:1px solid var(--line)}.inner-hero-grid{display:grid;grid-template-columns:1.45fr .55fr;gap:clamp(50px,9vw,150px);align-items:end;margin-top:clamp(70px,10vw,145px)}.inner-hero h1,.case-hero h1{font-family:var(--serif);font-size:var(--type-section);font-weight:400;line-height:.92;letter-spacing:-.04em}.inner-hero h1 em,.case-hero h1 em{font-weight:400}.inner-hero-grid>p{max-width:500px;color:var(--muted);font-size:1rem;line-height:1.75}.portfolio-section{padding:clamp(80px,10vw,150px) var(--page-padding)}.soft-section{background:var(--canvas-light)}.portfolio-list{margin-top:35px;border-top:1px solid var(--line)}.portfolio-card{padding:45px 0 55px;border-bottom:1px solid var(--line)}.portfolio-card h2{max-width:980px;margin:16px 0 28px;font-family:var(--serif);font-size:var(--type-feature);font-weight:400;line-height:.98;letter-spacing:-.025em}.portfolio-card .project-tags{margin-bottom:30px}.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:35px}.portfolio-grid .portfolio-card{border-top:1px solid var(--line)}.portfolio-grid .portfolio-card h2{font-size:var(--type-project)}.compact-work-list{margin-top:35px;border-top:1px solid var(--line)}.compact-work-list a{display:grid;grid-template-columns:60px .7fr 1.5fr 30px;gap:25px;padding:28px 0;border-bottom:1px solid var(--line);align-items:center}.compact-work-list span{font-size:.65rem;color:var(--muted)}.compact-work-list strong{font-family:var(--serif);font-size:1.5rem;font-weight:400}.compact-work-list em{font-style:normal;color:var(--muted);font-size:.85rem}.case-hero{padding-top:48px}.case-hero>.eyebrow{margin-top:clamp(70px,9vw,130px)}.case-hero h1{max-width:1150px;margin:18px 0 38px}.case-meta-grid{display:grid;grid-template-columns:repeat(3,1fr);padding:0 var(--page-padding);border-bottom:1px solid var(--line)}.case-meta-grid>div{padding:30px 25px 34px 0;border-right:1px solid var(--line)}.case-meta-grid>div+div{padding-left:30px}.case-meta-grid span{display:block;margin-bottom:8px;color:var(--muted);font-size:.6rem;text-transform:uppercase;letter-spacing:.1em}.case-meta-grid strong{font-size:.9rem;font-weight:500}.case-story{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(60px,10vw,170px);padding:clamp(90px,12vw,170px) var(--page-padding);border-bottom:1px solid var(--line)}.case-story h2{max-width:520px;margin-top:15px;font-family:var(--serif);font-size:var(--type-project);font-weight:400;line-height:1}.case-story>p{max-width:680px;color:var(--muted);font-size:1.08rem;line-height:1.85}.case-story.outcome{background:var(--dark);color:var(--light)}.case-story.outcome>p{color:var(--light-muted)}.case-metrics{display:grid;grid-template-columns:repeat(3,1fr);background:var(--canvas-light);padding:0 var(--page-padding)}.case-metrics>div{padding:60px 0;border-right:1px solid var(--line);text-align:center}.case-metrics strong{display:block;font-family:var(--serif);font-size:clamp(3rem,6vw,6rem);font-weight:400;line-height:.9}.case-metrics span{display:block;margin-top:12px;color:var(--muted);font-size:.62rem;text-transform:uppercase;letter-spacing:.1em}.case-capabilities{padding:70px var(--page-padding)}.case-capabilities .project-tags{margin-top:20px}.next-case{display:flex;justify-content:space-between;align-items:end;gap:30px;padding:55px var(--page-padding);background:var(--dark);color:var(--light)}.next-case>span{color:var(--light-muted);font-size:.65rem;text-transform:uppercase;letter-spacing:.1em}.next-case a{font-family:var(--serif);font-size:clamp(2rem,4vw,4rem)}.experience-page{padding:0 var(--page-padding)}.experience-page article{display:grid;grid-template-columns:.45fr 1fr 1.3fr;gap:50px;padding:50px 0;border-bottom:1px solid var(--line)}.experience-page article>span{font-size:.62rem;color:var(--muted);letter-spacing:.08em}.experience-page h2{font-family:var(--serif);font-size:2.2rem;font-weight:400}.experience-page p{color:var(--muted);line-height:1.7}.experience-page .project-tags{margin-top:20px}.capability-section,.principles{padding:clamp(80px,10vw,140px) var(--page-padding);background:var(--canvas-light)}.capability-section .project-tags{margin-top:30px}.about-story{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(60px,10vw,160px);padding:clamp(80px,10vw,150px) var(--page-padding);align-items:start}.about-story img{width:100%;aspect-ratio:4/5;object-fit:cover}.about-story p{max-width:650px;margin-bottom:25px;color:var(--muted);font-size:1.08rem;line-height:1.85}.about-story blockquote{margin-top:60px;font-family:var(--serif);font-size:clamp(2.3rem,4vw,4.6rem);line-height:1}.principle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:35px}.principle-grid article{padding-top:25px;border-top:1px solid var(--line)}.principle-grid span{font-size:.65rem;color:var(--muted)}.principle-grid h2{margin:25px 0 12px;font-family:var(--serif);font-size:2rem;font-weight:400}.principle-grid p{color:var(--muted)}.thinking-index{padding:clamp(80px,10vw,150px) var(--page-padding)}.thinking-feature{padding-bottom:70px;border-bottom:1px solid var(--line)}.thinking-feature>span,.thinking-list article>span{font-size:.62rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.thinking-feature h2{max-width:1000px;margin:25px 0;font-family:var(--serif);font-size:var(--type-feature);font-weight:400;line-height:1}.thinking-feature p{max-width:680px;color:var(--muted);line-height:1.8}.thinking-feature .coming{display:inline-block;margin-top:30px;color:var(--accent)}.thinking-list{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:70px}.thinking-list article{padding-top:25px;border-top:1px solid var(--line)}.thinking-list h2{margin:20px 0;font-family:var(--serif);font-size:2rem;font-weight:400;line-height:1.05}.thinking-list p{color:var(--muted);line-height:1.7}.contact-page{padding:0 var(--page-padding) clamp(100px,12vw,180px)}.contact-page>a{display:grid;grid-template-columns:60px 1fr 40px;gap:35px;padding:40px 0;border-bottom:1px solid var(--line);align-items:center}.contact-page>a>span{font-size:.65rem;color:var(--muted)}.contact-page h2{font-family:var(--serif);font-size:clamp(2rem,3vw,3.6rem);font-weight:400}.contact-page p{margin-top:8px;color:var(--muted)}.contact-page b{font-size:1.4rem;font-weight:400;transition:transform .2s}.contact-page a:hover b{transform:translate(4px,-4px)}
@media(max-width:760px){.inner-hero-grid,.case-story,.about-story{grid-template-columns:1fr;gap:35px}.portfolio-grid,.principle-grid,.thinking-list{grid-template-columns:1fr}.compact-work-list a{grid-template-columns:35px 1fr 25px}.compact-work-list em{display:none}.case-meta-grid{grid-template-columns:1fr}.case-meta-grid>div{border-right:0;border-bottom:1px solid var(--line);padding:22px 0!important}.case-metrics{grid-template-columns:1fr}.case-metrics>div{border-right:0;border-bottom:1px solid var(--line);padding:40px 0}.experience-page article{grid-template-columns:1fr;gap:15px}.next-case{align-items:flex-start;flex-direction:column}.portfolio-card h2{font-size:var(--type-project)}}


/* ==========================================================
   V1.3 — RICH INNER PAGES / EDITORIAL IMAGE SYSTEM
========================================================== */
.about-photo-led,.experience-opening,.public-ideas,.experience-gallery,.education-block,.cv-download{padding:clamp(70px,8vw,130px) var(--page-padding);border-top:1px solid var(--line)}
.about-photo-led{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(45px,8vw,120px);align-items:start}.photo-tall img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:grayscale(100%)}.about-story{max-width:720px}.about-story h2,.collage-copy h2,.public-ideas h2,.experience-opening h2,.experience-gallery h2,.education-block h2,.cv-download h2,.thinking-note h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,4.5vw,5rem);line-height:.98;margin:0 0 28px}.about-story p,.collage-copy p,.public-ideas p,.experience-opening p,.experience-gallery p,.cv-download p{color:var(--muted);font-size:1rem;line-height:1.75;max-width:650px}.chapter-grid{padding:0 var(--page-padding) clamp(80px,9vw,140px);display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}.chapter-grid article{background:var(--canvas);padding:42px 34px}.chapter-grid span,.eyebrow{font-size:.66rem;letter-spacing:.11em;text-transform:uppercase;color:var(--accent)}.chapter-grid h3{font-family:var(--serif);font-size:2rem;font-weight:400;margin:42px 0 14px}.chapter-grid p{color:var(--muted);line-height:1.65}.about-collage{padding:clamp(80px,10vw,150px) var(--page-padding);display:grid;grid-template-columns:.75fr .55fr 1fr;gap:24px;align-items:end;border-top:1px solid var(--line)}.about-collage figure img{width:100%;height:100%;object-fit:cover}.about-collage figure:first-child{height:560px}.about-collage figure:nth-child(2){height:390px}.collage-copy{padding-left:30px}.public-ideas{display:grid;grid-template-columns:1fr .8fr;gap:clamp(50px,8vw,120px);align-items:center;background:var(--ink);color:var(--canvas)}.public-ideas p{color:rgba(242,239,232,.68)}.public-ideas figure img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:grayscale(100%)}.public-ideas .eyebrow{color:#d7a9ad}.public-ideas.compact{margin-top:0}.principles{padding:clamp(80px,9vw,140px) var(--page-padding)}.principle-list{margin-top:45px;border-top:1px solid var(--line)}.principle-list article{display:grid;grid-template-columns:70px 1fr 1fr;gap:30px;padding:25px 0;border-bottom:1px solid var(--line);align-items:baseline}.principle-list h3{font-family:var(--serif);font-size:2rem;font-weight:400;margin:0}.principle-list p{color:var(--muted);margin:0}
.editorial-feature{padding:0 var(--page-padding) clamp(90px,10vw,150px);display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(45px,7vw,100px);align-items:end}.editorial-feature figure img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:grayscale(100%)}.editorial-feature h2{font-family:var(--serif);font-size:clamp(2.7rem,5vw,5.5rem);font-weight:400;line-height:.96;margin:20px 0}.editorial-feature p{color:var(--muted);line-height:1.7}.article-meta{display:flex;gap:20px;margin-top:30px;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.journal-grid{padding:0 var(--page-padding) clamp(100px,10vw,160px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,90px)}.journal-card figure{margin-bottom:22px}.journal-card img{width:100%;aspect-ratio:4/3;object-fit:cover}.journal-card.offset{margin-top:110px}.journal-card.wide{grid-column:1/-1;display:grid;grid-template-columns:1.1fr .9fr;column-gap:60px;align-items:end}.journal-card.wide figure{grid-row:1/5}.journal-card>span{font-size:.66rem;letter-spacing:.09em;text-transform:uppercase;color:var(--accent)}.journal-card h2{font-family:var(--serif);font-size:clamp(2rem,3.5vw,3.8rem);font-weight:400;line-height:1;margin:14px 0}.journal-card p{color:var(--muted);line-height:1.65}.thinking-note{padding:clamp(80px,9vw,130px) var(--page-padding);display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;border-top:1px solid var(--line)}.question-list p{font-family:var(--serif);font-size:clamp(1.5rem,2.6vw,2.7rem);line-height:1.08;padding:22px 0;border-bottom:1px solid var(--line);margin:0}
.experience-opening{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(50px,8vw,120px);align-items:center}.experience-opening figure img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:grayscale(100%)}.cv-section{padding:clamp(80px,9vw,140px) var(--page-padding);border-top:1px solid var(--line)}.cv-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:45px}.cv-timeline{border-top:1px solid var(--line)}.cv-timeline article{display:grid;grid-template-columns:180px 1fr;gap:50px;padding:38px 0;border-bottom:1px solid var(--line)}.cv-date{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}.cv-timeline h2{font-family:var(--serif);font-size:clamp(2rem,3.5vw,3.7rem);font-weight:400;margin:0 0 5px}.cv-role{font-size:.75rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin-bottom:18px}.cv-timeline p{max-width:760px;line-height:1.65;color:var(--muted)}.experience-gallery{display:grid;grid-template-columns:1.1fr .65fr 1fr;gap:24px;align-items:end}.experience-gallery figure img{width:100%;height:100%;object-fit:cover}.experience-gallery .large{height:570px}.experience-gallery figure:not(.large){height:390px}.experience-gallery>div{padding-left:25px}.industry-band{padding:28px var(--page-padding);border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:10px}.industry-band span{border:1px solid rgba(23,23,20,.2);padding:7px 11px;font-size:.6rem;text-transform:uppercase;letter-spacing:.08em}.achievements{padding:clamp(80px,9vw,140px) var(--page-padding)}.achievement-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);margin-top:45px}.achievement-grid article{background:var(--canvas);padding:38px 28px}.achievement-grid strong{font-family:var(--serif);font-size:4rem;font-weight:400;color:var(--accent)}.achievement-grid h3{font-family:var(--serif);font-size:1.8rem;font-weight:400;margin:8px 0}.achievement-grid p{color:var(--muted);line-height:1.6}.education-block{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px}.education-list article{display:grid;grid-template-columns:70px 1fr;gap:25px;padding:22px 0;border-bottom:1px solid var(--line)}.education-list>article>span{font-family:var(--serif);font-size:1.8rem;color:var(--accent)}.education-list h3{margin:0 0 5px;font-weight:500}.education-list p{margin:0;color:var(--muted)}.cv-download{display:flex;justify-content:space-between;gap:60px;align-items:end}.button-outline{display:inline-flex;border:1px solid var(--ink);padding:13px 18px;font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;white-space:nowrap}
.work-visual-grid{padding:0 var(--page-padding) clamp(100px,10vw,160px);display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(45px,6vw,90px) 30px}.work-visual-card a{display:block}.work-visual-card figure{overflow:hidden;background:#ddd}.work-visual-card img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .5s ease;filter:grayscale(18%)}.work-visual-card:hover img{transform:scale(1.025)}.work-visual-card.feature:first-child{grid-column:1/-1}.work-visual-card.feature:first-child img{aspect-ratio:2/1}.work-card-copy{padding-top:18px;border-top:1px solid var(--line);margin-top:14px}.work-card-copy>span{font-size:.63rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}.work-card-copy h2{font-family:var(--serif);font-size:clamp(2rem,3.5vw,3.7rem);font-weight:400;margin:12px 0 7px}.work-card-copy p{max-width:620px;color:var(--muted);line-height:1.55}.work-card-copy b{display:inline-block;margin-top:15px;font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;font-weight:500}.work-note{padding:30px var(--page-padding);border-top:1px solid var(--line);color:var(--muted);font-size:.78rem}.case-visual{padding:0 var(--page-padding) clamp(80px,8vw,120px);position:relative}.case-visual img{width:100%;max-height:680px;object-fit:cover;filter:grayscale(15%)}.case-visual span{display:block;margin-top:8px;font-size:.58rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.home-tedx{padding:clamp(80px,9vw,140px) var(--page-padding);background:var(--ink);color:var(--canvas)}.home-tedx .section-label{border-color:rgba(255,255,255,.2)}.tedx-grid{display:grid;grid-template-columns:1fr .9fr;gap:clamp(50px,8vw,120px);align-items:center;margin-top:50px}.tedx-grid h2{font-family:var(--serif);font-size:clamp(3rem,6vw,6.5rem);font-weight:400;line-height:.92;margin:15px 0 25px}.tedx-grid p{color:rgba(242,239,232,.68);max-width:600px;line-height:1.7}.tedx-grid figure img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:grayscale(100%)}.home-tedx .project-tags span{border-color:rgba(255,255,255,.28);color:var(--canvas)}.text-link.light{color:var(--canvas);margin-top:28px;display:inline-flex}
@media(max-width:850px){.about-photo-led,.about-collage,.public-ideas,.editorial-feature,.thinking-note,.experience-opening,.experience-gallery,.education-block,.tedx-grid{grid-template-columns:1fr}.chapter-grid,.achievement-grid{grid-template-columns:1fr}.about-collage figure:first-child,.experience-gallery .large{height:460px}.about-collage figure:nth-child(2),.experience-gallery figure:not(.large){height:360px}.collage-copy,.experience-gallery>div{padding-left:0}.journal-grid,.work-visual-grid{grid-template-columns:1fr}.journal-card.offset{margin-top:0}.journal-card.wide{grid-column:auto;display:block}.cv-timeline article{grid-template-columns:1fr;gap:10px}.cv-download{align-items:flex-start;flex-direction:column}.principle-list article{grid-template-columns:45px 1fr}.principle-list p{grid-column:2}.work-visual-card.feature:first-child{grid-column:auto}.work-visual-card.feature:first-child img{aspect-ratio:16/10}}


/* ==========================================================
   V1.3.1 — LAYOUT REFINEMENT PASS
   Restores the spacing discipline of the original homepage.
========================================================== */

/* The V1.3 About copy reused an older .about-story class that already
   carried its own grid + page padding. Reset it when nested in the new
   photo-led composition so spacing is not doubled/muddled. */
.about-photo-led .about-story {
  display: block;
  padding: 0;
  max-width: 700px;
}

/* Keep long editorial sections aligned to the same site gutters. */
.about-photo-led,
.about-collage,
.public-ideas,
.editorial-feature,
.journal-grid,
.thinking-note,
.experience-opening,
.experience-gallery,
.education-block,
.cv-download,
.cv-section,
.achievements,
.work-visual-grid,
.work-note,
.case-visual,
.home-tedx,
.industry-band,
.principles,
.chapter-grid {
  padding-left: var(--page-padding);
  padding-right: var(--page-padding);
}

/* More breathing room in the new editorial compositions. */
.about-photo-led,
.experience-opening {
  gap: clamp(56px, 7vw, 112px);
}

.about-collage,
.experience-gallery {
  gap: clamp(18px, 2vw, 30px);
}

.collage-copy,
.experience-gallery > div {
  padding-left: clamp(8px, 1.5vw, 24px);
}

/* Thinking: avoid the “cards crashing into one another” feeling. */
.editorial-feature {
  gap: clamp(56px, 7vw, 110px);
}

.journal-grid {
  column-gap: clamp(42px, 5vw, 78px);
  row-gap: clamp(72px, 8vw, 128px);
}

.journal-card.offset {
  margin-top: clamp(60px, 7vw, 100px);
}

.journal-card p,
.editorial-feature p,
.thinking-note .question-list {
  max-width: 620px;
}

/* Experience: clearer separation between chronology and supporting media. */
.cv-timeline article {
  grid-template-columns: minmax(135px, 180px) minmax(0, 1fr);
  gap: clamp(32px, 5vw, 72px);
  padding: 46px 0;
}

.experience-gallery {
  padding-top: clamp(80px, 9vw, 135px);
  padding-bottom: clamp(80px, 9vw, 135px);
}

.achievement-grid article {
  padding: clamp(28px, 3vw, 42px);
}

/* Work: stronger portfolio rhythm and less cramped copy. */
.work-visual-grid {
  column-gap: clamp(28px, 4vw, 58px);
  row-gap: clamp(72px, 8vw, 120px);
}

.work-card-copy {
  padding-top: 22px;
  margin-top: 16px;
}

.work-card-copy p {
  max-width: 560px;
}

/* TEDx: preserve the dark interruption but keep it editorial, not crowded. */
.home-tedx {
  padding-top: clamp(90px, 10vw, 150px);
  padding-bottom: clamp(90px, 10vw, 150px);
}

.tedx-grid {
  gap: clamp(60px, 8vw, 125px);
}

.tedx-grid > div {
  max-width: 700px;
}

/* Inner-page headings need room before content begins. */
.inner-hero-grid {
  gap: clamp(60px, 8vw, 130px);
}

/* Prevent oversized headings from visually touching the viewport edge
   on intermediate laptop widths. */
@media (min-width: 851px) and (max-width: 1180px) {
  :root { --page-padding: clamp(30px, 4.5vw, 54px); }
  .inner-hero-grid { grid-template-columns: 1.25fr .75fr; }
  .about-photo-led,
  .experience-opening,
  .public-ideas,
  .editorial-feature { gap: 48px; }
  .achievement-grid { grid-template-columns: repeat(2, 1fr); }
  .chapter-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
}

@media (max-width: 850px) {
  .about-photo-led .about-story { max-width: none; }
  .about-photo-led,
  .about-collage,
  .public-ideas,
  .editorial-feature,
  .thinking-note,
  .experience-opening,
  .experience-gallery,
  .education-block,
  .cv-download,
  .cv-section,
  .achievements,
  .work-visual-grid,
  .work-note,
  .case-visual,
  .home-tedx,
  .industry-band,
  .principles,
  .chapter-grid {
    padding-left: var(--page-padding);
    padding-right: var(--page-padding);
  }
  .journal-grid { row-gap: 68px; }
  .journal-card.offset { margin-top: 0; }
  .collage-copy,
  .experience-gallery > div { padding-left: 0; }
}

/* =========================================================
   V1.4 — WILLY'S EVIDENCE-LED CASE STUDY
========================================================= */
.case-hero.case-hero-expanded{padding-bottom:clamp(3rem,7vw,7rem)}
.case-hero-expanded h1{max-width:1080px}
.case-deck{max-width:780px;margin-top:2rem;font-size:clamp(1.1rem,1.5vw,1.35rem);line-height:1.6;color:var(--muted,#66645f)}
.case-proof-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(23,23,20,.16);border-top:1px solid rgba(23,23,20,.16);border-bottom:1px solid rgba(23,23,20,.16)}
.case-proof-strip>div{background:var(--paper,#f2efe8);padding:2rem clamp(1.25rem,3vw,3rem);min-height:150px;display:flex;flex-direction:column;justify-content:space-between}
.case-proof-strip span{font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted,#6d6a64)}
.case-proof-strip strong{font-family:"Instrument Serif",serif;font-weight:400;font-size:clamp(1.6rem,2.4vw,2.7rem);line-height:1.05;max-width:260px}
.case-chapter{padding:clamp(4rem,8vw,8rem) var(--page-pad,5vw);border-bottom:1px solid rgba(23,23,20,.14)}
.case-chapter-grid{display:grid;grid-template-columns:minmax(220px,.72fr) minmax(0,1.45fr);gap:clamp(3rem,8vw,9rem);max-width:1280px;margin:0 auto}
.case-chapter h2{font-family:"Instrument Serif",serif;font-size:clamp(2.5rem,5vw,5.2rem);font-weight:400;line-height:.98;margin:.5rem 0 0}
.case-copy{max-width:760px}
.case-copy p{font-size:clamp(1.03rem,1.25vw,1.18rem);line-height:1.75;margin:0 0 1.35rem}
.case-copy .lead{font-family:"Instrument Serif",serif;font-size:clamp(1.65rem,2.7vw,2.75rem);line-height:1.15;margin-bottom:2rem}
.case-findings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:rgba(23,23,20,.14);margin-top:2.5rem}
.case-finding{background:var(--paper,#f2efe8);padding:1.6rem}
.case-finding b{display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.65rem}
.case-finding p{font-size:.98rem;line-height:1.55;margin:0;color:var(--muted,#64615b)}
.case-artifact{padding:clamp(3rem,6vw,6rem) var(--page-pad,5vw);background:#171714;color:#f2efe8}
.case-artifact-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(280px,.7fr);gap:clamp(2rem,6vw,7rem);align-items:center}
.case-artifact figure{margin:0;overflow:hidden;background:#2a2925}
.case-artifact img{width:100%;display:block;max-height:720px;object-fit:cover}
.case-artifact-copy .eyebrow{color:#aaa79f}
.case-artifact-copy h2{font-family:"Instrument Serif",serif;font-size:clamp(2.5rem,4.8vw,5rem);font-weight:400;line-height:1;margin:.8rem 0 1.5rem}
.case-artifact-copy p{color:#c8c4ba;line-height:1.7;font-size:1.05rem}
.case-artifact-caption{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:#918e86;margin-top:1rem}
.case-system-flow{display:grid;grid-template-columns:repeat(5,1fr);gap:.7rem;margin-top:3rem;align-items:stretch}
.case-system-flow div{border:1px solid rgba(23,23,20,.22);padding:1.25rem;min-height:115px;display:flex;flex-direction:column;justify-content:space-between}
.case-system-flow small{font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted,#6d6a64)}
.case-system-flow strong{font-size:.95rem;line-height:1.35}
.case-quote{padding:clamp(5rem,10vw,10rem) var(--page-pad,5vw);background:#7a2f35;color:#f7f1e9}
.case-quote-inner{max-width:1180px;margin:0 auto}
.case-quote blockquote{font-family:"Instrument Serif",serif;font-size:clamp(2.4rem,5.5vw,5.8rem);line-height:1.02;margin:0;max-width:1100px}
.case-quote p{max-width:680px;margin:2rem 0 0 auto;font-size:1.05rem;line-height:1.7;color:#e8d9d6}
.case-results-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(23,23,20,.14);margin-top:2.5rem}
.case-result{background:var(--paper,#f2efe8);padding:1.7rem;min-height:170px}
.case-result strong{display:block;font-family:"Instrument Serif",serif;font-weight:400;font-size:1.9rem;margin-bottom:.8rem}
.case-result p{font-size:.95rem;line-height:1.55;margin:0;color:var(--muted,#64615b)}
.case-disclosure{font-size:.78rem;line-height:1.55;color:var(--muted,#6d6a64);margin-top:2rem;max-width:780px}
.featured-case .featured-image.willys-feature{background:#171714;position:relative}
.featured-case .featured-image.willys-feature img{filter:none}
.willys-feature-badge{position:absolute;left:1rem;bottom:1rem;background:#f2efe8;color:#171714;padding:.55rem .75rem;font-size:.7rem;text-transform:uppercase;letter-spacing:.1em}
@media(max-width:900px){.case-proof-strip{grid-template-columns:repeat(2,1fr)}.case-chapter-grid,.case-artifact-grid{grid-template-columns:1fr}.case-system-flow{grid-template-columns:1fr 1fr}.case-results-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.case-proof-strip,.case-findings,.case-results-grid,.case-system-flow{grid-template-columns:1fr}.case-proof-strip>div{min-height:120px}.case-chapter{padding-left:1.25rem;padding-right:1.25rem}.case-artifact,.case-quote{padding-left:1.25rem;padding-right:1.25rem}}

/* ==========================================================
   V1.5 — WILLY'S PUBLIC EVIDENCE / RECONSTRUCTED ARTIFACTS
========================================================== */
.evidence-kicker{font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--light-muted);margin-bottom:28px}.evidence-grid-impact .number{font-size:clamp(3.8rem,6.6vw,7.2rem);white-space:nowrap}.evidence-grid-impact .number span{font-size:.42em;vertical-align:middle;opacity:.5}.evidence-word{font-family:var(--serif);font-size:clamp(3.6rem,6vw,6.8rem);line-height:.9;letter-spacing:-.05em}.evidence-item-primary{grid-column:auto}.willys-system-preview{display:block!important;background:#151515!important;color:#f3eee6!important;min-height:620px;padding:34px!important;text-decoration:none;overflow:hidden}.system-preview-top,.system-preview-bottom{display:flex;justify-content:space-between;gap:20px;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase}.system-preview-top{padding-bottom:24px;border-bottom:1px solid rgba(255,255,255,.18)}.system-preview-core{max-width:860px;margin:60px auto 50px}.system-node{border:1px solid rgba(255,255,255,.28);padding:22px 26px;display:grid;grid-template-columns:48px 1fr auto;gap:18px;align-items:center}.system-node small,.system-branches small{opacity:.5}.system-node strong{font-family:var(--serif);font-size:1.55rem;font-weight:400}.system-node span,.system-branches span{font-size:.72rem;opacity:.62}.system-node.operations{background:#f3eee6;color:#151515;border-color:#f3eee6}.system-connector{text-align:center;font-size:1.5rem;padding:10px}.system-branches{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}.system-branches>div{border:1px solid rgba(255,255,255,.22);padding:24px 18px;display:flex;flex-direction:column;gap:10px}.system-branches strong{font-family:var(--serif);font-size:1.2rem;font-weight:400}.system-preview-bottom{padding-top:24px;border-top:1px solid rgba(255,255,255,.18);justify-content:center;font-size:.76rem}.system-preview-bottom span{opacity:.4}.case-artifact-designed .case-artifact-grid{align-items:stretch}.artifact-system-map,.artifact-report-architecture,.artifact-accountability{min-height:500px;background:#171717;color:#f5f0e8;padding:34px;display:flex;flex-direction:column;justify-content:center}.artifact-label{position:absolute;align-self:flex-start;top:auto;margin-top:-420px;font-size:.61rem;letter-spacing:.14em;opacity:.52}.artifact-flow-row{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:12px;align-items:center;margin:8px 0}.artifact-flow-row span{border:1px solid rgba(255,255,255,.24);padding:18px 12px;text-align:center;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em}.artifact-flow-row b{opacity:.35}.artifact-output{margin-top:24px;background:#f5f0e8;color:#171717;padding:24px}.artifact-output small,.report-dashboard small{display:block;font-size:.58rem;letter-spacing:.12em;margin-bottom:8px}.artifact-output strong,.report-dashboard strong{font-family:var(--serif);font-size:1.5rem;font-weight:400}.report-inputs{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.report-inputs span{border:1px solid rgba(255,255,255,.22);padding:15px;font-size:.68rem;text-transform:uppercase;letter-spacing:.06em}.report-arrow{text-align:center;padding:15px;opacity:.45}.report-dashboard{background:#f5f0e8;color:#171717;padding:26px}.report-dashboard>div{margin-top:22px;display:flex;gap:14px;align-items:center;font-size:.62rem;text-transform:uppercase;letter-spacing:.06em}.report-dashboard i{display:inline-block;width:8px;height:8px;border:1px solid currentColor;border-radius:50%}.accountability-head,.accountability-row{display:grid;grid-template-columns:.8fr 1.7fr .65fr;gap:12px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.16)}.accountability-head{font-size:.56rem;letter-spacing:.1em;opacity:.45}.accountability-row b{font-family:var(--serif);font-size:1rem;font-weight:400}.accountability-row span,.accountability-row em{font-size:.68rem;opacity:.7;font-style:normal}.accountability-rule{margin-top:28px;border:1px solid rgba(255,255,255,.25);padding:20px;font-family:var(--serif);font-size:1.4rem;text-align:center}
@media(max-width:800px){.willys-system-preview{min-height:auto;padding:22px!important}.system-preview-top{font-size:.55rem}.system-preview-core{margin:35px auto}.system-node{grid-template-columns:34px 1fr;padding:18px}.system-node span{grid-column:2}.system-branches{grid-template-columns:1fr}.system-preview-bottom{flex-wrap:wrap}.artifact-system-map,.artifact-report-architecture,.artifact-accountability{min-height:430px;padding:22px}.artifact-label{position:static;margin:0 0 28px}.artifact-flow-row{grid-template-columns:1fr}.artifact-flow-row b{transform:rotate(90deg);text-align:center}.accountability-head{display:none}.accountability-row{grid-template-columns:1fr}.evidence-grid-impact .number{white-space:normal}}


/* ==========================================================
   V1.6 — COMPACT HOMEPAGE / DIFFERENT SEATS
========================================================== */
.different-seats{padding:clamp(76px,8vw,118px) var(--page-padding);border-bottom:1px solid var(--line)}
.seats-heading{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(45px,8vw,120px);align-items:end;margin:clamp(42px,6vw,76px) 0 38px}
.seats-heading .eyebrow{grid-column:1/-1;margin:0}
.seats-heading h2{font-family:var(--serif);font-size:clamp(3.1rem,6.2vw,6.8rem);font-weight:400;line-height:.92;letter-spacing:-.04em;margin:0}
.seats-heading h2 em{font-weight:400}
.seats-heading>p:last-child{max-width:540px;color:var(--muted);line-height:1.72;margin:0 0 6px}
.seats-grid{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.seats-grid article{min-height:230px;padding:24px 18px 26px 0;border-right:1px solid var(--line);display:flex;flex-direction:column}
.seats-grid article:not(:first-child){padding-left:18px}.seats-grid article:last-child{border-right:0}
.seats-grid article>span{font-size:.58rem;letter-spacing:.1em;color:var(--accent)}
.seats-grid article>p{margin:auto 0 10px;font-size:.62rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.seats-grid h3{font-family:var(--serif);font-size:clamp(1.2rem,1.55vw,1.75rem);font-weight:400;line-height:1.05;margin:0}
.seats-foot{display:grid;grid-template-columns:120px 1fr;gap:30px;padding-top:18px;font-size:.68rem}
.seats-foot span{text-transform:uppercase;letter-spacing:.1em;color:var(--accent)}.seats-foot p{margin:0;color:var(--muted)}
.experience-compact{padding:clamp(80px,8vw,120px) var(--page-padding)}
.experience-compact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(60px,9vw,140px);margin-top:50px}
.experience-compact-copy h2{font-family:var(--serif);font-size:clamp(3rem,5.7vw,6rem);font-weight:400;line-height:.93;margin:14px 0 24px}.experience-compact-copy h2 em{font-weight:400}.experience-compact-copy>p{max-width:610px;color:var(--light-muted);line-height:1.7}.experience-compact-copy .light-link{margin-top:28px;display:inline-flex}
.experience-snapshot{border-top:1px solid rgba(255,255,255,.2)}.experience-snapshot article{display:grid;grid-template-columns:90px 1fr;gap:22px;padding:25px 0;border-bottom:1px solid rgba(255,255,255,.2)}.experience-snapshot article>span{font-size:.58rem;letter-spacing:.1em;color:var(--light-muted)}.experience-snapshot h3{font-family:var(--serif);font-size:1.65rem;font-weight:400;margin:0 0 4px}.experience-snapshot p{margin:0;color:var(--light-muted);font-size:.76rem}
.home-tedx-compact{padding-top:clamp(76px,8vw,115px);padding-bottom:clamp(76px,8vw,115px)}.home-tedx-compact .tedx-grid{margin-top:36px}.home-tedx-compact .tedx-grid h2{font-size:clamp(3rem,5.7vw,6rem)}.home-tedx-compact .tedx-grid figure img{aspect-ratio:16/10}.tedx-credentials{margin:28px 0 0}.tedx-credentials p{margin:8px 0!important}.tedx-credentials span{display:inline-block;min-width:120px;color:var(--canvas);font-size:.65rem;text-transform:uppercase;letter-spacing:.08em}
.thinking-compact{padding-top:clamp(76px,8vw,115px);padding-bottom:clamp(76px,8vw,115px)}.thinking-compact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(60px,9vw,140px);margin-top:44px}.thinking-compact h2{font-family:var(--serif);font-size:clamp(3rem,5.7vw,6rem);font-weight:400;line-height:.93;margin:14px 0}.thinking-compact h2 em{font-weight:400}.thinking-links{border-top:1px solid var(--line)}.thinking-links>a{display:grid;grid-template-columns:80px 1fr 30px;gap:18px;align-items:center;padding:23px 0;border-bottom:1px solid var(--line);text-decoration:none}.thinking-links>a>span{font-size:.58rem;text-transform:uppercase;letter-spacing:.09em;color:var(--accent)}.thinking-links h3{font-family:var(--serif);font-size:clamp(1.35rem,2vw,2.1rem);font-weight:400;margin:0}.thinking-links b{font-weight:400;text-align:right}.thinking-links>div{padding-top:22px}
.about-compact{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(60px,9vw,140px);padding:clamp(80px,8vw,120px) var(--page-padding);align-items:center}.about-compact-image{margin:0}.about-compact-image img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:grayscale(100%)}.about-compact-copy .section-label{margin-bottom:42px}.about-compact-copy h2{font-family:var(--serif);font-size:clamp(3rem,5.4vw,5.8rem);font-weight:400;line-height:.94;margin:14px 0 25px}.about-compact-copy h2 em{font-weight:400}.about-compact-copy>p:not(.eyebrow){max-width:650px;color:var(--muted);line-height:1.72}.about-compact-copy .text-link{margin-top:20px;display:inline-flex}
@media(max-width:1100px){.seats-grid{grid-template-columns:repeat(3,1fr)}.seats-grid article:nth-child(3){border-right:0}.seats-grid article:nth-child(-n+3){border-bottom:1px solid var(--line)}}
@media(max-width:800px){.seats-heading,.experience-compact-grid,.thinking-compact-grid,.about-compact{grid-template-columns:1fr}.seats-heading .eyebrow{grid-column:auto}.seats-grid{grid-template-columns:repeat(2,1fr)}.seats-grid article:nth-child(3){border-right:1px solid var(--line)}.seats-grid article:nth-child(even){border-right:0}.seats-grid article{border-bottom:1px solid var(--line);min-height:190px}.seats-grid article:nth-last-child(-n+2){border-bottom:0}.seats-foot{grid-template-columns:1fr;gap:7px}.experience-snapshot{margin-top:10px}.thinking-links>a{grid-template-columns:65px 1fr 24px}.about-compact-image{max-width:520px}.contact-options{margin-top:35px}}
@media(max-width:520px){.seats-grid{grid-template-columns:1fr}.seats-grid article,.seats-grid article:nth-child(3),.seats-grid article:nth-child(even){border-right:0;border-bottom:1px solid var(--line);padding-left:0}.seats-grid article:last-child{border-bottom:0}.seats-grid article{min-height:150px}.thinking-links>a{grid-template-columns:1fr 25px}.thinking-links>a>span{grid-column:1/-1}.thinking-links h3{grid-column:1}.thinking-links b{grid-column:2;grid-row:2}}

/* ==========================================================
   V1.7 — HOMEPAGE CHAPTER RHYTHM
   Ivory · Stone · Charcoal · Burgundy
   Creates clear visual chapter changes without adding a new palette.
========================================================== */

:root{
  --stone:#e8e3da;
  --burgundy-deep:#6f2930;
  --dark-warm:#181715;
}

/* 01 — HERO / IVORY */
.hero{
  background:var(--canvas);
}

/* 02 — DIFFERENT SEATS / STONE */
.different-seats{
  background:var(--stone);
  border-bottom:0;
}
.different-seats .seats-grid{
  border-color:rgba(23,23,20,.19);
}
.different-seats .seats-grid article{
  border-color:rgba(23,23,20,.19);
}

/* 03 — WHAT I WORK ON / IVORY */
.work-areas{
  background:var(--canvas);
}

/* 04 — SELECTED WORK / CHARCOAL */
.selected-work{
  background:var(--dark-warm);
  color:var(--light);
}
.selected-work .section-label,
.selected-work .eyebrow,
.selected-work .case-meta,
.selected-work .case-description p,
.selected-work .case-stat span,
.selected-work .project-index,
.selected-work .project-bottom{
  color:rgba(244,241,233,.60);
}
.selected-work .section-label{
  border-color:rgba(244,241,233,.18);
}
.selected-work .work-heading-row h2 em{
  color:#c98b91;
}
.selected-work .text-link,
.selected-work .project-bottom a{
  color:var(--light);
}
.selected-work .text-link::after{
  background:var(--light);
}
.selected-work .project-bottom{
  border-color:rgba(244,241,233,.18);
}
.selected-work .project-tags span,
.selected-work .case-meta span{
  color:rgba(244,241,233,.72);
  border-color:rgba(244,241,233,.25);
}
.selected-work .project-image{
  background:#24231f;
}
.selected-work .willys-system-preview{
  border:1px solid rgba(244,241,233,.18);
  background:#11110f!important;
}
.selected-work .willys-feature-badge{
  background:var(--light);
  color:var(--ink);
}

/* 05 — EXPERIENCE / RETURN TO IVORY */
.experience.experience-compact{
  background:var(--canvas);
  color:var(--ink);
  border-bottom:0;
}
.experience.experience-compact .section-label,
.experience.experience-compact .eyebrow,
.experience.experience-compact .experience-compact-copy>p,
.experience.experience-compact .experience-snapshot article>span,
.experience.experience-compact .experience-snapshot p{
  color:var(--muted);
}
.experience.experience-compact .section-label,
.experience.experience-compact .experience-snapshot,
.experience.experience-compact .experience-snapshot article{
  border-color:var(--line);
}
.experience.experience-compact .light-link{
  color:var(--ink);
  border-color:var(--ink);
}

/* 06 — IDEAS IN PUBLIC / BURGUNDY */
.home-tedx.home-tedx-compact{
  background:var(--burgundy-deep);
  color:#f7f1e9;
}
.home-tedx.home-tedx-compact .section-label{
  color:rgba(247,241,233,.62);
  border-color:rgba(247,241,233,.22);
}
.home-tedx.home-tedx-compact .eyebrow,
.home-tedx.home-tedx-compact .tedx-grid p{
  color:rgba(247,241,233,.68);
}
.home-tedx.home-tedx-compact .tedx-credentials span{
  color:#f7f1e9;
}
.home-tedx.home-tedx-compact .text-link.light{
  color:#f7f1e9;
}
.home-tedx.home-tedx-compact figure{
  background:#4e1e23;
}
.home-tedx.home-tedx-compact figure img{
  filter:grayscale(100%) contrast(1.03);
}

/* 07 — THINKING / STONE */
.thinking.thinking-compact{
  background:var(--stone);
}
.thinking.thinking-compact .thinking-links,
.thinking.thinking-compact .thinking-links>a{
  border-color:rgba(23,23,20,.19);
}

/* 08 — ABOUT / IVORY */
.about.about-compact{
  background:var(--canvas);
}

/* 09 — CONTACT / CHARCOAL CLOSE */
.contact-section{
  background:var(--dark-warm);
  color:var(--light);
}
.contact-section .section-label,
.contact-section .contact-heading p,
.contact-section .contact-option p,
.contact-section .contact-option span{
  color:rgba(244,241,233,.60);
}
.contact-section .section-label,
.contact-section .contact-options,
.contact-section .contact-option{
  border-color:rgba(244,241,233,.18);
}
.contact-section .contact-option h3,
.contact-section .contact-option .contact-arrow,
.contact-section .text-link{
  color:var(--light);
}
.contact-section .contact-option:hover{
  background:rgba(255,255,255,.045);
}

/* Keep chapter transitions crisp; avoid accidental double rules. */
.different-seats,
.work-areas,
.selected-work,
.experience.experience-compact,
.home-tedx.home-tedx-compact,
.thinking.thinking-compact,
.about.about-compact,
.contact-section{
  position:relative;
}

@media(max-width:800px){
  .selected-work .project-tags span{color:rgba(244,241,233,.72)}
}

/* ==========================================================
   V1.7.1 — FOOTER CONTRAST
   Keep 09 / Let's Talk as the charcoal closing CTA, then shift
   the site footer into the brand's deep burgundy so the two
   chapters no longer read as one continuous dark block.
========================================================== */
.site-footer{
  background:#5a2026;
  color:#f7f1e9;
  border-top:1px solid rgba(247,241,233,.20);
}
.site-footer .footer-top > div:first-child p,
.site-footer .footer-nav span,
.site-footer .footer-bottom{
  color:rgba(247,241,233,.62);
}
.site-footer .footer-bottom{
  border-top-color:rgba(247,241,233,.20);
}
.site-footer a{
  color:#f7f1e9;
}

/* ==========================================================
   V2 — documented body of work
   ========================================================== */
:root{--v2-ink:#171714;--v2-paper:#f5f0e8;--v2-sand:#e9dfd1;--v2-moss:#26342d;--v2-blue:#dce6e6;--v2-gold:#b98b3e}
.homepage-v2 .hero{background:#f6f1e9}
.homepage-v2 .selected-work{background:#ece4d8}
.homepage-v2 .career-evidence{background:#18211d;color:#f7f2e9;padding:clamp(5rem,9vw,9rem) clamp(1.5rem,5vw,6rem)}
.homepage-v2 .career-evidence .section-label{color:#c9d0ca}
.evidence-intro{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(260px,.65fr);gap:6vw;align-items:end;margin:3rem 0 4rem}
.evidence-intro h2{font-family:'Instrument Serif',serif;font-size:clamp(3rem,6vw,6.5rem);font-weight:400;line-height:.93;margin:0;max-width:850px}.evidence-intro h2 em{font-weight:400}.evidence-intro p{font-size:1rem;line-height:1.7;max-width:520px;color:#c9d0ca}
.evidence-ledger{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.22);border-left:1px solid rgba(255,255,255,.22)}
.evidence-ledger article{min-height:210px;padding:2rem;border-right:1px solid rgba(255,255,255,.22);border-bottom:1px solid rgba(255,255,255,.22);display:flex;flex-direction:column;justify-content:space-between}.evidence-ledger small{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:#9fa9a2}.evidence-ledger h3{font-family:'Instrument Serif',serif;font-size:2rem;font-weight:400;margin:1.5rem 0 .7rem}.evidence-ledger p{margin:0;color:#c9d0ca;line-height:1.55;font-size:.9rem}
.home-proof{background:#f7f3ec;padding:clamp(5rem,9vw,9rem) clamp(1.5rem,5vw,6rem)}
.proof-head{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin:3rem 0}.proof-head h2{font-family:'Instrument Serif',serif;font-size:clamp(3rem,5vw,5.5rem);line-height:.95;font-weight:400;margin:0}.proof-head p{max-width:420px;line-height:1.6;color:#555}
.proof-mosaic{display:grid;grid-template-columns:1.15fr .85fr .75fr;grid-template-rows:330px 240px;gap:1rem}.proof-mosaic figure{margin:0;position:relative;overflow:hidden;background:#ddd}.proof-mosaic img{width:100%;height:100%;object-fit:cover;display:block}.proof-mosaic .proof-main{grid-row:1/3}.proof-mosaic .proof-wide{grid-column:2/4}.proof-mosaic figcaption{position:absolute;left:1rem;bottom:1rem;background:rgba(18,18,16,.88);color:#fff;padding:.65rem .8rem;font-size:.72rem;letter-spacing:.04em;max-width:80%}
.work-visual-card figure{background:#ded7cc}.work-visual-card figure img{transition:transform .5s ease}.work-visual-card a:hover figure img{transform:scale(1.02)}
.work-tier{padding:clamp(4.5rem,8vw,8rem) clamp(1.5rem,5vw,6rem)}.work-tier.alt{background:#eee6da}.work-tier-head{display:grid;grid-template-columns:1fr 1fr;gap:4rem;margin-bottom:3rem}.work-tier-head h2{font-family:'Instrument Serif',serif;font-size:clamp(2.8rem,5vw,5rem);font-weight:400;line-height:.98;margin:0}.work-tier-head p{max-width:560px;line-height:1.7;color:#555}
.archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.archive-card{border:1px solid #cfc6ba;background:#f8f4ee}.archive-card figure{height:280px;margin:0;overflow:hidden}.archive-card img{width:100%;height:100%;object-fit:cover}.archive-card div{padding:1.4rem}.archive-card small{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:#777}.archive-card h3{font-family:'Instrument Serif',serif;font-size:2rem;font-weight:400;margin:.5rem 0}.archive-card p{font-size:.9rem;line-height:1.55;color:#555}
.experience-photo-strip{display:grid;grid-template-columns:1.2fr .8fr;gap:1rem;padding:0 clamp(1.5rem,5vw,6rem) clamp(5rem,8vw,8rem);background:#f6f1e9}.experience-photo-strip figure{margin:0;height:430px;overflow:hidden}.experience-photo-strip img{width:100%;height:100%;object-fit:cover}.experience-photo-strip figure:last-child{height:330px;align-self:end}
.creative-foundations{padding:clamp(5rem,8vw,8rem) clamp(1.5rem,5vw,6rem);background:#e7ddd0}.creative-foundations-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:5vw;align-items:start}.creative-artifacts{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.creative-artifacts figure{margin:0;background:#111;min-height:300px;overflow:hidden}.creative-artifacts img{width:100%;height:100%;object-fit:cover}.creative-foundations h2{font-family:'Instrument Serif',serif;font-size:clamp(3rem,5vw,5rem);font-weight:400;line-height:.98;margin:.6rem 0 1.4rem}.creative-foundations p{line-height:1.7;color:#4e4a44}
.case-real-visual{padding:0 clamp(1.5rem,5vw,6rem) clamp(5rem,8vw,8rem);background:#f5f0e8}.case-real-visual-grid{display:grid;grid-template-columns:1fr .75fr;gap:1rem}.case-real-visual figure{margin:0;height:600px;overflow:hidden}.case-real-visual img{width:100%;height:100%;object-fit:cover}.case-real-visual .case-real-caption{padding:2.5rem;background:#1c231f;color:#eee;display:flex;flex-direction:column;justify-content:flex-end}.case-real-caption h2{font-family:'Instrument Serif',serif;font-size:3rem;font-weight:400;line-height:1;margin:.5rem 0 1rem}.case-real-caption p{line-height:1.65;color:#c8cec9}
@media(max-width:900px){.evidence-intro,.work-tier-head,.creative-foundations-grid{grid-template-columns:1fr;gap:1.5rem}.evidence-ledger{grid-template-columns:1fr 1fr}.proof-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:320px 220px 220px}.proof-mosaic .proof-main{grid-column:1/3;grid-row:auto}.proof-mosaic .proof-wide{grid-column:auto}.archive-grid{grid-template-columns:1fr 1fr}.experience-photo-strip{grid-template-columns:1fr}.creative-artifacts{grid-template-columns:1fr 1fr}.case-real-visual-grid{grid-template-columns:1fr}.case-real-visual figure{height:440px}}
@media(max-width:600px){.evidence-ledger,.archive-grid,.creative-artifacts{grid-template-columns:1fr}.proof-mosaic{display:block}.proof-mosaic figure{height:300px;margin-bottom:1rem}.experience-photo-strip figure,.experience-photo-strip figure:last-child{height:320px}.case-real-visual figure{height:360px}}


/* ==========================================================
   V2.1 — contrast, rhythm and real evidence correction
   ========================================================== */
/* The public site footer is intentionally black/charcoal on every page. */
.site-footer{background:#11110f!important;color:#f7f1e9!important;border-top:1px solid rgba(247,241,233,.16)!important}
.site-footer .footer-top>div:first-child p,.site-footer .footer-nav span,.site-footer .footer-bottom{color:rgba(247,241,233,.62)!important}
.site-footer .footer-bottom{border-top-color:rgba(247,241,233,.18)!important}

/* Evidence is a short homepage glance, not a long green chapter. */
.homepage-v2 .career-evidence{background:#26342d;color:#f7f2e9;padding:clamp(3.8rem,6vw,6rem) var(--page-padding)}
.homepage-v2 .career-evidence .section-label{color:rgba(247,242,233,.66);border-color:rgba(247,242,233,.20)}
.homepage-v2 .evidence-intro{margin:2.2rem 0 2.6rem;grid-template-columns:1.15fr .55fr;gap:5vw}
.homepage-v2 .evidence-intro h2{font-size:clamp(2.8rem,5vw,5.4rem);color:#f7f2e9}
.homepage-v2 .evidence-intro p{color:rgba(247,242,233,.72)}
.homepage-v2 .evidence-ledger{grid-template-columns:repeat(4,1fr);border-color:rgba(255,255,255,.18)}
.homepage-v2 .evidence-ledger article{min-height:155px;padding:1.45rem;border-color:rgba(255,255,255,.18)}
.homepage-v2 .evidence-ledger small{color:rgba(247,242,233,.58)}
.homepage-v2 .evidence-ledger h3{font-size:1.55rem;margin:.85rem 0 .45rem;color:#fff}
.homepage-v2 .evidence-ledger p{font-size:.82rem;line-height:1.48;color:rgba(247,242,233,.70)}

/* Explicit contrast fixes for light chapters. */
.homepage-v2 .hero,.homepage-v2 .work-areas,.homepage-v2 .experience.experience-compact,.homepage-v2 .about.about-compact,.homepage-v2 .home-proof{color:var(--ink)}
.homepage-v2 .hero h1,.homepage-v2 .work-areas h2,.homepage-v2 .work-areas h3,.homepage-v2 .experience h2,.homepage-v2 .experience h3,.homepage-v2 .about h2,.homepage-v2 .home-proof h2{color:var(--ink)}
.homepage-v2 .hero p,.homepage-v2 .work-areas p,.homepage-v2 .about p,.homepage-v2 .home-proof p{color:var(--muted)}

/* Real document evidence — actual internal artifacts, safely redacted where required. */
.case-artifact-document{padding:clamp(4rem,7vw,7rem) var(--page-padding);background:#171714;color:#f2efe8}
.document-evidence-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.65fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.document-evidence-grid.reverse{grid-template-columns:minmax(280px,.65fr) minmax(0,1.15fr)}
.document-evidence-grid.reverse figure{order:2}.document-evidence-grid.reverse .case-artifact-copy{order:1}
.document-evidence-grid figure{margin:0;background:#ede9e1;padding:clamp(.65rem,1.5vw,1.1rem);box-shadow:0 18px 55px rgba(0,0,0,.28);transform:rotate(-.45deg)}
.document-evidence-grid.reverse figure{transform:rotate(.45deg)}
.document-evidence-grid img{display:block;width:100%;max-height:720px;object-fit:contain;background:#fff}
.document-evidence-grid figcaption{padding:.75rem .25rem .1rem;color:#555;font-size:.65rem;text-transform:uppercase;letter-spacing:.08em}
.case-artifact-document .case-artifact-copy h2{font-family:var(--serif);font-size:clamp(2.5rem,4.5vw,4.8rem);font-weight:400;line-height:.96;margin:.7rem 0 1.4rem;color:#f2efe8}
.case-artifact-document .case-artifact-copy p{color:#c8c4ba}.case-artifact-document .case-artifact-copy .eyebrow{color:#b98589}
@media(max-width:900px){.homepage-v2 .evidence-ledger{grid-template-columns:1fr 1fr}.document-evidence-grid,.document-evidence-grid.reverse{grid-template-columns:1fr}.document-evidence-grid.reverse figure,.document-evidence-grid.reverse .case-artifact-copy{order:initial}}
@media(max-width:600px){.homepage-v2 .evidence-ledger{grid-template-columns:1fr}.homepage-v2 .career-evidence{padding-top:3.2rem;padding-bottom:3.2rem}}


/* ==========================================================
   HOMEPAGE V2.2 — CLEAN CONTRAST CORRECTION
   Evidence chapter removed from homepage.
========================================================== */
.homepage-v2 .selected-work{
  background:#171714 !important;
  color:#f4f1e9 !important;
}
.homepage-v2 .selected-work h2,
.homepage-v2 .selected-work h3{color:#f4f1e9 !important;}
.homepage-v2 .selected-work .section-label,
.homepage-v2 .selected-work .eyebrow,
.homepage-v2 .selected-work .case-meta,
.homepage-v2 .selected-work .case-description p,
.homepage-v2 .selected-work .case-stat span,
.homepage-v2 .selected-work .project-index,
.homepage-v2 .selected-work .project-bottom{color:rgba(244,241,233,.64) !important;}
.homepage-v2 .selected-work .section-label{border-color:rgba(244,241,233,.18) !important;}
.homepage-v2 .selected-work .text-link,
.homepage-v2 .selected-work .project-bottom a{color:#f4f1e9 !important;}
.homepage-v2 .selected-work .project-tags span,
.homepage-v2 .selected-work .case-meta span{color:rgba(244,241,233,.76) !important;border-color:rgba(244,241,233,.25) !important;}
.homepage-v2 .selected-work .work-heading-row h2 em{color:#c98b91 !important;}
.homepage-v2 .work-areas{background:#f5f0e8 !important;color:#171714 !important;}
.homepage-v2 .work-areas h2,.homepage-v2 .work-areas h3{color:#171714 !important;}
.homepage-v2 .work-areas p{color:#5d5a54 !important;}
.homepage-v2 .site-footer{background:#11110f !important;}

/* ==========================================================
   HOMEPAGE V2.3 — FINAL TONE ADJUSTMENTS
   Selected Work and closing CTA use dark grey, not black.
   Footer remains true black for a clean final stop.
========================================================== */
.homepage-v2 .selected-work{
  background:#292927 !important;
}
.homepage-v2 .contact-section{
  background:#292927 !important;
}
.homepage-v2 .site-footer{
  background:#11110f !important;
}
