/* =============================================================================
   SITE OVERRIDES — overrides.css
   Loaded on all frontend pages. Highest-specificity last.
   ============================================================================= */


/* -----------------------------------------------------------------------------
   Layout utilities
   ----------------------------------------------------------------------------- */

#announce .alignwide {
    max-width: unset;
}

.hsfc-Step .hsfc-Step__Content {
    padding: 1rem 0 0 !important;
}

.hs-form-frame {
    width: 100%;
    max-width: 400px;
}


/* -----------------------------------------------------------------------------
   Header
   ----------------------------------------------------------------------------- */

header .wp-block-buttons .wp-block-button__link {
    padding: 10px !important;
}

header {
    position: sticky;
    top: 0;
    z-index: 2;
}


/* -----------------------------------------------------------------------------
   Navigation
   ----------------------------------------------------------------------------- */

.active a {
    color: var(--wp--preset--color--accent-2) !important;
}

.parent.hidden {
    display: none;
}

.sticky-nav {
    position: sticky;
    top: 135px;
    z-index: 1;
}


/* -----------------------------------------------------------------------------
   MailChimp embed
   ----------------------------------------------------------------------------- */

div#mc_embed_signup_scroll {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    gap: 0.5rem;
    width: 100%;
}

div#mc_embed_signup,
#mc_embed_shell form,
.mc-field-group {
    width: 100%;
}

#mc_embed_shell {
    margin-top: 2rem;
    width: 100%;
    display: flex;
}

#mc_embed_signup .indicates-required {
    display: none;
}

input#mce-EMAIL {
    height: 50px;
    border-radius: 10px;
    border: 0;
    width: 100%;
    padding: 0 1rem;
    box-sizing: border-box;
}

label[for="mce-EMAIL"] {
    font-size: 14px;
    padding-bottom: 0.75rem;
    display: inline-block;
}

input#mce-FNAME {
    height: 50px;
    border-radius: 10px;
    border: 0;
    width: 100%;
    padding: 0 1rem;
    box-sizing: border-box;
}

label[for="mce-FNAME"] {
    font-size: 14px;
    padding-bottom: 0.75rem;
    display: inline-block;
}

input#mc-embedded-subscribe {
    background: var(--wp--preset--color--accent-2) !important;
    border: 0;
    height: 52px;
    border-radius: 10px;
    color: white;
    padding: 0 30px;
    font-size: 16px;
}


/* -----------------------------------------------------------------------------
   Philosophy blocks
   ----------------------------------------------------------------------------- */

.philosophy-block {
    background-size: cover;
    min-height: 50vh;
    border-radius: 30px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    padding: 2.5rem !important;
    color: white;
}

.philosophy-1 {
    background-image: url('https://www.ultrawellnesscenter.com/wp-content/uploads/2024/10/Imbalance-in-the-Bodys-System.jpg');
}

.philosophy-2 {
    background-image: url('https://www.ultrawellnesscenter.com/wp-content/uploads/2024/10/Continuum-of-Health-and-Illness.jpg');
}

.philosophy-3 {
    background-image: url('https://www.ultrawellnesscenter.com/wp-content/uploads/2024/10/Identifying-Improving-Dysfunctions.jpg');
}


/* -----------------------------------------------------------------------------
   Utility classes
   ----------------------------------------------------------------------------- */

.has-border-radius {
    border-radius: 2rem;
}

.mini-padding {
    padding: 0.5rem 0 !important;
}

.circle {
    border-radius: 100%;
    overflow: hidden;
}

.w-100 {
    width: 100%;
}

.no-padding {
    padding: 0;
}

.rounded,
.rounded img,
.rounded figure,
.rounded video {
    border-radius: 20px;
}

.text-left {
    text-align: left;
}


/* -----------------------------------------------------------------------------
   Block overrides
   ----------------------------------------------------------------------------- */

figure.wp-block-image.size-large {
    border-radius: 20px;
    overflow: hidden;
}

