/*
Theme Name: TeknicoPC
Theme URI: https://teknicopc.com
Author: Antonio Pulido
Author URI: https://teknicopc.com
Description: Block theme de TeKnicoPC. Reparación y mantenimiento de computadoras, ciberseguridad y blog de tecnología. Fondo azul marino con acento azul/cian; incluye las variaciones Marca, Circuito verde y Suizo.
Version: 1.0.0
Requires at least: 6.6
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: teknicopc
*/

/* ==========================================================================
   Base
   ========================================================================== */

:root {
	--tk-gutter: clamp(1.25rem, 4vw, 2.5rem);
	--tk-radio-panel: 10px;
	--tk-radio-img: 8px;
}

html {
	scroll-behavior: smooth;
}

::selection {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
}

:where(a, button, input, textarea, select, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
	border-radius: 3px;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		animation-delay: 0ms !important;
		transition-duration: 0.01ms !important;
	}
}

/* Contenedor de sección a todo el ancho con gutter propio */
.tk-sec {
	padding-inline: var(--tk-gutter);
	padding-block: clamp(3rem, 7vw, 5.5rem);
}

.tk-sec-alt {
	background: var(--wp--preset--color--surface);
	border-block: 1px solid var(--wp--preset--color--line);
}

/* WordPress centra con !important los hijos de un grupo restringido (1200px).
   El párrafo es más angosto que el título, así que se le da el mismo desfase
   izquierdo que tiene el contenedor para que quede alineado con el título. */
.tk-sec > h2 + p {
	color: var(--wp--preset--color--muted);
	max-width: 60ch;
	margin-left: max(0px, calc((100% - 1200px) / 2)) !important;
	margin-right: auto !important;
}

.tk-aviso {
	padding: 0.75rem 1rem;
	border: 1px dashed var(--wp--preset--color--line);
	border-radius: 6px;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
}

/* ==========================================================================
   Encabezado
   ========================================================================== */

.tk-header {
	position: sticky;
	top: 0;
	z-index: 50;
	padding-inline: var(--tk-gutter);
	padding-block: 0.75rem;
	background: color-mix(in srgb, var(--wp--preset--color--base) 96%, transparent);
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.admin-bar .tk-header {
	top: var(--wp-admin--admin-bar--height, 32px);
}

.tk-header .wp-block-site-logo img {
	height: auto;
	border-radius: 6px;
}

/* Logo: dos versiones; la variación activa elige cuál mostrar (por defecto, la de fondo oscuro). */
.tk-logo {
	display: block;
	flex: none;
	width: clamp(190px, 26vw, 320px);
	aspect-ratio: 1400 / 255;
	background: var(--tk-logo-oscuro) left center / contain no-repeat;
	text-decoration: none;
}

/* Icono de WhatsApp en los botones (hereda el color del texto del botón). */
.tk-btn-wa .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
}

