:root {
  --csr-ink: #0a0a09;
  --csr-coal: #121210;
  --csr-ivory: #d8d3c8;
  --csr-ivory-deep: #c9c2b4;
  --csr-gold: #b59a68;
  --csr-gold-light: #d6c49d;
  --csr-line: rgba(181,154,104,.35);
  --csr-shell: min(1180px,calc(100% - 80px));
  --csr-serif: var(--serif);
  --csr-sans: var(--sans);
}

html {
  scroll-behavior: smooth;
}

.csr-page {
  margin: 0;
  background: var(--csr-ink);
  color: #eee9df;
  font-family: var(--csr-sans);
  font-weight: 300;
}

.csr-page * {
  box-sizing: border-box;
}

.csr-page img {
  display: block;
  max-width: 100%;
}

.csr-shell {
  width: var(--csr-shell);
  margin-inline: auto;
}

.csr-section {
  padding: 110px 0;
  scroll-margin-top: 92px;
}

.csr-ivory {
  color: #191815;
  background: linear-gradient(135deg,#c9c3b8 0%,#e0dcd3 38%,#cbc4b7 100%);
  position: relative;
}

.csr-ivory:after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background: repeating-linear-gradient(115deg,rgba(255,255,255,.22) 0,rgba(255,255,255,.22) 1px,transparent 1px,transparent 8px);
}

.csr-ivory>.csr-shell {
  position: relative;
  z-index: 1;
}

.csr-kicker,.csr-heading>p,.csr-split-head>div>p {
  color: var(--csr-gold-light);
  font-size: 10px;
  letter-spacing: .25em;
  font-weight: 500;
}

.csr-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.csr-button {
  min-height: 43px;
  padding: 0 19px;
  border: 1px solid rgba(255,255,255,.25);
  color: #fff;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  transition: .25s;
}

.csr-button:hover {
  border-color: var(--csr-gold);
  color: var(--csr-gold-light);
}

.csr-button--gold {
  color: #f4efe5;
  border-color: #a19167;
  background: linear-gradient(112deg,#090908 0%,#242016 48%,#a19167 100%);
}

.csr-button--gold:hover {
  color: #fffaf0;
  border-color: #b4a079;
  background: linear-gradient(112deg,#11100d 0%,#332c1d 48%,#b4a079 100%);
}

.csr-nav {
  position: sticky;
  z-index: 20;
  top: 75px;
  background: rgba(10,10,9,.94);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.csr-nav .csr-shell {
  min-height: 49px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.csr-nav span {
  font-size: 9px;
  letter-spacing: .24em;
  color: var(--csr-gold);
}

.csr-nav div div {
  display: flex;
  gap: 25px;
}

.csr-nav a {
  display: inline-flex;
  min-height: 49px;
  align-items: center;
  color: rgba(255,255,255,.58);
  font-size: 9px;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
}

.csr-nav a:hover {
  color: var(--csr-gold-light);
}

.csr-heading {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  padding-bottom: 28px;
  border-bottom: 1px solid rgba(20,18,15,.25);
  margin-bottom: 48px;
}

.csr-heading p {
  grid-column: 1/-1;
  color: #796645;
  margin: 0 0 15px;
}

.csr-heading h2,.csr-split-head h2,.csr-landscape h2,.csr-status h2,.csr-contact h2 {
  margin: 0;
  font: 400 clamp(42px,4.3vw,64px)/.98 var(--csr-serif);
  letter-spacing: -.035em;
}

.csr-heading>span {
  font: 400 28px var(--csr-serif);
  color: rgba(20,18,15,.35);
}

.csr-vision__grid {
  display: grid;
  grid-template-columns: .7fr 1.3fr;
  align-items: start;
  gap: 72px;
}

.csr-prose p,.csr-landscape__copy>p,.csr-status__copy>p {
  font-size: 13px;
  line-height: 1.85;
  margin: 0 0 17px;
}

.csr-prose .csr-lead,.csr-landscape__copy .csr-lead,.csr-maritime .csr-lead {
  font: 400 21px/1.5 var(--csr-serif);
}

.csr-photo {
  margin: 0;
  position: relative;
  overflow: hidden;
  background: #191815;
}

.csr-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s ease;
}

.csr-photo:hover img {
  transform: scale(1.015);
}

.csr-photo figcaption {
  padding: 10px 0 0;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  font-size: 8px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(20,18,15,.55);
}

.csr-photo figcaption span {
  color: #796645;
}

.csr-photo--vision {
  height: 360px;
}

.csr-tenets {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 1px;
  background: rgba(20,18,15,.2);
  margin-top: 70px;
  border: 1px solid rgba(20,18,15,.2);
}

.csr-tenets article {
  padding: 28px 30px;
  background: rgba(230,226,216,.44);
}

.csr-tenets small {
  color: #796645;
}

.csr-tenets h3 {
  font: 400 27px var(--csr-serif);
  margin: 24px 0 9px;
}

.csr-tenets p {
  font-size: 11px;
  line-height: 1.7;
  margin: 0;
}

.csr-masterplan {
  background: #11110f;
}

.csr-split-head {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 90px;
  align-items: start;
}

.csr-split-head h2 {
  color: #eee9df;
}

.csr-split-head .csr-prose {
  padding-top: 23px;
  color: rgba(255,255,255,.66);
}

.csr-sequence {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5,1fr);
  margin: 72px 0 58px;
  padding-top: 25px;
}

.csr-sequence__line {
  position: absolute;
  left: 3%;
  right: 3%;
  top: 6px;
  border-top: 1px solid var(--csr-line);
}

.csr-sequence article {
  position: relative;
  padding: 20px 18px 15px;
  border-left: 1px solid rgba(255,255,255,.12);
}

.csr-sequence article:before {
  content: "";
  position: absolute;
  left: -3px;
  top: -22px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--csr-gold-light);
}

.csr-sequence i {
  font: 400 12px var(--csr-serif);
  color: var(--csr-gold);
}

.csr-sequence span {
  display: block;
  margin: 24px 0 8px;
  font-size: 8px;
  letter-spacing: .19em;
  color: rgba(255,255,255,.42);
}

.csr-sequence h3 {
  font: 400 20px var(--csr-serif);
  margin: 0;
}

.csr-photo--wide {
  height: 390px;
  max-width: 970px;
  margin-inline: auto;
}

.csr-masterplan .csr-photo figcaption,.csr-maritime .csr-photo figcaption,.csr-delivery .csr-photo figcaption {
  color: rgba(255,255,255,.43);
}

.csr-landscape__grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 80px;
  align-items: center;
}

