/*
 * Everscribe landing redesign — enterprise-trust.
 * Scoped under body.home so the dashboard/app UI (style.css) is untouched.
 * Tokens mirror design-system/tokens.css. Fonts self-hosted in /static/fonts.
 */

/* ---- Self-hosted fonts ---- */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/static/fonts/inter-400.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/static/fonts/inter-500.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/static/fonts/inter-600.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('/static/fonts/inter-700.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;src:url('/static/fonts/inter-800.woff2') format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/static/fonts/jetbrains-mono-400.woff2') format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url('/static/fonts/jetbrains-mono-500.woff2') format('woff2')}

/* ---- Tokens ---- */
:root{
  --ink-900:#0a1f33; --ink-800:#0f2942; --ink-700:#163651; --ink-600:#1e3a5f;
  --s-50:#f8fafc; --s-100:#f1f5f9; --s-200:#e2e8f0; --s-300:#cbd5e1; --s-400:#94a3b8;
  --s-500:#64748b; --s-600:#475569; --s-700:#334155; --s-800:#1e293b; --s-900:#0f172a;
  --acc-600:#0b6e78; --acc-500:#0e7c86; --acc-400:#14919c; --acc-50:#e6f4f5; --teal:#5eead4;
  --font-sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SF Mono',monospace;
  --container:1180px;
  --shadow-lg:0 12px 28px rgba(15,23,42,.12),0 4px 10px rgba(15,23,42,.06);
}

/* ---- Base type for landing ---- */
body.landing{font-family:var(--font-sans);-webkit-font-smoothing:antialiased;color:var(--s-900);background:var(--s-50)}

/* =====================================================================
   NAV — solid ink bar on inner pages; transparent overlay on the home hero
   ===================================================================== */
