/* Reference composition; local quiz and local integrations retained. */
:root{--lk-text:#5e3324;--lk-text-soft:#7a4a3a;--lk-accent:#ff8562;--lk-cta-bg-accent:#e04e3a;--lk-page-bg:#fdfdfd;--lk-cta-bg:#f4f4f4;--lk-story-bg:#fff;--lk-hero-tint:#f4f4f4;--lk-radius:8px}
.compact-page{background:var(--lk-page-bg);color:var(--lk-text);font-family:Inter,Arial,sans-serif;line-height:1.55;--accent-color:#e04e3a}
.compact-page main{padding:0;margin:0}
.lk-wrap{width:100%;max-width:720px;margin:0 auto;padding:0 20px}

.lk-hero{padding:32px 0 0;background:var(--lk-page-bg)}
.lk-hero-grid{
  display:block;
  background:transparent;
  padding:0;
  min-height:auto;
  margin-top:0;
}

.lk-hero-text{
  display:block;
  padding:0 4px 18px;
  background:transparent;
}
.lk-title{
  font-size:26px;
  font-weight:700;
  line-height:1.18;
  letter-spacing:-.02em;
  color:var(--lk-text);
  margin-bottom:10px;
  white-space:nowrap;
}
.lk-sub{
  font-size:14px;
  color:var(--lk-text);
  font-weight:400;
  line-height:1.5;
  margin-bottom:20px;
}
.lk-sub strong,.lk-sub b{font-weight:700}

.lk-stories{
  display:block;
  background:var(--lk-hero-tint);
  border-radius:var(--lk-radius);
  padding:18px 24px 14px 24px;
  position:relative;
  overflow:visible;
  min-height:180px;
}
.lk-stories > .lk-story{
  display:block;
  padding:14px 18px;
  font-size:14px;
  line-height:1.5;
  color:var(--lk-text);
  position:relative;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 1px 3px rgba(94,51,36,.05);
  border-radius:var(--lk-radius);
  z-index:2;
}

.lk-stories > .lk-story:nth-child(1){
  margin:6px 150px 10px 0;
}

.lk-stories > .lk-story:nth-child(2){
  margin:0 50px 14px 0;
}

.lk-stories > .lk-story:nth-child(1):before{
  content:'\201D';
  position:absolute;
  top:-8px;
  left:10px;
  color:var(--lk-cta-bg-accent);
  font-size:28px;
  font-weight:800;
  line-height:1;
  transform:scaleX(-1);
  z-index:3;
}
.lk-stories > .lk-story:nth-child(2):before{content:none}
.lk-story strong,.lk-story b{font-weight:700}


.lk-photo-m{
  display:block;
  position:absolute;
  right:0;
  bottom:0;
  width:170px;
  height:auto;
  z-index:1;
  pointer-events:none;
}
.lk-photo-m img{
  display:block;
  position:static;
  width:170px;
  height:auto;
  max-width:none;
  max-height:none;
}

/* ─── PER-MODEL OVERRIDES (ПК) ──────────────────────────────────────
   Backend подмешивает атрибут data-le-model="ИмяМодели" в тег BODY при render.
   CSS-селектор ниже подхватывает и применяет индивидуальные размеры для конкретной модели.
   Когда придёт новая модель — добавь сюда блок с её именем (и в mobile-секцию ниже). */
body[data-le-model="Игорь"] .lk-photo-m,
body[data-le-model="Игорь"] .lk-photo-m img{width:200px}


.lk-cta{background:var(--lk-cta-bg);padding:20px 0 20px}
.lk-cta-banner-line{margin-bottom:14px;line-height:1.25;letter-spacing:-.015em}
.lk-cta-banner-bg{
  display:inline-block;
  background:var(--lk-cta-bg-accent);
  color:#fff;
  padding:2px 6px;
  font-size:24px;
  font-weight:700;
  border-radius:3px;
  letter-spacing:-.015em;
}
.lk-cta-banner-tail{display:inline;color:var(--lk-cta-bg-accent);font-weight:700;font-size:24px;letter-spacing:-.015em}
.lk-cta-instr{font-size:15px;color:var(--lk-text);line-height:1.5;margin-bottom:20px}
.lk-cta-instr strong,.lk-cta-instr b{font-weight:700}
.lk-source{margin-bottom:28px}
.lk-source .egokad-buttons{display:block;width:100% !important;max-width:none !important}

.lk-source .egokad-btn-wrap{flex-wrap:nowrap !important;flex-direction:row !important;justify-content:center;gap:10px}
.lk-source .egokad-btn{flex:1 1 0 !important;min-width:0 !important;max-width:400px !important}
.lk-source .egokad-btn__text{padding-left:42px !important;padding-right:30px !important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qw-ty-buttons{justify-content:center !important}
.qw-ty-btn{max-width:none !important;flex:1 1 calc(50% - 5px) !important}
.lk-cta-outro{font-size:14px;color:var(--lk-text);line-height:1.6}
.lk-cta-outro strong,.lk-cta-outro b{font-weight:700}
.lk-cta-outro p{margin-bottom:10px}
.lk-cta-outro p:last-child{margin-bottom:0}

.lk-foot{background:var(--lk-cta-bg);padding:0 0 24px}
.lk-foot-inner{font-size:11px;color:var(--lk-text);opacity:.6;text-align:left;line-height:1.7}

.lk-foot-inner a,.lk-foot-inner a:visited,.lk-foot-inner a:hover,.lk-foot-inner a:active,.lk-foot-inner a span,.lk-foot-inner span a{color:inherit !important;text-decoration:underline !important;border-bottom:0 !important;box-shadow:none !important;background:transparent !important}

@media (max-width:700px){
  .lk-wrap{padding:0 8px}
  
  .lk-hero{padding:48px 0 0}
  
  .lk-hero-grid{
    display:block;
    background:transparent;
    padding:0;
    min-height:auto;
    position:relative;
    overflow:visible;
    border-radius:0;
    margin-top:0;
  }
  
  .lk-hero-text{display:block;padding:0 4px 0}
  
  .lk-title{
    font-size:18.5px;
    font-weight:700;
    line-height:1.2;
    letter-spacing:-.02em;
    margin-bottom:2px;
    word-wrap:break-word;
    overflow-wrap:break-word;
    white-space:normal;
  }
  
  .lk-sub{font-size:12.5px;line-height:1.45;margin-bottom:25px}

  
  .lk-stories{
    position:relative;
    display:block;
    padding:14px 16px 10px 0;
    margin:0 -8px;
    max-width:none;
    background:var(--lk-hero-tint);
    border-radius:0;
    overflow:visible;
    min-height:190px;
  }
  
  .lk-stories > .lk-story:nth-child(1){
    display:block;
    width:auto;
    margin:3px 80px 8px 0;
    font-size:12.5px;
    padding:10px 12px;
    background:rgba(255,255,255,.88);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    position:relative;
    z-index:2;
    text-align:left;
  }
  
  .lk-stories > .lk-story:nth-child(2){
    display:block;
    width:auto;
    margin:0 10px 14px 0;
    font-size:12.5px;
    padding:10px 12px;
    background:rgba(255,255,255,.88);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    position:relative;
    z-index:2;
    text-align:left;
  }
  
  .lk-stories > .lk-photo-m{
    display:block;
    position:absolute;
    right:-10px;
    bottom:0;
    width:160px;
    height:auto;
    z-index:1;
    pointer-events:none;
  }
  .lk-stories > .lk-photo-m img{
    display:block;
    position:static;
    width:160px;
    height:auto;
    max-width:none;
  }

  /* PER-MODEL OVERRIDES (Mobile) */
  body[data-le-model="Игорь"] .lk-stories > .lk-photo-m,
  body[data-le-model="Игорь"] .lk-stories > .lk-photo-m img{width:185px}
  
  .lk-stories > .lk-story:before{content:none !important}
  .lk-stories:before{content:none}
  .lk-stories > .lk-story:nth-child(1):before{
    content:'\201D' !important;
    position:absolute;
    top:-9px;
    left:8px;
    color:var(--lk-cta-bg-accent);
    font-size:26px;
    font-weight:800;
    line-height:1;
    transform:scaleX(-1);
    z-index:3;
  }

  
  .lk-cta{padding:5px 0 28px}
  .lk-cta-banner-bg,.lk-cta-banner-tail{font-size:18px;font-weight:700;letter-spacing:-.02em;line-height:1.2}
  .lk-cta-instr,.lk-cta-outro{font-size:14px}
  /* Quiz iframe — во всю ширину viewport. negative margin компенсирует .lk-wrap padding 8px.
     Кнопки бот-варианта остаются в обычной ширине через padding на .egokad-btn-wrap. */
  .lk-source{margin:0 -8px 20px}
  .lk-source [id^="qw-inline-"]{width:100% !important;margin:0 !important;padding:0 !important;display:block !important}
  .lk-source iframe{display:block !important;width:100% !important;border:0 !important;margin:0 !important;padding:0 !important}
  .lk-source .egokad-btn-wrap{flex-direction:column !important;flex-wrap:nowrap !important;padding:0 8px}
  .lk-source .egokad-btn{width:100% !important;max-width:380px !important;flex:none !important}
  
  .lk-source .egokad-btn-wrap{flex-direction:column !important;flex-wrap:nowrap !important}
  .lk-source .egokad-btn{width:100% !important;max-width:380px !important;flex:none !important}
  .lk-source .egokad-btn__text{padding-left:42px !important;padding-right:30px !important;font-size:14px !important}
  .qw-ty-btn{flex:1 1 100% !important;max-width:380px !important}
}
/* Restyle the original six-step quiz to the reference's simple answer tiles. */
.compact-page .quiz{border:0;border-radius:14px;background:#fff;padding:24px;margin:0 0 20px;color:#282828}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.compact-page .bar{display:flex;height:4px;margin:0 0 24px;gap:0;background:#eee;border-radius:3px;overflow:hidden}
.compact-page .bar::after,.compact-page .bar__item::after{display:none}
.compact-page .bar__item{height:4px;width:auto;flex:1;margin:0;border-radius:0;font-size:0;background:#e8e8e8}
.compact-page .bar__item:first-child,.compact-page .bar__item-passed,.compact-page .bar__item-actual{background:#cf604c}
.compact-page .quiz__inline{display:block}
.compact-page .quiz__main{width:100%;max-width:none;margin:0}
.compact-page .quiz__aside,.compact-page .quiz__person,.compact-page .quiz__person-mob,.compact-page .example,.compact-page .test-btns{display:none!important}
.compact-page .quiz__subtitle{font-size:18px;line-height:1.3;font-weight:700;margin:0 0 16px}
.compact-page .quiz__desc{font-size:13px;line-height:1.45;margin-bottom:15px}
.compact-page .quiz__list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 14px}
.compact-page .radio__item{width:auto;margin:0;border-radius:10px;box-shadow:none}
.compact-page .radio+label{display:block;position:relative;border:1px solid transparent;border-radius:10px;background:#f4f4f4;box-shadow:none;padding:0;overflow:hidden}
.compact-page .quiz__img{display:none}
.compact-page .quiz__head,.compact-page .quiz__second .quiz__head,.compact-page .quiz__last .quiz__head{display:flex;align-items:center;text-align:left;min-height:58px;height:auto;padding:12px 12px 12px 42px;border-radius:10px;font-size:14px;line-height:1.4;background:transparent;color:#343434}
.compact-page .radio+label:before,.compact-page .quiz__second .radio+label:before,.compact-page .quiz__last .radio+label:before{content:'';position:absolute;left:14px;top:50%;bottom:auto;transform:translateY(-50%);width:20px;height:20px;border:2px solid #cf604c;border-radius:50%;background:transparent}
.compact-page .radio+label:after,.compact-page .quiz__second .radio+label:after,.compact-page .quiz__last .radio+label:after{content:'';display:none;position:absolute;left:19px;top:50%;bottom:auto;transform:translateY(-50%);width:10px;height:10px;border:0;border-radius:50%;background:#cf604c}
.compact-page .radio:checked+label{border-color:#cf604c;box-shadow:none}
.compact-page .radio:checked+label:after{display:block}
.compact-page .quiz__bottom{display:block}
.compact-page .quiz__controls{display:flex;gap:10px;flex-wrap:nowrap;margin:4px 0 0}
.compact-page .quiz__controls .button{width:auto;flex:1;margin:0;height:44px;font-size:14px;text-transform:none;border-radius:8px;background:#cf604c;color:#fff}
.compact-page .quiz__controls .button-gray{background:#f4f4f4;color:#66534e}
.compact-page .quiz__last{grid-template-columns:1fr}
.compact-page .quiz__triple .quiz__main{width:100%}
.compact-page .quiz__result{background:#cf604c;color:white}
.compact-page .footer{background:#f4f4f4;padding:0 12px 24px}
.compact-page .footer .content{max-width:720px;padding:0 8px}
.compact-page .footer__policy{font-size:11px;color:#7a4a3a;text-transform:none;text-decoration:underline}
.lk-contact{border:0;background:none;color:#7a4a3a;font:inherit;font-size:12px;text-decoration:underline;margin-top:15px;cursor:pointer}
.lk-contact:focus-visible{outline:2px solid #cf604c;outline-offset:4px}
@media(max-width:700px){
 .compact-page .quiz{margin:0 -8px 20px;padding:20px 24px}
 .compact-page .quiz__head,.compact-page .quiz__second .quiz__head,.compact-page .quiz__last .quiz__head{font-size:12.5px;padding-left:36px;min-height:58px}
 .compact-page .radio+label:before,.compact-page .quiz__second .radio+label:before,.compact-page .quiz__last .radio+label:before{left:10px}
 .compact-page .radio+label:after,.compact-page .quiz__second .radio+label:after,.compact-page .quiz__last .radio+label:after{left:15px}
 .compact-page .quiz__subtitle{font-size:18px}
 .lk-photo-m{overflow:hidden}
 .lk-stories > .lk-photo-m{right:-2px;width:152px}
 .lk-stories > .lk-photo-m img{width:152px}
}
.compact-page .master-portrait--thanks{background:#f4f4f4}
.compact-page .master-portrait--thanks > img{object-fit:contain;object-position:center bottom}
