/*
Theme Name: Smarter BI Theme
Theme URI: https://smarter-bi.com/
Author: Smarter BI
Author URI: https://smarter-bi.com/
Description: An editorial WordPress theme for practical AI and automation coverage, built as a child theme of Twenty Twenty-Five.
Template: twentytwentyfive
Requires at least: 6.7
Tested up to: 7.0
Requires PHP: 7.2
Version: 0.1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: smarterbi-theme
Tags: block-themes, full-site-editing, news, blog, custom-colors, accessibility-ready
*/

/*
 * Smarter BI's editorial design language is adapted from the sharp, structured
 * newspaper styling in /Users/pishty/ws/news/app/static/css/app.css. The palette,
 * WordPress selectors, and component treatment are original to this theme.
 */
:root {
	color-scheme: light;
	--sbi-paper: #eee1b9;
	--sbi-surface: #fff9e8;
	--sbi-surface-soft: #c9c0af;
	--sbi-ink: #10233f;
	--sbi-header-footer: transparent;
	--sbi-ink-soft: #3d5369;
	--sbi-muted: #5d6f7d;
	--sbi-line: #c7b788;
	--sbi-secondary: #0a6f67;
	--sbi-secondary-dark: #07524d;
	--sbi-tertiary: #9b432f;
	--sbi-tertiary-soft: #d9a17f;
	--sbi-success: #247a4d;
	--sbi-danger: #b4233c;
	--sbi-focus: #ffbf47;
	--sbi-space: clamp(1rem, 2vw, 1.5rem);
}

html {
	min-width: 15rem;
	background: var(--sbi-paper);
}

body {
	background-color: var(--sbi-paper);
	background-image:
		radial-gradient(ellipse at -8% 16%, rgb(105 72 24 / 15%) 0 4%, transparent 27%),
		radial-gradient(ellipse at 104% 58%, rgb(112 76 25 / 12%) 0 7%, transparent 31%),
		radial-gradient(ellipse at 39% 112%, rgb(126 87 31 / 10%) 0 5%, transparent 34%),
		radial-gradient(ellipse at 18% 43%, rgb(112 77 27 / 5%) 0 2%, transparent 14%),
		radial-gradient(ellipse at 71% 19%, rgb(255 250 224 / 16%) 0 3%, transparent 17%),
		radial-gradient(ellipse at 83% 81%, rgb(108 73 25 / 5%) 0 1%, transparent 13%),
		url("assets/images/rugged-newsprint.svg"),
		repeating-linear-gradient(2deg, rgb(82 57 22 / 1.8%) 0 1px, transparent 1px 6px),
		linear-gradient(117deg, rgb(255 250 224 / 38%), transparent 36%, rgb(121 83 31 / 6%) 73%, rgb(255 248 217 / 24%));
	background-position: 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 37px 19px, 0 0, 0 0;
	background-size: auto, auto, auto, auto, auto, auto, 720px 680px, auto, auto;
	color: var(--sbi-ink);
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1.6;
}

body,
button,
input,
select,
textarea {
	font-family: Arial, Helvetica, sans-serif;
}

h1,
h2,
.wp-block-post-title,
.wp-block-query-title,
.wp-block-site-title {
	color: var(--sbi-ink);
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 700;
	letter-spacing: -.025em;
	text-wrap: balance;
}

h1,
.wp-block-post-title {
	line-height: 1.02;
}

h3,
h4,
h5,
h6 {
	color: var(--sbi-ink);
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 750;
	letter-spacing: -.012em;
}

p,
dl,
ul,
ol {
	max-width: 75ch;
}

a {
	color: var(--sbi-secondary);
	text-decoration-color: rgb(0 127 115 / 42%);
	text-decoration-thickness: 1px;
	text-underline-offset: .16em;
}

a:hover {
	color: var(--sbi-ink);
	text-decoration-color: currentColor;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: .2rem solid var(--sbi-focus) !important;
	outline-offset: .2rem;
	box-shadow: none !important;
}

::selection {
	background: var(--sbi-tertiary-soft);
	color: var(--sbi-ink);
}

/* Header and primary navigation */
header.wp-block-template-part {
	position: relative;
	z-index: 20;
}

header.wp-block-template-part > .wp-block-group {
	border-bottom: .3rem solid var(--sbi-secondary);
	background: var(--sbi-header-footer) !important;
	color: var(--sbi-surface) !important;
}

