/* ===== LO&E — Quiz modal (поверх index.html). Все стили scoped под #quizModal / .quiz-fab ===== */
#quizModal{
  position:fixed;inset:0;z-index:500;display:flex;align-items:flex-start;justify-content:center;
  overflow-y:auto;padding:32px 16px;
  background:rgba(43,37,32,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  animation:quizFade .3s ease;
  --q-plum:#6B3A4E;--q-gold:#B8975A;--q-gold-d:#8C6E3A;--q-rose:#D4A8A3;--q-rose-d:#B97f7a;
  --q-char:#2B2520;--q-stone:#9B8F88;--q-champ:#C4AF97;--q-line:rgba(184,151,90,.28);
  --q-serif:'EB Garamond',Georgia,serif;--q-sans:'DM Sans',-apple-system,sans-serif;
}
#quizModal[hidden]{display:none}
@keyframes quizFade{from{opacity:0}to{opacity:1}}
@keyframes quizUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

#quizModal .quiz-card{
  position:relative;max-width:600px;width:100%;margin:auto;
  background:radial-gradient(130% 80% at 50% -8%, #FDFAF4 0%, #F6EEE3 45%, #F0E4D2 100%);
  border:1px solid var(--q-line);border-radius:22px;box-shadow:0 30px 70px rgba(40,30,20,.4);
  padding:38px 32px;color:var(--q-char);font-family:var(--q-sans);animation:quizUp .35s ease;
}
@media(max-width:560px){#quizModal .quiz-card{padding:30px 20px}#quizModal{padding:16px 10px}}

#quizModal .quiz-x{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;
  border:1px solid var(--q-line);background:rgba(255,255,255,.6);color:#6b5740;font-size:17px;
  cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center;z-index:3}
#quizModal .quiz-x:hover{background:#6B3A4E;color:#F7F0E8;border-color:#6B3A4E}
#quizModal .qlang{position:absolute;top:16px;left:16px;display:flex;gap:5px;z-index:3}
#quizModal .qlang button{width:26px;height:20px;padding:0;border:1px solid var(--q-line);border-radius:5px;background:rgba(255,255,255,.55);cursor:pointer;overflow:hidden;opacity:.55;transition:opacity .2s,border-color .2s}
#quizModal .qlang button:hover{opacity:.85}
#quizModal .qlang button.on{opacity:1;border-color:var(--q-plum);box-shadow:0 0 0 2px rgba(107,58,78,.18)}
#quizModal .qlang .fi{width:100%;height:100%;border-radius:0;display:block}

#quizModal .qmark{width:56px;margin:2px auto 6px;color:var(--q-gold-d)}
#quizModal .qmark svg{display:block;width:100%;height:auto}
#quizModal .qbrand{font-family:var(--q-serif);font-size:20px;letter-spacing:.02em;color:var(--q-char);text-align:center}
#quizModal .qbrand .amp{color:var(--q-gold)}
#quizModal .qkick{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--q-rose-d);text-align:center;margin:4px 0 22px}

/* intro */
#quizModal .intro{text-align:center}
#quizModal .intro h1{font-family:var(--q-serif);font-weight:400;font-size:clamp(27px,6.5vw,38px);line-height:1.16;margin-bottom:14px}
#quizModal .intro h1 .moon{font-size:.8em}
#quizModal .intro .lead{font-size:16px;font-weight:300;line-height:1.6;color:#5d5249;max-width:44ch;margin:0 auto 16px}
#quizModal .intro .note{font-family:var(--q-serif);font-style:italic;font-size:14px;color:#8a7c6a;margin-bottom:24px}

/* progress / question */
#quizModal .qhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
#quizModal .qprog{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--q-rose-d)}
#quizModal .qback{background:none;border:none;font-family:inherit;font-size:12px;color:#9a8a70;cursor:pointer}
#quizModal .qbar{height:4px;background:rgba(184,151,90,.18);border-radius:4px;overflow:hidden;margin-bottom:22px}
#quizModal .qbar i{display:block;height:100%;background:linear-gradient(90deg,var(--q-rose),var(--q-gold));border-radius:4px;transition:width .4s ease}
#quizModal .qtext{font-family:var(--q-serif);font-size:clamp(20px,4.4vw,25px);line-height:1.3;color:var(--q-char);margin-bottom:20px}

