/*
Theme Name: BiltmoreCoLive-VillaForge
Theme URI: https://visualwebb.com
Description: Custom WordPress theme developed for Biltmore Co. using the VisualWebb VillaForge Bootstrap 5 framework.
Version: 2.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Author: VisualWebb
Author URI: https://visualwebb.com
Tags: real estate, home builder, land developer, bootstrap 5, luxury, responsive, custom logo
*/


/* ==========================================================
   BILTMORE CO.
   GLOBAL THEME VARIABLES
========================================================== */

:root {

    /* Brand Colors */
    --biltmore-charcoal: #303a3d;
    --biltmore-charcoal-dark: #252e31;

    --biltmore-ivory: #f3f1eb;
    --biltmore-cream: #ebe8df;
    --biltmore-white: #ffffff;

    --biltmore-bronze: #9b8266;
    --biltmore-bronze-light: #b09a80;

    --biltmore-text: #343434;
    --biltmore-text-light: #6d6a65;

    --biltmore-border: rgba(155, 130, 102, 0.55);

    /* Layout */
    --biltmore-section-spacing: clamp(4rem, 7vw, 8rem);

    /* Transitions */
    --biltmore-transition: 0.3s ease;
}


/* ==========================================================
   GLOBAL
========================================================== */

html,
body {
    min-height: 100%;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    display: flex;
    flex-direction: column;

    background-color: var(--biltmore-ivory);
    color: var(--biltmore-text);

    font-family: 'Lato', sans-serif;
    font-weight: 300;
    line-height: 1.7;

    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.fillUp {
    flex-grow: 1;
}

img {
    max-width: 100%;
    height: auto;
}

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

    transition:
        color var(--biltmore-transition),
        opacity var(--biltmore-transition);
}

a:hover {
    color: var(--biltmore-bronze);
}


/* ==========================================================
   TYPOGRAPHY
========================================================== */

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;

    color: var(--biltmore-charcoal);

    font-family: 'Cormorant Garamond', serif;
    font-weight: 500;

    line-height: 1.15;

    letter-spacing: 0.06em;
}

h1 {
    font-size: clamp(2.25rem, 5vw, 4.75rem);
}

h2 {
    font-size: clamp(1.9rem, 4vw, 3.5rem);
}

h3 {
    font-size: clamp(1.5rem, 3vw, 2.5rem);
}

h4 {
    font-size: clamp(1.25rem, 2vw, 1.8rem);
}

h5 {
    font-size: clamp(1rem, 1.5vw, 1.3rem);
}

h6 {
    font-size: 0.8rem;
    letter-spacing: 0.15em;
}


/*
 * Do not globally style span elements.
 *
 * WordPress, Bootstrap, Font Awesome, Navwalker and plugins
 * frequently use span elements internally.
 */

p {
    margin-top: 0;
    margin-bottom: 1.5rem;

    color: var(--biltmore-text);

    font-family: 'Lato', sans-serif;
    font-size: clamp(0.95rem, 1.2vw, 1.08rem);
    font-weight: 300;

    line-height: 1.8;
}

li,
td,
th,
label,
input,
textarea,
select,
button {
    font-family: 'Lato', sans-serif;
}


/* Small Editorial Heading */

.brand-accent {
    color: var(--biltmore-bronze);

    font-family: 'Lato', sans-serif;
    font-size: 0.72rem;
    font-weight: 500;

    letter-spacing: 0.25em;

    text-transform: uppercase;
}


/* ==========================================================
   BRAND BACKGROUNDS
========================================================== */

.brand-primary {
    background-color: var(--biltmore-charcoal);
    color: var(--biltmore-white);
}

.brand-secondary {
    background-color: var(--biltmore-bronze);
    color: var(--biltmore-white);
}


/*
 * Existing VillaForge class names retained intentionally.
 * "nutural" spelling is preserved for template compatibility.
 */

.brand-nutural-primary {
    background-color: var(--biltmore-ivory);
    color: var(--biltmore-text);
}

.brand-nutural-seconday {
    background-color: var(--biltmore-cream);
    color: var(--biltmore-text);
}


/* ==========================================================
   SECTIONS
========================================================== */

.section {
    padding-top: var(--biltmore-section-spacing);
    padding-bottom: var(--biltmore-section-spacing);
}

.section-light {
    background-color: var(--biltmore-ivory);
}

.section-dark {
    background-color: var(--biltmore-charcoal);
    color: var(--biltmore-white);
}

.section-dark h1,
.section-dark h2,
.section-dark h3,
.section-dark h4,
.section-dark h5,
.section-dark h6,
.section-dark p {
    color: var(--biltmore-white);
}


