/* =========================================================================
   Floor Layout page
   ========================================================================= */

/* ---------- Intro + stacking plan ---------- */
.fl-intro { padding-top: calc(var(--header-h) + clamp(2.5rem, 6vw, 5.5rem)); padding-bottom: clamp(3.5rem, 7vw, 6.5rem); }
.fl-intro__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(1rem, 2.2vw, 2.25rem); align-items: end; }
.fl-intro__text { grid-column: 1 / span 6; padding-bottom: clamp(1rem, 3vw, 2.5rem); }
.fl-intro__title { font-size: clamp(3.6rem, 10.4vw, 11rem); line-height: .88; margin-top: 1.5rem; }
.fl-intro__lead { max-width: 30rem; margin-top: clamp(1.6rem, 3vw, 2.6rem); }
.fl-facts { display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: 0 clamp(1.6rem, 3.4vw, 3.6rem); margin-top: clamp(2.4rem, 4vw, 3.4rem); padding-top: 1.5rem; border-top: 1px solid var(--line-strong); max-width: 36rem; }
.fl-facts dd { font-family: var(--f-display); font-size: clamp(2.2rem, 3.2vw, 3.2rem); line-height: 1; color: var(--ink); margin-top: .7rem; display: flex; align-items: baseline; gap: .2rem; font-variant-numeric: lining-nums; }
.fl-facts dd small { font-family: var(--f-sans); font-size: .66rem; font-weight: 600; letter-spacing: .18em; color: var(--stone); margin-left: .35rem; }
.fl-facts__approx { font-size: .6em; color: var(--brass); margin-right: .15rem; }
.fl-intro__stack { grid-column: 7 / span 6; }
.fl-intro__stack .caption { margin-top: 1.4rem; }

