/*
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child
Author: Alireza Mohammadshah
Template: hello-elementor
Version: 3.1.0
Text Domain: hello-elementor-child
*/


/* =========================
   DESIGN SYSTEM
========================= */

:root {

    /* Brand */
    --primary: #0F2747;
    --primary-hover: #1A3D6B;

    --accent: #F4C542;
    --accent-light: #FFF5D6;

    /* Text */
    --heading: #0F2747;
    --haeding-light:#fff;
    --text: #374151;
    --text-light: #6B7280;

    /* Backgrounds */
    --bg: #FFFFFF;
    --bg-light: #F8FAFC;
    --bg-dark: #0F2747;

    /* Borders */
    --border: #E5E7EB;

    /* Status */
    --success: #16A34A;
    --warning: #F59E0B;
    --error: #DC2626;
    --info: #2563EB;
}


/* =========================
   FONT
========================= */

@font-face {
    font-family: 'IRANYekanXVF';
    src:
        url('fonts/IRANYekanX/woff/IRANYekanXVF.woff') format('woff-variations'),
        url('fonts/IRANYekanX/woff/IRANYekanXVF.woff') format('woff');
    font-weight: 100 1000;
    font-display: swap;
}


/* =========================
   GLOBAL TYPOGRAPHY
========================= */

html,
body,
button,
input,
select,
textarea,
a,
span,
div,
p,
li,
td,
th,
label,
blockquote,
h1,
h2,
h3,
h4,
h5,
h6,
.elementor-widget-container,
.elementor-heading-title {
    font-family: 'IRANYekanXVF', sans-serif;
}

body {
    color: var(--text);
    background: var(--bg);
    font-feature-settings: "ss02";
    line-height: 1.8;
}


/* =========================
   HEADINGS
========================= */

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--heading);
    margin-bottom: 0.8rem;
}

h1 {
    font-size: 42px;
    font-weight: 900;
    line-height: 1.3;
}

h2 {
    font-size: 34px;
    font-weight: 800;
    line-height: 1.35;
}

h3 {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.4;
}

h4 {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.4;
}

h5 {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
}

h6 {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.5;
}


/* =========================
   TEXT
========================= */

p,
li {
    color: var(--text);
    font-size: 16px;
    line-height: 1.9;
}

small,
.caption,
.meta {
    color: var(--text-light);
}


/* =========================
   LINKS
========================= */

a {
    color: var(--primary);
    transition: all .25s ease;
}

a:hover,
a:focus {
    color: var(--accent);
}


/* =========================
   BUTTONS
========================= */

button,
.elementor-button,
input[type="submit"] {

    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
    transition: all .25s ease;
}

button:hover,
.elementor-button:hover,
input[type="submit"]:hover {

    background: var(--primary-hover);
    border-color: var(--primary-hover);
}


/* =========================
   FORMS
========================= */

input,
select,
textarea {

    border: 1px solid var(--border);
    border-radius: 8px;
}

input:focus,
select:focus,
textarea:focus {

    border-color: var(--primary);
    outline: none;
}


/* =========================
   BLOCKQUOTE
========================= */

blockquote {

    border-right: 4px solid var(--accent);
    background: var(--bg-light);
    padding: 20px;
    border-radius: 10px;
}


/* =========================
   HR
========================= */

hr {

    border: 0;
    border-top: 1px solid var(--border);
}


/* =========================
   TABLES
========================= */

table {

    width: 100%;
    border-collapse: collapse;
}

table td,
table th {

    border: 1px solid var(--border);
    padding: 12px;
}


/* =========================
   FOOTER
========================= */

footer {

    background: var(--bg-dark);
    color: #fff;
}