/* ==========================================================
   NAVIGATION - GLOBAL RESET
========================================================== */

.menu {
    margin: 0;
    padding: 0;
}

.menu li {
    list-style: none;
}


/*
 * The actual Biltmore header/navigation styling is controlled
 * by .biltmore-navbar and .biltmore-main-menu below.
 */


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

.btn-brand {
    display: inline-block;

    padding: 0.8rem 2.25rem;

    background-color: transparent;

    border: 1px solid var(--biltmore-bronze);
    border-radius: 0;

    color: var(--biltmore-charcoal);

    font-family: 'Lato', sans-serif;
    font-size: 0.7rem;
    font-weight: 500;

    line-height: 1.2;
    letter-spacing: 0.18em;

    text-align: center;
    text-transform: uppercase;

    transition:
        background-color var(--biltmore-transition),
        color var(--biltmore-transition),
        border-color var(--biltmore-transition);
}

.btn-brand:hover,
.btn-brand:focus {
    background-color: var(--biltmore-charcoal);

    border-color: var(--biltmore-charcoal);

    color: var(--biltmore-white);
}


/* Dark Background Button */

.section-dark .btn-brand {
    border-color: var(--biltmore-bronze-light);
    color: var(--biltmore-white);
}

.section-dark .btn-brand:hover,
.section-dark .btn-brand:focus {
    background-color: var(--biltmore-white);

    border-color: var(--biltmore-white);

    color: var(--biltmore-charcoal);
}


/* ==========================================================
   IMAGE UTILITIES
========================================================== */

.small-img {
    width: 100%;

    min-height: 55vh;
    max-height: 55vh;

    object-fit: cover;

    overflow: hidden;
}


/* ==========================================================
   IMAGE HOVER
========================================================== */

.image-container {
    position: relative;

    display: block;

    overflow: hidden;
}

.image-container h2 {
    text-transform: uppercase;
}

.image-container img {
    display: block;

    width: 100%;
    height: auto;

    transition: transform 0.6s ease;
}

.image-container:hover img {
    transform: scale(1.025);
}

.hover-overlay {
    position: absolute;

    inset: 0;

    display: flex;

    align-items: center;
    justify-content: center;

    background-color: rgba(48, 58, 61, 0.92);

    text-align: center;

    opacity: 0;

    transition: opacity 0.4s ease;

    z-index: 2;
}

.hover-overlay::after {
    content: "";

    position: absolute;

    inset: 15px;

    border: 1px solid var(--biltmore-bronze);
}

.image-container:hover .hover-overlay {
    opacity: 1;
}

.hover-text {
    position: relative;

    z-index: 3;

    color: var(--biltmore-white);

    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.1rem, 2vw, 1.5rem);
    font-weight: 500;

    letter-spacing: 0.08em;

    text-transform: uppercase;
}


/* ==========================================================
   COMMUNITY / FLOORPLAN CARDS
========================================================== */

.communityCard {
    display: block;

    background-color: transparent;

    border: none;
    border-radius: 0;

    box-shadow: none;

    text-decoration: none;

    transition: opacity var(--biltmore-transition);
}

.communityCard img {
    width: 100%;

    object-fit: cover;

    transition: transform 0.5s ease;
}

.communityCard:hover {
    transform: none;
    box-shadow: none;
}

.communityCard:hover img {
    transform: scale(1.02);
}


/* ==========================================================
   LINKS
========================================================== */

a.link-accent,
a.brand-accent {
    position: relative;

    color: var(--biltmore-charcoal);

    text-decoration: none;
}

a.link-accent::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: -4px;

    width: 100%;
    height: 1px;

    background-color: var(--biltmore-bronze);

    transform: scaleX(0);
    transform-origin: left;

    transition: transform var(--biltmore-transition);
}

a.link-accent:hover::after {
    transform: scaleX(1);
}


/* ==========================================================
   FORMS
========================================================== */

.form-control {
    padding: 0.75rem 0;

    background-color: transparent;

    border: none;
    border-bottom: 1px solid rgba(48, 58, 61, 0.35);
    border-radius: 0;

    color: var(--biltmore-text);

    font-family: 'Lato', sans-serif;
    font-weight: 300;
}

.form-control:focus {
    background-color: transparent;

    border-color: var(--biltmore-bronze);

    box-shadow: none;

    color: var(--biltmore-text);
}

.form-control::placeholder {
    color: var(--biltmore-text-light);

    font-size: 0.7rem;

    letter-spacing: 0.15em;

    text-transform: uppercase;
}


