/* MOKzento public landing page */
.lp-body { background:#fff; color:var(--text); scroll-behavior:smooth; }
html { scroll-behavior:smooth; scroll-padding-top:76px; }
.lp-nav { position:sticky; top:0; z-index:50; background:rgba(255,255,255,.94); backdrop-filter:blur(8px); border-bottom:1px solid var(--line); }
.lp-nav-in { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; min-height:68px; }
.lp-brand img { height:36px; width:auto; display:block; }
.lp-burger { border:1px solid var(--line); background:#fff; border-radius:10px; font-size:1.6rem; line-height:1; padding:4px 8px; color:var(--navy); }
.lp-menu { flex-basis:100%; }
.lp-menu ul { list-style:none; margin:0; padding:12px 0 4px; display:flex; flex-direction:column; gap:2px; }
.lp-menu ul a { display:block; padding:8px 4px; color:var(--text); text-decoration:none; font-weight:500; }
.lp-menu ul a:hover { color:var(--orange); }
.lp-actions { display:flex; gap:10px; padding:8px 0 14px; }
@media (min-width:992px) {
  .lp-burger { display:none; }
  .lp-menu { display:flex !important; flex-basis:auto; align-items:center; gap:28px; }
  .lp-menu ul { flex-direction:row; padding:0; gap:26px; }
  .lp-actions { padding:0; }
}
.lp-hero { padding:56px 0 64px; background:linear-gradient(180deg,#f4f7fc 0%,#fff 100%); overflow:hidden; }
.lp-chip { display:inline-flex; align-items:center; gap:6px; background:var(--orange-soft); color:var(--orange-dark); font-weight:600; font-size:.85rem; padding:6px 12px; border-radius:999px; }
.lp-hero h1 { font-size:clamp(2rem,4.2vw,3rem); font-weight:700; color:var(--navy); line-height:1.15; margin:18px 0 14px; }
.lp-lead { color:var(--muted); font-size:1.08rem; max-width:520px; }
.lp-cta { display:flex; flex-wrap:wrap; gap:12px; margin:24px 0 20px; }
.lp-ticks { list-style:none; padding:0; margin:0; display:grid; gap:8px; color:var(--text); }
.lp-ticks i { color:var(--orange); margin-right:6px; vertical-align:-2px; }
.lp-shot { border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:0 24px 60px rgba(16,38,74,.18); overflow:hidden; }
.lp-shot-bar { display:flex; gap:6px; padding:10px 14px; background:#eef2f8; border-bottom:1px solid var(--line); }
.lp-shot-bar span { width:10px; height:10px; border-radius:50%; background:#cdd6e4; }
.lp-shot img { display:block; width:100%; height:auto; }
.lp-strip { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:18px 0; background:#fff; }
.lp-strip .container { display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px; }
.lp-strip-title { font-weight:600; color:var(--muted); text-transform:uppercase; font-size:.78rem; letter-spacing:.08em; }
.lp-pills { display:flex; flex-wrap:wrap; gap:8px; }
.lp-pills span { background:#f4f7fc; border:1px solid var(--line); color:var(--navy); border-radius:999px; padding:5px 14px; font-size:.9rem; font-weight:500; }
.lp-section { padding:72px 0; }
.lp-alt { background:#f4f7fc; }
.lp-head { text-align:center; max-width:640px; margin:0 auto 40px; }
.lp-eyebrow { color:var(--orange); font-weight:600; text-transform:uppercase; letter-spacing:.1em; font-size:.8rem; }
.lp-head h2 { color:var(--navy); font-weight:700; font-size:clamp(1.6rem,3vw,2.2rem); margin:8px 0 10px; }
.lp-head p { color:var(--muted); margin:0; }
.lp-feature { height:100%; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:22px; transition:transform .2s, box-shadow .2s; }
.lp-feature:hover { transform:translateY(-3px); box-shadow:var(--shadow); }
.lp-feature h3 { font-size:1.05rem; font-weight:600; color:var(--navy); margin:14px 0 6px; display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.lp-feature p { color:var(--muted); margin:0; font-size:.94rem; }
.lp-feature.is-soon .itile { filter:grayscale(.5); opacity:.85; }
.lp-tag { font-size:.68rem; font-weight:600; padding:3px 8px; border-radius:999px; }
.lp-tag-live { background:#e3f6ec; color:#15803d; }
.lp-tag-soon { background:#eef2f8; color:#5b6b82; }
.lp-step { position:relative; height:100%; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:24px 20px; }
.lp-step > i { font-size:1.8rem; color:var(--orange); }
.lp-step-no { position:absolute; top:14px; right:16px; font-weight:700; font-size:1.6rem; color:#dde4f0; }
.lp-step h3 { font-size:1.05rem; font-weight:600; color:var(--navy); margin:10px 0 6px; }
.lp-step p { color:var(--muted); font-size:.93rem; margin:0; }
.lp-plan { position:relative; height:100%; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:28px 24px; display:flex; flex-direction:column; }
.lp-plan.is-featured { border:2px solid var(--orange); box-shadow:var(--shadow); }
.lp-plan-badge { position:absolute; top:-12px; left:24px; background:var(--orange); color:#fff; font-size:.74rem; font-weight:600; padding:4px 12px; border-radius:999px; }
.lp-plan h3 { font-size:1.2rem; font-weight:700; color:var(--navy); }
.lp-price { margin:8px 0 16px; }
.lp-price b { font-size:2.2rem; color:var(--navy); }
.lp-price span { color:var(--muted); margin-left:4px; }
.lp-plan ul { list-style:none; padding:0; margin:0 0 22px; display:grid; gap:10px; flex:1; }
.lp-plan li i { color:var(--orange); margin-right:6px; font-size:1.1rem; vertical-align:-3px; }
.lp-note { text-align:center; color:var(--muted); font-size:.88rem; margin:22px 0 0; }
.lp-faq { max-width:780px; margin:0 auto; }
.lp-faq .accordion-item { border:1px solid var(--line); border-radius:12px !important; margin-bottom:10px; overflow:hidden; }
.lp-faq .accordion-button { font-weight:600; color:var(--navy); }
.lp-faq .accordion-button:not(.collapsed) { background:var(--orange-soft); color:var(--navy); box-shadow:none; }
.lp-faq .accordion-button:focus { box-shadow:none; }
.lp-faq .accordion-body { color:var(--muted); }
.lp-final { background:var(--navy); color:#fff; text-align:center; padding:64px 0; }
.lp-final h2 { font-weight:700; font-size:clamp(1.5rem,3vw,2.1rem); }
.lp-final p { color:#c3cee2; margin:8px 0 24px; }
.lp-final .btn { margin:4px; }
.lp-foot { background:#0b1c38; color:#aab7cf; padding:30px 0; }
.lp-foot-in { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; }
.lp-foot img { height:30px; width:auto; }
.lp-foot nav { display:flex; flex-wrap:wrap; gap:6px 20px; }
.lp-foot nav a { color:#c3cee2; text-decoration:none; font-size:.92rem; }
.lp-foot nav a:hover { color:#fff; }
@media (max-width:575px) { .lp-section { padding:52px 0; } .lp-hero { padding:36px 0 44px; } }
.lp-final h2 { color:#fff; }
