@font-face {
    font-family: "Roseritta Standard";
    src: url("../assets/fonts/Roseritta Standard.woff") format("woff");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

:root {
    --ink: #20231f;
    --gold: #a9874f;
    --cream: #f6f3eb;
    --sand: #eae3d5;
    --muted: #6d706b;
    --border: rgba(32, 35, 31, .16);
    --display: "Roseritta Standard", Georgia, serif;
    --sans: "Montserrat", Arial, sans-serif
}

* {
    box-sizing: border-box
}

html {
    scroll-behavior: smooth
}

body {
    margin: 0;
    background: #fff;
    color: var(--ink);
    font-family: var(--sans);
    font-weight: 300;
    -webkit-font-smoothing: antialiased
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--display);
    font-weight: 400;
    letter-spacing: -.02em
}

a {
    color: inherit;
    text-decoration: none
}

.site-container {
    max-width: 1440px;
    padding-inline: 1.5rem
}

.site-header {
    z-index: 1030;
    background: rgba(255, 255, 255, .92);
    border-bottom: 1px solid var(--border);
    backdrop-filter: blur(14px)
}

.brand {
    display: inline-flex;
    align-items: center;
    line-height: 0;
    white-space: nowrap
}

.site-logo {
    display: block;
    aspect-ratio: 1;
    background: url("assets/logo.png") center/contain no-repeat;
    object-fit: contain;
    pointer-events: none
}

.site-logo-header {
    width: clamp(108px, 8.5vw, 124px);
    height: clamp(108px, 8.5vw, 124px)
}

.site-logo-footer {
    width: clamp(190px, 15vw, 220px);
    height: clamp(190px, 15vw, 220px)
}

.site-logo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain
}

.navbar .nav-link,
.header-link {
    color: rgba(32, 35, 31, .8);
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase
}

.navbar .nav-link:hover,
.header-link:hover,
.header-icon:hover {
    color: var(--ink)
}

.header-icon {
    font-size: 1rem;
    color: rgba(32, 35, 31, .72)
}

.header-actions {
    gap: 2.25rem
}

.header-contact-icons {
    gap: 1.75rem
}

.site-header .header-icon,
.site-header .header-icon:hover,
.site-header .header-icon:focus-visible {
    color: var(--cream);
    font-weight: 900
}

.site-header .header-contact-icons .header-icon .bi::before {
    font-weight: 900 !important
}

.btn-dark-custom,
.btn-outline-light-custom {
    border-radius: 0;
    padding: .9rem 1.65rem;
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    transition: .25s
}

.btn-dark-custom {
    background: var(--cream);
    border: 1px solid var(--white);
    color: #fff
}

.btn-dark-custom:hover {
    background: #607035;
    color: #fff;
    border-color: var(--ink)
}

.site-header .btn-dark-custom,
.site-header .btn-dark-custom:hover,
.site-header .btn-dark-custom:focus,
.site-header .btn-dark-custom:active {
    background: var(--cream);
    border-color: var(--cream);
    color: var(--white)
}

.site-header .btn-dark-custom:hover {
    background: #607035
}

.btn-outline-light-custom {
    background: rgba(0, 0, 0, .05);
    border: 1px solid rgba(255, 255, 255, .8);
    color: #fff;
    backdrop-filter: blur(5px)
}

.btn-outline-light-custom:hover {
    background: #fff;
    color: var(--ink)
}

.page-progress {
    position: fixed;
    inset: 0 0 auto;
    height: 2px;
    background: var(--gold);
    z-index: 1100;
    transform-origin: left;
    transform: scaleX(0)
}

.hero {
    position: relative;
    height: calc(100svh - 141px);
    min-height: 520px;
    display: flex;
    flex-direction: column;
    background: #fff
}

.hero-media {
    position: relative;
    flex: 1;
    overflow: hidden;
    background: #ddd
}

.hero-media>img,
.hero-media>video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.hero-media>video {
    z-index: 1
}

.hero-cta {
    position: absolute;
    z-index: 3;
    left: 50%;
    bottom: 2rem;
    transform: translateX(-50%)
}

.project-summary {
    background: #f3f1ec
}

.project-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding-inline: 0
}

.project-summary-grid>div {
    text-align: center;
    padding: 1rem;
    border-right: 1px solid var(--border)
}

.project-summary-grid>div:last-child {
    border: 0
}

.project-summary small {
    display: block;
    color: var(--muted);
    font-size: .62rem;
    font-weight: 600;
    letter-spacing: .25em;
    text-transform: uppercase
}

.project-summary strong {
    display: block;
    margin-top: .4rem;
    font-family: var(--sans);
    font-size: 1.15rem;
    font-weight: 500
}

.content-shell {
    position: relative;
    z-index: 2;
    background: #fff;
    box-shadow: 0 -30px 60px -30px rgba(0, 0, 0, .25)
}

.section {
    padding: 3rem 0
}

.section-sm {
    padding: 3rem 0
}

.section-cream {
    background: var(--cream)
}

.eyebrow {
    margin: 0 0 1rem;
    color: var(--white);
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .27em;
    text-transform: uppercase;
    color: #3c491f;
}

.display-heading {
    max-width: 800px;
    font-size: 48px;
    line-height: .98
}

.display-heading em {
    color: var(--white);
}

.section-title {
     font-size: 48px;
    line-height: 1;
    letter-spacing: 2px;
}

.lead-copy {
    color: var(--ink);
    font-size: 1.05rem;
    line-height: 1.75
}

.cloud-image {
    max-width: 560px;
    aspect-ratio: 1;
    margin: auto;
    overflow: hidden;
    clip-path: polygon(50% 0, 64% 7%, 78% 5%, 89% 16%, 96% 30%, 93% 44%, 100% 57%, 91% 70%, 88% 85%, 73% 93%, 58% 91%, 44% 100%, 30% 92%, 15% 91%, 8% 77%, 0 64%, 7% 49%, 3% 34%, 14% 22%, 25% 9%, 40% 8%)
}

.cloud-image img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.stats-logo-wrap {
    border-right: 1px solid var(--border)
}

