:root {
  --ivory: #f4f0e8;
  --ink: #171419;
  --aubergine: #32172f;
  --stone: #b8aea5;
  --plum: #68415f;
  --champagne: #c6ac7c;
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: "Manrope", Helvetica, Arial, sans-serif;
  --pad: clamp(1.25rem, 4vw, 5rem);
  --line: rgba(244, 240, 232, .2);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ivory); color: var(--ink); font-family: var(--sans); font-weight: 400; }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; }
button, input { font: inherit; }
h1, h2, h3, p, blockquote, figure { margin-top: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.site-header {
  position: fixed; z-index: 50; inset: 0 0 auto 0;
  display: flex; align-items: center; justify-content: space-between;
  min-height: 96px; padding: .72rem var(--pad);
  color: var(--ivory);
  background: linear-gradient(to bottom, rgba(23,20,25,.92), rgba(23,20,25,.18), transparent);
  transition: background .3s ease, backdrop-filter .3s ease, min-height .3s ease;
}
.site-header.scrolled { min-height: 82px; background: rgba(23,20,25,.94); backdrop-filter: blur(14px); border-bottom: 1px solid rgba(244,240,232,.09); }
.brand { display: block; flex: 0 0 auto; }
.brand img { width: clamp(195px, 18vw, 285px); height: auto; }
.site-nav { display: flex; gap: clamp(1rem, 2vw, 2rem); align-items: center; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; }
.site-nav a { opacity: .78; transition: opacity .2s ease; }
.site-nav a:hover { opacity: 1; }
.nav-cta { border: 1px solid rgba(244,240,232,.42); padding: .8rem 1rem; opacity: 1 !important; }
.menu-button { display: none; background: none; color: var(--ivory); border: 1px solid rgba(244,240,232,.35); padding: .7rem .9rem; text-transform: uppercase; letter-spacing: .1em; font-size: .68rem; }

.eyebrow, .section-label { font-size: .65rem; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; }
.eyebrow { color: var(--champagne); }
.section-label { color: var(--plum); margin-bottom: 2.4rem; }
.section-label.light { color: var(--champagne); }
.section-pad { padding: clamp(5.5rem, 10vw, 9.5rem) var(--pad); }

h1, h2, h3 { font-family: var(--serif); font-weight: 500; letter-spacing: -.035em; }
h1, h2 { line-height: .89; }
h1 { font-size: clamp(4.3rem, 10.2vw, 10.6rem); margin: 1.25rem 0 2rem; }
h2 { font-size: clamp(3.5rem, 6.8vw, 7.2rem); }
h1 em, h2 em { font-weight: 400; color: var(--stone); }

.hero {
  min-height: 100svh; position: relative; overflow: hidden;
  display: grid; grid-template-columns: minmax(0, 1.03fr) minmax(390px, .97fr);
  gap: clamp(1rem, 2vw, 2.5rem); align-items: center;
  padding: 9rem var(--pad) 5rem; background: var(--ink); color: var(--ivory);
}
.hero::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 75% 22%, rgba(104,65,95,.2), transparent 34%), linear-gradient(120deg, transparent 55%, rgba(50,23,47,.4)); pointer-events: none; }
.hero-copy, .hero-portrait, .scroll-cue { position: relative; z-index: 2; }
.hero-intro { max-width: 620px; font-size: clamp(1rem, 1.4vw, 1.22rem); line-height: 1.72; color: rgba(244,240,232,.78); }
.hero-actions { margin-top: 2.2rem; display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; }
.button { display: inline-flex; align-items: center; justify-content: center; padding: 1rem 1.35rem; text-transform: uppercase; letter-spacing: .12em; font-size: .69rem; font-weight: 600; }
.button-ivory { background: var(--ivory); color: var(--ink); }
.button-dark { background: var(--ink); color: var(--ivory); border: 1px solid var(--ink); }
.text-link { font-size: .7rem; letter-spacing: .09em; text-transform: uppercase; border-bottom: 1px solid rgba(244,240,232,.35); padding-bottom: .35rem; }
.hero-portrait { justify-self: start; width: min(100%, 560px); height: min(74svh, 760px); overflow: hidden; border: 1px solid rgba(244,240,232,.18); background: var(--aubergine); transform: rotate(.8deg); }
.hero-portrait img { height: 100%; object-fit: cover; object-position: center 35%; filter: contrast(1.02); }
.scroll-cue { position: absolute; bottom: 2rem; left: var(--pad); writing-mode: vertical-rl; font-size: .54rem; letter-spacing: .2em; opacity: .44; }
.hero-orbit { position: absolute; border: 1px solid rgba(198,172,124,.14); border-radius: 50%; z-index: 1; }
.hero-orbit-one { width: 44vw; height: 44vw; right: -15vw; top: -18vw; }
.hero-orbit-two { width: 23vw; height: 23vw; right: 11vw; bottom: -12vw; }

