/* =========================================================
   AARAV DIGITAL PRO
   HERO SECTION — FRESH CSS
   ========================================================= */

#adp-hero{
    position:relative;
    width:100%;
    min-height:125px;
    background:#030303;
    color:#fff;
    overflow:hidden;
    isolation:isolate;
    box-sizing:border-box;
}

#adp-hero *,
#adp-hero *::before,
#adp-hero *::after{
    box-sizing:border-box;
}


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

.adp-hero-container{
    position:relative;
    z-index:5;

    width:min(1400px, 100%);
    min-height:720px;

    margin:0 auto;
    padding:80px 50px 45px;

    display:grid;
    grid-template-columns:minmax(0, 48%) minmax(0, 52%);
    align-items:center;

    gap:25px;
}


/* =========================================================
   LEFT SIDE
   ========================================================= */

.adp-hero-content{
    position:relative;
    z-index:10;
    min-width:0;
}


/* =========================================================
   TRUST BADGE
   ========================================================= */

.adp-hero-trust{
    display:inline-flex;
    align-items:center;
    gap:14px;

    min-height:42px;
    padding:8px 18px;

    border:1px solid rgba(245,190,35,.65);
    border-radius:999px;

    background:rgba(255,255,255,.025);

    box-shadow:
        0 0 20px rgba(245,190,35,.05);

    white-space:nowrap;
}

.adp-trust-stars{
    color:#ffc62e;
    font-size:17px;
    letter-spacing:2px;
    line-height:1;
}

.adp-trust-text{
    color:#e5e5e5;
    font-size:14px;
    font-weight:500;
}


/* =========================================================
   EYEBROW
   ========================================================= */

.adp-hero-eyebrow{
    display:flex;
    align-items:center;
    gap:12px;

    margin-top:27px;
    margin-bottom:15px;

    color:#f6c229;

    font-size:15px;
    font-weight:700;

    letter-spacing:3px;
}

.adp-hero-eyebrow span{
    display:block;

    width:30px;
    height:2px;

    background:#f6c229;
}


/* =========================================================
   MAIN HEADING
   ========================================================= */

.adp-hero-title{
    margin:0;

    max-width:650px;

    font-size:clamp(52px, 5vw, 82px);
    line-height:.94;
    letter-spacing:-3px;

    font-weight:800;
}

.adp-title-white{
    color:#fff;
}

.adp-title-gold{
    color:#f5bc28;
}


/* =========================================================
   DESCRIPTION
   ========================================================= */

.adp-hero-description{
    max-width:590px;

    margin:27px 0 0;

    color:#b9b9b9;

    font-size:18px;
    line-height:1.7;
}


/* =========================================================
   BUTTONS
   ========================================================= */

.adp-hero-actions{
    display:flex;
    align-items:center;
    gap:18px;

    margin-top:30px;
}

.adp-hero-btn{
    min-height:60px;

    display:inline-flex;
    align-items:center;
    justify-content:space-between;

    gap:20px;

    padding:7px 10px 7px 27px;

    border-radius:999px;

    text-decoration:none;

    font-size:16px;
    font-weight:700;

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        background .25s ease;
}

.adp-hero-btn:hover{
    transform:translateY(-2px);
}


/* PRIMARY */

.adp-hero-btn-primary{
    min-width:245px;

    color:#080808;

    background:#f8c63d;

    box-shadow:
        0 0 30px rgba(248,198,61,.25);
}

.adp-btn-arrow{
    width:42px;
    height:42px;

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

    border-radius:50%;

    background:rgba(0,0,0,.10);

    font-size:20px;
}


/* SECONDARY */

.adp-hero-btn-secondary{
    min-width:245px;

    color:#fff;

    border:1px solid rgba(245,190,35,.7);

    background:rgba(0,0,0,.25);
}

.adp-btn-play{
    width:40px;
    height:40px;

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

    border:1px solid rgba(255,255,255,.8);
    border-radius:50%;

    font-size:12px;
}


/* =========================================================
   STATS
   ========================================================= */

.adp-hero-stats{
    width:100%;
    max-width:600px;

    margin-top:35px;
    padding:13px 20px;

    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr;
    align-items:center;

    border:1px solid rgba(245,190,35,.65);
    border-radius:18px;

    background:rgba(8,8,8,.7);

    box-shadow:
        inset 0 0 30px rgba(245,190,35,.025);
}

.adp-hero-stat{
    display:flex;
    align-items:center;
    gap:12px;

    min-width:0;
}

.adp-stat-icon{
    width:42px;
    height:42px;

    flex:0 0 42px;

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

    border:1px solid rgba(245,190,35,.55);
    border-radius:12px;

    background:#101010;

    font-size:20px;
}

.adp-stat-content{
    display:flex;
    flex-direction:column;
}

.adp-stat-content strong{
    color:#fff;

    font-size:25px;
    line-height:1;
}

.adp-stat-content span{
    margin-top:5px;

    color:#999;

    font-size:12px;
    line-height:1.25;
}

.adp-stat-divider{
    width:1px;
    height:38px;

    background:rgba(255,255,255,.15);
}


/* =========================================================
   RIGHT ANALYTICS AREA
   ========================================================= */

.adp-hero-visual{
    position:relative;

    width:100%;
    min-width:0;
    min-height:570px;

    display:grid;

    grid-template-columns:minmax(0, 1fr) 225px;
    grid-template-rows:auto 115px;

    gap:20px;

    align-items:start;
}


/* =========================================================
   GROWTH GRAPH
   ========================================================= */

.adp-growth-card{
    position:relative;

    width:100%;
    min-width:0;
    height:445px;

    padding:27px 28px 18px;

    border:1px solid rgba(245,190,35,.65);
    border-radius:24px;

    background:
        linear-gradient(
            145deg,
            rgba(25,24,19,.92),
            rgba(7,7,6,.96)
        );

    overflow:hidden;

    grid-column:1;
    grid-row:1;
}


/* GRAPH HEADER */

.adp-growth-header{
    position:relative;
    z-index:3;

    display:flex;
    align-items:flex-start;
    justify-content:space-between;

    gap:15px;
}

.adp-growth-title{
    display:flex;
    flex-direction:column;
}

.adp-growth-title > span{
    color:#a9a9a9;
    font-size:14px;
}

.adp-growth-title strong{
    margin-top:10px;

    color:#f7c83d;

    font-size:42px;
    line-height:1;
}