.stats-section {
    padding-top: clamp(4rem, 6vw, 6.5rem);
    padding-bottom: clamp(4rem, 6vw, 6.5rem);
    background-image: url("../assets/amenities-background-faded.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.stats-section-title {
    font-size: 2.5rem;
    line-height: 1.05;
    text-transform: none;
    letter-spacing: 0.04em;
    color: #3c491f;
    font-weight: 900;
}

.stats-logo {
    max-height: 215px
}

.masterplan-overview {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    isolation: isolate;
    background: #fff;
}

.masterplan-overview-image {
    grid-area: 1 / 1;
    align-self: start;
    display: block;
    width: 100%;
    height: auto;
}

@media (max-width: 767.98px) {
    .masterplan-overview {
        overflow: hidden;
    }

    .masterplan-overview-image {
        height: 400px;
        object-fit: cover;
        object-position: center;
        transform: scale(1.05);
    }
}

.masterplan-overview::before {
    position: absolute;
    inset: 0 0 auto;
    z-index: 1;
    height: clamp(8rem, 14vw, 26rem);
    max-height: 75%;
    background: linear-gradient(180deg,
        rgba(184, 185, 181, .96) 0%,
        rgba(197, 198, 191, .78) 20%,
        rgba(226, 227, 218, .38) 52%,
        rgba(255, 255, 255, 0) 100%);
    content: "";
    pointer-events: none;
}

.masterplan-overview-heading {
    grid-area: 1 / 1;
    align-self: start;
    z-index: 2;
    min-width: 0;
    padding: clamp(.75rem, .7vw, 1.375rem) 1.5rem 1.5rem;
    text-align: center;
    text-shadow: 0 1px 3px rgba(29, 29, 27, .18);
}

.masterplan-overview-subtitle {
    margin: 0 0 clamp(.65rem, .85vw, 1.625rem);
    color: #fff;
    font-size: clamp(0.7rem, .5vw, .9375rem);
    font-weight: 600;
    letter-spacing: .3em;
    line-height: 1.5;
    text-transform: uppercase;
    margin-top: 15px;
}

.masterplan-overview-title {
    max-width: 1300px;
    margin: 0 auto;
    color: #fff;
    font-family: var(--display);
    font-size: clamp(1.5rem, 2.55vw, 4.75rem);
    font-style: italic;
    font-weight: 900;
    letter-spacing: .02em;
    line-height: 1.15;
    text-shadow: 0 2px 20px rgba(0, 0, 0, .55);
    text-wrap: balance;
    margin-top:15px;
}

.masterplan-overview-title.reveal {
    opacity: 0;
    transform: translate3d(0, 14px, 0);
    transition: all 1.1s ease-out .45s;
}

.masterplan-overview-title.reveal.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

@media (prefers-reduced-motion: reduce) {
    .masterplan-overview-title.reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

.masterplan-highlights {
    grid-area: 2 / 1;
    position: relative;
    z-index: 2;
    min-width: 0;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    border-top: 1px solid rgba(255, 255, 255, .15);
    background: var(--cream);
    color: #fff;
    font-family: var(--sans);
    overscroll-behavior-x: contain;
    scroll-behavior: auto;
    scrollbar-width: none;
}

.masterplan-highlights::-webkit-scrollbar {
    display: none;
}

.masterplan-highlights:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -4px;
}

.masterplan-highlights-track {
    display: flex;
    width: max-content;
}

.masterplan-highlights-list {
    display: flex;
    flex: 0 0 auto;
    align-items: stretch;
    min-width: 100vw;
    margin: 0;
    padding: 0;
    list-style: none;
}

.masterplan-highlights-copy {
    display: none;
}

.masterplan-highlights.is-enhanced .masterplan-highlights-copy {
    display: flex;
}

.masterplan-highlight {
    display: flex;
    flex: 1 0 auto;
    align-items: center;
    gap: .875rem;
    padding: 1rem 1rem 1rem 1rem;
    border-inline-end: 1px solid rgba(255, 255, 255, .15);
    white-space: nowrap;
}

.masterplan-highlight-icon {
    flex: 0 0 1.25rem;
    width: 1.25rem;
    height: 1.25rem;
    color: rgba(255, 255, 255, .9);
}

.masterplan-highlight-copy {
    min-width: 0;
}

.masterplan-highlight-title {
    margin: 0;
    color: rgba(255, 255, 255, .95);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .18em;
    line-height: 1.5;
    text-transform: uppercase;
}

.masterplan-highlight-description {
    margin: .125rem 0 0;
    color: rgba(255, 255, 255, .75);
}

@media (max-width: 575.98px) {
    .masterplan-highlight {
        /* flex: 0 0 calc(100vw - 2rem);
        width: calc(100vw - 2rem); */
        padding: 9px;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .masterplan-highlight-title {
         font-size: 11px; 
    }

    .page-content .masterplan-highlight-description.body-copy {
        font-size: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .masterplan-highlights.is-enhanced .masterplan-highlights-copy {
        display: none;
    }
}

.central-park-section {
    padding: clamp(5rem, 8vw, 8.5rem) 0;
    overflow: hidden;
    background-image: url("../assets/amenities-background-faded.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.central-park-header {
    display: block;
}

.central-park-content {
    max-width: 100%;
}

.central-park-eyebrow {
    margin: 0 0 1.25rem;
    color: var(--gold);
    font-size: .66rem;
    font-weight: 600;
    letter-spacing: .3em;
    text-transform: uppercase;
}

.central-park-title {
    margin: 0;
    color: var(--cream);
    font-size: 40px;
    line-height: 1;
    letter-spacing: .02em;
    font-weight:900;
}

.central-park-title em {
    color: var(--gold);
    font-weight: 400;
}

.central-park-subtitle {
    margin: 1rem 0 1.6rem;
    color: var(--ink);
    font-family: var(--display);
    font-size: 1.05rem;
    letter-spacing: .04em;
    font-weight: 900;
}

.central-park-copy {
    max-width: 100%;
    margin: 2rem 0 0;
    color: var(--muted);
    font-size: .92rem;
    line-height: 1.75;
}

.central-park-copy p {
    margin: 0 0 1rem;
}

.central-park-copy p:last-child {
    margin-bottom: 0;
}

.central-park-highlights {
    display: flex;
    flex-wrap: wrap;
    gap: .8rem;
    margin-top: 2.5rem;
}

.central-park-highlight {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    padding: .55rem 1.05rem;
    color: var(--ink);
    border: 1px solid rgba(60, 73, 31, .35);
    border-radius: 999px;
    background: rgba(255, 255, 255, .28);
    font-size: .58rem;
    font-weight: 600;
    letter-spacing: .17em;
    line-height: 1.3;
    text-align: center;
    text-transform: uppercase;
    transition: color .25s ease, background-color .25s ease, border-color .25s ease, transform .25s ease;
}

.central-park-highlight:hover {
    color: var(--white);
    border-color: var(--cream);
    background: var(--cream);
    transform: translateY(-2px);
}

.central-park-image-wrap {
    width: 100%;
    height: 693px;
    margin-top: 3rem;
    overflow: hidden;
    border-radius: 20px;
    box-shadow: 0 24px 55px -35px rgba(29, 29, 27, .55);
}

.central-park-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .8s cubic-bezier(.2, .7, .2, 1);
}

@media (hover: hover) {
    .central-park-image-wrap:hover .central-park-image {
        transform: scale(1.055);
    }
}

@media (max-width: 991.98px) {
    .central-park-section {
        padding: 5.5rem 0;
        background-position: left center;
    }

    .central-park-content,
    .central-park-copy {
        max-width: none;
    }

    .central-park-copy {
        margin-top: 1.5rem;
    }

    .central-park-image-wrap {
        height: clamp(430px, 72vw, 560px);
    }
}

@media (max-width: 575.98px) {
    .central-park-section {
        padding: 4rem 0;
    }

    .central-park-title {
        padding-top: 20px;
        font-size: 1.5em;
        line-height: 1.3em;
    }

    .central-park-copy {
        font-size: .86rem;
        line-height: 1.7;
    }

    .central-park-highlight {
        width: auto;
        flex: 1 1 100%;
    }

    .central-park-image-wrap {
        height: clamp(300px, 100vw, 420px);
        margin-top: 2rem;
        border-radius: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .central-park-image,
    .central-park-highlight {
        transition: none;
    }
}

.brand-inline {
    font-family: var(--sans);
    font-size: 1rem;
    font-style: italic;
    letter-spacing: 0;
    text-transform: none;
    color: var(--ink)
}

.stat {
    display: flex;
    gap: 1rem
}

.stat-icon {
    color: var(--gold);
    font-size: 2rem
}

.stat strong {
    display: block;
    font-family: var(--sans);
    font-size: 3.5rem;
    font-weight: 400;
    line-height: 1
}

.stat strong small {
    margin-inline-start: .08em;
    font-size: 1.7rem
}

.stat b {
    display: block;
    margin-top: .8rem;
    font-size: .85rem
}

.stat p {
    margin: .35rem 0 0;
    color: var(--muted);
    font-size: .75rem
}

.counter-section .stat,
.counter-section .stat strong,
.counter-section .stat b,
.counter-section .stat p {
    font-weight: 400;
}

@media (max-width: 767px) {
    .stats-section-title {
        margin: 1em 0 0 2em;
        font-size: 1.5rem;
        line-height: 1.6;
    }

    .counter-section {
        margin-left: 30px;
    }

    .stat strong {
        font-size: 1.5rem;
    }
}

.residence-meta{
    font-weight:500;
}

.scroll-label {
    color: var(--muted);
    font-size: .7rem;
    letter-spacing: .2em;
    text-transform: uppercase
}

.gallery-wrap {
    position: relative
}

.gallery-track {
    display: flex;
    gap: 1.5rem;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    padding: 0 3rem 1rem
}

.gallery-track::-webkit-scrollbar {
    display: none
}

.gallery-card {
    position: relative;
    flex: 0 0 min(720px, 78vw);
    height: 520px;
    margin: 0;
    border-radius: 1.5rem;
    overflow: hidden;
    box-shadow: 0 10px 40px -20px rgba(0, 0, 0, .3)
}

.gallery-card img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.gallery-card figcaption {
    position: absolute;
    inset: auto 0 0;
    padding: 4rem 1.5rem 1.25rem;
    color: #fff;
    background: linear-gradient(transparent, rgba(0, 0, 0, .7))
}

.gallery-control {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 46px;
    height: 46px;
    border: 1px solid var(--border);
    border-radius: 50%;
    background: rgba(255, 255, 255, .92);
    transform: translateY(-50%)
}

.gallery-prev {
    left: 1rem
}

.gallery-next {
    right: 1rem
}

.masterplan-tabs-section {
    padding: clamp(1.5rem, 7vw, 3.5rem) 0;
    background: var(--cream);
    color: #fff;
}

.masterplan-tabs-section * {
    color: #fff !important;
}

.masterplan-tabs-nav {
    flex-wrap: nowrap;
    justify-content: center;
    gap: clamp(1.5rem, 3.5vw, 3.75rem);
    overflow-x: auto;
    border-bottom: 1px solid rgba(60, 73, 31, .18);
    scrollbar-width: none;
}

.masterplan-tabs-nav::-webkit-scrollbar {
    display: none;
}

.masterplan-tabs-nav .nav-link {
    position: relative;
    padding: 0 0 1rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--ink);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .1em;
    line-height: 1.4;
    text-transform: uppercase;
    white-space: nowrap;
}

.masterplan-tabs-nav .nav-link::after {
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 2px;
    background: var(--gold);
    content: "";
    opacity: 0;
    transform: scaleX(.35);
    transition: opacity .25s ease, transform .25s ease;
}

.masterplan-tabs-nav .nav-link:hover,
.masterplan-tabs-nav .nav-link:focus-visible,
.masterplan-tabs-nav .nav-link.active {
    color: var(--cream);
}

.masterplan-tabs-nav .nav-link.active::after {
    opacity: 1;
    transform: scaleX(1);
}

.masterplan-tabs-content {
    padding-top: clamp(2.5rem, 4vw, 4rem);
}

.masterplan-tab-row {
    --bs-gutter-x: clamp(3rem, 6vw, 6.5rem);
}

.masterplan-tab-copy {
    max-width: 610px;
}

.masterplan-tab-title {
    text-transform: uppercase;
}

.masterplan-tab-description {
    max-width: 590px;
    margin: 1.25rem 0 2rem;
    color: var(--muted);
}

.masterplan-feature-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 2rem;
    background: transparent;
}

.masterplan-feature-item {
    align-self: start;
    border: 0;
    border-bottom: 1px solid rgba(60, 73, 31, .18);
    border-radius: 0 !important;
    background: transparent;
}

.masterplan-feature-item .accordion-button {
    min-height: 50px;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 0;
    border: 0;
    background: transparent;
    color: var(--ink);
    box-shadow: none;
    font-family: var(--display);
    font-size: .95rem;
    font-weight: 400;
    line-height: 1.35;
}

.masterplan-feature-item .accordion-button::after {
    display: none;
}

.masterplan-feature-item .accordion-button .bi {
    flex: 0 0 auto;
    color: var(--gold);
    font-size: .65rem;
    transition: transform .25s ease;
}

.masterplan-feature-item .accordion-button:not(.collapsed) .bi {
    transform: rotate(180deg);
}

.masterplan-feature-item .accordion-body {
    padding: 0 1.5rem 1rem 0;
    color: var(--muted);
    font-size: .78rem;
    line-height: 1.65;
}

.masterplan-tab-image-wrap {
    width: min(100%, 540px);
    aspect-ratio: 1.08 / 1;
    margin: 0 0 0 auto;
    overflow: hidden;
    border-radius: 14px;
    box-shadow: 0 24px 55px -35px rgba(29, 29, 27, .5);
}

.masterplan-tab-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 991.98px) {
    .masterplan-tabs-nav {
        justify-content: flex-start;
        padding-inline: 1rem;
    }

    .masterplan-tab-copy {
        max-width: none;
    }

    .masterplan-tab-image-wrap {
        width: 100%;
        aspect-ratio: 16 / 10;
        margin-inline: auto;
    }
}

@media (max-width: 767.98px) {
    .masterplan-tabs-content {
        padding-top: 0;
    }

    .masterplan-tabs-nav {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        overflow-x: visible;
        margin-inline: 0;
        padding-inline: 0;
    }

    .masterplan-tabs-nav .nav-item,
    .masterplan-tabs-nav .nav-link {
        width: 100%;
    }

    .masterplan-tabs-nav .nav-link {
        padding: .9rem 0;
        text-align: start;
    }
}

@media (max-width: 575.98px) {
    .masterplan-tabs-section {
         padding:1.5rem; 
    }

    .masterplan-tab-title {
        font-size: clamp(2.25rem, 11vw, 3rem);
    }

    .masterplan-tab-description {
        font-size: .9rem;
    }

    .masterplan-feature-list {
        grid-template-columns: 1fr;
    }

    .masterplan-tab-image-wrap {
        aspect-ratio: 4 / 3;
        border-radius: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .masterplan-tabs-nav .nav-link::after,
    .masterplan-feature-item .accordion-button .bi {
        transition: none;
    }
}

.amenities-section {
    position: relative;
    overflow: hidden
}

.amenities-bg {
    position: absolute;
    inset: -2rem 0;
    background: #fff;
}

.amenity-grid {
    border: 1px solid var(--border);
    background: var(--border)
}

.amenity {
    height: 145px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .8rem;
    background: rgba(255, 255, 255, .92);
    border: 1px solid var(--border);
    transition: .25s
}

.amenity:hover {
    background: var(--cream);
    color:#fff;
}

.amenity i {
    color: var(--gold);
    font-size: 1.7rem;
    transition: .25s
}

.amenity:hover i {
    transform: scale(1.12)
}

.amenity span {
    font-size: .76rem;
    font-weight: 500
}

.community-imagery {
    position: relative;
    width: 100%;
    height: 80vh;
    height: 80svh;
    overflow: hidden;
    isolation: isolate;
    background: var(--ink);
    touch-action: pan-y pinch-zoom;
}

.community-imagery:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -4px;
}

.community-imagery-image {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 2.2s cubic-bezier(.4, 0, .2, 1);
}

.community-imagery-image.is-active {
    z-index: 2;
    opacity: 1;
}

.community-imagery-image.has-drift {
    will-change: transform;
    animation: community-imagery-drift 10s ease-out forwards;
}

.community-imagery-image.is-leaving {
    z-index: 1;
    animation-play-state: paused;
}

.community-imagery.is-paused .community-imagery-image {
    animation-play-state: paused;
}

@keyframes community-imagery-drift {
    from { transform: scale(1.04) translate(.6%, .4%); }
    to { transform: scale(1.12) translate(-.6%, -.6%); }
}

.community-imagery-playback {
    position: absolute;
    right: 1.25rem;
    bottom: 1.25rem;
    z-index: 3;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .45);
    border-radius: 50%;
    background: rgba(0, 0, 0, .25);
    color: #fff;
    opacity: 0;
    cursor: pointer;
    transition: opacity .2s ease, background-color .2s ease;
}

