/* landing.css (SAFE) — only lp-* */
/* Critical rule: do not let content go under fixed dotbar */

/* Keep your existing tokens coming from ./radar/assets/styles.css */
:root{
  --lp-gap: 24px;
  --lp-dotbar-w: 64px;
  --lp-dotbar-left: 16px;
  --lp-dotbar-gutter: 24px; /* must visually match panel gap */
}

/* Page */
.lp-body{
  margin:0;
  background: var(--bg);
  color: var(--text);
}

/* Fixed dotbar */
.lp-dotbar{
  position: fixed;
  left: var(--lp-dotbar-left);
  top: 16px;
  bottom: 16px;
  width: var(--lp-dotbar-w);
  border-radius: 22px;
  background: linear-gradient(180deg, var(--sidebar) 0%, var(--sidebar-2) 100%);
  border: 1px solid rgba(255,255,255,.06);
  box-shadow: var(--shadow);
  display:flex;
  flex-direction:column;
  align-items:center;
  padding: 8px;
  gap: 12px;
  z-index: 30;
}

.lp-dotbar-brand{
  width:48px;height:48px;border-radius:16px;
  display:grid;place-items:center;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.92);
  font-weight: 900;
  font-size: 18px;
  text-decoration:none;
}

.lp-dotbar-bottom{
  margin-top:auto;
  width:100%;
  display:flex;
  justify-content:center;
  padding-bottom: 8px;
}



/* Main layout — HARD OFFSET (no var calc failures) */
.lp-main{
  padding: 28px 24px 64px;
  padding-left: calc(16px + 64px + 24px); /* 104px */
}

.lp-container{
  width: min(1280px, 100%);
  margin: 0 auto;
}

/* Blocks */
.lp-block{ margin: 0 0 28px 0; }
.lp-stack{ display:grid; gap: 24px; }

/* Grid */
.lp-grid{
  display:grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 24px;
  align-items: stretch;
}

/* Panels */
.lp-panel{
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 24px;
  min-width:0;
  width:100%;
  height:100%;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
}

.lp-legend{
  color: var(--text-2);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .2px;
  text-align:center;
  user-select:none;
}

/* spans */
.lp-span-12{ grid-column: span 12; }
.lp-span-10{ grid-column: span 10; }
.lp-span-8{ grid-column: span 8; }
.lp-span-6{ grid-column: span 6; }
.lp-span-4{ grid-column: span 4; }

/* squares */
.lp-square{ aspect-ratio: 1 / 1; padding: 18px; }

/* Theme toggle */
.lp-theme-toggle{
  width:48px;height:48px;border-radius:16px;
  border:0;
  background: transparent;
  color: rgba(255,255,255,.92);
  display:grid;place-items:center;
  cursor:pointer;
}
.lp-theme-toggle:hover{ background: rgba(255,255,255,.08); }
.lp-theme-toggle:active{ transform: translateY(1px); }
.lp-theme-ico svg{ display:block; }

.lp-theme-toggle:hover{ background: rgba(255,255,255,.10); }
.lp-theme-toggle:active{ transform: translateY(1px); }
.lp-theme-ico svg{ display:block; }

html[data-theme="light"] .lp-theme-toggle{
  background: transparent;
  border:0;
  color: rgba(15,23,42,.92);
}
html[data-theme="light"] .lp-theme-toggle:hover{ background: rgba(15,23,42,.06); }

/* Block 1 */
.lp-panel--b1{
  align-items:flex-start;
  justify-content:flex-start;
  flex-direction:column;
}
.lp-b1-title-line1{
  font-weight:800;
  letter-spacing:-0.02em;
  font-size:44px;
  line-height:1.05;
  color: var(--text);
}
.lp-b1-title-line2{
  margin-top:10px;
  font-weight:700;
  letter-spacing:-0.02em;
  font-size: 58px;
  line-height:1.1;
  color: var(--text-2);
}
.lp-panel--b1-right{
  align-items:flex-start;
  justify-content:center; /* vertical center */
  flex-direction:column;
}

/* Block 1 — right pitch + CTA */
/* Block 1 — hero right panel (2-line + inline CTA) */
.lp-b1-right{
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.lp-b1-right-headline{
  font-weight: 850;
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--text);
}

/* second row: subline + CTA */
.lp-b1-right-bottom{
  display:flex;
  align-items:center;
  gap:16px;
}
.lp-b1-right-sub{
  flex: 0 0 auto;
  min-width:0;
  font-weight: 850;
  font-size: 18px;
  line-height: 1.2;
  color: var(--text-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* CTA — primary (blue), matches product CTA look */
.lp-b1-cta{
  /* width = 90% of free space (2nd grid column) and stick to the right */
  justify-self:end;
  width:90%;
  max-width:100%;
  min-width:180px;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  font-weight:800;
  font-size:16px;

  height:48px;
  padding:0 22px;
  border-radius:16px;

  background: var(--primary);
  color:#fff;
  text-decoration:none;
  white-space:nowrap;

  box-shadow: 0 8px 24px rgba(0,0,0,.25);
}
.lp-b1-cta:hover{ filter: brightness(1.05); }
.lp-b1-cta:active{ transform: translateY(1px); filter: brightness(.98); }
/* Light theme: dotbar follows light UI */
html[data-theme="light"] .lp-dotbar{
  background: linear-gradient(180deg, rgba(15,23,42,.04) 0%, rgba(15,23,42,.02) 100%);
  border: 1px solid rgba(15,23,42,.10);
}

html[data-theme="light"] .lp-dotbar-brand{
  background: rgba(15,23,42,.04);
  border-color: rgba(15,23,42,.12);
  color: rgba(15,23,42,.92);
}

@media (max-width: 980px){
  .lp-main{ padding-left: 24px; }
  .lp-dotbar{ display:none; }
  .lp-b1-title-line1{ font-size: 58px; }
  .lp-b1-title-line2{ font-size:26px; }

  .lp-b1-right-bottom{
  display:grid;
  grid-template-columns: auto 1fr;
  align-items:center;
  column-gap:16px;
} flex-direction: column; align-items: stretch; }
  .lp-b1-right-sub{ white-space: normal; }
  .lp-b1-cta{ width: 100%; }
}


/* Block 2 — Q1 content card */
.lp-b2-q1{
  align-items: stretch;
  justify-content: stretch;
}
.lp-b2-q1-inner{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.lp-b2-text{
  color: var(--text-2);
  font-weight: 600;
  font-size: 15px;
  line-height: 1.45;
}
.lp-b2-accent{
  margin-top: 2px;
  color: var(--text);
  font-weight: 800;
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: -0.01em;
}
.lp-b2-btn{
  margin-top: auto; /* stick to bottom */
  height: 48px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-weight: 800;
  font-size: 15px;
  color: #ffffff;
  background: var(--primary);
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
}
.lp-b2-btn:hover{
  filter: brightness(1.05);
}
.lp-b2-btn:active{
  transform: translateY(1px);
}

/* Light theme: keep button readable */
html[data-theme="light"] .lp-b2-btn{
  color: #ffffff;
}


/* Block 2 — lock/unlock (Q2/Q3 blurred until click) */
.lp-b2-locked{
  position: relative;
}
.lp-b2-locked::after{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: rgba(6, 14, 28, .55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  pointer-events: none;
}
.lp-b2.is-unlocked .lp-b2-locked::after{
  opacity: 0;
  transition: opacity .18s ease;
}
.lp-b2.is-unlocked .lp-b2-locked::after{
  display: none;
}

/* Block 2 — Q2/Q3 widgets (approx 1:1 with old landing) */
.lp-mid, .lp-weeks{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 14px;
}

.lp-mid-title{
  text-align: center;
  font-weight: 800;
  color: var(--text);
  line-height: 1.15;
  letter-spacing: -0.01em;
  font-size: 18px;
  margin-top: 4px;
}

.lp-dist-list{
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 4px;
}

.lp-dist-row{
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
}

.lp-dist-label{
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.lp-dist-dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.22);
  flex: 0 0 auto;
}

.lp-dist-label-text{
  color: var(--text);
  font-weight: 650;
  font-size: 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lp-dist-right{
  display: flex;
  align-items: center;
  gap: 10px;
}

.lp-dist-bar{
  width: 120px;
  height: 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}
.lp-dist-bar > span{
  display: block;
  height: 100%;
  border-radius: 999px;
  background: rgba(58,167,226,.9);
}

.lp-dist-pct{
  width: 34px;
  text-align: right;
  color: var(--text-2);
  font-weight: 700;
  font-size: 13px;
}

/* tones */
.lp-dist-dot[data-tone="ifstop-unknown"]{ background: rgba(148,163,184,.75); }
.lp-dist-dot[data-tone="ifstop-critical"]{ background: rgba(239,68,68,.90); }
.lp-dist-dot[data-tone="ifstop-conflict"]{ background: rgba(244,63,94,.90); }
.lp-dist-dot[data-tone="ifstop-money"]{ background: rgba(251,146,60,.90); }
.lp-dist-dot[data-tone="ifstop-unpleasant"]{ background: rgba(245,158,11,.90); }
.lp-dist-dot[data-tone="ifstop-self"]{ background: rgba(34,197,94,.85); }

.lp-mid-footer{
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.06);
}
.lp-mid-footer-label{
  color: var(--text-2);
  font-weight: 650;
  font-size: 13px;
  margin-bottom: 8px;
}
.lp-mid-footer-value{
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--text);
  font-weight: 750;
  font-size: 15px;
}
.lp-mid-footer-pct{
  margin-left: auto;
  color: var(--text-2);
  font-weight: 800;
}

/* weeks */
.lp-weeks-title{
  color: var(--text-2);
  font-weight: 750;
  font-size: 13px;
  letter-spacing: .2px;
  text-align: left;
}

.lp-weeks-list{
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 2px;
}

.lp-week-item{
  width: 100%;
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 12px;
  align-items: center;
  background: transparent;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  padding: 12px 14px;
  cursor: pointer;
  text-align: left;
}
.lp-week-item:hover{
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.03);
}
.lp-week-item--active{
  border-color: rgba(255,255,255,.22);
  box-shadow: 0 0 0 2px rgba(58,167,226,.35);
  background: rgba(58,167,226,.08);
}

.lp-week-marker{
  display: grid;
  place-items: center;
}
.lp-week-dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
}
.lp-week-item--active .lp-week-dot{
  background: rgba(58,167,226,.95);
  box-shadow: 0 0 0 6px rgba(58,167,226,.18);
}

.lp-week-range{
  color: var(--text);
  font-weight: 800;
  font-size: 15px;
}
.lp-week-meta{
  color: var(--text-2);
  font-weight: 650;
  font-size: 13px;
  margin-top: 4px;
}


/* Block 3 — KPI */
.lp-b3-card{
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: 16px;
}

/* Panel inner for Block 3 (contract: content stays inside) */
.lp-b3-inner{
  width: 100%;
  height: 100%;
  min-width: 0;
  overflow: visible;

  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 16px;
}

.lp-b3-top{
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.lp-u{
  text-decoration: underline;
  text-underline-offset: 2px;
}

.lp-b3-kpi{
  font-weight:900;
  letter-spacing:-0.04em;
  line-height:.95;
  font-size:96px;
  color:var(--text);
  margin-bottom:12px;
}

.lp-b3-lines{
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 860px;
  min-width: 0;
}

.lp-b3-line1{
  font-weight:700;
  font-size:31px;
  color:var(--text);
}

.lp-b3-line2,
.lp-b3-line3{
  font-weight:600;
  font-size:24px;
  color:var(--text-2);
}

.lp-b3-bottom{
  margin-top: auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-width: 860px;
}

.lp-b3-bottom-line1{
  color: var(--text-2);
  font-weight: 650;
  font-size: 15px;
  line-height: 1.35;
  overflow-wrap:anywhere; word-break:break-word;
}

.lp-b3-bottom-line2{
  color: var(--text);
  font-weight: 750;
  font-size: 15px;
  line-height: 1.35;
  overflow-wrap:anywhere; word-break:break-word;
}

/* Make block-3 visible above fold (desktop). */
.lp-block#block-3{
  margin-top: -10px;
}

