/* ==========================================================
	Periscopio · panels.css
	Hoja única del sitio: tipos, variables, base, cabecera,
	portada, secciones de la home, páginas internas, aviso.
	========================================================== */

/* ---------- Tipos de letra (bloque de assets.py; rutas desde css/) ---------- */
@font-face {
	font-family:'Gabarito';
	font-style:normal;
	font-weight:400 900;
	font-display:swap;
	src:url('../fonts/gabarito-var.woff2') format('woff2');
	unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family:'Gabarito Fallback';
	src:local('Arial');
	descent-override:27%;
	ascent-override:96%;
	size-adjust:97%;
}
@font-face {
	font-family:'Onest';
	font-style:normal;
	font-weight:300 700;
	font-display:swap;
	src:url('../fonts/onest-var.woff2') format('woff2');
	unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family:'Onest Fallback';
	src:local('Arial');
	descent-override:30%;
	ascent-override:93%;
	size-adjust:104%;
}

/* ---------- Variables: profundidad + destello de la lente ---------- */
:root {
	--color-superficie: #ffffff;
	--color-espuma: #f6f7f9;
	--color-bruma: #f0f2f5;
	--color-niebla: #e7e9ee;
	--color-junta: #d9dce3;
	--color-sonda: #8a909b;
	--color-eco: #4d535e;
	--color-profundo: #16181d;
	--color-abismo: #14171d;
	--color-prisma: #6e2a3e;
	--color-destello: #c03d0c;
	--color-destello-hondo: #a3330a;
	--space-mira-xs: .5rem;
	--space-mira-s: 1rem;
	--space-mira-m: 1.5rem;
	--space-mira-l: 2.5rem;
	--space-mira-xl: 4rem;
	--space-borde: clamp(1.25rem, 4vw, 2.5rem);
	--space-tramo: clamp(4rem, 8vw, 6.5rem);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html {
	scroll-padding-top: 88px;

	-webkit-text-size-adjust: 100%;
}
body {
	margin: 0;

	font-family: 'Onest', 'Onest Fallback', Arial, sans-serif;
	font-size: 1.0625rem;
	line-height: 1.6;
	color: var(--color-profundo);

	background: var(--color-superficie);
}
body.nv-on { overflow: hidden; }
img {
	display: block;

	max-width: 100%;
	height: auto;
}
h1, h2, h3, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
h1, h2, h3 {
	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-weight: 700;
	line-height: 1.08;
	text-wrap: balance;
}
h2 { font-size: clamp(1.9rem, 3.4vw, 2.9rem); }
h3 { font-size: 1.3rem; }
a { color: var(--color-prisma); }
a:hover { color: var(--color-profundo); }
:focus-visible {
	outline: 3px solid var(--color-prisma);
	outline-offset: 2px;
}
button, input, textarea { font: inherit; }
mark {
	padding: 0 .15em;

	color: inherit;

	background: #6e2a3e1f;
	box-shadow: inset 0 -2px 0 var(--color-prisma);
}
.wr {
	max-width: 1240px;
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--space-borde);
	padding-right: var(--space-borde);
}
.sec {
	padding-top: var(--space-tramo);
	padding-bottom: var(--space-tramo);
}
.bnd { background: var(--color-espuma); }
.dk {
	position: relative;
	isolation: isolate; /* el grano ::before queda bajo el texto, no bajo el body */

	color: var(--color-niebla);

	background: var(--color-abismo);
}
.dk::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;

	pointer-events: none;

	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .08 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
}
.dk h2, .dk h3 { color: var(--color-superficie); }
.dk a:not(.bt) { color: var(--color-superficie); }

/* ---------- Encabezados de sección ---------- */
.ey {
	display: flex;
	align-items: center;
	gap: .6rem;

	font-size: .85rem;
	font-weight: 600;
	color: var(--color-prisma);
}
.ey::before {
	content: "";
	flex: none;

	width: 22px;
	height: 2px;

	background: currentColor;
}
.dk .ey { color: var(--color-sonda); }
.sh {
	display: grid;
	gap: 1rem 3rem;

	margin-bottom: clamp(2rem, 4vw, 3rem);
}
.sh h2 { margin-top: .75rem; }
.sh-2 {
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	align-items: end;
}
.sh-ld {
	max-width: 34rem;

	color: var(--color-eco);
}
.dk .sh-ld { color: var(--color-niebla); }