.navbar{
  position:sticky;top:0;z-index:50;
  background:var(--ink-900);border-bottom:1px solid var(--ink-700);box-shadow:none;
}
body.home .navbar{
  position:absolute;top:0;left:0;right:0;z-index:20;
  background:transparent;border-bottom:none;box-shadow:none;
}
.navbar-inner{max-width:var(--container);margin:0 auto;padding:0 32px;height:78px;display:flex;align-items:center;justify-content:space-between}
/* {ES} wordmark in place of the navy logo tile, for dark-hero contrast */
.navbar-logo{display:none}
.navbar-brand{display:inline-flex;align-items:center;text-decoration:none;color:#fff}
.navbar-brand::after{
  content:"{ ES }";
  font-family:var(--font-mono);font-weight:700;font-size:21px;letter-spacing:.06em;color:#fff;
}
.navbar-nav{display:flex;gap:30px;list-style:none;margin:0;padding:0}
.navbar-nav-link{color:#cbd5e1;font-size:14px;font-weight:500;text-decoration:none;transition:color .15s}
.navbar-nav-link:hover{color:#fff}
.navbar-avatar-wrapper{border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:5px 13px 5px 6px;gap:8px}
.navbar-avatar-wrapper:hover{background:rgba(255,255,255,.08)}
.navbar-avatar{width:28px;height:28px;border-color:rgba(255,255,255,.22)}
.navbar-username{color:#e2e8f0}
.navbar-cog{filter:brightness(0) invert(1);opacity:.85}
.navbar-cog-wrapper{border-radius:9px;transition:background .15s}
.navbar-cog-wrapper:hover{background:rgba(255,255,255,.08)}

/* =====================================================================
   HERO
   ===================================================================== */
.es-hero{
  position:relative;overflow:hidden;
  background:radial-gradient(1200px 620px at 75% -12%,#1b3f63 0%,var(--ink-800) 46%,var(--ink-900) 100%);
  color:#fff;padding:150px 0 96px;
}
.es-hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(920px 520px at 70% 2%,#000,transparent 76%);
          mask-image:radial-gradient(920px 520px at 70% 2%,#000,transparent 76%);
}
.es-hero-wrap{position:relative;z-index:1;max-width:var(--container);margin:0 auto;padding:0 32px;display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:center}
.es-hero-head{text-align:left;max-width:560px}
.es-pill{
  display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;letter-spacing:.03em;
  color:#a7f3e4;background:rgba(94,234,212,.10);border:1px solid rgba(94,234,212,.25);
  padding:6px 14px;border-radius:999px;margin-bottom:26px;
  text-decoration:none;transition:background .15s,border-color .15s;
}
.es-pill:hover{background:rgba(94,234,212,.18);border-color:rgba(94,234,212,.45)}
.es-pill .dot{width:7px;height:7px;border-radius:999px;background:var(--teal)}
.es-hero h1{
  font-size:clamp(34px,3.8vw,50px);font-weight:800;letter-spacing:-.025em;line-height:1.07;margin:0 0 20px;
}
.es-hero h1 .grad{background:linear-gradient(120deg,#7dd3fc,var(--teal));-webkit-background-clip:text;background-clip:text;color:transparent}
.es-hero-sub{font-size:clamp(16px,1.4vw,18px);color:#cbd5e1;line-height:1.6;max-width:520px;margin:0 0 32px}
.es-hero-list{list-style:none;margin:0 0 32px;padding:0;display:flex;flex-direction:column;gap:13px}
.es-hero-list li{display:flex;align-items:center;gap:12px;font-size:17px;font-weight:500;color:#e2e8f0}
.es-hero-list svg{width:21px;height:21px;color:var(--teal);flex-shrink:0}
.es-hero-ctas{display:flex;gap:14px;justify-content:flex-start;flex-wrap:wrap;margin-bottom:18px}
.es-btn{font-family:var(--font-sans);font-weight:600;font-size:16px;border-radius:9px;text-decoration:none;display:inline-flex;align-items:center;gap:8px;cursor:pointer;border:1px solid transparent;transition:all .15s;line-height:1}
.es-btn-primary{background:var(--acc-500);color:#fff;padding:14px 26px;box-shadow:0 8px 24px rgba(14,124,134,.35)}
.es-btn-primary:hover{background:var(--acc-600)}
.es-btn-ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.25);padding:14px 26px}
.es-btn-ghost:hover{background:rgba(255,255,255,.16)}
.es-hero-micro{font-family:var(--font-mono);font-size:12.5px;color:var(--s-400)}

/* framed product shot */
.es-frame{position:relative;margin:0}
.es-window{background:#fff;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.10);box-shadow:0 40px 80px rgba(5,16,28,.55),0 12px 30px rgba(5,16,28,.4)}
.es-chrome{display:flex;align-items:center;gap:7px;padding:12px 16px;background:#16263a;border-bottom:1px solid rgba(255,255,255,.06)}
.es-chrome i{width:11px;height:11px;border-radius:999px;display:block}
.es-chrome .addr{margin-left:12px;font-family:var(--font-mono);font-size:11px;color:var(--s-400);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:4px 14px}
.es-window img{display:block;width:100%;height:auto}
.es-float{position:absolute;background:#fff;color:var(--s-900);border-radius:12px;box-shadow:0 18px 40px rgba(5,16,28,.45);padding:13px 16px;display:flex;align-items:center;gap:11px;font-size:13px;font-weight:600}
.es-float.tl{top:48px;left:-26px}
.es-float.br{bottom:36px;right:-26px}
.es-float .fic{width:30px;height:30px;border-radius:8px;background:var(--acc-50);color:var(--acc-600);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.es-float .fic svg{width:16px;height:16px}
.es-float small{display:block;font-weight:400;color:var(--s-500);font-size:11px;margin-top:1px}

/* interactive event inspector (hero) */
.es-inspect{background:#fff;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.10);box-shadow:0 40px 80px rgba(5,16,28,.5),0 12px 30px rgba(5,16,28,.35)}
.es-inspect-bar{display:flex;align-items:center;gap:7px;padding:12px 16px;background:#16263a;border-bottom:1px solid rgba(255,255,255,.06)}
.es-inspect-bar i{width:11px;height:11px;border-radius:999px;display:block}
.es-inspect-addr{margin-left:12px;font-family:var(--font-mono);font-size:11px;color:var(--s-400);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:4px 12px}
.es-inspect-head{padding:18px 20px 15px;border-bottom:1px solid var(--s-200)}
.es-inspect-title{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.ei-action{font-family:var(--font-mono);font-size:16px;font-weight:600;color:var(--ink-900)}
.ei-badge{font-size:11px;font-weight:600;color:#166534;background:#dcfce7;border:1px solid #86efac;padding:3px 9px;border-radius:999px;text-transform:capitalize}
.es-inspect-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:var(--s-500)}
.es-inspect-meta b{color:var(--s-700);font-weight:600}
.es-inspect-meta .ei-dot{color:var(--s-300)}
.es-inspect-tabs{display:flex;gap:4px;padding:10px 14px 0;background:var(--s-50);border-bottom:1px solid var(--s-200)}
.ei-tab{-webkit-appearance:none;appearance:none;font-family:var(--font-sans);font-size:13px;font-weight:600;color:var(--s-500);background:transparent;border:none;border-radius:0;border-bottom:2px solid transparent;padding:9px 13px;cursor:pointer;margin-bottom:-1px;transition:color .15s,border-color .15s}
.ei-tab:hover,.ei-tab:focus,.ei-tab:active{background:transparent}
.ei-tab:hover{color:var(--ink-900)}
.ei-tab.active{color:var(--ink-900);background:transparent;border-bottom-color:var(--acc-500)}
.ei-tab:focus{outline:none}
.ei-tab:focus-visible{outline:2px solid var(--acc-500);outline-offset:-2px}
.es-inspect-body{background:var(--ink-900);min-height:236px}
.es-inspect-body .ei-panel{display:none;margin:0;padding:18px 20px}
.es-inspect-body .ei-panel.active{display:block}
.es-inspect-body pre.ei-panel{font-family:var(--font-mono);font-size:12.5px;line-height:1.7;color:#cbd5e1;white-space:pre;overflow-x:auto}
.es-inspect-body .k{color:#7dd3fc}
.es-inspect-body .s{color:#86efac}
.es-inspect-body .del{display:block;color:#fca5a5;background:rgba(248,113,113,.10);border-radius:3px}
.es-inspect-body .add{display:block;color:#86efac;background:rgba(52,211,153,.12);border-radius:3px}
.ei-meta > div{display:flex;justify-content:space-between;gap:16px;padding:11px 2px;border-bottom:1px solid rgba(255,255,255,.07);font-size:13px}
.ei-meta > div:last-child{border-bottom:none}
.ei-meta span{color:#94a3b8}
.ei-meta b{color:#e2e8f0;font-weight:500;font-family:var(--font-mono);font-size:12px}

@media (max-width:980px){
  .es-hero-wrap{grid-template-columns:1fr;gap:40px}
  .es-hero-head{text-align:center;max-width:640px;margin:0 auto}
  .es-hero-sub{margin-left:auto;margin-right:auto}
  .es-hero-list{width:-moz-fit-content;width:fit-content;margin-left:auto;margin-right:auto}
  .es-hero-ctas{justify-content:center}
  .es-frame{max-width:760px;margin:0 auto;width:100%}
}
@media (max-width:768px){
  /* .navbar-nav mobile behavior lives in style.css (hamburger menu);
     do not re-hide it here or the hamburger reveal cannot override it.
     The dropdown opens on a light surface, so the links need dark text
     rather than the light-on-dark color used in the desktop bar. */
  .navbar-nav-link,
  .navbar-nav-link:hover{color:var(--color-text)}
  .es-hero{padding:120px 0 70px}
  .es-float{display:none}
}
@media (prefers-reduced-motion:reduce){.es-btn{transition:none}}

/* =====================================================================
   SHARED SECTION SCAFFOLD (home)
   ===================================================================== */
body.home .es-section{padding:96px 0}
body.home .es-section-wrap{max-width:var(--container);margin:0 auto;padding:0 32px}
body.home .es-section-wrap.fluid{max-width:1760px;padding:0 48px}
body.home .es-alt{background:var(--s-50)}
body.home .es-eyebrow{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--acc-600);text-align:center;margin:0 0 10px}
body.home .es-h2{font-size:clamp(28px,3.4vw,38px);font-weight:700;letter-spacing:-.02em;text-align:center;margin:0 0 14px;color:var(--ink-900)}
body.home .es-section-sub{font-size:18px;color:var(--s-500);text-align:center;max-width:600px;margin:0 auto 56px;line-height:1.6}

/* ---- Feature cards ---- */
body.home .es-features{background:var(--s-50);border-top:1px solid var(--s-200);border-bottom:1px solid var(--s-200)}
body.home .es-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
body.home .es-feature{background:#fff;border:1px solid var(--s-200);border-radius:16px;padding:26px;box-shadow:0 1px 2px rgba(15,23,42,.05);transition:transform .18s,box-shadow .18s,border-color .18s}
body.home .es-feature:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--s-300)}
body.home .es-feature .fic{width:44px;height:44px;border-radius:11px;background:var(--acc-50);color:var(--acc-600);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
body.home .es-feature .fic svg{width:22px;height:22px}
body.home .es-feature h3{font-size:18px;font-weight:600;letter-spacing:-.01em;margin:0 0 8px;color:var(--ink-900)}
body.home .es-feature p{font-size:14px;color:var(--s-500);line-height:1.6;margin:0}

/* ---- SDK spotlight (reuses .hero-code-block / .code-* so landing.js works) ---- */
body.home .es-sdk{display:grid;grid-template-columns:0.78fr 1.22fr;gap:52px;align-items:center}
body.home .es-sdk-copy .es-eyebrow{text-align:left}
body.home .es-sdk-copy h2{font-size:clamp(26px,3vw,34px);font-weight:700;letter-spacing:-.02em;line-height:1.15;margin:0 0 14px;color:var(--ink-900)}
body.home .es-sdk-copy p{font-size:16px;color:var(--s-500);line-height:1.65;margin:0 0 22px}
body.home .es-sdk-copy .es-btn-link{font-size:14px;font-weight:600;color:var(--acc-600);text-decoration:none}
/* dark code block restyle */
body.home .hero-code-block{background:var(--ink-900);border:1px solid rgba(255,255,255,.08);border-radius:14px;overflow:hidden;box-shadow:0 24px 50px rgba(10,31,51,.25);margin:0;max-width:none}
body.home .code-header{display:flex;align-items:center;gap:8px;padding:12px 16px;background:#16263a;border-bottom:1px solid rgba(255,255,255,.06)}
body.home .code-dot{width:11px;height:11px;border-radius:999px}
body.home .code-dot.red{background:#f87171}body.home .code-dot.yellow{background:#fbbf24}body.home .code-dot.green{background:#34d399}
body.home .code-tabs{display:flex;gap:6px;margin-left:10px}
body.home .code-tab{font-family:var(--font-mono);font-size:12px;font-weight:500;color:var(--s-400);background:transparent;border:none;padding:5px 11px;border-radius:6px;cursor:pointer;transition:all .15s}
body.home .code-tab:hover{color:#fff}
body.home .code-tab.active{color:#fff;background:rgba(255,255,255,.08)}
body.home .code-body{display:none;font-family:var(--font-mono);font-size:13.5px;line-height:1.75;color:#cbd5e1;padding:22px 24px;white-space:normal;overflow-x:auto}
body.home .code-panel.active{display:block}
body.home .code-body .comment{color:#64748b}
body.home .code-body .keyword{color:#7dd3fc}
body.home .code-body .string{color:#86efac}
body.home .code-body .function{color:#a5b4fc}

/* ---- Showcase spotlights ---- */
body.home .es-showcase{display:grid;grid-template-columns:0.8fr 1.2fr;gap:60px;align-items:center}
body.home .es-showcase:last-child{margin-bottom:0}
body.home .es-showcase.reverse{grid-template-columns:1.2fr 0.8fr}
body.home .es-showcase.reverse .es-sc-copy{order:2}
body.home .es-feature-wide .es-section-wrap{max-width:1340px}
body.home .es-showcase.stacked{display:block;text-align:center}
body.home .es-showcase.stacked .es-sc-copy{max-width:680px;margin:0 auto 38px}
body.home .es-showcase.stacked .es-sc-copy p{max-width:600px;margin-left:auto;margin-right:auto}
body.home .es-showcase.stacked .es-shot{max-width:none}
/* NLP interactive query chips + generated results */
body.home .es-nlp-examples{list-style:none;margin:0 auto 22px;padding:0;display:flex;flex-direction:column;gap:10px;align-items:center;width:-moz-fit-content;width:fit-content}
body.home .es-nlp-chip{-webkit-appearance:none;appearance:none;display:inline-flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:13px;color:#cbd5e1;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:9px 16px;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
body.home .es-nlp-chip:hover{background:rgba(255,255,255,.10);color:#fff;border-color:rgba(94,234,212,.45)}
body.home .es-nlp-chip.active{background:rgba(94,234,212,.12);border-color:rgba(94,234,212,.55);color:#fff}
body.home .es-nlp-chip svg{width:15px;height:15px;color:var(--teal);flex-shrink:0}
body.home .es-nlp-result{max-width:780px;margin:0 auto 24px;min-height:174px;text-align:left}
body.home .es-nlp-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:14px;overflow:hidden}
body.home .es-nlp-dsl{font-family:var(--font-mono);font-size:12px;line-height:1.5;color:#94a3b8;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.18);word-break:break-word}
body.home .es-nlp-dsl b{color:#7dd3fc;font-weight:500}
body.home .es-nlp-row{display:grid;grid-template-columns:minmax(150px,auto) 1fr auto;gap:14px;align-items:center;padding:11px 16px;border-bottom:1px solid rgba(255,255,255,.06);font-size:12.5px;animation:es-rowin .35s ease both}
body.home .es-nlp-row:last-child{border-bottom:none}
body.home .es-nlp-row .act{font-family:var(--font-mono);color:#fff}
body.home .es-nlp-row .det{color:#94a3b8;font-family:var(--font-mono);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.home .es-nlp-row .res{font-size:11px;font-weight:600;padding:2px 9px;border-radius:999px;justify-self:end}
body.home .es-nlp-row .res.ok{color:#5eead4;background:rgba(94,234,212,.12)}
body.home .es-nlp-row .res.fail{color:#fca5a5;background:rgba(248,113,113,.12)}
@keyframes es-rowin{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
body.home .es-nlp-loading{display:flex;align-items:center;justify-content:center;gap:12px;padding:60px 16px;color:#a7f3e4;font-family:var(--font-mono);font-size:14px}
body.home .es-nlp-spin{width:16px;height:16px;border-radius:50%;border:2px solid rgba(94,234,212,.25);border-top-color:var(--teal);animation:es-spin .7s linear infinite}
@keyframes es-spin{to{transform:rotate(360deg)}}
@media (max-width:560px){body.home .es-nlp-row{grid-template-columns:1fr auto}body.home .es-nlp-row .det{display:none}}
/* integrations logo grid (SIEM) */
body.home .es-integrations-block{text-align:center;max-width:1000px;margin:0 auto}
body.home .es-integrations-block .es-sc-copy{max-width:640px;margin:0 auto 40px}
body.home .es-integrations-block .es-sc-copy p{max-width:580px;margin-left:auto;margin-right:auto}
body.home .es-integrations{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-bottom:34px}
body.home .es-int{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:12px;padding:26px 14px;background:#fff;border:1px solid var(--s-200);border-radius:14px;box-shadow:0 1px 2px rgba(15,23,42,.05);transition:transform .18s,box-shadow .18s,border-color .18s}
body.home .es-int:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(15,23,42,.10);border-color:var(--s-300)}
body.home .es-int img{height:42px;width:auto;max-width:130px;object-fit:contain}
body.home .es-int svg{height:40px;width:40px;color:var(--acc-500)}
body.home .es-int span{font-size:12.5px;font-weight:600;color:var(--s-700);letter-spacing:-.01em;line-height:1.3}
body.home .es-int-link{font-size:15px;font-weight:600;color:var(--acc-600);text-decoration:none}
body.home .es-int-link:hover{color:var(--acc-500);text-decoration:underline}
@media (max-width:860px){body.home .es-integrations{grid-template-columns:repeat(3,1fr)}}
@media (max-width:480px){body.home .es-integrations{grid-template-columns:repeat(2,1fr)}}

/* ---- CLI section + animated terminal (hero-matching ink bg) ---- */
body.home .es-cli-section{padding:96px 0;color:#fff;background:radial-gradient(1200px 620px at 75% -12%,#1b3f63 0%,var(--ink-800) 46%,var(--ink-900) 100%)}
body.home .es-cli-block{max-width:900px;margin:0 auto;text-align:center}
body.home .es-cli-block .es-sc-copy{max-width:640px;margin:0 auto 32px}
body.home .es-cli-block .es-sc-copy h3{color:#fff}
body.home .es-cli-block .es-sc-copy p{color:#cbd5e1;margin-left:auto;margin-right:auto}
body.home .es-cli-block .es-sc-copy .tag{color:#a7f3e4;background:rgba(94,234,212,.10);border:1px solid rgba(94,234,212,.22)}
body.home .es-cli-block .es-sc-copy a{color:var(--teal)}
body.home .es-cli-cta{text-align:center;margin-top:28px}
body.home .es-cli-cta a{font-size:15px;font-weight:600;color:var(--teal);text-decoration:none}
body.home .es-cli-cta a:hover{text-decoration:underline}
body.home .es-cli-section code{font-family:var(--font-mono);font-size:.88em;background:rgba(255,255,255,.08);padding:1px 6px;border-radius:5px;color:#a7f3e4}
body.home .es-term{max-width:820px;margin:0 auto;text-align:left;background:#0a141f;border:1px solid rgba(255,255,255,.10);border-radius:14px;overflow:hidden;box-shadow:0 30px 60px rgba(5,16,28,.5)}
body.home .es-term-bar{display:flex;align-items:center;gap:7px;padding:11px 14px;background:rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.07)}
body.home .es-term-bar i{width:11px;height:11px;border-radius:999px;display:block}
body.home .es-term-bar span{margin-left:10px;font-family:var(--font-mono);font-size:11px;color:var(--s-500)}
body.home .es-term-body{padding:18px 20px;font-family:var(--font-mono);font-size:13px;line-height:1.85;color:#cbd5e1;min-height:204px}
body.home .es-term-line .p{color:#5eead4}
body.home .es-term-cursor{display:inline-block;width:8px;height:15px;background:var(--teal);margin-left:3px;vertical-align:-2px;animation:es-blink 1s step-end infinite}
@keyframes es-blink{50%{opacity:0}}
body.home .c-cmd{color:#7dd3fc}
body.home .c-flag{color:#a5b4fc}
body.home .c-str{color:#86efac}
body.home .es-term-out{margin-top:12px}
body.home .es-term-out .tl{opacity:0;transform:translateY(3px);transition:opacity .25s ease,transform .25s ease}
body.home .es-term-out .tl.show{opacity:1;transform:none}
body.home .es-term-out .ok{color:#86efac;margin-bottom:8px}
body.home .es-term-out .row{display:grid;grid-template-columns:108px 1fr 70px 60px;gap:12px}
body.home .es-term-out .row .a{color:#fff}
body.home .es-term-out .row .m{color:#64748b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.home .es-term-out .row .f{color:#fca5a5}
body.home .es-term-out .count{color:#64748b;margin-top:8px}
@media (prefers-reduced-motion:reduce){body.home .es-term-out .tl{transition:none}body.home .es-term-cursor{animation:none}}
@media (max-width:560px){body.home .es-term-out .row{grid-template-columns:1fr auto}body.home .es-term-out .row .m{display:none}}
body.home .es-sc-copy .tag{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--acc-600);background:var(--acc-50);padding:5px 11px;border-radius:999px;margin-bottom:16px}
body.home .es-sc-copy h3{font-size:clamp(24px,2.6vw,30px);font-weight:700;letter-spacing:-.02em;line-height:1.18;margin:0 0 12px;color:var(--ink-900)}
body.home .es-sc-copy p{font-size:16px;color:var(--s-500);line-height:1.65;margin:0 0 18px}
body.home .es-sc-copy a{font-size:14px;font-weight:600;color:var(--acc-600);text-decoration:none}
body.home .es-sc-copy p a{font-size:inherit;font-weight:600;text-decoration:none}
body.home .es-shot{border-radius:14px;overflow:hidden;border:1px solid var(--s-200);box-shadow:var(--shadow-lg);background:#fff}
body.home .es-shot .bar{display:flex;align-items:center;gap:7px;padding:11px 14px;background:var(--s-100);border-bottom:1px solid var(--s-200)}
body.home .es-shot .bar i{width:11px;height:11px;border-radius:999px;display:block}
body.home .es-shot .bar .addr{margin-left:10px;font-family:var(--font-mono);font-size:11px;color:var(--s-500);background:#fff;border:1px solid var(--s-200);border-radius:6px;padding:3px 10px}
body.home .es-shot img{display:block;width:100%;height:auto}

/* ---- Showcase sections (full-bleed, 3-way alternating bg: ink / slate / white) ---- */
body.home .es-showcase-section{padding:84px 0}
body.home .es-showcase-section.alt{background:var(--s-50)}
body.home .es-showcase-section.ink{background:radial-gradient(1100px 560px at 75% -18%,#1b3f63 0%,var(--ink-800) 48%,var(--ink-900) 100%);color:#fff}
body.home .es-showcase-section.ink .es-sc-copy h3{color:#fff}
body.home .es-showcase-section.ink .es-sc-copy p{color:#cbd5e1}
body.home .es-showcase-section.ink .es-sc-copy .tag{color:#a7f3e4;background:rgba(94,234,212,.10);border:1px solid rgba(94,234,212,.22)}
body.home .es-showcase-section.ink .es-sc-copy a{color:var(--teal)}
body.home .es-showcase-section.ink .es-shot{border-color:rgba(255,255,255,.10);box-shadow:0 28px 60px rgba(5,16,28,.45)}

/* ---- How it works: interactive walkthrough (step rail + synced stage) ---- */
body.home .es-steps-section{padding:96px 0;background:#fff;border-top:1px solid var(--s-200)}
body.home .es-steps-section .es-section-wrap{max-width:1340px}
@media (min-width:1500px){body.home .es-steps-section .es-section-wrap{max-width:1480px}}
body.home .es-walk{display:grid;grid-template-columns:0.78fr 1.6fr;gap:56px;align-items:center;margin-top:52px}
body.home .es-rail{display:flex;flex-direction:column;gap:8px}
body.home .es-walk-item{-webkit-appearance:none;appearance:none;display:grid;grid-template-columns:38px 1fr;gap:16px;align-items:start;padding:18px 20px;border-radius:13px;cursor:pointer;border:1px solid transparent;background:transparent;text-align:left;font:inherit;color:inherit;width:100%;transition:background .2s,border-color .2s,box-shadow .2s}
body.home .es-walk-num{width:36px;height:36px;border-radius:9px;background:var(--s-200);color:var(--s-500);font-weight:700;display:flex;align-items:center;justify-content:center;font-size:15px;transition:all .2s}
body.home .es-walk-body{display:flex;flex-direction:column}
body.home .es-walk-title{font-size:17px;font-weight:600;letter-spacing:-.01em;color:var(--ink-900);margin-bottom:4px}
body.home .es-walk-desc{font-size:14px;color:var(--s-500);line-height:1.55}
body.home .es-walk-bar{height:3px;background:var(--s-200);border-radius:2px;margin-top:14px;overflow:hidden;opacity:0;transition:opacity .2s}
body.home .es-walk-bar span{display:block;height:100%;width:0;background:var(--acc-500);border-radius:2px}
body.home .es-walk-item:hover{background:var(--s-50)}
body.home .es-walk-item.active{background:#fff;border-color:var(--s-200);box-shadow:0 12px 28px rgba(15,23,42,.10)}
body.home .es-walk-item.active .es-walk-num{background:var(--acc-500);color:#fff}
body.home .es-walk-item.active .es-walk-bar{opacity:1}
body.home .es-walk-item.active .es-walk-bar span{animation:es-fill 5s linear forwards}
@keyframes es-fill{from{width:0}to{width:100%}}
body.home .es-stage{position:relative;aspect-ratio:3/2;border-radius:16px;overflow:hidden;border:1px solid var(--s-200);box-shadow:0 28px 60px rgba(10,31,51,.18);background:#fff}
body.home .es-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;opacity:0;transition:opacity .5s ease}
body.home .es-stage img.active{opacity:1}
body.home .es-steps-cta{text-align:center;margin-top:44px}
body.home .es-steps-cta a{font-size:15px;font-weight:600;color:var(--acc-600);text-decoration:none}
body.home .es-steps-cta a:hover{color:var(--acc-500);text-decoration:underline}
@media (max-width:640px){body.home .es-walk-desc{display:none}}

/* ---- Final CTA band ---- */
body.home .es-cta{background:radial-gradient(900px 400px at 50% -40%,#1b3f63,var(--ink-800) 60%,var(--ink-900));color:#fff;text-align:center;padding:90px 0}
body.home .es-cta h2{font-size:clamp(28px,3.4vw,40px);font-weight:800;letter-spacing:-.025em;margin:0 0 14px}
body.home .es-cta p{font-size:18px;color:#cbd5e1;max-width:520px;margin:0 auto 30px;line-height:1.6}

/* ---- Footer refine (home only) ---- */
body.landing .footer-section{background:var(--ink-900);border-top:1px solid var(--ink-700)}
body.landing .footer-heading{color:#fff;font-weight:600}
body.landing .footer-link,body.landing .footer-bottom-link{color:#94a3b8;transition:color .15s}
body.landing .footer-link:hover,body.landing .footer-bottom-link:hover{color:var(--teal)}
body.landing .footer-description,body.home .copyright{color:#94a3b8}
body.landing .footer-logo-img{display:none}
body.landing .footer-logo a{display:inline-flex;align-items:center;text-decoration:none}
body.landing .footer-logo a::after{content:"{ ES }";font-family:var(--font-mono);font-weight:700;font-size:20px;letter-spacing:.06em;color:#fff}
.footer-social{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;margin-top:16px;border-radius:9px;color:#94a3b8;border:1px solid rgba(255,255,255,.14);transition:color .15s,border-color .15s,background .15s}
.footer-social:hover{color:#fff;border-color:rgba(94,234,212,.45);background:rgba(255,255,255,.05)}
.footer-social svg{width:19px;height:19px}

@media (max-width:860px){
  body.home .es-grid{grid-template-columns:1fr}
  body.home .es-sdk,body.home .es-showcase,body.home .es-showcase.reverse,body.home .es-walk{grid-template-columns:1fr;gap:28px}
  body.home .es-showcase.reverse .es-sc-copy{order:0}
}
@media (prefers-reduced-motion:reduce){
  body.home .es-stage img{transition:none}
  body.home .es-walk-item.active .es-walk-bar span{animation:none;width:100%}
}

/* =====================================================================
   PRICING PAGE
   ===================================================================== */
body.pricing .pricing-section{padding:80px 0 100px}
body.pricing .pricing-section .section-wrapper{max-width:var(--container);margin:0 auto;padding:0 32px;text-align:center}
body.pricing .pricing-section .section-title{font-size:clamp(30px,3.6vw,42px);font-weight:700;letter-spacing:-.02em;color:var(--ink-900);margin:0 0 12px}
body.pricing .pricing-section .section-subtitle{font-size:18px;color:var(--s-500);max-width:560px;margin:0 auto 56px;line-height:1.6}
body.pricing .pricing-grid{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:24px}
body.pricing .pricing-card{box-sizing:border-box;position:relative;display:flex;flex-direction:column;flex:1 1 260px;min-width:250px;max-width:340px;background:#fff;border:1px solid var(--s-200);border-radius:16px;padding:30px 26px;text-align:left;box-shadow:0 1px 2px rgba(15,23,42,.05);transition:box-shadow .18s,transform .18s,border-color .18s}
body.pricing .pricing-card:hover{box-shadow:0 12px 28px rgba(15,23,42,.10);transform:translateY(-3px);border-color:var(--s-300)}
body.pricing .pricing-card.featured{border-color:var(--acc-500);box-shadow:0 16px 44px rgba(14,124,134,.16)}
body.pricing .pricing-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--acc-500);color:#fff;font-size:12px;font-weight:600;padding:5px 14px;border-radius:999px;white-space:nowrap}
body.pricing .pricing-tier{font-size:18px;font-weight:600;color:var(--ink-900);margin-bottom:14px}
body.pricing .pricing-toggle-card{display:inline-flex;gap:2px;background:var(--s-100);border:1px solid var(--s-200);border-radius:999px;padding:3px;margin-bottom:16px}
body.pricing .pricing-toggle-option{-webkit-appearance:none;appearance:none;border:none;background:transparent;font-family:var(--font-sans);font-size:12.5px;font-weight:600;color:var(--s-500);padding:5px 14px;border-radius:999px;cursor:pointer;transition:color .15s}
body.pricing .pricing-toggle-option:hover{color:var(--ink-900);background:transparent}
body.pricing .pricing-toggle-option.is-active{background:#fff;color:var(--ink-900);box-shadow:0 1px 2px rgba(15,23,42,.14)}
body.pricing .pricing-price{font-size:40px;font-weight:800;letter-spacing:-.02em;color:var(--ink-900);line-height:1;margin-bottom:8px}
body.pricing .pricing-price span{font-size:15px;font-weight:500;color:var(--s-500);letter-spacing:0}
body.pricing .pricing-events{font-size:14px;color:var(--s-500);line-height:1.5;margin-bottom:22px}
body.pricing .pricing-features{list-style:none;margin:0 0 26px;padding:0;display:flex;flex-direction:column;gap:11px;flex-grow:1}
body.pricing .pricing-features li{position:relative;padding-left:26px;font-size:14px;color:var(--s-700);line-height:1.45}
body.pricing .pricing-features li::before{position:absolute;left:0;top:0;font-weight:700}
body.pricing .pricing-features .feature-yes::before{content:"\2713";color:var(--acc-500)}
body.pricing .pricing-features .feature-no{color:var(--s-400)}
body.pricing .pricing-features .feature-no::before{content:"\00d7";color:var(--s-300)}
body.pricing .pricing-cta{display:block;text-align:center;font-size:15px;font-weight:600;padding:12px 18px;border-radius:9px;text-decoration:none;margin-top:auto;transition:background .15s,border-color .15s}
body.pricing .pricing-cta-primary{background:var(--acc-500);color:#fff;border:1px solid var(--acc-500)}
body.pricing .pricing-cta-primary:hover{background:var(--acc-600);border-color:var(--acc-600)}
body.pricing .pricing-cta-secondary{background:#fff;color:var(--ink-900);border:1px solid var(--s-300)}
body.pricing .pricing-cta-secondary:hover{background:var(--acc-50);border-color:var(--acc-500);color:var(--acc-600)}

/* =====================================================================
   CONTACT PAGE
   ===================================================================== */
body.contact .contact-section{padding:80px 0 100px}
body.contact .contact-container{max-width:680px;margin:0 auto;padding:0 32px}
body.contact .contact-header{text-align:center;margin-bottom:38px}
body.contact .contact-title{font-size:clamp(30px,3.6vw,42px);font-weight:700;letter-spacing:-.02em;color:var(--ink-900);margin:0 0 12px}
body.contact .contact-subtitle{font-size:18px;color:var(--s-500);line-height:1.6;margin:0}
body.contact .contact-form-wrapper{background:#fff;border:1px solid var(--s-200);border-radius:16px;padding:32px;box-shadow:var(--shadow-lg)}
body.contact .form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
body.contact .form-group{margin-bottom:18px}
body.contact .form-label{display:block;font-size:13px;font-weight:600;color:var(--s-700);margin-bottom:6px}
body.contact .form-input{box-sizing:border-box;width:100%;font-family:var(--font-sans);font-size:15px;color:var(--ink-900);background:#fff;border:1px solid var(--s-300);border-radius:9px;padding:11px 14px;transition:border-color .15s,box-shadow .15s}
body.contact .form-input::placeholder{color:var(--s-400)}
body.contact .form-input:focus{outline:none;border-color:var(--acc-500);box-shadow:0 0 0 3px var(--acc-50)}
body.contact .form-textarea{min-height:140px;resize:vertical;line-height:1.5}
body.contact .contact-btn{-webkit-appearance:none;appearance:none;display:inline-flex;align-items:center;gap:8px;background:var(--acc-500);color:#fff;font-family:var(--font-sans);font-weight:600;font-size:16px;padding:13px 24px;border:none;border-radius:9px;cursor:pointer;transition:background .15s}
body.contact .contact-btn:hover{background:var(--acc-600)}
body.contact .contact-btn .btn-icon{width:18px;height:18px}
body.contact .form-message{padding:12px 16px;border-radius:9px;font-size:14px;margin-bottom:20px;border:1px solid}
body.contact .form-message-success{background:#dcfce7;color:#166534;border-color:#86efac}
body.contact .form-message-error{background:#fef2f2;color:#991b1b;border-color:#fecaca}
@media (max-width:560px){body.contact .form-row{grid-template-columns:1fr}}

/* =====================================================================
   BLOG (list + article)
   ===================================================================== */
body.blog .blog-section{padding:80px 0 100px}
body.blog .blog-section .section-wrapper{max-width:var(--container);margin:0 auto;padding:0 32px}
body.blog .blog-section .section-title{font-size:clamp(30px,3.6vw,42px);font-weight:700;letter-spacing:-.02em;text-align:center;color:var(--ink-900);margin:0 0 12px}
body.blog .blog-section .section-subtitle{font-size:18px;color:var(--s-500);text-align:center;max-width:560px;margin:0 auto 56px;line-height:1.6}
body.blog .blog-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:24px}
body.blog .blog-card{flex:0 1 360px;max-width:100%;display:flex;flex-direction:column;background:#fff;border:1px solid var(--s-200);border-radius:16px;overflow:hidden;box-shadow:0 1px 2px rgba(15,23,42,.05);transition:transform .18s,box-shadow .18s,border-color .18s}
body.blog .blog-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--s-300)}
body.blog .blog-card-image{aspect-ratio:16/9;background:var(--s-100);overflow:hidden}
body.blog .blog-card-img{width:100%;height:100%;object-fit:cover;display:block}
body.blog .blog-card-body{padding:22px 24px;display:flex;flex-direction:column;flex-grow:1}
body.blog .blog-card-date{font-size:12px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--acc-600);margin-bottom:9px}
body.blog .blog-card-title{font-size:19px;font-weight:600;letter-spacing:-.01em;line-height:1.3;margin:0 0 10px}
body.blog .blog-card-title a{color:var(--ink-900);text-decoration:none}
body.blog .blog-card-title a:hover{color:var(--acc-600)}
body.blog .blog-card-excerpt{font-size:14px;color:var(--s-500);line-height:1.6;margin:0}

body.blog .blog-single{padding:64px 0 100px}
body.blog .blog-single .section-wrapper{max-width:760px;margin:0 auto;padding:0 32px}
body.blog .blog-single-image{border-radius:14px;overflow:hidden;margin-bottom:30px;border:1px solid var(--s-200)}
body.blog .blog-single-img{width:100%;display:block}
body.blog .blog-single-title{font-size:clamp(30px,4vw,44px);font-weight:800;letter-spacing:-.02em;line-height:1.12;color:var(--ink-900);margin:0 0 14px}
body.blog .blog-single-meta{font-size:14px;color:var(--s-500);margin-bottom:36px;padding-bottom:24px;border-bottom:1px solid var(--s-200)}
body.blog .blog-single-content{font-size:17px;line-height:1.75;color:var(--s-700)}
body.blog .blog-single-content > *:first-child{margin-top:0}
body.blog .blog-single-content p{margin:0 0 1.25em}
body.blog .blog-single-content h2{font-size:26px;font-weight:700;letter-spacing:-.01em;color:var(--ink-900);margin:1.9em 0 .6em;line-height:1.25}
body.blog .blog-single-content h3{font-size:20px;font-weight:600;color:var(--ink-900);margin:1.6em 0 .5em}
body.blog .blog-single-content a{color:var(--acc-600);text-decoration:underline;text-underline-offset:2px}
body.blog .blog-single-content a:hover{color:var(--acc-500)}
body.blog .blog-single-content strong{font-weight:600;color:var(--ink-900)}
body.blog .blog-single-content ul,body.blog .blog-single-content ol{margin:0 0 1.25em;padding-left:1.4em}
body.blog .blog-single-content li{margin:0 0 .5em}
body.blog .blog-single-content blockquote{margin:0 0 1.5em;padding:12px 18px;border-left:3px solid var(--acc-500);background:var(--acc-50);color:var(--s-600);border-radius:0 8px 8px 0}
body.blog .blog-single-content blockquote p{margin:0}
body.blog .blog-single-content code{font-family:var(--font-mono);font-size:.88em;background:var(--s-100);border:1px solid var(--s-200);border-radius:5px;padding:1px 6px;color:var(--ink-800)}
body.blog .blog-single-content pre{background:var(--ink-900);color:#cbd5e1;font-family:var(--font-mono);font-size:13.5px;line-height:1.7;padding:18px 20px;border-radius:12px;overflow-x:auto;margin:0 0 1.5em}
body.blog .blog-single-content pre code{background:none;border:none;padding:0;color:inherit;font-size:13.5px}
body.blog .blog-single-content img{max-width:100%;border-radius:10px;margin:1em 0}
body.blog .blog-single-content hr{border:none;border-top:1px solid var(--s-200);margin:2em 0}

/* =====================================================================
   LEGAL (privacy / terms / cookie) + 404
   ===================================================================== */
body.legal .legal-section{padding:64px 0 100px}
body.legal .legal-section .section-wrapper{max-width:760px;margin:0 auto;padding:0 32px}
body.legal .legal-title{font-size:clamp(30px,4vw,42px);font-weight:800;letter-spacing:-.02em;color:var(--ink-900);margin:0 0 10px}
body.legal .legal-updated{font-size:14px;color:var(--s-500);margin:0 0 36px;padding-bottom:24px;border-bottom:1px solid var(--s-200)}
body.legal .legal-content{font-size:16px;line-height:1.75;color:var(--s-700)}
body.legal .legal-content h2{font-size:22px;font-weight:700;letter-spacing:-.01em;color:var(--ink-900);margin:1.8em 0 .5em}
body.legal .legal-content h3{font-size:17px;font-weight:600;color:var(--ink-900);margin:1.4em 0 .4em}
body.legal .legal-content p{margin:0 0 1.1em}
body.legal .legal-content ul,body.legal .legal-content ol{margin:0 0 1.1em;padding-left:1.4em}
body.legal .legal-content li{margin:0 0 .5em}
body.legal .legal-content a{color:var(--acc-600);text-decoration:underline;text-underline-offset:2px}
body.legal .legal-content strong{font-weight:600;color:var(--ink-900)}

body.notfound .es-404{min-height:62vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:80px 32px}
body.notfound .es-404-code{font-family:var(--font-mono);font-size:clamp(72px,13vw,128px);font-weight:700;line-height:1;letter-spacing:-.03em;color:var(--acc-500);margin-bottom:6px}
body.notfound .es-404-title{font-size:clamp(26px,3vw,34px);font-weight:700;letter-spacing:-.02em;color:var(--ink-900);margin:0 0 10px}
body.notfound .es-404-sub{font-size:18px;color:var(--s-500);margin:0 0 28px}
body.notfound .es-404 .es-btn-primary{display:inline-flex}

/* =====================================================================
   DOCS — remap legacy --color-* tokens to the enterprise-trust palette
   (docs.css is fully token-driven, so this retokenizes the whole surface)
   ===================================================================== */
body.docs{
  --color-brand:var(--acc-600);
  --color-brand-hover:var(--acc-500);
  --color-bg:var(--s-50);
  --color-surface:#fff;
  --color-border:var(--s-200);
  --color-border-strong:var(--s-300);
  --color-text:var(--s-900);
  --color-text-secondary:var(--s-700);
  --color-text-muted:var(--s-500);
  --color-text-subtle:var(--s-400);
}
body.docs .docs-body code{font-family:var(--font-mono)}
body.docs .docs-body pre,body.docs .docs-body pre code,body.docs .chroma,body.docs .chroma code{font-family:var(--font-mono)}

/* hero brand kicker + steps eyebrow pill (matches showcase .tag pills) */
.es-hero-brand{font-size:14px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--teal);margin:2px 0 14px}
body.home .es-steps-eyebrow{text-align:center;margin:0 0 14px}
body.home .es-steps-eyebrow .es-tag{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--acc-600);background:var(--acc-50);padding:5px 12px;border-radius:999px}
