/* =========================================================================
   v0.10.0 — Identidad por sección + movimiento + ajustes de pantalla.

   Inspirado (no copiado) en Kit Digital gob.cl: azul institucional, azul
   noche, la franja azul/rojo como firma y encabezados de bloque con mucho
   contraste. Cada sección toma SU color (--ssm-mod-*, editable en el
   Customizer) y SU patrón geométrico, para que al entrar se sepa dónde se
   está sin leer el título.

   Todo es CSS puro (gradientes, sin imágenes ni fuentes externas): pesa
   pocos KB y no hace ni una petición extra al servidor.
   ========================================================================= */

/* ---------- Color de la sección actual ---------- */
.ssm-section--news        { --ssm-sec: var(--ssm-mod-news); }
.ssm-section--communique  { --ssm-sec: var(--ssm-mod-communique); }
.ssm-section--alerts      { --ssm-sec: var(--ssm-gob-red); }
.ssm-section--document    { --ssm-sec: var(--ssm-mod-document); }
.ssm-section--training    { --ssm-sec: var(--ssm-mod-training); }
.ssm-section--hospital    { --ssm-sec: var(--ssm-mod-hospital); }
.ssm-section--org         { --ssm-sec: var(--ssm-mod-org); }
.ssm-section--union       { --ssm-sec: var(--ssm-mod-union); }
.ssm-section--mobility    { --ssm-sec: var(--ssm-mod-mobility); }
.ssm-section--contacts    { --ssm-sec: var(--ssm-mod-contacts); }
.ssm-section--agenda      { --ssm-sec: var(--ssm-mod-agenda); }
.ssm-section--community   { --ssm-sec: var(--ssm-mod-community); }
.ssm-section--gallery     { --ssm-sec: var(--ssm-mod-gallery); }
.ssm-section--benefits    { --ssm-sec: var(--ssm-mod-benefits); }
.ssm-section--wellbeing   { --ssm-sec: var(--ssm-mod-wellbeing); }
.ssm-section--ideas       { --ssm-sec: var(--ssm-mod-ideas); }
.ssm-section--poll        { --ssm-sec: var(--ssm-mod-poll); }
.ssm-section--helpdesk    { --ssm-sec: var(--ssm-mod-helpdesk); }
.ssm-section--ask         { --ssm-sec: var(--ssm-mod-ask); }
.ssm-section--electric    { --ssm-sec: var(--ssm-electric-600); }
.ssm-section--recognition { --ssm-sec: var(--ssm-mod-ideas); }
.ssm-section--search      { --ssm-sec: var(--ssm-color-primary); }
.ssm-section--celeste     { --ssm-sec: var(--ssm-celeste-600); }

/*
 * Dentro del contenido, el "primario" pasa a ser el color de la sección:
 * botones, enlaces destacados, pestañas activas y chips toman ese color.
 * Menú lateral y topbar quedan fuera a propósito (navegación estable).
 */