@media (max-width: 980px){
  .lp-b3-kpi{ font-size: 67px; } /* +20% from 56px */
  .lp-b3-line1{ font-size: 24px; } /* +20% from 18px */
  .lp-b3-line2,.lp-b3-line3{ font-size: 19px; } /* +20% from 16px */

  .lp-b3-bottom-line1,
  .lp-b3-bottom-line2{ font-size: 15px; }

  .lp-block#block-3{ margin-top: 0; }
}

/* Block 4 — timeline */
.lp-b4-h{
  align-items: center;
  justify-content: center;
}
.lp-b4-h-text{
  font-weight: 900;
  font-size: 20px;
  letter-spacing: -0.02em;
  color: var(--text);
  text-align: center;
}

.lp-b4-timeline{
  align-items: stretch;
  justify-content: stretch;
  padding: 22px 22px 20px;
}

.lp-b4-tl{
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 24px; /* more vertical динамики */
}

.lp-b4-item{
  display: grid;
  grid-template-columns: 64px 18px 1fr;
  gap: 18px;
  align-items: start;
}

.lp-b4-time{
  color: var(--text-2);
  font-weight: 750;
  font-size: 15px;
  letter-spacing: .2px;
  margin-top: 2px;
}

.lp-b4-rail{
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  min-height: 44px;
}

.lp-b4-dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: rgba(148,163,184,.85);
  box-shadow: 0 0 0 7px rgba(148,163,184,.14);
  margin-top: 3px;
}

.lp-b4-dot--hot{
  background: rgba(58,167,226,.95);
  box-shadow: 0 0 0 8px rgba(58,167,226,.18);
}

.lp-b4-line{
  position: absolute;
  top: 18px;
  bottom: -24px; /* connect into next item (matches tl gap) */
  width: 2px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,.08));
  opacity: .9;
}

.lp-b4-item--last .lp-b4-line{ display:none; }

.lp-b4-body{
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.lp-b4-title{
  color: var(--text);
  font-weight: 900;
  font-size: 20px;
  letter-spacing: -0.01em;
  line-height: 1.15;
}

.lp-b4-sub{
  color: rgba(58,167,226,.95); /* выделить вторую строку */
  font-weight: 750;
  font-size: 15px;
  line-height: 1.2;
}

html[data-theme="light"] .lp-b4-sub{
  color: rgba(2,132,199,.95);
}

.lp-b4-out{
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: 12px;
}

.lp-b4-out-line1{
  color: var(--text-2);
  font-weight: 750;
  font-size: 18px;
  line-height: 1.2;
}

.lp-b4-out-line2{
  color: var(--text);
  font-weight: 900;
  font-size: 24px;
  letter-spacing: -0.01em;
  line-height: 1.15;
}

@media (max-width: 980px){
  .lp-b4-item{ grid-template-columns: 56px 18px 1fr; gap: 14px; }
  .lp-b4-title{ font-size: 18px; }
  .lp-b4-sub{ font-size: 15px; }
}


/* Block 5 — simple stack (no sticky) */
.lp-b5{
  padding-bottom: 0;
}

/* Cards */
.lp-b5-card{
  position: relative;
  top: auto;
  z-index: auto;

  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  min-height: 200px;
  padding: 22px 24px;
}

/* Typography */
.lp-b5-kicker{
  color: var(--text-2);
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-size: 12px;
}

.lp-b5-kpi{
  color: var(--text);
  font-weight: 950;
  letter-spacing: -0.03em;
  line-height: 1;
  font-size: 56px;
}

.lp-b5-card--day .lp-b5-kpi{
  font-size: 56px;
}

.lp-b5-card--week .lp-b5-kpi{
  font-size: 60px;
}

.lp-b5-card--month .lp-b5-kpi{
  font-size: 64px;
}

.lp-b5-unit{
  color: var(--text-2);
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-left: 0;
}

.lp-b5-desc{
  color: var(--text);
  font-weight: 750;
  font-size: 30px;
  line-height: 1.15;
  max-width: 560px;
  margin-top: 12px;
}

@media (max-width: 980px){
  .lp-b5-kpi{ font-size: 44px; }
}
/* =========================================================
   Block 6 — expectation vs reality (landing only, lp-*)
   Goal: match reference layout and prevent content from
   changing panel geometry.
   ========================================================= */

.lp-b6-card{
  /* keep existing panel geometry */
  align-items:flex-start;
  justify-content:flex-start;
  flex-direction:column;
  gap: 14px;

  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.lp-b6-eyebrow{
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--text-2);
  font-weight: 800;
  line-height: 1.2;

  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lp-b6-title{
  color: var(--text);
  font-weight: 900;
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: -0.01em;

  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lp-b6-list{
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;

  /* if someone adds a ton of text later — do not grow the panel */
  overflow: auto;
  max-height: 260px;
  padding-right: 6px;
}

.lp-b6-item{
  color: var(--text-2);
  font-weight: 650;
  font-size: 15px;
  line-height: 1.45;
  max-width: 100%;
  overflow-wrap: anywhere;
}

/* dotted list (right panel) */
.lp-b6-list--dots .lp-b6-item{
  position: relative;
  padding-left: 18px;
}
.lp-b6-list--dots .lp-b6-item::before{
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--primary);
  position: absolute;
  left: 0;
  top: .55em;
  opacity: .95;
}

@media (max-width: 980px){
  .lp-b6-title{ font-size: 18px; }
  .lp-b6-item{ font-size: 15px; }
  .lp-b6-list{ max-height: none; overflow: visible; padding-right: 0; }
}


/* ===== Patch: Block 2 is always visible (no blur on Q2/Q3) ===== */
.lp-b2-locked::after{
  display:none !important;
  opacity:0 !important;
}



/* Block 2 — Telegram icon inside CTA */
.lp-b2-btn{
  gap: 10px;
}
.lp-b2-btn-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: .92;
}
.lp-b2-btn-icon svg{
  display:block;
}
/* ===== Block 7 ===== */

.lp-b7-list{
  margin-top:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
  padding-left:18px;
  color:var(--text-2);
  font-size:15px;
  line-height:1.45;
}

.lp-b7-list li{
  list-style:disc;
}

.lp-b7-note{
  margin-top:18px;
  font-size:15px;
  color:var(--text-3);
}

/* ===== Block 7 Q1 =====
   Q1 typography rules:
   - BASE size is driven by panel width (container query)
   - "где бизнес держится" and "только на вашем" share BASE
   - "личном" and "участии" = BASE * 1.5
   - "Radar показывает" unchanged
   Micro-upgrade:
   - BASE tuned to fit single-line headline inside span-4 panel
   - use nowrap on the two BASE lines (handled by class)
*/

.lp-b7-q1{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  text-align:left;
  width:100%;
  height:100%;
  gap: 18px;

  /* Fallback base (if container queries unsupported) */
  --b7-base: 36px;
}

/* Enable container queries for responsive type */
@supports (container-type: inline-size){
  .lp-b7-q1{
    container-type: inline-size;

    /*
      BASE is derived from panel inline size (cqi).
      Tuned for span-4 panels with 24px padding to keep:
      - "где бизнес держится" on ONE line
      - "только на вашем" on ONE line
    */
    --b7-base: clamp(24px, 9cqi, 40px);
  }
}

.lp-b7-top{
  margin:0;
  color: var(--text-3);
  font-weight: 650;
  font-size: 15px;
  line-height: 1.2;
}

.lp-b7-lines{
  margin:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:100%;
  gap: 18px;
}

.lp-b7-line{
  margin:0;
  width:100%;
  color: var(--text);
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1.05;

  /* BASE size (driven by panel width) */
  font-size: var(--b7-base);
}

/* Keep a BASE line strictly in one row */
.lp-b7-line--nowrap{
  white-space: nowrap;
}

/* Big lines */
.lp-b7-line--big{
  font-size: calc(var(--b7-base) * 1.5);
  line-height: 1.0;
}


/* Block 7 Q1 — new left panel layout (Radar покажет...) */
.lp-b7-q1-inner{
  min-width:0;
  height:100%;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  gap:16px; /* within 12–16 */
}

.lp-b7-kicker{
  font-size:12px; /* ~30% smaller than 16px */
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--text-2);
  font-weight:700;
  line-height:1.2;
}

.lp-b7-q1-main{
  display:flex;
  flex-direction:column;
  gap:18px;
  min-width:0;
}

.lp-b7-q1-foot{
  margin-top:auto;
  font-size: calc(var(--b7-base) * 0.7); /* 30% smaller */
  color: var(--text-2);
  font-weight: 650;
  line-height: 1.2;
  min-width:0;
}


@media (max-width: 980px){
  .lp-b7-lines{ gap: 14px; }
}

/* =========================================================
   Patterns overrides — Bars (Block 9 / If-stop)
   - keep 50/50 layout from landing.patterns.css
   - make labels readable (no ellipsis)
   - add per-tone colored fills (1:1 with product legend)
   ========================================================= */

.lp-bars{ min-width:0; }
.lp-bars-row{ min-width:0; }
.lp-bars-label, .lp-bars-right{ min-width:0; }

/* Labels: slightly smaller so they fit on one line.
   No ellipsis (must stay readable). */
/* Labels: slightly smaller so they fit on one line (no ellipsis). */
.lp-bars-text{
  font-size: 12px; /* -1..2px to fit “терпимые неприятности” */
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: -0.01em;

  white-space: nowrap; /* single line as required */
  overflow: visible;
  text-overflow: clip;
  max-width: 100%;
  min-width: 0;
}

/* Track look (matches product feel) */
.lp-bars-track{
  background: rgba(255,255,255,.06);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}
html[data-theme="light"] .lp-bars-track{
  background: rgba(15,23,42,.06);
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.10);
}

/* Tone mapping (dot + fill) */
.lp-bars-row[data-tone="ifstop-unknown"] .lp-bars-dot{ background: rgba(148,163,184,.75); }
.lp-bars-row[data-tone="ifstop-critical"] .lp-bars-dot{ background: rgba(239,68,68,.90); }
.lp-bars-row[data-tone="ifstop-conflict"] .lp-bars-dot{ background: rgba(244,63,94,.90); }
.lp-bars-row[data-tone="ifstop-money"] .lp-bars-dot{ background: rgba(251,146,60,.90); }
.lp-bars-row[data-tone="ifstop-unpleasant"] .lp-bars-dot{ background: rgba(245,158,11,.90); }
.lp-bars-row[data-tone="ifstop-self"] .lp-bars-dot{ background: rgba(34,197,94,.85); }

.lp-bars-row[data-tone="ifstop-unknown"] .lp-bars-fill{ background: rgba(148,163,184,.85); }
.lp-bars-row[data-tone="ifstop-critical"] .lp-bars-fill{ background: rgba(239,68,68,.95); }
.lp-bars-row[data-tone="ifstop-conflict"] .lp-bars-fill{ background: rgba(244,63,94,.95); }
.lp-bars-row[data-tone="ifstop-money"] .lp-bars-fill{ background: rgba(251,146,60,.95); }
.lp-bars-row[data-tone="ifstop-unpleasant"] .lp-bars-fill{ background: rgba(245,158,11,.95); }
.lp-bars-row[data-tone="ifstop-self"] .lp-bars-fill{ background: rgba(34,197,94,.95); }


/* Bars fill color must match CTA button color (product primary), not the dots */
.lp-b9-q2 .lp-bars-fill{
  background: var(--primary);
  width: var(--lp-fill, 0%);
}

/* Block 9 — Bars fill widths (hardcoded, CSS-only)
   Logic: max value -> 100%, others already precomputed into data-fill.
   No inline styles, no JS dependency. */
.lp-b9-q2 .lp-bars-fill[data-fill="100"]{ width: 100%; }
.lp-b9-q2 .lp-bars-fill[data-fill="85"]{ width: 85%; }
.lp-b9-q2 .lp-bars-fill[data-fill="65"]{ width: 65%; }
.lp-b9-q2 .lp-bars-fill[data-fill="35"]{ width: 35%; }
/* =========================================================
   Block 9 — Q2 (bars panel) title + footer (no inline CSS)
   ========================================================= */