.adp-growth-title small{
    margin-top:8px;

    color:#ddd;
    font-size:13px;
}

.adp-growth-title p{
    margin:8px 0 0;

    color:#8f8f8f;
    font-size:12px;
}


/* STATUS */

.adp-growth-status{
    display:flex;
    align-items:center;
    gap:8px;

    padding:9px 13px;

    border:1px solid rgba(245,190,35,.4);
    border-radius:999px;

    color:#ddd;

    font-size:12px;

    white-space:nowrap;
}

.adp-growth-status i{
    width:8px;
    height:8px;

    border-radius:50%;

    background:#39c957;

    box-shadow:0 0 10px #39c957;
}

.adp-growth-status b{
    color:#f5c433;
}


/* =========================================================
   GRAPH
   ========================================================= */

.adp-growth-graph{
    position:absolute;

    left:28px;
    right:28px;
    bottom:38px;

    height:245px;

    overflow:hidden;
}

.adp-graph-grid{
    position:absolute;
    inset:0;

    display:flex;
    flex-direction:column;
    justify-content:space-between;
}

.adp-graph-grid span{
    width:100%;
    height:1px;

    background:rgba(255,255,255,.08);
}


/* GRAPH AREA */

.adp-graph-area{
    position:absolute;

    left:0;
    right:0;
    bottom:0;

    height:100%;

    background:
        linear-gradient(
            to top,
            rgba(245,190,35,.25),
            rgba(245,190,35,0)
        );

    clip-path:polygon(
        0 92%,
        9% 74%,
        18% 78%,
        27% 58%,
        36% 62%,
        45% 38%,
        54% 44%,
        63% 20%,
        72% 24%,
        81% 12%,
        90% 4%,
        100% 0,
        100% 100%,
        0 100%
    );
}


/* GOLD GRAPH LINE */

.adp-graph-line{
    position:absolute;

    inset:0;

    z-index:2;
}

.adp-graph-line span{
    position:absolute;

    inset:0;

    background:#f8c83f;

    clip-path:polygon(
        0 91%,
        9% 73%,
        18% 77%,
        27% 57%,
        36% 61%,
        45% 37%,
        54% 43%,
        63% 19%,
        72% 23%,
        81% 11%,
        90% 3%,
        100% 0,

        100% 2%,
        90% 5%,
        81% 13%,
        72% 25%,
        63% 21%,
        54% 45%,
        45% 39%,
        36% 63%,
        27% 59%,
        18% 79%,
        9% 75%,
        0 93%
    );

    filter:
        drop-shadow(0 0 5px rgba(248,200,63,.8));
}


/* MONTHS */

.adp-growth-months{
    position:absolute;

    left:28px;
    right:28px;
    bottom:12px;

    display:flex;
    justify-content:space-between;

    color:#777;

    font-size:11px;
}


/* =========================================================
   RIGHT 3 CARDS
   ========================================================= */

.adp-growth-side-cards{
    width:100%;

    display:flex;
    flex-direction:column;

    gap:15px;

    grid-column:2;
    grid-row:1;
}


/* CARD */

.adp-floating-card{
    width:100%;
    min-height:116px;

    display:flex;
    align-items:center;

    gap:15px;

    padding:18px;

    border:1px solid rgba(245,190,35,.65);
    border-radius:20px;

    background:
        linear-gradient(
            145deg,
            rgba(20,20,18,.96),
            rgba(4,4,4,.98)
        );

    box-shadow:
        0 15px 40px rgba(0,0,0,.25);
}


/* ICON */

.adp-floating-icon{
    width:55px;
    height:55px;

    flex:0 0 55px;

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

    border-radius:12px;

    background:#f4bd27;

    color:#050505;

    font-size:25px;
    font-weight:700;
}

.adp-google-icon{
    background:#fff;
    color:#4285f4;
}


/* CONTENT */

.adp-floating-content{
    min-width:0;

    display:flex;
    flex-direction:column;
}

.adp-floating-content span{
    color:#8f8f8f;

    font-size:11px;
}

.adp-floating-content strong{
    margin-top:4px;

    color:#fff;

    font-size:20px;
    line-height:1.1;
}

.adp-floating-content small{
    margin-top:5px;

    color:#777;

    font-size:9px;
}


/* =========================================================
   CONVERSION CARD
   ========================================================= */

.adp-conversion-card{
    width:100%;
    height:115px;

    display:flex;
    align-items:center;

    gap:17px;

    padding:16px 20px;

    border:1px solid rgba(245,190,35,.65);
    border-radius:20px;

    background:#090909;

    grid-column:1;
    grid-row:2;
}


/* CIRCLE */

.adp-conversion-circle{
    position:relative;

    width:70px;
    height:70px;

    flex:0 0 70px;

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

    border-radius:50%;

    background:
        conic-gradient(
            #f8c83f 0deg 259deg,
            #252525 259deg 360deg
        );
}

.adp-conversion-circle::before{
    content:"";

    position:absolute;

    width:54px;
    height:54px;

    border-radius:50%;

    background:#090909;
}

.adp-conversion-circle span{
    position:relative;
    z-index:2;

    color:#fff;

    font-size:13px;
    font-weight:700;
}

.adp-conversion-content{
    display:flex;
    flex-direction:column;
}

.adp-conversion-content span{
    color:#999;
    font-size:12px;
}

.adp-conversion-content strong{
    margin-top:4px;

    color:#fff;

    font-size:20px;
}

.adp-conversion-content small{
    margin-top:4px;

    color:#f8c83f;

    font-size:11px;
}


/* =========================================================
   DATA DRIVEN BADGE
   ========================================================= */

.adp-data-badge{
    align-self:center;
    justify-self:start;

    padding:12px 20px;

    border:1px solid rgba(245,190,35,.7);
    border-radius:999px;

    background:#050505;

    color:#fff;

    font-size:12px;
    white-space:nowrap;

    grid-column:2;
    grid-row:2;
}

.adp-data-badge span{
    margin-right:8px;
    color:#f8c83f;
}


/* =========================================================
   ORBIT BACKGROUND
   ========================================================= */

.adp-hero-orbit{
    position:absolute;

    pointer-events:none;

    border:1px solid rgba(245,190,35,.18);

    border-radius:50%;

    z-index:1;
}

