.overview{display:grid;grid-template-columns:repeat(6,1fr);gap:0;position:relative;margin-top:8px}
.overview a{text-align:center;padding:0 6px;position:relative}
.overview a::before{content:"";position:absolute;top:22px;left:50%;width:100%;height:2px;background:repeating-linear-gradient(90deg,var(--teal) 0 6px,transparent 6px 11px);opacity:.35}
.overview a:last-child::before{display:none}
.overview .o{width:46px;height:46px;border-radius:50%;margin:0 auto 10px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:var(--num);font-weight:600;color:var(--teal);position:relative;transition:.15s}
.overview a:hover .o{background:var(--teal);color:#fff;border-color:var(--teal)}
.overview b{display:block;font-size:14px;color:var(--navy)}
.overview small{color:var(--muted);font-size:12px}

.steps{display:flex;flex-direction:column;gap:20px}
.step{display:grid;grid-template-columns:300px 1fr;gap:0;overflow:hidden;scroll-margin-top:130px}
.step .side{background:var(--navy);color:#fff;padding:30px;position:relative;overflow:hidden}
.step .side::after{content:attr(data-n);position:absolute;right:-8px;bottom:-34px;font-family:var(--num);font-size:150px;font-weight:700;color:rgba(255,255,255,.05);line-height:1}
.step .side .no{font-family:var(--num);color:var(--teal-2);font-weight:600;font-size:13px;letter-spacing:2px}
.step .side h3{font-size:24px;font-weight:600;margin:6px 0 10px}
.step .side p{font-size:13.5px;opacity:.7}
.step.core .side{background:linear-gradient(160deg,var(--teal),#0c5f63)}
.step.core .side .no{color:#c9fff4}
.step .main{padding:28px 32px;display:grid;grid-template-columns:1fr 1fr;gap:28px}
.step h4{font-size:13px;color:var(--muted);font-weight:600;letter-spacing:1px;margin-bottom:10px}
.step ul.pts{list-style:none;display:flex;flex-direction:column;gap:8px}
.step ul.pts li{font-size:14px;padding-left:18px;position:relative;color:#33414d}
.step ul.pts li::before{content:"";position:absolute;left:2px;top:9px;width:6px;height:6px;border-radius:50%;background:var(--teal-2)}
.reag{display:flex;flex-direction:column;gap:8px}
.reag a{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:12px;padding:8px 12px;transition:.15s}
.reag a:hover{border-color:var(--teal);box-shadow:0 6px 16px rgba(11,26,42,.06)}
.reag img{width:46px;height:46px;object-fit:contain;mix-blend-mode:multiply;background:var(--bg);border-radius:8px}
.reag b{display:block;font-size:13.5px;font-weight:600}
.reag small{font-family:var(--num);color:var(--muted);font-size:12px}
.param{margin-top:14px;background:#fffaf0;border:1px dashed #ecd9a8;border-radius:10px;padding:10px 12px;font-size:12.5px;color:#7a5600}

.apps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.app{padding:26px}
.app h3{font-size:18px;font-weight:600;color:var(--navy);margin:14px 0 6px}
.app p{font-size:14px;color:var(--muted)}
.app .ic{width:44px;height:44px;border-radius:12px;background:var(--teal-soft);color:var(--teal);display:flex;align-items:center;justify-content:center}
.metrics{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px}
.metric{padding:24px 28px;display:flex;align-items:center;gap:22px}
.metric b{font-family:var(--num);font-size:46px;font-weight:600;color:var(--teal);line-height:1}
.metric b small{font-size:18px;margin-left:2px}
.metric span{font-size:14px;color:var(--muted)}
.metric span strong{display:block;color:var(--navy);font-size:16px}

.faq{max-width:880px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:14px;margin-bottom:10px;overflow:hidden}
.faq summary{list-style:none;cursor:pointer;padding:18px 22px;font-weight:600;font-size:15px;display:flex;justify-content:space-between;gap:12px;color:var(--navy)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:20px;color:var(--teal);line-height:1}
.faq details[open] summary::after{content:"–"}
.faq .ans{padding:0 22px 18px;color:#3a4651;font-size:14px}
.faq .ans a{color:var(--teal)}
@media (max-width:900px){
  .overview{grid-template-columns:repeat(3,1fr);row-gap:20px}
  .overview a:nth-child(3)::before{display:none}
  .step{grid-template-columns:1fr}
  .step .side{padding:22px}
  .step .main{grid-template-columns:1fr;padding:20px;gap:20px}
  .apps,.metrics{grid-template-columns:1fr}
}