/* ==========================================================================
   Feedback fixes (Sept 2026) – loaded last on every page.
   Calmer hero headline, opaque header, full-screen mobile menu, bigger NDIS
   badge, stronger text contrast, and a shorter home page on phones.
   ========================================================================== */

/* ---------- 1. Hero headline: whole word swaps on its own line ---------- */
.hero-rotating-title > span { display: block; }
.hero-rotating-title .rotating-word {
    color: var(--primary-purple, #7d3f98);
    font-weight: 700;
    min-height: 1.2em;               /* line never collapses, so nothing below moves */
    transition: opacity 0.4s ease;
}
.hero-rotating-title .rotating-word.is-changing { opacity: 0; }

/* ---------- 2. Header: always solid, never slides or fades ---------- */
#mainNavbar,
#mainNavbar.navbar-scrolled,
#mainNavbar.navbar-transparent {
    background-color: #ffffff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    position: sticky !important;
    top: 0;
    z-index: 1030;
}
#mainNavbar.is-scrolled { box-shadow: 0 2px 16px rgba(125, 63, 152, 0.12) !important; }

/* ---------- 3. Mobile menu: full screen, tidy, equal-width buttons ---------- */
@media (max-width: 991.98px) {
    body.nav-open { overflow: hidden; }

    #mainNavbar .navbar-collapse {
        position: fixed;
        top: var(--nav-h, 80px);
        left: 0;
        right: 0;
        height: calc(100vh - var(--nav-h, 80px)) !important;
        height: calc(100dvh - var(--nav-h, 80px)) !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 12px 20px 32px !important;
        background: #ffffff !important;
        backdrop-filter: none !important;
        border-top: 1px solid rgba(125, 63, 152, 0.12);
        border-radius: 0 !important;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        z-index: 1029;
    }
    #mainNavbar .navbar-collapse.collapsing { transition: none !important; }
    #mainNavbar .navbar-collapse:not(.show):not(.collapsing) { display: none !important; }

    #mainNavbar .navbar-nav { align-items: stretch !important; margin: 0 !important; width: 100%; }
    #mainNavbar .navbar-nav > .nav-item { width: 100%; margin: 0 !important; padding: 0 !important; }
    #mainNavbar .navbar-nav > .nav-item > .nav-link:not(.li-green) {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        min-height: 52px;
        padding: 12px 4px !important;
        font-size: 1.15rem !important;
        border-bottom: 1px solid rgba(125, 63, 152, 0.1);
    }

    /* The three action buttons: same width, same height, stacked */
    #mainNavbar .navbar-nav > .btn-refer { margin-top: 20px !important; }
    #mainNavbar .navbar-nav > .btn-refer > .nav-link,
    #mainNavbar .navbar-nav > .contact-phone > .nav-link {
        display: flex !important;
        align-items: center;
        justify-content: center !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: none !important;
        min-height: 52px;
        margin: 0 0 12px 0 !important;
        padding: 12px 16px !important;
        border-radius: 12px !important;
        border-bottom: 0 !important;
        font-size: 1.1rem !important;
        text-align: center;
    }

    /* Dropdowns open inside the panel instead of floating over it */
    #mainNavbar .dropdown-menu {
        position: static !important;
        transform: none !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 4px 0 8px !important;
        box-shadow: none !important;
        border: 0 !important;
        background: #faf6fc !important;
        animation: none !important;
    }
    #mainNavbar .dropdown-menu-large { padding: 8px !important; }
    #mainNavbar .dropdown-menu:not(.show) { display: none !important; }
}

/* ---------- 4. Registered NDIS Provider badge: readable size ---------- */
.hero-badge-main {
    display: block;
    width: 220px !important;
    max-width: 70% !important;
    height: auto;
    margin: 1.5rem 0 0 !important;
    opacity: 1 !important;
}
@media (max-width: 991.98px) {
    .hero-badge-main { margin: 1.5rem auto 0 !important; }
}