.tk-btn-wa .wp-block-button__link::before,
.tk-btn-wa-icono .wp-block-button__link::before,
.tk-wa-enlace::before {
	content: "";
	flex: none;
	width: 1.25em;
	height: 1.25em;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5a9.5 9.5 0 0 0-8.1 14.4L2.5 21.5l4.7-1.3A9.5 9.5 0 1 0 12 2.5Zm0 1.8a7.7 7.7 0 1 1-3.9 14.3l-.3-.2-2.5.7.7-2.4-.2-.3A7.7 7.7 0 0 1 12 4.3Zm-3 3.6c-.2 0-.5.1-.7.4-.3.3-.9.9-.9 2.1s.9 2.4 1 2.6c.1.2 1.8 2.8 4.4 3.8 2.2.9 2.6.7 3.1.6.5 0 1.5-.6 1.7-1.2.2-.6.2-1.1.2-1.2-.1-.1-.2-.2-.5-.3l-1.6-.8c-.2-.1-.4-.1-.5.1l-.7.9c-.1.2-.3.2-.5.1-.8-.4-1.7-.9-2.4-1.9-.1-.2 0-.3.1-.4l.4-.5.2-.4c.1-.2 0-.3 0-.4l-.7-1.7c-.2-.4-.3-.4-.5-.4H9Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5a9.5 9.5 0 0 0-8.1 14.4L2.5 21.5l4.7-1.3A9.5 9.5 0 1 0 12 2.5Zm0 1.8a7.7 7.7 0 1 1-3.9 14.3l-.3-.2-2.5.7.7-2.4-.2-.3A7.7 7.7 0 0 1 12 4.3Zm-3 3.6c-.2 0-.5.1-.7.4-.3.3-.9.9-.9 2.1s.9 2.4 1 2.6c.1.2 1.8 2.8 4.4 3.8 2.2.9 2.6.7 3.1.6.5 0 1.5-.6 1.7-1.2.2-.6.2-1.1.2-1.2-.1-.1-.2-.2-.5-.3l-1.6-.8c-.2-.1-.4-.1-.5.1l-.7.9c-.1.2-.3.2-.5.1-.8-.4-1.7-.9-2.4-1.9-.1-.2 0-.3.1-.4l.4-.5.2-.4c.1-.2 0-.3 0-.4l-.7-1.7c-.2-.4-.3-.4-.5-.4H9Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Enlace de texto con icono (pie de página). */
.tk-wa-enlace {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

/* Botón solo con icono: el texto sigue en el HTML para lectores de pantalla. */
.tk-btn-wa-icono .wp-block-button__link,
.tk-btn-gh-icono .wp-block-button__link {
	position: relative;
	display: inline-block;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	overflow: hidden;
	white-space: nowrap;
	text-indent: -9999px;
	border-radius: 999px;
}

.tk-btn-wa-icono .wp-block-button__link::before,
.tk-btn-gh-icono .wp-block-button__link::before {
	position: absolute;
	inset: 0;
	margin: auto;
	width: 1.5rem;
	height: 1.5rem;
	text-indent: 0;
}

/* Botón de GitHub solo con icono (encabezado). */
.tk-btn-gh-icono .wp-block-button__link::before {
	content: "";
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.tk-btn-sm .wp-block-button__link {
	padding: 0.5rem 1rem;
	font-size: var(--wp--preset--font-size--small);
}

/* ==========================================================================
   Portada: hero con trazas de circuito y panel de diagnóstico
   ========================================================================== */

.tk-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding-inline: var(--tk-gutter);
	padding-block: clamp(3.5rem, 9vw, 7rem);
}

/* Fondo de circuitos: trazas del color de acento, muy tenues. */
body::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: var(--wp--preset--color--accent);
	opacity: 0.1;
	/* Capa propia: se rasteriza una vez y el scroll no la vuelve a pintar. */
	will-change: transform;
	transform: translateZ(0);
	contain: strict;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='480' viewBox='0 0 480 480' fill='none' stroke='%23000' stroke-width='1.4'%3E%3Cpath d='M0 80h110l30 30h90l30-30h220'/%3E%3Cpath d='M0 300h70l40-40h120l40 40h210'/%3E%3Cpath d='M150 0v60l30 30v110l-30 30v250'/%3E%3Cpath d='M380 0v140l-30 30v210l30 30v70'/%3E%3Cpath d='M230 0v30l20 20h120'/%3E%3Cpath d='M0 410h60l20 20h90'/%3E%3Ccircle cx='110' cy='80' r='4'/%3E%3Ccircle cx='230' cy='110' r='4'/%3E%3Ccircle cx='70' cy='300' r='4'/%3E%3Ccircle cx='270' cy='300' r='4'/%3E%3Ccircle cx='150' cy='60' r='4'/%3E%3Ccircle cx='380' cy='140' r='4'/%3E%3Ccircle cx='350' cy='170' r='4'/%3E%3Ccircle cx='180' cy='230' r='4'/%3E%3Ccircle cx='370' cy='50' r='4'/%3E%3Ccircle cx='170' cy='430' r='4'/%3E%3C/svg%3E") 0 0 / 480px 480px repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='480' viewBox='0 0 480 480' fill='none' stroke='%23000' stroke-width='1.4'%3E%3Cpath d='M0 80h110l30 30h90l30-30h220'/%3E%3Cpath d='M0 300h70l40-40h120l40 40h210'/%3E%3Cpath d='M150 0v60l30 30v110l-30 30v250'/%3E%3Cpath d='M380 0v140l-30 30v210l30 30v70'/%3E%3Cpath d='M230 0v30l20 20h120'/%3E%3Cpath d='M0 410h60l20 20h90'/%3E%3Ccircle cx='110' cy='80' r='4'/%3E%3Ccircle cx='230' cy='110' r='4'/%3E%3Ccircle cx='70' cy='300' r='4'/%3E%3Ccircle cx='270' cy='300' r='4'/%3E%3Ccircle cx='150' cy='60' r='4'/%3E%3Ccircle cx='380' cy='140' r='4'/%3E%3Ccircle cx='350' cy='170' r='4'/%3E%3Ccircle cx='180' cy='230' r='4'/%3E%3Ccircle cx='370' cy='50' r='4'/%3E%3Ccircle cx='170' cy='430' r='4'/%3E%3C/svg%3E") 0 0 / 480px 480px repeat;
}

