:root {
  --black: #090806;
  --line: rgba(226, 214, 196, .20);
  --ivory: #d8d0c4;
  --muted: #aaa195;
  --accent: #b9a58a;
  --ease: cubic-bezier(.2,.72,.18,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--black); }
body {
  margin: 0;
  background: var(--black);
  color: var(--ivory);
  font-family: "Helvetica Neue", "Neue Haas Grotesk Text Pro", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }

.portfolio {
  width: 100%;
  min-height: 100svh;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: 40svh 27svh 26svh minmax(72px, 7svh);
  background: var(--line);
  gap: 1px;
  overflow: hidden;
}

.panel {
  position: relative;
  overflow: hidden;
  background: #0c0b09;
  min-width: 0;
}
.panel img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transform: scale(1.002);
  filter: saturate(.84) contrast(1.03) brightness(.86);
  transition: transform 1.3s var(--ease), filter 1.1s var(--ease);
}
.panel .shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(5,4,3,.18), rgba(5,4,3,.05) 55%, rgba(5,4,3,.18));
  pointer-events: none;
  transition: background 1s var(--ease);
}
.project:hover img,
.project:focus-visible img { transform: scale(1.035); filter: saturate(.92) contrast(1.04) brightness(.98); }
.project:hover .shade,
.project:focus-visible .shade { background: linear-gradient(180deg, rgba(5,4,3,.08), rgba(5,4,3,0) 58%, rgba(5,4,3,.08)); }
.project { cursor: default; outline: none; }
.project::after {
  content: "VIEW";
  position: absolute;
  right: 24px;
  bottom: 22px;
  font-size: 8px;
  letter-spacing: .34em;
  color: rgba(225,214,199,.0);
  transform: translateY(5px);
  transition: color .55s var(--ease), transform .55s var(--ease);
}
.project:hover::after,
.project:focus-visible::after { color: rgba(225,214,199,.72); transform: translateY(0); }

.hero { grid-column: span 2; }
.hero img { object-position: center 54%; filter: saturate(.75) contrast(1.06) brightness(.64); }
.hero-shade {
  background:
    linear-gradient(90deg, rgba(0,0,0,.73) 0%, rgba(0,0,0,.48) 34%, rgba(0,0,0,.06) 76%),
    linear-gradient(0deg, rgba(0,0,0,.33), transparent 44%);
}

.monogram,
.footer-mark {
  position: absolute;
  display: block;
  width: 38px;
  height: 31px;
  color: #d9d0c1;
  font-family: Georgia, "Times New Roman", serif;
}
.monogram { top: 26px; left: 30px; }
.monogram span,
.footer-mark span { position: absolute; font-size: 27px; line-height: 1; font-weight: 400; }
.monogram span:first-child,
.footer-mark span:first-child { left: 0; top: -1px; }
.monogram span:nth-child(2),
.footer-mark span:nth-child(2) { left: 7px; top: 3px; }
.monogram i,
.footer-mark i { position: absolute; left: 30px; top: 5px; width: 1px; height: 23px; background: rgba(216,208,196,.7); }

.hero-copy {
  position: absolute;
  left: 4.7%;
  top: 48%;
  transform: translateY(-50%);
  z-index: 2;
}
.hero h1 {
  margin: 0;
  font-size: clamp(23px, 2.35vw, 39px);
  font-weight: 300;
  letter-spacing: .31em;
  line-height: 1;
  white-space: nowrap;
  text-shadow: 0 2px 18px rgba(0,0,0,.35);
}
.role {
  margin: 17px 0 0;
  font-size: clamp(7px, .72vw, 12px);
  letter-spacing: .18em;
  color: rgba(229,220,208,.87);
}
.disciplines {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 31px 0 0;
  font-size: clamp(6.5px, .58vw, 10px);
  letter-spacing: .16em;
  color: rgba(221,211,198,.72);
  white-space: nowrap;
}
.disciplines b { font-weight: 300; color: rgba(185,165,138,.7); }
.explore {
  position: absolute;
  left: 4.75%;
  bottom: 7.4%;
  z-index: 3;
  font-size: clamp(6px, .48vw, 8px);
  letter-spacing: .28em;
  color: rgba(226,217,204,.68);
  transition: color .3s ease;
}
.explore span { display: inline-block; margin-right: 7px; transform: translateY(-1px); }
.explore:hover { color: #eee6da; }
.coords {
  position: absolute;
  right: 16px;
  bottom: 12px;
  z-index: 2;
  font-size: clamp(5px, .45vw, 7.5px);
  letter-spacing: .24em;
  color: rgba(222,212,197,.6);
}

.label {
  position: absolute;
  z-index: 3;
  left: 30px;
  top: 23px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}
.label strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(11px, .95vw, 16px);
  font-weight: 400;
  color: rgba(218,205,185,.86);
}
.label span {
  font-size: clamp(7px, .64vw, 11px);
  letter-spacing: .17em;
  color: rgba(225,215,202,.78);
}
.label i {
  display: block;
  margin-top: 2px;
  width: 16px;
  height: 1px;
  background: rgba(196,178,153,.62);
  transform-origin: left;
  transition: width .65s var(--ease);
}
.project:hover .label i,
.project:focus-visible .label i { width: 32px; }

.urban img { object-position: center 48%; }
.automotive img { object-position: center 54%; }
.horology img { object-position: center 48%; }
.estate img { object-position: center 53%; }
.f1 img { object-position: center 54%; }
.yachts img { object-position: center 48%; }
.abstract img { object-position: center center; }

/* Six-project index: Estate closes the desktop grid cleanly. */
.portfolio > .estate { grid-column: span 2; }

