/* /why/ explainer page: extends ../style.css */
.why-hero .hero-in{padding-top:30px;padding-bottom:34px;max-width:820px}
.why-hero h1{font-size:34px}
.why-hero .h1-en{font-size:20px;font-weight:500;color:var(--mint)}
.why-hero .lead{font-size:18px;max-width:680px}
.why-hero .lead-en{max-width:680px}
.back{display:inline-block;margin:0 0 14px;color:var(--mint);font-size:15px;text-decoration:none}
.back:hover{text-decoration:underline}
.scen{display:grid;gap:14px;margin:26px auto 0;max-width:860px}
.q{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:0 2px 10px rgba(6,78,59,.05)}
.q .bar{display:flex;align-items:center;gap:10px;border:2px solid var(--line);border-radius:999px;padding:9px 14px;font-weight:600;color:var(--ink);font-size:16px;line-height:1.3}
.q .bar i{font-style:normal;font-size:20px}
.q p{margin:10px 4px 0;color:var(--ink2);font-size:15px}
.q p[lang]{color:var(--mut);font-size:14px;margin-top:4px}
.wsteps{list-style:none;padding:0;margin:28px auto 0;display:grid;gap:16px;max-width:860px}
.wsteps li{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px 18px;box-shadow:0 2px 10px rgba(6,78,59,.05)}
.wsteps h3{font-size:20px;color:var(--g9);font-weight:600;line-height:1.3}
.wsteps h3 .ic{margin-right:6px}
.wsteps h3 span[lang]{display:block;font-size:15px;font-weight:500;color:var(--mut);margin-top:2px}
.wsteps p{margin:8px 0 0;color:var(--ink2);line-height:1.6}
.wsteps p[lang]{color:var(--mut);font-size:15px;margin-top:6px}
.note{max-width:860px;margin:22px auto 0;background:#FFFBEB;border:1px dashed var(--or2);border-radius:14px;padding:16px 18px;color:var(--ink2);line-height:1.55}
.note p{margin:0}.note p[lang]{margin-top:8px;color:var(--mut);font-size:15px}
.note b{color:var(--g9)}
.cta-sec h2{color:#fff}
.cta-sec .sub{color:var(--mint);max-width:600px;margin-left:auto;margin-right:auto}
.cta-sec .sub span{color:var(--mint);opacity:.85}
.cta-sec .price-box{margin-top:24px}
.cta-sec .btn-lg{display:flex;width:100%;margin-top:22px}
.cta-sec .pay{margin:14px 0 0;text-align:center;color:var(--mint);font-size:15px}
.foot-links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;margin-top:6px!important}
.foot-links a{color:var(--mint);font-size:14px}
@media (min-width:700px){.scen{grid-template-columns:1fr 1fr}.why-hero h1{font-size:46px}.why-hero .hero-in{padding-top:48px;padding-bottom:52px}}