/*
Theme Name:   AIMPLE AI Blog
Theme URI:    https://aimple.ai/blogs/
Description:  Child theme of Twenty Twenty-Five that makes aimple.ai/blogs look like aimple.ai. Design tokens come from frontend-monorepo (tailwind primary scale, landing Navigation.jsx and Footer.jsx).
Author:       AIMPLE AI
Template:     twentytwentyfive
Version:      1.0.0
Requires at least: 6.6
Requires PHP: 8.0
Text Domain:  aimple-blog
*/

/* Everything expressible as a token lives in theme.json. This file only holds
   what theme.json cannot express: the sticky frosted header, the pill nav,
   post cards, and a few chips. */

/* ── Header ────────────────────────────────────────────────────────────── */
.aimple-site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	border-bottom: 1px solid transparent;
	transition: box-shadow 0.3s ease, border-color 0.3s ease;
}
/* The frosted glass lives on a pseudo-element: backdrop-filter on the header
   itself would make it the containing block for the mobile menu overlay
   (position: fixed) and trap the overlay inside the 72px bar. */
.aimple-site-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgba(255, 255, 255, 0.85);
	-webkit-backdrop-filter: saturate(180%) blur(16px);
	backdrop-filter: saturate(180%) blur(16px);
}
.aimple-site-header.is-scrolled {
	border-bottom-color: rgba(11, 31, 68, 0.06);
	box-shadow: 0 4px 24px rgba(11, 31, 68, 0.08);
}
.admin-bar .aimple-site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .aimple-site-header { top: 46px; } }

.aimple-header__bar { min-height: 72px; gap: 1rem; }
.aimple-logo { margin: 0; line-height: 0; }
.aimple-logo img { height: 60px; width: auto; display: block; }

/* Pill navigation — mirrors Navigation.jsx on the main site. */
.aimple-nav .wp-block-navigation__container {
	background: rgba(255, 255, 255, 0.9);
	border: 1px solid rgba(0, 0, 0, 0.07);
	border-radius: 9999px;
	padding: 5px;
	gap: 2px;
	box-shadow: 0 8px 32px rgba(11, 31, 68, 0.07), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.aimple-nav .wp-block-navigation-item__content {
	position: relative;
	padding: 0.45rem 0.8rem !important;
	border-radius: 9999px;
	color: rgba(11, 31, 68, 0.75);
	transition: color 0.2s ease;
}
.aimple-nav .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--contrast); text-decoration: none; }
.aimple-nav .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0.8rem; right: 0.8rem; bottom: 1px;
	height: 2px;
	border-radius: 9999px;
	background: var(--wp--preset--color--brand);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.3s ease;
}
.aimple-nav .wp-block-navigation-item__content:hover::after,
.aimple-nav .is-current .wp-block-navigation-item__content::after { transform: scaleX(1); }
.aimple-nav .is-current .wp-block-navigation-item__content { color: var(--wp--preset--color--brand); font-weight: 600; }

/* Mobile overlay: plain list, no pill. */
.aimple-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	background: none; border: 0; box-shadow: none; padding: 0; gap: 0.5rem;
}
.aimple-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.125rem; }
/* Pricing has its own pill on desktop; in the menu it mirrors MOBILE_LANDING_LINKS. */
.aimple-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .aimple-mobile-only { display: none; }

.aimple-header__actions { gap: 0.5rem; }
.aimple-header__actions .wp-block-button__link { white-space: nowrap; font-size: 0.875rem; padding: 0.6rem 1.1rem; }
.aimple-btn-cta .wp-block-button__link { box-shadow: 0 8px 22px rgba(49, 110, 185, 0.32); }
.aimple-btn-cta .wp-block-button__link:hover { box-shadow: 0 12px 28px rgba(49, 110, 185, 0.42); }
.is-style-outline.aimple-btn-ghost .wp-block-button__link {
	border: 1px solid rgba(49, 110, 185, 0.35);
	color: var(--wp--preset--color--brand);
	background: transparent;
}
.is-style-outline.aimple-btn-ghost .wp-block-button__link:hover { background: rgba(49, 110, 185, 0.06); }

@media (max-width: 781px) {
	.aimple-logo img { height: 40px; }
	.aimple-header .aimple-btn-ghost { display: none; }
}

/* ── Chips ─────────────────────────────────────────────────────────────── */
.aimple-eyebrow {
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding: 0.2rem 0.75rem;
	border-radius: 9999px;
	background: var(--wp--preset--color--brand-tint);
	border: 1px solid rgba(49, 110, 185, 0.18);
	color: var(--wp--preset--color--brand);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	line-height: 1.8;
}
.aimple-chip { font-size: 0.6875rem; line-height: 1; }
.aimple-chip a,
.aimple-chip .wp-block-post-terms__separator + a {
	display: inline-block;
	padding: 0.35rem 0.6rem;
	border-radius: 9999px;
	background: var(--wp--preset--color--brand-tint);
	color: var(--wp--preset--color--brand);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}