.footer {
  grid-column: 1 / -1;
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 30px;
  background: #090806;
}
.footer-mark { position: relative; left: 0; top: auto; transform: scale(.84); transform-origin: left center; }
.footer nav { display: flex; gap: clamp(28px, 4vw, 60px); }
.footer nav a {
  position: relative;
  font-size: 9px;
  letter-spacing: .38em;
  color: rgba(216,206,192,.72);
  transition: color .25s ease;
}
.footer nav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: .38em;
  bottom: -8px;
  height: 1px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .45s var(--ease);
}
.footer nav a:hover { color: #ede5d9; }
.footer nav a:hover::after { transform: scaleX(1); transform-origin: left; }
.footer p {
  justify-self: end;
  margin: 0;
  font-size: 7px;
  letter-spacing: .28em;
  color: rgba(199,187,170,.55);
}

.reveal { opacity: 1; clip-path: none; }
.reveal.is-visible { animation: reveal 1.05s var(--ease) both; }
@keyframes reveal {
  0% { opacity: 0; clip-path: inset(0 0 100% 0); }
  100% { opacity: 1; clip-path: inset(0 0 0 0); }
}

.toast {
  position: fixed;
  left: 50%;
  bottom: 24px;
  transform: translate(-50%, 20px);
  padding: 10px 14px;
  border: 1px solid rgba(215,201,181,.16);
  background: rgba(9,8,6,.82);
  backdrop-filter: blur(14px);
  font-size: 7px;
  letter-spacing: .28em;
  color: rgba(234,224,211,.72);
  opacity: 0;
  pointer-events: none;
  transition: .45s var(--ease);
}
.toast.show { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 900px) {
  .portfolio {
    grid-template-columns: repeat(2, minmax(0,1fr));
    grid-template-rows: 68svh 38svh 38svh 38svh 86px;
  }
  .hero { grid-column: 1 / -1; }
  .portfolio > .estate { grid-column: span 1; }
  .footer { grid-column: 1 / -1; }
  .coords { display: none; }
  .hero-copy { left: 6vw; }
  .explore { left: 6vw; }
  .disciplines { flex-wrap: wrap; max-width: 80vw; white-space: normal; row-gap: 8px; }
  .footer nav { gap: 22px; }
}

@media (max-width: 620px) {
  .portfolio {
    display: block;
    background: #090806;
  }
  .panel { border-bottom: 1px solid var(--line); }
  .hero { height: 82svh; }
  .project { height: 61svh; }
  .hero-copy { left: 25px; right: 20px; top: 49%; }
  .hero h1 { font-size: clamp(23px, 8vw, 38px); letter-spacing: .21em; white-space: normal; }
  .role { margin-top: 16px; font-size: 8px; }
  .disciplines { margin-top: 25px; gap: 9px; font-size: 6px; max-width: 88%; }
  .monogram { left: 24px; top: 24px; }
  .explore { left: 25px; bottom: 27px; font-size: 6px; }
  .label { left: 23px; top: 21px; }
  .label strong { font-size: 14px; }
  .label span { font-size: 8px; }
  .footer {
    min-height: 150px;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: 1fr auto;
    gap: 8px 20px;
    padding: 26px 24px 22px;
  }
  .footer nav { justify-self: end; flex-wrap: wrap; justify-content: flex-end; gap: 15px 20px; max-width: 240px; }
  .footer nav a { font-size: 7px; }
  .footer p { grid-column: 1 / -1; justify-self: end; font-size: 6px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
  .reveal { opacity: 1; clip-path: none; }
}

/* Linked project cards */
.project-link { cursor: pointer; }
.project-link::after { content: "OPEN"; }

/* =========================
   INTERNAL / PROJECT PAGES
   ========================= */
.project-page {
  min-height: 100svh;
  background: #090806;
  color: var(--ivory);
}
.project-page .project-shell {
  min-height: 100svh;
  display: grid;
  grid-template-rows: minmax(680px, 100svh) auto auto;
}
.project-page .project-hero {
  position: relative;
  min-height: 680px;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}
.project-page .project-hero > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 55%;
  filter: saturate(.80) contrast(1.05) brightness(.63);
  transform: scale(1.01);
  animation: projectHeroDrift 15s var(--ease) both;
}
@keyframes projectHeroDrift {
  from { transform: scale(1.04); }
  to { transform: scale(1.005); }
}
.project-page .project-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.67) 0%, rgba(0,0,0,.34) 35%, rgba(0,0,0,.05) 70%),
    linear-gradient(0deg, rgba(0,0,0,.54) 0%, rgba(0,0,0,.04) 50%, rgba(0,0,0,.24) 100%);
  pointer-events: none;
}
.project-page .project-topbar {
  position: absolute;
  z-index: 5;
  left: 30px;
  right: 30px;
  top: 26px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.project-page .project-topbar .monogram {
  position: relative;
  left: auto;
  top: auto;
  flex: 0 0 auto;
}
.project-page .back-home {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 5px;
  font-size: 8px;
  letter-spacing: .31em;
  color: rgba(229,220,208,.72);
  transition: color .3s ease;
}
.project-page .back-home span {
  font-size: 12px;
  letter-spacing: 0;
  transform: translateY(-1px);
}
.project-page .back-home:hover { color: #f2e9dd; }
.project-page .project-index {
  position: absolute;
  z-index: 4;
  top: 48%;
  right: 3.2vw;
  transform: translateY(-50%) rotate(90deg);
  transform-origin: center;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 12px;
  letter-spacing: .22em;
  color: rgba(218,205,185,.68);
}
.project-page .project-title-wrap {
  position: absolute;
  z-index: 4;
  left: clamp(28px, 6.2vw, 106px);
  bottom: clamp(72px, 11vh, 128px);
  max-width: 900px;
}
.project-page .project-kicker {
  margin: 0 0 18px;
  font-size: 8px;
  letter-spacing: .34em;
  color: rgba(210,195,174,.74);
}
.project-page .project-title {
  margin: 0;
  font-size: clamp(46px, 7.2vw, 118px);
  line-height: .88;
  font-weight: 200;
  letter-spacing: .115em;
  color: #dfd5c8;
  text-shadow: 0 8px 36px rgba(0,0,0,.24);
}
.project-page .project-subtitle {
  margin: 27px 0 0;
  font-size: clamp(8px, .72vw, 11px);
  letter-spacing: .24em;
  color: rgba(225,215,201,.72);
}
.project-page .project-scroll {
  position: absolute;
  z-index: 4;
  left: clamp(28px, 6.2vw, 106px);
  bottom: 28px;
  font-size: 7px;
  letter-spacing: .29em;
  color: rgba(220,210,196,.55);
}
.project-page .project-scroll span { margin-right: 8px; }
.project-page .project-intro {
  display: grid;
  grid-template-columns: minmax(240px, .8fr) minmax(0, 1.35fr);
  gap: clamp(44px, 9vw, 150px);
  padding: clamp(72px, 10vw, 150px) clamp(28px, 7vw, 120px);
  border-bottom: 1px solid var(--line);
  background: #090806;
}
.project-page .intro-meta {
  display: grid;
  align-content: start;
  gap: 28px;
}
.project-page .meta-number {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 400;
  color: rgba(211,196,174,.78);
}
.project-page .meta-line {
  width: 38px;
  height: 1px;
  background: rgba(185,165,138,.55);
}
.project-page .meta-small {
  margin: 0;
  max-width: 240px;
  font-size: 8px;
  line-height: 1.9;
  letter-spacing: .22em;
  color: rgba(197,187,172,.56);
}
.project-page .intro-copy h2 {
  margin: 0;
  max-width: 850px;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-size: clamp(30px, 4.3vw, 66px);
  line-height: 1.08;
  letter-spacing: -.015em;
  color: #d8cfc2;
}
.project-page .intro-copy p {
  margin: 38px 0 0;
  max-width: 650px;
  font-size: clamp(10px, .92vw, 14px);
  line-height: 2;
  letter-spacing: .08em;
  color: rgba(202,192,178,.62);
}
.project-page .project-stage {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  min-height: 70svh;
  border-bottom: 1px solid var(--line);
}
.project-page .stage-image {
  position: relative;
  min-height: 620px;
  overflow: hidden;
  border-right: 1px solid var(--line);
}
.project-page .stage-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% 54%;
  display: block;
  filter: saturate(.78) contrast(1.06) brightness(.74);
  transform: scale(1.02);
  transition: transform 2s var(--ease), filter 1.4s var(--ease);
}
.project-page .stage-image:hover img {
  transform: scale(1.055);
  filter: saturate(.88) contrast(1.06) brightness(.84);
}
.project-page .stage-note {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(50px, 6vw, 96px);
  background: #0b0a08;
}
.project-page .stage-note .eyebrow {
  font-size: 7px;
  letter-spacing: .32em;
  color: rgba(190,173,149,.62);
}
.project-page .stage-note blockquote {
  margin: auto 0;
  max-width: 480px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(26px, 3.2vw, 52px);
  line-height: 1.12;
  font-weight: 400;
  color: #d4cabd;
}
.project-page .stage-note .note-footer {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  font-size: 7px;
  line-height: 1.8;
  letter-spacing: .23em;
  color: rgba(193,181,165,.50);
}
.project-page .project-footer {
  min-height: 180px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 34px clamp(28px, 4vw, 64px);
  background: #090806;
}
.project-page .project-footer .footer-mark { position: relative; top: auto; left: auto; }
.project-page .project-footer .return-index {
  justify-self: center;
  font-size: 8px;
  letter-spacing: .34em;
  color: rgba(216,206,192,.72);
}
.project-page .project-footer .return-index:hover { color: #f0e7db; }
.project-page .project-footer .copyright {
  justify-self: end;
  margin: 0;
  font-size: 7px;
  letter-spacing: .26em;
  color: rgba(199,187,170,.48);
}

@media (max-width: 900px) {
  .project-page .project-shell { grid-template-rows: 82svh auto auto; }
  .project-page .project-hero { min-height: 620px; }
  .project-page .project-title { font-size: clamp(44px, 10vw, 82px); }
  .project-page .project-intro { grid-template-columns: 1fr; gap: 55px; }
  .project-page .intro-meta { grid-template-columns: auto auto 1fr; align-items: center; gap: 18px; }
  .project-page .meta-small { max-width: 100%; }
  .project-page .project-stage { grid-template-columns: 1fr; }
  .project-page .stage-image { border-right: 0; border-bottom: 1px solid var(--line); min-height: 58svh; }
  .project-page .stage-note { min-height: 520px; }
}

@media (max-width: 620px) {
  .project-page .project-shell { grid-template-rows: auto auto auto; }
  .project-page .project-hero { min-height: 86svh; }
  .project-page .project-topbar { left: 23px; right: 23px; top: 23px; }
  .project-page .back-home { font-size: 6px; letter-spacing: .24em; }
  .project-page .project-index { display: none; }
  .project-page .project-title-wrap { left: 24px; right: 20px; bottom: 84px; }
  .project-page .project-title { font-size: clamp(42px, 15vw, 70px); letter-spacing: .065em; }
  .project-page .project-subtitle { font-size: 7px; line-height: 1.7; }
  .project-page .project-scroll { left: 24px; bottom: 26px; font-size: 6px; }
  .project-page .project-intro { padding: 72px 24px; }
  .project-page .intro-meta { display: grid; grid-template-columns: auto 1fr; }
  .project-page .meta-small { grid-column: 1 / -1; }
  .project-page .intro-copy h2 { font-size: clamp(30px, 10vw, 45px); }
  .project-page .intro-copy p { font-size: 10px; }
  .project-page .stage-image { min-height: 58svh; }
  .project-page .stage-note { min-height: 500px; padding: 52px 24px; }
  .project-page .stage-note blockquote { font-size: clamp(27px, 9vw, 41px); }
  .project-page .stage-note .note-footer { flex-direction: column; }
  .project-page .project-footer { min-height: 150px; grid-template-columns: auto 1fr; grid-template-rows: 1fr auto; gap: 20px; padding: 28px 24px; }
  .project-page .project-footer .return-index { justify-self: end; font-size: 7px; }
  .project-page .project-footer .copyright { grid-column: 1 / -1; }
}


/* Per-field image focal points */
.field-urban .project-hero > img { object-position: center 48%; }
.field-urban .stage-image img { object-position: center 50%; }
.field-automotive .project-hero > img { object-position: center 55%; }
.field-automotive .stage-image img { object-position: 62% 54%; }
.field-horology .project-hero > img { object-position: center 48%; }
.field-horology .stage-image img { object-position: center 52%; }
.field-estate .project-hero > img { object-position: center 53%; }
.field-estate .stage-image img { object-position: center 54%; }
.field-f1 .project-hero > img { object-position: center 54%; }
.field-f1 .stage-image img { object-position: center 55%; }
.field-yachts .project-hero > img { object-position: center 48%; }
.field-yachts .stage-image img { object-position: center 50%; }
.field-abstract .project-hero > img { object-position: center center; }
.field-abstract .stage-image img { object-position: center center; }

/* Keep long project titles elegant on smaller screens */
.field-estate .project-title { font-size: clamp(38px, 6.2vw, 98px); }
@media (max-width: 620px) {
  .field-estate .project-title { font-size: clamp(36px, 11.5vw, 58px); line-height: .94; }
}

/* =========================
   ABOUT / PROFILE PAGE
   ========================= */
.about-page {
  min-height: 100svh;
  background: var(--black);
  color: var(--ivory);
}
.about-shell { min-height: 100svh; }

.about-hero {
  position: relative;
  display: grid;
  grid-template-columns: 42% 58%;
  min-height: 100svh;
  background: #090806;
  border-bottom: 1px solid var(--line);
  overflow: hidden;
}
.about-hero-copy {
  position: relative;
  min-height: 680px;
  background:
    radial-gradient(circle at 70% 48%, rgba(135,112,82,.07), transparent 42%),
    #090806;
  border-right: 1px solid var(--line);
}
.about-mark { top: 28px; left: 30px; z-index: 6; }
.about-heading {
  position: absolute;
  left: clamp(30px, 6.2vw, 105px);
  right: 35px;
  top: 49%;
  transform: translateY(-50%);
  z-index: 4;
}
.about-kicker {
  margin: 0 0 23px;
  font-size: 8px;
  letter-spacing: .34em;
  color: rgba(197,178,153,.72);
}
.about-heading h1 {
  margin: 0;
  font-size: clamp(58px, 7.4vw, 126px);
  line-height: .84;
  font-weight: 200;
  letter-spacing: .08em;
  color: #ddd3c6;
}
.about-name {
  margin: 38px 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(17px, 1.5vw, 25px);
  letter-spacing: .1em;
  color: rgba(219,207,190,.88);
}
.about-role {
  margin: 13px 0 0;
  font-size: clamp(7px, .62vw, 10px);
  letter-spacing: .27em;
  color: rgba(199,187,170,.58);
}
.about-scroll {
  position: absolute;
  left: clamp(30px, 6.2vw, 105px);
  bottom: 30px;
  z-index: 5;
  font-size: 7px;
  letter-spacing: .3em;
  color: rgba(215,204,189,.52);
  transition: color .3s ease;
}
.about-scroll span { margin-right: 8px; }
.about-scroll:hover { color: #eee5d8; }

.about-portrait {
  position: relative;
  min-height: 680px;
  overflow: hidden;
  background: #11100e;
}
.about-portrait img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 48% 42%;
  filter: saturate(.66) contrast(1.06) brightness(.76);
  transform: scale(1.01);
  animation: aboutPortraitDrift 16s var(--ease) both;
}
@keyframes aboutPortraitDrift {
  from { transform: scale(1.045); }
  to { transform: scale(1.008); }
}
.about-photo-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(8,7,5,.2), transparent 28%),
    linear-gradient(0deg, rgba(4,4,3,.20), transparent 42%, rgba(4,4,3,.08));
  pointer-events: none;
}
.about-back {
  position: absolute;
  z-index: 7;
  top: 31px;
  right: 31px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 8px;
  letter-spacing: .31em;
  color: rgba(234,224,211,.72);
  text-shadow: 0 2px 12px rgba(0,0,0,.45);
}
.about-back span { font-size: 12px; letter-spacing: 0; }
.about-back:hover { color: #fff6e9; }
.about-index {
  position: absolute;
  z-index: 7;
  right: 24px;
  bottom: 24px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 9px;
  letter-spacing: .22em;
  color: rgba(231,220,204,.58);
  text-shadow: 0 2px 10px rgba(0,0,0,.45);
}

.about-statement {
  display: grid;
  grid-template-columns: minmax(220px, .72fr) minmax(0, 1.45fr);
  gap: clamp(55px, 10vw, 165px);
  padding: clamp(90px, 11vw, 170px) clamp(30px, 7vw, 120px);
  background: #090806;
  border-bottom: 1px solid var(--line);
}
.about-meta {
  display: grid;
  align-content: start;
  gap: 27px;
}
.about-meta .meta-number {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  color: rgba(211,196,174,.78);
}
.about-meta .meta-line {
  width: 38px;
  height: 1px;
  background: rgba(185,165,138,.55);
}
.about-meta p {
  margin: 0;
  max-width: 250px;
  font-size: 8px;
  line-height: 1.9;
  letter-spacing: .23em;
  color: rgba(194,183,167,.53);
}
.about-copy h2 {
  margin: 0;
  max-width: 900px;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-size: clamp(34px, 4.6vw, 72px);
  line-height: 1.06;
  letter-spacing: -.018em;
  color: #d8cfc2;
}
.about-copy p {
  margin: 38px 0 0;
  max-width: 710px;
  font-size: clamp(10px, .92vw, 14px);
  line-height: 2.05;
  letter-spacing: .075em;
  color: rgba(204,193,177,.62);
}
.about-copy p + p { margin-top: 22px; }

.about-editorial {
  display: grid;
  grid-template-columns: .84fr 1.16fr;
  min-height: 78svh;
  border-bottom: 1px solid var(--line);
  background: #0b0a08;
}
.about-editorial-image {
  min-height: 680px;
  overflow: hidden;
  border-right: 1px solid var(--line);
  background: #11100e;
}
.about-editorial-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 31% 48%;
  filter: saturate(.58) contrast(1.07) brightness(.68);
  transform: scale(1.035);
  transition: transform 1.8s var(--ease), filter 1.4s var(--ease);
}
.about-editorial-image:hover img {
  transform: scale(1.07);
  filter: saturate(.68) contrast(1.08) brightness(.76);
}
.about-editorial-copy {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(56px, 7vw, 112px);
}
.about-editorial-copy .eyebrow {
  font-size: 7px;
  letter-spacing: .32em;
  color: rgba(190,173,149,.61);
}
.about-editorial-copy h2 {
  margin: auto 0;
  max-width: 720px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(31px, 4.1vw, 66px);
  line-height: 1.08;
  font-weight: 400;
  color: #d6ccbf;
}
.about-details {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(24px, 4vw, 70px);
  padding-top: 50px;
  border-top: 1px solid rgba(226,214,196,.12);
}
.about-details span {
  display: block;
  margin-bottom: 16px;
  font-size: 7px;
  letter-spacing: .31em;
  color: rgba(190,173,149,.64);
}
.about-details p {
  margin: 0;
  font-size: 7px;
  line-height: 1.95;
  letter-spacing: .2em;
  color: rgba(198,187,170,.52);
}
.about-footer {
  min-height: 180px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 34px clamp(28px, 4vw, 64px);
  background: #090806;
}
.about-footer .footer-mark { position: relative; top: auto; left: auto; }
.about-footer .return-index {
  justify-self: center;
  font-size: 8px;
  letter-spacing: .34em;
  color: rgba(216,206,192,.72);
}
.about-footer .return-index:hover { color: #f0e7db; }
.about-footer .copyright {
  justify-self: end;
  margin: 0;
  font-size: 7px;
  letter-spacing: .26em;
  color: rgba(199,187,170,.48);
}

@media (max-width: 900px) {
  .about-hero { grid-template-columns: 46% 54%; min-height: 82svh; }
  .about-hero-copy, .about-portrait { min-height: 650px; }
  .about-heading h1 { font-size: clamp(52px, 10vw, 88px); }
  .about-statement { grid-template-columns: 1fr; gap: 58px; }
  .about-meta { grid-template-columns: auto auto 1fr; align-items: center; gap: 18px; }
  .about-meta p { max-width: none; }
  .about-editorial { grid-template-columns: 1fr 1.15fr; }
  .about-editorial-image { min-height: 620px; }
  .about-details { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 620px) {
  .about-hero {
    display: block;
    min-height: 100svh;
  }
  .about-portrait {
    position: absolute;
    inset: 0;
    min-height: 100%;
  }
  .about-portrait img {
    object-position: 53% 44%;
    filter: saturate(.58) contrast(1.07) brightness(.48);
  }
  .about-photo-shade {
    background:
      linear-gradient(90deg, rgba(0,0,0,.74) 0%, rgba(0,0,0,.35) 66%, rgba(0,0,0,.08)),
      linear-gradient(0deg, rgba(0,0,0,.66) 0%, transparent 52%, rgba(0,0,0,.18));
  }
  .about-hero-copy {
    position: relative;
    z-index: 3;
    min-height: 100svh;
    background: transparent;
    border-right: 0;
  }
  .about-mark { left: 24px; top: 23px; }
  .about-back { top: 27px; right: 22px; font-size: 6px; letter-spacing: .23em; }
  .about-heading { left: 24px; right: 24px; top: 53%; }
  .about-kicker { font-size: 7px; }
  .about-heading h1 { font-size: clamp(58px, 20vw, 90px); letter-spacing: .055em; }
  .about-name { margin-top: 30px; font-size: 17px; }
  .about-role { font-size: 7px; line-height: 1.7; }
  .about-scroll { left: 24px; bottom: 27px; font-size: 6px; }
  .about-index { display: none; }

  .about-statement { padding: 78px 24px; gap: 52px; }
  .about-meta { grid-template-columns: auto 1fr; }
  .about-meta p { grid-column: 1 / -1; }
  .about-copy h2 { font-size: clamp(32px, 11vw, 47px); }
  .about-copy p { font-size: 10px; line-height: 1.95; }

  .about-editorial { grid-template-columns: 1fr; min-height: auto; }
  .about-editorial-image { min-height: 68svh; border-right: 0; border-bottom: 1px solid var(--line); }
  .about-editorial-image img { object-position: 40% 46%; }
  .about-editorial-copy { min-height: 650px; padding: 56px 24px; }
  .about-editorial-copy h2 { font-size: clamp(31px, 10vw, 44px); margin: 80px 0; }
  .about-details { grid-template-columns: 1fr 1fr; gap: 30px 22px; padding-top: 36px; }

  .about-footer { min-height: 150px; grid-template-columns: auto 1fr; grid-template-rows: 1fr auto; gap: 20px; padding: 28px 24px; }
  .about-footer .return-index { justify-self: end; font-size: 7px; }
  .about-footer .copyright { grid-column: 1 / -1; }
}

/* =========================
   APPROACH PAGE
   ========================= */
.approach-page {
  min-height: 100svh;
  background: #090806;
  color: var(--ivory);
}
.approach-shell { min-height: 100svh; }

.approach-hero {
  position: relative;
  display: grid;
  grid-template-columns: 43% 57%;
  min-height: min(920px, 100svh);
  border-bottom: 1px solid var(--line);
  overflow: hidden;
  background: #0a0907;
}
.approach-hero-copy {
  position: relative;
  min-height: min(920px, 100svh);
  border-right: 1px solid var(--line);
  background:
    linear-gradient(135deg, rgba(185,165,138,.035), transparent 38%),
    #090806;
}
.approach-mark { top: 28px; left: 30px; z-index: 6; }
.approach-heading {
  position: absolute;
  left: clamp(30px, 7vw, 112px);
  right: 34px;
  top: 50%;
  transform: translateY(-50%);
}
.approach-kicker {
  margin: 0 0 24px;
  font-size: 8px;
  letter-spacing: .34em;
  color: rgba(190,174,151,.72);
}
.approach-heading h1 {
  margin: 0;
  font-size: clamp(48px, 5.25vw, 90px);
  line-height: .9;
  font-weight: 200;
  letter-spacing: .065em;
  color: #ddd4c8;
}
.approach-line {
  margin: 34px 0 0;
  font-size: clamp(7px, .65vw, 10px);
  letter-spacing: .28em;
  color: rgba(215,204,188,.66);
}
.approach-scroll {
  position: absolute;
  left: clamp(30px, 7vw, 112px);
  bottom: 34px;
  z-index: 5;
  font-size: 7px;
  letter-spacing: .3em;
  color: rgba(218,207,191,.62);
  transition: color .3s ease;
}
.approach-scroll span { margin-right: 8px; }
.approach-scroll:hover { color: #eee5d8; }
.approach-visual {
  position: relative;
  min-height: min(920px, 100svh);
  overflow: hidden;
  background: #0b0a08;
}
.approach-visual img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center center;
  filter: saturate(.7) contrast(1.07) brightness(.7);
  transform: scale(1.025);
  animation: approachVisualDrift 18s var(--ease) both;
}
@keyframes approachVisualDrift {
  from { transform: scale(1.075); }
  to { transform: scale(1.025); }
}
.approach-visual-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(9,8,6,.22), transparent 34%),
    linear-gradient(0deg, rgba(5,4,3,.24), transparent 43%);
  pointer-events: none;
}
.approach-back {
  position: absolute;
  right: 30px;
  top: 31px;
  z-index: 7;
  font-size: 7px;
  letter-spacing: .29em;
  color: rgba(225,215,201,.68);
  transition: color .3s ease;
}
.approach-back span { font-size: 12px; letter-spacing: 0; }
.approach-back:hover { color: #fff6e9; }
.approach-index {
  position: absolute;
  right: 22px;
  bottom: 18px;
  z-index: 5;
  font-size: 6px;
  letter-spacing: .28em;
  color: rgba(205,192,173,.52);
}

.approach-principle {
  display: grid;
  grid-template-columns: minmax(240px, .72fr) minmax(0, 1.55fr);
  gap: clamp(60px, 9vw, 150px);
  padding: clamp(95px, 11vw, 175px) clamp(34px, 7vw, 120px);
  border-bottom: 1px solid var(--line);
  background: #0a0907;
}
.approach-meta {
  display: grid;
  grid-template-columns: auto 42px;
  align-content: start;
  gap: 17px 18px;
}
.approach-meta .meta-number {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 19px;
  color: rgba(207,192,170,.78);
}
.approach-meta .meta-line {
  width: 42px;
  height: 1px;
  margin-top: 11px;
  background: rgba(185,165,138,.45);
}
.approach-meta p {
  grid-column: 1 / -1;
  max-width: 260px;
  margin: 5px 0 0;
  font-size: 7px;
  line-height: 1.85;
  letter-spacing: .26em;
  color: rgba(193,181,164,.54);
}
.approach-principle-copy h2 {
  max-width: 960px;
  margin: 0 0 50px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(42px, 5.2vw, 84px);
  line-height: 1.03;
  font-weight: 400;
  letter-spacing: -.03em;
  color: #d9d0c3;
}
.approach-principle-copy p {
  max-width: 780px;
  margin: 0;
  font-size: clamp(10px, .83vw, 13px);
  line-height: 1.95;
  letter-spacing: .055em;
  color: rgba(207,197,183,.67);
}
.approach-principle-copy p + p { margin-top: 24px; }

.approach-process {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  background: var(--line);
  gap: 1px;
  border-bottom: 1px solid var(--line);
}
.approach-step {
  min-height: 440px;
  padding: 38px clamp(26px, 2.8vw, 52px) 46px;
  display: flex;
  flex-direction: column;
  background: #090806;
}
.approach-step-top {
  display: flex;
  align-items: center;
  gap: 14px;
}
.approach-step-top span {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 16px;
  color: rgba(205,190,169,.76);
}
.approach-step-top i {
  display: block;
  width: 24px;
  height: 1px;
  background: rgba(185,165,138,.4);
  transition: width .65s var(--ease);
}
.approach-step:hover .approach-step-top i { width: 46px; }
.approach-step h3 {
  margin: auto 0 27px;
  font-size: clamp(13px, 1.05vw, 17px);
  font-weight: 400;
  letter-spacing: .2em;
  color: rgba(225,216,203,.9);
}
.approach-step p {
  max-width: 310px;
  margin: 0;
  font-size: 9px;
  line-height: 1.9;
  letter-spacing: .06em;
  color: rgba(196,185,170,.58);
}

.approach-manifesto {
  display: grid;
  grid-template-columns: 1.18fr .82fr;
  min-height: 760px;
  border-bottom: 1px solid var(--line);
}
.approach-manifesto-image {
  position: relative;
  overflow: hidden;
  border-right: 1px solid var(--line);
  background: #0b0a08;
}
.approach-manifesto-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center 54%;
  filter: saturate(.68) contrast(1.07) brightness(.62);
  transform: scale(1.01);
  transition: transform 1.5s var(--ease), filter 1.2s var(--ease);
}
.approach-manifesto:hover .approach-manifesto-image img {
  transform: scale(1.035);
  filter: saturate(.76) contrast(1.08) brightness(.69);
}
.approach-manifesto-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(3,3,2,.15), rgba(3,3,2,.01) 50%, rgba(3,3,2,.2));
  pointer-events: none;
}
.approach-manifesto-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(50px, 7vw, 120px);
  background: #0a0907;
}
.approach-manifesto-copy .eyebrow {
  font-size: 7px;
  letter-spacing: .32em;
  color: rgba(190,174,151,.64);
}
.approach-manifesto-copy blockquote {
  margin: clamp(80px, 10vw, 150px) 0 46px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(44px, 5.4vw, 88px);
  line-height: .98;
  font-weight: 400;
  letter-spacing: -.035em;
  color: #d8cfc2;
}
.approach-manifesto-copy p {
  max-width: 460px;
  margin: 0;
  font-size: 10px;
  line-height: 1.95;
  letter-spacing: .06em;
  color: rgba(196,185,170,.6);
}

