:root{
    --sp-primary:#1E3A8A;
    --sp-secondary:#2563EB;
    --sp-accent:#FF7A00;
    --sp-accent-soft:#FFF4E8;
    --sp-light:#F4F7FF;
    --sp-dark:#1F2937;
    --sp-white:#FFFFFF;
    --sp-border:rgba(30,58,138,0.14);
    --sp-shadow:0 18px 45px rgba(15,23,42,0.10);
    --sp-card-shadow:0 16px 34px rgba(15,23,42,0.08);
    --sp-hover-shadow:0 24px 52px rgba(30,58,138,0.16);
    --sp-radius-xl:30px;
    --sp-radius-lg:24px;
    --sp-radius-md:18px;
    --sp-radius-sm:12px;
    --sp-container:1320px;
    --sp-transition:all .32s ease;
}

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

.service-partner-page{
    background:var(--sp-white);
    color:var(--sp-dark);
    overflow:hidden;
}

.service-partner-page img{
    max-width:100%;
    display:block;
}

.service-partner-page a{
    text-decoration:none;
}

.sp-container{
    width:min(100% - 32px, var(--sp-container));
    margin:0 auto;
}

.sp-section{
    padding:88px 0;
}

.sp-section-premium{
    background:
        radial-gradient(circle at top left, rgba(37,99,235,0.10) 0%, transparent 28%),
        radial-gradient(circle at bottom right, rgba(255,122,0,0.10) 0%, transparent 26%),
        linear-gradient(180deg, #F7FAFF 0%, #EEF4FF 100%);
}

.sp-section-soft{
    background:
        radial-gradient(circle at top right, rgba(37,99,235,0.08) 0%, transparent 24%),
        radial-gradient(circle at bottom left, rgba(255,122,0,0.08) 0%, transparent 24%),
        linear-gradient(180deg, #FFFFFF 0%, #F7FAFF 100%);
}

.sp-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 16px;
    border-radius:999px;
    background:rgba(37,99,235,0.10);
    color:var(--sp-primary);
    font-size:13px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:18px;
}

.sp-eyebrow-white{
    background:rgba(255,255,255,0.14);
    color:#FFFFFF;
}

.sp-title{
    margin:0 0 14px;
    color:var(--sp-primary);
    font-size:clamp(30px, 4vw, 48px);
    line-height:1.14;
    font-weight:800;
    letter-spacing:-0.02em;
}

.sp-subtitle{
    margin:0;
    max-width:860px;
    color:#4B5563;
    font-size:17px;
    line-height:1.8;
}

.sp-card-title{
    margin:0 0 14px;
    font-size:30px;
    line-height:1.18;
    font-weight:800;
}

.sp-btn-row{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
}

.sp-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:50px;
    padding:12px 24px;
    border-radius:12px;
    font-size:15px;
    font-weight:700;
    transition:var(--sp-transition);
    border:none;
    cursor:pointer;
}

.sp-btn-primary{
    background:var(--sp-accent);
    color:var(--sp-white);
    box-shadow:0 14px 28px rgba(255,122,0,0.24);
}

.sp-btn-primary:hover{
    transform:translateY(-2px);
    background:#eb7200;
}

.sp-btn-secondary{
    background:rgba(255,255,255,0.12);
    color:var(--sp-white);
    border:1px solid rgba(255,255,255,0.24);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}

.sp-btn-secondary:hover{
    transform:translateY(-2px);
    background:rgba(255,255,255,0.20);
}

.sp-hero{
    padding:42px 0 56px;
    background:linear-gradient(135deg, rgba(30,58,138,0.04) 0%, rgba(37,99,235,0.02) 100%);
}

.sp-hero-card{
    position:relative;
    overflow:hidden;
    min-height:560px;
    border-radius:32px;
    box-shadow:var(--sp-shadow);
    background:
        linear-gradient(90deg, rgba(15,23,42,0.65) 0%, rgba(15,23,42,0.40) 40%, rgba(15,23,42,0.10) 75%),
        url('../images/partner-banner.jpg') center center / cover no-repeat;
    display:flex;
    align-items:center;
}

.sp-hero-content{
    position:relative;
    z-index:2;
    max-width:720px;
    padding:60px 56px;
    color:var(--sp-white);
}

