/*
Theme Name: LUMA Child
Theme URI: https://luma-home.ae/
Description: Bilingual (English / Arabic) single-page landing theme for LUMA — Modern Home Essentials, Dubai. A hand-built Hello Elementor child theme: custom PHP templates, a lightweight in-theme translation layer, full RTL/LTR support via CSS logical properties, and vanilla JavaScript only. No page builder, no multilingual plugin, no WooCommerce.
Author: LUMA
Author URI: https://luma-home.ae/
Template: hello-elementor
Version: 1.0.2
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: luma-child
Tags: one-column, custom-colors, custom-menu, rtl-language-support, translation-ready, accessibility-ready
*/

/* -------------------------------------------------------------------------
 * This file is the design-token layer only. It is enqueued first, ahead of
 * assets/css/{base,components,sections,responsive}.css, so every later
 * sheet can rely on these custom properties.
 * ---------------------------------------------------------------------- */

:root {
	/* --- Palette, sampled from the LUMA logo -------------------------- */
	--color-primary: #b08d63;        /* brass / sand from the logo mark   */
	--color-primary-strong: #8a6a42; /* accessible text weight of above   */
	--color-primary-soft: #dcc4a4;
	--color-primary-tint: #f0e6d8;

	--color-dark: #2a343c;           /* slate from the logo wordmark      */
	--color-dark-deep: #1e262c;
	--color-dark-soft: #47535d;

	--color-background: #faf7f2;
	--color-surface: #f4eee5;
	--color-surface-alt: #ede5d9;

	--color-text: #23292f;
	--color-muted: #6a707a;
	--color-border: #e4dbcd;
	--color-border-strong: #d3c7b4;

	--color-on-dark: #eee9e1;
	--color-on-dark-muted: #a9b0b7;
	--color-on-dark-border: #3a444d;

	--color-danger: #a3402f;
	--color-success: #3f6b4f;

	/* --- Type -------------------------------------------------------- */
	--font-display: ui-serif, "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
	--font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--font-arabic: "Noto Naskh Arabic", "Al Bayan", "Geeza Pro", "Segoe UI", Tahoma, Arial, sans-serif;

	--step--2: clamp(0.688rem, 0.67rem + 0.09vw, 0.75rem);
	--step--1: clamp(0.813rem, 0.79rem + 0.11vw, 0.875rem);
	--step-0: clamp(0.938rem, 0.91rem + 0.14vw, 1.031rem);
	--step-1: clamp(1.063rem, 1.01rem + 0.26vw, 1.25rem);
	--step-2: clamp(1.25rem, 1.16rem + 0.45vw, 1.563rem);
	--step-3: clamp(1.5rem, 1.34rem + 0.8vw, 2.063rem);
	--step-4: clamp(1.875rem, 1.55rem + 1.6vw, 2.938rem);
	--step-5: clamp(2.25rem, 1.65rem + 3vw, 4.25rem);

	--tracking-label: 0.16em;
	--leading-tight: 1.1;
	--leading-snug: 1.32;
	--leading-body: 1.68;

	/* --- Space & layout ---------------------------------------------- */
	--space-3xs: 0.25rem;
	--space-2xs: 0.5rem;
	--space-xs: 0.75rem;
	--space-s: 1rem;
	--space-m: 1.5rem;
	--space-l: 2rem;
	--space-xl: 3rem;
	--space-2xl: clamp(3rem, 6vw, 5rem);
	--space-3xl: clamp(3.5rem, 7.5vw, 6.5rem);

	/* --- Container -----------------------------------------------------
	 * Sections are always full-bleed; only the inner .luma-container is
	 * capped, so backgrounds reach both viewport edges while text keeps a
	 * readable measure. One cap at every breakpoint, deliberately.
	 */
	--container-max: 80rem;                        /* 1280px */
	--container-pad: clamp(1rem, 4vw, 3.5rem);     /* the 16px minimum, grown */

	/* Compatibility aliases for the pre-container token names. Nothing in the
	   theme uses them any more; they are kept so custom CSS written against
	   the old names keeps resolving. */
	--wrap: var(--container-max);
	--gutter: var(--container-pad);
	--measure: 62ch;
	--wrap-narrow: 56rem;

	--radius-xs: 2px;
	--radius-s: 4px;
	--radius-m: 8px;
	--radius-pill: 999px;

	--header-h: 5.25rem;
	--logo-h: 3.875rem;

	/* --- Motion & elevation ------------------------------------------ */
	--ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--dur-fast: 140ms;
	--dur: 240ms;
	--dur-slow: 460ms;

	--shadow-s: 0 1px 2px rgba(35, 41, 47, 0.04), 0 6px 16px -12px rgba(35, 41, 47, 0.16);
	--shadow-m: 0 2px 4px rgba(35, 41, 47, 0.04), 0 18px 40px -28px rgba(35, 41, 47, 0.24);
}
