/* =============================================================
   Living Healthy Mom Pro — core design system.
   Cream / beige / dusty pink / sage / lavender / terracotta / charcoal.
   ============================================================= */

:root {
	--lhm-radius-sm: 10px;
	--lhm-radius-md: 18px;
	--lhm-radius-lg: 28px;
	--lhm-radius-pill: 999px;
	--lhm-shadow-sm: 0 1px 2px rgba(47, 42, 38, .06), 0 1px 1px rgba(47, 42, 38, .04);
	--lhm-shadow-md: 0 10px 30px -16px rgba(47, 42, 38, .18), 0 2px 6px rgba(47, 42, 38, .05);
	--lhm-shadow-lg: 0 24px 60px -24px rgba(47, 42, 38, .22);
	--lhm-trans:    220ms cubic-bezier(.32, .72, 0, 1);
	--lhm-container-w: 1180px;
	--lhm-space-1: 4px;
	--lhm-space-2: 8px;
	--lhm-space-3: 12px;
	--lhm-space-4: 16px;
	--lhm-space-5: 24px;
	--lhm-space-6: 32px;
	--lhm-space-7: 48px;
	--lhm-space-8: 64px;
	--lhm-space-9: 96px;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body.lhm-body {
	margin: 0;
	background: var(--lhm-cream);
	color: var(--lhm-charcoal);
	font-family: var(--lhm-font-body);
	font-size: 17px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: var(--lhm-terracotta); text-decoration: none; transition: color var(--lhm-trans); }
a:hover, a:focus-visible { color: var(--lhm-charcoal); }
:focus-visible { outline: 2px solid var(--lhm-terracotta); outline-offset: 2px; border-radius: 6px; }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--lhm-font-heading);
	color: var(--lhm-charcoal);
	letter-spacing: -.01em;
	margin: 0 0 .6em;
	line-height: 1.2;
}
h1 { font-size: clamp(2rem, 4.5vw, 3.4rem); font-weight: 600; text-wrap: balance; }
h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); font-weight: 600; text-wrap: balance; }
h3 { font-size: clamp(1.2rem, 1.6vw, 1.5rem); font-weight: 600; }
h4 { font-size: 1.05rem; font-weight: 600; font-family: var(--lhm-font-ui); }

p { margin: 0 0 1em; color: var(--lhm-charcoal); }
.lhm-prose p, .lhm-prose ul, .lhm-prose ol { color: var(--lhm-charcoal); font-size: 1.05rem; line-height: 1.75; }
.lhm-prose img { border-radius: var(--lhm-radius-md); margin: 1.5em 0; }

.lhm-container {
	max-width: var(--lhm-container-w);
	margin: 0 auto;
	padding: 0 var(--lhm-space-5);
}

.lhm-eyebrow {
	display: inline-block;
	font-family: var(--lhm-font-ui);
	font-size: .8rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--lhm-terracotta);
	font-weight: 600;
	padding: 4px 12px;
	background: rgba(200, 122, 90, .1);
	border-radius: var(--lhm-radius-pill);
	margin-bottom: var(--lhm-space-3);
}

.screen-reader-text {
	border: 0; clip: rect(1px,1px,1px,1px); -webkit-clip-path: inset(50%); clip-path: inset(50%);
	height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;
	word-wrap: normal !important;
}
.skip-link {
	position: absolute; top: -100px; left: 0; background: var(--lhm-charcoal);
	color: var(--lhm-cream); padding: 12px 18px; z-index: 99999;
	border-radius: 0 0 var(--lhm-radius-md) 0;
}
.skip-link:focus { top: 0; }

/* ===== Header ===== */
.site-header {
	background: rgba(251, 247, 242, .88);
	backdrop-filter: saturate(140%) blur(14px);
	-webkit-backdrop-filter: saturate(140%) blur(14px);
	border-bottom: 1px solid rgba(47, 42, 38, .06);
	position: sticky; top: 0; z-index: 50;
}
.header-inner {
	display: flex;
	align-items: center;
	gap: var(--lhm-space-5);
	padding-top: var(--lhm-space-3);
	padding-bottom: var(--lhm-space-3);
}
.site-branding { flex: 0 0 auto; }
.site-title-link { font-family: var(--lhm-font-heading); font-size: 1.3rem; font-weight: 600; color: var(--lhm-charcoal); }
.custom-logo { max-height: 44px; width: auto; }

