.landing p a, .landing .faq a, .landing .footer a { color: var(--cyan); }
.hero { display: grid; gap: 28px; max-width: 1180px; margin: 0 auto; padding: 28px 16px 20px; align-items: center; }
@media (min-width: 980px) { .hero { grid-template-columns: 1fr 380px; padding-top: 48px; } }
.hero__title { margin: 10px 0 16px; font: 400 clamp(24px, 5.4vw, 46px)/1.25 var(--pixel); color: var(--cream); text-shadow: 4px 5px 0 var(--pink); }
.hero__title b { font-weight: 400; color: var(--yellow); }
.hero__lead { font-size: 19px; line-height: 1.5; color: var(--cream); max-width: 40em; }
.hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 22px 0 10px; }
.hero__ctas .btn-start { margin: 0; }
.hero__fine { color: var(--muted); font-size: 14px; text-align: center; }
.hero__text .hero__fine { text-align: left; }
.hero__phone .phone { height: 680px; max-width: 360px; margin: 0 auto; }
.band { max-width: 1180px; margin: 0 auto; padding: 36px 16px; }
.band__title { margin: 0 0 18px; font: 400 16px/1.4 var(--pixel); color: var(--yellow); text-align: center; }
.band__sub { text-align: center; font: 400 11px/1.4 var(--pixel); color: #3ddc84; margin: -6px 0 16px; }
.steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
@media (min-width: 760px) { .steps { grid-template-columns: repeat(4, 1fr); } }
.steps li, .feature { padding: 16px; border-radius: 14px; background: rgba(12, 19, 56, .9); box-shadow: inset 0 0 0 2px rgba(127, 212, 255, .3); }
.steps b, .feature b { display: block; margin-bottom: 8px; font: 400 11px/1.4 var(--pixel); color: var(--cyan); }
.steps span, .feature span { color: var(--cream); line-height: 1.45; }
.features { display: grid; gap: 12px; }
@media (min-width: 760px) { .features { grid-template-columns: repeat(3, 1fr); } }
.plans--landing .plan { cursor: default; }
.plans--landing .plan.is-best { box-shadow: inset 0 0 0 3px var(--yellow); }
.faq { max-width: 760px; margin: 0 auto; }
.faq details { margin: 0 0 10px; padding: 14px 16px; border-radius: 12px; background: rgba(12, 19, 56, .9); box-shadow: inset 0 0 0 2px rgba(127, 212, 255, .25); }
.faq summary { cursor: pointer; font-weight: 800; }
.faq p { margin: 10px 0 0; color: var(--muted); }
.doc { max-width: 760px; margin: 0 auto; padding: 28px 16px 60px; line-height: 1.6; }
.doc h1 { font: 400 20px/1.4 var(--pixel); color: var(--yellow); }
.doc h2 { font: 400 13px/1.4 var(--pixel); color: var(--cyan); margin-top: 28px; }
.doc .draft { padding: 10px 14px; border-radius: 10px; background: rgba(255, 210, 63, .12); box-shadow: inset 0 0 0 2px var(--yellow); }
.plans { display: grid; gap: 10px; margin: 8px 0 16px; }
@media (min-width: 760px) { .plans { grid-template-columns: repeat(3, 1fr); } }
.plan { position: relative; display: block; padding: 14px; border-radius: 12px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 2px rgba(127,212,255,.35); cursor: pointer; }
.plan:has(input:checked) { box-shadow: inset 0 0 0 3px var(--yellow); background: rgba(255,210,63,.08); }
.plan:has(input:disabled) { opacity: .55; cursor: default; }
.plan.is-current { opacity: 1; box-shadow: inset 0 0 0 3px #3ddc84; }
.plan input { position: absolute; opacity: 0; pointer-events: none; }
.plan__head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.plan__head b { font: 400 12px/1.3 var(--pixel); color: var(--cream); }
.plan__price { font-weight: 800; color: var(--yellow); }
.plan ul { margin: 10px 0 0; padding-left: 18px; color: var(--muted); font-size: 14px; }
.plan__tag { display: inline-block; margin-top: 8px; font: 400 9px/1 var(--pixel); color: #3ddc84; }