.community-imagery-playback[hidden],
.community-imagery-play-icon,
.community-imagery.is-user-paused .community-imagery-pause-icon {
    display: none;
}

.community-imagery.is-user-paused .community-imagery-play-icon { display: block; }
.community-imagery:hover .community-imagery-playback,
.community-imagery:focus-within .community-imagery-playback { opacity: 1; }
.community-imagery-playback:hover { background: rgba(0, 0, 0, .45); }
.community-imagery-playback:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

@media (hover: none), (pointer: coarse) {
    .community-imagery-playback { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .community-imagery-image,
    .community-imagery-image.has-drift {
        animation: none;
        transition: none;
        transform: none;
    }
}

.cinematic-section {
    position: relative;
    min-height: 80vh;
    display: flex;
    align-items: center;
    background: url("../assets/af43bb-gallery-aerial.jpg") center/cover fixed
}

.cinematic-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(22, 24, 20, .72), rgba(22, 24, 20, .15))
}

.text-white-75 {
    color: rgba(255, 255, 255, .78) !important
}

.residence-block {
    padding: 2rem 0;
    border-top: 1px solid var(--border)
}

.residence-block h3 {
    font-size: 3rem
}

.residence-block p {
    color: var(--muted)
}

.text-link {
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase
}

.residence-explore-button {
    display: inline-flex;
    /* width: min(100%, 26.625rem);
    min-height: 5.875rem; */
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    padding: 0.8rem 2.5rem;
    border-radius: 999px;
    background-color: #3c491f;
     color: #fff;
    /* font-size: clamp(1rem, 1.35vw, 1.45rem); */
    font-weight: 600;
    letter-spacing: .18em;
    line-height: 1.1;
    white-space: nowrap;
    transition: background-color .25s ease, color .25s ease, transform .25s ease
}

.residence-explore-button:hover,
.residence-explore-button:focus-visible {
    background-color: #607035;
    color: #fff
}

.residence-explore-button:focus-visible {
    outline: 2px solid #3c491f;
    outline-offset: 3px
}

.residence-explore-arrow {
    flex: 0 0 auto
}

@media (max-width: 767.98px) {
    .residence-explore-button {
        /* width: min(100%, 22rem);
        min-height: 4.5rem; */
        margin-top: .5rem;
         padding: 5px 5px 5px 15px; 
        gap: 1.15rem;
        font-size: .95rem
    }
}

.residence-image {
    position: relative;
    display: block;
    height: 745px;
    overflow: hidden
}

.residence-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .7s
}

.residence-image:hover img {
    transform: scale(1.035)
}

.residence-image span {
    position: absolute;
    left: 1rem;
    bottom: 1rem;
    padding: .5rem .8rem;
    background: rgba(255, 255, 255, .88);
    font-size: .65rem;
    letter-spacing: .15em;
    text-transform: uppercase
}

.image-copy {
    margin-top: 1rem;
    font-size: .88rem
}

/* Residence banners: reference crossfade (1.2s ease-out) and 5% zoom. */
.residence-slider {
    --residence-banner-ratio: 4 / 3;
    min-width: 0;
}

.residence-slider:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 5px;
}

.residence-slider.carousel-fade .carousel-item,
.residence-slider.carousel-fade .active.carousel-item-start,
.residence-slider.carousel-fade .active.carousel-item-end {
    transition: opacity 1.2s ease-out;
}

.residence-slider-image,
.residence-slider-controls {
    width: 100%;
    aspect-ratio: var(--residence-banner-ratio);
    max-height: 520px;
}

.residence-slider-image {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 1.5rem;
    box-shadow: 0 10px 40px -20px rgba(0, 0, 0, .25);
}

.residence-slider-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.05);
    transition: transform 1.2s ease-out;
}