.main-navigation { flex: 1; }
.primary-menu { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--lhm-space-5); }
.primary-menu li { font-family: var(--lhm-font-ui); font-size: .96rem; font-weight: 500; }
.primary-menu a { color: var(--lhm-charcoal); padding: 6px 0; position: relative; }
.primary-menu a:hover { color: var(--lhm-terracotta); }

.header-actions { display: flex; align-items: center; gap: var(--lhm-space-3); }
.header-search-toggle, .mobile-menu-toggle {
	background: transparent; border: 0; padding: 10px;
	border-radius: var(--lhm-radius-pill); cursor: pointer;
	color: var(--lhm-charcoal);
}
.header-search-toggle:hover, .mobile-menu-toggle:hover { background: var(--lhm-beige); }
.header-cta {
	background: var(--lhm-terracotta); color: var(--lhm-cream);
	padding: 10px 18px; border-radius: var(--lhm-radius-pill);
	font-family: var(--lhm-font-ui); font-weight: 600; font-size: .9rem;
	transition: background var(--lhm-trans), transform var(--lhm-trans);
}
.header-cta:hover { background: var(--lhm-charcoal); color: var(--lhm-cream); transform: translateY(-1px); }
.hamburger { width: 22px; height: 16px; position: relative; display: inline-block; }
.hamburger span { position: absolute; left: 0; right: 0; height: 2px; background: currentColor; border-radius: 2px; }
.hamburger span:nth-child(1) { top: 2px; }
.hamburger span:nth-child(2) { top: 7px; }
.hamburger span:nth-child(3) { top: 12px; }

.mobile-menu-toggle { display: none; }

.header-search-panel { background: var(--lhm-cream); border-top: 1px solid rgba(47, 42, 38, .06); padding: var(--lhm-space-5) 0; }
.mobile-menu-drawer {
	position: fixed; top: 0; right: -100%; width: min(360px, 90vw); height: 100vh;
	background: var(--lhm-cream); padding: var(--lhm-space-7) var(--lhm-space-5);
	transition: right var(--lhm-trans); z-index: 60; box-shadow: var(--lhm-shadow-lg);
}
.mobile-menu-drawer.is-open { right: 0; }
.mobile-menu-list { list-style: none; margin: 0; padding: 0; }
.mobile-menu-list li { font-family: var(--lhm-font-ui); font-size: 1.1rem; padding: 12px 0; border-bottom: 1px solid rgba(47, 42, 38, .06); }
.mobile-menu-list a { color: var(--lhm-charcoal); }

/* ===== Buttons ===== */
.lhm-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	font-family: var(--lhm-font-ui); font-weight: 600;
	padding: 12px 22px;
	border-radius: var(--lhm-radius-pill);
	border: 1px solid transparent;
	background: var(--lhm-beige);
	color: var(--lhm-charcoal);
	cursor: pointer;
	transition: background var(--lhm-trans), color var(--lhm-trans), transform var(--lhm-trans), box-shadow var(--lhm-trans);
	text-decoration: none;
	line-height: 1.2;
	font-size: .98rem;
}
.lhm-btn:hover { transform: translateY(-1px); }
.lhm-btn-primary { background: var(--lhm-terracotta); color: var(--lhm-cream); }
.lhm-btn-primary:hover { background: var(--lhm-charcoal); color: var(--lhm-cream); box-shadow: var(--lhm-shadow-md); }
.lhm-btn-ghost { background: transparent; border-color: rgba(47, 42, 38, .14); }
.lhm-btn-ghost:hover { background: var(--lhm-beige); }
.lhm-btn-lg { padding: 16px 32px; font-size: 1.05rem; }
.lhm-btn-sm { padding: 8px 14px; font-size: .88rem; }

