/*
Theme Name: bygreg
Theme URI: https://lionheartpeds.com
Author: Greg
Author URI: https://lionheartpeds.com
Description: Custom classic WordPress theme for Lionheart Pediatrics, a Direct Primary Care pediatric practice in North Austin, Texas. Warm, approachable design built with native WordPress blocks, custom post types, and ACF fields.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bygreg
*/

/* =====================================================
   DESIGN TOKENS
   ===================================================== */
:root{
	--color-primary: #1F4069;      /* deep navy (Beth's palette) */
	--color-primary-dark: #17304F;
	--color-brand: #2251A8;        /* Lionheart blue, the logo wordmark */
	--color-secondary: #D29D54;    /* lion gold */
	--color-secondary-light: #E9BA7A;
	--color-accent: #66807A;       /* sage #789089, a step darker so small text stays readable */
	--color-bg: #FBF2E9;           /* warm cream */
	--color-bg-alt: #F5E9DC;
	--color-text: #2B2B26;
	--color-text-light: #5B5B54;
	--color-white: #FFFFFF;

	--font-heading: 'Fraunces', Georgia, 'Times New Roman', serif;
	--font-body: 'Lexend', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;

	--radius: 14px;
	--radius-sm: 8px;
	--shadow-soft: 0 6px 24px rgba(31,64,105,0.08);
	--max-width: 1200px;
}

/* =====================================================
   RESET / BASE
   ===================================================== */
*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
	margin: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
}
img{ max-width: 100%; display: block; height: auto; }
a{ color: var(--color-primary); text-decoration: none; }
a:hover{ color: var(--color-secondary); }
h1,h2,h3,h4,h5,h6{
	font-family: var(--font-heading);
	font-variation-settings: "SOFT" 100;
	color: var(--color-primary);
	line-height: 1.2;
	margin: 0 0 0.6em;
	font-weight: 600;
}
h1{ font-size: clamp(2.1rem, 4vw, 3.2rem); }
h2{ font-size: clamp(1.7rem, 3vw, 2.4rem); }
h3{ font-size: clamp(1.3rem, 2vw, 1.6rem); }
p{ margin: 0 0 1.2em; }
ul{ padding-left: 1.2em; }
.container{
	width: 100%;
	max-width: var(--max-width);
	margin: 0 auto;
	padding: 0 24px;
}
section{ padding: 72px 0; }
.section-tight{ padding: 48px 0; }
.bg-alt{ background: var(--color-bg-alt); }
.bg-primary{ background: var(--color-primary); color: var(--color-white); }
.bg-primary h1, .bg-primary h2, .bg-primary h3{ color: var(--color-white); }
.text-center{ text-align: center; }
.eyebrow{
	display: inline-block;
	font-family: var(--font-body);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	font-size: 0.8rem;
	color: var(--color-accent);
	margin-bottom: 10px;
}

/* =====================================================
   BUTTONS
   ===================================================== */
.btn{
	display: inline-block;
	font-family: var(--font-body);
	font-weight: 700;
	padding: 14px 30px;
	border-radius: 50px;
	background: var(--color-primary);
	color: var(--color-white);
	border: 2px solid var(--color-primary);
	transition: all .2s ease;
	cursor: pointer;
}
.btn:hover{ background: var(--color-primary-dark); border-color: var(--color-primary-dark); color: var(--color-white); }
.btn-gold{ background: var(--color-secondary); border-color: var(--color-secondary); color: var(--color-primary-dark); }
.btn-gold:hover{ background: var(--color-secondary-light); border-color: var(--color-secondary-light); color: var(--color-primary-dark); }
.btn-outline{ background: transparent; color: var(--color-primary); border-color: var(--color-primary); }
.btn-outline:hover{ background: var(--color-primary); color: var(--color-white); }
.bg-primary .btn-outline{ color: var(--color-white); border-color: var(--color-white); }
.bg-primary .btn-outline:hover{ background: var(--color-white); color: var(--color-primary); }

/* =====================================================
   HEADER / NAVIGATION
   ===================================================== */
