/*
Theme Name:   Kadence Child
Theme URI:    https://landandsearealty.com/
Description:  Child theme for Kadence. Houses all custom CSS and JS for Land & Sea International Realty in one version-controlled location, replacing the Customizer Additional CSS field and the WPCode CSS/JS snippets. Consolidated 2026-06-01.
Author:       Land & Sea International Realty
Template:     kadence
Version:      1.0.0
Text Domain:  kadence-child
*/

/* =========================================================================
   NOTE ON ORGANIZATION
   This file consolidates three former locations:
     1. Customizer > Additional CSS (439 lines)
     2. WPCode snippet 859 "animation_css" (non-slider rules only)
     3. WPCode snippet 1300 "Cinematic Styles" (CSS portion)
   All Smart Slider (n2-* / .ss-slide) rules were REMOVED — the plugin and the
   only page using it (Inspiring Greatness) were deleted 2026-06-01, so that
   CSS was dead. Duplicate declarations, dead overrides, and a cross-location
   box-shadow conflict were resolved (see inline notes).
   ========================================================================= */


/* === Site container & global chrome ===================================== */
.site-container {
    max-width: 1328px !important;
}
.kadence-svg-iconset svg {
    height: 0.8em;
    width: 0.8em;
}
.content-area {
    margin-bottom: -1px !important;
}
main#inner-wrap {
    margin-bottom: 272px;
    background: #fff;
    z-index: 2;
}
footer.site-footer {
    bottom: 0;
    left: 0;
    position: fixed;
    width: 100%;
    padding-bottom: 36px;
}
.wp-block-spacer {
    background: #e2e2e2 !important;
}
.wp-block-column {
    border-left: 1px solid #dddddd;
}
/* === end global chrome === */


/* === Sticky header backdrop & layout ==================================== */
.kadence-sticky-header.item-is-fixed.item-at-start {
    padding: 0;
}
.kadence-sticky-header.item-is-fixed.item-is-stuck {
    backdrop-filter: blur(20px) saturate(1.8);
    background: rgba(0, 0, 0, .15);
}
#masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start):not(.site-header-row-container):not(.item-hidden-above):not(.site-main-header-wrap),
#masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start):not(.item-hidden-above) > .site-header-row-container-inner {
    backdrop-filter: blur(20px) saturate(1.8);
    background: rgba(0, 0, 0, .15);
}
.item-is-stuck .site-container {
    border: none !important;
}
.site-header .site-container {
    padding: 0;
}
.site-main-header-wrap .site-header-row-container-inner > .site-container {
    padding: 0px 0 !important;
    border-bottom: 1px solid #dddddd70;
}
/* === end sticky header backdrop === */


/* === Header scroll-hide behavior (driven by JS: header-scroll.js) =======
   Class toggles `menu-hidden` / `is-sticky` are applied on scroll by JS that
   watches the homepage video container (.kb-blocks-bg-video-container).
   CONFLICT RESOLVED: snippet 859 set box-shadow: 0 2px 8px on .is-sticky while
   the Customizer set box-shadow: none !important. The Customizer value won
   live, so the no-shadow result is preserved here as the single intended rule.
   ======================================================================== */
.site-main-header-wrap {
    transition: all 0.4s ease;
}
.site-main-header-wrap.menu-hidden {
    transform: translateY(-100%);
    opacity: 0;
    transition: all 0.4s ease;
}
.site-bottom-header-wrap.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
    box-shadow: none;
    transition: top 0.4s ease, opacity 0.4s ease;
}
body.home .site-bottom-header-wrap {
    display: none !important;
}
/* === end header scroll-hide === */