.csr-landscape .csr-photo {
  height: 390px;
}

.csr-landscape__copy {
  max-width: 450px;
}

.csr-landscape__copy .csr-kicker {
  color: #796645;
}

.csr-landscape h2 {
  margin: 15px 0 28px;
}

.csr-landscape dl {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  margin: 32px 0 0;
  border-top: 1px solid rgba(20,18,15,.25);
  padding-top: 20px;
}

.csr-landscape dt {
  font: 400 23px var(--csr-serif);
  color: #796645;
}

.csr-landscape dd {
  margin: 6px 15px 0 0;
  font-size: 9px;
  line-height: 1.5;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.csr-maritime {
  position: relative;
  background: #0b0b0a;
  overflow: hidden;
}

.csr-map {
  position: absolute;
  right: -9%;
  top: 0;
  width: 60%;
  height: 100%;
  opacity: .13;
  background: radial-gradient(circle at 50% 50%,transparent 0 12%,rgba(181,154,104,.7) 12.1% 12.3%,transparent 12.4% 24%,rgba(181,154,104,.5) 24.1% 24.3%,transparent 24.4%),repeating-linear-gradient(0deg,transparent 0 39px,rgba(181,154,104,.16) 40px),repeating-linear-gradient(90deg,transparent 0 39px,rgba(181,154,104,.16) 40px);
}

.csr-heading--light {
  border-color: rgba(255,255,255,.14);
}

.csr-heading--light>span {
  color: rgba(255,255,255,.18);
}

.csr-maritime__grid {
  display: grid;
  grid-template-columns: 1.35fr .65fr;
  gap: 70px;
  align-items: center;
}

.csr-maritime .csr-photo {
  height: 360px;
}

.csr-maritime .csr-prose {
  color: rgba(255,255,255,.67);
}

.csr-coordinate-card {
  border-top: 1px solid var(--csr-line);
  border-bottom: 1px solid var(--csr-line);
  padding: 17px 0;
  margin-top: 28px;
}

.csr-coordinate-card small,.csr-coordinate-card span {
  display: block;
  font-size: 8px;
  letter-spacing: .15em;
  color: rgba(255,255,255,.4);
}

.csr-coordinate-card strong {
  display: block;
  font: 400 23px var(--csr-serif);
  color: var(--csr-gold-light);
  margin: 8px 0;
}

.csr-delivery .csr-split-head h2 {
  color: #191815;
}

.csr-delivery .csr-split-head .csr-prose {
  color: #191815;
}

.csr-delivery__visuals {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 14px;
  margin-top: 60px;
}

.csr-delivery__visuals .csr-photo:first-child {
  height: 330px;
}

.csr-delivery__visuals .csr-photo:last-child {
  height: 280px;
  margin-top: 50px;
}

.csr-delivery .csr-photo figcaption {
  color: rgba(20,18,15,.55);
}

.csr-process {
  list-style: none;
  padding: 0;
  margin: 62px 0 0;
  display: grid;
  grid-template-columns: repeat(4,1fr);
  border-top: 1px solid rgba(20,18,15,.25);
}

.csr-process li {
  display: flex;
  gap: 16px;
  padding: 22px 20px 0 0;
}

.csr-process li+li {
  padding-left: 20px;
  border-left: 1px solid rgba(20,18,15,.2);
}

.csr-process li>span {
  font: 400 17px var(--csr-serif);
  color: #796645;
}

.csr-process strong {
  font: 400 19px var(--csr-serif);
}

.csr-process p {
  font-size: 10px;
  line-height: 1.6;
  margin: 7px 0;
}

.csr-status {
  background: linear-gradient(120deg,#11110f,#080807);
}

.csr-status__grid {
  display: grid;
  grid-template-columns: 1fr .8fr;
  gap: 100px;
  align-items: center;
}

.csr-status h2 {
  margin: 14px 0 28px;
}

.csr-status__copy>p {
  color: rgba(255,255,255,.64);
  max-width: 570px;
}

.csr-confidential {
  position: relative;
  display: inline-block;
  margin-top: 23px;
  padding: 0 0 13px;
  border: 0;
  font-size: 9px;
  letter-spacing: .2em;
  color: var(--csr-accent);
}

.csr-confidential:after {
  content: "";
  position: absolute;
  left: -1px;
  right: -1px;
  bottom: 0;
  border-bottom: 1px solid var(--csr-accent);
}

.csr-confidential>span {
  position: relative;
  top: 5px;
}

.csr-dossier {
  background: linear-gradient(145deg,#d8d1c4,#bdb4a4);
  color: #171511;
  padding: 35px 38px;
  box-shadow: 0 28px 70px rgba(0,0,0,.35);
  position: relative;
}

.csr-dossier:after {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(76,62,39,.22);
  pointer-events: none;
}

.csr-dossier__top {
  display: flex;
  justify-content: space-between;
  font-size: 8px;
  letter-spacing: .16em;
  color: var(--csr-accent);
}

.csr-dossier__top i {
  font-style: normal;
}

.csr-dossier>p {
  font-size: 8px;
  letter-spacing: .25em;
  margin: 45px 0 8px;
  color: var(--csr-accent);
}

.csr-dossier h3 {
  font: 400 37px var(--csr-serif);
  margin: 0 0 25px;
}

.csr-dossier dl {
  margin: 0;
}

.csr-dossier dl div {
  padding: 12px 0;
  border-top: 1px solid rgba(20,18,15,.18);
}

.csr-dossier dt {
  font-size: 8px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--csr-accent);
}

.csr-dossier dd {
  margin: 5px 0 0;
  font-size: 11px;
  line-height: 1.5;
}

.csr-dossier>a {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  color: #171511;
  text-decoration: none;
  margin-top: 25px;
  padding: 13px 0 0;
  border-top: 1px solid #756344;
  font-size: 9px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.csr-contact {
  background: #191814;
  padding: 80px 0 45px;
}

.csr-contact__panel {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 70px;
  align-items: end;
  padding: 45px 50px;
  border: 1px solid var(--csr-line);
  background: linear-gradient(110deg,rgba(181,154,104,.09),transparent);
}

.csr-contact__panel>div>p {
  color: #a19167;
  font-size: 10px;
  letter-spacing: .25em;
  font-weight: 500;
}

.csr-contact h2 {
  font-size: 45px;
  max-width: 720px;
  margin: 13px 0 15px;
}

.csr-contact__panel>div>span {
  font-size: 10px;
  color: rgba(255,255,255,.47);
}

.csr-contact .csr-actions {
  max-width: 270px;
  flex-direction: column;
}

.csr-contact .csr-button {
  width: 100%;
}

.csr-disclaimer {
  margin: 24px auto 0;
  max-width: 820px;
  text-align: center;
  font-size: 9px;
  line-height: 1.6;
  color: rgba(255,255,255,.35);
}

@media (max-width:1024px) and (orientation:portrait), (max-width:820px) and (orientation:landscape), (max-width:1366px) and (max-height:820px) and (orientation:landscape) and (hover:none) and (pointer:coarse) {
  :root {
    --csr-shell: min(100% - 40px,720px);
  }

  .csr-section {
    padding: 82px 0;
  }

  .csr-nav {
    display: none;
  }

  .csr-hero__title {
    width: 80%;
  }

  .csr-vision__grid,.csr-landscape__grid,.csr-maritime__grid,.csr-status__grid {
    grid-template-columns: 1fr;
    gap: 45px;
  }

  .csr-split-head {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .csr-sequence {
    grid-template-columns: repeat(5,220px);
    overflow-x: auto;
  }

  .csr-photo--vision,.csr-photo--wide,.csr-landscape .csr-photo,.csr-maritime .csr-photo {
    height: 330px;
  }

  .csr-contact__panel {
    grid-template-columns: 1fr;
  }

  .csr-contact .csr-actions {
    max-width: none;
  }

  .csr-process {
    grid-template-columns: repeat(2,1fr);
  }

  .csr-process li:nth-child(3) {
    border-left: 0;
  }

}

@media(max-width:600px) {
  :root {
    --csr-shell: calc(100% - 40px);
  }

  .csr-section {
    padding: 65px 0;
  }

  .csr-hero {
    height: 760px;
    min-height: 0;
  }

  .csr-hero__content {
    padding-top: 100px;
    align-items: flex-end;
    padding-bottom: 62px;
  }

  .csr-hero__index {
    top: 92px;
  }

  .csr-hero__title {
    width: 100%;
    padding: 0;
  }

  .csr-hero h1 {
    font-size: 51px;
  }

  .csr-hero__lead {
    font-size: 13px;
  }

  .csr-hero__coordinates {
    display: none;
  }

  .csr-heading {
    display: block;
    margin-bottom: 35px;
  }

  .csr-heading>span {
    display: none;
  }

  .csr-heading h2,.csr-split-head h2,.csr-landscape h2,.csr-status h2 {
    font-size: 39px;
  }

  .csr-vision__grid {
    gap: 35px;
  }

  .csr-photo--vision,.csr-photo--wide,.csr-landscape .csr-photo,.csr-maritime .csr-photo {
    height: 240px;
  }

  .csr-tenets {
    grid-template-columns: 1fr;
    margin-top: 40px;
  }

  .csr-sequence {
    margin: 50px 0 38px;
  }

  .csr-landscape dl {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .csr-delivery__visuals {
    grid-template-columns: 1fr;
  }

  .csr-delivery__visuals .csr-photo:first-child,.csr-delivery__visuals .csr-photo:last-child {
    height: 230px;
    margin-top: 0;
  }

  .csr-process {
    grid-template-columns: 1fr;
  }

  .csr-process li+li {
    border-left: 0;
  }

  .csr-dossier {
    padding: 30px 26px;
  }

  .csr-contact {
    padding-top: 55px;
  }

  .csr-contact__panel {
    padding: 30px 23px;
  }

  .csr-contact h2 {
    font-size: 35px;
  }

  .csr-actions {
    flex-direction: column;
  }

  .csr-button {
    width: 100%;
  }

}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior: auto;
  }

  .csr-photo img,.csr-button {
    transition: none;
  }

}

.csr-prose p,.csr-landscape__copy>p,.csr-status__copy>p {
  letter-spacing: 0;
}

.csr-sequence h3 {
  color: #e8e1d4;
}

.csr-sequence article {
  color: rgba(255,255,255,.72);
}

/* Project identity and hero */
.csr-page {
  --csr-accent: #7f8060;
}

.csr-chapter-olive {
  color: var(--csr-accent);
}

.csr-nav>.csr-shell>span {
  color: var(--csr-accent);
}

.csr-nav a.active, .csr-nav a[aria-current="location"] {
  color: var(--csr-accent);
  box-shadow: inset 0 -3px 0 var(--csr-accent);
}

.csr-hero {
  position: relative;
  min-height: 720px;
  height: min(900px,100svh);
  display: flex;
  align-items: stretch;
  overflow: hidden;
  background: #090806;
}

.csr-hero__image {
  position: absolute;
  inset: 0;
  background-position: center 48%;
  background-size: cover;
  transform: scale(1.012);
}

.csr-hero__shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,rgba(3,3,2,.88) 0%,rgba(3,3,2,.6) 38%,rgba(3,3,2,.12) 72%,rgba(3,3,2,.38)),linear-gradient(0deg,rgba(3,3,2,.78),transparent 42%);
}

.csr-hero__grain {
  position: absolute;
  inset: 0;
  opacity: .055;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E");
}

.csr-hero .reveal {
  opacity: 1!important;
  transition: none!important;
}

.csr-hero__content {
  height: 100%;
  position: relative;
  z-index: 2;
  padding: calc(var(--header-height) + 78px) 0 45px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
}

.csr-hero__index {
  position: absolute;
  left: -2px;
  right: -2px;
  top: calc(var(--header-height) + 5px);
  display: flex;
  justify-content: space-between;
  padding-top: 12px;
  border-top: 1px solid #a19167;
  color: #a19167;
  font-size: 8px;
  font-weight: 600;
  letter-spacing: .23em;
  text-transform: uppercase;
}

.csr-hero__kicker {
  position: absolute;
  left: 0;
  top: calc(var(--header-height) + 18px);
  margin: 0;
  color: #a19167;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .21em;
  text-transform: uppercase;
}

.csr-hero__title {
  width: min(620px,58vw);
  padding: 29px 0 0;
}

.csr-hero h1 {
  max-width: 10ch;
  margin: 0;
  font: 400 clamp(54px,5.3vw,78px)/.88 var(--csr-serif);
  letter-spacing: -.052em;
}

.csr-hero h1 em {
  color: var(--csr-accent);
  font-weight: 400;
}

.csr-hero__title>.csr-hero__lead {
  max-width: 555px;
  margin: 21px 0 0;
  color: rgba(255,250,244,.78);
  font-size: clamp(13px,.98vw,15px);
  font-weight: 300;
  line-height: 1.72;
  letter-spacing: 0;
}

.csr-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

.csr-hero__button {
  display: inline-flex;
  min-height: 45px;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
  padding: 0 19px;
  border: 1px solid rgba(242,234,222,.28);
  color: #fffaf4;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .15em;
  text-decoration: none;
  text-transform: uppercase;
  transition: background .3s ease,color .3s ease,border-color .3s ease,transform .3s ease;
}

.csr-hero__button:hover {
  transform: translateY(-2px);
  border-color: var(--csr-accent);
  background: rgba(127,128,96,.1);
}

.csr-hero__button--light {
  border-color: rgba(255,255,255,.38);
  background: rgba(127,128,96,.15);
  backdrop-filter: blur(16px);
}

.csr-hero__coordinates {
  position: absolute;
  right: 0;
  bottom: 123px;
  text-align: right;
  color: rgba(255,255,255,.46);
  font-size: 8px;
  line-height: 1.8;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.csr-hero__coordinates span {
  position: relative;
  left: 1px;
}

.csr-hero__facts {
  width: calc(100% + 4px);
  margin: 34px 0 0 -2px;
  display: grid;
  grid-template-columns: repeat(5,1fr);
  border: 0;
  border-top: 1px solid rgba(237,227,213,.2);
  background: rgba(7,6,5,.38);
  backdrop-filter: blur(10px);
}

.csr-hero__facts article {
  min-height: 70px;
  padding: 16px 18px;
  border-right: 1px solid rgba(237,227,213,.13);
}

.csr-hero__facts article:first-child {
  padding-left: 5px;
}

.csr-hero__facts article:last-child {
  border-right: 0;
}

.csr-hero__facts small {
  display: block;
  margin-bottom: 7px;
  color: var(--csr-accent);
  font-size: 7px;
  letter-spacing: .17em;
  text-transform: uppercase;
}

.csr-hero__facts strong {
  display: block;
  color: #f1ece2;
  font-family: var(--csr-serif);
  font-size: clamp(14px,1vw,17px);
  font-weight: 400;
  line-height: 1.12;
}

/* Decorative coordinates stay hidden throughout the one-column tablet mode. */
@media (max-width:1100px),
       (min-width:1101px) and (max-width:1366px) and (max-height:820px) and (orientation:landscape) and (hover:none) and (pointer:coarse) {
  .csr-hero__coordinates {
    display: none;
  }

}

@media(max-width:800px) {
  .csr-hero {
    height: auto;
    min-height: 760px;
  }

  .csr-hero__title {
    width: min(620px,88%);
  }

  .csr-hero__facts {
    grid-template-columns: repeat(2,1fr);
  }

}

@media(max-width:560px) {
  .csr-page .csr-hero {
    height: 100svh;
    min-height: 100svh;
  }

  .csr-page .csr-hero__content {
    padding-top: calc(var(--header-height) + 66px);
    padding-bottom: 22px;
  }

  .csr-page .csr-hero__index {
    left: -2px;
    right: -2px;
    top: var(--header-height);
    padding-top: 10px;
    font-size: 6px;
  }

  .csr-page .csr-hero__title {
    width: 100%;
    padding: 24px 0 0;
  }

  .csr-page .csr-hero__title, .csr-page .csr-hero__facts {
    transform: translateY(-105.3px)!important;
  }

  .csr-page .csr-hero__kicker {
    top: calc(var(--header-height) + 8px);
    margin: 0;
    font-size: 7px;
    line-height: 1.45;
    letter-spacing: .17em;
  }

  .csr-page .csr-hero h1 {
    font-size: clamp(42px,11.5vw,46px);
    line-height: .94;
  }

  .csr-page .csr-hero__title>.csr-hero__lead {
    max-width: 34em;
    margin-top: 17px;
    font-size: 12.5px;
    line-height: 1.58;
  }

  .csr-page .csr-hero__actions {
    display: none;
  }

  .csr-page .csr-hero__button {
    width: 100%;
  }

  .csr-page .csr-hero__facts {
    width: calc(100% + 4px);
    margin-top: 23px;
  }

  .csr-page .csr-hero__facts article {
    min-height: 65px;
    padding: 12px 10px;
  }

  .csr-page .csr-hero__facts article:nth-child(odd) {
    padding-left: 0;
  }

  .csr-page .csr-hero__facts small {
    margin-bottom: 5px;
    font-size: 6px;
    letter-spacing: .14em;
  }

  .csr-page .csr-hero__facts strong {
    font-size: 12.5px;
    line-height: 1.18;
  }

}

@media(prefers-reduced-motion:reduce) {
  .csr-hero__button {
    transition: none;
  }

}

/* Section 01 — Private coastal estate */
.csr-vision .csr-heading {
  border-bottom-color: rgba(127,128,96,.42);
}

.csr-vision .csr-heading>p, .csr-vision .csr-heading>span, .csr-vision .csr-photo figcaption span, .csr-vision .csr-tenets small {
  color: var(--csr-accent);
}

.csr-vision .csr-heading>span {
  opacity: .78;
}

.csr-vision .csr-tenets {
  border-color: rgba(20,18,15,.2);
  background: rgba(20,18,15,.2);
}

.csr-vision .csr-tenets article {
  position: relative;
  background: linear-gradient(145deg,rgba(242,239,232,.62),rgba(224,219,208,.48));
}

/* Section 01 — desktop composition */
@media (min-width:1025px) and (orientation:portrait), (min-width:821px) and (orientation:landscape) and (hover:hover) and (pointer:fine), (min-width:821px) and (max-width:1366px) and (min-height:821px) and (max-height:1024px) and (orientation:landscape) and (hover:none) and (pointer:coarse), (min-width:1367px) {
  .csr-vision {
    min-height: 990px;
  }

  .csr-vision .csr-heading {
    margin-bottom: 66px;
    padding-bottom: 34px;
  }

  .csr-vision .csr-heading>p {
    margin-bottom: 19px;
    font-size: 10px;
    letter-spacing: .27em;
  }

  .csr-vision .csr-heading h2 {
    font-size: clamp(46px,4.45vw,66px);
    line-height: .97;
  }

  .csr-vision .csr-heading>span {
    font-size: 31px;
  }

  .csr-vision__grid {
    grid-template-columns: .72fr 1.28fr;
    gap: 88px;
  }

  .csr-vision .csr-prose p {
    margin-bottom: 20px;
    font-size: 14px;
    line-height: 1.9;
  }

  .csr-vision .csr-prose .csr-lead {
    font-size: 23px;
    line-height: 1.52;
  }

  .csr-vision .csr-photo--vision {
    height: 405px;
  }

  .csr-vision .csr-photo figcaption {
    padding-top: 13px;
  }

  .csr-vision .csr-tenets {
    margin-top: 50px;
  }

  .csr-vision .csr-tenets article {
    min-height: 205px;
    padding: 34px 35px 36px;
  }

  .csr-vision .csr-tenets h3 {
    margin: 31px 0 12px;
    font-size: 29px;
  }

  .csr-vision .csr-tenets p {
    font-size: 12px;
    line-height: 1.75;
  }

}

/* Costa Serena — final mobile composition
   Project-scoped overrides; desktop rules remain untouched. */
@media(max-width:560px) {
  .csr-page .csr-section {
    padding-top: 46px;
    padding-bottom: 60px;
  }

  .csr-page .csr-section .reveal,
  .csr-page .csr-contact .reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  html[lang="en"] .csr-page .csr-hero__title,
  html[lang="en"] .csr-page .csr-hero__facts {
    transform: translateY(-105.2px) !important;
  }

  .csr-page .csr-heading,
  .csr-page .csr-split-head {
    margin-bottom: 28px;
  }

  .csr-page .csr-heading {
    padding-bottom: 20px;
  }

  .csr-page .csr-heading > p,
  .csr-page .csr-kicker {
    margin: 0 0 9px;
    font-size: 8px;
    line-height: 1.45;
    letter-spacing: .19em;
  }

  .csr-page .csr-heading h2,
  .csr-page .csr-split-head h2,
  .csr-page .csr-landscape h2,
  .csr-page .csr-status h2 {
    font-size: clamp(30px,8.4vw,33px);
    line-height: 1.02;
  }

  .csr-page .csr-prose p,
  .csr-page .csr-landscape__copy > p,
  .csr-page .csr-status__copy > p {
    margin-bottom: 14px;
    font-size: 13px;
    line-height: 1.58;
    letter-spacing: normal;
  }

  .csr-page .csr-prose .csr-lead,
  .csr-page .csr-landscape__copy .csr-lead,
  .csr-page .csr-maritime .csr-lead {
    font-size: 15.5px;
    line-height: 1.48;
  }

  .csr-page .csr-photo figcaption {
    gap: 12px;
    font-size: 7px;
    line-height: 1.45;
  }

  .csr-page .csr-vision__grid,
  .csr-page .csr-landscape__grid,
  .csr-page .csr-maritime__grid {
    gap: 26px;
  }

  .csr-page .csr-masterplan .csr-split-head,
  .csr-page .csr-delivery .csr-split-head {
    gap: 17px;
  }

  .csr-page .csr-masterplan .csr-split-head .csr-prose,
  .csr-page .csr-delivery .csr-split-head .csr-prose {
    padding-top: 0;
  }

  /* 01 — Private Coastal Estate */
  .csr-page .csr-tenets {
    margin-top: 30px;
  }

  .csr-page .csr-tenets article {
    min-height: 0;
    padding: 17px 20px 16px;
  }

  .csr-page .csr-tenets small {
    display: block;
    transform: translateY(-3px);
    font-size: 9px;
  }

  .csr-page .csr-tenets h3 {
    margin: 8px 0 5px;
    font-size: 22px;
    line-height: 1.08;
  }

  .csr-page .csr-tenets p {
    font-size: 11.5px;
    line-height: 1.5;
  }

  /* 02 — Bespoke Masterplanning */
  .csr-page .csr-sequence {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    margin: 32px 0 34px;
    padding: 0;
    overflow: visible;
    top: -15px;
  }

  .csr-page .csr-sequence__line {
    left: 7px;
    right: auto;
    top: 12px;
    bottom: 12px;
    border-top: 0;
    border-left: 1px solid rgba(127,128,96,.45);
  }

  .csr-page .csr-sequence article {
    display: grid;
    grid-template-columns: 30px 82px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    min-height: 68px;
    padding: 12px 8px 12px 25px;
    border-left: 0;
    border-bottom: 1px solid rgba(255,255,255,.1);
  }

  .csr-page .csr-sequence article:last-child {
    border-bottom: 0;
  }

  .csr-page .csr-sequence article::before {
    left: 5px;
    top: calc(50% - 3px);
  }

  .csr-page .csr-sequence i,
  .csr-page .csr-sequence span,
  .csr-page .csr-sequence h3 {
    margin: 0;
  }

  .csr-page .csr-sequence i {
    font-size: 11px;
  }

  .csr-page .csr-sequence span {
    font-size: 7px;
    line-height: 1.4;
  }

  .csr-page .csr-sequence h3 {
    font-size: 16.5px;
    line-height: 1.12;
  }

  .csr-page .csr-masterplan {
    padding-bottom: 40px;
  }

  .csr-page .csr-masterplan > .csr-shell > .csr-photo {
    display: none;
  }

  /* 03 — Space, Landscape & Privacy */
  .csr-page .csr-landscape {
    padding-top: 28px;
  }

  .csr-page .csr-landscape__copy > .csr-kicker {
    margin: 0 0 9px;
    font-size: 8px;
    line-height: 1.45;
    letter-spacing: .19em;
  }

  .csr-page .csr-landscape h2 {
    margin: 0 0 20px;
  }

  .csr-page .csr-landscape dl {
    gap: 0;
    margin-top: 24px;
    padding-top: 14px;
  }

  .csr-page .csr-landscape dl div {
    padding: 10px 0;
  }

  /* 04 — The Abrolhos Archipelago */
  .csr-page .csr-map {
    right: 0;
    width: 55%;
  }

  .csr-page .csr-maritime__grid {
    position: relative;
    top: -25px;
  }

  .csr-page .csr-coordinate-card {
    position: relative;
    top: 30px;
    margin-top: 21px;
    padding: 14px 0;
  }

  .csr-page .csr-coordinate-card strong {
    margin: 6px 0;
    font-size: 21px;
  }

  /* 05 — Project Direction */
  .csr-page .csr-delivery {
    padding-bottom: 50px;
  }

  .csr-page .csr-delivery__visuals {
    position: relative;
    top: -20px;
    margin-top: 32px;
  }

  .csr-page .csr-delivery__visuals .csr-photo:first-child {
    height: 240px;
  }

  .csr-page .csr-delivery__visuals .csr-photo:last-child {
    display: none;
  }

  .csr-page .csr-process {
    position: relative;
    top: -20px;
    margin-top: 30px;
  }

  .csr-page .csr-process li {
    min-height: 70px;
    gap: 13px;
    padding: 14px 0 10px;
  }

  .csr-page .csr-process li + li {
    padding-left: 0;
    border-top: 1px solid rgba(20,18,15,.13);
  }

  .csr-page .csr-process li > span {
    font-size: 16px;
  }

  .csr-page .csr-process strong {
    font-size: 18px;
    line-height: 1.15;
  }

  .csr-page .csr-process p {
    margin: 5px 0 0;
    font-size: 10.5px;
    line-height: 1.5;
  }

  /* 06 — Private Project Access */
  .csr-page .csr-status__grid {
    gap: 0;
  }

  .csr-page .csr-status h2 {
    margin: 9px 0 22px;
  }

  .csr-page .csr-status .csr-dossier {
    display: none;
  }

  .csr-page .csr-confidential {
    position: relative;
    top: 45px;
    margin-top: 22px;
  }

  .csr-page .csr-confidential > span {
    top: 10px;
  }

  /* Closing contact */
  .csr-page .csr-contact {
    padding-top: 52px;
    padding-bottom: 90px;
  }

  .csr-page .csr-contact__panel {
    gap: 28px;
    padding: 28px 22px 30px;
  }

  .csr-page .csr-contact__panel > div > p {
    margin: 0;
    font-size: 8px;
    line-height: 1.45;
    letter-spacing: .19em;
  }

  .csr-page .csr-contact h2 {
    margin: 11px 0 14px;
    font-size: clamp(28px,7.8vw,31px);
    line-height: 1.02;
  }

  .csr-page .csr-contact__panel > div > span {
    font-size: 9px;
    line-height: 1.5;
  }

  .csr-page .csr-contact .csr-actions {
    gap: 8px;
  }

  .csr-page .csr-contact .csr-button {
    min-height: 46px;
    height: 46px;
  }

  .csr-page .csr-disclaimer {
    margin-top: 20px;
    font-size: 8px;
  }
}

/* Section 02 — Bespoke masterplanning */
.csr-masterplan .csr-kicker, .csr-masterplan .csr-sequence i, .csr-masterplan .csr-photo figcaption span {
  color: var(--csr-accent);
}

.csr-masterplan .csr-sequence__line {
  border-top-color: rgba(127,128,96,.45);
}

.csr-masterplan .csr-sequence article::before {
  background: var(--csr-accent);
}

@media (min-width:1025px) and (orientation:portrait), (min-width:821px) and (orientation:landscape) and (hover:hover) and (pointer:fine), (min-width:821px) and (max-width:1366px) and (min-height:821px) and (max-height:1024px) and (orientation:landscape) and (hover:none) and (pointer:coarse), (min-width:1367px) {
  .csr-masterplan {
    min-height: 1200px;
  }

  .csr-masterplan>.csr-shell {
    display: grid;
    grid-template-columns: minmax(430px,1fr) minmax(0,1fr);
    column-gap: 70px;
    align-items: start;
  }

  .csr-masterplan .csr-split-head {
    grid-column: 1/-1;
  }

  .csr-masterplan .csr-split-head .csr-prose {
    padding-top: 40px;
  }

  .csr-masterplan .csr-split-head .csr-prose p {
    font-size: 14px;
    line-height: 1.9;
  }

  .csr-masterplan .csr-photo--wide {
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    max-width: none;
    height: 650px;
    margin: 52px 0 0;
  }

  .csr-masterplan .csr-sequence {
    grid-column: 2;
    grid-row: 2;
    display: grid;
    grid-template-columns: 1fr;
    margin: 52px 0 0 55px;
    padding: 0;
  }

  .csr-masterplan .csr-sequence__line {
    left: 4px;
    right: auto;
    top: 0;
    bottom: 0;
    border-top: 0;
    border-left: 1px solid rgba(127,128,96,.45);
  }

  .csr-masterplan .csr-sequence article {
    min-height: 112px;
    display: grid;
    grid-template-columns: 44px 128px minmax(0,1fr);
    align-items: center;
    gap: 18px;
    padding: 22px 20px 22px 34px;
    border-left: 0;
    border-bottom: 1px solid rgba(255,255,255,.1);
  }

  .csr-masterplan .csr-sequence article:last-child {
    border-bottom: 0;
  }

  .csr-masterplan .csr-sequence article::before {
    left: 2px;
    top: calc(50% - 3px);
  }

  .csr-masterplan .csr-sequence span {
    margin: 0;
  }

  .csr-masterplan .csr-sequence h3 {
    margin: 0;
  }

}

/* Shared desktop rhythm; section 06 and contact remain individual. */
@media (min-width:1025px) and (orientation:portrait), (min-width:821px) and (orientation:landscape) and (hover:hover) and (pointer:fine), (min-width:821px) and (max-width:1366px) and (min-height:821px) and (max-height:1024px) and (orientation:landscape) and (hover:none) and (pointer:coarse), (min-width:1367px) {
  .csr-vision, .csr-masterplan, .csr-landscape, .csr-maritime, .csr-delivery {
    padding-top: 95px;
    padding-bottom: 175px;
  }

}

/* Section 03 — Space, landscape and privacy */
.csr-landscape .csr-kicker, .csr-landscape dt, .csr-landscape .csr-photo figcaption span {
  color: var(--csr-accent);
}

.csr-landscape dl {
  border-top-color: rgba(127,128,96,.42);
}

@media (min-width:1025px) and (orientation:portrait), (min-width:821px) and (orientation:landscape) and (hover:hover) and (pointer:fine), (min-width:821px) and (max-width:1366px) and (min-height:821px) and (max-height:1024px) and (orientation:landscape) and (hover:none) and (pointer:coarse), (min-width:1367px) {
  .csr-landscape .csr-photo {
    height: 490px;
  }

}

/* Section 05 — Project direction */
.csr-delivery .csr-kicker, .csr-delivery .csr-photo figcaption span, .csr-delivery .csr-process li>span {
  color: var(--csr-accent);
}

.csr-delivery .csr-process {
  border-top-color: rgba(127,128,96,.42);
}

.csr-delivery .csr-process li+li {
  border-left-color: rgba(127,128,96,.24);
}

.csr-delivery .csr-split-head .csr-prose p {
  color: var(--csr-accent);
}

@media (min-width:1025px) and (orientation:portrait), (min-width:821px) and (orientation:landscape) and (hover:hover) and (pointer:fine), (min-width:821px) and (max-width:1366px) and (min-height:821px) and (max-height:1024px) and (orientation:landscape) and (hover:none) and (pointer:coarse), (min-width:1367px) {
  .csr-delivery .csr-split-head .csr-prose {
    padding-top: 43px;
  }

  .csr-delivery .csr-split-head .csr-prose p {
    font-size: 14px;
    line-height: 1.9;
  }

}

/* Section 06 and closing contact — desktop composition */
@media (min-width:1025px) and (orientation:portrait), (min-width:821px) and (orientation:landscape) and (hover:hover) and (pointer:fine), (min-width:821px) and (max-width:1366px) and (min-height:821px) and (max-height:1024px) and (orientation:landscape) and (hover:none) and (pointer:coarse), (min-width:1367px) {
  .csr-contact h2 {
    transform: translateY(-40px);
  }

  .csr-contact__panel>div>p {
    transform: translateY(-30px);
  }

  .csr-status {
    padding-top: 145px;
    padding-bottom: 185px;
  }

  .csr-status__copy {
    position: relative;
    top: -100px;
  }

  .csr-status__copy>p {
    font-size: 14px;
  }

  .csr-status .csr-confidential {
    position: relative;
    top: 315px;
  }

  .csr-status .csr-dossier {
    top: 60px;
  }

}