.skip-link{
	position: absolute;
	left: -9999px;
	top: 0;
	background: var(--color-primary);
	color: var(--color-white);
	padding: 12px 20px;
	z-index: 10000;
	border-radius: 0 0 8px 0;
}
.skip-link:focus{ left: 0; }

/* =====================================================
   TOP BAR (above header)
   ===================================================== */
.top-bar{
	background: var(--color-primary);
	color: #DDE6F0;
	font-size: 0.86rem;
}
.top-bar-inner{
	max-width: var(--max-width);
	margin: 0 auto;
	padding: 8px 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}
.top-bar-info{ display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.top-bar-link{ color: var(--color-white); font-weight: 700; display: inline-flex; align-items: center; gap: 6px; }
.top-bar-link:hover{ color: var(--color-secondary-light); }
.top-bar-icon{ width: 15px; height: 15px; flex: none; }
.top-bar-divider{ color: rgba(255,255,255,0.35); }
.top-bar-text{ color: #C9D3E0; }
.top-bar-portal{
	color: var(--color-white);
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 14px;
	border-radius: 50px;
	border: 1px solid rgba(255,255,255,0.4);
	white-space: nowrap;
	transition: background .15s ease, border-color .15s ease;
}
.top-bar-portal:hover{ background: rgba(255,255,255,0.12); border-color: rgba(255,255,255,0.7); color: var(--color-white); }
.top-bar-arrow{ transition: transform .15s ease; }
.top-bar-portal:hover .top-bar-arrow{ transform: translateX(3px); }

@media (max-width: 700px){
	.top-bar-text{ display: none; }
	.top-bar-divider{ display: none; }
}
@media (max-width: 480px){
	.top-bar-inner{ padding: 8px 16px; }
	.top-bar-portal span.top-bar-arrow{ display: none; }
}

.site-header{
	background: rgba(251,246,238,0.92);

	backdrop-filter: saturate(180%) blur(8px);
	border-bottom: 1px solid rgba(31,64,105,0.08);
	position: sticky;
	top: 0;
	z-index: 999;
	transition: box-shadow .2s ease;
}
.site-header.is-scrolled{ box-shadow: 0 4px 20px rgba(31,64,105,0.08); }

.header-inner{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 24px;
	max-width: var(--max-width);
	margin: 0 auto;
	gap: 24px;
}

.site-logo{
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 1.15rem;
	line-height: 1.15;
	color: var(--color-primary);
	flex-shrink: 0;
}
.site-logo img{ height: 48px; width: auto; }
.site-logo-emoji{ font-size: 2rem; }
.site-logo-text{ white-space: nowrap; }

/* Nav list */
.main-nav{ display: flex; align-items: center; flex: 1; justify-content: flex-end; gap: 8px; }
.nav-list{
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 4px;
	align-items: center;
}
.nav-item{ position: relative; }
.nav-link{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-weight: 600;
	color: var(--color-text);
	font-size: 0.96rem;
	padding: 10px 14px;
	border-radius: 50px;
	background: none;
	border: none;
	font-family: var(--font-body);
	cursor: pointer;
	white-space: nowrap;
	transition: background .15s ease, color .15s ease;
}
.nav-link:hover, .nav-link:focus-visible{ color: var(--color-primary); background: var(--color-bg-alt); }
.nav-link.is-active{ color: var(--color-primary); background: var(--color-bg-alt); font-weight: 700; }
.nav-link.is-active::after{
	content: "";
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 2px;
	height: 3px;
	border-radius: 3px;
	background: var(--color-secondary);
}
.nav-caret{ font-size: 0.65rem; margin-left: 2px; transition: transform .2s ease; }

/* More dropdown */
.nav-item-more{ display: flex; align-items: center; }
.nav-dropdown{
	list-style: none;
	margin: 0;
	padding: 8px;
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	background: var(--color-white);
	border-radius: var(--radius-sm);
	box-shadow: var(--shadow-soft);
	min-width: 180px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
	z-index: 50;
}
.nav-item-more.is-open .nav-dropdown{
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.nav-item-more.is-open .nav-caret{ transform: rotate(180deg); }
.nav-dropdown a{
	display: block;
	padding: 10px 14px;
	border-radius: var(--radius-sm);
	font-weight: 600;
	font-size: 0.94rem;
	color: var(--color-text);
}
.nav-dropdown a:hover, .nav-dropdown a:focus-visible{ background: var(--color-bg-alt); color: var(--color-primary); }
.nav-dropdown a.is-active{ color: var(--color-primary); background: var(--color-bg-alt); }

.nav-mobile-actions{ display: none; }

/* Header actions (desktop) */
.header-actions{ display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.portal-btn{
	background: transparent;
	border: 2px solid var(--color-accent);
	color: var(--color-accent);
	padding: 9px 18px;
	font-size: 0.88rem;
}
.portal-btn:hover{ background: var(--color-accent); border-color: var(--color-accent); color: var(--color-white); }
.btn-cta{ padding: 12px 24px; font-size: 0.92rem; box-shadow: 0 4px 14px rgba(210,157,84,0.35); }
.btn-block{ display: block; width: 100%; text-align: center; }

/* Mobile hamburger */
.nav-toggle{
	display: none;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 5px;
	width: 42px;
	height: 42px;
	background: none;
	border: none;
	cursor: pointer;
	flex-shrink: 0;
	border-radius: 50%;
}
.nav-toggle:hover{ background: var(--color-bg-alt); }
.nav-toggle-bar{
	display: block;
	width: 22px;
	height: 2px;
	background: var(--color-primary);
	border-radius: 2px;
	transition: transform .25s ease, opacity .25s ease;
}
.nav-toggle.is-active .nav-toggle-bar:nth-child(1){ transform: translateY(7px) rotate(45deg); }
.nav-toggle.is-active .nav-toggle-bar:nth-child(2){ opacity: 0; }
.nav-toggle.is-active .nav-toggle-bar:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

.nav-overlay{
	position: fixed;
	inset: 0;
	background: rgba(20,41,67,0.4);
	opacity: 0;
	visibility: hidden;
	transition: opacity .25s ease, visibility .25s ease;
	z-index: 900;
}
.nav-overlay.is-active{ opacity: 1; visibility: visible; }

body.nav-locked{ overflow: hidden; }


@media (max-width: 900px){
	.nav-toggle{ display: flex; }
	.header-actions{ display: none; }

	.main-nav{
		position: fixed;
		top: 0;
		right: 0;
		height: 100vh;
		width: min(320px, 85vw);
		background: var(--color-bg);
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		padding: 90px 26px 30px;
		transform: translateX(100%);
		transition: transform .3s ease;
		z-index: 950;
		box-shadow: -8px 0 30px rgba(31,64,105,0.15);
		overflow-y: auto;
	}
	.main-nav.is-open{ transform: translateX(0); }

	.nav-list{ flex-direction: column; align-items: stretch; gap: 4px; width: 100%; }
	.nav-item{ width: 100%; }
	.nav-link{ width: 100%; border-radius: var(--radius-sm); padding: 14px 16px; font-size: 1.05rem; }
	.nav-link.is-active::after{ display: none; }
	.nav-link.is-active{ border-left: 4px solid var(--color-secondary); }

	.nav-item-more{ flex-direction: column; align-items: stretch; }
	.nav-dropdown{
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		background: var(--color-bg-alt);
		margin: 4px 0 4px 10px;
		display: none;
	}
	.nav-item-more.is-open .nav-dropdown{ display: block; }

	.nav-mobile-actions{
		display: flex;
		flex-direction: column;
		gap: 12px;
		margin-top: 24px;
		padding-top: 24px;
		border-top: 1px solid rgba(31,64,105,0.1);
	}
}


/* =====================================================
   HERO
   ===================================================== */
.hero{
	background: linear-gradient(180deg, var(--color-bg-alt) 0%, var(--color-bg) 100%);
	padding: 80px 0;
}
.hero-grid{
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	gap: 50px;
	align-items: center;
}
.hero h1{ margin-bottom: 20px; }
.hero .lede{ font-size: 1.2rem; color: var(--color-text-light); margin-bottom: 30px; }
.hero-cta-group{ display: flex; gap: 16px; flex-wrap: wrap; }
.hero-image-placeholder, .img-placeholder{
	background: repeating-linear-gradient(45deg, var(--color-bg-alt), var(--color-bg-alt) 10px, #EFE0CF 10px, #EFE0CF 20px);
	border: 2px dashed var(--color-secondary);
	border-radius: var(--radius);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: var(--color-text-light);
	font-size: 0.9rem;
	padding: 20px;
	min-height: 320px;
}
/* Theme photos (Dr. Lion's Pexels picks) */
.site-photo{
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
	border-radius: var(--radius);
	box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}
.post-featured-media .site-photo, .post-card-media .site-photo{ border-radius: 0; box-shadow: none; height: 100%; }
.author-box-logo{ width: 80px; height: 80px; object-fit: contain; border-radius: 50%; background: #fff; flex-shrink: 0; }
@media (max-width: 900px){
	.hero-grid{ grid-template-columns: 1fr; }
}

/* =====================================================
   GRID / CARDS
   ===================================================== */
.grid{ display: grid; gap: 30px; }
.grid-2{ grid-template-columns: repeat(2, 1fr); }
.grid-3{ grid-template-columns: repeat(3, 1fr); }
.grid-4{ grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px){
	.grid-2, .grid-3, .grid-4{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 620px){
	.grid-2, .grid-3, .grid-4{ grid-template-columns: 1fr; }
}

.card{
	background: var(--color-white);
	border-radius: var(--radius);
	padding: 30px;
	box-shadow: var(--shadow-soft);
	height: 100%;
}
.card .icon{
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--color-bg-alt);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 18px;
	font-size: 1.6rem;
	color: var(--color-accent);
}
.card h3{ margin-bottom: 10px; font-size: 1.2rem; }
.card p{ color: var(--color-text-light); margin-bottom: 0; font-size: 0.97rem; }

.service-category{
	background: var(--color-white);
	border-radius: var(--radius);
	box-shadow: var(--shadow-soft);
	padding: 34px;
	margin-bottom: 30px;
}
.service-category{ scroll-margin-top: 140px; }
.service-jump{ display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 36px; }
.service-jump a{
	background: var(--color-white);
	border: 1px solid var(--color-bg-alt);
	border-radius: 50px;
	padding: 8px 18px;
	font-size: 0.9rem;
	font-weight: 600;
}
.service-jump a:hover, .service-jump a:focus-visible{ background: var(--color-primary); border-color: var(--color-primary); color: var(--color-white); }
@media (max-width: 700px){
	.service-jump{ flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; padding-bottom: 8px; margin-bottom: 24px; -webkit-overflow-scrolling: touch; }
	.service-jump a{ flex-shrink: 0; white-space: nowrap; }
}
.service-category-head{ display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.service-category-head .icon{
	width: 54px; height: 54px; border-radius: 50%;
	background: var(--color-bg-alt); color: var(--color-primary);
	display:flex; align-items:center; justify-content:center; font-size:1.5rem; flex-shrink:0;
}
.service-category-head h3{ margin: 0; }
.service-items{ display: flex; flex-wrap: wrap; gap: 10px; list-style: none; padding: 0; margin: 0; }
.service-items li{
	background: var(--color-bg-alt);
	color: var(--color-text);
	border-radius: 50px;
	padding: 7px 16px;
	font-size: 0.88rem;
}

/* =====================================================
   PRICING
   ===================================================== */
.pricing-table{ width: 100%; border-collapse: collapse; background: var(--color-white); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-soft); }
.pricing-table th, .pricing-table td{ padding: 18px 22px; text-align: left; border-bottom: 1px solid var(--color-bg-alt); }
.pricing-table th{ background: var(--color-primary); color: var(--color-white); font-family: var(--font-heading); font-weight: 700; }
.pricing-table tr:last-child td{ border-bottom: none; }
.pricing-table td.rate{ font-weight: 700; color: var(--color-primary); font-size: 1.05rem; }

.included-columns{ display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
@media (max-width: 800px){ .included-columns{ grid-template-columns: 1fr; } }
.included-box, .excluded-box{ padding: 30px; border-radius: var(--radius); }
.included-box{ background: #EEF3EA; border: 1px solid var(--color-accent); }
.excluded-box{ background: #FBECEC; border: 1px solid #D98C8C; }
.included-box h3{ color: var(--color-accent); }
.excluded-box h3{ color: #B5504F; }
.included-box ul, .excluded-box ul{ list-style: none; padding: 0; margin: 0; }
.included-box li, .excluded-box li{ padding: 6px 0; }
.included-box li:before{ content: "✓ "; color: var(--color-accent); font-weight: 700; }
.excluded-box li:before{ content: "✕ "; color: #B5504F; font-weight: 700; }

.scarcity-banner{
	background: var(--color-secondary);
	color: var(--color-primary-dark);
	border-radius: var(--radius);
	padding: 34px;
	text-align: center;
	margin-top: 40px;
}
.scarcity-banner h3{ color: var(--color-primary-dark); }

/* =====================================================
   FAQ ACCORDION
   ===================================================== */
.faq-list{ max-width: 800px; margin: 0 auto; }
.faq-item{ border-bottom: 1px solid rgba(31,64,105,0.15); }
.faq-question{
	width: 100%;
	text-align: left;
	background: none;
	border: none;
	padding: 22px 0;
	font-family: var(--font-heading);
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--color-primary);
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.faq-question .plus{ font-size: 1.4rem; color: var(--color-secondary); transition: transform .2s; }
.faq-item.is-open .plus{ transform: rotate(45deg); }
.faq-answer{
	max-height: 0;
	overflow: hidden;
	transition: max-height .25s ease;
	color: var(--color-text-light);
}
.faq-item.is-open .faq-answer{ max-height: 800px; }
.faq-answer-inner{ padding: 0 0 22px; }

/* =====================================================
   RESOURCES
   ===================================================== */
.resource-category{ margin-bottom: 40px; }
.resource-category h3{ border-bottom: 2px solid var(--color-secondary); padding-bottom: 10px; margin-bottom: 20px; }
.resource-link{
	display: block;
	background: var(--color-white);
	border-radius: var(--radius-sm);
	padding: 18px 22px;
	margin-bottom: 12px;
	box-shadow: var(--shadow-soft);
	font-weight: 600;
}
.resource-link small{ display: block; font-weight: 400; color: var(--color-text-light); margin-top: 4px; }

/* =====================================================
   CONTACT
   ===================================================== */
.contact-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 50px; }
@media (max-width: 900px){ .contact-grid{ grid-template-columns: 1fr; } }
.contact-detail{ margin-bottom: 22px; }
.contact-detail .label{ font-weight: 700; color: var(--color-primary); display: block; margin-bottom: 4px; }
.scheduler-placeholder{
	background: var(--color-bg-alt);
	border: 2px dashed var(--color-secondary);
	border-radius: var(--radius);
	padding: 60px 30px;
	text-align: center;
	color: var(--color-text-light);
}

/* 2026-10-13: the live Calendly booking widget on the Contact page. */
.scheduler-embed{
	min-width: 280px;
	height: 1080px;
	border: 1px solid var(--color-secondary);
	border-radius: var(--radius);
	overflow: hidden;
}

/* =====================================================
   BLOG — ARCHIVE / EDITORIAL LAYOUT
   ===================================================== */
.blog-hero{
	background: linear-gradient(180deg, var(--color-bg-alt) 0%, var(--color-bg) 100%);
	padding: 64px 0 40px;
}
.blog-hero-lede{ max-width: 620px; margin: 0 auto; color: var(--color-text-light); font-size: 1.08rem; }

.blog-filter{
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 44px;
	padding-bottom: 28px;
	border-bottom: 1px solid rgba(31,64,105,0.1);
}
.blog-filter a{
	background: var(--color-white);
	border-radius: 50px;
	padding: 8px 16px 8px 18px;
	font-size: 0.88rem;
	font-weight: 700;
	box-shadow: var(--shadow-soft);
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--color-text);
	transition: background .15s ease, color .15s ease, transform .15s ease;
}
.blog-filter a:hover{ color: var(--color-primary); transform: translateY(-1px); }
.blog-filter a.active{ background: var(--color-primary); color: var(--color-white); }
.blog-filter-count{
	background: rgba(31,64,105,0.08);
	color: var(--color-text-light);
	border-radius: 50px;
	padding: 1px 8px;
	font-size: 0.76rem;
	font-weight: 700;
}
.blog-filter a.active .blog-filter-count{ background: rgba(255,255,255,0.2); color: var(--color-white); }

/* Featured post (first post on main blog page) */
.post-featured{
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 0;
	background: var(--color-white);
	border-radius: var(--radius);
	box-shadow: var(--shadow-soft);
	overflow: hidden;
	margin-bottom: 50px;
}
.post-featured-media{ display: block; min-height: 100%; background: var(--color-bg-alt); }
.post-featured-media img{ width: 100%; height: 100%; object-fit: cover; min-height: 320px; }
.post-featured-body{ padding: 42px; display: flex; flex-direction: column; justify-content: center; }
.post-featured-body h2{ margin: 12px 0 16px; font-size: clamp(1.5rem, 2.6vw, 2rem); }
.post-featured-body h2 a{ color: var(--color-primary); }
.post-featured-body p{ color: var(--color-text-light); }
.post-badge{
	display: inline-block;
	background: var(--color-secondary);
	color: var(--color-primary-dark);
	font-weight: 800;
	font-size: 0.72rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	padding: 4px 12px;
	border-radius: 50px;
	margin-right: 10px;
}
.post-featured-footer{ display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 20px; flex-wrap: wrap; }
.post-author-mini{ display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 0.9rem; color: var(--color-text); }
.post-author-avatar{
	width: 32px; height: 32px; border-radius: 50%;
	background: var(--color-bg-alt);
	display: flex; align-items: center; justify-content: center;
	font-size: 1rem;
}
@media (max-width: 900px){
	.post-featured{ grid-template-columns: 1fr; }
	.post-featured-media img{ min-height: 220px; }
	.post-featured-body{ padding: 28px; }
}

/* Post grid cards */
.post-grid{ margin-bottom: 10px; }
.post-card{
	background: var(--color-white);
	border-radius: var(--radius);
	box-shadow: var(--shadow-soft);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: transform .18s ease, box-shadow .18s ease;
}
.post-card:hover{ transform: translateY(-4px); box-shadow: 0 14px 32px rgba(31,64,105,0.14); }
.post-card-media{ display: block; position: relative; }
.post-card-media img{ width: 100%; height: 190px; object-fit: cover; }
.post-card-cat{
	position: absolute;
	top: 14px;
	left: 14px;
	background: rgba(31,64,105,0.85);
	color: var(--color-white);
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 5px 12px;
	border-radius: 50px;
}
.post-card .post-body{ padding: 24px; display: flex; flex-direction: column; flex: 1; }
.post-card .post-meta{ font-size: 0.82rem; color: var(--color-text-light); margin-bottom: 8px; }
.post-card h3{ font-size: 1.15rem; margin-bottom: 10px; }
.post-card h3 a{ color: var(--color-primary); }
.post-card p{ color: var(--color-text-light); font-size: 0.95rem; flex: 1; }
.post-card-link{
	font-weight: 700;
	color: var(--color-primary);
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 6px;
}
.post-card-link span{ transition: transform .15s ease; }
.post-card-link:hover span{ transform: translateX(3px); }

/* Empty state */
.blog-empty{
	text-align: center;
	background: var(--color-white);
	border-radius: var(--radius);
	box-shadow: var(--shadow-soft);
	padding: 60px 30px;
	max-width: 480px;
	margin: 0 auto;
}
.blog-empty-icon{ font-size: 2.4rem; display: block; margin-bottom: 12px; }

/* Pagination */
.blog-pagination{ text-align: center; margin-top: 44px; }
.blog-pagination .nav-links{ display: inline-flex; gap: 8px; align-items: center; }
.blog-pagination a, .blog-pagination span.current{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border-radius: 50px;
	background: var(--color-white);
	box-shadow: var(--shadow-soft);
	font-weight: 700;
	color: var(--color-text);
}
.blog-pagination span.current{ background: var(--color-primary); color: var(--color-white); }
.blog-pagination a:hover{ background: var(--color-bg-alt); color: var(--color-primary); }

/* Single post author box */
.author-box{ display: flex; gap: 20px; background: var(--color-bg-alt); border-radius: var(--radius); padding: 26px; margin: 40px 0; align-items: center; }
.author-box img{ width: 80px; height: 80px; border-radius: 50%; }


/* =====================================================
   FOOTER
   ===================================================== */
.site-footer{ background: var(--color-primary); color: #E7ECF2; padding: 60px 0 30px; }
.site-footer h4{ color: var(--color-white); font-family: var(--font-heading); margin-bottom: 14px; }
.site-footer a{ color: #C9D3E0; }
.site-footer a:hover{ color: var(--color-secondary); }
.footer-grid{ display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px; margin-bottom: 40px; }
@media (max-width: 900px){ .footer-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px){ .footer-grid{ grid-template-columns: 1fr; } }
.footer-grid ul{ list-style: none; padding: 0; margin: 0; }
.footer-grid li{ margin-bottom: 8px; }
.footer-bottom{ border-top: 1px solid rgba(255,255,255,0.15); padding-top: 20px; font-size: 0.85rem; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; color: #A9B6C7; }
.footer-logo{ font-family: var(--font-heading); font-size: 1.5rem; color: var(--color-white); margin-bottom: 12px; display: block; }

/* =====================================================
   MISC
   ===================================================== */
.icon-emoji{ font-size: 1.6rem; line-height:1; }
.divider-gold{ height: 4px; width: 70px; background: var(--color-secondary); border-radius: 4px; margin: 0 auto 30px; }
.signature-line{ font-family: var(--font-heading); font-style: italic; font-size: 1.4rem; color: var(--color-accent); }
blockquote{
	border-left: 4px solid var(--color-secondary);
	padding-left: 20px;
	font-style: italic;
	color: var(--color-text-light);
	margin: 20px 0;
}

/* ==========================================================================
   BRAND (2026-11-03): Beth's "Lionheart Pediatrics Brand Color Specification" (Rev. Nov 2026).
   Lionheart Blue  #2251A8  primary brand color: major calls to action, links
   Sage            #769087  secondary: calm accents, section tints, checkmarks
   Deep Navy       #1F3F68  headings, small text, top bar and footer (contrast)
   Warm Cream      #FBF2E9  page background
   Lion Gold       #E9BA7A  warm supporting color: rules, icon circles, highlights
   Bluebonnet      #506DA6  accent in the call-to-action band
   ========================================================================== */
:root{
	--color-brand: #2251A8;
	--color-brand-dark: #1A4088;
	--color-bluebonnet: #506DA6;
	--color-primary: #1F3F68;
	--color-primary-dark: #172F4E;
	--color-sage: #769087;
	--color-sage-dark: #5A726B;
	--color-sage-light: #D9E3DE;
	--color-sage-mist: #EEF2EC;
	--color-gold: #E9BA7A;
	--color-gold-soft: #F7E6CC;
	--color-secondary: #DFA862;         /* Lion Gold, a shade deeper so thin rules show on cream */
	--color-secondary-light: #E9BA7A;
	--color-accent: var(--color-sage-dark);
	--color-bg: #FBF2E9;
	--color-bg-alt: var(--color-sage-mist);
	--color-text: #2A2F36;
	--color-text-light: #565C64;
	--shadow-soft: 0 8px 28px rgba(31,63,104,0.07);
}

/* Type: navy headings, Lionheart Blue links */
h1, h2, h3, h4{ color: var(--color-primary); letter-spacing: -0.01em; }
h1{ font-weight: 600; line-height: 1.12; }
a{ color: var(--color-brand); }
a:hover{ color: var(--color-brand-dark); }
.eyebrow{
	display: inline-flex; align-items: center; gap: 12px;
	color: var(--color-primary); font-weight: 600; font-size: 0.76rem; letter-spacing: 0.16em; opacity: 0.85;
}
.eyebrow::before, .text-center .eyebrow::after{ content: ""; width: 28px; height: 2px; border-radius: 2px; background: var(--color-sage); }
.divider-gold{ background: var(--color-gold); height: 3px; }
.signature-line{ color: var(--color-primary); font-style: italic; font-weight: 500; }
.hero .lede{ color: #4A5058; }

/* Buttons: Lionheart Blue for the main call to action, navy outline for the second */
.btn-gold{ background: var(--color-brand); border-color: var(--color-brand); color: #fff; }
.btn-gold:hover{ background: var(--color-brand-dark); border-color: var(--color-brand-dark); color: #fff; }
.btn-cta{ box-shadow: 0 6px 18px rgba(34,81,168,0.28); }
.btn-outline{ color: var(--color-primary); border-color: var(--color-primary); }
.btn-outline:hover{ background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.portal-btn{ border-color: var(--color-brand); color: var(--color-brand); }
.portal-btn:hover{ background: var(--color-brand); border-color: var(--color-brand); color: #fff; }

/* Bands */
.top-bar{ background: var(--color-primary); }
.top-bar-link:hover{ color: var(--color-gold); }
.site-header{ background: rgba(251,242,233,0.96); }
.hero{
	background:
		radial-gradient(1200px 500px at 0% 0%, rgba(34,81,168,0.10), transparent 60%),
		radial-gradient(900px 500px at 100% 100%, rgba(118,144,135,0.14), transparent 60%),
		var(--color-bg);
}
.bg-alt{ background: var(--color-sage-mist); }
.bg-primary{ background: linear-gradient(135deg, var(--color-brand) 0%, var(--color-bluebonnet) 100%); }
.bg-primary .eyebrow{ color: var(--color-gold-soft); opacity: 1; }
.bg-primary .eyebrow::before, .bg-primary.text-center .eyebrow::after, .bg-primary .text-center .eyebrow::after{ background: var(--color-gold); }
.bg-primary .btn-gold{ background: var(--color-gold); border-color: var(--color-gold); color: var(--color-primary-dark); }
.bg-primary .btn-gold:hover{ background: var(--color-gold-soft); border-color: var(--color-gold-soft); color: var(--color-primary-dark); }
.site-footer{ background: var(--color-primary); }
.site-footer a:hover{ color: var(--color-gold); }

/* Cards and boxes */
.card{ border: 1px solid #ECE3D7; border-top: 4px solid var(--color-sage-light); transition: border-color .2s ease, transform .2s ease; }
.card:hover{ border-top-color: var(--color-gold); }
.bg-alt .card{ border-color: #DDE5E0; border-top-color: var(--color-sage-light); }
.card .icon{ background: var(--color-gold-soft); }
.pricing-table th{ background: var(--color-primary); }
.pricing-table td.rate{ color: var(--color-brand); }
.pricing-table tr:nth-child(even) td{ background: #FDF8F2; }
.included-box{ background: var(--color-sage-mist); border-color: var(--color-sage); }
.included-box h3{ color: var(--color-primary); }
.included-box li:before{ color: var(--color-sage-dark); }
.scarcity-banner{ background: #FDF3E4; border: 1px solid var(--color-gold-soft); border-left: 6px solid var(--color-gold); color: var(--color-text); }
.scarcity-banner h3{ color: var(--color-primary); }
.scarcity-banner p{ color: var(--color-text-light); }
.faq-question .plus{ color: var(--color-brand); }
.nav-link:hover, .nav-link:focus-visible, .nav-link.is-active{ background: var(--color-sage-mist); }

/* Logo, illustration and headshot (Beth's transparent logo, 09-13 email; headshot, 11-03 email) */
.site-logo{ gap: 12px; }
.site-logo img.site-logo-icon{ height: 50px; width: auto; }
.site-logo img.site-logo-wordmark{ height: 30px; width: auto; }
.footer-logo-badge{ display: inline-flex; align-items: center; gap: 12px; background: var(--color-bg); border-radius: var(--radius); padding: 12px 18px; margin-bottom: 18px; }
.footer-logo-badge img{ height: 44px; width: auto; }
.footer-logo-badge img + img{ height: 30px; }
.brand-illustration{ width: 300px; max-width: 70%; height: auto; margin: 0 auto 18px; }
.headshot{ width: 100%; max-width: 400px; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 50%; margin: 0 auto; box-shadow: var(--shadow-soft); }
.author-box-logo{ object-fit: cover; }