/* === Navigation & menu items ============================================ */
span.kt-svg-icon-list-text {
    font-size: 12px;
    text-decoration: none;
    transition: opacity .4s;
    color: #fff;
}
.kt-row-column-wrap.kt-has-3-columns.kt-row-layout-equal.kt-tab-layout-inherit.kt-mobile-layout-row.kt-row-valign-top.kb-theme-content-width {
    background: #151515;
}
.widget-toggle-open-container .widget-toggle-open {
    display: flex;
    flex-direction: row-reverse;
    column-gap: 10px;
}
.search-toggle-open {
    flex-direction: row-reverse;
    column-gap: 10px;
}
.kt-svg-icon-list-single {
    display: none !important;
}
.site-footer-row-container .site-container {
    padding-left: 0 !important;   /* was declared twice; de-duplicated */
}
.wp-block-kadence-listitem:hover {
    cursor: pointer;
    opacity: 0.8;
}
.widget_nav_menu a {
    color: #fff;
    font-size: 1rem !important;
    font-weight: 500;
    letter-spacing: .1175em;
    line-height: 50px !important;
    opacity: .5;
    padding-right: 100px;
    text-align: right;
    text-transform: uppercase;
    transition: opacity .4s;
    will-change: opacity;
}
.widget_nav_menu a:hover {
    opacity: 1;
}
.menu-menu-container {
    display: flex;
    justify-content: end;
    align-items: center;
    height: 91vh;
}
/* Menu button "shine" effect (from snippet 859) */
.widget-toggle-icon {
    position: relative;
    overflow: hidden;
}
.widget-toggle-icon::before {
    background: linear-gradient(to left, #000 0%, rgba(255, 255, 255, 0.3) 100%);
    content: "";
    display: block;
    height: 100%;
    right: -75%;
    position: absolute;
    top: 0;
    transform: skewX(25deg);
    width: 50%;
    z-index: 2;
}
.widget-toggle-open:hover .widget-toggle-icon::before,
.widget-toggle-open:focus .widget-toggle-icon::before {
    animation: shine 0.85s;
}
@keyframes shine {
    100% {
        right: 125%;
    }
}
/* === end navigation & menu === */


/* === Drawer / mobile menu =============================================== */
.popup-drawer .drawer-inner {
    backdrop-filter: blur(20px) saturate(1.8);
    background: rgba(0, 0, 0, .15);
}
#widget-drawer.popup-drawer-layout-fullwidth .drawer-content .header-widget2,
#widget-drawer.popup-drawer-layout-sidepanel .drawer-inner {
    max-width: 680px !important;
}
.popup-drawer .drawer-header {
    padding: 0 1.5em;
    display: flex;
    justify-content: start;
    transform: translateY(10px);
    padding-left: 16vw;
    position: relative;
}
.popup-drawer .drawer-header ::after {
    content: "CLOSE";
    position: absolute;
    left: 33px;
    top: 16px;
    font-size: 18px;
}
.popup-drawer-side-left li {
    transform: translateX(-500px);
    transition: all 0.9s ease;
}
.popup-drawer-side-left.show-drawer.active li {
    transform: translateX(0);
    transition: all 0.9s ease;
}
/* === end drawer / mobile menu === */


/* === Sub-banner / header HTML links ===================================== */
.sub_banner_head {
    position: absolute;
    left: 100px;
    top: 95px;
}
.sub_banner_head a {
    font-size: 12px;
    background: none;
    border: none;
    height: 60px;
    letter-spacing: .1666666667em;
    line-height: 60px !important;
    opacity: 1;
    padding: 0;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 300 !important;
}
.header-html-inner p a {
    font-size: 18px;
    background: none;
    border: none;
    line-height: 40px !important;
    opacity: 1;
    padding: 0;
    text-decoration: none !important;
    text-transform: uppercase;
    font-weight: 500 !important;
}
/* === end sub-banner === */


/* === Content sections: neighborhood / inspire image cards ===============
   .products_area and .crafted_inspire shared identical figure/img rules and
   differed only in hover opacity (0.7 vs 0.8). Merged the shared rules; kept
   the two distinct hover values.
   ======================================================================== */
.products_area figure,
.crafted_inspire figure {
    overflow: hidden;
}
.products_area img,
.crafted_inspire img {
    -o-object-fit: cover;
    object-fit: cover;
    height: 400px;
    overflow: hidden;
    transition: transform 0.8s;
}
.products_area img:hover,
.crafted_inspire img:hover {
    transform: scale(1.1);
}
.products_area img:hover {
    opacity: 0.7;
}
.crafted_inspire img:hover {
    opacity: 0.8;
}
/* === end content image cards === */


