.hero-image {
  background-image: url("assets/parkline/facade/04-dark-wing.jpg");
  background-position: center 42%;
}

/* Apple-inspired refinement: calm type, glass navigation, generous space. */
body {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Calibri, Arial, sans-serif;
  background: #f5f5f7;
  color: #1d1d1f;
  -webkit-font-smoothing: antialiased;
}

button,input,textarea,select { font-family: inherit; }

.hero h1,.section h2,.statement h2,.project-title h3,.gallery-heading h2 {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", Calibri, Arial, sans-serif;
  font-weight: 600;
  letter-spacing: -.045em;
}

.nav {
  position: fixed;
  height: 60px;
  padding: 0 max(24px,5vw);
  border-bottom: 1px solid rgba(255,255,255,.16);
  background: rgba(18,18,20,.66);
  backdrop-filter: saturate(180%) blur(22px);
  -webkit-backdrop-filter: saturate(180%) blur(22px);
}

.brand { width: 142px; height: 46px; }
.navlinks { gap: 34px; }
.navlinks a,.languages button { font-size: 12px; letter-spacing: 0; text-transform: none; font-weight: 400; }
.hero-content { padding: 15vh max(24px,5vw) 7vh; }
.hero h1 { font-size: clamp(54px,7.4vw,116px); line-height: .88; text-transform: none; }
.hero .overline { background: rgba(20,20,22,.62); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; backdrop-filter: blur(14px); }
.hero-shade { background: linear-gradient(0deg,rgba(0,0,0,.66),transparent 52%),linear-gradient(90deg,rgba(0,0,0,.18),transparent 48%); }
.section { padding-top: 140px; padding-bottom: 140px; }
.section-label { letter-spacing: .12em; }
.manifesto h2,.projects h2,.contact h2,.gallery-heading h2,.project-title h3 { text-transform: none; line-height: 1.02; }
.manifesto-copy p,.projects-heading>p,.parkline-gallery-copy p { color: #6e6e73; font-size: 17px; line-height: 1.55; }
.projects .projects-heading>p,.projects .parkline-gallery-copy p { color: #a1a1a6; }
.projects { background: #000; }
.portfolio-group-heading { text-transform: none; }
.portfolio-group-heading strong { border: 0; border-radius: 999px; background: rgba(255,255,255,.1); }
.project-media,.parkline-facade-grid figure,.apartments-grid figure,.gallery-grid figure,.layouts-grid figure,.exterior-grid figure { border-radius: 24px; overflow: hidden; }
.statement { background: #f5f5f7; }
.contact { background: #fff; }
.contact-button { border-radius: 999px; padding: 18px 24px; width: fit-content; gap: 50px; }
.text-link { color: #06c; border: 0; font-size: 15px; letter-spacing: 0; }

@media(max-width:800px) {
  .nav { height: 54px; padding: 0 18px; }
  .brand { width: 116px; height: 40px; }
  .section { padding-top: 88px; padding-bottom: 88px; }
  .hero h1 { font-size: 14vw; line-height: .9; }
  .project-media,.parkline-facade-grid figure,.apartments-grid figure,.gallery-grid figure,.layouts-grid figure,.exterior-grid figure { border-radius: 16px; }
}

.parkline {
  background-image: url("assets/parkline/facade/01-main.jpg");
}

body {
  font-family: Calibri, "Segoe UI", Arial, sans-serif;
}

button,
input,
textarea,
select { font-family: Calibri, "Segoe UI", Arial, sans-serif; }

.hero h1,
.section h2,
.statement h2,
.project-title h3 {
  font-family: Calibri, "Segoe UI", Arial, sans-serif;
  font-weight: 700;
  letter-spacing: -0.055em;
}

.hero h1 {
  margin: auto 0 2.5vh;
  font-size: clamp(58px, 8.5vw, 136px);
  line-height: .82;
  text-transform: uppercase;
}

em {
  font-family: Calibri, "Segoe UI", Arial, sans-serif;
  font-weight: 700;
}

.metrics strong { font-family: Calibri, "Segoe UI", Arial, sans-serif; }

/* BMA-inspired spatial language: full-bleed imagery, minimal chrome, bold type. */
.nav {
  height: 82px;
  padding: 0 3.2vw;
  border: 0;
}

.brand {
  width: 168px;
  height: 60px;
  padding: 0;
  border: 0;
  background: transparent;
  display: flex;
  justify-content: center;
  align-items: center;
}

.brand-header img {
  filter: drop-shadow(0 1px 10px rgba(0,0,0,.28));
}

.brand img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.navlinks { gap: 30px; }

.hero-content {
  padding: 15vh 3.2vw 4vh;
  justify-content: flex-start;
}

.hero .overline {
  margin: 0;
  padding: 9px 12px;
  align-self: flex-start;
  background: rgba(12,12,12,.82);
}

.hero-bottom {
  width: min(420px, 100%);
  display: block;
  align-items: end;
  margin: 0;
}

.hero-bottom > a {
  color: #fff;
  font-size: clamp(24px, 2.8vw, 44px);
  font-weight: 700;
  letter-spacing: -.05em;
  text-decoration: none;
  text-transform: uppercase;
}

.hero-bottom p { margin: 0; text-align: left; }
.hero-shade { background: linear-gradient(0deg,rgba(0,0,0,.72),transparent 48%),linear-gradient(90deg,rgba(0,0,0,.22),transparent 45%); }

.current-badge { display: none; }

.manifesto h2,
.projects h2,
.contact h2,
.gallery-heading h2 { text-transform: uppercase; }

.project-media { filter: none; }
.project-title h3 { text-transform: uppercase; }
.project-meta { border-top: 1px solid rgba(255,255,255,.2); }

.portfolio-group-heading {
  scroll-margin-top: 24px;
  margin: 0 0 22px;
  padding: 16px 0;
  border-top: 1px solid rgba(255,255,255,.3);
  border-bottom: 1px solid rgba(255,255,255,.3);
  display: grid;
  grid-template-columns: 1fr auto 70px;
  align-items: center;
  gap: 24px;
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.portfolio-group-heading strong {
  padding: 9px 13px;
  border: 1px solid currentColor;
  font-size: 10px;
}

.portfolio-group-heading span:last-child { text-align: right; }
.portfolio-completed { margin-top: 110px; }
.portfolio-current strong { color: #d6f46f; }

.project-grid {
  margin-bottom: 120px;
}

.footer-brand {
  width: 176px;
  height: 62px;
  padding: 0;
  border: 0;
  display: flex;
  background: #fff;
}

.cr3-gallery,
.parkline-gallery {
  padding-top: 90px;
  border-top: 1px solid rgba(255,255,255,.2);
}

.parkline-gallery {
  margin: 110px 0;
}

.parkline-gallery-copy strong {
  display: inline-block;
  margin-bottom: 18px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.45);
  font-size: 9px;
  letter-spacing: .15em;
}

.parkline-gallery-copy p {
  margin: 0;
  font-size: 15px;
  line-height: 1.75;
}

.parkline-facade-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
}

.parkline-facade-grid figure {
  margin: 0;
  aspect-ratio: 4/5;
  overflow: hidden;
  background: #24251f;
}

.parkline-facade-grid .facade-main {
  grid-column: 1/-1;
  aspect-ratio: 16/10;
}

.parkline-facade-grid img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.apartments-heading {
  margin-top: 90px;
  padding: 18px 0;
  border-top: 1px solid rgba(255,255,255,.2);
  display: flex;
  justify-content: space-between;
  font-size: 9px;
  letter-spacing: .16em;
}

.apartments-intro {
  max-width: 570px;
  margin: 0 0 34px;
  font-size: 14px;
  line-height: 1.7;
}

.apartments-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.apartments-grid figure {
  margin: 0;
  position: relative;
  min-height: 720px;
  padding: 46px;
  background: #fff;
  overflow: hidden;
}

.apartment-plan {
  width: min(72%, 700px);
  height: auto;
  display: block;
  margin: 0 auto;
}

.apartment-locator {
  position: absolute;
  right: 42px;
  bottom: 38px;
  width: 190px;
  height: auto;
  border-left: 1px solid #ddd;
}

.gallery-heading {
  display: grid;
  grid-template-columns: 1.4fr .6fr;
  gap: 9vw;
  align-items: end;
  margin-bottom: 55px;
}

.gallery-heading h2 {
  margin: 28px 0 0;
  font-size: clamp(54px, 7vw, 106px);
}

.gallery-heading > p {
  max-width: 430px;
  margin: 0 0 12px;
  font-size: 15px;
  line-height: 1.75;
}

.section-label.compact {
  grid-template-columns: 65px auto;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.gallery-grid figure,
.layouts-grid figure {
  margin: 0;
  overflow: hidden;
  background: #24251f;
}

.gallery-grid figure {
  aspect-ratio: 1 / 1;
}

.gallery-grid .gallery-wide {
  grid-column: 1 / -1;
  aspect-ratio: 16 / 9;
}

.gallery-grid .gallery-tall {
  aspect-ratio: 4 / 5;
}

.gallery-grid img,
.layouts-grid img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform .8s cubic-bezier(.2,.7,.2,1);
}

.gallery-grid figure:hover img {
  transform: scale(1.025);
}

.layouts-heading {
  margin-top: 90px;
  padding: 18px 0;
  border-top: 1px solid rgba(255,255,255,.2);
  display: flex;
  justify-content: space-between;
  font-size: 9px;
  letter-spacing: .16em;
}

.exterior-heading,
.interior-divider {
  margin-top: 38px;
  padding: 18px 0;
  border-top: 1px solid rgba(255,255,255,.2);
  display: flex;
  justify-content: space-between;
  font-size: 9px;
  letter-spacing: .16em;
}

.exterior-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.exterior-grid figure {
  margin: 0;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #24251f;
}

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

.cr3 {
  background-image: url("assets/cr3/exterior-main.jpg");
}

.layouts-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.layouts-grid figure {
  aspect-ratio: 1 / 1;
}

.layouts-grid img {
  object-fit: contain;
}

@media (max-width: 800px) {
  .brand {
    width: 126px;
    height: 48px;
    padding: 0;
  }

  .hero-content {
    padding: 15vh 20px 24px;
    justify-content: flex-start;
  }

  .hero h1 {
    margin-top: auto;
    font-size: 15vw;
    line-height: .86;
  }

  .hero-bottom {
    grid-template-columns: 1fr 1fr;
    gap: 18px;
  }

  .hero-bottom p { display: block; max-width: 82%; }

  .footer-brand {
    width: 142px;
    height: 52px;
    padding: 0;
  }

  .gallery-heading {
    grid-template-columns: 1fr;
    gap: 25px;
  }

  .portfolio-group-heading {
    grid-template-columns: 1fr auto;
    gap: 12px;
  }

  .portfolio-group-heading span:last-child { display: none; }
  .portfolio-completed { margin-top: 70px; }
  .project-grid { margin-bottom: 80px; }

  .parkline-facade-grid { grid-template-columns: 1fr; gap: 8px; }
  .parkline-facade-grid .facade-main { grid-column: auto; aspect-ratio: 4/5; }
  .parkline-facade-grid figure { aspect-ratio: 4/5; }
  .apartments-grid { gap: 8px; }
  .apartments-grid figure { min-height: 0; padding: 20px 14px 118px; }
  .apartment-plan { width: 100%; }
  .apartment-locator { width: 118px; right: 14px; bottom: 12px; }

  .gallery-heading h2 {
    font-size: 14vw;
  }

  .gallery-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .gallery-grid .gallery-wide {
    grid-column: auto;
    aspect-ratio: 4 / 5;
  }

  .gallery-grid figure,
  .gallery-grid .gallery-tall {
    aspect-ratio: 4 / 5;
  }

  .layouts-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .exterior-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}

/* Final Apple-inspired layer */
body{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Calibri,Arial,sans-serif;background:#f5f5f7;color:#1d1d1f;-webkit-font-smoothing:antialiased}
button,input,textarea,select{font-family:inherit}
.hero h1,.section h2,.statement h2,.project-title h3,.gallery-heading h2{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Calibri,Arial,sans-serif;font-weight:600;letter-spacing:-.045em;text-transform:none;line-height:1.02}
.nav{position:fixed;height:60px;padding:0 max(24px,5vw);border-bottom:1px solid rgba(255,255,255,.16);background:rgba(18,18,20,.66);backdrop-filter:saturate(180%) blur(22px);-webkit-backdrop-filter:saturate(180%) blur(22px)}
.brand{width:142px;height:46px}.navlinks{gap:34px}.navlinks a,.languages button{font-size:12px;letter-spacing:0;text-transform:none;font-weight:400}
.hero-content{padding:15vh max(24px,5vw) 7vh}.hero h1{font-size:clamp(54px,7.4vw,116px);line-height:.88;text-transform:none}.hero .overline{background:rgba(20,20,22,.62);border:1px solid rgba(255,255,255,.18);border-radius:999px;backdrop-filter:blur(14px)}
.hero-shade{background:linear-gradient(0deg,rgba(0,0,0,.66),transparent 52%),linear-gradient(90deg,rgba(0,0,0,.18),transparent 48%)}
.section{padding-top:140px;padding-bottom:140px}.section-label{letter-spacing:.12em}.manifesto-copy p,.projects-heading>p,.parkline-gallery-copy p{color:#6e6e73;font-size:17px;line-height:1.55}.projects .projects-heading>p,.projects .parkline-gallery-copy p{color:#a1a1a6}.projects{background:#000}
.portfolio-group-heading{text-transform:none}.portfolio-group-heading strong{border:0;border-radius:999px;background:rgba(255,255,255,.1)}
.project-media,.parkline-facade-grid figure,.apartments-grid figure,.gallery-grid figure,.layouts-grid figure,.exterior-grid figure{border-radius:24px;overflow:hidden}
.statement{background:#f5f5f7}.contact{background:#fff}.contact-button{border-radius:999px;padding:18px 24px;width:fit-content;gap:50px}.text-link{color:#06c;border:0;font-size:15px;letter-spacing:0}
@media(max-width:800px){.nav{height:54px;padding:0 18px}.brand{width:116px;height:40px}.section{padding-top:88px;padding-bottom:88px}.hero h1{font-size:14vw;line-height:.9}.project-media,.parkline-facade-grid figure,.apartments-grid figure,.gallery-grid figure,.layouts-grid figure,.exterior-grid figure{border-radius:16px}}
