/**
 * RIZA Design System — Tokens globais
 * Paleta extraída da logomarca oficial RIZA Mobiliário para Escritório.
 *
 * Vermelho ícone:  #ED1C24
 * Grafite texto:  #282828
 * Branco fundo:   #FFFFFF
 */

:root {
	/* ── Cores principais ───────────────────────────────────── */
	--riza-color-red:          #ED1C24;
	--riza-color-red-hover:    #C9181E;
	--riza-color-red-dark:     #A81418;
	--riza-color-red-subtle:   rgba(237, 28, 36, 0.08);
	--riza-color-red-border:   rgba(237, 28, 36, 0.2);
	--riza-color-red-notice:   rgba(237, 28, 36, 0.12);

	--riza-color-graphite:     #282828;
	--riza-color-graphite-light: #3D3D3D;
	--riza-color-white:        #FFFFFF;

	/* ── Cores de apoio ─────────────────────────────────────── */
	--riza-color-gray-light:   #F7F7F7;
	--riza-color-gray-border:  #E0E0E0;
	--riza-color-gray-muted:   #6B6B6B;
	--riza-color-gray-dark:    #4A4A4A;
	--riza-color-success:      #1f6b1f;
	--riza-color-success-subtle: rgba(34, 139, 34, 0.12);
	--riza-color-on-dark-muted: rgba(255, 255, 255, 0.72);
	--riza-color-on-dark-soft:  rgba(255, 255, 255, 0.78);
	--riza-color-on-dark-subtle: rgba(255, 255, 255, 0.35);
	--riza-internal-hero-overlay: rgba(40, 40, 40, 0.82);
	--riza-overlay-backdrop:   rgba(0, 0, 0, 0.45);

	/* ── Aliases semânticos ───────────────────────────────────── */
	--riza-color-primary:      var(--riza-color-red);
	--riza-color-primary-hover: var(--riza-color-red-hover);
	--riza-color-link:         var(--riza-color-red-dark);
	--riza-color-link-hover:   var(--riza-color-red-hover);
	--riza-color-text:         var(--riza-color-graphite);
	--riza-color-text-muted:   var(--riza-color-gray-muted);
	--riza-color-bg:           var(--riza-color-white);
	--riza-color-bg-alt:       var(--riza-color-gray-light);
	--riza-color-border:       var(--riza-color-gray-border);

	/* ── Header ─────────────────────────────────────────────── */
	--riza-header-bg:          var(--riza-color-white);
	--riza-header-text:        var(--riza-color-graphite);
	--riza-header-border:      var(--riza-color-gray-border);
	--riza-header-bg-dark:     var(--riza-color-graphite);
	--riza-header-text-dark:   var(--riza-color-white);
	--riza-header-height:      80px;
	--riza-header-height-sticky: 68px;
	--riza-header-over-hero-gradient: linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0.4) 0%,
		transparent 100%
	);

	/* ── Hero ───────────────────────────────────────────────── */
	--riza-hero-min-height:    100dvh;
	--riza-hero-overlay:       rgba(0, 0, 0, 0.7);
	--riza-hero-content-max:   48rem;

	/* ── Home — ritmo vertical ──────────────────────────────── */
	--riza-home-section-padding: 3.75rem; /* 60px mobile */
	--riza-home-section-header-gap: clamp(3rem, 5vw, 3.5rem); /* 48–56px título → cards */
	--riza-home-about-eyebrow-gap: 1.25rem;   /* 20px */
	--riza-home-about-title-gap: 2rem;        /* 32px */
	--riza-home-about-text-gap: 1.25rem;    /* 20px entre parágrafos */
	--riza-home-about-cta-gap: 3.25rem;       /* 52px botão → stats */
	--riza-home-about-columns-gap: clamp(3.5rem, 5vw, 4.5rem); /* 56–72px desktop */

	/* ── Footer ─────────────────────────────────────────────── */
	--riza-footer-bg:          #17191c;
	--riza-footer-text:        var(--riza-color-white);
	--riza-footer-text-muted:  rgba(255, 255, 255, 0.7);
	--riza-footer-accent:      var(--riza-color-red);
	--riza-footer-link-hover:  var(--riza-color-red);

	/* ── Tipografia ─────────────────────────────────────────── */
	--riza-font-heading:       'Montserrat', 'Manrope', sans-serif;
	--riza-font-body:          'Inter', 'DM Sans', sans-serif;

	--riza-font-size-xs:       0.8125rem;   /* 13px */
	--riza-font-size-sm:       0.875rem;    /* 14px */
	--riza-font-size-base:     1rem;        /* 16px */
	--riza-font-size-md:       1.125rem;    /* 18px */
	--riza-font-size-lg:       1.25rem;     /* 20px */
	--riza-font-size-xl:       1.5rem;      /* 24px */
	--riza-font-size-2xl:      2rem;        /* 32px */
	--riza-font-size-3xl:      2.5rem;      /* 40px */
	--riza-font-size-4xl:      3rem;        /* 48px */

	--riza-font-weight-regular: 400;
	--riza-font-weight-medium:  500;
	--riza-font-weight-semibold: 600;
	--riza-font-weight-bold:    700;

	--riza-line-height-tight:   1.2;
	--riza-line-height-base:    1.6;
	--riza-line-height-loose:   1.8;

	--riza-letter-spacing-tight:  -0.02em;
	--riza-letter-spacing-wide:    0.04em;
	--riza-letter-spacing-wider:   0.08em;

	/* ── Espaçamento ──────────────────────────────────────────── */
	--riza-space-xs:   0.25rem;
	--riza-space-sm:   0.5rem;
	--riza-space-md:   1rem;
	--riza-space-lg:   1.5rem;
	--riza-space-xl:   2rem;
	--riza-space-2xl:  3rem;
	--riza-space-3xl:  4rem;
	--riza-space-4xl:  6rem;

	/* ── Layout ───────────────────────────────────────────────── */
	--riza-container-width:    1280px;
	--riza-container-narrow:   960px;
	--riza-container-padding:  1.5rem;

	/* ── Border radius ────────────────────────────────────────── */
	--riza-radius-sm:   4px;
	--riza-radius-md:   6px;
	--riza-radius-lg:   8px;
	--riza-radius-xl:   12px;
	--riza-radius-pill: 999px;

	/* ── Sombras ──────────────────────────────────────────────── */
	--riza-shadow-sm:  0 1px 3px rgba(40, 40, 40, 0.08);
	--riza-shadow-md:  0 4px 16px rgba(40, 40, 40, 0.10);
	--riza-shadow-lg:  0 8px 32px rgba(40, 40, 40, 0.12);
	--riza-shadow-header: 0 2px 12px rgba(40, 40, 40, 0.08);

	/* ── Transições ───────────────────────────────────────────── */
	--riza-transition-fast:  0.15s ease;
	--riza-transition:       0.25s ease;
	--riza-transition-slow:  0.4s ease;

	/* ── Botões ───────────────────────────────────────────────── */
	--riza-btn-padding-y:      0.875rem;
	--riza-btn-padding-x:      1.75rem;
	--riza-btn-padding-y-sm:   0.625rem;
	--riza-btn-padding-x-sm:   1.25rem;
	--riza-btn-font-size:      var(--riza-font-size-sm);
	--riza-btn-font-weight:    var(--riza-font-weight-semibold);
	--riza-btn-radius:         var(--riza-radius-md);

	/* ── Cards ────────────────────────────────────────────────── */
	--riza-card-bg:            var(--riza-color-white);
	--riza-card-border:        var(--riza-color-gray-border);
	--riza-card-radius:        var(--riza-radius-lg);
	--riza-card-shadow:        var(--riza-shadow-sm);
	--riza-card-shadow-hover:  var(--riza-shadow-md);

	/* ── Home — superfície grafite (Contato e seções escuras da Home) ─ */
	--riza-home-graphite-surface: linear-gradient(
		135deg,
		var(--riza-color-graphite-light) 0%,
		var(--riza-color-graphite) 50%,
		#1a1a1a 100%
	);
	--riza-home-graphite-surface-accent: linear-gradient(
		135deg,
		var(--riza-color-graphite-light) 0%,
		var(--riza-color-graphite) 45%,
		#17191c 100%
	);
	--riza-home-graphite-text-muted: rgba(255, 255, 255, 0.72);
	--riza-home-graphite-grain-opacity: 0.28;

	/* ── Formulários ──────────────────────────────────────────── */
	--riza-input-border:       var(--riza-color-gray-border);
	--riza-input-border-focus: var(--riza-color-red);
	--riza-input-radius:       var(--riza-radius-md);
	--riza-input-padding:      0.75rem 1rem;

	/* ── Acessibilidade ───────────────────────────────────────── */
	--riza-focus-ring:         0 0 0 3px var(--riza-color-red-subtle);
	--riza-focus-outline:      2px solid var(--riza-color-red);

	/* ── Z-index ──────────────────────────────────────────────── */
	--riza-z-header:     100;
	--riza-z-sticky:     200;
	--riza-z-overlay:    300;
	--riza-z-whatsapp:   400;
	--riza-z-modal:      500;
}

@media (min-width: 768px) {
	:root {
		--riza-home-section-padding: 5rem; /* 80px tablet */
	}
}

@media (min-width: 1024px) {
	:root {
		--riza-home-section-padding: 6.25rem; /* 100px desktop */
	}
}