.editorial { background: var(--ivory); }
.editorial-heading { display: flex; justify-content: space-between; gap: 2rem; align-items: flex-end; margin-bottom: 2.8rem; border-bottom: 1px solid rgba(23,20,25,.18); padding-bottom: 1.2rem; }
.editorial-heading .section-label { margin: 0; }
.editorial-heading p { margin: 0; max-width: 560px; font-family: var(--serif); font-size: clamp(1.9rem, 3.2vw, 3.35rem); line-height: 1.02; color: var(--aubergine); text-align: right; }
.editorial-grid { display: grid; grid-template-columns: 1.12fr .88fr .72fr; grid-template-rows: minmax(300px, 48vw) minmax(220px, 27vw); gap: clamp(.75rem, 1.5vw, 1.4rem); }
.editorial-grid figure { margin: 0; position: relative; overflow: hidden; background: var(--ink); }
.editorial-grid img { height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.2,.6,.2,1); }
.editorial-grid figure:hover img { transform: scale(1.02); }
.editorial-main { grid-row: 1 / 3; }
.editorial-main img { object-position: center 43%; }
.editorial-architecture { grid-column: 2 / 4; }
.editorial-architecture img { object-position: center 48%; }
.editorial-detail { grid-column: 2; }
.editorial-detail img { object-position: center 58%; }
.editorial-quote { grid-column: 3; background: var(--aubergine); color: var(--ivory); border: 1px solid rgba(244,240,232,.16); padding: clamp(1.4rem, 2.5vw, 2.35rem); display: flex; flex-direction: column; justify-content: space-between; }
.editorial-quote span { color: var(--champagne); font-size: .58rem; letter-spacing: .16em; }
.editorial-quote blockquote { margin: 2rem 0 0; font-family: var(--serif); font-size: clamp(2rem, 3.5vw, 4rem); line-height: .98; }

.manifesto { background: var(--ivory); }
.manifesto-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 7vw; align-items: start; }
.manifesto-copy { max-width: 590px; font-size: clamp(1rem, 1.35vw, 1.16rem); line-height: 1.82; }
.manifesto-copy p + p { margin-top: 1.45rem; }
.statement { margin: 7rem 0 0; max-width: 1120px; font-family: var(--serif); font-style: italic; font-size: clamp(2.7rem, 5.3vw, 5.8rem); line-height: 1.02; color: var(--aubergine); }

.capital { background: var(--aubergine); color: var(--ivory); }
.capital h2 em { color: var(--champagne); }
.capital-list { margin-top: 5.5rem; border-top: 1px solid var(--line); }
.capital-item { display: grid; grid-template-columns: 72px minmax(210px, .65fr) 1fr; gap: 2rem; align-items: center; padding: 1.85rem 0; border-bottom: 1px solid var(--line); }
.capital-item span { color: var(--champagne); font-size: .67rem; letter-spacing: .12em; }
.capital-item h3 { font-size: clamp(2rem, 3.1vw, 3.5rem); margin: 0; }
.capital-item p { max-width: 620px; margin: 0; color: rgba(244,240,232,.72); line-height: 1.65; }

.founder { display: grid; grid-template-columns: .88fr 1.12fr; gap: 7vw; align-items: center; background: var(--stone); }
.founder-visual { margin: 0; aspect-ratio: 4 / 5; overflow: hidden; background: var(--ink); }
.founder-photo img { height: 100%; object-fit: cover; object-position: 58% center; filter: contrast(1.02); }
.founder-copy { max-width: 860px; }
.founder-copy p { max-width: 710px; font-size: 1.03rem; line-height: 1.78; }
.founder-signoff { margin-top: 2.4rem; letter-spacing: .18em; font-size: .64rem !important; font-weight: 700; }

