

.np-case-v2{
max-width:1200px;
margin:0 auto;
padding:0;
font-family:'Inter',Arial,sans-serif;
color:#1b2430;
line-height:1.7;
}


.np-case-v2 *{
box-sizing:border-box;
}


.np-case-v2 h1,
.np-case-v2 h2,
.np-case-v2 h3{
font-family:'Space Grotesk',Arial,sans-serif;
line-height:1.25;
}


.np-case-v2 h1{

font-size:52px;
font-weight:700;
letter-spacing:-1px;
color:#0f2235;
margin:25px 0;

}



.np-case-v2 h2{

font-size:36px;
font-weight:700;
color:#0f2235;
margin:80px 0 35px;

}



.np-case-v2 h3{

font-size:24px;
color:#0f2235;
margin-bottom:15px;

}



.np-case-v2 p{

font-size:16px;
color:#555;
margin-bottom:18px;

}




/* HERO */

.np-v2-hero{

background:#f6f8fb;
padding:70px 50px 50px;
border-radius:30px;
margin-bottom:80px;

}



.np-v2-label{

display:inline-block;

background:#fff1e6;

color:#ff7a00;

font-size:14px;

font-weight:700;

padding:8px 18px;

border-radius:50px;

}



.np-v2-hero-image{

margin-top:45px;

overflow:hidden;

border-radius:24px;

}


.np-v2-hero-image img{

width:100%;

height:auto;

display:block;

}




/* INFO */


.np-v2-info{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

margin-top:40px;

}



.np-v2-info-item{

background:#fff;

border:1px solid #e9edf2;

padding:25px;

border-radius:18px;

}



.np-v2-info-item strong{

display:block;

font-size:28px;

color:#0064E0;

margin-bottom:5px;

}



.np-v2-info-item span{

font-size:14px;

color:#777;

}




/* SECTION */

.np-v2-section{

padding:0 20px;

}



/* STAT */

.np-v2-stat{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}



.np-v2-stat-item{

padding:35px;

background:#fff;

border-left:3px solid #ff7a00;

}



.np-v2-stat-item strong{

font-size:38px;

display:block;

color:#0064E0;

}



.np-v2-stat-item span{

font-size:15px;

color:#666;

}





@media(max-width:768px){


.np-v2-section{

padding:0 15px;

}


.np-case-v2 h1{

font-size:34px;

}


.np-case-v2 h2{

font-size:28px;

margin-top:55px;

}



.np-v2-hero{

padding:40px 20px;

border-radius:20px;

}



.np-v2-info{

grid-template-columns:1fr 1fr;

}



.np-v2-stat{

grid-template-columns:1fr;

}



}


@media(max-width:480px){


.np-v2-info{

grid-template-columns:1fr;

}


.np-case-v2 p{

font-size:15px;

}


}



