:root{
  --bg:#0A0A0A; --card:#141417; --card2:#1B1B20; --line:#2A2A31; --text:#FFFFFF; --muted:#B4B4BE;
  --orange:#E8502C; --violet:#5018F0; --violet-l:#8B6CFF; --mint:#6FF7BA; --yellow:#F5EF5A; --error:#FF7A5C; --ok:#6FF7BA;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg) url('img/bg.jpg') top center/100% auto repeat-y;color:var(--text);
  font-family:'Manrope',system-ui,sans-serif;font-size:17px;line-height:1.5;min-height:100vh}
.display{font-family:'Oswald','Arial Narrow',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.01em;line-height:1.02}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.narrow{max-width:720px}
a{color:var(--orange)} a:hover{color:#ff6a45}
.hidden{display:none!important}

/* top bar */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 0}
.topbar img{height:52px;width:auto;display:block}
.topbar nav{display:flex;gap:18px;flex-wrap:wrap}
.topbar nav a{color:var(--text);font-weight:700;font-size:15px;text-decoration:none}
.topbar nav a:hover{color:var(--orange)}

/* hero */
.hero{position:relative;padding:24px 0 20px;overflow:hidden}
.burst{position:absolute;right:-120px;top:-60px;width:520px;max-width:70vw;pointer-events:none}
.team{font-weight:800;font-size:13px;letter-spacing:.2em;color:var(--orange);text-transform:uppercase;position:relative}
.logo{display:block;width:min(520px,86vw);height:auto;margin:16px 0 20px;position:relative}
.lead{font-size:clamp(18px,2.4vw,22px);font-weight:600;max-width:600px;margin:0 0 20px;position:relative}
h1.page{font-size:clamp(40px,7vw,72px);margin:8px 0 14px;position:relative}
h1.page em,h2 em{font-style:normal;color:var(--orange)}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;position:relative}
.skew{display:inline-block;transform:skewX(-12deg)} .skew>span{display:inline-block;transform:skewX(12deg)}
.chip{background:var(--orange);padding:8px 20px;font-family:'Oswald',sans-serif;font-weight:700;font-size:20px;letter-spacing:.03em}
.chip.violet{background:var(--violet)} .chip.mint{background:var(--mint);color:#0A0A0A} .chip.yellow{background:var(--yellow);color:#0A0A0A}
.path{font-family:'Oswald',sans-serif;font-weight:700;font-size:18px;letter-spacing:.04em;text-transform:uppercase}
.path i{font-style:normal;color:var(--orange);margin:0 6px}

/* cards */
.grid{display:grid;grid-template-columns:1fr;gap:24px;padding:20px 0 56px}
@media (min-width:920px){.grid.two-col{grid-template-columns:1.05fr .95fr;align-items:start}}
.card{background:var(--card);border:1px solid var(--line);padding:28px 22px}
@media (min-width:600px){.card{padding:36px}}
.card h2{font-size:clamp(32px,5vw,44px);margin:0 0 8px}
.card h3{font-size:28px;margin:0 0 14px}
.sub{color:var(--muted);margin:0 0 24px;font-weight:500}

/* form */
.field{margin-bottom:18px}
label{display:block;font-weight:700;font-size:15px;margin-bottom:8px}
.hint{font-weight:500;color:var(--muted);font-size:13px}
input[type=text],input[type=tel],input[type=email],input[type=password],input[type=url],input[type=number]{
  width:100%;height:54px;padding:0 16px;background:#0E0E11;border:2px solid #33333B;color:var(--text);
  font:600 17px 'Manrope',system-ui,sans-serif;border-radius:0;outline:none;transition:border-color .15s}
input::placeholder{color:#6E6E78}
input:focus{border-color:var(--orange)}
input[aria-invalid=true]{border-color:var(--error)}
.err{display:none;color:var(--error);font-size:14px;font-weight:600;margin-top:6px}
.field.invalid .err{display:block}
.pair{display:grid;grid-template-columns:1fr;gap:0 16px}
@media (min-width:600px){.pair{grid-template-columns:1fr 1fr}}
.check{display:flex;gap:12px;align-items:flex-start;margin:6px 0 16px;font-size:14px;color:var(--muted);font-weight:500;cursor:pointer}
.check.big{font-size:16px;color:var(--text);font-weight:700}
.check input{appearance:none;-webkit-appearance:none;flex:0 0 24px;width:24px;height:24px;border:2px solid #4A4A55;background:#0E0E11;margin:1px 0 0;cursor:pointer;position:relative}
.check input:checked{background:var(--orange);border-color:var(--orange)}
.check input:checked::after{content:"";position:absolute;left:6px;top:1px;width:7px;height:13px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
.check input:focus-visible{outline:2px solid #fff;outline-offset:2px}
.check.invalid{color:var(--error)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:58px;padding:0 34px;border:0;cursor:pointer;
  background:var(--orange);color:#fff;font-family:'Oswald',sans-serif;font-weight:700;font-size:21px;letter-spacing:.05em;text-transform:uppercase;
  clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%);transition:background .15s,transform .1s;text-decoration:none;text-align:center}
.btn.block{display:flex;width:100%}
.btn:hover{background:#ff5d36;color:#fff}
.btn:active{transform:translateY(1px)}
.btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.btn[disabled]{opacity:.6;cursor:progress}
.btn.violet{background:var(--violet)} .btn.violet:hover{background:#6433ff}
.btn.ghost{background:transparent;border:2px solid #4A4A55;clip-path:none;min-height:48px;font-size:17px;padding:0 20px}
.btn.ghost:hover{border-color:var(--orange);background:transparent}
.btn.small{min-height:44px;font-size:16px;padding:0 18px}
.formmsg{margin-top:14px;font-weight:600;font-size:15px;color:var(--error);min-height:1em}
.formmsg.good{color:var(--ok)}

/* result blocks */
.result .icon{width:72px;height:auto;margin-bottom:14px}
.result h2{font-size:clamp(40px,7vw,56px)}
.result p{font-weight:600;margin:0 0 20px}
.note{color:var(--muted);font-size:14px;margin-top:14px;font-weight:500}
.bignum{font-family:'Oswald',sans-serif;font-weight:700;font-size:clamp(64px,14vw,120px);line-height:.95;color:var(--mint)}
.team-list{list-style:none;margin:0 0 22px;padding:0;border-top:1px solid var(--line)}
.team-list li{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-weight:600;flex-wrap:wrap}
.team-list .tg{color:var(--muted);font-weight:600}
.badge{display:inline-block;background:var(--yellow);color:#0A0A0A;font-size:12px;font-weight:800;padding:2px 8px;margin-left:8px;letter-spacing:.04em;text-transform:uppercase;vertical-align:2px}
.badge.me{background:#33333B;color:#fff}
.task{background:var(--card2);border-left:0;padding:22px;margin:0 0 20px;border:1px solid #3A3A44}
.task b{display:block;font-family:'Oswald',sans-serif;font-size:22px;text-transform:uppercase;letter-spacing:.03em;margin-bottom:6px;color:var(--yellow)}
.task ol{margin:8px 0 16px;padding-left:22px;font-weight:500}

/* levels */
.lvl{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-top:1px solid var(--line)}
.lvl:first-of-type{border-top:0;padding-top:4px}
.num{flex:0 0 52px;height:52px;display:flex;align-items:center;justify-content:center;transform:skewX(-12deg);font-family:'Oswald',sans-serif;font-weight:700;font-size:26px}
.num span{transform:skewX(12deg)}
.lvl h4{margin:0 0 2px;font-family:'Oswald',sans-serif;font-weight:700;font-size:26px;text-transform:uppercase;letter-spacing:.02em;line-height:1.1}
.lvl .d{font-size:13px;font-weight:700;color:var(--muted);letter-spacing:.06em;margin-bottom:6px}
.lvl p{margin:0;color:#D6D6DC;font-size:15px;font-weight:500}
.rule{margin-top:18px;background:var(--orange);padding:18px 20px;font-weight:700}
.rule b{display:block;font-family:'Oswald',sans-serif;font-size:22px;text-transform:uppercase;letter-spacing:.03em;margin-bottom:4px}

/* choice cards on index */
.choices{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:760px){.choices{grid-template-columns:1fr 1fr}}
.choice{display:block;text-decoration:none;color:var(--text);background:var(--card);border:1px solid var(--line);padding:30px;transition:border-color .15s,transform .15s}
.choice:hover{border-color:var(--orange);color:var(--text);transform:translateY(-2px)}
.choice .k{font-size:13px;font-weight:800;letter-spacing:.14em;color:var(--orange);text-transform:uppercase}
.choice h3{font-family:'Oswald',sans-serif;font-size:34px;text-transform:uppercase;margin:8px 0 8px;line-height:1.05}
.choice p{margin:0 0 18px;color:var(--muted);font-weight:500}
.choice .go{font-family:'Oswald',sans-serif;font-weight:700;font-size:20px;text-transform:uppercase;color:var(--orange)}

footer{border-top:1px solid var(--line);padding:24px 0 36px;color:var(--muted);font-size:13px;font-weight:600}
footer .wrap{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}
footer a{color:var(--muted)}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}