.adp-hero-orbit-main{
    width:760px;
    height:760px;

    left:-330px;
    top:-110px;

    background:
        radial-gradient(
            circle,
            rgba(245,190,35,.06),
            transparent 65%
        );
}

.adp-hero-orbit-inner{
    width:620px;
    height:620px;

    left:-260px;
    top:-40px;

    opacity:.65;
}


/* =========================================================
   MOVING BALL
   EXACTLY ON CIRCLE BORDER
   ========================================================= */

.adp-orbit-ball{
    position:absolute;

    width:13px;
    height:13px;

    left:50%;
    top:-7px;

    border-radius:50%;

    background:#ffd34d;

    box-shadow:
        0 0 8px #ffd34d,
        0 0 20px rgba(255,211,77,.9),
        0 0 35px rgba(255,211,77,.5);

    transform-origin:
        50% calc(50% + 380px);

    animation:
        adp-orbit-move 10s linear infinite;
}

@keyframes adp-orbit-move{

    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }

}


/* =========================================================
   BOTTOM GLOW
   ========================================================= */

.adp-hero-bottom-glow{
    position:absolute;

    left:0;
    right:0;
    bottom:-120px;

    height:240px;

    background:
        radial-gradient(
            ellipse,
            rgba(245,190,35,.20),
            transparent 65%
        );

    filter:blur(30px);

    pointer-events:none;

    z-index:1;
}


/* =========================================================
   DESKTOP LARGE
   ========================================================= */

@media (min-width:1500px){

    .adp-hero-container{
        padding-left:70px;
        padding-right:70px;
    }

    .adp-hero-title{
        font-size:86px;
    }

}


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

@media (max-width:768px){

    .adp-hero-container{
        grid-template-columns:1fr;

        padding:70px 35px 45px;
    }

    .adp-hero-content{
        max-width:700px;
        margin:0 auto;
        text-align:center;
    }

    .adp-hero-eyebrow{
        justify-content:center;
    }

    .adp-hero-description{
        margin-left:auto;
        margin-right:auto;
    }

    .adp-hero-actions{
        justify-content:center;
    }

    .adp-hero-stats{
        margin-left:auto;
        margin-right:auto;
    }

    .adp-hero-visual{
        max-width:850px;
        margin:30px auto 0;
    }

}


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

@media (max-width:700px){

    #adp-hero{
        min-height:auto;
    }

    .adp-hero-container{
        width:100%;
        min-height:auto;

        padding:55px 20px 45px;

        display:flex;
        flex-direction:column;

        gap:40px;
    }


    /* CONTENT */

    .adp-hero-content{
        width:100%;
        max-width:none;
    }

    .adp-hero-trust{
        width:100%;

        justify-content:center;

        padding:11px 14px;
    }

    .adp-trust-stars{
        font-size:15px;
    }

    .adp-trust-text{
        font-size:13px;
    }

    .adp-hero-eyebrow{
        justify-content:center;

        margin-top:25px;

        font-size:13px;
        letter-spacing:2.3px;
    }

    .adp-hero-eyebrow span{
        width:22px;
    }


    .adp-hero-title{
        max-width:none;

        font-size:clamp(45px, 13vw, 64px);

        line-height:.96;
        letter-spacing:-2px;

        text-align:center;
    }

    .adp-hero-description{
        max-width:none;

        margin-top:22px;

        font-size:16px;
        line-height:1.7;

        text-align:center;
    }


    /* BUTTONS */

    .adp-hero-actions{
        width:100%;

        flex-direction:column;

        gap:13px;

        margin-top:27px;
    }

    .adp-hero-btn{
        width:100%;
        min-width:0;

        min-height:58px;
    }


    /* STATS */

    .adp-hero-stats{
        width:100%;

        grid-template-columns:1fr 1fr;
        gap:20px;

        padding:20px;

        border-radius:20px;
    }

    .adp-stat-divider{
        display:none;
    }

    .adp-hero-stat{
        justify-content:center;

        flex-direction:column;

        text-align:center;
    }

    .adp-hero-stat:last-child{
        grid-column:1 / -1;
    }


    /* ANALYTICS */

    .adp-hero-visual{
        width:100%;
        min-height:auto;

        display:flex;
        flex-direction:column;

        gap:18px;

        margin:0;
    }


    /* GRAPH */

    .adp-growth-card{
        width:100%;
        height:420px;

        padding:24px 20px 15px;

        border-radius:22px;
    }

    .adp-growth-title strong{
        font-size:38px;
    }

    .adp-growth-status{
        font-size:11px;
    }

    .adp-growth-graph{
        left:20px;
        right:20px;

        height:220px;
    }

    .adp-growth-months{
        left:20px;
        right:20px;
    }


    /* SIDE CARDS */

    .adp-growth-side-cards{
        width:100%;

        display:grid;
        grid-template-columns:1fr;

        gap:12px;
    }

    .adp-floating-card{
        min-height:95px;

        border-radius:18px;
    }


    /* CONVERSION */

    .adp-conversion-card{
        width:100%;
        height:105px;

        border-radius:18px;
    }


    /* DATA */

    .adp-data-badge{
        align-self:center;
        justify-self:center;

        grid-column:auto;
        grid-row:auto;
    }


    /* ORBITS */

    .adp-hero-orbit-main{
        width:620px;
        height:620px;

        left:-300px;
        top:100px;
    }

    .adp-hero-orbit-inner{
        width:500px;
        height:500px;

        left:-240px;
        top:160px;
    }

    .adp-orbit-ball{
        transform-origin:
            50% calc(50% + 310px);
    }

}


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

@media (max-width:420px){

    .adp-hero-container{
        padding-left:16px;
        padding-right:16px;
    }

    .adp-hero-title{
        font-size:43px;
    }

    .adp-hero-description{
        font-size:15px;
    }

    .adp-hero-stats{
        padding:17px 12px;
    }

    .adp-stat-icon{
        width:40px;
        height:40px;
        flex-basis:40px;
    }

    .adp-stat-content strong{
        font-size:23px;
    }

    .adp-growth-card{
        height:390px;
    }

}
/* =========================================================
   ADP HERO - MOBILE RESPONSIVE
   Desktop layout ko touch nahi karega
========================================================= */