.approach-footer {
  min-height: 118px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 30px;
  background: #090806;
}
.approach-footer .footer-mark { position: relative; top: auto; left: auto; }
.approach-footer .return-index {
  font-size: 8px;
  letter-spacing: .29em;
  color: rgba(213,202,187,.66);
  transition: color .3s ease;
}
.approach-footer .return-index:hover { color: #f0e7db; }
.approach-footer .copyright {
  justify-self: end;
  margin: 0;
  font-size: 7px;
  letter-spacing: .28em;
  color: rgba(199,187,170,.5);
}

@media (max-width: 980px) {
  .approach-hero { grid-template-columns: 47% 53%; min-height: 82svh; }
  .approach-hero-copy, .approach-visual { min-height: 650px; }
  .approach-heading h1 { font-size: clamp(48px, 7.5vw, 74px); }
  .approach-principle { grid-template-columns: 1fr; gap: 58px; }
  .approach-meta { grid-template-columns: auto auto 1fr; align-items: center; gap: 18px; }
  .approach-meta p { grid-column: auto; max-width: none; }
  .approach-process { grid-template-columns: repeat(2, 1fr); }
  .approach-step { min-height: 360px; }
  .approach-manifesto { grid-template-columns: 1fr 1fr; min-height: 650px; }
}

@media (max-width: 620px) {
  .approach-hero {
    display: block;
    min-height: 88svh;
  }
  .approach-visual {
    position: absolute;
    inset: 0;
    min-height: 88svh;
  }
  .approach-visual img {
    object-position: 60% center;
    filter: saturate(.58) contrast(1.08) brightness(.44);
  }
  .approach-visual-shade {
    background:
      linear-gradient(90deg, rgba(5,4,3,.78), rgba(5,4,3,.34) 66%, rgba(5,4,3,.2)),
      linear-gradient(0deg, rgba(5,4,3,.5), transparent 55%);
  }
  .approach-hero-copy {
    position: relative;
    z-index: 3;
    min-height: 88svh;
    border-right: 0;
    background: transparent;
  }
  .approach-mark { left: 24px; top: 23px; }
  .approach-back { top: 27px; right: 22px; font-size: 6px; letter-spacing: .23em; }
  .approach-heading { left: 24px; right: 24px; top: 53%; }
  .approach-kicker { font-size: 7px; }
  .approach-heading h1 { font-size: clamp(44px, 14vw, 64px); letter-spacing: .05em; }
  .approach-line { margin-top: 28px; font-size: 7px; line-height: 1.7; }
  .approach-scroll { left: 24px; bottom: 27px; font-size: 6px; }
  .approach-index { display: none; }

  .approach-principle { padding: 78px 24px; gap: 52px; }
  .approach-meta { grid-template-columns: auto 1fr; }
  .approach-meta p { grid-column: 1 / -1; }
  .approach-principle-copy h2 { font-size: clamp(34px, 12vw, 50px); margin-bottom: 36px; }
  .approach-principle-copy p { font-size: 10px; line-height: 1.95; }

  .approach-process { grid-template-columns: 1fr; }
  .approach-step { min-height: 300px; padding: 30px 24px 36px; }
  .approach-step h3 { margin-top: auto; font-size: 14px; }
  .approach-step p { font-size: 9px; }

  .approach-manifesto { grid-template-columns: 1fr; min-height: auto; }
  .approach-manifesto-image { min-height: 60svh; border-right: 0; border-bottom: 1px solid var(--line); }
  .approach-manifesto-copy { min-height: 560px; padding: 54px 24px; }
  .approach-manifesto-copy blockquote { margin: 90px 0 42px; font-size: clamp(44px, 16vw, 68px); }

  .approach-footer {
    min-height: 150px;
    grid-template-columns: auto 1fr;
    grid-template-rows: 1fr auto;
    gap: 20px;
    padding: 28px 24px;
  }
  .approach-footer .return-index { justify-self: end; font-size: 7px; }
  .approach-footer .copyright { grid-column: 1 / -1; }
}

/* V7.2 — bespoke visual symbols for the Approach process */
.approach-step-visual {
  position: relative;
  width: min(100%, 300px);
  height: 178px;
  margin: 30px auto 10px;
  overflow: hidden;
  opacity: .72;
  mix-blend-mode: screen;
  transition: opacity .8s var(--ease), transform 1s var(--ease);
}
.approach-step-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, #090806 0%, transparent 16%, transparent 76%, #090806 100%),
    linear-gradient(90deg, #090806 0%, transparent 12%, transparent 88%, #090806 100%);
  pointer-events: none;
}
.approach-step-visual img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  filter: saturate(.45) contrast(1.08) brightness(.93);
  transform: scale(1.02);
  transition: transform 1.3s var(--ease), filter 1s var(--ease);
}
.approach-step:hover .approach-step-visual {
  opacity: .94;
  transform: translateY(-3px);
}
.approach-step:hover .approach-step-visual img {
  transform: scale(1.055);
  filter: saturate(.55) contrast(1.12) brightness(1.04);
}
.approach-step h3 { margin-top: auto; }

