/* ============================================================
   Стартовая страница job-free — концепт «Внутри кабинета».
   Всё заскоуплено под .lpc, чтобы не задевать глобальные классы
   main.css. Переменные бренда (--orange, --teal, --ink, --ok…)
   берутся из :root main.css; недостающие объявлены локально ниже.
   ============================================================ */
.lpc{
  --o2:#fb923c; --o-ink:#b3400a;
  --teal-d:#0f766e; --teal-ink:#0b6b62;
  --faint:#94897c; --surface:#fff; --sink:#f4ece0; --line2:#e6d8c3;
  --r:14px; --rl:18px; --rx:22px;
  --sh-sm:0 2px 8px rgba(120,80,30,.08);
  --sh:0 14px 40px -14px rgba(120,72,20,.28);
  --sh-lg:0 30px 70px -24px rgba(120,72,20,.34);
  background:
    radial-gradient(900px 500px at 50% -12%, color-mix(in srgb,var(--teal) 12%, transparent), transparent 62%),
    radial-gradient(700px 500px at 12% 6%, color-mix(in srgb,var(--orange) 12%, transparent), transparent 60%);
}
.lpc .btn svg{width:18px;height:18px;}

/* ---------- hero ---------- */
.lpc-hero{text-align:center;max-width:820px;margin:0 auto;padding:44px 24px 30px;}
.lpc-pill{display:inline-flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--line2);padding:7px 16px;border-radius:999px;font-size:13px;font-weight:800;color:var(--muted);box-shadow:var(--sh-sm);margin-bottom:24px;}
.lpc-pill .live{width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 4px var(--teal-bg);flex:none;}
.lpc-hero h1{font-size:clamp(34px,5.3vw,60px);font-weight:900;line-height:1.03;letter-spacing:-.03em;margin:0 0 20px;text-wrap:balance;}
.lpc-hero h1 .g{background:linear-gradient(120deg,var(--orange),var(--teal-d));-webkit-background-clip:text;background-clip:text;color:transparent;}
.lpc-hero .sub{font-size:19px;color:var(--muted);max-width:600px;margin:0 auto 28px;}
.lpc-cta{display:flex;gap:13px;justify-content:center;flex-wrap:wrap;margin-bottom:14px;}
.lpc-micro{font-size:13.5px;color:var(--faint);font-weight:600;}

/* ---------- окно-мокап кабинета ---------- */
.lpc .mock{max-width:960px;margin:26px auto 0;border-radius:18px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-lg);overflow:hidden;}
.lpc .mock-bar{display:flex;align-items:center;gap:8px;padding:13px 16px;background:var(--soft);border-bottom:1px solid var(--line);}
.lpc .mock-bar .d{width:11px;height:11px;border-radius:50%;background:var(--line2);}
.lpc .mock-bar .url{margin-left:12px;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:5px 14px;font-size:12.5px;color:var(--faint);font-weight:700;flex:1;max-width:280px;}
.lpc .mock-body{display:grid;grid-template-columns:200px 1fr;min-height:400px;}
.lpc .mock-side{background:var(--soft);border-right:1px solid var(--line);padding:18px 14px;display:flex;flex-direction:column;gap:4px;}
.lpc .mock-side .mi{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;font-size:13.5px;font-weight:700;color:var(--muted);width:100%;background:transparent;border:0;cursor:pointer;font-family:inherit;text-align:left;transition:.14s;}
.lpc .mock-side .mi svg{width:16px;height:16px;opacity:.8;flex:none;}
.lpc .mock-side .mi:hover{background:var(--surface);color:var(--ink);}
.lpc .mock-side .mi:focus-visible{outline:2px solid var(--orange);outline-offset:1px;}
.lpc .mock-side .mi.on{background:var(--orange-bg);color:var(--o-ink);}
.lpc .mock-main{padding:22px;}

