/**
 * BoraVision design tokens and locally hosted fonts.
 *
 * Purpose:
 * - defines the site-wide design constants: colors, fonts, spacing, radii and timing
 * - exposes shared custom properties used by every other CSS file
 * - maps BoraVision values into Orologio and Elementor runtime variables
 *
 * Edit here when:
 * - the brand palette changes
 * - global spacing feels too loose/tight everywhere
 * - responsive typography or base control sizes need to shift across the whole site
 *
 * Changing a token here has cascading effects across all templates,
 * so prefer this file for intentional system-wide updates.
 */

/* Local font hosting keeps brand typography consistent and avoids remote font drift. */
@font-face {
	font-family: "Barlow Condensed";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/barlow-condensed-normal-400-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Barlow Condensed";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/barlow-condensed-normal-400-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Barlow Condensed";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/barlow-condensed-normal-700-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Barlow Condensed";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/barlow-condensed-normal-700-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Barlow Semi Condensed";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/barlow-semi-condensed-normal-400-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Barlow Semi Condensed";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/barlow-semi-condensed-normal-400-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Barlow Semi Condensed";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/barlow-semi-condensed-normal-500-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Barlow Semi Condensed";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/barlow-semi-condensed-normal-500-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Barlow Semi Condensed";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/barlow-semi-condensed-normal-600-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Barlow Semi Condensed";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/barlow-semi-condensed-normal-600-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Barlow Semi Condensed";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/barlow-semi-condensed-normal-700-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Barlow Semi Condensed";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/barlow-semi-condensed-normal-700-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Barlow Semi Condensed";
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/barlow-semi-condensed-italic-400-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Barlow Semi Condensed";
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/barlow-semi-condensed-italic-400-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Global design tokens consumed by the rest of the CSS architecture. */
:root {
	--bv-color-black: #090a0b;
	--bv-color-white: #ffffff;
	--bv-color-surface: #f7f7f5;
	--bv-color-graphite: #292b2e;
	--bv-color-text: #292b2e;
	--bv-color-text-muted: #666666;
	--bv-color-border: #e8e8e5;
	--bv-color-danger: #d83a42;
	--bv-color-gold: #c9a84c;
	/* Decorative accent (kickers, header bars, underlines). Steel: #6b7079 on light
	   surfaces, #b7bcc4 on dark ones; gold stays for premium editions only. */
	--bv-color-decor: #6b7079; /* Steel */
	--bv-color-focus: #090a0b;
	--bv-color-overlay: rgb(9 10 11 / 72%);
	--bv-interaction-color: var(--bv-color-text);
	--bv-interaction-hover: var(--bv-color-black);
	--bv-interaction-focus: var(--bv-color-black);
	--bv-interaction-border: var(--bv-color-border);
	--bv-interaction-surface: var(--bv-color-surface);
	--bv-interaction-strong: var(--bv-color-black);
	--bv-interaction-strong-hover: var(--bv-color-graphite);
	--bv-interaction-on-strong: var(--bv-color-white);

	--bv-font-heading: "Barlow Condensed", Arial Narrow, sans-serif;
	--bv-font-body: "Barlow Semi Condensed", Arial, sans-serif;
	--bv-font-ui: "Barlow Semi Condensed", Arial, sans-serif;

	--bv-font-size-xs: 12px;
	--bv-font-size-sm: 14px;
	--bv-font-size-body: 16px;
	--bv-font-size-lg: 18px;
	--bv-font-size-h6: 16px;
	--bv-font-size-h5: 24px;
	--bv-font-size-h4: 32px;
	--bv-font-size-h3: 42px;
	--bv-font-size-h2: 56px;
	--bv-font-size-h1: 72px;
	--bv-line-body: 1.65;
	--bv-line-heading: 1.08;

	--bv-space-1: 4px;
	--bv-space-2: 8px;
	--bv-space-3: 12px;
	--bv-space-4: 16px;
	--bv-space-5: 20px;
	--bv-space-6: 24px;
	--bv-space-7: 28px;
	--bv-space-8: 32px;
	--bv-space-9: 36px;
	--bv-space-10: 40px;
	--bv-space-12: 48px;
	--bv-space-14: 56px;
	--bv-space-16: 64px;
	--bv-space-18: 72px;
	--bv-space-20: 80px;
	--bv-space-24: 96px;
	--bv-space-28: 112px;
	--bv-space-35: 140px;

	--bv-container: 1320px;
	--bv-container-text: 760px;
	--bv-grid-columns: 12;
	--bv-grid-gap: 32px;
	--bv-page-gutter: 32px;
	--bv-section-space: 24px;

	--bv-radius-sm: 4px;
	--bv-radius: 8px;
	--bv-radius-full: 999px;
	--bv-border: 1px solid var(--bv-color-border);
	--bv-shadow-focus: 0 0 0 3px rgb(9 10 11 / 14%);
	--bv-shadow-raised: 0 10px 32px rgb(9 10 11 / 7%);
	--bv-transition-fast: 160ms ease;
	--bv-transition: 240ms ease;

	--bv-control-height: 52px;
	--bv-button-height: 48px;
	--bv-header-height: 88px;
	--bv-breakpoint-mobile: 767px;
	--bv-breakpoint-tablet: 1024px;

	/* Runtime aliases for Orologio and Elementor.
	   These keep the parent theme and builder aligned with BoraVision tokens. */
	--orologio-primary-color: var(--bv-color-black);
	--orologio-secondary-color: var(--bv-color-surface);
	--orologio-accent-color: var(--bv-color-text-muted);
	--orologio-accent-color-1: var(--bv-color-graphite);
	--orologio-accent-color-2: var(--bv-interaction-hover);
	--orologio-body-background-color: var(--bv-color-white);
	--orologio-modules-background-color: var(--bv-color-surface);
	--orologio-container-width: var(--bv-container);
	--e-global-color-primary: var(--bv-color-black);
	--e-global-color-secondary: var(--bv-color-graphite);
	--e-global-color-text: var(--bv-color-text);
	--e-global-color-accent: var(--bv-interaction-hover);
}

/* Tablet downscaling for typography and spacing. */
@media (max-width: 1024px) {
	:root {
		--bv-font-size-h1: 60px;
		--bv-font-size-h2: 48px;
		--bv-font-size-h3: 38px;
		--bv-grid-gap: 24px;
		--bv-page-gutter: 24px;
		--bv-section-space: 48px;
	}
}

@media (max-width: 767px) {
	:root {
		--bv-font-size-h1: 48px;
		--bv-font-size-h2: 40px;
		--bv-font-size-h3: 32px;
		--bv-font-size-h4: 27px;
		--bv-font-size-h5: 22px;
		--bv-grid-gap: 16px;
		--bv-page-gutter: 16px;
		--bv-section-space: 36px;
		--bv-header-height: 72px;
	}
}

/* Dark surfaces flip the decorative accent to white. */
body.boravision :is(.bv-context-dark, .bv-home-concept, .bv-home-join, .bv-home-video, .bv-archive-hero, .bv-product-list-hero, .bv-media-wall__lightbox, .bv-photo-wall__lightbox, .bv-legend-tile, .bv-photo-tile, .bv-media-tile, .bv-footer) {
	--bv-color-decor: #b7bcc4; /* Steel, light */
}

/* The parent theme prints its Customizer fonts (Manrope, Cormorant Garamond)
   as :root variables, but never loads them, so anything that still reads them
   (WooCommerce cart/checkout blocks, default pages) fell back to a serif.
   html:root outranks the parent's inline :root block. */
html:root {
	--orologio-body-typography-font-family: var(--bv-font-body);
	--orologio-buttons-typography-font-family: var(--bv-font-ui);
	--orologio-menu-typography-font-family: var(--bv-font-ui);
	--orologio-submenu-typography-font-family: var(--bv-font-ui);
	--orologio-h1-typography-font-family: var(--bv-font-heading);
	--orologio-h2-typography-font-family: var(--bv-font-heading);
	--orologio-h3-typography-font-family: var(--bv-font-heading);
	--orologio-h4-typography-font-family: var(--bv-font-heading);
	--orologio-h5-typography-font-family: var(--bv-font-heading);
	--orologio-h6-typography-font-family: var(--bv-font-ui);
}
