/* =============================================
   Paint it Black — Base Reset & Typography
   Dark theme v2 defaults.
   ============================================= */

/* ---- Body defaults ---- */
body {
	font-family: var(--mic-font-body);
	font-size: var(--mic-text-base);
	line-height: var(--mic-leading-normal);
	color: var(--mic-text-primary);
	background-color: var(--mic-bg-page);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

/* ---- Light mode for standard WordPress pages (non-Template Team) ---- */
body:not(.pib-template-team) {
	background-color: #FFFFFF;
	color: #333333;
}

body:not(.pib-template-team) h1,
body:not(.pib-template-team) h2,
body:not(.pib-template-team) h3,
body:not(.pib-template-team) h4,
body:not(.pib-template-team) h5,
body:not(.pib-template-team) h6 {
	color: #1a1a1a;
}

body:not(.pib-template-team) small {
	color: #666666;
}

body:not(.pib-template-team) blockquote {
	background: #f5f5f5;
	border-left-color: var(--mic-yellow);
	color: #333333;
}

body:not(.pib-template-team) code {
	background: #f0f0f0;
}

body:not(.pib-template-team) pre {
	background: #f5f5f5;
	color: #333333;
	border-color: #e0e0e0;
}

body:not(.pib-template-team) hr {
	border-top-color: #e0e0e0;
}

/* ---- Heading hierarchy ---- */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--mic-font-display);
	line-height: var(--mic-leading-tight);
	letter-spacing: -0.02em;
	color: var(--mic-text-primary);
	margin-top: 0;
}

h1 {
	font-size: var(--mic-text-5xl);
	font-weight: var(--mic-font-extrabold);
}

h2 {
	font-size: var(--mic-text-4xl);
	font-weight: var(--mic-font-bold);
}

h3 {
	font-size: var(--mic-text-3xl);
	font-weight: var(--mic-font-bold);
}

h4 {
	font-size: var(--mic-text-2xl);
	font-weight: var(--mic-font-semibold);
}

h5 {
	font-size: var(--mic-text-xl);
	font-weight: var(--mic-font-semibold);
}

h6 {
	font-size: var(--mic-text-lg);
	font-weight: var(--mic-font-semibold);
}

/* ---- Paragraphs ---- */
p {
	margin-top: 0;
	margin-bottom: var(--mic-space-4);
	line-height: var(--mic-leading-relaxed);
}

/* ---- Links ---- */
a {
	color: var(--mic-purple);
	text-decoration: none;
	transition: color var(--mic-transition-fast);
}

a:hover {
	color: var(--mic-purple-hover);
}

/* ---- Small text ---- */
small {
	font-size: var(--mic-text-sm);
	color: var(--mic-text-muted);
}

/* ---- Strong & emphasis ---- */
strong, b {
	font-weight: var(--mic-font-semibold);
}

/* ---- Lists ---- */
ul, ol {
	padding-left: var(--mic-space-6);
	margin-bottom: var(--mic-space-4);
}

li {
	margin-bottom: var(--mic-space-2);
	line-height: var(--mic-leading-relaxed);
}

/* ---- Blockquote ---- */
blockquote {
	border-left: 4px solid var(--mic-yellow);
	padding: var(--mic-space-4) var(--mic-space-6);
	margin: var(--mic-space-6) 0;
	background: var(--mic-bg-card);
	border-radius: 0 var(--mic-radius-md) var(--mic-radius-md) 0;
	font-style: italic;
	color: var(--mic-text-secondary);
}

/* ---- Code ---- */
code {
	font-family: 'JetBrains Mono', 'Fira Code', monospace;
	font-size: var(--mic-text-sm);
	background: var(--mic-bg-card);
	padding: 0.15em 0.4em;
	border-radius: var(--mic-radius-sm);
	color: var(--mic-purple);
}

pre {
	background: var(--mic-bg-card);
	color: var(--mic-text-secondary);
	padding: var(--mic-space-6);
	border-radius: var(--mic-radius-lg);
	overflow-x: auto;
	margin-bottom: var(--mic-space-6);
	border: 1px solid var(--mic-border-subtle);
}

pre code {
	background: none;
	padding: 0;
	color: inherit;
	font-size: var(--mic-text-sm);
}

/* ---- Horizontal rule ---- */
hr {
	border: none;
	border-top: 1px solid var(--mic-border);
	margin: var(--mic-space-8) 0;
}

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

/* ---- Selection highlight ---- */
::selection {
	background: var(--mic-yellow);
	color: var(--mic-black);
}

/* ---- Focus visible (accessibility) ---- */
:focus-visible {
	outline: 2px solid var(--mic-purple);
	outline-offset: 2px;
}

/* ---- Responsive typography ---- */
@media (max-width: 768px) {
	h1 { font-size: var(--mic-text-4xl); }
	h2 { font-size: var(--mic-text-3xl); }
	h3 { font-size: var(--mic-text-2xl); }
	h4 { font-size: var(--mic-text-xl); }
}

@media (max-width: 480px) {
	h1 { font-size: var(--mic-text-3xl); }
	h2 { font-size: var(--mic-text-2xl); }
	h3 { font-size: var(--mic-text-xl); }
}