/* ==========================================================
   HCG CORPORATE HOMEPAGE SYSTEM
========================================================== */

:root {

    --hcg-primary:
        #1f2937;

    --hcg-secondary:
        #4b5563;

    --hcg-muted:
        #6b7280;

    --hcg-light:
        #f8fafc;

    --hcg-border:
        #e5e7eb;

    --hcg-white:
        #ffffff;

    --hcg-accent:
        #f97316;

    --hcg-accent-dark:
        #ea580c;

    --hcg-shadow:
        0 8px 30px
        rgba(15,23,42,.06);

    --hcg-shadow-hover:
        0 12px 40px
        rgba(15,23,42,.10);

    --hcg-radius:
        16px;

    --hcg-transition:
        all .25s ease;
}


/* ==========================================================
   GLOBAL
========================================================== */

.hcg-homepage-wrapper * {
    box-sizing: border-box;
}

.hcg-homepage-wrapper {

    width: 100%;
    overflow: hidden;

    background:
        var(--hcg-white);

    color:
        var(--hcg-primary);
}

.hcg-homepage-wrapper section {

    position: relative;

    padding:
        80px 0;
}

.hcg-container,
.hamsa-container {

    width: 100%;

    max-width: 1320px;

    margin: 0 auto;

    padding-left: 32px;
    padding-right: 32px;
}


/* ==========================================================
   TYPOGRAPHY
========================================================== */

.hcg-homepage-wrapper h1,
.hcg-homepage-wrapper h2,
.hcg-homepage-wrapper h3,
.hcg-homepage-wrapper h4,
.hcg-homepage-wrapper h5 {

    margin: 0;

    color:
        var(--hcg-primary);

    letter-spacing:
        -0.02em;
}

.hcg-homepage-wrapper p {

    margin: 0;

    color:
        var(--hcg-secondary);

    line-height: 1.8;

    font-size: 17px;

    font-weight: 400;
}


/* ==========================================================
   SECTION HEADING
========================================================== */

.hcg-section-heading {

    text-align: center;

    max-width: 820px;

    margin:
        0 auto 48px;
}

.hcg-section-heading h2 {

    font-size: 32px;

    font-weight: 600;

    line-height: 1.25;

    margin-bottom: 14px;
}

.hcg-section-heading p {

    font-size: 17px;

    color:
        var(--hcg-muted);
}


/* ==========================================================
   BUTTONS
========================================================== */

.hcg-btn-primary,
.hcg-btn-secondary {

    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-height: 46px;

    padding:
        12px 24px;

    border-radius:
        10px;

    font-size: 15px;

    font-weight: 500;

    text-decoration: none;

    transition:
        var(--hcg-transition);
}

.hcg-btn-primary {

    background:
        var(--hcg-accent);

    color:
        #fff;

    border:
        1px solid
        var(--hcg-accent);
}

.hcg-btn-primary:hover {

    background:
        var(--hcg-accent-dark);

    transform:
        translateY(-2px);
}

.hcg-btn-secondary {

    background:
        #fff;

    color:
        var(--hcg-primary);

    border:
        1px solid
        var(--hcg-border);
}

.hcg-btn-secondary:hover {

    border-color:
        var(--hcg-accent);

    transform:
        translateY(-2px);
}




/* ==========================================================
   STATISTICS SECTION
========================================================== */

.hcg-statistics-section {

    background:
        linear-gradient(
            135deg,
            #0f172a 0%,
            #111827 100%
        );

    position: relative;

    overflow: hidden;
}

.hcg-statistics-section .hamsa-container {

    position: relative;
    z-index: 2;
}


/* ==========================================================
   GRID
========================================================== */

.hcg-statistics-grid {

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0,1fr)
        );

    gap: 24px;

    align-items: stretch;
}


/* ==========================================================
   CARD
========================================================== */

.hcg-stat-card {

    position: relative;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.05),
            rgba(255,255,255,.03)
        );

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius:
        20px;

    padding:
        32px 28px;

    min-height:
        340px;

    display: flex;

    flex-direction: column;

    justify-content: flex-start;

    transition:
        all .25s ease;

    overflow: hidden;
}

