/* =====================================================================
   Services page (page-templates/services.php). Values transcribed from
   src/pages/Services.jsx. Shared classes live in assets/css/m2.css.
   ===================================================================== */

/* ---------- catalog cards ---------- */
.m2-services-card { padding: 32px 30px; display: flex; flex-direction: column; gap: 16px; }
.m2-services-card__head { display: flex; align-items: center; justify-content: space-between; }
.m2-services-card__head .m2-diamond { margin: 4px; }
.m2-services-card__num { font-family: Montserrat, system-ui, sans-serif; font-weight: 700; font-size: 12px; letter-spacing: .08em; color: #94a3b8; }
.m2-services-card__title { margin: 0; font-family: Montserrat, system-ui, sans-serif; font-weight: 700; font-size: 22px; line-height: 1.25; color: #020617; }
.m2-services-card__title a { color: inherit; text-decoration: none; }
.m2-services-card__body { margin: 0; font-size: 15.5px; line-height: 1.65; color: #475569; text-wrap: pretty; }
/* "Learn more" is the one intentional addition (detail pages exist in WordPress); it sits at the card foot. */
.m2-services-card__more { margin-top: auto; }

/* ---------- FAQ ---------- */
.m2-faq__note { margin: 0; font-size: 16px; line-height: 1.6; color: #64748b; }
.m2-faq__note a { font-weight: 600; }
.m2-faq__list { display: flex; flex-direction: column; gap: 2px; background: #e2e8f0; border: 1px solid #e2e8f0; border-radius: 12px; overflow: hidden; }
.m2-faq__item { background: #fff; }
.m2-faq__q { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 20px; text-align: left; background: none; border: 0; cursor: pointer; padding: 22px 26px; font-family: Montserrat, system-ui, sans-serif; font-weight: 600; font-size: 17px; color: #020617; min-height: 44px; }
.m2-faq__q:hover { color: #004aad; }
.m2-faq__icon { flex: none; width: 28px; height: 28px; border-radius: 50%; border: 1px solid #cbd5e1; display: grid; place-items: center; font-size: 18px; line-height: 1; color: #004aad; transform: none; transition: transform .2s; }
.m2-faq__item.is-open .m2-faq__icon { transform: rotate(45deg); }
.m2-faq__a { display: none; margin: 0; padding: 0 26px 24px; font-size: 15.5px; line-height: 1.7; color: #475569; max-width: 760px; text-wrap: pretty; }
.m2-faq__item.is-open .m2-faq__a { display: block; animation: m2fade .2s ease; }
.m2-faq__a > * { margin: 0 0 12px; }
.m2-faq__a > *:last-child { margin-bottom: 0; }