/* options */
#quizModal .opts{display:flex;flex-direction:column;gap:11px}
#quizModal .opt{display:flex;align-items:center;gap:13px;text-align:left;background:rgba(255,255,255,.55);
  border:1px solid var(--q-line);border-radius:13px;padding:15px 17px;cursor:pointer;font-family:inherit;
  font-size:15px;line-height:1.4;color:#46383c;transition:border-color .2s,background .2s,transform .12s}
#quizModal .opt:hover{border-color:var(--q-rose);background:rgba(212,168,163,.12)}
#quizModal .opt:active{transform:scale(.99)}
#quizModal .opt .mk{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--q-champ);flex:none;
  display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--q-gold-d);font-family:var(--q-serif)}
#quizModal .opt.sel{border-color:var(--q-plum);background:rgba(107,58,78,.08)}
#quizModal .opt.sel .mk{background:var(--q-plum);border-color:var(--q-plum);color:#fff}

/* buttons */
#quizModal .qbtn{font-family:var(--q-serif);font-size:18px;padding:15px 22px;border:none;border-radius:12px;
  background:var(--q-plum);color:#F7F0E8;cursor:pointer;letter-spacing:.02em;transition:background .25s,transform .12s;width:100%;margin-top:8px}
#quizModal .qbtn:hover{background:#7d4458}#quizModal .qbtn:active{transform:translateY(1px)}
#quizModal .qbtn.ghost{background:transparent;color:var(--q-plum);border:1px solid var(--q-rose)}
#quizModal .qbtn:disabled{opacity:.5;cursor:default}

/* form */
#quizModal .frm{display:flex;flex-direction:column;gap:13px}
#quizModal .frm h2{font-family:var(--q-serif);font-weight:400;font-size:25px;text-align:center}
#quizModal .frm .flead{font-size:14.5px;font-weight:300;color:#5d5249;text-align:center;margin-bottom:4px}
#quizModal .frm input{font-family:inherit;font-size:15px;padding:14px 16px;border:1px solid var(--q-line);
  border-radius:11px;background:rgba(255,255,255,.6);color:var(--q-char)}
#quizModal .frm input:focus{outline:none;border-color:var(--q-gold);box-shadow:0 0 0 3px rgba(184,151,90,.13)}
#quizModal .frm input.err{border-color:#a05a5a;box-shadow:0 0 0 3px rgba(160,90,90,.12)}
#quizModal .q-phone{display:flex;align-items:stretch;border:1px solid var(--q-line);border-radius:11px;background:rgba(255,255,255,.6)}
#quizModal .q-phone:focus-within{border-color:var(--q-gold);box-shadow:0 0 0 3px rgba(184,151,90,.13)}
#quizModal .q-phone input{flex:1;border:none!important;background:none!important;box-shadow:none!important}
#quizModal .q-cc{padding:0 12px;display:flex;align-items:center;border-right:1px solid var(--q-line);color:#6b5740;font-size:14px;white-space:nowrap}
#quizModal .consent{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;line-height:1.5;color:#6d6055;cursor:pointer}
#quizModal .consent input{margin-top:2px;width:16px;height:16px;flex:none;accent-color:var(--q-plum)}
#quizModal .consent a{color:var(--q-gold-d)}
#quizModal .consent.err,#quizModal .consent.err a{color:#a05a5a}
#quizModal .fspam{font-size:12px;color:#9a8a70;text-align:center;margin-top:2px}