.residence-slider .carousel-item.active:not(.carousel-item-start):not(.carousel-item-end) img,
.residence-slider .carousel-item-next.carousel-item-start img,
.residence-slider .carousel-item-prev.carousel-item-end img {
    transform: scale(1);
}

.residence-slider-badge {
    position: absolute;
    left: 1rem;
    bottom: 3.5rem;
    padding: .5rem .8rem;
    background: rgba(255, 255, 255, .88);
    font-size: .65rem;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.residence-slider-controls {
    position: absolute;
    inset: 0 0 auto;
    z-index: 3;
    pointer-events: none;
}

.residence-slider-controls button {
    pointer-events: auto;
    cursor: pointer;
}

.residence-slider-controls[hidden],
.residence-slider-playback[hidden] {
    display: none;
}

.residence-slider-arrow,
.residence-slider-playback {
    position: absolute;
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .4);
    border-radius: 50%;
    background: rgba(0, 0, 0, .2);
    color: #fff;
    opacity: 0;
    backdrop-filter: blur(4px);
    transition: opacity .15s ease, background-color .15s ease;
}

.residence-slider-arrow {
    top: 50%;
    transform: translateY(-50%);
}

.residence-slider-prev { left: 1rem; }
.residence-slider-next { right: 1rem; }
.residence-slider-playback { top: 1rem; right: 1rem; }

.residence-slider:hover .residence-slider-arrow,
.residence-slider:hover .residence-slider-playback,
.residence-slider:focus-within .residence-slider-arrow,
.residence-slider:focus-within .residence-slider-playback {
    opacity: 1;
}

.residence-slider-arrow:hover,
.residence-slider-playback:hover {
    background: rgba(0, 0, 0, .4);
}

.residence-slider-controls button:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}

.residence-slider-play-icon,
.residence-slider.is-paused .residence-slider-pause-icon {
    display: none;
}

.residence-slider.is-paused .residence-slider-play-icon {
    display: block;
}

.residence-slider-indicators {
    position: absolute;
    inset: auto 1rem .75rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .5rem;
}

.residence-slider-indicator {
    position: relative;
    flex: 0 0 auto;
    width: 1rem;
    height: 24px;
    padding: 0;
    border: 0;
    background: transparent;
    transition: width .5s ease;
}

.residence-slider-indicator::before {
    position: absolute;
    inset: 50% 0 auto;
    height: 3px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .5);
    content: "";
    transition: background-color .5s ease;
}

.residence-slider-indicator.is-active { width: 2.5rem; }
.residence-slider-indicator.is-active::before { background: #fff; }
.residence-slider-indicator:hover::before { background: rgba(255, 255, 255, .8); }

@media (min-width: 640px) {
    .residence-slider { --residence-banner-ratio: 16 / 9; }
}

@media (min-width: 1024px) {
    .residence-slider { --residence-banner-ratio: 21 / 9; }
}

@media (hover: none), (pointer: coarse) {
    .residence-slider-arrow,
    .residence-slider-playback {
        width: 44px;
        height: 44px;
        opacity: 1;
    }

    .residence-slider-indicator { min-width: 24px; }
}

@media (prefers-reduced-motion: reduce) {
    .residence-slider.carousel-fade .carousel-item,
    .residence-slider.carousel-fade .active.carousel-item-start,
    .residence-slider.carousel-fade .active.carousel-item-end,
    .residence-slider .residence-slider-image img,
    .residence-slider-indicator,
    .residence-slider-indicator::before {
        transition: none;
    }

    .residence-slider .residence-slider-image img { transform: none; }
}

.location-overview {
    padding: clamp(3rem, 6vw, 6rem) 0;
    background: #f7f8f0;
    scroll-margin-top: calc(var(--header-height, 88px) + 1rem);
}

.location-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 3fr);
    grid-template-areas:
        "map heading"
        "map content";
    align-content: center;
    column-gap: clamp(2rem, 3vw, 3.5rem);
    row-gap: 0;
}

.location-overview-map {
    grid-area: map;
    align-self: center;
    min-width: 0;
    margin: 0;
    aspect-ratio: 7 / 6;
    overflow: hidden;
    border-radius: 1.5rem;
    box-shadow: 0 20px 45px -25px rgba(32, 35, 31, .25);
}

.location-overview-map img {
    display: block;
    width: 100%;
    height: 100%;
    /* object-fit: cover; */
    object-position: center;
}

.location-overview-content {
    grid-area: content;
    min-width: 0;
}

.location-overview-heading {
    grid-area: heading;
    min-width: 0;
}

.location-overview-eyebrow {
    margin-bottom: .75rem;
    color: var(--muted);
}

.location-overview-description {
    /* margin: 1.5rem 0 1.75rem; */
    color: var(--muted);
}

.location-overview-distances {
    margin: 0;
    border-top: 1px solid rgba(32, 35, 31, .1);
}

.location-overview-distance {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: .875rem 0;
    border-bottom: 1px solid rgba(32, 35, 31, .1);
}

.location-overview-distance dt {
    font-weight: inherit;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.location-overview-distance dd {
    margin: 0;
    color: var(--gold);
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .18em;
    line-height: 1.5;
    text-transform: uppercase;
    white-space: nowrap;
}

@media (max-width: 991.98px) {
    .location-overview-grid {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "heading"
            "map"
            "content";
        gap: 0;
    }

    .location-overview-map {
        margin-bottom: 1.75rem;
        aspect-ratio: auto;
    }

    .location-overview-map img {
        height: auto;
    }

    .location-overview-description {
        margin-top: 0;
    }
}

.neighbourhood-image {
    width: 100%;
    min-height: 620px;
    object-fit: cover
}

.filter-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem
}

.filter-buttons button {
    border: 1px solid var(--border);
    background: transparent;
    padding: .55rem .85rem;
    font-size: .68rem;
    letter-spacing: .1em;
    text-transform: uppercase
}

.filter-buttons button.active,
.filter-buttons button:hover {
    background: var(--ink);
    color: #fff
}

.location-list {
    list-style: none;
    padding: 0;
    margin: 0
}

.location-list li {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: .8rem 0;
    border-bottom: 1px solid var(--border);
    font-size: .9rem
}

.location-list li i {
    color: var(--gold)
}

.location-list li.is-hidden {
    display: none
}

.enquiry-section {
    background: url("assets/e8f058-water-bg.png") center/cover
}

.contact-list {
    display: flex;
    flex-direction: column;
    gap: .8rem;
    margin-top: 2rem
}

.contact-list a,
.contact-list span {
    display: flex;
    align-items: center;
    gap: .8rem
}

.contact-list i {
    color: var(--gold)
}

.enquiry-form {
    padding: 2.5rem;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 20px 60px rgba(0, 0, 0, .08)
}

.form-label {
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase
}

.form-control {
    border: 0;
    border-bottom: 1px solid var(--border);
    border-radius: 0;
    background: transparent;
    padding: .8rem 0
}

.form-control:focus {
    border-color: var(--gold);
    box-shadow: none;
    background: transparent
}

.accordion-item {
    border-color: var(--border)
}

.accordion-button {
    gap: 1rem;
    padding: 1.4rem 0;
    background: transparent !important;
    color: var(--ink) !important;
    font-family: var(--display);
    font-size: 1.45rem;
    box-shadow: none !important
}

.accordion-button span {
    color: var(--gold);
    font-family: var(--sans);
    font-size: .7rem;
    letter-spacing: .15em
}

.accordion-body {
    padding: 0 0 1.5rem 2.5rem;
    color: var(--muted);
    line-height: 1.7
}

.site-footer {
    background: #3c491f;
    color: #fff;
}

.footer-container {
    padding-top: 30px;
    padding-bottom: 30px;
}

.footer-grid {
    display: grid;
    grid-template-columns: minmax(280px, 1.65fr) minmax(130px, .8fr) minmax(150px, .9fr) minmax(260px, 1.3fr);
    align-items: start;
    gap: clamp(2.5rem, 5vw, 6rem);
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
}

.footer-section {
    min-width: 0;
    padding: 0;
}

.footer-brand {
    display: block;
    width: fit-content;
}

.footer-logo {
    display: block;
    width: clamp(155px, 14vw, 220px);
    height: auto;
}

.footer-description {
    max-width: 390px;
    margin: 1.75rem 0 0;
    color: rgba(255, 255, 255, .72);
    font-size: .9rem;
    font-weight: 400;
    line-height: 1.75;
    -webkit-font-smoothing: antialiased;
}

.footer-links h3,
.footer-contact h3 {
    margin: .35rem 0 1.75rem;
    color: rgba(255, 255, 255, .62);
    font-family: var(--sans);
    font-size: .66rem;
    font-weight: 600;
    letter-spacing: .26em;
    line-height: 1.2;
    text-transform: uppercase;
}

.footer-links a,
.footer-contact-item {
    display: block;
    width: fit-content;
    margin: 0 0 1.15rem;
    color: rgba(255, 255, 255, .76);
    font-size: .9rem;
    line-height: 1.55;
}