/* CTA styles scoped to this case study. */
.np-case-v2 .np-v2-cta-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px;}
.np-case-v2 .np-v2-cta-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:14px 30px;border:1px solid transparent;border-radius:9999px;background:#ff7a00;color:#fff;font:700 16px/1.5 'Inter',Arial,sans-serif;text-align:center;text-decoration:none;cursor:pointer;transition:background .15s ease,box-shadow .15s ease;}
.np-case-v2 .np-v2-cta-btn:hover{background:#d96300;box-shadow:0 6px 18px rgba(15,34,53,.12);}
.np-case-v2 .np-v2-cta-btn:focus-visible{outline:3px solid #0064e0;outline-offset:4px;}
.np-case-v2 .np-v2-cta-secondary{background:transparent;color:#0f2235;border-color:#b7c3d0;}
.np-case-v2 .np-v2-cta-secondary:hover{background:#e8eef6;}
.np-case-v2 .np-v2-cta-note{font-size:14px;color:#617080;margin:14px 0 0;}
.np-case-v2 .np-v2-cta-inline{display:flex;align-items:center;justify-content:space-between;gap:28px;margin:55px 20px 0;padding:30px 34px;background:#f6f8fb;border:1px solid #e5eaf1;border-radius:22px;}
.np-case-v2 .np-v2-cta-inline h3{font-size:24px;margin:0 0 8px;}
.np-case-v2 .np-v2-cta-inline p{margin:0;max-width:600px;}
.np-case-v2 .np-v2-cta-inline .np-v2-cta-btn{flex-shrink:0;}
.np-case-v2 .np-v2-cta-final{margin:80px 0 30px;padding:64px 30px;text-align:center;background:linear-gradient(135deg,#0f2235,#0a1628);border-radius:28px;}
.np-case-v2 .np-v2-cta-eyebrow{display:block;margin-bottom:14px;color:#ff7a00;font-size:12px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;}
.np-case-v2 .np-v2-cta-final h2{color:#fff;font-size:clamp(28px,4vw,42px);margin:0 0 18px;}
.np-case-v2 .np-v2-cta-final p{color:#e3e9f2;max-width:640px;margin:0 auto;}
.np-case-v2 .np-v2-cta-final .np-v2-cta-actions{justify-content:center;margin-top:30px;}
.np-case-v2 .np-v2-cta-wa{background:#25d366;color:#0a3020;}
.np-case-v2 .np-v2-cta-wa:hover{background:#20bd5a;}
.np-case-v2 .np-v2-cta-final .np-v2-cta-btn:focus-visible{outline-color:#fff;}
@media(max-width:768px){
.np-case-v2 .np-v2-cta-inline{flex-direction:column;align-items:flex-start;margin:40px 20px 0;padding:26px 22px;}
.np-case-v2 .np-v2-cta-final{margin-top:55px;padding:42px 22px;border-radius:20px;}
}
@media(max-width:480px){
.np-case-v2 .np-v2-cta-actions{flex-direction:column;align-items:stretch;}
.np-case-v2 .np-v2-cta-btn{width:100%;padding:14px 20px;}
}

/* =================================
   MOBILE ADAPTATION 2026-10-13
   本页多列布局与内边距大量写在内联 style 上，
   常规媒体查询无法覆盖，故用属性选择器 + !important 统一处理。
================================= */

@media(max-width:768px){

/* 多列 grid 统一降为单列 */
.np-case-v2 [style*="grid-template-columns:repeat(4,1fr)"],
.np-case-v2 [style*="grid-template-columns:repeat(3,1fr)"],
.np-case-v2 [style*="grid-template-columns:repeat(2,1fr)"],
.np-case-v2 [style*="grid-template-columns:1fr 1fr"]{
grid-template-columns:1fr !important;
gap:22px !important;
}

/* 内联大内边距收窄（宽泛规则在前，具体规则在后） */
.np-case-v2 [style*="padding:45px"]{
padding:28px 20px !important;
}

.np-case-v2 [style*="padding:35px"]{
padding:26px 20px !important;
}

.np-case-v2 [style*="padding:35px 25px"]{
padding:26px 20px !important;
}

.np-case-v2 [style*="padding:30px 20px"]{
padding:24px 18px !important;
}

.np-case-v2 [style*="padding:25px"]{
padding:20px !important;
}

/* 区块边距与标题节奏 */
.np-v2-section{
padding:0 15px;
}

.np-case-v2 h2{
margin:50px 0 26px;
}

.np-case-v2 h3{
font-size:21px;
}

.np-v2-hero{
padding:36px 20px;
border-radius:20px;
margin-bottom:50px;
}

.np-v2-hero-image{
margin-top:28px;
border-radius:18px;
}

.np-v2-info{
gap:14px;
}

.np-v2-info-item{
padding:20px;
}

.np-v2-info-item strong{
font-size:24px;
}

.np-v2-stat{
gap:18px;
}

.np-v2-stat-item{
padding:24px 20px;
}

.np-v2-stat-item strong{
font-size:30px;
}

/* 卡片内固定高度图片收敛 */
.np-v2-section [style*="height:280px"]{
height:210px !important;
}

.np-v2-section [style*="height:260px"]{
height:200px !important;
}

}


@media(max-width:480px){

.np-case-v2 h1{
font-size:30px;
letter-spacing:-.5px;
}

.np-case-v2 h2{
font-size:23px;
margin:42px 0 22px;
}

.np-case-v2 h3{
font-size:19px;
}

.np-case-v2 p{
font-size:15px;
}

.np-v2-label{
font-size:13px;
padding:7px 14px;
}

.np-v2-hero{
padding:28px 16px;
border-radius:16px;
margin-bottom:40px;
}

.np-v2-info-item{
padding:18px;
}

.np-v2-info-item strong{
font-size:22px;
}

.np-v2-stat-item{
padding:20px 16px;
}

.np-v2-section [style*="height:280px"],
.np-v2-section [style*="height:260px"]{
height:180px !important;
}

.np-v2-cta-final{
padding:38px 18px;
border-radius:18px;
}

}

