/*
Theme Name: itstaff child theme
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.7.1777550907
Updated: 2026-04-30 12:08:27

*/

/* ===========================================
   1. GOOGLE FONT IMPORT
   =========================================== */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Nunito+Sans:ital,wght@0,200..1000;1,200..1000&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/* ===========================================
   2. ELEMENTOR GLOBAL CSS VARIABLES
   Exact IDs from the kit's global.json
   =========================================== */
:root {
    /* ── System Colors ── */
    --e-global-color-primary: #B05CFF;
    --e-global-color-secondary: #5050FA;
    --e-global-color-text: #6E6E6E;
    --e-global-color-accent: #0D0D3B;

    /* ── Custom Colors (hashed IDs) ── */
    --e-global-color-4da9a17: #2D2DD2;   /* Tertiary */
    --e-global-color-50b2a21: #FFFFFF45; /* Border Overlay */
    --e-global-color-2d6a869: #DADADA;   /* Border Color */
    --e-global-color-9c764db: #C385FF;   /* Accent */
    --e-global-color-6b0ce64: #E9EFF7;   /* White Smoke */
    --e-global-color-fdf12ae: #FFFFFFD4; /* White Overlay */
    --e-global-color-e328c38: #AEAEAE;   /* Placeholder */
    --e-global-color-c9da145: #0D0D3B80; /* Dark Bg 50 */
    --e-global-color-9c082af: #FFFFFF;   /* White */
    --e-global-color-0962333: #02010100; /* Transparent */
    --e-global-color-0a2c89e: #0D0D3BE6; /* Dark Bg 90 */
    --e-global-color-289d5be: #FFFFFF12; /* White 10 */
    --e-global-color-7150412: #AFAFFF;   /* Fourth */
    --e-global-color-d922627: #0D0D3B;   /* Dark Bg */

    /* ── System Typography ── */
    --e-global-typography-primary-font-family: "Manrope", sans-serif;
    --e-global-typography-primary-font-weight: 700;

    --e-global-typography-secondary-font-family: "Manrope", sans-serif;
    --e-global-typography-secondary-font-weight: 600;

    --e-global-typography-text-font-family: "Manrope", sans-serif;
    --e-global-typography-text-font-size: 17px;
    --e-global-typography-text-font-weight: 400;
    --e-global-typography-text-line-height: 1.5em;

    --e-global-typography-accent-font-family: "Manrope", sans-serif;
    --e-global-typography-accent-font-weight: 700;
    --e-global-typography-accent-font-size: 15px;
    --e-global-typography-accent-line-height: 1.3em;
    --e-global-typography-accent-text-transform: capitalize;

    /* ── Custom Typography (hashed IDs) ── */
    /* 404 Big */
    --e-global-typography-5898891-font-family: "Manrope", sans-serif;
    --e-global-typography-5898891-font-weight: 800;
    --e-global-typography-5898891-font-size: 250px;
    --e-global-typography-5898891-line-height: 1em;
    --e-global-typography-5898891-letter-spacing: 25px;

    /* Very Big Title (H1) */
    --e-global-typography-db48b8b-font-family: "Manrope", sans-serif;
    --e-global-typography-db48b8b-font-weight: 800;
    --e-global-typography-db48b8b-font-size: 65px;
    --e-global-typography-db48b8b-line-height: 1.2em;
    --e-global-typography-db48b8b-text-transform: capitalize;

    /* Big Title (H2) */
    --e-global-typography-c397194-font-family: "Manrope", sans-serif;
    --e-global-typography-c397194-font-weight: 800;
    --e-global-typography-c397194-font-size: 45px;
    --e-global-typography-c397194-line-height: 1.2em;
    --e-global-typography-c397194-text-transform: capitalize;

    /* Medium Title (H3) */
    --e-global-typography-679076f-font-family: "Manrope", sans-serif;
    --e-global-typography-679076f-font-weight: 800;
    --e-global-typography-679076f-font-size: 35px;
    --e-global-typography-679076f-line-height: 1.2em;
    --e-global-typography-679076f-text-transform: capitalize;

    /* Standard Title (H4) */
    --e-global-typography-a10f8a0-font-family: "Manrope", sans-serif;
    --e-global-typography-a10f8a0-font-weight: 800;
    --e-global-typography-a10f8a0-font-size: 25px;
    --e-global-typography-a10f8a0-line-height: 1.2em;
    --e-global-typography-a10f8a0-text-transform: capitalize;

    /* Small Title (H5) */
    --e-global-typography-b21c26e-font-family: "Manrope", sans-serif;
    --e-global-typography-b21c26e-font-weight: 800;
    --e-global-typography-b21c26e-font-size: 20px;
    --e-global-typography-b21c26e-line-height: 1.2em;
    --e-global-typography-b21c26e-text-transform: capitalize;

    /* Extra Small Title (H6) */
    --e-global-typography-4aceb21-font-family: "Manrope", sans-serif;
    --e-global-typography-4aceb21-font-weight: 800;
    --e-global-typography-4aceb21-font-size: 17px;
    --e-global-typography-4aceb21-line-height: 1.2em;
    --e-global-typography-4aceb21-text-transform: capitalize;

    /* Body Small */
    --e-global-typography-1eb2da8-font-family: "Manrope", sans-serif;
    --e-global-typography-1eb2da8-font-weight: 400;
    --e-global-typography-1eb2da8-font-size: 15px;

    /* Block Quote */
    --e-global-typography-3be2057-font-family: "Manrope", sans-serif;
    --e-global-typography-3be2057-font-weight: 600;
    --e-global-typography-3be2057-font-size: 20px;
    --e-global-typography-3be2057-font-style: italic;
    --e-global-typography-3be2057-line-height: 1.3em;

    /* Form Label */
    --e-global-typography-94bac04-font-family: "Manrope", sans-serif;
    --e-global-typography-94bac04-font-weight: 600;
    --e-global-typography-94bac04-font-size: 15px;
    --e-global-typography-94bac04-line-height: 1.5em;

    /* Text Path */
    --e-global-typography-b9711bb-font-family: "Manrope", sans-serif;
    --e-global-typography-b9711bb-font-weight: 700;
    --e-global-typography-b9711bb-font-size: 18px;
    --e-global-typography-b9711bb-text-transform: uppercase;
    --e-global-typography-b9711bb-line-height: 1.3em;
    --e-global-typography-b9711bb-letter-spacing: 1px;

    /* Medium Quote */
    --e-global-typography-f4f8084-font-family: "Manrope", sans-serif;
    --e-global-typography-f4f8084-font-weight: 600;
    --e-global-typography-f4f8084-font-size: 35px;
    --e-global-typography-f4f8084-font-style: italic;
    --e-global-typography-f4f8084-line-height: 1.3em;
    --e-global-typography-f4f8084-letter-spacing: 1.5px;

    /* Quote */
    --e-global-typography-48cd92d-font-family: "Manrope", sans-serif;
    --e-global-typography-48cd92d-font-weight: 600;
    --e-global-typography-48cd92d-font-size: 17px;
    --e-global-typography-48cd92d-font-style: italic;
    --e-global-typography-48cd92d-line-height: 1.5em;

    /* Subheading */
    --e-global-typography-3958d75-font-family: "Manrope", sans-serif;
    --e-global-typography-3958d75-font-weight: 700;
    --e-global-typography-3958d75-font-size: 14px;
    --e-global-typography-3958d75-text-transform: uppercase;
    --e-global-typography-3958d75-line-height: 1.3em;
    --e-global-typography-3958d75-letter-spacing: 1px;

    /* Heading XS Underline */
    --e-global-typography-31ff809-font-family: "Manrope", sans-serif;
    --e-global-typography-31ff809-font-weight: 700;
    --e-global-typography-31ff809-font-size: 17px;
    --e-global-typography-31ff809-text-decoration: underline;
    --e-global-typography-31ff809-line-height: 1.3em;

    /* Sale Text */
    --e-global-typography-45109ee-font-family: "Manrope", sans-serif;
    --e-global-typography-45109ee-font-weight: 700;
    --e-global-typography-45109ee-font-size: 25px;
    --e-global-typography-45109ee-text-decoration: line-through;
    --e-global-typography-45109ee-line-height: 1.2em;
}

