/* WristUI marketing — Amendment A visual direction v0.2
   Light, quiet, photographic. Type + image + rules.
   Fonts: Source Serif 4 (display) + Inter (UI/body). Not Plex. */

:root {
	--bg: #f6f3ee;
	--bg-elev: #fffcf7;
	--bg-panel: #fffcf7;
	--paper: #f6f3ee;
	--text: #1c1b19;
	--muted: #5c5a55;
	--line: #ddd8cf;
	--line-strong: #b8b2a6;
	--accent: #0b5c5c; /* deep teal from Pulse rings — not brass */
	--accent-dim: #084646;
	--accent-ink: #f6f3ee;
	--ok: #2f6b3a;
	--warn: #8a6a12;
	--danger: #9b3b3b;
	--pro: #0b5c5c;
	--limited: #3a3834;
	--font-display: "Source Serif 4", "Source Serif Pro", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
	--font: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
	--mono: "Inter", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	--r: 2px;
	--r-lg: 4px;
	--measure: 40rem;
	--page: 1080px;
}

* { box-sizing: border-box; }
[hidden]{display:none!important;}
html, body { margin: 0; padding: 0; }
body {
	font-family: var(--font);
	background: var(--bg);
	color: var(--text);
	min-height: 100vh;
	font-size: 16px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
	font-feature-settings: "ss01" on, "cv11" on;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
code, .mono {
	font-family: var(--mono);
	font-size: 0.9em;
	font-variant-numeric: tabular-nums;
}

/* ——— Nav ——— */
.mkt-nav {
	position: sticky; top: 0; z-index: 40;
	display: flex; align-items: center; gap: 1rem;
	padding: 0.85rem clamp(1.1rem, 3.5vw, 2.25rem);
	background: rgba(246, 243, 238, 0.92);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--line);
}
.mkt-brand {
	display: flex; align-items: center; gap: 0.55rem;
	color: var(--text); font-weight: 600; letter-spacing: -0.02em;
	text-decoration: none; font-size: 1rem;
}
.mkt-brand img {
	border-radius: var(--r);
	border: 1px solid var(--line);
	background: #fff;
}
.mkt-links {
	display: flex; flex-wrap: wrap; gap: 0.15rem 1.15rem;
	margin-inline: auto 0;
}
.mkt-links a {
	color: var(--muted); font-size: 0.9rem; font-weight: 500;
	text-decoration: none;
}
.mkt-links a:hover { color: var(--text); }
.mkt-cta {
	background: var(--text); color: var(--bg) !important;
	font-weight: 600; font-size: 0.86rem;
	padding: 0.45rem 0.85rem; border-radius: var(--r);
	text-decoration: none !important; border: 1px solid var(--text);
}
.mkt-cta:hover { background: var(--accent); border-color: var(--accent); text-decoration: none !important; }

/* ——— Type (no uppercase mono eyebrows) ——— */
.eyebrow, .badge {
	font-family: var(--font);
	font-size: 0.8rem;
	font-weight: 550;
	letter-spacing: 0.01em;
	text-transform: none;
	color: var(--muted);
	margin: 0 0 0.55rem;
}

h1, .page-h1 {
	font-family: var(--font-display);
	font-size: clamp(1.85rem, 3.6vw, 2.55rem);
	line-height: 1.15;
	letter-spacing: -0.02em;
	font-weight: 600;
	margin: 0 0 0.75rem;
	color: var(--text);
}
h2, .section h2 {
	font-family: var(--font-display);
	font-size: clamp(1.25rem, 2vw, 1.55rem);
	letter-spacing: -0.015em;
	font-weight: 600;
	margin: 0 0 0.65rem;
}
h3 {
	font-family: var(--font);
	font-size: 0.95rem;
	font-weight: 600;
	margin: 0 0 0.4rem;
}
.lead, .lede {
	font-size: 1.05rem;
	color: var(--muted);
	max-width: var(--measure);
	line-height: 1.6;
	margin: 0;
}
.section {
	padding: 2.25rem clamp(1.1rem, 3.5vw, 2.25rem) 0.75rem;
	max-width: var(--page);
	margin: 0 auto;
}
.section > .lede, .section > p { color: var(--muted); max-width: var(--measure); }

/* ——— Home fold: Pulse dominant ——— */
.fold-photo {
	padding: 1.5rem clamp(1.1rem, 3.5vw, 2.25rem) 0.5rem;
	max-width: var(--page);
	margin: 0 auto;
}
.fold-photo figure {
	margin: 0;
	position: relative;
}
.fold-photo img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: var(--r-lg);
	border: 1px solid var(--line);
	background: #e8e4dc;
}
.fold-photo figcaption {
	margin-top: 1rem;
	max-width: 36rem;
}
.fold-photo .fact {
	font-family: var(--font-display);
	font-size: clamp(1.35rem, 2.4vw, 1.75rem);
	line-height: 1.25;
	letter-spacing: -0.015em;
	font-weight: 600;
	color: var(--text);
	margin: 0 0 0.55rem;
}
.honesty-line {
	margin: 0.65rem 0 0;
	font-size: 0.95rem;
	color: var(--muted);
	line-height: 1.55;
	max-width: 38rem;
}
.fold-actions {
	display: flex; flex-wrap: wrap; gap: 0.55rem;
	margin-top: 1.15rem;
}