/* ---------- 5. Text contrast (WCAG AA) ---------- */
.care-values-section .lead,
.section-subtitle,
.hero-subtitle,
.info-box p,
.service-intro p,
.feature-right .text p,
.contact-subtitle,
.faq-section .section-subtitle { color: #3d3d4a !important; }
.text-muted { color: #4a4a55 !important; }

/* Green "Refer Now" buttons: darker green so the white text is readable */
.li-green,
.btn-refer .nav-link,
.refer-now-btn,
.btn-success {
    background: #3a7d1e !important;
    background-image: none !important;
    border-color: #3a7d1e !important;
    color: #ffffff !important;
}
.li-green:hover,
.btn-refer .nav-link:hover,
.refer-now-btn:hover,
.btn-success:hover { background: #2f6818 !important; border-color: #2f6818 !important; }

/* ---------- 6. Shorter home page on phones ---------- */
@media (max-width: 767.98px) {
    /* Three key facts in one row instead of three full-width cards */
    .feature-section .feature-left {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr);
        gap: 8px !important;
        padding: 0 12px !important;
        margin: 0 !important;
    }
    .feature-section .feature-icon {
        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 12px 6px !important;
        transform: none !important;
        align-self: stretch;
    }
    .feature-section .feature-icon img { width: 44px !important; height: 44px !important; margin-bottom: 6px !important; }
    .feature-section .feature-icon h4 { font-size: 0.95rem !important; margin: 0 0 2px !important; }
    .feature-section .feature-icon p { font-size: 0.78rem !important; line-height: 1.3 !important; margin: 0 !important; }

    /* Drop purely decorative images that repeat the badge/intro */
    .feature-section .feature-icon-large,
    .feature-section .bouncing-img,
    #about .image-container { display: none !important; }
    .feature-section .feature-right { padding: 24px 20px !important; margin: 16px 12px 0 !important; }

    /* Service and value cards: icon beside the heading, less padding */
    .services-overview .service-card {
        display: grid !important;
        grid-template-columns: 56px 1fr;
        align-items: start;
        text-align: left !important;
        gap: 12px !important;
        padding: 16px !important;
    }
    .services-overview .service-card .service-icon { width: 56px !important; height: 56px !important; margin: 0 !important; }
    .services-overview .service-card .service-icon img { width: 100% !important; height: 100% !important; object-fit: contain; }
    .services-overview .service-card .service-details { display: contents; }
    .services-overview .service-card h3 { font-size: 1.05rem !important; margin: 0 !important; align-self: center; }
    .services-overview .service-card p { grid-column: 1 / -1; font-size: 0.95rem !important; margin: 0 !important; }

    .care-values-section .lead { margin-bottom: 1.5rem !important; }
    .care-values-section .care-card { padding: 20px !important; min-height: 0 !important; }
    .care-values-section .care-icon { width: 48px !important; height: 48px !important; margin-bottom: 8px !important; }
    .care-values-section .care-features { display: none !important; }  /* repeats the paragraph above it */
}

/* Inline "Learn more" links inside service text stay on the same line */
.services-overview .service-details p a { display: inline !important; }

/* Values intro: normal-weight text (the thin 300 weight was hard to read) */
.care-values-section .lead { font-weight: 400 !important; }
@media (max-width: 767.98px) {
    .care-values-section .display-4 { font-size: 2rem !important; line-height: 1.2 !important; }
}

/* ---------- 7. Key facts + "You Come First" panel on laptops ----------
   Between ~992px and ~1600px the three fact cards (300px minimum each) left
   too little room, squeezing the text panel into a narrow column. Let the
   panel drop onto its own row whenever it can't have enough width. */
@media (min-width: 992px) {
    .feature-section {
        flex-wrap: wrap;
        gap: 30px;
    }
    .feature-section .feature-left {
        flex: 1 1 620px;
        max-width: 1100px;
    }
    .feature-section .feature-icon {
        flex: 1 1 0;
        min-width: 0 !important;
        padding: 40px 16px !important;
    }
    .feature-section .feature-right {
        flex: 1 1 760px;
        max-width: 1100px;
        margin-left: 0 !important;
        justify-content: center;
    }
    .feature-section .feature-right .text { flex: 1 1 auto; min-width: 280px; }
    .feature-section .feature-right img { flex: 0 0 auto; }
}

/* ---------- 8. "Our Promise" on laptops ----------
   Three columns (text / photo / text) left the "Why Choose" list about 200px
   wide on 1000–1400px screens. Drop the photo there so the two text cards
   share the width. */
@media (min-width: 992px) and (max-width: 1399.98px) {
    #about .content-container { display: flex; gap: 24px; padding: 0 2rem; width: 100%; align-items: stretch; }
    #about .content-container > .col-lg-4 { flex: 1 1 0; max-width: none; width: auto; }
    #about .content-container > .col-lg-4:nth-child(2) { display: none; }
    #about .content-card { height: 100%; }
}

/* ---------- 9. Enquiry form section on pages without responsive.css ----------
   (Day program centre pages.) Mirrors the home page's mobile form layout. */
@media (max-width: 991.98px) {
    .assistance-content { display: block !important; padding: 0 !important; margin: -30px 12px 30px !important; }
    .assistance-form { width: 100%; display: block; margin: 0 !important; padding: 20px; }
    .assistance-form .form-group { margin-bottom: 14px; }
    .contact-card { width: 100%; margin-top: 24px; }
    .assistance-header { padding: 48px 20px 70px !important; }
    .assistance-header h2 { font-size: 1.75rem !important; overflow-wrap: anywhere; }
}

/* ---------- 10. Final legibility pass ---------- */
/* "At Beyond Limits" lead-in above "You Come First": lime green failed contrast */
.feature-right .text h3 { color: #3a7d1e !important; }
/* Minimum 14px for small labels, tags, dates and the footer copyright */
.footer-copy, .footer-purple .footer-copy { font-size: 0.875rem !important; }
.modern-tag, .service-feature, .badge-subtitle, .referal-step-label, .blog-meta, .blog-meta span { font-size: 0.875rem !important; }
.blog-meta, .blog-meta span { color: #4a4a55 !important; }
@media (max-width: 767.98px) {
    .feature-section .feature-icon p { font-size: 0.875rem !important; }
}