/* ===== Sections + global rhythm ===== */
.lhm-section {
	padding: clamp(var(--lhm-space-7), 8vw, var(--lhm-space-9)) 0;
	position: relative;
}
.lhm-section:nth-child(even) { background: var(--lhm-cream); }
.lhm-section:nth-child(odd)  { background: #fdfaf6; }

.lhm-section-header {
	max-width: 760px; margin: 0 auto var(--lhm-space-7);
	text-align: center;
}
.lhm-section-heading { font-family: var(--lhm-font-heading); }
.lhm-section-sub { color: var(--lhm-muted); font-size: 1.08rem; }

.lhm-medical-disclaimer {
	margin-top: var(--lhm-space-4);
	padding: 14px 18px;
	background: rgba(168, 192, 165, .14);
	border: 1px solid rgba(168, 192, 165, .35);
	border-radius: var(--lhm-radius-md);
	font-size: .86rem;
	color: var(--lhm-muted);
}

/* ===== Forms ===== */
input, select, textarea, button {
	font-family: inherit;
	font-size: 1rem;
}
input[type="text"], input[type="search"], input[type="email"], input[type="number"], input[type="time"], select, textarea {
	width: 100%;
	padding: 12px 14px;
	background: #fff;
	border: 1px solid rgba(47, 42, 38, .12);
	border-radius: var(--lhm-radius-md);
	color: var(--lhm-charcoal);
	transition: border-color var(--lhm-trans), box-shadow var(--lhm-trans);
}
input:focus, select:focus, textarea:focus {
	outline: none;
	border-color: var(--lhm-terracotta);
	box-shadow: 0 0 0 4px rgba(200, 122, 90, .12);
}

/* ===== Cards ===== */
.lhm-card {
	background: #fff;
	border-radius: var(--lhm-radius-md);
	overflow: hidden;
	box-shadow: var(--lhm-shadow-sm);
	transition: transform var(--lhm-trans), box-shadow var(--lhm-trans);
}
.lhm-card:hover { transform: translateY(-3px); box-shadow: var(--lhm-shadow-md); }
.lhm-card-link { display: block; color: inherit; }
.lhm-card-media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.lhm-card-body { padding: var(--lhm-space-5); }
.lhm-card-tag {
	display: inline-block;
	font-family: var(--lhm-font-ui);
	font-size: .72rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	background: rgba(168, 192, 165, .25);
	color: #57755b;
	padding: 4px 10px;
	border-radius: var(--lhm-radius-pill);
	margin-bottom: 12px;
}
.lhm-card-title { font-size: 1.15rem; margin-bottom: 8px; }
.lhm-card-excerpt { color: var(--lhm-muted); font-size: .95rem; margin-bottom: 12px; }
.lhm-card-meta { color: var(--lhm-muted); font-size: .85rem; display: flex; gap: 6px; }
.lhm-card-placeholder { padding: var(--lhm-space-5); background: var(--lhm-beige); }
.lhm-card-placeholder h3 { font-size: 1.1rem; }
.lhm-card-action { padding: var(--lhm-space-5); background: #fff; }
.lhm-card-action:hover { background: var(--lhm-beige); }

/* ===== Product Box ===== */
.lhm-product-box {
	background: #fff;
	border-radius: var(--lhm-radius-md);
	box-shadow: var(--lhm-shadow-sm);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	position: relative;
	transition: transform var(--lhm-trans), box-shadow var(--lhm-trans);
}
.lhm-product-box:hover { transform: translateY(-4px); box-shadow: var(--lhm-shadow-md); }
.lhm-product-badge {
	position: absolute; top: 12px; left: 12px;
	background: var(--lhm-terracotta); color: var(--lhm-cream);
	font-family: var(--lhm-font-ui); font-size: .72rem; letter-spacing: .08em;
	text-transform: uppercase; font-weight: 600;
	padding: 5px 10px; border-radius: var(--lhm-radius-pill);
	z-index: 2;
}
.lhm-product-image {
	background: linear-gradient(135deg, var(--lhm-beige), var(--lhm-pink));
	aspect-ratio: 4 / 3;
}
.lhm-product-image img { width: 100%; height: 100%; object-fit: cover; }
.lhm-product-body { padding: var(--lhm-space-5); display: flex; flex-direction: column; gap: 10px; flex: 1; }
.lhm-product-title { font-size: 1.1rem; line-height: 1.3; margin: 0; }
.lhm-product-bestfor { font-size: .92rem; color: var(--lhm-muted); margin: 0; }
.lhm-product-rating { font-size: .92rem; color: var(--lhm-muted); margin: 0; }
.lhm-product-procon { display: grid; grid-template-columns: 1fr 1fr; gap: var(--lhm-space-3); margin-top: 6px; }
.lhm-product-procon h4 { font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--lhm-muted); margin: 0 0 4px; }
.lhm-pros li, .lhm-cons li { font-size: .86rem; padding-left: 16px; position: relative; list-style: none; line-height: 1.4; margin-bottom: 4px; }
.lhm-pros ul, .lhm-cons ul { margin: 0; padding: 0; }
.lhm-pros li::before { content: "✓"; position: absolute; left: 0; color: #57755b; font-weight: 700; }
.lhm-cons li::before { content: "–"; position: absolute; left: 0; color: var(--lhm-terracotta); font-weight: 700; }
.lhm-product-actions { display: flex; gap: 8px; margin-top: auto; padding-top: 8px; flex-wrap: wrap; }
.lhm-product-actions .lhm-btn { flex: 1; min-width: 0; }
.lhm-product-disclosure { font-size: .76rem; color: var(--lhm-muted); margin: 0; }

/* Product box style variants */
.lhm-product-box-sidebar { box-shadow: none; border: 1px solid rgba(47, 42, 38, .08); }
.lhm-product-box-sidebar .lhm-product-procon { display: none; }
.lhm-product-box-sticky { position: sticky; top: 96px; }

/* ===== Sidebar / archive layouts ===== */
.archive-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: var(--lhm-space-7); padding-top: var(--lhm-space-7); padding-bottom: var(--lhm-space-7); }
.archive-header { margin-bottom: var(--lhm-space-6); }
.archive-title { font-size: clamp(1.6rem, 3vw, 2.2rem); }
.archive-description { color: var(--lhm-muted); }
.post-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--lhm-space-5); }
.archive-sidebar > * + * { margin-top: var(--lhm-space-5); }
.widget { background: #fff; border-radius: var(--lhm-radius-md); padding: var(--lhm-space-5); box-shadow: var(--lhm-shadow-sm); }
.widget-title { font-size: 1.05rem; margin-bottom: 12px; }

/* ===== Pagination ===== */
.wp-pagenavi, .pagination, .nav-links {
	display: flex; gap: 8px; flex-wrap: wrap; margin-top: var(--lhm-space-6); justify-content: center;
}
.page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 40px; height: 40px; padding: 0 12px;
	border-radius: var(--lhm-radius-pill);
	background: #fff; color: var(--lhm-charcoal);
	font-family: var(--lhm-font-ui); font-weight: 600;
	box-shadow: var(--lhm-shadow-sm);
}
.page-numbers.current, .page-numbers:hover { background: var(--lhm-terracotta); color: var(--lhm-cream); }

