:root{
      --red:#f20505;
      --red-deep:#c40404;
      --ink:#17120f;
      --muted:#726a65;
      --bg:#ffffff;
      --soft:#faf6f4;
      --rose:#fff4f4;
      --rose-200:#ffe1e1;
      --line:#efeae6;
      --shadow:0 10px 30px rgba(23,18,15,.08);
    }
    *{box-sizing:border-box;margin:0;padding:0}
    html{-webkit-text-size-adjust:100%}
    body{
      font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
      background:#e9e6e3;color:var(--ink);line-height:1.45;
      font-weight:500;-webkit-font-smoothing:antialiased;
    }
    .page{max-width:430px;margin:0 auto;background:var(--bg);min-height:100vh;overflow:hidden}

    /* ---------- helpers ---------- */
    .red{color:var(--red)}
    .eyebrow{
      font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
      color:var(--red);margin-bottom:12px;display:flex;align-items:center;gap:8px;
    }
    .eyebrow::before{content:"";width:22px;height:2px;background:var(--red);border-radius:2px}
    .check{color:var(--red);font-weight:800;flex:0 0 auto;line-height:1.3}

    /* ---------- top bar ---------- */
    .topbar{
      background:var(--red);color:#fff;text-align:center;font-weight:800;
      font-size:12px;padding:9px 12px;text-transform:uppercase;letter-spacing:.16em;
    }

    /* ---------- hero ---------- */
    .wrap{padding:24px 20px 22px}
    .hero h1{
      font-size:29px;line-height:1.12;font-weight:800;letter-spacing:-.022em;
      margin:0 0 18px;
    }
    .hero h1 .red{font-weight:800}
    .benefits{display:grid;gap:11px;margin:0 0 18px}
    .benefit{display:flex;gap:10px;font-size:15px;font-weight:500;color:#241d19;line-height:1.35}
    .benefit b{font-weight:700}
    .video{position:relative;background:#0c0c0c;margin:6px 0 18px;aspect-ratio:9/16;overflow:hidden;border-radius:14px}
    .video img{width:100%;height:100%;object-fit:cover;display:block;opacity:.92}
    .play-overlay{
      position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);
      background:rgba(0,0,0,.6);color:#fff;border-radius:10px;width:236px;
      padding:13px 14px;display:flex;flex-direction:column;align-items:center;
      justify-content:center;font-size:11.5px;font-weight:600;text-align:center;gap:4px;
      backdrop-filter:blur(2px);
    }
    .play-icon{font-size:26px}

    /* ---------- buttons ---------- */
    .btn{
      display:block;background:var(--red);color:#fff;text-decoration:none;
      border-radius:999px;padding:16px 18px;font-weight:800;font-size:17px;
      box-shadow:0 12px 24px rgba(242,5,5,.28);text-align:center;letter-spacing:-.01em;
      transition:transform .12s ease, box-shadow .12s ease;
    }
    .btn:hover{transform:translateY(-1px);box-shadow:0 16px 30px rgba(242,5,5,.34)}
    .btn:active{transform:translateY(0)}
    .microcopy{font-size:12px;color:var(--muted);margin-top:11px;text-align:center;font-weight:600}

    /* ---------- sections ---------- */
    .section{padding:30px 20px;border-top:1px solid var(--line)}
    .section.soft{background:var(--soft)}
    .section h2{
      font-size:23px;line-height:1.14;margin-bottom:18px;text-align:center;
      font-weight:800;letter-spacing:-.018em;
    }
    .section h2.left{text-align:left}

    /* ---------- "для кого" ---------- */
    .for-list{display:grid;gap:9px}
    .pill{
      border:1px solid var(--line);border-radius:14px;padding:12px 13px;background:#fff;
      display:flex;gap:10px;align-items:flex-start;font-size:14.5px;font-weight:500;
      color:#241d19;box-shadow:0 3px 10px rgba(23,18,15,.03);line-height:1.35;
    }

    /* ---------- timer ---------- */
    .timer{text-align:center;padding:26px 20px 24px;background:#fff;border-top:1px solid var(--line)}
    .timer .label{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:9px}
    .timer .note{font-size:13.5px;color:#4a423d;max-width:320px;margin:0 auto 12px;font-weight:500}
    .timer .time{font-size:40px;font-weight:800;color:var(--red);letter-spacing:-.04em;font-variant-numeric:tabular-nums}

    /* ---------- mechanism (signature) ---------- */
    .mechanism{background:linear-gradient(180deg,#fff 0%, var(--rose) 100%)}
    .mechanism .lead{font-size:15.5px;line-height:1.5;margin-bottom:20px;color:#3a322e;font-weight:500}
    .mechanism .lead b{font-weight:700;color:var(--ink)}
    .chain{
      background:#fff;border:1.5px solid var(--rose-200);border-radius:20px;
      padding:8px 16px 16px;box-shadow:0 14px 30px rgba(242,5,5,.07);
    }
    .chain-row{display:grid;grid-template-columns:38px 1fr;gap:13px;align-items:center;padding:11px 0}
    .ico{
      width:38px;height:38px;border-radius:11px;background:var(--rose);
      display:flex;align-items:center;justify-content:center;font-size:19px;flex:0 0 auto;
    }
    .chain-text{font-size:14.5px;font-weight:600;line-height:1.32;color:#241d19}
    .chain-text b{font-weight:800}
    .chain-rule{height:1px;background:var(--line);margin:0 0 0 51px}
    .punch{
      margin-top:18px;background:var(--ink);color:#fff;border-radius:16px;
      padding:17px 17px;font-size:14.5px;font-weight:600;line-height:1.45;
    }
    .punch b{color:#ffd2d2;font-weight:800}

    /* ---------- self-test ---------- */
    .mini-test{background:var(--ink);color:#fff;border-radius:22px;padding:24px 18px;text-align:center}
    .mini-test h2{color:#fff;margin-bottom:16px}
    .steps{display:grid;gap:9px;margin:0 0 14px;text-align:left}
    .step{
      background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
      border-radius:13px;padding:12px 13px;font-size:14.5px;font-weight:500;
      display:flex;gap:11px;align-items:flex-start;line-height:1.35;
    }
    .step .n{
      flex:0 0 auto;width:23px;height:23px;border-radius:50%;background:var(--red);
      color:#fff;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;
    }
    .if{
      background:#fff;color:var(--ink);border-radius:13px;padding:14px;
      font-size:14px;font-weight:600;line-height:1.4;text-align:left;
    }
    .if b{font-weight:800;color:var(--red-deep)}
    .test-img{
      margin:0 0 14px;aspect-ratio:4/3;border-radius:14px;
      background:rgba(255,255,255,.06);border:1.5px dashed rgba(255,255,255,.24);
      display:flex;flex-direction:column;align-items:center;justify-content:center;
      gap:8px;color:rgba(255,255,255,.62);text-align:center;padding:14px;
    }
    .test-img img{width:100%;height:100%;object-fit:cover;border-radius:14px;display:block}
    .test-img .ti-icon{font-size:30px;opacity:.85}
    .test-img .ti-cap{font-size:12.5px;font-weight:600;letter-spacing:.02em;line-height:1.35}
    .test-img{
      margin:0 0 14px;border-radius:14px;overflow:hidden;
      border:1.5px dashed rgba(255,255,255,.26);background:rgba(255,255,255,.05);
      aspect-ratio:4/3;display:flex;flex-direction:column;align-items:center;
      justify-content:center;gap:9px;color:rgba(255,255,255,.62);text-align:center;padding:14px;
    }
    .test-img img{width:100%;height:100%;object-fit:cover;display:block}
    .test-img .ico-img{font-size:30px;line-height:1}
    .test-img .cap-img{font-size:12.5px;font-weight:600;letter-spacing:.02em;max-width:230px;line-height:1.35}
    .test-img--filled{padding:0;border-style:solid}
    .test-img--filled img{border-radius:14px;object-fit:contain;background:#1d1714}

    /* ---------- results ---------- */
    .results-grid{display:grid;gap:15px}
    .result-card{border-radius:16px;overflow:hidden;background:#fff;box-shadow:var(--shadow);border:1px solid var(--line)}
    .before-after{display:grid;grid-template-columns:1fr 1fr;gap:0;background:#ddd6d2}
    .ba-placeholder{
      height:142px;display:flex;align-items:flex-end;justify-content:flex-start;
      color:#fff;font-weight:800;font-size:11px;letter-spacing:.1em;padding:9px 10px;
      text-transform:uppercase;background:linear-gradient(145deg,#cfc8c3,#ece7e3);
    }
    .ba-placeholder.after{background:linear-gradient(145deg,#e7ddd9,#fbf7f5);color:#8a8079}
    .result-photo{display:block;width:100%;height:auto}
    .result-caption{padding:12px 13px;font-size:14px;font-weight:600;line-height:1.35;color:#241d19}

    /* ---------- expert ---------- */
    .expert{
      display:grid;grid-template-columns:84px 1fr;gap:15px;align-items:center;
      background:#fff;border-radius:18px;padding:15px;border:1px solid var(--line);box-shadow:var(--shadow);
    }
    .expert-photo{
      width:84px;height:84px;border-radius:18px;background:linear-gradient(145deg,#f0e9e5,#fbf8f6);
      display:flex;align-items:center;justify-content:center;font-size:36px;border:1px solid var(--line);
      overflow:hidden;
    }
    .expert-photo img{width:100%;height:100%;object-fit:cover;display:block}
    .expert-name{font-size:19px;font-weight:800;margin-bottom:5px;letter-spacing:-.01em}
    .expert p{font-size:13.5px;color:#4a423d;font-weight:500;line-height:1.4}
    .facts{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:13px}
    .fact{background:var(--rose);border:1px solid var(--rose-200);border-radius:13px;padding:13px 10px;text-align:center}
    .fact .num{font-size:20px;font-weight:800;color:var(--red);letter-spacing:-.02em}
    .fact .cap{font-size:12px;font-weight:600;color:#4a423d;margin-top:3px;line-height:1.25}

    /* ---------- reviews ---------- */
    .reviews-eyebrow{text-align:center;font-size:12px;font-weight:700;color:var(--muted);margin-bottom:14px}
    .review{display:grid;grid-template-columns:42px 1fr;gap:12px;padding:15px 0;border-bottom:1px solid var(--line)}
    .review:last-of-type{border-bottom:none}
    .avatar{width:42px;height:42px;border-radius:50%;background:#ddd;overflow:hidden;flex:0 0 auto}
    .avatar img{width:100%;height:100%;object-fit:cover}
    .review-name{font-weight:800;color:#1f1a17;font-size:14px;margin-bottom:4px}
    .review-name span{font-weight:600;color:var(--muted)}
    .review-text{font-size:14px;font-weight:500;line-height:1.45;color:#332c28}
    .locked{
      text-align:center;font-size:12.5px;font-weight:700;color:var(--muted);
      margin-top:16px;padding-top:14px;border-top:1px solid var(--line);
    }

    /* ---------- offer ---------- */
    .offer{background:var(--rose)}
    .offer-list{display:grid;gap:10px;margin-top:4px}
    .offer-item{
      background:#fff;border-radius:14px;padding:13px 14px;font-size:14.5px;
      font-weight:600;border:1px solid var(--rose-200);display:flex;gap:10px;
      align-items:flex-start;line-height:1.38;color:#241d19;
    }
    .offer-item.bonus{border-color:var(--red);box-shadow:0 6px 16px rgba(242,5,5,.08);align-items:center}
    .offer-visual{display:flex;flex-direction:column;align-items:center;gap:6px;flex:0 0 86px}
    .offer-image{width:64px;height:64px;object-fit:contain;display:block}
    .offer-tag{
      flex:0 0 auto;font-size:11px;font-weight:800;letter-spacing:.05em;
      background:var(--red);color:#fff;border-radius:7px;padding:3px 7px;text-transform:uppercase;
    }
    .offer-item b{font-weight:800}
    .offer-item .sub{display:block;font-weight:500;color:#5a524d;font-size:13px;margin-top:3px}

    /* ---------- final cta ---------- */
    .cta-box{text-align:center;padding:34px 20px 36px;border-top:1px solid var(--line)}
    .cta-box h2{font-size:27px;line-height:1.08;margin-bottom:11px;font-weight:800;letter-spacing:-.02em}
    .cta-box p{font-size:15px;color:#4a423d;margin-bottom:20px;font-weight:500;max-width:330px;margin-left:auto;margin-right:auto;line-height:1.45}

    /* ---------- sticky ---------- */
    .sticky-cta{
      position:sticky;bottom:0;background:rgba(255,255,255,.9);
      backdrop-filter:blur(10px);padding:11px 20px;border-top:1px solid var(--line);
    }
    .sticky-cta .btn{font-size:15px;padding:14px}

    @media(max-width:380px){
      .wrap,.section{padding-left:16px;padding-right:16px}
      .hero h1{font-size:26px}
      .section h2{font-size:21px}
      .cta-box h2{font-size:24px}
      .play-overlay{width:210px}
    }

/* ---------- technical player integration ---------- */
.video-wrapper.landing-video{
  width:min(600px, calc(90vh * 9 / 16), calc(100vw - 40px));
  max-width:none;
  aspect-ratio:9 / 16;
  margin:6px auto 18px;
  margin-left:50%;
  transform:translateX(-50%);
  border-radius:0;
  overflow:visible;
  background:#000;
}
.video-wrapper.landing-video .hls-wrap{
  width:100%;
  height:100%;
  border-radius:0;
  overflow:visible;
}
.video-wrapper.landing-video .hls-wrap > video,
.video-wrapper.landing-video .hls-wrap > .video-js,
.video-wrapper.landing-video .hls-wrap video,
.video-wrapper.landing-video .hls-wrap .vjs-tech{
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
  background:#000 !important;
}
.video-wrapper.landing-video .hls-timeline{
  border-radius:0;
}
.video-expire-notice{
  font-size:13.5px;
  color:#4a423d;
  text-align:center;
  font-weight:700;
  margin:-5px 0 16px;
}
.video-expire-notice span{
  color:var(--red);
  font-variant-numeric:tabular-nums;
}
@media (max-width:430px){
  .video-wrapper.landing-video{
    width:calc(100vw - 40px);
  }
}
@media (max-width:380px){
  .video-wrapper.landing-video{
    width:calc(100vw - 32px);
  }
}