/*
Theme Name: مقاولات ودهانات الرياض
Theme URI: https://mokwlat.com/
Author: Mokawlat Riyadh
Author URI: https://mokwlat.com/
Description: قالب ووردبريس احترافي لموقع مقاولات ودهانات الرياض، يوفر تصميماً عصرياً متجاوباً بالكامل مع دعم RTL، وإنشاء تلقائي لكافة صفحات الموقع ومعارض الأعمال عند تفعيل القالب.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mokwlat
Tags: construction, contracting, paints, epoxy, interior-design, rtl-language-support, custom-menu, featured-images, full-width-template, theme-options

--------------------------------------------------------------
>>> TABLE OF CONTENTS:
1. Variables & Global Styles
2. Typography & Fonts
3. Reset & Base Elements
4. Layout & Grid System
5. Header & Navigation
6. Hero Slider
7. Sections & Cards
8. Services & Blurps
9. Gallery & Lightbox
10. Buttons & CTAs
11. Contact Forms & Info
12. Footer & SEO Links
13. Floating Action Buttons
14. Responsive Media Queries
--------------------------------------------------------------
*/

:root {
  --primary-color: #5c0500;
  --primary-dark: #400300;
  --primary-light: #7a0700;
  --accent-color: #f7a600;
  --accent-hover: #e09400;
  --text-main: #2b2b2b;
  --text-muted: #666666;
  --text-light: #888888;
  --bg-light: #f9f9f9;
  --bg-dark: #1f1f1f;
  --bg-footer: #151515;
  --white: #ffffff;
  --black: #000000;
  --border-color: #e5e5e5;
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 5px 20px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 12px 35px rgba(0, 0, 0, 0.12);
  --transition: all 0.3s ease-in-out;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --container-max: 1200px;
}

/* RTL & Box Sizing */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
  direction: rtl;
  text-align: right;
}

body {
  font-family: 'Cairo', 'Tajawal', sans-serif;
  color: var(--text-main);
  background-color: var(--white);
  line-height: 1.8;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: inherit;
  text-decoration: none;
  transition: var(--transition);
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

ul, ol {
  list-style: none;
}

button, input, textarea, select {
  font-family: inherit;
}

.container {
  width: 100%;
  max-width: var(--container-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.container-fluid {
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
}