@media (max-width: 980px) {
  .approach-step-visual { height: 155px; margin-top: 26px; }
}
@media (max-width: 640px) {
  .approach-step-visual { width: min(100%, 280px); height: 145px; margin: 22px auto 20px; }
}

/* =========================================================
   CONTACT — V8
   ========================================================= */
.contact-page {
  background: #090806;
  color: #d6d0c4;
}

.contact-shell {
  min-height: 100vh;
  overflow: hidden;
  background:
    radial-gradient(circle at 86% 5%, rgba(142, 115, 76, .06), transparent 29rem),
    #090806;
}

.contact-header {
  min-height: 78vh;
  position: relative;
  display: flex;
  align-items: flex-end;
  padding: 9.5rem 3.25rem 5.6rem;
  border-bottom: 1px solid rgba(213, 202, 182, .17);
}

.contact-mark {
  position: absolute;
  top: 2.35rem;
  left: 3.25rem;
}

.contact-back {
  position: absolute;
  top: 2.7rem;
  right: 3.25rem;
  display: flex;
  align-items: center;
  gap: .8rem;
  color: #aaa296;
  font-size: .62rem;
  letter-spacing: .25em;
  text-decoration: none;
  transition: color .35s ease, transform .35s ease;
}

.contact-back:hover {
  color: #e7dfd1;
  transform: translateX(-4px);
}

