/* One&Only Private Homes VR microsite (sekoya17 template, 2023 variant; copied from the L'Horizon d'Anna build). Ported from the
   live Elementor CSS (kit post-9, header 2655, page template 2675, footer 2661, menu popup 2616, form popups 6896/5653/6891,
   home 5629, floor plans 6978, masterplan 6661). Breakpoints: mobile <= 575, tablet <= 1279, desktop >= 1280. */

@font-face { font-family: 'GothamBook'; src: url('../fonts/text.woff2') format('woff2'); font-weight: normal; font-style: normal; font-display: auto; }
@font-face { font-family: 'Baskervville'; src: url('../fonts/display.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: auto; }
@font-face { font-family: 'Baskerville MT'; src: url('../fonts/baskerville.woff2') format('woff2'); font-weight: normal; font-style: normal; font-display: auto; }
@font-face { font-family: 'Baskerville MT'; src: url('../fonts/baskerville-italic.woff2') format('woff2'); font-weight: normal; font-style: italic; font-display: auto; }
@font-face { font-family: 'Actor'; src: url('../fonts/actor.woff2') format('woff2'); font-weight: 400; font-style: normal; }

:root {
  --primary: #000000;     /* Elementor global primary + text */
  --secondary: #FFFFFF;   /* header, sidebar, buttons on dark */
  --accent: #F1EEE9;      /* page background */
  --light: #FFFFFF;
  --gold: #00858C;        /* teal: form underlines, submit button, hotspots */
  --panel: #F7F7F7;       /* menu panel */
  --f-text: 'GothamBook', montserat;
  --f-display: 'Baskervville', montserat;
  --f-serif: 'Baskerville MT', montserat;
  --f-form: 'Actor', montserat;
  --f-accent: 'Actor', montserat;
  --nav-w: 3%;            /* desktop vertical sidebar width (Elementor column 3%) */
}

/* ---- Reset (Hello Elementor reset.css essentials) ---- */
*, *::before, *::after { box-sizing: border-box; }
html { line-height: 1.15; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #fff; color: #333; font-family: var(--f-text); font-size: 14px; font-weight: normal; line-height: 1.5; -webkit-font-smoothing: antialiased; }
a { color: var(--accent); text-decoration: none; background: transparent; }
img { border: 0; max-width: 100%; height: auto; vertical-align: middle; }
h1, h2, h3, h4 { margin: .5rem 0 1rem; font-weight: normal; line-height: 1.2; }
button, input, select, textarea { font-family: inherit; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ---- Icon wrapper: replicates Elementor icon widget box (inline-block, line-height 1, svg 1em) ---- */
.ic-wrap { text-align: center; }
.ic { display: inline-block; line-height: 1; font-size: 30px; transition: transform .3s; cursor: pointer; }
.ic img, .ic svg { display: block; width: 1em; height: 1em; }
.ic:hover { transform: scale(.9); }   /* e-animation-shrink */

/* ---- Mobile/tablet header (hidden on desktop, where the sidebar takes over) ---- */
.m-header { position: relative; z-index: 99; display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: 10px; padding: 10px; background: var(--accent); box-shadow: 0 -6px 27px -10px rgba(0, 0, 0, .5); }
.m-header .ic-wrap { text-align: end; }
.m-header .ghost img { opacity: 0; }           /* live left icon is transparent (#04393F00) until hover */
.m-header .ghost:hover img { opacity: 1; }
.m-logo img { width: 75px; }

/* ---- Desktop vertical sidebar ---- */
.v-nav { display: none; }

/* ---- Page body: the viewer fills 85vh, then the footer ---- */
.page { display: flex; min-height: 50vh; }
.content { flex: 1 0 100%; background: var(--accent); }
.viewer { display: block; width: 100%; height: 85vh; border: 0; background: var(--accent); }

/* ---- Footer ---- */
.foot-top { display: flex; flex-direction: column; justify-content: center; align-items: center; min-height: 11vh; padding: 5px; background: var(--secondary); }
.foot-items { display: flex; flex-direction: row; justify-content: space-around; align-items: center; width: 100%; }
.ibox { display: flex; align-items: center; gap: 15px; width: 30%; max-width: 30%; text-align: start; }
.ibox .ibox-icon { flex-shrink: 0; display: inline-block; line-height: 1; font-size: 25px; padding: 5px; border: 1px solid var(--light); border-radius: 50%; color: var(--light); }
.ibox .ibox-icon img { display: block; width: 1em; height: 1em; }
.ibox-text { flex-grow: 1; }
.ibox-title { margin: 8px 0 -5px; font-family: var(--f-display); font-weight: 700; letter-spacing: .5px; font-size: 1.3em; line-height: 1.2; color: var(--light); }
.ibox-title a { color: inherit; }
.ibox-desc { margin: 0; font-family: var(--f-text); color: var(--light); }
.ibox.phone .ibox-title { font-family: var(--f-text); font-weight: normal; letter-spacing: normal; white-space: nowrap; }
.ibox.phone .ibox-desc { font-family: var(--f-display); font-weight: 700; letter-spacing: .5px; }
.foot-bottom { display: flex; flex-direction: row; justify-content: space-between; align-items: center; min-height: 4vh; padding: 10px; background: var(--primary); }
.foot-bottom > div { text-align: center; }
.foot-tagline span { font-size: .8em; color: var(--primary); }   /* same colour as its background on the live site */
.foot-copy { margin-right: 8vw; }
.foot-copy span { font-size: .8em; color: var(--light); }
.foot-credit { margin-right: 5vw; text-align: end !important; }
.foot-credit a { font-size: .6em; color: var(--light); }

/* ---- Popups (menu + forms) ---- */
.popup { position: fixed; inset: 0; display: none; }
.popup.is-open { display: flex; }
.popup-box { position: relative; }
.popup-close { position: absolute; top: 20px; right: 20px; z-index: 2; display: flex; padding: 0; border: 0; background: none; cursor: pointer; line-height: 1; }
.popup-close svg { width: 1em; height: 1em; fill: currentColor; }

/* Slide-out menu: 320px panel, slides in from the left (from the right on phones) */
.menu-pop { z-index: 10; justify-content: flex-start; align-items: center; }
.menu-pop .popup-box { margin: 0 0 0 3%; background: var(--light) var(--panel-bg) 0 0 repeat; box-shadow: 6px 0 31px -9px rgba(0, 0, 0, .2); animation: slideInLeft .8s both; }
.menu-pop.is-closing .popup-box { animation-name: slideOutLeft; }
.menu-pop .popup-msg { display: flex; align-items: flex-start; width: 320px; height: 100vh; padding: 0 6.4px; overflow-y: auto; }   /* scrolls when the menu is taller than the screen */
.menu-pop .popup-close { font-size: 14px; color: #ACACAC; }
.menu-inner { display: flex; flex-direction: column; justify-content: space-between; gap: 10px; width: 100%; margin: auto 0; padding: 40px 15px; }   /* centred when it fits, top-aligned (logo first) when it does not */
.menu-logo { text-align: center; }
.menu-logo img { width: 50%; }
.menu-lists { display: flex; flex-direction: column; padding: 10px; }
.menu-lists h3 { margin: 0; font-family: var(--f-display); font-size: 28px; line-height: 1; text-align: center; color: var(--light); }
.divider { padding: 15px 0; }
.divider span { display: block; width: 60%; margin: 0 auto; border-top: 1px solid var(--light); }
.menu-list { margin: 0 0 80px; padding: 0; list-style: none; text-align: center; }
.menu-list li + li { margin-top: 7px; }
.menu-list a { font-family: var(--f-text); font-weight: bold; text-transform: uppercase; color: var(--light); transition: color .3s; }
.menu-list a:hover { color: var(--gold); }

@keyframes slideInLeft { from { transform: translate3d(-100%, 0, 0); visibility: visible; } to { transform: translate3d(0, 0, 0); } }
@keyframes slideOutLeft { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-100%, 0, 0); } }
@keyframes slideOutRight { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(100%, 0, 0); } }
@keyframes slideInRight { from { transform: translate3d(100%, 0, 0); visibility: visible; } to { transform: translate3d(0, 0, 0); } }

/* Form popups (brochure + pricelist) */
.form-pop { z-index: 9999; justify-content: center; align-items: center; background: rgba(239, 236, 231, .76); }
.form-pop .popup-box { background: var(--secondary) var(--panel-bg) 0 0 repeat; box-shadow: 2px 8px 23px 3px rgba(0, 0, 0, .2); max-height: 100vh; overflow-y: auto; }
.form-pop .popup-msg { width: 75vw; padding: calc(75vw * .03) calc(75vw * .05); }
.form-pop .popup-close { font-size: 15px; color: var(--light); }
.form-pop .popup-close:hover { color: var(--gold); }
.form-inner { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 10px; max-width: 820px; margin: 0 auto; padding: 10px; }   /* 800px content + 10px Elementor container padding */
.form-logo { margin-bottom: 20px; text-align: center; }
.form-logo img { width: 135px; }
.form-inner h2 { margin: 0; font-family: var(--f-display); font-size: 1.8em; font-weight: 500; line-height: 1; text-transform: uppercase; text-align: center; color: var(--light); }
.form-inner .divider { padding: 2px 0; width: 100%; }
.form-inner .divider span { width: 20%; }
.form-inner h4 { width: 70%; margin: 0; padding-bottom: 25px; font-family: var(--f-display); font-size: 1.5em; line-height: 1; text-align: center; color: var(--light); }
.lead-form { width: 70%; }
.fields { display: flex; flex-wrap: wrap; margin: 0 -5px -10px; }
.field { width: 100%; padding: 0 5px; margin-bottom: 10px; }
.field.c50 { width: 50%; } .field.c40 { width: 40%; } .field.c20 { width: 20%; }
.field input[type=text], .field input[type=email], .field input[type=tel], .field select { width: 100%; min-height: 40px; padding: 8px 16px; border: 0; border-radius: 0; background: rgba(247, 247, 247, .84); color: var(--primary); font-family: var(--f-form); font-size: 10px; line-height: 1.2em; outline: 0; }
.field select { padding: 5px 20px 5px 14px; color: #5B5B53; -webkit-appearance: none; appearance: none; }
.field.spacer { font-family: var(--f-form); font-size: 10px; line-height: 1.2em; }
.field.consent { color: var(--light); }
.field.consent input { margin: 0 4px 0 0; vertical-align: middle; }
.field.consent label { font-family: var(--f-form); font-size: 10px; line-height: 1.2em; }
.field.note { padding-bottom: 0; color: var(--light); font-family: var(--f-form); font-size: 10px; font-weight: 200; line-height: 1.2em; }
.field.submit { text-align: center; }
.hp { display: none !important; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 33px; padding: 0 55px; border: 1px solid var(--gold); border-radius: 0; background: var(--gold); color: #fff; font-family: var(--f-form); font-size: 12px; line-height: 1em; text-transform: uppercase; cursor: pointer; }
.btn:hover { background: var(--secondary); color: var(--primary); }
.btn:disabled { opacity: .7; cursor: wait; }
.form-error { margin: 8px 0 0; color: var(--gold); font-family: var(--f-form); font-size: 11px; text-align: center; }

/* ---- Floor plan lightbox (Elementor lightbox look) ---- */
.lb { position: fixed; inset: 0; z-index: 99999; display: none; align-items: center; justify-content: center; background: var(--primary); color: var(--accent); }
.lb.is-open { display: flex; }
.lb img { max-width: 85vw; max-height: calc(100vh - 140px); width: auto; height: auto; }
.lb-count { position: absolute; top: 15px; left: 20px; font-size: 15px; line-height: 23px; }
.lb-close, .lb-nav { position: absolute; border: 0; background: none; color: var(--accent); cursor: pointer; padding: 0; }
.lb-close { z-index: 2; top: 13px; right: 15px; width: 30px; height: 30px; font-size: 20px; }
.lb-nav { top: 0; width: 15%; height: 100%; font-size: 25px; display: flex; align-items: center; justify-content: center; }
.lb-nav:hover, .lb-close:hover { color: var(--gold); }
.lb-nav[hidden] { display: none; }
.lb-prev { left: 0; } .lb-next { right: 0; }
.lb svg { width: 1em; height: 1em; fill: currentColor; }
/* Floor plan type tabs (built by main.js): above the side arrows, scroll sideways on narrow screens */
.lb-tabs { position: absolute; z-index: 2; left: 50%; bottom: 15px; transform: translateX(-50%); display: flex; gap: 6px; max-width: calc(100vw - 30px); overflow-x: auto; scrollbar-width: none; }
.lb-tabs::-webkit-scrollbar { display: none; }
.lb-tabs button { flex-shrink: 0; padding: 8px 14px; border: 1px solid rgba(239, 236, 231, .35); border-radius: 20px; background: none; color: var(--accent); font: inherit; font-size: 14px; line-height: 1; white-space: nowrap; cursor: pointer; }
.lb-tabs button:hover { color: var(--gold); border-color: var(--gold); }
.lb-tabs button[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--primary); }
.lb-tabs button[hidden], .lb-tabs[hidden] { display: none; }

/* ---- Message pages (thank-you / download) + privacy ---- */
.message { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 85vh; padding: 40px 20px; text-align: center; color: var(--primary); }
.message .lottie { width: 150px; height: 150px; }
.message h1 { margin: 0 0 10px; font-family: var(--f-display); font-size: 2em; line-height: 1.2; }
.message p { margin: 0; }
.legal { max-width: 1140px; margin: 0 auto; padding: 40px 20px; min-height: 85vh; color: #333; }
.legal h1, .legal h2, .legal h3 { font-family: var(--f-display); color: var(--primary); }
.legal a { color: var(--secondary); text-decoration: underline; }

/* ---- Desktop (>= 1280): fixed 4% sidebar, header hidden ---- */
@media (min-width: 1280px) {
  .m-header { display: none; }
  .v-nav { position: fixed; top: 0; left: 0; z-index: 11; display: flex; flex-direction: column; justify-content: space-between; align-items: stretch; width: var(--nav-w); height: 100vh; padding: 30px 0; overflow: hidden; background: var(--accent); }
  .v-nav .home { font-size: 4vw; }
  .v-nav .menu { font-size: 35px; }
  .v-nav .caret { font-size: 25px; cursor: default; }
  .page { min-height: 85vh; }
  .content { flex-basis: auto; margin-left: var(--nav-w); width: calc(100% - var(--nav-w)); }
  /* Deliberate fix: the live footer is 100% wide PLUS a 4% left margin, overflowing the page by 4%. */
  .site-foot { margin-left: var(--nav-w); }
  .foot-items { width: 50%; }
}

/* ---- Tablet + mobile (<= 1279) ---- */
@media (max-width: 1279px) {
  .menu-pop .popup-box { margin: 0; }
  .menu-pop .popup-msg { padding: 0; }
  .form-pop .popup-msg { width: 95vw; padding: calc(95vw * .03) calc(95vw * .05); }
  .foot-bottom { flex-direction: column; padding: 0; }
  .foot-tagline { display: none; }
  .foot-copy, .foot-credit { margin: 0; text-align: center !important; }
}

/* ---- Mobile (<= 575) ---- */
@media (max-width: 575px) {
  .menu-pop { align-items: flex-start; }
  .menu-pop .popup-box { animation-name: slideInRight; }
  .menu-pop.is-closing .popup-box { animation-name: slideOutRight; }
  .menu-pop .popup-msg { width: 100vw; height: 100vh; padding: 0 28px; }
  .menu-pop .popup-close { font-size: 21px; }
  .menu-inner { padding: 120px 20px 80px; }
  .menu-logo img { width: 120px; }
  .form-logo img { width: 120px; }
  .form-inner h4 { width: 100%; }
  .lead-form { width: 100%; }
  .field.c50, .field.c40, .field.c20 { width: 100%; }
  .foot-items { flex-direction: column; justify-content: center; gap: 5px; margin: 5px 0; }
  .ibox { width: 50%; max-width: 50%; }
  .ibox .ibox-icon { font-size: 30px; }
  .foot-bottom { padding: 1%; }
  .lb-nav { width: 20%; }
}


/* ======== One&Only Private Homes (2023 variant) ======== */
body { font-size: 11px; color: #333; }   /* kit body: GothamBook 11px */
.m-header { background: var(--secondary); }
.m-logo img { width: 87px; }
.v-nav { background: var(--secondary); }
.v-nav span.ic { width: 1em; height: 1em; }   /* live bottom slot: a white icon on the white bar, kept for the spacing */
@media (min-width: 1280px) {
  .v-nav .home, .v-nav .menu { font-size: 25px; }
  .m-logo img { width: 133px; }
}
.page, .content { min-height: 80vh; }
.viewer { height: 80vh; background: var(--accent); }
@media (max-width: 1279px) { .page, .content { min-height: 50vh; } .viewer { height: 50vh; } }

/* Kit button: outlined, Actor 11px uppercase (white on the dark cards + footer, black in the menu) */
.kbtn { display: inline-block; padding: 5px 25px; border: 1px solid var(--primary); color: var(--primary); font-family: var(--f-form); font-size: 11px; line-height: 1.1; text-align: center; text-transform: uppercase; transition: background .3s, color .3s; }
.kbtn:hover { background: var(--primary); color: var(--secondary); }
.kbtn.light { border-color: #fff; color: #fff; }
.kbtn.light:hover { background: #fff; color: var(--primary); }

/* Home 5629: four picture cards (two columns of two), black 50% overlay lifting to 30% on hover, 60% black box */
.cards { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; grid-auto-flow: column; min-height: 80vh; }
.card { position: relative; display: flex; justify-content: center; align-items: center; min-height: 40vh; padding: 5%; background: #000 center / cover no-repeat; }
.card::before { content: ''; position: absolute; inset: 0; background: #000; opacity: .5; transition: opacity 1.5s; }
.card:hover::before { opacity: .3; }
.card-box { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 70%; min-height: 30vh; padding: 10px; background: rgba(0, 0, 0, .6); text-align: center; }
.card-box h2 { margin: 0; color: #fff; font-weight: normal; line-height: 1; }
.card-kicker { font-family: var(--f-serif); font-size: 32px; font-style: italic; }
.card-title { margin-bottom: 10px !important; font-family: var(--f-display); font-size: 28.6px; text-transform: uppercase; }

/* Menu popup 2616: 280px light grey panel, logo top, one list in the middle, back button at the bottom */
.menu-pop .popup-box { background: var(--panel); }
.menu-pop .popup-msg { width: 280px; padding: 0 5.6px; }
.menu-inner { justify-content: space-between; gap: 10px; min-height: 100vh; padding: 40px 15px; text-align: center; }
.menu-logo img { width: 135px; }
.menu-list { margin: 0; padding: 0; list-style: none; }
.menu-list li { font-size: 11px; line-height: 11px; }
.menu-list li + li { margin-top: 10px; }
.menu-list a { font-family: var(--f-text); font-size: 11px; text-transform: uppercase; color: var(--primary); }
.menu-list a:hover { color: var(--gold); }
.menu-inner .kbtn { align-self: center; }

/* Footer 2661: black with the palm drawing, three outlined popup buttons, logo, rule, copyright */
.site-foot { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; min-height: 20vh; padding: 15px; background: #000; }
.site-foot::before { content: ''; position: absolute; inset: 0; background: url('/img/foot-bg.png') top left no-repeat; opacity: .1; pointer-events: none; }
.site-foot > * { position: relative; }
.foot-btns { display: flex; justify-content: space-around; align-items: center; width: 70%; }
.fbtn { width: 30%; padding: 5px 25px; border: 1px solid #fff; color: #fff; font-family: var(--f-form); font-size: 11px; line-height: 1.1; text-align: center; text-transform: uppercase; transition: background .3s, color .3s; }
.fbtn:hover { background: #fff; color: var(--primary); }
.foot-logo { padding: 20px 0 10px; }
.foot-logo img { display: block; width: 135px; }
.foot-rule { width: 85%; margin: 8px 0; border-top: 1px solid #fff; }
.foot-copy { margin: 0; font-family: var(--f-form); font-size: 9.9px; line-height: 1; color: #fff; text-align: center; }

/* Lead popups 6896 / 5653 / 6891: white box, logo, serif headings, underlined fields, teal button */
.form-pop { background: rgba(0, 0, 0, .8); }
.form-pop .popup-box { background: #fff; }
.form-pop .popup-close { font-size: 20px; color: var(--primary); }
.form-pop .popup-close:hover { color: var(--gold); }
.form-logo { margin-bottom: 40px; }
.form-logo img { width: 135px; }
.form-inner h2 { font-family: var(--f-display); font-size: 19.8px; font-weight: 500; color: #333; }
.form-inner .divider span { border-color: #000; }
.form-inner h4 { padding-bottom: 0; font-family: var(--f-serif); font-size: 16.5px; line-height: 1; color: #333; }
.form-text { width: 70%; margin: 0 0 25px; font-family: var(--f-text); font-size: 11px; font-style: italic; line-height: 1.5; text-align: center; color: #333; }
.lead-form { width: 100%; }
.fields { margin: 0 -10px; }
.field { padding: 0 10px; margin-bottom: 0; }
.field.c33 { width: 33.333%; } .field.c30 { width: 30%; }
.field input[type=text], .field input[type=email], .field input[type=tel], .field input[type=date], .field select { min-height: 40px; padding: 8px 16px; border: 0; border-bottom: 1px solid var(--gold); background: #fff; color: var(--primary); font-family: var(--f-form); font-size: 10px; }
.field input[type=date] { width: 100%; border-radius: 0; outline: 0; }
.field select { color: #5B5B53; }
.field.q { display: flex; align-items: center; min-height: 19px; color: var(--primary); font-family: var(--f-form); font-size: 10px; font-weight: 200; line-height: 1; }
.field.radios { display: flex; align-items: center; gap: 8px; font-family: var(--f-form); font-size: 10px; color: var(--primary); }
.field.radios input { margin: 0 3px 0 0; vertical-align: middle; }
.field.consent { margin-top: 20px; color: var(--primary); }
.field.consent label { font-family: var(--f-form); font-size: 10px; line-height: 1.6; }
.btn { min-height: 33px; padding: 0 55px; border-color: var(--gold); background: var(--gold); color: #fff; font-family: var(--f-form); font-size: 12px; }
.btn:hover { background: #fff; color: var(--primary); }
.field.submit { margin-top: 20px; }
.book .field.submit { display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-end; }
.book .field.q + .field.radios + .field.q { margin-top: 0; }

/* Hotspot pages (Image Map Pro on the live site): pictures scale to their column, spots are % of the picture */
.maps { display: flex; gap: 50px; min-height: 80vh; background: var(--accent); }
.maps-one { display: block; }
.map { position: relative; flex: 1 1 0; align-self: flex-start; width: 100%; }
.map > img { display: block; width: 100%; height: 100%; }
.map:has(> img[src="/"]) { display: none; }   /* no second picture */
.spot { position: absolute; display: block; }
.spot.dot { border: 1px solid #fff; border-radius: 50%; background: var(--c, #000); cursor: pointer; transition: background .2s, opacity .2s; animation: glow 2s ease-in-out infinite; }
.spot.dot:hover { background: var(--gold); }
.spot.dot.sold { opacity: .2; animation: none; }
.spot.dot.sold:hover { background: var(--c, #000); opacity: .4; }
.map[data-map="ground"] .spot.dot, .map[data-map="first"] .spot.dot { border-width: 2px; }
.spot.room { background: #736052; opacity: 0; clip-path: polygon(var(--clip)); cursor: pointer; transition: opacity .2s; }
.spot.room:hover { opacity: .4; }
.spot.label { transform: translate(-50%, -50%); font-family: var(--f-text); font-size: 10px; line-height: 1; color: #000; white-space: nowrap; pointer-events: none; }
@keyframes glow { 0%, 100% { box-shadow: 0 0 0 0 rgba(0, 0, 0, .5); } 50% { box-shadow: 0 0 6px 2px rgba(0, 0, 0, .35); } }
.map-fs { position: absolute; right: 20px; bottom: 20px; display: flex; padding: 6px; border: 1px solid #ccc; border-radius: 4px; background: #fff; color: #000; cursor: pointer; }
.map-fs svg { width: 16px; height: 16px; }
.maps-two .map-fs { display: none; }   /* live floor plans have no full screen button */
.map:fullscreen { display: flex; align-items: center; justify-content: center; background: var(--accent); }
.map:fullscreen > img { width: auto; max-width: 100%; max-height: 100%; }
.map-tip { position: fixed; z-index: 50; width: 170px; padding: 5px; background: #fff; box-shadow: 0 0 12px rgba(0, 0, 0, .15); font-family: sans-serif; font-size: 14px; line-height: 22px; color: #231f20; text-align: center; pointer-events: none; }
.map-tip.serif { background: #f7f7f7; font-family: serif; }
.map-tip img { display: block; width: 100%; height: auto; }
.map-tip p { margin: 0; }
.map-tip p:first-of-type { padding-top: 10px; }

/* Gallery source links stay hidden; the lightbox shows the slides */
.gal-src { display: none; }

@media (max-width: 1279px) {
  .kbtn { padding: 10px 25px; font-size: 8.8px; }
  .card .kbtn { font-size: 7.7px; }
  .cards { grid-template-columns: 1fr; grid-template-rows: none; grid-auto-flow: row; }
  .fbtn { padding: 10px 25px; font-size: 8.8px; }
  .foot-btns { width: 100%; }
  .foot-logo img { width: 94px; }
  .foot-copy { font-size: 7.7px; }
  .maps { flex-direction: column; }
}
@media (max-width: 575px) {
  .card-box { width: 100%; }
  .foot-btns { flex-direction: column; gap: 5px; margin-bottom: 5px; }
  .fbtn { width: 100%; }
  .maps { gap: 0; min-height: 50vh; }
  .field.c33, .field.c30 { width: 100%; }
  .menu-pop .popup-msg { width: 100vw; padding: 0 28px; }
  .menu-inner { padding: 120px 20px 80px; }
  .menu-logo img { width: 120px; }
  .form-logo img { width: 120px; }
  .form-text { width: 100%; }
}