.ssm-section:not(.ssm-identity-off) .ssm-content {
	--ssm-color-primary: var(--ssm-sec);
	--ssm-blue-700: var(--ssm-sec);
	--ssm-item: var(--ssm-sec);
}
@supports (color: color-mix(in srgb, red 50%, blue)) {
	.ssm-section:not(.ssm-identity-off) .ssm-content {
		--ssm-color-primary-light: color-mix(in srgb, var(--ssm-sec) 10%, var(--ssm-surface));
		--ssm-blue-700: color-mix(in srgb, var(--ssm-sec) 82%, #000);
		--ssm-item-wash: color-mix(in srgb, var(--ssm-sec) 10%, var(--ssm-surface));
	}
	/* Fondo de página con un halo muy suave del color de la sección. */
	.ssm-section:not(.ssm-identity-off) .ssm-main {
		background:
			radial-gradient(1200px 380px at 85% -120px, color-mix(in srgb, var(--ssm-sec) 13%, transparent), transparent 70%),
			var(--ssm-bg);
	}
}

/* ---------- Patrones por sección (solo gradientes CSS) ---------- */
.ssm-section { --ssm-sec-pattern: radial-gradient(rgba(255,255,255,.16) 1.5px, transparent 1.6px) 0 0 / 18px 18px; }
.ssm-section--news { --ssm-sec-pattern: repeating-linear-gradient(-45deg, rgba(255,255,255,.10) 0 2px, transparent 2px 14px); }
.ssm-section--communique,
.ssm-section--alerts { --ssm-sec-pattern: repeating-linear-gradient(0deg, rgba(255,255,255,.10) 0 3px, transparent 3px 16px); }
.ssm-section--document { --ssm-sec-pattern: linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px) 0 0 / 22px 22px, linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px) 0 0 / 22px 22px; }
.ssm-section--training { --ssm-sec-pattern: radial-gradient(rgba(255,255,255,.22) 2px, transparent 2.2px) 0 0 / 20px 20px; }
.ssm-section--hospital { --ssm-sec-pattern: repeating-radial-gradient(circle at 92% 30%, rgba(255,255,255,.13) 0 2px, transparent 2px 22px); }
.ssm-section--org { --ssm-sec-pattern: radial-gradient(rgba(255,255,255,.3) 2.5px, transparent 2.7px) 0 0 / 36px 36px, linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px) 18px 0 / 36px 36px, linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px) 0 18px / 36px 36px; }
.ssm-section--union { --ssm-sec-pattern: linear-gradient(135deg, rgba(255,255,255,.10) 25%, transparent 25%) -14px 0 / 28px 28px, linear-gradient(225deg, rgba(255,255,255,.10) 25%, transparent 25%) -14px 0 / 28px 28px; }
.ssm-section--mobility { --ssm-sec-pattern: repeating-linear-gradient(60deg, rgba(255,255,255,.09) 0 10px, transparent 10px 26px); }
.ssm-section--contacts { --ssm-sec-pattern: radial-gradient(circle, rgba(255,255,255,.18) 3px, transparent 3.2px) 0 0 / 28px 28px; }
.ssm-section--agenda { --ssm-sec-pattern: linear-gradient(rgba(255,255,255,.14) 2px, transparent 2px) 0 0 / 46px 40px, linear-gradient(90deg, rgba(255,255,255,.14) 2px, transparent 2px) 0 0 / 46px 40px; }
.ssm-section--community { --ssm-sec-pattern: radial-gradient(circle at 20% 30%, rgba(255,255,255,.16) 0 22px, transparent 23px) 0 0 / 120px 90px, radial-gradient(circle at 70% 70%, rgba(255,255,255,.10) 0 14px, transparent 15px) 0 0 / 120px 90px; }
.ssm-section--gallery { --ssm-sec-pattern: repeating-linear-gradient(90deg, rgba(255,255,255,.14) 0 10px, transparent 10px 22px) 0 0 / 100% 12px no-repeat, repeating-linear-gradient(90deg, rgba(255,255,255,.14) 0 10px, transparent 10px 22px) 0 100% / 100% 12px no-repeat; }
.ssm-section--benefits { --ssm-sec-pattern: conic-gradient(from 45deg, rgba(255,255,255,.10) 25%, transparent 0 50%, rgba(255,255,255,.10) 0 75%, transparent 0) 0 0 / 26px 26px; }
.ssm-section--wellbeing { --ssm-sec-pattern: radial-gradient(circle at 50% 100%, transparent 14px, rgba(255,255,255,.12) 15px 17px, transparent 18px) 0 0 / 40px 22px; }
.ssm-section--ideas,
.ssm-section--recognition { --ssm-sec-pattern: repeating-conic-gradient(from 0deg at 92% 50%, rgba(255,255,255,.12) 0 6deg, transparent 6deg 18deg); }
.ssm-section--poll { --ssm-sec-pattern: linear-gradient(90deg, rgba(255,255,255,.14) 8px, transparent 8px) 0 100% / 22px 60% repeat-x, linear-gradient(90deg, rgba(255,255,255,.08) 8px, transparent 8px) 11px 100% / 22px 85% repeat-x; }
.ssm-section--helpdesk { --ssm-sec-pattern: radial-gradient(rgba(255,255,255,.28) 2px, transparent 2.2px) 0 0 / 30px 30px, linear-gradient(rgba(255,255,255,.09) 1px, transparent 1px) 0 0 / 30px 15px; }
.ssm-section--ask { --ssm-sec-pattern: radial-gradient(rgba(255,255,255,.35) 1.2px, transparent 1.4px) 0 0 / 26px 26px, radial-gradient(rgba(255,255,255,.18) 2px, transparent 2.2px) 13px 13px / 26px 26px; }

