/* Zamaya: The Key Plan. Tokens first, then each act in page order. */
:root {
  --sc-canvas: #0E1712;
  --sc-surface: #16211A;
  --sc-ink: #EEE9DF;
  --sc-ink-soft: #AEB8AB;
  --sc-accent: #E5583F;          /* track red, dark-ground stop */
  --sc-accent-ink: #1A0D09;
  --paper: #EEE9DF;
  --paper-2: #E3DCCD;
  --paper-ink: #17201A;
  --paper-soft: #4B5A4E;
  --red-paper: #A9321C;          /* track red, paper-ground stop */
  --jungle: #0E1712;
  --sc-font-display: "Archivo", system-ui, sans-serif;
  --sc-font-text: "Onest", system-ui, sans-serif;
  --sc-shadow-color: 150 30% 4%;
  --wide: "wdth" 125;
  --kp-h: 0px;
}

body { font-size: var(--sc-t-base); }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 1rem; top: -4rem; z-index: 200; background: var(--sc-accent); color: var(--sc-accent-ink); padding: .6rem 1rem; border-radius: 6px; }
.skip:focus { top: 1rem; }

/* ---------------------------------------------------------------- type -- */
.h2, .h3, .hero__title, .strike, .hush__line, .pav__drop, .planline b, .mast__brand span {
  font-family: var(--sc-font-display);
  font-variation-settings: var(--wide);
}
.h2 { font-size: var(--sc-t-3xl); font-weight: 700; line-height: 1; letter-spacing: -0.03em; margin: 0 0 var(--sc-5); text-wrap: balance; max-width: 18ch; }
.h2--xl { font-size: var(--sc-t-4xl); max-width: 14ch; }
.h3 { font-size: var(--sc-t-xl); font-weight: 650; line-height: 1.08; letter-spacing: -0.02em; margin: 0 0 var(--sc-4); text-wrap: balance; }
.lede { font-size: var(--sc-t-lg); line-height: 1.45; max-width: 40ch; text-wrap: pretty; }
p { text-wrap: pretty; max-width: 62ch; }
.link { color: inherit; text-decoration: underline; text-decoration-color: var(--sc-accent); text-decoration-thickness: 2px; }
.price { font-size: var(--sc-t-sm); color: var(--sc-ink-soft); margin-top: var(--sc-5); }
.price b { color: var(--sc-ink); font-weight: 600; }

/* The plan line: the one schema every area opens with. */
.planline {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem 1.1rem;
  margin: 0 0 var(--sc-6); padding-top: var(--sc-3);
  border-top: 1px solid currentColor; max-width: none;
  font-size: var(--sc-t-xs); letter-spacing: .02em; color: var(--paper-soft);
}
.planline b { font-size: .82rem; font-weight: 700; text-transform: uppercase; letter-spacing: .14em; color: var(--paper-ink); }
.planline b::before { content: ""; display: inline-block; width: .62em; height: .62em; margin-right: .55em; border-radius: 50%; background: var(--red-paper); vertical-align: .02em; }
.planline--dark { color: var(--sc-ink-soft); border-color: color-mix(in oklab, var(--sc-ink) 40%, transparent); }
.planline--dark b { color: var(--sc-ink); }
.planline--dark b::before { background: var(--sc-accent); }

/* ------------------------------------------------------------- buttons -- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 48px; padding: .75rem 1.35rem; border-radius: 999px;
  font-family: var(--sc-font-display); font-variation-settings: "wdth" 110; font-weight: 650;
  font-size: .92rem; letter-spacing: .02em; text-decoration: none; cursor: pointer; border: 1px solid transparent;
  transition: transform var(--sc-d-fast) var(--sc-ease-out), background-color var(--sc-d-fast) var(--sc-ease-out);
}
.btn:active { transform: scale(.97); }
.btn--accent { background: var(--sc-accent); color: var(--sc-accent-ink); box-shadow: var(--sc-e1); }
.btn--accent:hover { background: #F06B52; }
.btn--ghost { border-color: color-mix(in oklab, currentColor 55%, transparent); color: inherit; }
.btn--sm { min-height: 40px; padding: .5rem 1rem; font-size: .85rem; }

/* ---------------------------------------------------------------- mast -- */
.mast {
  position: absolute; z-index: 40; inset: 0 0 auto 0;
  display: flex; align-items: center; gap: var(--sc-6);
  padding: var(--sc-4) var(--sc-gutter);
}
.mast__brand { display: flex; align-items: center; gap: .65rem; text-decoration: none; color: var(--sc-ink); }
.mast__brand img { width: 28px; height: 28px; object-fit: contain; }
.mast__brand span { font-weight: 600; text-transform: uppercase; letter-spacing: .32em; font-size: .95rem; }
.mast__links { display: flex; gap: var(--sc-5); margin-left: auto; }
.mast__links a { color: var(--sc-ink); text-decoration: none; font-size: var(--sc-t-sm); opacity: .9; padding: .5rem 0; }
.mast__links a:hover { text-decoration: underline; text-decoration-color: var(--sc-accent); }
.mast__book { margin-left: var(--sc-2); }