/* === Buttons ============================================================ */
a.wp-block-button__link {
    min-width: 276px;
    border: 1px solid #000 !important;
    border-radius: 100rem !important;
    overflow: hidden;
    transition: all 0.8s ease;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
a.wp-block-button__link:hover {
    background: #dddddd82;
}
a.wp-block-button__link span {
    display: inline-block !important;
    content: "\2192" !important;
    margin-left: 5px;
    transform: translateX(100px);
    transition: transform 0.8s ease;
}
a.wp-block-button__link:hover span {
    transform: translateX(0);
}
/* === end buttons === */


/* === Headings & text ==================================================== */
p.has-small-font-size {
    padding: 0 15px;
}
h2.wp-block-heading.has-small-font-size {
    padding: 0 15px;
    text-transform: uppercase;
}
/* === end headings === */


/* === Homepage banner blur-in animations (from snippet 859) ============== */
.banner_animation .kt-row-column-wrap.kt-has-1-columns.kt-row-layout-equal.kt-tab-layout-inherit.kt-mobile-layout-row.kt-row-valign-top {
    display: flex;
    justify-content: center;
    align-items: center;
}
.banner_animation h2 {
    animation: blurAnimation both;
    animation-timeline: view();
    font-family: 'system-ui';
    color: #ffff;
    font-size: 462.5%;
    text-shadow: none;
    line-height: 1.3;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    text-align: inherit;
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: uppercase;
}
@keyframes blurAnimation {
    0%   { filter: blur(40px); }
    45%,
    55%  { filter: blur(0px); }
    100% { filter: blur(40px); }
}
h2.subbanner_animation {
    font-family: 'system-ui';
    color: #ffffff;
    font-size: 462.5%;
    text-shadow: none;
    line-height: 1.3;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    text-align: inherit;
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: uppercase;
    font-weight: 300;
    text-align: center;
    padding: 11rem 0;
}
.subbanner_animation {
    animation: blurSubAnimation both;
    animation-timeline: view();
}
@keyframes blurSubAnimation {
    40%  { filter: blur(50px); }
    55%,
    65%  { filter: blur(0px); }
    100% { filter: blur(50px); }
}
#post-897 .kb-row-layout-wrap.wp-block-kadence-rowlayout.kb-row-layout-id897_7833c0-d3 {
    margin-bottom: 0;
}
/* === end banner animations === */


/* === Cinematic scene rows & footer logo (from snippet 1300) ============= */
/* Native scroll — no wheel hijacking, no section snapping */
html, body {
    scroll-behavior: auto;
    overscroll-behavior-y: auto;
    scroll-snap-type: none;
}
/* Full-height stage for the lower scenes (desktop) */
@media (min-width: 769px) {
    .kb-row-layout-id2_31fc40-52,
    .kb-row-layout-id2_4a5281-94 {
        min-height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
    }
}
.kb-row-layout-wrap.kb-row-layout-id2_4a5281-94.alignfull.has-theme-palette3-background-color.kt-row-has-bg.wp-block-kadence-rowlayout {
    z-index: 2;
}
#colophon .wp-block-kadence-image img {
    width: 180px;
    padding: 5px 0 12px;
}
/* === end cinematic scenes & footer logo === */


/* === Logo crossfade: wordmark <-> turtle (opacity only) =================
   Layout + sizing of the turtle are pinned here. Opacity is currently driven
   by the stuck-state rules below; the planned scroll-linked scrub (logo-
   crossfade.js) can take over opacity later. Keep these rules together.
   ======================================================================== */
.kadence-sticky-header .site-branding .brand.has-sticky-logo {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.kadence-sticky-header .site-branding .brand.has-sticky-logo img.custom-logo,
.kadence-sticky-header .site-branding .brand.has-sticky-logo img.kadence-sticky-logo {
    transition: opacity 0.3s ease-in-out !important;
}
.kadence-sticky-header .site-branding .brand.has-sticky-logo img.kadence-sticky-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    right: auto;
    opacity: 0;
    transform: translate(-50%, -50%) !important;
    width: 60px !important;
    max-width: 60px !important;
    min-width: 60px !important;
    height: 38px !important;
    max-height: 38px !important;
    object-fit: contain !important;
}
.kadence-sticky-header.item-is-fixed:not(.item-at-start) .brand.has-sticky-logo img.custom-logo {
    opacity: 0 !important;
}
.kadence-sticky-header.item-is-fixed:not(.item-at-start) .brand.has-sticky-logo img.kadence-sticky-logo {
    opacity: 1 !important;
}
/* === end logo crossfade === */


/* === Responsive / breakpoints =========================================== */
@media only screen and (min-width: 1024px) {
    .widget_nav_menu a {
        font-size: 1.6rem;
        letter-spacing: .1175em;
        line-height: 1.875;
    }
}
@media screen and (max-width: 1024px) {
    main#inner-wrap {
        margin-bottom: 392px;
    }
    .popup-drawer-side-left.show-drawer.active li {
        text-align: right;
    }
}
@media screen and (max-width: 991.99px) {
    .popup-drawer .drawer-header ::after {
        display: none !important;
    }
}
@media screen and (max-width: 768px) {
    main#inner-wrap {
        margin-bottom: 592px;
    }
    .site-footer-middle-section-1.site-footer-section.footer-section-inner-items-5 {
        display: grid;
        min-height: 36px;
        grid-template-columns: 1fr 1fr;
        margin-bottom: 30px;
    }
}
/* === end responsive === */