/* дашборд */
.lpc .mock-bal{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:18px;}
.lpc .balcard{flex:1;min-width:150px;border:1px solid var(--line);border-radius:14px;padding:16px 18px;background:var(--surface);}
.lpc .balcard.hero{background:linear-gradient(135deg,var(--orange),var(--o2));color:#fff;border:0;}
.lpc .balcard .bl{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;opacity:.85;}
.lpc .balcard .bv{font-size:26px;font-weight:900;letter-spacing:-.02em;margin-top:5px;font-variant-numeric:tabular-nums;}
.lpc .balcard.hero .bl{color:#ffe8d4;opacity:1;}
.lpc .mock-cand{border:1px solid var(--line);border-radius:14px;padding:18px;background:var(--surface);}
.lpc .mc-top{display:flex;align-items:center;gap:12px;margin-bottom:16px;}
.lpc .mc-av{width:42px;height:42px;border-radius:12px;background:var(--teal-bg);color:var(--teal-d);display:grid;place-items:center;font-weight:900;font-size:16px;flex:none;}
.lpc .mc-name{font-weight:800;font-size:15px;}
.lpc .mc-role{font-size:13px;color:var(--muted);}
.lpc .mc-pill{margin-left:auto;font-size:12px;font-weight:800;color:var(--teal-d);background:var(--teal-bg);border:1px solid var(--teal-br);padding:5px 11px;border-radius:999px;}
.lpc .mc-prog{margin-bottom:8px;display:flex;justify-content:space-between;font-size:13px;font-weight:700;color:var(--muted);}
.lpc .mc-prog b{color:var(--ink);}
.lpc .bar{height:9px;border-radius:99px;background:var(--sink);overflow:hidden;margin-bottom:16px;}
.lpc .bar>span{display:block;height:100%;width:60%;background:linear-gradient(90deg,var(--orange),var(--o2));border-radius:99px;}
.lpc .mc-miles{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;}
.lpc .mile{border:1px solid var(--line);border-radius:11px;padding:11px;text-align:center;}
.lpc .mile.done{background:var(--teal-bg);border-color:var(--teal-br);}
.lpc .mile .mk2{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;margin:0 auto 7px;font-size:12px;font-weight:900;background:var(--sink);color:var(--faint);}
.lpc .mile.done .mk2{background:var(--teal);color:#04211e;}
.lpc .mile .ms{font-size:11.5px;color:var(--muted);font-weight:700;}
.lpc .mile .mv{font-size:15px;font-weight:900;color:var(--ink);margin-top:2px;}

/* переключаемые разделы */
.lpc .mview{animation:lpcfade .28s ease both;}
.lpc .mview[hidden]{display:none;}
.lpc .mv-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;}
.lpc .mv-head h4{font-size:15px;font-weight:800;margin:0;}
.lpc .mv-head .cnt{font-size:12px;font-weight:700;color:var(--faint);}
.lpc .chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.lpc .fchip{font-size:12.5px;font-weight:800;padding:6px 13px;border-radius:999px;border:1px solid var(--line);color:var(--muted);background:var(--surface);cursor:pointer;font-family:inherit;}
.lpc .fchip.on{background:var(--orange-bg);border-color:var(--orange-br);color:var(--o-ink);}
.lpc .rowlist{display:flex;flex-direction:column;gap:9px;}
.lpc .lrow{display:flex;align-items:center;gap:13px;padding:13px 14px;border:1px solid var(--line);border-radius:13px;background:var(--surface);}
.lpc .lico{width:38px;height:38px;border-radius:11px;flex:none;display:grid;place-items:center;background:var(--orange-bg);color:var(--orange);}
.lpc .lico.t{background:var(--teal-bg);color:var(--teal-d);}
.lpc .lico svg{width:19px;height:19px;}
.lpc .lav{width:38px;height:38px;border-radius:11px;flex:none;display:grid;place-items:center;background:var(--teal-bg);color:var(--teal-d);font-weight:900;font-size:13px;}
.lpc .lmain{flex:1;min-width:0;}
.lpc .lt{font-weight:800;font-size:14px;}
.lpc .ls{font-size:12.5px;color:var(--muted);margin-top:1px;}
.lpc .lr{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex:none;text-align:right;}
.lpc .lamt{font-weight:900;font-size:14px;color:var(--orange);white-space:nowrap;}
.lpc .lsub{font-size:11px;color:var(--faint);font-weight:700;}
.lpc .lstat{font-size:12px;color:var(--muted);font-weight:700;white-space:nowrap;}
.lpc .miniprog{height:6px;width:160px;max-width:44vw;border-radius:99px;background:var(--sink);overflow:hidden;margin-top:8px;}
.lpc .miniprog>span{display:block;height:100%;background:linear-gradient(90deg,var(--orange),var(--o2));}
.lpc .st{display:inline-block;font-size:11px;font-weight:800;padding:4px 10px;border-radius:999px;white-space:nowrap;}
.lpc .st-live{color:var(--teal-d);background:var(--teal-bg);border:1px solid var(--teal-br);}
.lpc .st-done{color:var(--ok);background:var(--ok-bg);border:1px solid transparent;}
.lpc .st-wait{color:var(--muted);background:var(--soft);border:1px solid var(--line);}
.lpc .minibtn{font-size:12.5px;font-weight:800;padding:9px 15px;border-radius:9px;background:var(--orange);color:#fff;border:0;cursor:pointer;font-family:inherit;white-space:nowrap;transition:.14s;flex:none;}
.lpc .minibtn:hover{filter:brightness(1.05);}
.lpc .minibtn.g{background:var(--surface);color:var(--ink);border:1.4px solid var(--line2);}
.lpc .minibtn.w{background:#fff;color:var(--orange-d);}
.lpc .lurl{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;color:var(--teal-ink);background:var(--teal-bg);border:1px solid var(--teal-br);padding:3px 9px;border-radius:7px;display:inline-block;margin-top:6px;}
.lpc .paybal{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;background:linear-gradient(135deg,var(--orange),var(--o2));color:#fff;border-radius:14px;padding:16px 20px;margin-bottom:16px;}
.lpc .paybal .pl{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:#ffe8d4;}
.lpc .paybal .pv{font-size:26px;font-weight:900;letter-spacing:-.02em;margin-top:3px;}
.lpc .ptable{width:100%;border-collapse:collapse;font-size:13px;}
.lpc .ptable td{padding:11px 6px;border-bottom:1px solid var(--line);vertical-align:middle;}
.lpc .ptable tr:last-child td{border-bottom:0;}
.lpc .ptable .pd{color:var(--faint);font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums;}
.lpc .ptable .pdesc{font-weight:700;}
.lpc .ptable .pin{color:var(--ok);font-weight:900;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;}
.lpc .ptable .pout{color:var(--muted);font-weight:900;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;}

.lpc .mock-hint{text-align:center;font-size:13.5px;color:var(--faint);font-weight:600;margin:16px auto 0;max-width:660px;padding:0 24px;line-height:1.5;}

/* ---------- фичи ---------- */
.lpc-feat{max-width:var(--max-width);margin:0 auto;padding:78px 24px 20px;}
.lpc .feat-head{text-align:center;max-width:640px;margin:0 auto 44px;}
.lpc .feat-head .kk{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:12.5px;text-transform:uppercase;letter-spacing:.12em;color:var(--teal-ink);margin-bottom:12px;}
.lpc .feat-head .kk .dot{width:7px;height:7px;border-radius:50%;background:var(--orange);}
.lpc .feat-head h2{font-size:clamp(28px,3.6vw,40px);font-weight:900;margin:0 0 12px;}
.lpc .feat-head p{font-size:17px;color:var(--muted);margin:0;}
.lpc .feats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.lpc .feat{background:var(--surface);border:1px solid var(--line);border-radius:var(--rl);padding:26px;}
.lpc .feat .fi{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;margin-bottom:15px;background:var(--orange-bg);color:var(--orange);}
.lpc .feat .fi svg{width:22px;height:22px;}
.lpc .feat:nth-child(2) .fi{background:var(--teal-bg);color:var(--teal-d);}
.lpc .feat h3{font-size:18px;font-weight:800;margin:0 0 7px;}
.lpc .feat p{color:var(--muted);font-size:14.5px;margin:0;}

/* ---------- финальный CTA ---------- */
.lpc-cta2{max-width:var(--max-width);margin:64px auto 40px;padding:0 24px;}
.lpc-cta2 .in{background:linear-gradient(135deg,var(--teal-d),var(--teal));border-radius:var(--rx);padding:52px;text-align:center;color:#eafffb;position:relative;overflow:hidden;}
.lpc-cta2 h2{font-size:clamp(28px,4vw,40px);font-weight:900;margin:0 0 12px;color:#fff;}
.lpc-cta2 p{font-size:18px;max-width:520px;margin:0 auto 26px;opacity:.92;}
.lpc-cta2 .row{display:flex;gap:13px;justify-content:center;flex-wrap:wrap;}
.lpc-cta2 .btn-white{background:#fff;color:var(--teal-d);}
.lpc-cta2 .btn-ink{background:#04211e;color:#eafffb;}

@keyframes lpcfade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

/* ---------- адаптив ---------- */
@media (max-width:860px){
  .lpc .mock-body{grid-template-columns:1fr;}
  .lpc .mock-side{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);}
  .lpc .mock-side .mi{width:auto;white-space:nowrap;}
  .lpc .mc-miles,.lpc .feats{grid-template-columns:1fr;}
  .lpc-cta2 .in{padding:40px 26px;}
}
@media (prefers-reduced-motion:reduce){
  .lpc .mview{animation:none;}
}