@media (max-width: 768px){

    /* Prevent horizontal scrolling */
    html,
    body{
        overflow-x:hidden !important;
        width:100%;
    }

    #adp-hero.adp-hero{
        width:100% !important;
        max-width:100% !important;
        min-height:auto !important;

        margin:0 !important;
        padding:0 !important;

        overflow:hidden !important;
    }


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

    .adp-hero-container{
        width:100% !important;
        max-width:100% !important;

        min-height:auto !important;

        margin:0 !important;

        padding:55px 20px 60px !important;

        display:flex !important;
        flex-direction:column !important;

        gap:45px !important;

        box-sizing:border-box !important;
    }


    /* =========================================
       LEFT CONTENT
    ========================================== */

    .adp-hero-content{
        width:100% !important;
        max-width:100% !important;

        text-align:center !important;

        display:flex;
        flex-direction:column;
        align-items:center;
    }


    /* TRUST BADGE */

    .adp-hero-trust{
        width:auto !important;
        max-width:100% !important;

        padding:12px 18px !important;

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

        gap:9px !important;

        box-sizing:border-box;
    }

    .adp-trust-stars{
        font-size:18px !important;
        white-space:nowrap;
    }

    .adp-trust-text{
        font-size:13px !important;
        white-space:nowrap;
    }


    /* EYEBROW */

    .adp-hero-eyebrow{
        justify-content:center !important;

        margin-top:28px !important;

        font-size:13px !important;

        text-align:center !important;
    }

    .adp-hero-eyebrow span{
        display:none;
    }


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

    .adp-hero-title{
        width:100% !important;

        margin:18px 0 0 !important;

        font-size:clamp(42px, 11vw, 64px) !important;

        line-height:.95 !important;

        letter-spacing:-2px !important;

        text-align:center !important;

        word-break:normal !important;
    }


    /* =========================================
       DESCRIPTION
    ========================================== */

    .adp-hero-description{
        width:100% !important;
        max-width:620px !important;

        margin:24px auto 0 !important;

        font-size:16px !important;

        line-height:1.7 !important;

        text-align:center !important;
    }


    /* =========================================
       BUTTONS
    ========================================== */

    .adp-hero-actions{
        width:100% !important;

        margin-top:28px !important;

        display:flex !important;

        flex-direction:row !important;

        justify-content:center !important;

        align-items:center !important;

        gap:12px !important;
    }


    .adp-hero-btn{
        min-width:0 !important;

        flex:1 1 0 !important;

        height:58px !important;

        padding:0 14px !important;

        border-radius:999px !important;

        box-sizing:border-box !important;

        font-size:15px !important;

        white-space:normal !important;
    }


    .adp-hero-btn-primary{
        max-width:230px;
    }

    .adp-hero-btn-secondary{
        max-width:230px;
    }


    /* =========================================
       STATS
    ========================================== */

    .adp-hero-stats{
        width:100% !important;

        margin-top:35px !important;

        padding:20px 10px !important;

        display:grid !important;

        grid-template-columns:1fr 1fr !important;

        gap:0 !important;

        box-sizing:border-box !important;
    }


    .adp-hero-stat{
        width:100% !important;

        min-width:0 !important;

        padding:15px 8px !important;

        display:flex !important;

        flex-direction:column !important;

        align-items:center !important;

        justify-content:center !important;

        text-align:center !important;

        box-sizing:border-box !important;
    }


    .adp-stat-icon{
        margin-bottom:8px !important;
    }


    .adp-stat-content{
        display:flex !important;

        flex-direction:column !important;

        align-items:center !important;

        text-align:center !important;
    }


    .adp-stat-content strong{
        font-size:27px !important;
        line-height:1.1 !important;
    }


    .adp-stat-content span{
        font-size:12px !important;
        line-height:1.35 !important;
    }


    .adp-stat-divider{
        display:none !important;
    }


    /* Third stat center */
    .adp-hero-stat:nth-of-type(5){
        grid-column:1 / -1 !important;
    }


    /* =========================================
       RIGHT ANALYTICS
    ========================================== */

    .adp-hero-visual{
        width:100% !important;
        min-width:0 !important;

        height:auto !important;

        display:flex !important;

        flex-direction:column !important;

        align-items:center !important;

        gap:20px !important;

        position:relative !important;

        box-sizing:border-box !important;
    }


    /* =========================================
       GROWTH GRAPH
    ========================================== */

    .adp-growth-card{
        position:relative !important;

        top:auto !important;
        left:auto !important;

        width:100% !important;
        max-width:620px !important;

        height:390px !important;

        margin:0 auto !important;

        box-sizing:border-box !important;

        order:1 !important;
    }


    /* =========================================
       THREE CARDS
    ========================================== */

    .adp-growth-side-cards{
        position:relative !important;

        top:auto !important;
        right:auto !important;

        width:100% !important;
        max-width:620px !important;

        display:grid !important;

        grid-template-columns:1fr !important;

        gap:14px !important;

        order:2 !important;
    }


    .adp-floating-card{
        position:relative !important;

        width:100% !important;
        min-height:100px !important;

        box-sizing:border-box !important;
    }


    /* =========================================
       CONVERSION
    ========================================== */

    .adp-conversion-card{
        position:relative !important;

        left:auto !important;
        bottom:auto !important;

        width:100% !important;
        max-width:620px !important;

        min-height:125px !important;

        margin:0 !important;

        box-sizing:border-box !important;

        order:3 !important;
    }


    /* =========================================
       DATA BADGE
    ========================================== */

    .adp-data-badge{
        position:relative !important;

        right:auto !important;
        bottom:auto !important;

        width:auto !important;

        margin-top:0 !important;

        order:4 !important;
    }


    /* =========================================
       ORBIT
    ========================================== */

    .adp-hero-orbit-main{
        left:-180px !important;
        top:80px !important;

        width:520px !important;
        height:520px !important;
    }

    .adp-hero-orbit-inner{
        left:-120px !important;
        top:140px !important;

        width:420px !important;
        height:420px !important;
    }


    /* Keep moving ball inside orbit */
    .adp-orbit-ball{
        width:12px !important;
        height:12px !important;
    }

}
/* =========================================================
   HERO — REDUCE TOP EMPTY SPACE
========================================================= */

.adp-hero {
    padding-top: 25px !important;
}


/* Desktop */

@media (min-width: 1000px) {

    .adp-hero {
        min-height: 720px;
    }

    .adp-hero-container {
        padding-top: 20px !important;
    }

}


/* Tablet */

