/*
Theme Name: Comparison Classic
Theme URI: https://healthsharecomparison.org
Description: Editorial comparison-site theme for Healthshare Comparison. Neutral review-site design with structured comparison tables, review cards, and long-form guide layouts. No page builders, no Gutenberg block styling dependencies.
Author: Healthshare Comparison
Version: 1.0.1
License: GNU General Public License v2 or later
Text Domain: comparison-classic
*/

body {
	margin: 0;
	padding: 0;
	background: #ffffff;
	color: #1f2937;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-size: 17px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}

a { color: #0f6b62; }
a:hover { color: #0a4f48; }

img { max-width: 100%; height: auto; }

/* ---------- Layout ---------- */

.wrap {
	max-width: 1080px;
	margin: 0 auto;
	padding: 0 24px;
}

.site-main { padding: 44px 0 72px; min-height: 46vh; }

.entry-content { max-width: 780px; }
.entry-content table { max-width: 100%; }

h1, h2, h3, h4 {
	font-family: Georgia, "Times New Roman", serif;
	color: #143c38;
	line-height: 1.25;
}

h1 { font-size: 2.15rem; margin: 0 0 18px; }
h2 { font-size: 1.55rem; margin: 2rem 0 .8rem; }
h3 { font-size: 1.2rem; margin: 1.6rem 0 .6rem; }

p { margin: 0 0 1.1rem; }
ul, ol { margin: 0 0 1.1rem; padding-left: 1.4rem; }
li { margin-bottom: .45rem; }

blockquote {
	margin: 1.6rem 0;
	padding: 14px 20px;
	border-left: 4px solid #0f6b62;
	background: #f2f8f6;
	color: #31504c;
	font-style: italic;
}

hr {
	border: 0;
	border-top: 1px solid #e4e9e8;
	margin: 2.4rem 0;
}

/* ---------- Header ---------- */

.site-header {
	background: #ffffff;
	border-bottom: 1px solid #e4e9e8;
}

.site-header__bar {
	max-width: 1080px;
	margin: 0 auto;
	padding: 16px 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
}

.site-header__logo {
	display: flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	color: #143c38;
}

.site-header__logo-text {
	display: block;
	font-family: Georgia, serif;
	font-weight: 700;
	font-size: 1.22rem;
	letter-spacing: .01em;
}

.site-header__logo-sub {
	display: block;
	font-size: .74rem;
	color: #6b7280;
	letter-spacing: .02em;
}

.site-header__links {
	display: flex;
	align-items: center;
	gap: 26px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.site-header__links a {
	text-decoration: none;
	color: #31504c;
	font-size: .95rem;
	font-weight: 500;
}

.site-header__links a:hover { color: #0f6b62; }

.site-header__toggle {
	display: none;
	background: none;
	border: 0;
	padding: 10px;
	cursor: pointer;
}

.site-header__toggle span {
	display: block;
	width: 22px;
	height: 2px;
	background: #143c38;
	margin: 5px 0;
	transition: transform .2s ease, opacity .2s ease;
}

.site-header__toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.site-header__toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.site-header__toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 920px) {
	.site-header__toggle { display: inline-block; }
	.site-header__nav {
		display: none;
		width: 100%;
	}
	.site-header__nav.is-open { display: block; }
	.site-header__links {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
		padding: 14px 0 20px;
	}
}

/* ---------- Breadcrumbs ---------- */

.crumbs {
	font-size: .82rem;
	color: #6b7280;
	margin: 0 0 22px;
}

.crumbs a { color: #0f6b62; text-decoration: none; }
.crumbs a:hover { text-decoration: underline; }

/* ---------- Post / guide meta ---------- */

.post-meta {
	font-size: .84rem;
	color: #6b7280;
	margin: -10px 0 24px;
}

.post-list-item {
	padding: 22px 0;
	border-bottom: 1px solid #e4e9e8;
}

.post-list-item h2 { margin: 0 0 6px; }
.post-list-item h2 a { text-decoration: none; color: #143c38; }
.post-list-item h2 a:hover { color: #0f6b62; }

.post-nav { margin-top: 34px; font-size: .9rem; }
.post-nav .page-numbers {
	display: inline-block;
	padding: 6px 12px;
	margin-right: 6px;
	border: 1px solid #e4e9e8;
	border-radius: 6px;
	text-decoration: none;
	color: #31504c;
}
.post-nav .page-numbers.current { background: #0f6b62; color: #ffffff; border-color: #0f6b62; }

/* ---------- Editorial components ---------- */

/* Buttons */
.btn {
	display: inline-block;
	padding: 11px 22px;
	border-radius: 6px;
	text-decoration: none;
	font-weight: 600;
	font-size: .95rem;
}
.btn--primary { background: #0f6b62; color: #ffffff; }
.btn--primary:hover { background: #0a4f48; color: #ffffff; }
.btn--ghost { border: 1px solid #0f6b62; color: #0f6b62; }
.btn--ghost:hover { background: #f2f8f6; color: #0a4f48; }

/* Hero */
.hero {
	background: #f6faf9;
	border-bottom: 1px solid #e4e9e8;
	padding: 64px 0 58px;
}
.hero .wrap { max-width: 1080px; margin: 0 auto; padding: 0 24px; }
.hero h1 {
	font-size: 2.6rem;
	max-width: 720px;
	margin-bottom: 16px;
}
.hero p {
	max-width: 640px;
	font-size: 1.12rem;
	color: #31504c;
}

/* Section band */
.band {
	background: #f6faf9;
	border-top: 1px solid #e4e9e8;
	border-bottom: 1px solid #e4e9e8;
	padding: 46px 0;
	margin: 0;
}
.band .wrap { max-width: 1080px; margin: 0 auto; padding: 0 24px; }
.band h2 { margin-top: 0; }

/* Card grid */
.card-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 20px;
	margin: 1.4rem 0 2rem;
}
.card {
	background: #ffffff;
	border: 1px solid #e4e9e8;
	border-radius: 10px;
	padding: 24px;
}
.card h3 { margin: 0 0 10px; font-size: 1.12rem; }
.card p { margin-bottom: 12px; color: #4b5563; font-size: .95rem; }
.card .btn { margin-top: 4px; }

/* ---------- Comparison tables ---------- */

.hsc-table-wrap {
	overflow-x: auto;
	margin: 1.6rem 0 2rem;
	border: 1px solid #e4e9e8;
	border-radius: 10px;
}

table.hsc-table {
	width: 100%;
	border-collapse: collapse;
	font-size: .93rem;
	min-width: 620px;
}

table.hsc-table thead th {
	background: #143c38;
	color: #ffffff;
	text-align: left;
	padding: 13px 16px;
	font-family: Georgia, serif;
	letter-spacing: .01em;
	border-bottom: 2px solid #0f6b62;
}

table.hsc-table tbody th[scope="row"] {
	text-align: left;
	background: #f2f8f6;
	font-weight: 600;
	color: #143c38;
}

table.hsc-table td,
table.hsc-table th[scope="row"] {
	padding: 12px 16px;
	vertical-align: top;
}

table.hsc-table tbody tr:nth-child(even) td { background: #fafcfb; }
table.hsc-table tbody tr:nth-child(even) th[scope="row"] { background: #ecf4f1; }
table.hsc-table tbody tr:last-child td { border-bottom: 0; }

/* "Our pick" style highlight — visual only, never schema */
table.hsc-table col.hsc-pick,
table.hsc-table .hsc-pick { background: #f2f8f6; }

.pick-badge {
	display: inline-block;
	background: #0f6b62;
	color: #ffffff;
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .06em;
	padding: 3px 9px;
	border-radius: 4px;
	text-transform: uppercase;
	margin-bottom: 6px;
}

/* Pros / cons */
.pros-cons {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 18px;
	margin: 1.4rem 0 2rem;
}
.pros, .cons {
	border: 1px solid #e4e9e8;
	border-radius: 10px;
	padding: 20px 22px;
}
.pros { border-top: 4px solid #0f6b62; }
.cons { border-top: 4px solid #b08968; }
.pros h3, .cons h3 { margin: 0 0 10px; font-size: 1.02rem; }
.pros ul, .cons ul { margin: 0; padding-left: 1.15rem; font-size: .93rem; }
.pros li, .cons li { margin-bottom: 7px; }

/* Rating stars — editorial presentation only */
.hsc-rating {
	color: #b08968;
	letter-spacing: 2px;
	font-size: 1.05rem;
}
.hsc-rating .num {
	color: #143c38;
	font-weight: 700;
	letter-spacing: 0;
	margin-right: 6px;
}

/* Verdict / callout */
.verdict {
	background: #f2f8f6;
	border: 1px solid #d5e6e2;
	border-left: 5px solid #0f6b62;
	border-radius: 8px;
	padding: 20px 24px;
	margin: 1.8rem 0;
}
.verdict h3 { margin: 0 0 8px; }

/* Data note */
.data-note {
	font-size: .82rem;
	color: #6b7280;
	margin-top: -14px;
	margin-bottom: 1.6rem;
}

/* ---------- Footer ---------- */

.ac-footer {
	background: #143c38;
	color: #c9d8d5;
	margin-top: 0;
	font-size: .88rem;
}

.ac-footer-inner {
	max-width: 1080px;
	margin: 0 auto;
	padding: 44px 24px 30px;
	display: flex;
	flex-wrap: wrap;
	gap: 36px;
	justify-content: space-between;
}

.ac-footer-brand .brand-name {
	font-family: Georgia, serif;
	font-size: 1.18rem;
	color: #ffffff;
	margin: 0 0 4px;
}
.ac-footer-brand .brand-tag { margin: 0 0 12px; }

.footer-links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 26px;
}
.footer-links a { color: #c9d8d5; text-decoration: none; }
.footer-links a:hover { color: #ffffff; }

.footer-disclosure {
	max-width: 1080px;
	margin: 0 auto;
	padding: 0 24px 26px;
	border-bottom: 1px solid rgba(255,255,255,.14);
	color: #9db3af;
	font-size: .8rem;
	line-height: 1.55;
}

.ac-footer-bottom {
	max-width: 1080px;
	margin: 0 auto;
	padding: 18px 24px 26px;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: space-between;
	align-items: center;
}

.footer-legal { margin: 0; }

.ac-footer-legal-row { display: flex; gap: 20px; flex-wrap: wrap; }
.ac-footer-legal-row a { color: #9db3af; text-decoration: none; }
.ac-footer-legal-row a:hover { color: #ffffff; }

@media (max-width: 640px) {
	.ac-footer-bottom { flex-direction: column; align-items: flex-start; }
	h1 { font-size: 1.75rem; }
	.hero h1 { font-size: 1.95rem; }
}