/* ---------- 4. homepage ---------- */
/* hero */
.sv3-hero{background:#142B7B;color:#FFFFFF;position:relative;overflow:hidden}
.sv3-hero-arc{position:absolute;right:-260px;top:70px;width:980px;height:980px;border-radius:50%;border:130px solid #F46C5E}
.sv3-hero .sv3-wrap{position:relative;padding-top:80px;padding-bottom:96px;display:flex;flex-wrap:wrap;gap:40px;align-items:center}
.sv3-hero-copy{flex:999 1 540px;min-width:0}
.sv3-eyebrow{font-weight:700;font-size:15px;letter-spacing:.6px;text-transform:uppercase;color:#FFC94D}
.sv3 .sv3-hero h1{font-weight:800;font-size:clamp(46px,6.4vw,86px);line-height:.98;letter-spacing:-1px;margin:16px 0 6px;color:#FFFFFF}
.sv3 .sv3-hero-script{font-size:44px;line-height:1.05;margin:0 0 26px;color:#F46C5E}
.sv3 .sv3-hero-lead{font-size:19px;line-height:1.55;color:#D3DAF5;margin:0 0 30px;max-width:540px}
.sv3-btns{display:flex;flex-wrap:wrap;gap:12px}
.sv3-collage{flex:1 1 420px;min-width:0;width:100%;max-width:432px;margin:0 auto;position:relative;aspect-ratio:1.087}
.sv3-collage-blob{position:absolute;left:14%;top:6%;width:80%;aspect-ratio:1;background:#D3DAF5;border-radius:50%}
.sv3-circ{position:absolute;aspect-ratio:1;background:#FFFFFF;border:2px solid #0F1F5C;border-radius:50%;box-shadow:7px 7px 0 #0F1F5C;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-family:'Kanit',sans-serif;font-weight:700;font-size:19px;color:#0F1F5C !important;text-decoration:none !important;transition:transform .25s cubic-bezier(.3,1.7,.5,1)}
.sv3-circ svg{width:56%;height:auto;display:block}
.sv3-circ:hover{transform:rotate(0) scale(1.05) !important}
.sv3-c1{left:2%;top:6%;width:46%;transform:rotate(-6deg)}
.sv3-c2{right:2%;top:2%;width:38%;background:#F46C5E;transform:rotate(5deg)}
.sv3-c3{right:2%;bottom:0;width:40%;transform:rotate(-3deg)}
.sv3-hero-badge{position:absolute;left:-4%;bottom:0;background:#0F1F5C;color:#FFFFFF;border:2px solid #FFFFFF;border-radius:18px;padding:12px 16px;transform:rotate(-4deg);max-width:230px}
.sv3-hero-badge strong{display:block;font-family:'Kanit',sans-serif;font-weight:800;font-size:28px;color:#F46C5E;line-height:1}
.sv3-hero-badge span{display:block;font-size:14px;font-weight:600;line-height:1.35;margin-top:4px}

/* stats */
.sv3-stats{background:#FFF7F3;border-bottom:2px solid #0F1F5C}
.sv3-stats .sv3-wrap{padding-top:64px;padding-bottom:56px}
.sv3-head-row{display:flex;flex-wrap:wrap;gap:12px 32px;align-items:flex-end;justify-content:space-between;margin-bottom:32px}
.sv3-head-row .sv3-script{font-size:28px;color:#C2412E}
.sv3-statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.sv3-stat{background:#FFFFFF;border:2px solid #0F1F5C;border-radius:24px;padding:28px;display:flex;flex-direction:column}
.sv3-stat-num{font-family:'Kanit',sans-serif;font-weight:800;font-size:72px;line-height:1}
.sv3 .sv3-stat p{margin:10px 0 0;font-size:18px;font-weight:600;flex:1}
.sv3 .sv3-stat a.sv3-cite{margin-top:14px;font-size:13px;font-weight:700;letter-spacing:.02em;text-decoration:none}
.sv3 .sv3-stat a.sv3-cite:hover{text-decoration:underline}
.sv3 .sv3-sources{margin:18px 0 0;font-size:13px;line-height:1.5;color:#4A5478}

/* what we do */
.sv3-services .sv3-wrap{padding-top:80px;padding-bottom:72px}
.sv3-svcgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.sv3-svc{background:#FFFFFF;border:2px solid #0F1F5C;border-radius:22px;padding:24px;display:flex;flex-direction:column;gap:10px;transition:transform .25s cubic-bezier(.3,1.7,.5,1)}
.sv3-svc:hover{transform:translateY(-6px) rotate(-1deg)}
.sv3 .sv3-svc h3{font-weight:700;font-size:22px;line-height:1.15}
.sv3 .sv3-svc p{color:#4A5478}
.sv3-svc-coral{background:#F46C5E}
.sv3 .sv3-svc-coral p{color:#0F1F5C}
.sv3-brands{margin-top:28px;background:#142B7B;color:#FFFFFF;border-radius:22px;padding:22px 28px;display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;justify-content:space-between}
.sv3-brands > span{font-family:'Kanit',sans-serif;font-weight:700;font-size:22px}
.sv3-brands div{display:flex;flex-wrap:wrap;gap:10px}
.sv3 .sv3-brands a{border:2px solid #FFFFFF;border-radius:999px;padding:6px 14px;font-weight:700;color:#FFFFFF;text-decoration:none}
.sv3 .sv3-brands a:hover{background:#FFFFFF;color:#142B7B}

/* clients */
.sv3-clients{background:#142B7B;color:#FFFFFF;position:relative;overflow:hidden}
.sv3-clients-arc{position:absolute;left:-420px;bottom:-620px;width:1100px;height:1100px;border-radius:50%;border:110px solid #F46C5E;opacity:.95}
.sv3-clients .sv3-wrap{position:relative;padding-top:80px;padding-bottom:96px}
.sv3-clientgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:32px 20px}
.sv3-client{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.sv3-client strong{font-family:'Kanit',sans-serif;font-size:20px;font-weight:700}
.sv3-client > span{color:#D3DAF5;font-size:15px}
.sv3-ring{width:170px;height:170px;border-radius:50%;border:5px solid #F46C5E;background:#E9EDFA;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#142B7B;font-family:'Kanit',sans-serif;font-weight:800;font-size:30px;line-height:1;text-align:center;padding:16px;transition:transform .25s cubic-bezier(.3,1.7,.5,1)}
.sv3-ring img{width:100%;height:100%;object-fit:cover;display:block}
.sv3-ring.sv3-has-img{padding:0}
.sv3-client:hover .sv3-ring{transform:rotate(-5deg) scale(1.04)}

/* our story */
.sv3-story{background:#FFF7F3;border-top:2px solid #0F1F5C;border-bottom:2px solid #0F1F5C}
.sv3-story > .sv3-wrap{padding-top:88px;padding-bottom:88px}
.sv3-story-top{display:flex;flex-wrap:wrap;gap:48px;align-items:center}
.sv3-story-copy{flex:1 1 460px;min-width:0}
.sv3-bullets{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:14px;font-size:17px;line-height:1.5}
.sv3-bullets li{display:flex;gap:12px}
.sv3-bullets li:before{content:"";flex:none;width:12px;height:12px;margin-top:7px;border-radius:50%;background:#F46C5E}
.sv3-pres-cta{margin-top:30px;padding-top:24px;border-top:2px dashed #F46C5E}
.sv3 .sv3-pres-cta p{margin:0 0 16px;font-size:17px;line-height:1.5;color:#4A5478}
.sv3-pres{flex:1 1 520px;min-width:0;max-width:640px;margin:0 auto;text-decoration:none !important;display:block}
.sv3-pres-tilt{position:relative;transform:rotate(-2deg);transition:transform .3s cubic-bezier(.3,1.7,.5,1)}
.sv3-pres:hover .sv3-pres-tilt{transform:rotate(0)}
.sv3-pres-shadow{position:absolute;top:18px;right:-14px;bottom:-14px;left:18px;background:#F46C5E;border:2px solid #0F1F5C;border-radius:22px}
.sv3-pres-cover{position:relative;aspect-ratio:1.778;background:#142B7B;border:2px solid #0F1F5C;border-radius:22px;overflow:hidden;padding:28px;color:#FFFFFF}
.sv3-pres-arc{position:absolute;right:-140px;top:40px;width:420px;height:420px;border-radius:50%;border:64px solid #F46C5E}
.sv3-pres-logo{position:relative;display:inline-block;background:#FFFFFF;border-radius:10px;padding:6px 10px;color:#0C2C84;line-height:0}
.sv3-pres-logo svg{height:52px;width:auto;display:block}
.sv3-pres-title{position:relative;font-family:'Kanit',sans-serif;font-weight:800;font-size:clamp(26px,3.2vw,44px);line-height:.98;margin-top:22px}
.sv3-pres-script{position:absolute;right:22px;bottom:20px;font-size:24px;color:#FFFFFF}
.sv3-pres-play{position:absolute;left:76%;top:52%;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;background:#FFFFFF;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 0 #0F1F5C;transition:transform .25s cubic-bezier(.3,1.7,.5,1)}
.sv3-pres:hover .sv3-pres-play{transform:scale(1.12)}
.sv3-thumbs{display:flex;gap:10px;margin-top:30px;padding-left:10px;align-items:flex-start}
.sv3-thumb{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.sv3-thumb img{width:100%;aspect-ratio:1.778;object-fit:cover;display:block;border-radius:8px;border:2px solid #0F1F5C}
.sv3-thumb span{font-size:11px;font-weight:700;color:#4A5478;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sv3-thumb-count{flex:none;align-self:flex-start;height:44px;padding:0 12px;margin-top:8px;border-radius:8px;background:#0F1F5C;color:#FFFFFF;display:flex;align-items:center;font-weight:800;font-size:14px}
.sv3-team{margin-top:64px;background:#FFFFFF;border:2px solid #0F1F5C;border-radius:28px;padding:32px}
.sv3-team-head{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:baseline;justify-content:space-between;margin-bottom:24px}
.sv3 .sv3-team-head h3{font-weight:700;font-size:30px}
.sv3 .sv3-team-head p{font-size:26px;color:#C2412E}
.sv3-teamgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.sv3-person{display:flex;gap:18px;align-items:center}
.sv3-person .sv3-ring{flex:none;width:96px;height:96px;border-width:4px;font-size:26px;padding:0}
.sv3-person strong{font-family:'Kanit',sans-serif;font-weight:700;font-size:20px;display:block}
.sv3-person span{color:#4A5478}

/* FAQ */
.sv3-faqsec{background:#FFF7F3}
.sv3-faqsec .sv3-wrap{padding-top:80px;padding-bottom:80px;display:flex;flex-wrap:wrap;gap:40px}
.sv3-faq-intro{flex:1 1 300px;min-width:0}
.sv3 .sv3-faq-intro p{margin:0 0 24px;color:#4A5478;font-size:17px;line-height:1.55}
.sv3-faqs{flex:2 1 560px;min-width:0;display:flex;flex-direction:column;gap:12px}
.sv3-faq{background:#FFFFFF;border:2px solid #0F1F5C;border-radius:18px;padding:0 22px}
.sv3-faq summary{cursor:pointer;list-style:none;font-weight:800;font-size:17px;padding:18px 0;display:flex;justify-content:space-between;gap:16px;align-items:center}
.sv3-faq summary::-webkit-details-marker{display:none}
.sv3-faq summary:after{content:"+";font-family:'Kanit',sans-serif;font-size:26px;line-height:1;color:#C2412E;flex:none}
.sv3-faq[open] summary:after{content:"-"}
.sv3 .sv3-faq p{margin:0 0 18px;color:#4A5478;font-size:16px;line-height:1.55}

@media (max-width:767px){
  .sv3-hero .sv3-wrap{padding-top:48px;padding-bottom:64px}
  .sv3 .sv3-hero-script{font-size:34px}
  .sv3-hero-arc{right:-560px;top:auto;bottom:-620px}
  .sv3-clients-arc{display:none}
  .sv3-circ{font-size:15px}
  .sv3-hero-badge{left:0;max-width:180px;padding:10px 12px}
  .sv3-hero-badge strong{font-size:22px}
  .sv3-hero-badge span{font-size:12px}
  .sv3-stat-num{font-size:56px}
  .sv3-ring{width:140px;height:140px}
  .sv3-story > .sv3-wrap{padding-top:56px;padding-bottom:56px}
  .sv3-pres-cover{padding:16px}
  .sv3-pres-logo svg{height:34px}
  .sv3-pres-script{display:none}
  .sv3-pres-play{width:52px;height:52px;margin:-26px 0 0 -26px}
  .sv3-thumbs{flex-wrap:wrap;padding-left:0}
  .sv3-thumb{flex:1 1 28%}
  .sv3-thumb-count{display:none}
  .sv3-team{padding:22px}
}