/* En el Editor del sitio el fondo de circuitos solo estorba: lo apagamos ahí. */
.editor-styles-wrapper::before {
	display: none;
}

@media print {
	body::before {
		display: none;
	}
}

.tk-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	/* Las trazas toman el color de acento de la variación activa. */
	background: var(--wp--preset--color--accent);
	opacity: 0.2;
	-webkit-mask: linear-gradient(to left, #000 25%, transparent 92%), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='640' height='420' viewBox='0 0 640 420' fill='none' stroke='%23000' stroke-width='1.5'%3E%3Cpath d='M0 90h180l40 40h120l30-30h110'/%3E%3Cpath d='M0 160h120l30 30h200l50 50h240'/%3E%3Cpath d='M200 420v-80l40-40h160l40-40V0'/%3E%3Cpath d='M520 420v-60l30-30h90'/%3E%3Cpath d='M60 0v50l30 30h60'/%3E%3Ccircle cx='180' cy='90' r='4'/%3E%3Ccircle cx='450' cy='100' r='4'/%3E%3Ccircle cx='350' cy='190' r='4'/%3E%3Ccircle cx='560' cy='330' r='4'/%3E%3Ccircle cx='200' cy='340' r='4'/%3E%3Ccircle cx='150' cy='80' r='4'/%3E%3C/svg%3E") right center / min(760px, 95%) auto no-repeat;
	-webkit-mask-composite: source-in;
	mask: linear-gradient(to left, #000 25%, transparent 92%), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='640' height='420' viewBox='0 0 640 420' fill='none' stroke='%23000' stroke-width='1.5'%3E%3Cpath d='M0 90h180l40 40h120l30-30h110'/%3E%3Cpath d='M0 160h120l30 30h200l50 50h240'/%3E%3Cpath d='M200 420v-80l40-40h160l40-40V0'/%3E%3Cpath d='M520 420v-60l30-30h90'/%3E%3Cpath d='M60 0v50l30 30h60'/%3E%3Ccircle cx='180' cy='90' r='4'/%3E%3Ccircle cx='450' cy='100' r='4'/%3E%3Ccircle cx='350' cy='190' r='4'/%3E%3Ccircle cx='560' cy='330' r='4'/%3E%3Ccircle cx='200' cy='340' r='4'/%3E%3Ccircle cx='150' cy='80' r='4'/%3E%3C/svg%3E") right center / min(760px, 95%) auto no-repeat;
	mask-composite: intersect;
}

.tk-hero h1 {
	text-wrap: balance;
	max-width: 13ch;
	margin-block-end: 0.25em;
}

.tk-hero .tk-lead {
	max-width: 52ch;
	color: var(--wp--preset--color--muted);
}

.tk-hero .tk-nota {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
}

@media (min-width: 782px) {
	.tk-hero .wp-block-columns {
		gap: clamp(2rem, 5vw, 4.5rem);
		align-items: center;
	}

	.tk-hero .tk-col-main {
		flex: 1.35 1 0;
	}

	.tk-hero .tk-col-aside {
		flex: 1 1 0;
	}
}

.tk-diag {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--tk-radio-panel);
	padding: clamp(1.25rem, 3vw, 2rem);
}

.tk-diag h2 {
	font-size: var(--wp--preset--font-size--large);
	margin: 0 0 0.75rem;
}

.tk-diag-lista {
	list-style: none;
	margin: 0;
	padding: 0;
}

.tk-diag-lista li {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding-block: 0.7rem;
	border-top: 1px solid var(--wp--preset--color--line);
}

/* Los indicadores se "encienden" en secuencia al cargar la portada. */
.tk-diag-lista li::before {
	content: "";
	flex: none;
	width: 0.6rem;
	height: 0.6rem;
	border-radius: 50%;
	background: var(--wp--preset--color--accent);
	opacity: 0.18;
	animation: tk-led 0.45s ease-out forwards;
	animation-delay: calc(0.5s + var(--i, 0) * 0.35s);
}

.tk-diag-lista li:nth-child(1) { --i: 0; }
.tk-diag-lista li:nth-child(2) { --i: 1; }
.tk-diag-lista li:nth-child(3) { --i: 2; }
.tk-diag-lista li:nth-child(4) { --i: 3; }
.tk-diag-lista li:nth-child(5) { --i: 4; }

