/*
 * Right-Brain design system on picostrap5 / Bootstrap 5 (LiveCanvas).
 * Ported from the block theme (themes/right-brain), which was ported from the
 * approved prototype. Every class is rb- prefixed so Bootstrap and LiveCanvas
 * never collide with it. Loaded after Bootstrap, so equal-specificity rules win.
 */

@font-face { font-family: "Inter Tight"; src: url("../fonts/inter-tight-latin.woff2") format("woff2"); font-weight: 400 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("../fonts/newsreader-italic-latin.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("../fonts/jetbrains-mono-latin.woff2") format("woff2"); font-weight: 400 500; font-style: normal; font-display: swap; }

/* Bootstrap baseline → the design's */
body { background: #fbfbfa; color: #0b0f16; font: 400 18px/1.6 "Inter Tight", system-ui, sans-serif; }
a { color: inherit; }
h1, h2, h3, h4 { font-family: "Inter Tight", system-ui, sans-serif; font-weight: 500; line-height: 1.15; letter-spacing: -0.02em; color: inherit; }
h1 { line-height: .95; letter-spacing: -0.035em; }
h2 { line-height: .98; letter-spacing: -0.035em; }
figure { margin: 0; }
mark.rb-em { padding: 0; background: none; } /* Bootstrap pads <mark> */
img, svg { vertical-align: top; }
ul, ol { margin-top: 0; }
/* LiveCanvas wraps the page in its own main; sections own their spacing. */
#lc-main, main#theme-main { padding: 0; margin: 0; }
.lc-block { width: 100%; }

/*
 * Right-Brain theme styles, ported from the approved prototype
 * (web-copy/design/assets/site.css). Every class is prefixed rb- to avoid
 * collisions. Cascade: WordPress core and plugin CSS are unlayered, so this
 * file is unlayered too and scopes by section class (see CONTRACTS.md and
 * WORDPRESS-PLAN.md, "cascade").
 */

:root {
	--rb-paper: #fbfbfa;
	--rb-white: #ffffff;
	--rb-ink: #0b0f16;
	--rb-muted: #5b6472;
	--rb-muted-dark: #98a2b3;
	--rb-line: #e3e5e8;
	--rb-line-strong: #868f9c;
	--rb-line-dark: #262d3a;
	--rb-accent: #2a74b5;
	--rb-accent-ink: #1c4680;
	--rb-sky: #85bae4;
	--rb-spark: #dd491d;
	--rb-spark-ink: #c84922;
	--rb-spark-on-dark: #f0703f;
	--rb-sans: "Inter Tight", system-ui, sans-serif;
	--rb-serif: "Newsreader", Georgia, serif;
	--rb-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
	--rb-gutter: 40px;
	--rb-wrap: 1360px;
	--rb-section: clamp(80px, 11vw, 144px);
	--rb-r: 6px;
}
@media (max-width: 1080px) { :root { --rb-gutter: 28px; } }
@media (max-width: 640px) { :root { --rb-gutter: 16px; } }

body { -webkit-font-smoothing: antialiased; }
:where(img, svg) { max-width: 100%; }
:focus-visible { outline: 2px solid var(--rb-accent); outline-offset: 4px; }
h1, h2 { text-wrap: balance; }

.rb-wrap { max-width: var(--rb-wrap); margin-inline: auto; padding-inline: var(--rb-gutter); box-sizing: border-box; }

/* Type roles */
.rb-label { font: 400 12px/1.4 var(--rb-mono); letter-spacing: .04em; text-transform: uppercase; color: var(--rb-spark-ink); margin: 0; }
.rb-label strong, .rb-label b { font-weight: 500; color: inherit; }
.rb-voice { font-family: var(--rb-serif); font-style: italic; font-weight: 400; letter-spacing: -0.01em; }
:is(h1, h2, h3) .rb-em, :is(h1, h2, h3) mark.rb-em { background: none; color: var(--rb-accent); }

/* Buttons (block styles for core/button) */
.rb-btn {
	display: inline-flex; align-items: center; gap: 10px; height: 52px; padding: 0 24px; box-sizing: border-box;
	border-radius: var(--rb-r); font: 500 16px/1 var(--rb-sans); text-decoration: none; border: 0; cursor: pointer;
	transition: background .2s, color .2s, border-color .2s;
}
.rb-btn--primary { background: var(--rb-ink); color: #fff; }
.rb-btn--primary:hover { background: var(--rb-accent); color: #fff; }
.rb-btn--line { background: transparent; color: var(--rb-ink); box-shadow: inset 0 0 0 1px var(--rb-ink); }
.rb-btn--line:hover { background: var(--rb-ink); color: #fff; }

/* Header */
.rb-header { position: sticky; top: 0; z-index: 20; background: rgba(251, 251, 250, .86); backdrop-filter: saturate(160%) blur(10px); -webkit-backdrop-filter: saturate(160%) blur(10px); border-bottom: 1px solid var(--rb-line); }
.admin-bar .rb-header { top: var(--wp-admin--admin-bar--height, 32px); }
.rb-nav { display: flex; align-items: center; justify-content: space-between; height: 84px; }
.rb-nav__logo img { height: 42px; width: auto; display: block; }
.rb-nav ul { display: flex; gap: 36px; align-items: center; list-style: none; margin: 0; padding: 0; }
.rb-nav ul a { text-decoration: none; font-size: 15px; font-weight: 500; }
.rb-nav ul a:not(.rb-btn) { color: var(--rb-ink); }
.rb-nav ul a:not(.rb-btn):hover, .rb-nav ul a[aria-current="page"] { color: var(--rb-accent); }
.rb-nav .rb-btn { height: 42px; padding: 0 18px; font-size: 15px; }
.rb-menu-btn { display: none; height: 42px; padding: 0 16px; border: 1px solid var(--rb-ink); border-radius: var(--rb-r); background: none; font: 500 15px var(--rb-sans); color: var(--rb-ink); cursor: pointer; }
.rb-mobile-menu { display: none; border-top: 1px solid var(--rb-line); background: var(--rb-paper); }
.rb-mobile-menu ul { list-style: none; margin: 0; padding: 8px var(--rb-gutter) 24px; }
.rb-mobile-menu a { display: block; padding: 14px 0; border-bottom: 1px solid var(--rb-line); text-decoration: none; font-size: 22px; letter-spacing: -0.02em; color: var(--rb-ink); }
.rb-mobile-menu li:last-child a { border-bottom: 0; }
.rb-header.is-open .rb-mobile-menu { display: block; }
@media (max-width: 1080px) {
	.rb-nav ul li:not(:last-child) { display: none; }
	.rb-menu-btn { display: block; }
	.rb-nav ul { gap: 12px; }
	.rb-header.is-open .rb-mobile-menu { max-height: calc(100dvh - 84px); overflow-y: auto; overscroll-behavior: contain; }
	html:not(.rb-js) .rb-mobile-menu { display: block; }
	html:not(.rb-js) .rb-header { position: static; }
}
html:not(.rb-js) .rb-menu-btn { display: none !important; }
@media (max-width: 640px) {
	.rb-nav { height: 68px; }
	.rb-nav__logo img { height: 35px; }
	.rb-nav ul { display: none; }
}

/* Skip link (core injects it; this styles it) */
.skip-link.screen-reader-text:focus { z-index: 100; background: var(--rb-ink); color: #fff; padding: 12px 16px; border-radius: var(--rb-r); }

/* Hero: the promise left, the brain map right */
.rb-hero { border-bottom: 1px solid var(--rb-line); }
.rb-hero .rb-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center; min-height: min(80vh, 780px); padding-block: 48px; margin: 0 auto; }
.rb-hero .rb-hero__grid > * { min-width: 0; margin: 0; }
.rb-hero__text { display: flex; flex-direction: column; justify-content: space-between; align-self: stretch; gap: 24px; }
.rb-hero h1 { font-size: clamp(42px, 5vw, 80px); line-height: .92; letter-spacing: -0.04em; max-width: 9.5em; margin: 40px 0; }
.rb-hero__lede { font-size: 20px; color: var(--rb-muted); max-width: 520px; margin: 0; }
.rb-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.rb-hero .rb-actions { margin-top: 32px; }
.rb-fields { list-style: none; margin: 8px 0 0; padding: 20px 0 0; border-top: 1px solid var(--rb-line); display: flex; flex-wrap: wrap; gap: 6px 28px; font: 400 12px/1.4 var(--rb-mono); letter-spacing: .04em; text-transform: uppercase; color: var(--rb-muted); max-width: 520px; }
.rb-fields li { margin: 0; }
@media (max-width: 1080px) {
	.rb-hero .rb-hero__grid { grid-template-columns: 1fr; min-height: 0; }
	.rb-hero .rb-diagram { max-width: 620px; }
}

/* Diagrams */
.rb-diagram { margin: 0; }
.rb-diagram svg { display: block; width: 100%; height: auto; }
.rb-hero .rb-diagram svg { max-height: min(72vh, 720px); }
.rb-diagram-fallback { margin: 0; color: var(--rb-muted); }
@media (max-width: 640px) {
	.rb-diagram .brain-map .map-num, .rb-diagram .brain-map .map-midline { display: none; }
}

/* Motion: lines draw in, nodes settle, notes are written (only with rb-motion) */
.rb-motion .rb-diagram .ln { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.4s cubic-bezier(.6, 0, .2, 1); }
.rb-motion .rb-diagram.is-drawn .ln { stroke-dashoffset: 0; }
.rb-motion .rb-diagram .wl { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.8s cubic-bezier(.6, 0, .2, 1) .2s; }
.rb-motion .rb-diagram.is-drawn .wl { stroke-dashoffset: 0; }
.rb-motion .rb-diagram .node { transform-box: fill-box; transform-origin: center; transform: scale(.5); opacity: 0; transition: transform .6s cubic-bezier(.2, .7, .2, 1), opacity .4s ease; }
.rb-motion .rb-diagram.is-drawn .node { transform: none; opacity: 1; transition-delay: calc(.3s + var(--i, 0) * 70ms); }
.rb-motion .rb-diagram .note { opacity: 0; transition: opacity .7s ease .85s; }
.rb-motion .rb-diagram.is-drawn .note { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
	.rb-motion .rb-diagram .ln, .rb-motion .rb-diagram .wl, .rb-motion .rb-diagram .node, .rb-motion .rb-diagram .note {
		transition: none !important; transform: none !important; opacity: 1 !important; stroke-dasharray: none !important; stroke-dashoffset: 0 !important;
	}
}

/* Footer */
.rb-footer { background: var(--rb-ink); color: var(--rb-muted-dark); padding: 56px 0; font-size: 15px; }
.rb-footer .rb-wrap { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 56px; align-items: center; }
.rb-footer img { height: 39px; width: auto; display: block; }
.rb-footer nav { display: flex; flex-wrap: wrap; gap: 12px 28px; }
.rb-footer a { color: #d6dde8; text-decoration: none; }
.rb-footer a:hover { color: #fff; }
.rb-grid-toggle { background: none; border: 0; padding: 0; color: #c9d2df; font: 400 12px/1.4 var(--rb-mono); letter-spacing: .04em; text-transform: uppercase; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1080px) { .rb-footer .rb-wrap { grid-template-columns: 1fr; gap: 24px; } }

/* The grid, on request */
.rb-grid-overlay { position: fixed; inset: 0; pointer-events: none; z-index: 60; display: none; }
.rb-show-grid .rb-grid-overlay { display: block; }
.rb-grid-overlay .rb-wrap { height: 100%; display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; }
.rb-grid-overlay span { background: rgba(42, 116, 181, .05); border-inline: 1px solid rgba(42, 116, 181, .28); }
@media (max-width: 1080px) { .rb-grid-overlay .rb-wrap { grid-template-columns: repeat(6, 1fr); } }
@media (max-width: 640px) { .rb-grid-overlay .rb-wrap { grid-template-columns: repeat(4, 1fr); gap: 16px; } }

/* Main landmark: full width; sections set their own widths */
main#main { margin: 0; }

/*
 * Right-Brain sections: page sections, case pages and figures, ported from the
 * prototype (web-copy/design/assets/site.css). Unlayered and rb- prefixed, as
 * site.css. Sections are core Group/Columns/List blocks carrying these classes,
 * built by inc/sections.php, so markup and styles have one source.
 */

/* ---------- Base rhythm (blockGap is 0; sections own their spacing) ---------- */
p { margin: 0 0 1em; }
h1, h2, h3 { margin: 0; font-weight: 500; }
.rb-section { padding-block: var(--rb-section); }
.rb-section.rb-pt-0 { padding-top: 0; }
.rb-section.rb-pb-xl { padding-bottom: clamp(64px, 8vw, 96px); }
.rb-section.rb-pt-xl { padding-top: clamp(64px, 8vw, 96px); }
.rb-mono { font: 400 12px/1.4 var(--rb-mono); letter-spacing: .04em; text-transform: uppercase; color: var(--rb-muted); margin: 0; }
.rb-muted { color: var(--rb-muted); }
.rb-lead { font-size: clamp(22px, 2vw, 28px); line-height: 1.35; letter-spacing: -0.015em; }
.rb-voice-big { font-family: var(--rb-serif); font-style: italic; font-size: clamp(26px, 2.6vw, 38px); line-height: 1.28; letter-spacing: -0.01em; }
.rb-under, .rb-link a { text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat; padding-bottom: 2px; transition: background-size .25s; color: inherit; }
.rb-under:hover, .rb-link a:hover { background-size: 0 1px; background-position: 100% 100%; }
.rb-link { margin: 0; }
p .rb-under, p a:not(.rb-btn) { color: inherit; }
.rb-small { font-size: 16px; }
.rb-split__body .rb-actions, .rb-closing__row .rb-actions { margin-top: 16px; }
.rb-closing__row .rb-actions, .rb-case-cta .rb-actions { margin-top: 0; }
.screen-reader-text:not(:focus) { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Section head: label left, headline right */
.rb-sec-head { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; align-items: end; margin-bottom: 72px; }
.rb-sec-head h2 { font-size: clamp(40px, 5vw, 76px); line-height: .94; letter-spacing: -0.035em; }

/* ---------- Work list (rb/case-list) ---------- */
.rb-work-list { border-top: 1px solid var(--rb-ink); }
.rb-work-row { display: grid; grid-template-columns: 80px minmax(0, 1.2fr) minmax(0, 1fr); gap: 40px; padding: 48px 0; border-bottom: 1px solid var(--rb-line); align-items: start; }
.rb-work-row__num { font: 400 13px/1 var(--rb-mono); color: var(--rb-muted); padding-top: 14px; }
.rb-work-row__title { font-size: clamp(30px, 3.2vw, 46px); line-height: 1.05; margin-bottom: 18px; letter-spacing: -0.035em; }
.rb-work-row__meta { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 20px; }
.rb-tag { font: 500 11px/1 var(--rb-mono); letter-spacing: .06em; text-transform: uppercase; padding: 7px 9px; border: 1px solid var(--rb-line); border-radius: 3px; color: var(--rb-muted); }
.rb-tag--status { border-color: var(--rb-ink); color: var(--rb-ink); }
.rb-work-row__outcome { font-family: var(--rb-serif); font-style: italic; font-size: 30px; line-height: 1.15; margin: 8px 0 24px; max-width: 18em; letter-spacing: -0.01em; }
.rb-work-row__summary { color: var(--rb-muted); max-width: 36em; }
.rb-work-row__fig { background-color: var(--rb-white); border: 1px solid var(--rb-line); border-radius: var(--rb-r); aspect-ratio: 16 / 10; padding: 24px; display: flex; align-items: center; transition: border-color .25s; }
.rb-work-row:hover .rb-work-row__fig { border-color: var(--rb-ink); }
.rb-work-row__fig .rb-diagram { width: 100%; }
.rb-work-row__fig figcaption { display: none; }
.rb-work-more { display: flex; justify-content: flex-end; padding-top: 32px; margin: 0; }

/* ---------- Offers (Home) ---------- */
.rb-offers { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--rb-ink); gap: 0; margin: 0; }
.rb-offers > .rb-offer { padding: 48px 48px 56px 0; margin: 0; }
.rb-offers > .rb-offer + .rb-offer { padding: 48px 0 56px 48px; border-left: 1px solid var(--rb-line); }
.rb-offer h3 { font-size: clamp(32px, 3.4vw, 52px); line-height: 1.02; margin: 28px 0 20px; letter-spacing: -0.035em; }
.rb-offer p:not(.rb-mono) { color: var(--rb-muted); max-width: 30em; margin: 0; }
.rb-story { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; padding: 40px 0; border-block: 1px solid var(--rb-line); align-items: baseline; }
.rb-story h3 { font-size: 34px; line-height: 1.1; letter-spacing: -0.035em; }
.rb-story p { margin: 0; color: var(--rb-muted); max-width: 40em; }
.rb-notes { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; padding-top: 32px; font-size: 16px; color: var(--rb-muted); }
.rb-notes p { margin: 0; }
.rb-notes strong { color: var(--rb-ink); font-weight: 500; }

/* ---------- Perspectives (dark, Home) ---------- */
.rb-persp { background: var(--rb-ink); color: #e9edf3; overflow: hidden; }
.rb-persp h2 { font-size: clamp(40px, 5vw, 76px); line-height: .94; color: #fff; letter-spacing: -0.035em; }
.rb-persp h2 .rb-em, .rb-dark h2 .rb-em { color: var(--rb-sky); }
.rb-persp .rb-figure { margin-bottom: 72px; }
.rb-persp-grid { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; }
.rb-narr p { font-family: var(--rb-serif); font-style: italic; font-size: clamp(26px, 2.6vw, 38px); line-height: 1.28; color: #fff; max-width: 24em; }
.rb-narr p + p { color: var(--rb-sky); margin-top: 28px; }

/* ---------- Steps (Home) ---------- */
.rb-figure--panel { margin: 0 0 56px; padding: 32px; background-color: var(--rb-white); border: 1px solid var(--rb-line); border-radius: var(--rb-r); }
.rb-steps { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--rb-ink); gap: 0; margin: 0; }
.rb-steps > .rb-step { padding: 32px 32px 0 0; margin: 0; }
.rb-steps > .rb-step + .rb-step { padding-left: 32px; border-left: 1px solid var(--rb-line); }
.rb-step__n, .rb-question::before { font: 500 13px/1 var(--rb-mono); width: 40px; height: 40px; border: 1px solid var(--rb-ink); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: var(--rb-ink); margin: 0 0 20px; box-sizing: border-box; }
.rb-step h3 { font-size: 26px; margin-bottom: 10px; letter-spacing: -0.02em; }
.rb-step p:not(.rb-step__n) { font-size: 16px; color: var(--rb-muted); margin: 0; }
.rb-ai-line { margin-top: 64px; display: grid; grid-template-columns: 1fr 2fr; gap: 40px; padding-top: 32px; border-top: 1px solid var(--rb-line); align-items: baseline; }
.rb-ai-line p { margin: 0; }
.rb-ai-line p + p { font-size: clamp(24px, 2.2vw, 32px); line-height: 1.25; letter-spacing: -0.02em; }
.rb-ai-line .rb-voice, .rb-ai-line em { font-family: var(--rb-serif); font-style: italic; color: var(--rb-spark-ink); }

/* ---------- About (Home) ---------- */
.rb-about { border-top: 1px solid var(--rb-line); background: var(--rb-white); }
.rb-about-grid { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; }
.rb-big { font-size: clamp(26px, 2.5vw, 36px); line-height: 1.25; letter-spacing: -0.02em; margin: 0 0 32px; }
.rb-big em, .rb-big .rb-voice { font-family: var(--rb-serif); font-style: italic; }
.rb-exp { list-style: none; margin: 48px 0 0; padding: 0; border-top: 1px solid var(--rb-ink); }
.rb-exp.rb-mt-0 { margin-top: 0; }
.rb-exp li { position: relative; padding: 18px 0 18px 224px; border-bottom: 1px solid var(--rb-line); color: var(--rb-muted); margin: 0; }
.rb-exp li > strong:first-child { position: absolute; left: 0; top: 18px; width: 200px; font-weight: 500; color: var(--rb-ink); }

/* Portraits (core/image with a block style) */
.rb-portrait { margin: 32px 0 0; }
.rb-portrait img { display: block; width: 100%; height: auto; object-fit: cover; border-radius: var(--rb-r); }
.rb-portrait--large { max-width: 400px; }
.rb-portrait--large img { aspect-ratio: 2 / 3; }
.rb-portrait--headshot { max-width: 320px; margin-top: 40px; }
.rb-portrait--headshot img { aspect-ratio: 3 / 4; }
.rb-portrait figcaption { display: flex; justify-content: space-between; gap: 12px; margin: 12px 0 0; padding-top: 10px; border-top: 1px solid var(--rb-line); font: 400 12px/1.4 var(--rb-mono); letter-spacing: .04em; text-transform: uppercase; color: var(--rb-muted); text-align: left; }
.rb-portrait figcaption strong { color: var(--rb-ink); font-weight: 500; }
.rb-who { display: flex; gap: 14px; align-items: center; margin-bottom: 28px; }
.rb-who figure { margin: 0; flex: none; }
.rb-who img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; object-position: center 20%; display: block; }
.rb-who p { font-size: 15px; line-height: 1.4; margin: 0; }
.rb-who p strong { font-weight: 500; }

/* ---------- Closing invitation ---------- */
.rb-closing h2 { font-size: clamp(48px, 8vw, 128px); line-height: .95; max-width: 12em; letter-spacing: -0.035em; }
.rb-closing__row { display: flex; justify-content: space-between; align-items: end; gap: 40px; margin-top: 56px; flex-wrap: wrap; }
.rb-closing__row p { margin: 0; font-size: 20px; color: var(--rb-muted); max-width: 28em; }

/* ---------- Inner pages ---------- */
.rb-page-hero { border-bottom: 1px solid var(--rb-line); padding: 96px 0 88px; }
.rb-page-hero .rb-label { margin-bottom: 40px; }
.rb-page-hero h1 { font-size: clamp(44px, 6.4vw, 104px); line-height: .92; max-width: 11em; letter-spacing: -0.035em; }
.rb-page-hero .rb-intro { margin: 40px 0 0; font-size: clamp(20px, 1.8vw, 24px); line-height: 1.45; color: var(--rb-muted); max-width: 34em; }
.rb-page-hero .rb-figure { margin-top: 40px; }

.rb-split { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; padding: 64px 0; border-top: 1px solid var(--rb-line); }
.rb-split > * { min-width: 0; margin: 0; }
.rb-split.rb-rule-ink { border-top-color: var(--rb-ink); }
.rb-split.rb-flush { border-top: 0; }
.rb-split.rb-pt-0 { padding-top: 0; }
.rb-split.rb-p-0 { padding: 0; }
.rb-split.rb-pb-2xl { padding-bottom: var(--rb-section); }
.rb-split:first-child:not(.rb-rule-ink) { border-top: 0; }
.rb-split__side h2 { font-size: clamp(28px, 2.6vw, 40px); line-height: 1.05; letter-spacing: -0.035em; }
.rb-split__side > .rb-mono { display: block; margin-bottom: 16px; color: var(--rb-spark-ink); }
.rb-split__body { max-width: 44em; }
.rb-split__body.rb-measure-none { max-width: none; }
.rb-split__body > :last-child { margin-bottom: 0; }
.rb-split__body ul:not(.rb-ticks):not(.rb-made):not(.rb-defs), .rb-split__body ol:not(.rb-exp) { margin: 0 0 1em; padding-left: 1.1em; }
.rb-split__body li { margin-bottom: .5em; }
.rb-step-title { font-size: clamp(28px, 2.6vw, 40px); margin-bottom: 16px; letter-spacing: -0.035em; }
.rb-split__side .rb-step__n { margin: 0; }
.rb-measure-xs { max-width: 22em; }
.rb-measure-sm { max-width: 24em; }
.rb-measure-md { max-width: 34em; }
.rb-mb-lg { margin-bottom: 56px; }

/* Definitions: a list whose items start with a bold term */
.rb-defs { list-style: none; padding: 0; margin: 8px 0 0; border-top: 1px solid var(--rb-ink); }
/* The term sits in its own column; the rest stays one run of text (links included). */
.rb-defs li { position: relative; margin: 0; padding: 18px 0 18px 180px; border-bottom: 1px solid var(--rb-line); font-size: 17px; }
.rb-defs li > strong:first-child { position: absolute; left: 0; top: 22px; width: 160px; font: 500 12px/1.4 var(--rb-mono); letter-spacing: .05em; text-transform: uppercase; color: var(--rb-muted); }

/* Offer blocks (What I Do) */
.rb-offer-block { padding: 96px 0; border-top: 1px solid var(--rb-line); }
.rb-offer-block.rb-flush { border-top: 0; }
.rb-offer-head { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; margin-bottom: 48px; align-items: end; }
.rb-offer-block h2 { font-size: clamp(40px, 5vw, 76px); line-height: .94; letter-spacing: -0.035em; }
.rb-offer-body { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; }
.rb-offer-body > * { min-width: 0; margin: 0; }
.rb-offer-block--support { padding: 72px 0; }
.rb-offer-block--support .rb-offer-head h2 { font-size: clamp(28px, 2.8vw, 44px); line-height: 1; }
.rb-offer-block--support .rb-voice-big { font-size: clamp(22px, 2vw, 30px); }

/* Tick list */
.rb-ticks { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--rb-ink); }
.rb-ticks li { display: grid; grid-template-columns: 32px 1fr; padding: 16px 0; border-bottom: 1px solid var(--rb-line); margin: 0; }
.rb-ticks li::before { content: ""; width: 9px; height: 9px; margin-top: 9px; background: var(--rb-accent); transform: rotate(45deg); }

/* Dark band */
.rb-dark { background: var(--rb-ink); color: #e9edf3; }
.rb-dark .rb-split { border-color: var(--rb-line-dark); }
.rb-dark h2 { color: #fff; }
.rb-dark .rb-label, .rb-dark .rb-split__side > .rb-mono { color: var(--rb-spark-on-dark); }
.rb-dark .rb-mono { color: var(--rb-muted-dark); }
.rb-dark .rb-split__body p { color: #e9edf3; }
.rb-dark .rb-voice-big { color: #fff; }
.rb-dark .rb-soft { color: #c9d2df !important; }
.rb-dark .rb-faint { color: var(--rb-muted-dark) !important; font-size: 16px; }

/* Five questions */
.rb-questions { counter-reset: q; border-top: 1px solid var(--rb-ink); }
.rb-question { display: grid; grid-template-columns: 96px 1fr 1fr; gap: 32px; padding: 32px 0; border-bottom: 1px solid var(--rb-line); counter-increment: q; }
.rb-question::before { content: counter(q); margin: 0; }
.rb-question h3 { font-size: clamp(22px, 2vw, 28px); line-height: 1.2; letter-spacing: -0.02em; }
.rb-question p { margin: 0; color: var(--rb-muted); font-size: 16px; }

/* Figures */
.rb-figure { margin: 0; max-width: 100%; }
.rb-figure--inline { margin: 40px 0; }
.rb-figure .rb-diagram figcaption, .rb-case-figure .rb-diagram figcaption { margin-top: 20px; color: var(--rb-muted); font-size: 14px; }
.rb-figure.is-scrolling { position: relative; }
.rb-scroll-cue { display: block; margin-top: 10px; font: 400 11px/1.4 var(--rb-mono); letter-spacing: .05em; text-transform: uppercase; color: var(--rb-muted); }
.rb-dark .rb-scroll-cue, .rb-persp .rb-scroll-cue { color: var(--rb-muted-dark); }

/* Corner ticks: a print designer's registration marks on drawing panels */
.rb-work-row__fig, .rb-case-figure, .rb-figure--panel {
	background-image: linear-gradient(var(--rb-line-strong), var(--rb-line-strong)), linear-gradient(var(--rb-line-strong), var(--rb-line-strong)),
		linear-gradient(var(--rb-line-strong), var(--rb-line-strong)), linear-gradient(var(--rb-line-strong), var(--rb-line-strong)),
		linear-gradient(var(--rb-line-strong), var(--rb-line-strong)), linear-gradient(var(--rb-line-strong), var(--rb-line-strong)),
		linear-gradient(var(--rb-line-strong), var(--rb-line-strong)), linear-gradient(var(--rb-line-strong), var(--rb-line-strong));
	background-repeat: no-repeat;
	background-size: 12px 1px, 1px 12px, 12px 1px, 1px 12px, 12px 1px, 1px 12px, 12px 1px, 1px 12px;
	background-position: left 10px top 10px, left 10px top 10px, right 10px top 10px, right 10px top 10px,
		left 10px bottom 10px, left 10px bottom 10px, right 10px bottom 10px, right 10px bottom 10px;
}

/* ---------- Case pages ---------- */
.rb-case-hero { border-bottom: 1px solid var(--rb-line); padding: 72px 0 0; }
.rb-crumbs { display: flex; gap: 10px; color: var(--rb-muted); font: 400 12px/1.4 var(--rb-mono); letter-spacing: .04em; text-transform: uppercase; }
.rb-crumbs a { text-decoration: none; color: inherit; }
.rb-crumbs a:hover { color: var(--rb-accent); }
.rb-case-hero h1 { font-size: clamp(44px, 6.4vw, 104px); line-height: .92; margin: 48px 0 24px; max-width: 11em; letter-spacing: -0.035em; }
.rb-case-hero__sub { font-family: var(--rb-serif); font-style: italic; font-size: clamp(26px, 2.6vw, 38px); line-height: 1.2; color: var(--rb-accent); max-width: 22em; margin: 0 0 48px; }
.rb-case-meta { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--rb-ink); margin: 0; }
.rb-case-meta > div { padding: 20px 24px 24px 0; }
.rb-case-meta > div + div { padding-left: 24px; border-left: 1px solid var(--rb-line); }
.rb-case-meta dt { font: 400 12px/1.4 var(--rb-mono); letter-spacing: .04em; text-transform: uppercase; color: var(--rb-muted); margin-bottom: 8px; }
.rb-case-meta dd { margin: 0; font-weight: 500; font-size: 17px; }
.rb-case-body { padding-bottom: 0; }
.rb-case-figure { background-color: var(--rb-white); border: 1px solid var(--rb-line); border-radius: var(--rb-r); padding: clamp(24px, 4vw, 64px); margin: 64px 0; }
.rb-case-figure svg { max-height: 460px; }
.rb-pull { font-family: var(--rb-serif); font-style: italic; font-size: clamp(30px, 3.4vw, 52px); line-height: 1.15; letter-spacing: -0.01em; max-width: 20em; padding: 80px 0; margin: 0; border-top: 1px solid var(--rb-line); }
.rb-pull__mark { color: var(--rb-spark-ink); display: inline-block; margin-left: -0.42em; }
.rb-made { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--rb-ink); }
.rb-made li { padding: 18px 24px 18px 0; border-bottom: 1px solid var(--rb-line); font-size: 17px; margin: 0; }
.rb-made li:nth-child(even) { padding-left: 24px; border-left: 1px solid var(--rb-line); }
.rb-case-cta { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; padding: 56px 0; border-top: 1px solid var(--rb-line); }
.rb-case-cta p { margin: 0; font-family: var(--rb-serif); font-style: italic; font-size: clamp(26px, 2.6vw, 38px); line-height: 1.15; }
.rb-next-case { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: end; padding: 64px 0; border-top: 1px solid var(--rb-ink); text-decoration: none; color: inherit; }
.rb-next-case h2 { font-size: clamp(32px, 4vw, 60px); line-height: 1; margin-top: 16px; transition: color .2s; letter-spacing: -0.035em; }
.rb-next-case:hover h2 { color: var(--rb-accent); }
.rb-next-case__arrow { font-size: 40px; transition: transform .2s; }
.rb-next-case:hover .rb-next-case__arrow { transform: translateX(6px); }
.rb-case-end { padding-bottom: var(--rb-section); }

/* ---------- Contact ---------- */
.rb-direct { display: grid; border-top: 1px solid var(--rb-line); margin-top: 64px; padding-top: 24px; }
.rb-direct .rb-mono { display: block; margin-bottom: 10px; }
.rb-direct p:not(.rb-mono) { font-size: 22px; font-weight: 500; letter-spacing: -0.02em; margin: 0; }

/* ---------- Motion: rules draw, step nodes settle (rb-motion only) ---------- */
.rb-motion .rb-rule-draw { position: relative; border-top-color: transparent !important; }
.rb-motion .rb-rule-draw::after { content: ""; position: absolute; left: 0; right: 0; top: calc(var(--rule-w, 1px) * -1); height: var(--rule-w, 1px); background: var(--rule-color, var(--rb-ink)); transform: scaleX(0); opacity: 0; transform-origin: left center; transition: transform 1.1s cubic-bezier(.6, 0, .2, 1), opacity .2s linear; pointer-events: none; }
.rb-motion .rb-rule-draw.is-in-view::after { transform: scaleX(1); opacity: 1; }
.rb-motion .rb-steps .rb-step__n, .rb-motion .rb-questions .rb-question::before { transform: scale(.6); opacity: 0; transition: transform .6s cubic-bezier(.2, .7, .2, 1), opacity .4s ease; }
.rb-motion .rb-steps.is-in-view .rb-step__n, .rb-motion .rb-questions.is-in-view .rb-question::before { transform: none; opacity: 1; }
.rb-motion .rb-steps .rb-step:nth-child(2) .rb-step__n, .rb-motion .rb-questions .rb-question:nth-child(2)::before { transition-delay: .12s; }
.rb-motion .rb-steps .rb-step:nth-child(3) .rb-step__n, .rb-motion .rb-questions .rb-question:nth-child(3)::before { transition-delay: .24s; }
.rb-motion .rb-steps .rb-step:nth-child(4) .rb-step__n, .rb-motion .rb-questions .rb-question:nth-child(4)::before { transition-delay: .36s; }
.rb-motion .rb-questions .rb-question:nth-child(5)::before { transition-delay: .48s; }
@media (prefers-reduced-motion: reduce) {
	.rb-motion .rb-rule-draw::after, .rb-motion .rb-steps .rb-step__n, .rb-motion .rb-questions .rb-question::before { transition: none !important; transform: none !important; opacity: 1 !important; }
}

/* ---------- Tablet ---------- */
@media (max-width: 1080px) {
	:root { --rb-section: 104px; }
	.rb-sec-head, .rb-story, .rb-notes, .rb-persp-grid, .rb-about-grid, .rb-ai-line, .rb-split, .rb-offer-head, .rb-offer-body { grid-template-columns: 1fr; gap: 24px; }
	.rb-work-row { grid-template-columns: 56px 1fr; }
	.rb-work-row__fig { grid-column: 2; max-width: 560px; }
	.rb-steps { grid-template-columns: 1fr 1fr; }
	.rb-steps > .rb-step:nth-child(3) { padding-left: 0; border-left: 0; }
	.rb-steps > .rb-step { padding-bottom: 40px; }
	.rb-case-meta { grid-template-columns: 1fr 1fr; }
	.rb-case-meta > div:nth-child(3) { padding-left: 0; border-left: 0; }
	.rb-question { grid-template-columns: 64px 1fr; }
	.rb-question p { grid-column: 2; }
	.rb-portrait--large { max-width: 320px; }
	.rb-portrait--headshot { max-width: 280px; }
}

/* ---------- Phone ---------- */
@media (max-width: 640px) {
	:root { --rb-section: 80px; }
	body { font-size: 17px; }
	.rb-page-hero { padding: 56px 0; }
	.rb-page-hero .rb-label { margin-bottom: 28px; }
	.rb-offers { grid-template-columns: 1fr; }
	.rb-offers > .rb-offer, .rb-offers > .rb-offer + .rb-offer { padding: 40px 0; border-left: 0; }
	.rb-offers > .rb-offer + .rb-offer { border-top: 1px solid var(--rb-line); }
	.rb-steps { grid-template-columns: 1fr; }
	.rb-steps > .rb-step, .rb-steps > .rb-step + .rb-step { padding-left: 0; border-left: 0; }
	.rb-work-row { grid-template-columns: 1fr; gap: 16px; padding: 40px 0; }
	.rb-work-row__fig { grid-column: 1; padding: 14px; }
	.rb-work-row__outcome { font-size: 25px; }
	.rb-exp li, .rb-defs li { padding-left: 0; }
	.rb-exp li > strong:first-child, .rb-defs li > strong:first-child { position: static; display: block; width: auto; margin-bottom: 4px; }
	.rb-made { grid-template-columns: 1fr; }
	.rb-made li:nth-child(even) { padding-left: 0; border-left: 0; }
	.rb-case-meta { grid-template-columns: 1fr; }
	.rb-case-meta > div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--rb-line); }
	.rb-question { grid-template-columns: 1fr; gap: 12px; }
	.rb-question p { grid-column: 1; }
	.rb-offer-block { padding: 64px 0; }
	.rb-pull { padding: 56px 0; }
	.rb-case-figure { padding: 16px; }
	.rb-figure--panel { padding: 20px; }
	/* Wide drawings keep a readable size and scroll sideways (site.js names them and adds a cue). */
	.rb-figure--panel, .rb-figure--inline, .rb-persp .rb-figure { overflow-x: auto; }
	.rb-figure--panel svg, .rb-figure--inline svg, .rb-persp .rb-figure svg { min-width: 900px; }
}

/* ---------- Contact form (rb/contact-form) ---------- */
.rb-form { display: grid; border-top: 1px solid var(--rb-ink); }
.rb-field { display: grid; grid-template-columns: 220px 1fr; gap: 24px; padding: 20px 0; border-bottom: 1px solid var(--rb-line); align-items: start; }
.rb-field label { font: 500 12px/1.4 var(--rb-mono); letter-spacing: .05em; text-transform: uppercase; color: var(--rb-muted); padding-top: 14px; }
.rb-field input, .rb-field textarea { width: 100%; box-sizing: border-box; font: 400 20px/1.4 var(--rb-sans); color: var(--rb-ink); background: transparent; border: 0; border-bottom: 1px solid var(--rb-line-strong); padding: 10px 0; border-radius: 0; }
.rb-field textarea { min-height: 140px; resize: vertical; }
.rb-field input:focus-visible, .rb-field textarea:focus-visible { outline: 2px solid var(--rb-accent); outline-offset: 4px; border-bottom-color: var(--rb-accent); }
.rb-req { color: var(--rb-accent); margin-left: 4px; }
.rb-field-hint { margin: 10px 0 0; font-size: 15px; color: var(--rb-muted); }
.rb-field.has-error input, .rb-field.has-error textarea { border-bottom: 2px solid #b42318; }
.rb-field-error { margin: 8px 0 0; font-size: 15px; color: #b42318; }
.rb-form-errors { border: 1px solid #b42318; border-radius: var(--rb-r); padding: 16px 20px; margin-bottom: 24px; color: #b42318; }
.rb-form-errors p { margin: 0 0 8px; font-weight: 500; }
.rb-form-errors ul { margin: 0; padding-left: 1.1em; }
.rb-form-errors a { color: inherit; }
.rb-form-next { margin: 28px 0 0; max-width: 40em; color: var(--rb-muted); font-size: 16px; }
.rb-form-actions { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding-top: 32px; flex-wrap: wrap; }
.rb-form-note { color: var(--rb-muted); font-size: 15px; margin: 0; }
.rb-form-note a { color: inherit; }
.rb-form-done { border-top: 1px solid var(--rb-ink); padding-top: 32px; }
.rb-form-done__title { font-size: clamp(26px, 2.6vw, 38px); font-family: var(--rb-serif); font-style: italic; line-height: 1.2; }
.rb-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 640px) { .rb-field { grid-template-columns: 1fr; gap: 0; } }

/* Spacing variants used by the page sections */
.rb-split.rb-pt-xl { padding-top: clamp(64px, 8vw, 96px); }
.rb-splits { padding: 0; }
.rb-defs.rb-mt-md { margin-top: 32px; }
.rb-figure.rb-mb-lg { margin-bottom: 56px; }
.rb-intro a { color: inherit; }

