/* =========================================================
 * Revelado del pie.
 *
 * El contenido (.site) queda congelado en cuanto su borde inferior
 * toca el fondo de la ventana: la página «termina» ahí. Al seguir
 * bajando, el pie sube desde abajo y lo va tapando.
 *
 * `position: sticky` solo desplaza la caja en el sentido de la
 * propiedad de anclaje: `bottom` la sube, `top` la baja. Congelar
 * el contenido exige bajarlo, o sea `top`, y el umbral es
 * `alto de ventana - alto de .site`, que no se puede escribir en
 * CSS (los porcentajes de `top` van contra el bloque contenedor,
 * no contra la propia caja). Ese valor lo calcula y lo pone en
 * línea assets/js/footer-reveal.js, junto con la clase de abajo.
 *
 * · min-height evita que .site sea más baja que la ventana; en ese
 *   caso el JS ni siquiera activa el anclaje.
 * · El pie va después de .site en el documento, así que se pinta
 *   encima sin necesidad de z-index. La cabecera (.hdr, z-index
 *   900) sigue por encima de ambos, igual que antes.
 * ========================================================= */
.site {
	min-height: 100vh;
}

.site.is-footer-reveal {
	position: sticky;
	/* `top` lo escribe footer-reveal.js. Sin él no hay anclaje: así,
	   si el JS no llega a ejecutarse, la página se comporta como antes. */
}

@media (prefers-reduced-motion: reduce) {
	.site.is-footer-reveal { position: static; }
}

/* =========================================================
 * Footer 7K SAFETY — diseño nuevo.
 * Fondo plano #262d34, tres columnas (marca · menú · categorías),
 * títulos en rojo, filete vertical entre menú y categorías y marca
 * de agua «7K» degradada anclada abajo a la derecha.
 * Grilla propia (no depende de Bootstrap).
 * ========================================================= */

.oz-footer {
	--oz-fw-bg: #262d34;
	--oz-fw-red: #df0917;
	--oz-fw-text: #e8e9eb;
	--oz-fw-line: rgba(255, 255, 255, 0.22);
	--oz-fw-mark: 0.4;           /* opacidad de la marca de agua «7K» */

	position: relative;
	overflow: hidden;
	background: var(--oz-fw-bg);
	color: var(--oz-fw-text);
	font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	font-size: 17px;
	line-height: 1.45;
}

.oz-footer *,
.oz-footer *::before,
.oz-footer *::after { box-sizing: border-box; }

.oz-footer__inner {
	position: relative;
	width: 100%;
	max-width: 1480px;
	margin: 0 auto;
	padding: 88px 20px 56px;
}

/* ----- Marca de agua «7K» ----- */
.oz-footer__watermark {
	position: absolute;
	right: 20px;
	bottom: 12px;
	width: 58%;
	max-width: 830px;
	opacity: var(--oz-fw-mark);
	pointer-events: none;
	z-index: 0;
	line-height: 0;
}
.oz-footer__watermark svg { display: block; width: 100%; height: auto; }

/* ----- Grilla ----- */
.oz-footer__grid {
	position: relative;
	z-index: 1;
	display: grid;
	/* Las separaciones entre columnas van como padding de cada columna (y no
	   como column-gap) para que el filete vertical caiga en el punto exacto
	   del diseño: 45.8% / 65.2% / 100% del ancho de la grilla. */
	grid-template-columns: 45.8% 19.4% 34.8%;
	align-items: start;
}

.oz-footer__col { min-width: 0; }

