/* =====================================================
   ASNETWORKZONE PREMIUM COURSES ARCHIVE
===================================================== */

.asn-courses-premium{
    overflow:hidden;
    color:#18223d;
    background:#fff;
}

.asn-courses-premium *{
    box-sizing:border-box;
}

.asnc-hero{
    position:relative;
    overflow:hidden;
    padding:82px 0 95px;
    background:
        radial-gradient(circle at 85% 15%,rgba(109,78,224,.17),transparent 28%),
        radial-gradient(circle at 5% 85%,rgba(37,166,255,.11),transparent 27%),
        linear-gradient(135deg,#f8f9ff,#fff 52%,#f8f5ff);
}

.asnc-hero:before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.32;
    background-image:
        linear-gradient(rgba(46,54,92,.055) 1px,transparent 1px),
        linear-gradient(90deg,rgba(46,54,92,.055) 1px,transparent 1px);
    background-size:42px 42px;
}

.asnc-hero-orb{
    position:absolute;
    border:1px solid rgba(103,73,218,.16);
    border-radius:50%;
}

.asnc-orb-one{
    width:320px;
    height:320px;
    right:-150px;
    top:-70px;
}

.asnc-orb-two{
    width:150px;
    height:150px;
    left:5%;
    bottom:-80px;
}

.asnc-breadcrumb{
    position:relative;
    z-index:2;
    display:flex;
    gap:10px;
    margin-bottom:35px;
    color:#81899d;
    font-size:12px;
    font-weight:800;
}

.asnc-breadcrumb a{
    color:#684bdc;
    text-decoration:none;
}

.asnc-hero-grid{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:1.08fr .92fr;
    gap:80px;
    align-items:center;
}

.asnc-kicker,
.asnc-label{
    display:inline-block;
    color:#684bdc;
    font-size:12px;
    font-weight:900;
    letter-spacing:.09em;
    text-transform:uppercase;
}

.asnc-hero h1{
    max-width:760px;
    margin:17px 0 24px;
    color:#121d37;
    font-size:clamp(44px,5.2vw,72px);
    line-height:1.03;
    letter-spacing:-.047em;
}

.asnc-hero h1 span,
.asnc-section-head h2 span,
.asnc-library-head h2 span,
.asnc-center-head h2 span,
.asnc-options-copy h2 span{
    color:#6749da;
}

.asnc-hero-copy>p{
    max-width:680px;
    margin:0;
    color:#69748a;
    font-size:17px;
    line-height:1.8;
}

.asnc-hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:32px;
}

.asnc-btn{
    display:inline-flex;
    min-height:52px;
    align-items:center;
    justify-content:center;
    padding:0 24px;
    border-radius:12px;
    font-size:13px;
    font-weight:900;
    text-decoration:none!important;
    transition:.25s ease;
}

