/* ==========================================================================
   Legibility & accessibility improvements (loaded after style.css)
   Keeps the existing layout, colours and animations; improves reading comfort.
   ========================================================================== */

/* Slightly larger base text and more comfortable line spacing */
html { font-size: 100%; -webkit-text-size-adjust: 100%; }
body { font-size: 1.0625rem; line-height: 1.7; color: #2b2b2b; }
p, li { line-height: 1.7; }

/* Darker "muted" grey so secondary text meets WCAG AA contrast on white */
.text-muted { color: #555 !important; }
.faq-answer, .faq-answer p { color: #3d3d3d; font-size: 1rem; }
.feature-content p, .service-card-content p, .step-content p, .care-card p,
.service-details p, .content-card p, .feature-item p { color: #444; font-size: 1rem; }
.lead { font-size: 1.2rem; }

/* Minimum readable sizes for small UI text */
.dropdown-item { font-size: 0.975rem; }
.footer-purple, .footer-purple p, .footer-purple li, .footer-purple a { font-size: 0.975rem; }
.footer-purple .small { font-size: 0.875rem; opacity: 0.9; line-height: 1.6; }
small, .small { font-size: 0.9rem; }

/* Clear keyboard focus indicator */
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, .nav-link:focus-visible {
    outline: 3px solid #ffc107 !important;
    outline-offset: 2px;
}

/* Links inside body copy are visibly links */
.service-content p a, .content-block p a, .faq-answer a, .info-content a, .check-list a,
.content-block li a, .philosophy-card a, .unique-experience-card a {
    color: #6a2f86; text-decoration: underline; text-underline-offset: 2px; font-weight: 600;
}

/* Check list used in rewritten content */
.check-list li { display: flex; align-items: flex-start; margin-bottom: 0.6rem; }
.check-list li i { margin-top: 0.35rem; flex-shrink: 0; }

/* Sidebar group labels */
.services-sidebar .sidebar-subheading {
    font-size: 0.8rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
    color: #6a2f86; padding: 0.9rem 1.25rem 0.35rem;
}
.services-sidebar .sidebar-header h2 { margin: 0; color: inherit; font-size: 1.1rem; }

/* FAQ built with <details>/<summary> (works without JavaScript) */
details.faq-item > summary { list-style: none; }
details.faq-item > summary::-webkit-details-marker { display: none; }
details.faq-item[open] .faq-arrow i { transform: rotate(180deg); }
details.faq-item .faq-question-text h3 { font-size: 1.1rem; line-height: 1.4; }
details.faq-item .faq-answer { padding-top: 0.25rem; }
@media (max-width: 575px) {
    details.faq-item .faq-question { padding: 16px 18px; }
    details.faq-item .faq-answer { padding: 0 18px 18px 18px; }
}

/* Info cards used as blocks */
.info-card.d-block { padding: 1.5rem; border-radius: 16px; background: #fff; box-shadow: 0 4px 15px rgba(125,63,152,0.10); }

/* Headings: keep sizes readable on small screens */
@media (max-width: 575px) {
    .display-4 { font-size: 2.1rem; }
    .display-5 { font-size: 1.9rem; }
    .display-6 { font-size: 1.6rem; }
    .service-content.p-5 { padding: 1.5rem !important; }
}

/* Respect reduced-motion preferences (animations stay on for everyone else) */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
    [data-aos] { opacity: 1 !important; transform: none !important; }
}

/* Form privacy note */
.form-privacy-note { font-size: 0.9rem; color: #555; margin-top: 0.75rem; }
.form-privacy-note a { color: #6a2f86; text-decoration: underline; }

/* <details> FAQ: override the collapse styles used by the contact page FAQ */
details.faq-item .faq-answer p {
    visibility: visible; opacity: 1; height: auto; transform: none;
}
details.faq-item .faq-answer { color: #3d3d3d; }

/* Area highlight boxes wrap instead of overflowing on small screens */
.sydney-highlights { flex-wrap: wrap; gap: 0.75rem; }
.sydney-highlights .highlight-item { flex: 1 1 180px; min-width: 0; }
.sydney-highlights .highlight-text p { overflow-wrap: anywhere; }