/**
 * GENE Blocks Studio — `white` aesthetic.
 *
 * WordPress-core-theme simplicity (Twenty Twenty-Five vibe): light surfaces,
 * generous whitespace, a clean sans, hairline rules, and a restrained palette
 * accent on links/buttons. Image-free by design — fast and self-contained.
 * Mainly the free tier's only design; also offered as a third design in Studio.
 * All rules scoped under `.gene-aesthetic--white`.
 */

.gene-aesthetic--white {
	--wt-paper: #ffffff;
	--wt-surface: #f7f8fa;
	--wt-ink: #1a1d21;
	--wt-ink-soft: #5b6470;
	--wt-line: #e5e8ec;
	--wt-accent: var(--gene-accent, #2563eb);
	--wt-accent-strong: var(--gene-accent-strong, #1d4ed8);
	--wt-on-accent: var(--gene-on-accent, #ffffff);

	color: var(--wt-ink);
	background: var(--wt-paper);
}

.gene-aesthetic--white :where(h1, h2, h3, h4).wp-block-heading {
	color: var(--wt-ink) !important;
	font-weight: 600 !important;
	letter-spacing: -0.012em !important;
	line-height: 1.18 !important;
}
.gene-aesthetic--white h1.wp-block-heading {
	font-size: clamp(2.1rem, 4vw, 3.1rem) !important;
}
.gene-aesthetic--white h2.wp-block-heading {
	font-size: clamp(1.6rem, 2.6vw, 2.1rem) !important;
}
.gene-aesthetic--white h3.wp-block-heading {
	font-size: 1.12rem !important;
	font-weight: 600 !important;
}
.gene-aesthetic--white p { color: var(--wt-ink-soft); }

/* Eyebrow / kicker — small caps, accent. */
.gene-aesthetic--white .gene-wt-eyebrow {
	margin: 0 0 1rem;
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wt-accent);
}

.gene-aesthetic--white .gene-wt-lead {
	max-width: 620px;
	margin-inline: auto;
	font-size: 1.1rem;
	line-height: 1.7;
	color: var(--wt-ink-soft);
}

/* Buttons — modest radius, accent solid / hairline outline. */
.gene-aesthetic--white .wp-block-button__link {
	border-radius: 6px !important;
	padding: 0.7em 1.4em !important;
	font-weight: 500;
	font-size: 0.95rem;
	border: 1px solid transparent;
}
.gene-aesthetic--white .gene-wt-btn--solid .wp-block-button__link {
	background: var(--wt-accent) !important;
	color: var(--wt-on-accent) !important;
	border-color: var(--wt-accent) !important;
}
.gene-aesthetic--white .gene-wt-btn--solid .wp-block-button__link:hover {
	background: var(--wt-accent-strong) !important;
	border-color: var(--wt-accent-strong) !important;
}
.gene-aesthetic--white .gene-wt-btn--outline .wp-block-button__link {
	background: transparent !important;
	color: var(--wt-ink) !important;
	border-color: var(--wt-line) !important;
}
.gene-aesthetic--white .gene-wt-btn--outline .wp-block-button__link:hover {
	border-color: var(--wt-accent) !important;
	color: var(--wt-accent) !important;
}
.gene-aesthetic--white .wp-block-buttons { gap: 0.7rem; }

/* ============================================================
   Header
   ============================================================ */
.gene-aesthetic--white.gene-wt-header {
	background: var(--wt-paper);
	border-bottom: 1px solid var(--wt-line);
}
.gene-aesthetic--white .gene-wt-header-row { align-items: center; gap: 1rem; }
.gene-aesthetic--white .gene-wt-brand {
	margin: 0;
	font-weight: 700;
	font-size: 1.1rem;
	color: var(--wt-ink);
}
.gene-aesthetic--white .gene-wt-nav { gap: 1.6rem; flex-wrap: wrap; }
.gene-aesthetic--white .gene-wt-navlink {
	margin: 0;
	font-size: 0.95rem;
	color: var(--wt-ink-soft);
}
.gene-aesthetic--white .gene-wt-header .wp-block-button__link { padding: 0.55em 1.1em !important; }

/* ============================================================
   Hero — centered, image-free, lots of air.
   ============================================================ */
.gene-aesthetic--white.gene-wt-hero { background: var(--wt-paper); text-align: center; }
.gene-aesthetic--white .gene-wt-hero .wp-block-buttons { justify-content: center; margin-top: 2rem; }

/* ============================================================
   Cards (services) & feature grid
   ============================================================ */
.gene-aesthetic--white.gene-wt-services { background: var(--wt-surface); }
.gene-aesthetic--white .gene-wt-cards,
.gene-aesthetic--white .gene-wt-featgrid,
.gene-aesthetic--white .gene-wt-valgrid,
.gene-aesthetic--white .gene-wt-quotegrid { gap: 1.5rem; }
.gene-aesthetic--white .gene-wt-card,
.gene-aesthetic--white .gene-wt-valcard {
	height: 100%;
	background: var(--wt-paper);
	border: 1px solid var(--wt-line);
	border-radius: 10px;
	padding: 1.6rem 1.5rem;
}
.gene-aesthetic--white .gene-wt-card h3,
.gene-aesthetic--white .gene-wt-valcard h3,
.gene-aesthetic--white .gene-wt-feat h3 { margin: 0 0 0.5rem; }
.gene-aesthetic--white .gene-wt-card p,
.gene-aesthetic--white .gene-wt-valcard p,
.gene-aesthetic--white .gene-wt-feat p { margin: 0; line-height: 1.6; }

.gene-aesthetic--white .gene-wt-feat-k {
	margin: 0 0 0.6rem;
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--wt-accent);
}

/* ============================================================
   Testimonials
   ============================================================ */
.gene-aesthetic--white .gene-wt-quote {
	height: 100%;
	background: var(--wt-surface);
	border: 1px solid var(--wt-line);
	border-radius: 10px;
	padding: 1.6rem 1.5rem;
}
.gene-aesthetic--white .gene-wt-quote-text {
	margin: 0 0 0.9rem;
	color: var(--wt-ink);
	font-size: 1.02rem;
	line-height: 1.6;
}
.gene-aesthetic--white .gene-wt-quote-name {
	margin: 0;
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--wt-ink-soft);
}

