/*==================================================
GREEN ASIST | 01-home-hero.css 
HOME | HERO SECTION
==================================================*/

/*==================================================
HERO FINAL BUILD-03
==================================================*/

.hero{
    position:relative;
    display:flex;
    align-items:center;
    min-height:560px;
    overflow:hidden;
    background:var(--color-dark);
    color:var(--color-white);
    isolation:isolate;
}

.hero *{
    color:var(--color-white);
}

.hero-background{
    position:absolute;
    inset:0;
    z-index:-2;
    background:
        linear-gradient(
            90deg,
            rgba(10,14,18,.22) 0%,
            rgba(10,14,18,.16) 30%,
            rgba(10,14,18,.08) 58%,
            rgba(10,14,18,.02) 78%,
            rgba(10,14,18,0) 100%
        ),
        url("./01-hero-main.webp");
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center center;
    transform:scale(1.01);
}

.hero::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    pointer-events:none;
    background:
        radial-gradient(
            circle at 22% 52%,
            rgba(71,199,122,.08),
            transparent 42%
        );
}

.hero .container{
    position:relative;
    width:100%;
    max-width:none;
    padding-left:64px;
    padding-right:24px;
    z-index:2;
}

.hero-layout{
    display:grid;
    grid-template-columns:minmax(520px,720px) 1fr;
    align-items:center;
    min-height:560px;
}

.hero-content{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    width:100%;
    max-width:660px;
    padding:38px 40px 28px;
    border-radius:22px;
    background:linear-gradient(
        90deg,
        rgba(0,0,0,.34) 0%,
        rgba(0,0,0,.26) 58%,
        rgba(0,0,0,.14) 100%
    );
    border:1px solid rgba(255,255,255,.10);
    box-shadow:
        0 20px 55px rgba(0,0,0,.22);
    backdrop-filter:blur(10px);
}

.hero-kicker{
    display:inline-flex;
    align-items:center;
    margin-bottom:24px;
    color:var(--color-yesil-1);
    font-size:1.05rem;
    font-weight:550;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.hero-title{
    max-width:720px;
    margin:0 0 28px;
    color:#ffffff !important;
    font-size:clamp(2.45rem,2.55vw,3.35rem);
    font-weight:600;
    line-height:1.22;
    letter-spacing:-.025em;
    text-align:left;
    text-shadow:0 10px 30px rgba(0,0,0,.24);
}

.hero-title span{
    display:block;
    margin-bottom:.05em;
}

.hero-title span:last-child{
    margin-bottom:0;
}

.hero-text{
    max-width:560px;
    margin:0 0 38px;
    color:rgba(255,255,255,.92);
    font-size:1.05rem;
    font-weight:400;
    line-height:1.78;
    text-align:left;
}

.hero .hero-title,
.hero h1{
    color:#ffffff !important;
}

.hero-actions{
    display:flex;
    align-items:center;
    gap:16px;
    flex-wrap:wrap;
}

.hero .btn{
    min-width:185px;
    justify-content:center;
    transition:
        transform .28s ease,
        box-shadow .28s ease,
        background-color .28s ease,
        border-color .28s ease;
}

.hero .btn-primary{
    box-shadow:0 12px 30px rgba(0,0,0,.24);
}

.hero .btn-primary:hover{
    transform:translateY(-3px);
    box-shadow:0 18px 38px rgba(0,0,0,.30);
}

.hero .btn-outline{
    color:#ffffff;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.42);
    backdrop-filter:blur(4px);
}

.hero .btn-outline:hover{
    color:#ffffff;
    background:rgba(255,255,255,.10);
    border-color:#ffffff;
}

/*==================================================
TRUST / PROOF STRIP
==================================================*/

.home-proof{
    background:#edf4f0;
    border-top:1px solid rgba(0,96,55,.13);
    border-bottom:1px solid rgba(0,96,55,.13);
}

.home-proof-inner{
    width:100%;
    min-height:76px;
    margin:0 auto;
    padding:0 clamp(42px,4vw,74px);
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    align-items:stretch;
}

.home-proof-item{
    min-width:0;
    padding:18px clamp(18px,2.2vw,36px);
    display:flex;
    align-items:center;
    gap:13px;
    border-right:1px solid rgba(0,96,55,.13);
}

.home-proof-item:first-child{
    padding-left:0;
}

.home-proof-item:last-child{
    padding-right:0;
    border-right:0;
}

.home-proof-index{
    flex:0 0 auto;
    color:#008542;
    font-size:11px;
    font-weight:750;
    letter-spacing:.08em;
}

.home-proof-item strong{
    color:#183229;
    font-size:clamp(12.5px,.82vw,14px);
    font-weight:620;
    line-height:1.38;
}

@media(max-width:768px){
    .home-proof-inner{
        width:min(100% - 28px,1180px);
        min-height:0;
        padding:8px 0;
        grid-template-columns:1fr;
    }

    .home-proof-item,
    .home-proof-item:first-child,
    .home-proof-item:last-child{
        min-height:44px;
        padding:8px 4px;
        border-right:0;
        border-bottom:1px solid rgba(0,96,55,.11);
    }

    .home-proof-item:last-child{
        border-bottom:0;
    }

    .home-proof-item strong{
        font-size:12.5px;
    }
}

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

/*==================================================
NOTE
Responsive rules for this HOME section are centralized in 07_home.css.
This file intentionally contains desktop/base section styling only.
==================================================*/