.footer-contact .footer-contact-item {
    display: flex;
    align-items: center;
    gap: .75rem;
    width: 100%;
    margin-bottom: 1rem;
}

.footer-contact-item i {
    flex: 0 0 1.1rem;
    width: 1.1rem;
    color: #fff;
    font-size: 1rem;
    line-height: 1;
    text-align: center;
}

.footer-contact-item span {
    min-width: 0;
}

.footer-contact a.footer-contact-item {
    max-width: 100%;
    overflow-wrap: anywhere;
}

.footer-socials {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-top: 1.5rem;
}

.footer-socials a {
    display: inline-grid;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 50%;
    color: rgba(255, 255, 255, .78);
    font-size: 1rem;
    transition: color .2s ease, border-color .2s ease, background-color .2s ease;
}

.footer-socials a:hover,
.footer-socials a:focus-visible {
    border-color: rgba(255, 255, 255, .72);
    background: rgba(255, 255, 255, .08);
    color: #fff;
}

.footer-socials a:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}

.footer-links a,
.footer-contact a {
    transition: opacity .2s ease;
}

.footer-links a:hover,
.footer-links a:focus-visible,
.footer-contact a.footer-contact-item:hover,
.footer-contact a.footer-contact-item:focus-visible {
    color: #fff;
    opacity: .72;
}

.footer-bottom {
    max-width: 1320px;
    margin: clamp(3rem, 5vw, 5rem) auto 0;
    padding-top: 1.55rem;
    border-top: 1px solid rgba(255, 255, 255, .3);
    text-align: center;
}

.footer-bottom p {
    margin: 0;
    color: #fff;
    font-family: var(--sans);
    font-size: .82rem;
    font-weight: 400;
    line-height: 1.5;
}

@media (max-width: 1199.98px) {
    .footer-container {
        padding-top: 2.5rem;
        padding-bottom: 2.5rem;
    }

    .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 3rem 4rem;
        max-width: 720px;
    }

    .footer-section {
        min-height: 0;
    }

    .footer-bottom {
        max-width: 720px;
        margin-top: 1.75rem;
    }
}

@media (max-width: 767.98px) {
    .footer-container {
        padding-top: 2.25rem;
        padding-bottom: 2.25rem;
    }

    .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.5rem 1.5rem;
        max-width: 420px;
        margin: 0;
    }

    .footer-brand-section {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: minmax(88px, .72fr) minmax(0, 1.28fr);
        align-items: start;
        gap: 1rem;
        padding-bottom: 2rem;
        border-bottom: 1px solid rgba(255, 255, 255, .24);
    }

    .footer-explore-section {
        grid-column: 1;
    }

    .footer-residences-section {
        grid-column: 2;
    }

    .footer-contact {
        grid-column: 1 / -1;
        padding-top: 2rem;
        border-top: 1px solid rgba(255, 255, 255, .24);
    }

    .footer-description {
        max-width: 330px;
        margin-top: 0;
    }

    .footer-logo {
        width: clamp(88px, 27vw, 105px);
    }

    .footer-bottom {
        margin-top: 1.25rem;
        padding-top: 1.25rem;
        text-align: left;
    }
}

/* .reveal {
    opacity: 0;
    transform: translateY(25px);
    transition: opacity .8s ease, transform .8s ease
} */

.reveal.is-visible {
    opacity: 1;
    transform: none
}

@media (max-width:991.98px) {
    .site-logo-header {
        width: 100px;
        height: 100px
    }

    .site-logo-footer {
        width: 190px;
        height: 190px
    }

    .site-header .navbar-collapse {
        padding: 1rem 0
    }

    .hero {
        height: 78svh
    }

    .stats-logo-wrap {
        border-right: 0
    }

    .cinematic-section {
        background-attachment: scroll
    }

    .residence-image {
        height: 420px
    }

    .neighbourhood-image {
        min-height: 420px
    }

    .section {
        padding: 2.5rem 0
    }
}

@media (max-width:767.98px) {
    .reveal,
    .masterplan-overview-title.reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .site-logo-header {
        width: 88px;
        height: 88px
    }

    .site-logo-footer {
        width: 170px;
        height: 170px
    }

    .stats-section {
        padding-top: 3.5rem;
        padding-bottom: 3.5rem;
        background-position: left center;
    }

    .project-summary-grid {
        grid-template-columns: 1fr 1fr
    }

    .project-summary-grid>div:nth-child(2) {
        border-right: 0
    }

    .project-summary-grid>div:last-child {
        grid-column: 1/-1;
        border-top: 1px solid var(--border)
    }

    .project-summary strong {
        font-size: 1rem
    }

    .gallery-card {
        height: 420px;
        flex-basis: 85vw
    }

    .gallery-control {
        display: none
    }

    .gallery-track {
        padding-inline: 1.5rem
    }

    .display-heading {
        font-size: 3.25rem
    }

    .section-title {
        font-size: 3rem
    }

    .residence-image {
        height: 360px
    }

    .enquiry-form {
        padding: 1.5rem
    }
}

@media (prefers-reduced-motion:reduce) {
    html {
        scroll-behavior: auto
    }

    .reveal {
        opacity: 1;
        transform: none;
        transition: none
    }

    .residence-image img {
        transition: none
    }
}


/* Form */
:root {
    --callback-gold: #fff;
    --callback-dark: rgba(18, 79, 88, 0.78);
    --mobile-contact-bar-height: 58px;
}

/* Fixed callback bar */
.callback-bar {
    z-index: 1035;
    visibility: hidden;
    opacity: 0;
    transform: translateY(100%);
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    background-image: url("assets/olive-leaf-shade-dark.jpg");
    background-color: var(--cream);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition:
        transform 0.4s ease,
        opacity 0.4s ease,
        visibility 0.4s ease;
}

.callback-bar .container {
    width: calc(100% - clamp(2rem, 16.6vw, 21.25rem));
    max-width: 1720px;
    padding-right: 0;
    padding-left: 0;
}

/* Visible state added by JavaScript */
.callback-bar.is-visible {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}

/* Background tint */
.callback-bar-overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(18, 31, 8, 0.22);
    pointer-events: none;
}

.callback-title {
    font-family: var(--display);
    font-size: 1.05rem;
    line-height: 1.3;
    letter-spacing: 0.2em;
}

/* Pulsing circle */
.callback-pulse {
    width: 8px;
    height: 8px;
    flex-shrink: 0;
    border-radius: 50%;
    background-color: var(--callback-gold);
    animation: callbackPulse 1.8s infinite;
}

@keyframes callbackPulse {

    0%,
    100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.45;
        transform: scale(1.35);
    }
}

/* Hide button */
.callback-hide-btn {
    flex-shrink: 0;
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.75rem;
}

.callback-hide-btn:hover,
.callback-hide-btn:focus {
    color: var(--callback-gold);
}

/* Form fields */
.callback-form {
    --bs-gutter-x: 0.75rem;
    --bs-gutter-y: 0.75rem;
    align-items: stretch;
}

.callback-form > div {
    display: flex;
}

.callback-input {
    width: 100%;
    height: 50px;
    padding: 0.45rem 0.75rem;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.25);
    border-radius: 2px;
    background-color: rgba(255, 255, 255, 0.1);
    box-shadow: none;
}

.callback-input::placeholder {
    color: rgba(255, 255, 255, 0.55);
}

.callback-input:focus {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.65);
    background-color: rgba(255, 255, 255, 0.15);
    box-shadow: 0 0 0 0.2rem rgba(199, 165, 100, 0.2);
}

/* Prevent browser autofill from adding a white background */
.callback-input:-webkit-autofill,
.callback-input:-webkit-autofill:hover,
.callback-input:-webkit-autofill:focus {
    -webkit-text-fill-color: #fff;
    transition: background-color 9999s ease-out;
}

/* Submit button */
.callback-submit-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 160px;
    height: 50px;
    color: #222;
    border-color: var(--callback-gold);
    border-radius: 2px;
    background-color: var(--callback-gold);
    font-size: 0.875rem;
    font-weight: 600;
}

.callback-submit-btn:hover,
.callback-submit-btn:focus {
    color: #222;
    border-color: #fff;
    background-color: #fff;
}

/* Allow page content to remain visible above the bar */
body.callback-bar-visible {
    padding-bottom: 80px;
}

@media (max-width: 767.98px) {

    body.callback-bar-visible {
    padding-bottom: 120px;
}

    .callback-bar {
        bottom: calc(var(--mobile-contact-bar-height) + env(safe-area-inset-bottom)) !important;
    }

    .callback-bar .container {
        width: calc(100% - 2rem);
        max-width: none;
        max-height: 75vh;
        overflow-y: auto;
    }

    .callback-form {
        --bs-gutter-y: 0.65rem;
    }

    .callback-input,
    .callback-submit-btn {
        height: 48px;
    }

    .callback-submit-btn {
        min-width: 0;
    }

    .callback-title {
        font-size: 0.95rem;
    }

    body.callback-bar-visible {
        padding-bottom: calc(300px + var(--mobile-contact-bar-height) + env(safe-area-inset-bottom));
    }
}