.lp-b9-q2 .lp-panel-inner{
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 14px; /* within 12–16 */
  overflow: hidden;
}

.lp-b9-q2 .lp-q2-title{
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  text-align: left;
  font-weight: 750;
  letter-spacing: -0.01em;
  line-height: 1.08;
  font-size: 24px; /* slightly smaller; JS-fit may reduce further */
  padding-bottom: 10px; /* 14 + 10 = 24px before bars */
}

.lp-b9-q2 .lp-q2-title-line{ min-width:0; }
.lp-b9-q2 .lp-q2-title-line3{ white-space: nowrap; }

/* Keep divider + footer at the bottom of the square panel */
.lp-b9-q2 .lp-q2-divider{ margin-top: auto; }

.lp-b9-q2 .lp-q2-divider{
  width: 100%;
  height: 1px;
  background: rgba(255,255,255,.06);
}
html[data-theme="light"] .lp-b9-q2 .lp-q2-divider{
  background: rgba(15,23,42,.08);
}

.lp-b9-q2 .lp-q2-footer{
  color: var(--text-2);
  font-weight: 650;
  font-size: 15px;
  line-height: 1.2;
  text-align: left;
}


/* Block 9 — right square copy panel */
.lp-b9-q2-copy{
  justify-content: flex-start;
  align-items: stretch;
  gap: 0;
}

.lp-b9-q2-copy .lp-b9-q2-pack{
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.lp-b9-q2-copy .lp-b9-q2-pack--lead{
  gap: 4px;
}

.lp-b9-q2-copy .lp-b9-q2-pack--muted{
  gap: 3px;
  padding-top: 20px;
}

.lp-b9-q2-copy .lp-b9-q2-pack--final{
  gap: 4px;
  margin-top: auto;
  padding-top: 24px;
}

.lp-b9-q2-copy .lp-b9-q2-line{
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
  text-align: left;
  letter-spacing: -0.01em;
}

.lp-b9-q2-copy .lp-b9-q2-pack--lead .lp-b9-q2-line{
  font-size: 24px;
  line-height: 1.08;
  font-weight: 750;
  color: var(--text);
}

.lp-b9-q2-copy .lp-b9-q2-pack--muted .lp-b9-q2-line{
  font-size: 22px;
  line-height: 1.1;
  font-weight: 700;
  color: var(--text-2);
}

.lp-b9-q2-copy .lp-b9-q2-pack--final .lp-b9-q2-line{
  font-size: 22px;
  line-height: 1.1;
  font-weight: 750;
  color: var(--text);
}

@media (max-width: 980px){
  .lp-b9-q2-copy .lp-b9-q2-pack--muted{
    padding-top: 16px;
  }

  .lp-b9-q2-copy .lp-b9-q2-pack--final{
    padding-top: 18px;
  }

  .lp-b9-q2-copy .lp-b9-q2-pack--lead .lp-b9-q2-line{
    font-size: 21px;
    line-height: 1.08;
  }

  .lp-b9-q2-copy .lp-b9-q2-pack--muted .lp-b9-q2-line,
  .lp-b9-q2-copy .lp-b9-q2-pack--final .lp-b9-q2-line{
    font-size: 19px;
    line-height: 1.1;
  }
}

/* ===== Block 7 — Radar (central panel only) ===== */
.lp-b7-radar{ overflow:hidden; }
.lp-b7-radar .lp-panel-inner{ height:100%; display:flex; min-width:0; }
.lp-b7-radar-wrap{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; min-width:0; }

/* theme variables for static radar */
html:not([data-theme="light"]) .lp-b7-radar{
  --lp-ring-1: #155e3a;   /* green */
  --lp-ring-2: #6b4a12;   /* yellow/brown */
  --lp-ring-3: #7a3315;   /* orange */
  --lp-ring-4: #7c1d1d;   /* red */
  --lp-empty: rgba(148,163,184,.14);
  --lp-radar-grid: rgba(148,163,184,.22);
  --lp-radar-grid-major: rgba(148,163,184,.28);
  --lp-radar-label: rgba(226,232,240,.55);
  --lp-radar-center: rgba(15,23,42,.88);
  --lp-radar-center-stroke: rgba(148,163,184,.18);
  --lp-radar-center-text: rgba(226,232,240,.92);
}

html[data-theme="light"] .lp-b7-radar{
  --lp-ring-1: #d1fae5;   /* green */
  --lp-ring-2: #fef3c7;   /* yellow */
  --lp-ring-3: #fed7aa;   /* orange */
  --lp-ring-4: #fecaca;   /* red/pink */
  --lp-empty: rgba(15,23,42,.04);
  --lp-radar-grid: rgba(15,23,42,.12);
  --lp-radar-grid-major: rgba(15,23,42,.16);
  --lp-radar-label: rgba(15,23,42,.60);
  --lp-radar-center: #ffffff;
  --lp-radar-center-stroke: rgba(15,23,42,.10);
  --lp-radar-center-text: rgba(15,23,42,.92);
}

/* svg sizing */
.lp-b7-radar .lp-radar-svg{ width:100%; height:auto; max-width: 560px; }


/* sectors hover (quiet, no new strokes) */
.lp-b7-radar .lp-radar-sector{ cursor:pointer; }
.lp-b7-radar .lp-radar-sector .lp-radar-cell{
  transition: filter .15s ease, opacity .15s ease;
}
.lp-b7-radar .lp-radar-sector:hover .lp-radar-cell{
  filter: brightness(1.16) saturate(1.04);
}

/* grid */
.lp-b7-radar .lp-radar-grid-circle,
.lp-b7-radar .lp-radar-grid-line,
.lp-b7-radar .lp-radar-grid-ray{
  stroke: var(--lp-radar-grid);
  stroke-width: 1;
  shape-rendering: geometricPrecision;
}
.lp-b7-radar .lp-radar-grid-major{ stroke: var(--lp-radar-grid-major); stroke-width: 1.25; }
.lp-b7-radar .lp-radar-grid-minor{ stroke: var(--lp-radar-grid); stroke-width: 1; }

/* center */
.lp-b7-radar .lp-radar-center{
  fill: var(--lp-radar-center);
  stroke: var(--lp-radar-center-stroke);
  stroke-width: 2;
}
.lp-b7-radar .lp-radar-center-text{
  fill: var(--lp-radar-center-text);
  font-size: 30px;
  font-weight: 600;
}

.lp-b7-radar .radar-center-text{
  fill: var(--lp-radar-center-text);
  font-size: 30px;
  font-weight: 700;
}

html:not([data-theme="light"]) .lp-b7-radar .lp-radar-center-text{ fill: rgba(226,232,240,.95); }

/* labels */
.lp-b7-radar .lp-radar-label{
  fill: var(--lp-radar-label);
  font-size: 58px;
  font-weight: 600;
  letter-spacing: .2px;
}


.lp-b7-radar .radar-label{
  fill: var(--lp-radar-label);
  font-size: 58px;
  font-weight: 600;
  letter-spacing: .2px;
  white-space: pre;
}
/* prevent word breaking inside svg labels */
.lp-b7-radar .lp-radar-label,
.lp-b7-radar .lp-radar-center-text{
  white-space: pre;
}


/* Block 7 — right panel text */
.lp-b7-rtext{
  height:100%;
  display:flex;
  flex-direction:column;
  gap: 16px;
  min-width:0;
  overflow:hidden;
}
.lp-b7-rtext-top,
.lp-b7-rtext-mid{
  display:flex;
  flex-direction:column;
  gap: 6px;
  min-width:0;
}
.lp-b7-rtext-bot{
  margin-top:auto;
  display:flex;
  flex-direction:column;
  gap: 6px;
  min-width:0;
}
.lp-b7-rline{
  min-width:0;
  overflow-wrap:anywhere;
  word-break:break-word;
  color: var(--text);
  font-weight: 650;
  font-size: 20px;
  line-height: 1.18;
}
.lp-b7-rline--muted{
  color: var(--text-2);
  font-weight: 800;
  font-size: 15px;
  letter-spacing: .16em;
  text-transform: uppercase;
  line-height: 1.2;
}


/* Block 7 — right panel: stronger separation between top and mid */
.lp-b7-rtext-top{ padding-bottom: 10px; }


/* Helpers */
.lp-nowrap{ white-space: nowrap; }


/* Block 1 — improved hero typography */
.lp-b1-right{
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.lp-b1-right-brand{
  font-weight:900;
  font-size:22px;
  letter-spacing:-0.01em;
  color:var(--text);
}

.lp-b1-right-headline{
  font-weight:700;
  font-size:20px;
  line-height:1.25;
  color:var(--text);
}

.lp-b1-right-subline{
  font-weight:600;
  font-size:16px;
  color:var(--text-2);
  line-height:1.3;
}

.lp-b1-cta{
  margin-top:18px;
  width:fit-content;
  min-width:220px;
}


/* === Block 3 KPI — FINAL OVERRIDE (prevents conflicts) === */
#block-3 .lp-b3-kpi{
  font-weight:900;
  letter-spacing:-0.04em;
  line-height:.95;
  font-size:96px;
  color:var(--text);
  margin-bottom:12px;
}
#block-3 .lp-b3-lines{ gap:12px; }
#block-3 .lp-b3-line1{
  font-weight:700;
  font-size:31px;
  color:var(--text);
}
#block-3 .lp-b3-line2{
  font-weight:600;
  font-size:22px;
  color:var(--text-2);
}
#block-3 .lp-b3-line3{
  font-weight:600;
  font-size:22px;
  color:var(--text-2);
}

/* Mobile tune — keep rhythm */
@media (max-width: 980px){
  #block-3 .lp-b3-kpi{ font-size:72px; margin-bottom:10px; }
  #block-3 .lp-b3-line1{ font-size:20px; }
  #block-3 .lp-b3-line2,
  #block-3 .lp-b3-line3{ font-size:18px; }
  #block-3 .lp-b3-lines{ gap:10px; }
}


/* =========================================================
   Block 9 — KPI (Q1) OVERRIDE (hard)
   Scoped to .lp-b9-q1 to avoid conflicts with other blocks.
   ========================================================= */
.lp-b9-q1 .lp-b3-kpi{
  font-weight:900 !important;
  letter-spacing:-0.04em !important;
  line-height:.95 !important;
  font-size:96px !important;
  color:var(--text) !important;
  margin-bottom:12px !important;
}

.lp-b9-q1 .lp-b3-lines{
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
  min-width:0 !important;
}

.lp-b9-q1 .lp-b3-line1{
  font-weight:700 !important;
  font-size:24px !important;
  line-height:1.25 !important;
  color:var(--text) !important;
}

.lp-b9-q1 .lp-b3-line2,
.lp-b9-q1 .lp-b3-line3{
  font-weight:600 !important;
  font-size:22px !important;
  line-height:1.3 !important;
  color:var(--text-2) !important;
}

/* Mobile: same rhythm, slightly smaller sizes */
@media (max-width: 980px){
  .lp-b9-q1 .lp-b3-kpi{ font-size:84px !important; margin-bottom:10px !important; }
  .lp-b9-q1 .lp-b3-lines{ gap:10px !important; }
  .lp-b9-q1 .lp-b3-line1{ font-size:22px !important; }
  .lp-b9-q1 .lp-b3-line2,
  .lp-b9-q1 .lp-b3-line3{ font-size:20px !important; }
}




/* =========================================================
   Patterns base used by landing HTML
   ========================================================= */
.lp-text-stack{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:0;
}

.lp-cta{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  min-width:0;
}

.lp-cta-btn{
  width:auto;
  max-width:100%;
  min-width:0;
  height:48px;
  padding:0 16px;
  margin-top:0;
  align-self:flex-start;
}

.lp-cta-caption{
  min-width:0;
  font-size:14px;
  line-height:1.25;
  font-weight:600;
  color:var(--text-2);
  overflow-wrap:anywhere;
  word-break:break-word;
}


/* =========================================================
   Block 1 — Hero top-right KPI panel (single актуальная version)
   ========================================================= */
.lp-panel > :first-child,
.lp-panel-inner > :first-child{
  margin-top:0;
}

