/*
 * smh/registrations, root .smh-registrations (docs/ARCHITECTURE.md 5.6). Owner: WP7.
 * The About page's certificate: the ghost S (5 % petrol, .smh-ghost on the section, centred like a watermark) behind
 * the top + bottom brackets (.smh-frame on the inner sheet). Inside, a register of facts: label (small, muted, 500)
 * over value (large, 500, ink, tabular numerals), detail lines small. 1 column < 600, 2 columns 600-1023,
 * 3 columns >= 1024 (the address spans two). Logical properties; Chromium 114; tokens only.
 */

.smh-registrations { margin-block: 0; }
.smh-registrations::after { width: min(80%, 560px); } /* The watermark: a little smaller than the default. */
.smh-registrations__frame {
	padding-block: calc(var(--smh-bracket-arm) + 2rem);
	padding-inline: clamp(1.25rem, 4vw, 3rem);
}
.smh-registrations__frame > * { margin-block: 0; }
.smh-registrations__title {
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 700;
	color: var(--smh-petrol);
}
.smh-registrations__list {
	display: grid;
	gap: var(--wp--preset--spacing--60) 1.5rem;
	margin-block-start: var(--wp--preset--spacing--60);
}
.smh-registrations__item {
	margin: 0;
	padding-block-start: var(--wp--preset--spacing--40);
	border-block-start: 1px solid var(--smh-line);
}
.smh-registrations__label {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	line-height: var(--smh-lh-relaxed);
	color: var(--smh-muted);
}
.smh-registrations__value {
	margin: var(--wp--preset--spacing--10) 0 0;
	font-size: var(--wp--preset--font-size--large);
	font-weight: 500;
	line-height: var(--smh-lh-relaxed);
	color: var(--smh-ink);
}
.smh-registrations__detail {
	margin: var(--wp--preset--spacing--10) 0 0;
	font-size: var(--wp--preset--font-size--small);
	line-height: var(--smh-lh-relaxed);
	color: var(--smh-ink);
}
.smh-registrations__verify { margin-block-start: var(--wp--preset--spacing--60); }
.smh-registrations__verify a {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--20);
	min-block-size: var(--smh-target);
	font-weight: 500;
	color: var(--smh-petrol);
}
.smh-registrations__ext { flex: none; inline-size: 1rem; block-size: 1rem; }

@media (min-width: 600px) {
	.smh-registrations__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.smh-registrations__item--address { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
	.smh-registrations__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.smh-registrations__item--address { grid-column: span 2; }
}

/* ==========================================================================================================
 * Design A "Living Network" (2026-10-01): the certificate as a raised sheet; the licence as design A's petrol
 * credential card (glass gradient, white number); ID numbers large with tabular figures, their digits appearing one
 * after another when the box scrolls into view (assets/js/inner.js; reveal.css has the shared [data-smh-roll] rules,
 * repeated here so the box never depends on another file).
 * ========================================================================================================== */
.smh-registrations__frame {
	background: var(--smh-white);
	border-radius: var(--smh-r-tab);
	box-shadow: 0 2px 3px rgb(10 40 50 / 0.06), 0 22px 40px -18px rgb(10 40 50 / 0.3), 0 50px 90px -50px rgb(6 30 40 / 0.35);
}
.smh-registrations__title { font-size: clamp(1.875rem, 3vw, 2.875rem); color: var(--smh-ink); }
.smh-registrations__value { font-size: clamp(1.25rem, 1.8vw, 1.6875rem); font-weight: 700; line-height: 1.35; }
.smh-registrations__value .smh-num { letter-spacing: 0.02em; }
.smh-registrations__item--licence {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--50);
	border: 0;
	border-radius: var(--smh-r-tab);
	color: var(--smh-white);
	background: linear-gradient(150deg, rgb(33 116 139 / 0.96) 0%, rgb(20 82 101 / 0.97) 45%, rgb(12 52 65 / 0.98) 100%);
	box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.22), 0 22px 40px -18px rgb(10 40 50 / 0.4);
}
.smh-registrations__item--licence .smh-registrations__label,
.smh-registrations__item--licence .smh-registrations__detail { color: var(--smh-mist); }
.smh-registrations__item--licence .smh-registrations__value { color: var(--smh-white); font-size: clamp(2.25rem, 3.4vw, 3.125rem); line-height: 1.1; }
@media (min-width: 1024px) {
	.smh-registrations__item--licence { grid-row: span 2; }
}
[data-smh-roll] .smh-dg {
	display: inline-block;
	opacity: 0;
	transform: translate3d(0, 0.35em, 0);
	transition: opacity 0.5s, transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
	transition-delay: calc(0.2s + var(--i, 0) * 45ms);
}
[data-smh-roll].is-on .smh-dg { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	[data-smh-roll] .smh-dg { opacity: 1; transform: none; }
}
