/* sub pages */
body.sub .lg{margin-left:0}

@media(min-width:1001px){body.sub .w{padding-left:max(24px,calc(140px - max(0px,(100vw - 1250px)/2)))}
}

.pb2{position:relative;padding:150px 0 120px;overflow:hidden;background:#ebe7e0;color:#161a20}

.pb2 .bgp{position:absolute;inset:-20px;background-size:cover;background-repeat:no-repeat;animation:kb 22s ease-in-out infinite alternate}

.pb2:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(95deg,#f3efe9f7 0%,#f3efe9d6 45%,#f3efe944)}

.pb2 .w{position:relative;z-index:2}

.crumb{display:flex;gap:8px;font:500 13.5px var(--f2);color:#4a5260;margin-bottom:14px}
.crumb a:hover{color:#0a74d6}

.pb2 h1{font:700 clamp(34px,5vw,52px)/1.06 var(--f1);letter-spacing:-.035em;margin:0;max-width:18ch}

.pb2 p{margin:18px 0 0;color:#2e3540;font-size:17px;max-width:52ch}

.pb2 .rv{transition-delay:.1s}

.pgm{position:relative;z-index:2;background:var(--bg);border-radius:48px 48px 0 0;margin-top:-48px;overflow:hidden}

.pgm>section:first-child{padding-top:84px}

h2.t{font:700 clamp(30px,4.4vw,44px)/1.1 var(--f1);letter-spacing:-.03em;color:#101826;margin:0}

.lead{color:#33415a;font-size:16.5px;line-height:1.75;margin:0 0 18px;max-width:64ch}

.sub .cta{margin-top:40px}

.sub .cta .w{padding-left:max(24px,calc(140px - max(0px,(100vw - 1250px)/2)))}

@media(max-width:1000px){.pb2{padding:120px 0 100px}
body.sub .w{padding-left:24px}
.sub .cta .w{padding-left:24px}
}


.ab{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:start}

.abi{position:relative;max-width:440px;justify-self:center;width:100%}

.abi .im{aspect-ratio:4/5;border-radius:220px 220px 32px 32px;box-shadow:0 24px 60px #0a2a5a30}

.abi .fr{position:absolute;inset:18px -18px -18px 18px;border:2px solid #0a74d6;border-radius:220px 220px 32px 32px;opacity:.35;animation:fl 7s ease-in-out infinite}

.abi .chip{position:absolute;left:-24px;bottom:40px;background:#fff;border-radius:24px;padding:14px 22px;box-shadow:0 14px 34px #0a2a5a33;animation:fl 6s ease-in-out infinite}

.chip b{display:block;font:800 34px var(--f1);color:#101826;line-height:1}
.chip span{font-size:13px;color:var(--mute)}

.call{position:relative;border-radius:40px;padding:64px 48px;color:#fff;text-align:center;overflow:hidden;background:linear-gradient(120deg,#071b3d,#0a3a85,#0a74d6,#071b3d);background-size:300% 100%;animation:bgm 14s ease infinite}

@keyframes bgm{50%{background-position:100% 0}
}

.call p{font:700 clamp(22px,3vw,34px)/1.3 var(--f1);letter-spacing:-.02em;max-width:30ch;margin:0 auto}

.call svg{width:44px;height:44px;color:#5cc0ff;margin-bottom:18px;stroke-width:1.5}

.mv{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:40px}

.mv>div,.ap>div{border-radius:32px;padding:38px 34px;transition:transform .4s,opacity .7s}

.mv>div:hover,.ap>div:hover{transform:translateY(-8px)}

.mv>div:first-child,.ap>div:first-child{background:linear-gradient(160deg,#fff,#eceff3);border:1px solid #fff;box-shadow:0 12px 30px #0a2a5a12}

.mv>div:last-child,.ap>div:last-child{background:linear-gradient(135deg,#232a33,#12171d);color:#fff;border:1px solid #3a424d}

.mv .ti,.ap .ti{width:60px;height:60px;border-radius:20px;background:linear-gradient(135deg,#00a3ff,#0a3a85);color:#fff;display:grid;place-items:center;font-size:28px;margin-bottom:22px}

.mv h3,.ap h3{font:700 24px var(--f1);margin-bottom:10px}
.mv p,.ap p{margin:0;line-height:1.7;opacity:.8}

.ap{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:40px}

@media(max-width:900px){.ab,.mv,.ap{grid-template-columns:1fr}
.call{padding:44px 24px}
.abi .chip{left:8px}
}


/* ===== v3 ===== */
/* decorative icon in callout */
.call .calli{position:relative;display:grid;place-items:center;width:76px;height:76px;margin:0 auto 20px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#ffffff40,#ffffff10);border:1px solid #ffffff55;box-shadow:0 0 0 10px #ffffff0f,0 0 0 22px #ffffff08,0 14px 34px #00000033;backdrop-filter:blur(6px)}
.call .calli svg{width:36px;height:36px;margin:0;color:#fff;stroke-width:1.6;filter:drop-shadow(0 2px 8px #00a3ff)}
.call .calli:before{content:"";position:absolute;inset:-8px;border-radius:50%;border:1.5px dashed #ffffff55;animation:spin 16s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.call .cal-orb{position:absolute;border-radius:50%;background:radial-gradient(circle,#5cc0ff66,transparent 70%);pointer-events:none;animation:fl 8s ease-in-out infinite}
.call .o1{width:260px;height:260px;left:-60px;top:-80px}
.call .o2{width:220px;height:220px;right:-40px;bottom:-90px;animation-delay:-3s}
.call p{position:relative}
@media(prefers-reduced-motion:reduce){.call .calli:before,.call .cal-orb{animation:none}}

/* mission & vision: own image on each card */
.mv>div{overflow:hidden;padding:0 0 34px}
.mv .mi{position:relative;height:210px;margin-bottom:56px}
.mv .mi img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s}
.mv>div:hover .mi img{transform:scale(1.06)}
.mv .mi:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,#0a1a3355)}
.mv .mi .ti{position:absolute;left:34px;bottom:-30px;margin:0;z-index:2;border:4px solid #eef1f5;box-shadow:0 10px 26px #0a2a5a40}
.mv>div:last-child .mi .ti{border-color:#171d24}
.mv h3,.mv p{padding:0 34px}

/* ===== v4: Our approach redesign ===== */
.apx{display:grid;grid-template-columns:.85fr 1.15fr;gap:72px;align-items:center}
.apx-img{position:relative;max-width:430px;width:100%;justify-self:center;transition:opacity .7s,transform .7s}
.apx-img img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:32px 220px 32px 32px;box-shadow:0 24px 60px #0a2a5a30}
.apx-fr{position:absolute;inset:-16px 16px 16px -16px;border:2px solid #0a74d6;border-radius:32px 220px 32px 32px;opacity:.3;z-index:-1;animation:fl 7s ease-in-out infinite}
.apx-chip{position:absolute;right:-22px;bottom:36px;display:flex;gap:12px;align-items:center;background:#fff;border-radius:99px;padding:12px 22px 12px 14px;box-shadow:0 14px 34px #0a2a5a33;font:500 13px/1.25 var(--f2);color:var(--mute);animation:fl 6s ease-in-out infinite}
.apx-chip svg{width:40px;height:40px;padding:9px;border-radius:50%;background:linear-gradient(135deg,#00a3ff,#0a3a85);color:#fff}
.apx-chip b{display:block;font:700 16px var(--f1);color:#101826}
.apx-ey{display:inline-block;font:600 12px var(--f1);letter-spacing:.24em;text-transform:uppercase;color:#0a74d6;margin-bottom:10px;transition:opacity .7s,transform .7s}
.apx-steps{list-style:none;margin:34px 0 0;padding:0;position:relative}
.apx-steps:before{content:"";position:absolute;left:29px;top:30px;bottom:30px;width:2px;background:linear-gradient(#0a74d6,#0a74d633)}
.apx-steps li{position:relative;display:grid;grid-template-columns:60px 1fr;gap:26px;padding-bottom:34px;transition:opacity .7s,transform .7s}
.apx-steps li:last-child{padding-bottom:0}
.apx-n{position:relative;z-index:1;width:60px;height:60px;border-radius:50%;display:grid;place-items:center;font:800 18px var(--f1);color:#fff;background:linear-gradient(135deg,#00a3ff,#0a3a85);box-shadow:0 0 0 8px var(--bg),0 10px 24px #0a74d640}
.apx-steps li>div{background:#fff;border:1px solid #e0e8f2;border-radius:28px;padding:26px 30px;box-shadow:0 12px 30px #0a2a5a10;position:relative;transition:transform .4s,box-shadow .4s}
.apx-steps li:hover>div{transform:translateX(8px);box-shadow:0 20px 44px #0a2a5a1f}
.apx-ic{position:absolute;right:24px;top:22px;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#e8f2fd;color:#0a74d6;font-size:21px}
.apx-steps h3{font:700 21px var(--f1);color:#101826;margin:0 56px 10px 0}
.apx-steps p{margin:0;color:var(--mute);line-height:1.7;font-size:15.5px}
.apx-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.apx-tags span{font:600 12px var(--f1);padding:6px 14px;border-radius:99px;background:#eef3fa;color:#0a3a85}
@media(max-width:1000px){.apx{grid-template-columns:1fr;gap:44px}.apx-img{max-width:380px}.apx-chip{right:8px}}
@media(max-width:560px){.apx-steps:before{left:21px}.apx-steps li{grid-template-columns:44px 1fr;gap:16px}.apx-n{width:44px;height:44px;font-size:14px;box-shadow:0 0 0 6px var(--bg)}.apx-steps li>div{padding:22px 20px}.apx-ic{display:none}.apx-steps h3{margin-right:0;font-size:19px}}
@media(prefers-reduced-motion:reduce){.apx-fr,.apx-chip{animation:none}}