.contact-intro {
  width: min(1040px, 76vw);
}

.contact-kicker {
  margin: 0 0 1.8rem;
  color: #9e8b70;
  font-size: .63rem;
  letter-spacing: .33em;
}

.contact-intro h1 {
  margin: 0;
  max-width: 1020px;
  color: #ddd5c8;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(4rem, 9vw, 9.5rem);
  font-weight: 400;
  line-height: .86;
  letter-spacing: -.055em;
}

.contact-subtitle {
  margin: 2.5rem 0 0 .35rem;
  color: #8d877e;
  font-size: clamp(.75rem, 1vw, .95rem);
  line-height: 1.8;
  letter-spacing: .08em;
}

.contact-availability {
  position: absolute;
  right: 3.25rem;
  bottom: 5.8rem;
  display: flex;
  align-items: center;
  gap: .75rem;
  color: #82796c;
  font-size: .58rem;
  letter-spacing: .25em;
}

.availability-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #b19a78;
  box-shadow: 0 0 12px rgba(177, 154, 120, .4);
}

.contact-channels {
  display: grid;
  grid-template-columns: 1.25fr .85fr 1fr;
  border-bottom: 1px solid rgba(213, 202, 182, .17);
}

.contact-group {
  min-height: 520px;
  padding: 2.8rem 3.1rem 3.3rem;
  border-right: 1px solid rgba(213, 202, 182, .17);
  display: flex;
  flex-direction: column;
}

.contact-group:last-child { border-right: 0; }

.contact-group-meta {
  display: flex;
  align-items: center;
  gap: .85rem;
  color: #a99578;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: .78rem;
}

.contact-group-meta i {
  width: 24px;
  height: 1px;
  background: rgba(169, 149, 120, .48);
}

.contact-group-heading {
  margin-top: auto;
  padding-bottom: 2.2rem;
}

.contact-group-heading p {
  margin: 0 0 .7rem;
  color: #d5cfc4;
  font-size: .8rem;
  letter-spacing: .24em;
}

.contact-group-heading span {
  color: #6f6a63;
  font-size: .58rem;
  letter-spacing: .14em;
}

.contact-links {
  border-top: 1px solid rgba(213, 202, 182, .14);
}

.contact-links a {
  min-height: 84px;
  display: grid;
  grid-template-columns: 105px 1fr 26px;
  align-items: center;
  gap: 1rem;
  border-bottom: 1px solid rgba(213, 202, 182, .10);
  color: inherit;
  text-decoration: none;
  transition: background .35s ease, padding-left .35s ease;
}

.contact-links a:hover {
  padding-left: .65rem;
  background: rgba(255, 255, 255, .018);
}

.contact-link-label {
  color: #8c8274;
  font-size: .55rem;
  letter-spacing: .24em;
}

.contact-link-value {
  color: #c8c0b4;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(.75rem, .95vw, .98rem);
  letter-spacing: .02em;
  overflow-wrap: anywhere;
}

.contact-link-arrow {
  justify-self: end;
  color: #a58e6e;
  font-size: .9rem;
  transition: transform .35s ease, color .35s ease;
}

.contact-links a:hover .contact-link-arrow {
  transform: translate(3px, -3px);
  color: #e2d8c7;
}

.contact-statement {
  min-height: 78vh;
  position: relative;
  padding: 8rem 3.25rem 7rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-bottom: 1px solid rgba(213, 202, 182, .17);
}

.contact-statement > p {
  margin: 0 0 1.7rem .35rem;
  color: #8f806b;
  font-size: .62rem;
  letter-spacing: .34em;
}

.contact-statement h2 {
  margin: 0;
  max-width: 1200px;
  color: rgba(216, 207, 193, .16);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(4.8rem, 11.8vw, 12.6rem);
  font-weight: 400;
  line-height: .84;
  letter-spacing: -.028em;
  user-select: none;
}

.contact-statement-meta {
  margin-top: 3.5rem;
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  color: #777168;
  font-size: .55rem;
  letter-spacing: .22em;
}

