@charset "UTF-8";
/* === «Ты в порядке» — памятка клиента === */

  :root {
    --bg: #0E2228;
    --bg-lift: #152D33;
    --bg-soft: #1A353B;
    --ink: #F8F5EF;
    --muted: #9BAEAD;
    --dim: #6B8582;
    --line: rgba(77,124,125,0.14);
    --glow: #5A9E9F;
    --glow-soft: rgba(90,158,159,0.12);
    --glow-dim: #4A8586;
    --rose: #C97B73;
    --warm: #C58B32;
    --photo: #0D1E23;
  }
  .tvp, .tvp *, .tvp *::before, .tvp *::after { margin:0; padding:0; box-sizing:border-box; }
  html { scroll-behavior:smooth; }
  body, .tvp {
    font-family:'Onest',system-ui,sans-serif;
    color:var(--ink);
    background:var(--bg);
    line-height:1.7;
    -webkit-font-smoothing:antialiased;
    font-size:16px;
    overflow-x:hidden;
  }
  body::before {
    content:"";
    position:fixed; inset:0;
    background:
      radial-gradient(ellipse 80% 60% at 20% 30%, rgba(90,158,159,0.05) 0%, transparent 60%),
      radial-gradient(ellipse 60% 80% at 85% 70%, rgba(201,123,115,0.03) 0%, transparent 50%);
    pointer-events:none; z-index:0;
  }
  body::after {
    content:"";
    position:fixed; inset:0;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
    pointer-events:none; z-index:9999;
  }

  .page { max-width:920px; margin:0 auto; padding:0 5%; position:relative; z-index:1; }

  /* Header */
  .header {
    display:flex; flex-wrap:wrap; gap:12px;
    justify-content:space-between; align-items:center;
    padding:24px 5%;
    position:sticky; top:0;
    background:rgba(14,34,40,0.92);
    backdrop-filter:blur(12px);
    z-index:50;
    border-bottom:1px solid var(--line);
  }
  .header-logo {
    font-family:'Lora',serif;
    font-size:18px;
    color:var(--ink);
    text-decoration:none;
  }
  .header-back {
    font-size:13px;
    color:var(--glow);
    text-decoration:none;
    padding-bottom:2px;
    border-bottom:1px solid rgba(90,158,159,0.3);
    transition:border-color 0.3s;
  }
  .header-back:hover { border-color:var(--glow); }

  /* Chips nav */
  .chips {
    display:flex;
    gap:8px;
    overflow-x:auto;
    scrollbar-width:none;
    -ms-overflow-style:none;
    padding:2px;
  }
  .chips::-webkit-scrollbar { display:none; }
  .chip {
    flex:0 0 auto;
    border:1px solid var(--line);
    background:rgba(255,255,255,0.02);
    color:var(--muted);
    border-radius:999px;
    padding:8px 16px;
    font-size:12.5px;
    font-weight:500;
    cursor:pointer;
    white-space:nowrap;
    transition:all 0.25s;
    text-decoration:none;
    display:inline-block;
  }
  .chip:hover { border-color:var(--glow); color:var(--ink); }
  .chip.active {
    background:var(--glow);
    border-color:var(--glow);
    color:var(--bg);
    font-weight:600;
  }

  /* Typography */
  .headline {
    font-family:'Lora',Georgia,serif;
    font-size:clamp(28px, 4.5vw, 44px);
    font-weight:400;
    line-height:1.1;
    letter-spacing:-0.015em;
  }
  .title {
    font-family:'Lora',Georgia,serif;
    font-size:clamp(22px, 3vw, 30px);
    font-weight:400;
    line-height:1.15;
  }
  .eyebrow {
    font-size:11px;
    font-weight:600;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--warm);
    margin-bottom:10px;
  }
  .body-text {
    font-size:16px;
    line-height:1.75;
    color:var(--muted);
  }

  /* Hero */
  .hero {
    text-align:center;
    padding:60px 0 50px;
    position:relative;
  }
  .hero h1 {
    font-family:'Lora',Georgia,serif;
    font-size:clamp(32px, 5vw, 48px);
    font-weight:400;
    line-height:1.1;
    margin:16px auto;
    max-width:16ch;
  }
  .hero p {
    font-size:17px;
    color:var(--muted);
    max-width:46ch;
    margin:0 auto 28px;
    line-height:1.65;
  }
  .hero-cta {
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:var(--glow);
    color:var(--bg);
    border:0;
    border-radius:16px;
    padding:14px 28px;
    font-size:15px;
    font-weight:600;
    cursor:pointer;
    text-decoration:none;
    box-shadow:0 8px 24px rgba(90,158,159,0.22);
    transition:all 0.3s;
  }
  .hero-cta:hover {
    transform:translateY(-2px);
    box-shadow:0 12px 32px rgba(90,158,159,0.3);
  }

  /* Sections */
  section { scroll-margin-top:80px; padding:50px 0; }
  .shead { margin-bottom:28px; }
  .shead p { margin:8px 0 0; color:var(--muted); font-size:16px; max-width:58ch; line-height:1.65; }

  /* Cards */
  .card {
    background:rgba(255,255,255,0.02);
    border:1px solid var(--line);
    border-radius:20px;
    padding:28px;
    margin-bottom:16px;
    transition:all 0.35s;
  }
  .card:hover {
    border-color:rgba(90,158,159,0.18);
    background:rgba(90,158,159,0.02);
  }
  .card h3 {
    font-family:'Lora',serif;
    font-size:20px;
    font-weight:400;
    margin-bottom:10px;
  }

  /* Journey path */
  .journey {
    display:flex;
    flex-direction:column;
    gap:0;
    counter-reset:j;
  }
  .jstep {
    counter-increment:j;
    display:flex;
    gap:18px;
    align-items:flex-start;
    position:relative;
    padding-bottom:8px;
  }
  .jdot {
    flex:0 0 auto;
    width:48px; height:48px;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'Lora',serif;
    font-weight:700;
    font-size:18px;
    color:#fff;
    z-index:1;
  }
  .jstep:nth-child(1) .jdot { background:rgba(171,208,196,0.25); color:var(--glow); }
  .jstep:nth-child(2) .jdot { background:var(--glow); }
  .jstep:nth-child(3) .jdot { background:var(--warm); }
  .jstep:nth-child(4) .jdot { background:var(--rose); }
  .jline {
    position:absolute;
    left:24px;
    top:48px;
    bottom:-8px;
    width:1px;
    background:var(--line);
    z-index:0;
  }
  .jstep:last-child .jline { display:none; }
  .jcard {
    flex:1;
    background:rgba(255,255,255,0.02);
    border:1px solid var(--line);
    border-radius:18px;
    padding:18px 22px;
    margin-bottom:18px;
    transition:all 0.3s;
  }
  .jcard:hover { border-color:rgba(90,158,159,0.2); }
  .jt {
    font-family:'Lora',serif;
    font-weight:600;
    font-size:17px;
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
  }
  .jd { font-size:14.5px; color:var(--muted); margin-top:5px; line-height:1.6; }
  .tag {
    display:inline-block;
    font-size:11px;
    font-weight:600;
    padding:4px 12px;
    border-radius:999px;
  }
  .tag.free { background:rgba(90,158,159,0.12); color:var(--glow); }
  .tag.soft { background:rgba(197,139,50,0.12); color:var(--warm); }
  .tag.std { background:rgba(201,123,115,0.12); color:var(--rose); }

  /* Lists */
  .softlist {
    list-style:none;
    margin:10px 0 0;
    padding:0;
  }
  .softlist li {
    position:relative;
    padding:10px 0 10px 34px;
    font-size:15px;
    border-bottom:1px solid var(--line);
    color:var(--muted);
  }
  .softlist li:last-child { border-bottom:0; }
  .softlist li b { color:var(--ink); font-weight:600; }
  .ic {
    position:absolute;
    left:0;
    top:10px;
    width:22px;
    height:22px;
    border-radius:50%;
    background:rgba(90,158,159,0.1);
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .ic svg { width:12px; height:12px; stroke:var(--glow); fill:none; stroke-width:2.5; }

  /* Notes */
  .note {
    display:flex;
    gap:12px;
    padding:16px 18px;
    border-radius:14px;
    font-size:14.5px;
    line-height:1.55;
    align-items:flex-start;
    margin-top:16px;
  }
  .note.teal { background:rgba(90,158,159,0.08); color:var(--glow); border:1px solid rgba(90,158,159,0.15); }
  .note.rose { background:rgba(201,123,115,0.08); color:var(--rose); border:1px solid rgba(201,123,115,0.15); }
  .note.ochre { background:rgba(197,139,50,0.08); color:var(--warm); border:1px solid rgba(197,139,50,0.15); }
  .note svg { flex:0 0 auto; margin-top:2px; width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2; }
  .note b { font-weight:600; color:var(--ink); }

  /* Cost calculator */
  .tool {
    border:1px solid var(--line);
    border-radius:20px;
    background:rgba(255,255,255,0.015);
    overflow:hidden;
  }
  .tool-head {
    padding:18px 24px;
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    gap:11px;
    background:linear-gradient(180deg, rgba(90,158,159,0.04), transparent);
  }
  .tool-head h3 { font-family:'Lora',serif; font-size:18px; font-weight:400; }
  .tool-body { padding:24px; }
  .flabel {
    font-size:11px;
    font-weight:600;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--dim);
    margin-bottom:12px;
    display:block;
  }
  .seg {
    display:inline-flex;
    flex-wrap:wrap;
    gap:8px;
  }
  .seg button {
    border:1px solid var(--line);
    background:transparent;
    color:var(--muted);
    cursor:pointer;
    padding:10px 18px;
    border-radius:999px;
    font-size:14px;
    font-weight:500;
    transition:all 0.2s;
    font-family:'Onest',sans-serif;
  }
  .seg button:hover { border-color:var(--glow); color:var(--ink); }
  .seg button.on {
    background:var(--glow);
    border-color:var(--glow);
    color:var(--bg);
    font-weight:600;
    box-shadow:0 4px 14px rgba(90,158,159,0.22);
  }
  .price-out {
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:14px;
    margin-top:22px;
  }
  .price-cell {
    border-radius:14px;
    padding:18px 14px;
    text-align:center;
    border:1px solid var(--line);
    background:rgba(255,255,255,0.015);
  }
  .price-cell.free { background:rgba(90,158,159,0.06); border-color:rgba(90,158,159,0.2); }
  .price-cell .pl {
    font-size:11px;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:var(--dim);
    font-weight:600;
    min-height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .price-cell .pv {
    font-family:'Lora',serif;
    font-size:26px;
    font-weight:600;
    color:var(--ink);
    margin-top:6px;
    line-height:1;
  }
  .price-cell .ps { font-size:12px; color:var(--dim); margin-top:6px; }
  .price-cell.free .pv { color:var(--glow); }

  /* Tabs */
  .tabs {
    display:inline-flex;
    gap:6px;
    margin-bottom:20px;
    background:rgba(90,158,159,0.08);
    padding:5px;
    border-radius:999px;
  }
  .tabs button {
    border:0;
    background:none;
    color:var(--glow);
    cursor:pointer;
    padding:9px 20px;
    border-radius:999px;
    font-size:14px;
    font-weight:600;
    transition:all 0.2s;
    font-family:'Onest',sans-serif;
  }
  .tabs button.on {
    background:var(--bg-lift);
    box-shadow:0 4px 12px rgba(0,0,0,0.2);
    color:var(--ink);
  }
  .tabpane { display:none; animation:fade 0.35s ease; }
  .tabpane.show { display:block; }
  @keyframes fade { from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none} }

  /* Grid2 */
  .grid2 { display:grid; grid-template-columns:1fr 1fr; gap:18px; }

  /* Tree / resolver */
  .tree-q {
    font-family:'Lora',serif;
    font-size:20px;
    margin-bottom:6px;
    color:var(--ink);
  }
  .tree-sub {
    font-size:14px;
    color:var(--muted);
    margin-bottom:18px;
  }
  .choices {
    display:flex;
    flex-direction:column;
    gap:10px;
  }
  .choice {
    text-align:left;
    border:1px solid var(--line);
    background:rgba(255,255,255,0.015);
    border-radius:14px;
    padding:16px 20px;
    cursor:pointer;
    font-size:15px;
    font-weight:500;
    color:var(--ink);
    transition:all 0.2s;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    font-family:'Onest',sans-serif;
  }
  .choice:hover {
    border-color:var(--glow);
    background:rgba(90,158,159,0.04);
    transform:translateX(4px);
  }
  .choice .ar { color:var(--warm); font-size:18px; }
  .crumbs {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    align-items:center;
    margin-bottom:18px;
    font-size:12px;
  }
  .crumbs .cb {
    background:rgba(90,158,159,0.1);
    color:var(--glow);
    padding:5px 13px;
    border-radius:999px;
    font-weight:600;
  }
  .crumbs .sep { color:var(--dim); }
  .btn-back {
    border:1px solid var(--line);
    background:transparent;
    color:var(--muted);
    padding:6px 14px;
    border-radius:999px;
    font-size:12px;
    cursor:pointer;
    font-weight:600;
    transition:all 0.2s;
    font-family:'Onest',sans-serif;
  }
  .btn-back:hover { border-color:var(--glow); color:var(--glow); }
  .outcome .otitle {
    display:flex;
    gap:13px;
    align-items:center;
    margin-bottom:14px;
  }
  .outcome .otitle .ico {
    width:44px; height:44px;
    border-radius:13px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    background:rgba(90,158,159,0.1);
  }
  .outcome .otitle h4 {
    font-family:'Lora',serif;
    font-weight:600;
    font-size:20px;
  }
  .outcome p { font-size:15px; color:var(--muted); margin:0; line-height:1.7; }
  .btn-ghost {
    border:1px solid var(--line);
    background:transparent;
    color:var(--muted);
    padding:8px 18px;
    border-radius:999px;
    font-size:13px;
    cursor:pointer;
    font-weight:600;
    margin-top:18px;
    transition:all 0.2s;
    font-family:'Onest',sans-serif;
  }
  .btn-ghost:hover { border-color:var(--glow); color:var(--glow); }

  /* Comp grid */
  .comp-grid {
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:4px;
  }
  .comp {
    flex:1 1 calc(33.333% - 8px);
    min-width:200px;
    display:flex;
    align-items:center;
    gap:12px;
    padding:14px 16px;
    border-radius:14px;
    font-size:14.5px;
    font-weight:600;
    color:var(--ink);
    line-height:1.3;
  }
  .comp .ci {
    width:36px; height:36px;
    border-radius:10px;
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,0.03);
  }
  .comp.c1 { background:rgba(90,158,159,0.08); }
  .comp.c2 { background:rgba(201,123,115,0.08); }
  .comp.c3 { background:rgba(197,139,50,0.08); }
  .comp.c4 { background:rgba(171,208,196,0.08); }
  .comp.c5 { background:rgba(246,227,212,0.06); }

  /* Footer */
  .footer {
    text-align:center;
    padding:40px 5% 50px;
    font-size:12px;
    color:var(--dim);
    position:relative;
  }
  .footer::before {
    content:"";
    position:absolute;
    top:0; left:15%; right:15%;
    height:1px;
    background:linear-gradient(90deg, transparent, var(--line), transparent);
  }

  @media(max-width:720px){
    .grid2, .price-out { grid-template-columns:1fr; }
    .price-cell.free { grid-column:1 / -1; }
    .hero h1 { font-size:28px; }
    .comp { flex:1 1 100%; }
    .header { padding:16px 5%; }
    .chips { padding:4px 0; }
  }