.house { background: var(--aubergine); color: var(--ivory); }
.house-intro { display: grid; grid-template-columns: 1.05fr .95fr; gap: 7vw; align-items: start; margin-bottom: 4.5rem; }
.house h2 em { color: var(--champagne); }
.house-copy { max-width: 620px; color: rgba(244,240,232,.78); line-height: 1.78; }
.house-copy p:first-child { color: var(--ivory); font-family: var(--serif); font-size: clamp(1.8rem, 2.6vw, 2.9rem); line-height: 1.08; }
.house-copy p + p { margin-top: 1.15rem; }
.house-actions { display: flex; gap: 1.35rem; align-items: center; flex-wrap: wrap; }
.house-link { display: inline-block; margin-top: 1.45rem; color: var(--ivory); text-transform: uppercase; letter-spacing: .12em; font-size: .66rem; border-bottom: 1px solid rgba(244,240,232,.35); padding-bottom: .35rem; }
.house-link.muted { color: rgba(244,240,232,.58); }
.house-gallery { display: grid; grid-template-columns: 1.03fr .76fr .76fr; grid-template-rows: minmax(300px, 36vw) minmax(280px, 31vw); gap: clamp(.8rem,1.5vw,1.45rem); }
.house-image { margin: 0; position: relative; overflow: hidden; background: var(--ink); }
.house-image-tall { grid-row: 1 / 3; }
.house-image img { height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.2,.6,.2,1); }
.house-image:hover img { transform: scale(1.02); }
.house-image-tall img { object-position: center 48%; }
.house-gallery .house-image:nth-child(2) img { object-position: center 35%; }
.house-gallery .house-image:nth-child(3) img { object-position: center 40%; }
.house-note { background: var(--ink); padding: clamp(1.5rem,2.5vw,2.45rem); display: flex; flex-direction: column; justify-content: space-between; border: 1px solid rgba(244,240,232,.14); }
.house-note > span { color: var(--champagne); font-size: .58rem; letter-spacing: .16em; }
.house-note blockquote { margin: auto 0 1.6rem; font-family: var(--serif); font-size: clamp(2rem,3.4vw,4rem); line-height: .98; }
.house-note p { margin-bottom: 0; color: rgba(244,240,232,.62); line-height: 1.65; font-size: .82rem; }

