
/* V1.0.2 Project Case Studies 1025 */
.case-section{
  position:relative;
  background:linear-gradient(180deg,#fff,#f5f8fc);
  overflow:hidden;
}
.case-section:before{
  content:"";position:absolute;width:420px;height:420px;border-radius:50%;
  right:-210px;top:80px;background:radial-gradient(circle,rgba(25,118,210,.09),transparent 68%);
}
.case-section .container{position:relative;z-index:2}
.case-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.case-explain{font-size:11px;color:#64748b;display:flex;align-items:center;gap:7px}
.case-explain span{width:7px;height:7px;border-radius:50%;background:#1976d2;display:inline-block}
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.case-card{
  display:flex;flex-direction:column;min-width:0;
  background:#fff;border:1px solid #dbe4ef;border-radius:20px;overflow:hidden;
  box-shadow:0 9px 28px rgba(12,31,66,.055);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
@media(hover:hover) and (pointer:fine){
  .case-card:hover{transform:translateY(-4px);box-shadow:0 20px 45px rgba(12,31,66,.11);border-color:#a7c8e7}
}
.case-card-top{padding:18px 19px 16px;background:linear-gradient(140deg,#071f46,#0b3d7d);color:#fff;min-height:154px}
.case-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:9px;color:#b9d4ed;text-transform:uppercase;font-weight:850;letter-spacing:.08em}
.case-company{display:inline-flex;align-items:center;gap:6px}
.case-company:before{content:"";width:6px;height:6px;border-radius:50%;background:#66c7ff}
.case-card h3{font-size:19px;line-height:1.12;margin:13px 0 7px}
.case-card-sub{font-size:11px;line-height:1.5;color:#d8e7f5}
.case-card-body{padding:18px 19px 19px;display:flex;flex-direction:column;flex:1}
.case-problem-label{font-size:9px;text-transform:uppercase;letter-spacing:.1em;font-weight:900;color:#1976d2}
.case-challenge{font-size:12px;line-height:1.6;color:#4f6075;margin:7px 0 13px}
.case-role{padding:10px 11px;border-radius:10px;background:#f5f8fc;border:1px solid #e4eaf1;font-size:10px;line-height:1.5;color:#43556e}
.case-role b{color:#071f46}
.case-tags{display:flex;gap:5px;flex-wrap:wrap;margin:13px 0}
.case-tag{padding:5px 7px;border-radius:999px;background:#eef6ff;color:#0c4f98;font-size:8px;font-weight:800;border:1px solid #daeafb}
.case-open{margin-top:auto;padding-top:8px;color:#0b58aa;font-size:11px;font-weight:900;display:flex;align-items:center;justify-content:space-between}
.case-all{margin-top:22px;text-align:center}
.case-all .btn{min-width:190px}
@media(max-width:1020px){.case-grid{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.case-grid{grid-template-columns:1fr}.case-card-top{min-height:auto}}


body.case-detail-page{background:#f3f6fa;color:#0f172a}
.case-hero{
  position:relative;overflow:hidden;
  padding:22px clamp(18px,4vw,64px) 48px;
  background:linear-gradient(118deg,#061f48,#0a3472 70%,#0b4f98);color:#fff;
}
.case-hero:after{content:"";position:absolute;width:350px;height:350px;border-radius:50%;right:-130px;top:-150px;background:radial-gradient(circle,rgba(53,184,255,.34),transparent 68%)}
.case-hero-actions{position:relative;z-index:2;display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.case-back,.case-company-link{color:#d8e8f8;font-size:12px;font-weight:850}
.case-company-link{padding:8px 11px;border:1px solid rgba(255,255,255,.16);border-radius:9px;background:rgba(255,255,255,.05)}
.case-hero-inner{position:relative;z-index:2;width:min(1180px,100%);margin:38px auto 0;display:grid;grid-template-columns:1fr 310px;gap:28px;align-items:end}
.case-eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:#87ceff;font-weight:900}
.case-hero h1{font-size:clamp(32px,4.5vw,55px);letter-spacing:-.045em;line-height:.98;margin:10px 0 12px}
.case-subtitle{font-size:15px;line-height:1.58;color:#dce9f6;max-width:850px}
.case-context-card{padding:18px;border:1px solid rgba(255,255,255,.15);border-radius:16px;background:rgba(255,255,255,.07)}
.case-context-card small{display:block;color:#aecdE9;font-size:9px;text-transform:uppercase;letter-spacing:.1em;font-weight:850;margin-bottom:4px}
.case-context-card strong{display:block;font-size:13px;margin-bottom:11px}
.case-detail-main{width:min(1180px,calc(100% - 28px));margin:-23px auto 50px;position:relative;z-index:4}
.case-summary-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:12px}
.case-panel{background:#fff;border:1px solid #dbe4ef;border-radius:17px;box-shadow:0 9px 28px rgba(12,31,66,.06);overflow:hidden}
.case-panel-head{padding:14px 17px;border-bottom:1px solid #e4eaf1;display:flex;align-items:center;justify-content:space-between;gap:12px}.case-panel-head h2{font-size:15px;color:#071f46;margin:0}.case-panel-head span{font-size:9px;color:#64748b;text-transform:uppercase;font-weight:850}
.case-panel-body{padding:18px}
.problem-box{padding:17px;border-radius:14px;background:#fff7ec;border:1px solid #f3dbb7;color:#68491f;font-size:13px;line-height:1.65}
.role-box{margin-top:10px;padding:14px;border-radius:13px;background:#f4f8fc;border:1px solid #dfe8f1;font-size:12px;line-height:1.6;color:#43546a}.role-box b{color:#071f46}
.case-step-list{list-style:none;padding:0;margin:0}.case-step-list li{position:relative;padding:12px 0 12px 42px;border-bottom:1px solid #edf1f5;font-size:12px;line-height:1.62;color:#45576f}.case-step-list li:last-child{border-bottom:0}.case-step-list li:before{content:counter(item);counter-increment:item;position:absolute;left:0;top:10px;width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:#eaf4ff;color:#0b5bab;font-size:10px;font-weight:900}.case-step-list{counter-reset:item}
.outcome-box{padding:14px 15px;border-radius:13px;background:#eef8f1;border:1px solid #d1ead8;margin-bottom:9px;color:#2f6140;font-size:12px;line-height:1.58}
.case-skills{display:flex;flex-wrap:wrap;gap:6px}.case-skill{padding:7px 9px;border-radius:999px;background:#eef6ff;color:#0b4f98;border:1px solid #d7eafa;font-size:9px;font-weight:850}
.case-source{margin-top:12px;padding:12px 14px;border-radius:11px;background:#f8fafc;border:1px solid #e3e9f0;font-size:10px;line-height:1.55;color:#64748b}
.case-nav{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:13px}.case-nav a{padding:14px 16px;border-radius:13px;background:#fff;border:1px solid #dbe4ef;box-shadow:0 6px 18px rgba(12,31,66,.04)}.case-nav small{font-size:8px;text-transform:uppercase;letter-spacing:.1em;color:#64748b;font-weight:850;display:block}.case-nav b{font-size:12px;color:#071f46;display:block;margin-top:4px}
.case-index-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.case-filterbar{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:18px}.case-filter{padding:8px 11px;border-radius:999px;border:1px solid #dbe4ef;background:#fff;color:#41546d;font-size:10px;font-weight:850;cursor:pointer}.case-filter.active{background:#071f46;color:#fff;border-color:#071f46}
@media(max-width:900px){.case-hero-inner,.case-summary-grid{grid-template-columns:1fr}.case-index-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.case-index-grid{grid-template-columns:1fr}.case-nav{grid-template-columns:1fr}.case-detail-main{margin-top:-15px}}