.sp-hero-badge{
    display:inline-flex;
    align-items:center;
    padding:9px 16px;
    border-radius:999px;
    background:rgba(255,255,255,0.14);
    border:1px solid rgba(255,255,255,0.22);
    color:var(--sp-white);
    font-size:13px;
    font-weight:700;
    letter-spacing:.05em;
    text-transform:uppercase;
    margin-bottom:20px;
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
}

.sp-hero-title{
    margin:0 0 18px;
    font-size:clamp(36px, 5vw, 62px);
    line-height:1.06;
    font-weight:800;
    letter-spacing:-0.03em;
}

.sp-hero-text{
    margin:0 0 28px;
    max-width:620px;
    color:rgba(255,255,255,0.92);
    font-size:17px;
    line-height:1.8;
}

.sp-grid-2{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:28px;
    align-items:stretch;
}

.sp-grid-6{
    display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:24px;
    margin-top:34px;
}

/* SHOWCASE SLIDER */
.sp-showcase-card{
    position:relative;
    min-height:100%;
    border-radius:30px;
    overflow:hidden;
    background:#dfe7f7;
    border:1px solid rgba(30,58,138,0.08);
    box-shadow:0 22px 48px rgba(15,23,42,0.08);
}

.sp-showcase-stage{
    position:relative;
    min-height:620px;
    height:100%;
    border-radius:30px;
    overflow:hidden;
    background:#dfe7f7;
}

.sp-showcase-track{
    position:absolute;
    inset:0;
}

.sp-showcase-slide{
    position:absolute;
    inset:0;
    margin:0;
    opacity:0;
    animation:spFadeSlider 25s infinite;
}

.sp-showcase-slide:nth-child(1){ animation-delay:0s; }
.sp-showcase-slide:nth-child(2){ animation-delay:5s; }
.sp-showcase-slide:nth-child(3){ animation-delay:10s; }
.sp-showcase-slide:nth-child(4){ animation-delay:15s; }
.sp-showcase-slide:nth-child(5){ animation-delay:20s; }

.sp-showcase-slide img{
    width:100%;
    height:100%;
    min-height:620px;
    object-fit:cover;
    object-position:center center;
}

@keyframes spFadeSlider{
    0%{
        opacity:0;
    }
    4%{
        opacity:1;
    }
    18%{
        opacity:1;
    }
    22%{
        opacity:0;
    }
    100%{
        opacity:0;
    }
}

.sp-list{
    list-style:none;
    margin:0;
    padding:0;
    position:relative;
    z-index:1;
}

.sp-list li{
    position:relative;
    padding-left:20px;
    margin-bottom:12px;
    color:#4B5563;
    font-size:15.5px;
    line-height:1.75;
}

.sp-list li:last-child{
    margin-bottom:0;
}

.sp-list li::before{
    content:'';
    position:absolute;
    left:0;
    top:10px;
    width:8px;
    height:8px;
    border-radius:50%;
    background:var(--sp-accent);
}

.sp-highlight{
    position:relative;
    overflow:hidden;
    background:linear-gradient(135deg, var(--sp-primary) 0%, var(--sp-secondary) 100%);
    color:var(--sp-white);
    border-radius:var(--sp-radius-xl);
    box-shadow:var(--sp-shadow);
    padding:34px;
    height:100%;
}

.sp-highlight::before{
    content:'';
    position:absolute;
    top:-50px;
    right:-50px;
    width:180px;
    height:180px;
    border-radius:50%;
    background:rgba(255,255,255,0.08);
}

.sp-highlight .sp-card-title{
    color:var(--sp-white);
    position:relative;
    z-index:1;
}

.sp-highlight p{
    position:relative;
    z-index:1;
    margin:0 0 18px;
    color:rgba(255,255,255,0.92);
    font-size:15.5px;
    line-height:1.85;
}

.sp-highlight .sp-list li{
    color:rgba(255,255,255,0.94);
}

.sp-highlight .sp-list li::before{
    background:#FFD4AE;
}

.sp-outline-card{
    position:relative;
    overflow:hidden;
    border-radius:26px;
    border:2px solid rgba(255,122,0,0.70);
    box-shadow:0 12px 22px rgba(15,23,42,0.10);
    transition:var(--sp-transition);
    background:#FFFFFF;
}

.sp-outline-card::after{
    content:'';
    position:absolute;
    inset:0;
    border-radius:26px;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,0.14);
    pointer-events:none;
}

.sp-outline-card:hover{
    transform:translateY(-10px);
    box-shadow:var(--sp-hover-shadow);
    border-color:#f39a21;
}

