/*
 Theme Name:   LFX (Bricks Child)
 Description:  Child theme for Bricks, LFX pools and outdoor architecture. Self-hosted font, design tokens, base styles.
 Author:       Jaouhara
 Template:     bricks
 Version:      1.0
 Text Domain:  bricks
*/

/* ---------- Font (self-hosted, variable weight + width) ---------- */
@font-face {
	font-family: 'Archivo';
	font-style: normal;
	font-weight: 100 900;
	font-stretch: 62% 125%;
	font-display: swap;
	src: url('fonts/archivo-latin.woff2') format('woff2');
}

/* ---------- Design tokens ---------- */
:root {
	--ink: #16262D;
	--ink-2: #0C1418;
	--text: #1B2226;
	--muted: #4E5A5E;
	--stone: #E7E9E4;
	--stone-2: #DADDD7;
	--line: #C3C9C6;
	--white: #F3F4F1;
	--blue: #2F86CC;
	--blue-ink: #1F6AA8;
	--sky: #9CCBF0;
	--mist: #B9C2C4;

	--font: 'Archivo', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	--gutter: clamp(20px, 5vw, 72px);
	--max: 1320px;
	--ease: cubic-bezier(.2, .7, .1, 1);
}

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--stone);
	color: var(--text);
	font-family: var(--font);
	font-size: 17px;
	line-height: 1.7;
	font-variation-settings: 'wdth' 100;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
*, *::before, *::after { box-sizing: border-box; }
img, video { display: block; max-width: 100%; height: auto; }
h1, h2, h3, h4 { font-family: var(--font); color: var(--ink); margin: 0; }
p { margin: 0; }
a { color: var(--ink); }
a:hover { color: var(--blue-ink); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, summary:focus-visible {
	outline: 2px solid var(--blue);
	outline-offset: 4px;
}
::selection { background: var(--sky); color: var(--ink); }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}