:root {
  --ivory: #F5F2EE;
  --charcoal: #2D2D2D;
  --gold: #A58F6F;
  --stone: #D7D1C8;
  --stone-dark: #B8B0A5;
  --warm-white: #FBF9F6;
  --black: #181817;
  --line: rgba(45,45,45,.18);
  --pad: clamp(24px, 5vw, 78px);
  --header-h: 104px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  background: var(--ivory);
}

body {
  margin: 0;
  color: var(--charcoal);
  background: var(--ivory);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  -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%; display: block; }

::selection {
  background: var(--gold);
  color: var(--ivory);
}

.site-header {
  position: absolute;
  z-index: 50;
  top: 0;
  left: 0;
  width: 100%;
  min-height: var(--header-h);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 30px var(--pad);
  color: var(--ivory);
}

.brand { display: inline-flex; }

.brand-mark {
  width: 94px;
  height: 112px;
  border: 1px solid rgba(245,242,238,.72);
  outline: 1px solid rgba(165,143,111,.55);
  outline-offset: 4px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  letter-spacing: .14em;
  background: rgba(245,242,238,.07);
  backdrop-filter: blur(6px);
}

.brand-main {
  font-size: 12px;
  line-height: 1.16;
  letter-spacing: .16em;
}

.brand-sub {
  margin-top: 8px;
  font-size: 5px;
  letter-spacing: .30em;
}

.desktop-nav {
  display: flex;
  align-items: center;
  gap: clamp(22px, 3vw, 48px);
  margin-top: 10px;
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.desktop-nav a {
  position: relative;
  padding-bottom: 8px;
}

.desktop-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background: currentColor;
  transition: width .35s var(--ease);
}

.desktop-nav a:hover::after { width: 100%; }

.menu-button {
  display: none;
  border: 0;
  background: none;
  width: 34px;
  height: 34px;
  padding: 8px 0;
  color: inherit;
  cursor: pointer;
}

.menu-button span {
  display: block;
  height: 1px;
  width: 30px;
  background: currentColor;
  margin: 6px 0;
  transition: transform .3s var(--ease), opacity .3s var(--ease);
}

.mobile-menu {
  position: fixed;
  z-index: 40;
  inset: 0;
  background: var(--charcoal);
  color: var(--ivory);
  transform: translateY(-100%);
  transition: transform .55s var(--ease);
}

.mobile-menu.open { transform: translateY(0); }

.mobile-menu-inner {
  min-height: 100%;
  padding: 180px var(--pad) 46px;
  display: flex;
  flex-direction: column;
  gap: 13px;
}

.mobile-menu-inner > a {
  font-size: clamp(38px, 9vw, 64px);
  font-weight: 300;
  letter-spacing: -.04em;
  line-height: 1.05;
}

.mobile-meta {
  margin-top: auto;
  padding-top: 40px;
  border-top: 1px solid rgba(245,242,238,.2);
  display: grid;
  gap: 8px;
  font-size: 11px;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.hero {
  min-height: 100svh;
  position: relative;
  background: #302e2a;
  color: var(--ivory);
  overflow: hidden;
}

.hero-visual {
  position: absolute;
  inset: 0;
}

.hero-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(18,18,17,.58) 0%, rgba(18,18,17,.22) 50%, rgba(18,18,17,.12) 100%),
    linear-gradient(0deg, rgba(18,18,17,.32) 0%, transparent 45%);
}

.architecture {
  position: relative;
  overflow: hidden;
}

.architecture-a {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #6d675f 0%, #b3a999 55%, #d9d0c4 100%);
}

