/* ==========================================================================
   Delta Auriga
   Services Styles
   ========================================================================== */

/**
 * Services
 * Services Overlay
 * Services Container
 * Eyebrow
 * Typography
 * Description
 * Services Grid
 * Service Card
 * Card Number
 * Card Link
 * Hover Effects
 * Responsive
 */

/* ==========================================================================
   Services
   ========================================================================== */

.auriga-services {

    position: relative;

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

    min-height: 65vh;

    overflow: hidden;
    isolation: isolate;

    background-image:
        linear-gradient(
            rgba(10,16,32,.25),
            rgba(10,16,32,.25)
        ),
        url("../images/services-bg.png");

    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;

}

/* ==========================================================================
   Overlay
   ========================================================================== */

.auriga-services::before {

    content: "";

    position: absolute;
    inset: 0;

    background: linear-gradient(
        180deg,
        rgba(11,17,32,.55) 0%,
        rgba(11,17,32,.30) 100%
    );

    z-index: 1;

}

/* ==========================================================================
   Container
   ========================================================================== */

.auriga-services__overlay {

    position: relative;

    z-index: 2;

    width: min(900px,100%);

    margin-inline: auto;

    padding:
        clamp(5rem,8vw,8rem)
        clamp(2rem,6vw,6rem);

    text-align: center;

}

/* ==========================================================================
   Eyebrow
   ========================================================================== */

.auriga-services__eyebrow {

    margin-bottom: 1.5rem;

    font-size: .85rem;

    letter-spacing: .30em;

    text-transform: uppercase;

    font-weight: 600;

    color: var(--wp--preset--color--primary);

}

/* ==========================================================================
   Typography
   ========================================================================== */

.auriga-services__title {

    margin: 0;

    font-size: clamp(4.5rem,8vw,6.5rem);

    line-height: 1.25;

    font-weight: 700;

    color: var(--wp--preset--color--text);

}

/* ==========================================================================
   Description
   ========================================================================== */

.auriga-services__description {

    max-width: 700px;

    margin:
        2.5rem auto
        0;

    font-size: 1.2rem;

    line-height: 1.9;

    color: var(--wp--preset--color--text-muted);

    opacity: .92;

}

/* ==========================================================================
   Services Grid
   ========================================================================== */

.auriga-services-grid {

    position: relative;

    margin-top: -80px;

    padding:
        0
        clamp(2rem,5vw,6rem)
        8rem;

    z-index: 10;

}

.auriga-services-grid__container {

    width: min(1280px,100%);

    margin-inline: auto;

}

.auriga-services-grid__grid {

    display: grid;

    grid-template-columns: repeat(3,1fr);

    gap: 2.5rem;

}

/* ==========================================================================
   Service Card
   ========================================================================== */

.auriga-service-card {

    position: relative;

    min-height: 380px;

    padding: 3.5rem;

    background: linear-gradient(
        180deg,
        var(--wp--preset--color--surface) 0%,
        var(--wp--preset--color--background-alt) 100%
    );

    backdrop-filter: blur(10px);

    border-radius: 28px;

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

    overflow: hidden;

    transition:
        transform .35s ease,
        box-shadow .35s ease;

    box-shadow:
        0 20px 45px rgba(0,0,0,.08);

}

.auriga-service-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 0;

    height: 4px;

    background: linear-gradient(
        90deg,
        #FFE59A,
        #F4C85C,
        #C88D1E
    );

    transition: width .35s ease;

}

/* ==========================================================================
   Number
   ========================================================================== */

.auriga-service-card__number {

    position: absolute;

    top: 20px;
    right: 30px;

    font-size: 4rem;

    font-weight: 700;

    line-height: 1;

    color: var(--wp--preset--color--primary);

    opacity: .30;

    transition: all .35s ease;

}

/* ==========================================================================
   Card Typography
   ========================================================================== */

.auriga-service-card__title {

    margin-top: 4rem;
    margin-bottom: 1.25rem;

    font-size: 1.6rem;

}

.auriga-service-card__text {

    color: var(--wp--preset--color--text-muted);

    line-height: 1.8;

}

/* ==========================================================================
   Link
   ========================================================================== */

.auriga-service-card__link {

    display: inline-flex;

    margin-top: 2rem;

    text-decoration: none;

    font-weight: 600;

    color: var(--wp--preset--color--primary);

    transition: all .3s ease;

}

/* ==========================================================================
   Hover
   ========================================================================== */

.auriga-service-card:hover {

    transform: translateY(-12px);

    box-shadow:
        0 35px 70px rgba(0,0,0,.18);

}

.auriga-service-card:hover
.auriga-service-card__number {

    opacity: .15;

}

.auriga-service-card:hover
.auriga-service-card__link {

    transform: translateX(8px);

}

.auriga-service-card:hover::before {

    width: 100%;

}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width:992px){

    .auriga-services{

        background-attachment: scroll;

    }

    .auriga-services-grid__grid{

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

    }

}

@media (max-width:768px){

    .auriga-services{

        min-height:auto;

    }

    .auriga-services__title{

        font-size:clamp(3rem,10vw,4rem);

    }

    .auriga-services-grid{

        margin-top:-40px;

    }

    .auriga-services-grid__grid{

        grid-template-columns:1fr;

    }

    .auriga-service-card{

        min-height:auto;

    }

}