/* KGMA — Global integrated resorts, a visual industry reference. */
.resorts-section {
  position: relative;
  background: var(--cream, #f6f4ef);
  border-top: 1px solid #dcded8;
  border-bottom: 1px solid #dcded8;
}
.resort-heading { margin-bottom: 42px; }
.resort-heading > p { max-width: 390px; color: #657176; }
.resort-heading h2 em { color: #806b48; font-style: normal; }

/* One stable viewing space, with the original still always underneath motion. */
.resort-stage {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr);
  min-width: 0;
  min-height: 558px;
  background: #091e28;
  color: #fffefa;
  outline-offset: 6px;
}
.resort-stage:focus-visible { outline: 2px solid #2479ae; }
.resort-visual {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-width: 0;
  min-height: 100%;
  background: #142d37;
}
.resort-photo,
.resort-video {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.resort-photo { z-index: 0; }
.resort-video { z-index: 1; opacity: 0; pointer-events: none; transition: opacity 1s ease; }
.resort-visual.video-is-playing .resort-video { opacity: 1; }
.resort-visual::after {
  content: '';
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  bottom: 0;
  height: 25%;
  pointer-events: none;
  background: linear-gradient(0deg, #04161f99, transparent);
}
.resort-media-tag {
  position: absolute;
  z-index: 3;
  bottom: 25px;
  left: 28px;
  max-width: calc(100% - 56px);
  padding: 7px 10px;
  border: 1px solid #ffffff3d;
  background: #071b25db;
  color: #eee7d8;
  font-size: 9px;
  line-height: 1.65;
  letter-spacing: .12em;
  overflow-wrap: anywhere;
}
.resort-story {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  padding: 42px 35px 29px;
  border-left: 1px solid #ffffff18;
}
.resort-location {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #c8b38b;
  font-size: 9px;
  line-height: 1.65;
  letter-spacing: .16em;
  margin-bottom: 18px;
}
.resort-location::before { content: ''; width: 20px; height: 1px; background: #b49a6b; flex-shrink: 0; }
.resort-story h3 {
  margin: 0;
  max-width: 100%;
  font-family: var(--serif, Georgia, serif);
  font-size: clamp(29px, 2.8vw, 42px);
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: -.035em;
  color: #f8f5eb;
  text-wrap: balance;
  overflow-wrap: break-word;
}
.resort-description { margin: 22px 0 0; font-size: 13px; line-height: 1.95; color: #b7c6ca; }
.resort-facts { display: grid; grid-template-columns: 1fr; width: 100%; gap: 0; margin: 26px 0 25px; }
.resort-facts > div { display: grid; grid-template-columns: 67px 1fr; gap: 15px; padding: 13px 0; border-top: 1px solid #ffffff29; }
.resort-facts dt { margin: 0; color: #b8a582; font-size: 10px; line-height: 1.8; }
.resort-facts dd { margin: 0; color: #d1dcd9; font-size: 11px; line-height: 1.85; }
.resort-official { margin-top: auto; font-size: 12px; gap: 28px; }
.resort-story .motion-toggle { margin-top: 18px; font-size: 10px; letter-spacing: .02em; color: #b8c7ca; min-height: 38px; }
.resort-story .motion-toggle:hover:not(:disabled) { color: #e6d6b6; }
.resort-story .motion-toggle:focus-visible { outline-color: #d7bb88; }
.resort-motion-note { margin: 13px 0 0; color: #b7c6ca; font-size: 10px; line-height: 1.85; }

/* Official footage stays in its original, user-controlled player. */
.resort-visual.resort-official-visual {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: auto;
  min-height: 0;
  aspect-ratio: auto;
  background: #071b24;
}
.resort-official-visual::after { display: none; }
.resort-player { position: relative; width: 100%; aspect-ratio: 16 / 9; min-height: 200px; background: #000; }
.resort-player iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; }
.resort-player-caption { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 18px; padding: 18px 24px; color: #c8b38b; font-size: 10px; line-height: 1.8; }
.resort-player-caption a { color: #d3dedb; text-decoration: underline; text-underline-offset: 4px; }
.resort-player-caption a:focus-visible { outline: 2px solid #d7bb88; outline-offset: 4px; }

/* The index is deliberately as useful as the large image. */
.resort-tabs {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 12px;
  margin-top: 22px;
  padding: 0 0 2px;
}
.resort-tab {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 0 0 13px;
  border-bottom: 1px solid #b9c2bb;
  text-align: left;
  color: #455f68;
  background: transparent;
  scroll-snap-align: start;
  transition: border-color .25s ease, color .25s ease;
}
.resort-tab::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 100%;
  height: 2px;
  background: #806b48;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s var(--ease, ease);
}
.resort-thumb {
  position: relative;
  display: block;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 1.67;
  background: #d8ded7;
  margin-bottom: 12px;
}
.resort-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(.7); transition: filter .3s ease, transform .65s var(--ease, ease); }
.resort-thumb::after { content: ''; position: absolute; inset: 0; border: 1px solid #091e2814; pointer-events: none; }
.resort-tab-place { color: #657176; font-size: 8px; letter-spacing: .13em; line-height: 1.65; margin-bottom: 5px; }
.resort-tab strong { display: block; font-weight: 500; font-size: 11px; line-height: 1.65; letter-spacing: -.015em; word-break: normal; overflow-wrap: anywhere; }
.resort-tab:hover { color: #122b34; }
.resort-tab:hover .resort-thumb img { filter: saturate(1); }
.resort-tab[aria-selected='true'] { color: #091e28; }
.resort-tab[aria-selected='true']::after { transform: scaleX(1); }
.resort-tab[aria-selected='true'] .resort-tab-place { color: #806b48; }
.resort-tab[aria-selected='true'] strong { font-weight: 700; }
.resort-tab[aria-selected='true'] .resort-thumb img { filter: saturate(1); }
.resort-tab:focus-visible { outline: 2px solid #2479ae; outline-offset: 4px; z-index: 1; }
.resort-tab[aria-selected='true'] .resort-thumb::after { border: 2px solid #b49a6b; }
.resort-thumb-fallback {
  display: grid;
  place-items: center;
  min-width: 0;
  aspect-ratio: 1.67;
  width: 100%;
  padding: 15px;
  margin-bottom: 12px;
  background: #19323c;
  color: #cfc0a1;
  text-align: center;
  font: 12px/1.5 var(--serif, Georgia, serif);
  letter-spacing: .11em;
  overflow-wrap: anywhere;
}
.resort-thumb .resort-thumb-fallback { height: 100%; margin: 0; aspect-ratio: auto; }

/* Original-only photographs keep their full frame, color and static presentation. */
.resort-visual.resort-no-derivatives .resort-photo.resort-photo-original {
  object-fit: contain;
  filter: none !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
  opacity: 1 !important;
}
.resort-visual.resort-no-derivatives::before,
.resort-visual.resort-no-derivatives::after { display: none; }
.resort-thumb img.resort-photo-original,
.resort-tab:hover .resort-thumb img.resort-photo-original,
.resort-tab[aria-selected='true'] .resort-thumb img.resort-photo-original {
  object-fit: contain;
  filter: none !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
  opacity: 1 !important;
}
.resort-original-tab .resort-thumb { background: #142d37; }
.resort-original-tab .resort-thumb::after { display: none; }

/* An explicit location graphic, never a substitute photograph of a property. */
.resort-placeholder {
  display: grid;
  place-items: center;
  padding: 65px 48px;
  min-height: 480px;
  background-color: #142c37;
  background-image: repeating-linear-gradient(90deg, transparent 0, transparent 89px, #a5b6af12 89px, #a5b6af12 90px), repeating-linear-gradient(0deg, transparent 0, transparent 89px, #a5b6af0d 89px, #a5b6af0d 90px);
}
.resort-placeholder::before {
  content: '';
  position: absolute;
  inset: 12% 17%;
  z-index: 0;
  border: 1px solid #b49a6b33;
  pointer-events: none;
}
.resort-location-art {
  position: relative;
  z-index: 1;
  max-width: 100%;
  color: #e3d5b9;
  text-align: center;
  font-family: var(--serif, Georgia, serif);
  font-size: clamp(32px, 4vw, 61px);
  line-height: 1.2;
  letter-spacing: .08em;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
.resort-location-art small { display: block; margin-top: 22px; font: 10px/1.9 var(--sans, sans-serif); letter-spacing: .17em; color: #b2c3c6; }
.resort-location-art > span { display: block; margin-bottom: 15px; font: 9px/1.9 var(--sans, sans-serif); letter-spacing: .16em; color: #b2c3c6; }
.resort-location-art > strong { display: block; font: inherit; font-weight: 400; }
.resort-context-note { color: #657176; font-size: 11px; line-height: 1.85; margin-top: 22px; max-width: 980px; }
.resort-attributions { margin-top: 18px; border-top: 1px solid #d1d7ce; color: #657176; }
.resort-attributions summary { display: flex; align-items: center; gap: 12px; width: fit-content; list-style: none; cursor: pointer; padding: 15px 0 4px; font-size: 11px; line-height: 1.8; }
.resort-attributions summary::-webkit-details-marker { display: none; }
.resort-attributions summary::before { content: '+'; font-size: 19px; line-height: 1; font-weight: 400; color: #806b48; }
.resort-attributions[open] summary::before { content: '−'; }
.resort-attributions summary:hover { color: #122b34; }
.resort-attributions summary:focus-visible { outline: 2px solid #2479ae; outline-offset: 4px; }
#resort-credit-list { display: grid; grid-template-columns: 1fr 1fr; gap: 15px 35px; padding: 22px 0 2px; }
#resort-credit-list > p:first-child { grid-column: 1 / -1; margin: 0 0 5px; max-width: 1000px; }
#resort-credit-list > div, #resort-credit-list > p, #resort-credit-list > article { min-width: 0; font-size: 11px; line-height: 1.9; }
#resort-credit-list strong { display: block; margin-bottom: 4px; color: #334e58; font-size: 11px; font-weight: 600; }
#resort-credit-list .resort-credit { padding-top: 13px; border-top: 1px solid #d6dcd3; }
#resort-credit-list h4 { color: #334e58; margin: 0 0 7px; font-size: 12px; line-height: 1.7; font-weight: 600; }
#resort-credit-list a { color: #285f7d; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; overflow-wrap: anywhere; }
#resort-credit-list a:hover { color: #091e28; }
#resort-credit-list p { margin-top: 5px; }
#resort-credit-list ul { margin: 0; padding-left: 17px; }
.resort-credit h4 { color: #334e58; font-size: 13px; line-height: 1.7; font-weight: 600; margin: 19px 0 7px; }
.resort-credit p { font-size: 12px; line-height: 1.9; margin-top: 5px; }
.resort-credit a { color: #285f7d; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.hero-media-credit { color: #c6cfce; font-size: 10px; line-height: 1.85; letter-spacing: .025em; text-align: left; text-decoration: underline; text-decoration-color: #82979f; text-decoration-thickness: 1px; text-underline-offset: 5px; padding-block: 7px; min-height: 34px; max-width: 350px; }
.hero-media-credit:hover { color: #ead8b9; text-decoration-color: #cbb38b; }
.hero-media-credit:focus-visible { outline-color: #d7bb88; }

/* Motion is limited to the image plane; text stays fully readable. */
.motion-enabled .resort-visual.scene-enter:not(.resort-no-derivatives) .resort-photo,
.motion-enabled .resort-visual.scene-enter:not(.resort-no-derivatives) .resort-location-art { animation: resort-scene-enter .65s ease both; }
@keyframes resort-scene-enter { from { opacity: .4; } to { opacity: 1; } }
html:not(.motion-enabled) .resort-video { display: none; }
html:not(.motion-enabled) .resort-photo { opacity: 1; }

@media (min-width: 1600px) {
  .resort-stage { min-height: 600px; }
  .resort-story { padding: 48px 40px 33px; }
}
@media (max-width: 1200px) {
  .resort-stage { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); min-height: 550px; }
  .resort-story { padding: 35px 28px 26px; }
  .resort-story h3 { font-size: 34px; }
  .resort-description { font-size: 12px; }
  .resort-facts > div { grid-template-columns: 58px 1fr; gap: 12px; }
  .resort-tabs { gap: 10px; }
  .resort-tab-place { font-size: 7px; }
  .resort-tab strong { font-size: 10px; }
}
@media (max-width: 1000px) {
  .resort-tabs {
    display: grid;
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: 147px;
    gap: 15px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scroll-padding-inline: 5px;
    scrollbar-width: thin;
    scrollbar-color: #9eaa9e transparent;
    padding: 5px 5px 15px;
    margin: 17px -5px 0;
  }
  .resort-tabs::-webkit-scrollbar { height: 3px; }
  .resort-tabs::-webkit-scrollbar-thumb { background: #9eaa9e; }
  .resort-thumb, .resort-thumb-fallback { height: 88px; aspect-ratio: auto; }
  .resort-tab-place { font-size: 8px; }
  .resort-tab strong { font-size: 11px; }
  .resort-context-note { margin-top: 16px; }
}
@media (max-width: 800px) {
  .resort-stage { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); min-height: 540px; }
  .resort-story { padding: 30px 25px 24px; }
  .resort-location { font-size: 8px; letter-spacing: .1em; margin-bottom: 17px; }
  .resort-story h3 { font-size: 31px; }
  .resort-description { margin-top: 18px; font-size: 12px; }
  .resort-facts { margin: 21px 0; }
  .resort-facts > div { grid-template-columns: 1fr; gap: 5px; padding-block: 12px; }
  .resort-facts dt { font-size: 9px; }
  .resort-facts dd { font-size: 11px; }
  .resort-official { font-size: 11px; }
  .resort-media-tag { left: 20px; bottom: 20px; max-width: calc(100% - 40px); font-size: 8px; }
  .resort-placeholder { padding-inline: 30px; }
  .resort-location-art { font-size: 34px; }
  #resort-credit-list { gap: 18px 28px; }
}
@media (max-width: 600px) {
  .resort-heading { margin-bottom: 31px; }
  .resort-heading > p { max-width: none; }
  .resort-stage { display: block; min-height: 0; }
  .resort-visual { min-height: 0; height: auto; aspect-ratio: 1.45; }
  .resort-story { min-height: 411px; padding: 29px 26px 25px; border-left: 0; border-top: 1px solid #ffffff20; }
  .resort-location { font-size: 9px; margin-bottom: 15px; }
  .resort-story h3 { max-width: 100%; font-size: 34px; }
  .resort-description { font-size: 13px; line-height: 1.9; margin-top: 19px; }
  .resort-facts { margin: 22px 0; }
  .resort-facts > div { grid-template-columns: 62px 1fr; gap: 15px; padding-block: 12px; }
  .resort-facts dt { font-size: 10px; }
  .resort-facts dd { font-size: 11px; }
  .resort-official { font-size: 12px; }
  .resort-story .motion-toggle { margin-top: 13px; font-size: 9px; }
  .resort-media-tag { font-size: 7px; letter-spacing: .1em; left: 17px; bottom: 17px; max-width: calc(100% - 34px); padding: 6px 8px; }
  .resort-tabs { grid-auto-columns: 144px; gap: 13px; margin-top: 16px; }
  .resort-thumb, .resort-thumb-fallback { height: 88px; }
  .resort-tab { padding-bottom: 13px; }
  .resort-tab-place { font-size: 8px; }
  .resort-tab strong { font-size: 11px; }
  .resort-placeholder { padding: 40px 30px; }
  .resort-placeholder::before { inset: 13% 12%; }
  .resort-location-art { font-size: 35px; letter-spacing: .06em; }
  .resort-location-art small { font-size: 8px; letter-spacing: .1em; margin-top: 16px; }
  .resort-context-note { font-size: 10px; line-height: 1.85; }
  .hero-media-credit { font-size: 9px; max-width: 180px; }
  .resort-attributions { margin-top: 16px; }
  .resort-attributions summary { font-size: 10px; }
  #resort-credit-list { grid-template-columns: 1fr; gap: 18px; padding-top: 19px; }
  #resort-credit-list > div, #resort-credit-list > p, #resort-credit-list > article, #resort-credit-list strong { font-size: 10px; }
}
@media (max-width: 370px) {
  .resort-story { padding: 26px 22px 23px; }
  .resort-story h3 { font-size: 30px; }
  .resort-description { font-size: 12px; }
  .resort-facts > div { grid-template-columns: 54px 1fr; gap: 13px; }
  .resort-tabs { grid-auto-columns: 134px; }
  .resort-thumb, .resort-thumb-fallback { height: 84px; }
  .resort-location-art { font-size: 29px; }
}
@media (prefers-reduced-motion: reduce) {
  .resort-video { display: none !important; }
  .resort-photo, .resort-location-art { opacity: 1 !important; animation: none !important; }
  .resort-tab, .resort-tab::after, .resort-thumb img { transition: none !important; }
  .resort-tabs { scroll-behavior: auto; }
}
@media print {
  .resorts-section { background: white; padding-block: 35px; }
  .resort-stage { display: grid; grid-template-columns: 1fr 1fr; min-height: 0; background: white; color: #122b34; break-inside: avoid; border: 1px solid #dcded8; }
  .resort-visual { min-height: 300px; }
  .resort-video, .resort-story .motion-toggle, .resort-tabs, .resort-attributions { display: none !important; }
  .resort-story { padding: 24px; }
  .resort-story h3 { color: #122b34; font-size: 29px; }
  .resort-description, .resort-facts dd { color: #657176; }
  .resort-location, .resort-facts dt { color: #806b48; }
  .resort-facts > div { border-top-color: #dcded8; }
  .resort-official { color: #122b34 !important; border-color: #a9b6b5 !important; }
  .resort-photo { opacity: 1 !important; }
}
/* A shared cinematic rhythm for the editorial feature. */
.focus-photo .focus-video {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.78) brightness(.84);opacity:0;transition:opacity 1.2s ease;pointer-events:none}
.focus-photo.video-is-playing .focus-video {opacity:1}
.focus-media-caption {position:absolute;left:48px;right:36px;bottom:30px;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.focus-media-caption .photo-tag {position:static;text-align:left;line-height:1.8}
.focus-media-caption .motion-toggle {flex-shrink:0}
html[data-motion-ready]:not(.motion-enabled) .focus-video {display:none}
@media(max-width:720px){.focus-media-caption{left:26px;right:26px;bottom:24px;gap:8px}.focus-media-caption .photo-tag{font-size:8px}}
@media(prefers-reduced-motion:reduce){.focus-video{display:none}}
@media print{.focus-video{display:none}}

.resort-explorer{display:flex;flex-direction:column}.resort-explorer>.resort-tabs{order:2}.resort-explorer>.resort-stage{order:1}

/* Preserve the complete composition of the portrait construction archive. */
.resort-visual.resort-portrait { background: #10252e; }
.resort-portrait .resort-photo,
.resort-portrait .resort-video { object-fit: contain; }
.resort-visual.resort-portrait::after { display: none; }
@media (max-width: 600px) {
  .resort-visual.resort-portrait { aspect-ratio: 1; }
}