.building { background: var(--ink); color: var(--ivory); }
.building h2 em { color: var(--plum); }
.building-grid { margin-top: 4.8rem; display: grid; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.building-grid-four { grid-template-columns: repeat(4, minmax(0,1fr)); }
.building-card { min-height: 330px; padding: 2rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; flex-direction: column; transition: background .25s ease; }
a.building-card:hover { background: rgba(244,240,232,.05); }
.building-card > span { color: var(--champagne); font-size: .61rem; letter-spacing: .2em; }
.building-card h3 { font-size: clamp(1.9rem, 2.7vw, 3rem); margin-top: auto; margin-bottom: 1.2rem; }
.building-card p { margin-bottom: 0; color: rgba(244,240,232,.65); line-height: 1.65; }

.join { background: var(--ivory); }
.join-inner { max-width: 1040px; margin: 0 auto; text-align: center; }
.join h2 em { color: var(--plum); }
.join-inner > p:not(.eyebrow):not(.form-note) { max-width: 650px; margin: 0 auto 2.5rem; line-height: 1.72; }
.join-form { display: grid; grid-template-columns: 1fr auto; max-width: 720px; margin: 2rem auto 1rem; border-bottom: 1px solid var(--ink); }
.join-form input { border: 0; background: transparent; padding: 1.1rem .2rem; outline: none; font-size: 1rem; }
.join-form button { border: 0; background: var(--aubergine); color: var(--ivory); padding: 1rem 1.4rem; text-transform: uppercase; letter-spacing: .1em; font-size: .68rem; cursor: pointer; }
.form-note { font-size: .66rem; color: var(--plum); }

.site-footer { background: var(--aubergine); color: var(--ivory); padding: 3rem var(--pad); display: grid; grid-template-columns: 210px 1fr auto; gap: 3rem; align-items: end; }
.site-footer img { width: 190px; }
.site-footer p { margin-bottom: 0; font-size: .64rem; letter-spacing: .14em; text-transform: uppercase; }
.site-footer a { color: rgba(244,240,232,.8); }
.footer-meta { display: flex; gap: 1.4rem; font-size: .63rem; letter-spacing: .08em; text-transform: uppercase; }

/* AKIRE House */
.house-page { background: var(--ivory); }
.house-portfolio-hero { min-height: 100svh; padding: 9rem var(--pad) 4rem; display: grid; grid-template-columns: 1.05fr .95fr; gap: 5vw; align-items: center; background: var(--ink); color: var(--ivory); overflow: hidden; }
.house-portfolio-copy { max-width: 780px; }
.house-portfolio-copy h1 { font-size: clamp(4.5rem, 8.7vw, 9.8rem); line-height: .84; }
.house-portfolio-copy h1 em { color: var(--champagne); }
.house-portfolio-copy > p:not(.eyebrow) { max-width: 650px; color: rgba(244,240,232,.72); line-height: 1.76; }
.house-portfolio-hero-image { margin: 0; height: min(78svh, 800px); overflow: hidden; border: 1px solid rgba(244,240,232,.16); transform: rotate(.6deg); }
.house-portfolio-hero-image img { height: 100%; object-fit: cover; object-position: center 48%; }
.portfolio-intro { background: var(--ivory); }
.portfolio-intro-grid { display: grid; grid-template-columns: 1.06fr .94fr; gap: 7vw; align-items: start; }
.portfolio-intro h2 { font-size: clamp(3.8rem, 7vw, 7.5rem); }
.portfolio-prose { max-width: 660px; }
.portfolio-prose p { line-height: 1.76; color: rgba(23,20,25,.76); }
.portfolio-prose p:first-child { font-family: var(--serif); font-size: clamp(1.7rem, 2.5vw, 2.7rem); line-height: 1.08; color: var(--aubergine); }
.portfolio-prose p + p { margin-top: 1.15rem; }
.no-top-pad { padding-top: 0; }
.portfolio-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(2rem,4vw,5rem) clamp(1rem,2vw,2rem); background: var(--ivory); }
.portfolio-card { border-top: 1px solid rgba(23,20,25,.18); padding-top: 1rem; }
.portfolio-card figure { margin: 0; height: clamp(380px, 48vw, 720px); overflow: hidden; background: var(--stone); }
.portfolio-card-wide { grid-column: 1 / 3; display: grid; grid-template-columns: 1.35fr .65fr; gap: clamp(1.5rem,4vw,4rem); align-items: end; }
.portfolio-card-wide figure { height: min(76svh, 820px); }
.portfolio-card-tall figure { height: min(82svh, 880px); }
.portfolio-card img { height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.2,.6,.2,1); }
.portfolio-card:hover img { transform: scale(1.02); }
.portfolio-card-wide img { object-position: center 27%; }
.portfolio-card:nth-of-type(2) img { object-position: center 48%; }
.portfolio-card:nth-of-type(3) img { object-position: center 58%; }
.portfolio-card:nth-of-type(4) img { object-position: center 32%; }
.portfolio-card:nth-of-type(5) img { object-position: center 42%; }
.portfolio-card:nth-of-type(6) img { object-position: center 40%; }
.portfolio-meta { padding: 1.15rem 0 0; }
.portfolio-meta > span { font-size: .6rem; letter-spacing: .16em; color: var(--plum); }
.portfolio-meta h3 { font-size: clamp(2.2rem, 3.8vw, 4.7rem); line-height: .96; margin: .55rem 0 .8rem; color: var(--aubergine); }
.portfolio-meta p { max-width: 500px; line-height: 1.66; color: rgba(23,20,25,.66); }
.portfolio-statement { background: var(--aubergine); color: var(--ivory); text-align: center; }
.portfolio-statement blockquote { max-width: 1120px; margin: 2rem auto 0; font-family: var(--serif); font-size: clamp(3.4rem, 6.8vw, 7.5rem); line-height: .94; }
.collaborate { display: grid; grid-template-columns: 1.05fr .95fr; gap: 8vw; align-items: start; background: var(--ivory); }
.collaborate h2 { font-size: clamp(3.5rem, 6.4vw, 6.8rem); }
.collaborate-details { max-width: 660px; }
.collaborate-details > p { line-height: 1.78; color: rgba(23,20,25,.74); }
.collaborate-details ul { list-style: none; padding: 0; margin: 2rem 0 2.5rem; border-top: 1px solid rgba(23,20,25,.16); }
.collaborate-details li { padding: .9rem 0; border-bottom: 1px solid rgba(23,20,25,.16); text-transform: uppercase; letter-spacing: .1em; font-size: .68rem; }
.house-return { background: var(--ink); color: var(--ivory); text-align: center; }
.house-return h2 { margin: 1rem 0 2.4rem; }
.house-return h2 em { color: var(--champagne); }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }
.delay-one { transition-delay: .12s; }

