/* Renéra · FAQ — MOBILE reflow (phones + tablets)
   Layered after chrome.css + contact.css + faq.css when body.rn-m. The shared
   mobile header/footer come from mobile-header.css / mobile-footer.css; this file
   reproduces the FAQ Mobile.html breakpoints regardless of viewport width (UA-detected
   mobile can be wider than the CSS media breakpoints in faq.css). Structural rules use
   !important so they win over the desktop grid. Structure matches page-templates/faq.php. */

.rn-m { background: var(--renera-sand-300); }

/* Tighter gutters + phone section rhythm */
.rn-m .container { padding: 0 22px !important; }
.rn-m .faq-hero { padding: 40px 0 34px !important; }
.rn-m .faq-content { padding-top: 36px !important; }

/* Hero + help headings scale down */
.rn-m .faq-hero__title { font-size: 38px !important; line-height: 1.04 !important; }
.rn-m .faq-help-head .rn-h-2 { font-size: 34px !important; }

/* ---- FAQ SPLIT → single column, photo stacked above the questions ---- */
.rn-m .faq-split { grid-template-columns: 1fr !important; gap: 26px !important; }
.rn-m .faq-split__media { position: static !important; }
.rn-m .faq-split__figure { max-width: none !important; margin: 0 !important; }
.rn-m .faq-split__figure img { aspect-ratio: 16 / 10 !important; }

/* ---- Accordion rows tighten ---- */
.rn-m .faq-item__row { padding: 20px 2px !important; gap: 16px !important; }
.rn-m .faq-item__q { font-size: 19px !important; }
.rn-m .faq-item__chev { width: 28px !important; height: 28px !important; }
.rn-m .faq-item__body-inner { padding-right: 0 !important; }
.rn-m .faq-item__list li { grid-template-columns: 1fr !important; gap: 6px !important; padding: 14px 0 !important; }

/* ---- Help form → full-width single column ---- */
.rn-m .faq-help { max-width: none !important; }
.rn-m .faq-help-head { margin-bottom: 32px !important; }
.rn-m .faq-help .rn-form-card { max-width: none !important; }
.rn-m .faq-help .rn-form-card .wpforms-field-container { display: block !important; }
.rn-m .faq-help .rn-form-card .wpforms-field { margin: 0 0 24px !important; }
.rn-m .faq-help .rn-form-card button[type="submit"].wpforms-submit {
  width: 100% !important;
  justify-content: center !important;
}