/* Legacy fold (inner pages) */
.fold {
	display: grid; gap: 1.75rem;
	grid-template-columns: 1fr 1.05fr;
	align-items: start;
	padding: 2rem clamp(1.1rem, 3.5vw, 2.25rem) 1.5rem;
	max-width: var(--page); margin: 0 auto;
	border-bottom: 1px solid var(--line);
}
@media (max-width: 920px) {
	.fold { grid-template-columns: 1fr; }
	.mkt-links { display: none; }
}
.fold img, .hero-visual img {
	width: 100%; height: auto;
	border-radius: var(--r-lg);
	border: 1px solid var(--line);
	background: #e8e4dc;
	display: block;
}

.hero {
	display: grid; gap: 1.75rem;
	grid-template-columns: 1.15fr 0.85fr;
	align-items: start;
	padding: 2rem clamp(1.1rem, 3.5vw, 2.25rem) 1.5rem;
	max-width: var(--page); margin: 0 auto;
}
@media (max-width: 900px) { .hero { grid-template-columns: 1fr; } }
.hero-actions { display: flex; flex-wrap: wrap; gap: 0.55rem; margin-top: 1.1rem; }

/* ——— Buttons ——— */
.btn {
	display: inline-flex; align-items: center; justify-content: center;
	padding: 0.55rem 0.95rem; border-radius: var(--r);
	font-weight: 600; font-size: 0.9rem;
	text-decoration: none !important; border: 1px solid transparent;
	cursor: pointer; font-family: inherit;
}
.btn-primary {
	background: var(--text); color: var(--bg);
	border-color: var(--text);
}
.btn-primary:hover { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-ghost {
	background: transparent; color: var(--text);
	border-color: var(--line-strong);
}
.btn-ghost:hover { border-color: var(--text); background: var(--bg-elev); }
.btn-pro {
	background: var(--accent); color: #fff; border-color: var(--accent-dim);
}
.btn-pro:hover { filter: brightness(1.08); color: #fff; }
.btn-limited {
	background: transparent; color: var(--text);
	border-color: var(--text);
}
.btn:disabled, button:disabled { opacity: 0.45; cursor: not-allowed; }

/* ——— Tables (editorial rules, not glow panels) ——— */
.table-wrap {
	border-top: 1px solid var(--text);
	border-bottom: 1px solid var(--line);
	overflow: auto;
	background: transparent;
	margin-top: 1rem;
}
.data-table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.data-table th {
	text-align: left; color: var(--muted); font-weight: 600;
	font-family: var(--font); font-size: 0.78rem;
	letter-spacing: 0.02em; text-transform: none;
	padding: 0.65rem 0.35rem; background: transparent;
	border-bottom: 1px solid var(--line);
}
.data-table td {
	padding: 0.85rem 0.35rem;
	border-top: 1px solid var(--line);
	vertical-align: top;
}
.data-table tr:first-child td { border-top: none; }
.data-table tbody tr:hover td { background: rgba(0,0,0,0.015); }
.data-table .col-lim { color: var(--limited); }
.data-table .col-pro { color: var(--accent); font-weight: 550; }

/* ——— Quiet panels (rules, not cards costume) ——— */
.panel {
	border: none;
	border-top: 1px solid var(--line);
	border-radius: 0;
	padding: 1rem 0 0.25rem;
	background: transparent;
}
.panel h3 {
	margin: 0 0 0.45rem;
	font-size: 0.95rem;
	font-family: var(--font-display);
	letter-spacing: -0.01em;
	text-transform: none;
	color: var(--text);
	font-weight: 600;
}
.panel-status { border-left: none; border-top: 1px solid var(--line); }
.panel-pro, .panel-limited { border-top: 1px solid var(--line); }

.grid {
	display: grid; gap: 1.25rem;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	margin: 1.25rem 0 0;
}
.card {
	background: transparent;
	border: none;
	border-top: 1px solid var(--line);
	border-radius: 0;
	padding: 1rem 0 0.25rem;
	color: inherit; text-decoration: none; display: block;
}
.card:hover { border-color: var(--text); text-decoration: none; }
.card h3 {
	margin: 0 0 0.3rem; color: var(--text);
	font-size: 1.05rem; font-weight: 600;
	font-family: var(--font-display);
}
.card p { margin: 0; font-size: 0.92rem; color: var(--muted); }
.card img {
	width: 100%; height: auto; display: block;
	margin-bottom: 0.75rem;
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: #e8e4dc;
}

.split {
	display: grid; gap: 1.75rem;
	grid-template-columns: 1fr 1fr;
	align-items: start; margin-top: 1.35rem;
}
@media (max-width: 900px) { .split { grid-template-columns: 1fr; } }

/* Kill status-pill motif — keep classes harmless */
.status-matrix { display: block; border: none; background: transparent; }
.status-row { display: block; padding: 0.2rem 0; border: none; font-size: 0.95rem; color: var(--muted); }
.tag, .pill, .pill-ok, .pill-warn, .pill-muted, .sso-chip, .tag-ok, .tag-warn, .tag-ready, .tag-no, .tag-yes {
	display: inline;
	font-family: inherit;
	font-size: inherit;
	font-weight: 550;
	letter-spacing: normal;
	text-transform: none;
	padding: 0;
	border: none;
	border-radius: 0;
	background: none;
	color: inherit;
}
.tag-ok, .pill-ok { color: var(--ok); }
.tag-warn, .pill-warn { color: var(--warn); }
.tag-ready, .tag-yes { color: var(--accent); }
.tag-no, .pill-muted { color: var(--muted); }

/* ——— Feature list: flex, NEVER 12px grid column ——— */
.feature-list {
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
	margin: 0.65rem 0 0;
	padding: 0;
	list-style: none;
	max-width: var(--measure);
}
.feature-list li {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 0.55rem;
	color: var(--muted);
	line-height: 1.5;
	font-size: 0.95rem;
}
.feature-list li::before {
	content: "";
	width: 5px;
	height: 5px;
	margin-top: 0.55rem;
	flex: 0 0 5px;
	background: var(--accent);
	border-radius: 1px;
}
.feature-list li > * { min-width: 0; }
.feature-list strong { color: var(--text); font-weight: 600; }

/* ——— Pricing: editorial matrix, not twin glow cards ——— */
.tier-grid {
	display: grid; gap: 0;
	grid-template-columns: 1fr 1fr;
	margin-top: 1.75rem;
	border-top: 1px solid var(--text);
}
@media (max-width: 800px) { .tier-grid { grid-template-columns: 1fr; } }
.tier {
	border: none;
	border-bottom: 1px solid var(--line);
	border-radius: 0;
	padding: 1.35rem 1.15rem 1.35rem 0;
	background: transparent;
	display: flex; flex-direction: column; gap: 0.65rem;
}
.tier + .tier { padding-left: 1.15rem; border-left: 1px solid var(--line); }
@media (max-width: 800px) {
	.tier + .tier { padding-left: 0; border-left: none; }
}
.tier-limited, .tier-pro {
	border-color: var(--line);
	box-shadow: none;
	background: transparent;
}
.tier-head {
	display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem;
}
.tier-name {
	font-family: var(--font-display);
	font-size: 1.35rem; font-weight: 600; margin: 0; color: var(--text);
}
.tier-price {
	font-family: var(--font);
	font-size: 0.95rem; font-weight: 600;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
	color: var(--text);
}
.tier-blurb { margin: 0; color: var(--muted); font-size: 0.95rem; }
.tier-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: auto; padding-top: 0.5rem; }

/* Destinations — simple linked lines, not nav-rail mono keys */
.dest-list {
	display: flex; flex-direction: column; gap: 0;
	margin: 1rem 0 0; padding: 0; list-style: none;
	border-top: 1px solid var(--line);
}
.dest-list a {
	display: block;
	padding: 0.85rem 0;
	border-bottom: 1px solid var(--line);
	color: inherit; text-decoration: none;
}
.dest-list a:hover { color: var(--accent); text-decoration: none; }
.dest-list strong {
	font-family: var(--font-display);
	font-size: 1.05rem; font-weight: 600; color: var(--text);
}
.dest-list span { display: block; margin-top: 0.2rem; color: var(--muted); font-size: 0.92rem; }

/* Legacy nav-rail → same editorial lines */
.nav-rail {
	display: flex; flex-direction: column; gap: 0;
	border: none; border-top: 1px solid var(--line);
	border-radius: 0; overflow: visible; margin-top: 0.85rem;
}
.nav-rail a {
	display: block;
	padding: 0.85rem 0;
	border-top: none;
	border-bottom: 1px solid var(--line);
	color: inherit; text-decoration: none; background: transparent;
}
.nav-rail a:first-child { border-top: none; }
.nav-rail a:hover { background: transparent; color: var(--accent); text-decoration: none; }
.nav-rail .nav-k {
	font-family: var(--font-display);
	font-size: 1.05rem; font-weight: 600;
	color: var(--text); letter-spacing: -0.01em;
	text-transform: none;
}
.nav-rail .nav-d { display: block; margin-top: 0.2rem; color: var(--muted); font-size: 0.92rem; }
.nav-rail .nav-arrow { display: none; }

/* ——— Band / footer ——— */
.band {
	margin: 2.5rem clamp(1.1rem, 3.5vw, 2.25rem);
	max-width: var(--page); margin-inline: auto;
	padding: 1.25rem 0;
	border: none;
	border-top: 1px solid var(--text);
	border-bottom: 1px solid var(--line);
	border-radius: 0; background: transparent;
	display: flex; flex-wrap: wrap; gap: 1rem;
	align-items: center; justify-content: space-between;
}
.mkt-footer {
	margin-top: 3.5rem;
	padding: 1.75rem clamp(1.1rem, 3.5vw, 2.25rem);
	border-top: 1px solid var(--line);
	display: flex; flex-wrap: wrap; gap: 1.25rem;
	justify-content: space-between; color: var(--muted); font-size: 0.88rem;
}
.mkt-footer strong { color: var(--text); font-family: var(--font-display); font-size: 1rem; }
.mkt-footer p { margin: 0.35rem 0 0; max-width: 28rem; }
.mkt-footer-links { display: flex; flex-wrap: wrap; gap: 0.85rem; align-items: center; }
.mkt-footer-links a { color: var(--muted); }
.mkt-footer-links a:hover { color: var(--text); }

/* ——— Code ——— */
.codeish {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.8rem;
	background: #1c1b19;
	border: 1px solid #1c1b19;
	border-radius: var(--r);
	padding: 0.85rem 0.95rem;
	color: #f0ebe3;
	overflow: auto; line-height: 1.45; white-space: pre;
}

.honesty {
	border-left: none;
	border-top: 1px solid var(--line);
	padding: 0.85rem 0 0;
	margin: 1rem 0;
	background: transparent;
	color: var(--muted);
	font-size: 0.95rem;
	line-height: 1.55;
}
.honesty strong { color: var(--text); }

/* ——— Portal (denser app shell on same paper; keep Entra) ——— */
.portal-app { min-height: 100vh; background: var(--bg); }
.portal-top {
	display: flex; align-items: center; justify-content: space-between;
	gap: 1rem; padding: 0.65rem clamp(1rem, 3vw, 1.35rem);
	border-bottom: 1px solid var(--line); background: var(--bg-elev);
	position: sticky; top: 0; z-index: 30;
}
.portal-top .mkt-brand em {
	font-style: normal; color: var(--muted); font-weight: 500; margin-left: 0.2rem;
}
.portal-top-right { display: flex; align-items: center; gap: 0.55rem; flex-wrap: wrap; }
.portal-user { font-size: 0.88rem; color: var(--muted); display: flex; gap: 0.55rem; align-items: center; }
.portal-frame {
	display: grid; grid-template-columns: 200px 1fr;
	min-height: calc(100vh - 52px);
}
@media (max-width: 860px) { .portal-frame { grid-template-columns: 1fr; } }
.portal-side {
	padding: 1rem 0.75rem 1.25rem; border-right: 1px solid var(--line);
	background: var(--bg-elev);
}
.side-org-muted, .side-org { margin: 0; font-weight: 600; font-size: 0.9rem; }
.side-plan { margin: 0.2rem 0 0.85rem; font-size: 0.78rem; color: var(--muted); }
.side-link {
	display: block; padding: 0.4rem 0.55rem; border-radius: var(--r);
	color: var(--muted); text-decoration: none; font-weight: 500;
	font-size: 0.88rem; margin-bottom: 0.15rem;
}
.side-link:hover, .side-link.active {
	background: rgba(0,0,0,0.04); color: var(--text); text-decoration: none;
}
.side-link.active { border-left: 2px solid var(--accent); padding-left: calc(0.55rem - 2px); }
.side-foot { margin-top: 1.25rem; display: grid; gap: 0.35rem; font-size: 0.82rem; }
.side-foot a { color: var(--muted); }
.portal-main { padding: 1.25rem clamp(1rem, 3vw, 1.75rem) 2.5rem; max-width: 960px; }
.portal-meta { color: var(--muted); font-size: 0.9rem; margin: 0.25rem 0 0; }
.portal-toolbar {
	display: flex; flex-wrap: wrap; gap: 0.75rem;
	align-items: flex-start; justify-content: space-between; margin: 0 0 1rem;
}
.portal-shell { max-width: 960px; margin: 0 auto; padding: 1.5rem clamp(1rem, 3vw, 2rem) 3rem; }
.portal-grid {
	display: grid; gap: 0.75rem;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	margin-top: 1.15rem;
}
.portal-card {
	border: 1px solid var(--line); border-radius: var(--r-lg);
	padding: 0.95rem; background: var(--bg-elev);
	color: inherit; text-decoration: none;
}
.portal-card h2 {
	font-size: 0.92rem; margin: 0 0 0.3rem; color: var(--text); font-weight: 600;
}
.portal-card p { margin: 0; color: var(--muted); font-size: 0.88rem; }

.stat-row {
	display: grid; gap: 0.55rem;
	grid-template-columns: repeat(4, 1fr); margin: 1rem 0;
}
@media (max-width: 640px) { .stat-row { grid-template-columns: repeat(2, 1fr); } }
.stat {
	border-top: 1px solid var(--line);
	border-radius: 0;
	padding: 0.65rem 0;
	background: transparent;
}
.stat .n {
	font-family: var(--font-display);
	font-size: 1.35rem; font-weight: 600;
	letter-spacing: -0.02em;
}
.stat .l { font-size: 0.75rem; color: var(--muted); margin-top: 0.15rem; }

.empty-state, .empty-hero {
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	padding: 1.25rem 1.1rem;
	background: var(--bg-elev);
	margin: 1rem 0; max-width: 36rem;
}
.empty-hero h2, .empty-state h2, .empty-state strong {
	margin: 0 0 0.35rem; font-size: 1.05rem; font-weight: 600;
	font-family: var(--font-display);
}
.empty-hero p, .empty-state p {
	margin: 0 0 0.85rem; color: var(--muted); line-height: 1.5; font-size: 0.95rem;
}

.form-grid { display: grid; gap: 0.75rem; max-width: 28rem; margin-top: 0.85rem; }
.field label, .label {
	display: block; font-size: 0.8rem; color: var(--muted);
	margin-bottom: 0.25rem; font-family: var(--font);
	letter-spacing: 0.01em; text-transform: none;
}
.field input, .field select, .field textarea {
	width: 100%; padding: 0.55rem 0.65rem; border-radius: var(--r);
	border: 1px solid var(--line-strong); background: #fff; color: var(--text);
	font: inherit;
}
.field textarea { resize: vertical; min-height: 6rem; }

.cred-grid {
	display: grid; gap: 0.75rem;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	margin-top: 1rem;
}
.cred-card {
	border: 1px solid var(--line); border-radius: var(--r-lg);
	padding: 0.95rem; background: var(--bg-elev);
}
.cred-card h2 { margin: 0 0 0.3rem; font-size: 0.95rem; color: var(--text); }
.cred-card .label { margin: 0.75rem 0 0.25rem; }
.cred-row { display: flex; gap: 0.4rem; align-items: center; flex-wrap: wrap; }
.cred-row input {
	flex: 1; min-width: 10rem; padding: 0.5rem 0.6rem; border-radius: var(--r);
	border: 1px solid var(--line-strong); background: #fff; color: var(--text);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.8rem;
}

.btn-ms {
	display: inline-flex; align-items: center; gap: 0.5rem;
	background: #2f2e2c; color: #fff; border: 1px solid #2f2e2c; font-weight: 600;
}
.btn-ms:hover { background: #1c1b19; color: #fff; text-decoration: none; }
.btn-ms .ms-mark {
	display: inline-grid; grid-template-columns: 1fr 1fr; gap: 1px;
	width: 14px; height: 14px;
}
.btn-ms .ms-mark i { display: block; width: 6px; height: 6px; }
.btn-ms .ms-mark i:nth-child(1) { background: #f25022; }
.btn-ms .ms-mark i:nth-child(2) { background: #7fba00; }
.btn-ms .ms-mark i:nth-child(3) { background: #00a4ef; }
.btn-ms .ms-mark i:nth-child(4) { background: #ffb900; }
.portal-top .btn-ms { padding: 0.4rem 0.7rem; border-radius: var(--r); font-size: 0.85rem; }

.workflow-list {
	border: none; border-top: 1px solid var(--line);
	border-radius: 0; overflow: visible; margin-top: 1rem;
}
.workflow-list a {
	display: flex; gap: 0.85rem; align-items: flex-start;
	padding: 0.85rem 0;
	border-top: none; border-bottom: 1px solid var(--line);
	background: transparent; color: inherit; text-decoration: none;
}
.workflow-list a:first-child { border-top: none; }
.workflow-list a:hover { background: transparent; color: var(--accent); text-decoration: none; }
.workflow-list .step-n {
	font-family: var(--font);
	font-size: 0.8rem; color: var(--accent);
	font-weight: 600; padding-top: 0.2rem; flex: 0 0 auto;
}
.workflow-list h3 {
	margin: 0 0 0.2rem; font-size: 1rem; font-weight: 600;
	font-family: var(--font-display);
}
.workflow-list p { margin: 0; font-size: 0.9rem; color: var(--muted); }

.support-grid {
	display: grid; gap: 0.75rem;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	margin-top: 0.85rem;
}

/* Contact form on paper */
#contact-form.panel {
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	padding: 1.15rem;
	background: var(--bg-elev);
}


/* ——— Compatibility aliases (existing markup) ——— */
.table-wrap { border-top: 1px solid var(--text); border-bottom: 1px solid var(--line); overflow: auto; margin-top: 1rem; background: transparent; border-left: none; border-right: none; border-radius: 0; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 0.55rem; margin-top: 1.1rem; }
.lead { font-size: 1.05rem; color: var(--muted); max-width: var(--measure); line-height: 1.6; margin: 0; }
.page-h1 { font-family: var(--font-display); }
.btn-primary { background: var(--text); color: var(--bg); border-color: var(--text); }
.btn-primary:hover { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-ghost { background: transparent; color: var(--text); border-color: var(--line-strong); }
.btn-pro { background: var(--accent); color: #fff; border-color: var(--accent-dim); }
.btn-limited { background: transparent; color: var(--text); border-color: var(--text); }
.tier-grid { display: grid; gap: 0; grid-template-columns: 1fr 1fr; margin-top: 1.75rem; border-top: 1px solid var(--text); }
.tier-name { font-family: var(--font-display); font-size: 1.35rem; font-weight: 600; margin: 0; }
.tier-price { font-family: var(--font); font-size: 0.95rem; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tier-blurb { margin: 0; color: var(--muted); font-size: 0.95rem; }
.tier-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: auto; padding-top: 0.5rem; }
.tier-head { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; }
.tier-limited, .tier-pro { box-shadow: none; background: transparent; }
.codeish { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.8rem; background: #1c1b19; border: 1px solid #1c1b19; border-radius: var(--r); padding: 0.85rem 0.95rem; color: #f0ebe3; overflow: auto; line-height: 1.45; white-space: pre; }
.band { margin: 2.5rem clamp(1.1rem, 3.5vw, 2.25rem); max-width: var(--page); margin-inline: auto; padding: 1.25rem 0; border-top: 1px solid var(--text); border-bottom: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; }
.mkt-footer { margin-top: 3.5rem; padding: 1.75rem clamp(1.1rem, 3.5vw, 2.25rem); border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 1.25rem; justify-content: space-between; color: var(--muted); font-size: 0.88rem; }
.mkt-footer-links { display: flex; flex-wrap: wrap; gap: 0.85rem; align-items: center; }
.portal-frame { display: grid; grid-template-columns: 200px 1fr; min-height: calc(100vh - 52px); }
@media (max-width: 860px) { .portal-frame { grid-template-columns: 1fr; } }
.side-org-muted, .side-org { margin: 0; font-weight: 600; font-size: 0.9rem; }
.side-plan { margin: 0.2rem 0 0.85rem; font-size: 0.78rem; color: var(--muted); }
.side-link { display: block; padding: 0.4rem 0.55rem; border-radius: var(--r); color: var(--muted); text-decoration: none; font-weight: 500; font-size: 0.88rem; margin-bottom: 0.15rem; }
.side-link:hover, .side-link.active { background: rgba(0,0,0,0.04); color: var(--text); text-decoration: none; }
.side-link.active { border-left: 2px solid var(--accent); padding-left: calc(0.55rem - 2px); }
.side-foot { margin-top: 1.25rem; display: grid; gap: 0.35rem; font-size: 0.82rem; }
.stat-row { display: grid; gap: 0.55rem; grid-template-columns: repeat(4, 1fr); margin: 1rem 0; }
.stat .n { font-family: var(--font-display); font-size: 1.35rem; font-weight: 600; letter-spacing: -0.02em; }
.stat .l { font-size: 0.75rem; color: var(--muted); margin-top: 0.15rem; }
.empty-hero, .empty-state { border: 1px solid var(--line); border-radius: var(--r-lg); padding: 1.25rem 1.1rem; background: var(--bg-elev); margin: 1rem 0; max-width: 36rem; }
.workflow-list { border-top: 1px solid var(--line); margin-top: 1rem; }
.workflow-list .step-n { font-size: 0.8rem; color: var(--accent); font-weight: 600; padding-top: 0.2rem; }
.btn-ms { display: inline-flex; align-items: center; gap: 0.5rem; background: #2f2e2c; color: #fff; border: 1px solid #2f2e2c; font-weight: 600; }
.btn-ms .ms-mark { display: inline-grid; grid-template-columns: 1fr 1fr; gap: 1px; width: 14px; height: 14px; }
.btn-ms .ms-mark i { display: block; width: 6px; height: 6px; }
.btn-ms .ms-mark i:nth-child(1) { background: #f25022; }
.btn-ms .ms-mark i:nth-child(2) { background: #7fba00; }
.btn-ms .ms-mark i:nth-child(3) { background: #00a4ef; }
.btn-ms .ms-mark i:nth-child(4) { background: #ffb900; }
.panel-status, .panel-pro, .panel-limited { border-top: 1px solid var(--line); }
.status-matrix { display: block; border: none; background: transparent; }
.status-row { display: block; padding: 0.25rem 0; font-size: 0.95rem; color: var(--muted); border: none; }
.status-row .k { color: var(--muted); }
.status-row .v { color: var(--text); font-weight: 550; }


/* ——— Live markup aliases (master class names) ——— */
.fold { }
.lede { font-size: 1.05rem; color: var(--muted); max-width: var(--measure); line-height: 1.6; margin: 0; }
.table-wrap { border-top: 1px solid var(--text); border-bottom: 1px solid var(--line); overflow: auto; margin-top: 1rem; }
.data-table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.data-table th {
	text-align: left; color: var(--muted); font-weight: 600; font-size: 0.78rem;
	padding: 0.65rem 0.35rem; border-bottom: 1px solid var(--line); background: transparent;
	text-transform: none; letter-spacing: 0.02em; font-family: var(--font);
}
.data-table td { padding: 0.85rem 0.35rem; border-top: 1px solid var(--line); vertical-align: top; }
.data-table .col-lim, .data-table .col-lim { color: var(--limited); }
.data-table .col-pro, .data-table .col-pro { color: var(--accent); font-weight: 550; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 0.55rem; margin-top: 1.1rem; }
.btn-primary { background: var(--text); color: var(--bg); border-color: var(--text); }
.btn-primary:hover { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-ghost { background: transparent; color: var(--text); border-color: var(--line-strong); }
.btn-limited { background: transparent; color: var(--text); border-color: var(--text); }
.btn-pro { background: var(--accent); color: #fff; border-color: var(--accent-dim); }
.btn-ms, .btn.btn-ms {
	display: inline-flex; align-items: center; gap: 0.5rem;
	background: #2f2e2c; color: #fff !important; border: 1px solid #2f2e2c; font-weight: 600;
	text-decoration: none !important;
}
.btn-ms:hover, .btn.btn-ms:hover { background: #1c1b19; color: #fff !important; }
.ms-mark {
	display: inline-grid; grid-template-columns: 1fr 1fr; gap: 1px;
	width: 14px; height: 14px;
}
.ms-mark i { display: block; width: 6px; height: 6px; }
.ms-mark i:nth-child(1) { background: #f25022; }
.ms-mark i:nth-child(2) { background: #7fba00; }
.ms-mark i:nth-child(3) { background: #00a4ef; }
.ms-mark i:nth-child(4) { background: #ffb900; }

.panel-status { border-top: 1px solid var(--line); }
.status-matrix { display: block; border: none; background: transparent; margin: 0; }
.status-row { display: block; padding: 0.2rem 0; border: none; font-size: 0.95rem; color: var(--muted); }
.status-row .k { color: var(--muted); }
.status-row .v, .status-row .tag { color: var(--text); font-weight: 550; }

.nav-rail .nav-k { font-family: var(--font-display); font-size: 1.05rem; font-weight: 600; color: var(--text); letter-spacing: -0.01em; text-transform: none; }
.nav-rail .nav-d { display: block; margin-top: 0.2rem; color: var(--muted); font-size: 0.92rem; }
.nav-rail .nav-arrow { display: none; }

.tier-grid { display: grid; gap: 0; grid-template-columns: 1fr 1fr; margin-top: 1.75rem; border-top: 1px solid var(--text); }
@media (max-width: 800px) { .tier-grid { grid-template-columns: 1fr; } }
.tier-limited, .tier-pro { background: transparent; box-shadow: none; }
.tier-head { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; }
.tier-name { font-family: var(--font-display); font-size: 1.35rem; font-weight: 600; margin: 0; }
.tier-price { font-size: 0.95rem; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tier-blurb { margin: 0; color: var(--muted); font-size: 0.95rem; }
.tier-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: auto; padding-top: 0.5rem; }

.side-foot { margin-top: 1.25rem; display: grid; gap: 0.35rem; font-size: 0.82rem; }
.side-foot a { color: var(--muted); }
.portal-top-right { display: flex; align-items: center; gap: 0.55rem; flex-wrap: wrap; }
.portal-user-label { color: var(--muted); }

.mono { font-variant-numeric: tabular-nums; font-family: var(--font); }

/* ——— Amendment A page primitives ——— */
.fold-photo {
	/* First viewport @1280×800 must include nav + image + fact + honesty + both CTAs */
	padding: 0.75rem clamp(1.1rem, 3.5vw, 2.25rem) 0.35rem;
	max-width: var(--page);
	margin: 0 auto;
}
.fold-photo figure { margin: 0; }
.fold-photo img {
	width: 100%;
	height: clamp(220px, 38vh, 360px);
	object-fit: cover;
	object-position: center;
	display: block;
	border-radius: var(--r-lg);
	border: 1px solid var(--line);
	background: #e8e4dc;
}
.fold-photo figcaption { margin-top: 0.7rem; max-width: 38rem; }
.fold-photo .eyebrow { margin-bottom: 0.25rem; }
.fact {
	font-family: var(--font-display);
	font-size: clamp(1.25rem, 2.1vw, 1.55rem);
	line-height: 1.22;
	letter-spacing: -0.015em;
	font-weight: 600;
	color: var(--text);
	margin: 0 0 0.35rem;
}
.honesty-line {
	margin: 0.35rem 0 0;
	font-size: 0.92rem;
	color: var(--muted);
	line-height: 1.45;
	max-width: 38rem;
}
.fold-actions {
	display: flex; flex-wrap: wrap; gap: 0.5rem;
	margin-top: 0.7rem;
}
@media (min-width: 1100px) and (min-height: 700px) {
	.fold-photo img { height: min(340px, 42vh); }
}
.dest-list {
	display: flex; flex-direction: column; gap: 0;
	margin: 1rem 0 0; padding: 0; list-style: none;
	border-top: 1px solid var(--line);
}
.dest-list li { margin: 0; }
.dest-list a {
	display: block;
	padding: 0.85rem 0;
	border-bottom: 1px solid var(--line);
	color: inherit; text-decoration: none;
}
.dest-list a:hover { color: var(--accent); text-decoration: none; }
.dest-list strong {
	font-family: var(--font-display);
	font-size: 1.05rem; font-weight: 600; color: var(--text);
}
.dest-list span { display: block; margin-top: 0.2rem; color: var(--muted); font-size: 0.92rem; }

.tier-grid {
	display: grid; gap: 0;
	grid-template-columns: 1fr 1fr;
	margin-top: 1.75rem;
	border-top: 1px solid var(--text);
}
@media (max-width: 800px) { .tier-grid { grid-template-columns: 1fr; } }
.tier {
	border-bottom: 1px solid var(--line);
	padding: 1.35rem 1.15rem 1.35rem 0;
	display: flex; flex-direction: column; gap: 0.65rem;
	background: transparent;
}
.tier + .tier { padding-left: 1.15rem; border-left: 1px solid var(--line); }
@media (max-width: 800px) {
	.tier + .tier { padding-left: 0; border-left: none; }
}
.tier-head { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; }
.tier-name { font-family: var(--font-display); font-size: 1.35rem; font-weight: 600; margin: 0; }
.tier-price { font-size: 0.95rem; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tier-blurb { margin: 0; color: var(--muted); font-size: 0.95rem; }
.tier-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: auto; padding-top: 0.5rem; }
.btn-pro { background: var(--accent); color: #fff; border-color: var(--accent-dim); }
.btn-pro:hover { filter: brightness(1.06); color: #fff; }
.btn-limited { background: transparent; color: var(--text); border-color: var(--text); }

.codeish {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.8rem;
	background: #1c1b19;
	border-radius: var(--r);
	padding: 0.85rem 0.95rem;
	color: #f0ebe3;
	overflow: auto; line-height: 1.45; white-space: pre;
}
.band {
	margin: 2.5rem clamp(1.1rem, 3.5vw, 2.25rem);
	max-width: var(--page); margin-inline: auto;
	padding: 1.25rem 0;
	border-top: 1px solid var(--text);
	border-bottom: 1px solid var(--line);
	display: flex; flex-wrap: wrap; gap: 1rem;
	align-items: center; justify-content: space-between;
}
.grid {
	display: grid; gap: 1.25rem;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.card {
	border-top: 1px solid var(--line);
	padding: 1rem 0 0.25rem;
	color: inherit; text-decoration: none; display: block;
}
.card:hover { border-color: var(--text); text-decoration: none; }
.card h3 { margin: 0 0 0.3rem; font-family: var(--font-display); font-size: 1.05rem; }
.card p { margin: 0; font-size: 0.92rem; color: var(--muted); }
.card img {
	width: 100%; height: auto; display: block; margin-bottom: 0.75rem;
	border: 1px solid var(--line); border-radius: var(--r-lg); background: #e8e4dc;
}
.split {
	display: grid; gap: 1.75rem;
	grid-template-columns: 1fr 1fr;
	align-items: start;
}
@media (max-width: 900px) { .split { grid-template-columns: 1fr; } }
.panel {
	border-top: 1px solid var(--line);
	padding: 1rem 0 0.25rem;
	background: transparent;
}
.panel h3 {
	margin: 0 0 0.45rem;
	font-size: 1.05rem;
	font-family: var(--font-display);
	font-weight: 600;
	color: var(--text);
	text-transform: none;
}
.table-wrap {
	border-top: 1px solid var(--text);
	border-bottom: 1px solid var(--line);
	overflow: auto; margin-top: 1rem;
}
.data-table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.data-table th {
	text-align: left; color: var(--muted); font-weight: 600; font-size: 0.78rem;
	padding: 0.65rem 0.35rem; border-bottom: 1px solid var(--line);
	background: transparent; text-transform: none; font-family: var(--font);
}
.data-table td { padding: 0.85rem 0.35rem; border-top: 1px solid var(--line); vertical-align: top; }
.data-table .col-lim { color: var(--limited); }
.data-table .col-pro { color: var(--accent); font-weight: 550; }
.mono { font-variant-numeric: tabular-nums; }

/* Missing utilities referenced by sell pages */
.eyebrow { font-family: var(--font); font-size: 0.8rem; font-weight: 550; color: var(--muted); margin: 0 0 0.55rem; text-transform: none; letter-spacing: 0.01em; }
.lede { font-size: 1.05rem; color: var(--muted); max-width: var(--measure); line-height: 1.6; margin: 0; }
.fold-actions { display: flex; flex-wrap: wrap; gap: 0.55rem; margin-top: 1.15rem; }
.table-wrap { border-top: 1px solid var(--text); border-bottom: 1px solid var(--line); overflow: auto; margin-top: 1rem; }
.data-table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.data-table th { text-align: left; color: var(--muted); font-weight: 600; font-size: 0.78rem; padding: 0.65rem 0.35rem; border-bottom: 1px solid var(--line); background: transparent; text-transform: none; font-family: var(--font); }
.data-table td { padding: 0.85rem 0.35rem; border-top: 1px solid var(--line); vertical-align: top; }
.col-lim { color: var(--limited); }
.col-pro { color: var(--accent); font-weight: 550; }
.codeish { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.8rem; background: #1c1b19; border-radius: var(--r); padding: 0.85rem 0.95rem; color: #f0ebe3; overflow: auto; line-height: 1.45; white-space: pre; }
.mono { font-variant-numeric: tabular-nums; }
.band { margin: 2.5rem clamp(1.1rem, 3.5vw, 2.25rem); max-width: var(--page); margin-inline: auto; padding: 1.25rem 0; border-top: 1px solid var(--text); border-bottom: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; }
.badge { font-family: var(--font); font-size: 0.8rem; font-weight: 550; color: var(--muted); margin: 0 0 0.55rem; text-transform: none; letter-spacing: 0.01em; background: none; border: none; padding: 0; display: block; }
.field label { display: block; font-size: 0.8rem; color: var(--muted); margin-bottom: 0.25rem; }
.field input, .field select, .field textarea { width: 100%; padding: 0.55rem 0.65rem; border-radius: var(--r); border: 1px solid var(--line-strong); background: #fff; color: var(--text); font: inherit; }
.tier-head { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; }
.tier-name { font-family: var(--font-display); font-size: 1.35rem; font-weight: 600; margin: 0; }
.tier-price { font-size: 0.95rem; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tier-blurb { margin: 0; color: var(--muted); font-size: 0.95rem; }
.tier-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: auto; padding-top: 0.5rem; }
.tier-limited, .tier-pro { background: transparent; box-shadow: none; }