@media (max-width: 1050px) {
  .building-grid-four { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 900px) {
  .menu-button { display: block; }
  .site-nav { position: fixed; inset: 0 0 auto auto; width: min(84vw, 390px); min-height: 100svh; padding: 7rem 2rem 3rem; flex-direction: column; align-items: flex-start; background: var(--ink); transform: translateX(100%); transition: transform .3s ease; }
  .site-nav.open { transform: translateX(0); }
  .site-nav a { font-size: .88rem; }
  .hero { grid-template-columns: 1fr; padding-top: 8.5rem; }
  .hero-portrait { justify-self: stretch; width: 100%; height: 72svh; transform: none; }
  .scroll-cue { display: none; }
  .editorial-heading { align-items: flex-start; flex-direction: column; }
  .editorial-heading p { text-align: left; }
  .editorial-grid { grid-template-columns: 1fr 1fr; grid-template-rows: 88svh 54svh 42svh; }
  .editorial-main { grid-column: 1 / 3; grid-row: 1; }
  .editorial-architecture { grid-column: 1 / 3; grid-row: 2; }
  .editorial-detail { grid-column: 1; grid-row: 3; }
  .editorial-quote { grid-column: 2; grid-row: 3; }
  .manifesto-grid, .founder, .house-intro { grid-template-columns: 1fr; }
  .founder-visual { max-width: 680px; }
  .capital-item { grid-template-columns: 48px 1fr; }
  .capital-item p { grid-column: 2; }
  .house-gallery { grid-template-columns: 1fr 1fr; grid-template-rows: 78svh 54svh 50svh; }
  .house-image-tall { grid-column: 1 / 3; grid-row: 1; }
  .house-gallery .house-image:nth-child(2) { grid-column: 1; grid-row: 2; }
  .house-gallery .house-image:nth-child(3) { grid-column: 2; grid-row: 2; }
  .house-note { grid-column: 1 / 3; grid-row: 3; }
  .site-footer { grid-template-columns: 1fr; align-items: start; }
  .footer-meta { flex-wrap: wrap; }
  .house-portfolio-hero { grid-template-columns: 1fr; padding-top: 8.5rem; }
  .house-portfolio-hero-image { height: 72svh; transform: none; }
  .portfolio-intro-grid, .collaborate { grid-template-columns: 1fr; }
  .portfolio-card-wide { display: block; grid-column: 1 / 3; }
  .portfolio-card-wide .portfolio-meta { max-width: 680px; }
}

@media (max-width: 620px) {
  .site-header { min-height: 78px; }
  .brand img { width: 165px; }
  h1 { font-size: clamp(4rem, 19vw, 6rem); }
  h2 { font-size: clamp(3.15rem, 14vw, 5rem); }
  .hero { gap: 2.5rem; padding-inline: 1.1rem; }
  .hero-portrait { height: 65svh; }
  .statement { margin-top: 5rem; }
  .editorial-grid { display: block; }
  .editorial-grid figure, .editorial-quote { min-height: 62svh; margin-bottom: .8rem; }
  .editorial-detail { min-height: 54svh !important; }
  .editorial-quote { min-height: 48svh; }
  .capital-item { gap: 1rem; }
  .capital-item h3 { font-size: 2.2rem; }
  .house-gallery { display: block; }
  .house-image, .house-note { min-height: 62svh; margin-bottom: .8rem; }
  .house-note { min-height: 50svh; }
  .building-grid-four { grid-template-columns: 1fr; }
  .building-card { min-height: 280px; }
  .join-form { grid-template-columns: 1fr; border: 0; gap: .8rem; }
  .join-form input { border-bottom: 1px solid var(--ink); }
  .house-portfolio-hero { padding-inline: 1.1rem; }
  .house-portfolio-copy h1 { font-size: clamp(4rem, 18vw, 6rem); }
  .portfolio-grid { display: block; }
  .portfolio-card { margin-bottom: 3.5rem; }
  .portfolio-card figure, .portfolio-card-wide figure, .portfolio-card-tall figure { height: 66svh; }
  .portfolio-statement blockquote { font-size: clamp(3rem, 13vw, 5rem); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  .site-nav { transition: none; }
}