@media (max-width: 999px) {

    .adp-hero {
        padding-top: 70px !important;
    }

}


/* Mobile */

@media (max-width: 600px) {

    .adp-hero {
        padding-top: 55px !important;
    }

}
/* =========================================
   AEO / GEO HERO CONTENT
========================================= */

.adp-hero-location {
    margin: -12px 0 18px;

    max-width: 650px;

    color: #aeb8b3;

    font-size: 14px;

    line-height: 1.7;
}

.adp-hero-location strong {
    color: #d6a82e;

    font-weight: 700;
}


/* SERVICE ENTITY SIGNALS */

.adp-hero-services {
    display: flex;

    flex-wrap: wrap;

    gap: 8px;

    margin: 0 0 24px;
}

.adp-hero-services span {
    display: inline-flex;

    align-items: center;

    padding: 7px 11px;

    border: 1px solid rgba(214, 168, 46, .22);

    border-radius: 30px;

    background: rgba(214, 168, 46, .04);

    color: #bdbdbd;

    font-size: 11px;

    line-height: 1;

    transition: .25s ease;
}

.adp-hero-services span:hover {
    border-color: rgba(214, 168, 46, .55);

    color: #d6a82e;

    background: rgba(214, 168, 46, .08);
}


/* MOBILE */

@media (max-width: 600px) {

    .adp-hero-location {
        font-size: 13px;

        margin-top: -8px;
    }

    .adp-hero-services {
        gap: 6px;

        margin-bottom: 20px;
    }

    .adp-hero-services span {
        font-size: 10px;

        padding: 7px 9px;
    }

}
/* =========================================================
   FINAL FIX — HERO EYEBROW / BRAND LABEL
   Prevent vertical letter stacking
========================================================= */

/* =========================================================
   HERO — KEEP BRAND TEXT, REMOVE DECORATIVE EYEBROW LINES
========================================================= */

.adp-hero-eyebrow {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;

    white-space: nowrap !important;

    margin-bottom: 14px !important;
}

/* Hide only decorative lines */
.adp-hero-eyebrow > span:first-child {
    display: none !important;
}

/* Keep brand text visible */
.adp-hero-eyebrow > span:last-child {
    display: inline-block !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    white-space: nowrap !important;

    word-break: normal !important;
    overflow-wrap: normal !important;
}
.adp-hero-eyebrow span {
    display: inline-block !important;

    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;

    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}


/* Mobile */

@media (max-width: 767px) {

    .adp-hero-eyebrow {
        width: auto !important;
        max-width: calc(100vw - 40px) !important;
        min-width: 0 !important;

        white-space: nowrap !important;

        font-size: 11px !important;
        letter-spacing: 1.2px !important;

        flex-shrink: 0 !important;
    }

    .adp-hero-eyebrow span {
        white-space: nowrap !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
    }

}
/* Hide Hero brand eyebrow */
.adp-hero-eyebrow {
    display: none !important;
}
/* =========================================================
   HERO — HEADING / DESCRIPTION SPACING
========================================================= */

.adp-hero-title {
    margin-bottom: 22px !important;
}

.adp-hero-description {
    margin-top: 0 !important;
}

/* Mobile */
@media (max-width: 767px) {

    .adp-hero-title {
        margin-bottom: 18px !important;
    }

}
/* =========================================================
   FINAL — AARAV DIGITAL MARKETING TEXT
========================================================= */

.adp-hero-eyebrow {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;

    margin: 0 0 18px 0 !important;
    padding: 0 !important;

    overflow: visible !important;

    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;

    color: #f3c43b !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    letter-spacing: 0.5px !important;

    text-align: left !important;
}


/* Hide ONLY decorative first span */
.adp-hero-eyebrow > span:first-child {
    display: none !important;
}


/* FORCE BRAND NAME VISIBLE */
.adp-hero-eyebrow > span:last-child {
    display: inline !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: auto !important;
    height: auto !important;
    max-width: none !important;
    min-width: 0 !important;

    color: #f3c43b !important;

    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;

    writing-mode: horizontal-tb !important;
    transform: none !important;
}


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

@media (max-width: 767px) {

    .adp-hero-eyebrow {
        display: block !important;

        margin-bottom: 14px !important;

        font-size: 12px !important;
        line-height: 1.3 !important;

        white-space: nowrap !important;
    }

    .adp-hero-eyebrow > span:last-child {
        display: inline !important;

        white-space: nowrap !important;
        writing-mode: horizontal-tb !important;
    }

}
/* =========================================================
   FINAL FIX — HERO BRAND NAME VISIBILITY
========================================================= */

.adp-hero-eyebrow {
    display: block !important;

    width: fit-content !important;
    max-width: 100% !important;

    height: auto !important;

    margin: 0 0 18px 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;

    color: #f3c43b !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.5px !important;

    white-space: nowrap !important;

    overflow: visible !important;
}


/* Decorative line completely hidden */
.adp-hero-eyebrow > span:first-child {
    display: none !important;
}


/* AARAV DIGITAL MARKETING */
.adp-hero-eyebrow > span:last-child {
    display: inline-block !important;

    width: auto !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;

    color: #f3c43b !important;

    opacity: 1 !important;
    visibility: visible !important;

    font-size: inherit !important;
    font-weight: 700 !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;

    white-space: nowrap !important;

    word-break: normal !important;
    overflow-wrap: normal !important;

    writing-mode: horizontal-tb !important;
    transform: none !important;
}


/* =========================================================
   HEADING SPACING
========================================================= */

.adp-hero-title {
    margin-top: 20 !important;
    margin-bottom: 22px !important;
}


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

@media (max-width: 767px) {

    .adp-hero-eyebrow {
        font-size: 12px !important;
        margin-bottom: 18px !important;
        white-space: nowrap !important;
    }

    .adp-hero-eyebrow > span:last-child {
        white-space: nowrap !important;
    }

    .adp-hero-title {
        margin-bottom: 18px !important;
    }

}
/* =========================================================
   FINAL FIX — ABOUT LABEL
   ABOUT DIGITAL must stay on one horizontal line
========================================================= */

#adp-about .adp-about-label {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    flex-wrap: nowrap !important;
    flex-shrink: 0 !important;

    width: max-content !important;
    max-width: 100% !important;
    min-width: 0 !important;

    white-space: nowrap !important;

    word-break: keep-all !important;
    overflow-wrap: normal !important;

    writing-mode: horizontal-tb !important;

    margin-bottom: 22px !important;
}