.hcg-stat-card:hover {

    transform:
        translateY(-4px);

    border-color:
        rgba(249,115,22,.22);

    box-shadow:
        0 18px 40px
        rgba(0,0,0,.18);
}


/* ==========================================================
   ICON
========================================================== */

.hcg-stat-icon {

    width: 58px;
    height: 58px;

    border-radius:
        14px;

    background:
        rgba(
            249,
            115,
            22,
            .10
        );

    display: flex;

    align-items: center;
    justify-content: center;

    margin-bottom: 28px;
}

.hcg-stat-icon .dashicons {

    width: 24px;
    height: 24px;

    font-size: 24px;

    color:
        #f97316;
}


/* ==========================================================
   NUMBER
========================================================== */

.hcg-statistics-section
.hcg-stat-number {

    font-size: 40px;

    line-height: 1.1;

    font-weight: 400;

    color:
        #ffffff;

    margin-bottom: 16px;

    letter-spacing:
        -0.02em;

    overflow-wrap:
        break-word;
}


/* ==========================================================
   TITLE
========================================================== */

.hcg-statistics-section
.hcg-stat-label {

    font-size: 28px;

    line-height: 1.35;

    font-weight: 600;

    color:
        #ffffff;

    margin-bottom: 18px;

    text-transform:
        none;

    letter-spacing:
        normal;
}


/* ==========================================================
   ORANGE DIVIDER
========================================================== */

.hcg-statistics-section
.hcg-stat-label::after {

    content: "";

    display: block;

    width: 58px;
    height: 3px;

    margin-top: 18px;

    border-radius:
        999px;

    background:
        #f97316;
}


/* ==========================================================
   DESCRIPTION
========================================================== */

.hcg-statistics-section
.hcg-stat-description {

    font-size: 17px;

    line-height: 1.8;

    font-weight: 400;

    color:
        rgba(
            255,
            255,
            255,
            .72
        );

    margin-top: auto;
}


/* ==========================================================
   RESPONSIVE
========================================================== */

@media (max-width: 1199px) {

    .hcg-statistics-grid {

        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }
}

@media (max-width: 767px) {

    .hcg-statistics-grid {

        grid-template-columns:
            1fr;
    }

    .hcg-stat-card {

        min-height:
            auto;

        padding:
            28px 24px;
    }

    .hcg-statistics-section
    .hcg-stat-number {

        font-size:
            36px;
    }

    .hcg-statistics-section
    .hcg-stat-label {

        font-size:
            24px;
    }

    .hcg-statistics-section
    .hcg-stat-description {

        font-size:
            16px;
    }
}


/* ==========================================================
   WHY PERTECNICA
========================================================== */

.hcg-why-section {

    background:
        #f8fafc;
}

.hcg-why-grid {

    display: grid;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(260px,1fr)
        );

    gap: 24px;

    align-items: stretch;
}

.hcg-why-card {

    background:
        #fff;

    border:
        1px solid
        #e5e7eb;

    border-radius:
        16px;

    padding:
        28px;

    transition:
        var(--hcg-transition);

    height: 100%;

    display: flex;

    flex-direction: column;
}

.hcg-why-card:hover {

    transform:
        translateY(-3px);

    box-shadow:
        var(--hcg-shadow);
}

.hcg-why-card::before {
    display: none;
}

.hcg-why-icon {

    width: 58px;
    height: 58px;

    border-radius:
        12px;

    background:
        rgba(249,115,22,.08);

    display: flex;

    align-items: center;
    justify-content: center;

    margin-bottom: 18px;
}

.hcg-why-icon .dashicons {

    font-size: 24px;

    width: 24px;
    height: 24px;

    color:
        var(--hcg-accent);
}

.hcg-why-card h3 {

    font-size: 24px;

    font-weight: 600;

    line-height: 1.35;

    margin-bottom: 12px;

    color:
        var(--hcg-primary);
}

.hcg-why-card p {

    font-size: 16px;

    color:
        var(--hcg-secondary);

    line-height: 1.75;
}


/* ==========================================================
   RESPONSIVE
========================================================== */

