/* =====================================================================
   Rateseeker — WordPress-specific structural extras.
   The ported design system lives in main.css and is untouched. This file
   only bridges differences caused by rendering server-side in WordPress
   (e.g. the source conditionally rendered mobile sub-panels in React;
   WordPress prints them all and toggles via a class).
   ===================================================================== */

/* Mobile nav sub-panels: hidden until their item is opened. */
.nav-mobile .m-panel { display: none; }
.nav-mobile .m-item.is-open .m-panel { display: flex; }

/* WP admin bar shouldn't cover the fixed header. */
body.admin-bar .nav { top: 32px; }
@media (max-width: 782px) {
	body.admin-bar .nav { top: 46px; }
}

/* WYSIWYG body content (Knowledge Hub article fallback / page content). */
.rs-richtext > * + * { margin-top: 1.1em; }
.rs-richtext h2 { margin-top: 1.6em; }
.rs-richtext h3 { margin-top: 1.4em; }
.rs-richtext ul, .rs-richtext ol { padding-left: 1.2em; }
.rs-richtext li + li { margin-top: .4em; }
.rs-richtext a { color: var(--green); text-decoration: underline; }

/* Contact Form 7 — match the design's submit button + spacing. */
.contact-form-card .rs-submit,
.contact-form-card input[type="submit"] { width: 100%; margin-top: 14px; }
.contact-form-card .wpcf7-form .form-row:last-of-type { margin-bottom: 0; }
/* CF7 wraps controls in inline spans — make them block so fields fill their cell
   (this is what makes the full-width "Your message" textarea span both columns). */
.contact-form-card .wpcf7-form-control-wrap { display: block; width: 100%; }
.contact-form-card .form-field input,
.contact-form-card .form-field textarea,
.contact-form-card .form-field select { width: 100%; box-sizing: border-box; }
.contact-form-card .form-field.full { grid-column: 1 / -1; }
.wpcf7-not-valid-tip { color: #c0392b; font-size: 12px; margin-top: 6px; display: block; }
.wpcf7 form .wpcf7-response-output { border-radius: 12px; margin: 18px 0 0; padding: 12px 18px; font-size: 14px; }
.wpcf7-spinner { margin: 0 0 0 10px; }

/* Footer newsletter rendered via Contact Form 7 — keep the inline pill layout. */
.newsletter .wpcf7-form { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 0; }
.newsletter .wpcf7-form .wpcf7-form-control-wrap { display: block; }
.newsletter .wpcf7-form input[type="email"] {
	background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.2);
	color: var(--white); padding: 16px 22px; border-radius: var(--radius-pill);
	font-family: var(--font-body); font-size: 15px; width: 320px; max-width: 100%;
}
.newsletter .wpcf7-form input[type="email"]::placeholder { color: rgba(255,255,255,0.5); }
.newsletter .wpcf7-form input[type="email"]:focus { outline: 2px solid var(--lime); }
.newsletter .wpcf7-form .btn { background: var(--lime); color: var(--forest); }
.newsletter .wpcf7-form .btn:hover { background: var(--green); }
@media (max-width: 600px) {
	.newsletter .wpcf7-form { width: 100%; flex-direction: column; align-items: stretch; }
	.newsletter .wpcf7-form input[type="email"] { width: 100%; }
}

/* Knowledge Hub article body typography (mirrors the source single-article styles). */
.rs-article > p { font-size: 18px; line-height: 1.7; margin: 0 0 22px; color: rgba(51,90,81,.86); }
.rs-article > h2 { font-family: var(--font-display); font-size: 27px; font-weight: 500; line-height: 1.25; color: var(--forest); margin: 44px 0 14px; }
.rs-article > h3 { font-family: var(--font-display); font-size: 20px; font-weight: 500; color: var(--forest); margin: 28px 0 10px; }
.rs-article > ul, .rs-article > ol { font-size: 18px; line-height: 1.7; margin: 0 0 22px; padding-left: 24px; color: rgba(51,90,81,.86); }
.rs-article > ul > li, .rs-article > ol > li { margin-bottom: 8px; }
