/*
Theme Name: JMBento Toners
Theme URI: https://jmbentotoners.pt/
Description: Tema institucional da JMBento Toners. Homepage com experiência 3D interativa (React 19, React Three Fiber 9, Three.js e GSAP), compilada com Vite 8. Os estilos principais estão em assets/build (gerados a partir de src/styles).
Version: 1.0.0
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jmbento
*/

/*
 * Apenas o indispensável para o tema continuar utilizável mesmo que a build
 * de produção ainda não tenha sido gerada. O resto vive em src/styles.
 */

.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background: #fff;
	clip-path: none;
	color: #14202f;
	display: block;
	font-size: 1rem;
	height: auto;
	left: 1rem;
	padding: 0.75rem 1rem;
	top: 1rem;
	width: auto;
	z-index: 100000;
}

img,
svg,
video {
	height: auto;
	max-width: 100%;
}

/*
 * Ecrã de carregamento. Vive aqui (e não na build) porque tem de pintar antes de
 * tudo o resto, mesmo em desenvolvimento. Cores: --color-stage e a identidade CMYK.
 */
.preloader {
	display: none;
}

.preloading .preloader {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: grid;
	place-items: center;
	background: #e9ebee;
	transition: opacity 0.45s ease, transform 0.7s cubic-bezier(0.65, 0, 0.35, 1);
}

.preloading body {
	overflow: hidden;
}

.preloader__inner {
	display: grid;
	justify-items: center;
	gap: 1.75rem;
	animation: jmb-preloader-in 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.preloader__logo {
	width: auto;
	height: 5rem;
}

.preloader__bar {
	display: grid;
	grid-template-columns: repeat(4, 3rem);
	gap: 0.4rem;
	width: max-content;
}

.preloader__bar span {
	height: 0.4rem;
	overflow: hidden;
	border-radius: 999px;
	background: rgb(19 27 38 / 0.12);
}

.preloader__bar span::after {
	content: '';
	display: block;
	height: 100%;
	border-radius: inherit;
	background: var(--c, #00a0e3);
	transform: scaleX(clamp(0, calc(var(--p, 0) * 4 - var(--i)), 1));
	transform-origin: left;
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.preloader__bar span:nth-child(1) { --c: #00a0e3; }
.preloader__bar span:nth-child(2) { --c: #e5007e; }
.preloader__bar span:nth-child(3) { --c: #ffd800; }
.preloader__bar span:nth-child(4) { --c: #2b2b2b; }

.preloader.is-leaving {
	opacity: 0;
	transform: translateY(-1.5rem);
	pointer-events: none;
}

@keyframes jmb-preloader-in {
	from {
		opacity: 0;
		transform: translateY(0.75rem);
	}
}

@media (prefers-reduced-motion: reduce) {
	.preloading .preloader {
		transition: opacity 0.2s ease;
	}

	.preloader.is-leaving {
		transform: none;
	}

	.preloader__inner {
		animation: none;
	}

	.preloader__bar span::after {
		transition: none;
	}
}