.spo{--ink:#0b1b3e;--muted:#5e6f87;--line:#dce6f2;--blue:#0b6bea;--soft:#f5f9ff;--ok:#12805c;color:var(--ink)}
.spo .wrap{width:min(1180px,calc(100% - 36px));margin:auto}.spo-hero{padding:72px 0 54px;background:linear-gradient(180deg,#f4f8ff 0,#fff 100%);text-align:center}.spo-kicker{display:inline-block;color:var(--blue);font-size:.78rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.spo-hero h1{max-width:850px;margin:10px auto 14px;font-size:clamp(2.15rem,4.5vw,3.55rem);line-height:1.04;letter-spacing:-.035em}.spo-hero p{max-width:760px;margin:0 auto;color:var(--muted);font-size:1.07rem;line-height:1.7}.spo-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:24px}.spo-actions-start{justify-content:flex-start}.spo-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;border-radius:11px;background:var(--blue);color:#fff!important;font-weight:850;text-decoration:none}.spo-btn.secondary{background:#fff;color:var(--blue)!important;border:1.5px solid #b9cee9}.spo-sec{padding:56px 0}.spo-sec.alt{background:var(--soft)}.spo-heading{text-align:center;max-width:760px;margin:0 auto 28px}.spo-heading h2{margin:7px 0 9px;font-size:clamp(1.7rem,3vw,2.45rem);line-height:1.08;letter-spacing:-.025em}.spo-heading p{margin:0;color:var(--muted);line-height:1.65}.spo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.spo-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:20px;background:#fff;padding:22px;box-shadow:0 10px 28px rgba(11,27,62,.045)}.spo-card .icon{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:#eaf3ff;font-size:1.35rem}.spo-card h3{margin:16px 0 7px;font-size:1.18rem}.spo-card p{margin:0;color:var(--muted);line-height:1.55;flex:1}.spo-card-price{display:flex;justify-content:space-between;align-items:end;gap:10px;margin-top:18px;padding-top:15px;border-top:1px solid #edf2f7}.spo-card-price strong{font-size:1.32rem;color:var(--blue)}.spo-card-price a{font-weight:850;color:var(--blue);text-decoration:none}.spo-detail-hero{padding:62px 0 44px;background:linear-gradient(135deg,#071f45,#0c5eb8);color:#fff}.spo-detail-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:42px;align-items:center}.spo-detail-hero .spo-kicker{color:#9ecaff}.spo-detail-hero h1{font-size:clamp(2.2rem,4.4vw,3.65rem);line-height:1.03;letter-spacing:-.035em;margin:9px 0 14px}.spo-detail-hero p{font-size:1.08rem;line-height:1.67;color:#d9e8fb;max-width:720px;margin:0}.spo-pricebox{background:#fff;color:var(--ink);border-radius:22px;padding:24px;box-shadow:0 18px 45px rgba(0,0,0,.18)}.spo-pricebox small{display:block;color:var(--muted);font-weight:750}.spo-pricebox strong{display:block;font-size:2.25rem;color:var(--blue);margin:4px 0 14px}.spo-pricebox .spo-btn{width:100%}.spo-features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px}.spo-feature{padding:18px;border:1px solid var(--line);border-radius:16px;background:#fff}.spo-feature b{display:block;color:var(--ok);margin-bottom:6px}.spo-feature span{color:var(--muted);line-height:1.5}.spo-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;counter-reset:flow}.spo-flow article{counter-increment:flow;border:1px solid var(--line);border-radius:18px;padding:20px;background:#fff}.spo-flow article::before{content:counter(flow,decimal-leading-zero);display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:var(--blue);color:#fff;font-weight:900}.spo-flow h3{font-size:1.03rem;margin:13px 0 6px}.spo-flow p{margin:0;color:var(--muted);line-height:1.52}.spo-note{border:1px solid #cfe0f5;border-radius:20px;background:#f7fbff;padding:22px}.spo-note h3{margin:0 0 7px}.spo-note p{margin:0;color:var(--muted);line-height:1.6}.spo-back{display:inline-block;margin-top:18px;color:var(--blue);font-weight:800;text-decoration:none}
@media(max-width:900px){.spo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.spo-detail-grid{grid-template-columns:1fr}.spo-flow{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.spo .wrap{width:min(100% - 24px,1180px)}.spo-hero{padding:48px 0 36px}.spo-grid,.spo-features,.spo-flow{grid-template-columns:1fr}.spo-detail-hero{padding:44px 0 36px}.spo-actions{flex-direction:column}.spo-actions .spo-btn{width:100%}}