header.wp-block-template-part :where(.wp-block-site-title, .wp-block-site-tagline, a, .wp-block-navigation-item__content) {
	color: var(--sbi-ink) !important;
}

header.wp-block-template-part .wp-block-site-title {
	font-size: clamp(1.45rem, 3vw, 2.15rem);
	letter-spacing: -.035em;
}

header.wp-block-template-part .wp-block-site-tagline {
	color: var(--sbi-muted) !important;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
}

header.wp-block-template-part .wp-block-navigation-item__content {
	border-bottom: 2px solid transparent;
	font-size: .9rem;
	font-weight: 700;
	text-decoration: none;
}

header.wp-block-template-part .wp-block-navigation-item__content:hover,
header.wp-block-template-part .current-menu-item > .wp-block-navigation-item__content {
	border-bottom-color: var(--sbi-secondary);
	color: var(--sbi-secondary-dark) !important;
}

header.wp-block-template-part .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--sbi-paper) !important;
	color: var(--sbi-ink) !important;
}

header.wp-block-template-part .wp-block-navigation__responsive-container-open,
header.wp-block-template-part .wp-block-navigation__responsive-container-close {
	color: var(--sbi-ink);
}

/* Homepage hero */
body.home main.wp-block-group {
	padding-top: 0;
	padding-bottom: 0;
}

.sbi-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	border-bottom: .4rem solid var(--sbi-secondary);
	background:
		radial-gradient(circle at 87% 16%, rgb(10 111 103 / 26%), transparent 22rem),
		linear-gradient(122deg, transparent 0 66%, rgb(255 255 255 / 3%) 66% 66.15%, transparent 66.15%),
		var(--sbi-ink);
	color: var(--sbi-surface);
}

.sbi-hero::before {
	position: absolute;
	z-index: -1;
	inset: 0;
	background-image:
		repeating-linear-gradient(90deg, transparent 0 calc(25% - 1px), rgb(255 249 232 / 5%) calc(25% - 1px) 25%),
		repeating-linear-gradient(0deg, transparent 0 5px, rgb(255 249 232 / 1.8%) 5px 6px);
	content: "";
	mask-image: linear-gradient(to right, transparent 8%, black 45%, black 92%, transparent);
	pointer-events: none;
}

.sbi-hero :where(p, h1, h2) {
	max-width: none;
}

.sbi-hero__inner {
	width: min(calc(100% - 2rem), 1280px);
	margin-inline: auto;
	padding: clamp(1rem, 2vw, 1.5rem) 0 0;
}

.sbi-hero__edition {
	margin: 0 0 clamp(3rem, 7vw, 6.5rem);
	padding-bottom: .75rem;
	border-bottom: 1px solid rgb(255 249 232 / 28%);
}

.sbi-hero__edition p,
.sbi-hero__eyebrow,
.sbi-hero__note,
.sbi-hero__brief-head p,
.sbi-hero__brief-foot,
.sbi-home-intro__label {
	margin: 0;
	font-size: .7rem;
	font-weight: 750;
	letter-spacing: .105em;
	line-height: 1.35;
	text-transform: uppercase;
}

.sbi-hero__edition p {
	color: rgb(255 249 232 / 72%);
}

.sbi-hero__edition strong,
.sbi-hero__eyebrow,
.sbi-hero__ticker strong {
	color: var(--sbi-tertiary-soft);
}

.sbi-hero__grid {
	display: grid !important;
	grid-template-columns: minmax(0, 1.55fr) minmax(19rem, .75fr);
	gap: clamp(2rem, 6vw, 6.5rem);
	align-items: end !important;
	margin-bottom: clamp(3rem, 7vw, 6rem) !important;
}

.sbi-hero__copy {
	align-self: center;
}

.sbi-hero__title {
	max-width: 10.8ch !important;
	margin: .25em 0 .3em;
	color: var(--sbi-surface);
	font-size: clamp(3.25rem, 6.6vw, 6.6rem);
	letter-spacing: -.055em;
	line-height: .92;
}

.sbi-hero__title em {
	color: var(--sbi-tertiary-soft);
	font-weight: inherit;
}

.sbi-hero__dek {
	max-width: 42rem !important;
	margin: 0 0 1.75rem;
	color: rgb(255 249 232 / 84%);
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(1.1rem, 1.65vw, 1.4rem);
	line-height: 1.5;
}