/* ===== Single ===== */
.lhm-single-header { padding-top: var(--lhm-space-6); }
.lhm-single-title { font-size: clamp(2rem, 4vw, 3rem); }
.lhm-single-tag {
	display: inline-block; font-family: var(--lhm-font-ui); font-size: .76rem;
	letter-spacing: .12em; text-transform: uppercase; color: #57755b;
	background: rgba(168, 192, 165, .25); padding: 5px 12px; border-radius: var(--lhm-radius-pill);
	margin-bottom: var(--lhm-space-3);
}
.lhm-single-meta { color: var(--lhm-muted); font-size: .92rem; display: flex; gap: 8px; flex-wrap: wrap; }
.lhm-single-hero { margin-top: var(--lhm-space-6); }
.lhm-single-hero img { aspect-ratio: 16/9; object-fit: cover; border-radius: var(--lhm-radius-lg); width: 100%; }
.lhm-single-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: var(--lhm-space-7); padding-top: var(--lhm-space-7); padding-bottom: var(--lhm-space-7); }
.lhm-single-related { background: var(--lhm-beige); padding: var(--lhm-space-8) 0; }
.lhm-single-related h2 { text-align: center; margin-bottom: var(--lhm-space-6); }
.lhm-affiliate-disclosure {
	margin-top: var(--lhm-space-6);
	padding: var(--lhm-space-4);
	background: rgba(231, 181, 176, .18);
	border-left: 3px solid var(--lhm-pink);
	border-radius: var(--lhm-radius-sm);
	font-size: .9rem; color: var(--lhm-muted);
}

