/* =========================================================================
   Membership — join, account, directory, paywall
   ========================================================================= */

.inaa-page .inaa-btn--ghost-navy {
	background: transparent;
	border: 2px solid var(--inaa-navy, #14275c);
	color: var(--inaa-navy, #14275c);
}

.inaa-page .inaa-btn--ghost-navy:hover,
.inaa-page .inaa-btn--ghost-navy:focus-visible {
	background: var(--inaa-navy, #14275c);
	color: #fff;
}

.inaa-btn--ghost-white {
	background: transparent;
	border: 2px solid rgba(255, 255, 255, 0.65);
	color: #fff;
}

.inaa-btn--ghost-white:hover,
.inaa-btn--ghost-white:focus-visible {
	background: rgba(255, 255, 255, 0.16);
	border-color: #fff;
	color: #fff;
}

.inaa-linkbtn {
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

/* ---------- notices ---------- */

.inaa-notice {
	margin: 0 0 26px;
	padding: 16px 20px;
	border-left: 4px solid var(--inaa-navy, #14275c);
	background: var(--inaa-off-white, #f5f7fa);
	font-size: 0.9375rem;
	line-height: 1.55;
}

.inaa-notice p { margin: 0 0 6px; }
.inaa-notice p:last-child { margin-bottom: 0; }
.inaa-notice code { background: #fff; padding: 2px 6px; border-radius: 3px; }

.inaa-notice--ok    { border-left-color: #1a7f37; }
.inaa-notice--warn  { border-left-color: #b8860b; background: #fff8e6; }
.inaa-notice--error { border-left-color: var(--inaa-red, #d0111b); background: #fdf0f1; }

/* ---------- forms ---------- */

.inaa-field-group {
	margin: 0 0 34px;
	padding: 0;
	border: 0;
}

.inaa-field-group__title {
	display: block;
	margin: 0 0 16px;
	padding: 0;
	color: var(--inaa-navy, #14275c);
	font-size: 1.125rem;
	font-weight: 700;
}

.inaa-field {
	margin: 0 0 18px;
}

.inaa-field-row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 0 20px;
}

.inaa-field label {
	display: block;
	margin-bottom: 6px;
	color: var(--inaa-navy, #14275c);
	font-size: 0.9375rem;
	font-weight: 600;
}

/* Two-class selectors: WordPress's block-library sheet styles input[type=…]
   at the same specificity, so a single class is not reliably enough. */
.inaa-page .inaa-field input[type="text"],
.inaa-page .inaa-field input[type="email"],
.inaa-page .inaa-field input[type="password"],
.inaa-page .inaa-field input[type="search"],
.inaa-page .inaa-field select,
.inaa-page .inaa-field textarea {
	width: 100%;
	margin: 0;
	padding: 11px 14px;
	border: 1px solid #c9ced6;
	border-radius: 3px;
	background: #fff;
	box-shadow: none;
	color: var(--inaa-text, #1b2333);
	font-family: inherit;
	font-size: 1rem;
	line-height: 1.4;
}

.inaa-page .inaa-field input:focus-visible,
.inaa-page .inaa-field select:focus-visible,
.inaa-page .inaa-field textarea:focus-visible {
	border-color: var(--inaa-navy, #14275c);
	outline: 3px solid rgba(20, 39, 92, 0.16);
	outline-offset: 0;
}

.inaa-field__hint {
	display: block;
	margin-top: 6px;
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.8125rem;
	line-height: 1.5;
}

.inaa-check {
	margin: 0 0 10px;
	font-size: 0.9375rem;
}

.inaa-check label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	cursor: pointer;
}

.inaa-check--master {
	padding: 14px 16px;
	border: 1px solid var(--inaa-border, #dde3ed);
	border-left: 4px solid var(--inaa-red, #d0111b);
	background: var(--inaa-off-white, #f5f7fa);
	margin-bottom: 18px;
}

.inaa-consent {
	margin: 0 0 18px;
	padding: 0;
	border: 0;
}

.inaa-consent legend {
	padding: 0;
	margin-bottom: 10px;
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* ---------- tier + method choices ---------- */

.inaa-tiers,
.inaa-methods {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 14px;
}

.inaa-tier,
.inaa-method {
	position: relative;
	display: block;
	cursor: pointer;
}

.inaa-tier input,
.inaa-method input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}

.inaa-tier__body,
.inaa-method__body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	height: 100%;
	padding: 20px 22px;
	border: 2px solid var(--inaa-border, #dde3ed);
	border-radius: 4px;
	background: #fff;
	transition: border-color 180ms ease, box-shadow 180ms ease;
}

.inaa-tier input:checked + .inaa-tier__body,
.inaa-method input:checked + .inaa-method__body {
	border-color: var(--inaa-red, #d0111b);
	box-shadow: 0 6px 20px rgba(13, 26, 62, 0.12);
}

.inaa-tier input:focus-visible + .inaa-tier__body,
.inaa-method input:focus-visible + .inaa-method__body {
	outline: 3px solid var(--inaa-navy, #14275c);
	outline-offset: 2px;
}

.inaa-tier__name,
.inaa-method__name {
	color: var(--inaa-navy, #14275c);
	font-size: 1.0625rem;
	font-weight: 700;
}

.inaa-tier__price {
	color: var(--inaa-navy, #14275c);
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.1;
}

.inaa-tier__per {
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--inaa-text-muted, #5b6478);
	margin-left: 4px;
}

.inaa-tier__text,
.inaa-method__text {
	color: var(--inaa-text, #1b2333);
	font-size: 0.9375rem;
	line-height: 1.55;
}

.inaa-join__submit {
	margin: 8px 0 0;
}

.inaa-join__signin {
	margin: 16px 0 0;
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.9375rem;
}

/* ---------- digital card ---------- */

.inaa-account__top {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 24px;
	margin-bottom: 40px;
}

@media (min-width: 900px) {
	.inaa-account__top {
		grid-template-columns: minmax(0, 1fr) 260px;
		align-items: start;
	}
}

.inaa-mcard {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 22px;
	padding: 22px;
	border: 1px solid var(--inaa-border, #dde3ed);
	border-radius: 4px;
	background: #fff;
}

@media (min-width: 640px) {
	.inaa-mcard {
		grid-template-columns: 260px minmax(0, 1fr);
		align-items: center;
	}
}

.inaa-mcard__face {
	position: relative;
	aspect-ratio: 1.6 / 1;
	padding: 16px 18px;
	border-radius: 8px;
}

.inaa-mcard__id {
	display: block;
	margin-top: 4px;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 0.6875rem;
	letter-spacing: 0.06em;
	color: rgba(255, 255, 255, 0.92);
}

.inaa-mcard__facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	gap: 14px 20px;
	margin: 0;
}

.inaa-mcard__facts dt {
	margin: 0 0 3px;
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
}

.inaa-mcard__facts dd {
	margin: 0;
	color: var(--inaa-navy, #14275c);
	font-size: 0.9375rem;
	font-weight: 700;
}

.inaa-mcard__mono {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 0.875rem;
	letter-spacing: 0.02em;
}

.inaa-pill {
	display: inline-block;
	padding: 3px 11px;
	border-radius: 99px;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.03em;
}

.inaa-pill--ok    { background: #e3f4e8; color: #1a7f37; }
.inaa-pill--warn  { background: #fff3cd; color: #8a6100; }
.inaa-pill--error { background: #fdecee; color: #a50d15; }
.inaa-pill--muted { background: #eef1f6; color: #5b6478; }

.inaa-account__actions {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.inaa-account__actions .inaa-btn {
	width: 100%;
}

/* ---------- panels ---------- */

.inaa-panel {
	margin: 0 0 40px;
	padding: 26px;
	border: 1px solid var(--inaa-border, #dde3ed);
	border-radius: 4px;
	background: #fff;
}

.inaa-panel__title {
	margin: 0 0 6px;
	color: var(--inaa-navy, #14275c);
	font-size: 1.25rem;
	font-weight: 700;
}

.inaa-panel__intro {
	margin: 0 0 20px;
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.9375rem;
	line-height: 1.55;
}

.inaa-table-wrap {
	overflow-x: auto;
}

.inaa-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9375rem;
}

/* A global `table td, table th { border: 1px solid … }` boxes every cell, and
   because it is a shorthand, overriding border-bottom alone leaves the other
   three sides drawing a spreadsheet grid. Clear all four, then redraw one. */
.inaa-table th {
	padding: 0 14px 9px 0;
	border: 0;
	border-bottom: 1px solid var(--inaa-border, #dde3ed);
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-align: left;
	text-transform: uppercase;
	white-space: nowrap;
}

.inaa-table td {
	padding: 13px 14px 13px 0;
	border: 0;
	border-bottom: 1px solid #eef1f6;
	vertical-align: middle;
	background: none;
}

/* The same stylesheet zebra-stripes odd rows at 0,1,2. Naming the class plus
   the row structure outranks it, so the table reads as rules not blocks. */
.inaa-table tbody > tr:nth-child(2n + 1) > td,
.inaa-table tbody > tr:nth-child(2n + 1) > th {
	background-color: transparent;
}

.inaa-table tr:last-child td {
	border-bottom: 0;
}

.inaa-table th:last-child,
.inaa-table td:last-child {
	padding-right: 0;
}

/* Amounts line up on the decimal, so a column of figures scans. The element
   selectors are needed: `.inaa-table th` is 0,1,1 and would otherwise keep the
   header cell left-aligned while its column sat right. */
.inaa-table th.inaa-table__num,
.inaa-table td.inaa-table__num {
	text-align: right;
	font-variant-numeric: tabular-nums;
}

.inaa-table code {
	padding: 2px 7px;
	border-radius: 4px;
	background: #f2f5f9;
	color: var(--inaa-navy, #14275c);
	font-size: 0.8125rem;
	letter-spacing: -0.01em;
	white-space: nowrap;
}

.inaa-table--payments tbody tr:hover td {
	background: #fafbfd;
}

/* ---------- payment history growth ---------- */

.inaa-panel__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 6px 18px;
}

.inaa-panel__aside {
	margin: 0;
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.875rem;
}

.inaa-panel__aside strong {
	color: var(--inaa-navy, #14275c);
}

/* A <details> disclosure keeps a long history off the page without JS. */
.inaa-history {
	margin-top: 6px;
}

.inaa-history__toggle {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 11px 0 2px;
	color: var(--inaa-navy, #14275c);
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
	list-style: none;
}

.inaa-history__toggle::-webkit-details-marker {
	display: none;
}

.inaa-history__toggle::before {
	content: "";
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg) translate(-1px, -1px);
	transition: transform 160ms ease;
}

.inaa-history[open] .inaa-history__toggle::before {
	transform: rotate(-135deg) translate(-2px, -2px);
}

.inaa-history__toggle:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.inaa-history__note {
	margin: 12px 0 0;
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.8125rem;
}

/* Below this a five-column table can only scroll sideways, so each row
   becomes a small card and the headers move into the cells. */
@media (max-width: 640px) {
	.inaa-table--payments thead {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		clip-path: inset(50%);
		white-space: nowrap;
	}

	.inaa-table--payments,
	.inaa-table--payments tbody,
	.inaa-table--payments tr,
	.inaa-table--payments td {
		display: block;
		width: auto;
	}

	.inaa-table--payments tr {
		margin-bottom: 12px;
		padding: 12px 14px;
		border: 1px solid var(--inaa-border, #dde3ed);
		border-radius: 9px;
	}

	.inaa-table--payments tr:last-child {
		margin-bottom: 0;
	}

	.inaa-table--payments td {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 14px;
		padding: 5px 0;
		border: 0;
		text-align: right;
	}

	.inaa-table--payments td::before {
		content: attr(data-label);
		flex: 0 0 auto;
		color: var(--inaa-text-muted, #5b6478);
		font-size: 0.6875rem;
		font-weight: 700;
		letter-spacing: 0.09em;
		text-transform: uppercase;
	}

	.inaa-table--payments .inaa-table__num {
		text-align: right;
	}
}

/* ---------- directory ---------- */

.inaa-dir-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 12px;
	margin-bottom: 32px;
}

.inaa-dir-filters .inaa-field {
	margin: 0;
	min-width: 200px;
	flex: 1 1 220px;
}

.inaa-dir-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	gap: 20px;
}

.inaa-dir-card {
	position: relative;
	display: flex;
	flex-direction: column;
	border-radius: 14px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 1px 2px rgba(13, 26, 62, 0.06), 0 8px 24px rgba(13, 26, 62, 0.07);
	transition: transform 260ms cubic-bezier(0.2, 0.7, 0.3, 1), box-shadow 260ms ease;
}

.inaa-dir-card:hover,
.inaa-dir-card:focus-within {
	transform: translateY(-4px);
	box-shadow: 0 2px 4px rgba(13, 26, 62, 0.08), 0 18px 40px rgba(13, 26, 62, 0.16);
}

/* Cover band — the brand gradient, with the red bloom used across the site. */
.inaa-dir-card__cover {
	display: block;
	height: 84px;
	background:
		radial-gradient(120% 160% at 82% 10%, rgba(208, 17, 27, 0.55) 0%, rgba(208, 17, 27, 0) 60%),
		linear-gradient(125deg, #0d1a3e 0%, #14275c 55%, #1c3372 100%);
}

/* Avatar straddles the cover, which is what makes it read as a profile card
   rather than a list row. */
.inaa-dir-card__avatar {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 92px;
	height: 92px;
	margin: -46px auto 0;
	border-radius: 50%;
	overflow: hidden;
	background: linear-gradient(130deg, #14275c 0%, #1c3372 100%);
	box-shadow: 0 0 0 5px #fff, 0 6px 16px rgba(13, 26, 62, 0.22);
}

.inaa-dir-card__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.inaa-dir-card__initials {
	color: rgba(255, 255, 255, 0.92);
	font-size: 2rem;
	font-weight: 700;
	line-height: 1;
}

.inaa-dir-card__body {
	flex: 1 1 auto;
	padding: 16px 22px 20px;
	text-align: center;
}

.inaa-dir-card__name {
	margin: 0;
	color: var(--inaa-navy, #14275c);
	font-size: 1.1875rem;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.015em;
}

.inaa-dir-card__role {
	margin: 5px 0 0;
	color: var(--inaa-red, #d0111b);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.09em;
	line-height: 1.35;
	text-transform: uppercase;
}

.inaa-dir-card__facts {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	margin: 16px 0 0;
	padding: 0;
	list-style: none;
}

.inaa-dir-card__facts li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.875rem;
	line-height: 1.4;
}

.inaa-dir-card__facts svg {
	flex: 0 0 auto;
	width: 15px;
	height: 15px;
	fill: #9aa4b6;
}

.inaa-dir-card__bio {
	margin: 14px 0 0;
	color: var(--inaa-text, #1b2333);
	font-size: 0.875rem;
	line-height: 1.6;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ---------- contact ---------- */

.inaa-dir-card__contact {
	border-top: 1px solid var(--inaa-border, #dde3ed);
}

.inaa-dir-card__action {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	padding: 14px 18px;
	color: var(--inaa-navy, #14275c);
	font-size: 0.9375rem;
	font-weight: 700;
	cursor: pointer;
	list-style: none;
	transition: background-color 180ms ease, color 180ms ease;
}

/* Hide the native disclosure triangle in both engines. */
.inaa-dir-card__action::-webkit-details-marker {
	display: none;
}

.inaa-dir-card__action::marker {
	content: "";
}

.inaa-dir-card__action svg {
	width: 17px;
	height: 17px;
	fill: currentColor;
	opacity: 0.75;
}

.inaa-dir-card__action:hover,
.inaa-dir-card__action:focus-visible {
	background: var(--inaa-off-white, #f5f7fa);
	color: var(--inaa-red, #d0111b);
}

.inaa-dir-card__contact[open] .inaa-dir-card__action {
	background: var(--inaa-off-white, #f5f7fa);
}

.inaa-dir-card__panel {
	padding: 4px 18px 18px;
	background: var(--inaa-off-white, #f5f7fa);
}

.inaa-dir-card__panel textarea {
	width: 100%;
	margin-bottom: 10px;
	padding: 11px 13px;
	border: 1px solid var(--inaa-border, #dde3ed);
	border-radius: 8px;
	background: #fff;
	color: var(--inaa-text, #1b2333);
	font-family: inherit;
	font-size: 0.9375rem;
	line-height: 1.5;
	resize: vertical;
}

.inaa-dir-card__panel textarea:focus-visible {
	border-color: var(--inaa-navy, #14275c);
	outline: none;
	box-shadow: 0 0 0 3px rgba(20, 39, 92, 0.14);
}

.inaa-dir-card__note {
	margin: 10px 0 0;
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.75rem;
	line-height: 1.5;
}

@media (prefers-reduced-motion: reduce) {
	.inaa-dir-card {
		transition: none;
	}

	.inaa-dir-card:hover {
		transform: none;
	}
}

/* ---------- paywall ---------- */

.inaa-paywall {
	position: relative;
	margin: 32px 0;
	padding: 44px 20px 48px;
	background:
		radial-gradient(110% 150% at 88% 8%, rgba(208, 17, 27, 0.4) 0%, rgba(208, 17, 27, 0) 58%),
		linear-gradient(125deg, #0d1a3e 0%, #14275c 52%, #1c3372 100%);
	color: #fff;
	overflow: hidden;
	font-family: var(--inaa-font);
}

@media (min-width: 768px) {
	.inaa-paywall {
		padding-inline: 40px;
	}
}

.inaa-paywall__inner {
	max-width: 620px;
}

.inaa-paywall__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 12px;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.inaa-paywall__eyebrow::before {
	content: "";
	width: 26px;
	height: 3px;
	background: var(--inaa-red, #d0111b);
}

.inaa-paywall__title {
	margin: 0 0 10px;
	color: #fff;
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 700;
	line-height: 1.15;
}

.inaa-paywall__text {
	margin: 0 0 24px;
	color: rgba(255, 255, 255, 0.88);
	font-size: 1rem;
	line-height: 1.6;
}

.inaa-paywall__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

@media (prefers-reduced-motion: reduce) {
	.inaa-tier__body,
	.inaa-method__body {
		transition: none;
	}
}

/* =========================================================================
   Membership card artwork
   Shared by the account dashboard and the Member Panel Elementor widget.
   ========================================================================= */

.inaa-member__mock {
	position: relative;
	display: block;
	aspect-ratio: 1.6 / 1;
	padding: 12px 14px;
	border-radius: 6px;
	overflow: hidden;
	background:
		radial-gradient(120% 150% at 88% 10%, rgba(208, 17, 27, 0.55) 0%, rgba(208, 17, 27, 0) 58%),
		linear-gradient(130deg, #14275c 0%, #1c3372 60%, #0d1a3e 100%);
	color: #fff;
	line-height: 1.2;
}

.inaa-member__mock > span {
	display: block;
}

.inaa-member__mock-org {
	font-size: 0.4375rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	opacity: 0.8;
}

.inaa-member__mock-kind {
	margin-top: 1px;
	color: #9fc3ef;
	font-size: 0.5rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.inaa-member__mock-name {
	margin-top: 26px;
	font-size: 0.6875rem;
	font-weight: 700;
}

.inaa-member__mock-id {
	margin-top: 2px;
	font-size: 0.5rem;
	letter-spacing: 0.05em;
	opacity: 0.7;
	text-transform: uppercase;
}

.inaa-member__mock-mark {
	position: absolute;
	right: 12px;
	bottom: 10px;
	font-size: 0.8125rem;
	font-weight: 800;
	letter-spacing: 0.02em;
}

/* =========================================================================
   Dashboard overview
   ========================================================================= */

.inaa-dash {
	display: grid;
	/* Fixed tracks rather than auto-fit: six tiles divide evenly into 2 or 3
	   columns, so the last row is never ragged with empty cells showing. */
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	margin-bottom: 34px;
	background: var(--inaa-border, #dde3ed);
	border: 1px solid var(--inaa-border, #dde3ed);
	border-radius: 4px;
	overflow: hidden;
}

.inaa-dash__tile {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 18px 20px;
	background: #fff;
}

.inaa-dash__label {
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
}

.inaa-dash__value {
	color: var(--inaa-navy, #14275c);
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.3;
	word-break: break-word;
}

.inaa-dash__value--mono {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	/* The ID is one token — sized to sit on a single line rather than break. */
	font-size: 0.8125rem;
	letter-spacing: 0;
	white-space: nowrap;
	overflow-x: auto;
	scrollbar-width: none;
}

.inaa-dash__value--mono::-webkit-scrollbar {
	display: none;
}

.inaa-dash__note {
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.8125rem;
	font-weight: 500;
}

/* ---------- setup checklist ---------- */

.inaa-steps {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: none;
}

.inaa-step {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 14px 0;
	border-top: 1px solid var(--inaa-border, #dde3ed);
}

.inaa-step:first-child {
	border-top: 0;
}

.inaa-step__mark {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	font-size: 0.8125rem;
	font-weight: 700;
	line-height: 1;
}

.inaa-step.is-done .inaa-step__mark {
	background: #e3f3e8;
	color: #1a7f43;
}

.inaa-step.is-todo .inaa-step__mark {
	background: var(--inaa-navy, #14275c);
	color: #fff;
}

.inaa-step__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.inaa-step__body strong {
	color: var(--inaa-navy, #14275c);
	font-size: 1rem;
}

.inaa-step__body span {
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.9375rem;
	line-height: 1.5;
}

.inaa-step.is-done .inaa-step__body strong {
	color: var(--inaa-text-muted, #5b6478);
}

/* ---------- tier picker ---------- */

.inaa-tier-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 18px;
}

.inaa-tier {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 22px;
	border: 1px solid var(--inaa-border, #dde3ed);
	border-radius: 4px;
	background: #fff;
	transition: border-color 200ms ease, box-shadow 200ms ease;
}

.inaa-tier:hover {
	border-color: var(--inaa-navy, #14275c);
	box-shadow: 0 10px 24px rgba(13, 26, 62, 0.1);
}

.inaa-tier__name {
	margin: 0;
	color: var(--inaa-navy, #14275c);
	font-size: 1.125rem;
	font-weight: 700;
}

.inaa-tier__price {
	margin: 0;
	color: var(--inaa-navy, #14275c);
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.1;
}

.inaa-tier__price span {
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.875rem;
	font-weight: 600;
}

.inaa-tier__benefits {
	color: var(--inaa-text, #1b2333);
	font-size: 0.9375rem;
	line-height: 1.55;
}

.inaa-tier__benefits p {
	margin: 0 0 8px;
}

.inaa-tier .inaa-btn {
	margin-top: auto;
	align-self: flex-start;
}

@media (min-width: 700px) {
	.inaa-dash {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.inaa-dash {
		grid-template-columns: minmax(0, 1fr);
	}

	.inaa-tier .inaa-btn {
		align-self: stretch;
	}
}

/* ---------- profile photo field ---------- */

.inaa-photo-field {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	margin-bottom: 22px;
	padding-bottom: 22px;
	border-bottom: 1px solid var(--inaa-border, #dde3ed);
}

.inaa-photo-field__preview {
	flex: 0 0 auto;
	width: 88px;
	height: 88px;
	border-radius: 50%;
	overflow: hidden;
	background: linear-gradient(130deg, #14275c 0%, #1c3372 100%);
	display: flex;
	align-items: center;
	justify-content: center;
}

.inaa-photo-field__preview img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.inaa-photo-field__initials {
	color: rgba(255, 255, 255, 0.9);
	font-size: 1.75rem;
	font-weight: 700;
	letter-spacing: 0.02em;
}

.inaa-photo-field__controls {
	flex: 1 1 auto;
	min-width: 0;
}

.inaa-photo-field__label {
	display: block;
	margin-bottom: 6px;
	color: var(--inaa-navy, #14275c);
	font-size: 0.9375rem;
	font-weight: 600;
}

.inaa-photo-field__hint {
	margin: 8px 0 0;
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.8125rem;
	line-height: 1.5;
}

@media (max-width: 560px) {
	.inaa-photo-field {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
}

/* Your own card gets a footer too, so the grid stays aligned. */
.inaa-dir-card__self {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0;
	padding: 14px 18px;
	border-top: 1px solid var(--inaa-border, #dde3ed);
	color: var(--inaa-text-muted, #5b6478);
	font-size: 0.875rem;
	font-weight: 600;
}

.inaa-dir-card__self svg {
	width: 15px;
	height: 15px;
	fill: #9aa4b6;
}

/* ---------- tier benefits ---------- */

.inaa-tier__benefits {
	display: flex;
	flex-direction: column;
	gap: 7px;
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--inaa-border, #dde3ed);
}

.inaa-tier__benefit {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	color: var(--inaa-text, #1b2333);
	font-size: 0.875rem;
	line-height: 1.45;
}

.inaa-tier__benefit svg {
	flex: 0 0 auto;
	width: 17px;
	height: 17px;
	margin-top: 1px;
	fill: #2f9e5f;
}

/* The chosen tier's list gets a touch more contrast. */
.inaa-tier input:checked ~ .inaa-tier__body .inaa-tier__benefits {
	border-top-color: rgba(20, 39, 92, 0.24);
}