/* Decorative lines */
#adp-about .adp-about-label span {
    display: block !important;

    flex: 0 0 38px !important;

    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;

    height: 1px !important;

    white-space: nowrap !important;
}


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

@media (max-width: 600px) {

    #adp-about .adp-about-label {
        display: inline-flex !important;

        width: max-content !important;
        max-width: calc(100vw - 34px) !important;

        flex-wrap: nowrap !important;

        white-space: nowrap !important;

        font-size: 10px !important;
        letter-spacing: 1.4px !important;

        margin-bottom: 20px !important;
    }

    #adp-about .adp-about-label span {
        flex: 0 0 22px !important;

        width: 22px !important;
        min-width: 22px !important;
        max-width: 22px !important;
    }

}
/* =========================================
   CTA ICONS - SIMPLE & RELIABLE
========================================= */

.adp-btn-icon{
    width:40px;
    height:40px;
    flex:0 0 40px;

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

    border-radius:50%;
    box-sizing:border-box;
}

.adp-call-icon{
    font-size:24px;
    line-height:1;
    color:#080808;
}

.adp-whatsapp-icon{
    background:#25D366 !important;
    color:#fff !important;

    font-size:22px;
    font-weight:800;
    line-height:1;
}

.adp-whatsapp-icon strong{
    font-size:22px;
    font-weight:800;
    line-height:1;
}
/* =========================================
   HERO CTA ICONS
========================================= */

.adp-hero-btn{
    display:inline-flex;
    align-items:center;
}


/* ICON BASE */

.adp-btn-icon{
    width:40px;
    height:40px;

    flex:0 0 40px;

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

    border-radius:50%;

    box-sizing:border-box;
}

.adp-btn-icon svg{
    display:block;
}


/* CALL ICON */

.adp-call-icon{
    color:#080808;
}

.adp-call-icon svg{
    width:22px;
    height:22px;
}


/* WHATSAPP ICON */

.adp-whatsapp-icon{
    width:42px;
    height:42px;

    background:#25D366;

    border-radius:50%;
}

.adp-whatsapp-icon svg{
    width:26px;
    height:26px;
}


/* BUTTON SPACING */

.adp-hero-btn-primary{
    justify-content:flex-start;
    gap:12px;
}

.adp-hero-btn-primary .adp-btn-arrow{
    margin-left:auto;
}

.adp-hero-btn-secondary{
    justify-content:flex-start;
    gap:12px;
}
/* =========================================
   HERO CTA — COMPACT ICON + TEXT
========================================= */

.adp-hero-btn{
    gap: 10px !important;
}

/* Call / Enquiry icon */
.adp-hero-btn .adp-btn-icon{
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
}

/* Button text */
.adp-hero-btn > span:not(.adp-btn-icon):not(.adp-btn-arrow):not(.adp-btn-play){
    margin: 0 !important;
    padding: 0 !important;
}

/* Enquiry button specifically */
.adp-hero-btn-secondary{
    gap: 10px !important;
}

/* Call button */
.adp-hero-btn-primary{
    gap: 10px !important;
}
/* =========================================
   SEND ENQUIRY — COMPACT WIDTH
========================================= */

.adp-hero-btn-secondary{
    width:auto !important;
    min-width:0 !important;
    max-width:max-content !important;

    padding-left:24px !important;
    padding-right:24px !important;

    justify-content:center !important;
    gap:8px !important;
}

.adp-hero-btn-secondary .adp-btn-icon{
    margin:0 !important;
    flex:0 0 auto !important;
}

.adp-hero-btn-secondary > span{
    margin:0 !important;
}
/* =========================================
   CALL US — COMPACT BUTTON
========================================= */

.adp-hero-btn-primary{
    width:auto !important;
    min-width:0 !important;
    max-width:max-content !important;

    padding-left:24px !important;
    padding-right:12px !important;

    justify-content:flex-start !important;
    gap:8px !important;
}


/* Remove auto spacing before arrow */

.adp-hero-btn-primary .adp-btn-arrow{
    margin-left:8px !important;
    flex:0 0 auto !important;
}


/* Icon */

.adp-hero-btn-primary .adp-btn-icon{
    margin:0 !important;
    flex:0 0 auto !important;
}


/* Text */

.adp-hero-btn-primary > span{
    margin:0 !important;
}
/* =========================================
   HERO CTA — FINAL MATCHED STYLE
========================================= */

.adp-hero-actions{
    display:flex !important;
    align-items:center !important;
    gap:18px !important;
}


/* BOTH BUTTONS */

.adp-hero-actions .adp-hero-btn{
    height:60px !important;
    min-height:60px !important;

    min-width:0 !important;
    width:auto !important;
    max-width:max-content !important;

    box-sizing:border-box !important;

    display:inline-flex !important;
    align-items:center !important;

    padding-top:0 !important;
    padding-bottom:0 !important;

    border-radius:999px !important;

    gap:7px !important;

    white-space:nowrap !important;
}


/* =========================================
   CALL BUTTON
   SAME BLACK + GOLD STYLE
========================================= */

.adp-hero-btn-primary{
    background:transparent !important;

    border:1px solid #d6a82e !important;

    color:#fff !important;

    padding-left:20px !important;
    padding-right:14px !important;

    justify-content:flex-start !important;
}


/* Call icon */

.adp-hero-btn-primary .adp-call-icon{
    width:30px !important;
    height:30px !important;

    flex:0 0 30px !important;

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

    background:transparent !important;

    color:#fff !important;

    margin:0 !important;
    padding:0 !important;
}

.adp-hero-btn-primary .adp-call-icon svg{
    width:20px !important;
    height:20px !important;
}


/* Call text */

.adp-hero-btn-primary .adp-btn-label{
    margin:0 !important;
    padding:0 !important;
}


/* Call arrow */

.adp-hero-btn-primary .adp-btn-arrow{
    width:36px !important;
    height:36px !important;

    flex:0 0 36px !important;

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

    margin-left:5px !important;

    border-radius:50% !important;

    background:rgba(214,168,46,.12) !important;

    color:#fff !important;
}


/* =========================================
   SEND ENQUIRY
========================================= */

.adp-hero-btn-secondary{
    background:transparent !important;

    border:1px solid #d6a82e !important;

    color:#fff !important;

    padding-left:20px !important;
    padding-right:20px !important;

    justify-content:center !important;

    gap:7px !important;
}


