:root {

  --black: #111111;

  --white: #F5F2ED;

  --gold: #B08D57;

  --gray: #A9A39A;

  --line: rgba(245, 242, 237, 0.16);

  --panel: #171717;

  --panel-2: #1d1b18;

  --heading: 'Cormorant Garamond', serif;

  --body: 'Inter', sans-serif;

}

/* =========================

   Base Styles

========================= */

* {

  box-sizing: border-box;

}

html {

  scroll-behavior: smooth;

}

body {

  margin: 0;

  background: var(--black);

  color: var(--white);

  font-family: var(--body);

  font-size: 16px;

  line-height: 1.7;

}

body::before {

  content: "";

  position: fixed;

  inset: 0;

  z-index: 9999;

  pointer-events: none;

  opacity: 0.035;

  background-image: radial-gradient(rgba(245, 242, 237, 0.45) 0.5px, transparent 0.5px);

  background-size: 4px 4px;

}

img {

  max-width: 100%;

  display: block;

}

a {

  color: inherit;

  text-decoration: none;

}

h1,

h2,

h3 {

  margin: 0;

  color: var(--white);

  font-family: var(--heading);

  font-weight: 600;

  line-height: 0.98;

}

h2 {

  font-size: clamp(3rem, 5vw, 4.4rem);

}

h3 {

  font-size: 34px;

}

/* =========================

   Layout

========================= */

.container {

  width: min(1180px, calc(100% - 40px));

  margin: 0 auto;

}

.narrow {

  width: min(860px, calc(100% - 40px));

  margin: 0 auto;

  text-align: center;

}

.section {

  padding: 130px 0;

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

}

section[id] {

  scroll-margin-top: 100px;

}

.section-heading {

  max-width: 760px;

  margin-bottom: 52px;

}

.eyebrow {

  margin: 0 0 18px;

  color: var(--gold);

  font-size: 12px;

  font-weight: 700;

  letter-spacing: 0.22em;

  text-transform: uppercase;

}

/* =========================

   Header / Navigation

========================= */

.site-header {

  position: fixed;

  z-index: 100;

  top: 0;

  left: 0;

  right: 0;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 30px;

  padding: 0px 40px;

  background: rgba(8, 8, 8, 0.72);

  border-bottom: 1px solid rgba(176, 141, 87, 0.25);

  transition: 0.3s ease;

}

.site-header.scrolled {

  padding: 12px 40px;

  background: rgba(8, 8, 8, 0.94);

  backdrop-filter: blur(16px);

}

.brand,

.logo {

  display: flex;

  align-items: center;

  gap: 16px;

}

.logo img {

  width: 145px;

  height: 145px;

  flex: 0 0 145px;

  object-fit: contain;

}

.brand-text {

  font-family: var(--heading);

  font-size: 27px;

  line-height: 0.95;

  letter-spacing: 0.03em;

  color: var(--white);

  white-space: nowrap;

}

.brand-text em {

  color: var(--gold);

  font-style: normal;

}

.main-nav {

  display: flex;

  align-items: center;

  gap: 0;

  margin-left: auto;

  font-size: 11px;

  font-weight: 700;

  letter-spacing: 0.14em;

  text-transform: uppercase;

}

.main-nav a {

  position: relative;

  padding: 0 34px;

  color: rgba(245, 242, 237, 0.86);

  transition: 0.2s ease;

}

.main-nav a:not(:nth-last-child(-n+2))::after {

  content: "";

  position: absolute;

  right: 0;

  top: 50%;

  width: 1.5px;

  height: 26px;

  background: var(--gold);

  opacity: 0.55;

  transform: translateY(-50%);

}

.main-nav a:hover {

  color: var(--gold);

}

.nav-cta {

  margin-left: 34px;

  padding: 12px 20px !important;

  border: 1px solid var(--gold);

  color: var(--white) !important;

}

.nav-cta::after {

  display: none;

}

.nav-cta:hover {

  background: var(--gold);

  color: var(--black) !important;

}

.nav-toggle {

  display: none;

  width: 42px;

  height: 42px;

  background: none;

  border: 0;

}

.nav-toggle span {

  display: block;

  height: 1px;

  margin: 9px 0;

  background: var(--white);

}

/* =========================

   Hero

========================= */

.hero {

  position: relative;

  min-height: 100vh;

  display: flex;

  align-items: center;

  overflow: hidden;

  padding-bottom: 145px;

}

.hero-bg {

  position: absolute;

  inset: 0;

  background-image: url("assets/images/hero-luxury-home.jpeg");

  background-position: 72% center;

  background-size: cover;

  background-repeat: no-repeat;
  
  filter:

    brightness(1.20)

    contrast(1.10)

    saturate(1.05);

}

.hero-overlay {

  position: absolute;

  inset: 0;

  background:

    linear-gradient(

      90deg,

      rgba(0,0,0,.92) 0%,

      rgba(0,0,0,.68) 24%,

      rgba(0,0,0,.22) 52%,

      rgba(0,0,0,.02) 100%

    );

}

.hero-content {

  position: relative;

  z-index: 2;

  width: min(1180px, calc(100% - 40px));

  max-width: none;

  margin-left: 42px;

  margin-right: auto;

  padding-top: 175px;

}

.hero-content > * {

  max-width: 500px;

}

.hero h1 {

  max-width: 470px;

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

  line-height: 1.02;

  letter-spacing: -0.035em;

  position: relative;

  padding-bottom: 26px;

}

.hero h1::after {

  content: "";

  position: absolute;

  left: 0;

  bottom: 0;

  width: 165px;

  height: 2px;

  background: var(--gold);

}

.hero-copy {

  max-width: 410px;

  margin: 22px 0 32px;

  color: rgba(245, 242, 237, 0.88);

  font-size: 15.5px;

  line-height: 1.75;

}

.hero .eyebrow::after {

  display: none;

}

