/* ---------------------------------------------
   FONTS
--------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
@font-face {
    font-family: 'Averia Serif';
    src: url('../../fonts/AveriaSerif-Bold.woff2') format('woff2'),
        url('../../fonts/AveriaSerif-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Averia Serif';
    src: url('../../fonts/AveriaSerif-Light.woff2') format('woff2'),
        url('../../fonts/AveriaSerif-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Averia Serif';
    src: url('../../fonts/AveriaSerif-Regular.woff2') format('woff2'),
        url('../../fonts/AveriaSerif-Regular.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Albert Sans';
    src: url('../../fonts/AlbertSans-Regular.woff2') format('woff2'),
        url('../../fonts/AlbertSans-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


body {
    font-family: 'Albert Sans';
    background-color: #f5f5ef;
    color: #333;
    line-height: 1.7;
}

/* ---------------------------------------------
   COLOR PALETTE
--------------------------------------------- */
:root {
    --pz-sage: #f1e0c8;
    --pz-sage-dark: #9b6b4f;
    --pz-green: #a3a99a;
    --pz-green-dark: #a3a99a;
    --pz-beige: #e0e05d;
    --pz-text: #2f3728;
    --pz-muted: #2f3728;
}

/* ---------------------------------------------
   HEADINGS
--------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Averia Serif';
    color: var(--pz-text);
    font-weight: 700;
}

p {
    color: var(--pz-muted);
    font-weight: 400;
}

/* ---------------------------------------------
   BUTTONS (Pill style)
--------------------------------------------- */
.btn-success {
    background-color: var(--pz-green-dark);
    border-color: var(--pz-green-dark);
    padding: 0.65rem 1.8rem;
    border-radius: 8px;
    font-weight: 600;
    color: #000000;
    font-size: .8rem;
}

.btn-success:hover {
    background-color: var(--pz-green);
    border-color: var(--pz-green);
}

.btn-outline-success {
    border-color: var(--pz-green-dark);
    color: var(--pz-green-dark);
    padding: 0.6rem 1.6rem;
    border-radius: 50px;
    font-weight: 600;
}

.btn-outline-success:hover {
    background-color: var(--pz-green-dark);
    color: #fff;
}


/* ---------------------------------------------
   Section 2
--------------------------------------------- */
.d-flex.justify-content-center.gap-5 span {
    width: 33.3%;
}
.text-center.py-3.border-top.border-bottom span {
    font-size: 1.25rem;
}
.text-center.py-3.border-top.border-bottom {
    max-width: 1140px;
    margin: 0 auto;
}
/* ---------------------------------------------
   Section 4
--------------------------------------------- */
.section4 h5.fw-bold {
    line-height: 1.8;
}
/* ---------------------------------------------
   Section 5
--------------------------------------------- */

section.py-5.bg-white.section5 .col-md-6 {
    text-align: center;
}
section.py-5.bg-white.section5 h2.fw-bold {
    margin-bottom: 35px;
}
section.py-5.bg-white.section5 .col-md-6.content {
    padding: 50px;
}
/* ---------------------------------------------
   TOP LABEL NAV (Peace of Mind / etc.)
--------------------------------------------- */
.top-labels {
    background-color: #fff;
    padding: 16px 0;
    border-top: 1px solid #e8e8e0;
    border-bottom: 1px solid #e8e8e0;
}

.top-labels span {
    margin: 0 25px;
    font-weight: 500;
    color: var(--pz-muted);
}
.hero-top {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
    padding: 80px 0;
    min-height: 750px;
}
h1.fw-bold.mb-3 {
    margin-top: 60px;
    font-size: 3.5rem;
}

/* ---------------------------------------------
   LEAF PATTERN BACKGROUND (How it Works)
--------------------------------------------- */
.leaf-bg {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
    padding: 80px 0;
}
section.py-5.text-center.section6 {
    background-size: cover;
}
/* Optional slight overlay to soften pattern */
.leaf-bg::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.4);
    pointer-events: none;
}
/* ---------------------------------------------
   Why PelviZen Exists
--------------------------------------------- */
.section8 .align-items-center {
    align-items: normal !important;
}
/* ---------------------------------------------
   ICON BOXES
--------------------------------------------- */
.feature-box img {
    margin-bottom: 20px;
}