/* =============================================================== HERO == */
.hero { background: #0B130E; }
.hero__stage { background: #0B130E radial-gradient(120% 90% at 50% 50%, #1d3020, #0B130E 70%); }
.hero__world { position: absolute; inset: 0; perspective: 1700px; perspective-origin: 50% 30%; overflow: hidden; }
.hero__tilt {
  position: absolute; inset: 0; transform-style: preserve-3d;
  transform: translate3d(var(--hx, 0px), var(--hy, 0px), 0) rotateX(var(--tilt, 0deg)) rotateZ(var(--spin, 0deg)) scale(var(--zoom, 1));
  transform-origin: 50% 50%;
  will-change: transform;
}

/* The plan. Portrait coordinates everywhere; rotated a quarter turn on wide screens
   so the lobby sits on the left and the walk reads left to right. */
.plan {
  --pw: max(100vw, 56.25vh); --ph: calc(var(--pw) * 1.7778);
  position: absolute; left: 50%; top: 50%;
  width: var(--pw); height: var(--ph);
  transform: translate(-50%, -50%) rotate(var(--rot, 0deg));
  transform-style: preserve-3d;
}
.plan__plate { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; user-select: none; -webkit-user-drag: none; filter: brightness(1.18) saturate(1.08) contrast(1.04); }
.plan__shade { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(80% 65% at 50% 55%, transparent 55%, rgb(6 12 8 / .35) 100%); }
@media (min-aspect-ratio: 1/1) {
  .hero .plan { --ph: max(100vw, 168vh); --pw: calc(var(--ph) * .5625); --rot: -90deg; }
  .hero .bld__tag, .hero .spot span { --tag-rot: 90deg; }
}

.bld {
  position: absolute; left: calc(var(--x) * 1%); top: calc(var(--y) * 1%);
  width: calc(var(--w) * 1%); height: calc(var(--h) * 1%);
  padding: 0; border: 0; background: none; cursor: pointer;
  transform-style: preserve-3d; -webkit-tap-highlight-color: transparent;
}
.bld__roof {
  position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none;
  transform-origin: 50% 0%;
  transform: translateZ(calc(var(--rise, 0) * var(--z) * 1px + var(--lifted, 0) * 160px)) rotateX(calc(var(--lifted, 0) * -58deg));
  transition: transform 900ms var(--sc-ease-out), filter 600ms var(--sc-ease-out);
  filter: drop-shadow(0 calc(4px + var(--rise, 0) * 24px) calc(6px + var(--rise, 0) * 22px) rgb(0 0 0 / .45));
}
.bld__shadow {
  position: absolute; inset: 1%; border-radius: 50%; background: radial-gradient(closest-side, #07100a 62%, rgb(7 16 10 / .7) 85%, transparent); filter: blur(4px);
  opacity: clamp(0, calc((var(--rise, 0) - .2) * 1.3 + var(--lifted, 0)), .95); pointer-events: none;
}
.bld[data-bld="lacima"] .bld__shadow, .bld[data-bld="academy"] .bld__shadow { border-radius: 10%; background: #07100a; }
.bld__inside {
  position: absolute; inset: 4%; border-radius: 50%;
  background: var(--img) center / cover no-repeat, #0b0f0c;
  opacity: var(--lifted, 0); transition: opacity 500ms var(--sc-ease-out);
  box-shadow: inset 0 0 0 2px rgb(255 255 255 / .7), inset 0 12px 30px rgb(0 0 0 / .6);
}
.bld[data-bld="lacima"] .bld__inside, .bld[data-bld="academy"] .bld__inside { border-radius: 8%; }
.bld.is-lifted { --lifted: 1; z-index: 5; }
.bld__tag, .spot span {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%) rotate(var(--tag-rot, 0deg)) translateZ(calc(var(--rise, 0) * var(--z, 40) * 1px + 6px));
  white-space: nowrap; pointer-events: none;
  font: 650 .7rem/1 var(--sc-font-display); font-variation-settings: "wdth" 112; letter-spacing: .12em; text-transform: uppercase;
  color: #10170F; background: rgb(238 233 223 / .92); padding: .38rem .55rem; border-radius: 4px;
  box-shadow: 0 2px 8px rgb(0 0 0 / .35);
  opacity: var(--tags, 1); transition: opacity 300ms;
}
.bld.is-lifted .bld__tag { background: var(--sc-accent); color: var(--sc-accent-ink); }
.bld:hover .bld__roof { filter: drop-shadow(0 10px 16px rgb(0 0 0 / .55)) brightness(1.08); }
.bld:focus-visible { outline: 3px solid var(--sc-accent); outline-offset: 2px; border-radius: 50%; }
.spot { position: absolute; left: calc(var(--x) * 1%); top: calc(var(--y) * 1%); width: 1px; height: 1px; transform-style: preserve-3d; }
.spot span { background: rgb(14 23 18 / .78); color: var(--paper); font-weight: 600; }
.spot:focus-visible span { outline: 2px solid var(--sc-accent); }

.hero__palm { position: absolute; pointer-events: none; will-change: transform; filter: blur(var(--pb, 1.5px)) drop-shadow(0 30px 40px rgb(0 0 0 / .45)); }
.hero__palm--a { width: min(26vw, 420px); left: -9vw; top: -20vh; transform: translate3d(var(--pax, 0px), var(--pay, 0px), 0) scale(var(--ps, 1)) rotate(-12deg); }
.hero__palm--b { width: min(22vw, 340px); right: -8vw; top: -16vh; transform: translate3d(var(--pbx, 0px), var(--pby, 0px), 0) scale(var(--ps, 1)) rotate(20deg); }
.hero__clouds { position: absolute; inset: -20%; pointer-events: none; mix-blend-mode: multiply; opacity: .5; }
.hero__clouds i { position: absolute; border-radius: 50%; background: radial-gradient(closest-side, rgb(10 20 14 / .55), transparent); animation: cloud 38s linear infinite; }
.hero__clouds i:nth-child(1) { width: 60vw; height: 40vw; left: -10%; top: 10%; }
.hero__clouds i:nth-child(2) { width: 45vw; height: 30vw; left: 40%; top: 50%; animation-duration: 52s; animation-delay: -20s; }
.hero__clouds i:nth-child(3) { width: 50vw; height: 34vw; left: 70%; top: 0%; animation-duration: 64s; animation-delay: -40s; }
@keyframes cloud { from { transform: translate3d(-20vw, 6vh, 0); } to { transform: translate3d(40vw, -6vh, 0); } }

.hero__copy {
  position: absolute; z-index: 10; left: var(--sc-gutter); bottom: clamp(2rem, 8vh, 6rem);
  max-width: min(38rem, 88vw);
  opacity: var(--hc-o, 1); transform: translate3d(0, var(--hc-y, 0px), 0);
}
.hero__copy::before { /* scrim only under the copy */
  content: ""; position: absolute; z-index: -1; inset: -40% -30% -45% -45%;
  background: radial-gradient(closest-side, rgb(7 13 9 / .82), rgb(7 13 9 / .55) 55%, transparent);
  pointer-events: none;
}
.hero__kicker { font-size: var(--sc-t-xs); text-transform: uppercase; letter-spacing: .22em; color: var(--sc-ink-soft); margin: 0 0 var(--sc-4); }
.hero__title { font-size: clamp(2.8rem, 1.6rem + 3.6vw, 5.6rem); font-weight: 750; line-height: .95; letter-spacing: -0.035em; margin: 0 0 var(--sc-5); text-wrap: balance; text-shadow: 0 2px 30px rgb(0 0 0 / .35); }
.hero__lede { font-size: var(--sc-t-lg); margin: 0; max-width: 32ch; }
.hero__walk {
  position: absolute; z-index: 10; left: 50%; top: 50%; translate: -50% -50%; margin: 0;
  font: 750 var(--sc-t-2xl)/1 var(--sc-font-display); font-variation-settings: var(--wide); letter-spacing: -.02em;
  opacity: var(--walk-o, 0); white-space: nowrap; pointer-events: none;
  background: rgb(9 15 11 / .82); padding: .5em .8em .55em; border-radius: 999px; box-shadow: var(--sc-e3);
}
.lift-card {
  position: absolute; z-index: 12; right: var(--sc-gutter); top: clamp(5rem, 14vh, 9rem);
  width: min(20rem, 80vw); padding: var(--sc-5); border-radius: 14px;
  background: rgb(238 233 223 / .96); color: var(--paper-ink); box-shadow: var(--sc-e3);
}
.lift-card[hidden] { display: none; }
.lift-card__x { position: absolute; right: .4rem; top: .4rem; width: 40px; height: 40px; border: 0; background: none; font-size: 1.4rem; line-height: 1; color: var(--paper-soft); cursor: pointer; border-radius: 50%; }
.lift-card__name { padding-right: 2rem; }
.lift-card__name { font: 700 var(--sc-t-lg)/1.1 var(--sc-font-display); font-variation-settings: var(--wide); margin: 0 0 .4rem; }
.lift-card__line { margin: 0 0 var(--sc-4); font-size: var(--sc-t-sm); color: var(--paper-soft); }
.lift-card__row { display: flex; align-items: center; gap: var(--sc-4); flex-wrap: wrap; }
.lift-card__note { font-size: var(--sc-t-xs); color: var(--paper-soft); }
.lift-card .btn--accent { background: var(--red-paper); color: #fff; }

/* =============================================================== LOBBY == */
.lobby { padding-block: var(--sc-section); }
.lobby__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: var(--sc-8); align-items: center; }
.lobby .planline, .tulum .planline, .stay .planline { }
.lobby .planline { color: var(--sc-ink-soft); border-color: color-mix(in oklab, var(--sc-ink) 40%, transparent); }
.lobby .planline b { color: var(--sc-ink); }
.lobby .planline b::before { background: var(--sc-accent); }
.facts { list-style: none; padding: 0; margin: var(--sc-7) 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sc-5); }
.facts li { border-top: 1px solid var(--sc-hairline-strong); padding-top: var(--sc-3); }
.facts b { display: block; font: 700 var(--sc-t-xl)/1 var(--sc-font-display); font-variation-settings: "wdth" 112; margin-bottom: .35rem; }
.facts span { font-size: var(--sc-t-sm); color: var(--sc-ink-soft); line-height: 1.35; display: block; }
.reels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sc-4); align-items: start; }
.reel { margin: 0; }
.reel video, .reel img { width: 100%; aspect-ratio: 720 / 850; object-fit: cover; border-radius: 10px; background: #1a241d; box-shadow: var(--sc-e2); }
.reel figcaption, .built figcaption, .t figcaption { font-size: var(--sc-t-xs); color: var(--sc-ink-soft); margin-top: .55rem; }
.reel--b { margin-top: 18%; }
.reel--c { margin-top: 6%; }

/* =============================================================== FIGHT == */
.fight__stage { background: #120D0B; }
.fight__frames, .fight__frame { position: absolute; inset: 0; }
.fight__frame { opacity: 0; }
.fight__frame.is-on { opacity: 1; animation: jolt 260ms var(--sc-ease-out); }
.fight__frame img, .fight__frame video { width: 100%; height: 100%; object-fit: cover; }
@keyframes jolt { 0% { transform: scale(1.06) translate3d(-1.2%, .8%, 0); } 100% { transform: none; } }
.fight__scrim { position: absolute; inset: 0; background: linear-gradient(90deg, rgb(14 9 7 / .88) 0%, rgb(14 9 7 / .6) 38%, transparent 70%); pointer-events: none; }
.fight__copy { position: absolute; z-index: 5; left: var(--sc-gutter); top: 50%; translate: 0 -50%; width: min(40rem, 84vw); }
.strike {
  position: absolute; left: 0; top: 4.5rem; margin: 0; max-width: 12ch;
  font-size: var(--sc-t-4xl); font-weight: 800; line-height: .95; letter-spacing: -.035em; text-transform: uppercase;
  opacity: 0;
}
.strike.is-on, .fight__end.is-on { opacity: 1; }
.strike--sm { position: static; font-size: var(--sc-t-2xl); opacity: 1; margin-bottom: var(--sc-4); max-width: none; }
.fight__end { position: absolute; left: 0; top: 4.5rem; opacity: 0; transition: opacity 300ms; }
.fight__end p:not(.strike):not(.price) { color: var(--sc-ink); }

/* =============================================================== TRACK == */
.track__stage { background: #0E1712; display: flex; flex-direction: column; justify-content: center; }
.track__head { position: absolute; top: clamp(4.5rem, 10vh, 7rem); left: var(--sc-gutter); right: var(--sc-gutter); }
.track__head .h2 { max-width: none; }
.track__lanes {
  position: absolute; left: 0; right: 0; top: 60%; height: clamp(20rem, 56vh, 34rem); translate: 0 -50%;
  background:
    repeating-linear-gradient(180deg, transparent 0 calc(25% - 2px), rgb(255 255 255 / .82) calc(25% - 2px) 25%),
    #B23A26;
  background-position: calc(var(--sc-p, 0) * -2400px) 0;
  box-shadow: inset 0 18px 40px rgb(0 0 0 / .35), inset 0 -18px 40px rgb(0 0 0 / .35);
}
.track__lanes::after { /* lane numbers painted on the tartan, moving with it */
  content: ""; position: absolute; inset: 0;
  background: repeating-linear-gradient(90deg, transparent 0 380px, rgb(255 255 255 / .16) 380px 384px);
  background-position: calc(var(--sc-p, 0) * -2400px) 0;
}
.track__rail { position: relative; list-style: none; margin: 0; padding: 0 var(--sc-gutter); gap: clamp(1rem, 2vw, 1.75rem); align-items: center; top: 10%; }
.disc {
  flex: 0 0 clamp(14rem, 19vw, 17rem); display: grid; grid-template-rows: auto 1fr; overflow: hidden;
  background: var(--paper); color: var(--paper-ink); border-radius: 12px; box-shadow: var(--sc-e3);
}
.disc img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.disc > div { padding: var(--sc-4) var(--sc-4) var(--sc-5); }
.disc h3 { font: 700 var(--sc-t-lg)/1.1 var(--sc-font-display); font-variation-settings: "wdth" 115; margin: 0 0 .4rem; letter-spacing: -.01em; }
.disc p { margin: 0 0 .9rem; font-size: var(--sc-t-sm); line-height: 1.45; color: var(--paper-soft); }
.where { font-size: .72rem; text-transform: uppercase; letter-spacing: .12em; font-weight: 600; color: var(--red-paper); }
.disc--end { background: var(--sc-accent); color: var(--sc-accent-ink); flex-basis: clamp(17rem, 26vw, 22rem); align-self: stretch; }
.disc--end > div { display: flex; flex-direction: column; justify-content: center; height: 100%; padding: var(--sc-6); }
.disc--end h3 { font-size: var(--sc-t-xl); }
.disc--end p, .disc--end .price, .disc--end .price b { color: var(--sc-accent-ink); }

/* ============================================================= SILENCE == */
.hush__stage { background: #0A0907; display: grid; place-items: center; }
.hush__line { margin: 0; padding-inline: var(--sc-gutter); text-align: center; max-width: 22ch; font-size: var(--sc-t-3xl); font-weight: 600; line-height: 1.04; letter-spacing: -.03em; color: #E9DDC6; text-wrap: balance; }

/* ============================================================ PAVILION == */
.pav__stage { background: #0A0907; }
.pav__scrim { z-index: 1; }
.pav__a .lede { margin: 0; }
.pav__a, .pav__b { padding: clamp(1.25rem, 2.4vw, 2.25rem); border-radius: 14px; background: rgb(12 10 8 / .8); backdrop-filter: blur(8px); box-shadow: var(--sc-e3); }
.pav__a { max-width: min(40rem, 86vw); }
.pav__a .h2--xl { font-size: var(--sc-t-3xl); }
.pav__drop {
  position: absolute; z-index: 20; left: 50%; top: 50%; translate: -50% -50%; margin: 0;
  font-size: clamp(2.8rem, 9vw, 8.5rem); font-weight: 850; letter-spacing: -.045em; line-height: 1; color: #F3EADB; max-width: none; white-space: nowrap;
  padding: .12em .42em .18em; border-radius: 999px; background: rgb(10 9 7 / .82); box-shadow: var(--sc-e3);
  pointer-events: none;
}
.pav__b { max-width: min(34rem, 80vw); bottom: clamp(7.5rem, 17vh, 11rem); }
.pav__b p { margin-left: auto; }
.tags { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: flex-end; margin-top: var(--sc-5); }
.tags span, .brands span { font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; padding: .4rem .7rem; border-radius: 999px; border: 1px solid color-mix(in oklab, currentColor 45%, transparent); }

/* =============================================================== BUILT == */
.built { padding-block: var(--sc-section); background: transparent; }
.built__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--sc-5); align-items: start; }
.built__copy { grid-column: 1 / span 5; grid-row: 1 / span 2; position: sticky; top: 18vh; }
.built figure { margin: 0; }
.built img, .built video { width: 100%; object-fit: cover; border-radius: 10px; background: #221b13; }
.built__a { grid-column: 7 / span 3; } .built__a img { aspect-ratio: 4 / 5; }
.built__b { grid-column: 10 / span 3; margin-top: 30%; } .built__b img { aspect-ratio: 4 / 5; }
.built__c { grid-column: 6 / span 4; } .built__c video { aspect-ratio: 720 / 850; }
.built__d { grid-column: 10 / span 3; margin-top: 18%; } .built__d video { aspect-ratio: 720 / 850; }

/* ============================================================= STUDIOS == */
.studios, .balam, .stay { --sc-ink: var(--paper-ink); --sc-ink-soft: var(--paper-soft); --sc-hairline-strong: rgb(23 32 26 / .22); color: var(--paper-ink); background: var(--paper); padding-block: var(--sc-section); }
.studios .link, .balam .link, .stay .link { text-decoration-color: var(--red-paper); }
.studios__title { margin-bottom: var(--sc-8); }
.studios__field { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--sc-6) var(--sc-5); }
.room { margin: 0; }
.room video, .room img { width: 100%; object-fit: cover; border-radius: 10px; background: var(--paper-2); }
.room h3 { font: 700 var(--sc-t-lg)/1.1 var(--sc-font-display); font-variation-settings: "wdth" 115; margin: var(--sc-4) 0 .35rem; }
.room p { margin: 0; font-size: var(--sc-t-sm); color: var(--paper-soft); }
.room--bjj { grid-column: 1 / span 4; } .room--bjj video { aspect-ratio: 720 / 850; }
.room--yoga { grid-column: 5 / span 4; margin-top: 22%; } .room--yoga video { aspect-ratio: 720 / 850; }
.room--pilates { grid-column: 9 / span 4; margin-top: 6%; } .room--pilates video { aspect-ratio: 720 / 850; }
.room--seminar { grid-column: 2 / span 5; } .room--seminar img { aspect-ratio: 16 / 10; }
.room--calis { grid-column: 8 / span 5; margin-top: 10%; } .room--calis img { aspect-ratio: 16 / 10; }
.studios__price { margin-top: var(--sc-8); }

/* ============================================================== LA CIMA == */
.cima__stage { background: #17120B; }
.cima__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cima__plate {
  position: absolute; z-index: 2; right: var(--sc-gutter); top: 50%; translate: 0 -50%;
  width: min(42vw, 72vh); aspect-ratio: 1; border-radius: 50%; overflow: hidden;
  box-shadow: 0 0 0 10px #1E1A14, 0 0 0 12px #C9A35A, var(--sc-e3);
}
.cima__plate video { width: 100%; height: 100%; object-fit: cover; }
.cima__copy {
  position: absolute; z-index: 3; left: var(--sc-gutter); top: 50%; translate: 0 -50%;
  width: min(34rem, 44vw); padding: var(--sc-6); border-radius: 14px;
  background: rgb(18 14 9 / .84); backdrop-filter: blur(6px); box-shadow: var(--sc-e3);
}
.cima__copy .h2 { font-size: var(--sc-t-2xl); }
.brands { display: flex; gap: .5rem; flex-wrap: wrap; }

/* ================================================================ BALAM == */
.balam__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr) minmax(0, .6fr); gap: var(--sc-7); align-items: center; }
.balam__film { margin: 0; }
.balam__film video { width: 100%; aspect-ratio: 720 / 850; object-fit: cover; border-radius: 10px; }
.balam__dish { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 10px; margin-top: 40%; }
.lab { margin-top: var(--sc-10); padding-top: var(--sc-7); border-top: 1px solid rgb(23 32 26 / .22); }
.lab__grid { list-style: none; padding: 0; margin: var(--sc-6) 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sc-5); }
.test { background: #F7F3EB; border-radius: 12px; overflow: hidden; box-shadow: var(--sc-e1); display: flex; flex-direction: column; }
.test img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.test h4 { font: 700 var(--sc-t-lg)/1.1 var(--sc-font-display); font-variation-settings: "wdth" 112; margin: var(--sc-4) var(--sc-4) .4rem; }
.test p { margin: 0 var(--sc-4) var(--sc-4); font-size: var(--sc-t-sm); color: var(--paper-soft); }
.test__price { margin-top: auto !important; font-size: var(--sc-t-sm); color: var(--paper-soft) !important; }
.test__price span { font: 750 var(--sc-t-xl)/1 var(--sc-font-display); font-variation-settings: "wdth" 112; color: var(--red-paper); margin-right: .3rem; }
.lab__note { margin-top: var(--sc-5); font-size: var(--sc-t-sm); color: var(--paper-soft); }

/* ============================================================= RECOVERY == */
.rec__stage { background: var(--rec-bg, #0F1A1A); transition: background-color 700ms var(--sc-ease-out); }
.rec__frames, .rec__f { position: absolute; inset: 0; }
.rec__f { opacity: 0; transition: opacity 700ms var(--sc-ease-out); }
.rec__f.is-on { opacity: 1; }
.rec__f img, .rec__f video { position: absolute; right: 0; top: 0; width: 64%; height: 100%; object-fit: cover; transform: scale(calc(1.06 - var(--sc-p, 0) * .06)); }
.rec__f::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--rec-bg, #0F1A1A) 34%, transparent 58%); }
.rec__scrim { display: none; }
.rec__copy { position: absolute; z-index: 4; left: var(--sc-gutter); top: 50%; translate: 0 -50%; width: min(32rem, 40vw); }
.rec__copy .h2 { font-size: var(--sc-t-2xl); }
.rec__steps { list-style: none; padding: 0; margin: 0; display: grid; gap: .2rem; }
.rec__steps li { padding: .7rem 0 .7rem 1.1rem; border-left: 2px solid rgb(238 233 223 / .18); color: rgb(238 233 223 / .5); transition: color 400ms, border-color 400ms; font-size: var(--sc-t-sm); line-height: 1.45; }
.rec__steps li b { display: block; font: 700 var(--sc-t-lg)/1.15 var(--sc-font-display); font-variation-settings: "wdth" 112; color: inherit; margin-bottom: .2rem; }
.rec__steps li.is-on { color: var(--sc-ink); border-color: var(--rec-accent, var(--sc-accent)); }

/* ================================================================= STAY == */
.deck { position: relative; margin-top: var(--sc-7); }
.door {
  position: sticky; top: calc(9vh + var(--i) * 2.4rem);
  display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  min-height: min(72vh, 40rem); margin-bottom: 14vh;
  background: #F8F4EC; border-radius: 16px; overflow: hidden; box-shadow: var(--sc-e3);
}
.door:last-child { margin-bottom: 0; }
.door__media img, .door__media video { width: 100%; height: 100%; object-fit: cover; }
.door__body { padding: clamp(1.5rem, 3.4vw, 3.2rem); display: flex; flex-direction: column; justify-content: center; }
.door__cap { font-size: var(--sc-t-xs); text-transform: uppercase; letter-spacing: .16em; color: var(--red-paper); font-weight: 600; margin: 0 0 var(--sc-3); }
.door h3 { font: 750 var(--sc-t-2xl)/1 var(--sc-font-display); font-variation-settings: var(--wide); letter-spacing: -.03em; margin: 0 0 var(--sc-4); }
.door p { color: var(--paper-soft); margin: 0 0 var(--sc-4); }
.amen { list-style: none; padding: 0; margin: var(--sc-2) 0 0; display: flex; flex-wrap: wrap; gap: .45rem; }
.amen li { font-size: .78rem; padding: .35rem .65rem; border-radius: 999px; background: var(--paper-2); color: var(--paper-ink); }
.door__note { font-size: var(--sc-t-sm); margin-top: var(--sc-4) !important; }

/* ================================================================ TULUM == */
.tulum { padding-block: var(--sc-section); background: #0C1A1B; }
.tulum__mosaic { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--sc-5); align-items: start; }
.tulum__title { grid-column: 1 / span 6; font-size: var(--sc-t-3xl); max-width: 10ch; }
.tulum__lede { grid-column: 8 / span 5; font-size: var(--sc-t-lg); align-self: end; }
.t { margin: 0; }
.t img, .t video { width: 100%; height: 100%; object-fit: cover; border-radius: 10px; background: #12302f; }
.t--beach { grid-column: 1 / span 7; } .t--beach video { aspect-ratio: 16 / 9; }
.t--cenote { grid-column: 9 / span 4; margin-top: 8%; } .t--cenote video { aspect-ratio: 720 / 900; }
.t--ruins { grid-column: 2 / span 4; } .t--ruins img { aspect-ratio: 4 / 5; }
.t--sian { grid-column: 6 / span 3; margin-top: 30%; } .t--sian img { aspect-ratio: 3 / 4; }
.t--kaan { grid-column: 9 / span 4; margin-top: -10%; } .t--kaan img { aspect-ratio: 4 / 3; }
.tulum__transfer { grid-column: 2 / span 6; color: var(--sc-ink-soft); margin-top: var(--sc-6); }

/* ================================================================ CLOSE == */
.close { padding-top: var(--sc-section); background: #121A14; }
.close__grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1fr); gap: var(--sc-8); align-items: start; }
.close__plan { position: sticky; top: 4vh; }
.plan-slot { position: relative; aspect-ratio: 9 / 16; max-height: 90vh; margin-inline: auto; border-radius: 14px; overflow: hidden; box-shadow: var(--sc-e3); perspective: 1400px; }
.plan-slot .plan { --pw: 100%; --ph: 100%; left: 0; top: 0; transform: none; width: 100%; height: 100%; }
.plan-slot .bld { --rise: .35; }
.plan-slot .spot[data-spot="rooms"], .plan-slot .spot[data-spot="pool"], .plan-slot .spot[data-spot="track"] { display: none; }
.plan-slot .bld__tag, .plan-slot .spot span { font-size: .58rem; padding: .28rem .4rem; }
.close .plan-slot .plan__plate { filter: saturate(.75) brightness(.62) sepia(.25) hue-rotate(-12deg); }
.close .plan-slot .bld.is-lifted .bld__roof { filter: drop-shadow(0 0 0 transparent) brightness(1.25) drop-shadow(0 16px 20px rgb(0 0 0 / .6)); }
.close .plan-slot .bld.is-lifted .bld__inside { box-shadow: inset 0 0 0 3px #F6C76A, inset 0 12px 30px rgb(0 0 0 / .4); }
.picked { margin: var(--sc-6) 0; }
.picked__label { font-size: var(--sc-t-xs); text-transform: uppercase; letter-spacing: .16em; color: var(--sc-ink-soft); margin: 0 0 var(--sc-3); }
.picked__list { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.picked__list button { min-height: 40px; padding: .45rem .9rem; border-radius: 999px; border: 0; background: var(--sc-accent); color: var(--sc-accent-ink); font-weight: 600; font-size: .85rem; cursor: pointer; }
.picked__list button::after { content: " ×"; }
.picked__empty { color: var(--sc-ink-soft); font-size: var(--sc-t-sm); margin: 0; }
.planner { display: grid; gap: var(--sc-5); }
.planner fieldset { border: 0; padding: 0; margin: 0; }
.planner legend, .field > span { font-size: var(--sc-t-xs); text-transform: uppercase; letter-spacing: .16em; color: var(--sc-ink-soft); margin-bottom: .5rem; display: block; }
.seg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .4rem; }
.seg label { position: relative; }
.seg input { position: absolute; opacity: 0; inset: 0; }
.seg span { display: grid; place-items: center; min-height: 48px; border-radius: 10px; border: 1px solid var(--sc-hairline-strong); font-size: .9rem; cursor: pointer; text-align: center; padding: .3rem; }
.seg input:checked + span { background: var(--sc-ink); color: var(--paper-ink); border-color: var(--sc-ink); font-weight: 600; }
.seg input:focus-visible + span { outline: 2px solid var(--sc-accent); outline-offset: 2px; }
.row { display: grid; grid-template-columns: 1.4fr .8fr .8fr; gap: var(--sc-4); }
.field input { width: 100%; min-height: 48px; padding: .6rem .8rem; border-radius: 10px; border: 1px solid var(--sc-hairline-strong); background: #19231C; color: var(--sc-ink); color-scheme: dark; }
.planner__out { margin: 0; padding: var(--sc-4); border-radius: 10px; background: #19231C; font-size: var(--sc-t-sm); color: var(--sc-ink); white-space: pre-line; max-width: none; }
.planner__go { display: flex; gap: var(--sc-3); flex-wrap: wrap; }
.passes { margin-top: var(--sc-7); border-top: 1px solid var(--sc-hairline-strong); padding-top: var(--sc-4); }
.passes summary { cursor: pointer; font-weight: 600; min-height: 44px; display: flex; align-items: center; }
.passes table { width: 100%; border-collapse: collapse; font-size: var(--sc-t-sm); margin-top: var(--sc-3); }
.passes th, .passes td { text-align: left; padding: .55rem .4rem; border-bottom: 1px solid var(--sc-hairline); }
.passes td { text-align: right; }
.passes thead th { color: var(--sc-ink-soft); font-weight: 500; }
.passes thead th:not(:first-child) { text-align: right; }
.passes p { font-size: var(--sc-t-xs); color: var(--sc-ink-soft); }
.hostline { margin-top: var(--sc-6); font-size: var(--sc-t-sm); color: var(--sc-ink-soft); }
.foot { margin-top: var(--sc-10); padding-block: var(--sc-8) calc(var(--sc-8) + var(--kp-h)); border-top: 1px solid var(--sc-hairline); }
.foot__grid { display: grid; grid-template-columns: 1.2fr 1.4fr 1fr 1fr; gap: var(--sc-6); font-size: var(--sc-t-sm); }
.foot__brand { display: flex; align-items: center; gap: .7rem; font-weight: 600; }
.foot__brand img { width: 36px; height: 36px; object-fit: contain; }
.foot address { font-style: normal; color: var(--sc-ink-soft); }
.foot ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .4rem; }
.foot a { color: var(--sc-ink); }
.foot__note { grid-column: 1 / -1; font-size: var(--sc-t-xs); color: var(--sc-ink-soft); max-width: 90ch; margin-top: var(--sc-5); }

/* ============================================================== KEY PLAN NAV == */
.keyplan {
  position: fixed; z-index: 60; right: var(--sc-4); bottom: var(--sc-4);
  display: flex; align-items: center; gap: var(--sc-4);
  padding: .5rem .6rem .5rem .5rem; border-radius: 14px;
  background: rgb(14 23 18 / .9); backdrop-filter: blur(10px); color: var(--sc-ink);
  box-shadow: var(--sc-e3), inset 0 1px 0 rgb(255 255 255 / .06);
  transform: translate3d(0, 0, 0); opacity: 1;
  transition: transform 420ms var(--sc-ease-out), opacity 300ms;
}
.keyplan.is-away { transform: translate3d(0, 140%, 0); opacity: 0; pointer-events: none; }
.keyplan__map { position: relative; width: 45px; height: 80px; padding: 0; border: 0; border-radius: 6px; overflow: hidden; cursor: pointer; background: #0b120d; flex: none; }
.keyplan__map img { width: 100%; height: 100%; object-fit: cover; opacity: .75; }
.keyplan__map svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.route { fill: none; stroke: rgb(255 255 255 / .35); stroke-width: 14; stroke-linejoin: round; stroke-linecap: round; stroke-dasharray: 2 26; }
.route--done { stroke: var(--sc-accent); stroke-dasharray: var(--len, 4000); stroke-dashoffset: calc(var(--len, 4000) * (1 - var(--route, 0))); stroke-width: 18; }
.here { fill: #fff; stroke: var(--sc-accent); stroke-width: 14; }
.keyplan__here { margin: 0; display: grid; line-height: 1.2; min-width: 9.5rem; }
.keyplan__here span { font-size: .68rem; text-transform: uppercase; letter-spacing: .16em; color: var(--sc-ink-soft); }
.keyplan__here b { font: 700 .98rem/1.2 var(--sc-font-display); font-variation-settings: "wdth" 112; }

.plandlg { width: min(64rem, 94vw); max-height: 92vh; padding: 0; border: 0; border-radius: 18px; background: #121A14; color: var(--sc-ink); box-shadow: var(--sc-e3); }
.plandlg::backdrop { background: rgb(5 9 6 / .72); backdrop-filter: blur(4px); }
.plandlg__inner { display: grid; grid-template-rows: auto 1fr; max-height: 92vh; }
.plandlg__head { position: relative; padding: var(--sc-5) var(--sc-6) var(--sc-3); }
.plandlg__head p { margin: 0; color: var(--sc-ink-soft); font-size: var(--sc-t-sm); max-width: 48ch; }
.plandlg__x { position: absolute; right: var(--sc-4); top: var(--sc-4); min-height: 44px; padding: 0 1rem; border-radius: 999px; border: 1px solid var(--sc-hairline-strong); background: transparent; cursor: pointer; }
.plandlg__body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 15rem); gap: var(--sc-6); padding: var(--sc-4) var(--sc-6) var(--sc-6); overflow: auto; }
.plandlg .plan-slot { height: min(74vh, 52rem); width: auto; max-height: none; }
.plandlg__list { margin: 0; padding: 0; list-style: none; display: grid; gap: .2rem; align-content: start; counter-reset: s; }
.plandlg__list a { display: flex; align-items: center; min-height: 44px; padding: 0 .8rem; border-radius: 8px; color: var(--sc-ink); text-decoration: none; }
.plandlg__list a:hover, .plandlg__list a.is-here { background: #1C281F; }
.plandlg__list a.is-here::after { content: "You're here"; margin-left: auto; font-size: .7rem; color: var(--sc-accent); text-transform: uppercase; letter-spacing: .1em; }

/* ================================================================== PHONE == */
@media (max-width: 860px) {
  .mast__links { display: none; }
  .mast { padding-top: var(--sc-3); }
  .mast__book { margin-left: auto; min-height: 40px; padding: .5rem 1rem; font-size: .82rem; }
  .hero__title { font-size: var(--sc-t-3xl); }
  .hero__copy { bottom: auto; top: 4.6rem; }
  .hero__copy::before { inset: -30% -30% -40% -40%; }
  .hero__lede { font-size: var(--sc-t-base); }
  .lift-card { top: 4.4rem; left: var(--sc-gutter); right: var(--sc-gutter); width: auto; padding: var(--sc-4); }
  .hero.has-card .hero__copy { opacity: 0 !important; pointer-events: none; }
  .hero__palm--a { width: 70vw; left: -26vw; top: -8vh; }
  .hero__palm--b { width: 70vw; right: -30vw; bottom: auto; top: 30vh; }
  .bld__tag, .spot span { font-size: .6rem; padding: .3rem .42rem; }
  .hero [data-bld="recovery"] .bld__tag, .hero [data-bld="lacima"] .bld__tag, .hero .spot[data-spot="rooms"], .hero .spot[data-spot="pool"], .hero .spot[data-spot="villas"] { opacity: 0; }

  .lobby__grid { grid-template-columns: 1fr; gap: var(--sc-7); }
  .facts { grid-template-columns: 1fr 1fr 1fr; gap: var(--sc-3); }
  .facts b { font-size: var(--sc-t-lg); }
  .reels { gap: var(--sc-2); }

  .fight__scrim { background: linear-gradient(0deg, rgb(14 9 7 / .92) 0%, rgb(14 9 7 / .7) 42%, transparent 72%); }
  .fight__copy { top: auto; bottom: calc(var(--kp-h) + 1.5rem); translate: none; }
  .strike, .fight__end { top: auto; bottom: 0; position: absolute; }
  .fight__end .strike--sm { position: static; }
  .fight__copy { height: 22rem; }
  .strike { font-size: clamp(2rem, 9.6vw, 2.7rem); font-variation-settings: "wdth" 100; max-width: 100%; }
  .fight__end p { font-size: var(--sc-t-sm); }

  .track__head { top: 4.2rem; }
  .track__head .h2 { font-size: var(--sc-t-2xl); }
  .track__lanes { height: 46vh; top: 63%; }
  .track__rail { top: 13%; }
  .disc:not(.disc--end) p { display: none; }
  .disc--end > div { padding: var(--sc-5); }
  .disc { flex-basis: 74vw; }
  .disc img { aspect-ratio: 16 / 10; }

  .hush__line { font-size: var(--sc-t-2xl); }
  .h2 { font-size: var(--sc-t-2xl); }
  .h2--xl { font-size: var(--sc-t-3xl); }
  .pav__b { bottom: calc(var(--kp-h) + 2rem); }
  .tags { justify-content: flex-start; }

  .built__grid, .studios__field, .tulum__mosaic { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--sc-4); }
  .built__copy { grid-column: 1 / -1; grid-row: auto; position: static; }
  .built__a { grid-column: 1 / span 3; } .built__b { grid-column: 4 / span 3; margin-top: 20%; }
  .built__c { grid-column: 1 / span 3; } .built__d { grid-column: 4 / span 3; margin-top: 20%; }
  .room--bjj, .room--pilates { grid-column: 1 / span 3; margin-top: 0; }
  .room--yoga { grid-column: 4 / span 3; margin-top: 20%; }
  .room--seminar, .room--calis { grid-column: 1 / -1; margin-top: 0; }
  .room--pilates { grid-column: 4 / span 3; margin-top: -10%; }
  .room--seminar { grid-column: 1 / span 3; } .room--calis { grid-column: 4 / span 3; }
  .room--seminar img, .room--calis img { aspect-ratio: 4 / 5; }

  .cima__plate { right: 50%; translate: 50% 0; top: 4.2rem; width: 44vw; }
  .cima__copy .brands { display: none; }
  .cima__copy .h2 { font-size: var(--sc-t-xl); }
  .cima__copy .planline { margin-bottom: var(--sc-4); }
  .cima__copy { top: auto; bottom: calc(var(--kp-h) + 1rem); translate: none; left: var(--sc-gutter); right: var(--sc-gutter); width: auto; padding: var(--sc-5); }
  .cima__copy p:not(.price):not(.brands) { font-size: var(--sc-t-sm); }

  .balam__grid { grid-template-columns: 1fr 1fr; gap: var(--sc-5); }
  .balam__copy { grid-column: 1 / -1; grid-row: 1; }
  .balam__dish { margin-top: 30%; }
  .lab__grid { grid-template-columns: 1fr 1fr; gap: var(--sc-3); }
  .test h4 { font-size: var(--sc-t-base); margin: var(--sc-3) var(--sc-3) .3rem; }
  .test p { margin: 0 var(--sc-3) var(--sc-3); font-size: var(--sc-t-xs); }
  .test__price span { font-size: var(--sc-t-lg); }

  .rec__f img, .rec__f video { width: 100%; height: 52%; }
  .rec__f::after { background: linear-gradient(0deg, var(--rec-bg, #0F1A1A) 48%, transparent 62%); }
  .rec__copy { top: auto; bottom: calc(var(--kp-h) + 1rem); translate: none; width: auto; right: var(--sc-gutter); }
  .rec__copy .h2 { font-size: var(--sc-t-xl); margin-bottom: var(--sc-3); }
  .rec__steps li { padding: .3rem 0 .3rem .8rem; font-size: var(--sc-t-xs); }
  .rec__steps li:not(.is-on) { display: none; }
  .rec__steps li b { font-size: var(--sc-t-base); }

  .door { grid-template-columns: 1fr; grid-template-rows: 38vh auto; top: calc(6vh + var(--i) * 1.6rem); min-height: 0; margin-bottom: 10vh; }
  .door__body { padding: var(--sc-5); }
  .door h3 { font-size: var(--sc-t-xl); }
  .door p { font-size: var(--sc-t-sm); }

  .tulum__title, .tulum__lede, .tulum__transfer { grid-column: 1 / -1; }
  .t--beach { grid-column: 1 / -1; }
  .t--cenote { grid-column: 1 / span 3; margin-top: 0; }
  .t--ruins { grid-column: 4 / span 3; margin-top: 18%; }
  .t--sian { grid-column: 1 / span 3; margin-top: 0; }
  .t--kaan { grid-column: 4 / span 3; margin-top: 18%; }

  .close__grid { grid-template-columns: 1fr; gap: var(--sc-6); }
  .close__plan { position: static; }
  .close .plan-slot { max-height: 70svh; }
  .row { grid-template-columns: 1fr 1fr; }
  .row .field:first-child { grid-column: 1 / -1; }
  .seg { grid-template-columns: 1fr 1fr; }
  .foot__grid { grid-template-columns: 1fr 1fr; }
  .foot__brand, .foot address { grid-column: 1 / -1; }

  .keyplan { left: 0; right: 0; bottom: 0; border-radius: 16px 16px 0 0; padding: .45rem var(--sc-4) calc(.45rem + env(safe-area-inset-bottom)); gap: var(--sc-3); }
  .keyplan__map { width: 32px; height: 57px; }
  .keyplan__here { min-width: 0; flex: 1; }
  .keyplan__book { margin-left: auto; }
  .plandlg { width: 100vw; max-width: 100vw; max-height: 100svh; height: 100svh; border-radius: 0; margin: 0; }
  .plandlg__inner { max-height: 100svh; height: 100%; }
  .plandlg__body { grid-template-columns: 1fr; padding: var(--sc-3) var(--sc-4) var(--sc-6); }
  .plandlg .plan-slot { height: 62svh; }
  .plandlg__list { grid-template-columns: 1fr 1fr; }
}
html.is-short .hero__title { font-size: var(--sc-t-2xl); }
html.is-short .fight__copy { height: 18rem; }
html.is-short .door { grid-template-rows: 30vh auto; }
html.is-short .door .amen { display: none; }

/* ========================================================= REDUCED MOTION == */
@media (prefers-reduced-motion: reduce) {
  .hero__clouds i { animation: none; }
  .bld__roof, .bld__inside, .rec__f, .keyplan { transition-duration: 1ms; }
  .fight__frame.is-on { animation: none; }
}