/* =========================

   Hero Feature Strip

========================= */

.hero-feature-strip {

  position: absolute;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 3;

  display: grid;

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

  padding: 24px 52px;

  background: rgba(8, 8, 8, 0.92);

  border-top: 1px solid rgba(176, 141, 87, 0.45);

  border-bottom: 1px solid rgba(176, 141, 87, 0.22);

  backdrop-filter: blur(12px);

}

.hero-feature-strip div {

  padding: 0 28px;

  border-right: 1px solid rgba(176, 141, 87, 0.45);

}

.hero-feature-strip div:last-child {

  border-right: 0;

}

.hero-feature-strip span {

  display: block;

  color: var(--white);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: 0.15em;

  text-transform: uppercase;

}

.hero-feature-strip p {

  max-width: 210px;

  margin: 7px 0 0;

  color: rgba(245, 242, 237, 0.68);

  font-size: 12px;

  line-height: 1.45;

}

/* =========================

   Buttons

========================= */

.button-row {

  display: flex;

  flex-wrap: wrap;

  gap: 14px;

}

.btn {

  min-height: 50px;

  padding: 14px 24px;

  border: 1px solid var(--gold);

  display: inline-flex;

  align-items: center;

  justify-content: center;

  font-size: 12px;

  font-weight: 700;

  letter-spacing: 0.12em;

  text-transform: uppercase;

  cursor: pointer;

  transition: 0.25s ease;

}

.btn-primary {

  background: var(--gold);

  color: var(--black);

}

.btn-primary:hover {

  background: transparent;

  color: var(--gold);

}

.btn-secondary {

  background: rgba(17, 17, 17, 0.18);

  color: var(--white);

}

.btn-secondary:hover {

  background: var(--white);

  border-color: var(--white);

  color: var(--black);

}

/* =========================

   Intro

========================= */

.intro {

  padding: 160px 0;

}

.intro .narrow {

  width: min(1100px, calc(100% - 40px));

}

.intro p:not(.eyebrow),

.final-cta p {

  color: rgba(245, 242, 237, 0.82);

  font-size: 21px;

  line-height: 1.9;

  max-width: 760px;

  margin: 28px auto 0;

}

.intro h2 {

  max-width: 1100px;

  margin: 0 auto;

}

.intro .eyebrow-centered {

  justify-content: center;

}

.intro .heading-ornament {

  width: 380px;

  height: 1px;

  margin: 28px auto;

  background: rgba(176,141,87,.70);

}

.intro .heading-ornament::after {

  content: "";

  position: absolute;

  left: 50%;

  top: 50%;

  width: 10px;

  height: 10px;

  background: var(--gold);

  transform: translate(-50%, -50%) rotate(45deg);

}

.intro-values {

  margin-top: 42px;

  display: flex;

  justify-content: center;

  align-items: center;

  gap: 22px;

  flex-wrap: wrap;

}

.intro-values span {

  color: var(--gold);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: 0.18em;

  text-transform: uppercase;

  white-space: nowrap;

}

.intro-values span:not(:last-child)::after {

  content: "•";

  margin-left: 22px;

  color: rgba(176, 141, 87, 0.65);

}

/* =========================

   What We Build / Services

========================= */

.what-we-build {

  position: relative;

  overflow: hidden;

  background:

    radial-gradient(circle at top center,

    rgba(176,141,87,.08),

    transparent 34%),

    linear-gradient(

      180deg,

      #0b0b0b 0%,

      #111111 100%

    );

}

.services-heading {

  max-width: 900px;

  margin: 0 auto 46px;

  text-align: center;

}

.eyebrow-centered {

  display: inline-flex;

  align-items: center;

  gap: 22px;

}

.eyebrow-centered::before,

.eyebrow-centered::after {

  content: "";

  width: 42px;

  height: 1px;

  background: var(--gold);

}

.services-heading h2 {

  font-size: clamp(3.8rem, 5vw, 5.2rem);

  letter-spacing: -0.035em;

}

.heading-ornament {

  position: relative;

  width: 350px;

  height: 2px;

  margin: 32px auto 32px;

  background: rgba(176,141,87,.7);

}

.heading-ornament::after {

  content: "";

  position: absolute;

  left: 50%;

  top: 50%;

  width: 10px;

  height: 10px;

  background: var(--gold);

  transform:

    translate(-50%, -50%)

    rotate(45deg);

}

.section-intro {

  max-width: 720px;

  margin: 0 auto;

  color: rgba(245,242,237,.78);

  font-size: 17px;

  line-height: 1.9;

}

/* Card Grid */

.services-luxury-grid {

  display: grid;

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

  gap: 18px;

  align-items: stretch;

}

.luxury-service-card {

  position: relative;

  overflow: hidden;

  background:

    linear-gradient(

      180deg,

      #161616 0%,

      #101010 100%

    );

  border: 1px solid rgba(176,141,87,.65);

  transition:

    transform .35s ease,

    box-shadow .35s ease,

    border-color .35s ease;

}

.luxury-service-card:hover {

  transform: translateY(-5px);

  border-color: var(--gold);

  box-shadow:

    0 0 34px rgba(176,141,87,.22);

}

.luxury-service-card img {

  width: 100%;

  height: 255px;

  object-fit: cover;

  filter:

    brightness(.88)

    saturate(.92)

    contrast(1.04);

  transition: .45s ease;

}

.luxury-service-card:hover img {

  filter:

    brightness(1)

    saturate(1)

    contrast(1.04);

}

.service-content {

  position: relative;

  text-align: center;

  min-height: 220px;

  padding: 38px 26px 30px;

  border-top: 1px solid rgba(176,141,87,.65);

}

/* Diamond Badge */

.service-number {

  position: absolute;

  left: 50%;

  top: -24px;

  width: 48px;

  height: 48px;

  transform:

    translateX(-50%)

    rotate(45deg);

  display: flex;

  align-items: center;

  justify-content: center;

  background: #111111;

  border: 1px solid var(--gold);

  color: transparent;

}