.sbi-hero__actions {
	gap: .75rem;
	margin-bottom: 1.4rem;
}

.sbi-hero .wp-element-button,
.sbi-hero .wp-block-button__link {
	padding: .85rem 1.2rem;
}

.sbi-hero .wp-block-button.is-style-outline > .wp-block-button__link {
	border-color: rgb(255 249 232 / 72%);
	color: var(--sbi-surface);
}

.sbi-hero .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	border-color: var(--sbi-surface);
	background: var(--sbi-surface);
	color: var(--sbi-ink);
}

.sbi-hero__note {
	color: rgb(255 249 232 / 48%);
}

.sbi-hero__brief {
	position: relative;
	padding: clamp(1.25rem, 3vw, 2rem);
	border-top: .45rem solid var(--sbi-tertiary);
	background: var(--sbi-surface-soft);
	box-shadow: .75rem .75rem 0 rgb(155 67 47 / 38%);
	color: var(--sbi-ink);
	font-kerning: normal;
	text-rendering: optimizeLegibility;
}

.sbi-hero__brief::after {
	position: absolute;
	right: 1rem;
	bottom: -1px;
	width: 3.5rem;
	height: .3rem;
	background: var(--sbi-secondary);
	content: "";
}

.sbi-hero__brief-head {
	margin-bottom: 1.35rem;
	padding-bottom: .65rem;
	border-bottom: 1px solid var(--sbi-ink);
}

.sbi-hero__brief-head p,
.sbi-hero__brief-foot {
	color: var(--sbi-ink-soft);
}

.sbi-hero__brief h2 {
	margin: 0 0 1.4rem;
	font-size: clamp(1.55rem, 2.35vw, 2.2rem);
	line-height: 1.02;
}

.sbi-hero__brief-item {
	display: grid !important;
	grid-template-columns: 2rem 1fr;
	gap: .75rem !important;
	align-items: start !important;
	padding: .8rem 0;
	border-top: 1px solid rgb(16 35 63 / 24%);
}

.sbi-hero__brief-item p {
	margin: 0;
	font-size: .88rem;
	line-height: 1.45;
}

.sbi-hero__brief-item > p:first-child {
	color: var(--sbi-tertiary);
	font-weight: 800;
}

.sbi-hero__brief-foot {
	margin-top: 1rem;
	padding-top: .8rem;
	border-top: .2rem solid var(--sbi-ink);
}

.sbi-hero__ticker {
	gap: .6rem clamp(1.1rem, 3vw, 2.4rem) !important;
	margin: 0;
	padding: 1.1rem 0 1.2rem;
	border-top: 1px solid rgb(255 249 232 / 28%);
}

.sbi-hero__ticker p {
	margin: 0;
	color: rgb(255 249 232 / 72%);
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .045em;
}

.sbi-home-intro {
	padding-block: clamp(3.75rem, 7vw, 6.5rem);
}

.sbi-home-intro__inner {
	width: min(calc(100% - 2rem), 1280px);
	margin-inline: auto;
}

.sbi-home-intro__header {
	display: grid !important;
	grid-template-columns: minmax(0, 1.35fr) minmax(18rem, .65fr);
	gap: clamp(2rem, 7vw, 7rem);
	align-items: end !important;
	margin-bottom: clamp(2.5rem, 5vw, 4.5rem) !important;
}

.sbi-home-intro__label {
	color: var(--sbi-tertiary);
}

.sbi-home-intro h2 {
	max-width: 19ch;
	margin: .45rem 0 0;
	font-size: clamp(2.4rem, 4.4vw, 4.3rem);
	line-height: .98;
}

.sbi-home-intro__summary {
	padding-left: clamp(1.25rem, 3vw, 2.25rem);
	border-left: .3rem solid var(--sbi-tertiary);
}

.sbi-home-intro__summary p {
	margin: 0;
	color: var(--sbi-ink-soft);
}

.sbi-home-intro__summary p + p {
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid var(--sbi-line);
	font-size: .85rem;
	font-weight: 700;
}

.sbi-home-pillars {
	gap: 0 !important;
	margin-bottom: 0 !important;
}

.sbi-home-pillar {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: clamp(1.35rem, 2.5vw, 2rem);
	border-top: .35rem solid var(--sbi-ink);
	border-right: 1px solid var(--sbi-line);
	border-bottom: 1px solid var(--sbi-line);
	background: rgb(255 249 232 / 46%);
}

