/* =====================================================
   PROJECT PAGE
===================================================== */

.project-hero{

    padding:170px 0 90px;

}

.project-hero .container{

    max-width:1100px;

    margin:auto;

    text-align:center;

}

.project-hero .section-badge{

    display:inline-block;

    padding:12px 24px;

    border-radius:999px;

    border:1px solid rgba(255,255,255,.08);

    background:#322E2E;

    color:#0D85EB;

    font-size:14px;

    font-weight:600;

    letter-spacing:.5px;

}

.project-hero h1{

    font-size:72px;

    margin:28px 0 20px;

    line-height:1.1;

    color:#fff;

}

.project-hero p{

    max-width:760px;

    margin:auto;

    color:var(--text);

    font-size:20px;

    line-height:1.9;

}



/* =====================================================
   HERO IMAGE
===================================================== */

.project-banner{

    padding:0 0 120px;

}

.project-banner img{

    width:100%;

    display:block;

    border-radius:28px;

    border:1px solid rgba(255,255,255,.08);

}



/* =====================================================
   GALLERY
===================================================== */

.project-gallery{

    padding-bottom:140px;

}

.gallery-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:35px;

}

.gallery-grid img{

    width:100%;

    display:block;

    border-radius:22px;

    transition:.35s;

    border:1px solid rgba(255,255,255,.08);

}

.gallery-grid img:hover{

    transform:translateY(-8px);

    border-color:#0D85EB;

}



/* =====================================================
   CONTENT
===================================================== */

.project-details{

    padding:100px 0;

}

.project-card{

    max-width:1000px;

    margin:auto;

    padding:60px;

    background:#322E2E;

    border:1px solid rgba(255,255,255,.08);

    border-radius:28px;

}

.project-card h2{

    margin:25px 0;

}

.project-card h3{

    margin:35px 0 15px;

    color:#0D85EB;

}

.project-card p{

    line-height:1.9;

    color:var(--text);

}

.project-card hr{

    margin:35px 0;

    border:none;

    height:1px;

    background:rgba(255,255,255,.08);

}

/* =====================================================
   PROJECT CTA
===================================================== */

.project-cta{

    padding:120px 0;

}

.project-cta-card{

    max-width:1100px;

    margin:auto;

    text-align:center;

    padding:80px 60px;

    background:#322E2E;

    border:1px solid rgba(255,255,255,.08);

    border-radius:28px;

}

.project-cta-card h2{

    font-size:52px;

    color:#fff;

    margin:25px 0 20px;

    line-height:1.2;

}

.project-cta-card p{

    max-width:760px;

    margin:0 auto 45px;

    color:var(--text);

    font-size:18px;

    line-height:1.9;

}

.project-cta-buttons{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:20px;

}

.secondary-btn{

    display:inline-flex;

    justify-content:center;

    align-items:center;

    padding:14px 32px;

    border-radius:12px;

    border:1px solid rgba(255,255,255,.12);

    color:#fff;

    font-weight:600;

    transition:.35s;

}

.secondary-btn:hover{

    border-color:#0D85EB;

    color:#0D85EB;

}