/* result */
#quizModal .res .rhero{text-align:center;padding:6px 0 18px;border-bottom:1px solid var(--q-line);margin-bottom:8px}
#quizModal .res .rmoon{font-size:34px}
#quizModal .res .rlabel{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--q-rose-d);margin:10px 0 4px}
#quizModal .res .rname{font-family:var(--q-serif);font-size:clamp(25px,5.5vw,33px);font-style:italic;color:var(--q-plum);line-height:1.15}
#quizModal .res .rsub{font-size:15px;font-weight:300;color:#5d5249;max-width:42ch;margin:12px auto 0}
#quizModal .res h2{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--q-rose-d);margin:26px 0 12px}
#quizModal .res p{font-size:15.5px;line-height:1.62;color:#48433d;margin-bottom:12px}
#quizModal .phase{display:flex;gap:14px;padding:13px 0;border-bottom:1px solid var(--q-line)}
#quizModal .phase:last-child{border:0}
#quizModal .phase .ic{font-size:22px;width:32px;text-align:center;flex:none}
#quizModal .phase b{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--q-gold-d);margin-bottom:2px}
#quizModal .phase span{font-size:14px;color:#56504a;line-height:1.5}
#quizModal .maprow{padding:13px 0;border-bottom:1px dashed var(--q-line)}
#quizModal .maprow:last-child{border:0}
#quizModal .maprow .top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
#quizModal .maprow .pn{font-weight:500;color:var(--q-char);font-size:14.5px}
#quizModal .maprow .wh{font-size:11px;color:var(--q-stone);white-space:nowrap}
#quizModal .maprow .ds{font-size:13.5px;color:#56504a;margin-top:3px;line-height:1.5}
#quizModal .maprow .ds b{color:var(--q-plum)}
#quizModal .maprow a{color:var(--q-gold-d);font-size:12px;text-decoration:none;border-bottom:1px solid rgba(184,151,90,.4);white-space:nowrap}
#quizModal .mapnote{font-size:12px;color:#9a8a70;font-style:italic;margin-top:10px}
#quizModal .bridge{background:linear-gradient(160deg,rgba(212,168,163,.14),rgba(184,151,90,.1));
  border-left:2px solid var(--q-rose-d);border-radius:0 12px 12px 0;padding:15px 17px;font-size:14.5px;line-height:1.6;color:#4a4039;margin:6px 0}
#quizModal .gift{background:linear-gradient(180deg,rgba(212,168,163,.16),rgba(255,255,255,.2));
  border:1px solid var(--q-rose);border-radius:14px;padding:20px;text-align:center;margin:22px 0}
#quizModal .gift .big{font-family:var(--q-serif);font-size:19px;color:var(--q-plum);margin-bottom:6px}
#quizModal .gift p{font-size:14px;color:#56504a;margin:0}
#quizModal .cta{display:flex;flex-direction:column;gap:10px;margin:18px 0 4px}
#quizModal .signoff{font-size:15px;color:#48433d;line-height:1.6;margin-top:14px}
#quizModal .disc{font-size:11px;color:#9a8a70;font-style:italic;line-height:1.6;border-top:1px solid var(--q-line);padding-top:14px;margin-top:18px}

/* плавающая кнопка «пройти тест» */
.quiz-fab{position:fixed;right:18px;bottom:18px;z-index:180;display:flex;align-items:center;gap:9px;
  background:#6B3A4E;color:#F7F0E8;border:none;border-radius:30px;padding:13px 20px;cursor:pointer;
  font-family:'EB Garamond',Georgia,serif;font-size:16px;letter-spacing:.01em;
  box-shadow:0 10px 28px rgba(70,40,55,.35);animation:quizUp .4s ease}
.quiz-fab:hover{background:#7d4458}
.quiz-fab .fm{width:22px;display:inline-flex;color:#E4C988}
.quiz-fab .fm svg{display:block;width:100%;height:auto}
.quiz-fab[hidden]{display:none}
@media(max-width:560px){.quiz-fab{right:12px;bottom:12px;font-size:14px;padding:11px 16px}}

@media print{#quizModal{position:static;background:#fff;backdrop-filter:none;padding:0}
  #quizModal .quiz-card{box-shadow:none;border:none}
  #quizModal .quiz-x,#quizModal .cta,#quizModal .qhead,#quizModal .qbar,.quiz-fab{display:none!important}}
