/*
Theme Name: Maryville Pool
Theme URI: https://maryvillepool.com/
Description: Custom block theme for Maryville Pool and Spa Care, LLC.
Version: 1.0.1
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: maryville-pool
*/

/* Wordmark */
.mp-wordmark { display: flex; align-items: center; gap: 0.6rem; text-decoration: none; color: var(--wp--preset--color--lake-deep); }
.mp-wordmark:hover { color: var(--wp--preset--color--lake-deep); }
.mp-wordmark svg { flex: none; width: 40px; height: 40px; }
.mp-wordmark__text { display: flex; flex-direction: column; line-height: 1.05; }
.mp-wordmark__name { font-family: var(--wp--preset--font-family--serif); font-weight: 700; font-size: 1.35rem; letter-spacing: -0.01em; }
.mp-wordmark__sub { font-family: var(--wp--preset--font-family--sans); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--teal); margin-top: 0.2rem; }
.mp-footer .mp-wordmark, .mp-footer .mp-wordmark:hover { color: var(--wp--preset--color--white); }
.mp-footer .mp-wordmark__sub { color: #8FD3D5; }

/* Header */
.mp-header { border-bottom: 1px solid var(--wp--preset--color--sand); position: sticky; top: 0; z-index: 50; }
.admin-bar .mp-header { top: 32px; }
.mp-header-phone a { font-weight: 700; text-decoration: none; color: var(--wp--preset--color--lake-deep); white-space: nowrap; }
.mp-header .wp-block-navigation a { text-decoration: none; }
.mp-header .wp-block-navigation a:hover { color: var(--wp--preset--color--teal); }
.mp-nav-cta a { background: var(--wp--preset--color--lake); color: #fff !important; padding: 0.5rem 1rem; border-radius: 6px; }
.mp-nav-cta a:hover { background: var(--wp--preset--color--lake-deep); }

/* Sections */
.mp-hero { min-height: min(78vh, 640px) !important; }
.mp-hero h1, .mp-hero p { color: #fff; text-shadow: 0 1px 12px rgba(0,0,0,0.35); }
.mp-hero .wp-block-button.is-style-outline .wp-block-button__link { color: #fff; border-color: #fff; background: transparent; }
.mp-hero .wp-block-button.is-style-outline .wp-block-button__link:hover { background: #fff; color: var(--wp--preset--color--lake-deep); }
.mp-eyebrow { font-size: 0.8rem !important; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--teal); margin-bottom: 0.25rem !important; }
.mp-card { background: #fff; border: 1px solid var(--wp--preset--color--sand); border-radius: 8px; padding: 1.5rem; height: 100%; }
.mp-card h3 { margin-top: 0; }
.mp-card p:last-child { margin-bottom: 0; }
.mp-cards > .wp-block-column { display: flex; flex-direction: column; }
.mp-towns { columns: 2; padding-left: 1.1rem; }
@media (min-width: 700px) { .mp-towns { columns: 3; } }
.mp-checklist { list-style: none; padding-left: 0; }
.mp-checklist li { padding-left: 1.6rem; position: relative; margin-bottom: 0.4rem; }
.mp-checklist li::before { content: ""; position: absolute; left: 0; top: 0.55em; width: 0.7rem; height: 0.4rem; border-left: 2px solid var(--wp--preset--color--teal); border-bottom: 2px solid var(--wp--preset--color--teal); transform: rotate(-45deg); }
.mp-ridge { display: block; width: 100%; height: 40px; color: var(--wp--preset--color--lake-deep); }
.mp-dark h2, .mp-dark h3, .mp-dark p, .mp-dark li { color: #fff; }
.mp-dark a { color: #fff; }

/* Footer */
.mp-footer a { color: #fff; }
.mp-footer a:hover { color: #8FD3D5; }
.mp-footer .mp-footer-links { list-style: none; padding: 0; margin: 0; }
.mp-footer .mp-footer-links li { margin-bottom: 0.35rem; }

/* Mobile call bar */
.mp-callbar { display: none; }
@media (max-width: 781px) {
	.mp-header-phone { display: none; }
	.mp-callbar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; gap: 1px; background: var(--wp--preset--color--sand); box-shadow: 0 -2px 10px rgba(0,0,0,0.12); }
	.mp-callbar a { flex: 1; text-align: center; padding: 0.85rem 0.5rem; font-weight: 700; text-decoration: none; }
	.mp-callbar .mp-callbar__call { background: var(--wp--preset--color--amber); color: var(--wp--preset--color--ink); }
	.mp-callbar .mp-callbar__msg { background: var(--wp--preset--color--lake); color: #fff; }
	body { padding-bottom: 52px; }
}

/* Payment forms (Gravity Forms). The contact form uses Forminator's Material style. */
.gform_wrapper input:not([type=submit]):not([type=checkbox]):not([type=radio]), .gform_wrapper select, .gform_wrapper textarea {
	border: 1px solid #C9BFAE !important; border-radius: 6px !important; background: #fff !important; padding: 0.65rem 0.75rem !important; font-size: 1rem !important;
}
.gform_wrapper input[type=submit], .gform_wrapper .gform_button {
	background: var(--wp--preset--color--amber) !important; color: var(--wp--preset--color--ink) !important; border: 0 !important; border-radius: 6px !important; padding: 0.8rem 1.6rem !important; font-weight: 700 !important; font-size: 1rem !important; cursor: pointer;
}
.gform_wrapper input[type=submit]:hover { background: var(--wp--preset--color--lake-deep) !important; color: #fff !important; }
.mp-form-panel { background: #fff; border: 1px solid var(--wp--preset--color--sand); border-radius: 8px; padding: clamp(1.25rem, 3vw, 2rem); }

/* Long-form pages */
.mp-prose h2 { margin-top: 2.25rem; }
.mp-prose h3 { margin-top: 1.75rem; }
.mp-hero h1 { max-width: 18ch; }
.mp-hero .wp-block-cover__inner-container > h1, .mp-hero .wp-block-cover__inner-container > .mp-hero-lead { margin-left: max(0px, calc((100% - 1140px) / 2)) !important; }
.mp-hero .mp-hero-lead { font-size: clamp(1.05rem, 1.6vw, 1.25rem); max-width: 40rem; }
.mp-footer .mp-footer-links a { text-decoration: none; }
.mp-footer .mp-footer-links a:hover { text-decoration: underline; }

/* Contact form (Forminator Material): keep the theme's button */
.forminator-ui .forminator-button-submit { background: var(--wp--preset--color--amber) !important; color: var(--wp--preset--color--ink) !important; border: 0 !important; border-radius: 6px !important; padding: 0.8rem 1.6rem !important; font-weight: 700 !important; font-size: 1rem !important; font-family: var(--wp--preset--font-family--sans) !important; box-shadow: none !important; }
.forminator-ui .forminator-button-submit:hover { background: var(--wp--preset--color--lake-deep) !important; color: #fff !important; }