:root {
  --sand:#f5f6f7;
  --white:#ffffff;
  --ink:#263440;
  --line:#26344030;
  --accent:#526b80;
  --mist:#e3e8ec
}
body {
  background:var(--sand)
}
.contact-form {
  background:#e3e8ec
}
.location-map,dialog,.dialog-toolbar .dialog-close {
  background:var(--sand)
}
.story-language {
  color:#41596e
}
.category-links button.active,.interior-tabs [aria-selected=true] {
  color:var(--ink)
}
 #site-language {
  font:10px Mono;
  min-width:62px;
  min-height:44px;
  letter-spacing:.03em
}
#site-language span.active {
  border-bottom:1px solid currentColor;
  padding-bottom:4px
}
#site-language i {
  font-style:normal;
  opacity:.4;
  margin:0 5px
}
 .hero-journey {
  height:225svh;
  position:relative
}
.hero-journey .hero {
  position:sticky;
  top:0;
  height:100svh;
  min-height:600px;
  max-height:none;
  --camera-scale:1.035;
  --camera-x:0%;
  --camera-y:0%;
  --approach:0;
  isolation:isolate
}
.hero-journey .hero-img {
  animation:none;
  transform:translate3d(var(--camera-x),var(--camera-y),0) scale(var(--camera-scale))!important;
  will-change:transform;
  transition:opacity .7s;
  object-position:58% 54%
}
.hero-journey .hero-title {
  width:94%;
  top:30%;
  opacity:calc(1 - var(--approach)*.6);
  transform:translate(-50%,calc(-5% - var(--approach)*30%));
  pointer-events:none
}
.hero-title .scroll-link {
  pointer-events:auto
}
.hero-journey .hero-title>span {
  font-size:clamp(34px,4.8vw,72px)
}
.hero-journey .hero-title h1 {
  font-size:clamp(100px,19vw,290px);
  letter-spacing:-.045em;
  line-height:.95
}
.hero-journey .hero-title h1 small {
  font-size:.19em;
  vertical-align:30%
}
.hero-journey .orbit-res {
  width:15vw;
  height:15vw;
  max-width:220px;
  max-height:220px;
  left:7%;
  top:55%;
  background:#f5f6f71a;
  backdrop-filter:blur(3px);
  color:white
}
.hero-journey .orbit-villa {
  right:9%;
  bottom:20%;
  background:#f5f6f71a;
  color:white
}
.hero-category-caption {
  top:24%;
  letter-spacing:.2em
}
.intro-note {
  position:absolute;
  left:50%;
  bottom:115px;
  transform:translateX(-50%);
  display:flex;
  gap:18px;
  align-items:center;
  color:white;
  font-size:8px;
  white-space:nowrap
}
.intro-track {
  height:1px;
  width:90px;
  background:#ffffff44
}
.intro-track i {
  display:block;
  height:100%;
  background:white;
  transform-origin:left
}
.intro-replay {
  position:absolute;
  left:3%;
  bottom:100px;
  font-size:8px;
  color:white;
  border-bottom:1px solid #ffffff66;
  padding:8px 0;
  min-height:44px
}
.hero-select-again {
  bottom:105px
}
.hero-shade {
  background:linear-gradient(180deg,#26344046,transparent 52%,#26344070)
}
 .location.pad {
  padding:110px 0 80px;
  overflow:hidden
}
.location .location-head {
  padding:0 5%;
  display:block;
  margin-bottom:55px
}
.location .location-head>h2 {
  font-size:clamp(58px,8.6vw,145px);
  line-height:.98;
  letter-spacing:-.035em;
  max-width:1300px;
  margin:38px 0
}
.location .location-head>p {
  margin:0 0 0 50%;
  line-height:1.8;
  font-size:10px
}
.location-head em {
  color:#526b80
}
.location-map.atlas-map {
  height:100svh;
  min-height:730px;
  max-height:1100px;
  margin:0;
  border:0;
  overflow:hidden;
  background:var(--sand);
  isolation:isolate
}
.atlas-landscape {
  position:absolute;
  inset:0;
  min-width:0
}
.atlas-art {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  mix-blend-mode:multiply;
  opacity:.85
}
.atlas-routes {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none
}
.atlas-route {
  fill:none;
  stroke:#263440;
  stroke-width:2;
  stroke-dasharray:6 6;
  animation:atlas-route 1.6s ease both;
  path-length:1
}
.atlas-origin {
  position:absolute;
  left:70%;
  top:35%;
  transform:translate(-50%,-50%);
  font:100 48px Canela;
  width:74px;
  height:74px;
  border:1px solid var(--ink);
  border-radius:50%;
  background:#f5f6f7cc;
  box-shadow:0 0 0 14px #f5f6f744
}
.atlas-origin small {
  position:absolute;
  top:88px;
  left:50%;
  transform:translateX(-50%);
  font:8px Mono;
  white-space:nowrap;
  letter-spacing:.15em
}
.atlas-point {
  position:absolute;
  transform:translate(-50%,-50%);
  width:44px;
  height:44px;
  border:1px solid #26344088;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#f5f6f7cc;
  box-shadow:0 0 0 6px #f5f6f733;
  transition:background .3s,scale .3s;
  z-index:2
}
.atlas-point b {
  font:100 22px Canela
}
.atlas-point>span {
  position:absolute;
  top:52px;
  left:50%;
  transform:translateX(-50%);
  font:8px Mono;
  white-space:nowrap;
  text-shadow:0 0 15px #f5f6f7,0 0 8px #f5f6f7
}
.atlas-point:hover,.atlas-point.active {
  background:var(--ink);
  color:#fff;
  scale:1.12;
  z-index:4
}
.atlas-point.active>span,.atlas-point:hover>span {
  color:var(--ink)
}
.atlas-map-meta {
  position:absolute;
  left:5%;
  right:5%;
  bottom:28px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:8px;
  z-index:5;
  gap:20px
}
.atlas-map-meta button {
  min-height:44px
}
.atlas-sea {
  position:absolute;
  top:25px;
  left:5%;
  font-size:9px;
  padding:14px 20px;
  background:#f5f6f7d9;
  border:1px solid var(--line);
  z-index:3
}
.atlas-card {
  position:absolute;
  left:5%;
  top:90px;
  width:300px;
  padding:24px;
  background:#f5f6f7f2;
  z-index:7;
  border:1px solid var(--line);
  backdrop-filter:blur(12px);
  animation:card-in .5s ease
}
.atlas-card[hidden] {
  display:none
}
.atlas-card-top {
  display:flex;
  align-items:center;
  gap:22px;
  margin-bottom:18px
}
.atlas-card-top>b {
  font:100 72px/1 Canela;
  letter-spacing:-.04em
}
.atlas-card-top>.eyebrow {
  font-size:8px;
  line-height:1.8
}
.atlas-card>img {
  height:160px;
  margin-bottom:20px
}
.atlas-card h3 {
  font-size:35px;
  margin-bottom:12px
}
.atlas-card p {
  font-size:10px;
  line-height:1.8
}
.atlas-card>.text-link {
  font-size:9px;
  width:100%;
  margin-top:14px;
  min-height:44px
}
.atlas-card-close {
  position:absolute;
  top:8px;
  right:10px;
  width:36px;
  height:36px;
  font-size:26px
}
.atlas-strip {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:40px 5% 25px
}
.atlas-strip>div {
  display:flex;
  gap:10px
}
.location .atlas-places {
  display:flex;
  overflow:auto;
  gap:35px;
  padding:0 5% 25px;
  margin:0;
  scroll-snap-type:x mandatory;
  scrollbar-width:thin;
  scrollbar-color:#26344055 transparent
}
.atlas-places>button {
  flex:0 0 30%;
  scroll-snap-align:start;
  border:0;
  padding-bottom:25px
}
.atlas-place-number {
  display:flex;
  align-items:end;
  gap:20px;
  margin-bottom:22px
}
.atlas-place-number>b {
  font:100 95px/.9 Canela;
  letter-spacing:-.055em
}
.atlas-place-number>span {
  font-size:8px;
  max-width:110px;
  padding-bottom:6px
}
.location .atlas-places img {
  height:245px;
  margin-bottom:20px
}
.location .atlas-places h3 {
  font-size:37px;
  padding-right:25px
}
.location .atlas-places>button>.atlas-place-arrow {
  position:absolute;
  bottom:28px;
  right:0
}
 .architecture-drawing-screen {
  height:100svh;
  min-height:720px;
  overflow:hidden;
  background:#f5f6f7;
  color:var(--ink);
  isolation:isolate
}
.architecture-drawing-screen:after {
  display:none
}
.architecture-drawing-screen>img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 55%;
  transform:none!important
}
.architecture-drawing-screen>img:first-child {
  mix-blend-mode:multiply;
  opacity:.95;
  clip-path:inset(0 100% 0 0);
  transition:clip-path 2.6s cubic-bezier(.15,.6,.15,1)
}
.architecture-drawing-screen.drawing-visible>img:first-child {
  clip-path:inset(0 0 0 0)
}
.architecture-drawing-screen .architecture-render-layer {
  z-index:2;
  clip-path:circle(0 at 80% 80%);
  transition:clip-path 1.6s cubic-bezier(.15,.6,.15,1)
}
.architecture-drawing-screen.render-revealed .architecture-render-layer {
  clip-path:circle(150% at 80% 80%)
}
.architecture-drawing-screen>.eyebrow {
  z-index:4;
  background:#f5f6f7bd;
  padding:6px 10px
}
.architecture-toggle {
  position:absolute;
  right:5%;
  top:35px;
  min-height:44px;
  border-bottom:1px solid currentColor;
  z-index:4;
  background:#f5f6f7d9;
  padding:0 10px;
  font-size:9px
}
.drawing-caption {
  position:absolute;
  bottom:45px;
  left:5%;
  right:5%;
  z-index:3;
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:25px
}
.drawing-caption h2 {
  font-size:clamp(45px,6.5vw,104px);
  letter-spacing:-.03em;
  max-width:800px;
  text-shadow:0 0 35px #f5f6f7,0 0 10px #f5f6f7
}
.drawing-caption>.eyebrow {
  font-size:9px;
  text-align:right;
  max-width:200px;
  text-shadow:0 0 15px #f5f6f7
}
.architecture.render-revealed .drawing-caption {
  color:white
}
.architecture-copy.pad {
  padding:100px 5%;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:36px;
  overflow:visible
}
.architecture-copy>.eyebrow {
  grid-column:1/-1
}
.architecture-copy>h2 {
  grid-column:1/-1;
  font-size:clamp(42px,5.7vw,92px);
  line-height:1.04;
  letter-spacing:-.025em;
  text-transform:uppercase;
  max-width:1500px
}
.architecture-copy>p {
  grid-column:1;
  max-width:500px;
  margin:0;
  font-size:11px;
  line-height:1.9
}
.architecture-copy .story-reader {
  grid-column:2;
  margin-top:0;
  align-self:start
}
 .panorama-journey {
  height:175svh;
  position:relative
}
.panorama-journey .panorama {
  position:sticky;
  top:0;
  height:100svh;
  min-height:600px;
  --panorama-sweep:0;
  isolation:isolate
}
.panorama-journey .panorama>img {
  width:125%;
  max-width:none;
  object-position:60%;
  transform:translateX(calc(var(--panorama-sweep)*-18%)) scale(1.05)!important
}
.panorama-journey .panorama h2 {
  font-size:clamp(72px,13.6vw,220px);
  line-height:.88;
  letter-spacing:-.055em;
  top:44%;
  max-width:100%;
  padding:0 3%
}
.panorama-journey .panorama h2 small {
  font-size:.25em;
  letter-spacing:0;
  display:block;
  line-height:1.2
}
.panorama-guide {
  position:absolute;
  left:5%;
  right:5%;
  bottom:100px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  z-index:2;
  color:white;
  font-size:9px
}
.panorama-guide>span:last-child {
  max-width:200px;
  text-align:right
}
.panorama-journey .panorama>.eyebrow {
  bottom:38px;
  min-height:44px;
  font-size:10px
}
.tour-view.expanded-tour {
  height:86svh;
  min-height:500px
}
.tour-chapters {
  position:absolute;
  z-index:4;
  top:70px;
  left:25px;
  display:flex;
  gap:8px;
  flex-wrap:wrap
}
.tour-chapters button {
  min-height:44px;
  padding:10px 16px;
  border:1px solid #ffffff80;
  background:#26344044;
  color:white;
  backdrop-filter:blur(8px);
  font-size:9px
}
.tour-chapters button.active {
  background:#f5f6f7;
  color:#263440
}
.expanded-tour .tour-toolbar h3 {
  font-size:clamp(35px,5vw,76px);
  letter-spacing:-.03em;
  max-width:850px
}
.expanded-tour .tour-pan-controls button {
  width:56px;
  height:56px
}
.tour-dialog .dialog-toolbar {
  z-index:10
}
 .interiors.pad {
  padding:90px 0 0
}
.interior-heading {
  display:grid;
  grid-template-columns:1fr 2fr auto;
  padding:0 5% 55px;
  align-items:end;
  gap:25px
}
.interior-heading h2 {
  font-size:clamp(55px,7vw,110px);
  letter-spacing:-.035em
}
.interior-heading>.eyebrow {
  font-size:9px
}
.interior-frame {
  height:100svh;
  min-height:730px;
  overflow:hidden;
  isolation:isolate
}
.interior-frame>#interior-image {
  position:absolute;
  inset:0;
  z-index:1;
  transform:none
}
.interior-frame>.eyebrow {
  z-index:4;
  top:25px;
  bottom:auto;
  left:5%;
  font-size:9px;
  max-width:60%
}
.interior-expand {
  right:5%;
  top:20px;
  background:#f5f6f7e0;
  z-index:5
}
.interior-frame .interior-tabs {
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  display:flex;
  gap:24px;
  align-items:stretch;
  justify-content:center;
  flex-wrap:nowrap;
  background:linear-gradient(transparent,#263440c4);
  padding:70px 5% 25px;
  margin:0;
  z-index:6
}
.interior-tabs button {
  color:white!important;
  opacity:.65;
  min-width:0;
  border:0;
  border-bottom:1px solid #ffffff55;
  text-align:left;
  font-size:9px;
  padding-bottom:12px;
  flex:1
}
.interior-tabs button[aria-selected=true] {
  opacity:1;
  border-color:white
}
.interior-thumb {
  width:100%;
  height:70px;
  object-fit:cover;
  margin-bottom:14px;
  filter:saturate(.65);
  transition:filter .4s
}
.interior-tabs button[aria-selected=true] .interior-thumb {
  filter:none
}
.interior-navigation {
  position:absolute;
  left:3%;
  right:3%;
  top:43%;
  display:flex;
  justify-content:space-between;
  pointer-events:none;
  z-index:5
}
.interior-navigation button {
  pointer-events:auto;
  color:white;
  background:#26344020;
  backdrop-filter:blur(8px)
}
.interior-outgoing {
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  animation:interior-leave 1.3s cubic-bezier(.2,.65,.2,1) both
}
.room-changing #interior-image {
  animation:interior-enter 1.3s cubic-bezier(.2,.65,.2,1) both
}
.room-changing .interior-outgoing {
  animation:interior-leave 1.3s cubic-bezier(.2,.65,.2,1) both
}
.interior-frame:hover>#interior-image {
  transform:none
}
.story-text {
  color:var(--ink)
}
 @keyframes interior-enter {
  from {
    clip-path:inset(0 0 0 100%);
    translate:5% 0
  }
  to {
    clip-path:inset(0);
    translate:0 0
  }
  
}
@keyframes interior-leave {
  from {
    opacity:1;
    transform:scale(1)
  }
  to {
    opacity:0;
    transform:scale(1.04) translateX(-6%)
  }
  
}
@keyframes atlas-route {
  from {
    stroke-dashoffset:160;
    opacity:0
  }
  to {
    stroke-dashoffset:0;
    opacity:1
  }
  
}
 @media(max-width:1100px) {
  .header-right {
    gap:16px
  }
  .hero-journey .hero-title h1 {
    font-size:20vw
  }
  .atlas-places>button {
    flex-basis:38%
  }
  .atlas-card {
    width:270px
  }
  .atlas-card>img {
    height:135px
  }
  
}
 @media(max-width:600px) {
  header {
    padding:12px 4%
  }
  .logo {
    font-size:25px;
    letter-spacing:3px
  }
  .header-right {
    gap:9px
  }
  .header-right .floor-trigger {
    font-size:7px;
    max-width:53px;
    text-align:right
  }
  #site-language {
    font-size:8px;
    min-width:50px
  }
  .hero-journey {
    height:190svh
  }
  .hero-journey .hero {
    min-height:570px
  }
  .hero-journey .hero-title {
    top:39%;
    width:96%
  }
  .hero-journey .hero-title h1 {
    font-size:24vw;
    white-space:nowrap
  }
  .hero-journey .hero-title>span {
    font-size:37px
  }
  .hero-journey .orbit-res {
    width:30vw;
    height:30vw;
    top:16%;
    left:7%
  }
  .hero-journey .orbit-villa {
    width:24vw;
    height:24vw;
    right:12%;
    bottom:24%
  }
  .hero-journey .hero-category-caption {
    top:32%;
    font-size:6px;
    letter-spacing:.15em
  }
  .intro-note {
    bottom:100px;
    left:5%;
    transform:none;
    font-size:6px;
    gap:10px
  }
  .intro-note>span:first-child {
    max-width:100px;
    white-space:normal
  }
  .intro-track {
    width:55px
  }
  .intro-replay {
    bottom:73px;
    left:auto;
    right:5%;
    font-size:6px;
    max-width:140px
  }
  .hero-select-again {
    bottom:74px;
    left:5%;
    font-size:6px;
    max-width:145px
  }
  .hero-bottom {
    bottom:18px
  }
  .location.pad {
    padding:70px 0 45px
  }
  .location .location-head {
    margin-bottom:35px
  }
  .location .location-head>h2 {
    font-size:clamp(43px,12vw,70px);
    margin:30px 0;
    line-height:1.03;
    overflow-wrap:normal
  }
  .location .location-head>p {
    margin-left:18%;
    font-size:8px
  }
  .location-map.atlas-map {
    height:85svh;
    min-height:680px;
    overflow-x:auto
  }
  .atlas-landscape {
    width:900px;
    height:100%;
    left:0
  }
  .atlas-art {
    object-fit:cover
  }
  .atlas-point {
    width:40px;
    height:40px
  }
  .atlas-point b {
    font-size:20px
  }
  .atlas-point>span {
    font-size:7px;
    top:47px
  }
  .atlas-map-meta {
    position:sticky;
    top:calc(100% - 65px);
    left:15px;
    width:calc(100% - 30px);
    font-size:6px;
    pointer-events:none
  }
  .atlas-map-meta button {
    pointer-events:auto;
    max-width:110px;
    text-align:right;
    font-size:7px
  }
  .atlas-sea {
    position:sticky;
    left:15px;
    top:15px;
    padding:10px 12px;
    font-size:7px
  }
  .atlas-card {
    position:sticky;
    left:15px;
    top:85px;
    width:255px;
    padding:18px;
    margin-top:25px
  }
  .atlas-card-top>b {
    font-size:60px
  }
  .atlas-card>img {
    height:125px
  }
  .atlas-card h3 {
    font-size:30px
  }
  .atlas-card p {
    font-size:9px
  }
  .atlas-origin {
    font-size:40px;
    width:60px;
    height:60px
  }
  .atlas-strip {
    padding:28px 5% 20px;
    gap:20px
  }
  .atlas-strip>.eyebrow {
    font-size:8px;
    max-width:170px
  }
  .atlas-strip .round {
    width:44px;
    height:44px
  }
  .location .atlas-places {
    gap:22px
  }
  .atlas-places>button {
    flex-basis:77%
  }
  .atlas-place-number>b {
    font-size:85px
  }
  .location .atlas-places img {
    height:240px
  }
  .location .atlas-places h3 {
    font-size:35px
  }
  .architecture-drawing-screen {
    height:100svh;
    min-height:690px
  }
  .architecture-drawing-screen>img {
    object-position:60% center;
    object-fit:cover
  }
  .architecture-drawing-screen>.eyebrow {
    top:22px;
    left:4%;
    font-size:7px;
    max-width:125px
  }
  .architecture-toggle {
    top:16px;
    right:4%;
    font-size:7px;
    max-width:155px
  }
  .drawing-caption {
    bottom:28px;
    display:block
  }
  .drawing-caption h2 {
    font-size:49px;
    line-height:1.0
  }
  .drawing-caption>.eyebrow {
    display:block;
    text-align:left;
    margin-top:20px;
    font-size:8px
  }
  .architecture-copy.pad {
    display:block;
    padding:65px 5%
  }
  .architecture-copy>h2 {
    font-size:36px;
    line-height:1.1;
    margin:28px 0
  }
  .architecture-copy>p {
    font-size:9px;
    max-width:300px;
    margin-left:auto
  }
  .architecture-copy .story-reader {
    margin-top:28px
  }
  .panorama-journey {
    height:155svh
  }
  .panorama-journey .panorama {
    min-height:570px
  }
  .panorama-journey .panorama h2 {
    font-size:16vw;
    line-height:1.0;
    overflow-wrap:normal;
    top:40%
  }
  .panorama-journey .panorama h2 small {
    font-size:.28em;
    line-height:1.6
  }
  .panorama-guide {
    bottom:110px;
    font-size:7px;
    display:block
  }
  .panorama-guide>span:last-child {
    display:block;
    text-align:left;
    margin-top:18px;
    max-width:180px
  }
  .panorama-journey .panorama>.eyebrow {
    font-size:8px;
    bottom:33px
  }
  .tour-view.expanded-tour {
    height:85svh;
    min-height:530px
  }
  .tour-chapters {
    top:80px;
    left:16px;
    right:16px;
    gap:5px
  }
  .tour-chapters button {
    padding:9px 10px;
    font-size:7px;
    flex:1
  }
  .expanded-tour .tour-toolbar {
    align-items:end
  }
  .expanded-tour .tour-toolbar h3 {
    font-size:34px;
    max-width:245px
  }
  .expanded-tour .tour-toolbar p {
    max-width:200px;
    font-size:7px
  }
  .expanded-tour .tour-pan-controls {
    flex-direction:column
  }
  .expanded-tour .tour-pan-controls button {
    width:44px;
    height:44px
  }
  .interiors.pad {
    padding-top:60px
  }
  .interior-heading {
    display:block;
    padding-bottom:35px
  }
  .interior-heading h2 {
    font-size:52px;
    margin:25px 0
  }
  .interior-count {
    display:block;
    text-align:right
  }
  .interior-frame {
    height:95svh;
    min-height:650px
  }
  .interior-frame .interior-tabs {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px 12px;
    padding:50px 5% 20px
  }
  .interior-thumb {
    height:44px;
    margin-bottom:7px
  }
  .interior-tabs button {
    font-size:7px;
    padding-bottom:9px;
    white-space:normal
  }
  .interior-frame>.eyebrow {
    font-size:7px;
    top:24px;
    max-width:45%
  }
  .interior-expand {
    font-size:7px;
    padding:10px;
    max-width:44%;
    text-align:right;
    right:4%;
    top:15px
  }
  .interior-navigation {
    top:38%
  }
  .interior-navigation button {
    width:44px;
    height:44px
  }
  .interior-frame>#interior-image,.interior-outgoing {
    object-position:center
  }
  .home-extra {
    font-size:7px
  }
  
}
 @media(max-height:650px) and (orientation:landscape) {
  .hero-journey .hero {
    min-height:100svh
  }
  .hero-journey .hero-title {
    top:30%
  }
  .hero-journey .hero-title h1 {
    font-size:17vw
  }
  .intro-note {
    display:none
  }
  
}
 @media(prefers-reduced-motion:reduce) {
  .hero-journey,.panorama-journey {
    height:auto
  }
  .hero-journey .hero,.panorama-journey .panorama {
    position:relative
  }
  .hero-journey .hero-img {
    transform:none!important
  }
  .architecture-drawing-screen>img:first-child {
    clip-path:none
  }
  .intro-replay,.intro-track {
    display:none
  }
  .interior-outgoing {
    display:none
  }
  .interior-frame #interior-image {
    animation:none!important
  }
  
}
 .intro-replay {
  left:auto;
  right:3%
}
.architecture-drawing-screen>.architecture-toggle {
  left:auto;
  right:5%;
  width:auto;
  max-width:290px;
  bottom:auto
}
.architecture-drawing-screen.render-revealed .drawing-caption {
  color:white;
  text-shadow:0 1px 20px #263440
}
.architecture-drawing-screen.render-revealed .drawing-caption h2 {
  text-shadow:0 1px 30px #263440
}
.architecture-drawing-screen>img:first-child {
  object-position:center
}
.hero-title h1 small:empty {
  display:none
}
html[lang=ru] .hero-title h1 small {
  display:none
}
 @media(max-width:600px) {
  .intro-replay {
    right:5%;
    left:auto
  }
  .architecture-drawing-screen>.architecture-toggle {
    max-width:160px;
    right:4%;
    font-size:7px
  }
  .hero-journey .hero-title>span {
    font-size:clamp(27px,7.5vw,37px)
  }
  
}
 .atlas-origin {
  left:76%;
  top:30%
}
@media(max-width:600px) {
  .atlas-point {
    width:44px;
    height:44px
  }
  .atlas-point>span {
    top:49px
  }
  .hero-select-again {
    bottom:75px
  }
  .intro-replay {
    bottom:111px;
    right:5%;
    left:auto;
    max-width:180px
  }
  .intro-note {
    bottom:117px;
    max-width:160px
  }
  .intro-note>span:first-child {
    max-width:77px
  }
  .intro-track {
    width:30px
  }
  .intro-note>span:last-child {
    display:none
  }
  
}
 /* Handoff polish: restrained motion, natural olive surfaces and fixed map controls. */ :root {
  --sand:#f5f6f7;
  --white:#ffffff;
  --ink:#263440;
  --line:#26344030;
  --accent:#526b80;
  --mist:#e3e8ec
}
html {
  scroll-behavior:smooth
}
body {
  background:var(--sand)
}
.hero-journey {
  height:165svh
}
.hero-journey .hero-title {
  opacity:calc(1 - var(--approach)*.35);
  transform:translate(-50%,calc(-5% - var(--approach)*12%))
}
.hero-journey .hero-img {
  backface-visibility:hidden
}
.hero-title {
  translate:none!important
}
.hero-journey .orbit {
  backdrop-filter:none;
  background:#26344022
}
.hero-select-again,.intro-replay {
  font-size:9px;
  min-height:44px;
  display:flex;
  align-items:center
}
.intro-replay {
  bottom:100px;
  right:3%
}
.intro-note {
  bottom:115px;
  font-size:8px
}
.atlas-map {
  overflow:hidden!important
}
.atlas-viewport {
  position:absolute;
  inset:0;
  overflow:hidden
}
.atlas-landscape {
  position:relative;
  width:100%;
  height:100%
}
.atlas-art {
  filter:grayscale(1) contrast(1.04);
  mix-blend-mode:multiply;
  opacity:.84
}
.atlas-map-meta {
  position:absolute;
  left:5%;
  right:5%;
  bottom:20px;
  top:auto;
  width:auto;
  pointer-events:none
}
.atlas-map-meta button {
  pointer-events:auto;
  background:#f5f6f7ed;
  padding:8px 10px
}
.atlas-sea {
  position:absolute;
  top:20px;
  left:5%
}
.atlas-card {
  position:absolute;
  left:5%;
  top:85px;
  margin:0;
  width:300px;
  max-height:calc(100% - 150px);
  overflow-y:auto;
  overscroll-behavior:contain;
  background:#f5f6f7f7;
  scrollbar-width:thin
}
.atlas-card-close {
  position:sticky;
  float:right;
  top:0;
  margin:-12px -12px 0 0;
  width:44px;
  height:44px;
  z-index:3;
  background:#f5f6f7;
  border-radius:50%
}
.atlas-point,.atlas-origin {
  background:#f5f6f7e8
}
.atlas-point.active,.atlas-point:hover {
  background:var(--ink)
}
.atlas-point>span {
  text-shadow:0 0 16px #f5f6f7,0 0 8px #f5f6f7
}
.location-head em {
  color:#526b80
}
.architecture-drawing-screen {
  background:var(--sand)
}
.architecture-drawing-screen>img:first-child {
  filter:grayscale(1) contrast(1.04);
  transition:clip-path 1.3s cubic-bezier(.2,.65,.2,1);
  clip-path:inset(0)
}
.architecture-drawing-screen .architecture-render-layer {
  transition:clip-path .85s cubic-bezier(.2,.65,.2,1)
}
.architecture-toggle {
  background:#f5f6f7ed
}
.drawing-caption h2 {
  text-shadow:0 0 35px #f5f6f7,0 0 10px #f5f6f7
}
.drawing-caption>.eyebrow {
  text-shadow:0 0 15px #f5f6f7
}
.panorama-journey {
  height:145svh
}
.tour-chapters button {
  background:#26344070
}
.tour-chapters button.active {
  background:#f5f6f7;
  color:#263440
}
.tour-view {
  touch-action:pan-y
}
.interior-frame>#interior-image {
  opacity:1!important;
  animation:none!important;
  translate:none!important;
  transition:none;
  clip-path:none
}
.interior-outgoing {
  animation:none!important;
  will-change:clip-path
}
.interior-expand {
  background:#f5f6f7ed
}
.interior-tabs button {
  font-size:10px
}
.interior-frame .interior-tabs {
  background:linear-gradient(transparent,#263440d9)
}
.contact-form {
  background:#e3e8ec
}
.contact-form input {
  font-size:16px
}
#detail {
  overscroll-behavior:contain
}
dialog {
  scrollbar-width:thin
}
.dialog-close,.floor-tabs button,.home-extra button,#close-home {
  min-width:44px;
  min-height:44px
}
.story-toggle {
  font-size:11px
}
.atlas-strip>.eyebrow {
  font-size:10px
}
.atlas-card .eyebrow {
  font-size:9px
}
.atlas-card p {
  font-size:11px
}
.atlas-place-number>span {
  font-size:9px
}
.floor-tabs button:focus-visible {
  outline-offset:-3px
}
.interior-tabs button:focus-visible {
  outline-color:white;
  outline-offset:4px
}
.masterplan {
  touch-action:pan-y pinch-zoom
}
.masterplan.is-map-active {
  touch-action:none
}
.masterplan-legend>span {
  max-width:200px
}
.masterplan button.map-touch-toggle {
  position:absolute;
  left:25px;
  bottom:54px;
  background:#f5f6f7ed;
  border:1px solid #26344055;
  color:var(--ink);
  padding:12px 14px;
  min-height:44px;
  font-size:9px;
  z-index:4;
  display:none
}
 @media(max-width:600px) {
  .hero-journey {
    height:140svh
  }
  .hero-journey .hero {
    min-height:100svh
  }
  .hero-journey .hero-title {
    top:39%
  }
  .hero-select-again {
    left:5%;
    bottom:86px;
    max-width:155px;
    font-size:7px;
    line-height:1.5
  }
  .intro-replay {
    bottom:86px;
    right:5%;
    max-width:155px;
    font-size:7px;
    line-height:1.5
  }
  .intro-note {
    left:5%;
    bottom:147px;
    font-size:7px;
    max-width:150px
  }
  .intro-note>span:first-child {
    max-width:100px
  }
  .intro-track {
    width:28px
  }
  .intro-note>span:last-child {
    display:none
  }
  .location-map.atlas-map {
    height:min(90svh,850px);
    min-height:600px;
    overflow:hidden
  }
  .atlas-viewport {
    overflow-x:auto;
    overflow-y:hidden;
    overscroll-behavior-x:contain;
    scrollbar-width:thin;
    touch-action:pan-x pan-y
  }
  .atlas-landscape {
    width:900px;
    min-width:900px
  }
  .atlas-sea {
    position:absolute;
    left:15px;
    top:15px;
    max-width:calc(100% - 30px);
    font-size:9px;
    padding:12px
  }
  .atlas-map-meta {
    position:absolute;
    left:15px;
    right:15px;
    bottom:12px;
    width:auto;
    top:auto;
    font-size:7px;
    gap:12px;
    align-items:end
  }
  .atlas-map-meta>span {
    max-width:160px;
    background:#f5f6f7db;
    padding:7px
  }
  .atlas-map-meta button {
    max-width:125px;
    font-size:8px
  }
  .atlas-card {
    position:absolute;
    left:15px;
    top:78px;
    width:min(290px,calc(100% - 30px));
    max-height:calc(100% - 150px);
    margin:0;
    padding:18px
  }
  .atlas-card>img {
    height:120px
  }
  .atlas-card-top>b {
    font-size:56px
  }
  .atlas-card h3 {
    font-size:31px
  }
  .atlas-card p {
    font-size:10px
  }
  .atlas-card>.text-link {
    font-size:9px;
    gap:10px
  }
  .atlas-point>span {
    font-size:8px;
    top:49px
  }
  .atlas-origin small {
    font-size:8px
  }
  .atlas-place-number>span {
    font-size:9px
  }
  .location .atlas-places h3 {
    font-size:33px
  }
  .drawing-caption h2 {
    font-size:clamp(39px,11.4vw,49px)
  }
  .drawing-caption>.eyebrow {
    font-size:9px
  }
  .architecture-drawing-screen {
    height:100svh;
    min-height:600px
  }
  .architecture-drawing-screen>.eyebrow {
    font-size:9px;
    max-width:135px
  }
  .architecture-drawing-screen>.architecture-toggle {
    font-size:9px;
    max-width:165px
  }
  .architecture-copy>h2 {
    font-size:clamp(30px,8.7vw,40px);
    line-height:1.12
  }
  .architecture-copy>p {
    font-size:11px
  }
  .panorama-journey {
    height:auto
  }
  .panorama-journey .panorama {
    position:relative;
    min-height:100svh
  }
  .panorama-journey .panorama>img {
    width:100%;
    transform:scale(1.04)!important
  }
  .panorama-guide {
    font-size:9px
  }
  .panorama-journey .panorama>.eyebrow {
    font-size:10px
  }
  .tour-chapters {
    top:82px;
    left:14px;
    right:14px
  }
  .tour-chapters button {
    font-size:8px;
    padding:10px 7px;
    min-height:44px
  }
  .tour-view.expanded-tour {
    height:85svh;
    min-height:420px
  }
  .expanded-tour .tour-toolbar h3 {
    font-size:30px;
    max-width:220px
  }
  .expanded-tour .tour-toolbar p {
    font-size:8px
  }
  .interior-frame {
    height:92svh;
    min-height:610px
  }
  .interior-frame .interior-tabs {
    gap:12px;
    padding:40px 5% 18px
  }
  .interior-tabs button {
    font-size:9px;
    min-height:44px
  }
  .interior-thumb {
    height:40px
  }
  .interior-expand {
    font-size:9px
  }
  .interior-frame>.eyebrow {
    font-size:9px;
    max-width:43%;
    line-height:1.5
  }
  .interior-heading h2 {
    font-size:clamp(43px,12vw,55px)
  }
  .interior-heading>.eyebrow {
    font-size:10px
  }
  .story-toggle {
    font-size:10px
  }
  .story-text {
    font-size:12px
  }
  .atlas-strip>.eyebrow {
    font-size:9px
  }
  .home-card {
    max-height:calc(100% - 190px)
  }
  .home-extra {
    font-size:9px
  }
  .masterplan button.map-touch-toggle {
    display:block;
    left:15px;
    bottom:50px
  }
  .masterplan.is-map-active .map-touch-toggle {
    background:#263440;
    color:#f5f6f7
  }
  
}
 @media(max-height:600px) and (orientation:landscape) {
  .hero-journey,.panorama-journey {
    height:auto
  }
  .hero-journey .hero,.panorama-journey .panorama {
    position:relative;
    min-height:100svh
  }
  .hero-journey .orbit {
    width:90px;
    height:90px;
    top:auto;
    bottom:18%;
    max-width:18vw;
    max-height:18vw
  }
  .hero-journey .orbit-res {
    left:5%
  }
  .hero-journey .orbit-villa {
    right:5%
  }
  .hero-journey .hero-title {
    top:26%
  }
  .hero-journey .hero-title h1 {
    font-size:min(18vw,130px)
  }
  .hero-journey .hero-title>span {
    font-size:27px
  }
  .hero-category-caption {
    display:none
  }
  .hero-select-again,.intro-replay {
    display:none
  }
  .intro-note {
    display:none
  }
  .hero-place {
    display:none
  }
  .hero-bottom {
    bottom:15px
  }
  .scroll-link {
    margin-top:10px
  }
  .atlas-card {
    max-height:calc(100% - 110px);
    top:65px
  }
  .atlas-card>img {
    height:80px
  }
  .atlas-card-top {
    margin-bottom:10px
  }
  .atlas-card-top>b {
    font-size:44px
  }
  .tour-view.expanded-tour {
    height:90svh;
    min-height:0
  }
  .tour-chapters {
    top:50px
  }
  .expanded-tour .tour-toolbar h3 {
    font-size:24px;
    max-width:65%
  }
  .expanded-tour .tour-toolbar p {
    display:none
  }
  .tour-location-caption {
    top:16px
  }
  .sea-compass {
    display:none
  }
  .expanded-tour .tour-pan-controls {
    flex-direction:row
  }
  .tour-hotspot {
    display:none
  }
  .interior-frame {
    height:650px
  }
  
}
 @media(prefers-reduced-motion:reduce) {
  .hero-journey,.panorama-journey {
    height:auto
  }
  .hero-journey .hero,.panorama-journey .panorama {
    position:relative
  }
  .architecture-drawing-screen>img:first-child {
    clip-path:none;
    transition:none
  }
  .architecture-drawing-screen .architecture-render-layer {
    transition:none
  }
  .intro-replay {
    display:none
  }
  .interior-outgoing {
    display:none
  }
  
}
  .skip-link {
  position:fixed;
  top:12px;
  left:12px;
  z-index:1000;
  background:#263440;
  color:#ffffff;
  padding:14px 20px;
  font:12px Mono;
  transform:translateY(-180%)
}
.skip-link:focus {
  transform:none
}
.drag-scrolling {
  cursor:grabbing;
  scroll-snap-type:none!important;
  user-select:none
}
.drag-scrolling * {
  user-select:none;
  cursor:grabbing
}
.atlas-places,.amenities {
  cursor:grab
}
.interior-frame {
  touch-action:pan-y pinch-zoom
}
.masterplan:has(.home-card:not([hidden])) .map-touch-toggle {
  display:none
}
@media(pointer:coarse) {
  .masterplan button.map-touch-toggle {
    display:block
  }
  
}
 :root {
  --accent:#526b80
}
.hero-shade {
  background:linear-gradient(180deg,#263440d1 0%,#26344044 32%,#26344044 64%,#263440b3 100%)
}
.hero-journey .orbit {
  background:#26344088
}
.hero-category-caption {
  background:#26344099;
  padding:6px 10px;
  width:max-content;
  max-width:75%;
  line-height:1.4
}
.intro-note>span:first-child,.hero-place {
  text-shadow:0 1px 5px #263440
}
.panorama:after {
  background:linear-gradient(180deg,#2634401a 10%,#26344033 65%,#263440c4 100%)
}
.interior-frame:before {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,#2634408c 0%,transparent 30%,transparent 70%);
  z-index:3;
  pointer-events:none
}
@media(max-width:600px) {
  .header-right .floor-trigger {
    font-size:9px;
    min-width:70px;
    max-width:90px;
    min-height:44px;
    text-align:right
  }
  .hero-category-caption {
    padding:5px 8px;
    max-width:80%
  }
  
}
 #menu-toggle {
  min-width:44px;
  min-height:44px
}
#privacy,.footer-top>.text-link,#menu a,.atlas-sea {
  min-height:44px
}
#privacy {
  min-width:70px
}
.lot:focus-visible polygon {
  stroke-width:4;
  stroke:#263440
}
.masterplan:not(.sketch-view) .lot:focus-visible polygon {
  stroke:white
}
  /* Restored editorial motion: shared coordinate planes, readable moving typography. */ .motion-copy.pending {
  opacity:1;
  transform:none;
  translate:none
}
.motion-word {
  display:inline-block;
  overflow:clip;
  vertical-align:bottom;
  padding-bottom:.12em;
  margin-bottom:-.12em;
  line-height:inherit
}
.motion-ink {
  display:inline-block;
  transform:translate3d(0,112%,0) rotate(3deg);
  opacity:0;
  transition:transform 1s cubic-bezier(.16,1,.3,1),opacity .7s;
  transition-delay:var(--word-delay,0ms);
  will-change:transform
}
.motion-entered .motion-ink {
  transform:translate3d(0,0,0) rotate(0);
  opacity:1
}
.motion-copy .inline-label {
  display:inline-block;
  opacity:0;
  translate:0 15px;
  transition:opacity 1s,translate 1s
}
.motion-copy.motion-entered .inline-label {
  opacity:1;
  translate:0 0
}
.choreographed:not(.motion-copy) {
  opacity:0;
  translate:0 38px;
  transition:opacity 1s var(--item-delay,0ms),translate 1.2s cubic-bezier(.16,1,.3,1) var(--item-delay,0ms)
}
.choreographed.motion-entered:not(.motion-copy) {
  opacity:1;
  translate:0 0
}
.concept-title {
  perspective:900px
}
.gallery-frame {
  overflow:hidden
}
.gallery-frame>img {
  transform:translateY(var(--gallery-travel,0px)) scale(1.12);
  transition:opacity .6s!important;
  will-change:transform
}
.gallery-caption {
  transition:opacity .5s,translate .8s
}
.atlas-place-number>b {
  display:inline-block;
  transform:translateY(50%) rotate(-8deg);
  opacity:0;
  transition:transform 1.1s cubic-bezier(.16,1,.3,1),opacity .8s
}
.motion-entered .atlas-place-number>b {
  transform:none;
  opacity:1
}
.atlas-places>button>img {
  clip-path:inset(0 0 100% 0);
  transition:clip-path 1.2s cubic-bezier(.16,1,.3,1) .15s,filter .5s
}
.atlas-places>button.motion-entered>img {
  clip-path:inset(0)
}
 .location-map.atlas-map {
  height:56.22vw;
  min-height:640px;
  max-height:none
}
.atlas-viewport {
  overflow:auto;
  scrollbar-width:thin;
  overscroll-behavior:contain
}
.atlas-landscape {
  position:relative;
  inset:auto;
  min-width:100%;
  transform:none
}
.atlas-art {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:fill
}
.atlas-routes {
  width:100%;
  height:100%
}
.atlas-origin {
  z-index:3;
  width:60px;
  height:60px;
  font-size:40px
}
.atlas-origin small {
  top:70px
}
.atlas-point {
  box-shadow:0 0 0 5px #f5f6f750
}
.atlas-point:after {
  content:'';
  position:absolute;
  inset:-6px;
  border:1px solid #26344055;
  border-radius:50%;
  opacity:0
}
.atlas-point.active:after {
  animation:marker-ripple 2.2s infinite
}
.atlas-point>span {
  top:49px;
  background:#f5f6f7d9;
  padding:3px 5px;
  max-width:150px;
  white-space:normal;
  text-align:center;
  width:max-content
}
.atlas-point.active>span,.atlas-point:hover>span {
  background:#f5f6f7
}
.atlas-point.active {
  z-index:6
}
.atlas-origin small {
  background:#f5f6f7df;
  padding:4px
}
.atlas-card {
  box-shadow:0 20px 80px #26344020
}
 .architecture-journey {
  height:175svh;
  position:relative
}
.architecture-journey .architecture-drawing-screen {
  position:sticky;
  top:0;
  height:100svh;
  min-height:600px
}
.architecture-viewport {
  position:absolute;
  inset:0;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  touch-action:pan-x pan-y
}
.architecture-viewport::-webkit-scrollbar {
  display:none
}
.architecture-canvas {
  position:relative;
  isolation:isolate;
  transform-origin:70% 50%;
  transform:translateY(calc(var(--architecture-progress,0)*-26px)) scale(calc(1.015 + var(--architecture-progress,0)*.055));
  will-change:transform
}
.architecture-canvas>img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:fill
}
.architecture-canvas>img:first-child {
  mix-blend-mode:multiply;
  filter:grayscale(1) contrast(1.04);
  opacity:.94;
  clip-path:inset(0 100% 0 0);
  transition:clip-path 2s cubic-bezier(.16,1,.3,1)
}
.drawing-visible .architecture-canvas>img:first-child {
  clip-path:inset(0)
}
.architecture-canvas .architecture-render-layer {
  z-index:1;
  clip-path:circle(0 at 75% 55%);
  transition:clip-path 1.5s cubic-bezier(.16,1,.3,1)
}
.render-revealed .architecture-canvas .architecture-render-layer {
  clip-path:circle(150% at 75% 55%)
}
.architecture-home {
  position:absolute;
  transform:translate(-50%,-50%);
  z-index:3;
  display:flex;
  align-items:center;
  gap:10px;
  min-width:44px;
  min-height:44px;
  color:var(--ink);
  opacity:0;
  transition:opacity .7s;
  transition-delay:calc(var(--marker-index)*100ms + 400ms)
}
.drawing-visible .architecture-home {
  opacity:1
}
.architecture-home[hidden] {
  display:none
}
.architecture-home>b {
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  min-width:44px;
  border-radius:50%;
  border:1px solid #26344099;
  background:#f5f6f7ed;
  box-shadow:0 0 0 6px #f5f6f755;
  font:24px Canela;
  transition:background .3s,color .3s
}
.architecture-home>span {
  position:absolute;
  left:50px;
  top:6px;
  text-align:left;
  font-size:9px;
  letter-spacing:.06em;
  background:#f5f6f7eb;
  padding:7px 10px;
  opacity:0;
  transform:translateX(-8px);
  transition:.3s;
  white-space:nowrap;
  pointer-events:none
}
.architecture-home small {
  display:block;
  font-size:7px;
  margin-top:6px
}
.architecture-home:hover,.architecture-home:focus-visible {
  z-index:5
}
.architecture-home:hover>span,.architecture-home:focus-visible>span {
  opacity:1;
  transform:none
}
.architecture-home:hover>b,.architecture-home:focus-visible>b {
  background:var(--ink);
  color:var(--sand)
}
.architecture-home:before {
  content:'';
  position:absolute;
  inset:-5px;
  border:1px solid #26344066;
  border-radius:50%;
  animation:marker-ripple 3.2s calc(var(--marker-index)*.25s) infinite
}
.architecture-collections {
  position:absolute;
  z-index:5;
  left:5%;
  top:90px;
  display:flex;
  gap:4px;
  padding:3px;
  background:#f5f6f7e8;
  border:1px solid var(--line)
}
.architecture-collections button {
  padding:10px 15px;
  min-height:44px;
  font-size:9px
}
.architecture-collections button[aria-pressed=true] {
  background:var(--ink);
  color:var(--sand)
}
.architecture-quick {
  display:none
}
.drawing-caption {
  pointer-events:none
}
.architecture-drawing-screen>.eyebrow {
  z-index:5
}
.architecture-toggle {
  z-index:5
}
.drawing-caption h2 {
  font-size:clamp(45px,6vw,96px);
  line-height:1.02
}
.drawing-caption .motion-word {
  padding-bottom:.18em;
  margin-bottom:-.18em
}
 .panorama-journey {
  height:170svh
}
.panorama-journey .panorama {
  position:sticky;
  top:0;
  height:100svh
}
.panorama-journey .panorama>img {
  transform:translateX(calc(var(--panorama-sweep,0)*-18%)) scale(1.08)!important;
  will-change:transform
}
.panorama-journey .panorama h2 {
  top:32%;
  font-size:clamp(65px,11vw,180px);
  transform:translate(-50%,calc(-50% - var(--panorama-sweep,0)*20px));
  z-index:2
}
.panorama-highlights {
  position:absolute;
  z-index:4;
  left:5%;
  right:5%;
  bottom:120px;
  display:flex;
  justify-content:space-between;
  gap:30px
}
.panorama-highlight {
  display:flex;
  align-items:center;
  gap:16px;
  min-height:60px;
  color:white;
  text-align:left
}
.panorama-highlight>b {
  font:48px/1 Canela;
  border-bottom:1px solid #ffffff80;
  padding-bottom:9px
}
.panorama-highlight>span {
  font-size:10px;
  letter-spacing:.08em
}
.panorama-highlight small {
  display:block;
  margin-top:8px;
  font-size:8px;
  opacity:.75
}
.panorama-highlight:hover>b {
  transform:translateY(-8px);
  transition:transform .5s
}
.panorama-guide {
  bottom:55px;
  pointer-events:none
}
.panorama-guide>span:last-child {
  display:none
}
.panorama-explore {
  position:absolute;
  z-index:5;
  right:5%;
  bottom:35px;
  min-height:44px;
  color:white;
  border-bottom:1px solid #ffffff80;
  font-size:10px
}
.tour-chapters button {
  transition:background .3s,transform .3s
}
.tour-chapters button.active {
  transform:translateY(3px)
}
 @keyframes marker-ripple {
  0% {
    scale:1;
    opacity:.6
  }
  85%,100% {
    scale:1.55;
    opacity:0
  }
  
}
 @media(max-width:900px) {
  .panorama-highlight {
    gap:10px
  }
  .panorama-highlight>b {
    font-size:38px
  }
  .panorama-highlight>span {
    font-size:8px
  }
  .panorama-highlight small {
    font-size:7px
  }
  .architecture-home>span {
    display:none
  }
  
}
 @media(max-width:600px) {
  .location-map.atlas-map {
    height:78svh;
    min-height:560px
  }
  .atlas-landscape {
    min-width:0
  }
  .atlas-origin {
    width:52px;
    height:52px;
    font-size:34px
  }
  .atlas-origin small {
    top:60px;
    font-size:7px
  }
  .atlas-point>span {
    font-size:8px;
    max-width:110px
  }
  .atlas-map-meta {
    font-size:6px
  }
  .architecture-journey {
    height:145svh
  }
  .architecture-journey .architecture-drawing-screen {
    height:100svh;
    min-height:600px
  }
  .architecture-collections {
    top:78px;
    left:4%
  }
  .architecture-collections button {
    font-size:8px;
    padding:8px 12px
  }
  .architecture-toggle {
    right:4%;
    top:17px;
    font-size:8px;
    max-width:150px
  }
  .architecture-quick {
    display:flex;
    position:absolute;
    bottom:160px;
    left:4%;
    right:4%;
    z-index:5;
    gap:7px;
    flex-wrap:wrap;
    pointer-events:none
  }
  .architecture-quick button {
    width:44px;
    height:44px;
    font:21px Canela;
    border:1px solid #26344066;
    border-radius:50%;
    background:#f5f6f7eb;
    pointer-events:auto
  }
  .drawing-caption {
    left:4%;
    right:4%;
    bottom:25px
  }
  .drawing-caption h2 {
    font-size:clamp(35px,10.4vw,48px)
  }
  .drawing-caption>.eyebrow {
    font-size:8px;
    margin-top:12px;
    line-height:1.6
  }
  .architecture-home>b {
    font-size:21px
  }
  .architecture-canvas {
    transform:translateY(calc(var(--architecture-progress,0)*-12px)) scale(calc(1.01 + var(--architecture-progress,0)*.025))
  }
  .panorama-journey {
    height:145svh
  }
  .panorama-journey .panorama {
    position:sticky;
    top:0;
    height:100svh;
    min-height:600px
  }
  .panorama-journey .panorama>img {
    width:125%;
    max-width:none;
    transform:translateX(calc(var(--panorama-sweep,0)*-18%)) scale(1.06)!important
  }
  .panorama-journey .panorama h2 {
    font-size:16vw;
    top:31%;
    line-height:1.06
  }
  .panorama-highlights {
    bottom:155px;
    left:5%;
    right:5%;
    gap:10px;
    align-items:start
  }
  .panorama-highlight {
    display:block;
    flex:1;
    min-width:0
  }
  .panorama-highlight>b {
    display:inline-block;
    font-size:38px;
    margin-bottom:13px
  }
  .panorama-highlight>span {
    display:block;
    font-size:8px;
    line-height:1.4;
    letter-spacing:0
  }
  .panorama-highlight small {
    font-size:6px;
    line-height:1.7;
    margin-top:6px
  }
  .panorama-guide {
    bottom:105px;
    font-size:8px;
    max-width:210px
  }
  .panorama-explore {
    left:5%;
    right:auto;
    bottom:34px;
    font-size:9px
  }
  .motion-word {
    max-width:100%
  }
  .atlas-places>button.choreographed {
    transition-delay:0ms
  }
  .gallery-frame>img {
    transform:translateY(var(--gallery-travel,0px)) scale(1.14)
  }
  
}
 @media(max-height:600px) and (orientation:landscape) {
  .architecture-journey,.panorama-journey {
    height:auto
  }
  .architecture-journey .architecture-drawing-screen,.panorama-journey .panorama {
    position:relative;
    height:650px;
    min-height:650px
  }
  .architecture-quick {
    display:none
  }
  .panorama-journey .panorama h2 {
    font-size:95px
  }
  .panorama-highlights {
    bottom:135px
  }
  
}
 @media(prefers-reduced-motion:reduce) {
  .motion-ink,.motion-copy .inline-label,.choreographed:not(.motion-copy),.atlas-place-number>b {
    opacity:1;
    transform:none;
    translate:none;
    transition:none;
    will-change:auto
  }
  .atlas-places>button>img,.architecture-canvas>img:first-child {
    clip-path:inset(0);
    transition:none
  }
  .architecture-journey,.panorama-journey {
    height:auto
  }
  .architecture-journey .architecture-drawing-screen,.panorama-journey .panorama {
    position:relative
  }
  .architecture-canvas,.gallery-frame>img {
    transform:none;
    will-change:auto
  }
  .architecture-home {
    opacity:1;
    transition:none
  }
  .architecture-home:before,.atlas-point.active:after {
    animation:none
  }
  .panorama-journey .panorama>img {
    transform:none!important;
    width:100%
  }
  .panorama-highlight:hover>b {
    transform:none
  }
  .motion-copy {
    opacity:1;
    transform:none
  }
  
}
 .gallery-outgoing {
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  width:100%;
  height:100%;
  object-fit:cover
}
.gallery-caption,.gallery-controls {
  z-index:3
}
.motion-entered .motion-ink {
  will-change:auto
}
 @media(max-width:600px) {
  .atlas-card {
    position:fixed;
    left:15px;
    right:15px;
    top:auto;
    bottom:max(15px,env(safe-area-inset-bottom));
    width:auto;
    max-height:70svh;
    z-index:60;
    box-shadow:0 15px 80px #26344066
  }
  .atlas-card>img {
    height:115px
  }
  
}
 @keyframes atlas-sheet-in {
  from {
    opacity:0;
    transform:translateY(12px)
  }
  to {
    opacity:1;
    transform:translateY(0)
  }
  
}
@media(max-width:600px) {
  .atlas-card {
    animation:atlas-sheet-in .55s cubic-bezier(.16,1,.3,1) both
  }
  
}
@media(max-width:600px) and (prefers-reduced-motion:reduce) {
  .atlas-card {
    animation:none
  }
  
}
 .motion-copy {
  word-spacing:.04em
}
.panorama-journey .panorama h2 {
  left:0;
  right:0;
  width:auto;
  transform:translateY(calc(-50% - var(--panorama-sweep,0)*20px))
}
.panorama-journey .panorama>.panorama-explore {
  left:auto;
  right:5%;
  bottom:35px;
  transform:none;
  white-space:normal
}
.panorama-journey .panorama>.panorama-guide {
  left:5%;
  right:5%;
  bottom:55px;
  transform:none;
  white-space:normal;
  max-width:none
}
@media(max-width:600px) {
  .panorama-journey .panorama>.panorama-explore {
    left:5%;
    right:auto;
    bottom:34px
  }
  .panorama-journey .panorama>.panorama-guide {
    left:5%;
    right:5%;
    bottom:105px;
    max-width:230px
  }
  
}
 .atlas-point>span {
  opacity:0;
  transition:opacity .25s;
  pointer-events:none
}
.atlas-point:hover>span,.atlas-point:focus-visible>span,.atlas-point.active>span {
  opacity:1
}
 /* Panoramic viewing has distinct scenes and a visible, two-axis camera. */ .tour-view {
  touch-action:none;
  cursor:grab
}
.tour-view.camera-dragging {
  cursor:grabbing
}
.tour-view>img {
  object-fit:fill;
  min-width:0
}
.tour-shade {
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(#26344065,transparent 28%,transparent 60%,#263440bb);
  z-index:1
}
.tour-location-caption,.tour-chapters,.tour-toolbar {
  z-index:3
}
.tour-view .tour-location-caption {
  max-width:80%;
  font-size:9px
}
.tour-view .tour-toolbar {
  pointer-events:none;
  align-items:end
}
.tour-view .tour-toolbar button {
  pointer-events:auto
}
.expanded-tour .tour-toolbar h3 {
  font-size:clamp(30px,4vw,58px);
  max-width:650px;
  line-height:1.04
}
.tour-camera {
  display:grid;
  grid-template-columns:repeat(4,44px);
  gap:8px;
  flex-shrink:0
}
.tour-camera button,.tour-expand {
  display:grid;
  place-items:center;
  min-width:44px;
  min-height:44px;
  width:44px;
  height:44px;
  background:#f5f6f7ee;
  color:#263440;
  border:1px solid #ffffff55;
  border-radius:50%;
  font:20px Canela;
  text-shadow:none
}
.tour-camera button:hover,.tour-expand:hover {
  background:#263440;
  color:#f5f6f7
}
.tour-camera button:focus-visible,.tour-chapters button:focus-visible {
  outline:2px solid white;
  outline-offset:3px
}
.tour-expand {
  position:absolute;
  z-index:5;
  top:16px;
  right:70px
}
.tour-load {
  position:absolute;
  z-index:6;
  left:50%;
  top:48%;
  transform:translate(-50%,-50%);
  padding:18px 24px;
  background:#f5f6f7ed;
  color:#263440;
  font-size:10px;
  max-width:80%;
  text-align:center
}
.tour-load[hidden],.tour-back[hidden] {
  display:none
}
.tour-back {
  margin-top:16px;
  color:white;
  font-size:9px;
  min-height:44px;
  border-bottom:1px solid #ffffff80
}
.floor-sea {
  display:flex;
  min-height:44px;
  margin-top:18px;
  font-size:10px;
  text-align:left
}
.tour-dialog.is-full-view {
  width:100vw!important;
  height:100svh!important;
  max-width:none!important;
  max-height:none!important;
  inset:0;
  margin:0!important
}
.is-full-view .tour-view.expanded-tour {
  height:100svh;
  min-height:0
}
.is-full-view .dialog-toolbar {
  top:15px
}
 @media(max-width:600px) {
  .tour-view.expanded-tour {
    height:88svh;
    min-height:420px
  }
  .tour-view .tour-toolbar {
    left:15px;
    right:15px;
    bottom:18px;
    display:block
  }
  .expanded-tour .tour-toolbar h3 {
    font-size:30px;
    max-width:100%;
    margin-bottom:8px
  }
  .expanded-tour .tour-toolbar p {
    font-size:8px;
    max-width:100%
  }
  .tour-camera {
    display:grid;
    grid-template-columns:repeat(4,44px);
    gap:5px;
    margin-top:14px;
    overflow-x:auto;
    padding:3px
  }
  .tour-camera button {
    min-width:44px;
    min-height:44px;
    width:44px;
    max-width:none;
    height:44px;
    border-radius:4px;
    font-size:20px
  }
  .tour-expand {
    right:60px;
    top:12px
  }
  .tour-view .tour-location-caption {
    top:68px;
    left:15px;
    font-size:8px;
    max-width:90%
  }
  .tour-chapters {
    top:105px
  }
  .tour-chapters button {
    font-size:8px;
    padding:9px 5px
  }
  .tour-back {
    margin-top:5px;
    min-height:36px;
    font-size:8px
  }
  .floor-sea {
    font-size:9px
  }
  .tour-load {
    font-size:8px;
    padding:14px
  }
  .tour-dialog .dialog-toolbar {
    z-index:10
  }
  
}
 @media(max-height:600px) and (orientation:landscape) {
  .tour-view.expanded-tour {
    height:90svh;
    min-height:0
  }
  .expanded-tour .tour-toolbar h3 {
    font-size:24px
  }
  .tour-view .tour-location-caption {
    top:15px;
    max-width:65%
  }
  .tour-chapters {
    top:50px
  }
  .tour-camera {
    display:flex;
    gap:4px
  }
  .tour-camera button {
    width:36px;
    min-width:36px;
    height:40px;
    min-height:40px
  }
  .tour-view .tour-toolbar {
    display:flex;
    gap:15px;
    bottom:15px
  }
  .tour-back {
    margin-top:0
  }
  
}
 @media(prefers-reduced-motion:reduce) {
  .tour-view>img {
    transition:none!important
  }
  
}
 /* Coastal Atlas only: horizontal exploration must not trap vertical page scrolling. */ .location .atlas-viewport {
  overflow-x:auto;
  overflow-y:hidden;
  overscroll-behavior-x:contain;
  overscroll-behavior-y:auto;
  touch-action:pan-x pan-y pinch-zoom
}
  /* Small-screen controls retain comfortable touch targets and readable captions. */ @media(max-width:380px) {
  .tour-camera {
    grid-template-columns:repeat(4,44px)
  }
  
}
 @media(max-height:600px) and (orientation:landscape) {
  .tour-camera button {
    width:44px;
    min-width:44px;
    height:44px;
    min-height:44px
  }
  
}
 /* Usability refinements keep the original composition and illustrations. */ .zoom-controls button {
  min-width:44px;
  min-height:44px
}
.segmented button,.category-links button,.floor-tabs button,.journal-switch button {
  min-height:44px
}
.gallery-caption {
  max-width:calc(100% - 180px);
  font-size:11px
}
.atlas-map-meta,.atlas-strip,.plan-note,.footer-bottom {
  font-size:10px
}
.home-card p {
  font-size:11px;
  line-height:1.6
}
.masterplan-legend {
  font-size:10px
}
.intro-note {
  font-size:10px
}
 @media(max-width:600px) {
  .hero-coordinate {
    font-size:9px
  }
  .intro-note {
    font-size:9px
  }
  .gallery-caption {
    bottom:94px;
    left:18px;
    max-width:85%;
    font-size:11px
  }
  .gallery-controls {
    right:18px;
    bottom:18px
  }
  .interior-tabs button {
    font-size:10px;
    min-height:44px
  }
  .expanded-tour .tour-toolbar p,.tour-chapters button,.tour-view .tour-location-caption,.tour-back {
    font-size:10px
  }
  .tour-back {
    min-height:44px
  }
  .floor-tabs {
    flex-wrap:wrap;
    gap:8px 18px
  }
  .floor-tabs button {
    font-size:10px
  }
  .floor-content .plan-note {
    font-size:10px
  }
  .footer-bottom {
    font-size:9px
  }
  .home-card p {
    font-size:11px
  }
  
}
 @media(max-width:600px){input{font-size:16px}}

.floor-trigger,#close-home,.atlas-card-close{min-width:44px;min-height:44px}

/* Approved paper, pearl and slate palette. */
:root{--sand:#F5F6F7;--ink:#263440;--accent:#526B80;--mist:#E3E8EC;--white:#FFFFFF;--line:#CBD4DA}

/* Vertical-to-horizontal scenes: native page scrolling with bounded sticky stages. */
.horizontal-journey{position:relative;min-width:0;max-width:100%}
.horizontal-stage{display:flow-root;min-width:0;width:100%}
.horizontal-enabled>.horizontal-stage{position:sticky;z-index:2}
.vertical-driven{scroll-snap-type:none!important;scroll-behavior:auto!important;overflow-anchor:none;touch-action:pan-x pan-y pinch-zoom;scrollbar-width:none}
.vertical-driven::-webkit-scrollbar{display:none}
.vertical-driven:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}
.horizontal-journey[data-horizontal-scene="amenities"]{margin-top:65px}
.horizontal-journey .amenities{margin-top:0}
.horizontal-journey .location-map.atlas-map{height:min(78svh,720px);min-height:0}
.horizontal-enabled .atlas-places>button{opacity:1;translate:none}
.horizontal-enabled .atlas-places>button>img{clip-path:inset(0)}
.horizontal-enabled .atlas-place-number>b{opacity:1;transform:none}
/* clip contains wide artwork without creating a competing scroll container. */
.location.pad,.lifestyle.pad{overflow:clip}
.journey-hint{display:none;align-items:center;justify-content:space-between;gap:20px;padding:12px 5%;font-size:10px;min-height:38px;color:var(--ink)}
.horizontal-enabled>.horizontal-stage>.journey-hint{display:flex}
.journey-hint>span:first-child{flex:1;min-width:0;max-width:220px}
.journey-track{width:90px;height:2px;background:var(--line);flex-shrink:0}
.journey-track i{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(var(--journey-progress,0))}
.journey-continue{display:inline-flex;align-items:center;min-height:44px;border-bottom:1px solid var(--line);white-space:nowrap}
/* Stable image geometry prevents range drift and resize oscillation. */
.architecture-journey[data-horizontal-scene] .architecture-drawing-screen{height:100svh;min-height:0}
.architecture-journey[data-horizontal-scene] .architecture-canvas{transform:none;will-change:auto}
@media(max-width:600px){
 .horizontal-journey[data-horizontal-scene="amenities"]{margin-top:30px}
 .horizontal-journey .location-map.atlas-map{height:78svh;min-height:0}
 .horizontal-journey .atlas-places img{height:clamp(140px,30svh,245px)}
 .horizontal-journey .atlas-place-number>b{font-size:64px}
 .horizontal-journey .amenity img{height:clamp(160px,42svh,310px)}
 .journey-hint{gap:10px;font-size:9px;padding-top:6px;padding-bottom:6px}
 .journey-track{width:50px}
}
@media(max-height:500px) and (orientation:landscape){
 .horizontal-journey .atlas-places img,.horizontal-journey .amenity img{height:30svh}
 .horizontal-journey .atlas-place-number>b{font-size:44px}
 .horizontal-journey .atlas-place-number{margin-bottom:12px}
 .horizontal-journey .atlas-places h3,.horizontal-journey .amenity h3{font-size:25px}
}
@media(prefers-reduced-motion:reduce){.horizontal-enabled>.horizontal-stage{position:static}}

/* All homes remain visible; collection controls highlight rather than filter. */
.architecture-home>b{font:13px Mono,monospace}
.architecture-home:before{display:none}
.architecture-home{transition-delay:calc(min(var(--marker-index),8)*65ms + 200ms)}
.architecture-home.collection-highlight>b,.architecture-collections button[aria-pressed="true"]{background:#365F91;color:#fff;border-color:#365F91}
.architecture-quick{display:block;position:absolute;top:150px;bottom:auto;left:5%;right:auto;width:220px;z-index:5;pointer-events:auto}
.architecture-quick select{width:100%;min-height:44px;padding:10px 28px 10px 12px;border:1px solid var(--line);border-radius:0;background:var(--paper,#F5F6F7);color:var(--ink);font:12px Mono,monospace}
.masterplan .lot.collection-highlight polygon{fill:#365f9140;stroke:#365F91}
.masterplan .lot.collection-highlight>circle:not(.lot-ring){fill:#365F91;stroke:#fff}
.masterplan .lot.collection-highlight>text{fill:#fff}
.masterplan .lot .lot-ring{animation:none;opacity:0}
.masterplan .lot.selected polygon{stroke-width:3;fill:#365f9170}
@media(max-width:600px){.architecture-quick{top:138px;left:4%;width:215px;bottom:auto;right:auto}.architecture-quick select{font-size:16px}.architecture-home>b{font-size:12px}}
/* The drawing stays unobstructed on touch screens; its home markers remain active. */
@media(max-width:900px){.architecture-quick{display:none}}

/* Release polish: stable arrow slots, readable labels, bounded mobile controls. */
.hero-journey .orbit{gap:12px}
.hero-journey .orbit>.orbit-arrow{position:static;inset:auto;display:block;line-height:1;font-size:24px;flex:none}
.journal-grid h3{padding-inline-end:36px;line-height:1.12;overflow-wrap:normal}
.journal-grid h3>span{inset-inline-end:0;bottom:4px;line-height:1;white-space:nowrap}
.amenity h3{gap:16px;align-items:baseline;line-height:1.12}
.amenity h3>b{flex:none;font:24px/1 Mono,monospace}
.atlas-places>button{position:relative;text-align:left;min-width:0}
.atlas-places h3{padding-inline-end:36px;line-height:1.12}
.atlas-place-arrow{position:absolute;right:0;bottom:25px;top:auto;font:24px/1 Mono,monospace}
.journal-grid>button,.amenity{min-width:0}
.category-links,.segmented,.floor-tabs{flex-wrap:wrap;row-gap:8px}
.motion-ink{will-change:auto}
.motion-entered .motion-ink{will-change:auto}
.drawing-caption{pointer-events:none}
.interior-frame .interior-tabs{isolation:isolate}
.interior-tabs button{line-height:1.4;min-height:44px}
.atlas-strip>span{max-width:60%;line-height:1.6}
.atlas-strip>div,.gallery-controls,.interior-navigation{flex-shrink:0}
.home-extra{flex-wrap:wrap;gap:8px 16px}
.home-card .text-link{gap:12px;max-width:100%;line-height:1.6}
.home-card p,.plan-note{line-height:1.7}
.hero-journey .hero{min-height:0}
/* Compositor resources belong to large moving views, not every word and thumbnail. */
.interior-outgoing{will-change:auto}
@media(max-width:600px){
 .hero-journey .orbit{gap:8px}
 .hero-journey .orbit>.orbit-arrow{font-size:20px}
 .journal-head{gap:25px;align-items:flex-start}
 .journal-switch{width:100%;gap:16px;flex-wrap:wrap}
 .journal-switch button{min-height:44px;font-size:10px}
 .journal-grid h3{font-size:clamp(32px,9.6vw,42px);padding-inline-end:36px}
 .journal-grid h3>span{font-size:23px}
 .atlas-strip{gap:16px;padding-top:28px}
 .atlas-strip>span{font-size:9px}
 .atlas-strip .round{width:44px;height:44px}
 .panorama-journey .panorama{height:100svh;min-height:0}
 .panorama-highlights{left:5%;right:5%;bottom:140px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
 .panorama-highlight{min-width:0;align-items:flex-start;gap:9px;flex-direction:column}
 .panorama-highlight>b{font-size:42px;line-height:1;padding-bottom:6px}
 .panorama-highlight>span{font-size:10px;line-height:1.6;letter-spacing:.02em}
 .panorama-highlight small{font-size:8px;line-height:1.6;margin-top:4px}
 .panorama-journey .panorama>.panorama-guide{bottom:85px;max-width:none;font-size:9px;line-height:1.6}
 .panorama-journey .panorama>.panorama-explore{bottom:22px;font-size:10px;min-height:44px}
 .panorama-journey .panorama h2{font-size:clamp(42px,12vw,65px);top:29%;line-height:1.05}
 .interior-heading{gap:20px}
 .interior-navigation button{width:44px;height:44px}
 .contact-form h2{font-size:clamp(42px,12vw,62px);line-height:1.08}
 .footer-top{gap:30px}
}
@media(max-width:600px) and (max-height:650px){
 .hero-journey .hero-title{top:32%}
 .hero-journey .hero-title h1{font-size:25vw}
 .hero-journey .orbit-res{width:82px;height:82px;top:15%;left:6%}
 .hero-journey .orbit-villa{width:78px;height:78px;bottom:24%;right:7%}
 .intro-note{bottom:134px;max-width:88%;gap:10px}
 .intro-note>span:first-child{max-width:130px;white-space:normal}
 .hero-select-again{bottom:85px;font-size:8px}
 .intro-replay{bottom:85px;font-size:8px}
 .drawing-caption h2{font-size:32px}
 .drawing-caption>.eyebrow{font-size:8px;max-width:250px}
}
@media(max-height:500px) and (orientation:landscape){
 .hero-journey .hero-title{top:27%}
 .hero-journey .hero-title h1{font-size:18vh}
 .hero-journey .hero-title>span{font-size:7vh}
 .hero-title .scroll-link{margin-top:12px;font-size:9px}
 .hero-journey .orbit-res,.hero-journey .orbit-villa{width:90px;height:90px;top:32%;bottom:auto}
 .intro-note{bottom:88px}
 .intro-replay,.hero-select-again{bottom:70px}
 .hero-bottom{bottom:10px}
 .panorama-highlights{bottom:85px}
 .panorama-highlight>b{font-size:30px}
 .panorama-highlight small{margin-top:4px}
 .panorama-journey .panorama>.panorama-guide{bottom:20px;max-width:45%}
 .panorama-journey .panorama>.panorama-explore{bottom:20px}
}
/* Secondary information stays legible without competing with editorial headings. */
.gallery-top,.location-head>p,.concept-bottom .eyebrow,.map-instruction,.plan-mode button,.masterplan-legend{line-height:1.6}
@media(max-width:600px){
 .gallery-top,.location .location-head>p,.concept-bottom .eyebrow{font-size:10px}
 .map-instruction{font-size:10px;max-width:60%}
 .plan-mode button{font-size:10px;min-height:44px}
 .masterplan-legend{font-size:9px;gap:10px;flex-wrap:wrap}
 .journey-hint{font-size:10px}
 .tour-toolbar h3{overflow-wrap:normal}
}

/* A deeper approach, with a settled close view before the editorial transition. */
.hero-journey .hero-img{transform-origin:64% 61%}
.hero-journey .hero[data-collection="villas"] .hero-img{transform-origin:52% 56%}
.hero-journey .hero-title{opacity:calc(1 - var(--approach)*1.25)!important}
@media(prefers-reduced-motion:no-preference){
 .hero-journey{height:210svh}
}
@media(max-width:600px) and (prefers-reduced-motion:no-preference){
 .hero-journey{height:180svh}
 .hero-journey .hero-img{transform-origin:58% 58%}
}
@media(max-height:600px) and (orientation:landscape){.hero-journey{height:auto}}

.hero-journey .hero.is-close-view .scroll-link{visibility:hidden}