/* Les Terrasses d'Helvetia: static rebuild of the Elementor layout (header 33, home 2, footer 37,
   pages 129 + 132). Every value is ported from the live Elementor CSS. Breakpoints are Elementor's:
   tablet <=1024px, mobile <=767px (this site sets no laptop values).
   Colours come from the :root block each template writes from globals.colours.
   Percent paddings follow Elementor containers: a boxed container pads its sides in % of the
   page width and its inner box pads top/bottom in % of what is left. */

@font-face { font-family: 'Megafield'; font-style: normal; font-weight: 400; font-display: auto; src: url('/fonts/megafield-regular.woff2') format('woff2'); }
@font-face { font-family: 'Megafield'; font-style: normal; font-weight: 300; font-display: auto; src: url('/fonts/megafield-light.woff2') format('woff2'); }
@font-face { font-family: 'Megafield'; font-style: italic; font-weight: 300; font-display: auto; src: url('/fonts/megafield-light-italic.woff2') format('woff2'); }
@font-face { font-family: 'Maxima Nouva'; font-style: normal; font-weight: 400; font-display: auto; src: url('/fonts/maxima-nouva-regular.woff2') format('woff2'); }
@font-face { font-family: 'Maxima Nouva'; font-style: normal; font-weight: 600; font-display: auto; src: url('/fonts/maxima-nouva-semibold.woff2') format('woff2'); }