.arch-wall {
  position: absolute;
  width: 58%;
  height: 100%;
  right: -2%;
  top: 0;
  background: linear-gradient(180deg, #c9c0b4 0%, #a49a8c 100%);
  transform: skewX(-4deg);
  transform-origin: top;
}

.arch-opening {
  position: absolute;
  width: 28%;
  height: 72%;
  right: 14%;
  top: 10%;
  border-radius: 150px 150px 0 0;
  background: linear-gradient(135deg, #35332f 0%, #5c574f 100%);
  box-shadow: inset 30px 0 50px rgba(0,0,0,.18);
}

.arch-floor {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 27%;
  background:
    linear-gradient(10deg, transparent 48%, rgba(255,255,255,.12) 49%, transparent 50%),
    linear-gradient(90deg, #4d4943, #7e756c);
  clip-path: polygon(0 12%, 100% 0, 100% 100%, 0 100%);
}

.arch-object {
  position: absolute;
  width: 28%;
  height: 19%;
  right: 33%;
  bottom: 18%;
  border-radius: 6px 6px 2px 2px;
  background: linear-gradient(180deg, #786d60, #514a42);
  box-shadow: 0 25px 45px rgba(0,0,0,.18);
}

.arch-light {
  position: absolute;
  top: -4%;
  left: 27%;
  width: 1px;
  height: 43%;
  background: rgba(255,246,220,.8);
  box-shadow: 0 0 24px rgba(255,238,198,.9);
}
.arch-light::after {
  content: "";
  position: absolute;
  left: -44px;
  bottom: -18px;
  width: 88px;
  height: 20px;
  border-radius: 50%;
  background: rgba(255,235,194,.45);
  filter: blur(4px);
}

.hero-content {
  position: relative;
  z-index: 2;
  min-height: 100svh;
  padding: 46vh var(--pad) 54px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.eyebrow {
  margin: 0 0 28px;
  font-size: 10px;
  line-height: 1.3;
  text-transform: uppercase;
  letter-spacing: .22em;
}

.eyebrow.dark { color: #777168; }
.eyebrow.light-gold { color: #c5b18f; }

.hero h1,
.intro h2,
.projects-title h2,
.services h2,
.material-copy h2,
.process-head h2,
.contact h2 {
  margin: 0;
  font-weight: 300;
  letter-spacing: -.045em;
}

.hero h1 {
  max-width: 1050px;
  font-size: clamp(50px, 7vw, 116px);
  line-height: .94;
}

.hero-bottom {
  margin-top: 46px;
  padding-top: 22px;
  border-top: 1px solid rgba(245,242,238,.35);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.hero-bottom p { margin: 0; }

.text-link {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  width: fit-content;
  padding-bottom: 7px;
  border-bottom: 1px solid rgba(45,45,45,.35);
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  transition: gap .3s var(--ease);
}

.text-link.light { border-color: rgba(245,242,238,.45); }
.text-link:hover { gap: 24px; }

.scroll-cue {
  position: absolute;
  z-index: 4;
  right: var(--pad);
  bottom: 42px;
  display: none;
}

.section-pad {
  padding: clamp(86px, 10vw, 164px) var(--pad);
}

.section-number {
  margin-bottom: 56px;
  font-size: 9px;
  letter-spacing: .18em;
  color: var(--gold);
}

.intro {
  background: var(--ivory);
}

.intro-grid {
  display: grid;
  grid-template-columns: .75fr 2.25fr;
  gap: 8vw;
}

.intro h2 {
  max-width: 1030px;
  font-size: clamp(42px, 5.8vw, 92px);
  line-height: 1.01;
}

.lead-copy {
  max-width: 760px;
  margin: 54px 0 34px;
  font-size: clamp(17px, 1.5vw, 23px);
  line-height: 1.65;
  color: #666159;
  font-weight: 300;
}

.projects {
  background: var(--warm-white);
  padding-bottom: 100px;
}

.projects-head {
  padding-bottom: 62px;
}

.projects-title {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.projects-title h2 {
  font-size: clamp(64px, 9vw, 150px);
  line-height: .8;
}

.project {
  margin: 0 var(--pad) clamp(90px, 10vw, 160px);
}

.project-wide .project-image {
  height: min(73vw, 820px);
}

.project-image {
  min-height: 480px;
}

.placeholder-label {
  position: absolute;
  right: 22px;
  bottom: 18px;
  z-index: 4;
  font-size: 8px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(45,45,45,.56);
}

.light-label { color: rgba(245,242,238,.58); }

.project-meta {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 30px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
}

.project-meta > div:first-child {
  display: flex;
  gap: 22px;
  align-items: baseline;
}

.project-meta h3 {
  margin: 0;
  font-size: clamp(21px, 2.5vw, 36px);
  font-weight: 400;
  letter-spacing: -.025em;
}

.project-index {
  font-size: 8px;
  letter-spacing: .16em;
  color: var(--gold);
}

.project-meta > div:last-child {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: baseline;
  font-size: 9px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #777168;
}

.project-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(30px, 7vw, 120px);
  padding: 0 var(--pad);
}

.project-pair .project {
  margin-left: 0;
  margin-right: 0;
}

.project-pair .portrait {
  height: 66vw;
  max-height: 920px;
  min-height: 560px;
}

.pair-offset {
  padding-top: clamp(80px, 13vw, 180px);
}

.architecture-b {
  background: linear-gradient(140deg, #cabfb2, #8f8276 65%, #4b4945);
}
.b-wall {
  position: absolute;
  inset: 0 0 28% 0;
  background: linear-gradient(90deg, #b9ab9e, #d7cec3);
}
.b-panel {
  position: absolute;
  top: 8%;
  right: 12%;
  width: 32%;
  height: 58%;
  background: repeating-linear-gradient(90deg,#554a42 0,#554a42 8px,#5d5148 9px,#5d5148 13px);
  opacity: .82;
}
.b-sofa {
  position: absolute;
  left: 18%;
  bottom: 18%;
  width: 48%;
  height: 24%;
  border-radius: 14px 30px 8px 8px;
  background: linear-gradient(180deg,#91877f,#6d655f);
  box-shadow: 0 28px 34px rgba(0,0,0,.18);
}
.b-table {
  position: absolute;
  left: 52%;
  bottom: 12%;
  width: 18%;
  height: 8%;
  border-radius: 50%;
  background: #3e3c39;
  box-shadow: 0 18px 22px rgba(0,0,0,.24);
}
.b-light {
  position: absolute;
  top: 0;
  left: 28%;
  width: 22%;
  height: 70%;
  background: linear-gradient(100deg,rgba(255,244,219,.38),transparent 65%);
  transform: skewX(-15deg);
}

.architecture-c {
  background: linear-gradient(165deg,#d5cbc0,#9f9387);
}
.c-wall { position:absolute; inset:0; background:linear-gradient(90deg,#c8bbb0 0 58%,#9c9084 58%); }
.c-arch {
  position:absolute;
  left:12%;
  top:8%;
  width:48%;
  height:76%;
  border-radius:220px 220px 0 0;
  background:linear-gradient(150deg,#6f655d,#403e3a);
}
.c-console {
  position:absolute;
  right:8%;
  bottom:24%;
  width:42%;
  height:9%;
  background:#6d5a48;
  box-shadow:0 20px 28px rgba(0,0,0,.16);
}
.c-vase {
  position:absolute;
  right:21%;
  bottom:33%;
  width:9%;
  height:18%;
  background:#c6b59d;
  border-radius:50% 50% 36% 36% / 24% 24% 62% 62%;
}

.architecture-d {
  background: linear-gradient(135deg,#5a534c,#9d8f80);
}
.d-wall {
  position:absolute;
  inset:0 0 0 40%;
  background:linear-gradient(180deg,#b5a89b,#897b70);
}
.d-island {
  position:absolute;
  left:8%;
  bottom:12%;
  width:76%;
  height:26%;
  transform:skewX(-7deg);
  background:linear-gradient(90deg,#ded6ce,#a89e95);
  box-shadow:0 28px 45px rgba(0,0,0,.24);
}
.d-pendant {
  position:absolute;
  top:0;
  width:1px;
  height:34%;
  background:rgba(247,231,196,.7);
}
.d-pendant::after {
  content:"";
  position:absolute;
  width:50px;
  height:7px;
  left:-25px;
  bottom:0;
  background:#242321;
  border-radius:50%;
  box-shadow:0 8px 20px rgba(255,224,162,.35);
}
.d-pendant.one { left:35%; }
.d-pendant.two { left:57%; height:41%; }
.d-shadow {
  position:absolute;
  top:0;
  left:0;
  width:34%;
  height:100%;
  background:linear-gradient(90deg,rgba(0,0,0,.32),transparent);
}

.projects-cta {
  padding-top: 0;
  padding-bottom: 20px;
  display: flex;
  justify-content: flex-end;
}

.services {
  background: var(--charcoal);
  color: var(--ivory);
}

.services .section-number { color: #c5b18f; }

.services-grid {
  display: grid;
  grid-template-columns: .9fr 1.35fr;
  gap: 10vw;
}

.services-intro {
  position: sticky;
  top: 50px;
  align-self: start;
}

.services h2 {
  font-size: clamp(52px, 6vw, 94px);
  line-height: .98;
}

.services-intro > p:last-child {
  max-width: 450px;
  margin-top: 40px;
  color: #bdb8b0;
  font-size: 16px;
  line-height: 1.7;
}

.service-list {
  border-top: 1px solid rgba(245,242,238,.24);
}

.service-item {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 24px;
  padding: 34px 0 38px;
  border-bottom: 1px solid rgba(245,242,238,.18);
}

.service-item > span {
  padding-top: 7px;
  font-size: 8px;
  letter-spacing: .16em;
  color: #c5b18f;
}

.service-item h3 {
  margin: 0;
  font-size: clamp(27px, 2.6vw, 43px);
  font-weight: 300;
  letter-spacing: -.025em;
}

.service-item p {
  margin: 13px 0 0;
  max-width: 630px;
  color: #aaa59e;
  line-height: 1.65;
  font-size: 14px;
}

.material-story {
  min-height: 760px;
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  background: #ddd5ca;
}

.material-image {
  min-height: 760px;
}

.architecture-e {
  background: linear-gradient(135deg,#776d62,#3b3834);
}
.e-wall {
  position:absolute;
  inset:0 42% 0 0;
  background:linear-gradient(180deg,#b8ad9f,#746a60);
}
.e-stone {
  position:absolute;
  left:11%;
  top:20%;
  width:58%;
  height:54%;
  background:
    linear-gradient(115deg,transparent 0 47%,rgba(255,255,255,.19) 48%,transparent 50%),
    linear-gradient(160deg,#d8d1c8,#938a81);
  box-shadow:0 20px 50px rgba(0,0,0,.2);
}
.e-oak {
  position:absolute;
  right:0;
  top:0;
  width:38%;
  height:100%;
  background:repeating-linear-gradient(90deg,#665344 0,#665344 8px,#715d4c 9px,#715d4c 15px);
}
.e-line {
  position:absolute;
  left:33%;
  top:12%;
  width:1px;
  height:76%;
  background:rgba(248,224,177,.72);
  box-shadow:0 0 18px rgba(248,224,177,.4);
}

.material-copy {
  padding: clamp(70px, 9vw, 140px) var(--pad);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.material-copy h2 {
  max-width: 620px;
  font-size: clamp(43px, 5.3vw, 82px);
  line-height: 1.01;
}

.material-copy > p:last-child {
  max-width: 570px;
  margin-top: 36px;
  color: #6c665e;
  line-height: 1.7;
  font-size: 16px;
}

.process {
  background: var(--ivory);
}

.process-head {
  max-width: 1000px;
  margin-left: 24%;
}

.process-head h2 {
  font-size: clamp(45px, 5.7vw, 90px);
  line-height: 1.01;
}

.process-list {
  margin-top: 90px;
  border-top: 1px solid var(--line);
}

.process-step {
  display: grid;
  grid-template-columns: .28fr .8fr 1.4fr;
  gap: 30px;
  padding: 30px 0 34px;
  border-bottom: 1px solid var(--line);
}

.process-step > span {
  font-size: 8px;
  letter-spacing: .16em;
  color: var(--gold);
  padding-top: 8px;
}

.process-step h3 {
  margin: 0;
  font-size: clamp(24px, 2.4vw, 38px);
  font-weight: 300;
}

.process-step p {
  margin: 3px 0 0;
  max-width: 620px;
  color: #6c665e;
  line-height: 1.65;
  font-size: 14px;
}

.contact {
  background: var(--black);
  color: var(--ivory);
  min-height: 720px;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 90px var(--pad);
}

.contact-inner {
  width: min(100%, 1150px);
}

.contact h2 {
  font-size: clamp(70px, 10vw, 170px);
  line-height: .83;
}

.contact-email {
  display: block;
  width: fit-content;
  margin: 54px auto 0;
  font-size: clamp(18px, 2vw, 30px);
  font-weight: 300;
  padding-bottom: 7px;
  border-bottom: 1px solid rgba(245,242,238,.3);
}

.contact-button {
  margin: 50px auto 0;
  width: 210px;
  height: 210px;
  border-radius: 50%;
  border: 1px solid rgba(165,143,111,.75);
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  font-size: 10px;
  letter-spacing: .15em;
  text-transform: uppercase;
  transition: background .35s var(--ease), color .35s var(--ease), transform .35s var(--ease);
}

.contact-button span { font-size: 16px; }

.contact-button:hover {
  background: var(--gold);
  color: var(--black);
  transform: scale(1.04);
}

footer {
  position: relative;
  padding: 72px var(--pad) 34px;
  background: var(--ivory);
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr;
  gap: 50px;
  font-size: 11px;
  line-height: 1.8;
}

.footer-logo {
  display: flex;
  flex-direction: column;
  gap: 8px;
  letter-spacing: .2em;
}

.footer-brand {
  font-size: clamp(24px, 2.4vw, 38px);
  letter-spacing: .08em;
}

.footer-logo > span:last-child {
  font-size: 7px;
  letter-spacing: .36em;
}

.footer-col {
  display: flex;
  flex-direction: column;
}
.footer-col > span:first-child {
  margin-bottom: 12px;
  color: #8a8278;
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: 8px;
}

.footer-bottom {
  grid-column: 1 / -1;
  margin-top: 62px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  color: #777168;
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* gentle reveal */
.reveal {
  opacity: 0;
  transform: translateY(18px);
  animation: reveal .9s .15s forwards var(--ease);
}
@keyframes reveal {
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 920px) {
  :root { --header-h: 88px; }

  .site-header {
    padding-top: 24px;
  }

  .brand-mark {
    width: 78px;
    height: 93px;
  }

  .brand-main { font-size: 10px; }
  .brand-sub { font-size: 4.5px; margin-top: 6px; }

  .desktop-nav { display: none; }
  .menu-button { display: block; z-index: 60; }

  .menu-open .menu-button span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .menu-open .menu-button span:last-child { transform: translateY(-3.5px) rotate(-45deg); }

  .hero-content {
    padding-top: 36vh;
  }

  .hero h1 {
    font-size: clamp(48px, 11vw, 86px);
    max-width: 850px;
  }

  .hero-bottom {
    align-items: flex-end;
  }

  .intro-grid,
  .services-grid,
  .material-story {
    grid-template-columns: 1fr;
  }

  .intro-grid {
    gap: 28px;
  }

  .intro-grid > div:first-child {
    display: none;
  }

  .projects-title {
    align-items: flex-start;
    flex-direction: column;
    gap: 18px;
  }

  .project-pair {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .project-pair .portrait {
    height: 105vw;
    max-height: 850px;
  }

  .pair-offset {
    padding-top: 0;
  }

  .services-intro {
    position: static;
    margin-bottom: 70px;
  }

  .material-image {
    min-height: 68vw;
  }

  .process-head {
    margin-left: 0;
  }

  footer {
    grid-template-columns: 1.3fr 1fr;
  }
}

@media (max-width: 620px) {
  :root { --pad: 20px; }

  .site-header { padding: 18px var(--pad); }

  .brand-mark {
    width: 70px;
    height: 84px;
    outline-offset: 3px;
  }

  .hero-content {
    padding: 40vh var(--pad) 34px;
  }

  .hero h1 {
    font-size: clamp(45px, 12vw, 67px);
    line-height: .95;
  }

  .hero-bottom {
    margin-top: 32px;
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }

  .section-pad {
    padding: 78px var(--pad);
  }

  .section-number {
    margin-bottom: 38px;
  }

  .intro h2,
  .material-copy h2,
  .process-head h2 {
    font-size: 43px;
  }

  .lead-copy {
    margin-top: 34px;
    font-size: 16px;
  }

  .projects-head {
    padding-bottom: 40px;
  }

  .projects-title h2 {
    font-size: 68px;
  }

  .project {
    margin-bottom: 82px;
  }

  .project-wide .project-image,
  .project-image {
    min-height: 0;
    height: 105vw;
    max-height: 620px;
  }

  .project-meta {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .project-meta > div:last-child {
    justify-content: flex-start;
    gap: 22px;
  }

  .project-pair .portrait {
    min-height: 0;
    height: 116vw;
  }

  .services h2 {
    font-size: 52px;
  }

  .service-item {
    grid-template-columns: 28px 1fr;
    gap: 14px;
    padding: 28px 0 30px;
  }

  .service-item h3 { font-size: 28px; }

  .material-image {
    min-height: 100vw;
  }

  .material-copy {
    padding: 72px var(--pad);
  }

  .process-list {
    margin-top: 58px;
  }

  .process-step {
    grid-template-columns: 32px 1fr;
    gap: 10px 14px;
  }

  .process-step p {
    grid-column: 2;
  }

  .contact {
    min-height: 650px;
  }

  .contact h2 {
    font-size: 68px;
  }

  .contact-button {
    width: 165px;
    height: 165px;
  }

  footer {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .footer-bottom {
    margin-top: 26px;
    flex-direction: column;
    gap: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}


.inner-page{background:var(--ivory)}.inner-header{position:relative;color:var(--charcoal)}.inner-header .brand-mark{border-color:rgba(45,45,45,.48);outline-color:rgba(165,143,111,.62);background:transparent;backdrop-filter:none}.inner-hero{min-height:78vh;padding:clamp(70px,9vw,130px) var(--pad);display:grid;grid-template-columns:1.05fr .95fr;gap:6vw;align-items:center}.compact-hero{min-height:58vh;grid-template-columns:1fr}.inner-hero-copy h1,.contact-page h1,.project-detail-title h1{margin:0;font-size:clamp(64px,9vw,148px);line-height:.86;font-weight:300;letter-spacing:-.05em}.inner-lead{max-width:680px;margin:40px 0 0;font-size:clamp(18px,1.6vw,25px);line-height:1.55;color:#6b655e;font-weight:300}.inner-hero-art{min-height:560px;height:62vh}.content-split{display:grid;grid-template-columns:.7fr 2fr;gap:8vw}.prose-large h2,.project-story h2{margin:0 0 38px;font-size:clamp(42px,5.4vw,82px);line-height:1.02;font-weight:300;letter-spacing:-.04em}.prose-large p,.project-story p{max-width:760px;font-size:18px;line-height:1.75;color:#6a655d}.statement-band{padding:clamp(90px,11vw,160px) var(--pad);background:var(--stone)}.statement-band p{max-width:1200px;margin:0 auto;font-size:clamp(38px,5vw,78px);line-height:1.06;font-weight:300;letter-spacing:-.04em}.values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}.value-card{min-height:320px;padding:30px 30px 34px 0;border-top:1px solid var(--line);border-right:1px solid var(--line)}.value-card+.value-card{padding-left:30px}.value-card:last-child{border-right:0}.value-card span,.service-row>span,.process-detail article>span{color:var(--gold);font-size:8px;letter-spacing:.17em}.value-card h3{margin:70px 0 18px;font-size:32px;font-weight:300}.value-card p{color:#6d675f;line-height:1.65}.page-cta{min-height:620px;padding:90px var(--pad);background:var(--black);color:var(--ivory);display:grid;place-items:center;text-align:center}.page-cta h2{margin:0;font-size:clamp(58px,8vw,130px);line-height:.92;font-weight:300;letter-spacing:-.05em}.page-cta .contact-button{margin-top:48px}.service-page-list{padding-top:30px}.service-row{display:grid;grid-template-columns:70px 1.1fr 1fr;gap:36px;padding:42px 0 48px;border-top:1px solid var(--line)}.service-row:last-child{border-bottom:1px solid var(--line)}.service-row h2{margin:0;font-size:clamp(36px,4.3vw,68px);font-weight:300;letter-spacing:-.04em}.service-row p{margin:0 0 20px;max-width:620px;color:#69635c;line-height:1.7}.service-row small{font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:#8b8379}.archive-projects{padding-top:20px}.project-link{display:block}.process-detail article{display:grid;grid-template-columns:70px 1fr;gap:36px;padding:48px 0 56px;border-top:1px solid var(--line)}.process-detail article:last-child{border-bottom:1px solid var(--line)}.process-detail h2{margin:0 0 18px;font-size:clamp(40px,4.8vw,72px);font-weight:300;letter-spacing:-.04em}.process-detail p{max-width:780px;margin:0;font-size:17px;line-height:1.7;color:#69635c}.contact-page{min-height:calc(100svh - 170px);padding:clamp(90px,10vw,160px) var(--pad);background:var(--charcoal);color:var(--ivory);display:grid;grid-template-columns:1.25fr .75fr;gap:9vw;align-items:end}.contact-page h1{font-size:clamp(72px,10vw,160px)}.contact-page-copy>p:last-child{max-width:650px;margin-top:44px;color:#bdb8b0;font-size:18px;line-height:1.7}.contact-details{border-top:1px solid rgba(245,242,238,.22)}.contact-details>div{padding:28px 0 32px;border-bottom:1px solid rgba(245,242,238,.18)}.contact-details span{display:block;margin-bottom:13px;color:#c5b18f;font-size:8px;letter-spacing:.18em;text-transform:uppercase}.contact-details a,.contact-details p{margin:0;font-size:17px;line-height:1.6;font-weight:300}.project-detail-hero{padding:clamp(70px,8vw,120px) var(--pad) clamp(80px,10vw,140px)}.project-detail-title{margin-bottom:60px}.project-detail-title h1{max-width:1200px}.project-facts{margin-top:30px;display:flex;gap:32px;color:#746e66;font-size:10px;letter-spacing:.15em;text-transform:uppercase}.project-detail-art{height:min(68vw,900px);min-height:560px}.project-story{display:grid;grid-template-columns:.7fr 2fr;gap:8vw}.project-gallery{padding:0 var(--pad) 120px}.gallery-block{min-height:680px}.gallery-pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);margin-top:clamp(30px,6vw,90px)}.gallery-pair .gallery-block{min-height:780px}
@media(max-width:920px){.inner-hero,.contact-page{grid-template-columns:1fr}.inner-hero-art{min-height:70vw;height:auto}.content-split,.project-story{grid-template-columns:1fr}.values-grid{grid-template-columns:1fr 1fr}.value-card:nth-child(2){border-right:0}.value-card:nth-child(3),.value-card:nth-child(4){border-top:0}.service-row{grid-template-columns:50px 1fr}.service-row>div{grid-column:2}.gallery-pair{grid-template-columns:1fr}.gallery-pair .gallery-block{min-height:105vw}}
@media(max-width:620px){.inner-hero{padding-top:72px;min-height:auto}.compact-hero{min-height:48vh}.inner-hero-copy h1,.contact-page h1,.project-detail-title h1{font-size:58px}.inner-hero-art{min-height:95vw}.values-grid{grid-template-columns:1fr}.value-card,.value-card+.value-card{min-height:220px;padding:24px 0;border-right:0;border-top:1px solid var(--line)}.value-card h3{margin-top:48px}.service-row{grid-template-columns:28px 1fr;gap:14px}.service-row h2{font-size:36px}.process-detail article{grid-template-columns:28px 1fr;gap:14px}.contact-page{min-height:90svh}.project-facts{flex-direction:column;gap:8px}.project-detail-art{min-height:0;height:105vw}.gallery-block,.gallery-pair .gallery-block{min-height:110vw}.page-cta{min-height:540px}}

/* V3: REAL PROJECT CONTENT + PHOTOGRAPHY FRAMEWORK */
.project-status{position:absolute;left:22px;top:22px;z-index:5;padding:9px 12px;border:1px solid rgba(245,242,238,.55);background:rgba(45,45,45,.28);backdrop-filter:blur(6px);color:var(--ivory);font-size:8px;letter-spacing:.18em;text-transform:uppercase}.portfolio-placeholder{display:flex;align-items:flex-end;padding:36px;background:linear-gradient(145deg,#d9d2c9,#aaa094);color:var(--charcoal)}.portfolio-placeholder>div{max-width:390px}.portfolio-placeholder h3{margin:14px 0 16px;font-size:clamp(38px,4vw,60px);font-weight:300;letter-spacing:-.04em}.portfolio-placeholder p{margin:0;line-height:1.65;color:#655f58}.project-spec{background:var(--warm-white)}.spec-intro{display:grid;grid-template-columns:.65fr 2fr;gap:8vw;margin-bottom:75px}.spec-intro h2{margin:0;font-size:clamp(44px,5.4vw,84px);line-height:1;font-weight:300;letter-spacing:-.045em}.spec-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.spec-grid>div{min-height:270px;padding:30px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.spec-grid span{font-size:8px;color:var(--gold);letter-spacing:.18em}.spec-grid h3{margin:62px 0 15px;font-size:28px;font-weight:300}.spec-grid p{margin:0;color:#6b655e;font-size:14px;line-height:1.65}.photo-plan{padding:clamp(80px,9vw,140px) var(--pad);display:grid;grid-template-columns:1fr 1fr;gap:24px;background:var(--ivory)}.photo-slot{min-height:480px;padding:28px;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(145deg,#d8d1c8,#b3aa9f);border:1px solid rgba(45,45,45,.12)}.photo-slot.wide{grid-column:1/-1;min-height:620px}.photo-slot span{font-size:8px;letter-spacing:.18em;color:var(--gold)}.photo-slot p{margin:0;font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:#625d56}.project-detail-art{position:relative}
@media(max-width:920px){.spec-intro{grid-template-columns:1fr}.spec-grid{grid-template-columns:1fr 1fr}.photo-slot.wide{min-height:70vw}}
@media(max-width:620px){.spec-grid{grid-template-columns:1fr}.photo-plan{grid-template-columns:1fr}.photo-slot,.photo-slot.wide{grid-column:auto;min-height:105vw}.portfolio-placeholder{padding:24px}}


/* =========================================================
   V5 — PRODUCTION POLISH
   ========================================================= */

html {
  scroll-padding-top: 24px;
}

body {
  overflow-x: hidden;
}

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

a:focus-visible,
button:focus-visible {
  outline: 1px solid var(--gold);
  outline-offset: 5px;
}

.site-header {
  transition: background .35s var(--ease), color .35s var(--ease), transform .35s var(--ease);
}

.site-header.is-scrolled:not(.inner-header) {
  position: fixed;
  background: rgba(24,24,23,.88);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  min-height: 78px;
  padding-top: 16px;
  padding-bottom: 16px;
}

.site-header.is-scrolled .brand-mark {
  width: 68px;
  height: 80px;
}

.site-header.is-scrolled .brand-main {
  font-size: 9px;
}

.site-header.is-scrolled .brand-sub {
  font-size: 4px;
  margin-top: 5px;
}

.inner-header.is-scrolled {
  position: fixed;
  background: rgba(245,242,238,.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 1px 0 rgba(45,45,45,.08);
}

.project-image,
.inner-hero-art,
.project-detail-art,
.gallery-block,
.material-image {
  isolation: isolate;
}

.project-image::after,
.inner-hero-art::after,
.project-detail-art::after,
.gallery-block::after,
.material-image::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
}

.project-link .project-image {
  transition: transform .7s var(--ease), filter .7s var(--ease);
}

.project-link:hover .project-image {
  transform: scale(1.012);
  filter: saturate(1.03) contrast(1.01);
}

.project-link .project-meta h3 {
  transition: color .25s ease;
}

.project-link:hover .project-meta h3 {
  color: var(--gold);
}

.hero-visual,
.project-image,
.inner-hero-art,
.project-detail-art,
.gallery-block,
.material-image {
  background-color: #cfc7bc;
}

img.site-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

img.site-image.contain {
  object-fit: contain;
}

.image-slot {
  position: relative;
  overflow: hidden;
}

.image-slot::before {
  content: attr(data-image-note);
  position: absolute;
  z-index: 5;
  right: 18px;
  bottom: 16px;
  font-size: 8px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(45,45,45,.58);
}

.image-slot.dark-note::before {
  color: rgba(245,242,238,.62);
}

.page-enter {
  opacity: 0;
  transform: translateY(8px);
  animation: pageEnter .55s .05s forwards var(--ease);
}

@keyframes pageEnter {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-up {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .75s var(--ease), transform .75s var(--ease);
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

.skip-link {
  position: fixed;
  z-index: 999;
  top: 12px;
  left: 12px;
  transform: translateY(-160%);
  background: var(--ivory);
  color: var(--charcoal);
  padding: 10px 14px;
  border: 1px solid var(--gold);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.skip-link:focus {
  transform: translateY(0);
}

@media (max-width: 920px) {
  .site-header.is-scrolled .brand-mark {
    width: 58px;
    height: 68px;
  }

  .site-header.is-scrolled {
    min-height: 66px;
  }
}

@media (max-width: 620px) {
  .site-header.is-scrolled {
    padding: 12px var(--pad);
  }

  .site-header.is-scrolled .brand-mark {
    width: 52px;
    height: 62px;
  }

  .mobile-menu-inner {
    padding-top: 150px;
  }
}


/* =========================================================
   V6 — REAL IMAGERY & PORTFOLIO
   ========================================================= */
.photo-hero .hero-photo { object-position: center 54%; }

.v6-feature {
  display: grid;
  grid-template-columns: 1.35fr .65fr;
  min-height: 760px;
  background: var(--warm-white);
}
.v6-feature-image { min-height: 760px; overflow: hidden; }
.v6-feature-image img { transition: transform 1s var(--ease); }
.v6-feature:hover .v6-feature-image img { transform: scale(1.015); }
.v6-feature-copy {
  padding: clamp(60px,8vw,120px) var(--pad);
  display:flex; flex-direction:column; justify-content:center;
}
.v6-feature-copy h2 {
  margin:0;
  font-size:clamp(50px,6vw,95px);
  line-height:.96; font-weight:300; letter-spacing:-.045em;
}
.v6-feature-copy p:not(.eyebrow) {
  max-width:520px; margin:34px 0; color:#6a655e; line-height:1.7; font-size:16px;
}

.v6-editorial-grid {
  display:grid; grid-template-columns:1.25fr .75fr; gap:clamp(28px,6vw,90px);
  align-items:end;
}
.v6-card { display:block; }
.v6-card-image { overflow:hidden; height:54vw; max-height:780px; min-height:520px; background:#d5cec4; }
.v6-card-large .v6-card-image { height:64vw; max-height:920px; }
.v6-card-image img { transition:transform .7s var(--ease); }
.v6-card:hover img { transform:scale(1.018); }
.v6-card-meta { display:flex; justify-content:space-between; gap:24px; padding-top:18px; border-top:1px solid var(--line); }
.v6-card-meta span { font-size:8px; letter-spacing:.16em; text-transform:uppercase; color:#837b72; }
.v6-card-meta h3 { margin:8px 0 0; font-size:clamp(24px,2.7vw,40px); font-weight:300; letter-spacing:-.03em; }

.v6-gallery-strip {
  display:grid; grid-template-columns:1fr 1fr 1fr;
  height:46vw; max-height:720px; min-height:420px;
  background:#222;
}
.v6-gallery-strip img { width:100%; height:100%; object-fit:cover; min-width:0; }

.portfolio-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(50px,8vw,120px) clamp(28px,5vw,72px);
}
.portfolio-item { display:block; }
.portfolio-wide { grid-column:1 / -1; }
.portfolio-image {
  height:min(64vw,860px); overflow:hidden; background:#d3cbc0;
}
.portfolio-item:not(.portfolio-wide) .portfolio-image { height:min(58vw,760px); }
.portfolio-image img { width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease); }
.portfolio-item:hover .portfolio-image img { transform:scale(1.014); }
.portfolio-meta {
  display:flex; justify-content:space-between; gap:28px; align-items:end;
  padding:20px 0 0; border-top:1px solid var(--line);
}
.portfolio-meta h2 { margin:7px 0 0; font-size:clamp(28px,3vw,46px); font-weight:300; letter-spacing:-.035em; }
.portfolio-meta p { margin:0; font-size:9px; letter-spacing:.13em; text-transform:uppercase; color:#7e766e; }
.status { font-size:8px; letter-spacing:.17em; text-transform:uppercase; color:var(--gold); }
.status.complete { color:#5e725b; }

.case-hero { padding:clamp(60px,8vw,120px) var(--pad) clamp(80px,9vw,135px); }
.case-title { margin-bottom:55px; }
.case-title h1 {
  margin:0; max-width:1250px; font-size:clamp(65px,9vw,150px); line-height:.86;
  font-weight:300; letter-spacing:-.055em;
}
.case-hero-image { height:min(68vw,930px); min-height:580px; overflow:hidden; background:#ccc4b9; }
.case-hero-image img { width:100%; height:100%; object-fit:cover; }
.case-gallery {
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,5vw,72px);
  padding:0 var(--pad) clamp(90px,11vw,160px);
}
.case-image { min-height:620px; overflow:hidden; background:#d4ccc2; }
.case-image:nth-child(3n+1) { grid-column:1 / -1; min-height:760px; }
.case-image img { width:100%; height:100%; object-fit:cover; display:block; }

@media (max-width:920px) {
  .v6-feature { grid-template-columns:1fr; }
  .v6-feature-image { min-height:70vw; }
  .v6-editorial-grid { grid-template-columns:1fr; }
  .v6-card-image,.v6-card-large .v6-card-image { height:90vw; max-height:820px; }
  .v6-gallery-strip { grid-template-columns:1fr; height:auto; max-height:none; }
  .v6-gallery-strip img { height:70vw; max-height:650px; }
  .portfolio-grid { grid-template-columns:1fr; }
  .portfolio-wide { grid-column:auto; }
  .portfolio-image,.portfolio-item:not(.portfolio-wide) .portfolio-image { height:90vw; max-height:800px; }
  .case-gallery { grid-template-columns:1fr; }
  .case-image,.case-image:nth-child(3n+1) { grid-column:auto; min-height:90vw; }
}
@media (max-width:620px) {
  .photo-hero .hero-photo { object-position:center center; }
  .v6-feature-image { min-height:95vw; }
  .v6-feature-copy { padding:70px var(--pad); }
  .v6-feature-copy h2 { font-size:48px; }
  .v6-card-image,.v6-card-large .v6-card-image { min-height:0; height:112vw; }
  .portfolio-meta { align-items:flex-start; flex-direction:column; gap:10px; }
  .case-hero-image { min-height:0; height:105vw; }
  .case-title h1 { font-size:58px; }
}


/* =========================================================
   V7 — PENTHOUSE PORTFOLIO EXPANSION
   ========================================================= */

.v7-penthouse {
  background: var(--ivory);
}

.v7-penthouse-copy {
  max-width: 920px;
  margin-bottom: clamp(50px,7vw,100px);
}

.v7-penthouse-copy h2 {
  margin: 0;
  font-size: clamp(56px,7vw,110px);
  line-height: .94;
  font-weight: 300;
  letter-spacing: -.05em;
}

.v7-penthouse-copy p:not(.eyebrow) {
  max-width: 650px;
  margin: 28px 0 34px;
  font-size: 17px;
  line-height: 1.7;
  color: #6a655e;
}

.v7-penthouse-grid {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  grid-template-rows: 1fr 1fr;
  gap: clamp(18px,3vw,40px);
  min-height: 900px;
}

.v7-img {
  overflow: hidden;
  background: #d3cbc1;
}

.v7-img.tall {
  grid-row: 1 / 3;
}

.v7-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .7s var(--ease);
}

.v7-img:hover img {
  transform: scale(1.012);
}

@media (max-width: 920px) {
  .v7-penthouse-grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    min-height: 0;
  }

  .v7-img.tall {
    grid-row: auto;
  }

  .v7-img {
    height: 78vw;
    max-height: 760px;
  }
}

@media (max-width: 620px) {
  .v7-penthouse-copy h2 {
    font-size: 50px;
  }

  .v7-img {
    height: 105vw;
  }
}