/* ===== Footer ===== */
.site-footer {
	margin-top: var(--lhm-space-8);
	background: linear-gradient(180deg, var(--lhm-cream) 0%, var(--lhm-beige) 100%);
}
.footer-top { padding: var(--lhm-space-8) 0 var(--lhm-space-6); border-bottom: 1px solid rgba(47, 42, 38, .06); }
.footer-newsletter { text-align: center; max-width: 600px; margin: 0 auto var(--lhm-space-7); }
.footer-newsletter h3 { font-size: 1.5rem; }
.lhm-newsletter-form { display: flex; gap: 8px; }
.lhm-newsletter-form input { flex: 1; }
.footer-widgets { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--lhm-space-5); }
.footer-widget, .footer-column { background: transparent; padding: 0; box-shadow: none; }
.footer-column .widget-title { font-family: var(--lhm-font-ui); font-size: .82rem; letter-spacing: .12em; text-transform: uppercase; color: var(--lhm-muted); margin-bottom: 10px; }
.footer-bottom { padding: var(--lhm-space-5) 0; }
.footer-bottom .lhm-container { display: grid; grid-template-columns: 1fr 1fr; gap: var(--lhm-space-4); align-items: center; }
.footer-legal-nav .legal-menu { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--lhm-space-4); flex-wrap: wrap; }
.footer-legal-nav a { color: var(--lhm-muted); font-size: .88rem; }
.footer-copy { color: var(--lhm-muted); font-size: .88rem; margin: 0; }
.footer-disclosure { grid-column: 1 / -1; color: var(--lhm-muted); font-size: .82rem; padding-top: var(--lhm-space-3); border-top: 1px solid rgba(47, 42, 38, .06); margin: 0; }

/* ===== Mobile sticky CTA ===== */
.lhm-mobile-sticky-cta {
	position: fixed; bottom: 14px; left: 14px; right: 14px;
	z-index: 40;
	background: var(--lhm-terracotta);
	color: var(--lhm-cream);
	border-radius: var(--lhm-radius-pill);
	box-shadow: var(--lhm-shadow-lg);
}
.lhm-mobile-sticky-cta a {
	display: block; text-align: center; color: var(--lhm-cream);
	padding: 14px 18px; font-family: var(--lhm-font-ui); font-weight: 600;
}

/* ===== Comments ===== */
.lhm-comments { padding-top: var(--lhm-space-7); padding-bottom: var(--lhm-space-7); }
.lhm-comments-title { font-size: 1.3rem; margin-bottom: var(--lhm-space-5); }
.lhm-comment-list { list-style: none; padding: 0; }
.lhm-comment-list .comment { padding: var(--lhm-space-4); background: #fff; border-radius: var(--lhm-radius-md); margin-bottom: var(--lhm-space-3); box-shadow: var(--lhm-shadow-sm); }

/* ===== Breadcrumb ===== */
.lhm-breadcrumb { padding: var(--lhm-space-3) 0; background: transparent; }
.lhm-breadcrumb-list {
	list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 4px;
	font-family: var(--lhm-font-ui); font-size: .85rem;
}
.lhm-breadcrumb-list li { display: inline-flex; align-items: center; gap: 4px; color: var(--lhm-muted); }
.lhm-breadcrumb-list a { color: var(--lhm-muted); }
.lhm-breadcrumb-list a:hover { color: var(--lhm-terracotta); }
.lhm-breadcrumb-list [aria-current="page"] { color: var(--lhm-charcoal); font-weight: 500; }
.lhm-breadcrumb-sep { color: rgba(47, 42, 38, .25); }

/* ===== Footer list ===== */
.footer-list { list-style: none; padding: 0; margin: 0; }
.footer-list li { padding: 4px 0; }
.footer-list a { color: var(--lhm-muted); font-family: var(--lhm-font-ui); font-size: .92rem; }
.footer-list a:hover { color: var(--lhm-terracotta); }

/* ===== Star ratings ===== */
.lhm-stars { display: inline-flex; align-items: center; gap: 4px; font-family: var(--lhm-font-ui); font-size: .9rem; color: var(--lhm-muted); }
.lhm-stars-icons { color: #d9a23a; display: inline-flex; gap: 1px; }
.lhm-stars-icons svg { width: 14px; height: 14px; fill: currentColor; }
.lhm-stars-value { color: var(--lhm-charcoal); font-weight: 600; }
.lhm-stars-value::before { content: "·"; margin: 0 4px; color: var(--lhm-muted); font-weight: 400; }

/* ===== Animations ===== */
@media (prefers-reduced-motion: no-preference) {
	[data-lhm-section] { animation: lhm-fade-up 600ms var(--lhm-trans) both; animation-delay: 80ms; }
}
@keyframes lhm-fade-up {
	from { opacity: 0; transform: translateY(16px); }
	to   { opacity: 1; transform: translateY(0); }
}