@media (max-width: 767px) {

    .hcg-stat-card,
    .hcg-why-card {

        padding:
            24px;
    }

    .hcg-statistics-section
    .hcg-stat-number {

        font-size: 28px;
    }

    .hcg-statistics-section
    .hcg-stat-label {

        font-size: 18px;
    }

    .hcg-why-card h3 {

        font-size: 22px;
    }
}

/* ==========================================================
   CTA SECTION
========================================================== */

.hcg-cta-section {

    background:
        #111827;

    color:
        #fff;
}

.hcg-cta-grid {

    display: grid;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(320px,1fr)
        );

    gap: 24px;

    align-items: stretch;
}

.hcg-cta-card {

    background:
        rgba(255,255,255,.04);

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius:
        16px;

    padding:
        32px;

    transition:
        var(--hcg-transition);

    display: flex;

    flex-direction: column;

    height: 100%;
}

.hcg-cta-card:hover {

    transform:
        translateY(-3px);

    background:
        rgba(255,255,255,.06);
}

.hcg-cta-card::before {
    display: none;
}

.hcg-cta-icon {

    width: 60px;
    height: 60px;

    border-radius:
        12px;

    background:
        rgba(249,115,22,.08);

    display: flex;

    align-items: center;
    justify-content: center;

    margin-bottom: 20px;
}

.hcg-cta-icon .dashicons {

    font-size: 24px;

    width: 24px;
    height: 24px;

    color:
        var(--hcg-accent);
}

.hcg-cta-card h3 {

    font-size: 24px;

    font-weight: 600;

    line-height: 1.35;

    color:
        #fff;

    margin-bottom: 12px;
}

.hcg-cta-card p {

    font-size: 16px;

    line-height: 1.75;

    color:
        rgba(255,255,255,.72);

    margin-bottom: 22px;
}

.hcg-cta-buttons {

    display: flex;

    flex-wrap: wrap;

    gap: 12px;

    margin-top: auto;
}


/* ==========================================================
   OFFERINGS SECTION
========================================================== */

.hcg-offerings-section {

    background:
        #ffffff;
}

.hcg-offerings-grid {

    display: grid;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(300px,1fr)
        );

    gap: 24px;
}

.hcg-offering-card {

    background:
        #fff;

    border:
        1px solid
        var(--hcg-border);

    border-radius:
        16px;

    padding:
        28px;

    transition:
        var(--hcg-transition);

    height: 100%;
}

.hcg-offering-card:hover {

    transform:
        translateY(-3px);

    box-shadow:
        var(--hcg-shadow);
}

.hcg-offering-card::before {
    display: none;
}

.hcg-offering-icon {

    width: 58px;
    height: 58px;

    border-radius:
        12px;

    background:
        rgba(249,115,22,.08);

    display: flex;

    align-items: center;
    justify-content: center;

    margin-bottom: 18px;
}

.hcg-offering-icon .dashicons {

    font-size: 24px;

    width: 24px;
    height: 24px;

    color:
        var(--hcg-accent);
}

.hcg-offering-card h3 {

    font-size: 24px;

    font-weight: 600;

    line-height: 1.35;

    margin-bottom: 12px;
}

.hcg-offering-card p {

    font-size: 16px;

    line-height: 1.75;

    color:
        var(--hcg-secondary);

    margin-bottom: 18px;
}

.hcg-offering-meta {

    font-size: 14px;

    font-weight: 500;

    color:
        var(--hcg-accent);
}


/* ==========================================================
   FINAL RESPONSIVE POLISH
========================================================== */

@media (max-width: 991px) {

    .hcg-homepage-wrapper section {

        padding:
            64px 0;
    }

    .hcg-section-heading {

        margin-bottom:
            40px;
    }
}

@media (max-width: 767px) {

    .hcg-homepage-wrapper section {

        padding:
            52px 0;
    }

    .hcg-section-heading h2 {

        font-size:
            28px;
    }

    .hcg-cta-card,
    .hcg-offering-card {

        padding:
            24px;
    }

    .hcg-cta-buttons {

        flex-direction:
            column;
    }

    .hcg-btn-primary,
    .hcg-btn-secondary {

        width: 100%;
    }
}