/* ==========================================================================
   Yvaz — Estilos globais (todas as páginas: tokens, fontes, navbar, footer)
   O CSS específico da home (Hero + Sobre) vive em assets/css/home.css.
   Fonte: Figma "Yvaz" (Desktop/Tablet/Mobile + Componentes + Design System).
   Ver README-yvaz.md na raiz do tema para o mapeamento completo Figma → tema
   e o que é adaptação própria (não confirmada por um frame real do Figma).
   ========================================================================== */

/* ---- Fontes (Luxe Uno, arquivos em assets/fonts/luxeuno) ---- */

@font-face {
	font-family: 'Luxe Uno';
	src: url('../fonts/luxeuno/LuxeUno-UltraLight.otf') format('opentype');
	font-weight: 200;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Luxe Uno';
	src: url('../fonts/luxeuno/LuxeUno-Light.otf') format('opentype');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Luxe Uno';
	src: url('../fonts/luxeuno/LuxeUno-Regular.otf') format('opentype');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Luxe Uno';
	src: url('../fonts/luxeuno/LuxeUno-SemiBold.otf') format('opentype');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Luxe Uno';
	src: url('../fonts/luxeuno/LuxeUno-Bold.otf') format('opentype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* ---- Tokens (Design System do Figma, node 18:200) ---- */

:root {
	/* Cor */
	--yvaz-color-white: #ffffff;
	--yvaz-color-dark-900: #31302e;
	--yvaz-color-dark-800: #3d3d3d;
	--yvaz-color-beige-300: #d6cec0;
	--yvaz-color-beige-400: #d7cfbe;
	--yvaz-color-border-light: #e5e5dc;

	--yvaz-color-bg-primary: var(--yvaz-color-white);
	--yvaz-color-bg-footer: var(--yvaz-color-dark-800);
	--yvaz-color-text-on-dark: var(--yvaz-color-white);
	--yvaz-color-text-on-light: var(--yvaz-color-dark-900);
	--yvaz-color-text-muted: var(--yvaz-color-beige-300);
	--yvaz-color-text-accent: var(--yvaz-color-beige-400);

	/* Espaçamento */
	--yvaz-space-2: 2px;
	--yvaz-space-4: 4px;
	--yvaz-space-8: 8px;
	--yvaz-space-12: 12px;
	--yvaz-space-16: 16px;
	--yvaz-space-24: 24px;
	--yvaz-space-32: 32px;
	--yvaz-space-40: 40px;
	--yvaz-space-48: 48px;
	--yvaz-space-56: 56px;
	--yvaz-space-64: 64px;
	--yvaz-space-72: 72px;
	--yvaz-space-96: 96px;
	--yvaz-space-120: 120px;

	/* Raio e borda */
	--yvaz-radius-small: 4px;
	--yvaz-radius-full: 999px;
	--yvaz-border-thin: 1px;
	--yvaz-border-regular: 1.5px;

	/* Tipografia */
	--yvaz-font-family: 'Luxe Uno', 'Times New Roman', serif;
	--yvaz-font-size-hero: 28px;
	--yvaz-font-size-display: 32px;
	--yvaz-font-size-body-large: 20px;
	--yvaz-font-size-body-medium: 18px;
	--yvaz-font-size-body-small: 16px;
	--yvaz-font-size-caption: 14px;
}

/* ---- Reset mínimo (escopado às seções globais) ---- */

.yvaz-navbar,
.yvaz-footer {
	box-sizing: border-box;
}

.yvaz-navbar *,
.yvaz-footer * {
	box-sizing: border-box;
}

.yvaz-footer p {
	margin: 0;
	font-family: var(--yvaz-font-family);
}

/* ==========================================================================
   Navbar
   ========================================================================== */

.yvaz-navbar {
	background: var(--yvaz-color-bg-primary);
	padding: var(--yvaz-space-24);
}

.yvaz-navbar__inner {
	display: flex;
	align-items: center;
}

.yvaz-navbar__logo {
	display: inline-flex;
	width: 160px;
	height: 34px;
}

.yvaz-navbar__logo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

@media (min-width: 768px) {
	.yvaz-navbar {
		padding: var(--yvaz-space-24) var(--yvaz-space-48);
	}
}

@media (min-width: 1280px) {
	.yvaz-navbar {
		padding: var(--yvaz-space-24) var(--yvaz-space-120);
	}
}

/* ==========================================================================
   Footer
   ========================================================================== */

.yvaz-footer {
	background: var(--yvaz-color-bg-footer);
	padding: 0 var(--yvaz-space-24) var(--yvaz-space-48);
}

.yvaz-footer__inner {
	max-width: 1600px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: var(--yvaz-space-40);
}

.yvaz-footer__divider {
	height: 1px;
	background: var(--yvaz-color-text-accent);
	opacity: 0.3;
}

.yvaz-footer__contact {
	display: flex;
	flex-direction: column;
	gap: var(--yvaz-space-24);
}

/* :link/:visited explícitos: sem isso, o estilo padrão do navegador pra link
   já clicado (specificity 0,1,1) vence a cor de uma classe sozinha
   (0,1,0) e o texto fica com a cor escura de "link visitado". */
.yvaz-footer__social,
.yvaz-footer__social:link,
.yvaz-footer__social:visited {
	display: inline-flex;
	align-items: center;
	gap: var(--yvaz-space-8);
	font-size: var(--yvaz-font-size-body-large);
	letter-spacing: 2px;
	line-height: 1.6;
	color: var(--yvaz-color-text-muted);
	text-decoration: none;
	transition: opacity 0.2s ease;
}

.yvaz-footer__social:hover,
.yvaz-footer__social:focus {
	opacity: 0.7;
}

.yvaz-footer__social-icon {
	width: 24px;
	height: 24px;
}

.yvaz-icon-instagram {
	position: relative;
	display: inline-block;
	width: 24px;
	height: 24px;
	flex-shrink: 0;
}

.yvaz-icon-instagram__outline {
	position: absolute;
	inset: 1px;
	border: var(--yvaz-border-regular) solid var(--yvaz-color-border-light);
	border-radius: var(--yvaz-radius-small);
}

.yvaz-icon-instagram__lens {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 9px;
	height: 9px;
	transform: translate(-50%, -50%);
}

.yvaz-icon-instagram__flash {
	position: absolute;
	top: calc(50% - 6.25px);
	left: calc(50% + 6.25px);
	width: 2.5px;
	height: 2.5px;
}

.yvaz-footer__addresses {
	display: flex;
	flex-direction: column;
	gap: var(--yvaz-space-32);
}

.yvaz-footer__address,
.yvaz-footer__address:link,
.yvaz-footer__address:visited {
	display: block;
	color: inherit;
	text-decoration: none;
}

.yvaz-footer__address:hover .yvaz-footer__address-title,
.yvaz-footer__address:hover .yvaz-footer__address-line {
	text-decoration: underline;
}

.yvaz-footer__address-title {
	font-weight: 600;
	font-size: var(--yvaz-font-size-body-small);
	letter-spacing: 1.6px;
	line-height: 1.6;
	color: var(--yvaz-color-text-muted);
	margin-bottom: 4px;
}

.yvaz-footer__address-line {
	font-weight: 400;
	font-size: var(--yvaz-font-size-body-small);
	letter-spacing: 0.32px;
	line-height: 1.6;
	color: var(--yvaz-color-text-accent);
}

.yvaz-footer__credit {
	display: flex;
	flex-direction: column;
	gap: var(--yvaz-space-24);
	text-align: center;
}

.yvaz-footer__credit p {
	font-size: var(--yvaz-font-size-caption);
	letter-spacing: 1.4px;
	line-height: 1.6;
	color: var(--yvaz-color-text-accent);
}

@media (min-width: 768px) {
	.yvaz-footer {
		padding: 0 var(--yvaz-space-56) var(--yvaz-space-48);
	}

	.yvaz-footer__contact {
		flex-direction: row;
		align-items: center;
		justify-content: center;
		gap: var(--yvaz-space-32);
	}

	.yvaz-footer__addresses {
		flex-direction: row;
		flex-wrap: wrap;
		gap: var(--yvaz-space-32);
	}

	.yvaz-footer__address {
		flex: 1 1 220px;
	}
}

@media (min-width: 1280px) {
	.yvaz-footer {
		padding: 0 var(--yvaz-space-120) var(--yvaz-space-32);
	}

	.yvaz-footer__inner {
		gap: var(--yvaz-space-48);
	}

	.yvaz-footer__addresses {
		flex-wrap: nowrap;
	}
}