.sp-support-card{
    position:relative;
    overflow:hidden;
    padding:30px 26px;
    min-height:100%;
    background:linear-gradient(180deg, #FFFFFF 0%, #FBFCFF 100%);
    transition:var(--sp-transition);
}

.sp-support-card.training{
    background:linear-gradient(180deg, #FFFFFF 0%, #EEF4FF 100%);
}

.sp-support-card.toolkit{
    background:linear-gradient(180deg, #FFFFFF 0%, #F5F1FF 100%);
}

.sp-support-card.app{
    background:linear-gradient(180deg, #FFFFFF 0%, #EEF9FF 100%);
}

.sp-support-card.certification{
    background:linear-gradient(180deg, #FFFFFF 0%, #FFF7EE 100%);
}

.sp-support-card.leads{
    background:linear-gradient(180deg, #FFFFFF 0%, #F2FAF7 100%);
}

.sp-support-card.support{
    background:linear-gradient(180deg, #FFFFFF 0%, #FFF7FB 100%);
}

.sp-outline-card:hover .sp-support-card.training{
    background:linear-gradient(180deg, #FFFDF9 0%, #E4EEFF 100%);
}

.sp-outline-card:hover .sp-support-card.toolkit{
    background:linear-gradient(180deg, #FFFDF9 0%, #EEE6FF 100%);
}

.sp-outline-card:hover .sp-support-card.app{
    background:linear-gradient(180deg, #FFFDF9 0%, #E4F6FF 100%);
}

.sp-outline-card:hover .sp-support-card.certification{
    background:linear-gradient(180deg, #FFFDF9 0%, #FFECD9 100%);
}

.sp-outline-card:hover .sp-support-card.leads{
    background:linear-gradient(180deg, #FFFDF9 0%, #E7F8F0 100%);
}

.sp-outline-card:hover .sp-support-card.support{
    background:linear-gradient(180deg, #FFFDF9 0%, #FFEAF3 100%);
}

.sp-support-icon{
    position:relative;
    z-index:2;
    width:78px;
    height:78px;
    border-radius:24px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:18px;
    color:var(--sp-primary);
    transition:var(--sp-transition);
    box-shadow:0 10px 20px rgba(15,23,42,0.06);
}

.sp-support-card.training .sp-support-icon{
    background:linear-gradient(135deg, rgba(37,99,235,0.18) 0%, rgba(255,122,0,0.14) 100%);
}

.sp-support-card.toolkit .sp-support-icon{
    background:linear-gradient(135deg, rgba(124,58,237,0.18) 0%, rgba(37,99,235,0.12) 100%);
}

.sp-support-card.app .sp-support-icon{
    background:linear-gradient(135deg, rgba(14,165,233,0.18) 0%, rgba(37,99,235,0.12) 100%);
}

.sp-support-card.certification .sp-support-icon{
    background:linear-gradient(135deg, rgba(255,122,0,0.18) 0%, rgba(245,158,11,0.12) 100%);
}

.sp-support-card.leads .sp-support-icon{
    background:linear-gradient(135deg, rgba(16,185,129,0.18) 0%, rgba(37,99,235,0.10) 100%);
}

.sp-support-card.support .sp-support-icon{
    background:linear-gradient(135deg, rgba(236,72,153,0.16) 0%, rgba(37,99,235,0.10) 100%);
}

.sp-outline-card:hover .sp-support-icon{
    transform:scale(1.07);
    box-shadow:0 14px 26px rgba(30,58,138,0.14);
}

.sp-support-icon svg{
    width:38px;
    height:38px;
}

.sp-support-card h3{
    position:relative;
    z-index:2;
    margin:0 0 10px;
    color:var(--sp-primary);
    font-size:23px;
    line-height:1.25;
    transition:var(--sp-transition);
}

.sp-outline-card:hover .sp-support-card h3{
    color:#13306d;
}

.sp-support-card p{
    position:relative;
    z-index:2;
    margin:0 0 16px;
    color:#4B5563;
    font-size:15.5px;
    line-height:1.8;
}

.sp-support-note{
    position:relative;
    z-index:2;
    display:inline-block;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(37,99,235,0.09);
    color:var(--sp-primary);
    font-size:12px;
    font-weight:700;
    letter-spacing:.05em;
    text-transform:uppercase;
    transition:var(--sp-transition);
}

.sp-outline-card:hover .sp-support-note{
    background:rgba(255,122,0,0.14);
    color:#b05a00;
}

.sp-process-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0,1fr));
    gap:22px;
    margin-top:34px;
}

.sp-process-card{
    position:relative;
    overflow:hidden;
    padding:30px 24px;
    min-height:100%;
    background:linear-gradient(180deg, #FFFFFF 0%, #F8FBFF 100%);
    transition:var(--sp-transition);
}

.sp-process-grid .sp-outline-card:nth-child(1) .sp-process-card{
    background:linear-gradient(180deg, #FFFFFF 0%, #EEF4FF 100%);
}

.sp-process-grid .sp-outline-card:nth-child(2) .sp-process-card{
    background:linear-gradient(180deg, #FFFFFF 0%, #FFF6EE 100%);
}

.sp-process-grid .sp-outline-card:nth-child(3) .sp-process-card{
    background:linear-gradient(180deg, #FFFFFF 0%, #F1F8FF 100%);
}

.sp-process-grid .sp-outline-card:nth-child(4) .sp-process-card{
    background:linear-gradient(180deg, #FFFFFF 0%, #F2FAF7 100%);
}

.sp-outline-card:hover .sp-process-card{
    background:linear-gradient(180deg, #FFFDF9 0%, #FFF3E6 100%);
}

.sp-process-number{
    position:relative;
    z-index:2;
    width:60px;
    height:60px;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:18px;
    background:linear-gradient(135deg, rgba(37,99,235,0.16) 0%, rgba(255,122,0,0.14) 100%);
    color:var(--sp-primary);
    font-size:21px;
    font-weight:800;
    box-shadow:0 10px 20px rgba(15,23,42,0.06);
    transition:var(--sp-transition);
}

.sp-outline-card:hover .sp-process-number{
    transform:scale(1.06);
}

.sp-process-card h3{
    position:relative;
    z-index:2;
    margin:0 0 10px;
    color:var(--sp-primary);
    font-size:21px;
    line-height:1.3;
}

.sp-process-card p{
    position:relative;
    z-index:2;
    margin:0;
    color:#4B5563;
    font-size:15.5px;
    line-height:1.8;
}

.sp-why-stack{
    display:grid;
    gap:26px;
    margin-top:34px;
}

.sp-why-row{
    display:grid;
    grid-template-columns:100px 1fr;
    align-items:center;
    gap:26px;
    padding:28px 30px;
    border-radius:28px;
    border:2px dashed rgba(30,58,138,0.14);
    background:linear-gradient(180deg, #FFFFFF 0%, #FBFCFF 100%);
    box-shadow:0 10px 24px rgba(15,23,42,0.04);
    transition:var(--sp-transition);
}

.sp-why-row:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 34px rgba(30,58,138,0.10);
    border-style:solid;
    border-color:rgba(21,48,109,0.34);
    background:linear-gradient(135deg, #113B72 0%, #0E3769 100%);
}

.sp-why-icon{
    width:82px;
    height:82px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(180deg, #F1F5FF 0%, #E9EEFB 100%);
    box-shadow:0 10px 20px rgba(15,23,42,0.08);
    color:var(--sp-primary);
    flex-shrink:0;
    transition:var(--sp-transition);
}

.sp-why-icon svg{
    width:40px;
    height:40px;
    transition:var(--sp-transition);
}

.sp-why-content h3{
    margin:0 0 10px;
    color:var(--sp-primary);
    font-size:20px;
    line-height:1.3;
    transition:var(--sp-transition);
}

.sp-why-content p{
    margin:0;
    color:#4B5563;
    font-size:15.5px;
    line-height:1.85;
    transition:var(--sp-transition);
}

.sp-why-row:hover .sp-why-icon{
    background:linear-gradient(180deg, #FFF8E6 0%, #FFE9B2 100%);
    color:#FFBF1A;
    box-shadow:0 12px 26px rgba(0,0,0,0.22);
}

.sp-why-row:hover .sp-why-content h3,
.sp-why-row:hover .sp-why-content p{
    color:#FFC533;
}

.sp-cta{
    padding-top:28px;
}

.sp-cta-band{
    position:relative;
    overflow:hidden;
    background:linear-gradient(135deg, var(--sp-primary) 0%, #17306F 56%, var(--sp-secondary) 100%);
    border-radius:30px;
    box-shadow:var(--sp-shadow);
    padding:46px;
}

.sp-cta-band::before,
.sp-cta-band::after{
    content:'';
    position:absolute;
    border-radius:50%;
    background:rgba(255,255,255,0.08);
}

.sp-cta-band::before{
    width:260px;
    height:260px;
    top:-80px;
    right:-70px;
}

.sp-cta-band::after{
    width:170px;
    height:170px;
    left:-40px;
    bottom:-50px;
}

.sp-cta-inner{
    position:relative;
    z-index:1;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:24px;
}

.sp-cta-copy h2{
    margin:0 0 12px;
    color:var(--sp-white);
    font-size:clamp(28px, 4vw, 42px);
    line-height:1.15;
}

.sp-cta-copy p{
    margin:0;
    max-width:760px;
    color:rgba(255,255,255,0.92);
    font-size:16px;
    line-height:1.85;
}

.sp-cta-actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    flex-shrink:0;
}

.sp-anchor{
    scroll-margin-top:120px;
}

@media (max-width:1199px){
    .sp-grid-6{
        grid-template-columns:repeat(2, minmax(0,1fr));
    }

    .sp-process-grid{
        grid-template-columns:repeat(2, minmax(0,1fr));
    }

    .sp-cta-inner{
        flex-direction:column;
        align-items:flex-start;
    }
}

@media (max-width:991px){
    .sp-section{
        padding:72px 0;
    }

    .sp-hero-card{
        min-height:520px;
        background:
            linear-gradient(180deg, rgba(15,23,42,0.62) 0%, rgba(15,23,42,0.36) 48%, rgba(15,23,42,0.14) 100%),
            url('../images/partner-banner.jpg') center center / cover no-repeat;
    }

    .sp-hero-content{
        max-width:100%;
        padding:42px 34px;
    }

    .sp-grid-2{
        grid-template-columns:1fr;
    }

    .sp-why-row{
        grid-template-columns:82px 1fr;
    }

    .sp-showcase-stage,
    .sp-showcase-slide img{
        min-height:520px;
    }
}

@media (max-width:767px){
    .sp-container{
        width:min(100% - 22px, var(--sp-container));
    }

    .sp-section{
        padding:56px 0;
    }

    .sp-hero{
        padding:24px 0 34px;
    }

    .sp-hero-card{
        min-height:450px;
        border-radius:22px;
        align-items:flex-end;
        background-position:center right;
    }

    .sp-hero-content{
        padding:24px 20px;
    }

    .sp-hero-title{
        font-size:32px;
    }

    .sp-hero-text,
    .sp-subtitle,
    .sp-support-card p,
    .sp-process-card p,
    .sp-why-content p,
    .sp-cta-copy p{
        font-size:15px;
    }

    .sp-grid-6,
    .sp-process-grid{
        grid-template-columns:1fr;
    }

    .sp-support-card,
    .sp-process-card{
        padding:22px 18px;
    }

    .sp-highlight,
    .sp-cta-band{
        padding:24px 18px;
        border-radius:22px;
    }

    .sp-showcase-card,
    .sp-showcase-stage{
        border-radius:22px;
    }

    .sp-showcase-stage,
    .sp-showcase-slide img{
        min-height:450px;
    }

    .sp-btn-row,
    .sp-cta-actions{
        flex-direction:column;
        width:100%;
    }

    .sp-btn-row .sp-btn,
    .sp-cta-actions .sp-btn{
        width:100%;
    }

    .sp-btn{
        min-height:46px;
        padding:12px 18px;
        font-size:14px;
    }

    .sp-title{
        font-size:30px;
    }

    .sp-card-title{
        font-size:25px;
    }

    .sp-support-card h3,
    .sp-process-card h3,
    .sp-why-content h3{
        font-size:20px;
    }

    .sp-support-icon{
        width:66px;
        height:66px;
        border-radius:20px;
    }

    .sp-support-icon svg{
        width:32px;
        height:32px;
    }

    .sp-process-number{
        width:54px;
        height:54px;
        font-size:20px;
    }

    .sp-outline-card,
    .sp-outline-card::after{
        border-radius:20px;
    }

    .sp-why-row{
        grid-template-columns:1fr;
        gap:18px;
        padding:22px 18px;
        border-radius:22px;
    }

    .sp-why-icon{
        width:72px;
        height:72px;
    }
}

@media (max-width:480px){
    .sp-showcase-stage,
    .sp-showcase-slide img{
        min-height:390px;
    }
}