.aimple-chip a:hover { text-decoration: none; background: #dce9f6; }
.aimple-chip .wp-block-post-terms__separator { display: none; }

/* ── Blog hero ─────────────────────────────────────────────────────────── */
.aimple-hero {
	background:
		radial-gradient(900px 360px at 12% -20%, #eff5fb 0%, rgba(239, 245, 251, 0) 70%),
		radial-gradient(700px 320px at 95% 0%, #f2f6ff 0%, rgba(242, 246, 255, 0) 70%),
		linear-gradient(180deg, #f7f9fd 0%, #ffffff 100%);
}
.aimple-hero .aimple-lede { max-width: 60ch; }

/* ── Post cards ────────────────────────────────────────────────────────── */
.aimple-card {
	height: 100%;
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 16px;
	overflow: hidden;
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.aimple-card:hover {
	transform: translateY(-3px);
	border-color: rgba(49, 110, 185, 0.25);
	box-shadow: 0 14px 34px rgba(11, 31, 68, 0.08);
}
.aimple-card .wp-block-post-featured-image { margin: 0; }
.aimple-card .wp-block-post-featured-image img { border-radius: 0; }
.aimple-card__body { padding: 1.25rem 1.35rem 1.4rem; }
.aimple-card .wp-block-post-title { margin-top: 0.75rem; }
.aimple-card .wp-block-post-excerpt__excerpt { margin: 0; }
@media (prefers-reduced-motion: reduce) {
	.aimple-card, .aimple-card:hover { transition: none; transform: none; }
}

.wp-block-query-pagination { font-weight: 600; }
.wp-block-query-pagination .page-numbers.current { color: var(--wp--preset--color--brand); }

/* ── Single post ───────────────────────────────────────────────────────── */
.aimple-backlink a { font-size: 0.875rem; font-weight: 600; }
.aimple-meta { color: var(--wp--preset--color--muted); gap: 0.5rem; font-size: 0.8125rem; }
.aimple-meta > * { margin: 0 !important; }
.aimple-dot { color: #c3cad8; }
.aimple-featured img { border-radius: 20px; }
.aimple-prose { font-size: 1.125rem; line-height: 1.8; }
.aimple-prose > * + h2 { margin-top: 2.5rem; }
.aimple-prose > * + h3 { margin-top: 2rem; }
.aimple-prose img { border-radius: 14px; }
.aimple-prose .wp-block-table { margin: 1.75rem 0; overflow-x: auto; }
.aimple-prose table { width: 100%; border-collapse: collapse; font-size: 0.95rem; line-height: 1.5; }
.aimple-prose th, .aimple-prose td { border: 1px solid var(--wp--preset--color--border); padding: 0.65rem 0.8rem; text-align: left; vertical-align: top; }
.aimple-prose th { background: var(--wp--preset--color--brand-tint); color: var(--wp--preset--color--contrast); font-weight: 700; }
.aimple-prose code { font-size: 0.85em; background: var(--wp--preset--color--surface-2); border-radius: 6px; padding: 0.1em 0.35em; word-break: break-word; }
.aimple-prose .wp-block-quote { border-left: 4px solid var(--wp--preset--color--brand); background: var(--wp--preset--color--surface); border-radius: 0 14px 14px 0; padding: 1rem 1.25rem; margin: 1.75rem 0; font-style: normal; }
.aimple-prose .wp-block-quote p { margin: 0.4rem 0; }
.aimple-prose li + li { margin-top: 0.35rem; }

.aimple-cta {
	border-radius: 24px;
	background:
		radial-gradient(600px 240px at 90% 0%, rgba(245, 166, 35, 0.18), transparent 60%),
		linear-gradient(135deg, #316eb9 0%, #2a5c9b 55%, #1e4571 100%);
	color: #fff;
	box-shadow: 0 20px 50px rgba(30, 69, 113, 0.25);
}
.aimple-cta h2, .aimple-cta h3, .aimple-cta p { color: #fff; }
.aimple-cta p { opacity: 0.9; }
.aimple-cta .wp-block-button__link { background: #fff; color: var(--wp--preset--color--brand); }
.aimple-cta .wp-block-button__link:hover { background: #eff5fb; color: var(--wp--preset--color--brand-dark); }

/* ── Footer ────────────────────────────────────────────────────────────── */
.aimple-footer { background: var(--wp--preset--color--surface); }
.aimple-footer .aimple-accent { color: var(--wp--preset--color--brand); }
.aimple-collabel {
	margin: 0;
	color: var(--wp--preset--color--muted);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}
.aimple-footer-links { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.7rem; }
.aimple-footer-links a,
.aimple-footer-contact a,
.aimple-footer-contact p,
.aimple-legal a { color: var(--wp--preset--color--muted); font-size: 0.9375rem; }
.aimple-footer-links a:hover,
.aimple-footer-contact a:hover,
.aimple-legal a:hover { color: var(--wp--preset--color--brand); text-decoration: none; }
.aimple-footer-contact { display: grid; gap: 0.7rem; }
.aimple-footer-contact a,
.aimple-footer-contact p { display: flex; align-items: center; gap: 0.6rem; margin: 0; }
.aimple-footer-contact svg { flex: none; color: var(--wp--preset--color--brand); }
/* Newsletter pill form — Footer.jsx on the main site. */
.aimple-newsletter { max-width: 420px; }
.aimple-newsletter__title { margin: 0 0 0.75rem; font-size: 1.125rem; font-weight: 600; color: var(--wp--preset--color--contrast); }
.aimple-newsletter__form {
	display: flex; align-items: center; gap: 0.5rem;
	background: #fff; border-radius: 9999px; padding: 6px 6px 6px 20px;
	box-shadow: 0 10px 30px rgba(11, 31, 68, 0.06);
}
.aimple-newsletter__form input[type="email"] {
	flex: 1; min-width: 0; border: 0; background: transparent; outline: none;
	font: inherit; font-size: 0.9375rem; color: var(--wp--preset--color--contrast);
}
.aimple-newsletter__form input[type="email"]::placeholder { color: #9aa3b5; }
.aimple-newsletter__form button {
	flex: none; height: 40px; padding: 0 1.25rem; border: 0; border-radius: 9999px; cursor: pointer;
	background: var(--wp--preset--color--brand); color: #fff; font: inherit; font-size: 0.875rem; font-weight: 600;
}
.aimple-newsletter__form button:hover { opacity: 0.9; }
.aimple-newsletter__form:focus-within { box-shadow: 0 0 0 2px rgba(49, 110, 185, 0.35), 0 10px 30px rgba(11, 31, 68, 0.06); }
.aimple-newsletter__note { margin: 0.6rem 0 0 0.25rem; font-size: 0.8125rem; color: var(--wp--preset--color--muted); }
@media (max-width: 480px) {
	.aimple-newsletter__form { flex-direction: column; align-items: stretch; border-radius: 16px; padding: 12px; }
	.aimple-newsletter__form button { width: 100%; }
}
.aimple-social { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.aimple-social a {
	display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px;
	border-radius: 9999px; background: #eef1f8; border: 1px solid var(--wp--preset--color--border);
	color: var(--wp--preset--color--brand); transition: background-color 0.2s ease, color 0.2s ease;
}
.aimple-social a:hover { background: var(--wp--preset--color--brand); color: #fff; }
.aimple-bottom { border-top: 1px solid var(--wp--preset--color--border); }
.aimple-bottom p { margin: 0; color: var(--wp--preset--color--muted); font-size: 0.8125rem; }
.aimple-legal { display: flex; gap: 1.5rem; }
.aimple-legal a { font-size: 0.8125rem; }

/* ── Author box ───────────────────────────────────────────────────────── */
.aimple-author {
	display: flex; gap: 1.25rem; align-items: flex-start;
	margin: 3rem 0 0; padding: 1.5rem 1.6rem;
	background: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--border); border-radius: 20px;
}
.aimple-author__avatar {
	flex: none; width: 64px; height: 64px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: linear-gradient(135deg, #316eb9, #2a5c9b); color: #fff;
	font-family: var(--wp--preset--font-family--geist); font-weight: 700; font-size: 1.3rem; letter-spacing: 0.02em;
}
.aimple-author__body > * { margin: 0; }
.aimple-author__label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.aimple-author__name { font-size: 1.2rem; font-weight: 700; color: var(--wp--preset--color--contrast); margin-top: 0.15rem !important; }
.aimple-author__name a { color: inherit; }
.aimple-author__title { color: var(--wp--preset--color--brand); font-weight: 600; font-size: 0.9rem; margin-top: 0.1rem !important; }
.aimple-author__bio { color: var(--wp--preset--color--muted); font-size: 0.98rem; line-height: 1.65; margin-top: 0.65rem !important; }
.aimple-author__more { margin-top: 0.75rem !important; font-size: 0.9rem; font-weight: 600; }
.aimple-author--archive { background: none; border: 0; padding: 0; margin: 0; max-width: 60rem; }
.aimple-author--archive .aimple-author__avatar { width: 84px; height: 84px; font-size: 1.7rem; }
.aimple-author--archive .aimple-author__name { font-family: var(--wp--preset--font-family--geist); font-size: clamp(2rem, 1.4rem + 2.5vw, 3rem); letter-spacing: -0.025em; line-height: 1.1; }
.aimple-author--archive .aimple-author__title { font-size: 1rem; margin-top: 0.4rem !important; }
.aimple-author--archive .aimple-author__bio { font-size: 1.1rem; max-width: 60ch; }
@media (max-width: 600px) { .aimple-author { flex-direction: column; } }

/* Visually hidden, still announced (block themes do not always ship this). */
.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0;
	position: absolute !important; word-wrap: normal !important;
}