.sbi-home-pillars > .wp-block-column:first-child .sbi-home-pillar {
	border-left: 1px solid var(--sbi-line);
}

.sbi-home-pillar::after {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 3.25rem;
	height: .28rem;
	background: var(--sbi-tertiary);
	content: "";
}

.sbi-home-pillar__number,
.sbi-home-pillar__focus {
	margin: 0;
	font-size: .68rem;
	font-weight: 800;
	letter-spacing: .09em;
	text-transform: uppercase;
}

.sbi-home-pillar__number {
	color: var(--sbi-tertiary);
}

.sbi-home-pillar h3 {
	max-width: 16ch;
	margin: 1.8rem 0 .7rem;
	font-size: clamp(1.35rem, 2vw, 1.75rem);
	line-height: 1.08;
}

.sbi-home-pillar > p:not([class]) {
	margin: 0 0 2.4rem;
	color: var(--sbi-ink-soft);
	font-size: .95rem;
	line-height: 1.6;
}

.sbi-home-pillar__focus {
	margin-top: auto;
	padding-top: .9rem;
	border-top: 1px solid var(--sbi-line);
	color: var(--sbi-muted);
}

.sbi-home-test {
	gap: .75rem clamp(1.25rem, 4vw, 4rem) !important;
	margin-top: 1.5rem;
	padding: 1rem 1.25rem;
	background: var(--sbi-ink);
}

.sbi-home-test p {
	margin: 0;
	color: rgb(255 249 232 / 72%);
	font-family: Georgia, "Times New Roman", serif;
	font-size: .95rem;
}

.sbi-home-test strong {
	color: var(--sbi-tertiary-soft);
	font-family: Arial, Helvetica, sans-serif;
	font-size: .68rem;
	letter-spacing: .1em;
}

/* Editorial rhythm */
main.wp-block-group {
	padding-top: clamp(2rem, 5vw, 4.5rem);
	padding-bottom: clamp(3rem, 7vw, 6rem);
}

.wp-block-post-content {
	font-size: clamp(1rem, 1.3vw, 1.1rem);
}

.wp-block-post-content > :where(p, ul, ol) {
	line-height: 1.72;
}

.wp-block-post-content > h2 {
	margin-top: 1.8em;
}

.wp-block-post-content > h3 {
	margin-top: 1.65em;
}

.wp-block-post-date,
.wp-block-post-author-name,
.wp-block-post-terms,
.wp-block-post-excerpt__more-text {
	color: var(--sbi-muted);
	font-size: .82rem;
}

.wp-block-post-terms a,
.taxonomy-category a,
.taxonomy-post_tag a {
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
}

/* Query loops become sharp editorial cards, echoing the source design. */
.wp-block-query .wp-block-post-template {
	gap: clamp(1rem, 2.5vw, 2rem);
}

.wp-block-query .wp-block-post {
	position: relative;
	padding: var(--sbi-space);
	border: 1px solid var(--sbi-line);
	border-top: .3rem solid var(--sbi-ink);
	background: rgb(255 255 255 / 62%);
}

.wp-block-query .wp-block-post::after {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 2.75rem;
	height: .3rem;
	background: var(--sbi-tertiary);
	content: "";
}

.wp-block-query .wp-block-post-title a {
	color: var(--sbi-ink);
	text-decoration-color: transparent;
}

.wp-block-query .wp-block-post-title a:hover {
	color: var(--sbi-secondary);
	text-decoration-color: currentColor;
}

.wp-block-post-featured-image img,
.wp-block-image img {
	border-radius: 0;
}

.wp-block-post-featured-image a:focus-visible img {
	outline: .2rem solid var(--sbi-focus);
	outline-offset: .2rem;
}

/* Buttons, forms, and utility blocks */
.wp-element-button,
.wp-block-button__link,
button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
	min-height: 2.75rem;
	padding: .65rem 1.1rem;
	border: 1px solid var(--sbi-secondary);
	border-radius: 0;
	background: var(--sbi-secondary);
	color: var(--sbi-surface);
	font-size: .88rem;
	font-weight: 700;
	letter-spacing: .015em;
	transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
}

