/* RV Web Page Patterns: shared look for RoboValley content pages.
   Width comes from the theme (Astra container), so every page matches the home page.
   All rules are scoped to .rvv-* classes; nothing else on the site is touched. */

.rvv-page, .rvv-section {
	--rvv-ink: #132a4a;
	--rvv-text: #2b3a4f;
	--rvv-muted: #5b6a7e;
	--rvv-line: #d9e1ec;
	--rvv-surface: #ffffff;
	--rvv-soft: #eaf0f8;
	--rvv-tint: #f3f5f8;
	--rvv-navy: #13294b;
	--rvv-blue: #1f5fbf;
	--rvv-green: #1d7a4f;
	--rvv-green-bg: #e3f1e9;
	--rvv-amber: #c98a1a;
	--rvv-display: "Poppins", "Segoe UI", system-ui, sans-serif;
}

/* Classic themes (Astra) wrap group contents in .wp-block-group__inner-container; block themes do not. Both are covered. */
.rvv-page, .rvv-page > .wp-block-group__inner-container { display: flex; flex-direction: column; gap: 56px; }
.rvv-page > *, .rvv-page > .wp-block-group__inner-container > * { margin: 0 !important; }
.rvv-section { color: var(--rvv-text); container-type: inline-size; }
.rvv-section mark.has-inline-color { background: transparent !important; padding: 0; }
.rvv-section h1, .rvv-section h2, .rvv-section h3, .rvv-section p, .rvv-section li { overflow-wrap: normal; word-break: normal; hyphens: manual; }
.rvv-section > * + *, .rvv-section > .wp-block-group__inner-container > * + * { margin-top: 16px; }
.rvv-section > .wp-block-group__inner-container > :first-child { margin-top: 0; }
.rvv-section p { margin-bottom: 0; }
.rvv-section h1, .rvv-section h2, .rvv-section h3 {
	font-family: var(--rvv-display); color: var(--rvv-ink); text-wrap: balance; margin: 0;
}
.rvv-section h1 { font-size: clamp(32px, 5vw, 48px); line-height: 1.12; font-weight: 700; }
.rvv-section h2 { font-size: clamp(22px, 3vw, 28px); line-height: 1.25; font-weight: 600; }
.rvv-section h3 { font-size: 17px; line-height: 1.35; font-weight: 600; }
.rvv-section h3 a { color: inherit; text-decoration: none; }
.rvv-section h3 a:hover { color: var(--rvv-blue); }

.rvv-eyebrow {
	font-family: var(--rvv-display); font-weight: 600; font-size: 12px;
	letter-spacing: .14em; text-transform: uppercase; color: var(--rvv-green);
}
.rvv-eyebrow + h1, .rvv-eyebrow + h2 { margin-top: 8px !important; }
.rvv-lede { font-size: 1.1em; max-width: 66ch; }
.rvv-intro { max-width: 66ch; }

/* Five equal cards; 2 per row on tablets, 1 on phones */
.wp-block-columns.rvv-grid-5 {
	display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin: 20px 0 0;
}
.wp-block-columns.rvv-grid-5 > .wp-block-column { margin: 0; min-width: 0; }
.rvv-card {
	background: var(--rvv-surface); border: 1px solid var(--rvv-line); border-radius: 12px;
	padding: 18px; display: flex; flex-direction: column; gap: 8px;
}
.rvv-card > * { margin: 0 !important; }
.rvv-card p { font-size: 14.5px; line-height: 1.6; }
.rvv-icon img { width: 36px; height: 36px; display: block; }
.rvv-sub { font-size: 12.5px !important; color: var(--rvv-muted); }
.rvv-card ul { padding-left: 0; list-style: none; display: grid; gap: 4px; font-size: 14px; }
.rvv-card ul li { margin: 0; }
.rvv-promoted { border: 2px solid var(--rvv-blue); background: var(--rvv-soft); }
.rvv-tag {
	align-self: flex-start; font-size: 11px !important; font-weight: 600; color: var(--rvv-green);
	background: var(--rvv-green-bg); padding: 2px 8px; border-radius: 6px;
}

.rvv-city p { max-width: 66ch; }
.rvv-close-line {
	font-family: var(--rvv-display); font-weight: 700; color: var(--rvv-ink);
	font-size: clamp(22px, 3.2vw, 30px) !important; line-height: 1.25;
}

