/* =====================================================
   PGIF HOME HERO SLIDER - FINAL RESPONSIVE VERSION
===================================================== */

.pgifHomeHeroSlider{
    position:relative;
    width:100%;
    min-height:calc(100vh - 82px);
    overflow:hidden;
    background:#0f172a;
    isolation:isolate;
}

/* SLIDES WRAPPER */
.pgifHomeHeroSlides{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    z-index:1;
}

/* EACH SLIDE */
.pgifHomeHeroSlide{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    background-size:cover;
    background-position:center center;
    background-repeat:no-repeat;
    opacity:0;
    visibility:hidden;
    transform:scale(1.08);
    transition:opacity 1s ease, visibility 1s ease, transform 6s ease;
}

.pgifHomeHeroSlide.active{
    opacity:1;
    visibility:visible;
    transform:scale(1);
    z-index:2;
}

/* DARK OVERLAY */
.pgifHomeHeroOverlay{
    position:absolute;
    inset:0;
    z-index:1;
    background:
        linear-gradient(
            90deg,
            rgba(2,6,23,.88) 0%,
            rgba(15,23,42,.70) 48%,
            rgba(15,23,42,.35) 100%
        );
}

.pgifHomeHeroOverlay::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at 20% 30%, rgba(25,118,210,.28), transparent 32%),
        radial-gradient(circle at 70% 70%, rgba(76,175,80,.22), transparent 35%);
}

/* CONTENT */
.pgifHomeHeroContent{
    position:relative;
    z-index:3;
    width:90%;
    max-width:1180px;
    min-height:calc(100vh - 82px);
    margin:0 auto;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
    padding:90px 0 150px;
    color:#fff;
}

/* LABEL */
.pgifHomeHeroLabel{
    display:inline-flex;
    align-items:center;
    gap:8px;
    max-width:100%;
    padding:9px 16px;
    border-radius:999px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.22);
    backdrop-filter:blur(12px);
    color:#FBC02D;
    font-size:12px;
    font-weight:900;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:20px;
    animation:pgifHeroFadeUp .9s ease both;
}

.pgifHomeHeroLabel::before{
    content:"";
    width:8px;
    height:8px;
    min-width:8px;
    border-radius:50%;
    background:#4CAF50;
    box-shadow:0 0 18px #4CAF50;
}

/* TITLE */
.pgifHomeHeroContent h1{
    max-width:850px;
    font-size:clamp(34px, 5vw, 64px);
    line-height:1.06;
    letter-spacing:-1.5px;
    font-weight:900;
    margin-bottom:22px;
    color:#fff;
    animation:pgifHeroFadeUp 1s ease .15s both;
}

.pgifHomeHeroContent h1 span{
    color:#FBC02D;
}

/* PARAGRAPH */
.pgifHomeHeroContent p{
    max-width:690px;
    color:rgba(255,255,255,.88);
    font-size:clamp(14px, 1.6vw, 17px);
    line-height:1.85;
    margin-bottom:34px;
    animation:pgifHeroFadeUp 1s ease .3s both;
}

/* BUTTONS */
.pgifHomeHeroBtns{
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
    animation:pgifHeroFadeUp 1s ease .45s both;
}

.pgifHomeHeroBtn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:14px 25px;
    border-radius:999px;
    text-decoration:none;
    font-size:14px;
    font-weight:900;
    transition:.35s ease;
}

.pgifHomeHeroBtn.primary{
    background:linear-gradient(135deg,#1976D2,#4CAF50);
    color:#fff;
    box-shadow:0 18px 40px rgba(25,118,210,.30);
}

.pgifHomeHeroBtn.secondary{
    background:rgba(255,255,255,.12);
    color:#fff;
    border:1px solid rgba(255,255,255,.36);
    backdrop-filter:blur(10px);
}

.pgifHomeHeroBtn:hover{
    transform:translateY(-4px);
}

/* GLASS CARD */
.pgifHomeHeroGlassCard{
    position:absolute;
    right:7%;
    bottom:88px;
    z-index:5;
    width:340px;
    max-width:calc(100% - 40px);
    padding:26px;
    border-radius:28px;
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.26);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    box-shadow:0 28px 80px rgba(0,0,0,.25);
    color:#fff;
    animation:pgifHeroCardFloat 5s ease-in-out infinite;
}

.pgifHomeHeroGlassIcon{
    width:56px;
    height:56px;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#FBC02D;
    color:#111827;
    font-size:23px;
    margin-bottom:18px;
}

.pgifHomeHeroGlassCard h3{
    font-size:20px;
    line-height:1.3;
    margin-bottom:10px;
    color:#fff;
}

.pgifHomeHeroGlassCard p{
    color:rgba(255,255,255,.84);
    font-size:14px;
    line-height:1.7;
    margin:0;
}

/* DOTS */
.pgifHomeHeroControls{
    position:absolute;
    left:50%;
    bottom:34px;
    transform:translateX(-50%);
    z-index:6;
    display:flex;
    gap:10px;
}

.pgifHomeHeroDot{
    width:12px;
    height:12px;
    border-radius:999px;
    border:0;
    cursor:pointer;
    background:rgba(255,255,255,.45);
    transition:.35s ease;
}

.pgifHomeHeroDot.active{
    width:38px;
    background:#FBC02D;
}

/* ARROWS */
.pgifHomeHeroArrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:6;
    width:48px;
    height:48px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.26);
    background:rgba(255,255,255,.13);
    color:#fff;
    backdrop-filter:blur(12px);
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:.35s ease;
}

.pgifHomeHeroArrow:hover{
    background:#FBC02D;
    color:#111827;
}

.pgifHomeHeroArrowPrev{
    left:28px;
}

.pgifHomeHeroArrowNext{
    right:28px;
}

/* ANIMATIONS */
@keyframes pgifHeroFadeUp{
    from{
        opacity:0;
        transform:translateY(35px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }
}

@keyframes pgifHeroCardFloat{
    0%,100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-12px);
    }
}

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