.wp-element-button:hover,
.wp-block-button__link:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover {
	border-color: var(--sbi-secondary-dark);
	background: var(--sbi-secondary-dark);
	color: var(--sbi-surface);
}

.wp-block-button.is-style-outline > .wp-block-button__link {
	border: 2px solid var(--sbi-secondary);
	background: transparent;
	color: var(--sbi-secondary-dark);
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--sbi-secondary);
	color: var(--sbi-surface);
}

:where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
	min-height: 2.75rem;
	padding: .65rem .75rem;
	border: 1px solid var(--sbi-muted);
	border-radius: 0;
	background: rgb(255 255 255 / 78%);
	color: var(--sbi-ink);
}

:where(input, select, textarea):focus {
	border-color: var(--sbi-secondary);
	background: var(--sbi-surface);
}

.wp-block-search__button {
	margin-left: .4rem;
}

.wp-block-separator {
	border-top-color: var(--sbi-line);
}

.wp-block-separator.is-style-wide {
	border-top-width: .3rem;
	border-top-color: var(--sbi-ink);
}

.wp-block-quote {
	padding: 1rem 1.25rem;
	border-left: .35rem solid var(--sbi-tertiary);
	background: var(--sbi-surface-soft);
}

.wp-block-quote cite {
	color: var(--sbi-muted);
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
}

.wp-block-pullquote {
	border-top: .3rem solid var(--sbi-ink);
	border-bottom: .3rem solid var(--sbi-tertiary);
}

.wp-block-code,
pre {
	overflow-x: auto;
	border: 1px solid var(--sbi-line);
	border-radius: 0;
	background: var(--sbi-ink);
	color: #e6fff9;
}

code {
	color: var(--sbi-secondary-dark);
}

pre code,
.wp-block-code code {
	color: inherit;
}

.wp-block-table {
	border-top: .3rem solid var(--sbi-ink);
}

.wp-block-table table {
	border-collapse: collapse;
}

.wp-block-table th {
	background: var(--sbi-surface-soft);
	color: var(--sbi-ink);
	font-size: .75rem;
	letter-spacing: .055em;
	text-transform: uppercase;
}

.wp-block-table :where(th, td) {
	padding: .8rem .7rem;
	border-color: var(--sbi-line);
}

.wp-block-latest-posts li,
.wp-block-categories-list li {
	padding-block: .65rem;
	border-bottom: 1px solid var(--sbi-line);
}

.wp-block-query-pagination {
	padding-top: 1rem;
	border-top: 1px solid var(--sbi-line);
	font-size: .85rem;
	font-weight: 700;
}

/* Footer */
footer.wp-block-template-part > .wp-block-group {
	border-top: .3rem solid var(--sbi-secondary);
	background: var(--sbi-header-footer) !important;
	color: var(--sbi-ink-soft) !important;
}

footer.wp-block-template-part :where(h1, h2, h3, h4, p, a, .wp-block-site-title) {
	color: inherit;
}

footer.wp-block-template-part a:hover {
	color: var(--sbi-secondary-dark);
}

@media (max-width: 48rem) {
	header.wp-block-template-part > .wp-block-group {
		padding-top: 1rem !important;
		padding-bottom: 1rem !important;
	}

	.sbi-hero__inner {
		width: min(calc(100% - 1.5rem), 1280px);
	}

	.sbi-hero__edition {
		margin-bottom: 3.25rem;
	}

	.sbi-hero__edition p:last-child {
		display: none;
	}

	.sbi-hero__grid {
		grid-template-columns: 1fr;
		margin-bottom: 3rem !important;
	}

	.sbi-hero__title {
		font-size: clamp(3rem, 15vw, 4.8rem);
	}

	.sbi-hero__brief {
		box-shadow: .45rem .45rem 0 rgb(155 67 47 / 38%);
	}

	.sbi-hero__ticker {
		align-items: flex-start !important;
	}

	.sbi-home-intro__inner {
		width: min(calc(100% - 1.5rem), 1280px);
	}

	.sbi-home-intro__header {
		grid-template-columns: 1fr;
		gap: 1.75rem;
	}

	.sbi-home-intro__summary {
		padding-left: 1rem;
	}

	.sbi-home-pillar {
		border-left: 1px solid var(--sbi-line);
	}

	.sbi-home-test {
		align-items: flex-start !important;
	}

	.wp-block-query .wp-block-post {
		padding: 1rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
	}
}
