/* Shared page-title banner for Pricing, Features, FAQs and Contact. */
.kv-page-title {
    position: relative;
    overflow: hidden;
    padding: 8.5rem 0 5.25rem;
    background: #e3dbc4 !important;
}

.kv-page-title::before {
    content: "";
    position: absolute;
    width: 30rem;
    height: 30rem;
    top: -22rem;
    left: -9rem;
    border: 2px solid rgba(198, 169, 89, 0.13);
    border-radius: 50%;
    box-shadow: 0 0 0 36px rgba(198, 169, 89, 0.055), 0 0 0 72px rgba(198, 169, 89, 0.028);
    pointer-events: none;
}

.kv-page-title__heading {
    position: relative;
    z-index: 1;
    margin: 0;
    color: #111827;
    font-size: clamp(2.25rem, 4vw, 3.75rem);
    font-weight: 700;
    line-height: 1.12;
}


.kv-page-title__subtitle {
    position: relative;
    z-index: 1;
    max-width: 58rem;
    margin: 1rem auto 0;
    color: #343434;
    font-size: clamp(1rem, 1.6vw, 1.25rem);
    font-weight: 400;
    line-height: 1.65;
}

@media (max-width: 767px) {
    .kv-page-title {
        padding: 7rem 0 3.75rem;
    }

    .kv-page-title__heading {
        font-size: clamp(2rem, 10vw, 2.8rem);
        line-height: 1.15;
    }

    .kv-page-title__subtitle {
        margin-top: 0.75rem;
        padding: 0 0.25rem;
        font-size: 1rem;
        line-height: 1.55;
    }
}

/* KartVizit shared presentation for standalone dynamic pages. */
.kv-page-surface {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: #f4f0e7 !important;
}

.kv-page-surface::before,
.kv-page-surface::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 34rem;
    height: 18rem;
    border: 2px solid rgba(198, 169, 89, 0.13);
    border-radius: 50%;
    pointer-events: none;
    box-shadow:
        0 0 0 34px rgba(198, 169, 89, 0.065),
        0 0 0 68px rgba(198, 169, 89, 0.035);
}

.kv-page-surface::before {
    top: -8rem;
    left: -12rem;
    transform: rotate(-13deg);
}

.kv-page-surface::after {
    right: -13rem;
    bottom: -9rem;
    transform: rotate(14deg);
}

.kv-page-surface > * {
    position: relative;
    z-index: 1;
}

/* Standalone Features page: same visual language as homepage, with lighter lines. */
#features.kv-home-features {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: #181713 !important;
}

#features.kv-home-features::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    opacity: 0.34;
    background:
        radial-gradient(circle at 88% 8%, rgba(198, 169, 89, 0.19), transparent 20rem),
        radial-gradient(circle at 8% 92%, rgba(198, 169, 89, 0.12), transparent 22rem);
}

#features.kv-home-features::after {
    content: "";
    position: absolute;
    inset: -7rem;
    z-index: -1;
    pointer-events: none;
    opacity: 0.10;
    background-image:
        repeating-radial-gradient(ellipse at 4% 0%, transparent 0 24px, rgba(198, 169, 89, 0.72) 25px 26px, transparent 27px 48px),
        repeating-radial-gradient(ellipse at 98% 98%, transparent 0 30px, rgba(198, 169, 89, 0.58) 31px 32px, transparent 33px 58px);
    transform: rotate(-4deg);
}

#features.kv-home-features .kv-feature-card {
    display: flex;
    flex-direction: column;
    min-height: 25rem;
    border-color: rgba(255,255,255,.72) !important;
    box-shadow: 0 18px 45px rgba(0,0,0,.24);
}

#features.kv-home-features .kv-feature-title {
    color: #181713 !important;
    font-size: 24.5px;
    line-height: 1.2;
}

#features.kv-home-features .kv-feature-description,
#features.kv-home-features .kv-feature-description * {
    color: #181713 !important;
}

/* Do not stretch unopened pricing cards when another card is expanded. */
#pricing .kv-pricing-grid {
    align-items: start !important;
}

#pricing .kv-plan {
    height: auto;
    align-self: start;
}

/* Tasks 7-10: vCard templates title and mobile navigation refinements. */
.kv-vcard-template-title {
    display: flex;
    align-items: center;
    min-height: 300px;
    padding-top: 8.5rem;
    padding-bottom: 5.25rem;
    background: #e3dbc4 !important;
}

/* Mobile navigation cards: white surface with black text. */
@media (max-width: 1023px) {
    nav [x-show="mobileMenuOpen"] > div {
        background: #ffffff !important;
    }

    nav [x-show="mobileMenuOpen"] a,
    nav [x-show="mobileMenuOpen"] button,
    nav [x-show="mobileMenuOpen"] .dropdown-toggle {
        background: #ffffff !important;
        color: #181713 !important;
        border-color: #e6e0d2 !important;
    }

    nav [x-show="mobileMenuOpen"] a:hover,
    nav [x-show="mobileMenuOpen"] a:focus,
    nav [x-show="mobileMenuOpen"] button:hover,
    nav [x-show="mobileMenuOpen"] button:focus,
    nav [x-show="mobileMenuOpen"] .dropdown-toggle:hover,
    nav [x-show="mobileMenuOpen"] .dropdown-toggle:focus {
        background: #f4f0e7 !important;
        color: #181713 !important;
    }

    .kv-vcard-template-title {
        min-height: 230px;
        padding-top: 7rem;
        padding-bottom: 3.75rem;
    }
}