@media(max-width:1050px){

    .pgifHomeHeroSlider{
        min-height:760px;
    }

    .pgifHomeHeroSlides,
    .pgifHomeHeroSlide{
        min-height:760px;
    }

    .pgifHomeHeroContent{
        min-height:760px;
        padding:100px 0 240px;
    }

    .pgifHomeHeroGlassCard{
        left:5%;
        right:auto;
        bottom:82px;
        width:430px;
        max-width:90%;
    }

    .pgifHomeHeroArrow{
        width:42px;
        height:42px;
    }

    .pgifHomeHeroArrowPrev{
        left:16px;
    }

    .pgifHomeHeroArrowNext{
        right:16px;
    }
}

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

@media(max-width:760px){

    .pgifHomeHeroSlider{
        display:block;
        min-height:820px;
        height:auto;
        overflow:hidden;
    }

    .pgifHomeHeroSlides{
        position:absolute;
        inset:0;
        height:100%;
        min-height:820px;
    }

    .pgifHomeHeroSlide{
        min-height:820px;
        background-size:cover;
        background-position:center center;
    }

    .pgifHomeHeroOverlay{
        background:
            linear-gradient(
                180deg,
                rgba(2,6,23,.86) 0%,
                rgba(15,23,42,.82) 45%,
                rgba(15,23,42,.95) 100%
            );
    }

    .pgifHomeHeroContent{
        position:relative;
        z-index:4;
        width:92%;
        min-height:820px;
        justify-content:flex-start;
        padding:92px 0 300px;
    }

    .pgifHomeHeroLabel{
        font-size:10px;
        letter-spacing:1.4px;
        padding:8px 12px;
        line-height:1.4;
        white-space:normal;
    }

    .pgifHomeHeroContent h1{
        font-size:30px;
        line-height:1.16;
        letter-spacing:-.6px;
        margin-bottom:18px;
    }

    .pgifHomeHeroContent p{
        font-size:14px;
        line-height:1.75;
        margin-bottom:26px;
    }

    .pgifHomeHeroBtns{
        width:100%;
        flex-direction:column;
        align-items:stretch;
    }

    .pgifHomeHeroBtn{
        width:100%;
        padding:13px 18px;
    }

    .pgifHomeHeroGlassCard{
        position:absolute;
        left:4%;
        right:4%;
        bottom:68px;
        width:auto;
        max-width:none;
        padding:20px;
        border-radius:24px;
        animation:none;
    }

    .pgifHomeHeroGlassIcon{
        width:46px;
        height:46px;
        border-radius:16px;
        font-size:19px;
        margin-bottom:14px;
    }

    .pgifHomeHeroGlassCard h3{
        font-size:17px;
    }

    .pgifHomeHeroGlassCard p{
        font-size:13px;
        line-height:1.6;
    }

    .pgifHomeHeroControls{
        bottom:26px;
    }

    .pgifHomeHeroArrow{
        display:none;
    }
}

/* =====================================================
   VERY SMALL MOBILE
===================================================== */

@media(max-width:420px){

    .pgifHomeHeroSlider,
    .pgifHomeHeroSlides,
    .pgifHomeHeroSlide{
        min-height:860px;
    }

    .pgifHomeHeroContent{
        min-height:860px;
        padding-top:88px;
        padding-bottom:315px;
    }

    .pgifHomeHeroContent h1{
        font-size:28px;
    }

    .pgifHomeHeroGlassCard{
        bottom:64px;
    }

    .pgifHomeHeroDot.active{
        width:30px;
    }
}

/* =====================================================
   HOME ABOUT SECTION - RESPONSIVE PREMIUM VERSION
===================================================== */

