/*
 * sysdep.ai - 2026 design system.
 *
 * Built from the approved Oct 2026 redesign (docs/design-2026/): the tokens are
 * design-tokens.css verbatim, and every component class below replaces an inline
 * style block that repeated across the handoff's static pages.
 *
 * Sections: tokens / base / layout / header / type / buttons / cards & tiles /
 * chips & badges / lists / FAQ / form / footer / mockups / page-specific.
 *
 * No framework. The production CSP allows inline style attributes but no inline
 * script, so nothing here depends on JavaScript.
 */

/* ── Tokens ─────────────────────────────────────────────────────────────── */
:root {
	--sd-blue: #0069D9;
	--sd-blue-hover: #0058B8;
	--sd-blue-link: #0062CC;
	--sd-blue-link-hover: #004A99;
	--sd-navy: #0B1F3A;
	--sd-navy-deep: #071629;
	--sd-cta: #FFC107;
	--sd-cta-hover: #FFCD38;
	--sd-accent: #FFD166;

	--sd-ink: #1B2A41;
	--sd-muted: #51617A;
	--sd-on-navy: #D6E4F5;
	--sd-on-navy-muted: #B8C6D8;
	--sd-surface: #FFFFFF;
	--sd-surface-alt: #F3F6FB;
	--sd-surface-mock: #F7F9FC;
	--sd-line: #DFE6EF;
	--sd-line-soft: #EEF2F7;
	--sd-input-line: #C3CFDD;

	--sd-mod-dre: #0069D9;
	--sd-mod-time: #1E7E45;
	--sd-mod-email: #6F42C1;
	--sd-mod-calls: #0B6574;
	--sd-mod-organizer: #D9480F;
	--sd-mod-ai: #C2255C;
	--sd-mod-trust: #0B1F3A;
	--sd-mod-leasing: #B33C0C;

	--sd-status-compliant: #1E7E45;
	--sd-status-exception: #C43D0B;
	--sd-status-unknown: #FFC107;
	--sd-status-na: #E9EDF2;

	--sd-font-display: 'Montserrat', system-ui, sans-serif;
	--sd-font-body: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;

	--sd-radius-card: 12px;
	--sd-radius-sm: 8px;
	--sd-radius-btn: 6px;
	--sd-shadow-card: 0 10px 30px -18px rgba(11, 31, 58, 0.4);
	--sd-shadow-raised: 0 20px 50px -24px rgba(11, 31, 58, 0.45);
	--sd-shadow-float: 0 30px 60px -20px rgba(0, 0, 0, 0.6);

	--sd-container: 1240px;
	--sd-gutter: 24px;
}

/* ── Base ───────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
	margin: 0;
	background: var(--sd-surface);
	color: var(--sd-ink);
	font-family: var(--sd-font-body);
	font-size: 16px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	font-variant-numeric: tabular-nums;
	overflow-wrap: break-word;
}
img, svg { max-width: 100%; }
img { height: auto; }
a { color: var(--sd-blue-link); }
a:hover { color: var(--sd-blue-link-hover); }
h1, h2, h3, h4 { margin: 0; font-family: var(--sd-font-display); text-wrap: balance; color: inherit; }
p { margin: 0; text-wrap: pretty; }
ul, ol { margin: 0; }
summary { cursor: pointer; }
[hidden] { display: none !important; }
table { border-collapse: collapse; }
:focus-visible { outline: 3px solid var(--sd-blue-link); outline-offset: 2px; }
.sd-on-navy :focus-visible, .sd-header :focus-visible, .sd-footer :focus-visible { outline-color: var(--sd-accent); }

.sd-skip-link {
	position: absolute; left: 16px; top: -100px; z-index: 100;
	background: var(--sd-cta); color: var(--sd-ink); font-weight: 700;
	padding: 12px 18px; border-radius: var(--sd-radius-btn); text-decoration: none;
}
.sd-skip-link:focus { top: 12px; }
.sd-sr-only {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ── Layout ─────────────────────────────────────────────────────────────── */
.sd-container { max-width: var(--sd-container); margin: 0 auto; padding-left: var(--sd-gutter); padding-right: var(--sd-gutter); }
.sd-container--narrow { max-width: 900px; }
.sd-container--text { max-width: 820px; }
.sd-section { padding: 96px 0; background: var(--sd-surface); }
.sd-section--md { padding: 88px 0; }
.sd-section--sm { padding: 72px 0; }
.sd-section--alt { background: var(--sd-surface-alt); }
.sd-section--line { border-bottom: 1px solid var(--sd-line); }
.sd-section--navy, .sd-on-navy { background-color: var(--sd-navy); color: #FFFFFF; }
/* Navy hero: 40px grid + blue glow (design-tokens .sd-hero-bg) */
.sd-section--grid {
	background-color: var(--sd-navy);
	background-image:
		linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px),
		radial-gradient(ellipse at 85% 0%, rgba(0,105,217,0.5), transparent 60%);
	background-size: 40px 40px, 40px 40px, 100% 100%;
	color: #FFFFFF;
}
.sd-section--grid-home { background-image:
		linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px),
		radial-gradient(ellipse at 80% 0%, rgba(0,105,217,0.55), transparent 60%); }
.sd-section--glow { background-color: var(--sd-navy); background-image: radial-gradient(ellipse at 10% 100%, rgba(0,105,217,0.5), transparent 60%); color: #FFFFFF; }

.sd-stack { display: flex; flex-direction: column; gap: 20px; }
.sd-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.sd-row--between { justify-content: space-between; align-items: flex-end; gap: 20px; }
.sd-row--center { justify-content: center; }
.sd-max-640 { max-width: 640px; } .sd-max-680 { max-width: 680px; } .sd-max-720 { max-width: 720px; } .sd-max-780 { max-width: 780px; }
.sd-self-start { align-self: flex-start; } .sd-self-center { align-self: center; }
.sd-text-center { text-align: center; }

/* Auto-fit grid: columns never narrower than --min (or the viewport). */
.sd-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(var(--min, 300px), 100%), 1fr)); gap: 24px; }
.sd-grid--180 { --min: 180px; } .sd-grid--200 { --min: 200px; } .sd-grid--210 { --min: 210px; } .sd-grid--220 { --min: 220px; }
.sd-grid--240 { --min: 240px; } .sd-grid--260 { --min: 260px; } .sd-grid--280 { --min: 280px; } .sd-grid--300 { --min: 300px; }
.sd-grid--320 { --min: 320px; } .sd-grid--340 { --min: 340px; } .sd-grid--360 { --min: 360px; } .sd-grid--420 { --min: 420px; }
.sd-grid--440 { --min: 440px; } .sd-grid--460 { --min: 460px; } .sd-grid--480 { --min: 480px; }
.sd-grid--center { align-items: center; } .sd-grid--end { align-items: end; } .sd-grid--start { align-items: start; }