/* ==========================================================
   FOOTER - GLOBAL
========================================================== */

footer {
    background-color: var(--biltmore-charcoal);
    color: var(--biltmore-white);
}

footer h1,
footer h2,
footer h3,
footer h4,
footer h5,
footer h6 {
    color: var(--biltmore-bronze-light);
}

.footer-menu {
    margin: 0;
    padding: 0;
}

.footer-menu li {
    list-style: none;
}

.footer-menu a {
    color: rgba(255, 255, 255, 0.8);

    font-family: 'Lato', sans-serif;
    font-size: 0.68rem;

    letter-spacing: 0.15em;

    text-transform: uppercase;
    text-decoration: none;

    transition: color var(--biltmore-transition);
}

.footer-menu a:hover {
    color: var(--biltmore-bronze-light);
    text-decoration: none;
}


/* ==========================================================
   ACCESSIBILITY
========================================================== */

:focus-visible {
    outline: 2px solid var(--biltmore-bronze);
    outline-offset: 4px;
}


/* ==========================================================
   RESPONSIVE - GLOBAL
========================================================== */

@media (max-width: 991.98px) {

    .small-img {
        min-height: 45vh;
        max-height: 45vh;
    }

}


@media (max-width: 767.98px) {

    :root {
        --biltmore-section-spacing: 4rem;
    }

    h1 {
        font-size: clamp(2rem, 10vw, 3rem);
    }

    h2 {
        font-size: clamp(1.65rem, 8vw, 2.5rem);
    }

    .small-img {
        min-height: 40vh;
        max-height: 40vh;
    }

    .btn-brand {
        padding: 0.75rem 1.5rem;
    }

}


@media (max-width: 575.98px) {

    :root {
        --biltmore-section-spacing: 3.5rem;
    }

    .small-img {
        min-height: 35vh;
        max-height: 35vh;
    }

}


/* ==========================================================
   BILTMORE HEADER
========================================================== */

.site-header {
    position: relative;

    z-index: 1030;

    background-color: var(--biltmore-ivory);
}


/* ==========================================================
   HEADER LOGO
========================================================== */

.biltmore-logo-header {
    padding: 1.5rem 0 1.25rem;

    background-color: var(--biltmore-ivory);
}

.biltmore-logo-link {
    display: inline-flex;

    flex-direction: column;

    align-items: center;

    color: var(--biltmore-charcoal);
}

.biltmore-logo-header .custom-logo-link {
    display: inline-block;
}

.biltmore-logo-header .custom-logo {
    display: block;

    width: auto;
    max-width: 220px;
    max-height: 85px;
    height: auto;

    margin: 0 auto;

    object-fit: contain;
}

.biltmore-logo-text {
    display: block;

    color: var(--biltmore-charcoal);

    font-family: 'Cormorant Garamond', serif;
    font-size: 2.4rem;
    font-weight: 500;

    line-height: 0.9;

    letter-spacing: 0.08em;
}

.biltmore-logo-subtext {
    display: block;

    margin-top: 0.3rem;

    color: var(--biltmore-charcoal);

    font-family: 'Lato', sans-serif;
    font-size: 0.6rem;

    letter-spacing: 0.5em;
}


/* ==========================================================
   BILTMORE NAVIGATION
========================================================== */

.biltmore-navbar {
    min-height: 52px;

    padding: 0;

    background-color: var(--biltmore-charcoal);

    border-top: 1px solid var(--biltmore-bronze);
    border-bottom: 1px solid var(--biltmore-bronze);

    box-shadow: none;
}

.biltmore-navbar .container {
    justify-content: center;
}

.biltmore-main-menu {
    width: 100%;

    align-items: center;
    justify-content: center;

    margin: 0;
    padding: 0;
}

.biltmore-main-menu .nav-item {
    position: relative;

    margin: 0;
}


/*
 * Explicitly style both the Navwalker link and its internal
 * span so global/plugin styles cannot override menu labels.
 */

.biltmore-main-menu .nav-link {
    padding: 1rem 1.25rem !important;

    color: var(--biltmore-white) !important;

    font-family: 'Lato', sans-serif;
    font-size: 0.7rem;
    font-weight: 400;

    line-height: 1;

    letter-spacing: 0.15em;

    text-transform: uppercase;

    white-space: nowrap;

    transition: color var(--biltmore-transition);
}

.biltmore-main-menu .nav-link span {
    color: inherit !important;

    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;

    line-height: inherit;

    letter-spacing: inherit;

    text-transform: inherit;
}