.memo-radio{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}#cost-seg label,.tabs label{cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}#cost-seg label{border:1px solid var(--line);background:transparent;color:var(--muted);padding:10px 18px;border-radius:999px;font-size:14px;font-weight:500;display:inline-flex;align-items:center;min-height:44px}#cost-junior:checked~#cost-seg label[for="cost-junior"],#cost-middle:checked~#cost-seg label[for="cost-middle"],#cost-senior:checked~#cost-seg label[for="cost-senior"]{background:var(--glow);border-color:var(--glow);color:var(--bg)}.price-senior{display:none}#cost-senior:checked~#cost-seg~.price-out .price-junior-middle{display:none}#cost-senior:checked~#cost-seg~.price-out .price-senior{display:inline}.tabs label{border:0;background:none;color:var(--glow);padding:9px 20px;border-radius:999px;font-size:14px;font-weight:600;display:inline-flex;align-items:center;min-height:40px}#changes-free:checked~#changes-tabs label[for="changes-free"],#changes-paid:checked~#changes-tabs label[for="changes-paid"]{background:var(--bg-lift);box-shadow:0 4px 12px rgba(0,0,0,.2);color:var(--ink)}#changes-tabs~.tabpane{display:none!important}#changes-free:checked~#changes-tabs~.tabpane[data-pane="free"],#changes-paid:checked~#changes-tabs~.tabpane[data-pane="paid"]{display:block!important}.return-details{display:flex;flex-direction:column;gap:10px;margin-top:18px}.return-branch{border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.015);overflow:hidden}.return-branch>summary{list-style:none;cursor:pointer;padding:16px 20px;font-size:15px;font-weight:600;display:flex;align-items:center;justify-content:space-between;gap:12px;touch-action:manipulation}.return-branch>summary::-webkit-details-marker{display:none}.return-branch>summary::after{content:'→';color:var(--glow);transition:transform .2s}.return-branch[open]>summary::after{transform:rotate(90deg)}.return-branch .outcome{margin:0;border:0;border-top:1px solid var(--line);border-radius:0;padding:18px 20px}.return-subq{padding:14px 20px 6px;font-size:14px}.return-nested{margin:8px 14px 10px;background:rgba(255,255,255,.02)}@media(max-width:640px){#cost-seg{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;gap:8px!important;padding-bottom:6px;scrollbar-width:none}#cost-seg label{flex:0 0 auto;white-space:nowrap;padding:9px 14px;font-size:12px}.tabs{display:flex!important;max-width:100%;overflow-x:auto}.tabs label{flex:0 0 auto;white-space:nowrap;padding:8px 14px;font-size:12px}.return-branch>summary{min-height:52px;padding:14px 16px}}
.footer a{color:var(--glow);text-decoration:none;border-bottom:1px solid rgba(90,158,159,.3)}

.tvp { position:relative; z-index:1; }