.stack { position: relative; }
.stack__art { width: 58%; height: auto; overflow: visible; }
.stack__rows { position: absolute; inset: 0; }
.stack__row { position: absolute; left: 0; right: 0; }
.stack__btn {
  position: relative; width: 100%; height: 100%; display: flex; align-items: center; gap: .9rem;
  padding-left: calc(58% + 2.4rem); text-align: left; color: var(--ink);
}
.stack__btn::before { /* leader from the facade to the label */
  content: ""; position: absolute; left: calc(58% + .5rem); width: 1.4rem; top: 50%; height: 1px; background: var(--line-strong);
  transform-origin: left; transition: background-color .4s var(--ease-out), transform .6s var(--ease-out);
}
.stack__num { font-family: var(--f-display); font-style: italic; font-size: 1.35rem; color: var(--brass); line-height: 1; min-width: 1.6rem; }
.stack__info { display: grid; gap: .1rem; line-height: 1.3; }
.stack__name { font-size: .72rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.stack__avail { font-size: .86rem; color: var(--ink-2); }
.stack__sf { font-size: .8rem; color: var(--stone); opacity: 0; transform: translateY(-4px); transition: opacity .45s var(--ease-out), transform .6s var(--ease-out); }
.stack__row.is-static .stack__btn { cursor: default; color: var(--stone); }
.stack__row.is-static .stack__num { color: var(--stone-2); }
.stack__row.is-static .stack__avail { color: var(--stone); font-size: .8rem; }
.stack__btn[data-floor]:hover .stack__sf, .stack__btn[data-floor]:focus-visible .stack__sf, .stack__row.is-selected .stack__sf { opacity: 1; transform: none; }
.stack__btn[data-floor]:hover::before, .stack__btn[data-floor]:focus-visible::before { background: var(--brass); transform: scaleX(1.25); }
.stack__row.is-selected .stack__btn::before { background: var(--ink); transform: scaleX(1.25); }
.stack__row.is-selected .stack__name { color: var(--brass-2); }
.stack__btn:focus-visible { outline: 1.5px solid var(--brass); outline-offset: -1px; }
.stack__row:not(.has-avail) .stack__avail { color: var(--stone); }

.stack__ground { stroke: var(--line-strong); stroke-width: 1; }
.stack__slab { fill: #fbf8f3; stroke: #cdbfac; stroke-width: .8; }
.stack__mech { fill: #f0e9de; stroke: #cdbfac; stroke-width: .8; }
.stack__mullion { stroke: rgba(255, 255, 255, .6); stroke-width: .7; }
.stack__demise { stroke: #fbf8f3; stroke-width: 1.8; }
.stack__cove { stroke: #c79f64; stroke-width: 1.1; }
.stack__hit { fill: transparent; stroke: transparent; stroke-width: 1.4; transition: stroke .4s var(--ease-out), fill .4s var(--ease-out); }
.stack__band.is-hover .stack__hit { stroke: var(--brass); fill: rgba(168, 131, 79, .08); }
.stack__band.is-selected .stack__hit { stroke: var(--ink); }
.stack__fin-frame { fill: #fbf8f3; stroke: #cdbfac; stroke-width: .8; }
.stack__fin-glass { stroke: #d8c7ab; stroke-width: .6; }
.stack__fin-mullion { stroke: #cfb488; stroke-width: .7; }
.stack__marker line { stroke: var(--brass); stroke-width: 2; }

/* ---------- Steps (sticky) ---------- */
.fl-explorer { position: relative; }
.fl-steps {
  position: sticky; top: var(--header-h-sm); z-index: 30;
  background: rgba(251, 248, 243, .94); -webkit-backdrop-filter: saturate(1.3) blur(12px); backdrop-filter: saturate(1.3) blur(12px);
  border-block: 1px solid var(--line);
}
.fl-steps .container { position: relative; }
.fl-steps__list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.fl-steps__item a { display: flex; align-items: baseline; gap: .75rem; padding: 1.05rem 0 1.1rem; color: var(--stone); transition: color .4s var(--ease-out); }
.fl-steps__num { font-family: var(--f-display); font-style: italic; font-size: 1.2rem; line-height: 1; color: var(--stone-2); transition: color .4s var(--ease-out); }
.fl-steps__txt { font-size: .68rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; white-space: nowrap; }
.fl-steps__item a:hover { color: var(--ink); }
.fl-steps__item.is-done a { color: var(--ink-2); }
.fl-steps__item.is-done .fl-steps__num { color: var(--brass); }
.fl-steps__item.is-current a { color: var(--ink); }
.fl-steps__item.is-current .fl-steps__num { color: var(--blush-2); }
.fl-steps__bar { position: absolute; left: var(--gutter); right: var(--gutter); bottom: -1px; height: 1px; }
.fl-steps__bar i { position: absolute; inset: 0; background: var(--brass); transform: scaleX(.125); transform-origin: left; transition: transform 1s var(--ease-out); }

/* ---------- Explorer ---------- */
.fl-explorer__inner { padding-top: clamp(2rem, 4vw, 3.5rem); padding-bottom: calc(var(--section) * .55); }
.fl-bar { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; border-bottom: 1px solid var(--line); }
.fl-tabs { display: flex; gap: clamp(1.5rem, 3.2vw, 3.4rem); }
.fl-tab { position: relative; display: grid; grid-template-columns: auto auto; column-gap: .6rem; align-items: baseline; justify-content: start; padding: .4rem 0 1.15rem; text-align: left; color: var(--stone); transition: color .4s var(--ease-out); }
.fl-tab__num { font-family: var(--f-display); font-style: italic; font-size: 1.25rem; color: var(--stone-2); transition: color .4s var(--ease-out); }
.fl-tab__name { font-size: .74rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.fl-tab__meta { grid-column: 1 / -1; font-size: .8rem; letter-spacing: .01em; margin-top: .2rem; }
.fl-tab::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--ink); transform: scaleX(0); transform-origin: left; transition: transform .7s var(--ease-out); }
.fl-tab:hover { color: var(--ink); }
.fl-tab[aria-selected="true"] { color: var(--ink); }
.fl-tab[aria-selected="true"] .fl-tab__num { color: var(--brass); }
.fl-tab[aria-selected="true"]::after { transform: scaleX(1); }
.fl-tab:focus-visible { outline-offset: 4px; }
.fl-layout { display: flex; align-items: center; gap: .5rem; padding-bottom: 1rem; }
.fl-layout__label { margin-right: .5rem; }
.fl-layout .chip.is-disabled { opacity: .38; cursor: not-allowed; }
.fl-layout .chip.is-disabled:hover { border-color: var(--line-strong); }

.fl-main { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(1rem, 2.2vw, 2.25rem); margin-top: clamp(2rem, 3.4vw, 3rem); align-items: start; }
.fl-viewer { grid-column: 1 / span 8; min-width: 0; }
.fl-viewer:focus { outline: none; }
.fl-viewer__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; }
.fl-viewer__title { font-size: clamp(2.6rem, 4.6vw, 4.8rem); }
.fl-viewer__summary { margin-top: .7rem; font-size: .72rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--stone); }
.fl-viewer__pdf { flex: none; }

.fl-frame { position: relative; margin-top: 1.5rem; aspect-ratio: 16 / 10.6; background: #fdfbf7; border: 1px solid var(--line); overflow: hidden; }
/* the bottom band is kept clear for the zoom tools so they never sit on the drawing */
.fl-frame__canvas { position: absolute; inset: clamp(.4rem, 1.4vw, 1.2rem) clamp(.4rem, 1.4vw, 1.2rem) 3.6rem; opacity: 0; }
.fl-frame__canvas.is-in { opacity: 1; transition: opacity .7s var(--ease-soft); }
.fl-frame__bar { display: none; }
.fl-tools { position: absolute; right: .75rem; bottom: .6rem; display: flex; gap: .4rem; pointer-events: none; z-index: 2; }
.fl-tool {
  pointer-events: auto; width: 2.75rem; height: 2.75rem; display: grid; place-items: center;
  background: rgba(251, 248, 243, .92); border: 1px solid var(--line-strong); color: var(--ink);
  transition: background-color .35s var(--ease-out), color .35s var(--ease-out), border-color .35s var(--ease-out);
}
.fl-tool svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.2; }
.fl-tool:hover { background: var(--ink); color: var(--ivory); border-color: var(--ink); }
.fl-tool--full { margin-left: .5rem; width: auto; padding: 0 1rem; display: inline-flex; gap: .6rem; font-size: .66rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.fl-frame__hint {
  position: absolute; left: 50%; bottom: 1rem; transform: translate(-50%, 6px); z-index: 2; pointer-events: none;
  padding: .55rem 1rem; background: var(--ink); color: var(--ivory); font-size: .66rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase;
  opacity: 0; transition: opacity .4s var(--ease-out), transform .6s var(--ease-out); white-space: nowrap;
}
.fl-frame__hint.is-on { opacity: 1; transform: translate(-50%, 0); }

/* Enlarged plan */
html.fl-lock, html.fl-lock body { overflow: hidden; }
.fl-frame.is-full { position: fixed; inset: 0; z-index: 160; margin: 0; aspect-ratio: auto; border: 0; background: var(--ivory); animation: fl-full-in .5s var(--ease-out); }
@keyframes fl-full-in { from { opacity: 0; } to { opacity: 1; } }
.fl-frame.is-full .fl-frame__bar { display: flex; align-items: center; justify-content: space-between; gap: 2rem; height: 4.5rem; padding: 0 var(--gutter); border-bottom: 1px solid var(--line); }
.fl-frame__title { display: flex; align-items: baseline; gap: .8rem; font-size: .74rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--ink); }
.fl-frame__title .index-num { font-size: 1.4rem; }
.fl-frame__close { display: inline-flex; align-items: center; gap: .7rem; min-height: 2.75rem; padding: 0 1.1rem; border: 1px solid var(--line-strong); font-size: .68rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--ink); transition: background-color .35s, color .35s; }
.fl-frame__close:hover { background: var(--ink); color: var(--ivory); }
.fl-frame.is-full .fl-frame__canvas { inset: 5.5rem var(--gutter) 5.75rem; }
.fl-frame.is-full .fl-tools { right: var(--gutter); bottom: 1.5rem; }
.fl-frame.is-full .fl-tool--full { display: none; }
.fl-frame.is-full .fl-frame__hint { bottom: auto; top: 5.5rem; }
.fl-legend--frame { display: none; }
/* selected suite, shown inside the enlarged view */
.fl-frame__sel { display: none; }
.fl-frame.is-full .fl-frame__sel:not([hidden]) { position: absolute; left: var(--gutter); bottom: 1.5rem; z-index: 2; display: flex; align-items: center; gap: 1.6rem; padding: .7rem 1.1rem .7rem 1.2rem; background: rgba(251, 248, 243, .94); border: 1px solid var(--line); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.fl-frame__sel p { display: grid; gap: .1rem; line-height: 1.2; }
.fl-frame__sel-name { font-family: var(--f-display); font-size: 1.45rem; color: var(--ink); }
.fl-frame__sel-meta { font-size: .64rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--stone); }
.fl-frame__sel .link-arrow { font-size: .66rem; }
.fl-frame.is-full .fl-legend--frame { display: flex; margin-left: auto; }

.fl-viewer__foot { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 1rem 2rem; margin-top: 1.2rem; }
.fl-legend { display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; }
.fl-legend li { display: inline-flex; align-items: center; gap: .6rem; font-size: .66rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-2); }
.fl-sw { width: 1.1rem; height: .75rem; flex: none; border: 1px solid transparent; }
.fl-sw--available { background: #f0dfc0; border-color: #c9a46c; }
.fl-sw--under-offer { background: repeating-linear-gradient(45deg, #c3a273 0 1px, #f8f3ea 1px 4px); border-color: #c9ad84; }
.fl-sw--leased { background: #e8e6e2; border-color: #cfc8be; }
.fl-sw--core { background: #e3dbcf; border-color: #4a433b; }
.fl-viewer__cap { margin-top: 0; max-width: 34rem; }

/* ---------- Suite panel ---------- */
.fl-panel { grid-column: 9 / span 4; position: sticky; top: calc(var(--header-h-sm) + 5.5rem); border-left: 1px solid var(--line); padding-left: clamp(1.5rem, 2.6vw, 2.75rem); min-height: 20rem; }
.fl-panel:focus { outline: none; }
.fl-panel__inner { animation: fl-panel-in .7s var(--ease-out); }
@keyframes fl-panel-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.fl-panel__title { margin-top: 1.1rem; font-size: clamp(2.2rem, 3vw, 3rem); }
.fl-panel__lede { margin-top: .8rem; max-width: 22rem; }
.fl-panel__list { margin-top: 1.8rem; border-top: 1px solid var(--line); }
.fl-pick {
  width: 100%; display: grid; grid-template-columns: minmax(4.4rem, auto) 1fr auto auto; align-items: center; gap: .8rem;
  padding: .85rem .2rem; border-bottom: 1px solid var(--line); text-align: left; transition: background-color .35s var(--ease-out), padding .5s var(--ease-out);
}
.fl-pick__id { font-family: var(--f-display); font-size: 1.55rem; line-height: 1; color: var(--ink); white-space: nowrap; }
.fl-pick__sf { font-size: .88rem; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.fl-pick .arrow { color: var(--ink); transition: transform .5s var(--ease-out); }
.fl-pick:hover { background: var(--linen); padding-inline: .7rem .5rem; }
.fl-pick:hover .arrow { transform: translateX(4px); }
.fl-pick.is-leased .fl-pick__id, .fl-pick.is-leased .fl-pick__sf { color: var(--stone); }
.fl-panel__actions { display: grid; gap: .7rem; margin-top: 1.8rem; justify-items: stretch; }
.fl-panel__actions .btn { white-space: normal; text-align: center; padding-block: .9rem; line-height: 1.3; }
.fl-panel__print { justify-self: start; margin-top: .4rem; }

.fl-panel__top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 2.75rem; }
.fl-panel__back { display: inline-flex; align-items: center; gap: .6rem; min-height: 2.75rem; font-size: .66rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--stone); transition: color .3s; }
.fl-panel__back .arrow { transition: transform .5s var(--ease-out); }
.fl-panel__back:hover { color: var(--ink); }
.fl-panel__back:hover .arrow { transform: translateX(-4px); }
.fl-panel__name { margin-top: .5rem; font-size: clamp(3rem, 4.6vw, 4.8rem); }
.fl-specs { display: grid; grid-template-columns: 1fr 1fr; margin-top: 1.6rem; border-top: 1px solid var(--line); }
.fl-specs > div { padding: .8rem 0 .75rem; border-bottom: 1px solid var(--line); }
.fl-specs > div:nth-child(odd):not(.fl-specs__wide) { padding-right: 1rem; }
.fl-specs__wide { grid-column: 1 / -1; }
.fl-specs dt { font-size: .64rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--stone); }
.fl-specs dd { font-family: var(--f-display); font-size: 1.5rem; line-height: 1.1; color: var(--ink); margin-top: .25rem; }
.fl-panel__plan { margin-top: 2.2rem; }
.fl-panel__mini { aspect-ratio: 16 / 10.4; background: #fdfbf7; border: 1px solid var(--line); padding: .5rem; }
.fl-panel__plan .caption { margin-top: .8rem; }
.fl-panel__kf { margin-top: 2.2rem; }
.fl-panel__features { margin-top: .8rem; }
.fl-panel__features li { font-size: .7rem; padding: .75rem 0; }

/* status pill */
.fl-status { display: inline-flex; align-items: center; gap: .5rem; font-size: .64rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--ink); white-space: nowrap; }
.fl-status::before { content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: var(--brass); flex: none; }
.fl-status--under-offer { color: var(--brass-2); }
.fl-status--under-offer::before { background: transparent; border: 1px solid var(--brass); box-shadow: inset 0 0 0 1.5px var(--ivory), inset 0 0 0 3px var(--brass); }
.fl-status--leased { color: var(--stone); }
.fl-status--leased::before { background: var(--stone-2); }

/* ---------- Availability ---------- */
.fl-avail { padding-top: calc(var(--section) * .7); border-top: 1px solid var(--line); }
.fl-avail__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.fl-avail__title { margin-top: 1.4rem; font-size: clamp(2.8rem, 6vw, 6.2rem); }
.fl-avail__meta { display: grid; justify-items: end; gap: .4rem; text-align: right; }
.fl-avail__count { font-family: var(--f-display); font-size: clamp(1.8rem, 2.6vw, 2.6rem); color: var(--ink); line-height: 1; }
.fl-filters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: 1.5rem clamp(1.2rem, 2.4vw, 2.5rem); align-items: end; margin-top: clamp(2.5rem, 4vw, 3.5rem); }
.fl-filters .select { font-size: 1rem; }
.fl-filters__reset { margin-bottom: .35rem; }

.fl-table-wrap { margin-top: clamp(2rem, 3.4vw, 3rem); }
.fl-table { width: 100%; border-collapse: collapse; }
.fl-table thead th { text-align: left; font-weight: 600; padding: 0 .9rem .9rem; border-bottom: 1px solid var(--line-strong); }
.fl-table thead th:first-child { padding-left: 0; }
.fl-table th.num, .fl-table td.num { text-align: right; }
.fl-table thead button { display: inline-flex; align-items: center; gap: .5rem; font-size: .66rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--stone); transition: color .3s; }
.fl-table thead button::after { content: ""; width: .4rem; height: .4rem; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg) translateY(-2px); opacity: .35; transition: transform .4s var(--ease-out), opacity .3s; }
.fl-table thead button:hover { color: var(--ink); }
.fl-table th[aria-sort="ascending"] button, .fl-table th[aria-sort="descending"] button { color: var(--ink); }
.fl-table th[aria-sort="ascending"] button::after { opacity: 1; transform: rotate(-135deg) translateY(-1px); }
.fl-table th[aria-sort="descending"] button::after { opacity: 1; }
.fl-row { cursor: pointer; transition: background-color .35s var(--ease-out); }
.fl-row > * { padding: 1.15rem .9rem; border-bottom: 1px solid var(--line); vertical-align: middle; }
.fl-row > th { padding-left: 0; font-weight: 400; text-align: left; position: relative; }
.fl-row td { font-size: .95rem; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.fl-row__btn { font-family: var(--f-display); font-size: 1.7rem; line-height: 1; color: var(--ink); text-align: left; transition: transform .6s var(--ease-out), color .3s; }
.fl-row__view { display: inline-flex; align-items: center; gap: .6rem; font-size: .66rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--ink); opacity: 0; transform: translateX(-6px); transition: opacity .4s var(--ease-out), transform .6s var(--ease-out); white-space: nowrap; }
.fl-row__act { text-align: right; width: 1%; }
.fl-row:hover, .fl-row.is-hover { background: var(--linen); }
.fl-row:hover .fl-row__btn, .fl-row.is-hover .fl-row__btn { transform: translateX(.7rem); }
.fl-row:hover .fl-row__view, .fl-row.is-hover .fl-row__view, .fl-row:focus-within .fl-row__view { opacity: 1; transform: none; }
.fl-row.is-leased .fl-row__btn, .fl-row.is-leased td { color: var(--stone); }
.fl-row.is-selected > th::before { content: ""; position: absolute; left: -1.1rem; top: 50%; width: .45rem; height: .45rem; margin-top: -.22rem; transform: rotate(45deg); background: var(--brass); }
.fl-table__empty { padding: 2.5rem 0; color: var(--stone); border-bottom: 1px solid var(--line); }

/* ---------- Products ---------- */
.fl-products__title { margin-top: 1.4rem; font-size: clamp(3.4rem, 9vw, 9.4rem); }
.fl-products__list { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(1rem, 2.2vw, 2.25rem); margin-top: clamp(3rem, 6vw, 5.5rem); align-items: start; }
.fl-product { display: grid; gap: 1.6rem; }
.fl-product--a { grid-column: 1 / span 4; }
.fl-product--b { grid-column: 5 / span 4; margin-top: clamp(4rem, 9vw, 9rem); }
.fl-product--c { grid-column: 9 / span 4; margin-top: clamp(2rem, 4.5vw, 4.5rem); }
.fl-product__media { aspect-ratio: 4 / 5; }
.fl-product--b .fl-product__media { aspect-ratio: 3 / 4; }
.fl-product__text { display: grid; grid-template-columns: 2.4rem 1fr; column-gap: .6rem; row-gap: .6rem; justify-items: start; }
.fl-product__text .index-num { grid-row: span 3; font-size: 1.3rem; padding-top: .3rem; }
.fl-product__text p { max-width: 22rem; color: var(--ink-2); }
.fl-product__text .link-arrow { margin-top: .5rem; white-space: nowrap; }

/* ---------- Journey ---------- */
.fl-journey__head { display: grid; gap: 1.4rem; }
.fl-journey__title { font-size: clamp(2.8rem, 6.6vw, 6.8rem); }
.fl-journey__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1.25rem, 2.6vw, 2.75rem); margin-top: clamp(3rem, 6vw, 5rem); border-top: 1px solid var(--line-strong); }
.fl-journey__step { position: relative; padding-top: 2.2rem; display: grid; gap: .5rem; align-content: start; }
.fl-journey__mark { position: absolute; left: 0; top: -.33rem; width: .62rem; height: .62rem; transform: rotate(45deg); background: var(--ivory); border: 1px solid var(--brass); }
.fl-journey__step:last-child .fl-journey__mark { background: var(--blush-2); border-color: var(--blush-2); }
.fl-journey__step .index-num { font-size: 1.3rem; }
.fl-journey__step p { max-width: 17rem; color: var(--ink-2); }

/* ---------- Responsive ---------- */
@media (max-width: 1180px) {
  .fl-viewer { grid-column: 1 / span 7; }
  .fl-panel { grid-column: 8 / span 5; }
  /* five steps no longer fit on one line each: let labels wrap under their numeral */
  .fl-steps__item a { align-items: flex-start; padding-right: 1.2rem; }
  .fl-steps__txt { white-space: normal; line-height: 1.35; padding-top: .2rem; }
}
@media (max-width: 900px) {
  .fl-intro__text, .fl-intro__stack { grid-column: 1 / -1; }
  .fl-intro__stack { margin-top: 3rem; max-width: 36rem; }
  .fl-main { display: block; }
  .fl-panel { position: static; border-left: 0; padding-left: 0; margin-top: 2.6rem; padding-top: 2rem; border-top: 1px solid var(--line-strong); min-height: 0; }
  .fl-bar { flex-direction: column; align-items: stretch; gap: 0; border-bottom: 0; }
  .fl-tabs { border-bottom: 1px solid var(--line); }
  .fl-layout { padding: 1rem 0 0; }
  .fl-products__list { display: grid; grid-template-columns: 1fr; row-gap: 3.5rem; }
  .fl-product--a, .fl-product--b, .fl-product--c { grid-column: 1 / -1; margin-top: 0; }
  .fl-product--b { margin-left: 18%; }
  .fl-product--c { margin-right: 12%; }
  .fl-journey__list { grid-template-columns: 1fr 1fr; row-gap: 3rem; }
  .fl-filters { grid-template-columns: 1fr 1fr; }
  .fl-filters__reset { justify-self: start; }
}
@media (max-width: 760px) {
  .fl-steps__list { display: flex; }
  .fl-steps__item { flex: 0 0 auto; }
  .fl-steps__item.is-current { flex: 1 1 auto; }
  .fl-steps__item a { padding: .85rem .7rem .9rem 0; gap: .5rem; }
  .fl-steps__item:not(.is-current) .fl-steps__txt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .fl-steps__txt { font-size: .62rem; }
  .fl-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
  .fl-tab { grid-template-columns: 1fr; padding: .3rem .2rem .9rem 0; }
  .fl-tab__name { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .fl-tab__num { font-size: 1.7rem; line-height: 1; }
  .fl-tab__meta { font-size: .68rem; line-height: 1.3; margin-top: .35rem; }
  .fl-viewer__head { flex-direction: column; align-items: flex-start; gap: .8rem; }
  .fl-viewer__head + .fl-frame { margin-top: 1.1rem; }
  .fl-frame { aspect-ratio: 16 / 13.6; }
  .fl-frame__canvas { inset: .3rem .3rem 3.6rem; }
  .fl-tools { right: .5rem; bottom: .5rem; gap: .35rem; }
  .fl-tool { width: 2.75rem; height: 2.75rem; }
  .fl-tool--full span { display: none; }
  .fl-tool--full { width: 2.75rem; padding: 0; margin-left: .35rem; }
  .fl-frame.is-full .fl-frame__canvas { inset: 4.5rem .5rem 4.4rem; }
  .fl-frame.is-full .fl-tools { right: .6rem; bottom: .75rem; }
  .fl-frame.is-full .fl-frame__sel:not([hidden]) { left: .6rem; bottom: .75rem; max-width: calc(100% - 11.5rem); padding: .45rem .8rem; gap: .2rem .9rem; flex-wrap: wrap; }
  .fl-frame__sel-name { font-size: 1.2rem; }
  .fl-frame__sel-meta { font-size: .58rem; letter-spacing: .14em; }
  .fl-frame__sel .link-arrow { padding-block: .2rem; font-size: .6rem; }
  .fl-frame.is-full .fl-frame__bar { height: 4rem; }
  .fl-frame.is-full .fl-legend--frame { display: none; }
  .fl-legend { gap: .5rem 1.1rem; }
  .fl-avail__meta { justify-items: start; text-align: left; }
  /* table → cards */
  .fl-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .fl-table, .fl-table tbody { display: block; }
  .fl-row { display: flex; flex-wrap: wrap; align-items: center; column-gap: .45rem; row-gap: .45rem; padding: 1.1rem 0 1.15rem; border-bottom: 1px solid var(--line); }
  .fl-row > * { padding: 0; border: 0; }
  .fl-row > th { flex: 1 1 55%; }
  .fl-row td[data-label="Availability"] { order: -0; flex: 0 0 auto; }
  .fl-row td[data-label="Floor"], .fl-row td[data-label="Approx. size"], .fl-row td[data-label="Type"] { order: 2; font-size: .88rem; text-align: left; }
  .fl-row td[data-label="Floor"] { flex-basis: auto; }
  .fl-row td[data-label="Floor"]::before { content: "Floor "; }
  .fl-row td[data-label="Approx. size"]::before, .fl-row td[data-label="Type"]::before { content: "·"; margin-right: .45rem; color: var(--stone-2); }
  .fl-row::after { content: ""; order: 1; flex: 0 0 100%; height: 0; }
  .fl-row__act { display: none; }
  .fl-row:hover .fl-row__btn, .fl-row.is-hover .fl-row__btn { transform: none; }
  .fl-row.is-selected > th::before { left: auto; right: -1rem; display: none; }
  .fl-row.is-selected { box-shadow: inset 2px 0 0 var(--brass); padding-left: .9rem; }
  .fl-row__btn { font-size: 1.85rem; }
  .fl-journey__list { grid-template-columns: 1fr; border-top: 0; border-left: 1px solid var(--line-strong); gap: 2.4rem; padding-left: 1.6rem; }
  .fl-journey__step { padding-top: 0; }
  .fl-journey__mark { left: calc(-1.6rem - .33rem); top: .5rem; }
  .fl-filters { gap: 1.25rem 1.25rem; }
}
@media (max-width: 520px) {
  .fl-intro__title { font-size: 3.9rem; }
  .fl-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 1rem; }
  .fl-facts dd { font-size: 2rem; }
  .fl-facts dt { font-size: .6rem; letter-spacing: .16em; }
  .stack__art { width: 54%; }
  .stack__btn { padding-left: calc(54% + 1.5rem); gap: .55rem; }
  .stack__btn::before { left: calc(54% + .3rem); width: .8rem; }
  .stack__num { font-size: 1.1rem; min-width: 1.2rem; }
  .stack__name { font-size: .62rem; letter-spacing: .16em; }
  .stack__avail { font-size: .74rem; line-height: 1.25; }
  .stack__sf { display: none; }
  .stack__info { gap: 0; line-height: 1.25; }
  .stack__row.is-static .stack__avail { font-size: .7rem; }
  .fl-layout__label { display: none; }
  .fl-layout .chip { flex: 1; justify-content: center; }
  .fl-panel__name { font-size: 3.4rem; }
  .fl-pick { grid-template-columns: 3.4rem 1fr auto; }
  .fl-pick .arrow { display: none; }
}

/* closing band: the lobby photo is bright, so dim it a little more than on Home */
.page-floor-layout .cta-band__media { opacity: .36; }

/* ---------- QA screenshots ---------- */
.qa .fl-steps { position: relative; top: 0; }

/* ---------- Print: suite sheet only ---------- */
.fl-print { display: none; }
@media print {
  @page { size: letter portrait; margin: 13mm 14mm; }
  html.fl-printing body > *:not(.fl-print) { display: none !important; }
  html.fl-printing body { background: #fff; }
  html.fl-printing .fl-print { display: block; color: #15130f; font-family: var(--f-sans); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .fl-print__head { display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: 5mm; border-bottom: .6pt solid #15130f; }
  .fl-print__brand { font-family: var(--f-display); font-size: 20pt; text-transform: uppercase; line-height: 1; letter-spacing: .02em; }
  .fl-print__brand em { font-style: italic; text-transform: none; color: #d98b84; }
  .fl-print__addr, .fl-print__kind, .fl-print__eyebrow, .fl-print__h, .fl-print__specs dt { font-size: 7pt; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: #7d746a; }
  .fl-print__addr { margin-top: 2mm; }
  .fl-print__title { margin-top: 8mm; }
  .fl-print__title h1 { font-family: var(--f-display); font-weight: 400; font-size: 40pt; line-height: 1; text-transform: uppercase; margin-top: 2mm; }
  .fl-print__plan { margin-top: 6mm; height: 112mm; border: .5pt solid #d8cfc3; padding: 2mm; }
  .fl-print__plan svg { width: 100%; height: 100%; }
  .fl-print__cols { display: grid; grid-template-columns: 1.1fr 1.2fr .9fr; gap: 8mm; margin-top: 7mm; }
  .fl-print__specs div { display: flex; justify-content: space-between; border-bottom: .5pt solid #d8cfc3; padding: 1.6mm 0; }
  .fl-print__specs dd { font-family: var(--f-display); font-size: 12pt; }
  .fl-print__features { margin-top: 2mm; }
  .fl-print__features li { font-size: 9pt; padding: 1.4mm 0; border-bottom: .5pt solid #d8cfc3; }
  .fl-print__contact p:last-child { font-size: 9pt; line-height: 1.55; margin-top: 2mm; }
  .fl-print__note { margin-top: 8mm; font-size: 7.5pt; color: #7d746a; max-width: 150mm; }
}
