/*
 * smh/section-standing (root .smh-standing). Owner: WP2. Design A: the four credentials as cards that float over the
 * hero's bottom edge (licence card in petrol glass with the big number and the verify link; unified number; VAT
 * number; professional framework), icon tabs and the card network added by inc/wp2.php, numbers revealed digit by
 * digit (mockup C's quick reveal). docs/ARCHITECTURE.md 5.3.2. Hover lift is transform only (mid-range phones).
 */

.smh-standing.smh-living { position: relative; z-index: 4; margin-top: -126px; }
.smh-standing .smh-standing__grid {
	display: grid;
	grid-template-columns: 1.32fr 1fr 1.16fr 1.02fr;
	gap: 16px;
}
.smh-standing .smh-standing__cell {
	position: relative;
	display: flex;
	flex-direction: column;
	min-block-size: 184px;
	margin: 0;
	padding: 24px 26px;
	border-radius: var(--smh-r-tab);
	background: var(--smh-white);
	color: var(--smh-ink);
	overflow: hidden;
	isolation: isolate;
	box-shadow: 0 2px 3px rgb(10 40 50 / .06), 0 22px 40px -18px rgb(10 40 50 / .34), 0 50px 90px -50px rgb(6 30 40 / .4);
}
.smh-standing .smh-standing__cell::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: inherit;
	box-shadow: inset 0 1px 0 rgb(255 255 255 / .9), inset 0 0 0 1px rgb(18 48 59 / .05);
}
@media (hover: hover) {
	.js.is-live .smh-living.smh-standing .smh-standing__cell:hover { transform: translateY(-6px); transition: transform .7s var(--smh-a-out); }
}
.smh-standing .smh-standing__tab {
	inline-size: 38px;
	block-size: 38px;
	border-radius: var(--smh-r-tab);
	display: grid;
	place-items: center;
	background: rgb(24 86 107 / .08);
	color: var(--smh-petrol);
}
.smh-standing .smh-standing__icon { inline-size: 21px; block-size: 21px; }
.smh-standing .smh-standing__label {
	margin-top: 18px;
	font-size: 14.5px;
	line-height: 1.65;
	color: var(--smh-muted);
}
.smh-standing .smh-standing__value,
.smh-standing .smh-standing__value--licence {
	margin-top: auto;
	padding-top: 14px;
	font-size: clamp(22px, 1.9vw, 27px);
	font-weight: 700;
	line-height: 1.25;
	color: var(--smh-ink);
}
.smh-standing .smh-standing__value--text { font-size: clamp(18px, 1.45vw, 20px); line-height: 1.55; }
.smh-standing .smh-standing__number bdi,
.smh-standing .smh-standing__number { font-variant-numeric: lining-nums tabular-nums; letter-spacing: .02em; }
.smh-standing .smh-standing__number .smh-roll { line-height: 1.15; }

/* licence: petrol glass, the big number, the verify link */
.smh-standing .smh-standing__cell--licence {
	color: var(--smh-white);
	background: linear-gradient(150deg, rgb(33 116 139 / .96) 0%, rgb(20 82 101 / .97) 45%, rgb(12 52 65 / .98) 100%);
}
.smh-standing .smh-standing__cell--licence::before { box-shadow: inset 0 1px 0 rgb(255 255 255 / .22), inset 0 0 0 1px rgb(255 255 255 / .08); }
.smh-standing .smh-standing__cell--licence::after {
	content: "";
	position: absolute;
	inset: -40% -20%;
	z-index: -1;
	background: linear-gradient(105deg, transparent 40%, rgb(255 255 255 / .14) 50%, transparent 60%);
	transform: translateX(70%);
}
.is-live .smh-standing .smh-standing__cell--licence::after { transform: translateX(-70%); transition: transform 2.2s var(--smh-a-io) 2.8s; }
.smh-standing .smh-standing__cell--licence .smh-standing__tab { background: rgb(255 255 255 / .12); color: var(--smh-white); box-shadow: inset 0 0 0 1px rgb(255 255 255 / .14); }
.smh-standing .smh-standing__cell--licence .smh-standing__label { color: var(--smh-mist); }
.smh-standing .smh-standing__value--licence { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; color: var(--smh-white); }
.smh-standing .smh-standing__value--licence > * { margin: 0; }
.smh-standing .smh-standing__word { font-size: clamp(22px, 1.9vw, 27px); font-weight: 700; color: var(--smh-white); }
.smh-standing .smh-standing__value--licence .smh-standing__number { font-size: clamp(40px, 3.4vw, 50px); font-weight: 700; line-height: 1; color: var(--smh-white); }
.smh-standing .smh-standing__net { position: absolute; inset-inline-end: -6%; bottom: -18%; inline-size: 78%; block-size: 92%; z-index: -1; opacity: .55; pointer-events: none; }
.smh-standing .smh-standing__verify { margin: 14px 0 0; }
.smh-standing .smh-standing__verify .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-block-size: 0;
	padding: 2px 0;
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.6;
	color: var(--smh-white);
	text-decoration: none;
	transition: border-color .3s;
}
.smh-standing .smh-standing__verify .wp-block-button__link:hover { background: none; color: var(--smh-white); }
.smh-standing .smh-standing__verify .wp-block-button__link:focus-visible { outline-color: var(--smh-white); }
.smh-standing .smh-standing__verify svg { inline-size: 16px; block-size: 16px; flex: none; }
.smh-standing .smh-standing__verify .wp-block-button__link { min-block-size: var(--smh-target); }

@media (max-width: 1180px) {
	.smh-standing .smh-standing__grid { grid-template-columns: 1fr 1fr; }
	.smh-standing .smh-standing__cell { min-block-size: 170px; }
}
@media (max-width: 760px) {
	.smh-standing.smh-living { margin-top: -86px; }
	.smh-standing .smh-standing__grid { grid-template-columns: 1fr; gap: 12px; }
	.smh-standing .smh-standing__cell { min-block-size: 0; padding: 20px; }
	.smh-standing .smh-standing__label { margin-top: 12px; }
}
@media print {
	.smh-standing.smh-living { margin-top: 0; }
	.smh-standing .smh-standing__cell { box-shadow: none; border: 1px solid; }
}