/*
 Theme Name:       MyoPeptide Sciences Hub
 Theme URI:        https://myopeptide.com
 Description:       A pixel-perfect, fully-configurable WordPress conversion of the MyoPeptide peptide-sciences research hub. Replicates the original static site's design 100% (colors, sizes, positions) and exposes background color, logo, site identity, footer company/contact/disclaimer/sitemap, author profiles, and category-driven navigation through the WordPress Customizer and Posts > Categories.
 Version:          2.2.0
 Requires at least: 6.0
 Tested up to:     6.6
 Requires PHP:     7.4
 Author:           MyoPeptide Sciences
 Author URI:       https://myopeptide.com
 License:          GPL-2.0-or-later
 License URI:      https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:      myopeptide
 Tags:             blog, news, education, research, custom-colors, custom-logo, featured-images, theme-options, footer-widgets
*/

/* The original design stylesheet (verbatim) is loaded from assets/css/theme.css.
   This file only carries the required WordPress theme header plus a few
   WordPress-specific layout helpers so the block/editor and alignment classes
   stay consistent with the design system. All visual styling lives in theme.css. */

.alignwide { max-width: var(--max-w); margin-left: auto; margin-right: auto; }
.alignfull { width: 100%; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: .85rem; color: var(--c-text-muted); text-align: center; }
.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); height: 1px; width: 1px; overflow: hidden; position: absolute !important; }
.sticky { }
.bypostauthor { }

/* Keep WordPress admin bar from overlapping the sticky nav */
body.admin-bar .navbar { top: 32px; }
@media (max-width: 782px) { body.admin-bar .navbar { top: 46px; } }

/* Configurable page hero (uses the dynamic brand colours from the Customizer) */
.page-hero { background: linear-gradient(135deg, var(--c-primary), var(--c-teal)); padding: 60px 0; text-align: center; color: #fff; }
.page-hero h1 { font-size: 2.5rem; font-weight: 800; margin-bottom: 10px; }
.page-hero p { font-size: 1.15rem; opacity: .9; max-width: 680px; margin: 0 auto; }

/* Procurement form success state toggled by JS */
.form-success.show { display: block; }

/* Author / team avatar fallback circle (matches the design) */
.avatar { border-radius: 50%; }

/* Team cards (About page) — mirrors the original inline styles */
.team-card { background: var(--c-white); border-radius: 12px; padding: 20px; text-align: center; border: 1px solid var(--c-border); transition: all .3s; }
.team-card:hover { transform: translateY(-3px); box-shadow: var(--c-card-shadow-hover); }
.team-card img { width: 80px; height: 80px; border-radius: 50%; object-fit: cover; margin: 0 auto 12px; }
.team-card h3 { font-size: 1.1rem; margin-bottom: 4px; }
.team-card .role { font-size: .85rem; color: var(--c-text-light); }
.team-card .years { font-size: .8rem; color: var(--c-text-muted); margin-top: 8px; }
.expand-btn { padding: 10px 28px; background: var(--c-white); border: 2px solid var(--c-primary); color: var(--c-primary); border-radius: 50px; font-weight: 700; cursor: pointer; transition: all .2s; }
.expand-btn:hover { background: var(--c-primary); color: #fff; }

/* ===== Site subtitle (hero eyebrow) ===== */
.hero-eyebrow {
	display: inline-block;
	margin-bottom: 18px;
	padding: 6px 16px;
	border: 1px solid rgba(255, 255, 255, .5);
	border-radius: 50px;
	font-size: .85rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #fff;
	background: rgba(255, 255, 255, .12);
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
}

/* ===== Site stats strip (simple horizontal cards) ===== */
.site-stats {
	background: var(--c-bg-alt);
	border-bottom: 1px solid var(--c-border);
	padding: 28px 0;
}
.stats-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}
.stat-card {
	background: var(--c-white);
	border-radius: var(--radius);
	box-shadow: var(--c-card-shadow);
	transition: all .3s;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	padding: 20px 18px;
	border-left: 3px solid var(--c-teal);
}
.stat-card:hover {
	box-shadow: var(--c-card-shadow-hover);
	transform: translateY(-3px);
}
.stat-num {
	font-size: 1.9rem;
	font-weight: 800;
	color: var(--c-primary);
	line-height: 1;
}
.stat-label {
	font-size: .9rem;
	font-weight: 600;
	color: var(--c-text-muted);
	line-height: 1.3;
}
@media (max-width: 768px) {
	.stats-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ===== Pagination ===== */
.myopeptide-pagination {
	text-align: center;
	margin: 36px 0 8px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
}
.myopeptide-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 14px;
	border: 1px solid var(--c-border);
	border-radius: 50px;
	color: var(--c-primary);
	font-weight: 600;
	font-size: .92rem;
	text-decoration: none;
	background: var(--c-white);
	box-shadow: var(--c-card-shadow);
	transition: all .2s;
}
.myopeptide-pagination .page-numbers:hover {
	background: var(--c-teal-soft);
	border-color: var(--c-teal);
	color: var(--c-primary);
	transform: translateY(-2px);
}
.myopeptide-pagination .page-numbers.current {
	background: linear-gradient(135deg, var(--c-primary), var(--c-teal));
	color: #fff;
	border-color: transparent;
	box-shadow: 0 4px 14px rgba(10, 77, 140, .25);
	cursor: default;
}
.myopeptide-pagination .page-numbers.current:hover {
	transform: none;
}
.myopeptide-pagination .page-numbers.dots {
	border: none; background: none; box-shadow: none; color: var(--c-text-muted); min-width: 24px; padding: 0; }