.asnc-btn-primary{
    color:#fff!important;
    background:linear-gradient(135deg,#684bdc,#7c59ee);
    box-shadow:0 15px 32px rgba(104,75,220,.24);
}

.asnc-btn-secondary{
    border:1px solid #dce0ea;
    color:#19243d!important;
    background:#fff;
}

.asnc-btn:hover{
    transform:translateY(-3px);
}

.asnc-hero-dashboard{
    position:relative;
    padding:27px;
    border:1px solid rgba(255,255,255,.7);
    border-radius:25px;
    color:#fff;
    background:
        radial-gradient(circle at 90% 10%,rgba(126,92,255,.38),transparent 30%),
        linear-gradient(145deg,#141e3a,#282e5c);
    box-shadow:0 35px 75px rgba(28,35,75,.22);
}

.asnc-dashboard-head{
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:center;
    padding-bottom:22px;
    border-bottom:1px solid rgba(255,255,255,.09);
}

.asnc-dashboard-head small,
.asnc-dashboard-head strong{
    display:block;
}

.asnc-dashboard-head small{
    margin-bottom:4px;
    color:#8f9aba;
    font-size:10px;
    letter-spacing:.1em;
}

.asnc-dashboard-head strong{
    color:#fff;
    font-size:15px;
}

.asnc-status{
    padding:7px 10px;
    border:1px solid rgba(78,214,155,.25);
    border-radius:99px;
    color:#63dca5;
    background:rgba(78,214,155,.08);
    font-size:9px;
    font-weight:900;
}

.asnc-dashboard-main{
    display:flex;
    align-items:center;
    gap:22px;
    padding:34px 0 28px;
}

.asnc-big-number{
    color:#fff;
    font-size:70px;
    font-weight:900;
    line-height:1;
    letter-spacing:-.05em;
}

.asnc-dashboard-main strong,
.asnc-dashboard-main span{
    display:block;
}

.asnc-dashboard-main strong{
    margin-bottom:5px;
    color:#fff;
    font-size:16px;
}

.asnc-dashboard-main span{
    color:#939ebd;
    font-size:11px;
}

.asnc-dashboard-tech{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

.asnc-dashboard-tech span{
    padding:8px 10px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:8px;
    color:#b9c2dd;
    background:rgba(255,255,255,.045);
    font-size:10px;
    font-weight:700;
}

.asnc-dashboard-progress{
    margin-top:26px;
}

.asnc-dashboard-progress>div:first-child{
    display:flex;
    justify-content:space-between;
    margin-bottom:9px;
    color:#929dbd;
    font-size:10px;
}

.asnc-dashboard-progress strong{
    color:#c7d0e8;
}

.asnc-progress-track{
    overflow:hidden;
    height:5px;
    border-radius:99px;
    background:rgba(255,255,255,.08);
}

.asnc-progress-track span{
    display:block;
    width:82%;
    height:100%;
    border-radius:99px;
    background:linear-gradient(90deg,#8060ef,#4ab4ff);
}

.asnc-trust{
    position:relative;
    z-index:5;
}

.asnc-trust-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    margin-top:-30px;
    overflow:hidden;
    border:1px solid #e6e9f1;
    border-radius:18px;
    background:#fff;
    box-shadow:0 20px 50px rgba(34,41,78,.09);
}

.asnc-trust-grid>div{
    position:relative;
    padding:25px;
    text-align:center;
}

.asnc-trust-grid>div:not(:last-child):after{
    content:"";
    position:absolute;
    right:0;
    top:25%;
    width:1px;
    height:50%;
    background:#e8eaf1;
}

.asnc-trust-grid strong,
.asnc-trust-grid span{
    display:block;
}

.asnc-trust-grid strong{
    color:#17213b;
    font-size:29px;
}

.asnc-trust-grid span{
    margin-top:5px;
    color:#81899d;
    font-size:10px;
    font-weight:900;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.asnc-section{
    padding:100px 0;
}

.asnc-section-head,
.asnc-library-head{
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:45px;
    margin-bottom:48px;
}

.asnc-section-head>div,
.asnc-library-head>div:first-child{
    max-width:720px;
}

.asnc-section-head h2,
.asnc-library-head h2,
.asnc-center-head h2,
.asnc-options-copy h2{
    margin:13px 0 0;
    color:#17213b;
    font-size:clamp(34px,4vw,51px);
    line-height:1.12;
    letter-spacing:-.035em;
}

.asnc-section-head>p{
    max-width:400px;
    margin:0 0 5px;
    color:#747e93;
    line-height:1.7;
}

.asnc-paths{
    background:#fff;
}

.asnc-path-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:13px;
}

.asnc-path-card{
    position:relative;
    overflow:hidden;
    min-height:285px;
    padding:25px 22px;
    border:1px solid #e5e8f0;
    border-radius:17px;
    color:inherit!important;
    text-decoration:none!important;
    background:#fff;
    transition:.3s ease;
}

.asnc-path-card:before{
    content:"";
    position:absolute;
    inset:auto 0 0;
    height:3px;
    background:linear-gradient(90deg,#684bdc,#3aa8ff);
    transform:scaleX(0);
    transform-origin:left;
    transition:.3s ease;
}

.asnc-path-card:hover{
    transform:translateY(-7px);
    border-color:#d4ccf6;
    box-shadow:0 20px 45px rgba(40,47,86,.1);
}

.asnc-path-card:hover:before{
    transform:scaleX(1);
}

.asnc-path-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.asnc-path-index{
    color:#c3c8d5;
    font-size:10px;
    font-weight:900;
}

.asnc-path-icon{
    display:flex;
    width:43px;
    height:43px;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    background:#f1edff;
    font-size:20px;
}

.asnc-path-card h3{
    margin:48px 0 10px;
    color:#19233e;
    font-size:18px;
}

.asnc-path-card p{
    min-height:65px;
    margin:0;
    color:#778196;
    font-size:12px;
    line-height:1.65;
}

.asnc-path-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    margin-top:24px;
}

.asnc-path-footer span{
    color:#9aa1b1;
    font-size:10px;
    font-weight:800;
}

.asnc-path-footer strong{
    color:#6749da;
    font-size:11px;
}

.asnc-library{
    background:#f7f8fc;
}

.asnc-course-total{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 17px;
    border:1px solid #e1e4ec;
    border-radius:12px;
    background:#fff;
}

.asnc-course-total strong{
    color:#6749da;
    font-size:25px;
}

.asnc-course-total span{
    color:#717b90;
    font-size:11px;
    font-weight:800;
}

.asnc-course-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
}

.asnc-course-card{
    overflow:hidden;
    border:1px solid #e4e7ef;
    border-radius:19px;
    background:#fff;
    box-shadow:0 8px 25px rgba(31,40,77,.045);
    transition:.3s ease;
}

.asnc-course-card:hover{
    transform:translateY(-7px);
    border-color:#d4cdf4;
    box-shadow:0 25px 50px rgba(34,42,79,.1);
}

.asnc-course-image{
    position:relative;
    display:block;
    overflow:hidden;
    aspect-ratio:16/9;
    background:#202a50;
}

.asnc-course-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:.4s ease;
}

.asnc-course-card:hover .asnc-course-image img{
    transform:scale(1.045);
}

.asnc-image-fallback{
    display:flex;
    width:100%;
    height:100%;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:
        radial-gradient(circle at 75% 25%,rgba(132,96,255,.5),transparent 30%),
        linear-gradient(145deg,#18223f,#30376a);
}

.asnc-image-fallback span{
    color:#aeb8d6;
    font-size:10px;
    font-weight:800;
    letter-spacing:.1em;
}

.asnc-image-fallback strong{
    margin-top:8px;
    color:#fff;
    font-size:24px;
}

.asnc-course-category{
    position:absolute;
    left:15px;
    bottom:15px;
    padding:7px 10px;
    border-radius:8px;
    color:#fff;
    background:rgba(19,28,55,.82);
    backdrop-filter:blur(8px);
    font-size:10px;
    font-weight:800;
}

.asnc-course-body{
    padding:25px;
}

.asnc-course-meta{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    color:#969dae;
    font-size:9px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.asnc-course-body h3{
    margin:13px 0 12px;
    font-size:19px;
    line-height:1.35;
}

.asnc-course-body h3 a{
    color:#17213c!important;
    text-decoration:none!important;
}

.asnc-course-body h3 a:hover{
    color:#6749da!important;
}

.asnc-course-body>p{
    min-height:64px;
    margin:0;
    color:#747e93;
    font-size:12px;
    line-height:1.7;
}

.asnc-course-bottom{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;
    margin-top:22px;
    padding-top:18px;
    border-top:1px solid #edf0f4;
}

.asnc-course-benefit{
    color:#778196;
    font-size:10px;
    font-weight:800;
}

.asnc-course-bottom>a{
    color:#6749da!important;
    font-size:11px;
    font-weight:900;
    text-decoration:none!important;
}

.asnc-empty{
    padding:50px;
    border:1px solid #e4e7ef;
    border-radius:18px;
    background:#fff;
    text-align:center;
}

.asnc-why{
    background:#fff;
}

.asnc-center-head{
    max-width:760px;
    margin:0 auto 50px;
    text-align:center;
}

.asnc-benefit-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px;
}

.asnc-benefit-grid article{
    position:relative;
    min-height:255px;
    padding:28px;
    border:1px solid #e4e7ef;
    border-radius:18px;
    background:#fff;
    transition:.3s ease;
}

.asnc-benefit-grid article:hover{
    transform:translateY(-6px);
    box-shadow:0 20px 45px rgba(34,42,78,.08);
}

.asnc-benefit-grid article>span{
    position:absolute;
    right:22px;
    top:20px;
    color:#c4c9d5;
    font-size:10px;
    font-weight:900;
}

.asnc-benefit-grid article>div{
    display:flex;
    width:49px;
    height:49px;
    align-items:center;
    justify-content:center;
    margin-bottom:45px;
    border-radius:13px;
    color:#684bdc;
    background:#f1edff;
    font-size:20px;
}

.asnc-benefit-grid h3{
    margin:0 0 10px;
    color:#19233d;
    font-size:18px;
}

.asnc-benefit-grid p{
    margin:0;
    color:#768095;
    font-size:12px;
    line-height:1.7;
}

.asnc-options{
    background:#f7f8fc;
}

.asnc-options-card{
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:70px;
    padding:60px;
    border-radius:25px;
    color:#fff;
    background:
        radial-gradient(circle at 10% 10%,rgba(120,88,240,.34),transparent 30%),
        linear-gradient(145deg,#151e3a,#252c58);
}

.asnc-options-copy h2{
    color:#fff;
}

.asnc-options-copy .asnc-label{
    color:#a68fff;
}

.asnc-options-copy p{
    color:#adb6d0;
    line-height:1.75;
}

.asnc-option-list{
    border-top:1px solid rgba(255,255,255,.1);
}

.asnc-option-list a{
    display:grid;
    grid-template-columns:35px 1fr 30px;
    gap:15px;
    align-items:center;
    padding:20px 5px;
    border-bottom:1px solid rgba(255,255,255,.1);
    color:#fff!important;
    text-decoration:none!important;
    transition:.25s ease;
}

.asnc-option-list a:hover{
    padding-left:12px;
    background:rgba(255,255,255,.025);
}

.asnc-option-list>a>span{
    color:#727e9f;
    font-size:10px;
    font-weight:900;
}

.asnc-option-list strong,
.asnc-option-list small{
    display:block;
}

.asnc-option-list strong{
    color:#fff;
    font-size:14px;
}

.asnc-option-list small{
    margin-top:4px;
    color:#8f9aba;
    font-size:10px;
}

.asnc-option-list b{
    color:#9b82ff;
}

.asnc-final{
    padding:0 0 100px;
    background:#f7f8fc;
}

.asnc-final-card{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:45px;
    padding:52px 58px;
    border-radius:24px;
    background:
        radial-gradient(circle at 85% 15%,rgba(151,118,255,.42),transparent 28%),
        linear-gradient(135deg,#6548d8,#3b3477);
    box-shadow:0 28px 65px rgba(77,56,162,.2);
}

.asnc-final-card>div{
    max-width:680px;
}

.asnc-final-card>div>span{
    color:#d6ccff;
    font-size:10px;
    font-weight:900;
    letter-spacing:.09em;
    text-transform:uppercase;
}

.asnc-final-card h2{
    margin:10px 0;
    color:#fff;
    font-size:clamp(31px,4vw,46px);
    line-height:1.1;
    letter-spacing:-.03em;
}

.asnc-final-card p{
    margin:0;
    color:#ded9f3;
    line-height:1.7;
}

.asnc-btn-light{
    flex-shrink:0;
    color:#5140a5!important;
    background:#fff;
}

@media(max-width:1100px){

    .asnc-hero-grid{
        gap:45px;
    }

    .asnc-path-grid{
        grid-template-columns:repeat(3,1fr);
    }

}

@media(max-width:900px){

    .asnc-hero-grid,
    .asnc-options-card{
        grid-template-columns:1fr;
    }

    .asnc-trust-grid{
        grid-template-columns:1fr 1fr;
    }

    .asnc-trust-grid>div:nth-child(2):after{
        display:none;
    }

    .asnc-section-head,
    .asnc-library-head{
        display:block;
    }

    .asnc-section-head>p{
        margin-top:18px;
    }

    .asnc-course-total{
        display:inline-flex;
        margin-top:20px;
    }

    .asnc-course-grid{
        grid-template-columns:1fr 1fr;
    }

    .asnc-benefit-grid{
        grid-template-columns:1fr 1fr;
    }

    .asnc-final-card{
        display:block;
    }

    .asnc-final-card>a{
        margin-top:25px;
    }

}

@media(max-width:600px){

    .asnc-hero{
        padding:55px 0 70px;
    }

    .asnc-hero h1{
        font-size:40px;
    }

    .asnc-hero-copy>p{
        font-size:15px;
    }

    .asnc-hero-dashboard{
        padding:21px;
    }

    .asnc-big-number{
        font-size:55px;
    }

    .asnc-trust-grid{
        grid-template-columns:1fr 1fr;
    }

    .asnc-trust-grid>div{
        padding:20px 10px;
    }

    .asnc-trust-grid>div:after{
        display:none;
    }

    .asnc-section{
        padding:70px 0;
    }

    .asnc-path-grid,
    .asnc-course-grid,
    .asnc-benefit-grid{
        grid-template-columns:1fr;
    }

    .asnc-course-body>p{
        min-height:auto;
    }

    .asnc-options-card{
        padding:35px 24px;
    }

    .asnc-final{
        padding-bottom:70px;
    }

    .asnc-final-card{
        padding:38px 25px;
    }

    .asnc-final-card>a{
        width:100%;
    }

}
