/* LekhaBooks — UI Kit (standalone design system for page mockups) */
*,*::before,*::after{box-sizing:border-box}
:root{
  --brand:#0d9488;--brand-hover:#0f766e;--brand-active:#115e59;--brand-tint:#f0fdfa;--brand-soft:#ccfbf1;--brand-on:#fff;
  --ink:#0f172a;--ink-2:#1e293b;--muted:#64748b;--line:#e2e8f0;--line-2:#cbd5e1;
  --paper:#fff;--paper-2:#f1f4f8;--paper-3:#e8edf3;--gold:#c89732;
  --success:#15a35a;--success-bg:#dcfce7;--warn:#b45309;--warn-bg:#fef3c7;--danger:#b91c1c;--danger-bg:#fee2e2;--info:#2563eb;--info-bg:#dbeafe;
  --r:14px;--r-sm:10px;--r-pill:999px;
  --sh-xs:0 1px 2px rgba(15,23,42,.05);--sh:0 1px 2px rgba(15,23,42,.04),0 8px 24px rgba(15,23,42,.06);--sh-lg:0 24px 56px rgba(15,23,42,.16);
  --serif:'Georgia','Times New Roman',serif;--sans:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}
body{margin:0;font-family:var(--sans);color:var(--ink-2);background:var(--paper-2);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--brand-hover);text-decoration:none}
h1,h2,h3,h4{margin:0;color:var(--ink)}
.muted{color:var(--muted)} .right{text-align:right}
.num{text-align:right;font-variant-numeric:tabular-nums}
.divider{height:1px;background:var(--line);border:0;margin:16px 0} .spacer{flex:1}
.topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:22px;height:60px;padding:0 22px;background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line)}
.brand{font-weight:800;font-size:18px;letter-spacing:-.02em} .brand span{color:var(--brand)}
.co-badge,.fy-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:var(--r-pill);font-size:12px;font-weight:600;border:1px solid var(--brand-soft);background:var(--brand-tint);color:var(--brand-active)}
.top-actions{display:flex;align-items:center;gap:9px;margin-left:auto}
.t-pill{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--ink-2);font-weight:600;font-size:13px;cursor:pointer}
.t-pill:hover{border-color:var(--brand);color:var(--brand)}
.avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand-active));color:#fff;display:grid;place-items:center;font-weight:700}
.nav{display:flex;gap:4px;padding:0 16px;background:#fff;border-bottom:1px solid var(--line);overflow-x:auto}
.nav-item{display:inline-flex;align-items:center;gap:6px;padding:12px 14px;color:var(--muted);font-weight:600;font-size:13.5px;white-space:nowrap;border:0;background:none;cursor:pointer;border-radius:10px;margin:6px 0}
.nav-item:hover{color:var(--brand-active);background:var(--brand-tint)}
.nav-item.active{color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-hover));box-shadow:0 8px 18px -9px rgba(13,148,136,.85)}
.page{max-width:1280px;margin:0 auto;padding:22px}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.crumb{font-size:12px;color:var(--muted);letter-spacing:.04em;text-transform:uppercase;margin-bottom:6px}
.page-title{font-family:var(--serif);font-size:30px;font-weight:700;letter-spacing:-.01em}
.page-actions{display:flex;gap:9px;flex-wrap:wrap}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);overflow:hidden}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line)}
.card-title{font-size:15px;font-weight:700} .card-body{padding:18px}
.grid{display:grid;gap:16px}
.grid.cols-2{grid-template-columns:repeat(2,1fr)} .grid.cols-3{grid-template-columns:repeat(3,1fr)} .grid.cols-4{grid-template-columns:repeat(4,1fr)}
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:16px 18px}
.stat-label{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:600}
.stat-value{font-size:26px;font-weight:800;letter-spacing:-.02em;margin-top:6px;font-variant-numeric:tabular-nums;color:var(--ink)}
.stat-sub{font-size:12px;color:var(--muted);margin-top:4px}
.t-wrap{overflow:auto}
.table{width:100%;border-collapse:collapse;font-size:13.5px}
.table th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700;padding:11px 12px;background:var(--paper-2);border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0}
.table td{padding:12px;border-bottom:1px solid var(--line);vertical-align:middle}
.table tbody tr:hover{background:var(--brand-tint)}
.table tfoot td{font-weight:700;background:var(--paper-2);border-top:2px solid var(--brand-soft)}
.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:var(--r-pill);font-size:11.5px;font-weight:700;border:1px solid transparent;background:var(--paper-2);color:var(--ink-2)}
.badge.is-success{color:var(--success);background:var(--success-bg);border-color:#bbf7d0}
.badge.is-warn{color:var(--warn);background:var(--warn-bg);border-color:#fde68a}
.badge.is-danger{color:var(--danger);background:var(--danger-bg);border-color:#fecaca}
.badge.is-info{color:var(--info);background:var(--info-bg);border-color:#bfdbfe}
.badge.is-brand{color:var(--brand-active);background:var(--brand-soft);border-color:#99f6e4}
.pill{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:var(--r-pill);font-size:12px;font-weight:600;background:var(--paper-2);color:var(--ink-2)}
.btn{display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border-radius:11px;border:1px solid var(--line);background:#fff;color:var(--ink-2);font-weight:600;font-size:13.5px;cursor:pointer;transition:transform .12s,box-shadow .12s,filter .12s}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(180deg,var(--brand-hover),var(--brand-active));color:#fff;border-color:transparent;box-shadow:0 8px 20px -8px rgba(13,148,136,.7)}
.btn-secondary{background:#fff;border-color:var(--line)} .btn-secondary:hover{border-color:var(--brand);color:var(--brand)}
.btn-ghost{background:transparent;border-color:transparent;color:var(--muted)} .btn-ghost:hover{background:var(--brand-tint);color:var(--brand-active)}
.btn-danger{background:#fff;border-color:#fecaca;color:var(--danger)}
.btn-sm{padding:6px 10px;font-size:12.5px;border-radius:9px}
.field{margin-bottom:14px}
.label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-2);font-weight:700;margin-bottom:6px}
.input,.select,.textarea{width:100%;min-height:42px;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;font:inherit;color:var(--ink-2)}
.input:focus,.select:focus,.textarea:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px rgba(13,148,136,.18)}
.textarea{min-height:80px;resize:vertical} .help{font-size:11px;color:var(--muted);margin-top:5px}
.seg{display:inline-flex;background:var(--paper-2);border-radius:10px;padding:3px}
.seg button{border:0;background:none;padding:7px 13px;border-radius:8px;font-weight:600;color:var(--muted);cursor:pointer}
.seg button.on{background:#fff;color:var(--brand-active);box-shadow:var(--sh-xs)}
.tabs{display:flex;gap:18px;border-bottom:1px solid var(--line);margin-bottom:18px;flex-wrap:wrap}
.tab{padding:11px 2px;border:0;border-bottom:2px solid transparent;color:var(--muted);font-weight:600;cursor:pointer;background:none}
.tab.active{color:var(--brand-active);border-bottom-color:var(--brand)}
.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--r-pill);border:1px solid var(--line);background:#fff;font-size:13px;font-weight:600;cursor:pointer}
.chip:hover,.chip.active{border-color:var(--brand);background:var(--brand-tint);color:var(--brand-active)}
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.search{flex:1;min-width:220px;display:flex;align-items:center;gap:8px;padding:9px 13px;border:1px solid var(--line);border-radius:10px;background:#fff}
.search input{border:0;outline:0;flex:1;font:inherit;background:none}
.empty{text-align:center;padding:48px 20px;color:var(--muted)}
.row{display:flex;align-items:center;gap:10px} .stack{display:flex;flex-direction:column;gap:4px}
@media(max-width:1000px){.grid.cols-4{grid-template-columns:repeat(2,1fr)}.grid.cols-3{grid-template-columns:1fr}.grid.cols-2{grid-template-columns:1fr}}

/* ===== Lekha motion (premium) ===== */
@media (prefers-reduced-motion: no-preference){
  /* scroll reveal w/ stagger + blur (class added by JS so no-JS = visible) */
  .lb-reveal{opacity:0;transform:translateY(30px) scale(.97);filter:blur(8px);
    transition:opacity .75s cubic-bezier(.2,.75,.2,1),transform .75s cubic-bezier(.2,.75,.2,1),filter .6s ease;
    transition-delay:var(--lb-d,0ms);will-change:opacity,transform,filter}
  .lb-reveal.lb-in{opacity:1;transform:none;filter:none}

  /* cards: lift + colored glow + sheen sweep */
  .feat,.tcard,.plan{position:relative;overflow:hidden;
    transition:transform .28s cubic-bezier(.2,.75,.2,1),box-shadow .28s ease}
  .feat::after,.tcard::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
    background:linear-gradient(120deg,transparent 32%,rgba(255,255,255,.45) 50%,transparent 68%);
    transform:translateX(-130%);transition:transform .8s cubic-bezier(.2,.75,.2,1)}
  .feat:hover,.tcard:hover,.plan:hover{transform:translateY(-8px)}
  .feat:hover,.plan:hover{box-shadow:0 26px 56px rgba(13,148,136,.22)}
  .feat:hover::after,.tcard:hover::after{transform:translateX(130%)}
  .ficon{transition:transform .4s cubic-bezier(.2,.75,.2,1)}
  .feat:hover .ficon{transform:translateY(-5px) scale(1.14) rotate(-7deg)}
  .chip{transition:transform .18s ease,background .18s ease}
  .feat:hover .chip{transform:translateY(-2px)}

  /* buttons: shine sweep + lift + glow */
  .btn{position:relative;overflow:hidden;isolation:isolate;
    transition:transform .18s ease,box-shadow .22s ease,filter .2s ease}
  .btn::after{content:"";position:absolute;top:0;left:-160%;width:55%;height:100%;z-index:-1;
    background:linear-gradient(120deg,transparent,rgba(255,255,255,.5),transparent);
    transform:skewX(-22deg);transition:left .65s cubic-bezier(.2,.75,.2,1)}
  .btn:hover{transform:translateY(-2px)}
  .btn:hover::after{left:170%}
  .btn-primary:hover,.btn-xl:hover,.btn.light:hover{box-shadow:0 16px 38px rgba(13,148,136,.36)}

  /* gradient shimmer on highlighted heading word */
  @keyframes lb-shimmer{to{background-position:200% center}}
  .hl{background:linear-gradient(90deg,var(--brand) 0%,#10b981 25%,#22d3ee 50%,#10b981 75%,var(--brand) 100%) !important;
    background-size:200% auto !important;-webkit-background-clip:text !important;background-clip:text !important;
    -webkit-text-fill-color:transparent !important;color:transparent !important;
    animation:lb-shimmer 4.5s linear infinite}

  /* stat numbers pop on hover */
  .stripband .v{transition:transform .3s cubic-bezier(.2,.75,.2,1)}
  .stripband .s:hover .v{transform:scale(1.08)}

  /* idle float on feature icons */
  @keyframes lb-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
  .feat .ficon{animation:lb-float 5s ease-in-out infinite}
  .feat:hover .ficon{animation:none}

  /* glassy, shrinking header on scroll */
  header.mkt-header{transition:box-shadow .3s ease,background .3s ease,backdrop-filter .3s ease,padding .3s ease}
  header.mkt-header.lb-scrolled{box-shadow:0 8px 30px rgba(15,23,42,.12);
    backdrop-filter:saturate(1.3) blur(10px);-webkit-backdrop-filter:saturate(1.3) blur(10px)}

  /* soft animated aurora glow behind hero text */
  .hero{position:relative;overflow:hidden}
  .hero .wrap{position:relative;z-index:1}
  @keyframes lb-aurora{0%{transform:translate(-6%,-4%) scale(1)}50%{transform:translate(6%,4%) scale(1.15)}100%{transform:translate(-6%,-4%) scale(1)}}
  .hero::before{content:"";position:absolute;z-index:0;top:-30%;left:50%;width:120%;height:140%;transform:translateX(-50%);pointer-events:none;
    background:radial-gradient(40% 40% at 30% 35%,rgba(34,211,238,.16),transparent 60%),radial-gradient(40% 40% at 70% 30%,rgba(13,148,136,.18),transparent 60%),radial-gradient(45% 45% at 55% 70%,rgba(16,185,129,.14),transparent 60%);
    filter:blur(20px);animation:lb-aurora 14s ease-in-out infinite}
}
/* plan badge fix */
.plan{overflow:visible !important}

/* lb-statbar */
.lb-statbar{position:relative;overflow:hidden;color:#fff;isolation:isolate;padding:13px 0;
  background:linear-gradient(90deg,#34d399,#22d3ee,#34d399) center top/100% 2px no-repeat,
  linear-gradient(120deg,#0b1220 0%,#0f172a 45%,#0c5048 100%)}
.lb-statbar::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(55% 130% at 16% 0%,rgba(34,211,238,.20),transparent 60%),
            radial-gradient(55% 150% at 84% 100%,rgba(16,185,129,.22),transparent 60%)}
.lb-statbar::after{content:"";position:absolute;top:0;left:-35%;width:35%;height:100%;z-index:-1;pointer-events:none;
  background:linear-gradient(110deg,transparent,rgba(255,255,255,.08),transparent);transform:skewX(-20deg);
  animation:lb-sheen 7s ease-in-out infinite}
@keyframes lb-sheen{0%{left:-35%}55%,100%{left:135%}}
.lb-statbar-in{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;padding:0}
.lb-statbar-label{font-weight:800;letter-spacing:.16em;text-transform:uppercase;font-size:13px;line-height:1.55;max-width:250px;
  color:transparent;background:linear-gradient(90deg,#fff,rgba(255,255,255,.55));-webkit-background-clip:text;background-clip:text}
.lb-statbar-stats{display:flex;align-items:center;gap:0;flex-wrap:wrap}
.lb-stat{position:relative;padding:2px 30px;text-align:left}
.lb-stat::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);height:42px;width:1px;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.24),transparent)}
.lb-stat:first-child::before{display:none}
.lb-stat-v{font-family:var(--serif);font-weight:700;font-size:clamp(26px,2.6vw,34px);line-height:1;color:#fff;
  text-shadow:0 0 28px rgba(34,211,238,.25)}
.lb-stat-v span{background:linear-gradient(90deg,#34d399,#22d3ee);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;font-weight:700}
.lb-stat-l{color:rgba(255,255,255,.6);font-size:13px;margin-top:8px}
@media(max-width:760px){.lb-statbar-in{flex-direction:column;align-items:flex-start;gap:16px;padding:32px 0}
  .lb-stat{padding:0}.lb-stat::before{display:none}.lb-stat-v{font-size:27px}.lb-statbar-stats{gap:22px}}