@keyframes tk-led {
	to {
		opacity: 1;
		box-shadow: 0 0 0.8rem 0 color-mix(in srgb, var(--wp--preset--color--accent) 75%, transparent);
	}
}

.tk-diag .tk-diag-nota {
	margin: 1rem 0 0;
	padding-top: 1rem;
	border-top: 1px solid var(--wp--preset--color--line);
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
}

/* ==========================================================================
   Servicios y ciberseguridad: listas con filetes, sin tarjetas
   ========================================================================== */

.tk-servicio {
	border-top: 1px solid var(--wp--preset--color--line);
	padding-block: 1.25rem 1.75rem;
}

.tk-servicio h3 {
	margin: 0 0 0.4rem;
}

.tk-servicio h3 a {
	color: inherit;
	text-decoration: none;
	background: linear-gradient(var(--wp--preset--color--accent), var(--wp--preset--color--accent)) 0 100% / 0 2px no-repeat;
	transition: background-size 0.25s ease;
}

.tk-servicio h3 a:hover,
.tk-servicio h3 a:focus-visible {
	background-size: 100% 2px;
}

.tk-servicio p {
	margin: 0;
	color: var(--wp--preset--color--muted);
	max-width: 46ch;
}

.tk-sec .wp-block-columns {
	gap: 0 clamp(2rem, 6vw, 5rem);
}

/* ==========================================================================
   Cómo trabajo: secuencia real, por eso lleva numeración
   ========================================================================== */

.tk-pasos {
	counter-reset: paso;
	gap: clamp(1.5rem, 4vw, 3rem);
}

.tk-pasos > .wp-block-column {
	counter-increment: paso;
	border-top: 2px solid var(--wp--preset--color--accent);
	padding-top: 1rem;
}

.tk-pasos > .wp-block-column::before {
	content: counter(paso);
	display: block;
	font-family: var(--wp--preset--font-family--titulos);
	font-size: clamp(2.4rem, 5vw, 3.4rem);
	font-weight: 600;
	line-height: 1;
	color: var(--wp--preset--color--accent);
	margin-bottom: 0.5rem;
}

.tk-pasos h3 {
	margin: 0 0 0.4rem;
}

.tk-pasos p {
	margin: 0;
	color: var(--wp--preset--color--muted);
}

/* ==========================================================================
   Blog
   ========================================================================== */

.tk-entrada {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--tk-radio-panel);
	transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.tk-entrada > * {
	margin-block: 0;
}

.tk-entrada > :not(.wp-block-post-featured-image) {
	padding-inline: 1.15rem;
}

.tk-entrada > :last-child {
	padding-bottom: 1.15rem;
}

.tk-entrada:hover,
.tk-entrada:focus-within {
	transform: translateY(-3px);
	border-color: var(--wp--preset--color--accent);
	box-shadow: 0 10px 28px color-mix(in srgb, var(--wp--preset--color--accent) 18%, transparent);
}

.tk-entrada .wp-block-post-featured-image {
	overflow: hidden;
}