.mobile-contact-bar {
    display: none;
}

@media (max-width: 767.98px) {
    .mobile-contact-bar {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1040;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        min-height: calc(var(--mobile-contact-bar-height) + env(safe-area-inset-bottom));
        padding-bottom: env(safe-area-inset-bottom);
        visibility: hidden;
        overflow: hidden;
        border-top: 1px solid rgba(255, 255, 255, .22);
        background: var(--cream);
        color: #fff;
        opacity: 0;
        transform: translateY(100%);
        transition: transform .3s ease, opacity .3s ease, visibility .3s ease;
    }

    .mobile-contact-bar.is-visible {
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
    }

    .mobile-contact-bar-link {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: .65rem;
        min-width: 0;
        min-height: var(--mobile-contact-bar-height);
        padding: .75rem 1rem;
        color: #fff;
        font-family: var(--sans);
        font-size: .72rem;
        font-weight: 600;
        letter-spacing: .22em;
        line-height: 1;
        text-transform: uppercase;
        transition: background-color .25s ease;
    }

    .mobile-contact-bar-link + .mobile-contact-bar-link {
        border-left: 1px solid rgba(255, 255, 255, .2);
    }

    .mobile-contact-bar-link:hover,
    .mobile-contact-bar-link:focus-visible {
        background-color: #607035;
        color: #fff;
    }

    .mobile-contact-bar-link:focus-visible {
        outline: 2px solid #fff;
        outline-offset: -4px;
    }

    .mobile-contact-bar-link .bi {
        flex: 0 0 auto;
        font-size: 1rem;
    }

    body.mobile-contact-bar-visible:not(.callback-bar-visible) {
        padding-bottom: 0;
    }
}

/* Respect reduced-motion preference */
@media (prefers-reduced-motion: reduce) {

    .callback-bar,
    .mobile-contact-bar,
    .callback-pulse {
        transition: none;
        animation: none;
    }
}

/* Logo */

.site-header {
    min-height: 95px;
    background-color: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    z-index: 1030;
}

.site-header .navbar {
    min-height: 88px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.site-container {
    max-width: 1440px;
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
}

.navbar-brand.brand {
    width: 112px;
    height: 84px;
    margin: 0;
    padding: 0;
    flex-shrink: 0;
}

.site-logo-header {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: left center;
}

/* Keep the logo and primary navigation together on the left. */
@media (min-width: 992px) {
    .site-header .navbar-collapse {
        min-width: 0;
    }

    .header-primary-nav {
        margin-left: 20px;
    }
}

/* Collapse the navigation into a full-width menu below the header on mobile. */
@media (max-width: 991.98px) {
    .site-header {
        min-height: var(--header-height);
    }

    .site-container {
        position: static;
    }

    .site-header .navbar {
        min-height: var(--header-height);
    }

    .navbar-brand.brand {
        width: 130px;
        height: 52px;
    }

    .site-logo-header {
        width: 100%;
        height: 100%;
        object-position: left center;
    }

    .site-header .navbar-collapse {
        position: absolute;
        top: 100%;
        right: 0;
        left: 0;
        padding: 1.25rem 30px 1.5rem;
        background: #fff;
        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
        box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08);
    }

    .header-primary-nav {
        gap: .35rem;
    }

    .site-header .nav-link {
        width: 100%;
        padding: .65rem 0;
    }

    .site-header .header-actions {
        gap: 1rem;
        padding-top: 1rem;
        border-top: 1px solid var(--border);
    }
}



/* :root {
    --header-height: 88px;
    --cream: #f4f1e9;
    --ink: #292526;
    --gold: #a98d55;
} */

:root {
    --header-height: 88px;
    --cream: #3c491f;
    --ink: #1d1d1b;
    --gold: #607035;
    --white: #fff;
}

/* Header must remain above everything */
.site-header {
    height: var(--header-height);
    z-index: 1050;
}

/* Sticky hero stays behind the following page content */
.sticky-hero {
    position: sticky;
    top: var(--header-height);
    z-index: 1;
    display: flex;
    flex-direction: column;
    height: calc(100svh - var(--header-height));
    min-height: min(750px, calc(100svh - var(--header-height)));
    background: var(--cream);
}

/* Main hero image area */
.hero-media {
    position: relative;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    background: #222;
}

.hero-background {
    position: absolute;
    inset: -5%;
    top: calc(-5% + 20px);
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 42%;
    will-change: transform;
    transform: translate3d(0, 0, 0) scale(1);
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom,
            rgba(0, 0, 0, 0.05),
            rgba(0, 0, 0, 0.2));
}

.hero-action {
    position: absolute;
    right: 0;
    bottom: 30px;
    left: 0;
    z-index: 2;
    display: flex;
    justify-content: center;
}

.hero-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 34px;
    border: 1px solid var(--white);
    border-radius: 0;
    font-size: 0.7rem;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: 0.22em;
    text-decoration: none;
    text-transform: uppercase;
    background-color: transparent;
    color: var(--white);
    cursor: pointer !important;
    transition: none !important;
}

.hero-button:visited {
    background-color: transparent;
    color: var(--white);
    border-color: var(--white);
    cursor: pointer !important;
}

.hero-button:hover,
.hero-button:focus-visible,
.hero-button:active {
    background-color: var(--white);
    color: #000;
    border-color: var(--white);
    cursor: pointer !important;
}

/* Information bar remains part of the sticky hero */
.project-information {
    position: relative;
    z-index: 2;
    flex-shrink: 0;
    background: var(--cream);
}

.project-information-item {
    display: flex;
    min-height: 88px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 15px;
    border-right: 1px solid rgba(255, 255, 255, 0.14);
}

.project-information-item:last-child {
    border-right: 0;
}

