@font-face {
  font-family:Caslon;
  src:url('assets/fonts/LibreCaslonDisplay-Regular.ttf') format('truetype');
  font-weight:400;
  font-display:swap
}
@font-face {
  font-family:Manrope;
  src:url('assets/fonts/Manrope.ttf') format('truetype');
  font-weight:200 800;
  font-display:swap
}
:root {
  --ivory:#f5f2eb;
  --ink:#28352c;
  --body:#454943;
  --gold:#b38b48;
  --gold-dark:#937036;
  --serif:'Times New Roman',Caslon,Baskerville,Georgia,serif;
  --sans:Manrope,'Avenir Next',Arial,sans-serif;
  --page-inset:9.1vw;
  --header-inset:clamp(24px,4vw,64px);
  color-scheme:light
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:30px;
  /* Keep the page width unchanged when a dialog locks background scrolling. */
  scrollbar-gutter:stable
}
body {
  margin:0;
  background:var(--ivory);
  color:var(--ink);
  font-family:var(--sans);
  font-size:clamp(14px,1.38vw,20px);
  line-height:1.6;
  -webkit-font-smoothing:antialiased
}
body.dialog-open {
  overflow:hidden
}
button,input {
  font:inherit
}
button,a {
  -webkit-tap-highlight-color:transparent
}
button {
  cursor:pointer
}
a {
  color:inherit;
  text-decoration:none
}
button {
  color:inherit
}
img {
  display:block;
  max-width:100%
}
button:focus-visible,a:focus-visible {
  outline:3px solid var(--gold-dark);
  outline-offset:5px
}
button:disabled {
  cursor:default
}
h1,h2,h3,p,figure {
  margin:0
}
h1,h2,h3 {
  font-family:var(--serif);
  font-weight:400
}
h1 {
  font-size:clamp(62px,7.35vw,116px);
  line-height:.95;
  letter-spacing:-.035em
}
h2 {
  font-size:clamp(38px,4.8vw,74px);
  line-height:1.05;
  letter-spacing:-.028em
}
h3 {
  font-size:clamp(22px,1.85vw,29px);
  line-height:1.2
}
.eyebrow {
  font-family:var(--sans);
  font-size:clamp(10px,.87vw,13px);
  line-height:1.8;
  font-weight:600;
  letter-spacing:.25em;
  text-transform:uppercase
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:48px;
  border:0;
  border-radius:9px;
  padding:12px 23px;
  font-family:var(--sans);
  font-size:clamp(12px,1.15vw,17px);
  font-weight:600;
  line-height:1.4;
  transition:background .2s,transform .2s,box-shadow .2s;
  white-space:nowrap
}
.button img {
  width:16px;
  height:16px
}
.button-gold {
  background:var(--gold);
  color:#fffdf7;
  box-shadow:0 5px 15px #96702e20
}
.button-gold img {
  filter:invert(1)
}
.button-gold:hover {
  background:var(--gold-dark);
  transform:translateY(-2px);
  box-shadow:0 7px 20px #96702e30
}
.text-link {
  background:none;
  border:0;
  border-bottom:1px solid #6e756b8c;
  padding:5px 0;
  color:var(--ink);
  font-size:clamp(11px,1.04vw,16px);
  line-height:1.5;
  white-space:nowrap
}
.text-link:hover {
  border-color:var(--gold-dark);
  color:#715323
}
.skip-link {
  position:fixed;
  top:15px;
  left:15px;
  z-index:100;
  padding:12px 20px;
  background:var(--ivory);
  transform:translateY(-180%)
}
.skip-link:focus {
  transform:none
}
.site-header {
  position:absolute;
  left:0;
  top:0;
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  padding:1.35vw var(--header-inset)
}
.brand {
  position:relative;
  z-index:5;
  mix-blend-mode:multiply;
  display:flex;
  flex-direction:column;
  align-items:center;
  width:clamp(148px,15.6vw,230px);
  line-height:1;
  flex-shrink:0
}
.brand-emblem {
  position:relative;
  display:block;
  width:100%;
  height:2.6vw;
  min-height:24px;
  max-height:40px;
  overflow:hidden;
  mix-blend-mode:multiply
}
.brand-emblem img {
  position:absolute;
  left:0;
  top:50%;
  width:100%;
  height:auto;
  transform:translateY(-47%)
}
.brand-name {
  font-family:var(--serif);
  font-size:clamp(22px,2.14vw,33px);
  letter-spacing:.045em;
  text-transform:uppercase
}
.brand-place {
  font-size:clamp(7px,.61vw,10px);
  font-weight:600;
  letter-spacing:.35em;
  text-transform:uppercase;
  margin-top:8px
}
.main-nav,.footer-nav {
  display:flex;
  align-items:center;
  gap:clamp(22px,2.9vw,46px)
}
.main-nav {
  position:relative;
  z-index:6;
  padding-top:1.1vw
}
.main-nav a,.main-nav button {
  font-size:clamp(12px,1.09vw,17px)
}
.main-nav button,.footer-nav button,.footer-legal button {
  padding:0;
  border:0;
  background:none;
  font-family:inherit
}
.main-nav a,.main-nav button,.footer-nav a,.footer-nav button {
  white-space:nowrap
}
.main-nav a:hover,.main-nav button:hover {
  color:var(--gold-dark)
}
.menu-toggle {
  position:relative;
  z-index:7;
  display:none
}
.hero {
  position:relative;
  width:100%;
  height:67.1vw;
  max-height:1120px;
  min-height:620px;
  isolation:isolate;
  overflow:hidden
}
.hero-image {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  z-index:-2
}
.hero::after {
  content:'';
  position:absolute;
  bottom:-1px;
  left:0;
  right:0;
  height:10.5%;
  background:linear-gradient(to bottom,transparent,var(--ivory) 93%);
  z-index:-1;
  pointer-events:none
}
.hero-copy {
  position:absolute;
  left:var(--header-inset);
  right:var(--header-inset);
  top:calc(var(--site-header-height,110px) + clamp(28px,2.2vw,48px))
}
.hero h1 {
  font-size:clamp(42px,5.6vw,90px)
}
.hero-actions {
  display:flex;
  gap:2.65vw;
  align-items:center;
  margin-top:1.8vw
}
.hero-actions .text-link {
  padding:10px 15px;
  border:1px solid var(--gold);
  border-radius:8px;
  background:rgb(245 242 235 / 45%);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px)
}
.hero .image-caption {
  bottom:5.5%;
  right:4.4%;
  font-size:clamp(9px,.83vw,13px)
}
.image-caption {
  position:absolute;
  right:4.4%;
  bottom:4%;
  font-size:clamp(9px,.83vw,13px);
  line-height:1.4;
  color:#fffdf1;
  text-shadow:0 1px 4px #0009
}
.section-inner {
  width:100%;
  padding-left:var(--page-inset);
  padding-right:var(--page-inset)
}
.introduction {
  display:grid;
  grid-template-columns:1fr auto;
  gap:5vw;
  align-items:center;
  padding-top:3vw;
  padding-bottom:3.8vw;
  min-height:22.6vw
}
.gold-edge {
  position:relative;
  padding-left:2.3vw
}
.gold-edge::before {
  content:'';
  position:absolute;
  left:0;
  top:-.9vw;
  width:1px;
  height:7vw;
  max-height:105px;
  background:var(--gold)
}
.introduction h2 {
  margin-top:1.1vw;
  margin-bottom:1.4vw
}
.introduction-description {
  font-size:clamp(12px,1.35vw,20px);
  color:var(--body);
  line-height:1.6
}
.project-facts {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 2vw;
  padding:1.4vw 0 0;
  margin:1.7vw 0 0;
  border-top:1px solid #b38b4838;
  list-style:none;
  color:var(--body);
  font-size:clamp(10px,1.05vw,16px);
  line-height:1.6;
}
.project-facts li {
  white-space:nowrap;
}
.project-facts strong {
  color:#89672e;
  font-weight:650;
  margin-right:3px;
}
.quiet-words {
  padding:1.9vw 0 1.9vw 2.3vw;
  border-left:1px solid var(--gold);
  font-size:clamp(9px,.84vw,13px);
  font-weight:600;
  line-height:2.3;
  letter-spacing:.3em;
  text-transform:uppercase;
  min-width:14vw
}
.aerial-section {
  position:relative;
  width:min(1440px,calc(100% - 2 * clamp(20px,4vw,64px)));
  margin-inline:auto;
  border-radius:24px;
  aspect-ratio:1.905;
  background:#667055;
  isolation:isolate;
  overflow:hidden
}
.aerial-image {
  position:absolute;
  inset:0;
  z-index:-2;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  transform:scale(1.3)
}
.aerial-section::before {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,#17211532,transparent 34%);
  pointer-events:none
}
.aerial-heading {
  position:absolute;
  left:clamp(24px,3vw,44px);
  top:13%;
  color:#fffdf5
}
.aerial-heading h2 {
  font-size:clamp(40px,5.45vw,84px);
  line-height:.98
}
.aerial-heading .eyebrow {
  margin-top:2.1vw;
  letter-spacing:.27em;
  line-height:1.85
}
.glass-card {
  position:absolute;
  right:4%;
  top:10.6%;
  width:20.8%;
  min-width:230px;
  padding:2.25vw;
  border:1px solid #ffffffc9;
  border-radius:15px;
  background:rgb(250 248 240 / 65%);
  box-shadow:0 8px 40px #202b2115;
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px)
}
.glass-card h3 {
  font-size:clamp(20px,1.82vw,28px);
  white-space:normal;
  letter-spacing:-.015em
}
.glass-card p {
  margin:1vw 0 1.6vw;
  font-size:clamp(13px,1.3vw,19px);
  line-height:1.55;
  color:var(--body)
}
.glass-card .button {
  font-size:clamp(12px,1.02vw,16px);
  min-height:43px;
  padding:11px 18px;
  border-radius:8px
}
.life-section {
  display:grid;
  grid-template-columns:59.8% 1fr;
  gap:0;
  padding-top:3.8vw
}
.life-photo {
  --photo-inset:clamp(12px,1vw,20px);
  margin-left:var(--photo-inset);
  width:calc(100% - var(--photo-inset));
  position:relative;
  aspect-ratio:1.52;
  overflow:hidden
}
.life-photo>img {
  width:100%;
  height:100%;
  object-fit:cover
}
.life-photo .image-caption {
  left:3.5%;
  right:auto;
  bottom:4.8%
}
.life-copy {
  padding:1.8vw 4vw 1.8vw
}
.line-before {
  position:relative;
  padding-left:5.5vw
}
.line-before::before {
  content:'';
  position:absolute;
  left:0;
  top:.8em;
  width:2.1vw;
  height:1px;
  background:var(--gold)
}
.life-copy h2 {
  margin:1.7vw 0 1.9vw;
  font-size:clamp(35px,4.48vw,69px);
  line-height:1.05
}
.life-copy>p:not(.eyebrow) {
  font-size:clamp(12px,1.32vw,20px);
  line-height:1.65;
  color:var(--body)
}
.life-signoff {
  margin-top:4.3vw;
  font-size:clamp(9px,.87vw,13px);
  line-height:1.9;
  letter-spacing:.27em
}
.contact-section {
  position:relative;
  overflow:hidden;
  padding-top:6.7vw;
  padding-bottom:6.4vw
}
.contact-inner {
  display:grid;
  grid-template-columns:1.45fr 1fr;
  gap:3vw;
  position:relative;
  z-index:1
}
.contact-title h2 {
  margin-top:1.6vw;
  font-size:clamp(38px,4.9vw,76px);
  line-height:1.08
}
.contact-copy {
  padding-top:2.2vw;
  max-width:34vw
}
.contact-copy p {
  font-size:clamp(13px,1.34vw,20px);
  color:var(--body);
  line-height:1.65;
  margin-bottom:2vw
}
.contact-reeds {
  position:absolute;
  right:-1.7vw;
  bottom:-2.5vw;
  width:18vw;
  height:31vw;
  object-fit:cover;
  object-position:bottom right;
  mix-blend-mode:multiply;
  opacity:.75;
  pointer-events:none
}
.site-footer {
  padding:3.2vw 6.7vw max(90px,4.5vw);
  background:#2d382e;
  color:#f3f1e6
}
.footer-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:4vw;
  padding-bottom:3vw
}
.brand-light .brand-emblem {
  mix-blend-mode:screen;
  filter:invert(1) sepia(1) saturate(1.6)
}
.brand-light .brand-name {
  font-size:clamp(23px,2.15vw,34px)
}
.brand-light {
  mix-blend-mode:screen;
  width:15.7vw;
  min-width:165px
}
.footer-nav {
  gap:2.4vw;
  font-size:clamp(10px,.91vw,14px)
}
.footer-nav button {
  text-align:left
}
.footer-nav a:hover,.footer-nav button:hover {
  color:#e0c083
}
.footer-motto {
  border-left:1px solid var(--gold);
  padding:1.2vw 0 1.2vw 2.5vw;
  font-size:clamp(9px,.8vw,12px);
  letter-spacing:.27em;
  text-transform:uppercase;
  line-height:2.25;
  white-space:nowrap
}
.footer-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid #e4d8b553;
  padding-top:2vw;
  font-size:clamp(9px,.84vw,13px);
  color:#d2d7cb
}
.footer-legal {
  display:flex;
  gap:2.2vw
}
.footer-legal button:hover {
  color:#fff
}
.footer-bottom p span {
  margin:0 1.1vw
}
.footer-credits { text-align:right }
.production-credit { margin-top:6px }
.production-credit a { text-decoration:underline; text-underline-offset:3px }
.production-credit a:hover { color:#fff }
.site-dialog {
  width:min(800px,calc(100% - 32px));
  max-height:90dvh;
  margin:auto;
  padding:42px;
  border:1px solid #fff;
  border-radius:18px;
  background:var(--ivory);
  color:var(--ink);
  box-shadow:0 25px 120px #1118;
  overflow:auto;
  font-size:16px
}
.site-dialog::backdrop {
  background:#19231ad4;
  backdrop-filter:blur(7px)
}
.site-dialog h2 {
  font-size:46px;
  line-height:1.05;
  margin-bottom:24px;
  padding-right:24px
}
.site-dialog>.eyebrow {
  margin-bottom:15px
}
.site-dialog p+p {
  margin-top:15px
}
.site-dialog .small-note,.film-note {
  font-size:13px;
  line-height:1.6;
  color:#64685e;
  margin:18px 0
}
.site-dialog>.button {
  margin-top:24px
}
.close-dialog {
  position:absolute;
  right:18px;
  top:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#e8e3d6;
  border:0;
  border-radius:50%;
  width:42px;
  height:42px
}
.dialog-top {
  display:flex;
  align-items:flex-start;
  justify-content:space-between
}
.dialog-top .eyebrow {
  margin-bottom:8px
}
.dialog-aerial {
  width:100%;
  margin-bottom:24px;
  border-radius:7px
}
.film-dialog {
  width:min(1160px,calc(100% - 32px));
  padding:32px
}
.film-dialog video {
  display:block;
  width:100%;
  aspect-ratio:16/9;
  background:#172017;
  max-height:64dvh
}
.film-dialog .close-dialog {
  position:static;
  flex-shrink:0
}
.film-dialog h2 {
  font-size:42px
}
.film-error {
  padding:16px;
  background:#eae0ce
}
.film-dialog>.text-link {
  font-size:14px
}
@media(min-width:1700px) {
  :root {
    --page-inset:max(9.1vw,calc((100vw - 1450px)/2))
  }
  .hero {
    max-height:1120px
  }
  .introduction {
    min-height:340px
  }
  .aerial-section {
    max-height:880px
  }
  .life-section {
    max-width:1900px;
    margin-inline:auto
  }
  .contact-inner {
    max-width:1900px;
    margin-inline:auto
  }
}
@media(max-width:1000px) and (min-width:701px) {
  body {
    font-size:14px
  }
  .hero {
    min-height:0
  }
  .button {
    min-height:34px;
    padding:9px 17px;
    border-radius:7px;
    font-size:11px;
    gap:7px
  }
  .button img {
    width:13px;
    height:13px
  }
  .brand {
    min-width:0;
    width:16.6vw
  }
  .brand-name {
    font-size:2.2vw
  }
  .brand-emblem {
    min-height:0;
    height:2.8vw
  }
  .brand-place {
    font-size:7px;
    margin-top:5px
  }
  .main-nav {
    gap:3.1vw
  }
  .main-nav a,.main-nav button {
    font-size:11px
  }
  h1 {
    font-size:7.35vw
  }
  .glass-card {
    min-width:0;
    width:20.8%;
    border-radius:11px
  }
  .glass-card h3 {
    font-size:1.82vw
  }
  .glass-card p {
    font-size:1.3vw
  }
  .glass-card .button {
    font-size:10px;
    min-height:29px;
    padding:8px 10px
  }
  .introduction-description {
    font-size:1.35vw
  }
  .introduction h2 {
    font-size:4.8vw
  }
  .life-copy h2 {
    font-size:4.48vw
  }
  .life-copy>p:not(.eyebrow),.contact-copy p {
    font-size:1.34vw
  }
  .contact-title h2 {
    font-size:4.9vw
  }
  .eyebrow,.quiet-words,.life-signoff {
    font-size:.87vw
  }
  .hero-actions .text-link {
    font-size:1.05vw
  }
  .footer-nav {
    font-size:1.03vw
  }
  .brand-light {
    min-width:0
  }
  .brand-light .brand-name {
    font-size:2.15vw
  }
  .footer-motto {
    font-size:.8vw
  }
  .footer-bottom {
    font-size:.9vw
  }
  .image-caption {
    font-size:.84vw
  }
}
@media(max-width:700px) {
  :root {
    --page-inset:7vw;
    --header-inset:7vw
  }
  body {
    font-size:15px
  }
  .site-header {
    mix-blend-mode:normal;
    padding:18px var(--header-inset);
    align-items:flex-start
  }
  .brand {
    width:157px
  }
  .brand-name {
    font-size:23px
  }
  .brand-emblem {
    height:26px
  }
  .brand-place {
    font-size:7px;
    margin-top:5px
  }
  .menu-toggle {
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid #ffffffb5;
    background:#f8f5eecc;
    backdrop-filter:blur(16px);
    border-radius:8px;
    width:42px;
    height:42px;
    margin-top:7px
  }
  .main-nav {
    display:none;
    position:absolute;
    top:87px;
    right:7vw;
    left:7vw;
    padding:20px 24px;
    align-items:stretch;
    gap:0;
    flex-direction:column;
    border:1px solid #fff8;
    background:#f8f5eef7;
    box-shadow:0 10px 35px #1b2e251a;
    backdrop-filter:blur(20px);
    border-radius:12px
  }
  .main-nav.is-open {
    display:flex
  }
  .main-nav a,.main-nav button {
    font-size:15px;
    text-align:left;
    padding:10px 0
  }
  .hero {
    height:780px;
    min-height:0;
    max-height:1000px;
    height:max(690px,95svh)
  }
  .hero-image {
    object-position:left center
  }
  .hero-copy {
    left:var(--header-inset);
    right:var(--header-inset)
  }
  .hero h1 {
    font-size:clamp(40px,10vw,62px);
    line-height:1.02;
    letter-spacing:-.025em
  }
  .hero-actions {
    margin-top:24px;
    align-items:flex-start;
    gap:18px;
    flex-direction:column
  }
  .button {
    min-height:46px;
    font-size:13px;
    padding:13px 19px
  }
  .hero-actions .text-link {
    font-size:12px
  }
  .hero .image-caption {
    bottom:6%;
    right:7vw;
    font-size:9px
  }
  .hero::after {
    height:10%
  }
  .introduction {
    display:block;
    min-height:0;
    padding-top:34px;
    padding-bottom:42px
  }
  .gold-edge {
    padding-left:21px
  }
  .gold-edge::before {
    height:80px;
    top:-6px
  }
  .eyebrow {
    font-size:9px;
    letter-spacing:.22em
  }
  .introduction h2 {
    font-size:40px;
    line-height:1.08;
    margin:16px 0 20px
  }
  .introduction-description {
    font-size:14px;
    line-height:1.75
  }
  .desktop-break {
    display:none
  }
  .quiet-words {
    display:none
  }
  .project-facts {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:23px;
    padding-top:18px;
    font-size:clamp(9px,2.6vw,11px);
    line-height:1.5;
  }
  .project-facts li {
    white-space:normal;
  }
  .project-facts strong {
    display:block;
    margin:0 0 5px;
    font-family:var(--serif);
    font-size:27px;
    font-weight:400;
    line-height:1.1;
  }
  .aerial-section {
    aspect-ratio:auto;
    height:640px
  }
  .aerial-image {
    transform:none;
    height:360px;
    object-fit:cover;
    object-position:center center
  }
  .aerial-section {
    background:#eae6db
  }
  .aerial-section::before {
    height:360px;
    background:linear-gradient(#1e2a242f,transparent 50%)
  }
  .aerial-heading {
    top:25px;
    left:clamp(24px,3vw,44px)
  }
  .aerial-heading h2 {
    font-size:42px
  }
  .aerial-heading .eyebrow {
    font-size:8px;
    line-height:1.7;
    margin-top:15px;
    max-width:120px
  }
  .glass-card {
    left:7vw;
    right:7vw;
    top:385px;
    width:auto;
    min-width:0;
    padding:26px;
    border-radius:12px;
    background:rgb(250 248 240 / 65%)
  }
  .glass-card h3 {
    font-size:27px
  }
  .glass-card p {
    font-size:14px;
    line-height:1.55;
    margin:12px 0 18px
  }
  .glass-card p br {
    display:none
  }
  .glass-card .button {
    min-height:44px;
    font-size:13px;
    padding:12px 19px
  }
  .aerial-section>.image-caption {
    top:332px;
    bottom:auto;
    right:7vw;
    font-size:8px
  }
  .life-section {
    display:flex;
    flex-direction:column;
    padding-top:32px
  }
  .life-photo {
    width:calc(100% - var(--photo-inset));
    aspect-ratio:1.25
  }
  .life-photo .image-caption {
    font-size:8px;
    left:7vw;
    bottom:5%
  }
  .life-copy {
    padding:32px 7vw 8px
  }
  .line-before {
    padding-left:48px
  }
  .line-before::before {
    width:28px
  }
  .life-copy h2 {
    font-size:45px;
    line-height:1.03;
    margin:20px 0 22px
  }
  .life-copy>p:not(.eyebrow) {
    font-size:14px;
    line-height:1.8;
    max-width:450px
  }
  .life-signoff {
    margin-top:28px;
    font-size:9px;
    line-height:2
  }
  .contact-section {
    padding-top:60px;
    padding-bottom:52px
  }
  .contact-inner {
    display:block
  }
  .contact-title h2 {
    font-size:39px;
    margin-top:18px;
    line-height:1.1
  }
  .contact-copy {
    padding:25px 0 0 21px;
    max-width:430px
  }
  .contact-copy p {
    font-size:14px;
    line-height:1.8;
    margin-bottom:23px
  }
  .contact-reeds {
    width:150px;
    height:310px;
    right:-25px;
    bottom:-23px;
    opacity:.55
  }
  .site-footer {
    padding:34px 7vw 90px
  }
  .footer-top {
    align-items:flex-start;
    gap:27px;
    flex-wrap:wrap;
    padding-bottom:28px
  }
  .brand-light {
    width:165px;
    min-width:0
  }
  .brand-light .brand-name {
    font-size:24px
  }
  .footer-nav {
    width:100%;
    order:2;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
    font-size:12px
  }
  .footer-motto {
    font-size:8px;
    letter-spacing:.17em;
    line-height:2.2;
    padding:10px 0 10px 15px;
    max-width:143px;
    white-space:normal;
    margin-top:10px
  }
  .footer-bottom {
    flex-direction:column;
    align-items:flex-start;
    gap:18px;
    padding-top:23px;
    font-size:10px
  }
  .footer-legal {
    gap:18px;
    flex-wrap:wrap
  }
  .footer-bottom p span {
    margin:0 7px
  }
  .footer-credits { text-align:left }
  .site-dialog {
    padding:32px 24px;
    border-radius:14px
  }
  .site-dialog h2 {
    font-size:36px;
    line-height:1.1;
    padding-right:30px
  }
  .site-dialog .button {
    white-space:normal;
    text-align:left
  }
  .film-dialog {
    padding:18px
  }
  .film-dialog h2 {
    font-size:32px
  }
  .film-dialog .eyebrow {
    font-size:8px
  }
  .close-dialog {
    width:36px;
    height:36px;
    right:12px;
    top:12px
  }
  .film-note {
    font-size:11px
  }
}
/* One shared duration keeps the two photo layers and the page palette in step. */
:root {
  --theme-duration:2200ms;
  --theme-easing:cubic-bezier(.4,0,.2,1)
}
:root[data-theme="night"] {
  --ivory:#0c1829;
  --ink:#e8e9df;
  --body:#bfcbd4;
  --gold:#b99559;
  --gold-dark:#d0af75;
  color-scheme:dark
}
:where(body,header,footer,section,div,p,h1,h2,h3,a,button,span,dialog) {
  transition:color var(--theme-duration) var(--theme-easing),background-color var(--theme-duration) var(--theme-easing),border-color var(--theme-duration) var(--theme-easing)
}
.button {
  transition:background-color var(--theme-duration) var(--theme-easing),color var(--theme-duration) var(--theme-easing),transform .2s,box-shadow .2s
}
.hero-image:not(.hero-image--night) {
  z-index:-3
}
.hero-video {
  opacity:0;
  pointer-events:none;
  transition:opacity .6s ease
}
.hero-video.is-playing { opacity:1 }
.night-photo {
  opacity:0;
  pointer-events:none;
  transition:opacity var(--theme-duration) var(--theme-easing)
}
.hero-image--night {
  z-index:-2
}
.life-photo>.life-photo-night {
  position:absolute;
  inset:0
}
[data-theme="night"] .night-photo {
  opacity:1
}
.hero::after {
  background:linear-gradient(to bottom,transparent,#f5f2eb 93%);
  transition:opacity var(--theme-duration) var(--theme-easing)
}
.hero::before {
  content:'';
  position:absolute;
  bottom:-1px;
  left:0;
  right:0;
  height:10.5%;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(to bottom,transparent,#0c1829 93%);
  opacity:0;
  transition:opacity var(--theme-duration) var(--theme-easing)
}
[data-theme="night"] .hero::after { opacity:0 }
[data-theme="night"] .hero::before { opacity:1 }
.header-brand-stack { display:grid }
.header-brand-stack:has(>.brand:focus-visible) {
  outline:3px solid var(--gold-dark);
  outline-offset:5px
}
.header-brand-stack>.brand {
  grid-area:1/1;
  transition:opacity var(--theme-duration) var(--theme-easing)
}
.header-brand-night {
  pointer-events:none;
  opacity:0;
  mix-blend-mode:screen;
  color:#e8e9df
}
.header-brand-night .brand-emblem {
  mix-blend-mode:screen;
  filter:invert(1) sepia(1) saturate(1.6)
}
.header-brand-stack>.brand:not(.header-brand-night) { color:#28352c }
[data-theme="night"] .header-brand-night { opacity:1 }
[data-theme="night"] .header-brand-stack>.brand:not(.header-brand-night) { opacity:0 }
.theme-toggle {
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:25;
  display:flex;
  align-items:center;
  gap:9px;
  min-height:46px;
  padding:9px 18px;
  border:1px solid #b38b4877;
  border-radius:30px;
  color:var(--ink);
  background:#f5f2ebee;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:0 3px 22px #0002;
  font-size:13px
}
.theme-toggle-symbol { font-size:23px; line-height:1 }
.theme-toggle:disabled { cursor:progress; opacity:.75 }
.theme-status {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap
}
[data-theme="night"] .theme-toggle,
[data-theme="night"] .hero-actions .text-link {
  background:rgb(18 35 57 / 60%);
  border-color:#c5d5df55
}
[data-theme="night"] .hero-actions .text-link {
  background:rgb(18 35 57 / 40%);
  border-color:var(--gold)
}
[data-theme="night"] .button-gold {
  background:rgb(185 149 89 / 60%);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px)
}
[data-theme="night"] .button-gold:hover {
  background:rgb(208 175 117 / 60%)
}
[data-theme="night"] .main-nav a:hover,
[data-theme="night"] .main-nav button:hover,
[data-theme="night"] .text-link:hover { color:#e0bf84 }
[data-theme="night"] .project-facts strong { color:#d6b87f }
[data-theme="night"] .site-footer { background:#08121f }
[data-theme="night"] .footer-bottom { color:#bfcbd4 }
[data-theme="night"] .site-dialog { border-color:#aabfce44 }
[data-theme="night"] .site-dialog .small-note,
[data-theme="night"] .film-note { color:#a7b7c6 }
[data-theme="night"] .close-dialog { background:rgb(41 60 80 / 60%) }
[data-theme="night"] .close-dialog img,
[data-theme="night"] .menu-toggle img { filter:invert(1) }
.contact-reeds {
  transition:opacity var(--theme-duration) var(--theme-easing)
}
[data-theme="night"] .contact-reeds { opacity:.12 }
[data-theme="night"] .glass-card {
  background:rgb(18 35 57 / 65%);
  border-color:#c5d5df55
}
@media(max-width:700px) {
  .hero::before { height:10% }
  .theme-toggle { right:16px; bottom:max(16px,env(safe-area-inset-bottom)); padding:9px 15px }
  [data-theme="night"] .main-nav,
  [data-theme="night"] .menu-toggle { background:#122339ee; border-color:#c5d5df55 }
  [data-theme="night"] .menu-toggle { background:rgb(18 35 57 / 60%) }
}
[hidden] { display:none!important }
body.arrival-open { overflow:hidden }
.arrival-dialog {
  position:fixed;
  inset:0;
  width:100vw;
  height:100dvh;
  max-width:none;
  max-height:none;
  padding:0;
  margin:0;
  border:0;
  overflow:hidden;
  background:transparent;
  color:var(--ink)
}
.arrival-dialog::backdrop {
  background:rgb(255 255 255 / 28%);
  backdrop-filter:blur(1px);
  -webkit-backdrop-filter:blur(1px);
  transition:background-color 1800ms cubic-bezier(.22,.68,.18,1), backdrop-filter 1800ms
}
.arrival-dialog.is-docking::backdrop { background:transparent; backdrop-filter:blur(0); -webkit-backdrop-filter:blur(0) }
.arrival-dialog {
  --arrival-inset:clamp(20px,4vmin,56px);
  --ink:#28352c;
  --body:#454943
}
.arrival-welcome {
  position:absolute;
  inset:var(--arrival-inset);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:clamp(24px,5vw,80px);
  text-align:center;
  background:linear-gradient(135deg,rgb(255 255 255 / 76%),rgb(245 242 235 / 56%));
  border:12px solid rgb(255 255 255 / 18%);
  background-clip:padding-box;
  outline:1px solid #ffffffb0;
  border-radius:24px;
  backdrop-filter:blur(30px) saturate(.7);
  -webkit-backdrop-filter:blur(30px) saturate(.7);
  box-shadow:0 24px 90px #28352c18,inset 0 1px 0 #fff
}
.arrival-title {
  font-size:clamp(48px,7.5vw,112px);
  font-weight:400;
  margin:26px 0 48px;
  line-height:1.02;
  letter-spacing:-.035em
}
.arrival-actions { display:flex; justify-content:center; gap:16px; flex-wrap:wrap }
.arrival-actions .button { min-height:54px; padding:16px 28px; border-radius:11px; font-size:14px }
.arrival-actions .arrival-direct { background:rgb(255 255 255 / 65%); border:1px solid #b38b4870; color:#28352c }
.arrival-actions .arrival-direct:hover { background:#fff }
.arrival-actions .arrival-direct img { filter:none }
.arrival-status:empty { display:none }
.arrival-welcome>.arrival-status { margin-top:16px; font-size:12px }
.arrival-caption {
  position:fixed;
  bottom:calc(var(--flight-bottom, var(--arrival-inset)) + 18px);
  left:calc(var(--flight-left, var(--arrival-inset)) + 20px);
  z-index:2;
  color:#454943;
  font-size:10px
}
.arrival-dialog[data-phase="welcome"] .arrival-caption,
.arrival-dialog[data-phase="loading"] .arrival-caption,
.is-docking .arrival-caption { display:none }
.experience-stage {
  position:fixed;
  overflow:hidden;
  background:rgb(245 242 235 / 94%);
  border-radius:24px;
  box-shadow:0 24px 90px #28352c20;
  pointer-events:none
}
.experience-stage video {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover
}
.experience-stage .aerial-loop-night {
  opacity:0;
  pointer-events:none;
  transition:opacity var(--theme-duration) var(--theme-easing)
}
[data-theme="night"] .experience-stage.is-docked .aerial-loop-night { opacity:1 }
.aerial-media-slot { position:absolute; inset:0; z-index:-2 }
.aerial-media-slot>.experience-stage.is-docked {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border-radius:24px;
  box-shadow:none
}
.experience-stage::after,
.aerial-section::after {
  content:'';
  box-sizing:border-box;
  position:absolute;
  inset:0;
  z-index:3;
  border:12px solid rgb(255 255 255 / 18%);
  border-radius:inherit;
  outline:1px solid #ffffffb0;
  outline-offset:-1px;
  box-shadow:inset 0 0 0 1px #ffffffc9,0 0 0 1px #ffffffb0;
  pointer-events:none
}
/* The section carries the same frame after docking, above its text overlays. */
.experience-stage.is-docked::after { display:none }
.aerial-image { transform:none }
/* Reserve the destination's layout, but show only the moving video until it arrives. */
body:is([data-experience-phase="entering"], [data-experience-phase="flight"], [data-experience-phase="handoff"], [data-experience-phase="docking"]) .aerial-section {
  visibility:hidden
}
body[data-experience-phase]:not([data-experience-phase="loop"]) .aerial-heading,
body[data-experience-phase]:not([data-experience-phase="loop"]) .glass-card {
  opacity:0
}
body[data-experience-phase="loop"] .aerial-heading {
  animation:map-copy-appear 1000ms ease-out 40ms both
}
body[data-experience-phase="loop"] .glass-card {
  animation:map-copy-appear 1100ms ease-out 180ms both
}
@keyframes map-copy-appear {
  from { opacity:0; transform:translateY(8px) }
  to { opacity:1; transform:translateY(0) }
}
#plots-title:focus, #hero-title:focus { outline:none }
.arrival-toolbar {
  position:fixed;
  top:calc(var(--flight-top, var(--arrival-inset)) + 16px);
  right:calc(var(--flight-right, var(--arrival-inset)) + 16px);
  z-index:2;
  display:flex;
  gap:10px
}
.experience-control {
  min-height:44px;
  padding:10px 16px;
  border:1px solid #b38b4877;
  border-radius:30px;
  background:#f5f2ebee;
  color:var(--ink);
  font-family:var(--sans);
  font-size:12px;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px)
}
.arrival-toolbar .experience-control {
  background:rgb(255 255 255 / 78%);
  color:#28352c;
  border-color:#b38b4877
}
[data-theme="night"] .arrival-toolbar .experience-control {
  background:rgb(255 255 255 / 78%);
  color:#28352c
}
.experience-controls {
  position:fixed;
  bottom:24px;
  left:24px;
  z-index:24;
  display:flex;
  gap:8px
}
[data-theme="night"] .experience-control { background:rgb(18 35 57 / 60%); border-color:#c5d5df55 }
@media(max-width:700px) {
  .arrival-welcome { padding:24px 18px; overflow:auto; border-radius:16px }
  .arrival-title { font-size:clamp(38px,9.8vw,65px); margin:26px 0 34px }
  .arrival-welcome .eyebrow { font-size:8px; letter-spacing:.16em }
  .arrival-actions { flex-direction:column; width:min(100%,270px); gap:12px }
  .arrival-actions .button { justify-content:center; padding:14px 18px; min-height:50px; font-size:12px }
  .arrival-toolbar { left:calc(var(--arrival-inset) + 10px); right:calc(var(--arrival-inset) + 10px); justify-content:flex-end; gap:6px }
  .arrival-toolbar .experience-control { padding:9px 12px; font-size:11px }
  .experience-controls { left:16px; bottom:max(16px,env(safe-area-inset-bottom)) }
  .experience-controls .experience-control { padding:9px 12px; font-size:11px }
  .aerial-media-slot { height:360px }
  .experience-stage::after,
  .aerial-section::after { border-width:8px }
  .aerial-section::after { height:360px }
  .aerial-section .glass-card { left:16px; right:16px; padding:22px }
  .aerial-section .glass-card h3 { font-size:25px }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important
  }
}

@media(max-height:520px) {
  .arrival-welcome { padding:20px; justify-content:flex-start }
  .arrival-title { font-size:42px; margin:14px 0 22px }
  .arrival-actions { flex-direction:row; width:auto }
}

/* A single heading is written, then moves from the glass into the film corner. */
.arrival-welcome { z-index:2 }
.arrival-title { flex-shrink:0 }
.arrival-title-line { display:block; white-space:nowrap }
.arrival-letter {
  display:inline-block;
  white-space:pre;
  opacity:0;
  animation:arrival-write .65s ease-out forwards;
  animation-delay:var(--letter-delay)
}
@keyframes arrival-write {
  from { opacity:0; filter:blur(5px); transform:translateY(5px) }
  to { opacity:1; filter:blur(0); transform:translateY(0) }
}
.arrival-title.is-written .arrival-letter { animation:none; opacity:1 }
.arrival-title.is-corner {
  position:fixed;
  left:calc(var(--flight-left, var(--arrival-inset)) + 24px);
  top:calc(var(--flight-top, var(--arrival-inset)) + 20px);
  z-index:4;
  margin:0;
  font-size:28px;
  text-align:center;
  pointer-events:none;
  color:#28352c;
  text-shadow:0 1px 10px #ffffffe6
}
.arrival-dialog[data-phase="entering"] .arrival-caption { display:none }
.arrival-dialog.is-docking .arrival-title { opacity:0; transition:opacity .35s ease }
.arrival-dialog>.experience-stage { z-index:1 }
@media(max-width:700px) {
  .arrival-welcome { border-width:8px }
  .arrival-title { font-size:clamp(30px,9vw,60px) }
  .arrival-title.is-corner {
    font-size:clamp(16px,4.6vw,22px);
    left:calc(var(--flight-left, var(--arrival-inset)) + 16px);
    top:calc(var(--flight-top, var(--arrival-inset)) + 14px)
  }
  .arrival-toolbar { top:max(76px,calc(var(--flight-top, var(--arrival-inset)) - 54px)) }
}
@media(prefers-reduced-motion:reduce) {
  .arrival-letter { opacity:1; filter:none; transform:none }
}