.contact-footer {
  min-height: 180px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 34px clamp(28px, 4vw, 64px);
  background: #090806;
  border-top: 0;
}
.contact-footer .footer-mark { position: relative; top: auto; left: auto; transform: scale(.84); transform-origin: left center; }
.contact-footer .return-index {
  justify-self: center;
  font-size: 8px;
  letter-spacing: .34em;
  color: rgba(216,206,192,.72);
}
.contact-footer .return-index:hover { color: #f0e7db; }
.contact-footer .copyright {
  justify-self: end;
  margin: 0;
  font-size: 7px;
  letter-spacing: .26em;
  color: rgba(199,187,170,.48);
}

@media (max-width: 980px) {
  .contact-header {
    min-height: 72vh;
    padding: 8rem 1.6rem 4rem;
  }
  .contact-mark { left: 1.6rem; }
  .contact-back { right: 1.6rem; }
  .contact-intro { width: 100%; }
  .contact-availability {
    right: auto;
    left: 1.6rem;
    bottom: 1.8rem;
  }
  .contact-channels { grid-template-columns: 1fr; }
  .contact-group {
    min-height: 390px;
    border-right: 0;
    border-bottom: 1px solid rgba(213, 202, 182, .17);
    padding: 2.3rem 1.6rem 2.5rem;
  }
  .contact-group:last-child { border-bottom: 0; }
  .contact-statement { padding: 6rem 1.6rem; }
  .contact-statement-meta { flex-direction: column; line-height: 1.7; }
}

@media (max-width: 620px) {
  .contact-header { min-height: 78vh; }
  .contact-back {
    top: 2.65rem;
    font-size: .5rem;
    letter-spacing: .16em;
  }
  .contact-intro h1 {
    font-size: clamp(3.3rem, 18vw, 5.6rem);
    line-height: .88;
  }
  .desktop-break { display: none; }
  .contact-subtitle { line-height: 1.65; }
  .contact-availability { font-size: .48rem; letter-spacing: .16em; }
  .contact-links a {
    min-height: 78px;
    grid-template-columns: 82px 1fr 20px;
    gap: .5rem;
  }
  .contact-link-label { font-size: .48rem; letter-spacing: .16em; }
  .contact-link-value { font-size: .73rem; }
  .contact-statement { min-height: 62vh; }
  .contact-statement h2 {
    font-size: clamp(3.8rem, 20vw, 6.6rem);
    line-height: .86;
    letter-spacing: -.02em;
  }
  .contact-footer {
    min-height: 150px;
    grid-template-columns: auto 1fr;
    grid-template-rows: 1fr auto;
    gap: 20px;
    padding: 28px 24px;
  }
  .contact-footer .return-index { justify-self: end; font-size: 7px; }
  .contact-footer .copyright { grid-column: 1 / -1; }
}

/* =========================================================
   WORK — V9
   ========================================================= */
.work-page { background: #090806; color: var(--ivory); }
.work-shell { min-height: 100svh; background: #090806; overflow: hidden; }
.work-header {
  min-height: 88svh;
  position: relative;
  padding: 0 clamp(30px, 4.3vw, 74px);
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 78% 38%, rgba(184,151,105,.055), transparent 29rem),
    #090806;
}
.work-mark { top: 30px; left: clamp(30px, 4.3vw, 74px); }
.work-back {
  position: absolute;
  top: 38px;
  right: clamp(30px, 4.3vw, 74px);
  font-size: 7px;
  letter-spacing: .28em;
  color: rgba(213,202,187,.62);
  transition: color .3s ease, transform .3s ease;
}
.work-back span { margin-right: 8px; letter-spacing: 0; }
.work-back:hover { color: #eee5d8; transform: translateX(-3px); }
.work-heading { width: min(1220px, 86vw); }
.work-kicker {
  margin: 0 0 32px 5px;
  font-size: 8px;
  letter-spacing: .34em;
  color: rgba(185,165,138,.74);
}
.work-heading h1 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(72px, 12.4vw, 190px);
  font-weight: 400;
  line-height: .78;
  letter-spacing: -.045em;
  color: rgba(218,209,197,.92);
}
.work-heading-meta {
  width: min(760px, 72vw);
  margin: 52px 0 0 6px;
  padding-top: 18px;
  border-top: 1px solid rgba(214,201,182,.14);
  display: flex;
  justify-content: space-between;
  gap: 32px;
  font-size: 7px;
  letter-spacing: .25em;
  color: rgba(192,181,166,.48);
}
.work-scroll {
  position: absolute;
  left: clamp(30px, 4.3vw, 74px);
  bottom: 30px;
  font-size: 7px;
  letter-spacing: .28em;
  color: rgba(218,206,190,.58);
}
.work-scroll span { margin-right: 8px; }

.work-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: minmax(410px, 52vw);
  gap: 1px;
  background: var(--line);
  border-bottom: 1px solid var(--line);
}
.work-card {
  position: relative;
  min-height: 560px;
  overflow: hidden;
  background: #0b0a08;
  isolation: isolate;
}
.work-card-wide { grid-column: span 2; min-height: 620px; }
.work-card-tall { min-height: 690px; }
.work-card-image { position: absolute; inset: 0; overflow: hidden; }
.work-card-image img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  filter: saturate(.78) contrast(1.04) brightness(.64);
  transform: scale(1.002);
  transition: transform 1.2s var(--ease), filter 1s var(--ease);
}
.work-card-wide .work-card-image img { object-position: center 54%; }
.work-card[href="horology.html"] .work-card-image img { object-position: center 47%; }
.work-card[href="f1.html"] .work-card-image img { object-position: center 52%; }
.work-card[href="yachts.html"] .work-card-image img { object-position: center 47%; }
.work-card[href="urban.html"] .work-card-image img { object-position: center 47%; }
.work-card[href="estate.html"] .work-card-image img { object-position: center 52%; }
.work-card[href="abstract.html"] .work-card-image img { object-position: center center; }
.work-card-shade {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(180deg, rgba(5,4,3,.35), rgba(5,4,3,.02) 42%, rgba(5,4,3,.62)),
    linear-gradient(90deg, rgba(5,4,3,.32), transparent 48%);
  transition: background .9s var(--ease);
}
.work-card-top {
  position: absolute; z-index: 2; top: 29px; left: 31px;
  display: flex; align-items: center; gap: 12px;
  font-size: 8px; letter-spacing: .2em; color: rgba(221,208,188,.72);
}
.work-card-top span { font-family: Georgia, "Times New Roman", serif; font-size: 13px; letter-spacing: 0; }
.work-card-top i { width: 19px; height: 1px; background: rgba(190,169,140,.55); transition: width .55s var(--ease); }
.work-card-top em { font-style: normal; color: rgba(225,215,201,.66); }
.work-card-copy { position: absolute; z-index: 2; left: 31px; bottom: 31px; }
.work-card-copy h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(29px, 4vw, 64px);
  font-weight: 400;
  letter-spacing: -.02em;
  color: rgba(229,219,205,.92);
}
.work-card-copy p { margin: 10px 0 0; font-size: 7px; letter-spacing: .22em; color: rgba(210,198,181,.56); text-transform: uppercase; }
.work-card-open {
  position: absolute; z-index: 2; right: 31px; bottom: 34px;
  font-size: 7px; letter-spacing: .26em; color: rgba(221,209,192,0);
  transform: translateY(7px); transition: color .45s var(--ease), transform .45s var(--ease);
}
.work-card:hover .work-card-image img,
.work-card:focus-visible .work-card-image img { transform: scale(1.035); filter: saturate(.9) contrast(1.04) brightness(.78); }
.work-card:hover .work-card-top i,
.work-card:focus-visible .work-card-top i { width: 36px; }
.work-card:hover .work-card-open,
.work-card:focus-visible .work-card-open { color: rgba(233,223,208,.76); transform: translateY(0); }
.work-card:hover .work-card-shade { background: linear-gradient(180deg, rgba(5,4,3,.25), rgba(5,4,3,0) 42%, rgba(5,4,3,.52)); }