.project-label {
    display: block;
    color: #fff;
    font-size: 0.62rem;
    font-weight: 600;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

.project-value {
    display: block;
    margin-top: 7px;
    color: #fff;
    font-family: var(--sans);
    font-size: 1.1rem;
    font-weight: 400;
}

/*
 * Critical part:
 * This content has a higher z-index than the sticky hero,
 * so it scrolls over the location information.
 */
.page-content {
    position: relative;
    z-index: 2;
    background: var(--cream);
    box-shadow: 0 -30px 60px -35px rgba(0, 0, 0, 0.35);
}

.family-section {
    position: relative;
    /* min-height: 80vh; */
    padding: 70px 0;
    background: var(--white);
    color:var(--ink);
}

.family-section .eyebrow {
    margin-bottom: clamp(2.25rem, 3vw, 3rem);
    font-size: clamp(0.68rem, 0.8vw, 0.8rem);
    line-height: 1.5;
    color: #3c491f;
}

.family-section .display-heading {
    margin: 0 0 clamp(1.75rem, 4vw, 1.75rem);
    font-size: 40px;
    line-height: 1.05;
    text-transform: none;
    letter-spacing: 0.03em;
        color: #3c491f;
    font-weight: 900;
}

.family-section .lead-copy {
    margin-bottom: 1.4rem;
    font-size: clamp(1.05rem, 1.3vw, 1.125rem);
    line-height: 1.7;
}

.section-eyebrow {
    color: var(--white);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.family-heading {
    max-width: 650px;
    color: var(--white);
    font-family: var(--display);
    font-size: clamp(2.5rem, 5vw, 4.5rem);
    font-weight: 400;
    line-height: 1.05;
}

.family-heading em {
    color: rgba(41, 37, 38, 0.68);
}

@media (max-width: 767.98px) {
    :root {
        --header-height: 72px;
    }

    .sticky-hero {
        min-height: min(520px, calc(100svh - var(--header-height)));
        height: calc(100svh - var(--header-height));
    }

    .project-information-item {
        min-height: 78px;
        padding: 10px 6px;
    }

    .project-label {
        font-size: 0.52rem;
        letter-spacing: 0.12em;
    }

    .project-value {
        font-size: 0.85rem;
    }

    .family-section {
        padding: 50px 0;
    }

    .family-section .eyebrow {
        margin-bottom: 1.5rem;
        font-size: 0.64rem;
    }

    .family-section .display-heading {
        margin-bottom: 2rem;
        font-size: clamp(2rem, 6vw, 1.75rem);
    }

    .family-section .lead-copy {
        margin-bottom: 1.15rem;
        font-size: 1rem;
        line-height: 1.7;
    }
}

#faqAccordion {
    --bs-accordion-bg: transparent;
    --bs-accordion-border-color: rgba(0, 0, 0, 0.12);
    --bs-accordion-btn-bg: transparent;
    --bs-accordion-active-bg: transparent;
    --bs-accordion-active-color: inherit;
}

.cloud-mask {
    width: 100%;
    max-width: 560px;
    aspect-ratio: 4 / 3;
    border-radius: 20px;
    filter: none;
}

.cloud-mask img {
    display: block;
    object-fit: cover;
}

/* Villas */

.residence-image {
  display: block;
  width: 100%;
  height: 745px;
  overflow: hidden;
  border-radius: 14px;
}

.residence-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.residence-caption-label {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  color: #74766f;
}

.residence-caption-title {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 30px;
  font-style: italic;
  line-height: 1.15;
  color: #243027;
}

.residence-caption-copy {
  max-width: 450px;
  font-size: 14px;
  line-height: 1.6;
  color: #74766f;
}

@media (max-width: 991.98px) {
  .residence-image {
    height: 480px;
  }

  .residence-caption-title {
    font-size: 26px;
  }
}

@media (max-width: 767.98px) {
  .residence-image {
    height: 420px;
    border-radius: 12px;
  }

  .residence-caption-title {
    font-size: 24px;
  }
}

/* =====================================
   THE NEIGHBOURHOOD
===================================== */

.neighbourhood-section {
  background-color: #fff;
  padding: 1rem 0;
}


/* Heading text */

.neighbourhood-section .eyebrow {
  color: var(--ink);
}

.neighbourhood-section .section-title {
  color: var(--ink);
}

.neighbourhood-section .lead-copy {
  color: var(--muted);
}

.neighbourhood-intro {
  max-width: 520px;
  margin-left: auto;
}


/* =====================================
   FILTER BUTTONS
===================================== */

.filter-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.filter-buttons button {
  min-width: 90px;

  padding: 11px 20px;

  border: 1px solid var(--border);

  background: transparent;
  color: var(--ink);

  font-size: 9px;
  font-weight: 600;

  letter-spacing: 0.28em;

  text-transform: uppercase;

  cursor: pointer;

  transition:
    background-color 0.25s ease,
    color 0.25s ease,
    border-color 0.25s ease;
}

.filter-buttons button:hover,
.filter-buttons button.active {
  background: #123f2e;
  border-color: #123f2e;
  color: #fff;
}


/* =====================================
   IMAGE MAP
===================================== */

.neighbourhood-map {
  position: relative;

  width: 100%;

  overflow: visible;
}


/* Important:
   don't use min-height:620px here */

.neighbourhood-image {
  display: block;

  width: 100%;
  height: auto;

  min-height: 0;

  object-fit: cover;
}


/* =====================================
   MARKERS
===================================== */

.map-marker {
  position: absolute;

  width: 24px;
  height: 24px;

  padding: 0;
  margin: 0;

  border: 0;

  background: transparent;

  transform: translate(-50%, -50%);

  cursor: pointer;

  z-index: 10;

  transition:
    opacity 0.25s ease,
    visibility 0.25s ease;
}


/* Actual circle */

.marker-dot {
  display: block;

  width: 22px;
  height: 22px;

  border-radius: 50%;

  border: 3px solid #fff;

  box-shadow:
    0 2px 8px rgba(0, 0, 0, 0.25);

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}


/* =====================================
   MARKER COLORS
===================================== */

/* Schools */

.marker-school .marker-dot {
  background-color: #0f5132;
}


/* Parks */

.marker-park .marker-dot {
  background-color: #4b8d49;
}


/* Retail */

.marker-retail .marker-dot {
  background-color: #e96518;
}


/* Medical */

.marker-medical .marker-dot {
  background-color: #d32938;
}


/* =====================================
   LABEL
===================================== */

.marker-label {
  position: absolute;

  left: 50%;
  top: 30px;

  transform:
    translateX(-50%)
    translateY(-4px);

  padding: 5px 8px;

  background: #153628;
  color: #fff;

  border-radius: 2px;

  font-size: 9px;
  font-weight: 400;

  line-height: 1.2;

  white-space: nowrap;

  opacity: 0;
  visibility: hidden;

  pointer-events: none;

  z-index: 20;

  transition:
    opacity 0.2s ease,
    visibility 0.2s ease,
    transform 0.2s ease;
}


/* =====================================
   HOVER LABEL
===================================== */

.map-marker:hover .marker-label,
.map-marker:focus .marker-label {
  opacity: 1;
  visibility: visible;

  transform:
    translateX(-50%)
    translateY(0);
}


.map-marker:hover .marker-dot,
.map-marker:focus .marker-dot {
  transform: scale(1.15);

  box-shadow:
    0 0 0 4px rgba(255, 255, 255, 0.4),
    0 3px 10px rgba(0, 0, 0, 0.25);
}


/* =====================================
   FILTER SELECTED LABEL
===================================== */

/*
When Schools / Parks / Retail / Medical
is clicked, matching labels stay visible.
*/

.map-marker.show-label .marker-label {
  opacity: 1;
  visibility: visible;

  transform:
    translateX(-50%)
    translateY(0);
}


/* Hide markers that don't match */

.map-marker.marker-hidden {
  opacity: 0;
  visibility: hidden;

  pointer-events: none;
}


/* =====================================
   TABLET
===================================== */

@media (max-width: 991.98px) {

  .neighbourhood-section {
    padding: 4.5rem 0;
  }

  .neighbourhood-intro {
    margin-left: 0;
    margin-top: 20px;
  }

}


/* =====================================
   MOBILE
===================================== */

@media (max-width: 767.98px) {

  .filter-buttons {
    gap: 8px;
  }

  .filter-buttons button {
    min-width: auto;

    padding: 10px 14px;

    font-size: 8px;

    letter-spacing: 0.18em;
  }

  .map-marker {
    width: 20px;
    height: 20px;
  }

  .marker-dot {
    width: 18px;
    height: 18px;

    border-width: 2px;
  }

  .marker-label {
    top: 26px;

    padding: 4px 6px;

    font-size: 8px;
  }

}

/* =====================================
   ENQUIRY SECTION
===================================== */

.enquiry-section {
  position: relative;

  min-height: 620px;

  display: flex;
  align-items: center;

  padding: 85px 0;

  background-image: url("assets/olive-leaf-shade-dark.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

  overflow: hidden;
}


/* Dark green overlay */

/* .enquiry-overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(0, 45, 30, 0.82) 0%,
      rgba(0, 48, 32, 0.72) 45%,
      rgba(0, 40, 28, 0.68) 100%
    );

  pointer-events: none;
} */


/* Keep content above overlay */

.enquiry-section .container {
  z-index: 2;
}


/* =====================================
   LEFT CONTENT
===================================== */

.enquiry-eyebrow {
  color: rgba(255, 255, 255, 0.65);

  font-size: 10px;
  letter-spacing: 0.35em;

  margin-bottom: 20px;
}


.enquiry-title {
  max-width: 560px;

  margin-bottom: 25px;

  color: #fff;

  font-size: 48px;
  line-height: 0.98;
}


.enquiry-title em {
  display: inline;

  color: rgba(255, 255, 255, 0.62);

  font-weight: 400;
}


.enquiry-copy {
  max-width: 500px;

  margin-bottom: 38px;

  color: rgba(255, 255, 255, 0.68);

  font-size: 14px;
  line-height: 1.7;
}


/* Brochure introduction: scoped to the left column, separate from the form. */
.enquiry-intro-eyebrow {
  margin: 0 0 1.5rem;
  color: rgba(255, 255, 255, .5);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .3em;
  text-transform: uppercase;
}

.enquiry-intro-title {
  color: #fff;
}

.enquiry-intro-title em {
  color: rgba(255, 255, 255, .6);
}

.enquiry-intro-copy {
  max-width: 28rem;
  margin: 1.5rem 0 0;
  color: rgba(255, 255, 255, .7);
}

.enquiry-payment-plan {
  max-width: 28rem;
  margin-top: 3rem;
}

.enquiry-payment-plan .enquiry-intro-eyebrow {
  margin-bottom: 1.25rem;
}

.enquiry-payment-values {
  display: flex;
  align-items: baseline;
  gap: .75rem;
  color: #fff;
  font-family: var(--display);
  font-size: clamp(3.75rem, 5vw, 4.5rem);
  font-weight: 400;
  line-height: 1;
}

.enquiry-payment-divider {
  color: rgba(255, 255, 255, .4);
  font-size: .55em;
}

.enquiry-payment-value-handover {
  color: rgba(255, 255, 255, .7);
}

.enquiry-payment-bar {
  display: flex;
  height: 3px;
  margin-top: 1.5rem;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, .15);
}

.enquiry-payment-segment {
  flex: 0 0 auto;
  width: var(--payment-width);
  height: 100%;
  background: #fff;
}

.enquiry-payment-segment-handover {
  background: rgba(255, 255, 255, .35);
}

.enquiry-payment-captions {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.5rem;
  margin-top: 1rem;
  color: rgba(255, 255, 255, .85);
  font-size: .875rem;
  line-height: 1.6;
}

.enquiry-payment-captions > span {
  min-width: 0;
  flex: 0 1 auto;
}

.enquiry-payment-captions > span:last-child {
  color: rgba(255, 255, 255, .6);
  text-align: right;
}

.enquiry-intro.is-visible .enquiry-payment-value {
  animation: enquiry-payment-enter .7s ease-out both;
}

.enquiry-intro.is-visible .enquiry-payment-value-handover {
  animation-delay: .2s;
}

.enquiry-intro.is-visible .enquiry-payment-segment {
  animation: enquiry-payment-fill 1.4s ease-out both;
}

.enquiry-intro.is-visible .enquiry-payment-segment-handover {
  animation-duration: 1.6s;
  animation-delay: .5s;
}

.enquiry-intro.is-visible .enquiry-payment-captions > span {
  animation: enquiry-payment-caption .7s ease-out .6s both;
}

.enquiry-intro.is-visible .enquiry-payment-captions > span:last-child {
  animation-delay: .8s;
}

@keyframes enquiry-payment-enter {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes enquiry-payment-fill {
  from { width: 0; }
  to { width: var(--payment-width); }
}

@keyframes enquiry-payment-caption {
  from { opacity: 0; }
  to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .enquiry-intro.is-visible .enquiry-payment-value,
  .enquiry-intro.is-visible .enquiry-payment-segment,
  .enquiry-intro.is-visible .enquiry-payment-captions > span {
    animation: none;
  }
}

/* =====================================
   CONTACT LIST
===================================== */

.enquiry-contact-list {
  max-width: 560px;

  border-top: 1px solid rgba(255, 255, 255, 0.22);
}


.enquiry-contact-row {
  min-height: 58px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 20px;

  border-bottom: 1px solid rgba(255, 255, 255, 0.18);

  color: rgba(255, 255, 255, 0.58);

  font-size: 12px;
}


.enquiry-contact-row a,
.enquiry-contact-row .contact-value {
  color: #fff;

  font-size: 12px;
  font-weight: 500;

  text-align: right;
}


.enquiry-contact-row a:hover {
  color: rgba(255, 255, 255, 0.75);
}


/* =====================================
   FORM CARD
===================================== */

.enquiry-form {
  width: 100%;

  min-height: 355px;

  padding: 42px 34px;

  background: #fff;

  box-shadow:
    0 12px 40px rgba(0, 0, 0, 0.08);
}


/* Labels */

.enquiry-form .form-label {
  margin-bottom: 5px;

  color: #161616;

  font-size: 11px;
  font-weight: 500;

  letter-spacing: 0;

  text-transform: none;
}


/* Inputs */

.enquiry-form .form-control,
.enquiry-form .form-select {
  min-height: 39px;

  padding: 8px 12px;

  border: 1px solid #deded8;
  border-radius: 0;

  background: #fff;

  color: #222;

  font-size: 12px;

  box-shadow:
    0 2px 4px rgba(0, 0, 0, 0.04);
}


.enquiry-form .form-control::placeholder {
  color: #9a9a94;
}


.enquiry-form .form-control:focus,
.enquiry-form .form-select:focus {
  border-color: #305b48;

  background: #fff;

  box-shadow:
    0 0 0 2px rgba(48, 91, 72, 0.08);
}


/* =====================================
   BUTTON
===================================== */

.enquiry-submit {
  display: inline-block;

  width: auto;

  padding: 10px 18px;

  border: 0;
  border-radius: 2px;

  background:var(--cream);
  color: #fff;

  font-size: 11px;
  font-weight: 600;

  transition:
    background-color 0.25s ease,
    transform 0.25s ease;
}


.enquiry-submit:hover,
.enquiry-submit:focus {
  background: #0f3929;
  color: #fff;
}


/* =====================================
   VALIDATION
===================================== */

.enquiry-form .invalid-feedback {
  font-size: 10px;
}


/* =====================================
   TABLET
===================================== */

@media (max-width: 991.98px) {

  .enquiry-section {
    min-height: auto;

    padding: 70px 0;
  }


  .enquiry-title {
    font-size: 48px;
  }


  .enquiry-form {
    min-height: auto;

    padding: 32px;
  }

}


/* =====================================
   MOBILE
===================================== */

@media (max-width: 767.98px) {

  .enquiry-section {
    padding: 55px 0;

    background-position: center;
  }


  .enquiry-title {
    font-size: 40px;
  }


  .enquiry-copy {
    font-size: 13px;
  }


  .enquiry-contact-row {
    min-height: 52px;

    font-size: 11px;
  }


  .enquiry-contact-row a,
  .enquiry-contact-row .contact-value {
    font-size: 11px;
  }


  .enquiry-form {
    padding: 25px 20px;
  }

}

.lead-copy-black {
    color:#000;
    font-size: .88rem;
    line-height: 1.7
}
/* .stats-section {
    background-image: url("assets/leaf-shadow-light.jpg");
    background-repeat: no-repeat;
    background-position: left top;
    background-size: cover;
} */

.cinematic-section .lead-copy {
    max-width: 650px;
}

.cinematic-section .display-heading {
    max-width: 800px;
}

/* Shared white/light-surface titles; keep after section and mobile overrides. */
.page-content .title-on-light,
.villas-main .title-on-light {
    margin-bottom: 30px;
    font-size: 2.5rem;
    line-height: 1.05;
    text-transform: none;
    letter-spacing: 0.04em;
    color: #3c491f;
    font-weight: 900;
}

@media (max-width: 767.98px) {
    .page-content .title-on-light {
        font-size: 1.5em;
    }

    #masterplan-tabs-heading {
        padding-top: 20px;
        padding-bottom: 20px;
    }
}

/* Shared paragraph copy; opt in without changing headings, labels, or controls. */
.page-content .body-copy,
.villas-main .body-copy,
.site-footer .body-copy {
    margin-bottom: 1rem;
    font-size: clamp(1.05rem, 1.3vw, 1.125rem);
    line-height: 2em;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
}

.page-content .masterplan-highlight-description.body-copy {
    margin-bottom: 0;
}
.enquiry-intro-eyebrow-plan{
    color:#fff;
}

@media (max-width: 767.98px) {
    .enquiry-section .enquiry-intro {
        margin-top: 20px;
    }

    .enquiry-section .enquiry-intro-copy,
    .enquiry-section .enquiry-intro-eyebrow {
        margin: 0;
    }

    .enquiry-section .enquiry-intro-eyebrow-plan {
        padding-bottom: 20px;
        color:#fff;
    }

    .enquiry-section .enquiry-payment-plan {
        margin-top: 1em;
    }
}

/* Masterplan feature accordion typography and matching dark chevrons. */
.masterplan-tabs-section .masterplan-feature-item .accordion-button {
    font-size: 15px;
    font-weight: 600;
}

.masterplan-tabs-section .masterplan-feature-item .accordion-button span,
.masterplan-tabs-section .masterplan-feature-item .accordion-button .bi {
    color: inherit;
}

.masterplan-tabs-section .masterplan-feature-item .accordion-button span {
    font-size: inherit;
}

.masterplan-tabs-section .masterplan-feature-item .accordion-body.body-copy {
    font-size: 15px;
    -webkit-font-smoothing: antialiased;
}

/* Native FAQ disclosures; scoped so masterplan accordions remain unchanged. */
.faq-section .faq-section-title {
    font-family: var(--display);
}

.faq-details-item {
    border-bottom: 1px solid var(--border);
}

.faq-details-item summary {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.4rem 0;
    color: var(--ink);
    font-family: var(--display);
    font-size: 1.45rem;
    line-height: 1.35;
    cursor: pointer;
    list-style: none;
}

.faq-details-item summary::-webkit-details-marker {
    display: none;
}

.faq-details-item summary::after {
    width: .65rem;
    height: .65rem;
    flex: 0 0 auto;
    margin-left: auto;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    content: "";
    transform: rotate(45deg);
    transition: transform .25s ease;
}

.faq-details-item[open] summary::after {
    transform: rotate(225deg);
}

.faq-number {
    flex: 0 0 auto;
    color: var(--gold);
    font-family: var(--sans);
    font-size: .7rem;
    letter-spacing: .15em;
}

.faq-question {
    min-width: 0;
    font-family: var(--sans);
    font-size: 17px;
    font-weight: 400;
}

.faq-details-item > .body-copy {
    margin-bottom: 1.4rem;
    padding: 0 2.5rem 1.5rem;
    color: var(--muted);
    font-size: clamp(1.05rem, 1.3vw, 1.125rem);
    line-height: 2em;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
}

.faq-details-list.is-collapsible .faq-details-item[hidden] {
    display: none;
}

.faq-toggle-controls {
    margin-top: 2rem;
    text-align: center;
}

.faq-toggle-link {
    padding: .35rem 0;
    border: 0;
    border-bottom: 1px solid currentColor;
    background: transparent;
    color: var(--cream);
    font-family: var(--sans);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .12em;
    line-height: 1.5;
    text-transform: uppercase;
    cursor: pointer;
}

.faq-toggle-link:hover,
.faq-toggle-link:focus-visible {
    color: var(--gold);
}

.faq-toggle-link:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 4px;
}

@media (max-width: 767.98px) {
    .faq-section .col-lg-8 {
        margin: 0;
    }
}

@media (max-width: 575.98px) {
    .faq-details-item summary {
        gap: .75rem;
        font-size: 1.15rem;
    }

    .faq-details-item > .body-copy {
        padding-right: 1.25rem;
        padding-left: 1.75rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .faq-details-item summary::after {
        transition: none;
    }
}