/* ==========================================================
   HERO
========================================================== */

.hero{

    padding:var(--space-3xl) 0 var(--space-2xl);

}

.hero-inner{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:var(--space-2xl);

}

.hero-content{

    max-width:560px;

}

.hero h1{

    margin:0 0 var(--space-md);

    font-family:var(--font-heading);

    font-size:clamp(2.5rem,5vw,3.5rem);

    font-weight:700;

    line-height:1.15;

    color:var(--text-1);

}

.hero-sub{

    margin-bottom:var(--space-lg);

    font-size:1.125rem;

    line-height:1.8;

    color:var(--text-2);

}

.hero-actions{

    display:flex;

    flex-wrap:wrap;

    gap:var(--space-sm);

}

.hero-image img{

    width:100%;

    border-radius:var(--radius-lg);

    box-shadow:var(--shadow-sm);

}

.home .hero{

    min-height:72vh;

}

.home .hero-content{

    max-width:680px;

}

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

@media (max-width:900px){

    .hero{

        padding:var(--space-2xl) 0;

    }

    .hero-inner{

        flex-direction:column;

        text-align:center;

        gap:var(--space-xl);

    }

    .hero-content{

        max-width:100%;

    }

    .hero-actions{

        justify-content:center;

    }

}