/*
 * MiraeLaw Home — FAQ section
 *
 * The accordion itself is the existing, reusable [miraelaw_faq] shortcode,
 * styled by the shared faq.css (same rules as Contact/Practice
 * Areas/Offices). This file supplies only what's specific to the Homepage's
 * two-column heading+list layout — the fluid section padding Elementor's
 * controls can't express, the H2 typography (same pattern as
 * .ml-offices-h2/.ml-areas-h2), and the flex-basis split matching the
 * source design's own `flex: 1 1 260px` / `flex: 2 1 480px` — so it never
 * affects any other placement of the shortcode.
 */

.ml-home-faq-root {
	/* Confirmed against Home-2.html's computed section background
	   (rgb(247,244,238)) — exact match to --ml-background. */
	background: var( --ml-background );
}

.ml-home-faq-inner {
	max-width: var( --ml-container-width );
	margin: 0 auto;
	/* Same local fluid padding already used by Our Offices/Testimonials/Team
	   grid sections (56px–88px) — not a new one-off. */
	padding: clamp( 3.5rem, 8vw, 5.5rem ) 24px;
}

.ml-home-faq-heading {
	flex: 1 1 260px;
}

.ml-home-faq-heading .elementor-heading-title {
	margin: 0;
	font-family: var( --ml-font-heading );
	font-size: var( --ml-text-h2 );
	font-weight: 600;
	line-height: var( --ml-leading-h2 );
	color: var( --ml-primary );
}

.ml-home-faq-list {
	flex: 2 1 480px;
	min-width: 0;
}