/* ---------- Botones ---------- */
.bt {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;

	min-height: 48px;
	padding: 0 1.4rem;

	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 1rem;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;

	border: 1px solid transparent;
	border-radius: 0; /* eje: rectángulo afilado */
	cursor: pointer;

	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.bt-p {
	color: var(--color-superficie);

	background: var(--color-destello);
}
.bt-p:hover {
	color: var(--color-superficie);

	background: var(--color-destello-hondo);
}
.bt-g {
	color: var(--color-profundo);

	background: transparent;
	border-color: var(--color-profundo);
}
.bt-g:hover {
	color: var(--color-superficie);

	background: var(--color-profundo);
}
.dk .bt-g {
	color: var(--color-superficie);

	border-color: var(--color-niebla);
}
.dk .bt-g:hover {
	color: var(--color-abismo);

	background: var(--color-superficie);
}
.bt-s {
	min-height: 44px;
	padding: 0 1rem;

	font-size: .95rem;
}
.bt:disabled {
	cursor: default;

	background: var(--color-sonda);
}

/* ---------- Tarjetas y plantillas comunes ---------- */
.crd {
	padding: 1.5rem;

	background: var(--color-bruma);
	border-radius: 3px;
}
.crd-w {
	padding: clamp(1.5rem, 3vw, 2.5rem);

	background: var(--color-superficie);
	border-radius: 4px;
	box-shadow: 0 1px 2px #14171d0f, 0 14px 36px #14171d14;
}
.crd-dk {
	color: var(--color-niebla);

	background: var(--color-abismo);
}
.crd-dk h2, .crd-dk h3 { color: var(--color-superficie); }
.crd-dk a { color: var(--color-superficie); }
.crd h2, .crd h3 { margin-bottom: .6rem; }
.crd p + p { margin-top: .6rem; }
.tap {
	display: inline-flex;
	align-items: center;

	min-height: 44px;
}
.tb {
	width: 100%;

	font-size: .95rem;

	border-collapse: collapse;
}
.tb caption {
	padding-bottom: .6rem;

	font-weight: 600;
	text-align: left;
}
.tb th, .tb td {
	padding: .65rem .75rem;

	text-align: left;
	vertical-align: top;

	border-bottom: 1px solid var(--color-junta);
}
.tb thead th {
	font-size: .85rem;
	color: var(--color-eco);
}
.tb tbody tr:nth-child(odd) { background: #ffffff99; }
.vg {
	position: relative;
	display: block;
}
.vg::after { /* viñeta leve sobre la foto, sin recortar el img */
	content: "";
	position: absolute;
	inset: 0;

	pointer-events: none;

	background: radial-gradient(ellipse at center, #14171d00 55%, #14171d4d 100%);
}

/* ---------- Cabecera y panel de enlaces ---------- */
.hd {
	position: sticky;
	top: 0;
	z-index: 500;

	background: var(--color-superficie);
	border-bottom: 1px solid var(--color-niebla);
}
.hd-w {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 1rem;

	min-height: 72px;
}
.brnd {
	display: inline-flex;
	align-items: center;
	gap: .6rem;

	min-height: 44px;
	margin-right: auto;

	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--color-profundo);
	text-decoration: none;
}
.brnd svg { flex: none; }
.brg { display: none; }
.with-js .brg {
	display: inline-flex;
	align-items: center;
	gap: .65rem;

	min-width: 44px;
	min-height: 44px;
	padding: 0 .9rem;

	font-weight: 600;
	color: var(--color-profundo);

	background: transparent;
	border: 1px solid var(--color-junta);
	cursor: pointer;
}
.brg-l {
	width: 18px;
	height: 2px;

	background: currentColor;
	box-shadow: 0 -6px 0 currentColor, 0 6px 0 currentColor;
}
.nv { flex-basis: 100%; }
.nv-top, .nv-x { display: none; }
.nv-l {
	display: flex;
	flex-wrap: wrap;
	gap: 0 1.25rem;

	padding: 0 0 .5rem;

	list-style: none;
}
.nv-l a {
	display: inline-flex;
	align-items: center;

	min-height: 44px;

	color: var(--color-profundo);
}
.with-js .nv {
	position: fixed;
	inset: 0;
	z-index: 600; /* por encima de la cabecera (500) y del aviso (450) */
	display: flex;
	flex-direction: column;

	padding: 1rem var(--space-borde) 2rem;
	overflow-y: auto;

	color: var(--color-niebla);

	background: var(--color-abismo);

	visibility: hidden;
	transform: translateY(-14px);
	transition: transform .3s ease, visibility 0s linear .3s;
}
.with-js .nv.unfolded {
	visibility: visible;
	transform: none;
	transition: transform .3s ease;
}
.with-js .nv-top {
	display: flex;
	align-items: center;
	justify-content: space-between;

	width: 100%;
	max-width: 1160px;
	min-height: 56px;
	margin: 0 auto;

	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--color-superficie);
}
.with-js .nv-x {
	display: inline-flex;
	align-items: center;

	min-height: 44px;
	padding: 0 1rem;

	font-weight: 600;
	color: var(--color-superficie);

	background: transparent;
	border: 1px solid #ffffff59;
	cursor: pointer;
}
.with-js .nv-l {
	flex-direction: column;

	width: 100%;
	max-width: 1160px;
	margin: 2rem auto 0;
	padding: 0;
}
.with-js .nv-l a {
	display: flex;

	min-height: 64px;

	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: clamp(1.6rem, 4vw, 2.6rem);
	font-weight: 700;
	color: var(--color-superficie);
	text-decoration: none;

	border-bottom: 1px solid #ffffff1f;
}
.with-js .nv-l a:hover { color: var(--color-niebla); }

/* ---------- Portada: texto a la izquierda, foto con desplazamiento ---------- */
.hr {
	position: relative;
	overflow: hidden; /* recorta la foto cuando el parallax la baja */

	padding-top: clamp(2rem, 5vw, 3.5rem);
	padding-bottom: var(--space-tramo);
}
.hr-w {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(2rem, 4vw, 4rem);
}
.hr-t {
	margin: 1rem 0 1.5rem;

	font-size: clamp(2.8rem, 6.1vw, 6.5rem);
	line-height: .98;
}
.hr-ld {
	max-width: 34rem;

	font-size: 1.15rem;
	color: var(--color-eco);
}
.hr-cta {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;

	margin-top: 2rem;
}
.hr-fx {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: .5rem;

	margin-top: 2rem;
	padding: 0;

	list-style: none;
}
.hr-fx li {
	padding: .85rem 1rem;

	background: var(--color-bruma);
	border-radius: 3px;
}
.hr-fx b {
	display: block;

	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 1.4rem;
}
.hr-fx span {
	display: block;

	font-size: .875rem;
	line-height: 1.35;
	color: var(--color-eco);
}
.hr-f {
	position: relative;

	height: clamp(360px, 62vh, 600px);

	will-change: transform;
}
.hr-f .vg { height: 100%; }
.hr-i {
	width: 100%;
	height: 100%;

	object-fit: cover;
}
.hr-rd {
	position: absolute;
	left: -2rem;
	bottom: 1.5rem;
	z-index: 1;
	display: grid;
	gap: .55rem;

	width: min(19rem, 80%);
	padding: 1rem 1.1rem;

	font-size: .85rem;
	line-height: 1.3;

	background: var(--color-superficie);
	border-radius: 3px;
	box-shadow: 0 1px 2px #14171d14, 0 16px 40px #14171d29;
}
.rd-h {
	padding-bottom: .5rem;

	font-weight: 600;

	border-bottom: 1px solid var(--color-niebla);
}
.rd-r {
	display: grid;
	grid-template-columns: 7.5rem minmax(0, 1fr) 1.5rem;
	align-items: center;
	gap: .5rem;

	color: var(--color-eco);
}
.rd-r b { text-align: right; color: var(--color-profundo); }
.rd-b {
	height: 6px;

	background: var(--color-niebla);
}
.rd-b::after {
	content: "";
	display: block;

	height: 100%;

	background: var(--color-prisma);
}
.rd-b1::after { width: 82%; }
.rd-b2::after { width: 56%; }
.rd-b3::after { width: 38%; background: var(--color-sonda); }

/* ---------- Cartel de filas: qué compara ---------- */
.pb-l { border-top: 2px solid var(--color-profundo); }
.pb-r { border-bottom: 1px solid var(--color-junta); }
.pb-hd {
	display: grid;
	grid-template-columns: 4rem minmax(0, 15rem) minmax(1rem, 1fr) minmax(0, 21rem) auto;
	align-items: center;
	gap: 1rem;

	padding: 1.35rem 0;
}
.pb-n {
	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-weight: 700;
	color: var(--color-prisma);
}
.pb-t { font-size: clamp(1.4rem, 2.4vw, 2rem); }
.pb-ld { border-bottom: 2px dotted var(--color-junta); } /* puntos de programa de mano */
.pb-s {
	font-size: .98rem;
	color: var(--color-eco);
}
.pb-tg { display: none; }
.with-js .pb-tg {
	display: inline-flex;
	align-items: center;
	gap: .6rem;

	min-height: 44px;
	padding: 0 .9rem;

	font-weight: 600;
	color: var(--color-profundo);

	background: transparent;
	border: 1px solid var(--color-profundo);
	cursor: pointer;
}
.pb-tg::after {
	content: "+";

	font-size: 1.2rem;
	line-height: 1;
}
.pb-r.unfolded .pb-tg::after { content: "−"; }
.with-js .pb-c {
	display: grid;
	grid-template-rows: 0fr;

	transition: grid-template-rows .45s ease;
}
.with-js .pb-r.unfolded .pb-c { grid-template-rows: 1fr; }
.pb-ci {
	min-height: 0;
	overflow: hidden;
}
.with-js .pb-r:not(.unfolded) .pb-ci {
	visibility: hidden;
	transition: visibility 0s linear .45s;
}
.pb-in {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
	gap: 1rem;

	padding: 0 0 1.75rem 5rem;
}
.pv {
	padding: 1.25rem;

	background: var(--color-superficie);
	border-radius: 4px;
	box-shadow: 0 1px 2px #14171d0f, 0 12px 30px #14171d12;
}
.pv-h {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: .25rem 1rem;

	margin-bottom: 1rem;
	padding-bottom: .75rem;

	font-size: .85rem;
	color: var(--color-eco);

	border-bottom: 1px solid var(--color-niebla);
}
.pv-g {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}
.pv-v {
	padding: .9rem 1rem;

	background: var(--color-espuma);
	border-left: 3px solid var(--color-junta);
}
.pv-v:first-child { border-left-color: var(--color-prisma); }
.pv-o {
	margin-bottom: .35rem;

	font-size: .82rem;
	font-weight: 600;
	color: var(--color-eco);
}
.pv-tl {
	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 1.12rem;
	font-weight: 700;
	line-height: 1.25;
}
.pv-ls {
	display: grid;
	gap: .4rem;

	padding: 0;

	font-size: .95rem;

	list-style: none;
}
.pv-ls li {
	display: flex;
	justify-content: space-between;
	gap: .5rem;

	padding: .4rem .6rem;

	background: var(--color-superficie);
}
.pv-ls b { color: var(--color-prisma); }
.pv-ch {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
}
.pv-ch span {
	padding: .25rem .6rem;

	font-size: .92rem;

	background: var(--color-niebla);
	border-radius: 3px;
}
.pv-ch .df {
	color: var(--color-prisma);

	background: #6e2a3e1f;
}
.pv-n {
	margin-top: 1rem;

	font-size: .94rem;
	color: var(--color-eco);
}
.pv-n b { color: var(--color-prisma); }
.pb-nt {
	align-self: start;

	padding: 1.25rem;

	font-size: .95rem;

	background: var(--color-bruma);
	border-radius: 3px;
}
.pb-nt ul {
	display: grid;
	gap: .35rem;

	margin-top: .6rem;
	padding-left: 1.1rem;
}
.pb-fg { align-self: start; }
.pb-fg figcaption {
	margin-top: .55rem;

	font-size: .88rem;
	color: var(--color-eco);
}

/* ---------- Demo: línea de entrada que se abre en panel ---------- */
.dm-f { display: none; }
.with-js .dm-f {
	display: block;

	max-width: 54rem;
}
.dm-lb {
	display: block;

	margin-bottom: .5rem;

	font-weight: 600;
}
.dm-row {
	display: flex;
	gap: .5rem;
}
.dm-in {
	flex: 1;

	min-width: 0;
	min-height: 56px;
	padding: 0 1rem;

	font-size: 1.05rem;
	color: var(--color-profundo);

	background: var(--color-superficie);
	border: 1px solid var(--color-junta);
	border-radius: 3px;
}
.dm-in:focus-visible {
	outline: 3px solid #6e2a3e40;
	outline-offset: 0;

	border-color: var(--color-prisma);
}
.dm-row .bt { min-height: 56px; }
.dm-ch {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem;

	margin-top: 1rem;
}
.dm-chl {
	font-size: .92rem;
	color: var(--color-eco);
}
.chp {
	min-height: 44px;
	padding: 0 .9rem;

	font-size: .95rem;
	color: var(--color-profundo);

	background: var(--color-bruma);
	border: 0;
	border-radius: 3px;
	cursor: pointer;
}
.chp:hover { background: var(--color-niebla); }
.chp:disabled { color: var(--color-eco); cursor: default; }
.dm-e {
	margin-top: .5rem;

	font-size: .92rem;
	color: var(--color-destello-hondo);
}
.dm-e:empty { display: none; }
.dm-mf {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem 1.5rem;

	margin-top: 1.25rem;
	padding: 0;

	font-size: .92rem;
	color: var(--color-eco);

	list-style: none;
}
.dm-mf li::before {
	content: "";
	display: inline-block;

	width: 7px;
	height: 7px;
	margin-right: .5rem;

	background: var(--color-prisma);
}
.dm-p { display: none; }
.with-js .dm-p {
	display: grid;
	grid-template-rows: 0fr;

	transition: grid-template-rows .6s ease;
}
.with-js .dm-p.unfolded { grid-template-rows: 1fr; }
.dm-pi {
	min-height: 0;
	overflow: hidden;

	padding: 0 6px; /* deja ver la sombra lateral del panel */
}
.with-js .dm-p:not(.unfolded) .dm-pi {
	visibility: hidden;
	transition: visibility 0s linear .6s;
}
.dm-bx {
	position: relative;

	margin: 2rem 0 34px;

	background: var(--color-superficie);
	border: 1px solid var(--color-prisma);
	border-radius: 4px;
	box-shadow: 0 1px 2px #14171d0f, 0 18px 44px #6e2a3e1f;
}
.dm-pg {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;

	height: 3px;

	background: var(--color-prisma);

	transform: scaleX(0);
	transform-origin: left center;
}
.dm-hd {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem 1rem;

	padding: 1rem 1.25rem;

	border-bottom: 1px solid var(--color-niebla);
}
.dm-tt {
	margin-right: auto;

	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 1.1rem;
	font-weight: 700;
}
.dm-st {
	font-size: .92rem;
	font-variant-numeric: tabular-nums;
	color: var(--color-eco);
}
.dm-bd {
	display: grid;
	grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
}
.dm-sc {
	padding: 1.25rem;

	border-right: 1px solid var(--color-niebla);
}
.dm-svg {
	display: block;

	width: 100%;
	height: auto;
}
.dm-svg .ln { stroke: var(--color-niebla); stroke-width: 1; }
.dm-svg .lb {
	font-size: 12px;
	font-weight: 600;

	fill: var(--color-eco);
	text-anchor: middle;
}
.dm-svg .lane {
	transform-box: fill-box;
	transform-origin: center bottom;
	transform: scaleY(0);
	transition: transform .5s ease;
}
.dm-svg .lane.on { transform: scaleY(1); }
.dm-svg .fc {
	fill: var(--color-junta);

	transform-box: fill-box;
	transform-origin: center;
	transform: scale(0);
	transition: transform .35s cubic-bezier(.3, 1.4, .5, 1), fill .5s ease;
}
.dm-svg .fc.on { transform: scale(1); }
.dm-svg .fc.cm { fill: var(--color-eco); }
.dm-svg .fc.mk { fill: var(--color-prisma); }
.dm-svg .al {
	fill: none;
	stroke: var(--color-sonda);
	stroke-width: 1.5;
	stroke-dasharray: 1;
	stroke-dashoffset: 1;

	transition: stroke-dashoffset 1.2s ease;
}
.dm-svg .al.on { stroke-dashoffset: 0; }
.dm-svg .ls-in {
	transform-box: fill-box;
	transform-origin: center;
	transition: transform .4s ease;
}
.dm-svg .ls-in.off { transform: scale(0); }
.dm-svg .ls-l { stroke: var(--color-prisma); stroke-width: 1; stroke-dasharray: 3 4; }
.dm-svg .ls-c { fill: var(--color-superficie); stroke: var(--color-prisma); stroke-width: 2.5; }
.dm-svg .ls-p {
	fill: none;
	stroke: var(--color-prisma);
	stroke-width: 2;

	transform-box: fill-box;
	transform-origin: center;
	animation: lente 1.6s ease-out infinite;
}
@keyframes lente { /* pulso por color del trazo, no por opacity */
	from { transform: scale(1); stroke: #6e2a3eff; }
	to { transform: scale(1.9); stroke: #6e2a3e00; }
}
.dm-mt {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: .5rem;

	margin-top: 1rem;
}
.dm-mt div {
	padding: .7rem .8rem;

	background: var(--color-espuma);
}
.dm-mt dt {
	font-size: .82rem;
	color: var(--color-eco);
}
.dm-mt dd {
	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 1.6rem;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}
.dm-lg {
	display: flex;
	flex-direction: column;
	gap: .45rem;

	min-height: 18rem;
	padding: 1.25rem;

	font-family: Consolas, Menlo, monospace;
	font-size: .84rem;
	line-height: 1.45;

	background: var(--color-espuma);

	list-style: none;
}
.dm-lg li {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: .6rem;
}
.dm-lg time { color: var(--color-eco); }
.dm-lg li:last-child span::after {
	content: "";
	display: inline-block;

	width: .5em;
	height: 1em;
	margin-left: 2px;
	vertical-align: -2px;

	background: var(--color-prisma);

	animation: cursor 1s steps(2) infinite;
}
@keyframes cursor { 50% { background: transparent; } }
.dm-rs {
	display: grid;
	gap: 1.25rem;

	padding: 1.5rem 1.25rem;

	border-top: 1px solid var(--color-niebla);
}
.dm-rs[hidden] { display: none; }
.dm-rh {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .5rem 1rem;
}
.dm-rh p { color: var(--color-eco); }
.dm-cs {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: .75rem;
}
.cd {
	position: relative;

	padding: 1rem;

	background: var(--color-bruma);

	opacity: 0;
	transform: translateY(10px);
	transition: transform .45s ease, opacity .45s ease, box-shadow .45s ease, background-color .45s ease;
}
.cd.on { opacity: 1; transform: none; }
.cd.on.up {
	background: var(--color-superficie);
	box-shadow: 0 1px 2px #14171d0f, 0 12px 28px #14171d1f;

	transform: translateY(-3px);
}
.cd-o {
	font-size: .82rem;
	font-weight: 600;
	color: var(--color-prisma);
}
.cd-t {
	margin: .3rem 0 .7rem;

	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.25;
}
.cd-d {
	display: grid;
	gap: .25rem;

	font-size: .86rem;
}
.cd-d div {
	display: flex;
	flex-wrap: wrap;
	gap: 0 .4rem;
}
.cd-d dt { color: var(--color-eco); }
.cd-d dd { font-weight: 600; }
.cd.lk .cd-t, .cd.lk .cd-d {
	filter: blur(5px);
	user-select: none;
}
.cd-lk {
	position: absolute;
	left: 1rem;
	right: 1rem;
	bottom: 1rem;
	display: flex;
	align-items: center;
	justify-content: center;

	min-height: 44px;

	font-weight: 600;
	color: var(--color-prisma);
	text-decoration: none;

	background: var(--color-superficie);
	box-shadow: 0 1px 2px #14171d14, 0 8px 20px #14171d1a;
}
.dm-lk {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;

	padding: 1rem 1.25rem;

	color: var(--color-niebla);

	background: var(--color-abismo);
}
.dm-x {
	margin-top: 2rem;
	padding: 1.25rem;

	background: var(--color-bruma);
	border-radius: 3px;
}
.dm-x[hidden] { display: none; }

/* ---------- Recorrido en línea SVG: cómo se lee un informe ---------- */
.sp-w { position: relative; }
.sp-svg {
	position: absolute;
	top: 0;
	left: 0;

	width: 100%;
	height: 300px; /* 1 unidad vertical = 1 px: los puntos caen en 60 y 200 */
	overflow: visible;
}
.sp-svm { display: none; }
.sp-p {
	fill: none;
	stroke: var(--color-sonda);
	stroke-width: 2;
	stroke-dasharray: 1;
	stroke-dashoffset: 0;
	vector-effect: non-scaling-stroke;
}
.with-js .sp-p {
	stroke-dashoffset: 1;

	transition: stroke-dashoffset 2.4s ease .2s;
}
.with-js .sp-w.arrived .sp-p { stroke-dashoffset: 0; }
.sp-l {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));

	padding: 0;

	list-style: none;
}
.sp-s {
	position: relative;

	padding: 88px .75rem 0;

	text-align: center;
}
.sp-s:nth-child(even) { padding-top: 228px; }
.sp-d {
	position: absolute;
	top: 40px;
	left: 50%;
	display: grid;
	place-items: center;

	width: 40px;
	height: 40px;
	margin-left: -20px;

	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-weight: 700;
	color: var(--color-superficie);

	background: var(--color-prisma);
	border: 2px solid var(--color-niebla);
	border-radius: 50%;
}
.sp-s:nth-child(even) .sp-d { top: 180px; }
.sp-b {
	padding: 1.25rem 1.1rem;

	background: #ffffff0d;
	border-radius: 3px;
}
.sp-b h3 { font-size: 1.15rem; }
.sp-b p {
	margin-top: .5rem;

	font-size: .97rem;
	color: var(--color-niebla);
}
.sp-end {
	display: flex;
	justify-content: flex-end;

	margin-top: 2rem;
}

/* ---------- Precios: bento ---------- */
.pr-g {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 1rem;
}
.pr-hd {
	grid-column: 1 / 6;
	align-self: end;

	padding: 0 1rem 1rem 0;
}
.pr-hd h2 { margin: .75rem 0 1rem; }
.pr-hd p { color: var(--color-eco); }
.pl {
	display: flex;
	flex-direction: column;
	gap: 1rem;

	padding: 1.75rem;

	background: var(--color-bruma);
	border-radius: 3px;
}
.pl-gr { grid-column: 6 / 9; }
.pl-lc {
	grid-column: 9 / 13;
	grid-row: 1 / 3;

	color: var(--color-niebla);

	background: var(--color-abismo);
}
.pl-au { grid-column: 1 / 9; }
.pl h3 { font-size: 1.4rem; }
.pl-lc h3 { color: var(--color-superficie); }
.pl-pr {
	display: flex;
	align-items: baseline;
	gap: .4rem;
}
.pl-pr b {
	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: clamp(2.4rem, 4vw, 3.4rem);
	line-height: 1;
}
.pl-pr span { color: var(--color-eco); }
.pl-lc .pl-pr span { color: var(--color-sonda); }
.pl-l {
	display: grid;
	gap: .5rem;

	padding: 0;

	list-style: none;
}
.pl-l li {
	position: relative;

	padding-left: 1.6rem;
}
.pl-l li::before { /* marca de verificación dibujada con bordes */
	content: "";
	position: absolute;
	left: .1rem;
	top: .5em;

	width: .7rem;
	height: .38rem;

	border-left: 2px solid var(--color-prisma);
	border-bottom: 2px solid var(--color-prisma);

	transform: rotate(-45deg);
}
.pl-lc .pl-l li::before { border-color: var(--color-niebla); }
.pl-au .pl-l { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pl .bt {
	align-self: flex-start;

	margin-top: auto;
}
.pr-nt {
	grid-column: 1 / 13;
	display: flex;
	flex-wrap: wrap;
	gap: .5rem 2rem;

	padding: 1.1rem 1.5rem;

	font-size: .97rem;

	background: var(--color-espuma);
	border-left: 3px solid var(--color-prisma);
}

/* ---------- Registro y formularios ---------- */
.rg-g {
	display: grid;
	grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
	align-items: start;
	gap: 1rem;
}
.rg-fm h2 { margin: .75rem 0 1rem; }
.rg-fm > p { color: var(--color-eco); max-width: 38rem; }
.rg-sd {
	display: grid;
	gap: 1rem;
}
.fm {
	display: grid;
	gap: 1rem;

	margin-top: 1.5rem;
}
.fm-f {
	display: grid;
	gap: .4rem;
}
.fm-f label {
	font-size: .97rem;
	font-weight: 600;
}
.fm-in {
	width: 100%;
	min-height: 52px;
	padding: .7rem .9rem;

	color: var(--color-profundo);

	background: var(--color-superficie);
	border: 1px solid var(--color-junta);
	border-radius: 3px;
}
.fm-in:focus-visible {
	outline: 3px solid #6e2a3e40;
	outline-offset: 0;

	border-color: var(--color-prisma);
}
.fm-in[readonly] { background: var(--color-espuma); }
.fm-in[aria-invalid="true"] { border-color: var(--color-destello-hondo); }
.fm-ta {
	min-height: 150px;

	resize: vertical;
}
.fm-code {
	max-width: 12rem;

	font-size: 1.4rem;
	font-variant-numeric: tabular-nums;
}
.fm-e {
	font-size: .9rem;
	color: var(--color-destello-hondo);
}
.fm-e:empty { display: none; }
.fm-msg {
	padding: .75rem 1rem;

	font-size: .95rem;

	background: var(--color-bruma);
	border-left: 3px solid var(--color-prisma);
}
.fm-msg:empty { display: none; }
.fm .bt { justify-self: start; }
.cns {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .25rem .45rem;

	font-size: .97rem;
}
.cns input {
	width: 22px;
	height: 22px;
	margin: 0 .2rem 0 0;

	accent-color: var(--color-prisma);
}
.rg-st {
	display: grid;
	gap: .75rem;

	margin-top: 1.5rem;
}
.rg-ok {
	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--color-prisma);
}
.rg-st .bt { justify-self: start; }

/* ---------- Muro de citas ---------- */
.qw-g {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 1rem;
}
.qt {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 1.25rem;

	padding: 1.75rem;

	background: #ffffff0f;
	border-radius: 3px;
}
.qt:nth-child(1) { grid-column: span 7; }
.qt:nth-child(2) { grid-column: span 5; }
.qt:nth-child(3), .qt:nth-child(4), .qt:nth-child(5) { grid-column: span 4; }
.qt:nth-child(6) { grid-column: span 12; }
.qt blockquote::before {
	content: "«";
	display: block;

	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 2.6rem;
	line-height: .8;
	color: var(--color-sonda);
}
.qt p {
	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 1.22rem;
	font-weight: 500;
	line-height: 1.35;
	color: var(--color-superficie);
}
.qt:nth-child(1) p, .qt:nth-child(6) p { font-size: clamp(1.35rem, 2.1vw, 1.8rem); }
.qt figcaption {
	font-size: .92rem;
	color: var(--color-sonda);
}

/* ---------- Preguntas ---------- */
.fq-g {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.9fr);
	align-items: start;
	gap: 1rem 3rem;
}
.fq-hd {
	position: sticky;
	top: 96px;
}
.fq-hd h2 { margin: .75rem 0 1rem; }
.fq-hd p { color: var(--color-eco); }
.fq-l {
	display: grid;
	gap: .6rem;
}
.fq-i {
	background: var(--color-bruma);
	border-radius: 3px;
}
.fq-i summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;

	min-height: 56px;
	padding: .9rem 1.25rem;

	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 1.1rem;
	font-weight: 700;

	cursor: pointer;
	list-style: none;
}
.fq-i summary::-webkit-details-marker { display: none; }
.fq-i summary::after {
	content: "+";
	flex: none;

	font-size: 1.4rem;
	font-weight: 400;
	color: var(--color-prisma);
}
.fq-i[open] summary::after { content: "−"; }
.fq-i p {
	max-width: 62ch;
	padding: 0 1.25rem 1.2rem;

	color: var(--color-eco);
}

