/*
Theme Name: Svea Mutual
Theme URI: https://sveamutual.com
Author: Ledger Marketing
Author URI: https://ledgermarketing.com
Description: Custom block theme for Svea Mutual Insurance Company of Orion, Illinois. Farm. Home. Svea. Est. 1865.
Version: 1.0.3
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: svea-mutual
*/

/* ==========================================================================
   1. Block-gap strips — kill body-background gaps between full-width bands
   ========================================================================== */
.wp-site-blocks > * { margin-block: 0; }
.wp-site-blocks main .alignfull { margin-block: 0; }
/* Block-gap INSIDE header/footer parts (topline + logo bar) */
.sveam-header > *, .sveam-footer > * { margin-block: 0 !important; }

/* ==========================================================================
   2. Header
   ========================================================================== */
.sveam-topline { font-size: 0.85rem; }
.sveam-topline a { color: #fff; text-decoration: none; }
.sveam-topline a:hover { color: #FFD500; }
.sveam-logo-bar { border-bottom: 3px solid #163683; }
.sveam-logo-bar .wp-block-site-logo img,
.sveam-logo-bar img.sveam-logo { height: 74px; width: auto; display: block; }
body .sveam-header nav.wp-block-navigation a {
	color: #102046;
	font-weight: 600;
	font-size: 1rem;
	text-decoration: none;
}
body .sveam-header nav.wp-block-navigation a:hover { color: #163683; text-decoration: underline; text-underline-offset: 5px; text-decoration-color: #FFD500; text-decoration-thickness: 3px; }

/* Pay button — always visible, even on mobile, never inside the hamburger */
.sveam-pay-btn a,
a.sveam-pay-btn {
	display: inline-block;
	background: #FFD500;
	color: #102046 !important;
	font-weight: 800;
	padding: 0.7rem 1.35rem;
	border-radius: 6px;
	text-decoration: none !important;
	white-space: nowrap;
	box-shadow: 0 1px 0 rgba(16,32,70,.25);
}
.sveam-pay-btn a:hover, a.sveam-pay-btn:hover { background: #102046; color: #FFD500 !important; }

/* ==========================================================================
   3. Mobile navigation overlay
   ========================================================================== */
body .wp-block-navigation__responsive-container.is-menu-open {
	background: #102046 !important;
	color: #fff;
	padding: 5rem 2rem 2rem;
}
body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	align-items: center;
}
body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: center !important;
	justify-content: flex-start !important;
}
body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	align-items: center;
	margin: 0.4rem 0;
}
/* Overlay link color must out-specify the desktop header rule */
body .sveam-header .wp-block-navigation__responsive-container.is-menu-open a {
	color: #fff !important;
	font-size: 1.35rem;
	font-weight: 700;
}
body .sveam-header .wp-block-navigation__responsive-container.is-menu-open a:hover { color: #FFD500 !important; }
body .wp-block-navigation__responsive-container-close,
body .wp-block-navigation__responsive-container-open {
	color: #102046;
}
body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close { color: #fff !important; }

/* ==========================================================================
   4. Hero + colored bands — force legible headings at every level
   ========================================================================== */
.sveam-hero :where(h1, h2, h3, h4, p, li) { color: #fff; }
.sveam-hero .sveam-eyebrow { color: #FFD500; }
.sveam-band-dark :where(h1, h2, h3, h4, p, li) { color: #fff; }
.sveam-band-dark a:not(.wp-block-button__link):not(.sveam-pay-btn) { color: #FFD500; }
.sveam-eyebrow {
	display: inline-block;
	font-family: "Figtree", sans-serif;
	font-weight: 800;
	font-size: 0.82rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #163683;
}
.sveam-band-dark .sveam-eyebrow, .sveam-hero .sveam-eyebrow { color: #FFD500; }
.sveam-eyebrow.has-text-align-center { display: block; }

/* White button on colored bands (CTA never same hue as its band) */
.sveam-btn-white a {
	background: #fff !important;
	color: #163683 !important;
}
.sveam-btn-white a:hover { background: #FFD500 !important; color: #102046 !important; }
/* Outline button for heroes */
.sveam-btn-outline a {
	background: transparent !important;
	color: #fff !important;
	border: 2px solid rgba(255,255,255,.8);
}
.sveam-btn-outline a:hover { background: #fff !important; color: #102046 !important; border-color: #fff; }

/* ==========================================================================
   5. Card grids — real CSS grid, never wp-block-columns for many items
   ========================================================================== */
.sveam-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 1.4rem;
}
.sveam-grid-wide { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.sveam-card {
	background: #fff;
	border: 1px solid #E3DECE;
	border-radius: 10px;
	padding: 1.5rem 1.5rem 1.35rem;
	box-shadow: 0 2px 10px rgba(16,32,70,.05);
}
.sveam-card h3 { margin: 0 0 0.35rem; font-size: 1.18rem; }
.sveam-card p { margin: 0.15rem 0; font-size: 0.97rem; overflow-wrap: anywhere; }
.sveam-card a { color: #163683; font-weight: 600; }
/* Equal-height photo cards inside core columns (few-item rows only) */
.wp-block-column:has(> .sveam-photo-card:only-child) { display: flex; }
.sveam-photo-card { flex: 1 1 auto; height: auto; background: #fff; border-radius: 10px; overflow: hidden; border: 1px solid #E3DECE; box-shadow: 0 2px 10px rgba(16,32,70,.06); }
.sveam-photo-card img { width: 100%; height: 220px; object-fit: cover; display: block; }
.sveam-photo-card .sveam-photo-card-body { padding: 1.25rem 1.4rem 1.5rem; }
.sveam-photo-card h3 { margin: 0 0 0.4rem; }
.sveam-photo-card p { margin: 0; font-size: 0.98rem; }

/* Coverage list chips */
.sveam-coverage-list { list-style: none; padding: 0; margin: 0.75rem 0 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 0.55rem 1.25rem; }
.sveam-coverage-list li {
	position: relative;
	padding: 0.55rem 0.9rem 0.55rem 2.3rem;
	background: #fff;
	border: 1px solid #E3DECE;
	border-radius: 8px;
	font-weight: 600;
	color: #102046;
	font-size: 0.98rem;
}
.sveam-coverage-list li::before {
	content: "";
	position: absolute;
	left: 0.8rem; top: 50%;
	width: 1rem; height: 1rem;
	transform: translateY(-50%);
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M36.8 6.4 19.2 34.6h9.9L24.6 57.6 44.8 26.9H33.9Z' fill='%23163683'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* Staff / board grids */
.sveam-people-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1.6rem 1.4rem; }
.sveam-person { text-align: center; }
.sveam-person img { width: 100%; max-width: 250px; height: auto; border-radius: 10px; }
.sveam-person img.sveam-person-square { aspect-ratio: 1; object-fit: cover; max-width: 210px; border-radius: 12px; border: 3px solid #163683; }
.sveam-person h3 { margin: 0.7rem 0 0.1rem; font-size: 1.08rem; }
.sveam-person p { margin: 0.1rem 0; font-size: 0.92rem; color: #4A5165; }
.sveam-person .sveam-role { color: #163683; font-weight: 700; }

/* ==========================================================================
   6. Agent directory
   ========================================================================== */
.sveam-agent-search {
	width: 100%;
	max-width: 520px;
	padding: 0.85rem 1.1rem;
	font-size: 1.05rem;
	font-family: inherit;
	border: 2px solid #163683;
	border-radius: 8px;
	background: #fff;
	color: #102046;
}
.sveam-agent-search:focus { outline: 3px solid #FFD500; outline-offset: 1px; }
.sveam-agent-count { font-size: 0.92rem; color: #4A5165; margin-top: 0.5rem; }
.sveam-agent-card h3 { font-size: 1.05rem; }
.sveam-agent-card .sveam-agent-city { color: #163683; font-weight: 700; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.05em; }

/* ==========================================================================
   7. Payment band + page
   ========================================================================== */
.sveam-payband { border-top: 6px solid #FFD500; }
.sveam-pay-lg a {
	font-size: 1.2rem;
	padding: 1.05rem 2.4rem;
	background: #FFD500 !important;
	color: #102046 !important;
	font-weight: 800;
	border-radius: 8px;
}
.sveam-pay-lg a:hover { background: #fff !important; color: #163683 !important; }

/* ==========================================================================
   8. Page-header bands, misc
   ========================================================================== */
.sveam-page-header { position: relative; }
.sveam-page-header h1 { color: #fff; margin: 0; }
.sveam-page-header p { color: #E8EDF8; }
.sveam-notice {
	background: #fff;
	border: 1px solid #E3DECE;
	border-left: 6px solid #FFD500;
	border-radius: 8px;
	padding: 1.4rem 1.6rem;
}
.sveam-notice h3 { margin-top: 0; }
blockquote.sveam-quote {
	border: 0;
	margin: 0;
	padding: 1.6rem 1.7rem;
	background: #fff;
	border-radius: 10px;
	border: 1px solid #E3DECE;
	box-shadow: 0 2px 10px rgba(16,32,70,.05);
	font-size: 1.02rem;
}
blockquote.sveam-quote::before {
	content: "\201C";
	display: block;
	font-family: "Fraunces", Georgia, serif;
	font-size: 2.6rem;
	line-height: 0.6;
	color: #FFD500;
	margin-bottom: 0.6rem;
}
blockquote.sveam-quote cite { display: block; margin-top: 0.8rem; font-style: normal; font-weight: 700; color: #163683; font-size: 0.9rem; }

/* Footer */
.sveam-footer { font-size: 0.95rem; }
.sveam-footer a { color: #fff; text-decoration: none; }
.sveam-footer a:hover { color: #FFD500; text-decoration: underline; }
.sveam-footer h3 { color: #fff; font-size: 1.05rem; margin-bottom: 0.6rem; }
.sveam-footer p { color: #C9D2E8; margin: 0.2rem 0; }
.sveam-footer .sveam-footer-logo img { height: 96px; width: auto; }
.sveam-footer-legal { border-top: 1px solid rgba(255,255,255,.14); font-size: 0.85rem; }
.sveam-footer-legal p, .sveam-footer-legal a { color: #9AA7C7; }
.sveam-footer-legal a:hover { color: #FFD500; }
.sveam-reinsurer-chip {
	display: inline-block;
	background: #fff;
	border-radius: 8px;
	padding: 0.55rem 1rem;
	color: #102046 !important;
	font-weight: 700;
	font-size: 0.85rem;
}

/* Tables (payment options etc.) */
.sveam-info-table { width: 100%; border-collapse: collapse; }
.sveam-info-table th, .sveam-info-table td { text-align: left; padding: 0.7rem 0.9rem; border-bottom: 1px solid #E3DECE; }
.sveam-info-table th { color: #102046; }

/* ==========================================================================
   9. Responsive
   ========================================================================== */
@media (max-width: 781px) {
	.sveam-logo-bar .wp-block-site-logo img,
	.sveam-logo-bar img.sveam-logo { height: 56px; }
	.sveam-pay-btn a, a.sveam-pay-btn { padding: 0.55rem 0.9rem; font-size: 0.9rem; }
	.sveam-topline { font-size: 0.78rem; }
	.sveam-hide-mobile { display: none !important; }
}
@media (max-width: 480px) {
	.sveam-logo-bar .wp-block-site-logo img,
	.sveam-logo-bar img.sveam-logo { height: 48px; }
}

/* Accessibility */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px; width: 1px;
	overflow: hidden;
	position: absolute !important;
	word-wrap: normal !important;
}
a:focus-visible, button:focus-visible { outline: 3px solid #FFD500; outline-offset: 2px; }