.service-number::after {

  content: attr(data-number);

  color: var(--gold);

  font-family: var(--heading);

  font-size: 22px;

  transform: rotate(-45deg);

}

.service-content h3 {

  margin-bottom: 12px;

  font-size: 30px;

  line-height: 1.05;

}

.mini-line {

  width: 40px;

  height: 1px;

  margin: 0 auto 18px;

  background: var(--gold);

}

.service-content p {

  max-width: 290px;

  margin: 0 auto 22px;

  color: rgba(245,242,237,.72);

  font-size: 13px;

  line-height: 1.65;

}

.service-link {

  color: var(--gold);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: .18em;

  text-transform: uppercase;

}

.service-link::after {

  content: " →";

  margin-left: 8px;

}

/* Credibility Statement */

.what-we-build-note {

  max-width: 770px;

  margin: 55px auto 0;

  padding-top: 26px;

  border-top: 1px solid rgba(176,141,87,.45);

  text-align: center;

  color: rgba(245,242,237,.78);

  font-size: 15px;

  line-height: 1.8;

}

/* Shared paragraph color */

.timeline-item p,

.investment-card p,

.about-copy p,

.split-heading p,

.site-footer p {

  color: rgba(245,242,237,.72);

}

@media (max-width: 980px) {

  .services-luxury-grid {

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

    gap: 14px;

  }

  .luxury-service-card img {

    height: 210px;

  }

  .service-content {

    min-height: 230px;

    padding: 38px 18px 26px;

  }

  .service-content h3 {

    font-size: 25px;

  }

  .service-content p {

    font-size: 12px;

  }

}

@media (max-width: 640px) {

  .services-heading h2 {

    font-size: clamp(3rem, 13vw, 4.2rem);

  }

  .eyebrow-centered::before,

  .eyebrow-centered::after {

    width: 28px;

  }

  .heading-ornament {

    width: 190px;

  }

  .services-luxury-grid {

    grid-template-columns: 1fr;

  }

  .luxury-service-card img {

    height: 260px;

  }

  .service-content {

    padding: 42px 24px 32px;

  }

}

/* =========================

   Featured Work

========================= */

.featured {

  background:

    radial-gradient(circle at top center, rgba(176,141,87,.055), transparent 34%),

    linear-gradient(180deg, #111111 0%, #0b0b0b 100%);

}

.featured-heading {

  display: grid;

  grid-template-columns: 1.15fr 0.85fr;

  align-items: center;

  gap: 72px;

  max-width: 1120px;

  margin: 0 auto 66px;

}

.featured-heading > div {

  text-align: center;

}

.featured-heading .eyebrow-centered {

  justify-content: center;

}

.featured-heading h2 {

  max-width: 760px;

  margin: 0 auto;

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

  line-height: 1.08;

  letter-spacing: -0.035em;

}

.featured-heading .heading-ornament {

  width: 435px;

  height: 1px;

  margin: 32px auto 0;

  background: rgba(176,141,87,.70);

}

.featured-heading p:not(.eyebrow) {

  max-width: 500px;

  margin: 0;

  padding-left: 26px;

  border-left: 1px solid rgba(176,141,87,.55);

  color: rgba(245,242,237,.78);

  font-size: 17px;

  line-height: 1.9;

  transform: translateY(22px);

}

.featured-work-grid {

  display: grid;

  grid-template-columns: 1.25fr 0.95fr 0.95fr;

  grid-auto-rows: 285px;

  gap: 18px;

}

.featured-card {

  position: relative;

  overflow: hidden;

  min-height: 285px;

  background: #151515;

  border: 1px solid rgba(176,141,87,.34);

  transition: transform .4s ease, border-color .4s ease, box-shadow .4s ease;

}

.featured-card-large {

  grid-row: span 2;

}

.featured-card img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  filter: brightness(.82) saturate(.92) contrast(1.04);

  transition: transform .55s ease, filter .55s ease;

}

.featured-card::after {

  content: "";

  position: absolute;

  inset: 0;

  background:

    linear-gradient(

      to top,

      rgba(0,0,0,.88) 0%,

      rgba(0,0,0,.58) 28%,

      rgba(0,0,0,.14) 62%,

      rgba(0,0,0,.02) 100%

    );

  z-index: 1;

}

.featured-card:hover {

  transform: translateY(-6px);

  border-color: var(--gold);

  box-shadow: 0 0 34px rgba(176,141,87,.22);

}

.featured-card:hover img {

  transform: scale(1.045);

  filter: brightness(.95) saturate(1) contrast(1.06);

}

.featured-card-content {

  position: absolute;

  left: 30px;

  right: 30px;

  bottom: 28px;

  z-index: 2;

}

.featured-card h3 {

  margin-top: 18px;

  font-size: 31px;

  line-height: 1.05;

}

.featured-card-large h3 {

  font-size: 36px;

}

.featured-card-content p {

  margin: 10px 0 0;

  color: var(--gold);

  font-size: 10px;

  font-weight: 700;

  letter-spacing: .22em;

  text-transform: uppercase;

}

.card-ornament {

  position: relative;

  width: 78px;

  height: 1px;

  background: rgba(176,141,87,.75);

}

.card-ornament::before {

  content: "";

  position: absolute;

  left: 0;

  top: 50%;

  width: 10px;

  height: 10px;

  background: var(--gold);

  transform: translateY(-50%) rotate(45deg);

}

.featured-note {

  max-width: 1000px;

  margin: 52px auto 0;

  text-align: center;

  color: rgba(245,242,237,.78);

  font-size: 15px;

  line-height: 1.8;

  position: relative;

}

.featured-note::before {

  content: "";

  display: block;

  width: 765px;

  height: 1px;

  margin: 0 auto 26px;

  background: rgba(176,141,87,.42);

}