.lp-b1-kpi-swap-panel{
  align-items:flex-start;
  justify-content:flex-start;
}

.lp-b1-kpi-swap{
  width:100%;
  height:100%;
  min-width:0;
  align-self:stretch;
  display:flex;
  flex-direction:column;
  gap:18px;
}

.lp-b1-kpi-grid{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  align-items:start;
  column-gap:28px;
}

.lp-b1-kpi-left{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
}

.lp-b1-kpi-right{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:16px;
}

.lp-b1-kpi-right-top,
.lp-b1-kpi-right-bottom{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
}

.lp-b1-kpi-right-top{
  padding-top:0;
}

.lp-b1-kpi-swap .lp-b3-kpi{
  margin:0;
  font-size:81px;
  line-height:1;
  letter-spacing:-0.045em;
  font-weight:900;
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum";
  color:var(--text);
}

.lp-b1-kpi-left .lp-b3-line1{
  margin:0;
  font-size:38px;
  line-height:1.08;
  font-weight:700;
  color:var(--text);
}

.lp-b1-kpi-right .lp-b3-line2,
.lp-b1-kpi-right .lp-b3-line3{
  margin:0;
  font-size:22px;
  line-height:1.16;
  font-weight:700;
  color:var(--text-2);
}

.lp-b1-kpi-right-accent{
  color:var(--text);
}

@media (max-width: 980px){
  .lp-b1-kpi-grid{
    grid-template-columns:1fr;
    row-gap:14px;
  }

  .lp-b1-kpi-left{
    gap:8px;
  }

  .lp-b1-kpi-left .lp-b3-line1{
    font-size:31px;
  }

  .lp-b1-kpi-swap .lp-b3-kpi{
    font-size:65px;
  }

  .lp-b1-kpi-right{
    gap:12px;
  }

  .lp-b1-kpi-right .lp-b3-line2,
  .lp-b1-kpi-right .lp-b3-line3{
    font-size:19px;
    line-height:1.18;
  }
}

/* =========================================================
   Block 9 — hero left panel
   ========================================================= */
.lp-b9-q1{
  justify-content: space-between;
  overflow: hidden;
}

.lp-b9-stack{
  gap: 24px;
  max-width: 42ch;
}

.lp-b9-h1{
  display:flex;
  flex-direction:column;
  gap: 4px;
  min-width:0;
}

.lp-b9-h1-line{
  font-size: 38px;
  line-height: 1.01;
  font-weight: 880;
  letter-spacing: -0.035em;
  color: var(--text);
  white-space: nowrap;
}

.lp-b9-explain{
  display:flex;
  flex-direction:column;
  gap: 6px;
  min-width:0;
  margin-top:6px;
}

.lp-b9-explain-line{
  font-size: 24px;
  line-height: 1.16;
  font-weight: 700;
  color: var(--text-2);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.lp-b9-result{
  display:flex;
  flex-direction:column;
  gap: 2px;
  min-width:0;
  padding-top: 10px;
}

.lp-b9-result-line{
  font-size: 24px;
  line-height: 1.16;
  font-weight: 700;
  color: var(--text);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.lp-b9-result-line--accent{
  font-weight: 800;
  letter-spacing: -0.015em;
}

.lp-b9-result-num{
  font-weight: 920;
  color: var(--text);
}

.lp-b9-q1 .lp-b9-cta-row{
  margin-top: auto;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 14px;
  padding-top: 26px;
  min-width: 0;
}

.lp-b9-q1 .lp-cta-btn{
  min-width: 0;
  height: 54px;
  padding: 0 20px;
  margin-top: 0;
  align-self: center;
  font-size: 18px;
  font-weight: 800;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease;
}

.lp-b9-q1 .lp-cta-btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.08);
  box-shadow: 0 12px 30px rgba(0,0,0,.35);
}

.lp-b9-q1 .lp-cta-btn:active{
  transform: translateY(0);
  filter: brightness(.98);
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
}

.lp-b9-q1 .lp-cta-caption{
  min-width: 0;
  max-width: 360px;
  font-size: 15px;
  line-height: 1.2;
  font-weight: 600;
  color: var(--text-2);
}

@media (max-width: 980px){
  .lp-b9-stack{
    gap: 18px;
    max-width: 100%;
  }

  .lp-b9-h1-line{
    font-size: 32px;
    white-space: normal;
  }

  .lp-b9-explain-line,
  .lp-b9-result-line{
    font-size: 15px;
    line-height: 1.2;
  }

  .lp-b9-result{
    padding-top: 8px;
  }

  .lp-b9-q1 .lp-b9-cta-row{
    padding-top: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .lp-b9-q1 .lp-cta-btn{
    height: 48px;
    padding: 0 16px;
    font-size: 15px;
  }

  .lp-b9-q1 .lp-cta-caption{
    max-width: 100%;
    font-size: 13px;
  }
}


/* =========================================================
   Block 11 — consequences
   Header restored from old file; cards use pattern-safe inner spacing
   ========================================================= */
.lp-b11-head-panel,
.lp-b11-card{
  align-items:flex-start;
  justify-content:flex-start;
}

.lp-b11-head,
.lp-b11-card-inner{
  width:100%;
  height:100%;
  min-width:0;
  overflow:hidden;
  text-align:left;
}

.lp-b11-head{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
}

.lp-b11-head-stack{
  width:100%;
  align-items:flex-start;
  gap:6px;
}

.lp-b11-head-line1,
.lp-b11-head-line2{
  font-size:28px;
  line-height:1.1;
  letter-spacing:-0.02em;
  text-align:left;
}

.lp-b11-head-line1{
  color:var(--text);
  font-weight:850;
}

.lp-b11-head-line2{
  color:var(--text-2);
  font-weight:800;
}

.lp-b11-grid{
  grid-template-columns:repeat(4, minmax(0, 1fr));
}

.lp-b11-card-inner{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:14px;
  padding:0;
}

.lp-b11-pack{
  min-width:0;
  align-items:flex-start;
}

.lp-b11-pack--top,
.lp-b11-pack--mid,
.lp-b11-pack--bottom{
  gap:0;
}

.lp-b11-pack--mid{
  margin-top:4px;
}

.lp-b11-pack--bottom{
  margin-top:auto;
}

.lp-b11-title,
.lp-b11-mid,
.lp-b11-low{
  max-width:100%;
  min-width:0;
  overflow-wrap:break-word;
  word-break:normal;
}

.lp-b11-title{
  color:var(--text);
  font-weight:850;
  font-size:24px;
  line-height:1.1;
  letter-spacing:-0.01em;
}

.lp-b11-mid{
  color:var(--text);
  font-weight:750;
  font-size:17px;
  line-height:1.2;
}

.lp-b11-low{
  color:var(--text-2);
  font-weight:600;
  font-size:15px;
  line-height:1.3;
}

@media (max-width: 980px){
  .lp-b11-grid{
    grid-template-columns:1fr 1fr;
  }

  .lp-b11-head-line1,
  .lp-b11-head-line2{
    font-size:24px;
  }

  .lp-b11-title{
    font-size:20px;
  }

  .lp-b11-mid{
    font-size:15px;
  }

  .lp-b11-low{
    font-size:13px;
  }
}

/* =========================================================
   Block 6 — timeline style (right column)
   ========================================================= */

.lp-b6-list--timeline{
  gap:24px;
}

.lp-b6-pair{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.lp-b6-pair-title{
  color:var(--text);
  font-weight:900;
  font-size:18px;
  letter-spacing:-0.01em;
  line-height:1.15;
}

.lp-b6-pair-sub{
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-weight:750;
  font-size:14px;
  line-height:1.2;
  color:rgba(251,146,60,.95);
}

.lp-b6-pair-arrow{
  flex:0 0 auto;
  font-weight:900;
  font-size:1.2em;
  line-height:1;
  transform:translateY(0.02em);
}

@media (max-width: 980px){
  .lp-b6-list--timeline{
    gap:18px;
  }

  .lp-b6-pair-title{
    font-size:18px;
  }

  .lp-b6-pair-sub{
    font-size:15px;
  }
}

/* =========================================================
   Block 6 — header + left two-line list
   ========================================================= */

.lp-b6-head-panel{
  align-items:flex-start;
  justify-content:flex-start;
}

.lp-b6-head{
  width:100%;
  height:100%;
  min-width:0;
  overflow:hidden;
  text-align:left;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
}

.lp-b6-head-stack{
  width:100%;
  align-items:flex-start;
  gap:6px;
}

.lp-b6-head-line1,
.lp-b6-head-line2{
  font-size:28px;
  line-height:1.1;
  letter-spacing:-0.02em;
  text-align:left;
}

.lp-b6-head-line1{
  color:var(--text);
  font-weight:850;
}

.lp-b6-head-line2{
  color:var(--text-2);
  font-weight:800;
}

/* +10% for block 6 titles */
.lp-b6-title{
  font-size:26px;
}

.lp-b6-list--leftpairs{
  gap:24px;
}

.lp-b6-pair--left{
  gap:8px;
}

.lp-b6-pair-sub--left{
  color:var(--text-2);
}

.lp-b6-pair-dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--primary);
  flex:0 0 auto;
  margin-top:0.35em;
}

@media (max-width: 980px){
  .lp-b6-head-line1,
  .lp-b6-head-line2{
    font-size:24px;
  }

  .lp-b6-title{
    font-size:20px;
  }
}

/* =========================================================
   Block 7 — top head panel
   ========================================================= */

.lp-b7-head-panel{
  align-items:flex-start;
  justify-content:flex-start;
}

.lp-b7-head-inner{
  width:100%;
  height:100%;
  min-width:0;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  text-align:left;
}

.lp-b7-head-stack{
  width:100%;
  align-items:flex-start;
  gap:32px;
}

.lp-b7-head-pack2{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
}

.lp-b7-head-pack3{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
  margin-top:48px;
}

.lp-b7-head-line1{
  color:var(--text);
  font-weight:900;
  font-size:28px;
  line-height:1.1;
  letter-spacing:-0.02em;
}

.lp-b7-head-line2{
  color:var(--text-2);
  font-weight:800;
  font-size:28px;
  line-height:1.1;
  letter-spacing:-0.02em;
}

.lp-b7-head-line3{
  color:var(--text);
  font-weight:650;
  font-size:20px;
  line-height:1.28;
}

@media (max-width: 980px){
  .lp-b7-head-stack{
    gap:24px;
  }

  .lp-b7-head-pack2,
  .lp-b7-head-pack3{
    gap:8px;
  }

  .lp-b7-head-pack3{
    margin-top:32px;
  }

  .lp-b7-head-line1{
    font-size:24px;
  }

  .lp-b7-head-line2{
    font-size:24px;
  }

  .lp-b7-head-line3{
    font-size:17px;
  }
}


/* =========================================================
   Block 10 — head + CTA
   ========================================================= */

.lp-b10-head-panel,
.lp-b10-cta-panel{
  align-items:flex-start;
  justify-content:flex-start;
}

.lp-b10-head-inner,
.lp-b10-cta-inner{
  width:100%;
  height:100%;
  min-width:0;
  overflow:hidden;
}

.lp-b10-head-inner{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  text-align:left;
}

.lp-b10-head-stack{
  width:100%;
  align-items:flex-start;
  gap:6px;
}

.lp-b10-head-line1,
.lp-b10-head-line2{
  font-size:28px;
  line-height:1.1;
  letter-spacing:-0.02em;
  text-align:left;
}

.lp-b10-head-line1{
  color:var(--text);
  font-weight:850;
}

.lp-b10-head-line2{
  color:var(--text-2);
  font-weight:800;
}

.lp-b10-cta-inner{
  display:flex;
}

.lp-b10-cta{
  width:100%;
  height:100%;
}

.lp-b10-cta-btn{
  width:100%;
  height:100%;
  min-width:0;
  align-self:stretch;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:16px;
  background:var(--primary);
  color:#fff;
  text-decoration:none;
  font-weight:800;
  font-size:18px;
  box-shadow:0 8px 24px rgba(0,0,0,.25);

  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease;
}