/* ============================================================
   CTA band
   ============================================================ */
.gene-aesthetic--white.gene-wt-cta { background: var(--wt-surface); text-align: center; }
.gene-aesthetic--white .gene-wt-cta .wp-block-buttons { justify-content: center; }

/* ============================================================
   Story / values intro centering
   ============================================================ */
.gene-aesthetic--white.gene-wt-story p { margin-inline: auto; max-width: 640px; }

/* ============================================================
   Team — initials-free circle placeholder (CSS only, no image).
   ============================================================ */
.gene-aesthetic--white .gene-wt-roster { gap: 1.5rem; text-align: center; }
.gene-aesthetic--white .gene-wt-avatar {
	width: 84px;
	height: 84px;
	margin: 0 auto 1rem;
	border-radius: 50%;
	background: var(--wt-surface);
	border: 1px solid var(--wt-line);
}
.gene-aesthetic--white .gene-wt-name { margin: 0; font-weight: 600; color: var(--wt-ink); }
.gene-aesthetic--white .gene-wt-role { margin: 0.1rem 0 0; font-size: 0.9rem; color: var(--wt-ink-soft); }

/* ============================================================
   Contact (details only — no form, so it works in the free tier)
   ============================================================ */
.gene-aesthetic--white.gene-wt-contact { background: var(--wt-paper); text-align: center; }
.gene-aesthetic--white .gene-wt-contact-details {
	margin-top: 2rem;
	display: grid;
	gap: 0.6rem;
}
.gene-aesthetic--white .gene-wt-contact-line {
	margin: 0;
	font-size: 1.02rem;
	color: var(--wt-ink);
}

/* ============================================================
   Footer
   ============================================================ */
.gene-aesthetic--white.gene-wt-footer {
	background: var(--wt-paper);
	border-top: 1px solid var(--wt-line);
}
.gene-aesthetic--white .gene-wt-foot-brand { margin: 0 0 0.5rem; font-weight: 700; color: var(--wt-ink); }
.gene-aesthetic--white .gene-wt-foot-note { margin: 0; font-size: 0.9rem; color: var(--wt-ink-soft); max-width: 320px; }
.gene-aesthetic--white .gene-wt-foot-h {
	margin: 0 0 0.6rem;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wt-ink);
}
.gene-aesthetic--white .gene-wt-foot-link { margin: 0.2rem 0; font-size: 0.92rem; color: var(--wt-ink-soft); }