/* ---- Base (Hello Elementor reset + Elementor kit 7: 17px / 1.3em / 0.7px, 13px on tablet) ---- */
*, *::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: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; font-size: 17px; font-weight: 400; line-height: 1.3em; letter-spacing: .7px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
img { display: block; max-width: 100%; height: auto; border: 0; }
a { color: #c36; text-decoration: none; background: transparent; }
h1, h2, h3, p { margin: 0; }
ul { list-style: none; margin: 0; padding: 0; }
button, input, textarea { font: inherit; letter-spacing: inherit; }
.sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link:focus { clip: auto; width: auto; height: auto; margin: 0; padding: 12px 24px; z-index: 100000; top: 5px; left: 5px; background: #fff; color: #333; }

/* Shared type (Elementor heading widgets; text editors keep the theme font, #333) */
.t-display { font-family: 'Megafield', sans-serif; font-size: 2em; font-weight: 300; line-height: 1.5em; color: var(--primary); }
.t-eyebrow { font-family: 'Maxima Nouva', sans-serif; font-size: 1em; font-weight: 300; text-transform: uppercase; line-height: 1; letter-spacing: 5px; color: var(--primary); }
.t-body p { margin: 0 0 .9rem; }

/* Buttons */
.btn { display: inline-block; max-width: 100%; font-family: 'Maxima Nouva', sans-serif; font-size: .8em; font-weight: 700; text-transform: uppercase; line-height: 1.2em; letter-spacing: 4px; text-align: center; color: var(--white); background: var(--primary); border: 0; border-radius: 0; padding: 15px 40px; transition: all .3s; }
.btn-solid:hover, .btn-solid:focus { background: var(--button); color: var(--white); }
.btn-hdr { font-size: .6em; background: var(--button); padding: 15px; }
.btn-hdr:hover, .btn-hdr:focus { background: var(--accent); color: #fff; }

/* ---- Header (sticky, Elementor Pro sticky "top" with shadow effect) ---- */
.hdr { position: sticky; top: 0; z-index: 99; display: flex; justify-content: space-evenly; align-items: center; padding: 1% 3%; background-color: var(--secondary); transition: box-shadow .3s; }
.hdr.is-stuck { box-shadow: 0 0 10px 0 rgba(0, 0, 0, .3); }
.hdr-brand { width: 20%; min-width: 0; }
.hdr-brand a { display: block; }
.hdr-brand img { width: 220px; }
.hdr-right { display: flex; justify-content: flex-end; align-items: center; gap: 60px; width: 100%; min-width: 0; }
.hdr-nav ul { display: flex; }
.hdr-nav a { position: relative; display: block; font-family: 'Maxima Nouva', sans-serif; font-size: .7em; font-weight: 600; text-transform: uppercase; line-height: 20px; letter-spacing: 4.4px; color: var(--text); margin: 0 1.75em; }
.hdr-nav li:first-child a { margin-left: 0; }
.hdr-nav li:last-child a { margin-right: 0; }
.hdr-nav a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--text); opacity: 0; transition: opacity .3s; }
.hdr-nav a:hover::after, .hdr-nav a:focus::after, .hdr-nav a.is-active::after { opacity: 1; }
.hdr-toggle { display: none; align-items: center; justify-content: center; padding: .25em; font-size: 25px; line-height: 1; border: 0; border-radius: 0; background: var(--secondary); color: var(--primary); cursor: pointer; }
.hdr-toggle svg { width: 1em; height: 1em; fill: currentColor; }
.hdr-toggle .ic-close, .hdr.menu-open .hdr-toggle .ic-open { display: none; }
.hdr.menu-open .hdr-toggle .ic-close { display: block; }
.hdr-drop { display: none; }
.hdr-drop a { display: flex; justify-content: center; font-family: 'Maxima Nouva', sans-serif; font-size: .7em; font-weight: 600; text-transform: uppercase; line-height: 20px; letter-spacing: 4.4px; color: var(--white); padding: 10px 20px; border-inline-start: 8px solid transparent; }
.hdr-drop a:hover, .hdr-drop a:focus { background: var(--button); color: var(--white); }

/* ---- Hero: photo, title in the middle, Explore + line at the bottom ---- */
.hero { display: flex; flex-direction: column; justify-content: space-between; min-height: 80vh; padding: 0 5%; background-position: center; background-size: cover; }
.hero > * { width: 100%; max-width: 1220px; margin: 0 auto; }
.hero-spacer { height: 50px; }
.hero-head { padding: 10px; }
.hero-title { padding-top: 120px; font-family: 'Megafield', sans-serif; font-size: 2em; font-weight: 300; line-height: 1.5em; text-align: center; text-shadow: 0 0 5px rgba(0, 0, 0, .3); color: var(--white); }
.hero-foot { display: flex; flex-direction: column; align-items: center; gap: 20px; }
.hero-explore { width: 100%; font-family: 'Maxima Nouva', sans-serif; font-size: 1em; font-weight: 300; text-transform: uppercase; line-height: 1; letter-spacing: 5px; text-align: center; }
.hero-explore a { color: var(--white); }
.hero-line { width: 2px; }

/* ---- Intro (#first-screen): boxed 600px ---- */
.intro { padding: 0 10%; background-color: var(--primary); background-position: center; background-repeat: no-repeat; background-size: cover; }
.intro-inner { display: flex; flex-direction: column; align-items: center; gap: 40px; max-width: 600px; margin: 0 auto; padding: 10% 0; text-align: center; }
.intro .t-display { color: var(--light); }

/* ---- Location map (opens full size in the lightbox) ---- */
.map > a { display: block; }
.map img { width: 100%; }

/* ---- Two-column sections (text + photo). Columns shrink like Elementor's flex containers. ---- */
.split { display: flex; justify-content: space-between; align-items: stretch; gap: 60px; padding: 5%; background-color: var(--light); background-position: center; background-repeat: no-repeat; background-size: cover; }
.split > .col { display: flex; flex-direction: column; justify-content: center; align-items: center; min-width: 0; }
.col-text { gap: 40px; padding: 0 10%; text-align: center; }
.col-text > * { max-width: 100%; }
.col-text .t-eyebrow { width: 1000px; }
.col-media img { width: 100%; }
.icon { width: 75px; }
.split .col-text { width: 55%; }
.split .col-media { width: 45%; }

.s-location { background-position: bottom left; }
.s-location .col-text { width: 40%; padding: 10px; }
.s-location .col-media { width: 60%; }
.s-commercial .col-text { width: 45%; padding: 0 8%; }
.s-commercial .col-media { width: 55%; }
.s-education .t-display, .s-education .t-body { color: #fff; }
.s-residences .col-text { width: 45%; padding: 0 2%; }
.s-residences .col-media { width: 55%; }
.s-sand { background-color: transparent; background-position: bottom left; background-repeat: repeat; background-size: auto; }
.s-duplexes { background-color: var(--cream); }
.s-duplexes .col-text { width: 45%; padding: 0 5%; }
.s-duplexes .col-media { width: 55%; }
.s-duplexes .photo { width: 100%; height: 650px; background-position: center; background-repeat: no-repeat; background-size: cover; }

/* ---- Amenities (3 photos) ---- */
.amenities { display: grid; grid-template-columns: repeat(3, 1fr); gap: 29px; padding: 5%; background-color: var(--activities-bg); }
.amenity { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px; min-width: 0; }
.amenity img { width: 100%; }
.amenity .t-eyebrow { text-align: center; color: var(--text); }

/* ---- Full-width photo bands ---- */
.band { position: relative; min-height: 90vh; background-position: center; background-repeat: no-repeat; background-size: cover; }
.band-tint::before { content: ''; position: absolute; inset: 0; background: var(--band-tint); }

/* ---- Register your interest form (#brochure, footer 37, every page) ---- */
.register { padding: 0 5%; background-color: var(--secondary); background-position: center; background-repeat: no-repeat; background-size: cover; }
.register-wrap { max-width: 900px; margin: 0 auto; padding: 5% 0; }
.register-box { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 40px; padding: 5% 8%; background-color: var(--secondary); }
.register-title { font-family: 'Megafield', sans-serif; font-size: 28px; font-weight: 300; line-height: 1.5em; text-align: center; color: var(--primary); }
.lead-form { width: 100%; }
.fields { display: flex; flex-wrap: wrap; margin: 0 -5px -10px; }
.field { width: 100%; padding: 0 5px; margin-bottom: 10px; }
.field.w50 { width: 50%; }
.field.w33 { width: 33.333%; }
.field input[type=text], .field input[type=email], .field textarea { display: block; width: 100%; min-height: 40px; padding: 5px 14px; font-family: 'Maxima Nouva', sans-serif; font-size: 14px; font-weight: 400; text-transform: uppercase; line-height: 1.4; color: var(--text); background: transparent; border: 1px solid var(--accent); border-radius: 0; outline: 0; }
.field textarea { resize: vertical; }
.field ::placeholder { color: var(--text); opacity: 1; }
.consent { font-family: 'Maxima Nouva', sans-serif; font-size: 12px; color: var(--text); }
.consent input { vertical-align: middle; margin: 0; }
.consent label { font-weight: 400; }
.submit { display: flex; justify-content: center; }
.btn-submit { min-height: 40px; padding: 0 24px; font-family: 'Maxima Nouva', sans-serif; font-size: 15px; font-weight: 500; text-transform: uppercase; line-height: 1; letter-spacing: 5px; color: var(--white); background: var(--primary); border: 2px solid var(--primary); border-radius: 0; cursor: pointer; transition: all .3s; }
.btn-submit:hover { color: #fff; background: var(--accent); border-color: var(--accent); }
.btn-submit:disabled { opacity: .5; cursor: default; }
.form-msg { margin: 10px 0; font-family: 'Maxima Nouva', sans-serif; font-size: 1em; line-height: 1; }
.form-msg.ok { color: #5cb85c; }
.form-msg.err { color: #d9534f; }

/* ---- Footer ---- */
.ftr { display: flex; flex-direction: column; background: var(--accent-alt); }
.ftr-inner { display: flex; flex-direction: column; gap: 20px; width: 100%; max-width: 1021px; margin: 0 auto; }
.ftr-row { display: flex; justify-content: space-between; align-items: stretch; padding: 60px 0; }
.ftr-logo, .ftr-tag { background-position: center right; background-repeat: no-repeat; }
.ftr-logo { display: flex; align-items: flex-start; width: 36%; padding: 40px 40px 40px 0; }
.ftr-logo img { width: 220px; }
.ftr-tag { display: flex; justify-content: center; align-items: center; width: 32%; padding: 40px; }
.ftr-tag h2 { width: 270px; max-width: 100%; font-family: 'Megafield', sans-serif; font-size: 20px; font-weight: 400; line-height: 1.6; color: #fff; }
.ftr-links { display: flex; justify-content: flex-start; align-items: center; width: 32%; padding: 0 40px; }
.ftr-links li:not(:last-child) { margin-bottom: 11px; }
.ftr-links a { display: block; font-family: 'Maxima Nouva', sans-serif; font-size: 14px; font-weight: 400; text-transform: uppercase; line-height: 20px; letter-spacing: 2px; color: #fff; }
.ftr-copy { display: flex; flex-direction: column; padding: 30px 0; border-top: 1px solid #fff; }
.ftr-copy div { font-family: 'Wulkan', sans-serif; font-size: 14px; font-weight: 500; line-height: 23px; text-align: center; color: #fff; }

/* ---- Disclaimer / Privacy policy (icon, title, text on a plain colour) ---- */
.legal { display: flex; padding: 5%; }
.legal-inner { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 40px; width: 100%; padding: 0 5%; }
.legal-inner > * { max-width: 100%; }
.legal .t-display { text-align: center; }
.rte h2 { margin: .5rem 0 1rem; font-size: 2rem; font-weight: 500; line-height: 1.2; }
.rte ul { list-style: disc; padding-left: 40px; }
.rte hr { margin: .5em auto; }

/* ---- 404 (Hello Elementor page template) ---- */
.site-main { width: 100%; margin: 0 auto; }
.page-header .entry-title { width: 100%; margin: .5rem auto 1rem; font-size: 2.5rem; font-weight: 500; line-height: 1.2; color: #333; }
.page-content p { margin: 0 0 .9rem; }
@media (max-width: 575px) { .site-main, .page-header .entry-title { padding-inline: 10px; } }
@media (min-width: 576px) { .site-main, .page-header .entry-title { max-width: 500px; } }
@media (min-width: 768px) { .site-main, .page-header .entry-title { max-width: 600px; } }
@media (min-width: 992px) { .site-main, .page-header .entry-title { max-width: 800px; } }
@media (min-width: 1200px) { .site-main, .page-header .entry-title { max-width: 1140px; } }

/* ---- Lightbox (location map) ---- */
.vlb { position: fixed; inset: 0; z-index: 9999; display: flex; justify-content: center; align-items: center; background: rgba(0, 0, 0, .87); }
.vlb[hidden] { display: none; }
.vlb img { max-width: 90vw; max-height: 90vh; width: auto; }
.vlb-close { position: absolute; top: 15px; right: 15px; padding: 0; font-size: 28px; line-height: 1; background: none; border: 0; color: rgba(238, 238, 238, .9); cursor: pointer; }
.vlb-close svg { width: 1em; height: 1em; fill: currentColor; }

/* ---- Entrance animations (Elementor fadeIn / slideInUp, 1.25s) ---- */
.js [data-anim] { visibility: hidden; }
.js [data-anim].animated { visibility: visible; animation-duration: 1.25s; animation-fill-mode: both; }
.fadeIn { animation-name: fadeIn; }
.slideInUp { animation-name: slideInUp; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes slideInUp { from { transform: translate3d(0, 100%, 0); visibility: visible; } to { transform: translate3d(0, 0, 0); } }
@media (prefers-reduced-motion: reduce) { .js [data-anim] { visibility: visible; } .js [data-anim].animated { animation: none; } }

/* ================= Tablet (<=1024px) ================= */
@media (max-width: 1024px) {
  body { font-size: 13px; }
  .hdr-brand { width: 257px; max-width: 257px; }
  .hdr-brand img { width: 150px; }
  .hdr-right { gap: 20px; }
  .hdr-nav { display: none; }
  .hdr-toggle { display: flex; }
  .hdr-drop { display: block; position: absolute; left: 0; right: 0; top: 100%; z-index: 9997; visibility: hidden; background: var(--light); transform-origin: top; transform: scaleY(0); max-height: 0; overflow: hidden; transition: max-height .3s, transform .3s, visibility 0s .3s; }
  .hdr.menu-open .hdr-drop { visibility: visible; transform: scaleY(1); max-height: 100vh; transition-delay: 0s; }
  .hero { min-height: 60vh; }
  .split, .col-text { gap: 30px; }
  .intro-inner, .legal-inner { gap: 30px; }
  .split .col-text { padding: 0; }
  .s-location .col-text { width: 55%; padding: 10px; }
  .s-location .col-media { width: 45%; }
  .icon { width: 55px; }
  .legal .icon { width: 65px; }
  .col-media img { height: 50vh; object-fit: cover; }
  .s-location .col-media img { object-position: center left; }
  .band { min-height: 45vh; }
  .band-short { min-height: 40vh; }
  .s-duplexes .photo { height: 400px; }
  .register-title { font-size: 21px; }
  .btn-submit { border-width: 1px; }
  .ftr { padding: 15px; }
}

/* ================= Mobile (<=767px) ================= */
@media (max-width: 767px) {
  .hdr { justify-content: space-between; padding: 10px; }
  .hdr-brand img { width: 50%; }
  .hdr-right { width: 50px; }
  .hdr-cta { display: none; }
  .hero { padding: 15px; background-position: center left; }
  .hero-foot { gap: 7px; }
  .hero-line { width: 1px; }
  .intro { padding: 0 15px; }
  .intro-inner { padding: 40px 0; }
  .split { flex-wrap: wrap; padding: 40px 15px; }
  .split .col-text, .split .col-media, .s-location .col-text, .s-location .col-media { width: 100%; }
  .s-commercial, .s-residences, .s-duplexes { flex-direction: column-reverse; flex-wrap: nowrap; }
  .t-eyebrow { line-height: 1.7em; }
  .col-media img { height: 35vh; }
  .s-education .col-media img { height: 50vh; }
  .amenities { grid-template-columns: 1fr; gap: 30px; padding: 40px 15px; }
  .amenity .t-eyebrow { padding-bottom: 40px; }
  .band { min-height: 30vh; }
  .s-duplexes .photo { height: 300px; }
  .register { padding: 0 15px; }
  .register-wrap { max-width: 767px; padding: 40px 0 80px; }
  .register-box { min-height: 100vh; padding: 40px 15px 80px; }
  .register-title { font-size: 20px; }
  .legal { flex-direction: column-reverse; padding: 40px 15px; }
  .legal .icon { width: 45px; }
  .ftr-inner { max-width: 767px; }
  .ftr-row { flex-direction: column; }
  .ftr-logo { width: 100%; padding: 40px; }
  .ftr-tag { width: 100%; }
  .ftr-links { width: 100%; }
  .ftr-copy div { font-size: 13px; }
  .field.w50, .field.w33 { width: 100%; }
}