.lp-b10-cta-btn:hover{ transform: translateY(-1px); filter: brightness(1.08); box-shadow: 0 12px 30px rgba(0,0,0,.35); }
.lp-b10-cta-btn:active{ transform: translateY(0); filter: brightness(.98); box-shadow: 0 8px 24px rgba(0,0,0,.25); }

@media (max-width: 980px){
  .lp-b10-head-line1,
  .lp-b10-head-line2{
    font-size:24px;
  }

  .lp-b10-cta-btn{
    font-size:16px;
  }
}


/* =========================================================
   Block 10 — case cards: bottom pack like bars footer
   ========================================================= */

.lp-b10-case{
  width:100%;
  height:100%;
  min-width:0;
  display:flex;
  flex-direction:column;
}

.lp-b10-pack--bottom{
  margin-top:auto;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.06);
  color:var(--text-2);
  font-weight:650;
  line-height:1.2;
  text-align:left;
}

html[data-theme="light"] .lp-b10-pack--bottom{
  border-top-color:rgba(15,23,42,.08);
}


/* =========================================================
   Block 10 — case cards: packs 1 and 2 hierarchy
   ========================================================= */

.lp-b10-pack--top{
  color:var(--text-2);
  font-size:17px;
  line-height:1.22;
  font-weight:650;
  text-align:left;
}

.lp-b10-pack--mid{
  margin-top:16px;
  color:var(--text);
  font-size:18px;
  line-height:1.18;
  font-weight:750;
  text-align:left;
}

/* =========================================================
   Block 10 — result highlight inside pack 2
   ========================================================= */

.lp-b10-result-action,
.lp-b10-result-arrow{
  color:var(--text);
  font-weight:750;
}

.lp-b10-result-value{
  color:var(--primary);
  font-weight:750;
}

.lp-b10-result-num{
  font-weight:800;
}

/* =========================================================
   Block 8 — head + proof panel
   ========================================================= */

.lp-b8-title-panel,
.lp-b8-proof-panel{
  align-items:flex-start;
  justify-content:flex-start;
}

.lp-b8-title-inner,
.lp-b8-proof-inner{
  width:100%;
  height:100%;
  min-width:0;
  overflow:hidden;
}

.lp-b8-title-inner{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  text-align:left;
}

.lp-b8-head-stack{
  width:100%;
  align-items:flex-start;
  gap:6px;
}

.lp-b8-head-line1,
.lp-b8-head-line2{
  font-size:28px;
  line-height:1.1;
  letter-spacing:-0.02em;
  text-align:left;
}

.lp-b8-head-line1{
  color:var(--text);
  font-weight:850;
}

.lp-b8-head-line2{
  color:var(--text-2);
  font-weight:800;
}

.lp-b8-proof-inner{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:10px;
  text-align:left;
}

.lp-b8-proof-count{
  color:var(--text);
  font-size:18px;
  line-height:1.2;
  font-weight:700;
}

.lp-b8-proof-delta{
  color:var(--primary);
  font-size:16px;
  line-height:1.2;
  font-weight:750;
}

@media (max-width: 980px){
  .lp-b8-head-line1,
  .lp-b8-head-line2{
    font-size:24px;
  }

  .lp-b8-proof-count{
    font-size:16px;
  }

  .lp-b8-proof-delta{
    font-size:15px;
  }
}

/* =========================================================
   Block 8 — intro copy panel
   ========================================================= */

.lp-b8-copy-panel{
  align-items:flex-start;
  justify-content:flex-start;
  overflow:hidden;
}

.lp-b8-copy-inner{
  width:100%;
  height:100%;
  min-width:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  gap:0;
  padding:0;
  max-width:760px;
}

.lp-b8-copy-pack{
  width:100%;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}

.lp-b8-copy-pack--lead{
  gap:4px;
}

.lp-b8-copy-pack--body{
  gap:10px;
  padding-top:18px;
}

.lp-b8-copy-pack--final{
  gap:4px;
  margin-top:auto;
  padding-top:24px;
}

.lp-b8-copy-line{
  min-width:0;
  text-align:left;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.lp-b8-copy-pack--lead .lp-b8-copy-line{
  color:var(--text);
  font-size:28px;
  line-height:1.1;
  font-weight:850;
  letter-spacing:-0.02em;
}

.lp-b8-copy-pack--body .lp-b8-copy-line{
  color:var(--text-2);
  font-size:28px;
  line-height:1.1;
  font-weight:800;
  letter-spacing:-0.02em;
}

.lp-b8-copy-pack--final .lp-b8-copy-line{
  color:var(--text-2);
  font-size:22px;
  line-height:1.18;
  font-weight:750;
  letter-spacing:0.08em;
  text-transform:uppercase;
}

@media (max-width: 980px){
  .lp-b8-copy-inner{
    max-width:100%;
  }

  .lp-b8-copy-pack--body{
    padding-top:16px;
    gap:10px;
  }

  .lp-b8-copy-pack--final{
    padding-top:18px;
  }

  .lp-b8-copy-pack--lead .lp-b8-copy-line,
  .lp-b8-copy-pack--body .lp-b8-copy-line{
    font-size:24px;
    line-height:1.1;
  }

  .lp-b8-copy-pack--final .lp-b8-copy-line{
    font-size:18px;
    line-height:1.18;
    letter-spacing:0.06em;
  }
}

/* =========================================================
   Block 11 — consequences: rhythm + marker + divider
   ========================================================= */

.lp-b11-title{
  position:relative;
  padding-left:14px;
}

.lp-b11-title::before{
  content:"";
  position:absolute;
  left:0;
  top:4px;
  width:4px;
  height:18px;
  border-radius:2px;
  background:var(--text-2);
  opacity:.6;
}

.lp-b11-mid{
  color:var(--text-2);
  font-weight:700;
}

.lp-b11-pack--bottom{
  margin-top:auto;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.06);
}

html[data-theme="light"] .lp-b11-pack--bottom{
  border-top-color:rgba(15,23,42,.08);
}

/* =========================================================
   Block 8 — bars panel (scoped copy from block 9)
   ========================================================= */

.lp-b8-bars-panel{
  align-items:flex-start;
  justify-content:flex-start;
  overflow:hidden;
}

.lp-b8-bars-inner{
  width:100%;
  height:100%;
  min-width:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:0;
}

.lp-b8-bars-title{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:6px;
  text-align:left;
  font-weight:750;
  letter-spacing:-0.01em;
  line-height:1.08;
  font-size:24px;
  padding-bottom:10px;
}

.lp-b8-bars-title-line{
  min-width:0;
}

.lp-b8-bars{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:0;
}

.lp-b8-bars-row{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:12px;
}

.lp-b8-bars-label,
.lp-b8-bars-right{
  min-width:0;
}

.lp-b8-bars-label{
  display:flex;
  align-items:center;
  gap:10px;
}

.lp-b8-bars-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  flex:0 0 auto;
  background:rgba(255,255,255,.22);
}

.lp-b8-bars-text{
  font-size:12px;
  font-weight:650;
  line-height:1.2;
  letter-spacing:-0.01em;
  white-space:nowrap;
  overflow:visible;
  text-overflow:clip;
  max-width:100%;
  min-width:0;
  color:var(--text);
}

.lp-b8-bars-right{
  display:flex;
  align-items:center;
  gap:10px;
}

.lp-b8-bars-track{
  width:120px;
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}

html[data-theme="light"] .lp-b8-bars-track{
  background:rgba(15,23,42,.06);
  box-shadow:inset 0 0 0 1px rgba(15,23,42,.10);
}

.lp-b8-bars-fill{
  display:block;
  height:100%;
  border-radius:999px;
  background:var(--primary);
  width:var(--lp-fill, 0%);
}

.lp-b8-bars-pct{
  width:34px;
  text-align:right;
  color:var(--text-2);
  font-weight:700;
  font-size:13px;
}

.lp-b8-bars-row[data-tone="ifstop-unknown"] .lp-b8-bars-dot{ background: rgba(148,163,184,.75); }
.lp-b8-bars-row[data-tone="ifstop-critical"] .lp-b8-bars-dot{ background: rgba(239,68,68,.90); }
.lp-b8-bars-row[data-tone="ifstop-conflict"] .lp-b8-bars-dot{ background: rgba(244,63,94,.90); }
.lp-b8-bars-row[data-tone="ifstop-money"] .lp-b8-bars-dot{ background: rgba(251,146,60,.90); }
.lp-b8-bars-row[data-tone="ifstop-unpleasant"] .lp-b8-bars-dot{ background: rgba(245,158,11,.90); }
.lp-b8-bars-row[data-tone="ifstop-self"] .lp-b8-bars-dot{ background: rgba(34,197,94,.85); }

.lp-b8-bars-fill[data-fill="100"]{ width:100%; }
.lp-b8-bars-fill[data-fill="85"]{ width:85%; }
.lp-b8-bars-fill[data-fill="65"]{ width:65%; }
.lp-b8-bars-fill[data-fill="35"]{ width:35%; }

.lp-b8-bars-divider{
  width:100%;
  height:1px;
  background:rgba(255,255,255,.06);
  margin-top:auto;
}

html[data-theme="light"] .lp-b8-bars-divider{
  background:rgba(15,23,42,.08);
}

.lp-b8-bars-footer{
  color:var(--text-2);
  font-weight:650;
  font-size:15px;
  line-height:1.2;
  text-align:left;
}

@media (max-width:980px){
  .lp-b8-bars-title{
    font-size:18px;
    padding-bottom:8px;
  }

  .lp-b8-bars{
    gap:10px;
  }

  .lp-b8-bars-row{
    gap:10px;
  }

  .lp-b8-bars-text{
    font-size:12px;
  }

  .lp-b8-bars-track{
    width:108px;
  }

  .lp-b8-bars-pct{
    font-size:12px;
  }

  .lp-b8-bars-footer{
    font-size:13px;
  }
}

/* =========================================================
   Block 8 — weekly filter engine
   ========================================================= */
.lp-b8-weeks-panel{
  align-items:flex-start;
  justify-content:flex-start;
  overflow:hidden;
}

.lp-b8-weeks-inner{
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  overflow:visible;
  display:flex;
  padding:0;
}

.lp-b8-weeks-list{
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:18px;
  overflow:visible;
}

.lp-b8-week-item{
  width:100%;
  min-width:0;
  min-height:92px;
  border:0;
  background:transparent;
  color:inherit;
  text-align:left;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  gap:16px;
  align-items:start;
  cursor:pointer;
  position:relative;
}

.lp-b8-week-rail{
  position:relative;
  width:28px;
  min-height:92px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
}

.lp-b8-week-dot{
  width:12px;
  height:12px;
  border-radius:999px;
  border:2px solid rgba(255,255,255,.16);
  background:transparent;
  box-shadow:none;
  margin-top:4px;
  z-index:2;
}

.lp-b8-week-line{
  position:absolute;
  top:15px;
  bottom:0;
  left:50%;
  transform:translateX(-50%);
  width:2px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
}

.lp-b8-week-body{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:6px;
  padding-top:0;
}

.lp-b8-week-row1{
  color:var(--text-2);
  font-weight:800;
  font-size:12px;
  line-height:1.2;
  letter-spacing:-0.01em;
}

.lp-b8-week-row2{
  color:var(--text);
  font-weight:500;
  font-size:15px;
  line-height:1.25;
}

.lp-b8-week-row2 b{
  font-weight:800;
}

.lp-b8-week-item.is-active{
  min-height:110px;
  border-radius:18px;
  background:rgba(58,167,226,.14);
  position:relative;
  overflow:hidden;
}

.lp-b8-week-item.is-active::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:5px;
  border-radius:999px;
  background:var(--primary);
}

.lp-b8-week-item.is-active .lp-b8-week-rail{
  min-height:110px;
}

.lp-b8-week-item.is-active .lp-b8-week-dot{
  width:18px;
  height:18px;
  margin-top:0;
  border:0;
  background:var(--primary);
  box-shadow:0 0 0 6px rgba(58,167,226,.18);
}

.lp-b8-week-item.is-active .lp-b8-week-body{
  padding:22px 20px 18px 18px;
  gap:10px;
}