/* Wide tables and app mockups scroll inside their own box at phone width. */
.sd-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ── Header ─────────────────────────────────────────────────────────────── */
.sd-header { background: var(--sd-blue); box-shadow: 0 2px 10px rgba(0,40,100,0.25); position: relative; z-index: 2; }
.sd-header__inner {
	max-width: var(--sd-container); margin: 0 auto; padding: 10px var(--sd-gutter);
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px;
}
.sd-header__logo { display: flex; align-items: center; }
.sd-header__logo img { height: 60px; width: auto; display: block; }
.sd-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 28px; margin-left: auto; }
.sd-nav__link {
	color: #FFFFFF; text-decoration: none; font-weight: 600; font-size: 15px;
	font-family: var(--sd-font-display); min-height: 44px; display: inline-flex; align-items: center;
}
/* Current/hover: the design's yellow, as an underline bar. Yellow TEXT on the
   blue header is ~3.7:1, under the 4.5:1 the handoff requires for 15px text;
   white text with the yellow bar keeps the cue and passes (~5.3:1). */
.sd-nav__link:hover { color: #FFFFFF; box-shadow: inset 0 -3px 0 rgba(255,209,102,0.6); }
.sd-nav__link[aria-current="page"] { color: #FFFFFF; box-shadow: inset 0 -3px 0 var(--sd-accent); }
.sd-nav__cta { font-size: 15px; padding: 12px 22px; }

/* ── Type ───────────────────────────────────────────────────────────────── */
.sd-eyebrow { font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--sd-blue-link); }
.sd-on-navy .sd-eyebrow, .sd-section--navy .sd-eyebrow, .sd-section--grid .sd-eyebrow, .sd-section--glow .sd-eyebrow { color: var(--sd-accent); }
.sd-eyebrow--dre { color: var(--sd-mod-dre); } .sd-eyebrow--time { color: var(--sd-mod-time); }
.sd-eyebrow--email { color: var(--sd-mod-email); } .sd-eyebrow--calls { color: var(--sd-mod-calls); }
.sd-eyebrow--organizer { color: #B33C0C; } .sd-eyebrow--ai { color: var(--sd-mod-ai); }
.sd-h1 { font-size: clamp(38px, 5vw, 62px); line-height: 1.06; letter-spacing: -0.02em; font-weight: 800; }
.sd-h1--page { font-size: clamp(36px, 4.6vw, 56px); line-height: 1.08; letter-spacing: -0.02em; font-weight: 800; }
.sd-h2 { font-size: clamp(30px, 3.4vw, 42px); line-height: 1.15; font-weight: 700; }
.sd-h2--lg { font-size: clamp(32px, 3.8vw, 46px); line-height: 1.1; }
.sd-h2--md { font-size: clamp(28px, 3.2vw, 40px); line-height: 1.15; }
.sd-h2--cta { font-size: clamp(26px, 3vw, 36px); line-height: 1.2; }
.sd-h2--sm { font-size: 28px; line-height: 1.2; }
.sd-h2--card { font-size: 26px; line-height: 1.2; }
.sd-h3 { font-size: 19px; line-height: 1.3; font-weight: 700; }
.sd-h3--sm { font-size: 17px; }
.sd-h3--lg { font-size: 22px; }
.sd-lead { font-size: 18px; line-height: 1.65; color: var(--sd-muted); }
.sd-lead--hero { font-size: 19px; line-height: 1.6; }
.sd-on-navy .sd-lead, .sd-section--navy .sd-lead, .sd-section--grid .sd-lead, .sd-section--glow .sd-lead { color: var(--sd-on-navy); }
.sd-text { font-size: 15px; line-height: 1.6; color: var(--sd-muted); }
.sd-text--16 { font-size: 16px; }
.sd-text--14 { font-size: 14px; line-height: 1.55; }
.sd-muted { color: var(--sd-muted); }
.sd-strong { font-weight: 600; color: var(--sd-ink); }
.sd-link-arrow { font-weight: 700; font-size: 16px; }
.sd-on-navy .sd-link-arrow, .sd-section--navy .sd-link-arrow, .sd-section--grid .sd-link-arrow { color: var(--sd-accent); }
.sd-on-navy .sd-link-arrow:hover, .sd-section--navy .sd-link-arrow:hover, .sd-section--grid .sd-link-arrow:hover { color: #FFFFFF; }

/* ── Buttons ────────────────────────────────────────────────────────────── */
.sd-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	font-family: var(--sd-font-display); font-weight: 700; font-size: 16px; line-height: 1.2;
	padding: 15px 26px; border-radius: var(--sd-radius-btn); border: 0;
	text-decoration: none; text-align: center; min-height: 44px; cursor: pointer;
}
.sd-btn--cta { background: var(--sd-cta); color: var(--sd-ink); }
.sd-btn--cta:hover { background: var(--sd-cta-hover); color: var(--sd-ink); }
.sd-btn--ghost { color: #FFFFFF; padding: 13px 24px; border: 2px solid rgba(255,255,255,0.5); }
.sd-btn--ghost:hover { color: #FFFFFF; border-color: #FFFFFF; background: rgba(255,255,255,0.06); }
.sd-btn--primary { background: var(--sd-blue); color: #FFFFFF; }
.sd-btn--primary:hover { background: var(--sd-blue-hover); color: #FFFFFF; }
.sd-btn--outline { color: var(--sd-blue-link); background: #FFFFFF; padding: 13px 24px; border: 2px solid var(--sd-blue-link); }
.sd-btn--outline:hover { color: var(--sd-blue-link-hover); border-color: var(--sd-blue-link-hover); }
.sd-btn--block { width: 100%; }
.sd-btn[disabled] { opacity: 0.7; cursor: progress; }

/* Hero pill badge */
.sd-pill {
	align-self: flex-start; display: inline-flex; align-items: center; gap: 8px;
	font-size: 13px; font-weight: 600; letter-spacing: 0.04em; color: #CFE3FF;
	border: 1px solid rgba(255,255,255,0.25); padding: 6px 12px; border-radius: 999px;
}
.sd-pill::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--sd-cta); }

/* ── Cards & tiles ──────────────────────────────────────────────────────── */
.sd-card {
	background: #FFFFFF; color: var(--sd-ink); border: 1px solid var(--sd-line);
	border-radius: var(--sd-radius-card); padding: 32px; display: flex; flex-direction: column; gap: 18px;
}
.sd-card--sm { border-radius: 10px; padding: 26px; gap: 12px; }
.sd-card--alt { background: var(--sd-surface-alt); }
.sd-card--shadow { box-shadow: var(--sd-shadow-card); }
.sd-card--raised { box-shadow: var(--sd-shadow-raised); }
.sd-card--accent { border-top: 4px solid var(--accent, var(--sd-blue)); }
.sd-card--link { text-decoration: none; transition: box-shadow .15s ease, transform .15s ease; }
.sd-card--link:hover { color: var(--sd-ink); box-shadow: var(--sd-shadow-raised); transform: translateY(-2px); }
@media (prefers-reduced-motion: reduce) { .sd-card--link:hover { transform: none; } }

/* 1px-divided tile grid (module grid, stats, timeline) */
.sd-tiles {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(min(var(--min, 300px), 100%), 1fr));
	gap: 1px; background: var(--sd-line); border: 1px solid var(--sd-line);
	border-radius: var(--sd-radius-card); overflow: hidden;
}
.sd-tiles > * { background: #FFFFFF; }

.sd-module { padding: 30px; display: flex; gap: 18px; text-decoration: none; color: var(--sd-ink); }
a.sd-module:hover { background: var(--sd-surface-mock); color: var(--sd-ink); }
.sd-module__body { display: flex; flex-direction: column; gap: 8px; }
.sd-module__title { font-family: var(--sd-font-display); font-weight: 700; font-size: 19px; }
.sd-module__text { font-size: 15px; line-height: 1.6; color: var(--sd-muted); }

.sd-icon-tile {
	flex: none; width: 48px; height: 48px; border-radius: 10px; background: var(--sd-blue);
	color: #FFFFFF; display: flex; align-items: center; justify-content: center;
	font-family: var(--sd-font-display); font-weight: 800;
}
.sd-icon-tile svg { width: 24px; height: 24px; }
.sd-icon-tile--sm { width: 44px; height: 44px; }
.sd-icon-tile--sm svg { width: 22px; height: 22px; }
.sd-icon-tile--xs { width: 26px; height: 26px; border-radius: 6px; }
.sd-icon-tile--xs svg { width: 14px; height: 14px; }
.sd-icon-tile--dre { background: var(--sd-mod-dre); }
.sd-icon-tile--time { background: var(--sd-mod-time); }
.sd-icon-tile--email { background: var(--sd-mod-email); }
.sd-icon-tile--calls { background: var(--sd-mod-calls); }
.sd-icon-tile--organizer { background: var(--sd-mod-organizer); }
.sd-icon-tile--ai { background: var(--sd-mod-ai); }
.sd-icon-tile--trust, .sd-icon-tile--navy { background: var(--sd-navy); }
.sd-icon-tile--leasing { background: var(--sd-mod-leasing); }
.sd-icon-tile--lotly { background: var(--sd-mod-time); }
.sd-icon-tile--vosy { background: var(--sd-mod-email); }

/* Stats */
.sd-stat { padding: 26px; display: flex; flex-direction: column; gap: 6px; }
.sd-stat__num { font-family: var(--sd-font-display); font-weight: 800; font-size: 44px; line-height: 1; color: var(--sd-blue); }
.sd-stat__label { font-size: 15px; color: var(--sd-muted); }

/* Numbered steps / timeline */
.sd-steps { list-style: none; padding: 0; }
.sd-step__kicker { font-size: 13px; font-weight: 700; color: var(--sd-blue-link); text-transform: uppercase; letter-spacing: 0.02em; }
.sd-timeline { list-style: none; padding: 0; }
.sd-timeline > li { padding: 24px; display: flex; flex-direction: column; gap: 10px; }
.sd-timeline__time { font-weight: 700; font-size: 13px; }
.sd-timeline__title { font-family: var(--sd-font-display); font-weight: 700; font-size: 17px; }

/* Callout with a colored bar */
.sd-callout {
	display: flex; gap: 14px; align-items: center; padding: 16px 20px;
	border: 1px solid rgba(255,255,255,0.2); border-radius: var(--sd-radius-sm); background: rgba(255,255,255,0.05);
}
.sd-callout::before { content: ""; flex: none; width: 10px; height: 40px; border-radius: 3px; background: var(--sd-cta); }
.sd-callout__text { font-family: var(--sd-font-display); font-weight: 700; font-size: 20px; }
.sd-callout--light { border-color: var(--sd-line); background: var(--sd-surface-alt); }

/* ── Chips & badges ─────────────────────────────────────────────────────── */
.sd-tag { background: var(--sd-surface-alt); border: 1px solid var(--sd-line); border-radius: var(--sd-radius-btn); padding: 6px 12px; font-size: 15px; color: var(--sd-muted); }
.sd-tag--plain { background: var(--sd-surface-alt); border: 0; padding: 11px 14px; font-size: 14px; font-weight: 600; color: var(--sd-ink); }
.sd-sample { flex: none; font-size: 12px; font-weight: 700; color: #5A4300; background: #FFF3CD; padding: 6px 10px; border-radius: 999px; white-space: nowrap; }
.sd-chip { justify-self: start; align-self: center; font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 4px; white-space: nowrap; }
.sd-chip--occupied { color: #155D33; background: #E3F4EA; }
.sd-chip--showing { color: #4B2A8A; background: #F0EAFB; }
.sd-chip--moveout { color: #9A3A06; background: #FFF0E5; }
.sd-chip--renewal { color: #0B4F8A; background: #E3EFFC; }
.sd-chip--neutral { color: var(--sd-muted); background: var(--sd-status-na); }
.sd-status { font-size: 12px; font-weight: 700; padding: 5px 10px; border-radius: 4px; white-space: nowrap; text-align: center; }
.sd-status--compliant { color: #FFFFFF; background: var(--sd-status-compliant); }
.sd-status--exception { color: #FFFFFF; background: var(--sd-status-exception); }
.sd-status--unknown { color: var(--sd-ink); background: var(--sd-status-unknown); }
.sd-status--na { color: var(--sd-muted); background: var(--sd-status-na); }

/* ── Lists ──────────────────────────────────────────────────────────────── */
.sd-checks { list-style: none; padding: 0; display: grid; gap: 12px; }
.sd-checks--grid { grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); }
.sd-checks > li { display: flex; gap: 10px; align-items: flex-start; font-size: 16px; line-height: 1.4; }
.sd-check {
	flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--sd-blue); color: #FFFFFF;
	display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700;
}
.sd-checks--cta { gap: 14px; }
.sd-checks--cta > li { align-items: center; font-size: 17px; color: var(--sd-on-navy); gap: 12px; }
.sd-checks--cta .sd-check { width: 26px; height: 26px; background: var(--sd-cta); color: var(--sd-ink); font-size: 13px; }
.sd-plain-list { list-style: none; padding: 0; }

/* ── Tables ─────────────────────────────────────────────────────────────── */
.sd-table { width: 100%; background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: var(--sd-radius-card); border-collapse: separate; border-spacing: 0; overflow: hidden; font-size: 15px; }
.sd-table th, .sd-table td { padding: 14px 18px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--sd-line-soft); }
.sd-table thead th { font-size: 12px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--sd-muted); background: var(--sd-surface-mock); border-bottom: 1px solid var(--sd-line); }
.sd-table tbody th { font-weight: 600; }
.sd-table tbody tr:last-child > * { border-bottom: 0; }
.sd-table--wide { min-width: 720px; }
.sd-table .sd-col-us { background: #F2F7FF; }
.sd-table thead .sd-col-us { background: var(--sd-blue); color: #FFFFFF; }
.sd-yes { color: var(--sd-status-compliant); font-weight: 700; }
.sd-no { color: var(--sd-muted); }

/* ── FAQ (native <details>, answers always in the HTML) ─────────────────── */
.sd-faq { display: flex; flex-direction: column; background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: var(--sd-radius-card); overflow: hidden; }
.sd-faq-item { border-bottom: 1px solid var(--sd-line); padding: 20px 24px; }
.sd-faq-item:last-child { border-bottom: 0; }
.sd-faq-item > summary { list-style-position: outside; min-height: 24px; }
.sd-faq-q { display: inline; font-family: var(--sd-font-display); font-weight: 700; font-size: 17px; line-height: 1.4; }
.sd-faq-a { margin: 14px 0 0; font-size: 16px; line-height: 1.6; color: var(--sd-muted); }
.sd-faq-group { display: flex; flex-direction: column; gap: 16px; }

/* ── Demo form ──────────────────────────────────────────────────────────── */
.sd-form {
	background: #FFFFFF; color: var(--sd-ink); border-radius: var(--sd-radius-card); padding: 30px;
	box-shadow: 0 30px 60px -24px rgba(0,0,0,0.6);
	display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 16px;
}
.sd-form--flat { box-shadow: var(--sd-shadow-raised); border: 1px solid var(--sd-line); }
.sd-field { display: flex; flex-direction: column; gap: 6px; }
.sd-field--full { grid-column: 1 / -1; }
.sd-field label { font-size: 13px; font-weight: 600; }
.sd-field .sd-optional { font-weight: 400; color: var(--sd-muted); }
.sd-input {
	font: inherit; font-size: 15px; color: var(--sd-ink); width: 100%;
	padding: 11px 12px; border: 1px solid var(--sd-input-line); border-radius: var(--sd-radius-btn);
	min-height: 44px; background: #FFFFFF;
}
.sd-input:focus { border-color: var(--sd-blue); outline: 3px solid rgba(0,105,217,0.25); outline-offset: 0; }
textarea.sd-input { min-height: 110px; resize: vertical; line-height: 1.5; }
.sd-form__submit { grid-column: 1 / -1; min-height: 50px; padding: 15px; }
.sd-form-status { grid-column: 1 / -1; margin: 0; padding: 12px 14px; border-radius: var(--sd-radius-btn); font-size: 15px; line-height: 1.5; background: #E7F1FF; color: var(--sd-ink); }
.sd-form-status[data-state="error"] { background: #FDECE6; }
.sd-form-status[hidden] { display: none; }
.sd-form-note { grid-column: 1 / -1; font-size: 13px; color: var(--sd-muted); }
/* Bot trap: off-screen, never visible, never in the tab order. */
.sd-captcha { min-height: 65px; }
.sd-hp { position: absolute !important; left: -10000px !important; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* ── Footer ─────────────────────────────────────────────────────────────── */
.sd-footer { background: var(--sd-navy-deep); color: #DDE6F2; }
.sd-footer__inner { max-width: var(--sd-container); margin: 0 auto; padding: 64px var(--sd-gutter) 36px; display: flex; flex-direction: column; gap: 40px; }
.sd-footer__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 32px; }
.sd-footer__brand { display: flex; flex-direction: column; gap: 14px; }
.sd-footer__brand img { height: 56px; width: auto; align-self: flex-start; }
.sd-footer__about { font-size: 14px; line-height: 1.6; color: var(--sd-on-navy-muted); font-style: normal; }
.sd-footer__nav { display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.sd-footer__heading { font-family: var(--sd-font-display); font-weight: 700; font-size: 14px; color: var(--sd-accent); }
.sd-footer__nav a { color: #DDE6F2; text-decoration: none; min-height: 24px; }
.sd-footer__nav a:hover { color: #FFFFFF; text-decoration: underline; }
.sd-footer__bottom {
	border-top: 1px solid rgba(255,255,255,0.12); padding-top: 20px; font-size: 13px; color: var(--sd-on-navy-muted);
	display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px;
}

/* ── Prose (privacy, long-form) ─────────────────────────────────────────── */
.sd-prose { font-size: 17px; line-height: 1.7; color: var(--sd-ink); }
.sd-prose > * + * { margin-top: 18px; }
.sd-prose h2 { font-size: 26px; margin-top: 44px; }
.sd-prose h3 { font-size: 20px; margin-top: 32px; }
.sd-prose ul, .sd-prose ol { padding-left: 22px; }
.sd-prose li + li { margin-top: 8px; }

/* ── Inner-page hero, breadcrumbs, CTA band ─────────────────────────────── */
.sd-hero { padding: 72px 0; }
.sd-hero--deep { padding-bottom: 140px; }
.sd-hero__actions { padding-top: 6px; }
.sd-max-700 { max-width: 700px; } .sd-max-860 { max-width: 860px; }
.sd-crumbs ol { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; font-size: 14px; color: var(--sd-on-navy-muted); }
.sd-crumbs li + li::before { content: "/"; content: "/" / ""; margin-right: 8px; color: var(--sd-on-navy-muted); }
.sd-crumbs a { color: var(--sd-accent); }
.sd-crumbs a:hover { color: #FFFFFF; }
.sd-cta-band { align-items: center; gap: 24px; }

/* ── Mockups (HTML/CSS illustrations, always labeled "Sample data") ─────── */
.sd-app-frame { border-radius: 12px 12px 0 0; box-shadow: 0 -10px 60px -10px rgba(0,105,217,0.6); }
.sd-app {
	min-width: 980px; display: flex; background: var(--sd-surface-alt); color: var(--sd-ink);
	border-radius: 12px 12px 0 0; overflow: hidden; border: 1px solid rgba(255,255,255,0.15); border-bottom: 0;
}
.sd-app--card { border-radius: var(--sd-radius-card); border: 1px solid var(--sd-line); box-shadow: var(--sd-shadow-raised); min-width: 0; }
.sd-app__side { width: 210px; flex: none; background: var(--sd-navy); border-right: 1px solid #1C3354; padding: 18px 14px; display: flex; flex-direction: column; gap: 4px; }
.sd-app__side img { height: 40px; width: auto; align-self: flex-start; margin-bottom: 14px; }
.sd-app__nav { display: flex; align-items: center; gap: 10px; padding: 9px 10px; color: #C3D2E6; font-size: 14px; border-radius: 6px; }
.sd-app__nav.is-active { background: var(--sd-blue); color: #FFFFFF; font-weight: 600; }
.sd-app__main { flex: 1; min-width: 0; padding: 22px 24px 28px; display: flex; flex-direction: column; gap: 18px; }
.sd-app__top { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.sd-app__crumb { font-size: 12px; color: var(--sd-muted); }
.sd-app__title { font-family: var(--sd-font-display); font-weight: 700; font-size: 20px; }
.sd-app__search { font-size: 13px; color: var(--sd-muted); background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: 6px; padding: 8px 12px; width: 220px; }
.sd-app__cols { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 14px; }
.sd-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.sd-kpi { background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: 8px; padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.sd-kpi__label { font-size: 12px; color: var(--sd-muted); }
.sd-kpi__value { font-family: var(--sd-font-display); font-weight: 800; font-size: 26px; }
.sd-kpi__value--ok { color: var(--sd-status-compliant); }
.sd-kpi__note { font-size: 12px; color: var(--sd-muted); }
.sd-kpi__note--up { color: var(--sd-status-compliant); font-weight: 600; }
.sd-meter { display: block; height: 6px; background: #E7EDF5; border-radius: 3px; overflow: hidden; margin-top: 2px; }
.sd-meter > span { display: block; height: 100%; background: var(--sd-blue); }
.sd-panel { background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: 8px; overflow: hidden; }
.sd-panel__head { display: flex; justify-content: space-between; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--sd-line); font-size: 14px; }
.sd-panel__link { font-size: 13px; color: var(--sd-blue-link); font-weight: 600; }
.sd-mrow { display: grid; grid-template-columns: 2fr 1fr 1fr 0.8fr; gap: 10px; padding: 11px 16px; font-size: 13px; border-top: 1px solid var(--sd-line-soft); align-items: center; }
.sd-mrow b { font-weight: 600; }
.sd-mrow--head { padding: 9px 16px; font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--sd-muted); background: var(--sd-surface-mock); border-top: 0; }
.sd-num { text-align: right; }
.sd-brief { padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.sd-brief__title { font-weight: 700; font-size: 14px; }
.sd-brief__item { font-size: 13px; line-height: 1.45; padding: 9px 10px; border-radius: 6px; }
.sd-brief__item--orange { background: #FFF4EC; } .sd-brief__item--purple { background: #F3EEFC; }
.sd-brief__item--green { background: #E9F7EF; } .sd-brief__item--blue { background: #E7F1FF; }

/* DRE audit card */
.sd-audit { background: #FFFFFF; color: var(--sd-ink); border-radius: 10px; overflow: hidden; box-shadow: var(--sd-shadow-float); }
.sd-audit__head { padding: 14px 18px; border-bottom: 1px solid var(--sd-line); display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.sd-audit__title { font-weight: 700; font-size: 15px; }
.sd-audit__sub { font-size: 12px; color: var(--sd-muted); }
.sd-audit__bar { display: flex; height: 8px; }
.sd-audit__bar .is-ok { background: var(--sd-status-compliant); }
.sd-audit__bar .is-ex { background: var(--sd-status-exception); }
.sd-audit__bar .is-unk { background: var(--sd-status-unknown); }
.sd-audit__row { display: grid; grid-template-columns: 80px 1fr auto; gap: 14px; align-items: center; padding: 14px 18px; border-bottom: 1px solid var(--sd-line-soft); font-size: 14px; }
.sd-audit__row:last-child { border-bottom: 0; }
.sd-audit__area { font-size: 11px; font-weight: 700; color: var(--sd-muted); text-transform: uppercase; }

/* ── Home ───────────────────────────────────────────────────────────────── */
.sd-hero-home { padding: 80px 0 0; }
.sd-strip { background: #FFFFFF; border-bottom: 1px solid var(--sd-line); }
.sd-strip__inner { padding-top: 26px; padding-bottom: 26px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 32px; }
.sd-strip__label { font-size: 14px; font-weight: 600; color: var(--sd-muted); }
.sd-strip__names { display: flex; flex-wrap: wrap; gap: 10px 28px; font-family: var(--sd-font-display); font-weight: 700; font-size: 16px; color: #3B4B63; }
.sd-house { background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: 10px; overflow: hidden; box-shadow: var(--sd-shadow-card); }
.sd-house__art { height: 110px; display: flex; align-items: flex-end; justify-content: center; }
.sd-house__art--blue { background: linear-gradient(160deg, #CFE3FF, #E7F1FF); }
.sd-house__art--purple { background: linear-gradient(160deg, #E4D9FA, #F3EEFC); }
.sd-house__art--orange { background: linear-gradient(160deg, #FFDCC7, #FFF0E5); }
.sd-house__art--teal { background: linear-gradient(160deg, #CDEFF3, #E3F6F9); }
.sd-house__body { padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; }
.sd-house__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.sd-house__addr { font-weight: 700; font-size: 15px; }
.sd-house__meta { font-size: 13px; color: var(--sd-muted); }
.sd-house__note { font-size: 13px; border-top: 1px solid var(--sd-line-soft); padding-top: 8px; }
.sd-c-dre { color: var(--sd-blue-link); } .sd-c-calls { color: var(--sd-mod-calls); } .sd-c-time { color: var(--sd-mod-time); }
.sd-c-ai { color: var(--sd-mod-ai); } .sd-c-organizer { color: #B33C0C; } .sd-c-email { color: var(--sd-mod-email); }
.sd-also { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; font-size: 15px; color: var(--sd-muted); }
.sd-partner { display: flex; gap: 16px; align-items: flex-start; }
.sd-partner__name { font-family: var(--sd-font-display); font-weight: 700; font-size: 18px; color: var(--sd-ink); }
.sd-partner__text { font-size: 15px; color: var(--sd-muted); }
.sd-footer__address { display: inline; font-style: normal; }
.sd-audit__bar .is-na { background: #C9D3E0; }
.sd-link-arrow--sm { font-size: 15px; }

/* ── Module previews (features hub + feature heroes) ────────────────────── */
.sd-preview { background: var(--sd-surface-mock); color: var(--sd-ink); border: 1px solid var(--sd-line); border-radius: 10px; padding: 16px; display: flex; flex-direction: column; gap: 10px; font-size: 13px; line-height: 1.45; }
.sd-preview--flush { padding: 0; gap: 0; overflow: hidden; }
.sd-preview--white { background: #FFFFFF; border-color: transparent; padding: 18px; }
.sd-preview__pad { padding: 10px 16px; }
.sd-preview__head { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.sd-preview__note { font-size: 11px; color: var(--sd-muted); }
.sd-preview__box { background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: 8px; padding: 12px; display: flex; flex-direction: column; gap: 4px; }
.sd-preview__draft { background: #F3EEFC; border: 1px solid #DCCDF7; border-radius: 8px; padding: 12px; display: flex; flex-direction: column; gap: 6px; }
.sd-preview__draft-label { font-size: 11px; font-weight: 700; color: #4B2A8A; text-transform: uppercase; letter-spacing: 0.02em; }
.sd-preview__quote { line-height: 1.55; }
.sd-pcounts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; text-align: center; }
.sd-pcount { background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: 8px; padding: 12px 6px; display: flex; flex-direction: column; gap: 2px; }
.sd-pcount__num { font-family: var(--sd-font-display); font-weight: 800; font-size: 22px; }
.sd-pcount__num.is-ok { color: var(--sd-status-compliant); } .sd-pcount__num.is-ex { color: var(--sd-status-exception); }
.sd-pcount__num.is-unk { color: #8A6300; } .sd-pcount__num.is-na { color: var(--sd-muted); }
.sd-pcount__label { font-size: 11px; color: var(--sd-muted); }
.sd-audit__bar--round { border-radius: 4px; overflow: hidden; }
.sd-ptable > div { display: grid; gap: 8px; padding: 10px 16px; border-top: 1px solid var(--sd-line); }
.sd-ptable--time > div { grid-template-columns: 1.4fr 0.8fr 0.8fr 1fr; }
.sd-ptable--ledger > div { grid-template-columns: 0.7fr 2fr 1fr; }
.sd-ptable .sd-ptable__head { background: var(--sd-line-soft); font-size: 11px; font-weight: 700; color: var(--sd-muted); text-transform: uppercase; letter-spacing: 0.02em; border-top: 0; }
.sd-ptable .is-total { font-weight: 700; }
.sd-ptable .is-ot { color: var(--sd-status-exception); font-weight: 600; }
.sd-chip--calls { color: var(--sd-mod-calls); background: #E3F6F9; }
.sd-chip--ai { color: #9C1F50; background: #FDEEF4; }
.sd-wave { display: flex; gap: 3px; align-items: center; height: 28px; }
.sd-wave > span { display: block; width: 4px; background: var(--sd-mod-calls); }
.sd-wave > span.is-dim { background: #9FB3C8; }
.sd-pday { display: grid; grid-template-columns: 70px 1fr; gap: 10px; background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: 6px; padding: 10px 12px; }
.sd-pday > span:first-child { font-weight: 700; color: #B33C0C; }
.sd-pbtn { display: inline-block; font-size: 12px; font-weight: 700; color: var(--sd-ink); border: 1px solid var(--sd-input-line); padding: 6px 12px; border-radius: 5px; }
.sd-pbtn--primary { color: #FFFFFF; background: var(--sd-blue); border-color: var(--sd-blue); }

/* ── Features hub ───────────────────────────────────────────────────────── */
.sd-tabs { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 12px; }
.sd-tab { color: var(--sd-on-navy); text-decoration: none; font-size: 14px; font-weight: 600; padding: 10px 14px; border-radius: 6px; border: 1px solid rgba(255,255,255,0.18); min-height: 44px; display: inline-flex; align-items: center; }
.sd-tab:hover { background: rgba(255,255,255,0.1); color: #FFFFFF; }
.sd-hub { padding-top: 72px; }
.sd-fcard {
	background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: var(--sd-radius-card); padding: 32px;
	display: grid; grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr)); gap: 32px; align-items: center;
	scroll-margin-top: 16px;
}
.sd-fcard--navy { background: var(--sd-navy); color: #FFFFFF; border-color: var(--sd-navy); }
.sd-fcard--navy .sd-text { color: var(--sd-on-navy); }
.sd-fcard--navy .sd-bullets { color: #E8F1FF; }
.sd-hub__core { padding-top: 24px; scroll-margin-top: 16px; }
.sd-eyebrow--trust { color: var(--sd-blue-link); } .sd-eyebrow--leasing { color: #B33C0C; }
.sd-bullets { margin: 0; padding: 0 0 0 18px; display: flex; flex-direction: column; gap: 8px; font-size: 15px; line-height: 1.5; }
.sd-bullets--cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 8px 32px; }
.sd-h3--18 { font-size: 18px; }
.sd-link-arrow--xs { font-size: 14px; }
.sd-card--plain { box-shadow: none; }

/* ── Feature page ───────────────────────────────────────────────────────── */
.sd-fhero { padding: 64px 0 72px; }
.sd-fhero--flush { padding-bottom: 0; }
.sd-fhero__preview { width: 100%; max-width: 640px; margin: 0 auto; box-shadow: 0 30px 60px -24px rgba(0,0,0,0.6); border-radius: 10px; }
.sd-answer { font-size: 19px; line-height: 1.65; color: var(--sd-ink); max-width: 860px; }
.sd-gap-36 { gap: 36px; }
.sd-legend { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 12px; }
.sd-legend > li { display: flex; gap: 12px; align-items: center; background: var(--sd-surface-alt); border-radius: 8px; padding: 14px 16px; font-size: 14px; color: var(--sd-muted); }
.sd-shot { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.sd-shot img { width: 100%; max-width: 1000px; border: 1px solid var(--sd-line); border-radius: var(--sd-radius-card); box-shadow: var(--sd-shadow-raised); }
.sd-shot figcaption { font-size: 14px; color: var(--sd-muted); }
.sd-qgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(460px, 100%), 1fr)); gap: 24px; align-items: start; }
.sd-qcard { gap: 14px; }
.sd-statement-band { border-top: 1px solid var(--sd-line); }
.sd-statement { display: flex; flex-direction: column; gap: 16px; align-items: center; text-align: center; }
.sd-statement__text { font-family: var(--sd-font-display); font-weight: 700; font-size: clamp(24px, 3vw, 34px); line-height: 1.3; }
.sd-statement__sub { font-size: 15px; color: var(--sd-muted); }
.sd-next { background: #FFFFFF; border-bottom: 1px solid var(--sd-line); }
.sd-next__inner { padding-top: 32px; padding-bottom: 32px; display: flex; flex-wrap: wrap; gap: 12px 28px; align-items: center; font-size: 15px; }
.sd-next__inner a { min-height: 24px; }
.sd-table-box { background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: 10px; }
.sd-table-box .sd-table { border: 0; border-radius: 0; }
.sd-table--navy thead th { background: var(--sd-navy); color: #FFFFFF; font-size: 12px; letter-spacing: 0.05em; padding: 14px 20px; border-bottom: 0; }
.sd-table--navy tbody th, .sd-table--navy tbody td { padding: 16px 20px; border-top: 1px solid var(--sd-line); border-bottom: 0; }
.sd-table--navy tbody th { font-weight: 700; }
.sd-table--navy tbody td { color: var(--sd-muted); }
.sd-table--wide { min-width: 640px; }

/* DRE screen (feature hero) */
.sd-dreapp { min-width: 940px; background: var(--sd-surface-alt); color: var(--sd-ink); border-radius: 12px 12px 0 0; padding: 22px 24px 28px; display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 16px; }
.sd-panel__head--tall { align-items: center; padding: 14px 16px; }
.sd-panel__head--tall b { font-size: 15px; }
.sd-dreapp__filters { display: flex; gap: 6px; padding: 10px 16px; border-bottom: 1px solid var(--sd-line); font-size: 12px; font-weight: 600; }
.sd-dreapp__filters > span { padding: 5px 10px; border-radius: 5px; background: var(--sd-line-soft); color: var(--sd-muted); }
.sd-dreapp__filters > .is-active { background: var(--sd-blue); color: #FFFFFF; }
.sd-dreapp__filters > .is-ex { background: #FFF0E5; color: #9A3A06; }
.sd-dreapp__filters > .is-unk { background: #FFF8E1; color: #6B4E00; }
.sd-dreapp__row { display: grid; grid-template-columns: 90px 1fr 110px 90px; gap: 10px; padding: 11px 16px; border-top: 1px solid var(--sd-line-soft); font-size: 13px; align-items: center; }
.sd-dreapp__row--head { padding: 9px 16px; background: var(--sd-surface-mock); font-size: 11px; font-weight: 700; color: var(--sd-muted); text-transform: uppercase; border-top: 0; }
.sd-dreapp .is-missing { color: var(--sd-status-exception); font-weight: 600; }
.sd-status--sm { font-size: 11px; padding: 4px 8px; justify-self: start; }
.sd-kpi--lg { padding: 16px; gap: 10px; }
.sd-kpi__value--xl { font-size: 34px; }
.sd-kpi__note--13 { font-size: 13px; }

/* ── Pricing: quote builder ─────────────────────────────────────────────── */
.sd-qb-wrap { background: var(--sd-surface); }
.sd-qb { margin-top: -100px; padding-bottom: 88px; display: flex; flex-wrap: wrap; gap: 20px; align-items: flex-start; position: relative; }
.sd-qb__builder { flex: 999 1 560px; min-width: 0; background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: var(--sd-radius-card); box-shadow: var(--sd-shadow-raised); overflow: hidden; }
.sd-qb__bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 16px 24px; border-bottom: 1px solid var(--sd-line); background: var(--sd-surface-mock); font-size: 13px; }
.sd-qb__bar b { font-size: 15px; }
.sd-qb__body { padding: 28px 24px; display: flex; flex-direction: column; gap: 30px; }
.sd-qb__set { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.sd-qb__set legend { font-family: var(--sd-font-display); font-weight: 700; font-size: 18px; padding: 0 0 12px; }
.sd-qb-size { font: inherit; font-size: 15px; font-weight: 600; padding: 11px 18px; min-height: 46px; border-radius: 6px; cursor: pointer; background: #FFFFFF; color: var(--sd-ink); border: 1px solid var(--sd-input-line); }
.sd-qb-size[aria-pressed="true"] { background: var(--sd-blue); color: #FFFFFF; border-color: var(--sd-blue); }
.sd-qb-mod { font: inherit; text-align: left; display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; min-height: 72px; border-radius: 8px; cursor: pointer; color: var(--sd-ink); background: #FFFFFF; border: 1px solid var(--sd-line); }
.sd-qb-mod[aria-pressed="true"] { background: #EEF5FF; border-color: var(--sd-blue); box-shadow: inset 0 0 0 1px var(--sd-blue); }
.sd-qb-mod__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; width: 100%; }
.sd-qb-mod__label { font-weight: 700; font-size: 15px; }
.sd-qb-mod__sub { font-size: 13px; color: var(--sd-muted); }
.sd-qb-box { width: 20px; height: 20px; flex: none; border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; background: #FFFFFF; border: 1px solid #9FB0C4; color: transparent; }
.sd-qb-mod[aria-pressed="true"] .sd-qb-box { background: var(--sd-blue); border-color: var(--sd-blue); color: #FFFFFF; }
.sd-qb__summary { flex: 1 1 320px; background: var(--sd-navy); color: #FFFFFF; border-radius: var(--sd-radius-card); padding: 26px; display: flex; flex-direction: column; gap: 18px; box-shadow: 0 20px 50px -24px rgba(11,31,58,0.6); }
.sd-qb__k { font-size: 13px; color: var(--sd-on-navy-muted); }
.sd-qb__v { font-family: var(--sd-font-display); font-weight: 700; font-size: 24px; }
.sd-qb__list { font-size: 15px; line-height: 1.5; color: #E8F1FF; }
.sd-qb__incl { border-top: 1px solid rgba(255,255,255,0.15); padding-top: 16px; display: flex; flex-direction: column; gap: 8px; font-size: 14px; color: #E8F1FF; }
.sd-icon-tile--value { width: 40px; height: 40px; border-radius: 8px; font-family: var(--sd-font-body); font-weight: 700; font-size: 15px; }
.sd-icon-tile--value svg { width: 20px; height: 20px; }
.sd-icon-tile--cta { background: var(--sd-cta); color: var(--sd-ink); }
.sd-h3--20 { font-size: 20px; } .sd-h3--21 { font-size: 21px; }

/* ── Solutions / About ──────────────────────────────────────────────────── */
.sd-section--top-72 { padding-top: 72px; }
.sd-grid--270 { --min: 270px; }
.sd-segment { border-radius: var(--sd-radius-card); }
.sd-segment--navy { background: var(--sd-navy); color: #FFFFFF; border-color: var(--sd-navy); }
.sd-segment--navy .sd-text { color: var(--sd-on-navy); }
.sd-lead--17 { font-size: 17px; line-height: 1.6; }
.sd-table--compare thead th { background: var(--sd-surface-mock); color: var(--sd-muted); font-size: 15px; font-weight: 600; text-transform: none; letter-spacing: 0; padding: 18px 20px; }
.sd-table--compare thead th:first-child { width: 34%; }
.sd-table--compare thead th.sd-col-us { background: var(--sd-blue); color: #FFFFFF; font-family: var(--sd-font-display); font-weight: 700; }
.sd-table--compare tbody th, .sd-table--compare tbody td { padding: 15px 20px; border-top: 1px solid var(--sd-line); border-bottom: 0; }
.sd-table--compare tbody th { font-weight: 600; }
.sd-table--compare tbody td { color: var(--sd-muted); }
.sd-table--compare tbody td.sd-col-us { background: #F3F8FF; color: var(--sd-ink); font-weight: 600; }
.sd-chip-link { display: flex; align-items: center; min-height: 48px; padding: 12px 16px; background: #FFFFFF; border: 1px solid var(--sd-line); border-radius: 8px; font-weight: 700; font-size: 15px; text-decoration: none; }
.sd-chip-link:hover { border-color: var(--sd-blue); }
.sd-pillar { border-top: 4px solid var(--sd-blue); gap: 8px; padding: 22px; }
.sd-pillar--time { border-top-color: var(--sd-mod-time); } .sd-pillar--email { border-top-color: var(--sd-mod-email); } .sd-pillar--organizer { border-top-color: var(--sd-mod-organizer); }
.sd-pillar__title { font-family: var(--sd-font-display); font-weight: 700; font-size: 19px; }
.sd-mt-24 { margin-top: 24px; }

.sd-card.sd-partner { flex-direction: row; align-items: flex-start; }

/* ── Gap utilities (last, so they win over .sd-grid / .sd-row / .sd-stack defaults) ── */
.sd-gap-4 { gap: 4px; } .sd-gap-6 { gap: 6px; } .sd-gap-8 { gap: 8px; } .sd-gap-10 { gap: 10px; }
.sd-gap-12 { gap: 12px; } .sd-gap-14 { gap: 14px; } .sd-gap-16 { gap: 16px; } .sd-gap-18 { gap: 18px; } .sd-gap-20 { gap: 20px; }
.sd-gap-22 { gap: 22px; } .sd-gap-24 { gap: 24px; } .sd-gap-28 { gap: 28px; } .sd-gap-32 { gap: 32px; }
.sd-gap-40 { gap: 40px; } .sd-gap-44 { gap: 44px; } .sd-gap-48 { gap: 48px; } .sd-gap-56 { gap: 56px; }
a.sd-tag { text-decoration: none; }
a.sd-tag:hover { color: var(--sd-ink); border-color: #C3CFDD; }
a.sd-partner__name { text-decoration: none; }
a.sd-partner__name:hover { text-decoration: underline; }
.sd-nowrap { white-space: nowrap; }
.sd-max-900 { max-width: 900px; }
.sd-faq-group { scroll-margin-top: 16px; }
.sd-partner-card { scroll-margin-top: 16px; }
.sd-partner-card__logo { height: 64px; display: flex; align-items: center; }
.sd-partner-card__logo img { max-height: 64px; width: auto; }
.sd-demo-hero { padding: 80px 0; }

/* ── Legal pages (/privacy/, /terms/) ───────────────────────────────────── */
.sd-legal { color: var(--sd-ink); font-size: 16px; line-height: 1.7; }
.sd-legal h2 { font-size: 24px; line-height: 1.25; margin: 44px 0 12px; scroll-margin-top: 16px; }
.sd-legal h3 { font-size: 18px; line-height: 1.3; margin: 26px 0 8px; }
.sd-legal p { margin: 0 0 14px; }
.sd-legal ul, .sd-legal ol { margin: 0 0 16px; padding-left: 22px; }
.sd-legal li { margin-bottom: 6px; }
.sd-legal address { font-style: normal; margin: 0 0 14px; }
.sd-legal__caps { text-transform: uppercase; font-size: 15px; }
.sd-legal__meta { color: var(--sd-muted); font-size: 15px; margin: 0 0 8px; }
.sd-legal__toc { background: var(--sd-surface-alt); border: 1px solid var(--sd-line); border-radius: var(--sd-radius-card); padding: 22px 26px; margin: 24px 0 8px; }
.sd-legal__toc h2 { font-size: 17px; margin: 0 0 10px; }
.sd-legal__toc ol { columns: 2 260px; column-gap: 32px; margin: 0; font-size: 15px; }
.sd-legal__toc li { break-inside: avoid; }

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 720px) {
	.sd-section { padding: 72px 0; }
	.sd-section--md { padding: 64px 0; }
	.sd-section--sm { padding: 56px 0; }
	.sd-card { padding: 24px; }
	.sd-form { padding: 22px; }
	.sd-module { padding: 24px; }
}
/* Phones: logo + Book Demo on one row, the five links on the next, so the
   header is ~110px tall instead of three wrapped rows. */
@media (max-width: 720px) {
	.sd-header__inner { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 12px; padding-top: 8px; padding-bottom: 2px; }
	.sd-header__logo img { height: 44px; }
	.sd-nav__cta { grid-column: 2; grid-row: 1; font-size: 14px; padding: 10px 16px; }
	.sd-nav { grid-column: 1 / -1; grid-row: 2; margin-left: 0; justify-content: space-between; gap: 0 12px; }
	.sd-nav__link { font-size: 14px; }
	.sd-hero, .sd-fhero { padding-top: 48px; padding-bottom: 56px; }
	.sd-fhero--flush { padding-bottom: 0; }
	.sd-hero--deep { padding-bottom: 120px; }
	.sd-hero-home { padding-top: 48px; }
	.sd-demo-hero { padding: 56px 0; }
	/* 16px text stops iOS Safari zooming the page when a field is focused. */
	.sd-input { font-size: 16px; }
	.sd-footer__nav a { padding: 6px 0; }
	/* Wide tables: shadows at the edges show there is more to swipe to. */
	.sd-table-box.sd-scroll {
		background:
			linear-gradient(to right, #FFFFFF 30%, rgba(255,255,255,0)) 0 0 / 40px 100% no-repeat local,
			linear-gradient(to left, #FFFFFF 30%, rgba(255,255,255,0)) 100% 0 / 40px 100% no-repeat local,
			radial-gradient(farthest-side at 0 50%, rgba(11,31,58,0.22), rgba(11,31,58,0)) 0 0 / 14px 100% no-repeat scroll,
			radial-gradient(farthest-side at 100% 50%, rgba(11,31,58,0.22), rgba(11,31,58,0)) 100% 0 / 14px 100% no-repeat scroll,
			#FFFFFF;
	}
	.sd-table-box.sd-scroll .sd-table, .sd-table-box.sd-scroll .sd-table tbody td, .sd-table-box.sd-scroll .sd-table tbody th { background-color: transparent; }
	.sd-table-box.sd-scroll .sd-table tbody td.sd-col-us { background-color: rgba(0,105,217,0.06); }
}
@media (max-width: 480px) {
	:root { --sd-gutter: 18px; }
	.sd-section { padding: 64px 0; }
	.sd-section--md { padding: 56px 0; }
	.sd-stat__num { font-size: 38px; }
	.sd-qb__body { padding: 22px 18px; }
}
@media (max-width: 374px) {
	.sd-nav { gap: 0 8px; }
	.sd-nav__link { font-size: 13px; }
	.sd-nav__cta { font-size: 13px; padding: 10px 12px; }
}