/* Posts — latest articles band (core/latest-posts). Light cards. */
.gene-aesthetic--white.gene-wt-posts { background: var(--wt-surface); }
.gene-aesthetic--white .wp-block-latest-posts.is-grid {
	list-style: none; padding: 0; margin: 2.5rem 0 0;
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.75rem;
}
.gene-aesthetic--white .wp-block-latest-posts.is-grid > li {
	margin: 0; background: var(--wt-paper); border: 1px solid var(--wt-line);
	border-radius: 12px; overflow: hidden;
}
.gene-aesthetic--white .wp-block-latest-posts__featured-image img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
.gene-aesthetic--white .wp-block-latest-posts__post-title { display: block; padding: 1.1rem 1.3rem 0; color: var(--wt-ink); font-weight: 700; font-size: 1.05rem; text-decoration: none; line-height: 1.35; }
.gene-aesthetic--white .wp-block-latest-posts__post-title:hover { color: var(--wt-accent); }
.gene-aesthetic--white .wp-block-latest-posts__post-date { display: block; padding: 0.4rem 1.3rem 0; font-size: 0.78rem; color: var(--wt-ink-soft); }
.gene-aesthetic--white .wp-block-latest-posts__post-excerpt { padding: 0.5rem 1.3rem 1.3rem; margin: 0; color: var(--wt-ink-soft); font-size: 0.92rem; line-height: 1.6; }
@media (max-width: 781px) {
	.gene-aesthetic--white .wp-block-latest-posts.is-grid { grid-template-columns: 1fr; }
}

/* Internal links inside nav / footer / brand inherit their text styling. */
.gene-aesthetic--white .gene-wt-brand a, .gene-aesthetic--white .gene-wt-navlink a, .gene-aesthetic--white .gene-wt-foot-link a { color: inherit; text-decoration: none; }
/* Mobile: long emails / URLs in footer & contact lines wrap instead of overflowing. */
.gene-aesthetic--white .gene-wt-foot-link, .gene-aesthetic--white .gene-wt-foot-link a, .gene-aesthetic--white .gene-wt-contact-line { overflow-wrap: break-word; }
.gene-aesthetic--white .gene-wt-navlink a:hover, .gene-aesthetic--white .gene-wt-foot-link a:hover { color: var(--wt-accent); }

/* ============================================================
   Extra sections (Studio business types): pageintro / stats / hours / qa
   ============================================================ */
/* Page intro — slim sub-page header */
.gene-aesthetic--white.gene-wt-pageintro { background: var(--wt-paper); border-bottom: 1px solid var(--wt-line); }
.gene-aesthetic--white .gene-wt-pageintro-sub { margin: 0.5rem auto 0; max-width: 560px; color: var(--wt-ink-soft); font-size: 1.04rem; line-height: 1.6; }

/* Stats — number band */
.gene-aesthetic--white.gene-wt-stats { background: var(--wt-surface); }
.gene-aesthetic--white .gene-wt-statgrid { gap: 1.5rem; }
.gene-aesthetic--white .gene-wt-stat-num { margin: 0; font-size: clamp(2rem, 4vw, 2.6rem); font-weight: 700; color: var(--wt-ink); letter-spacing: -0.02em; line-height: 1.1; }
.gene-aesthetic--white .gene-wt-stat-label { margin: 0.3rem 0 0; font-size: 0.9rem; color: var(--wt-ink-soft); }

/* Hours — address / opening hours / contact */
.gene-aesthetic--white.gene-wt-hours { background: var(--wt-paper); }
.gene-aesthetic--white .gene-wt-hours-grid { gap: 2rem; }
.gene-aesthetic--white .gene-wt-hours h3 { margin: 0; }
.gene-aesthetic--white .gene-wt-hours-line { margin: 0.5rem 0 0; color: var(--wt-ink-soft); line-height: 1.7; overflow-wrap: break-word; }

/* FAQ — core/details accordion */
.gene-aesthetic--white.gene-wt-faq { background: var(--wt-surface); }
.gene-aesthetic--white .gene-wt-q { margin-top: 0.8rem; background: var(--wt-paper); border: 1px solid var(--wt-line); border-radius: 10px; padding: 1.1rem 1.3rem; }
.gene-aesthetic--white .gene-wt-q summary { cursor: pointer; font-weight: 600; color: var(--wt-ink); list-style-position: inside; }
.gene-aesthetic--white .gene-wt-q p { margin: 0.8rem 0 0; line-height: 1.6; }