/*
Theme Name: NTPC
Theme URI: https://ntpc-plomberie.fr
Author: NTPC
Description: Thème natif Gutenberg de NTPC Plomberie-Chauffage.
Version: 0.8.0
Requires at least: 6.5
Requires PHP: 8.1
Text Domain: ntpc
*/

:root {
	--ntpc-color-ink: #131313;
	--ntpc-color-surface: #181716;
	--ntpc-color-text: #ffffff;
	--ntpc-color-muted: #b9b8b5;
	--ntpc-color-gold: #bb8d35;
	--ntpc-color-gold-dark: #ad7b26;
	--ntpc-color-gold-light: #e5c366;
	--ntpc-color-navy: #2c2e4c;
	--ntpc-color-light: #f0f0f0;
	--ntpc-color-border: #c1d1ea;
	--ntpc-color-glass: rgba(19, 19, 19, 0.94);
	--ntpc-color-glass-border: rgba(255, 255, 255, 0.2);
	--ntpc-gradient-gold: linear-gradient(135deg, #ad7b26 0%, #e5c366 52%, #bb8d35 100%);
	--ntpc-font-body: "Roboto Condensed", "Arial Narrow", Arial, sans-serif;
	--ntpc-font-display: Montserrat, Arial, sans-serif;
	--ntpc-radius-sm: 0.75rem;
	--ntpc-radius-md: 1.25rem;
	--ntpc-radius-lg: 2rem;
	--ntpc-shadow-gold: 0 0 2rem rgba(229, 195, 102, 0.28);
	--ntpc-motion-fast: 160ms;
	--ntpc-motion-base: 260ms;
	--ntpc-motion-slow: 520ms;
	--ntpc-ease-standard: cubic-bezier(0.2, 0, 0, 1);
	--ntpc-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--ntpc-layout-gutter: clamp(1rem, 4vw, 4.5rem);
	--ntpc-header-height: 4.75rem;
}

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

html {
	background: var(--ntpc-color-ink);
	color-scheme: dark;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--ntpc-header-height) + 1rem);
}

body {
	margin: 0;
	background: var(--ntpc-color-ink);
	color: var(--ntpc-color-text);
	font-family: var(--ntpc-font-body);
}

body.ntpc-menu-is-open {
	overflow: hidden;
	overscroll-behavior: none;
}

a {
	color: inherit;
}

img {
	display: block;
	max-width: 100%;
	height: auto;
}

::selection {
	background: var(--ntpc-color-gold-light);
	color: var(--ntpc-color-ink);
}

@view-transition {
	navigation: auto;
}

html.ntpc-save-data::view-transition-old(root),
html.ntpc-save-data::view-transition-new(root) {
	animation: none;
}

:where(a, button):focus-visible {
	outline: 0.16rem solid var(--ntpc-color-gold-light);
	outline-offset: 0.25rem;
}

.ntpc-visually-hidden {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.ntpc-skip-link {
	position: fixed;
	z-index: 999;
	top: 0.75rem;
	left: 0.75rem;
	padding: 0.7rem 1rem;
	color: var(--ntpc-color-ink);
	font-weight: 700;
	text-decoration: none;
	background: var(--ntpc-color-gold-light);
	border-radius: 999px;
	transform: translateY(-200%);
}

.ntpc-skip-link:focus {
	transform: translateY(0);
}

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

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}

	::view-transition-old(root),
	::view-transition-new(root) {
		animation: none;
	}
}

@media (prefers-reduced-motion: no-preference) {
	::view-transition-old(root) {
		animation: ntpc-page-exit 320ms cubic-bezier(0.4, 0, 1, 1) both;
	}

	::view-transition-new(root) {
		animation: ntpc-page-enter 460ms cubic-bezier(0.16, 1, 0.3, 1) both;
	}

	@keyframes ntpc-page-exit {
		to {
			opacity: 0.38;
			transform: translate3d(0, -1.25rem, 0) scale(0.995);
		}
	}

	@keyframes ntpc-page-enter {
		from {
			opacity: 0.25;
			transform: translate3d(0, 1.4rem, 0) scale(1.006);
		}
	}
}
