/* Landing page: design A (bento) + phone mock-up and comparison table. Uses the app's colour variables. */
.app.landing{padding-bottom:20px}
.lp-top{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px)}
.lp-nav{display:flex;align-items:center;gap:12px;height:66px;max-width:1160px}
.lp-logo{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-size:1.35rem;text-decoration:none}
.lp-logo .ico{width:30px;height:30px;padding:6px;border-radius:10px;background:var(--ink);color:var(--bg);stroke-width:2.4}
.lp-links{display:none;gap:22px;margin-left:24px;font-weight:500}
.lp-links a{text-decoration:none;color:var(--muted)}.lp-links a:hover{color:var(--ink)}
.lp .wrap{max-width:1160px}
.lp-btn{display:inline-flex;align-items:center;gap:10px;min-height:54px;padding:0 28px;border-radius:999px;background:var(--btn);color:var(--btn-fg);font-weight:700;text-decoration:none;font-size:1rem}
.lp-btn.ghost{background:var(--surface);color:var(--ink)}.lp-btn.light{background:#fff;color:#16181d}
.lp-btn.lp-sm{min-height:42px;padding:0 18px;font-size:.92rem}
.lp-btn .ico{width:20px;height:20px}
.lp-eb{font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--brand)}
.lp h1,.lp h2,.lp h3{font-family:var(--serif);font-weight:500;letter-spacing:-.02em;line-height:1.08}
.lp-hero{display:flex;gap:44px;align-items:center;padding:28px 0 36px;flex-wrap:wrap}
.lp-l{flex:1 1 440px}.lp-r{flex:1 1 380px;position:relative;display:flex;justify-content:center;background:var(--t-violet);border-radius:40px;padding:34px 20px 0}
.lp-hero h1{font-size:clamp(2.4rem,7vw,4rem);margin:14px 0 18px}
.lp-lead{font-size:1.2rem;line-height:1.55;color:var(--muted);max-width:34em;margin:0 0 26px}
.lp-ctas{display:flex;gap:12px;flex-wrap:wrap}
.lp-micro{list-style:none;margin:20px 0 0;padding:0;display:flex;gap:10px 22px;flex-wrap:wrap;color:var(--muted);font-size:.92rem}
.lp-micro li{display:flex;align-items:center;gap:6px}.lp-yes{color:var(--ok);stroke-width:3}.lp-no{color:var(--muted)}
.lp-phone{width:280px;background:#16181d;border-radius:40px 40px 0 0;padding:12px 12px 0}
.lp-scr{background:var(--bg);border-radius:30px 30px 0 0;padding:16px;height:430px;overflow:hidden}
.lp-scr img{width:100%;height:118px;object-fit:cover;border-radius:16px;background:#fff}
.lp-q{font-family:var(--serif);font-size:1.02rem;line-height:1.25;margin:12px 0 10px;color:var(--ink)}
.lp-opt{display:flex;gap:10px;align-items:center;background:var(--surface);border-radius:16px;padding:10px 12px;font-size:.8rem;line-height:1.3;margin-bottom:8px;border:2px solid transparent;color:var(--ink)}
.lp-opt.ok{border-color:var(--ok);background:var(--ok-50)}.lp-opt i{width:22px;height:22px;border-radius:50%;background:var(--bg);display:grid;place-items:center;font-style:normal;font-weight:700;font-size:.7rem;flex:none}
.lp-chip{position:absolute;background:var(--surface);border-radius:18px;padding:11px 15px;box-shadow:0 14px 34px rgba(22,24,29,.14);font-weight:600;font-size:.85rem;display:flex;gap:9px;align-items:center}
.lp-chip .ico{width:20px;height:20px;color:var(--brand)}.lp-chip.c1{left:-10px;top:34px}.lp-chip.c2{right:-6px;bottom:34px}
.lp-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:8px 0 60px}
.lp-stat{background:var(--surface);border-radius:26px;padding:20px 22px}.lp-stat b{display:block;font-family:var(--serif);font-weight:500;font-size:2.6rem;line-height:1}.lp-stat span{color:var(--muted);font-size:.92rem}
.lp-sh{font-size:clamp(1.9rem,5vw,2.8rem);margin:0 0 10px}.lp-sub{color:var(--muted);font-size:1.1rem;max-width:36em;margin:0 0 28px}
.lp-bento{display:grid;grid-template-columns:1fr;gap:14px}
.lp-tile{border-radius:30px;padding:26px;position:relative;overflow:hidden}
.lp-tile h3{font-size:1.5rem;margin:14px 0 8px}.lp-tile p{margin:0;color:var(--muted);line-height:1.5}
.lp-ic{width:46px;height:46px;border-radius:50%;background:color-mix(in srgb,var(--surface) 75%,transparent);display:grid;place-items:center}
.lp-t1{background:var(--t-violet)}.lp-t2{background:var(--t-sun)}.lp-t3{background:var(--t-mint)}.lp-t4{background:var(--t-peach)}.lp-t5{background:var(--surface)}.lp-t6{background:var(--t-violet)}
.lp-t1 img{width:100%;height:180px;object-fit:cover;border-radius:20px;margin-top:16px;background:#fff}
.lp-steps{display:grid;grid-template-columns:1fr;gap:14px}.lp-step{background:var(--surface);border-radius:28px;padding:26px}
.lp-n{font-family:var(--serif);font-size:2.6rem;color:var(--brand);line-height:1}.lp-step h3{font-size:1.5rem;margin:12px 0 8px}.lp-step p{margin:0;color:var(--muted);line-height:1.5}
.lp-free{background:#16181d;color:#fff;border-radius:36px;padding:30px 24px;display:flex;gap:30px;align-items:center;flex-wrap:wrap;margin:60px 0}
:root[data-theme=dark] .lp-free{background:#2a2c38}
.lp-free .lp-tx{flex:1 1 420px}.lp-free h2{font-size:clamp(1.9rem,5vw,2.8rem)}.lp-free p{color:#c9ccd6;font-size:1.1rem;line-height:1.55;margin:14px 0 24px}
.lp-free .lp-eb{color:#b9b9ff}
.lp-nums{display:flex;gap:14px;flex:1 1 300px}.lp-nums div{flex:1;background:rgba(255,255,255,.08);border-radius:24px;padding:20px;color:#c9ccd6}.lp-nums b{display:block;font-family:var(--serif);font-weight:500;font-size:3rem;line-height:1;color:#fff}
.lp-cmp{background:var(--surface);border-radius:30px;padding:10px 20px;margin-bottom:10px}
.lp-cmp table{width:100%;border-collapse:collapse}.lp-cmp th,.lp-cmp td{padding:15px 8px;text-align:left;border-bottom:1px solid var(--line)}.lp-cmp tr:last-child td{border-bottom:0}
.lp-cmp th{font-family:var(--serif);font-weight:500;font-size:1.2rem}.lp-cmp td:nth-child(n+2),.lp-cmp th:nth-child(n+2){text-align:center;width:22%}
.lp-plans{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.lp-plan{background:var(--surface);border-radius:28px;padding:22px;text-decoration:none;display:grid;gap:4px}.lp-plan.pop{box-shadow:0 0 0 2px var(--ink)}
.lp-plan span{color:var(--muted);font-weight:600}.lp-plan b{font-family:var(--serif);font-weight:500;font-size:2.4rem;line-height:1.1}.lp-plan small{color:var(--muted)}
.lp-faq details{background:var(--surface);border-radius:22px;padding:18px 22px;margin-bottom:10px}.lp-faq summary{font-weight:600;font-size:1.05rem;cursor:pointer}.lp-faq details p{margin:10px 0 0;color:var(--muted);line-height:1.55}
.lp-final{text-align:center;padding:64px 0 24px}.lp-final h2{font-size:clamp(2rem,6vw,3.2rem);margin-bottom:22px}
@media(min-width:900px){
  .lp-links{display:flex}
  .lp-stats{grid-template-columns:repeat(4,1fr)}
  .lp-bento{grid-template-columns:repeat(3,1fr)}.lp-t1{grid-column:span 2;display:flex;gap:24px;align-items:center}.lp-t1 .lp-tx{flex:1}.lp-t1 img{width:44%;height:220px;margin-top:0}
  .lp-t6{grid-column:1/-1}
  .lp-steps{grid-template-columns:repeat(3,1fr)}
  .lp-plans{grid-template-columns:repeat(4,1fr)}
  .lp-free{padding:44px}
  .lp-cmp{padding:14px 28px}
}
@media(max-width:560px){.lp-r{display:none}.lp-nav .lp-btn.lp-sm{display:none}}

.lp-cmp table{table-layout:fixed}.lp-cmp td:first-child,.lp-cmp th{overflow-wrap:anywhere;hyphens:auto}
@media(max-width:560px){.lp-cmp th{font-size:.95rem}.lp-cmp td:nth-child(n+2),.lp-cmp th:nth-child(n+2){width:27%}.lp-cmp{padding:8px 12px}}