/* ---------- Encabezado de módulo → banda de sección ---------- */
.ssm-section:not(.ssm-identity-off) .ssm-module-head {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	align-items: center;
	gap: var(--ssm-sp-5);
	padding: clamp(20px, 2.4vw, 32px) clamp(20px, 2.6vw, 36px);
	border-radius: 20px;
	color: #fff;
	background: var(--ssm-sec);
	box-shadow: 0 14px 34px -18px var(--ssm-sec);
	margin-bottom: var(--ssm-sp-6);
}
@supports (color: color-mix(in srgb, red 50%, blue)) {
	.ssm-section:not(.ssm-identity-off) .ssm-module-head {
		background: linear-gradient(115deg, color-mix(in srgb, var(--ssm-sec) 78%, #000) 0%, var(--ssm-sec) 55%, color-mix(in srgb, var(--ssm-sec) 70%, #fff) 130%);
	}
}
.ssm-section:not(.ssm-identity-off) .ssm-module-head::before {
	content: '';
	position: absolute; inset: 0;
	z-index: -1;
	background: var(--ssm-sec-pattern);
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 55%);
	mask-image: linear-gradient(90deg, transparent 0%, #000 55%);
}
/* Franja institucional fina al pie de la banda. */
.ssm-section:not(.ssm-identity-off) .ssm-module-head::after {
	content: '';
	position: absolute; left: 0; bottom: 0;
	width: 100%; height: 4px;
	background: linear-gradient(90deg, rgba(255,255,255,.55) 0 38%, var(--ssm-gob-red) 38% 100%);
	opacity: .9;
}
.ssm-section:not(.ssm-identity-off) .ssm-module-head__icon {
	width: 64px; height: 64px;
	border-radius: 18px;
	background: rgba(255, 255, 255, .16);
	color: #fff;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}
.ssm-section:not(.ssm-identity-off) .ssm-module-head__icon .ssm-icon { width: 32px; height: 32px; }
.ssm-section:not(.ssm-identity-off) .ssm-module-head h1 { font-size: clamp(24px, 2.4vw, 34px); font-weight: 800; letter-spacing: -.01em; color: #fff; }
.ssm-section:not(.ssm-identity-off) .ssm-module-head p,
.ssm-section:not(.ssm-identity-off) .ssm-module-head .ssm-state__desc { color: rgba(255, 255, 255, .88); font-size: 15px; max-width: 70ch; }
.ssm-section:not(.ssm-identity-off) .ssm-module-head a:not(.ssm-btn) { color: #fff; text-decoration: underline; }
.ssm-section:not(.ssm-identity-off) .ssm-module-head .ssm-btn--secondary { background: #fff; color: var(--ssm-sec); border-color: transparent; }
.ssm-section:not(.ssm-identity-off) .ssm-module-head .ssm-btn--primary { background: rgba(255,255,255,.18); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); }
.ssm-section:not(.ssm-identity-off) .ssm-module-head .ssm-badge,
.ssm-section:not(.ssm-identity-off) .ssm-module-head [class*="chip"] { background: rgba(255,255,255,.18); color: #fff; border-color: rgba(255,255,255,.3); }

/* Títulos de bloque dentro de la sección: marca corta en su color. */
.ssm-section:not(.ssm-identity-off) .ssm-content .ssm-card__header h2,
.ssm-section:not(.ssm-identity-off) .ssm-content .ssm-section-title {
	position: relative;
}
.ssm-section:not(.ssm-identity-off) .ssm-breadcrumbs a { color: var(--ssm-sec); font-weight: 600; }

/* ---------- Topbar: "Estás en …" + cristal ---------- */
.ssm-topbar { background: rgba(255, 255, 255, .86); -webkit-backdrop-filter: saturate(160%) blur(10px); backdrop-filter: saturate(160%) blur(10px); }
@media (prefers-color-scheme: dark) { .ssm-topbar { background: rgba(23, 33, 44, .86); } }
.ssm-section:not(.ssm-identity-off) .ssm-topbar { box-shadow: inset 0 -3px 0 var(--ssm-sec); border-bottom-color: transparent; }

.ssm-topbar__section { display: flex; align-items: center; gap: 12px; min-width: 0; flex-shrink: 1; }
.ssm-topbar__section-icon {
	width: 40px; height: 40px; flex-shrink: 0;
	border-radius: 12px;
	display: flex; align-items: center; justify-content: center;
	background: var(--ssm-item, var(--ssm-color-primary));
	color: #fff;
	box-shadow: 0 6px 16px -6px var(--ssm-item, var(--ssm-color-primary));
}
.ssm-topbar__section-icon .ssm-icon { width: 21px; height: 21px; }
.ssm-topbar__section-text { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.ssm-topbar__section-eyebrow { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ssm-text-muted); }
.ssm-topbar__section-label { font-size: 18px; font-weight: 800; color: var(--ssm-item, var(--ssm-text)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 860px) {
	.ssm-topbar__section-eyebrow { display: none; }
	.ssm-topbar__section-label { font-size: 15px; }
	.ssm-topbar__section-icon { width: 34px; height: 34px; border-radius: 10px; }
}

/* ---------- Pantalla completa: menos aire muerto ---------- */
.ssm-topbar__search { max-width: 640px; }
@media (min-width: 1600px) {
	body { font-size: 15.5px; }
}

/* Densidad compacta (Customizer). */
.ssm-density-compact .ssm-content { padding-top: var(--ssm-sp-4); }
.ssm-density-compact .ssm-card { padding: var(--ssm-sp-4); }
.ssm-density-compact .ssm-module-head { margin-bottom: var(--ssm-sp-4) !important; padding-top: 16px !important; padding-bottom: 16px !important; }

/* =========================================================================
   Movimiento (Customizer → Animaciones). Nada se oculta sin JavaScript:
   la clase .ssm-reveal la agrega app.js solo si las animaciones están
   activas, así que sin JS (o con ellas apagadas) todo se ve normal.
   ========================================================================= */
.ssm-anim-on .ssm-reveal {
	opacity: 0;
	transform: translate3d(0, var(--ssm-anim-dist), 0);
	transition:
		opacity var(--ssm-anim-dur) var(--ssm-anim-ease),
		transform var(--ssm-anim-dur) var(--ssm-anim-ease);
	transition-delay: var(--ssm-reveal-delay, 0ms);
}
.ssm-anim--expresiva .ssm-reveal { transform: translate3d(0, var(--ssm-anim-dist), 0) scale(.96); }
.ssm-anim-on .ssm-reveal.is-revealed { opacity: 1; transform: none; }

/* Entrada de la banda de sección. */
/* Solo transform (nunca opacity:0) a propósito: si un navegador pausa la animación, el encabezado igual queda visible. */
@keyframes ssm-head-in {
	from { transform: translate3d(0, calc(var(--ssm-anim-dist) * -.6), 0) scale(.985); }
	to   { transform: none; }
}
@keyframes ssm-icon-pop {
	0%   { transform: scale(.6) rotate(-12deg); }
	70%  { transform: scale(1.08) rotate(2deg); }
	100% { transform: none; }
}
@keyframes ssm-pattern-drift {
	from { background-position: 0 0; }
	to   { background-position: 220px 0; }
}
.ssm-anim-on.ssm-section:not(.ssm-identity-off) .ssm-module-head { animation: ssm-head-in var(--ssm-anim-dur) var(--ssm-anim-ease) both; }
.ssm-anim-on.ssm-section:not(.ssm-identity-off) .ssm-module-head__icon { animation: ssm-icon-pop calc(var(--ssm-anim-dur) * 1.4) var(--ssm-anim-ease) both; animation-delay: calc(var(--ssm-anim-dur) * .3); }
.ssm-anim--expresiva.ssm-section:not(.ssm-identity-off) .ssm-module-head::before { animation: ssm-pattern-drift 40s linear infinite; }
.ssm-anim-on .ssm-topbar__section-icon { animation: ssm-icon-pop calc(var(--ssm-anim-dur) * 1.2) var(--ssm-anim-ease) both; }

/* Elevación al pasar el mouse (Customizer → "Elevación de tarjetas"). */
.ssm-hover-lift :is(
	.ssm-card, .ssm-news-card, .ssm-job-card, .ssm-hospital-card, .ssm-benefit-card,
	.ssm-union-card, .ssm-training-card, .ssm-idea-card, .ssm-directory-card,
	.ssm-category-card, .ssm-mm-card, .ssm-job-featured-card, .ssm-union-org-card,
	.ssm-newcomer-card, .ssm-bday-card, .ssm-stat-chip
) {
	transition: transform var(--ssm-anim-dur) var(--ssm-anim-ease), box-shadow var(--ssm-anim-dur) var(--ssm-anim-ease), border-color 200ms ease;
}
@media (hover: hover) {
	.ssm-hover-lift :is(
		.ssm-news-card, .ssm-job-card, .ssm-hospital-card, .ssm-benefit-card,
		.ssm-union-card, .ssm-training-card, .ssm-idea-card, .ssm-directory-card,
		.ssm-category-card, .ssm-mm-card, .ssm-job-featured-card, .ssm-union-org-card,
		.ssm-newcomer-card, .ssm-stat-chip
	):hover {
		transform: translateY(-4px);
		box-shadow: var(--ssm-shadow-lg);
	}
	.ssm-hover-lift .ssm-btn { transition: transform 160ms ease, background-color 160ms ease, box-shadow 160ms ease; }
	.ssm-hover-lift .ssm-btn--primary:hover { transform: translateY(-1px); box-shadow: 0 8px 18px -10px var(--ssm-color-primary); }
}

@media (prefers-reduced-motion: reduce) {
	.ssm-anim-on .ssm-reveal { opacity: 1; transform: none; }
}

/* La barra de administración de WP (solo editores) es fija de 32px: la topbar pegajosa debe quedar bajo ella, no detrás. */
@media screen and (min-width: 783px) {
	body.admin-bar .ssm-topbar { top: 32px; }
}

/* =========================================================================
   Medios (v0.10.0): videos, enlaces de video y documentos adjuntos.
   ========================================================================= */
.ssm-composer-attachments { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 0 56px; }
.ssm-composer-attachments li {
	display: flex; align-items: center; gap: 6px;
	padding: 6px 6px 6px 12px;
	border-radius: var(--ssm-radius-full);
	background: var(--ssm-color-primary-light);
	color: var(--ssm-text);
	font-size: 12.5px; font-weight: 600;
	max-width: 100%;
}
.ssm-composer-attachments__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.ssm-composer-attachments button {
	flex-shrink: 0; width: 24px; height: 24px; border-radius: 50%; border: none; cursor: pointer;
	background: var(--ssm-surface); color: var(--ssm-text-muted); display: flex; align-items: center; justify-content: center;
}
.ssm-composer-attachments button svg { width: 12px; height: 12px; }
.ssm-composer-link-row { display: flex; flex-direction: column; gap: 6px; margin: 10px 0 0 56px; }
.ssm-composer-link-row label { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: var(--ssm-text-muted); }
.ssm-composer-link-row label .ssm-icon { width: 15px; height: 15px; }
.ssm-composer-link-row input {
	width: 100%; padding: 10px 14px; border-radius: var(--ssm-radius-md);
	border: 1px solid var(--ssm-border-strong); background: var(--ssm-surface); color: var(--ssm-text); font-size: 14px;
}
@media (max-width: 640px) {
	.ssm-composer-attachments, .ssm-composer-link-row { margin-left: 0; }
}

.ssm-wall-video { margin-top: 12px; border-radius: var(--ssm-radius-lg); overflow: hidden; background: #000; }
.ssm-wall-video video { display: block; width: 100%; max-height: 560px; aspect-ratio: 16 / 9; background: #000; }

.ssm-video-embed {
	position: relative; margin-top: 12px;
	aspect-ratio: 16 / 9; width: 100%;
	border-radius: var(--ssm-radius-lg); overflow: hidden;
	background:
		radial-gradient(circle at 30% 30%, rgba(255,255,255,.12), transparent 50%),
		linear-gradient(135deg, var(--ssm-night), var(--ssm-color-primary));
	display: flex; align-items: center; justify-content: center;
}
.ssm-video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ssm-video-embed__play {
	display: flex; flex-direction: column; align-items: center; gap: 10px;
	background: none; border: none; color: #fff; cursor: pointer; font-weight: 700; font-size: 15px;
}
.ssm-video-embed__play small { display: block; font-weight: 600; opacity: .75; font-size: 12px; }
.ssm-video-embed__icon {
	width: 72px; height: 72px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: var(--ssm-gob-red); box-shadow: 0 10px 30px rgba(0,0,0,.35);
	transition: transform 200ms var(--ssm-anim-ease);
}
.ssm-video-embed__play:hover .ssm-video-embed__icon { transform: scale(1.08); }
.ssm-video-embed__link {
	position: absolute; right: 12px; bottom: 10px;
	display: inline-flex; align-items: center; gap: 4px;
	font-size: 12px; color: rgba(255,255,255,.85);
}
.ssm-video-embed__link .ssm-icon { width: 13px; height: 13px; }
.ssm-video-embed.is-playing { background: #000; }

.ssm-wall-files { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 8px; margin-top: 12px; }
.ssm-wall-file {
	display: flex; align-items: center; gap: 12px;
	padding: 10px 12px; border-radius: var(--ssm-radius-md);
	border: 1px solid var(--ssm-border); background: var(--ssm-surface);
	transition: border-color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}
.ssm-wall-file:hover { border-color: var(--ssm-color-primary); box-shadow: var(--ssm-shadow-sm); }
.ssm-wall-file > .ssm-icon { margin-left: auto; color: var(--ssm-text-muted); width: 18px; height: 18px; }
.ssm-wall-file__ext {
	flex-shrink: 0; width: 42px; height: 48px; border-radius: 8px;
	display: flex; align-items: flex-end; justify-content: center; padding-bottom: 6px;
	font-size: 10.5px; font-weight: 800; letter-spacing: .04em; color: #fff;
	background: #64748b;
	clip-path: polygon(0 0, 72% 0, 100% 22%, 100% 100%, 0 100%);
}
.ssm-wall-file__ext[data-ext="pdf"] { background: #c53030; }
.ssm-wall-file__ext[data-ext^="doc"], .ssm-wall-file__ext[data-ext="odt"] { background: #1d4ed8; }
.ssm-wall-file__ext[data-ext^="xls"], .ssm-wall-file__ext[data-ext="ods"], .ssm-wall-file__ext[data-ext="csv"] { background: #15803d; }
.ssm-wall-file__ext[data-ext^="ppt"], .ssm-wall-file__ext[data-ext="odp"] { background: #c2410c; }
.ssm-wall-file__body { display: flex; flex-direction: column; min-width: 0; }
.ssm-wall-file__name { font-size: 13.5px; font-weight: 700; color: var(--ssm-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ssm-wall-file__meta { font-size: 12px; color: var(--ssm-text-muted); }

.ssm-mm-video-grid { max-width: 1040px; margin: 0 auto 8px; display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 14px; }
.ssm-mm-video-grid .ssm-wall-video, .ssm-mm-video-grid .ssm-video-embed { margin-top: 0; }
.ssm-mm-files { max-width: 1040px; margin: 0 auto 8px; }
.ssm-mm-files .ssm-wall-files { margin-top: 0; }

/* Teléfono: el nombre de la sección manda; los íconos aún sin función (stubs) se ocultan para darle espacio. */
@media (max-width: 480px) {
	.ssm-topbar__actions .ssm-icon-btn[data-ssm-stub] { display: none; }
	.ssm-section:not(.ssm-identity-off) .ssm-module-head { flex-wrap: nowrap; align-items: flex-start; gap: 14px; }
	.ssm-section:not(.ssm-identity-off) .ssm-module-head__icon { width: 46px; height: 46px; border-radius: 14px; }
	.ssm-section:not(.ssm-identity-off) .ssm-module-head__icon .ssm-icon { width: 24px; height: 24px; }
	.ssm-section:not(.ssm-identity-off) .ssm-module-head__aside { margin-left: 0; }
}