.h3 summary {
    font-size: 1.15rem;
}

.wp-block-embed-vimeo iframe {
    border-radius: 20px;
}

.wp-block-columns:not(.is-not-stacked-on-mobile).are-vertically-aligned-top > .wp-block-column {
    border-radius: 20px;
    overflow: hidden;
}

.wp-block-group .is-stacked-on-mobile img {
    border-radius: 20px;
    overflow: hidden;
}


/* -----------------------------------------------------------------------------
   Menu
   ----------------------------------------------------------------------------- */

/* .read-more spans are injected by JS — handled via overrides.js */


/* =============================================================================
   BREAKPOINTS
   ============================================================================= */

/* --- Desktop (≥749px) --- */
@media screen and (min-width: 749px) {
    .philosophy-block:not(:hover) p {
        display: none;
    }

    .h3 summary {
        font-size: 1.85rem;
    }

    .padding-left-desktop-none .wp-block-media-text__content {
        padding-left: 0;
    }

    .padding-right-desktop-none .wp-block-media-text__content {
        padding-right: 0;
    }

    .max-w-700-l { max-width: 750px; }
    .max-w-600-l { max-width: 600px; }
    .max-w-500-l { max-width: 500px; }
    .max-w-60-l  { max-width: 60% !important; }
    .max-w-70-l  { max-width: 70% !important; }
    .max-w-80-l  { max-width: 80% !important; }
    .max-w-90-l  { max-width: 90% !important; }
}

/* --- Mobile (<749px) — MailChimp stack --- */
@media screen and (max-width: 749px) {
    div#mc_embed_signup_scroll {
        flex-direction: column;
        align-items: stretch;
    }

    input#mce-EMAIL,
    input#mce-FNAME,
    input#mc-embedded-subscribe {
        width: 100% !important;
        max-width: 100%;
    }

    input#mc-embedded-subscribe {
        text-align: center;
    }
}

/* --- Mobile (<749px) — Layout + nav --- */
@media screen and (max-width: 749px) {
    #announce {
        display: none !important;
    }

    .mobile-hide,
    .hide-mobile,
    .wp-block-group.hide-mobile {
        display: none !important;
    }

    .notice figure,
    .mobile-padding br {
        display: none !important;
    }

    .wp-block-media-text.is-stacked-on-mobile > .wp-block-media-text__content {
        padding: 0;
    }

    header ul.wp-block-navigation__container.has-small-font-size.is-responsive.wp-block-navigation.has-small-font-size {
        gap: 1rem;
    }

    header .wp-block-navigation__responsive-container-content a {
        font-size: 1.3rem !important;
    }

    header .wp-block-navigation__responsive-container-content {
        padding: 2rem;
    }

    .exp-nav ul {
        flex-direction: column;
        gap: 1rem;
    }

    .exp-nav nav {
        margin: 0.5rem auto;
    }

    a.wp-block-button__link {
        padding: 1.5rem 2rem !important;
    }

    footer .is-layout-constrained > .alignwide,
    .sticky-nav .alignwide {
        padding: 0 !important;
    }

    .mobile-padding {
        padding: 1.5rem !important;
    }

    span.wp-block-navigation-item__label {
        white-space: nowrap;
    }

    :root {
        --wp--preset--font-size--xx-large: 2rem;
        --wp--preset--font-size--medium: 1rem;
    }

    footer .nav {
        flex-direction: column;
        align-items: flex-start;
    }

    nav.items-justified-space-between {
        overflow: scroll;
        max-width: 100vw;
    }

    ul.wp-block-navigation__container.items-justified-space-between.no-wrap.wp-block-navigation {
        gap: 1.5rem;
        padding: 1.5rem 1rem;
    }
}

/* --- Mobile (<767px) — Cover blocks --- */
@media (max-width: 767px) {
    .wp-block-cover {
        min-height: 400px !important;
    }

    .wp-block-spacer {
        height: 10px !important;
    }

    .wp-block-cover__inner-container {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }
}