/* ----- Títulos ----- */
.oz-footer__title {
	margin: 0 0 30px;
	color: var(--oz-fw-red);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* ----- Listas (menú y categorías) ----- */
.oz-footer__list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.oz-footer__list li { margin: 0 0 14px; }
.oz-footer__list li:last-child { margin-bottom: 0; }

.oz-footer a {
	color: var(--oz-fw-text);
	text-decoration: none;
	transition: color 0.18s ease;
}
.oz-footer a:hover,
.oz-footer a:focus-visible { color: var(--oz-fw-red); }

/* ===== Columna 1: marca ===== */
.oz-footer__logo { display: block; }
.oz-footer__logo img {
	display: block;
	width: 100%;
	max-width: 488px;
	height: auto;
}

.oz-footer__rule {
	display: block;
	width: 273px;
	max-width: 100%;
	margin: 84px 0 0;
	border-top: 1px solid var(--oz-fw-line);
}

.oz-footer__brand-body {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 34px 95px;
	margin-top: 72px;
}

.oz-footer__contact { flex: 0 1 auto; max-width: 320px; }
.oz-footer__contact .oz-footer__title { margin-bottom: 42px; }

.oz-footer__list--contact li {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	margin-bottom: 24px;
}

.oz-footer__icon-wrap {
	flex: 0 0 22px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 25px;              /* alinea el icono con la primera línea de texto */
	color: var(--oz-fw-red);
}
.oz-footer__icon {
	display: block;
	width: 22px;
	height: 22px;
	shape-rendering: geometricPrecision;
}

/* Libro de Reclamaciones */
.oz-footer__book { display: block; flex: 0 0 auto; }
.oz-footer__book img {
	display: block;
	width: 154px;
	height: auto;
}

/* ===== Columna 2: menú (filete vertical a su derecha) ===== */
.oz-footer__col--menu { position: relative; padding-left: 35px; }
.oz-footer__col--menu::after {
	content: "";
	position: absolute;
	top: -28px;
	left: 100%;
	height: calc(100% + 68px);
	border-left: 1px solid var(--oz-fw-line);
}

/* wp_nav_menu añade sus propias clases: se neutraliza el margen por defecto */
.oz-footer__list--menu li { list-style: none; }

/* ===== Columna 3: categorías (scroll fino) ===== */
.oz-footer__col--cats { padding-left: 175px; }

.oz-footer__list--cats {
	max-width: 210px;
	max-height: 190px;
	overflow-y: auto;
	padding-right: 18px;
	overscroll-behavior: contain;
}
/* Firefox no soporta ::-webkit-scrollbar; y en Chromium declarar
   scrollbar-width/color anula los pseudoelementos, así que va aislado. */
@supports (-moz-appearance: none) {
	.oz-footer__list--cats {
		scrollbar-width: thin;
		scrollbar-color: rgba(255, 255, 255, 0.55) rgba(255, 255, 255, 0.12);
	}
}
.oz-footer__list--cats::-webkit-scrollbar { width: 4px; }
.oz-footer__list--cats::-webkit-scrollbar-track {
	background: rgba(255, 255, 255, 0.12);
	border-radius: 4px;
}
.oz-footer__list--cats::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.55);
	border-radius: 4px;
}
.oz-footer__list--cats::-webkit-scrollbar-thumb:hover { background: var(--oz-fw-red); }

/* ----- Aviso legal ----- */
.oz-footer__legal {
	position: relative;
	z-index: 1;
	margin: 72px 0 0;
	color: rgba(255, 255, 255, 0.45);
	font-size: 13px;
	letter-spacing: 0.02em;
}
/* El crédito enlaza a ozado.pe conservando el color del texto: el hover se
   señala con subrayado, no con el rojo del resto de enlaces del pie. */
.oz-footer__legal a,
.oz-footer__legal a:hover,
.oz-footer__legal a:focus-visible { color: inherit; }
.oz-footer__legal a:hover,
.oz-footer__legal a:focus-visible { text-decoration: underline; }

/* =========================================================
 *  Responsive
 * ========================================================= */

/* Bajo 1280px la marca de agua ya no cabe junto a las columnas */
@media (max-width: 1279px) {
	.oz-footer__inner { padding-top: 64px; }
	.oz-footer__grid { grid-template-columns: 44% 22% 34%; }
	.oz-footer__col--menu { padding-left: 24px; }
	.oz-footer__col--cats { padding-left: 56px; }
	.oz-footer__rule { margin-top: 56px; }
	.oz-footer__brand-body { margin-top: 52px; gap: 32px 48px; }
	.oz-footer__watermark { width: 62%; opacity: calc(var(--oz-fw-mark) * 0.7); }
}

/* Tablet: marca a lo ancho, menú y categorías debajo en dos columnas */
@media (max-width: 991px) {
	.oz-footer__inner { padding: 48px 20px 44px; }
	.oz-footer__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 40px;
		row-gap: 48px;
	}
	.oz-footer__col--brand { grid-column: 1 / -1; }
	.oz-footer__col--menu { padding-left: 0; }
	.oz-footer__col--cats { padding-left: 0; }
	.oz-footer__col--menu::after { top: 0; height: 100%; left: calc(100% + 20px); }
	.oz-footer__rule { margin-top: 44px; }
	.oz-footer__brand-body { margin-top: 44px; }
	.oz-footer__watermark { width: 74%; bottom: -8px; opacity: calc(var(--oz-fw-mark) * 0.5); }
	.oz-footer__legal { margin-top: 48px; }
}

/* Móvil: una sola columna */
@media (max-width: 575px) {
	.oz-footer { font-size: 16px; }
	.oz-footer__inner { padding: 40px 18px 36px; }
	.oz-footer__grid { grid-template-columns: minmax(0, 1fr); row-gap: 40px; }
	.oz-footer__col--menu::after { display: none; }
	.oz-footer__logo img { max-width: 280px; }
	.oz-footer__rule { width: 200px; margin-top: 32px; }
	.oz-footer__brand-body { margin-top: 32px; gap: 32px; }
	.oz-footer__contact { flex: 1 1 100%; }
	.oz-footer__list--cats { max-height: 220px; }
	.oz-footer__watermark { width: 92%; opacity: calc(var(--oz-fw-mark) * 0.55); }
	.oz-footer__legal { margin-top: 36px; }
}