/* Enquiry icon */

.adp-hero-btn-secondary .adp-enquiry-icon{
    width:24px !important;
    height:24px !important;

    flex:0 0 24px !important;

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

    color:#fff !important;

    font-size:17px !important;

    margin:0 !important;
    padding:0 !important;
}


/* Enquiry text */

.adp-hero-btn-secondary .adp-btn-label{
    margin:0 !important;
    padding:0 !important;
}


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

@media (max-width:767px){

    .adp-hero-actions{
        gap:10px !important;
    }

    .adp-hero-actions .adp-hero-btn{
        height:54px !important;
        min-height:54px !important;
    }

    .adp-hero-btn-primary{
        padding-left:15px !important;
        padding-right:10px !important;
    }

    .adp-hero-btn-secondary{
        padding-left:15px !important;
        padding-right:15px !important;
    }

    .adp-hero-btn-primary .adp-btn-arrow{
        width:32px !important;
        height:32px !important;
        flex-basis:32px !important;

        margin-left:3px !important;
    }
}
/* =========================================
   HERO DESKTOP — RESTORE SIDE-BY-SIDE LAYOUT
========================================= */

@media (min-width:1101px){

    .adp-hero-container{
        display:grid !important;

        grid-template-columns:
            minmax(0, 48%)
            minmax(0, 52%) !important;

        align-items:start !important;

        gap:25px !important;
    }


    /* LEFT CONTENT */

    .adp-hero-content{
        align-self:start !important;
    }


    /* RIGHT ANALYTICS */

    .adp-hero-visual{
        align-self:start !important;

        margin-top:0 !important;

        width:100% !important;

        min-width:0 !important;

        min-height:570px !important;

        display:grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            225px !important;

        grid-template-rows:
            auto
            115px !important;

        gap:20px !important;
    }


    /* GRAPH */

    .adp-growth-card{
        grid-column:1 !important;
        grid-row:1 !important;
    }


    /* RIGHT 3 CARDS */

    .adp-growth-side-cards{
        grid-column:2 !important;
        grid-row:1 !important;
    }


    /* CONVERSION CARD */

    .adp-conversion-card{
        grid-column:1 !important;
        grid-row:2 !important;
    }


    /* DATA BADGE */

    .adp-data-badge{
        grid-column:2 !important;
        grid-row:2 !important;
    }

}
/* =========================================================
   HERO FINAL LAYOUT FIX — KEEP LEFT + RIGHT SIDE-BY-SIDE
   ========================================================= */

@media (min-width:769px){
    #adp-hero .adp-hero-container{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
        grid-template-rows:auto !important;
        align-items:start !important;
        column-gap:24px !important;
        row-gap:0 !important;
        width:min(1400px,100%) !important;
        margin:0 auto !important;
        box-sizing:border-box !important;
    }

    #adp-hero .adp-hero-content{
        grid-column:1 !important;
        grid-row:1 !important;
        width:100% !important;
        min-width:0 !important;
        align-self:start !important;
    }

    #adp-hero .adp-hero-visual{
        grid-column:2 !important;
        grid-row:1 !important;
        width:100% !important;
        min-width:0 !important;
        margin:0 !important;
        align-self:start !important;
    }
}

@media (max-width:768px){
    #adp-hero .adp-hero-container{
        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        gap:40px !important;
    }

    #adp-hero .adp-hero-content,
    #adp-hero .adp-hero-visual{
        grid-column:auto !important;
        grid-row:auto !important;
    }
}


/* =========================================================
   AARAV DIGITAL — MOBILE / TABLET HERO FINAL FIX
   IMPORTANT:
   This block is intentionally at the VERY END so it wins
   over every older Hero responsive rule above it.
   ========================================================= */

/* 1100px and below:
   The phone/iPhone screenshots can report a wider CSS viewport
   when viewport scaling is involved. Therefore we intentionally
   switch the OUTER HERO to one column at 1100px, not 768px.
*/
@media (max-width:1100px){

    #adp-hero .adp-hero-container{
        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;

        width:100% !important;
        max-width:100% !important;
        min-height:auto !important;

        padding:55px 28px 55px !important;
        gap:38px !important;
    }

    #adp-hero .adp-hero-content{
        order:1 !important;

        width:100% !important;
        max-width:760px !important;
        min-width:0 !important;

        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;

        text-align:center !important;
    }

    #adp-hero .adp-hero-eyebrow{
        justify-content:center !important;
        text-align:center !important;
    }

    #adp-hero .adp-hero-description,
    #adp-hero .adp-hero-location{
        width:100% !important;
        margin-left:auto !important;
        margin-right:auto !important;
        text-align:center !important;
    }

    #adp-hero .adp-hero-services{
        width:100% !important;
        justify-content:center !important;
    }

    #adp-hero .adp-hero-actions{
        width:100% !important;
        justify-content:center !important;
        flex-wrap:wrap !important;
        gap:10px !important;
    }

    #adp-hero .adp-hero-stats{
        width:100% !important;
        max-width:700px !important;
        margin-left:auto !important;
        margin-right:auto !important;
    }

    #adp-hero .adp-hero-visual{
        order:2 !important;

        width:100% !important;
        max-width:850px !important;
        min-width:0 !important;
        min-height:auto !important;
        margin:0 auto !important;

        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        gap:18px !important;

        grid-column:auto !important;
        grid-row:auto !important;
    }

    #adp-hero .adp-growth-card,
    #adp-hero .adp-growth-side-cards,
    #adp-hero .adp-conversion-card{
        width:100% !important;
        max-width:850px !important;
    }

    #adp-hero .adp-growth-card{
        order:1 !important;
        height:430px !important;
    }

    #adp-hero .adp-growth-side-cards{
        order:2 !important;

        display:grid !important;
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
        gap:12px !important;

        grid-column:auto !important;
        grid-row:auto !important;
    }

    #adp-hero .adp-floating-card{
        min-width:0 !important;
        width:100% !important;
    }

    #adp-hero .adp-conversion-card{
        order:3 !important;
        height:105px !important;

        grid-column:auto !important;
        grid-row:auto !important;
    }

    #adp-hero .adp-data-badge{
        order:4 !important;

        grid-column:auto !important;
        grid-row:auto !important;

        align-self:center !important;
        justify-self:center !important;
    }
}