.biltmore-main-menu .nav-link:hover,
.biltmore-main-menu .nav-link:focus,
.biltmore-main-menu .current-menu-item > .nav-link,
.biltmore-main-menu .current_page_item > .nav-link {
    color: var(--biltmore-bronze-light) !important;
}


/* Gold separators between navigation items */

.biltmore-main-menu > .nav-item:not(:last-child)::after {
    content: "";

    position: absolute;

    right: 0;
    top: 50%;

    width: 1px;
    height: 18px;

    background-color: var(--biltmore-bronze);

    transform: translateY(-50%);
}


/* ==========================================================
   BILTMORE MOBILE HEADER
========================================================== */

@media (max-width: 767.98px) {

    .biltmore-logo-header {
        padding: 1rem 0;
    }

    .biltmore-logo-header .custom-logo {
        max-width: 165px;
        max-height: 65px;
    }

    .biltmore-navbar {
        min-height: 52px;

        padding: 0.4rem 1rem;
    }

    .biltmore-navbar .container {
        justify-content: flex-end;
    }

    .biltmore-navbar .navbar-toggler {
        padding: 0.35rem 0.5rem;

        border: 1px solid var(--biltmore-bronze);
        border-radius: 0;

        box-shadow: none;
    }

    .biltmore-navbar .navbar-toggler:focus {
        box-shadow: none;
    }

    .biltmore-navbar .navbar-collapse {
        width: 100%;

        padding: 0.75rem 0 1rem;
    }

    .biltmore-main-menu {
        width: 100%;

        align-items: stretch;
    }

    .biltmore-main-menu .nav-item {
        width: 100%;

        border-bottom: 1px solid rgba(155, 130, 102, 0.45);
    }

    .biltmore-main-menu .nav-item:last-child {
        border-bottom: none;
    }

    .biltmore-main-menu > .nav-item::after {
        display: none;
    }

    .biltmore-main-menu .nav-link {
        padding: 0.85rem 0 !important;

        text-align: center;
    }

}


/* ==========================================================
   BILTMORE FOOTER
========================================================== */

.biltmore-footer {
    padding: 2.5rem 0 0.75rem;

    background-color: var(--biltmore-charcoal);

    color: var(--biltmore-white);
}


/* Footer Headings */

.footer-heading {
    margin: 0 0 0.65rem;

    color: var(--biltmore-bronze-light);

    font-family: 'Cormorant Garamond', serif;
    font-size: 1rem;
    font-weight: 500;

    line-height: 1;

    letter-spacing: 0.05em;

    text-align: center;

    text-transform: none;
}


/* Single Continuous Divider */

.footer-rule {
    width: 100%;
    height: 1px;

    margin: 1rem 0 0;

    background-color: var(--biltmore-bronze);
}


/* Footer Links */

.footer-links {
    display: flex;

    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    gap: 0.4rem;
}

.footer-links,
.footer-links a,
.footer-links span {
    color: rgba(255, 255, 255, 0.82);

    font-family: 'Lato', sans-serif;
    font-size: 0.64rem;
    font-weight: 400;

    line-height: 1.4;

    letter-spacing: 0.07em;

    text-transform: uppercase;
}

.footer-links a:hover {
    color: var(--biltmore-bronze-light);
}


/* ==========================================================
   FOOTER ADDRESS / COPYRIGHT
========================================================== */

.footer-bottom {
    margin-top: 0.75rem;

    text-align: center;
}

.footer-bottom p,
.footer-bottom span {
    margin: 0;

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

    font-family: 'Lato', sans-serif;
    font-size: 0.6rem;
    font-weight: 300;

    line-height: 1.5;

    letter-spacing: 0.04em;
}

.footer-divider {
    margin: 0 0.4rem;
}


/* ==========================================================
   CONTROL PANEL / POWERED BY
========================================================== */

.footer-admin {
    margin-top: 0.3rem;

    text-align: center;

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

    font-family: 'Lato', sans-serif;
    font-size: 0.48rem;

    line-height: 1.4;

    letter-spacing: 0.03em;
}

.footer-admin a,
.footer-admin span {
    color: rgba(255, 255, 255, 0.3);

    font-family: 'Lato', sans-serif;
    font-size: 0.48rem;
}

.footer-admin > span:first-of-type {
    margin: 0 0.25rem;
}

.footer-admin a:hover {
    color: rgba(255, 255, 255, 0.6);
}


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

@media (max-width: 767.98px) {

    .biltmore-footer {
        padding-top: 2rem;
    }

    .footer-link-column {
        margin-bottom: 1.25rem;
    }

    .footer-heading {
        margin-top: 0.75rem;
    }

    .footer-bottom {
        margin-top: 1.25rem;
    }

}