.feature-box h5 {
    font-weight: 700;
    margin-bottom: 10px;
}

.feature-box p {
    font-size: 15px;
}

/* ---------------------------------------------
   TESTIMONIALS
--------------------------------------------- */
.testimonial p {
    font-style: italic;
    color: #4c514c;
    font-size: 16px;
}
.ctn-btn {
    text-align: left;
}
.section7 .col-md-4.left-section {
    text-align: left;
    padding: 0;
}
.section7 .col-md-4 {
    padding: 40px;
}
/* ---------------------------------------------
   FOOTER
--------------------------------------------- */
footer.py-4.bg-dark.text-white.text-center ul {
    padding: 0;
    margin-top: 20px;
}

footer.py-4.bg-dark.text-white.text-center ul li {
    list-style: none;
    display: inline-block;
    padding: 6px;
}
.footer-right a {
    display: block;
    text-align: left;
}
footer p.mb-1 {
    margin-top: 35px;
}
footer.py-4.bg-dark.text-white.text-center ul li img {
    width: 45px;
}
footer {
    background-color: #2e3330;
    text-align: center;
    padding: 40px 0;
}

footer p,
footer a {
    color: #fff;
    opacity: 0.9;
}

footer a:hover {
    opacity: 1;
}

/* ---------------------------------------------
   MISC / UTILITY
--------------------------------------------- */
.rounded-soft {
    border-radius: 0px;
}
.rounded {
    border-radius: 0rem !important;
}
.row.g-5 {
    margin: 0px !important;
}
.h3 {
    font-size: 2rem;
}
.col-md-6 {
    margin: 0;
}
.col-md-4 {
    margin: 0;
}

/* ---------------------------------------------
   SECTION SPACING
--------------------------------------------- */
@media screen and (min-width: 481px){
    section.py-5.hero-top p.mb-4 {
        margin-bottom: 50px !important;
    }
    .text-center.py-3.border-top.border-bottom h5 {
        margin: 0;
    }
    section.py-5.bg-white.section3 {
        padding: 0 !important;
    }
    section.py-5.bg-white.section3 .col-md-6 {
        margin: 0;
    }
    section.py-5.bg-white.section3 .col-md-6.content-text {
        padding: 20px;
    }
    section.py-5.text-center.section4 {
        padding: 80px 0 !important;
    }
    section.py-5.text-center.section4 h3.fw-bold.mb-4 {
        margin-bottom: 50px !important;
    }
    section.py-5.bg-white .col-md-6 {
        margin: 0;
    }
    section.py-5.bg-white.section5 {
        padding: 0 !important;
    }
    section.py-5.text-center.section6 {
        padding: 150px 0 !important;
    }
    section.py-5.text-center.section6 h3.fw-bold.mb-4 {
        margin-bottom: 50px !important;
    }
    section.py-5.text-center.section6 .col-md-4 {
        padding: 20px 30px !important;
    }
    section.py-5.text-center.section6 .row.g-5 {
        margin-bottom: 50px;
    }
    section.py-5.bg-white.section7 {
        padding: 100px !important;
    }
    section.py-5.section8 {
        padding: 100px !important;
    }
    section {
        padding: 80px 0;
    }
    footer.py-4.bg-dark.text-white.text-center {
        padding-top: 80px !important;
    }
    section.py-5.bg-white.section-alex {
        padding: 80px 0 !important;
    }
    .section-alex img.img-fluid.rounded.shadow {
        margin-bottom: 35px;
    }
}

@media (max-width: 768px) {
    section {
        padding: 50px 0;
    }
}
@media (max-width: 480px) {
    section.py-5.bg-white.section8 a.btn.btn-success {
        margin-bottom: 20px;
    }
    section.py-5.section8 a.btn.btn-success {
    margin-bottom: 20px;
}
    footer a {
        text-align: center !important;
    }
    section.py-5.bg-white.section-alex .col-md-6.text-center {
        text-align: left !important;
        margin-bottom: 20px;
    }
    .d-flex.justify-content-center.gap-5 {
        display: inline-block !important;
    }
}