/*
Theme Name: La del Barrio
Theme URI: https://ladelbarrio.com/
Description: Tema hijo de Blocksy para La del Barrio.
Author: La del Barrio
Template: blocksy
Version: 0.6.0
Text Domain: la-del-barrio
*/

@font-face {
	font-family: "Anton";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("assets/fonts/anton-regular.woff2") format("woff2");
}

@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("assets/fonts/inter-latin.woff2") format("woff2");
}

:root {
	--ldb-black: #111111;
	--ldb-pink: #ff2d8e;
	--ldb-yellow: #ffd400;
	--ldb-cream: #fff7e8;
	--ldb-text: var(--ldb-black);
	--ldb-muted: #655d54;
	--ldb-border: var(--ldb-black);
	--ldb-surface: var(--ldb-cream);
	--ldb-success: #111111;
	--ldb-error: #b42318;
	--ldb-on-dark-muted: #fff7e8;

	--ldb-font-display: "Anton", Impact, "Arial Narrow", sans-serif;
	--ldb-font-functional: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--ldb-text-xs: 0.75rem;
	--ldb-text-sm: 0.875rem;
	--ldb-text-base: 1rem;
	--ldb-text-lg: clamp(1.125rem, 1rem + 0.35vw, 1.35rem);
	--ldb-text-xl: clamp(1.6rem, 1.15rem + 1.8vw, 3rem);
	--ldb-text-hero: clamp(3.25rem, 10vw, 8.75rem);
	--ldb-leading-tight: 0.88;
	--ldb-leading-base: 1.55;

	--ldb-space-2xs: 0.25rem;
	--ldb-space-xs: 0.5rem;
	--ldb-space-sm: 0.75rem;
	--ldb-space-md: 1rem;
	--ldb-space-lg: 1.5rem;
	--ldb-space-xl: 2rem;
	--ldb-space-2xl: clamp(3rem, 7vw, 6rem);
	--ldb-space-3xl: clamp(4.5rem, 10vw, 9rem);

	--ldb-border-thin: 2px;
	--ldb-border-bold: 4px;
	--ldb-radius-sm: 0.25rem;
	--ldb-radius-md: 0.45rem;
	--ldb-radius-pill: 999px;
	--ldb-shadow-hard: 7px 7px 0 var(--ldb-black);
	--ldb-shadow-soft: 0 18px 50px rgb(17 17 17 / 14%);
	--ldb-z-header: 50;
	--ldb-z-sticker: 10;
	--ldb-container: 1240px;
	--ldb-container-narrow: 820px;

	/* Neutraliza la paleta de interfaz heredada de Blocksy. */
	--theme-palette-color-1: var(--ldb-pink);
	--theme-palette-color-2: var(--ldb-yellow);
	--theme-palette-color-3: var(--ldb-black);
	--theme-palette-color-4: var(--ldb-black);
	--theme-palette-color-5: var(--ldb-muted);
	--theme-palette-color-6: var(--ldb-cream);
	--theme-palette-color-7: var(--ldb-cream);
	--theme-palette-color-8: var(--ldb-cream);
	--theme-link-initial-color: var(--ldb-black);
	--theme-link-hover-color: var(--ldb-pink);
}

html {
	scroll-behavior: smooth;
}

body {
	font-family: var(--ldb-font-functional);
	color: var(--ldb-text);
	background: var(--ldb-cream);
	--theme-palette-color-1: var(--ldb-pink);
	--theme-palette-color-2: var(--ldb-yellow);
	--theme-palette-color-3: var(--ldb-black);
	--theme-palette-color-4: var(--ldb-black);
	--theme-palette-color-5: var(--ldb-muted);
	--theme-palette-color-6: var(--ldb-cream);
	--theme-palette-color-7: var(--ldb-cream);
	--theme-palette-color-8: var(--ldb-cream);
	--theme-text-color: var(--ldb-black);
	--theme-headings-color: var(--ldb-black);
	--theme-link-initial-color: var(--ldb-black);
	--theme-link-hover-color: var(--ldb-pink);
	--theme-button-background-initial-color: var(--ldb-black);
	--theme-button-background-hover-color: var(--ldb-pink);
	--theme-button-text-initial-color: var(--ldb-cream);
	--theme-button-text-hover-color: var(--ldb-black);
	--theme-form-field-border-initial-color: var(--ldb-black);
	--theme-form-field-border-focus-color: var(--ldb-pink);
	--theme-form-selection-field-initial-color: var(--ldb-black);
	--theme-form-selection-field-active-color: var(--ldb-pink);
	--theme-selection-background-color: var(--ldb-pink);
	--theme-selection-text-color: var(--ldb-black);
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
input,
select,
textarea {
	color: var(--ldb-black);
}

input::placeholder,
textarea::placeholder {
	color: var(--ldb-muted);
	opacity: 1;
}

a {
	color: var(--ldb-black);
}

a:hover {
	color: var(--ldb-pink);
}

:focus-visible {
	outline: 4px solid var(--ldb-pink);
	outline-offset: 4px;
}

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

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