.pgifHomeAboutPro{
    position:relative;
    overflow:hidden;
    padding:115px 0;
    background:
        radial-gradient(circle at 10% 20%, rgba(25,118,210,.10), transparent 30%),
        radial-gradient(circle at 85% 15%, rgba(76,175,80,.10), transparent 32%),
        linear-gradient(135deg,#ffffff,#f8fbff);
}

.pgifHomeAboutPro *{
    box-sizing:border-box;
}

.pgifHomeAboutPro__container{
    width:90%;
    max-width:1180px;
    margin:0 auto;
    position:relative;
    z-index:2;
}

/* BACKGROUND GLOWS */
.pgifHomeAboutPro__glow{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
    filter:blur(70px);
    opacity:.32;
    animation:pgifAboutProFloat 8s ease-in-out infinite;
}

.pgifHomeAboutPro__glow--blue{
    width:260px;
    height:260px;
    background:#1976D2;
    left:-90px;
    top:110px;
}

.pgifHomeAboutPro__glow--green{
    width:300px;
    height:300px;
    background:#4CAF50;
    right:-130px;
    bottom:140px;
    animation-delay:.6s;
}

/* TOP LAYOUT */
.pgifHomeAboutPro__top{
    display:grid;
    grid-template-columns:1fr 1.05fr;
    gap:55px;
    align-items:center;
    margin-bottom:52px;
}

/* INTRO */
.pgifHomeAboutPro__intro{
    animation:pgifAboutProReveal .9s ease forwards;
}

.pgifHomeAboutPro__label{
    display:inline-flex;
    padding:8px 14px;
    border-radius:999px;
    background:#eef6ff;
    color:#1976D2;
    font-size:12px;
    font-weight:900;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:18px;
}

.pgifHomeAboutPro__intro h2{
    font-size:46px;
    line-height:1.08;
    letter-spacing:-1.3px;
    color:#111827;
    margin-bottom:20px;
}

.pgifHomeAboutPro__intro p{
    color:#5b6472;
    font-size:16px;
    line-height:1.9;
    max-width:580px;
}

/* STATEMENT */
.pgifHomeAboutPro__statement{
    margin-top:25px;
    padding:22px;
    border-radius:26px;
    background:rgba(255,255,255,.88);
    border:1px solid rgba(0,0,0,.06);
    box-shadow:0 18px 45px rgba(0,0,0,.055);
    display:flex;
    gap:15px;
    align-items:flex-start;
}

.pgifHomeAboutPro__statement i{
    width:44px;
    height:44px;
    min-width:44px;
    border-radius:16px;
    background:linear-gradient(135deg,#1976D2,#7B1FA2);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
}

.pgifHomeAboutPro__statement span{
    color:#374151;
    line-height:1.75;
    font-weight:600;
    font-size:14px;
}

/* BUTTONS */
.pgifHomeAboutPro__actions{
    margin-top:30px;
    display:flex;
    gap:13px;
    flex-wrap:wrap;
}

.pgifHomeAboutPro__btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:14px 24px;
    border-radius:999px;
    text-decoration:none;
    font-size:14px;
    font-weight:900;
    transition:.35s ease;
}

.pgifHomeAboutPro__btn--primary{
    background:linear-gradient(135deg,#1976D2,#4CAF50);
    color:#fff;
    box-shadow:0 16px 36px rgba(25,118,210,.22);
}

.pgifHomeAboutPro__btn--secondary{
    background:#fff;
    color:#1976D2;
    border:1px solid rgba(25,118,210,.18);
}

.pgifHomeAboutPro__btn:hover{
    transform:translateY(-4px);
}

/* TILES */
.pgifHomeAboutPro__tiles{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:18px;
}

.pgifHomeAboutPro__tile{
    position:relative;
    overflow:hidden;
    min-height:230px;
    border-radius:28px;
    padding:28px;
    background:#fff;
    border:1px solid rgba(0,0,0,.06);
    box-shadow:0 18px 48px rgba(0,0,0,.06);
    transition:.35s ease;
    animation:pgifAboutProReveal .9s ease forwards;
}

.pgifHomeAboutPro__tile:nth-child(1){animation-delay:.1s;}
.pgifHomeAboutPro__tile:nth-child(2){animation-delay:.2s;}
.pgifHomeAboutPro__tile:nth-child(3){animation-delay:.3s;}
.pgifHomeAboutPro__tile:nth-child(4){animation-delay:.4s;}

.pgifHomeAboutPro__tile::before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.08;
}

.pgifHomeAboutPro__tile:hover{
    transform:translateY(-8px);
    box-shadow:0 28px 75px rgba(0,0,0,.10);
}

.pgifHomeAboutPro__tile i,
.pgifHomeAboutPro__tile h3,
.pgifHomeAboutPro__tile p{
    position:relative;
    z-index:2;
}

.pgifHomeAboutPro__tile i{
    width:58px;
    height:58px;
    border-radius:19px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:23px;
    margin-bottom:18px;
}

.pgifHomeAboutPro__tile h3{
    color:#111827;
    font-size:20px;
    margin-bottom:10px;
}

.pgifHomeAboutPro__tile p{
    color:#6b7280;
    font-size:14px;
    line-height:1.7;
}

.pgifHomeAboutPro__tile--blue::before{background:#1976D2;}
.pgifHomeAboutPro__tile--purple::before{background:#7B1FA2;}
.pgifHomeAboutPro__tile--green::before{background:#4CAF50;}
.pgifHomeAboutPro__tile--gold::before{background:#FB8C00;}

.pgifHomeAboutPro__tile--blue i{background:linear-gradient(135deg,#1976D2,#42A5F5);}
.pgifHomeAboutPro__tile--purple i{background:linear-gradient(135deg,#7B1FA2,#BA68C8);}
.pgifHomeAboutPro__tile--green i{background:linear-gradient(135deg,#2E7D32,#66BB6A);}
.pgifHomeAboutPro__tile--gold i{background:linear-gradient(135deg,#FB8C00,#FFB74D);}

/* VISUAL BAND */
.pgifHomeAboutPro__visual{
    position:relative;
    overflow:hidden;
    border-radius:38px;
    box-shadow:0 35px 90px rgba(0,0,0,.16);
    animation:pgifAboutProReveal .9s ease .3s forwards;
    background:#0f172a;
}

.pgifHomeAboutPro__visual img{
    width:100%;
    height:430px;
    object-fit:cover;
    display:block;
    transition:.7s ease;
}

.pgifHomeAboutPro__visual:hover img{
    transform:scale(1.05);
}

.pgifHomeAboutPro__visualOverlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(15,23,42,.78),
            rgba(15,23,42,.48),
            rgba(15,23,42,.22)
        );
}

/* MISSION CARD */
.pgifHomeAboutPro__missionCard{
    position:absolute;
    left:32px;
    bottom:32px;
    width:min(520px, calc(100% - 64px));
    padding:30px;
    border-radius:28px;
    background:rgba(255,255,255,.15);
    border:1px solid rgba(255,255,255,.26);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    color:#fff;
}

.pgifHomeAboutPro__missionCard span{
    display:inline-block;
    color:#FBC02D;
    font-size:12px;
    font-weight:900;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:10px;
}

.pgifHomeAboutPro__missionCard h3{
    font-size:30px;
    line-height:1.2;
    margin-bottom:10px;
    color:#fff;
}

.pgifHomeAboutPro__missionCard p{
    color:rgba(255,255,255,.88);
    line-height:1.75;
    font-size:14px;
}

/* STATS */
.pgifHomeAboutPro__stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin-top:22px;
}

.pgifHomeAboutPro__stats div{
    padding:15px;
    border-radius:18px;
    background:rgba(255,255,255,.16);
    border:1px solid rgba(255,255,255,.18);
}

.pgifHomeAboutPro__stats strong{
    display:block;
    font-size:25px;
    color:#FBC02D;
    line-height:1;
    margin-bottom:5px;
}

.pgifHomeAboutPro__stats small{
    color:rgba(255,255,255,.84);
    font-size:12px;
    font-weight:700;
}

/* ANIMATIONS */
@keyframes pgifAboutProReveal{
    from{
        opacity:0;
        transform:translateY(35px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }
}

@keyframes pgifAboutProFloat{
    0%,100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(25px);
    }
}

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

@media(max-width:1050px){

    .pgifHomeAboutPro{
        padding:95px 0;
    }

    .pgifHomeAboutPro__top{
        grid-template-columns:1fr;
        gap:42px;
    }

    .pgifHomeAboutPro__intro h2{
        font-size:38px;
        max-width:720px;
    }

    .pgifHomeAboutPro__intro p{
        max-width:760px;
    }

    .pgifHomeAboutPro__visual img{
        height:420px;
    }
}

/* =====================================================
   MOBILE RESPONSIVE FIX
===================================================== */

@media(max-width:700px){

    .pgifHomeAboutPro{
        padding:78px 0;
    }

    .pgifHomeAboutPro__container{
        width:92%;
    }

    .pgifHomeAboutPro__top{
        gap:34px;
        margin-bottom:38px;
    }

    .pgifHomeAboutPro__label{
        font-size:10px;
        letter-spacing:1.5px;
        padding:7px 12px;
    }

    .pgifHomeAboutPro__intro h2{
        font-size:30px;
        line-height:1.16;
        letter-spacing:-.7px;
    }

    .pgifHomeAboutPro__intro p{
        font-size:14px;
        line-height:1.8;
    }

    .pgifHomeAboutPro__statement{
        padding:18px;
        border-radius:22px;
        flex-direction:column;
    }

    .pgifHomeAboutPro__statement span{
        font-size:13px;
        line-height:1.7;
    }

    .pgifHomeAboutPro__actions{
        flex-direction:column;
    }

    .pgifHomeAboutPro__btn{
        width:100%;
    }

    .pgifHomeAboutPro__tiles{
        grid-template-columns:1fr;
    }

    .pgifHomeAboutPro__tile{
        min-height:auto;
        padding:24px;
        border-radius:24px;
    }

    .pgifHomeAboutPro__tile h3{
        font-size:18px;
    }

    .pgifHomeAboutPro__tile p{
        font-size:13px;
    }

    /* IMPORTANT FIX:
       On mobile the image and card stop using absolute overlay.
       This prevents invisible/hidden text.
    */

    .pgifHomeAboutPro__visual{
        border-radius:28px;
        overflow:visible;
        background:transparent;
        box-shadow:none;
    }

    .pgifHomeAboutPro__visual img{
        height:260px;
        border-radius:28px;
        box-shadow:0 22px 55px rgba(0,0,0,.14);
    }

    .pgifHomeAboutPro__visual:hover img{
        transform:none;
    }

    .pgifHomeAboutPro__visualOverlay{
        display:none;
    }

    .pgifHomeAboutPro__missionCard{
        position:relative;
        left:auto;
        bottom:auto;
        width:100%;
        margin-top:18px;
        padding:24px;
        border-radius:26px;
        background:linear-gradient(135deg,#1976D2,#4CAF50);
        border:none;
        color:#fff;
        box-shadow:0 20px 55px rgba(25,118,210,.20);
    }

    .pgifHomeAboutPro__missionCard h3{
        font-size:24px;
    }

    .pgifHomeAboutPro__missionCard p{
        font-size:13px;
        line-height:1.75;
        color:rgba(255,255,255,.9);
    }

    .pgifHomeAboutPro__stats{
        grid-template-columns:1fr;
        gap:10px;
    }

    .pgifHomeAboutPro__stats div{
        padding:14px;
    }
}

/* EXTRA SMALL DEVICES */
@media(max-width:420px){

    .pgifHomeAboutPro__intro h2{
        font-size:27px;
    }

    .pgifHomeAboutPro__visual img{
        height:230px;
    }

    .pgifHomeAboutPro__missionCard{
        padding:20px;
    }

    .pgifHomeAboutPro__missionCard h3{
        font-size:22px;
    }
}



/* =====================================================
   TRANSFORMATION MODEL - FINAL VERSION (WITH FLOW LINE)
===================================================== */

.pgif-transform {
    padding: 110px 8%;
    background: linear-gradient(180deg, #f8fafc, #ffffff);
    position: relative;
    overflow: hidden;
}

/* HEADER */
.pgif-transform-header {
    text-align: center;
    max-width: 750px;
    margin: auto;
    margin-bottom: 70px;
}

.pgif-transform-header h2 {
    font-size: 38px;
    margin-top: 10px;
}

/* FLOW WRAPPER */
.pgif-flow-wrapper {
    display: flex;
    justify-content: space-between;
    gap: 25px;
    position: relative;
    z-index: 2;
}

/* ================= ANIMATED TRANSFORMATION LINE ================= */
.pgif-flow-line {
    position: absolute;
    top: 70px;
    left: 5%;
    right: 5%;
    height: 5px;
    background: linear-gradient(90deg,
        #1976D2,
        #4CAF50,
        #FBC02D,
        #7B1FA2
    );
    border-radius: 50px;
    overflow: hidden;
}

/* moving glow effect */
.pgif-flow-line::after {
    content: "";
    position: absolute;
    width: 30%;
    height: 100%;
    background: rgba(255,255,255,0.6);
    top: 0;
    left: -40%;
    transform: skewX(-25deg);
    animation: flowMove 3.5s infinite;
}

@keyframes flowMove {
    0% { left: -40%; }
    100% { left: 140%; }
}

/* ================= NODE BASE ================= */
.pgif-node {
    flex: 1;
    padding: 25px;
    border-radius: 18px;
    text-align: center;
    color: #fff;
    box-shadow: 0 15px 35px rgba(0,0,0,0.12);
    transition: 0.4s ease;
    position: relative;
    z-index: 2;
}

/* hover */
.pgif-node:hover {
    transform: translateY(-10px) scale(1.04);
}

/* ICON */
.pgif-node-icon {
    width: 45px;
    height: 45px;
    margin: 0 auto 12px;
    border-radius: 50%;
    background: rgba(255,255,255,0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

/* TEXT */
.pgif-node h3 {
    margin-bottom: 10px;
}

.pgif-node p {
    font-size: 13px;
    line-height: 1.6;
    opacity: 0.95;
}

/* ================= COLORS + INDIVIDUAL ANIMATION ================= */

/* SHG */
.pgif-node.shg {
    background: linear-gradient(135deg, #1976D2, #42A5F5);
    animation: float1 6s infinite ease-in-out;
}

/* CBO */
.pgif-node.cbo {
    background: linear-gradient(135deg, #4CAF50, #81C784);
    animation: float2 7s infinite ease-in-out;
}

/* MSME */
.pgif-node.msme {
    background: linear-gradient(135deg, #FBC02D, #FFD54F);
    color: #111;
    animation: float3 8s infinite ease-in-out;
}

.pgif-node.msme .pgif-node-icon {
    background: rgba(0,0,0,0.1);
}

/* SME */
.pgif-node.sme {
    background: linear-gradient(135deg, #7B1FA2, #BA68C8);
    animation: float4 6.5s infinite ease-in-out;
}

/* FLOAT ANIMATIONS */
@keyframes float1 { 0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)} }
@keyframes float2 { 0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)} }
@keyframes float3 { 0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)} }
@keyframes float4 { 0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)} }

/* ================= INSIGHT ================= */
.pgif-transform-note {
    margin-top: 60px;
    text-align: center;
    padding: 18px;
    background: linear-gradient(90deg, #e3f2fd, #e8f5e9);
    border-radius: 12px;
    font-weight: 500;
    color: #1f2937;
    position: relative;
    overflow: hidden;
}

/* shine effect */
.pgif-transform-note::after {
    content: "";
    position: absolute;
    top: 0;
    left: -60%;
    width: 60%;
    height: 100%;
    background: rgba(255,255,255,0.4);
    transform: skewX(-20deg);
    animation: shine 3s infinite;
}

@keyframes shine {
    0% { left: -60%; }
    100% { left: 160%; }
}

/* ================= RESPONSIVE ================= */
@media (max-width: 900px) {

    .pgif-flow-wrapper {
        flex-direction: column;
        align-items: center;
    }

    .pgif-flow-line {
        display: none;
    }

    .pgif-node {
        width: 100%;
        max-width: 360px;
    }
}



/* =====================================================
   PROGRAMS / PORTFOLIO SECTION - PGIF FINAL
===================================================== */

.pgif-programs {
    padding: 110px 8%;
    background: linear-gradient(180deg, #ffffff, #f8fafc);
}

/* HEADER */
.pgif-programs-header {
    text-align: center;
    max-width: 750px;
    margin: auto;
    margin-bottom: 60px;
}

.pgif-programs-header h2 {
    font-size: 38px;
    margin-top: 10px;
}

.pgif-programs-header p {
    color: #4b5563;
}

/* GRID */
.pgif-programs-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

/* CARD BASE */
.pgif-program-card {
    padding: 30px;
    border-radius: 18px;
    background: #ffffff;
    position: relative;
    overflow: hidden;
    transition: all 0.4s ease;
    box-shadow: 0 10px 25px rgba(0,0,0,0.06);
    cursor: default;
}

/* hover */
.pgif-program-card:hover {
    transform: translateY(-12px);
    box-shadow: 0 25px 50px rgba(0,0,0,0.12);
}

/* ICON */
.pgif-program-card .icon {
    font-size: 34px;
    margin-bottom: 12px;
    transition: 0.3s ease;
}

/* icon hover animation */
.pgif-program-card:hover .icon {
    transform: scale(1.2) rotate(6deg);
}

/* TITLE */
.pgif-program-card h3 {
    margin-bottom: 10px;
    font-size: 18px;
}

/* TEXT */
.pgif-program-card p {
    font-size: 14px;
    color: #4b5563;
    line-height: 1.6;
}

/* ================= COLOR IDENTITY SYSTEM ================= */

/* Women */
.pgif-program-card.women {
    border-top: 4px solid #D32F2F;
}
.pgif-program-card.women .icon {
    color: #D32F2F;
}

/* Digital */
.pgif-program-card.digital {
    border-top: 4px solid #1976D2;
}
.pgif-program-card.digital .icon {
    color: #1976D2;
}

/* Green */
.pgif-program-card.green {
    border-top: 4px solid #4CAF50;
}
.pgif-program-card.green .icon {
    color: #4CAF50;
}

/* Agribusiness */
.pgif-program-card.agribusiness {
    border-top: 4px solid #FBC02D;
}
.pgif-program-card.agribusiness .icon {
    color: #FBC02D;
}

/* MSME */
.pgif-program-card.msme {
    border-top: 4px solid #7B1FA2;
}
.pgif-program-card.msme .icon {
    color: #7B1FA2;
}

/* SACCO */
.pgif-program-card.sacco {
    border-top: 4px solid #6D4C41;
}
.pgif-program-card.sacco .icon {
    color: #6D4C41;
}

/* ================= LIGHT SWEEP EFFECT ================= */
.pgif-program-card::after {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 60%;
    height: 100%;
    background: rgba(255,255,255,0.4);
    transform: skewX(-20deg);
    transition: 0.6s;
}

.pgif-program-card:hover::after {
    left: 130%;
}

/* ================= RESPONSIVE ================= */
@media (max-width: 900px) {
    .pgif-programs-grid {
        grid-template-columns: 1fr;
    }
}



/* =====================================================
   IMPACT STATISTICS SECTION - PGIF
===================================================== */

.pgif-stats {
    padding: 110px 8%;
    background: linear-gradient(180deg, #f8fafc, #ffffff);
    text-align: center;
}

/* HEADER */
.pgif-stats-header {
    max-width: 750px;
    margin: auto;
    margin-bottom: 60px;
}

.pgif-stats-header h2 {
    font-size: 38px;
    margin-top: 10px;
}

.pgif-stats-header p {
    color: #4b5563;
}

/* GRID */
.pgif-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
}

/* CARD */
.pgif-stat {
    background: #ffffff;
    padding: 30px;
    border-radius: 18px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.06);
    transition: 0.4s ease;
    position: relative;
    overflow: hidden;
}

/* hover */
.pgif-stat:hover {
    transform: translateY(-10px);
    box-shadow: 0 25px 50px rgba(0,0,0,0.12);
}

/* ICON */
.pgif-stat i {
    font-size: 28px;
    margin-bottom: 10px;
    color: #1976D2;
}

/* NUMBER */
.pgif-stat h3 {
    font-size: 32px;
    color: #111;
    margin: 10px 0;
}

/* TEXT */
.pgif-stat p {
    font-size: 14px;
    color: #4b5563;
}

/* ================= RESPONSIVE ================= */
@media (max-width: 900px) {
    .pgif-stats-grid {
        grid-template-columns: 1fr;
    }
}



/* =====================================================
   HOME PARTNERSHIP ECOSYSTEM SECTION
===================================================== */

.pgifHomePartnersPro{
    position:relative;
    overflow:hidden;
    padding:115px 0;
    background:
        radial-gradient(circle at 12% 20%, rgba(25,118,210,.10), transparent 32%),
        radial-gradient(circle at 88% 80%, rgba(76,175,80,.10), transparent 34%),
        linear-gradient(135deg,#ffffff,#f8fbff);
}

.pgifHomePartnersPro *{
    box-sizing:border-box;
}

.pgifHomePartnersContainer{
    width:90%;
    max-width:1180px;
    margin:0 auto;
    position:relative;
    z-index:2;
}

/* BACKGROUND GLOWS */
.pgifHomePartnersGlow{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
    filter:blur(75px);
    opacity:.28;
    animation:pgifPartnersFloat 8s ease-in-out infinite;
}

.pgifHomePartnersGlow--blue{
    width:260px;
    height:260px;
    background:#1976D2;
    left:-100px;
    top:110px;
}

.pgifHomePartnersGlow--green{
    width:300px;
    height:300px;
    background:#4CAF50;
    right:-130px;
    bottom:120px;
    animation-delay:.7s;
}

.pgifHomePartnersGlow--gold{
    width:170px;
    height:170px;
    background:#FBC02D;
    left:46%;
    top:48%;
    opacity:.20;
    animation-delay:1.2s;
}

/* HEADER */
.pgifHomePartnersHeader{
    max-width:820px;
    margin:0 auto 60px;
    text-align:center;
    animation:pgifPartnersReveal .9s ease forwards;
}

.pgifHomePartnersLabel{
    display:inline-flex;
    padding:8px 14px;
    border-radius:999px;
    background:#eef6ff;
    color:#1976D2;
    font-size:12px;
    font-weight:900;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:16px;
}

.pgifHomePartnersHeader h2{
    font-size:42px;
    line-height:1.18;
    color:#111827;
    letter-spacing:-.8px;
    margin-bottom:16px;
}

.pgifHomePartnersHeader p{
    color:#6b7280;
    line-height:1.85;
    font-size:15px;
}

/* MAIN LAYOUT */
.pgifHomePartnersLayout{
    display:grid;
    grid-template-columns:.85fr 1.45fr;
    gap:32px;
    align-items:stretch;
}

/* LEFT FEATURE */
.pgifHomePartnersFeature{
    position:relative;
    overflow:hidden;
    border-radius:34px;
    padding:36px;
    color:#fff;
    background:
        linear-gradient(135deg,rgba(25,118,210,.96),rgba(123,31,162,.93));
    box-shadow:0 30px 85px rgba(25,118,210,.22);
    animation:pgifPartnersReveal .9s ease .15s both;
}

.pgifHomePartnersFeature::before{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    border-radius:50%;
    right:-110px;
    top:-100px;
    background:rgba(255,255,255,.12);
    animation:pgifPartnersFloat 7s ease-in-out infinite;
}

.pgifHomePartnersFeature::after{
    content:"";
    position:absolute;
    width:180px;
    height:180px;
    border-radius:50%;
    left:-80px;
    bottom:-80px;
    background:rgba(251,192,45,.18);
    filter:blur(3px);
}

.pgifHomePartnersFeature__tag,
.pgifHomePartnersFeature h3,
.pgifHomePartnersFeature p,
.pgifHomePartnersFeature__points,
.pgifHomePartnersBtn{
    position:relative;
    z-index:2;
}

.pgifHomePartnersFeature__tag{
    display:inline-flex;
    padding:8px 13px;
    border-radius:999px;
    background:rgba(255,255,255,.16);
    border:1px solid rgba(255,255,255,.22);
    color:#FBC02D;
    font-size:11px;
    font-weight:900;
    letter-spacing:1.6px;
    text-transform:uppercase;
    margin-bottom:18px;
}

.pgifHomePartnersFeature h3{
    font-size:31px;
    line-height:1.18;
    margin-bottom:16px;
}

.pgifHomePartnersFeature p{
    color:rgba(255,255,255,.88);
    line-height:1.8;
    font-size:14px;
}

.pgifHomePartnersFeature__points{
    margin-top:24px;
    display:grid;
    gap:12px;
}

.pgifHomePartnersFeature__points div{
    display:flex;
    align-items:center;
    gap:10px;
    color:rgba(255,255,255,.90);
    font-size:14px;
    font-weight:600;
}

.pgifHomePartnersFeature__points i{
    color:#FBC02D;
}

.pgifHomePartnersBtn{
    margin-top:28px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:13px 22px;
    border-radius:999px;
    background:#fff;
    color:#1976D2;
    text-decoration:none;
    font-size:14px;
    font-weight:900;
    transition:.35s ease;
}

.pgifHomePartnersBtn:hover{
    transform:translateY(-4px);
    background:#FBC02D;
    color:#111827;
}

/* PARTNER GRID */
.pgifHomePartnersGrid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px;
}

.pgifHomePartnerCard{
    position:relative;
    overflow:hidden;
    min-height:210px;
    padding:22px;
    border-radius:26px;
    background:rgba(255,255,255,.92);
    border:1px solid rgba(0,0,0,.06);
    box-shadow:0 16px 45px rgba(0,0,0,.055);
    transition:.35s ease;
    animation:pgifPartnersReveal .9s ease both;
}

.pgifHomePartnerCard:nth-child(1){animation-delay:.08s;}
.pgifHomePartnerCard:nth-child(2){animation-delay:.14s;}
.pgifHomePartnerCard:nth-child(3){animation-delay:.20s;}
.pgifHomePartnerCard:nth-child(4){animation-delay:.26s;}
.pgifHomePartnerCard:nth-child(5){animation-delay:.32s;}
.pgifHomePartnerCard:nth-child(6){animation-delay:.38s;}
.pgifHomePartnerCard:nth-child(7){animation-delay:.44s;}
.pgifHomePartnerCard:nth-child(8){animation-delay:.50s;}

.pgifHomePartnerCard::before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.08;
    transition:.35s ease;
}

.pgifHomePartnerCard::after{
    content:"";
    position:absolute;
    width:120px;
    height:120px;
    border-radius:50%;
    right:-55px;
    bottom:-55px;
    opacity:.13;
    filter:blur(6px);
}

.pgifHomePartnerCard:hover{
    transform:translateY(-8px);
    box-shadow:0 28px 75px rgba(0,0,0,.10);
}

.pgifHomePartnerCard:hover::before{
    opacity:.13;
}

.pgifHomePartnerCard i,
.pgifHomePartnerCard h3,
.pgifHomePartnerCard p{
    position:relative;
    z-index:2;
}

.pgifHomePartnerCard i{
    width:52px;
    height:52px;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:21px;
    margin-bottom:16px;
}

.pgifHomePartnerCard h3{
    color:#111827;
    font-size:16px;
    line-height:1.3;
    margin-bottom:9px;
}

.pgifHomePartnerCard p{
    color:#6b7280;
    font-size:13px;
    line-height:1.65;
}

/* CARD COLORS */
.pgifHomePartnerCard--blue::before,
.pgifHomePartnerCard--blue::after{background:#1976D2;}
.pgifHomePartnerCard--green::before,
.pgifHomePartnerCard--green::after{background:#4CAF50;}
.pgifHomePartnerCard--gold::before,
.pgifHomePartnerCard--gold::after{background:#FB8C00;}
.pgifHomePartnerCard--purple::before,
.pgifHomePartnerCard--purple::after{background:#7B1FA2;}
.pgifHomePartnerCard--pink::before,
.pgifHomePartnerCard--pink::after{background:#E91E63;}
.pgifHomePartnerCard--teal::before,
.pgifHomePartnerCard--teal::after{background:#009688;}
.pgifHomePartnerCard--indigo::before,
.pgifHomePartnerCard--indigo::after{background:#3949AB;}
.pgifHomePartnerCard--orange::before,
.pgifHomePartnerCard--orange::after{background:#FF7043;}

.pgifHomePartnerCard--blue i{background:linear-gradient(135deg,#1976D2,#42A5F5);}
.pgifHomePartnerCard--green i{background:linear-gradient(135deg,#2E7D32,#66BB6A);}
.pgifHomePartnerCard--gold i{background:linear-gradient(135deg,#FB8C00,#FFB74D);}
.pgifHomePartnerCard--purple i{background:linear-gradient(135deg,#7B1FA2,#BA68C8);}
.pgifHomePartnerCard--pink i{background:linear-gradient(135deg,#E91E63,#F06292);}
.pgifHomePartnerCard--teal i{background:linear-gradient(135deg,#009688,#4CAF50);}
.pgifHomePartnerCard--indigo i{background:linear-gradient(135deg,#3949AB,#7B1FA2);}
.pgifHomePartnerCard--orange i{background:linear-gradient(135deg,#FF7043,#FB8C00);}

/* ANIMATIONS */
@keyframes pgifPartnersReveal{
    from{
        opacity:0;
        transform:translateY(35px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }
}

@keyframes pgifPartnersFloat{
    0%,100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(25px);
    }
}

/* RESPONSIVE */
@media(max-width:1150px){

    .pgifHomePartnersLayout{
        grid-template-columns:1fr;
    }

    .pgifHomePartnersGrid{
        grid-template-columns:repeat(4,1fr);
    }
}

@media(max-width:950px){

    .pgifHomePartnersGrid{
        grid-template-columns:repeat(2,1fr);
    }

    .pgifHomePartnersHeader h2{
        font-size:34px;
    }
}

@media(max-width:620px){

    .pgifHomePartnersPro{
        padding:80px 0;
    }

    .pgifHomePartnersContainer{
        width:92%;
    }

    .pgifHomePartnersHeader{
        margin-bottom:40px;
    }

    .pgifHomePartnersHeader h2{
        font-size:29px;
    }

    .pgifHomePartnersHeader p{
        font-size:14px;
    }

    .pgifHomePartnersFeature{
        padding:28px 22px;
        border-radius:28px;
    }

    .pgifHomePartnersFeature h3{
        font-size:25px;
    }

    .pgifHomePartnersGrid{
        grid-template-columns:1fr;
    }

    .pgifHomePartnerCard{
        min-height:auto;
        padding:24px;
    }

    .pgifHomePartnersBtn{
        width:100%;
    }
}

/* =====================================================
   PGIF CTA SECTION - ELITE VERSION
===================================================== */

.pgif-cta {
    position: relative;
    overflow: hidden;
    padding: 120px 8%;
    background:
        linear-gradient(135deg,
        #1976D2 0%,
        #7B1FA2 40%,
        #4CAF50 100%);
}

/* BLOBS */
.pgif-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(70px);
    opacity: 0.25;
    animation: blobMove 12s infinite ease-in-out;
}

.blob1 {
    width: 300px;
    height: 300px;
    background: #FBC02D;
    top: -100px;
    left: -100px;
}

.blob2 {
    width: 350px;
    height: 350px;
    background: #D32F2F;
    right: -120px;
    top: 50px;
}

.blob3 {
    width: 250px;
    height: 250px;
    background: #ffffff;
    bottom: -100px;
    left: 40%;
}

@keyframes blobMove {
    0%,100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(25px);
    }
}

/* HEADER */
.pgif-cta-header {
    text-align: center;
    max-width: 760px;
    margin: auto;
    margin-bottom: 70px;
    position: relative;
    z-index: 2;
}

.pgif-cta-header h2 {
    font-size: 42px;
    color: #fff;
    margin-top: 12px;
}

.pgif-cta-header p {
    color: rgba(255,255,255,0.9);
    margin-top: 15px;
    line-height: 1.8;
}

/* GRID */
.pgif-cta-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 35px;
    position: relative;
    z-index: 2;
}

/* LEFT */
.pgif-cta-actions {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* CARD */
.cta-card {
    display: flex;
    align-items: flex-start;
    gap: 20px;

    padding: 28px;
    border-radius: 20px;

    background: rgba(255,255,255,0.12);

    backdrop-filter: blur(12px);

    border: 1px solid rgba(255,255,255,0.2);

    transition: 0.4s ease;
}

.cta-card:hover {
    transform: translateY(-10px);
    background: rgba(255,255,255,0.18);
}

/* ICON */
.cta-card i {
    font-size: 28px;
    color: #fff;
}

/* TEXT */
.cta-card h3 {
    color: #fff;
    margin-bottom: 8px;
}

.cta-card p {
    color: rgba(255,255,255,0.88);
    line-height: 1.7;
    font-size: 14px;
}

/* FORM */
.pgif-cta-form {
    background: rgba(255,255,255,0.15);

    backdrop-filter: blur(14px);

    padding: 35px;

    border-radius: 24px;

    border: 1px solid rgba(255,255,255,0.2);
}

.pgif-cta-form h3 {
    color: #fff;
    margin-bottom: 20px;
}

/* INPUTS */
.pgif-cta-form input,
.pgif-cta-form textarea {
    width: 100%;
    margin-bottom: 15px;
    padding: 14px;

    border: none;
    border-radius: 12px;

    background: rgba(255,255,255,0.9);

    font-size: 14px;
    outline: none;
}

/* BUTTON WRAPPER */
.pgif-submit-options {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

/* BUTTONS */
.pgif-submit-options button {
    flex: 1;
    border: none;
    border-radius: 12px;
    padding: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: 0.3s ease;
}

/* EMAIL */
.email-btn {
    background: #1976D2;
    color: #fff;
}

.email-btn:hover {
    background: #125ca8;
    transform: translateY(-3px);
}

/* WHATSAPP */
.whatsapp-btn {
    background: #25D366;
    color: #fff;
}

.whatsapp-btn:hover {
    background: #1da851;
    transform: translateY(-3px);
}

/* RESPONSIVE */
@media (max-width: 900px) {

    .pgif-cta-grid {
        grid-template-columns: 1fr;
    }

}


/* =====================================================
   HOW PGIF WORKS - PROCESS SECTION
===================================================== */

.pgif-process{
    position:relative;
    overflow:hidden;
    padding:120px 8%;
    background:linear-gradient(180deg,#ffffff,#f8fafc);
}

/* floating blobs */
.pgif-process-blob{
    position:absolute;
    border-radius:50%;
    filter:blur(80px);
    opacity:.18;
    animation:processFloat 10s ease-in-out infinite;
}

.blob-a{
    width:280px;
    height:280px;
    background:#1976D2;
    left:-80px;
    top:100px;
}

.blob-b{
    width:320px;
    height:320px;
    background:#4CAF50;
    right:-120px;
    bottom:80px;
}

@keyframes processFloat{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(30px);}
}

/* header */
.pgif-process-header{
    text-align:center;
    max-width:760px;
    margin:auto;
    margin-bottom:70px;
    position:relative;
    z-index:2;
}

.pgif-process-header h2{
    font-size:40px;
    margin-top:10px;
}

.pgif-process-header p{
    color:#4b5563;
    line-height:1.8;
}

/* timeline */
.pgif-process-timeline{
    position:relative;
    max-width:1000px;
    margin:auto;
    z-index:2;
}

/* center line */
.pgif-process-timeline::before{
    content:"";
    position:absolute;
    left:50%;
    top:0;
    transform:translateX(-50%);
    width:6px;
    height:100%;
    border-radius:30px;
    background:linear-gradient(
        to bottom,
        #1976D2,
        #7B1FA2,
        #4CAF50
    );
    animation:linePulse 3s infinite;
}

@keyframes linePulse{
    0%,100%{opacity:1;}
    50%{opacity:.65;}
}

/* step wrapper */
.pgif-step{
    position:relative;
    width:50%;
    padding:20px 40px;
    margin-bottom:35px;
}

.pgif-step.left{
    left:0;
    text-align:right;
}

.pgif-step.right{
    left:50%;
    text-align:left;
}

/* step dot */
.pgif-step::before{
    content:"";
    position:absolute;
    top:45px;
    width:22px;
    height:22px;
    border-radius:50%;
    background:#fff;
    border:5px solid #1976D2;
    z-index:3;
    box-shadow:0 0 0 8px rgba(25,118,210,.12);
}

.pgif-step.left::before{
    right:-11px;
}

.pgif-step.right::before{
    left:-11px;
}

/* card */
.pgif-step-card{
    background:rgba(255,255,255,.85);
    backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,.7);
    border-radius:22px;
    padding:28px;
    box-shadow:0 15px 35px rgba(0,0,0,.08);
    transition:.4s ease;
}

.pgif-step-card:hover{
    transform:translateY(-10px);
    box-shadow:0 30px 60px rgba(0,0,0,.14);
}

/* icon */
.pgif-step-card i{
    font-size:30px;
    color:#1976D2;
    margin-bottom:12px;
}

/* title */
.pgif-step-card h3{
    margin-bottom:10px;
    font-size:20px;
}

/* text */
.pgif-step-card p{
    color:#4b5563;
    line-height:1.7;
    font-size:14px;
}

/* responsive */
@media(max-width:900px){

    .pgif-process-timeline::before{
        left:20px;
    }

    .pgif-step{
        width:100%;
        left:0 !important;
        padding-left:60px;
        padding-right:10px;
        text-align:left !important;
    }

    .pgif-step::before{
        left:9px !important;
        right:auto;
    }
}