.lp-b8-week-item.is-active .lp-b8-week-row1{
  color:var(--text-2);
}

.lp-b8-week-item.is-active .lp-b8-week-row2{
  color:var(--text);
  font-weight:800;
}

html[data-theme="light"] .lp-b8-week-dot{
  border-color:rgba(15,23,42,.14);
  background:transparent;
}

html[data-theme="light"] .lp-b8-week-line{
  background:rgba(15,23,42,.10);
}

html[data-theme="light"] .lp-b8-week-item.is-active{
  background:rgba(58,167,226,.10);
}

@media (max-width:980px){
  .lp-b8-weeks-list{
    gap:10px;
  }

  .lp-b8-week-item{
    min-height:84px;
    grid-template-columns:24px minmax(0,1fr);
    gap:10px;
  }

  .lp-b8-week-rail{
    width:24px;
    min-height:84px;
  }

  .lp-b8-week-row1{
    font-size:11px;
  }

  .lp-b8-week-row2{
    font-size:14px;
  }

  .lp-b8-week-item.is-active{
    min-height:100px;
  }

  .lp-b8-week-item.is-active .lp-b8-week-rail{
    min-height:100px;
  }

  .lp-b8-week-item.is-active .lp-b8-week-body{
    padding:18px 16px 16px 16px;
    gap:8px;
  }
}


/* ===== Block 8 weeks — FINAL STABLE ACTIVE STATE ===== */
.lp-b8-week-item{
  min-height:92px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:transparent;
  box-shadow:none;
  grid-template-columns:28px minmax(0,1fr);
  gap:16px;
  align-items:start;
}

.lp-b8-week-rail{
  width:28px;
  min-height:92px;
}

.lp-b8-week-body{
  padding:0;
  padding-top:0;
  gap:6px;
}

.lp-b8-week-row1{
  font-weight:800;
}

.lp-b8-week-row2,
.lp-b8-week-row2 b{
  font-weight:500;
}

.lp-b8-week-dot{
  width:12px;
  height:12px;
  margin-top:4px;
  border:2px solid rgba(255,255,255,.16);
  background:transparent;
  box-shadow:none;
}

.lp-b8-week-item:hover{
  border-color:rgba(255,255,255,.14);
  background:rgba(255,255,255,.03);
}

.lp-b8-week-item.is-active,
.lp-b8-week-item--active{
  min-height:92px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(58,167,226,.10);
  box-shadow:none;
  position:relative;
  overflow:hidden;
}

.lp-b8-week-item.is-active::before,
.lp-b8-week-item--active::before{
  content:"";
  position:absolute;
  left:0;
  top:10px;
  bottom:10px;
  width:3px;
  border-radius:999px;
  background:var(--primary);
}

.lp-b8-week-item.is-active .lp-b8-week-rail,
.lp-b8-week-item--active .lp-b8-week-rail{
  width:28px;
  min-height:92px;
}

.lp-b8-week-item.is-active .lp-b8-week-body,
.lp-b8-week-item--active .lp-b8-week-body{
  padding:0;
  padding-top:0;
  gap:6px;
}

.lp-b8-week-item.is-active .lp-b8-week-row1,
.lp-b8-week-item.is-active .lp-b8-week-row2,
.lp-b8-week-item.is-active .lp-b8-week-row2 b,
.lp-b8-week-item--active .lp-b8-week-row1,
.lp-b8-week-item--active .lp-b8-week-row2,
.lp-b8-week-item--active .lp-b8-week-row2 b{
  font-weight:inherit;
}

.lp-b8-week-item.is-active .lp-b8-week-row1,
.lp-b8-week-item--active .lp-b8-week-row1{
  font-weight:800;
}

.lp-b8-week-item.is-active .lp-b8-week-row2,
.lp-b8-week-item.is-active .lp-b8-week-row2 b,
.lp-b8-week-item--active .lp-b8-week-row2,
.lp-b8-week-item--active .lp-b8-week-row2 b{
  font-weight:500;
}

.lp-b8-week-item.is-active .lp-b8-week-dot,
.lp-b8-week-item--active .lp-b8-week-dot{
  width:12px;
  height:12px;
  margin-top:4px;
  border:0;
  background:var(--primary);
  box-shadow:none;
}

.lp-b8-week-item.is-active .lp-b8-week-line,
.lp-b8-week-item--active .lp-b8-week-line{
  display:none;
}

html[data-theme="light"] .lp-b8-week-item{
  border-color:rgba(15,23,42,.10);
}
html[data-theme="light"] .lp-b8-week-item:hover{
  border-color:rgba(15,23,42,.14);
  background:rgba(15,23,42,.03);
}
html[data-theme="light"] .lp-b8-week-dot{
  border-color:rgba(15,23,42,.14);
}
html[data-theme="light"] .lp-b8-week-item.is-active,
html[data-theme="light"] .lp-b8-week-item--active{
  border-color:rgba(15,23,42,.12);
  background:rgba(58,167,226,.10);
}

@media (max-width:980px){
  .lp-b8-week-item,
  .lp-b8-week-item.is-active,
  .lp-b8-week-item--active{
    min-height:84px;
    grid-template-columns:24px minmax(0,1fr);
    gap:10px;
    padding:12px 14px;
  }

  .lp-b8-week-rail,
  .lp-b8-week-item.is-active .lp-b8-week-rail,
  .lp-b8-week-item--active .lp-b8-week-rail{
    width:24px;
    min-height:84px;
  }

  .lp-b8-week-body,
  .lp-b8-week-item.is-active .lp-b8-week-body,
  .lp-b8-week-item--active .lp-b8-week-body{
    padding:0;
    gap:6px;
  }
}



/* ===== Block 8 patterns ===== */
.lp-b8-patterns-panel{
  align-items:flex-start;
  justify-content:flex-start;
  overflow:hidden;
}

.lp-b8-patterns-inner{
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:18px;
  overflow:hidden;
}

.lp-b8-patterns-content{
  flex:1 1 auto;
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:18px;
}

.lp-b8-week-switch-area{
  flex:0 0 auto;
  width:100%;
  margin-top:auto;
}

