/*
Theme Name: H2COA
Theme URI: https://h2coa.org/
Description: Block theme for the Hydrogen Car Owners Association site. Recreates the look of the original GoDaddy Website Builder site (cyan accent, Fredoka One headings, Cabin body text, Lato navigation) in a form that can be edited in the WordPress Site Editor.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: h2coa
*/

/* ---------- page rhythm ---------- */
.wp-site-blocks > * + * { margin-block-start: 0; }
.h2-main { padding-top: 0; padding-bottom: 0; }
.h2-main > .wp-block-post-content > * + .alignfull,
.h2-main > .wp-block-post-content > .alignfull + * { margin-block-start: 0; }
.h2-section { padding-top: 56px; padding-bottom: 56px; }
.h2-section > :first-child { margin-top: 0; }
.h2-single { padding-top: 40px; padding-bottom: 56px; }

/* ---------- header and navigation ---------- */
.h2-site-header { padding-top: 14px; padding-bottom: 14px; position: relative; z-index: 20; }
.h2-main-nav .wp-block-navigation-item__content { color: #1b1b1b; text-decoration: none; }
.h2-main-nav .wp-block-navigation-item__content:hover,
.h2-main-nav .current-menu-item > .wp-block-navigation-item__content,
.h2-main-nav [aria-current="page"] { color: var(--wp--preset--color--accent-dark); }
.h2-main-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container {
	background: #fff; border: 0 !important; box-shadow: 0 3px 12px rgba(0,0,0,.15);
	padding: 8px 0; min-width: 260px !important; text-transform: none; letter-spacing: normal; font-size: 15px;
}
.h2-main-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: 10px 20px; }
.h2-main-nav .is-menu-open .wp-block-navigation__submenu-container { text-transform: none; letter-spacing: normal; font-size: 16px; }

/* ---------- home logo hero ---------- */
.h2-hero-logo { margin: 28px auto 8px !important; max-width: 730px; }
.h2-hero-logo img { width: 100%; height: auto; }

/* ---------- headings ---------- */
.is-style-section-title {
	font-family: var(--wp--preset--font-family--ui) !important; font-weight: 700 !important; text-transform: uppercase;
	letter-spacing: .071em; font-size: 22px !important; line-height: 1.3;
	border-bottom: 1px solid #8a8a8a; padding-bottom: 24px; margin-bottom: 40px;
}
.is-style-section-banner {
	font-family: var(--wp--preset--font-family--ui) !important; font-weight: 700 !important; text-transform: uppercase;
	letter-spacing: .1em; font-size: 16px !important; line-height: 1.3; max-width: 720px; margin-left: auto !important; margin-right: auto !important;
}
.is-style-card-title {
	font-family: var(--wp--preset--font-family--ui) !important; font-weight: 400 !important; text-transform: uppercase;
	font-size: 22px !important; letter-spacing: normal;
}
.has-contrast-background-color :where(h1, h2, h3, h4, h5, h6, p, li, figcaption) { color: #fff; }
.has-contrast-background-color .is-style-section-title { border-bottom-color: #555; }
.has-contrast-background-color a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--accent); }
.has-accent-background-color :where(h1, h2, h3, h4, h5, h6) { color: var(--wp--preset--color--contrast); }
.has-accent-background-color { color: #1b1b1b; }
.has-accent-background-color .wp-element-button,
.has-accent-background-color .wp-block-button__link { background: var(--wp--preset--color--contrast); color: #fff; }

/* ---------- images ---------- */
.wp-block-image.is-style-rounded img { aspect-ratio: 1 / 1; object-fit: cover; width: 340px; max-width: 100%; }
.wp-block-columns .wp-block-image img { width: 100%; height: auto; }
.wp-block-gallery figcaption.wp-element-caption { font-size: 14px; }

/* ---------- PDF viewer ---------- */
.wp-block-file .wp-block-file__embed { height: 85vh !important; min-height: 520px; border: 4px solid #f2f2f2; margin-bottom: 16px; }
.wp-block-file { font-family: var(--wp--preset--font-family--ui); }

/* ---------- trip blog ---------- */
.h2-blog-banner { min-height: 280px; }
.h2-blog-banner .is-style-section-banner { color: #fff; font-size: 28px !important; }
.wp-block-post-template .wp-block-post-title a { text-decoration: none; color: var(--wp--preset--color--contrast); }
.h2-back-link { font-family: var(--wp--preset--font-family--ui); font-size: 14px; text-transform: uppercase; letter-spacing: .1em; }
.h2-back-link a { text-decoration: none; }

/* ---------- forms (H2COA Site Tools plugin) ---------- */
.h2coa-form { display: grid; gap: 20px; }
.h2coa-form p { margin: 0; }
.h2coa-form input[type=text], .h2coa-form input[type=email], .h2coa-form textarea {
	width: 100%; box-sizing: border-box; padding: 16px; border: 1px solid #d6d6d6; border-radius: 0;
	font: inherit; font-family: var(--wp--preset--font-family--ui); font-size: 16px; background: #fff; color: #1b1b1b;
}
.h2coa-form textarea { min-height: 140px; }
.h2coa-form label { font-family: var(--wp--preset--font-family--ui); font-size: 14px; color: #1b1b1b; display: block; margin-bottom: 6px; }
.h2coa-form button { width: 100%; cursor: pointer; border: 0; }
.h2coa-form--subscribe { grid-template-columns: 1fr auto; max-width: 640px; margin: 0 auto; align-items: end; }
.h2coa-form--subscribe button { width: auto; }
.h2coa-form .h2coa-hp { position: absolute; left: -9999px; }
.h2coa-notice { padding: 14px 18px; background: #e8fbfa; border-left: 4px solid var(--wp--preset--color--accent-dark); color: #1b1b1b; }
.h2coa-notice--error { background: #fdecec; border-left-color: #c0392b; }
.h2coa-donate { text-align: center; }

/* ---------- footer ---------- */
.h2-site-footer { padding-top: 48px; padding-bottom: 48px; font-family: var(--wp--preset--font-family--ui); font-size: 15px; }
.h2-site-footer p { margin: 0; }

@media (max-width: 781px) {
	.h2-section { padding-top: 40px; padding-bottom: 40px; }
	.h2coa-form--subscribe { grid-template-columns: 1fr; }
	.h2coa-form--subscribe button { width: 100%; }
}