/* ---------- Franja final ---------- */
.ct-w {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem 3rem;
}
.ct h2 { font-size: clamp(1.8rem, 3.6vw, 3rem); }
.ct p { margin-top: .6rem; }

/* ---------- Pie y aviso de cookies ---------- */
.ft {
	padding: 1rem 0;

	background: var(--color-espuma);
	border-top: 1px solid var(--color-niebla);
}
.ft-w {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0 2rem;
}
.ft-c {
	font-size: .92rem;
	color: var(--color-eco);
}
.ft-l {
	display: flex;
	flex-wrap: wrap;
	gap: 0 1.25rem;

	padding: 0;

	list-style: none;
}
.ft-l a {
	display: inline-flex;
	align-items: center;

	min-height: 44px;

	font-size: .95rem;
	color: var(--color-profundo);
}
.gdpr-notice {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 450;
	display: grid;
	gap: .75rem;

	width: min(380px, calc(100% - 32px));
	padding: 1rem 1.1rem;

	font-size: .92rem;
	line-height: 1.45;
	color: var(--color-niebla);

	background: var(--color-abismo);
	border-radius: 4px;
	box-shadow: 0 2px 4px #14171d29, 0 18px 40px #14171d47;
}
.gdpr-notice[hidden] { display: none; }
.gdpr-notice a { color: var(--color-superficie); }
.gn-b {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .5rem;
}
.gn-bt {
	min-height: 44px;

	font-weight: 600;
	color: var(--color-superficie);

	background: #ffffff14;
	border: 1px solid #ffffff4d;
	cursor: pointer;
}
.gn-bt:hover { background: #ffffff29; }

/* ---------- Páginas internas: cabecera de página ---------- */
.ph {
	padding-top: clamp(2.5rem, 5vw, 3.5rem);
	padding-bottom: 2rem;
}
.ph h1 {
	margin-top: .8rem;

	font-size: clamp(2.2rem, 4.4vw, 3.6rem);
}
.ph-ld {
	max-width: 46rem;
	margin-top: 1rem;

	font-size: 1.1rem;
	color: var(--color-eco);
}
.sec-in { padding-bottom: var(--space-tramo); }

/* ---------- Contacto ---------- */
.cn {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 1rem;
}
.cn-tel { grid-column: 1 / 5; grid-row: 1; }
.cn-mail { grid-column: 5 / 9; grid-row: 1; }
.cn-hora { grid-column: 9 / 13; grid-row: 1; }
.cn-form { grid-column: 1 / 8; grid-row: 2; }
.cn-tips { grid-column: 8 / 13; grid-row: 2; align-self: start; }
.cn-req { grid-column: 1 / 13; grid-row: 3; }
.cn-fac { grid-column: 1 / 7; grid-row: 4; }
.cn-edu { grid-column: 7 / 13; grid-row: 4; }
.cn h2 { font-size: clamp(1.25rem, 2vw, 1.5rem); }
.cn address { font-style: normal; }
.cn-tel a, .cn-mail a {
	font-family: 'Gabarito', 'Gabarito Fallback', Arial, sans-serif;
	font-size: 1.3rem;
	font-weight: 700;
	overflow-wrap: anywhere;
}
.cn-tips ul {
	display: grid;
	gap: .5rem;

	margin-top: .75rem;
	padding-left: 1.1rem;
}
.cn-tips p { margin-top: 1rem; }
.rq {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .75rem 2rem;
}
.rq div {
	padding: .75rem 0;

	border-top: 1px solid var(--color-junta);
}
.rq dt {
	font-size: .85rem;
	color: var(--color-eco);
}
.rq dd { font-weight: 600; }

/* ---------- Textos legales ---------- */
.lg {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	align-items: start;
	gap: 1rem 2rem;
}
.lg-c {
	grid-column: 1 / 9;
	display: grid;
	gap: 1rem;
}
.lg-toc {
	position: sticky;
	top: 96px;
	grid-column: 9 / 13;
	grid-row: 1;

	padding: 1.25rem;

	background: var(--color-espuma);
	border-left: 3px solid var(--color-prisma);
}
.lg-toc p { font-weight: 600; }
.lg-toc ol {
	display: grid;

	margin-top: .5rem;
	padding: 0;

	list-style: none;
}
.lg-toc a {
	display: flex;
	align-items: center;

	min-height: 44px;

	text-decoration: none;

	border-bottom: 1px solid var(--color-niebla);
}
.lg-b {
	padding: 1.5rem 1.75rem;

	background: var(--color-bruma);
	border-radius: 3px;
}
.lg-b h2 {
	margin-bottom: .75rem;

	font-size: 1.4rem;
}
.lg-b p + p, .lg-b p + ul, .lg-b ul + p, .lg-b .tb + p { margin-top: .75rem; }
.lg-b ul, .lg-b ol { padding-left: 1.2rem; }
.lg-b li + li { margin-top: .35rem; }
.lg-k {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .75rem;

	margin-top: .75rem;
}
.lg-cd {
	padding: 1.1rem 1.2rem;

	background: var(--color-superficie);
	border-radius: 3px;
	box-shadow: 0 1px 2px #14171d0f, 0 8px 20px #14171d0f;
}
.lg-cd h3 {
	margin-bottom: .4rem;

	font-size: 1.08rem;
}
.lg-cd p { font-size: .97rem; }
.lg-cd p + p { margin-top: .35rem; }
.tb-rq th { width: 34%; }
.tb-rq td { overflow-wrap: anywhere; }
.lg-dt {
	font-size: .92rem;
	color: var(--color-eco);
}
.ck-reset { display: none; }
.with-js .ck-reset {
	display: inline-flex;

	margin-top: 1rem;
}
.ck-st { margin-top: .75rem; }
.ck-st:empty { display: none; }

/* ---------- Gracias y 404 ---------- */
.nf {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}
.nf .crd { display: grid; align-content: start; gap: .6rem; }
.nf .crd h2 { margin: 0; font-size: 1.3rem; }
.nf .bt { justify-self: start; }

/* ---------- Aparición al entrar en vista ---------- */
.with-js .rv {
	opacity: 0;
	transform: translateY(16px);
	transition: opacity .6s ease, transform .6s ease;
}
.with-js .rv.arrived {
	opacity: 1;
	transform: none;
}

/* ---------- Anchos ---------- */
@media (max-width: 1100px) {
	.pb-hd { grid-template-columns: 3rem minmax(0, 13rem) minmax(1rem, 1fr) minmax(0, 17rem) auto; }
	.pb-in { padding-left: 4rem; }
	.qt:nth-child(n) { grid-column: span 6; }
	.qt:nth-child(6) { grid-column: span 12; }
}
@media (max-width: 900px) {
	.sh-2 { grid-template-columns: minmax(0, 1fr); }
	.hr-w { grid-template-columns: minmax(0, 1fr); }
	.hr-f { height: auto; }
	.hr-i { aspect-ratio: 5 / 4; height: auto; }
	.hr-rd { left: .75rem; bottom: .75rem; }
	.pb-hd {
		grid-template-columns: 2.5rem minmax(0, 1fr) auto;
		gap: .5rem 1rem;
	}
	.pb-ld { display: none; }
	.pb-s { grid-column: 2 / 4; grid-row: 2; }
	.pb-tg, .with-js .pb-tg { grid-column: 3; grid-row: 1; }
	.pb-in {
		grid-template-columns: minmax(0, 1fr);

		padding-left: 0;
	}
	.dm-bd { grid-template-columns: minmax(0, 1fr); }
	.dm-sc { border-right: 0; border-bottom: 1px solid var(--color-niebla); }
	.dm-lg { min-height: 12rem; }
	.dm-cs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sp-svg { display: none; }
	.sp-svm {
		position: absolute;
		top: 0;
		left: 0;
		display: block;

		width: 40px;
		height: 100%;
	}
	.sp-l {
		grid-template-columns: minmax(0, 1fr);
		gap: 1rem;
	}
	.sp-s, .sp-s:nth-child(even) {
		padding: 0 0 0 60px;

		text-align: left;
	}
	.sp-d, .sp-s:nth-child(even) .sp-d {
		top: 14px;
		left: 0;

		margin-left: 0;
	}
	.sp-end { justify-content: flex-start; }
	.pr-hd, .pl-gr, .pl-lc, .pl-au, .pr-nt {
		grid-column: 1 / -1;
		grid-row: auto;
	}
	.rg-g, .fq-g { grid-template-columns: minmax(0, 1fr); }
	.fq-hd { position: static; }
	.cn { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cn-hora, .cn-form, .cn-tips, .cn-req, .cn-fac, .cn-edu {
		grid-column: 1 / -1;
		grid-row: auto;
	}
	.cn-tel, .cn-mail { grid-row: 1; } /* teléfono y correo en una fila, el formulario justo debajo */
	.cn-tel { grid-column: 1; }
	.cn-mail { grid-column: 2; }
	.cn-hora { order: 1; }
	.cn-tel h2, .cn-mail h2 { font-size: 1.05rem; }
	.cn-tel a, .cn-mail a { font-size: 1.05rem; }
	.fm-ta { min-height: 116px; }
	.lg { grid-template-columns: minmax(0, 1fr); }
	.lg-c, .lg-toc {
		grid-column: 1 / -1;
		grid-row: auto;
	}
	.lg-toc { position: static; }
	.nf { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
	.qt:nth-child(n) { grid-column: span 12; }
	.pl-au .pl-l, .pv-g, .lg-k, .rq { grid-template-columns: minmax(0, 1fr); }
	.dm-cs { grid-template-columns: minmax(0, 1fr); }
	.dm-mt dd { font-size: 1.3rem; }
	.gdpr-notice {
		right: 0;
		bottom: 0;

		width: 100%;

		border-radius: 0;
	}
	.tb-ck thead { display: none; }
	.tb-ck tr, .tb-ck td, .tb-ck th { display: block; }
	.tb-ck tr { padding: .5rem 0; border-bottom: 1px solid var(--color-junta); }
	.tb-ck th, .tb-ck td { padding: .2rem .5rem; border-bottom: 0; }
	.tb-ck td::before {
		content: attr(data-th) ": ";

		font-weight: 600;
	}
}
@media (max-width: 480px) {
	.hd-cta { display: none; }
	.hr-fx { grid-template-columns: minmax(0, 1fr); }
	.hr-fx li {
		display: flex;
		align-items: baseline;
		gap: .6rem;
	}
	.dm-row { flex-direction: column; }
	.rd-r { grid-template-columns: 6.5rem minmax(0, 1fr) 1.5rem; }
}
@media (prefers-reduced-motion: reduce) {
	.with-js .rv { transition: none; }
	.dm-svg .ls-p { animation: none; }
}