/* =========================================================
   PHONE
   ========================================================= */

@media (max-width:767px){

    #adp-hero .adp-hero-container{
        padding:45px 16px 45px !important;
        gap:32px !important;
    }

    #adp-hero .adp-hero-content{
        max-width:100% !important;
    }

    #adp-hero .adp-hero-trust{
        width:auto !important;
        max-width:100% !important;
        padding:9px 13px !important;
        gap:9px !important;
        white-space:normal !important;
        text-align:center !important;
    }

    #adp-hero .adp-trust-stars{
        font-size:14px !important;
        letter-spacing:1px !important;
    }

    #adp-hero .adp-trust-text{
        font-size:12px !important;
    }

    #adp-hero .adp-hero-title{
        width:100% !important;
        max-width:100% !important;

        font-size:clamp(42px,12.5vw,58px) !important;
        line-height:.98 !important;
        letter-spacing:-2px !important;

        overflow-wrap:normal !important;
        word-break:normal !important;
    }

    #adp-hero .adp-hero-description{
        font-size:16px !important;
        line-height:1.65 !important;
        max-width:620px !important;
    }

    #adp-hero .adp-hero-location{
        font-size:14px !important;
        line-height:1.65 !important;
    }

    #adp-hero .adp-hero-services{
        gap:7px 10px !important;
        margin-bottom:14px !important;
    }

    #adp-hero .adp-hero-services a{
        font-size:13px !important;
    }

    /* CTA — no overlap, compact and equal */
    #adp-hero .adp-hero-actions{
        width:100% !important;
        display:flex !important;
        flex-direction:row !important;
        flex-wrap:nowrap !important;
        align-items:center !important;
        justify-content:center !important;
        gap:8px !important;
    }

    #adp-hero .adp-hero-actions .adp-hero-btn{
        flex:0 1 auto !important;
        width:auto !important;
        max-width:none !important;
        min-width:0 !important;

        height:52px !important;
        min-height:52px !important;

        padding-top:0 !important;
        padding-bottom:0 !important;

        font-size:14px !important;
        gap:6px !important;
    }

    #adp-hero .adp-hero-btn-primary{
        padding-left:13px !important;
        padding-right:8px !important;
    }

    #adp-hero .adp-hero-btn-secondary{
        padding-left:13px !important;
        padding-right:13px !important;
    }

    #adp-hero .adp-hero-btn-primary .adp-call-icon{
        width:21px !important;
        height:21px !important;
        flex-basis:21px !important;
    }

    #adp-hero .adp-hero-btn-primary .adp-call-icon svg{
        width:17px !important;
        height:17px !important;
    }

    #adp-hero .adp-hero-btn-primary .adp-btn-arrow{
        width:29px !important;
        height:29px !important;
        flex-basis:29px !important;
        margin-left:2px !important;
        font-size:15px !important;
    }

    #adp-hero .adp-hero-btn-secondary .adp-enquiry-icon{
        width:19px !important;
        height:19px !important;
        flex-basis:19px !important;
        font-size:15px !important;
    }

    /* Stats — full width, not a tall narrow column */
    #adp-hero .adp-hero-stats{
        width:100% !important;
        max-width:100% !important;

        grid-template-columns:1fr 1fr !important;
        gap:16px !important;

        padding:17px 14px !important;
        border-radius:18px !important;
    }

    #adp-hero .adp-hero-stat{
        min-width:0 !important;
        justify-content:center !important;
        gap:8px !important;
    }

    #adp-hero .adp-stat-icon{
        width:38px !important;
        height:38px !important;
        flex-basis:38px !important;
        font-size:18px !important;
    }

    #adp-hero .adp-stat-content strong{
        font-size:22px !important;
    }

    #adp-hero .adp-stat-content span{
        font-size:11px !important;
    }

    #adp-hero .adp-stat-divider{
        display:none !important;
    }

    #adp-hero .adp-hero-stat:last-child{
        grid-column:1 / -1 !important;
    }

    /* Analytics */
    #adp-hero .adp-hero-visual{
        max-width:100% !important;
        gap:14px !important;
    }

    #adp-hero .adp-growth-card{
        height:390px !important;
        padding:21px 17px 14px !important;
        border-radius:20px !important;
    }

    #adp-hero .adp-growth-title strong{
        font-size:35px !important;
    }

    #adp-hero .adp-growth-status{
        padding:7px 9px !important;
        font-size:10px !important;
    }

    #adp-hero .adp-growth-graph{
        left:17px !important;
        right:17px !important;
        height:205px !important;
    }

    #adp-hero .adp-growth-months{
        left:17px !important;
        right:17px !important;
        font-size:9px !important;
    }

    #adp-hero .adp-growth-side-cards{
        width:100% !important;
        max-width:100% !important;

        display:flex !important;
        flex-direction:column !important;
        gap:10px !important;
    }

    #adp-hero .adp-floating-card{
        min-height:88px !important;
        padding:14px !important;
        border-radius:17px !important;
    }

    #adp-hero .adp-floating-icon{
        width:48px !important;
        height:48px !important;
        flex-basis:48px !important;
        font-size:22px !important;
    }

    #adp-hero .adp-floating-content strong{
        font-size:19px !important;
    }

    #adp-hero .adp-conversion-card{
        height:96px !important;
        padding:13px 16px !important;
        border-radius:17px !important;
    }

    #adp-hero .adp-conversion-circle{
        width:62px !important;
        height:62px !important;
        flex-basis:62px !important;
    }

    #adp-hero .adp-conversion-circle::before{
        width:48px !important;
        height:48px !important;
    }

    #adp-hero .adp-data-badge{
        padding:10px 16px !important;
        font-size:11px !important;
    }
}


/* EXTRA SMALL PHONES */
@media (max-width:390px){

    #adp-hero .adp-hero-actions{
        gap:6px !important;
    }

    #adp-hero .adp-hero-actions .adp-hero-btn{
        font-size:13px !important;
    }

    #adp-hero .adp-hero-btn-primary{
        padding-left:10px !important;
        padding-right:6px !important;
    }

    #adp-hero .adp-hero-btn-secondary{
        padding-left:10px !important;
        padding-right:10px !important;
    }

    #adp-hero .adp-hero-btn-primary .adp-btn-arrow{
        width:27px !important;
        height:27px !important;
        flex-basis:27px !important;
    }
}