.tk-entrada .wp-block-post-featured-image img {
	border-radius: 0;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.tk-entrada:hover .wp-block-post-featured-image img {
	transform: scale(1.04);
}

/* Entradas sin imagen destacada: filete de color arriba para que no se vean vacías. */
.tk-entrada:not(:has(.wp-block-post-featured-image))::before {
	content: "";
	display: block;
	height: 6px;
	margin-bottom: 1.1rem;
	background: linear-gradient(90deg, var(--wp--preset--color--accent), transparent);
}

.tk-etiqueta {
	margin-top: 1rem !important;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.tk-etiqueta a {
	color: var(--wp--preset--color--accent);
	text-decoration: none;
}

.tk-entrada .wp-block-post-title {
	margin: 0.55rem 0 0.35rem;
	font-size: var(--wp--preset--font-size--large);
}

.tk-entrada .wp-block-post-title a {
	text-decoration: none;
}

.tk-entrada .wp-block-post-excerpt {
	color: var(--wp--preset--color--muted);
}

.tk-entrada .wp-block-post-excerpt__more-link {
	display: inline-block;
	margin-top: 0.4rem;
	color: var(--wp--preset--color--accent);
	font-weight: 600;
	text-decoration: none;
}

.tk-vacio {
	padding: clamp(2rem, 5vw, 3.5rem);
	background: var(--wp--preset--color--surface);
	border: 1px dashed var(--wp--preset--color--line);
	border-radius: var(--tk-radio-panel);
}

.tk-ver-todas {
	margin-top: 2rem;
}

.tk-meta {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
}

.tk-meta a {
	color: inherit;
}

/* ==========================================================================
   Contacto
   ========================================================================== */

.tk-contacto-datos {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--tk-radio-panel);
	padding: clamp(1.25rem, 3vw, 2rem);
}

.tk-contacto-datos h3 {
	margin: 0 0 0.5rem;
	font-size: var(--wp--preset--font-size--medium);
}

.tk-contacto-datos p {
	margin: 0 0 1.25rem;
}

.tk-contacto-datos p:last-child {
	margin-bottom: 0;
}

.tk-redes {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.25rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* ==========================================================================
   CTA al final de las entradas
   ========================================================================== */

.tk-cta {
	border-left: 3px solid var(--wp--preset--color--accent);
	padding: 0.25rem 0 0.25rem 1.5rem;
	margin-block: 3rem 1rem;
}

.tk-cta h2 {
	font-size: var(--wp--preset--font-size--x-large);
	margin: 0 0 0.5rem;
}

.tk-cta p {
	color: var(--wp--preset--color--muted);
}

/* ==========================================================================
   Pie de página
   ========================================================================== */

.tk-footer {
	border-top: 1px solid var(--wp--preset--color--line);
	padding-inline: var(--tk-gutter);
	padding-block: 3rem 2rem;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
}

.tk-footer a {
	color: var(--wp--preset--color--muted);
	text-decoration: none;
}

.tk-footer a:hover,
.tk-footer a:focus-visible {
	color: var(--wp--preset--color--accent);
	text-decoration: underline;
}

.tk-footer h2 {
	font-size: var(--wp--preset--font-size--medium);
	margin: 0 0 0.75rem;
}

.tk-footer ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.tk-footer li + li {
	margin-top: 0.4rem;
}

/* Fila de proyectos (APSoft y GitHub): referencia discreta en el pie. */
.tk-footer .tk-proyectos {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 1.5rem;
	margin-top: 2rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--wp--preset--color--line);
	font-size: var(--wp--preset--font-size--small);
}

.tk-footer .tk-proyectos-titulo {
	color: var(--wp--preset--color--muted);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.tk-footer .tk-pie-enlace {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-weight: 600;
}

.tk-footer .tk-pie-apsoft {
	letter-spacing: 0.02em;
}

.tk-footer .tk-ico-github::before {
	content: "";
	flex: none;
	width: 1.25em;
	height: 1.25em;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.tk-footer .tk-legal {
	margin-top: 2rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--wp--preset--color--line);
}

/* ==========================================================================
   Widget de reseñas (Trustindex) dentro de la sección
   ========================================================================== */

.tk-resenas {
	margin-top: 2rem;
}

/* Reseller SUPERAntiSpyware: tarjeta siempre oscura para que ambos logos se lean en cualquier estilo */
.tk-sas {
	display: grid;
	gap: clamp(1rem, 3vw, 2rem);
	align-items: center;
	margin: 2rem 0;
	padding: clamp(1.25rem, 3vw, 2rem);
	background: linear-gradient(135deg, #0a0e1a 0%, #101730 100%);
	border: 1px solid #243058;
	border-left: 4px solid #ffd400;
	border-radius: var(--tk-radio-panel);
	color: #e8edf7;
}

@media (min-width: 782px) {
	.tk-sas {
		grid-template-columns: minmax(240px, 5fr) 7fr;
	}
}

.tk-sas-logos {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
}

.tk-sas-logos img {
	display: block;
	height: auto;
	max-width: 100%;
}

.tk-sas-logo-tk {
	width: min(240px, 70%);
}

.tk-sas-logo-sas {
	width: min(320px, 90%);
}

.tk-sas-x {
	color: #9aa6c4;
	font-size: 1.25rem;
	line-height: 1;
}

.tk-sas .tk-sas-etiqueta {
	margin: 0 0 0.25rem;
	color: #ffd400;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.tk-sas h3 {
	margin: 0 0 0.5rem;
	color: #fff;
}

.tk-sas p {
	color: #cdd6ec;
}

.tk-sas .tk-sas-boton {
	display: inline-block;
	background: #ffd400;
	color: #0a0e1a;
	font-weight: 700;
	text-decoration: none;
}

.tk-sas .tk-sas-boton:hover,
.tk-sas .tk-sas-boton:focus-visible {
	background: #ffe14d;
	color: #0a0e1a;
}

.tk-sas .tk-sas-nota {
	margin: 0.75rem 0 0;
	color: #9aa6c4;
	font-size: 0.75rem;
}