/* ===========================================
   3. THEME STYLE – BODY
   =========================================== */
body,
body.elementor-page {
    font-family: "Manrope", sans-serif;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.5;
    color: #6E6E6E;
    background-color: #FFFFFF;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ===========================================
   4. THEME STYLE – HEADINGS
   =========================================== */
h1, h2, h3, h4, h5, h6 {
    color: #0D0D3B;
    font-family: "Manrope", sans-serif;
}

h1 {
    font-size: 65px;
    font-weight: 800;
    line-height: 1.2em;
    text-transform: capitalize;
}
h2 {
    font-size: 45px;
    font-weight: 800;
    line-height: 1.2em;
    text-transform: capitalize;
}
h3 {
    font-size: 35px;
    font-weight: 800;
    line-height: 1.2em;
    text-transform: capitalize;
}
h4 {
    font-size: 25px;
    font-weight: 800;
    line-height: 1.2em;
    text-transform: capitalize;
}
h5 {
    font-size: 20px;
    font-weight: 800;
    line-height: 1.2em;
    text-transform: capitalize;
}
h6 {
    font-size: 17px;
    font-weight: 800;
    line-height: 1.2em;
    text-transform: capitalize;
}

/* ===========================================
   5. THEME STYLE – LINKS
   =========================================== */
a {
    color: #5050FA;
    font-family: "Nunito Sans", sans-serif;
    font-size: 17px;
    text-decoration: none;
}

a:hover {
    color: #B05CFF;
}

/* ===========================================
   6. THEME STYLE – BUTTONS
   =========================================== */
.elementor-button,
.elementor-widget-button .elementor-button {
    font-family: "Manrope", sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3em;
    text-transform: capitalize;
    letter-spacing: 2px;
    padding: 16px 35px;
    border-radius: 30px;
    border: none;
    color: #FFFFFF;
    background: linear-gradient(150deg, #B05CFF 0%, #5050FA 70%);
    box-shadow: 0 25px 50px rgba(250, 88, 182, 0.23);
    transition: all 0.3s ease;
}

.elementor-button:hover,
.elementor-widget-button .elementor-button:hover {
    background: linear-gradient(150deg, #5050FA 0%, #B05CFF 70%);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    color: #FFFFFF;
}

/* ===========================================
   7. THEME STYLE – IMAGES
   =========================================== */
.elementor-widget-image img {
    border-radius: 30px;
    box-shadow: 0 5px 50px rgba(0, 0, 0, 0.15);
}

/* ===========================================
   8. THEME STYLE – FORM FIELDS
   =========================================== */
.elementor-field-textual,
.elementor-widget-form input,
.elementor-widget-form textarea,
.elementor-widget-form select {
    font-family: "Manrope", sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #6E6E6E;
    background-color: rgba(246, 246, 246, 0);
    border: 1px solid #FFFFFF45;
    border-radius: 5px;
    padding: 12px;
}

.elementor-field-textual:focus,
.elementor-widget-form input:focus,
.elementor-widget-form textarea:focus {
    border-color: #5050FA;
    color: #6E6E6E;
    outline: none;
}

.elementor-field-label {
    font-family: "Manrope", sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.5em;
}

/* ===========================================
   9. RESPONSIVE – TABLET (max-width: 1024px)
   =========================================== */
@media (max-width: 1024px) {
    h1 { font-size: 45px; }
    h2 { font-size: 35px; }
    h3 { font-size: 30px; }
    h4 { font-size: 23px; }
    h5 { font-size: 17px; }
    h6 { font-size: 15px; }

    :root {
        --e-global-typography-db48b8b-font-size: 45px;
        --e-global-typography-c397194-font-size: 35px;
        --e-global-typography-679076f-font-size: 30px;
        --e-global-typography-a10f8a0-font-size: 23px;
        --e-global-typography-b21c26e-font-size: 17px;
        --e-global-typography-4aceb21-font-size: 15px;
        --e-global-typography-5898891-font-size: 120px;
        --e-global-typography-5898891-letter-spacing: 10px;
    }
}

/* ===========================================
   10. RESPONSIVE – MOBILE (max-width: 767px)
   =========================================== */
@media (max-width: 767px) {
    h1 { font-size: 35px; }
    h2 { font-size: 25px; }
    h3 { font-size: 23px; }
    h4 { font-size: 20px; }
    h5 { font-size: 15px; }
    h6 { font-size: 15px; }

    :root {
        --e-global-typography-db48b8b-font-size: 35px;
        --e-global-typography-c397194-font-size: 30px;
        --e-global-typography-679076f-font-size: 25px;
        --e-global-typography-a10f8a0-font-size: 20px;
        --e-global-typography-b21c26e-font-size: 18px;
        --e-global-typography-4aceb21-font-size: 16px;
        --e-global-typography-5898891-font-size: 120px;
        --e-global-typography-5898891-letter-spacing: 10px;
        --e-global-typography-f4f8084-font-size: 23px;
        --e-global-typography-31ff809-font-size: 16px;
    }
}
