/* ================= QUIZ MODAL ================= */
@keyframes fade{from{opacity:0}to{opacity:1}}
#quizBox{position:relative;max-width:1020px;margin:0 auto;background:#fff;
  border-radius:clamp(18px,2vw,26px);overflow:hidden;display:grid;grid-template-columns:340px 1fr;
  box-shadow:var(--shadow-lg);animation:pop .45s var(--ease) both}
@keyframes pop{from{opacity:0;transform:translateY(26px) scale(.985)}to{opacity:1;transform:none}}
.q-aside{background:linear-gradient(165deg,var(--navy-deep),#062E60);color:#fff;padding:36px 32px;
  display:flex;flex-direction:column;position:relative;overflow:hidden}
.q-aside::before{content:"";position:absolute;width:300px;height:300px;left:-110px;bottom:-130px;border-radius:50%;
  background:radial-gradient(circle,rgba(242,176,46,.22),transparent 70%)}
.q-aside .brand{margin:0 0 30px}
.q-aside h1,.q-aside h2{font-size:1.42rem;letter-spacing:-.03em;margin-bottom:12px;position:relative}
.q-aside p{font-size:.9rem;color:#A9C6E6;position:relative}
.q-steps{list-style:none;padding:0;margin:32px 0 0;display:grid;gap:3px;position:relative}
.q-steps li{display:flex;gap:12px;align-items:center;font-size:.88rem;color:#7EA3CC;padding:8px 0;
  transition:color .35s}
.q-steps li i{flex:none;width:22px;height:22px;border-radius:50%;border:1.5px solid rgba(255,255,255,.24);
  display:grid;place-items:center;font-style:normal;font-size:.68rem;font-weight:700;transition:all .35s var(--ease)}
.q-steps li.on{color:#fff}
.q-steps li.on i{background:var(--gold);border-color:var(--gold);color:#2A1A00}
.q-steps li.done i{background:rgba(255,255,255,.2);border-color:transparent;color:#fff}
.q-secure{margin-top:auto;padding-top:26px;font-size:.78rem;color:#89A9CB;display:flex;gap:9px;align-items:flex-start;position:relative}
.q-main{display:flex;flex-direction:column;min-height:0}
.q-bar{height:4px;background:var(--mist);flex:none}
.q-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--navy),var(--navy-soft));
  transition:width .55s var(--ease)}
.q-body{padding:clamp(26px,3.2vw,46px);flex:1;min-height:0}
.q-count{font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep)}
.q-body h2{font-size:clamp(1.35rem,2.3vw,1.85rem);margin:12px 0 6px;letter-spacing:-.028em;outline-offset:4px}
.q-hint{color:var(--muted);font-size:.93rem;margin-bottom:26px}
.q-opts{display:grid;gap:10px}
.q-opts.two{grid-template-columns:1fr 1fr}
.q-opt{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1.5px solid var(--line-in);
  border-radius:14px;background:#fff;cursor:pointer;text-align:left;font-size:.98rem;font-weight:500;
  transition:all .25s var(--ease);width:100%}
.q-opt:hover{border-color:var(--navy-soft);background:#FAFCFF;transform:translateX(3px)}
.q-opt i{flex:none;width:22px;height:22px;border-radius:50%;border:1.8px solid var(--line-in);
  display:grid;place-items:center;transition:all .25s var(--ease)}
.q-opt.sq i{border-radius:7px}
.q-opt[aria-checked="true"]{border-color:var(--navy);background:#F3F8FF;font-weight:600}
.q-opt[aria-checked="true"] i{background:var(--navy);border-color:var(--navy)}
.q-opt[aria-checked="true"] i::after{content:"";width:8px;height:8px;border-radius:50%;background:#fff}
.q-opt.sq[aria-checked="true"] i::after{width:11px;height:7px;border-radius:0;background:none;
  border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translate(1px,-2px)}
.q-foot{display:flex;gap:12px;align-items:center;padding:20px clamp(26px,3.2vw,46px);
  border-top:1px solid var(--line);background:#FBFCFE;flex:none}
.q-foot .sp{margin-left:auto}
#qBack{background:#fff;border:1.5px solid var(--line-in);border-radius:999px;color:var(--muted);
  cursor:pointer;font-weight:600;font-size:.92rem;display:inline-flex;gap:8px;align-items:center;padding:11px 20px}
#qBack:hover{color:var(--navy);border-color:var(--navy)}
.q-err{display:flex;gap:9px;align-items:center;margin-top:16px;padding:11px 14px;border-radius:10px;
  background:#FCEDEC;border:1px solid #E7B7B4;color:#8E2C27;font-size:.88rem;font-weight:500}
#qBack{min-height:44px}

/* ---------- поля формы: при переносе квиза на отдельную страницу
              эти правила потерялись, и город, штат и контакты
              выводились без оформления ---------- */
.f{margin-bottom:16px}
.f label{display:block;font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);margin-bottom:8px}
.f input,.f select{width:100%;padding:13px 15px;border:1.5px solid var(--line);border-radius:10px;
  background:#fff;font:inherit;font-size:.97rem;color:var(--ink);
  transition:border-color .25s var(--ease),box-shadow .25s var(--ease)}
.f select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:42px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%235C6B80' stroke-width='2'><path d='M1 1l5 5 5-5'/></svg>");
  background-repeat:no-repeat;background-position:right 16px center}
.f input::placeholder{color:var(--line-in)}
.f input:focus,.f select:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 4px rgba(0,55,123,.12)}
.f input[aria-invalid="true"],.f select[aria-invalid="true"]{border-color:#C0453D}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px}

/* телефон: код страны стоит в поле, чтобы его не вводили ещё раз */
.f-tel{display:flex;align-items:stretch;border:1.5px solid var(--line);border-radius:10px;background:#fff;
  transition:border-color .25s var(--ease),box-shadow .25s var(--ease)}
.f-tel:focus-within{border-color:var(--navy);box-shadow:0 0 0 4px rgba(0,55,123,.12)}
.f-tel b{display:grid;place-items:center;padding:0 13px;font-weight:600;font-size:.97rem;color:var(--muted);
  border-right:1.5px solid var(--line);background:var(--mist);border-radius:9px 0 0 9px}
.f-tel input{border:0!important;box-shadow:none!important;border-radius:0 9px 9px 0;letter-spacing:.02em}
.f-tel[data-invalid="true"]{border-color:#C0453D}

.consent{display:flex;gap:11px;align-items:flex-start;font-size:.85rem;color:var(--muted);margin:8px 0 16px;
  cursor:pointer}
.consent input{margin-top:3px;accent-color:var(--navy);width:17px;height:17px;flex:none}
.consent a{color:var(--navy);text-decoration:underline;text-underline-offset:2px}

@media(max-width:640px){ .frow{grid-template-columns:1fr} }
.q-done{text-align:center;padding:clamp(30px,5vw,60px) 10px}
.q-done.plain{text-align:left;padding:clamp(26px,4vw,44px) 0}
.q-done.plain .tick{margin:0 0 22px}
.q-done.plain .q-hint,.q-done.plain .q-sum,.q-done.plain p{margin-left:0;margin-right:0}
.q-act{display:flex;gap:11px;justify-content:center;flex-wrap:wrap;margin-top:26px}
.q-done .tick{width:76px;height:76px;border-radius:50%;background:var(--green-soft);color:var(--green);
  display:grid;place-items:center;margin:0 auto 24px;animation:pop .5s .1s var(--ease) both}
.q-done .tick.no{background:var(--mist);color:var(--navy)}
.q-done h3{outline:none}
.q-est{max-width:430px;margin:26px auto 0;padding:18px 22px;border-radius:16px;text-align:left;
  background:linear-gradient(150deg,var(--navy-deep),#062E60);color:#fff}
.q-est span{display:block;font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;font-weight:700;color:#8FB6E4}
.q-est b{display:block;font-family:"Plus Jakarta Sans",sans-serif;font-weight:800;letter-spacing:-.035em;
  font-size:1.5rem;margin:6px 0 4px;font-variant-numeric:tabular-nums}
.q-est small{font-size:.76rem;color:#A6C2E0}
.q-sum{text-align:left;max-width:430px;margin:26px auto 0;border:1px solid var(--line);border-radius:16px;
  padding:20px 22px;background:#FBFCFE}
.q-sum div{display:flex;justify-content:space-between;gap:16px;padding:8px 0;font-size:.9rem;border-bottom:1px dashed var(--line)}
.q-sum div:last-child{border:none}
.q-sum span{color:var(--muted)}
.q-sum b{text-align:right;font-weight:600}

/* ================= VIDEO LIGHTBOX ================= */
#lb{position:fixed;inset:0;z-index:290;display:none}
#lb.open{display:grid;place-items:center}
#lb .bd{position:absolute;inset:0;background:rgba(3,17,38,.86);backdrop-filter:blur(8px)}
#lb .box{position:relative;z-index:2;width:min(390px,88vw);border-radius:22px;overflow:hidden;
  background:#0A2540;box-shadow:0 50px 120px -40px rgba(0,0,0,.7);animation:pop .4s var(--ease) both}
#lb img{width:100%;aspect-ratio:9/14;object-fit:cover;opacity:.55}
#lb .cap{position:absolute;inset:auto 0 0 0;padding:22px 24px;color:#fff;
  background:linear-gradient(to top,rgba(3,20,45,.95),transparent)}
#lb .cap b{display:block;font-family:"Plus Jakarta Sans",sans-serif;font-weight:700;font-size:1.1rem}
#lb .cap span{font-size:.82rem;color:#B7CEE8}
#lb .mid{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:26px}
#lb .mid p{font-size:.86rem;color:#CFE0F3;max-width:26ch;margin-top:14px}
#lb .pl{width:64px;height:64px;border-radius:50%;background:var(--gold);display:grid;place-items:center;margin:0 auto}
#lbClose{position:absolute;top:12px;right:12px;z-index:3;width:44px;height:44px;border-radius:50%;
  border:1px solid rgba(255,255,255,.4);background:rgba(0,0,0,.4);color:#fff;cursor:pointer;display:grid;place-items:center}
.vid{border:0;padding:0;font:inherit;color:inherit;text-align:left}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}


/* ================= LANDING-PAGE SHELL ================= */
body{background:var(--sand)}
#lp-hdr{background:#fff;border-bottom:1px solid var(--line)}
#lp-hdr .wrap{display:flex;align-items:center;gap:18px;height:72px}
#lp-hdr .brand{display:flex;align-items:center;gap:11px;margin-right:auto}
#lp-hdr .brand img{width:36px;height:36px;object-fit:contain}
#lp-hdr .brand b{font-family:"Plus Jakarta Sans",sans-serif;font-weight:800;font-size:1.02rem;
  letter-spacing:-.03em;display:block;line-height:1.15}
#lp-hdr .brand small{display:block;font-size:.62rem;letter-spacing:.17em;text-transform:uppercase;
  font-weight:600;color:var(--muted)}
#lp-hdr .tel{font-weight:700;font-size:.94rem;color:var(--navy);white-space:nowrap}
#lp-hdr .tel:hover{text-decoration:underline;text-underline-offset:3px}
.lp-note{background:var(--navy-ink);color:#B9CFE8;font-size:.79rem}
.lp-note .wrap{min-height:38px;display:flex;align-items:center;padding-top:7px;padding-bottom:7px}
.lp-note b{color:#fff;font-weight:600}

#lp-quiz{padding:clamp(34px,4.4vw,60px) 0 clamp(40px,5vw,70px)}
.q-aside .lp-back{margin-top:auto;padding-top:22px}
.q-aside .lp-back a{color:#9FC1E6;font-size:.86rem;text-decoration:underline;text-underline-offset:3px}
.q-aside .lp-back a:hover{color:#fff}

#lp-ft{background:var(--navy-ink);color:#8FA9C4;font-size:.79rem;line-height:1.62}
#lp-ft .wrap{padding:clamp(28px,3.4vw,44px) 0}
#lp-ft a{color:#BFD6EE;text-decoration:underline;text-underline-offset:2px}
#lp-ft .row{display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap;margin-top:14px}

/* ---------- ловушка для ботов:человек её не видит и не наводит на неё фокус ---------- */
.q-hp{position:absolute!important;left:-9999px!important;top:auto;width:1px;height:1px;overflow:hidden}