.rvv-mission { background: var(--rvv-navy); color: #fff; border-radius: 16px; padding: 32px clamp(20px, 4vw, 48px); }
.rvv-mission .rvv-eyebrow { color: #8fd3ae; }
.rvv-mission .wp-block-quote { border: 0; margin: 12px 0 0; padding: 0; background: none; }
.rvv-mission .wp-block-quote p {
	font-family: var(--rvv-display); font-weight: 500; font-style: normal; color: #fff;
	font-size: clamp(18px, 2.4vw, 22px); line-height: 1.55; max-width: 60ch;
}

.rvv-pillars { background: var(--rvv-surface); border: 1px solid var(--rvv-line); border-radius: 16px; padding: 28px clamp(18px, 3vw, 36px); }
.rvv-hub {
	display: table; margin: 24px auto 0 !important; background: var(--rvv-navy); color: #fff;
	border-radius: 999px; padding: 12px 28px; font-family: var(--rvv-display); font-weight: 600; font-size: 18px;
}
.rvv-pillar-row { border-top: 1px solid var(--rvv-line); padding-top: 18px; }
.rvv-pillar {
	border-top: 3px solid var(--rvv-green); background: var(--rvv-tint);
	border-radius: 0 0 10px 10px; padding: 14px; display: flex; flex-direction: column; gap: 4px;
}
.rvv-pillar:nth-child(even) { border-top-color: var(--rvv-blue); }
.rvv-pillar > * { margin: 0 !important; }
.rvv-pillar p { font-size: 14px; color: var(--rvv-muted); }

.rvv-goal {
	border-left: 4px solid var(--rvv-amber); background: var(--rvv-green-bg);
	padding: 20px 24px; font-size: 17px; color: var(--rvv-ink);
}
.rvv-goal strong { font-family: var(--rvv-display); }

.rvv-shape { background: var(--rvv-surface); border: 1px solid var(--rvv-line); border-radius: 16px; padding: 28px clamp(18px, 3vw, 36px); }
.rvv-shape-cols { align-items: center !important; margin: 0 !important; gap: 24px; flex-wrap: wrap !important; }
.rvv-shape-cols > .rvv-shape-text { flex: 2 1 320px !important; }
.rvv-shape-cols > .rvv-shape-actions { flex: 1 1 240px !important; }
.rvv-shape-actions .wp-block-button__link { white-space: nowrap; }
.rvv-shape-text > * + * { margin-top: 8px; }
.rvv-shape-actions .wp-block-buttons { justify-content: flex-end; gap: 12px; }
.rvv-section .wp-block-button__link {
	background: var(--rvv-blue) !important; color: #fff !important; border: 2px solid var(--rvv-blue) !important;
	border-radius: 8px !important; padding: 11px 18px; font-weight: 600; font-size: 15px; text-decoration: none;
}
.rvv-section .is-style-outline .wp-block-button__link { background: transparent !important; color: var(--rvv-blue) !important; }

.rvv-credit { font-size: 13px; color: var(--rvv-muted, #5b6a7e); }


/* ---------- Division pages (RoboCity) ---------- */
.rvv-eyebrow a { color: inherit; text-decoration: none; }
.rvv-eyebrow a:hover { text-decoration: underline; }
.rvv-subtitle { font-family: var(--rvv-display); font-weight: 500; font-size: clamp(18px, 2.4vw, 22px) !important; color: var(--rvv-muted); margin-top: 6px !important; }
.rvv-tagline { font-family: var(--rvv-display); font-weight: 700; font-size: clamp(20px, 2.8vw, 26px) !important; color: var(--rvv-green); }

/* Start point → chips */
.rvv-path-start {
	display: inline-flex; align-items: center; gap: 10px; font-weight: 600; color: var(--rvv-ink);
	background: var(--rvv-tint); border: 1px solid var(--rvv-line); border-radius: 999px; padding: 8px 16px;
}
.rvv-path-start::after { content: "\2193"; color: var(--rvv-blue); font-weight: 700; }
ul.rvv-chips { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
ul.rvv-chips li {
	margin: 0; background: var(--rvv-soft); color: var(--rvv-ink); border-radius: 999px;
	padding: 8px 16px; font-weight: 600; font-size: 15px;
}
ul.rvv-chips-roles li { background: var(--rvv-surface); border: 1px solid var(--rvv-line); }

/* Six tiles in rows of three */
.wp-block-columns.rvv-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 20px 0 0; }
.wp-block-columns.rvv-grid-3 > .wp-block-column { margin: 0; min-width: 0; }
.rvv-card-row { flex-direction: row !important; align-items: center; gap: 14px !important; }
.rvv-card-row h3 { font-size: 16px; }

/* Five steps that repeat */
ol.rvv-steps { list-style: none; counter-reset: rvv-step; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 28px; }
ol.rvv-steps li {
	counter-increment: rvv-step; position: relative; margin: 0; background: var(--rvv-surface);
	border: 1px solid var(--rvv-line); border-radius: 12px; padding: 14px 12px; text-align: center;
	font-family: var(--rvv-display); font-weight: 600; color: var(--rvv-ink);
}
ol.rvv-steps li::before { content: counter(rvv-step); display: block; font-size: 12px; color: var(--rvv-green); letter-spacing: .1em; }
ol.rvv-steps li:not(:last-child)::after {
	content: "\2192"; position: absolute; right: -21px; top: 50%; transform: translateY(-50%);
	color: var(--rvv-blue); font-weight: 700;
}
.rvv-loop-note { font-size: 14px !important; color: var(--rvv-muted); }
.rvv-loop-note::before { content: "\21BB  "; color: var(--rvv-blue); font-weight: 700; }

/* Hub and the parts it serves */
.rvv-ecosystem .rvv-hub { margin-top: 24px !important; }
ul.rvv-spokes {
	list-style: none; padding: 18px 0 0; margin-top: 18px !important; border-top: 1px solid var(--rvv-line);
	display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; position: relative;
}
ul.rvv-spokes::before { content: ""; position: absolute; left: 50%; top: -18px; height: 18px; border-left: 1px solid var(--rvv-line); }
ul.rvv-spokes li {
	margin: 0; text-align: center; background: var(--rvv-tint); border-top: 3px solid var(--rvv-green);
	border-radius: 0 0 10px 10px; padding: 12px 8px; font-weight: 600; color: var(--rvv-ink); font-size: 15px;
}
ul.rvv-spokes li:nth-child(even) { border-top-color: var(--rvv-blue); }

/* Fewer steps or spokes: one column each, as many as there are */
ol.rvv-steps.rvv-n-2, ul.rvv-spokes.rvv-n-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
ol.rvv-steps.rvv-n-3, ul.rvv-spokes.rvv-n-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
ol.rvv-steps.rvv-n-4, ul.rvv-spokes.rvv-n-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
ol.rvv-steps.rvv-n-2 { max-width: 640px; }

.rvv-back a { font-weight: 600; text-decoration: none; color: var(--rvv-blue, #1f5fbf); }

@container (max-width: 760px) {
	.wp-block-columns.rvv-grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	ol.rvv-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	ol.rvv-steps li:nth-child(3)::after { display: none; }
	ul.rvv-spokes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@container (max-width: 480px) {
	.wp-block-columns.rvv-grid-3, ul.rvv-spokes, ul.rvv-spokes[class*="rvv-n-"] { grid-template-columns: minmax(0, 1fr); }
	ol.rvv-steps, ol.rvv-steps[class*="rvv-n-"] { grid-template-columns: minmax(0, 1fr); gap: 22px; }
	ol.rvv-steps li:not(:last-child)::after { content: "\2193"; right: auto; left: 50%; top: auto; bottom: -21px; transform: translateX(-50%); display: block; }
}

/* Sections adapt to the width the theme gives them (container queries), not the screen. */
@container (max-width: 900px) {
	.wp-block-columns.rvv-grid-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@container (max-width: 560px) {
	.wp-block-columns.rvv-grid-5 { grid-template-columns: minmax(0, 1fr); }
	.rvv-shape-actions .wp-block-buttons { justify-content: flex-start; }
}
@media (max-width: 520px) {
	.rvv-page, .rvv-page > .wp-block-group__inner-container { gap: 40px; }
}

/* ---------- Overview pages ---------- */
.wp-block-columns.rvv-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0; }
.wp-block-columns.rvv-stats > .wp-block-column { margin: 0; }
.rvv-stat { background: var(--rvv-surface); border: 1px solid var(--rvv-line); border-radius: 12px; padding: 18px 20px; }
.rvv-stat > * { margin: 0 !important; }
.rvv-stat-num { font-family: var(--rvv-display); font-weight: 700; color: var(--rvv-blue); font-size: clamp(30px, 4.5vw, 44px) !important; line-height: 1.1; font-variant-numeric: tabular-nums; }
.rvv-stat-label { color: var(--rvv-muted); font-size: 15px !important; }
.rvv-zone-card .rvv-tag { color: var(--rvv-blue); background: var(--rvv-soft); }
.rvv-zone-card h3 { font-size: 19px; }
@container (max-width: 480px) {
	.wp-block-columns.rvv-stats { grid-template-columns: minmax(0, 1fr); }
}