.work-note {
  min-height: 70svh;
  padding: 110px clamp(30px, 8vw, 140px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-bottom: 1px solid var(--line);
}
.work-note > p { margin: 0 0 38px; font-size: 8px; letter-spacing: .34em; color: rgba(185,165,138,.7); }
.work-note h2 {
  max-width: 1080px;
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(40px, 6.4vw, 96px);
  line-height: 1.03;
  font-weight: 400;
  letter-spacing: -.03em;
  color: rgba(214,204,190,.82);
}
.work-note a {
  width: fit-content;
  margin-top: 62px;
  padding-bottom: 9px;
  border-bottom: 1px solid rgba(185,165,138,.42);
  font-size: 8px;
  letter-spacing: .27em;
  color: rgba(224,213,198,.7);
  transition: color .3s ease, border-color .3s ease;
}
.work-note a span { margin-left: 10px; }
.work-note a:hover { color: #f0e6d8; border-color: rgba(224,213,198,.8); }

.work-footer {
  min-height: 180px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 34px clamp(28px, 4vw, 64px);
  background: #090806;
}
.work-footer .footer-mark { position: relative; top: auto; left: auto; }
.work-footer-nav { display: flex; gap: clamp(28px, 4vw, 58px); }
.work-footer-nav a { font-size: 8px; letter-spacing: .32em; color: rgba(216,206,192,.66); transition: color .3s ease; }
.work-footer-nav a:hover { color: #f0e7db; }
.work-footer .copyright { justify-self: end; margin: 0; font-size: 7px; letter-spacing: .26em; color: rgba(199,187,170,.48); }

@media (max-width: 900px) {
  .work-header { min-height: 78svh; }
  .work-heading h1 { font-size: clamp(64px, 17vw, 120px); }
  .work-heading-meta { width: 100%; }
  .work-grid { grid-template-columns: 1fr; grid-auto-rows: auto; }
  .work-card, .work-card-wide, .work-card-tall { grid-column: auto; min-height: 62svh; }
  .work-card-open { color: rgba(233,223,208,.62); transform: none; }
  .work-footer { min-height: 150px; grid-template-columns: auto 1fr; grid-template-rows: 1fr auto; gap: 22px; padding: 28px 24px; }
  .work-footer-nav { justify-self: end; gap: 24px; }
  .work-footer .copyright { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
  .work-header { min-height: 82svh; padding: 0 24px; }
  .work-mark { left: 24px; top: 24px; }
  .work-back { right: 24px; top: 30px; font-size: 6px; }
  .work-kicker { margin-bottom: 24px; font-size: 7px; }
  .work-heading h1 { font-size: clamp(58px, 21vw, 92px); line-height: .82; }
  .work-heading-meta { margin-top: 38px; flex-direction: column; gap: 10px; font-size: 6px; line-height: 1.6; }
  .work-scroll { left: 24px; bottom: 26px; }
  .work-card, .work-card-wide, .work-card-tall { min-height: 66svh; }
  .work-card-top { top: 24px; left: 24px; }
  .work-card-copy { left: 24px; bottom: 52px; right: 24px; }
  .work-card-copy h2 { font-size: clamp(34px, 12vw, 52px); }
  .work-card-open { left: 24px; right: auto; bottom: 24px; font-size: 6px; }
  .work-note { min-height: 62svh; padding: 80px 24px; }
  .work-note h2 { font-size: clamp(36px, 12vw, 58px); }
  .work-note a { margin-top: 46px; }
  .work-footer-nav { gap: 16px; }
  .work-footer-nav a { font-size: 6px; letter-spacing: .22em; }
}

/* =========================================================
   WORK — V10 EDITORIAL / TEXT-LED
   ========================================================= */
.work-page-editorial { background: #090806; }
.work-editorial-shell { overflow: visible; }
.work-editorial-hero {
  min-height: 92svh;
  position: relative;
  padding: 0 clamp(30px, 5.2vw, 92px);
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, .55fr);
  align-items: center;
  gap: clamp(48px, 7vw, 130px);
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 79% 48%, rgba(177,148,107,.07), transparent 25rem),
    linear-gradient(115deg, rgba(255,255,255,.012), transparent 28%),
    #090806;
}
.work-editorial-headline { align-self: center; }
.work-editorial-headline .work-kicker { margin-left: 4px; }
.work-editorial-headline h1 {
  margin: 0;
  max-width: 1150px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(66px, 10.6vw, 164px);
  font-weight: 400;
  line-height: .84;
  letter-spacing: -.045em;
  color: rgba(219,210,197,.9);
}
.work-editorial-opening {
  align-self: center;
  padding: 34px 0 34px clamp(26px, 3.2vw, 52px);
  border-left: 1px solid rgba(213,202,182,.17);
}
.work-editorial-opening p:first-child {
  margin: 0 0 48px;
  font-size: 7px;
  letter-spacing: .3em;
  color: rgba(185,165,138,.72);
}
.work-editorial-opening p:last-child {
  margin: 0;
  max-width: 390px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(20px, 2vw, 31px);
  line-height: 1.38;
  color: rgba(210,201,188,.72);
}

.work-section-label {
  display: flex;
  align-items: center;
  gap: 13px;
  color: rgba(185,165,138,.72);
}
.work-section-label span { font-family: Georgia, "Times New Roman", serif; font-size: 13px; }
.work-section-label i { width: 22px; height: 1px; background: rgba(185,165,138,.48); }
.work-section-label p { margin: 0; font-size: 7px; letter-spacing: .3em; }

.work-philosophy {
  min-height: 78svh;
  display: grid;
  grid-template-columns: minmax(210px,.55fr) minmax(0,1.45fr);
  gap: clamp(50px, 8vw, 160px);
  padding: clamp(90px, 10vw, 150px) clamp(30px, 7vw, 120px);
  border-bottom: 1px solid var(--line);
}
.work-philosophy-copy h2 {
  margin: 0;
  max-width: 1020px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(42px, 6vw, 92px);
  line-height: 1.02;
  font-weight: 400;
  letter-spacing: -.032em;
  color: rgba(216,207,193,.88);
}
.work-copy-columns {
  max-width: 900px;
  margin-top: clamp(65px, 7vw, 104px);
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: clamp(45px, 7vw, 110px);
}
.work-copy-columns p {
  margin: 0;
  font-size: 10px;
  line-height: 2.05;
  letter-spacing: .055em;
  color: rgba(176,167,155,.68);
}

.work-values {
  display: grid;
  grid-template-columns: minmax(210px,.55fr) minmax(0,1.45fr);
  gap: clamp(50px, 8vw, 160px);
  padding: clamp(90px, 9vw, 140px) clamp(30px, 7vw, 120px);
  border-bottom: 1px solid var(--line);
}
.work-value-list { border-top: 1px solid rgba(213,202,182,.16); }
.work-value-row {
  min-height: 190px;
  display: grid;
  grid-template-columns: 70px minmax(220px,.8fr) minmax(280px,1.2fr);
  gap: clamp(28px, 4vw, 72px);
  align-items: center;
  padding: 34px 0;
  border-bottom: 1px solid rgba(213,202,182,.13);
  transition: padding-left .45s var(--ease), background .45s ease;
}
.work-value-row:hover { padding-left: 12px; background: rgba(255,255,255,.012); }
.work-value-number { font-family: Georgia, "Times New Roman", serif; font-size: 13px; color: rgba(169,149,120,.74); }
.work-value-row h3 {
  margin: 0;
  font-size: clamp(13px,1.15vw,18px);
  font-weight: 400;
  letter-spacing: .19em;
  color: rgba(218,208,194,.83);
}
.work-value-row p {
  margin: 0;
  max-width: 520px;
  font-size: 9px;
  line-height: 1.9;
  letter-spacing: .055em;
  color: rgba(156,149,140,.64);
}

.work-standard {
  min-height: 82svh;
  padding: clamp(95px, 10vw, 160px) clamp(30px, 8vw, 140px);
  display: grid;
  grid-template-columns: minmax(0,1.55fr) minmax(260px,.45fr);
  grid-template-rows: auto 1fr;
  gap: 35px clamp(60px, 8vw, 150px);
  align-items: center;
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 18% 72%, rgba(160,126,82,.055), transparent 29rem),
    #090806;
}
.work-standard > p {
  grid-column: 1 / -1;
  align-self: start;
  margin: 0;
  font-size: 7px;
  letter-spacing: .32em;
  color: rgba(185,165,138,.68);
}
.work-standard blockquote {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(52px, 7.5vw, 118px);
  line-height: .93;
  letter-spacing: -.04em;
  color: rgba(216,207,193,.17);
}
.work-standard-copy { align-self: end; padding-bottom: 12px; }
.work-standard-copy p {
  margin: 0;
  font-size: 10px;
  line-height: 1.95;
  letter-spacing: .05em;
  color: rgba(174,165,153,.67);
}
.work-standard-copy p + p { margin-top: 24px; }

.work-fields {
  position: relative;
  display: grid;
  grid-template-columns: minmax(260px,.6fr) minmax(0,1.4fr);
  gap: clamp(45px, 7vw, 120px);
  padding: clamp(90px, 9vw, 145px) clamp(30px, 7vw, 120px);
  border-bottom: 1px solid var(--line);
}
.work-fields-intro { position: sticky; top: 70px; align-self: start; }
.work-fields-intro > p {
  max-width: 300px;
  margin: 58px 0 0;
  font-size: 10px;
  line-height: 1.9;
  letter-spacing: .055em;
  color: rgba(160,151,141,.62);
}
.work-field-list { border-top: 1px solid rgba(213,202,182,.16); }
.work-field-row {
  min-height: 118px;
  position: relative;
  display: grid;
  grid-template-columns: 58px minmax(170px,.7fr) minmax(210px,1fr) 22px;
  align-items: center;
  gap: 24px;
  border-bottom: 1px solid rgba(213,202,182,.13);
  isolation: isolate;
}
.work-field-row > span { font-family: Georgia, "Times New Roman", serif; font-size: 12px; color: rgba(169,149,120,.68); }
.work-field-row h3 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(24px, 2.6vw, 43px);
  font-weight: 400;
  letter-spacing: -.015em;
  color: rgba(215,206,193,.82);
  transition: transform .4s var(--ease), color .4s ease;
}
.work-field-row > p {
  margin: 0;
  font-size: 7px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(157,148,136,.55);
}
.work-field-row > b { justify-self: end; font-size: 12px; font-weight: 400; color: rgba(185,165,138,.56); transition: transform .4s var(--ease), color .4s ease; }
.work-field-row > img {
  position: absolute;
  right: 68px;
  top: 50%;
  width: min(330px, 31vw);
  height: 190px;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  transform: translateY(-46%) scale(.96);
  pointer-events: none;
  z-index: 5;
  filter: saturate(.72) contrast(1.04) brightness(.72);
  box-shadow: 0 20px 55px rgba(0,0,0,.42);
  transition: opacity .42s var(--ease), transform .5s var(--ease);
}
.work-field-row:hover h3 { transform: translateX(9px); color: #e5dccf; }
.work-field-row:hover > b { transform: translate(4px,-4px); color: #e3d8c8; }
.work-field-row:hover > img { opacity: 1; transform: translateY(-50%) scale(1); }

.work-cta {
  min-height: 72svh;
  padding: clamp(90px, 10vw, 150px) clamp(30px, 8vw, 140px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-bottom: 1px solid var(--line);
}
.work-cta > p { margin: 0 0 42px; font-size: 7px; letter-spacing: .3em; color: rgba(185,165,138,.68); }
.work-cta h2 {
  margin: 0;
  max-width: 1220px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(48px, 7.2vw, 112px);
  line-height: .95;
  font-weight: 400;
  letter-spacing: -.037em;
  color: rgba(215,205,191,.82);
}
.work-cta a {
  width: fit-content;
  margin-top: 62px;
  padding-bottom: 9px;
  border-bottom: 1px solid rgba(185,165,138,.42);
  font-size: 8px;
  letter-spacing: .28em;
  color: rgba(224,213,198,.7);
  transition: color .3s ease, border-color .3s ease;
}
.work-cta a span { margin-left: 10px; }
.work-cta a:hover { color: #f0e6d8; border-color: rgba(224,213,198,.8); }

@media (max-width: 980px) {
  .work-editorial-hero { grid-template-columns: 1fr; align-content: center; gap: 55px; min-height: 90svh; }
  .work-editorial-opening { max-width: 620px; }
  .work-philosophy, .work-values, .work-fields { grid-template-columns: 1fr; }
  .work-copy-columns { max-width: none; }
  .work-fields-intro { position: static; }
  .work-fields-intro > p { max-width: 500px; margin-top: 34px; }
  .work-standard { grid-template-columns: 1fr; }
  .work-standard > p { grid-column: auto; }
  .work-standard-copy { max-width: 620px; }
  .work-field-row > img { display: none; }
}

@media (max-width: 640px) {
  .work-editorial-hero { min-height: 88svh; padding: 0 24px; gap: 42px; }
  .work-editorial-headline h1 { font-size: clamp(52px, 18vw, 78px); line-height: .86; }
  .work-editorial-opening { padding: 22px 0 22px 20px; }
  .work-editorial-opening p:first-child { margin-bottom: 28px; font-size: 6px; }
  .work-editorial-opening p:last-child { font-size: 18px; line-height: 1.45; }
  .work-philosophy, .work-values, .work-fields { padding: 78px 24px; gap: 52px; }
  .work-philosophy-copy h2 { font-size: clamp(38px, 12vw, 54px); }
  .work-copy-columns { grid-template-columns: 1fr; margin-top: 50px; gap: 30px; }
  .work-value-row { grid-template-columns: 38px 1fr; gap: 16px; padding: 30px 0; }
  .work-value-row h3 { font-size: 13px; line-height: 1.55; }
  .work-value-row p { grid-column: 2; font-size: 9px; }
  .work-standard { min-height: 72svh; padding: 80px 24px; gap: 42px; }
  .work-standard blockquote { font-size: clamp(46px, 15vw, 68px); }
  .work-field-row { min-height: 100px; grid-template-columns: 34px 1fr 20px; gap: 13px; }
  .work-field-row h3 { font-size: 27px; }
  .work-field-row > p { grid-column: 2; margin-top: -18px; font-size: 6px; line-height: 1.5; }
  .work-field-row > b { grid-column: 3; grid-row: 1 / span 2; }
  .work-cta { min-height: 66svh; padding: 82px 24px; }
  .work-cta h2 { font-size: clamp(42px, 13vw, 61px); }
}


/* =========================================================
   V10.3 — MOBILE / TABLET FINISHING PASS
   Keeps the approved desktop composition intact.
   ========================================================= */

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

@media (hover: none), (pointer: coarse) {
  .project:hover img,
  .project:focus-visible img,
  .project-page .stage-image:hover img,
  .about-editorial-image:hover img,
  .approach-manifesto:hover .approach-manifesto-image img,
  .approach-step:hover .approach-step-visual img {
    transform: none;
  }
  .project:hover .shade,
  .project:focus-visible .shade { background: linear-gradient(180deg, rgba(5,4,3,.18), rgba(5,4,3,.05) 55%, rgba(5,4,3,.18)); }
  .project::after { display: none; }
  .approach-step:hover .approach-step-visual { transform: none; opacity: .78; }
  .work-value-row:hover { padding-left: 0; background: transparent; }
  .work-field-row:hover h3 { transform: none; color: rgba(215,206,193,.82); }
  .work-field-row:hover > b { transform: none; color: rgba(185,165,138,.56); }
}

@media (max-width: 980px) {
  .back-home,
  .about-back,
  .approach-back,
  .work-back,
  .contact-back,
  .return-index {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  .work-editorial-hero {
    padding-top: 92px;
    padding-bottom: 78px;
  }
}

@media (max-width: 640px) {
  /* HOME */
  .hero {
    height: 80svh;
    min-height: 620px;
  }
  .project {
    height: 56svh;
    min-height: 430px;
  }
  .hero img { object-position: 59% 54%; }
  .urban img { object-position: 57% 48%; }
  .automotive img { object-position: 58% 54%; }
  .horology img { object-position: 56% 48%; }
  .estate img { object-position: 56% 53%; }
  .f1 img { object-position: 60% 54%; }
  .yachts img { object-position: 56% 48%; }
  .abstract img { object-position: 63% center; }

  .hero-copy { right: 24px; }
  .hero h1 {
    max-width: 100%;
    font-size: clamp(24px, 7.4vw, 34px);
    letter-spacing: .2em;
  }
  .disciplines {
    max-width: 100%;
    line-height: 1.7;
  }
  .footer {
    padding-left: max(24px, env(safe-area-inset-left));
    padding-right: max(24px, env(safe-area-inset-right));
  }
  .footer nav {
    display: grid;
    grid-template-columns: repeat(2, auto);
    justify-content: end;
    gap: 18px 24px;
    max-width: none;
  }

  /* PROJECT PAGES */
  .project-page .project-hero { min-height: 82svh; }
  .project-page .project-topbar {
    left: max(23px, env(safe-area-inset-left));
    right: max(23px, env(safe-area-inset-right));
  }
  .project-page .project-title-wrap {
    left: max(24px, env(safe-area-inset-left));
    right: max(22px, env(safe-area-inset-right));
  }
  .project-page .project-title {
    font-size: clamp(40px, 13vw, 58px);
    line-height: .92;
  }
  .field-automotive .project-title,
  .field-horology .project-title,
  .field-abstract .project-title {
    font-size: clamp(36px, 11.2vw, 48px);
    letter-spacing: .04em;
  }
  .field-estate .project-title {
    font-size: clamp(34px, 10.7vw, 46px);
  }
  .project-page .project-subtitle {
    max-width: 92%;
    letter-spacing: .2em;
  }
  .project-page .project-intro,
  .project-page .stage-note {
    padding-left: max(24px, env(safe-area-inset-left));
    padding-right: max(24px, env(safe-area-inset-right));
  }

  /* ABOUT */
  .about-heading h1 {
    font-size: clamp(54px, 18vw, 76px);
  }
  .about-editorial-copy {
    min-height: auto;
    padding: 70px 24px;
  }
  .about-editorial-copy h2 {
    margin: 72px 0 58px;
  }
  .about-details {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  /* APPROACH */
  .approach-hero,
  .approach-hero-copy,
  .approach-visual {
    min-height: 84svh;
  }
  .approach-heading h1 {
    font-size: clamp(42px, 12.5vw, 54px);
    letter-spacing: .045em;
  }
  .approach-principle-copy h2 {
    font-size: clamp(33px, 10.6vw, 45px);
  }
  .approach-step {
    padding-top: 34px;
    padding-bottom: 42px;
  }
  .approach-step-visual {
    height: 150px;
  }
  .approach-manifesto-copy {
    min-height: auto;
    padding: 70px 24px 76px;
  }
  .approach-manifesto-copy blockquote {
    margin: 76px 0 38px;
    font-size: clamp(42px, 13.5vw, 58px);
  }

  /* CONTACT */
  .contact-header {
    min-height: 82svh;
    padding-top: 8.5rem;
    padding-bottom: 4.5rem;
  }
  .contact-intro h1 {
    font-size: clamp(3.15rem, 16.5vw, 4.8rem);
    line-height: .9;
    letter-spacing: -.04em;
  }
  .contact-group {
    min-height: 350px;
  }
  .contact-links a {
    min-height: 76px;
  }
  .contact-statement {
    min-height: 60svh;
    padding-top: 5.5rem;
    padding-bottom: 5.5rem;
  }
  .contact-statement h2 {
    font-size: clamp(3.7rem, 18.2vw, 6rem);
    line-height: .88;
  }

  /* WORK — text-led editorial page */
  .work-editorial-hero {
    min-height: 100svh;
    padding: 100px 24px 76px;
    align-content: center;
    gap: 40px;
  }
  .work-editorial-headline h1 {
    max-width: 100%;
    font-size: clamp(44px, 13.8vw, 58px);
    line-height: .9;
    letter-spacing: -.035em;
  }
  .work-editorial-opening {
    padding: 20px 0 20px 18px;
  }
  .work-editorial-opening p:first-child {
    margin-bottom: 24px;
  }
  .work-editorial-opening p:last-child {
    font-size: clamp(17px, 4.7vw, 20px);
  }
  .work-philosophy-copy h2 {
    font-size: clamp(35px, 10.2vw, 45px);
    line-height: 1.06;
  }
  .work-value-row {
    min-height: 0;
    padding: 34px 0;
  }
  .work-standard blockquote {
    font-size: clamp(35px, 10vw, 46px);
    line-height: 1.02;
  }
  .work-field-row h3 {
    font-size: clamp(23px, 7vw, 28px);
  }
  .work-cta h2 {
    font-size: clamp(34px, 9.7vw, 43px);
    line-height: 1;
  }
  .work-cta > p {
    line-height: 1.8;
  }
  .work-footer-nav {
    display: grid;
    grid-template-columns: repeat(3, auto);
    gap: 14px;
  }
}

@media (max-width: 390px) {
  .footer nav { gap: 16px 18px; }
  .work-footer-nav { gap: 10px; }
  .work-footer-nav a { letter-spacing: .18em; }
  .contact-link-value { font-size: .68rem; }
}


/* =========================================================
   V10.4 — LOCAL MOBILE HOME RELIABILITY
   The Home's seven project images are small enough to load eagerly.
   On narrow screens, disable the reveal clipping on the Home only so
   local file previews and mobile emulation cannot leave cards blank.
   ========================================================= */
@media (max-width: 640px) {
  .portfolio .reveal,
  .portfolio .reveal.is-visible {
    opacity: 1 !important;
    clip-path: none !important;
    animation: none !important;
  }

  .portfolio .panel,
  .portfolio .project {
    visibility: visible !important;
  }
}