@media (max-width: 980px) {

  .featured-heading {

    grid-template-columns: 1fr;

    gap: 28px;

    text-align: center;

  }

  .featured-heading p:not(.eyebrow) {

    max-width: 720px;

    margin: 0 auto;

  }

  .featured-work-grid {

    grid-template-columns: 1fr 1fr;

    grid-auto-rows: 300px;

  }

  .featured-card-large {

    grid-column: span 2;

    grid-row: span 1;

  }

}

@media (max-width: 640px) {

  .featured-heading {

    margin-bottom: 48px;

  }

  .featured-heading h2 {

    font-size: clamp(3rem, 12vw, 4.2rem);

  }

  .featured-work-grid {

    grid-template-columns: 1fr;

    grid-auto-rows: 320px;

    gap: 18px;

  }

  .featured-card-large {

    grid-column: auto;

  }

  .featured-card-content {

    left: 24px;

    right: 24px;

    bottom: 24px;

  }

  .featured-card h3,

  .featured-card-large h3 {

    font-size: 30px;

  }

}

/* =========================

      Testimonials

========================= */

.testimonials {

  position: relative;

  overflow: hidden;

  background:

    radial-gradient(circle at top center, rgba(176,141,87,.07), transparent 34%),

    linear-gradient(180deg, #0b0b0b 0%, #111111 100%);

}

.testimonials-heading {

  max-width: 980px;

  margin: 0 auto 42px;

  text-align: center;

}

.testimonials-heading .eyebrow-centered {

  justify-content: center;

}

.testimonials-heading .eyebrow-centered::before,

.testimonials-heading .eyebrow-centered::after {

  content: "";

  width: 42px;

  height: 0.5px;

  background: var(--gold);

}

.testimonials-heading h2 {

  max-width: 900px;

  margin: 0 auto;

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

  line-height: 1.06;

  letter-spacing: -0.035em;

}

.testimonials-heading .heading-ornament {

  width: 435px;

  height: 2px;

  margin: 32px auto;

  background: rgba(176,141,87,.70);

}

.testimonials-heading p:not(.eyebrow) {

  max-width: 720px;

  margin: 0 auto;

  color: rgba(245,242,237,.78);

  font-size: 17px;

  line-height: 1.9;

}

.testimonial-grid {

  display: grid;

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

  gap: 18px;

  align-items: stretch;

}

.testimonial-card {

  position: relative;

  min-height: 510px;

  padding: 44px 34px 36px;

  display: flex;

  flex-direction: column;

  background:

    linear-gradient(180deg, #171717 0%, #101010 100%);

  border: 1px solid rgba(176,141,87,.36);

  transition:

    transform .35s ease,

    border-color .35s ease,

    box-shadow .35s ease;

}

.testimonial-card:hover {

  transform: translateY(-6px);

  border-color: var(--gold);

  box-shadow: 0 0 34px rgba(176,141,87,.22);

}

.quote-mark {

  color: rgba(176,141,87,.72);

  font-family: var(--heading);

  font-size: 92px;

  line-height: .7;

  margin-bottom: 0px;

}

.testimonial-copy {

  margin: 0;

  color: rgba(245,242,237,.82);

  font-size: 16px;

  line-height: 1.9;

}

.testimonial-divider {

  width: 100%;

  height: 0.5px;

  margin: auto 0 24px;

  background: rgba(176,141,87,.75);

}

.testimonial-client {

  display: flex;

  align-items: center;

  gap: 22px;

  min-height: 88px;

}

.testimonial-client img {

  width: 88px;

  height: 88px;

  flex: 0 0 88px;

  border-radius: 50%;

  object-fit: cover;

  border: 1px solid var(--gold);

}

.testimonial-client div {

  display: flex;

  flex-direction: column;

  justify-content: center;

}

.testimonial-client h3 {

  margin: 0 0 6px;

  font-size: 29px;

  line-height: 1.05;

}

.testimonial-client span {

  display: block;

  color: var(--gold);

  font-size: 10px;

  font-weight: 700;

  letter-spacing: .22em;

  text-transform: uppercase;

}

.testimonial-note {

  max-width: 920px;

  margin: 52px auto 0;

  text-align: center;

  color: rgba(245,242,237,.78);

  font-size: 15px;

  line-height: 1.8;

}

.testimonial-note::before {

  content: "";

  display: block;

  width: 745px;

  height: 1px;

  margin: 0 auto 26px;

  background: rgba(176,141,87,.42);

}

@media (max-width: 980px) {

  .testimonial-grid {

    grid-template-columns: 1fr;

  }

  .testimonial-card {

    min-height: auto;

  }

}

@media (max-width: 640px) {

  .testimonials-heading h2 {

    font-size: clamp(3rem, 12vw, 4.2rem);

  }

  .testimonials-heading .heading-ornament,

  .testimonial-note::before {

    width: 190px;

  }

  .testimonial-card {

    padding: 38px 26px 32px;

  }

}

/* =========================

   Process

========================= */

.process {

  position: relative;

  overflow: hidden;

  background:

    radial-gradient(circle at top right, rgba(176,141,87,.075), transparent 32%),

    linear-gradient(180deg, #111111 0%, #0b0b0b 100%);

}

.process-heading {

  position: relative;

  display: block;

  max-width: 1180px;

  min-height: 360px;

  margin: 0 auto 44px;

}

.process-heading-copy {

  position: relative;

  z-index: 2;

  max-width: 680px;

  text-align: left;

}

.process-heading-copy .eyebrow-centered {

  justify-content: flex-start;

}

.process-heading-copy h2 {

  max-width: 680px;

  margin: 0;

  font-size: clamp(3.9rem, 5.4vw, 5.55rem);

  line-height: 1.02;

  letter-spacing: -0.035em;

}

.process-heading-copy .heading-ornament {

  width: 350px;

  height: 1px;

  margin: 24px 0 28px;

  background: rgba(176,141,87,.70);

}

.process-heading-copy p:not(.eyebrow) {

  max-width: 560px;

  margin: 0;

  color: rgba(245,242,237,.78);

  font-size: 17px;

  line-height: 1.85;

}

.process-watermark {

  position: absolute;

  z-index: 1;

  right: -130px;

  top: -78px;

  width: 780px;

  opacity: 0.08;

  pointer-events: none;

  user-select: none;

}

.process-watermark img {

  width: 100%;

  height: auto;

  display: block;

  object-fit: contain;

}

/* Process Chart */

.process-chart {

  width: min(1300px, calc(100vw - 52px));

  margin: 42px auto 0;

  display: grid;

  grid-template-columns: repeat(6, minmax(0, 1fr));

  gap: 0;

  position: relative;

  left: 50%;

  transform: translateX(-50%);

}

.process-chart.reveal {

  transform: translateX(-50%) translateY(22px);

}

.process-chart.reveal.visible {

  transform: translateX(-50%);

}

.process-chart .process-step {

  position: relative;

  min-height: 370px;

  padding: 0 24px 24px;

  text-align: center;

  border-right 0;

}

.process-chart .process-step::after {

  content: "";

  position: absolute;

  right: 0;

  top: 68px;

  bottom: 12px;

  width: 1px;

  background: rgba(176,141,87,.42);

}

.process-chart .process-step:last-child::after {

  display: none;

}

.process-chart .process-step:nth-child(5)::after {

  background: rgba(176,141,87,.28);

}

.process-chart .process-step:last-child {

  border-right: 0;

}

.process-chart .process-step::before {

  content: "";

  position: absolute;

  top: 29px;

  left: calc(50% + 48px);

  width: calc(100% - 106px);

  height: 1px;

  background: rgba(176,141,87,.82);

}

.process-chart .process-step:last-child::before {

  display: none;

}

.process-chart .process-number {

  width: 58px;

  height: 58px;

  margin: 0 auto 12px;

  display: flex;

  align-items: center;

  justify-content: center;

  border: 1.4px solid var(--gold);

  border-radius: 50%;

  background: #0f0f0f;

  color: var(--gold);

  font-family: var(--heading);

  font-size: 26px;

  line-height: 1;

  position: relative;

  z-index: 2;

}

.process-chart .process-step-icon {

  width: 95px;

  height: 95px;
  
  object-fit: contain;

  margin: 0 auto 5px;

}

.process-chart .process-step h3 {

  min-height: 62px;

  margin: 0 auto 12px;

  color: var(--white);

  font-family: var(--heading);

  font-size: 18px;

  line-height: 1.28;

  letter-spacing: .07em;

  text-transform: uppercase;

}

.process-chart .process-step .mini-line {

  width: 44px;

  height: 1px;

  margin: 0 auto 22px;

  background: rgba(176,141,87,.82);

}

.process-chart .process-step p {

  max-width: 178px;

  margin: 0 auto;

  color: rgba(245,242,237,.82);

  font-size: 14px;

  line-height: 1.72;

}

/* Process Footer */

.process-logo-row {

  display: grid;

  grid-template-columns: 1fr auto 1fr;

  align-items: center;

  gap: 28px;
  
  max-width: 820px;

  margin: 24px auto 14px;

}

.process-line {

  height: 1px;

  background: rgba(176,141,87,.65);

}

.process-logo-row img {

  width: 145px;

  height: auto;

  object-fit: contain;

}

.process-note {

  max-width: 820px;

  margin: 6px auto 0;

  text-align: center;

  color: rgba(245,242,237,.88);

  font-family: var(--heading);

  font-size: clamp(1.35rem, 2.2vw, 1.8rem);

  line-height: 1.35;

}

.process-note::before {

  content: "";

  display: block;

  width: 50px;

  height: 1px;

  margin: 0 auto 18px;

  background: rgba(176,141,87,.65);

}

.process-note em {

  display: inline-block;

  margin-top: 6px;

  color: var(--gold);

  font-style: italic;

}

/* Tablet */

@media (max-width: 980px) {

  .process-heading {

    min-height: auto;

    max-width: 760px;

    margin-bottom: 62px;

  }

  .process-heading-copy {

    max-width: 760px;

    text-align: center;

  }

  .process-heading-copy .eyebrow-centered {

    justify-content: center;

  }

  .process-heading-copy .heading-ornament {

    margin-left: auto;

    margin-right: auto;

  }

  .process-heading-copy p:not(.eyebrow) {

    max-width: 680px;

    margin: 0 auto;

  }

  .process-watermark {

    display: none;

  }

  .process-chart {

    width: min(760px, calc(100% - 40px));

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

    gap: 48px 0;

    left: auto;

    transform: none;

  }

  .process-chart .process-step {

    min-height: auto;

    padding: 0 34px 28px;

    border-right: 0;

  }

  .process-chart .process-step::before {

    display: none;

  }

  .process-chart .process-step p {

    max-width: 280px;

  }

}

/* Mobile */

@media (max-width: 640px) {

  .process-heading {

    margin-bottom: 54px;

  }

  .process-heading-copy h2 {

    font-size: clamp(3rem, 12vw, 4.2rem);

  }

  .process-heading-copy .heading-ornament {

    width: 190px;

  }

  .process-chart {

    width: min(420px, calc(100% - 40px));

    grid-template-columns: 1fr;

    gap: 52px;

    margin-top: 36px;

  }

  .process-chart .process-step {

    padding: 0 24px;

  }

  .process-chart .process-number {

    margin-bottom: 30px;

  }

  .process-chart .process-step-icon {

    width: 58px;

    height: 58px;

    margin-bottom: 24px;

  }

  .process-chart .process-step h3 {

    min-height: auto;

    font-size: 20px;

  }

  .process-chart .process-step p {

    max-width: 300px;

  }

  .process-logo-row {

    gap: 16px;

    margin-top: 56px;

  }

  .process-logo-row img {

    width: 120px;

  }

}

/* =========================

   Investment Ranges

========================= */

.investment-luxury {

  position: relative;

  overflow: hidden;

  background:

    linear-gradient(

      180deg,

      #111111 0%,

      #2a2a2a 24%,

      #1a1a1a 55%,

      #0b0b0b 100%

    );

}

.investment-bg-left,

.investment-bg-right {

  position: absolute;

  z-index: 0;

  pointer-events: none;

}

.investment-bg-left {

  left: 0;

  top: 90px;

  width: 40%;

  height: 620px;
  
  opacity: .78;

  background:

    linear-gradient(

      90deg,

      rgba(0,0,0,.02) 0%,

      rgba(0,0,0,.10) 45%,

      rgba(42,42,42,.88) 100%

    ),

    url("assets/images/blueprint-detail.jpeg") center / cover no-repeat;

  filter: brightness(2.20) contrast(1.10) saturate(.85);

  -webkit-mask-image:

    linear-gradient(

      to right,

      rgba(0,0,0,1) 0%,

      rgba(0,0,0,.95) 55%,

      rgba(0,0,0,.45) 82%,

      rgba(0,0,0,0) 100%

    ),

    linear-gradient(

  to bottom,

  rgba(0,0,0,0) 0%,

  rgba(0,0,0,.25) 10%,

  rgba(0,0,0,.80) 22%,

  rgba(0,0,0,1) 35%,

  rgba(0,0,0,1) 82%,

  rgba(0,0,0,.75) 90%,

  rgba(0,0,0,.35) 96%,

  rgba(0,0,0,0) 100%

);

  -webkit-mask-composite: source-in;

  mask-image:

    linear-gradient(

      to right,

      rgba(0,0,0,1) 0%,

      rgba(0,0,0,.95) 55%,

      rgba(0,0,0,.45) 82%,

      rgba(0,0,0,0) 100%

    ),

    linear-gradient(

  to bottom,

  rgba(0,0,0,0) 0%,

  rgba(0,0,0,.25) 10%,

  rgba(0,0,0,.80) 22%,

  rgba(0,0,0,1) 35%,

  rgba(0,0,0,1) 82%,

  rgba(0,0,0,.75) 90%,

  rgba(0,0,0,.35) 96%,

  rgba(0,0,0,0) 100%

);

  mask-composite: intersect;

  -webkit-mask-size: 100% 100%;

  -webkit-mask-repeat: no-repeat;

  mask-size: 100% 100%;

  mask-repeat: no-repeat;

}

.investment-bg-right {

  right: 0;

  top: 90px;

  width: 48%;

  height: 620px;
  
  opacity: .95;

  background:

    linear-gradient(

      270deg,

      rgba(0,0,0,.02) 0%,

      rgba(0,0,0,.10) 45%,

      rgba(42,42,42,.88) 100%

    ),

    url("assets/images/investment-home.jpeg") center / cover no-repeat;

  filter: brightness(2.60) contrast(1.12) saturate(1.12);

  -webkit-mask-image:

    linear-gradient(

      to left,

      rgba(0,0,0,1) 0%,

      rgba(0,0,0,.95) 55%,

      rgba(0,0,0,.45) 82%,

      rgba(0,0,0,0) 100%

    ),

    linear-gradient(

  to bottom,

  rgba(0,0,0,0) 0%,

  rgba(0,0,0,.25) 10%,

  rgba(0,0,0,.80) 22%,

  rgba(0,0,0,1) 35%,

  rgba(0,0,0,1) 82%,

  rgba(0,0,0,.75) 90%,

  rgba(0,0,0,.35) 96%,

  rgba(0,0,0,0) 100%

);

  -webkit-mask-composite: source-in;

  mask-image:

    linear-gradient(

      to left,

      rgba(0,0,0,1) 0%,

      rgba(0,0,0,.95) 55%,

      rgba(0,0,0,.45) 82%,

      rgba(0,0,0,0) 100%

    ),

    linear-gradient(

  to bottom,

  rgba(0,0,0,0) 0%,

  rgba(0,0,0,.25) 10%,

  rgba(0,0,0,.80) 22%,

  rgba(0,0,0,1) 35%,

  rgba(0,0,0,1) 82%,

  rgba(0,0,0,.75) 90%,

  rgba(0,0,0,.35) 96%,

  rgba(0,0,0,0) 100%

);

  mask-composite: intersect;

  -webkit-mask-size: 100% 100%;

  -webkit-mask-repeat: no-repeat;

  mask-size: 100% 100%;

  mask-repeat: no-repeat;

}

.investment-luxury::before {

  content: "";

  position: absolute;

  inset: 0;

  z-index: 1;

  pointer-events: none;

  background:

    linear-gradient(

      180deg,

      rgba(17,17,17,.96) 0%,

      rgba(17,17,17,.88) 16%,

      rgba(17,17,17,.58) 40%,

      rgba(17,17,17,.62) 68%,

      rgba(11,11,11,.94) 100%

    ),

    radial-gradient(

      ellipse at center 340px,

      rgba(17,17,17,.88) 0%,

      rgba(17,17,17,.76) 22%,

      rgba(17,17,17,.48) 42%,

      rgba(17,17,17,.18) 58%,

      rgba(17,17,17,0) 72%

    );
}

.investment-luxury .container {

  position: relative;

  z-index: 2;

}

.investment-heading {

  max-width: 980px;

  margin: 0 auto 54px;

  text-align: center;

}

.investment-heading .eyebrow-centered {

  justify-content: center;

}

.investment-heading h2 {

  max-width: 980px;

  margin: 0 auto;

  font-size: clamp(3.5rem, 5vw, 5.2rem);

  line-height: 1.06;

  letter-spacing: -0.035em;

}

.investment-heading .heading-ornament {

  width: 435px;

  height: 1.5px;

  margin: 32px auto;

  background: rgba(176,141,87,.70);

}

.investment-heading p:not(.eyebrow) {

  max-width: 620px;

  margin: 24px auto 0;

  color: rgba(245,242,237,.82);

  font-size: 18px;

  line-height: 1.9;

}

.investment-luxury-grid {

  display: grid;

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

  gap: 18px;

  align-items: stretch;
  
  margin-top: 88px;

}

.investment-tier-card {

  position: relative;

  min-height: 545px;

  padding-top: 58px;

  display: flex;

  flex-direction: column;

  background:

    linear-gradient(180deg, rgba(29,27,24,.72), rgba(12,12,12,.9));

  border: 1px solid rgba(176,141,87,.62);

  transition:

    transform .35s ease,

    border-color .35s ease,

    box-shadow .35s ease;

}

.investment-tier-card:hover {

  transform: translateY(-6px);

  border-color: var(--gold);

  box-shadow: 0 0 34px rgba(176,141,87,.22);

}

.investment-icon-circle {

  position: absolute;

  top: -45px;

  left: 50%;

  width: 92px;

  height: 92px;

  transform: translateX(-50%);

  display: flex;

  align-items: center;

  justify-content: center;

  background: #111111;

  border: 1px solid var(--gold);

  border-radius: 50%;

  box-shadow: 0 0 22px rgba(0,0,0,.35);

}

.investment-icon-circle::before,

.investment-icon-circle::after {

  content: "";

  position: absolute;

  top: 50%;

  width: 44px;

  height: 1px;

  background: rgba(176,141,87,.45);

}

.investment-icon-circle::before {

  right: 100%;

}

.investment-icon-circle::after {

  left: 100%;

}

.investment-icon-circle span {

  color: var(--gold);

  font-size: 42px;

  font-family: var(--heading);

  line-height: 1;

}

.investment-card-top {

  padding: 34px 30px 38px;

  text-align: center;

}

.investment-tier-label {

  display: block;

  margin-bottom: 20px;

  color: var(--gold);

  font-size: 12px;

  font-weight: 700;

  letter-spacing: .28em;

  text-transform: uppercase;

}

.investment-card-top h3 {

  color: var(--white);

  font-size: clamp(2.4rem, 3vw, 3.2rem);

  line-height: 1;

  letter-spacing: -0.025em;

}

.investment-card-top .mini-line {

  width: 42px;

  height: 1px;

  margin: 22px auto 20px;

  background: var(--gold);

}

.investment-card-top p {

  max-width: 270px;

  margin: 0 auto;

  color: rgba(245,242,237,.84);

  font-size: 16px;

  line-height: 1.75;

}

.investment-card-bottom {

  flex: 1;

  padding: 34px 32px 34px;

  border-top: 1px solid rgba(176,141,87,.38);

  background: rgba(245,242,237,.025);

}

.investment-card-bottom h4 {

  margin: 0 0 18px;

  color: var(--gold);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: .24em;

  text-transform: uppercase;

}

.investment-card-bottom ul {

  margin: 0;

  padding: 0;

  list-style: none;

}

.investment-card-bottom li {

  position: relative;

  padding-left: 18px;

  color: rgba(245,242,237,.82);

  font-size: 14px;

  line-height: 1.8;

}

.investment-card-bottom li::before {

  content: "•";

  position: absolute;

  left: 0;

  color: var(--gold);

}

.investment-logo-row {

  max-width: 820px;

  display: grid;

  grid-template-columns: 1fr auto 1fr;

  align-items: center;

  gap: 28px;

  margin: 52px auto 18px;

}

.investment-line {

  height: 1px;

  background: rgba(176,141,87,.65);

}

.investment-logo-row img {

  width: 145px;

  height: auto;

  object-fit: contain;

}

.investment-note {

  max-width: 820px;

  margin: 0 auto;

  text-align: center;

  color: rgba(245,242,237,.9);

  font-family: var(--heading);

  font-size: clamp(1.35rem, 2.2vw, 1.8rem);

  line-height: 1.35;

}

.investment-note em {

  display: inline-block;

  margin-top: 6px;

  color: var(--gold);

  font-style: italic;

}

/* Tablet */

@media (max-width: 980px) {

  .investment-bg-left,

  .investment-bg-right {

    opacity: .11;

    width: 50%;

  }

  .investment-luxury-grid {

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

    gap: 72px 18px;

  }

  .investment-tier-card {

    min-height: auto;

  }

}

/* Mobile */

@media (max-width: 640px) {

  .investment-heading h2 {

    font-size: clamp(3rem, 12vw, 4.2rem);

  }

  .investment-heading .heading-ornament {

    width: 190px;

  }

  .investment-heading p:not(.eyebrow) {

    font-size: 16px;

  }

  .investment-luxury-grid {

    grid-template-columns: 1fr;

    gap: 72px;

  }

  .investment-tier-card {

    padding-top: 52px;

  }

  .investment-card-top {

    padding: 32px 26px 34px;

  }

  .investment-card-bottom {

    padding: 30px 28px 32px;

  }

  .investment-logo-row {

    gap: 16px;

    margin-top: 52px;

  }

  .investment-logo-row img {

    width: 120px;

  }

  .investment-note br {

    display: none;

  }

}

/* =========================

   About

========================= */

.about-grid {

  display: grid;

  grid-template-columns: 0.9fr 1.1fr;

  align-items: center;

  gap: 70px;

}

.about-image img {

  width: 100%;

  height: 640px;

  object-fit: cover;

}

.text-link {

  color: var(--gold);

  font-size: 12px;

  font-weight: 700;

  letter-spacing: 0.16em;

  text-transform: uppercase;

}

/* =========================

   Hover Glow

========================= */

.service-card,

.project-card,

.investment-card,

.timeline-item,

.consultation-form {

  transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;

}

.service-card:hover,

.project-card:hover,

.investment-card:hover,

.timeline-item:hover,

.consultation-form:hover {

  border-color: var(--gold);

  box-shadow: 0 0 34px rgba(176, 141, 87, 0.24);

  transform: translateY(-5px);

}

/* =========================

   Final CTA

========================= */

.final-cta {

  text-align: center;

  background:

    linear-gradient(rgba(17, 17, 17, 0.74), rgba(17, 17, 17, 0.84)),

    url('https://images.unsplash.com/photo-1600607687644-c7171b42498f?auto=format&fit=crop&w=1800&q=80') center / cover fixed;

}

/* =========================

   Contact

========================= */

.contact-grid {

  display: grid;

  grid-template-columns: 0.8fr 1.2fr;

  gap: 60px;

}

.contact-note {

  margin-top: 28px;

  padding-left: 20px;

  border-left: 2px solid var(--gold);

}

.consultation-form {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 18px;

  padding: 34px;

  background: #161616;

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

}

.consultation-form label {

  display: grid;

  gap: 8px;

  color: var(--gray);

  font-size: 12px;

  font-weight: 700;

  letter-spacing: 0.12em;

  text-transform: uppercase;

}

.consultation-form input,

.consultation-form select,

.consultation-form textarea {

  width: 100%;

  padding: 14px;

  border: 1px solid rgba(245, 242, 237, 0.18);

  background: #0f0f0f;

  color: var(--white);

  font: inherit;

  outline: none;

}

.consultation-form input:focus,

.consultation-form select:focus,

.consultation-form textarea:focus {

  border-color: var(--gold);

}

.full {

  grid-column: 1 / -1;

}

.honeypot {

  display: none !important;

}

/* =========================

   Footer

========================= */

.site-footer {

  padding: 70px 0 24px;

  background: #0c0c0c;

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

}

.footer-grid {

  display: grid;

  grid-template-columns: 1.4fr 0.6fr 0.8fr;

  gap: 40px;

}

.footer-brand {

  margin-bottom: 18px;

}

.footer-brand img {

  width: 165px;

  height: 165px;

  object-fit: contain;

  flex: 0 0 165px;

}

.site-footer h4 {

  color: var(--gold);

  font-size: 12px;

  letter-spacing: 0.16em;

  text-transform: uppercase;

}

.site-footer a:not(.brand) {

  display: block;

  margin: 8px 0;

  color: rgba(245, 242, 237, 0.7);

}

.footer-bottom {

  margin-top: 40px;

  padding-top: 20px;

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

}

/* =========================

   Reveal Animations

========================= */

.reveal {

  opacity: 0;

  transform: translateY(22px);

  transition:

    opacity 0.7s ease,

    transform 0.7s ease;

}

.reveal.visible {

  opacity: 1;

  transform: none;

}

/* =========================

   Tablet

========================= */

@media (max-width: 980px) {

  .site-header,

  .site-header.scrolled {

    padding: 14px 20px;

  }

  .nav-toggle {

    display: block;

    z-index: 101;

  }

  .main-nav {

    position: fixed;

    inset: 0;

    display: flex;

    flex-direction: column;

    justify-content: center;

    gap: 28px;

    background: rgba(17, 17, 17, 0.98);

    font-size: 14px;

    opacity: 0;

    pointer-events: none;

    transition: 0.25s ease;

  }

  .main-nav.open {

    opacity: 1;

    pointer-events: auto;

  }

  .main-nav a {

    padding: 0;

  }

  .main-nav a::after {

    display: none !important;

  }

  .nav-cta {

    margin-left: 0;

  }

  .card-grid.three,

  .split-heading,

  .about-grid,

  .contact-grid,

  .footer-grid {

    grid-template-columns: 1fr;

  }

  .project-grid {

    grid-template-columns: 1fr;

    grid-auto-rows: 320px;

  }

  .project-card.large {

    grid-row: auto;

  }

  .timeline,

  .investment-grid {

    grid-template-columns: 1fr 1fr;

  }

  .hero-feature-strip {

    grid-template-columns: 1fr 1fr;

    padding: 24px;

  }

  .hero-feature-strip div {

    padding: 18px;

    border-right: 0;

    border-bottom: 1px solid rgba(176, 141, 87, 0.22);

  }

  .gallery-grid {

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

  }

}

/* =========================

   Mobile

========================= */

@media (max-width: 640px) {

  .site-header,

  .site-header.scrolled {

    padding: 10px 16px;

  }

  .logo {

    gap: 8px;

    max-width: calc(100% - 56px);

  }

  .logo img {

    width: 76px;

    height: 76px;

    flex: 0 0 76px;

  }

  .brand-text {

    font-size: 21px;

    line-height: 1;

    white-space: nowrap;

  }

  .nav-toggle {

    width: 38px;

    height: 38px;

    flex: 0 0 38px;

  }

  .hero {

    min-height: auto;

    padding-bottom: 0;

  }

  .hero-content {

    padding-top: 140px;

    padding-bottom: 56px;

  }

  .hero h1 {

    font-size: clamp(3rem, 12vw, 4.4rem);

  }

  .hero-copy {

    font-size: 16px;

  }

  .hero-feature-strip {

    position: relative;

    grid-template-columns: 1fr;

    padding: 22px;

  }

  .hero-feature-strip div {

    padding: 18px 0;

    border-right: 0;

    border-bottom: 1px solid rgba(176, 141, 87, 0.25);

  }

  .section {

    padding: 82px 0;

  }

  .timeline,

  .investment-grid,

  .consultation-form {

    grid-template-columns: 1fr;

  }

  .gallery-grid {

    grid-template-columns: 1fr 1fr;

  }

  .gallery-grid img {

    height: 150px;

  }

  .btn {

    width: 100%;

  }

  .about-image img {

    height: 420px;

  }

  .footer-brand img {

    width: 70px;

    height: 70px;

    flex: 0 0 70px;

  }

}