.lp-b8-patterns-section{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.lp-b8-patterns-title{
  color:var(--text-2);
  font-weight:800;
  font-size:15px;
  line-height:1.2;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.lp-b8-patterns-list{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:0;
}

.lp-b8-patterns-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  min-width:0;
}

.lp-b8-patterns-label{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.lp-b8-patterns-dot{
  width:10px;
  height:10px;
  flex:0 0 auto;
  border-radius:3px;
  transform:rotate(45deg);
  background:rgba(255,255,255,.22);
}

.lp-b8-patterns-row[data-tone="owner"] .lp-b8-patterns-dot{
  background:#F07A24;
}

.lp-b8-patterns-row[data-tone="team"] .lp-b8-patterns-dot{
  background:#8B5CF6;
}

.lp-b8-patterns-text{
  min-width:0;
  max-width:100%;
  color:var(--text);
  font-size:12px;
  font-weight:650;
  line-height:1.2;
  letter-spacing:-0.01em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.lp-b8-patterns-right{
  display:flex;
  align-items:center;
  gap:10px;
}

.lp-b8-patterns-track{
  width:120px;
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}

.lp-b8-patterns-fill{
  display:block;
  height:100%;
  border-radius:999px;
  background:var(--primary);
  width:0;
}

.lp-b8-patterns-pct{
  width:34px;
  text-align:right;
  color:var(--text-2);
  font-weight:700;
  font-size:13px;
}

.lp-b8-patterns-divider{
  width:100%;
  height:1px;
  background:rgba(255,255,255,.06);
}

html[data-theme="light"] .lp-b8-patterns-track{
  background:rgba(15,23,42,.06);
  box-shadow:inset 0 0 0 1px rgba(15,23,42,.10);
}

html[data-theme="light"] .lp-b8-patterns-divider{
  background:rgba(15,23,42,.08);
}

@media (max-width:980px){
  .lp-b8-patterns-inner{
    gap:16px;
  }

  .lp-b8-patterns-content{
    gap:16px;
  }

  .lp-b8-patterns-title{
    font-size:13px;
  }

  .lp-b8-patterns-row{
    gap:10px;
  }

  .lp-b8-patterns-track{
    width:108px;
  }

  .lp-b8-patterns-pct{
    font-size:12px;
  }
}


/* =========================================================
   Block 8 — local week switchers (bars + patterns only)
   ========================================================= */

.lp-b8-week-switch{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin-top:12px;
  min-height:32px;
}

.lp-b8-week-switch-label{
  min-width:0;
  color:var(--text-2);
  font-weight:700;
  font-size:13px;
  line-height:1.2;
  letter-spacing:-0.01em;
  text-align:center;
}

.lp-b8-week-nav{
  width:28px;
  height:28px;
  flex:0 0 28px;
  border:0;
  border-radius:8px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  background:transparent;
  color:var(--text-2);
  font-size:16px;
  line-height:1;
  cursor:pointer;
  transition:background-color .18s ease, color .18s ease, opacity .18s ease, transform .18s ease;
}

.lp-b8-week-nav:hover:not(:disabled){
  background:rgba(255,255,255,.06);
  color:var(--text);
}

.lp-b8-week-nav:active:not(:disabled){
  transform:translateY(1px);
}

.lp-b8-week-nav:disabled{
  opacity:.4;
  cursor:default;
}

html[data-theme="light"] .lp-b8-week-nav:hover:not(:disabled){
  background:rgba(15,23,42,.06);
}

@media (max-width:980px){
  .lp-b8-week-switch{
    gap:12px;
    margin-top:10px;
  }

  .lp-b8-week-switch-label{
    font-size:12px;
  }

  .lp-b8-week-nav{
    width:26px;
    height:26px;
    flex-basis:26px;
    font-size:15px;
  }
}


/* =========================================================
   Block 8 — gaps panel
   Added on top of 09_03_05 baseline:
   keep old bars/patterns logic intact, add only gaps panel
   and gaps bottom switcher with the same old switcher logic
   ========================================================= */

.lp-b8-gaps-panel{
  align-items:flex-start;
  justify-content:flex-start;
  overflow:hidden;
}

.lp-b8-gaps-inner{
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:18px;
  overflow:hidden;
}

.lp-b8-gaps-content{
  flex:1 1 auto;
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:16px;
}

.lp-b8-gaps-week-switch-area{
  flex:0 0 auto;
  width:100%;
  margin-top:auto;
}

.lp-b8-week-switch--gaps{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin-top:12px;
  min-height:32px;
}

.lp-b8-gaps-title{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
  text-align:center;
  padding-top:2px;
}

.lp-b8-gaps-title-line{
  color:var(--text);
  font-size:17px;
  line-height:1.08;
  font-weight:800;
  letter-spacing:-0.02em;
}

.lp-b8-gaps-list{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:0;
}

.lp-b8-gaps-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  min-width:0;
}

.lp-b8-gaps-label,
.lp-b8-gaps-right{
  min-width:0;
}

.lp-b8-gaps-label{
  display:flex;
  align-items:center;
  gap:10px;
}

.lp-b8-gaps-mark{
  width:10px;
  height:10px;
  flex:0 0 auto;
  clip-path:polygon(0 0, 100% 50%, 0 100%);
  background:rgba(255,255,255,.22);
}

.lp-b8-gaps-row[data-tone="norma"] .lp-b8-gaps-mark,
.lp-b8-gaps-weakest-value[data-tone="norma"] .lp-b8-gaps-mark{ background:#22c55e; }
.lp-b8-gaps-row[data-tone="standart"] .lp-b8-gaps-mark,
.lp-b8-gaps-weakest-value[data-tone="standart"] .lp-b8-gaps-mark{ background:#3b82f6; }
.lp-b8-gaps-row[data-tone="role"] .lp-b8-gaps-mark,
.lp-b8-gaps-weakest-value[data-tone="role"] .lp-b8-gaps-mark{ background:#a855f7; }
.lp-b8-gaps-row[data-tone="boundary"] .lp-b8-gaps-mark,
.lp-b8-gaps-weakest-value[data-tone="boundary"] .lp-b8-gaps-mark{ background:#f97316; }
.lp-b8-gaps-row[data-tone="communication"] .lp-b8-gaps-mark,
.lp-b8-gaps-weakest-value[data-tone="communication"] .lp-b8-gaps-mark{ background:#06b6d4; }
.lp-b8-gaps-row[data-tone="rhythm"] .lp-b8-gaps-mark,
.lp-b8-gaps-weakest-value[data-tone="rhythm"] .lp-b8-gaps-mark{ background:#eab308; }
.lp-b8-gaps-row[data-tone="strategy"] .lp-b8-gaps-mark,
.lp-b8-gaps-weakest-value[data-tone="strategy"] .lp-b8-gaps-mark{ background:#ef4444; }

.lp-b8-gaps-text{
  min-width:0;
  color:var(--text);
  font-size:12px;
  font-weight:650;
  line-height:1.2;
  letter-spacing:-0.01em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.lp-b8-gaps-right{
  display:flex;
  align-items:center;
  gap:10px;
}

.lp-b8-gaps-track{
  width:120px;
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}

.lp-b8-gaps-fill{
  display:block;
  height:100%;
  border-radius:999px;
  background:var(--primary);
  width:0;
}

.lp-b8-gaps-pct{
  width:34px;
  text-align:right;
  color:var(--text-2);
  font-weight:700;
  font-size:13px;
}

.lp-b8-gaps-weakest{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.lp-b8-gaps-weakest-label{
  color:var(--text-2);
  font-size:12px;
  font-weight:700;
}

.lp-b8-gaps-weakest-value{
  display:flex;
  align-items:center;
  gap:10px;
}

.lp-b8-gaps-weakest-text{
  color:var(--text);
  font-size:12px;
  font-weight:800;
}

.lp-b8-gaps-weakest-pct{
  margin-left:auto;
  color:var(--text-2);
  font-size:13px;
  font-weight:700;
}

.lp-b8-gaps-divider{
  width:100%;
  height:1px;
  background:rgba(255,255,255,.06);
}

html[data-theme="light"] .lp-b8-gaps-track{
  background:rgba(15,23,42,.06);
  box-shadow:inset 0 0 0 1px rgba(15,23,42,.10);
}

html[data-theme="light"] .lp-b8-gaps-divider{
  background:rgba(15,23,42,.08);
}

@media (max-width:980px){
  .lp-b8-week-switch--gaps{
    gap:12px;
    margin-top:10px;
  }

  .lp-b8-gaps-inner{
    gap:16px;
  }

  .lp-b8-gaps-content{
    gap:14px;
  }

  .lp-b8-gaps-title-line{
    font-size:15px;
  }

  .lp-b8-gaps-row{
    gap:10px;
  }

  .lp-b8-gaps-text{
    font-size:13px;
  }

  .lp-b8-gaps-track{
    width:108px;
  }

  .lp-b8-gaps-pct{
    width:36px;
    font-size:12px;
  }
}


/* Block 12 — insight graph / step 1 */
.lp-b12-panel{
  min-height: 440px;
}

.lp-b12-panel--insight{
  padding: 0;
  align-items: stretch;
  justify-content: stretch;
  overflow: hidden;
}

.lp-b12-insight{
  position: relative;
  width: 100%;
  min-height: 440px;
  padding: 28px;
  border-radius: inherit;
  background:
    radial-gradient(1200px 520px at 82% 16%, rgba(255,255,255,.05) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(180deg, rgba(255,255,255,.018) 0%, rgba(255,255,255,.008) 100%);
}

.lp-b12-copy-main,
.lp-b12-copy-side{
  position: absolute;
  z-index: 2;
  display: grid;
  gap: 2px;
  pointer-events: none;
}

.lp-b12-copy-main{
  top: 28px;
  left: 28px;
  max-width: 320px;
  font-weight: 800;
  font-size: 32px;
  line-height: 1.02;
  letter-spacing: -0.03em;
  color: var(--text);
}

.lp-b12-copy-side{
  right: 28px;
  bottom: 28px;
  max-width: 272px;
  text-align: right;
  font-weight: 780;
  font-size: 28px;
  line-height: 1.04;
  letter-spacing: -0.028em;
  color: var(--text-2);
}

.lp-b12-graph-wrap{
  position: absolute;
  inset: 0;
  z-index: 1;
}

.lp-b12-graph{
  display: block;
  width: 100%;
  height: 100%;
}

.lp-b12-axis{
  stroke: rgba(255,255,255,.12);
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}

.lp-b12-line{
  fill: none;
  stroke: rgba(234,240,247,.86);
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 0 14px rgba(255,255,255,.05));
}

.lp-b12-panel--side{
  align-items: center;
  justify-content: center;
}

.lp-b12-side-placeholder{
  color: var(--text-2);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .2px;
  user-select: none;
}

html[data-theme="light"] .lp-b12-insight{
  background:
    radial-gradient(1200px 520px at 82% 16%, rgba(15,23,42,.04) 0%, rgba(15,23,42,0) 60%),
    linear-gradient(180deg, rgba(15,23,42,.014) 0%, rgba(15,23,42,.006) 100%);
}

html[data-theme="light"] .lp-b12-axis{
  stroke: rgba(15,23,42,.12);
}

html[data-theme="light"] .lp-b12-line{
  stroke: rgba(15,23,42,.72);
  filter: drop-shadow(0 0 10px rgba(15,23,42,.03));
}



.lp-b12-fill{
  fill: rgba(88, 162, 228, .14);
  opacity: 1;
  transition: opacity .2s ease;
}

.lp-b12-fill-clip-rect{
  transition: width .14s linear;
}

.lp-b12-dot{
  fill: rgba(234,240,247,.96);
  stroke: rgba(15,23,42,.22);
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  transform: scale(.72);
  transition: opacity .18s ease, transform .18s ease;
  filter: drop-shadow(0 0 10px rgba(255,255,255,.10));
}

.lp-b12-dot.is-visible{
  opacity: 1;
  transform: scale(1);
}

.lp-b12-dot--final{
  fill: rgba(255,255,255,.98);
  stroke: rgba(88, 162, 228, .44);
  stroke-width: 2;
  filter: drop-shadow(0 0 16px rgba(88,162,228,.20));
}

html[data-theme="light"] .lp-b12-fill{
  fill: rgba(59, 130, 246, .12);
}

html[data-theme="light"] .lp-b12-dot{
  fill: rgba(15,23,42,.88);
  stroke: rgba(255,255,255,.82);
  filter: drop-shadow(0 0 8px rgba(15,23,42,.08));
}

html[data-theme="light"] .lp-b12-dot--final{
  fill: rgba(15,23,42,.96);
  stroke: rgba(59,130,246,.28);
}
@media (max-width: 1180px){
  .lp-b12-copy-main{ font-size: 36px; max-width: 290px; }
  .lp-b12-copy-side{ font-size: 24px; max-width: 238px; }
}

@media (max-width: 980px){
  .lp-b12-grid{
    grid-template-columns: 1fr;
  }

  .lp-b12-grid > .lp-span-8,
  .lp-b12-grid > .lp-span-4{
    grid-column: 1 / -1;
  }

  .lp-b12-panel,
  .lp-b12-insight{
    min-height: 420px;
  }

  .lp-b12-copy-main{
    top: 24px;
    left: 24px;
    max-width: 270px;
    font-size: 32px;
  }

  .lp-b12-copy-side{
    right: 24px;
    bottom: 24px;
    max-width: 220px;
    font-size: 22px;
  }
}

@media (max-width: 720px){
  .lp-b12-panel,
  .lp-b12-insight{
    min-height: 360px;
  }

  .lp-b12-insight{
    padding: 20px;
  }

  .lp-b12-copy-main{
    top: 20px;
    left: 20px;
    max-width: 220px;
    font-size: 26px;
  }

  .lp-b12-copy-side{
    right: 20px;
    bottom: 20px;
    max-width: 184px;
    font-size: 18px;
  }
}


/* =========================================================
   Block 12 — graph labels
   ========================================================= */
.lp-b12-label{
  opacity:0;
  pointer-events:none;
  transition: opacity .22s ease;
}

.lp-b12-label.is-visible{
  opacity:1;
}

.lp-b12-label-line{
  fill:none;
  stroke: var(--text-2);
  stroke-width:1;
  opacity:.42;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.lp-b12-label-text{
  fill: var(--text-2);
  font-size:13px;
  font-weight:650;
  letter-spacing:-0.01em;
}

.lp-b12-final-num{
  fill: var(--text);
  font-size:26px;
  font-weight:850;
  letter-spacing:-0.02em;
}

.lp-b12-final-sub{
  fill: var(--text);
  font-size:15px;
  font-weight:700;
  letter-spacing:-0.01em;
}

@media (max-width: 980px){
  .lp-b12-label-text{ font-size:12px; }
  .lp-b12-final-num{ font-size:22px; }
  .lp-b12-final-sub{ font-size:13px; }
}


/* =========================================================
   Block 12 — right bars panel
   ========================================================= */
.lp-b12-panel--side{
  align-items:flex-start;
  justify-content:flex-start;
  overflow:hidden;
}

.lp-b12-side-panel{
  width:100%;
  height:100%;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:14px;
  overflow:hidden;
}

.lp-b12-panel--side .lp-q2-title{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:6px;
  text-align:left;
  font-weight:750;
  letter-spacing:-0.01em;
  line-height:1.08;
  font-size:24px;
  padding-bottom:10px;
}

.lp-b12-panel--side .lp-q2-title-line{ min-width:0; }
.lp-b12-panel--side .lp-q2-title-line3{ white-space:nowrap; }

.lp-b12-panel--side .lp-bars{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:0;
}

.lp-b12-panel--side .lp-bars-row{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:12px;
}

.lp-b12-panel--side .lp-bars-label,
.lp-b12-panel--side .lp-bars-right{
  min-width:0;
}

.lp-b12-panel--side .lp-bars-label{
  display:flex;
  align-items:center;
  gap:10px;
}

.lp-b12-panel--side .lp-bars-right{
  display:flex;
  align-items:center;
  gap:10px;
}

.lp-b12-panel--side .lp-bars-track{
  width:120px;
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}

html[data-theme="light"] .lp-b12-panel--side .lp-bars-track{
  background:rgba(15,23,42,.06);
  box-shadow:inset 0 0 0 1px rgba(15,23,42,.10);
}

.lp-b12-panel--side .lp-bars-fill{
  display:block;
  height:100%;
  border-radius:999px;
  background:var(--primary);
  width:var(--lp-fill, 0%);
  transition: width .18s ease;
}

.lp-b12-panel--side .lp-bars-divider,
.lp-b12-panel--side .lp-q2-divider{
  width:100%;
  height:1px;
  background:rgba(255,255,255,.06);
  margin-top:auto;
}

html[data-theme="light"] .lp-b12-panel--side .lp-q2-divider{
  background:rgba(15,23,42,.08);
}

.lp-b12-panel--side .lp-q2-footer{
  color:var(--text-2);
  font-weight:650;
  font-size:15px;
  line-height:1.2;
  text-align:left;
}

@media (max-width:980px){
  .lp-b12-panel--side .lp-q2-title{
    font-size:18px;
    padding-bottom:8px;
  }
  .lp-b12-panel--side .lp-bars{
    gap:10px;
  }
  .lp-b12-panel--side .lp-bars-row{
    gap:10px;
  }
  .lp-b12-panel--side .lp-bars-track{
    width:108px;
  }
  .lp-b12-panel--side .lp-q2-footer{
    font-size:13px;
  }
}

/* =========================================================
   Block 13 — how Radar works (static step 1)
   ========================================================= */
.lp-b13-panel{
  padding:0;
  overflow:hidden;
  align-items:stretch;
  justify-content:stretch;
  min-height: 520px;
}

.lp-b13-flow{
  position:relative;
  width:100%;
  height:100%;
  min-height:520px;
  border-radius:inherit;
  background:
    radial-gradient(900px 420px at 50% 50%, rgba(88,162,228,.05) 0%, rgba(88,162,228,0) 62%),
    radial-gradient(680px 300px at 14% 18%, rgba(255,255,255,.04) 0%, rgba(255,255,255,0) 60%),
    radial-gradient(680px 300px at 86% 18%, rgba(255,255,255,.03) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(180deg, rgba(255,255,255,.014) 0%, rgba(255,255,255,.008) 100%);
}

.lp-b13-svg{
  display:block;
  width:100%;
  height:100%;
}

.lp-b13-line{
  fill:none;
  stroke: rgba(88,162,228,.28);
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 0 10px rgba(88,162,228,.06));
}

.lp-b13-line--secondary{
  stroke: rgba(88,162,228,.18);
}

.lp-b13-line--future{
  stroke: rgba(255,255,255,.12);
  stroke-dasharray: 6 8;
}

.lp-b13-pill{
  fill: rgba(255,255,255,.03);
  stroke: rgba(255,255,255,.10);
  stroke-width:1.2;
  vector-effect: non-scaling-stroke;
}

.lp-b13-pill--input{
  fill: rgba(88,162,228,.06);
  stroke: rgba(88,162,228,.20);
}

.lp-b13-pill--output{
  fill: rgba(255,255,255,.028);
  stroke: rgba(255,255,255,.10);
}

.lp-b13-pill--report{
  fill: rgba(88,162,228,.045);
  stroke: rgba(88,162,228,.16);
}

.lp-b13-pill--future{
  fill: rgba(255,255,255,.018);
  stroke: rgba(255,255,255,.08);
}

.lp-b13-pill-text{
  fill: var(--text);
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -0.01em;
}

.lp-b13-pill-text--muted{
  fill: var(--text-2);
}

.lp-b13-ai-card{
  fill: rgba(88,162,228,.10);
  stroke: rgba(88,162,228,.26);
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 0 26px rgba(88,162,228,.08));
}

.lp-b13-ai-title{
  fill: var(--text);
  font-size: 28px;
  font-weight: 850;
  letter-spacing: -0.02em;
}

.lp-b13-ai-sub{
  fill: var(--text-2);
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -0.01em;
}

.lp-b13-section-title{
  fill: var(--text-2);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}

html[data-theme="light"] .lp-b13-flow{
  background:
    radial-gradient(900px 420px at 50% 50%, rgba(58,167,226,.05) 0%, rgba(58,167,226,0) 62%),
    radial-gradient(680px 300px at 14% 18%, rgba(15,23,42,.04) 0%, rgba(15,23,42,0) 60%),
    radial-gradient(680px 300px at 86% 18%, rgba(15,23,42,.03) 0%, rgba(15,23,42,0) 60%),
    linear-gradient(180deg, rgba(15,23,42,.012) 0%, rgba(15,23,42,.006) 100%);
}

html[data-theme="light"] .lp-b13-line{
  stroke: rgba(58,167,226,.32);
  filter: drop-shadow(0 0 8px rgba(58,167,226,.06));
}

html[data-theme="light"] .lp-b13-line--secondary{
  stroke: rgba(58,167,226,.22);
}

html[data-theme="light"] .lp-b13-line--future{
  stroke: rgba(15,23,42,.14);
}

html[data-theme="light"] .lp-b13-pill{
  fill: rgba(15,23,42,.022);
  stroke: rgba(15,23,42,.10);
}

html[data-theme="light"] .lp-b13-pill--input{
  fill: rgba(58,167,226,.08);
  stroke: rgba(58,167,226,.18);
}

html[data-theme="light"] .lp-b13-pill--report{
  fill: rgba(58,167,226,.05);
  stroke: rgba(58,167,226,.14);
}

html[data-theme="light"] .lp-b13-ai-card{
  fill: rgba(58,167,226,.10);
  stroke: rgba(58,167,226,.22);
  filter: drop-shadow(0 0 20px rgba(58,167,226,.06));
}

@media (max-width: 1180px){
  .lp-b13-panel,
  .lp-b13-flow{
    min-height: 480px;
  }

  .lp-b13-pill-text{
    font-size: 14px;
  }

  .lp-b13-ai-title{
    font-size: 26px;
  }
}

@media (max-width: 980px){
  .lp-b13-panel,
  .lp-b13-flow{
    min-height: 420px;
  }

  .lp-b13-pill-text{
    font-size: 13px;
  }

  .lp-b13-ai-title{
    font-size: 24px;
  }

  .lp-b13-ai-sub{
    font-size: 14px;
  }

  .lp-b13-section-title{
    font-size: 12px;
  }
}
/* RADAR FLOW BLOCK */

.lp-radar-flow text {
  font-family: inherit;
  fill: rgba(255,255,255,0.92);
  font-size: 14px;
}

/* staged reveal base */
.lp-flow-group {
  opacity: 0;
  transition:
    opacity 0.56s ease,
    transform 0.56s ease;
  will-change: opacity, transform;
}

.lp-flow-group--left {
  transform: translateX(-20px);
}

.lp-flow-group--center {
  transform: scale(0.96);
  transform-origin: 610px 260px;
}

.lp-flow-group--right {
  transform: translateX(20px);
}

/* staged reveal states */
.lp-radar-flow.is-revealed-step-1 .lp-flow-group--left {
  opacity: 1;
  transform: translateX(0);
}

.lp-radar-flow.is-revealed-step-2 .lp-flow-group--center {
  opacity: 1;
  transform: scale(1);
}

.lp-radar-flow.is-revealed-step-3 .lp-flow-group--right {
  opacity: 1;
  transform: translateX(0);
}

.lp-flow-title {
  font-size: 11px;
  letter-spacing: 0.14em;
  opacity: 0.6;
}

.lp-flow-pill rect {
  fill: rgba(255,255,255,0.04);
  stroke: rgba(120,170,255,0.25);
  stroke-width: 1;
  transition:
    fill 0.28s ease,
    stroke 0.28s ease,
    filter 0.28s ease,
    opacity 0.28s ease;
}

.lp-flow-pill text {
  font-size: 14px;
  transition: fill 0.28s ease, opacity 0.28s ease;
}

.lp-flow-pill--future rect {
  stroke-dasharray: 6 6;
  opacity: 0.6;
}

.lp-flow-helper rect {
  fill: rgba(255,255,255,0.022);
  stroke: rgba(255,255,255,0.06);
}

.lp-flow-helper text {
  font-size: 11.5px;
  opacity: 0.66;
}

.lp-flow-ai rect {
  fill: rgba(60,110,220,0.20);
  stroke: rgba(120,170,255,0.38);
  stroke-width: 1.2;
  filter: drop-shadow(0 12px 44px rgba(80,140,255,0.18));
}

.lp-flow-ai-title {
  font-size: 33px;
  font-weight: 600;
}

.lp-flow-ai-sub {
  font-size: 15px;
  opacity: 0.78;
}

.lp-flow-line-left {
  fill: none;
  stroke: rgba(120,170,255,0.34);
  stroke-width: 1.2;
}

.lp-flow-line-right-main {
  fill: none;
  stroke: rgba(120,170,255,0.58);
  stroke-width: 1.2;
}

.lp-flow-line-right-secondary {
  fill: none;
  stroke: rgba(120,170,255,0.34);
  stroke-width: 1.1;
}

.lp-flow-line-future {
  stroke-dasharray: 6 6;
  opacity: 0.52;
}

/* Flow dots */
.lp-flow-dot {
  opacity: 0;
  pointer-events: none;
  fill: rgba(255,255,255,0.98);
  stroke: rgba(120,170,255,0.55);
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 0 10px rgba(120,170,255,0.32));
}

.lp-flow-dot.is-active {
  opacity: 1;
}

.lp-flow-dot--out {
  fill: rgba(255,255,255,1);
  stroke: rgba(120,170,255,0.7);
  filter: drop-shadow(0 0 12px rgba(120,170,255,0.42));
}

/* Radar AI pulse */
.lp-radar-flow.is-flow-active .lp-flow-ai rect {
  animation: lpFlowAiPulse 0.9s ease-in-out infinite;
}

@keyframes lpFlowAiPulse {
  0% {
    filter: drop-shadow(0 12px 44px rgba(80,140,255,0.14));
  }
  50% {
    filter: drop-shadow(0 14px 52px rgba(80,140,255,0.24));
  }
  100% {
    filter: drop-shadow(0 12px 44px rgba(80,140,255,0.14));
  }
}

/* Active right pill */
.lp-flow-pill.is-flow-target rect {
  fill: rgba(120,170,255,0.12);
  stroke: rgba(120,170,255,0.52);
  filter: drop-shadow(0 0 14px rgba(120,170,255,0.12));
}

.lp-flow-pill.is-flow-target text {
  opacity: 1;
}

/* LIGHT THEME FIXES */
html[data-theme="light"] .lp-radar-flow text {
  fill: rgba(31,41,55,0.92);
}

html[data-theme="light"] .lp-flow-title {
  fill: rgba(55,65,81,0.72);
  opacity: 1;
}

html[data-theme="light"] .lp-flow-pill rect {
  fill: rgba(255,255,255,0.42);
  stroke: rgba(96,165,250,0.42);
}

html[data-theme="light"] .lp-flow-pill text {
  fill: rgba(31,41,55,0.92);
}

html[data-theme="light"] .lp-flow-pill--future rect {
  fill: rgba(239,246,255,0.55);
  stroke: rgba(96,165,250,0.34);
  opacity: 1;
}

html[data-theme="light"] .lp-flow-helper rect {
  fill: rgba(255,255,255,0.52);
  stroke: rgba(148,163,184,0.24);
}

html[data-theme="light"] .lp-flow-helper text {
  fill: rgba(55,65,81,0.78);
  opacity: 1;
}

html[data-theme="light"] .lp-flow-ai rect {
  fill: rgba(191,219,254,0.72);
  stroke: rgba(96,165,250,0.52);
  filter: drop-shadow(0 10px 28px rgba(59,130,246,0.14));
}

html[data-theme="light"] .lp-flow-ai-title {
  fill: rgba(30,41,59,0.96);
}

html[data-theme="light"] .lp-flow-ai-sub {
  fill: rgba(71,85,105,0.88);
  opacity: 1;
}

html[data-theme="light"] .lp-flow-line-left {
  stroke: rgba(96,165,250,0.42);
}

html[data-theme="light"] .lp-flow-line-right-main {
  stroke: rgba(59,130,246,0.56);
}

html[data-theme="light"] .lp-flow-line-right-secondary {
  stroke: rgba(96,165,250,0.40);
}

html[data-theme="light"] .lp-flow-line-future {
  opacity: 0.7;
}

html[data-theme="light"] .lp-flow-dot {
  fill: rgba(255,255,255,0.98);
  stroke: rgba(59,130,246,0.55);
  filter: drop-shadow(0 0 10px rgba(59,130,246,0.22));
}

html[data-theme="light"] .lp-flow-dot--out {
  stroke: rgba(59,130,246,0.68);
  filter: drop-shadow(0 0 12px rgba(59,130,246,0.28));
}

html[data-theme="light"] .lp-flow-pill.is-flow-target rect {
  fill: rgba(191,219,254,0.58);
  stroke: rgba(59,130,246,0.58);
  filter: drop-shadow(0 0 10px rgba(59,130,246,0.10));
}
/* ===============================
   Radar Flow Tooltip
================================ */

.lp-tooltip {
position: fixed;
z-index: 9999;

max-width: 320px;
padding: 14px 16px;

background: rgba(20,20,24,0.95);
backdrop-filter: blur(8px);

border-radius: 10px;

font-size: 13px;
line-height: 1.45;

color: #fff;

pointer-events: none;

opacity: 0;
transform: translateY(6px);

transition:
opacity .18s ease,
transform .18s ease;
}

.lp-tooltip.is-visible{
opacity:1;
transform:translateY(0);
}


/* light theme */

html[data-theme="light"] .lp-tooltip{

background:#111;

color:#fff;

}


/* текст */

.lp-tooltip p{
margin:0 0 8px 0;
}

.lp-tooltip p:last-child{
margin-bottom:0;
}
/* intro scene reveal */
.is-intro-reveal{
  opacity: 0;
  transform: translateY(24px);
  will-change: opacity, transform;
}