/* Home page design (Next.js-style, light). Scoped under #hm / #hm2 so site-wide
   heading/paragraph rules in style.css + custom.css don't leak in.
   Structure note: the testimonials block sits between #hm and #hm2 because
   scripts/sync-customer-carousel.mjs rewrites it in place. */

:is(#hm,#hm2){
  --hm-ink:#0a0a0a; --hm-text:#171717; --hm-muted:#52525b; --hm-faint:#a1a1aa;
  --hm-line:#e4e4e7; --hm-line-2:#f0f0f1; --hm-bg:#fafafa;
  --hm-green:#16a34a; --hm-green-d:#15803d; --hm-mint:#4ade80; --hm-green-bg:#f0fdf4; --hm-green-bd:#bbf7d0;
  --hm-dark:#071a0e; --hm-dark-2:#0d2818;
  --hm-mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-family:'Inter',system-ui,-apple-system,sans-serif;color:var(--hm-text);-webkit-font-smoothing:antialiased;display:block
}
:is(#hm,#hm2) *{box-sizing:border-box}
:is(#hm,#hm2) :where(h1,h2,h3,h4,h5,h6){color:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;letter-spacing:inherit;margin:0}
:is(#hm,#hm2) :where(p){color:inherit;font-size:inherit;line-height:inherit;margin:0}
:is(#hm,#hm2) :where(ul,ol){margin:0;padding:0;list-style:none}
:is(#hm,#hm2) a{text-decoration:none;color:inherit}

:is(#hm,#hm2) .hm-wrap{max-width:1200px;margin:0 auto;padding:0 24px;position:relative}
:is(#hm,#hm2) .hm-mono{font-family:var(--hm-mono)}
:is(#hm,#hm2) .hm-section{position:relative;padding:112px 0}
:is(#hm,#hm2) .hm-section--bg{background:var(--hm-bg);border-top:1px solid var(--hm-line);border-bottom:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-label{display:inline-flex;align-items:center;gap:8px;font:500 .74rem/1 var(--hm-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--hm-muted)}
:is(#hm,#hm2) .hm-label i{width:6px;height:6px;border-radius:50%;background:var(--hm-green);box-shadow:0 0 0 3px rgba(22,163,74,.15)}
:is(#hm,#hm2) .hm-h2{font-size:clamp(2rem,4.2vw,3.25rem);font-weight:600;letter-spacing:-.035em;line-height:1.06;color:var(--hm-ink);margin:16px 0 18px}
:is(#hm,#hm2) .hm-h2 .g{color:var(--hm-green)}
:is(#hm,#hm2) .hm-lead{font-size:1.08rem;line-height:1.7;color:var(--hm-muted);max-width:620px}
:is(#hm,#hm2) .hm-center{text-align:center}
:is(#hm,#hm2) .hm-center .hm-lead{margin-left:auto;margin-right:auto}

/* buttons */
:is(#hm,#hm2) .hm-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 22px;border-radius:10px;font-size:.95rem;font-weight:600;transition:background .2s,box-shadow .2s,transform .2s,border-color .2s;white-space:nowrap}
:is(#hm,#hm2) .hm-btn:hover{transform:translateY(-1px)}
:is(#hm,#hm2) .hm-btn--g{background:var(--hm-green);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 10px 24px -10px rgba(22,163,74,.7)}
:is(#hm,#hm2) .hm-btn--g:hover{background:var(--hm-green-d)}
:is(#hm,#hm2) .hm-btn--o{background:#fff;color:var(--hm-ink);border:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-btn--o:hover{border-color:#d4d4d8;background:#fafafa}
:is(#hm,#hm2) .hm-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
:is(#hm,#hm2) .hm-link{display:inline-flex;align-items:center;gap:6px;font-size:.9rem;font-weight:600;color:var(--hm-green)}
:is(#hm,#hm2) .hm-link svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;transition:transform .2s}
:is(#hm,#hm2) a:hover .hm-link svg,:is(#hm,#hm2) .hm-link:hover svg{transform:translateX(3px)}

/* Next-style frame with + corners */
:is(#hm,#hm2) .hm-frame{position:relative;background:#fff;border:1px solid var(--hm-line);border-radius:16px}
:is(#hm,#hm2) .hm-plus{position:absolute;width:15px;height:15px;pointer-events:none;z-index:3}
:is(#hm,#hm2) .hm-plus::before,:is(#hm,#hm2) .hm-plus::after{content:"";position:absolute;background:#a1a1aa}
:is(#hm,#hm2) .hm-plus::before{left:7px;top:0;width:1px;height:15px}
:is(#hm,#hm2) .hm-plus::after{top:7px;left:0;height:1px;width:15px}
:is(#hm,#hm2) .hm-plus.tl{left:-8px;top:-8px}:is(#hm,#hm2) .hm-plus.tr{right:-8px;top:-8px}
:is(#hm,#hm2) .hm-plus.bl{left:-8px;bottom:-8px}:is(#hm,#hm2) .hm-plus.br{right:-8px;bottom:-8px}

/* ════════ HERO (light) ════════ */
:is(#hm,#hm2) .hm-hero{position:relative;padding:150px 0 0;background:#fff;overflow:hidden;isolation:isolate}
:is(#hm,#hm2) .hm-hero::before{content:"";position:absolute;inset:0;z-index:-2;
  background-image:linear-gradient(to right,rgba(0,0,0,.055) 1px,transparent 1px),linear-gradient(to bottom,rgba(0,0,0,.055) 1px,transparent 1px);
  background-size:64px 64px;background-position:center top;
  -webkit-mask-image:radial-gradient(ellipse 70% 55% at 50% 30%,#000 25%,transparent 75%);mask-image:radial-gradient(ellipse 70% 55% at 50% 30%,#000 25%,transparent 75%)}
:is(#hm,#hm2) .hm-hero::after{content:"";position:absolute;z-index:-1;left:50%;top:48%;width:1100px;height:620px;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(74,222,128,.28),rgba(74,222,128,.08) 55%,transparent 75%);filter:blur(10px);pointer-events:none}
:is(#hm,#hm2) .hm-hero-top{text-align:center;max-width:900px;margin:0 auto}
:is(#hm,#hm2) .hm-badge{display:inline-flex;align-items:center;gap:10px;height:34px;padding:0 14px 0 6px;border-radius:999px;background:#fff;border:1px solid var(--hm-line);box-shadow:0 1px 2px rgba(0,0,0,.04);font-size:.84rem;font-weight:500;color:var(--hm-text);margin-bottom:28px}
:is(#hm,#hm2) .hm-badge b{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;background:var(--hm-green-bg);border:1px solid var(--hm-green-bd);color:var(--hm-green);font:500 .7rem var(--hm-mono);text-transform:uppercase;letter-spacing:.04em}
:is(#hm,#hm2) .hm-badge b i{width:6px;height:6px;border-radius:50%;background:var(--hm-green);animation:hm-pulse 2s ease-in-out infinite}
@keyframes hm-pulse{0%,100%{box-shadow:0 0 0 0 rgba(22,163,74,.5)}50%{box-shadow:0 0 0 5px rgba(22,163,74,0)}}
:is(#hm,#hm2) .hm-hero h1{font-size:clamp(2.8rem,7.4vw,5.6rem) !important;font-weight:600;letter-spacing:-.05em;line-height:.98;color:var(--hm-ink) !important;margin:0 0 26px}
:is(#hm,#hm2) .hm-hero h1 .g{background:linear-gradient(90deg,#15803d,#16a34a 40%,#22c55e);-webkit-background-clip:text;background-clip:text;color:transparent}
:is(#hm,#hm2) .hm-hero-sub{font-size:clamp(1.05rem,1.6vw,1.25rem);line-height:1.6;color:var(--hm-muted);max-width:640px;margin:0 auto 36px}
:is(#hm,#hm2) .hm-hero-sub strong{color:var(--hm-ink);font-weight:600;display:inline-block;min-width:96px;text-align:left;border-bottom:2px solid var(--hm-green)}
:is(#hm,#hm2) .hm-hero-cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:22px}
:is(#hm,#hm2) .hm-hero-note{font:500 .76rem var(--hm-mono);color:var(--hm-faint);display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
:is(#hm,#hm2) .hm-hero-note span{display:inline-flex;align-items:center;gap:6px}
:is(#hm,#hm2) .hm-hero-note span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--hm-green)}

/* hero dashboard */
:is(#hm,#hm2) .hm-stage{position:relative;max-width:1080px;margin:72px auto 0;padding:0 0 0}
:is(#hm,#hm2) .hm-dash{position:relative;border-radius:16px 16px 0 0;border-bottom:0;box-shadow:0 -1px 0 rgba(0,0,0,.02),0 40px 80px -30px rgba(0,0,0,.25),0 0 0 6px rgba(255,255,255,.6)}
:is(#hm,#hm2) .hm-dash-bar{display:flex;align-items:center;gap:14px;height:46px;padding:0 16px;border-bottom:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-dots{display:flex;gap:6px}:is(#hm,#hm2) .hm-dots i{width:10px;height:10px;border-radius:50%;background:#e4e4e7}
:is(#hm,#hm2) .hm-dash-url{flex:1;max-width:420px;margin:0 auto;height:28px;border-radius:7px;background:var(--hm-bg);border:1px solid var(--hm-line);display:flex;align-items:center;justify-content:center;gap:8px;font:500 .74rem var(--hm-mono);color:var(--hm-muted);overflow:hidden;white-space:nowrap}
:is(#hm,#hm2) .hm-dash-url svg{width:12px;height:12px;fill:none;stroke:var(--hm-green);stroke-width:2.2;flex-shrink:0}
:is(#hm,#hm2) .hm-dash-live{font:500 .68rem var(--hm-mono);color:var(--hm-green);display:inline-flex;align-items:center;gap:6px;text-transform:uppercase;letter-spacing:.05em}
:is(#hm,#hm2) .hm-dash-live i{width:6px;height:6px;border-radius:50%;background:var(--hm-green);animation:hm-pulse 2s infinite}
:is(#hm,#hm2) .hm-dash-body{display:grid;grid-template-columns:220px 1fr;min-height:380px}
:is(#hm,#hm2) .hm-side{border-right:1px solid var(--hm-line);padding:18px 12px;display:flex;flex-direction:column;gap:2px;background:#fcfcfc}
:is(#hm,#hm2) .hm-side small{font:500 .64rem var(--hm-mono);color:var(--hm-faint);text-transform:uppercase;letter-spacing:.08em;padding:10px 10px 6px}
:is(#hm,#hm2) .hm-side span{display:flex;align-items:center;gap:10px;height:34px;padding:0 10px;border-radius:8px;font-size:.84rem;color:var(--hm-muted);font-weight:500}
:is(#hm,#hm2) .hm-side span svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
:is(#hm,#hm2) .hm-side span.on{background:#fff;color:var(--hm-ink);box-shadow:0 0 0 1px var(--hm-line),0 1px 2px rgba(0,0,0,.04)}
:is(#hm,#hm2) .hm-side span.on svg{color:var(--hm-green)}
:is(#hm,#hm2) .hm-main{padding:24px;display:flex;flex-direction:column;gap:18px;min-width:0}
:is(#hm,#hm2) .hm-main-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px}
:is(#hm,#hm2) .hm-main-head h4{font-size:1.1rem;font-weight:600;letter-spacing:-.02em;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-main-head p{font-size:.8rem;color:var(--hm-faint);margin-top:2px}
:is(#hm,#hm2) .hm-seg{display:flex;gap:2px;padding:3px;border-radius:8px;background:var(--hm-bg);border:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-seg span{font:500 .7rem var(--hm-mono);padding:5px 9px;border-radius:6px;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-seg span.on{background:#fff;color:var(--hm-ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
:is(#hm,#hm2) .hm-kpis{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:stretch}
:is(#hm,#hm2) .hm-scorebox{display:flex;align-items:center;gap:16px;padding:16px 18px;border:1px solid var(--hm-line);border-radius:12px}
:is(#hm,#hm2) .hm-ring{--v:87;width:92px;height:92px;border-radius:50%;display:grid;place-items:center;position:relative;flex-shrink:0;background:conic-gradient(var(--hm-green) calc(var(--v)*1%),#eef2ee 0)}
:is(#hm,#hm2) .hm-ring::before{content:"";position:absolute;inset:8px;border-radius:50%;background:#fff}
:is(#hm,#hm2) .hm-ring b{position:relative;font-size:1.7rem;font-weight:600;letter-spacing:-.04em;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-scorebox small{display:block;font:500 .66rem var(--hm-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-scorebox strong{display:block;font-size:.92rem;font-weight:600;margin:4px 0 6px;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-up{font:500 .72rem var(--hm-mono);color:var(--hm-green);background:var(--hm-green-bg);border:1px solid var(--hm-green-bd);padding:2px 7px;border-radius:5px}
:is(#hm,#hm2) .hm-engines{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--hm-line);border-radius:12px;overflow:hidden}
:is(#hm,#hm2) .hm-eng{padding:14px;border-right:1px solid var(--hm-line);display:flex;flex-direction:column;gap:8px;min-width:0}
:is(#hm,#hm2) .hm-eng:last-child{border-right:0}
:is(#hm,#hm2) .hm-eng-h{display:flex;align-items:center;gap:7px;font-size:.8rem;font-weight:600;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-eng-h img{width:16px;height:16px}
:is(#hm,#hm2) .hm-eng b{font-size:1.5rem;font-weight:600;letter-spacing:-.04em;color:var(--hm-ink);line-height:1}
:is(#hm,#hm2) .hm-eng b small{font:500 .68rem var(--hm-mono);color:var(--hm-faint);letter-spacing:0;margin-left:4px}
:is(#hm,#hm2) .hm-bar{height:4px;border-radius:9px;background:var(--hm-line-2);overflow:hidden}
:is(#hm,#hm2) .hm-bar i{display:block;height:100%;border-radius:9px;background:var(--hm-green);width:var(--w)}
:is(#hm,#hm2) .hm-bar i.a{background:#f59e0b}
:is(#hm,#hm2) .hm-checks{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
:is(#hm,#hm2) .hm-check{display:flex;align-items:center;gap:9px;height:40px;padding:0 12px;border:1px solid var(--hm-line);border-radius:10px;font-size:.8rem;font-weight:500;color:var(--hm-text);white-space:nowrap;overflow:hidden}
:is(#hm,#hm2) .hm-check i{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;font-style:normal;font-size:.6rem;color:#fff;background:var(--hm-green)}
:is(#hm,#hm2) .hm-check i.w{background:#f59e0b}
:is(#hm,#hm2) .hm-float{position:absolute;z-index:4;background:#fff;border:1px solid var(--hm-line);border-radius:12px;padding:12px 14px;box-shadow:0 20px 40px -16px rgba(0,0,0,.25);animation:hm-bob 6s ease-in-out infinite}
:is(#hm,#hm2) .hm-float small{display:block;font:500 .64rem var(--hm-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-float b{display:block;font-size:1.5rem;font-weight:600;letter-spacing:-.03em;color:var(--hm-ink);line-height:1.1;margin-top:4px}
:is(#hm,#hm2) .hm-float b span{font-size:.8rem;color:var(--hm-faint);font-weight:500}
:is(#hm,#hm2) .hm-float em{font-style:normal;font:500 .7rem var(--hm-mono);color:var(--hm-green)}
:is(#hm,#hm2) .hm-float--a{right:-30px;top:-34px}
:is(#hm,#hm2) .hm-float--b{left:-34px;bottom:70px;animation-delay:-3s}
@keyframes hm-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
:is(#hm,#hm2) .hm-sample{position:absolute;right:16px;bottom:10px;font:500 .64rem var(--hm-mono);color:var(--hm-faint);text-transform:uppercase;letter-spacing:.06em}

/* ════════ TRUST STRIP ════════ */
:is(#hm,#hm2) .hm-trust{border-top:1px solid var(--hm-line);border-bottom:1px solid var(--hm-line);background:#fff;position:relative;z-index:2}
:is(#hm,#hm2) .hm-trust-in{display:grid;grid-template-columns:220px repeat(6,1fr);border-left:1px solid var(--hm-line);border-right:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-trust-in>*{display:flex;align-items:center;gap:10px;height:84px;padding:0 18px;border-right:1px solid var(--hm-line);font-size:.86rem;font-weight:600;color:var(--hm-muted);transition:background .2s,color .2s;min-width:0}
:is(#hm,#hm2) .hm-trust-in>*:last-child{border-right:0}
:is(#hm,#hm2) .hm-trust-in>div:not(:first-child):hover{background:var(--hm-bg);color:var(--hm-ink)}
:is(#hm,#hm2) .hm-trust-in>:first-child{font:500 .7rem/1.5 var(--hm-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-trust-in img,:is(#hm,#hm2) .hm-trust-in svg{width:20px;height:20px;flex-shrink:0}
:is(#hm,#hm2) .hm-trust-in svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* ════════ FEATURES (bordered grid) ════════ */
:is(#hm,#hm2) .hm-grid{display:grid;grid-template-columns:repeat(12,1fr);margin-top:56px;border-radius:16px;overflow:hidden;background:var(--hm-line);gap:1px;border:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-cell{grid-column:span 4;background:#fff;display:flex;flex-direction:column;position:relative;transition:background .25s;min-width:0}
:is(#hm,#hm2) .hm-cell--5{grid-column:span 5}:is(#hm,#hm2) .hm-cell--7{grid-column:span 7}
:is(#hm,#hm2) .hm-cell:hover{background:#fcfcfc}
:is(#hm,#hm2) .hm-cell-art{position:relative;height:250px;overflow:hidden;border-bottom:1px solid var(--hm-line-2);background:radial-gradient(#e4e4e7 1px,transparent 1px) 0 0/16px 16px,#fafafa}
:is(#hm,#hm2) .hm-cell-body{padding:24px 26px 26px;display:flex;flex-direction:column;gap:8px;flex:1}
:is(#hm,#hm2) .hm-cell-body .hm-mono{font-size:.68rem;text-transform:uppercase;letter-spacing:.07em;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-cell-body h3{font-size:1.2rem;font-weight:600;letter-spacing:-.02em;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-cell-body p{font-size:.92rem;line-height:1.6;color:var(--hm-muted)}
:is(#hm,#hm2) .hm-cell-body .hm-link{margin-top:auto;padding-top:10px}
:is(#hm,#hm2) .hm-card{position:absolute;background:#fff;border:1px solid var(--hm-line);border-radius:12px;box-shadow:0 18px 36px -18px rgba(0,0,0,.22)}
/* art: integrations chat */
:is(#hm,#hm2) .hm-pills{position:absolute;left:0;right:0;top:34px;display:flex;justify-content:center;gap:8px;flex-wrap:wrap;padding:0 16px}
:is(#hm,#hm2) .hm-pill{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:999px;background:#fff;border:1px solid var(--hm-line);font-size:.76rem;font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.04)}
:is(#hm,#hm2) .hm-pill img{width:13px;height:13px}
:is(#hm,#hm2) .hm-pill--g{background:var(--hm-green);border-color:var(--hm-green);color:#fff;box-shadow:0 8px 18px -8px rgba(22,163,74,.7)}
:is(#hm,#hm2) .hm-chat{left:24px;right:24px;bottom:28px;padding:14px 16px}
:is(#hm,#hm2) .hm-chat p{font-size:.84rem;font-weight:500;color:var(--hm-ink);line-height:1.45}
:is(#hm,#hm2) .hm-avs{display:flex;margin-top:10px}
:is(#hm,#hm2) .hm-avs span{width:28px;height:28px;border-radius:50%;background:#fff;border:1px solid var(--hm-line);display:grid;place-items:center;margin-left:-6px}
:is(#hm,#hm2) .hm-avs span:first-child{margin-left:0}
:is(#hm,#hm2) .hm-avs img{width:14px;height:14px}
/* art: dashboard */
:is(#hm,#hm2) .hm-mdash{left:26px;right:26px;top:26px;bottom:-12px;padding:16px}
:is(#hm,#hm2) .hm-mdash-h{display:flex;justify-content:space-between;align-items:center;font:500 .7rem var(--hm-mono);color:var(--hm-faint);text-transform:uppercase;letter-spacing:.06em;margin-bottom:12px}
:is(#hm,#hm2) .hm-mdash-row{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:end}
:is(#hm,#hm2) .hm-mdash-row small{display:block;font-size:.72rem;color:var(--hm-muted)}
:is(#hm,#hm2) .hm-mdash-row strong{display:block;font-size:1.8rem;font-weight:600;letter-spacing:-.04em;color:var(--hm-ink);line-height:1.1}
:is(#hm,#hm2) .hm-mdash-row em{font-style:normal;font:500 .68rem var(--hm-mono);color:var(--hm-green)}
:is(#hm,#hm2) .hm-spark{width:100%;height:64px;display:block}
:is(#hm,#hm2) .hm-mdash-bars{display:grid;gap:8px;margin-top:14px}
:is(#hm,#hm2) .hm-mdash-bars div{display:grid;grid-template-columns:60px 1fr 36px;gap:10px;align-items:center;font-size:.74rem;color:var(--hm-muted)}
:is(#hm,#hm2) .hm-mdash-bars b{font:500 .72rem var(--hm-mono);color:var(--hm-ink);text-align:right}
/* art: alerts feed */
:is(#hm,#hm2) .hm-feed{left:22px;right:22px;top:24px;display:flex;flex-direction:column;gap:8px;position:absolute}
:is(#hm,#hm2) .hm-feed>div{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--hm-line);border-radius:10px;padding:9px 11px;font-size:.76rem;color:var(--hm-text);box-shadow:0 8px 20px -14px rgba(0,0,0,.2)}
:is(#hm,#hm2) .hm-feed>div:nth-child(2){margin-left:14px}:is(#hm,#hm2) .hm-feed>div:nth-child(3){margin-left:28px;opacity:.75}
:is(#hm,#hm2) .hm-feed i{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;flex-shrink:0;background:var(--hm-green-bg);border:1px solid var(--hm-green-bd)}
:is(#hm,#hm2) .hm-feed i img{width:12px;height:12px}
:is(#hm,#hm2) .hm-feed em{margin-left:auto;font-style:normal;font:500 .64rem var(--hm-mono);color:var(--hm-faint)}
/* art: automation pipeline */
:is(#hm,#hm2) .hm-pipe{position:absolute;left:24px;right:24px;top:30px;display:flex;flex-direction:column;gap:0}
:is(#hm,#hm2) .hm-pipe>div{display:flex;align-items:center;gap:10px;height:34px;font:500 .74rem var(--hm-mono);color:var(--hm-text);position:relative;padding-left:28px}
:is(#hm,#hm2) .hm-pipe>div::before{content:"";position:absolute;left:6px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:#fff;border:2px solid var(--hm-green)}
:is(#hm,#hm2) .hm-pipe>div::after{content:"";position:absolute;left:10.5px;top:50%;height:34px;width:1px;background:var(--hm-green-bd)}
:is(#hm,#hm2) .hm-pipe>div:last-child::after{display:none}
:is(#hm,#hm2) .hm-pipe>div.done::before{background:var(--hm-green)}
:is(#hm,#hm2) .hm-pipe>div.run::before{border-color:#f59e0b;animation:hm-pulse 2s infinite}
:is(#hm,#hm2) .hm-pipe em{margin-left:auto;font-style:normal;font-size:.66rem;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-pipe .ok{color:var(--hm-green)}
/* art: tracking bars */
:is(#hm,#hm2) .hm-trk{left:22px;right:22px;top:26px;padding:16px}
:is(#hm,#hm2) .hm-trk small{font:500 .64rem var(--hm-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-trk strong{display:block;font-size:.95rem;font-weight:600;margin:4px 0 12px;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-trk-row{display:grid;grid-template-columns:20px 1fr 36px;gap:10px;align-items:center;margin-top:9px}
:is(#hm,#hm2) .hm-trk-row img{width:15px;height:15px}
:is(#hm,#hm2) .hm-trk-row b{font:500 .72rem var(--hm-mono);text-align:right;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-trk .hm-bar{height:6px}

/* ════════ SOLUTIONS SCROLLER ════════ */
:is(#hm,#hm2) .hm-sol-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
:is(#hm,#hm2) .hm-sol-head .hm-h2{text-transform:uppercase;letter-spacing:-.04em}
:is(#hm,#hm2) .hm-arrows{display:flex;gap:8px}
:is(#hm,#hm2) .hm-arrows button{all:unset;cursor:pointer;width:44px;height:44px;border-radius:10px;border:1px solid var(--hm-line);display:grid;place-items:center;color:var(--hm-ink);background:#fff;transition:background .2s,border-color .2s}
:is(#hm,#hm2) .hm-arrows button:hover{background:var(--hm-bg);border-color:#d4d4d8}
:is(#hm,#hm2) .hm-arrows button:focus-visible{outline:2px solid var(--hm-green);outline-offset:2px}
:is(#hm,#hm2) .hm-arrows svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
:is(#hm,#hm2) .hm-track{display:flex;gap:0;margin-top:48px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border:1px solid var(--hm-line);border-radius:16px;background:#fff}
:is(#hm,#hm2) .hm-track::-webkit-scrollbar{display:none}
:is(#hm,#hm2) .hm-slide{flex:0 0 320px;scroll-snap-align:start;border-right:1px solid var(--hm-line);display:flex;flex-direction:column;transition:background .25s}
:is(#hm,#hm2) .hm-slide:last-child{border-right:0}
:is(#hm,#hm2) .hm-slide:hover{background:#fcfcfc}
:is(#hm,#hm2) .hm-slide-top{padding:22px 22px 18px;display:flex;flex-direction:column;gap:14px;flex:1}
:is(#hm,#hm2) .hm-slide-meta{display:flex;justify-content:space-between;align-items:center;font:500 .7rem var(--hm-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-slide-meta span:first-child{color:var(--hm-green)}
:is(#hm,#hm2) .hm-slide h3{font-size:1.2rem;font-weight:600;letter-spacing:-.02em;line-height:1.3;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-slide-go{width:30px;height:30px;border-radius:8px;border:1px solid var(--hm-line);display:grid;place-items:center;transition:all .25s}
:is(#hm,#hm2) .hm-slide-go svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2}
:is(#hm,#hm2) .hm-slide:hover .hm-slide-go{background:var(--hm-green);border-color:var(--hm-green);color:#fff;transform:rotate(-45deg)}
:is(#hm,#hm2) .hm-slide-art{margin:0 18px 18px;border:1px solid var(--hm-line);border-radius:12px;background:#fafafa;padding:14px;height:150px;display:flex;flex-direction:column;justify-content:flex-end;gap:8px}
:is(#hm,#hm2) .hm-slide-art small{font:500 .64rem var(--hm-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--hm-faint);margin-bottom:auto}
:is(#hm,#hm2) .hm-cols{display:flex;align-items:flex-end;gap:5px;height:80px}
:is(#hm,#hm2) .hm-cols i{flex:1;border-radius:3px 3px 1px 1px;background:linear-gradient(180deg,#4ade80,#16a34a);opacity:.35}
:is(#hm,#hm2) .hm-cols i:nth-child(n+7){opacity:.7}:is(#hm,#hm2) .hm-cols i:last-child{opacity:1}
:is(#hm,#hm2) .hm-axis{display:flex;justify-content:space-between;font:500 .6rem var(--hm-mono);color:var(--hm-faint)}
:is(#hm,#hm2) .hm-mini-ring{display:flex;align-items:center;gap:14px}
:is(#hm,#hm2) .hm-mini-ring .hm-ring{--v:87;width:74px;height:74px}
:is(#hm,#hm2) .hm-mini-ring .hm-ring b{font-size:1.1rem}
:is(#hm,#hm2) .hm-legend{display:grid;gap:6px;font:500 .7rem var(--hm-mono);color:var(--hm-muted)}
:is(#hm,#hm2) .hm-legend span{display:flex;align-items:center;gap:7px}
:is(#hm,#hm2) .hm-legend span::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--c,#16a34a)}
:is(#hm,#hm2) .hm-share{display:flex;height:12px;border-radius:9px;overflow:hidden;gap:2px}
:is(#hm,#hm2) .hm-share i{display:block;height:100%}
:is(#hm,#hm2) .hm-logos{display:flex;gap:8px;align-items:center}
:is(#hm,#hm2) .hm-logos span{display:inline-flex;align-items:center;gap:5px;font:500 .64rem var(--hm-mono);color:var(--hm-muted)}
:is(#hm,#hm2) .hm-logos img{width:13px;height:13px}
:is(#hm,#hm2) .hm-vitals{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
:is(#hm,#hm2) .hm-vitals div{background:#fff;border:1px solid var(--hm-line);border-radius:8px;padding:8px 6px;text-align:center}
:is(#hm,#hm2) .hm-vitals b{display:block;font:500 .82rem var(--hm-mono);color:var(--hm-ink)}
:is(#hm,#hm2) .hm-vitals span{font:500 .58rem var(--hm-mono);color:var(--hm-faint);text-transform:uppercase}
:is(#hm,#hm2) .hm-vitals i{display:block;height:3px;border-radius:3px;background:var(--hm-green);margin-top:6px}
:is(#hm,#hm2) .hm-alist{display:grid;gap:6px}
:is(#hm,#hm2) .hm-alist span{display:flex;align-items:center;gap:8px;font-size:.72rem;color:var(--hm-text);background:#fff;border:1px solid var(--hm-line);border-radius:8px;padding:6px 8px}
:is(#hm,#hm2) .hm-alist span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--c,#16a34a);flex-shrink:0}

/* ════════ STATS ════════ */
:is(#hm,#hm2) .hm-stats{display:grid;grid-template-columns:repeat(5,1fr);margin-top:56px;border:1px solid var(--hm-line);border-radius:16px;background:#fff;position:relative}
:is(#hm,#hm2) .hm-stat{padding:30px 26px;border-right:1px solid var(--hm-line);display:flex;flex-direction:column;gap:12px;min-width:0}
:is(#hm,#hm2) .hm-stat:last-child{border-right:0}
:is(#hm,#hm2) .hm-stat .hm-mono{font-size:.68rem;color:var(--hm-faint);text-transform:uppercase;letter-spacing:.07em}
:is(#hm,#hm2) .hm-stat strong{font-size:clamp(2.4rem,4vw,3.4rem);font-weight:600;letter-spacing:-.05em;line-height:1;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-stat p{font-size:.9rem;font-weight:500;color:var(--hm-muted)}
:is(#hm,#hm2) .hm-stat .hm-bar{margin-top:auto}

/* ════════ INTEGRATIONS ════════ */
:is(#hm,#hm2) .hm-split{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
:is(#hm,#hm2) .hm-split>*{min-width:0}
:is(#hm,#hm2) .hm-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
:is(#hm,#hm2) .hm-status{display:inline-flex;align-items:center;gap:10px;margin-top:28px;height:40px;padding:0 14px 0 8px;border:1px solid var(--hm-line);border-radius:10px;background:#fff;font-size:.84rem;font-weight:500;color:var(--hm-text)}
:is(#hm,#hm2) .hm-status img{width:22px;height:22px;padding:3px;border-radius:6px;background:var(--hm-bg);border:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-status em{font-style:normal;font:500 .68rem var(--hm-mono);color:var(--hm-green);display:inline-flex;align-items:center;gap:6px}
:is(#hm,#hm2) .hm-status em::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--hm-green)}
:is(#hm,#hm2) .hm-orbit-frame{aspect-ratio:1;max-width:500px;margin-left:auto;width:100%;overflow:hidden;background:radial-gradient(#e4e4e7 1px,transparent 1px) 0 0/18px 18px,#fafafa;display:grid;place-items:center}
:is(#hm,#hm2) .hm-orbit{position:relative;width:84%;aspect-ratio:1}
:is(#hm,#hm2) .hm-orbit .hm-oring{position:absolute;inset:0;border-radius:50%;border:1px dashed #d4d4d8}
:is(#hm,#hm2) .hm-orbit .hm-oring.in{inset:22%;border-style:solid;border-color:var(--hm-line)}
:is(#hm,#hm2) .hm-orbit .spin{position:absolute;inset:0;animation:hm-spin 60s linear infinite}
@keyframes hm-spin{to{transform:rotate(360deg)}}
:is(#hm,#hm2) .hm-node{position:absolute;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:14px;background:#fff;border:1px solid var(--hm-line);display:grid;place-items:center;box-shadow:0 12px 24px -12px rgba(0,0,0,.25);animation:hm-counter 60s linear infinite}
:is(#hm,#hm2) .hm-node img{width:26px;height:26px}
@keyframes hm-counter{from{rotate:0deg}to{rotate:-360deg}}
:is(#hm,#hm2) .hm-hub{position:absolute;left:50%;top:50%;width:96px;height:96px;margin:-48px 0 0 -48px;border-radius:24px;background:#fff;border:1px solid var(--hm-line);display:grid;place-items:center;box-shadow:0 0 0 10px rgba(22,163,74,.08),0 24px 48px -20px rgba(22,163,74,.5)}
:is(#hm,#hm2) .hm-hub img{width:52px;height:52px}

/* ════════ AI VISIBILITY INDEX (dark) ════════ */
:is(#hm,#hm2) .hm-dark{background:var(--hm-dark);color:#fff;position:relative;overflow:hidden;isolation:isolate}
:is(#hm,#hm2) .hm-dark::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(to right,rgba(74,222,128,.07) 1px,transparent 1px),linear-gradient(to bottom,rgba(74,222,128,.07) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 60% 60% at 70% 50%,#000,transparent 80%);mask-image:radial-gradient(ellipse 60% 60% at 70% 50%,#000,transparent 80%)}
:is(#hm,#hm2) .hm-dark .hm-label{color:var(--hm-mint)}
:is(#hm,#hm2) .hm-dark .hm-label i{background:var(--hm-mint)}
:is(#hm,#hm2) .hm-dark .hm-h2{color:#f8fafc}
:is(#hm,#hm2) .hm-dark .hm-lead{color:#94a3b8}
:is(#hm,#hm2) .hm-dlist{display:grid;margin-top:30px;border:1px solid rgba(74,222,128,.14);border-radius:14px;overflow:hidden}
:is(#hm,#hm2) .hm-dlist>div{display:grid;grid-template-columns:40px 1fr;gap:14px;padding:16px 18px;border-bottom:1px solid rgba(74,222,128,.1);transition:background .2s}
:is(#hm,#hm2) .hm-dlist>div:last-child{border-bottom:0}
:is(#hm,#hm2) .hm-dlist>div:hover{background:rgba(74,222,128,.04)}
:is(#hm,#hm2) .hm-dlist .ic{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:rgba(74,222,128,.1);border:1px solid rgba(74,222,128,.2);color:var(--hm-mint)}
:is(#hm,#hm2) .hm-dlist .ic svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
:is(#hm,#hm2) .hm-dlist h4{font-size:.95rem;font-weight:600;color:#f1f5f9}
:is(#hm,#hm2) .hm-dlist p{font-size:.84rem;color:#64748b;margin-top:2px}
:is(#hm,#hm2) .hm-dpanel{background:var(--hm-dark-2);border:1px solid rgba(74,222,128,.14);border-radius:16px;box-shadow:0 40px 80px -30px rgba(0,0,0,.7);overflow:hidden}
:is(#hm,#hm2) .hm-dpanel-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid rgba(74,222,128,.1);background:rgba(7,26,14,.6)}
:is(#hm,#hm2) .hm-dpanel-h span{font:500 .74rem var(--hm-mono);color:#94a3b8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:is(#hm,#hm2) .hm-dpanel-h b{font:500 .66rem var(--hm-mono);text-transform:uppercase;letter-spacing:.05em;color:var(--hm-mint);border:1px solid rgba(74,222,128,.3);background:rgba(74,222,128,.08);padding:4px 8px;border-radius:6px;white-space:nowrap}
:is(#hm,#hm2) .hm-dgrid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(74,222,128,.1)}
:is(#hm,#hm2) .hm-dgrid>div{background:var(--hm-dark-2);padding:18px;display:flex;flex-direction:column;gap:8px}
:is(#hm,#hm2) .hm-dgrid .n{display:flex;align-items:center;gap:8px;font-size:.88rem;font-weight:600;color:#f1f5f9}
:is(#hm,#hm2) .hm-dgrid .n img{width:22px;height:22px;background:#fff;border-radius:6px;padding:3px}
:is(#hm,#hm2) .hm-dgrid .p{font:500 .74rem var(--hm-mono);color:#64748b}
:is(#hm,#hm2) .hm-dgrid .p b{color:var(--hm-mint)}
:is(#hm,#hm2) .hm-dgrid .hm-bar{background:rgba(255,255,255,.08)}
:is(#hm,#hm2) .hm-dcomp{padding:16px 18px;border-top:1px solid rgba(74,222,128,.1)}
:is(#hm,#hm2) .hm-dcomp small{font:500 .66rem var(--hm-mono);text-transform:uppercase;letter-spacing:.06em;color:#64748b}
:is(#hm,#hm2) .hm-dcomp div{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
:is(#hm,#hm2) .hm-dcomp span{font:500 .7rem var(--hm-mono);color:#94a3b8;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);padding:4px 9px;border-radius:6px}
:is(#hm,#hm2) .hm-dark .hm-sample{position:static;display:block;margin-top:12px;text-align:right;color:#475569}

/* ════════ SEO AUDIT ════════ */
:is(#hm,#hm2) .hm-audit-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-audit-h span{font:500 .76rem var(--hm-mono);color:var(--hm-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:is(#hm,#hm2) .hm-audit-h b{display:inline-flex;align-items:center;gap:6px;font:500 .66rem var(--hm-mono);text-transform:uppercase;letter-spacing:.05em;color:#b45309;background:#fffbeb;border:1px solid #fde68a;padding:4px 8px;border-radius:6px;white-space:nowrap}
:is(#hm,#hm2) .hm-audit-h b i{width:6px;height:6px;border-radius:50%;background:#f59e0b;animation:hm-pulse 1.6s infinite}
:is(#hm,#hm2) .hm-audit-grid{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-audit-grid>div{display:flex;align-items:center;gap:10px;height:46px;padding:0 18px;border-bottom:1px solid var(--hm-line-2);font-size:.84rem;font-weight:500;color:var(--hm-text)}
:is(#hm,#hm2) .hm-audit-grid>div:nth-child(odd){border-right:1px solid var(--hm-line-2)}
:is(#hm,#hm2) .hm-audit-grid>div:nth-last-child(-n+2){border-bottom:0}
:is(#hm,#hm2) .hm-audit-grid svg{width:16px;height:16px;fill:none;stroke:var(--hm-muted);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
:is(#hm,#hm2) .hm-audit-grid em{margin-left:auto;font-style:normal;font:500 .64rem var(--hm-mono);text-transform:uppercase;color:var(--hm-green)}
:is(#hm,#hm2) .hm-audit-grid em.w{color:#d97706}
:is(#hm,#hm2) .hm-audit-bars{padding:20px 18px;display:grid;gap:14px}
:is(#hm,#hm2) .hm-audit-bars>div>div:first-child{display:flex;justify-content:space-between;font-size:.8rem;color:var(--hm-muted);margin-bottom:7px}
:is(#hm,#hm2) .hm-audit-bars b{font:500 .78rem var(--hm-mono);color:var(--hm-ink)}
:is(#hm,#hm2) .hm-audit-bars .track{height:6px;border-radius:9px;background:var(--hm-line-2);overflow:hidden}
:is(#hm,#hm2) .hm-audit-bars .score-bar-fill{height:100%;border-radius:9px;background:var(--hm-green);transition:width 1.4s cubic-bezier(.2,.8,.2,1)}
:is(#hm,#hm2) .hm-audit-bars .score-bar-fill.a{background:#f59e0b}
:is(#hm,#hm2) .hm-flist{margin-top:30px;border-top:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-flist>div{display:grid;grid-template-columns:44px 1fr auto;gap:16px;align-items:center;padding:18px 0;border-bottom:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-flist .hm-mono{font-size:.72rem;color:var(--hm-green)}
:is(#hm,#hm2) .hm-flist h4{font-size:1rem;font-weight:600;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-flist p{font-size:.86rem;color:var(--hm-muted);margin-top:2px}
:is(#hm,#hm2) .hm-flist svg{width:18px;height:18px;fill:none;stroke:var(--hm-faint);stroke-width:1.8}

/* ════════ FAQ ════════ */
:is(#hm,#hm2) .hm-faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}
:is(#hm,#hm2) .hm-faq>*{min-width:0}
:is(#hm,#hm2) .hm-faq-side{position:sticky;top:120px}
:is(#hm,#hm2) .hm-faq-list{border-top:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-faq-list details{border-bottom:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-faq-list summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:40px 1fr 24px;gap:12px;align-items:center;padding:22px 0;font-size:1.02rem;font-weight:600;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-faq-list summary::-webkit-details-marker{display:none}
:is(#hm,#hm2) .hm-faq-list summary .hm-mono{font-size:.72rem;font-weight:500;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-faq-list summary::after{content:"";width:24px;height:24px;border-radius:6px;border:1px solid var(--hm-line);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center/12px no-repeat;transition:transform .25s}
:is(#hm,#hm2) .hm-faq-list details[open] summary::after{transform:rotate(45deg)}
:is(#hm,#hm2) .hm-faq-list details[open] summary .hm-mono{color:var(--hm-green)}
:is(#hm,#hm2) .hm-faq-list details p{padding:0 36px 24px 52px;font-size:.95rem;line-height:1.7;color:var(--hm-muted)}
:is(#hm,#hm2) .hm-faq-list summary:focus-visible{outline:2px solid var(--hm-green);outline-offset:4px;border-radius:4px}

/* ════════ CTA (light) ════════ */
:is(#hm,#hm2) .hm-cta{padding:0 0 112px}
:is(#hm,#hm2) .hm-cta-box{position:relative;overflow:hidden;padding:88px 32px;text-align:center;isolation:isolate}
:is(#hm,#hm2) .hm-cta-box::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(to right,rgba(0,0,0,.05) 1px,transparent 1px),linear-gradient(to bottom,rgba(0,0,0,.05) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(ellipse 60% 70% at 50% 50%,#000 20%,transparent 80%);mask-image:radial-gradient(ellipse 60% 70% at 50% 50%,#000 20%,transparent 80%)}
:is(#hm,#hm2) .hm-cta-box::after{content:"";position:absolute;left:50%;bottom:-240px;width:760px;height:420px;transform:translateX(-50%);z-index:-1;background:radial-gradient(closest-side,rgba(74,222,128,.35),transparent);filter:blur(10px)}
:is(#hm,#hm2) .hm-cta-box h2{font-size:clamp(2rem,4.6vw,3.6rem);font-weight:600;letter-spacing:-.045em;line-height:1.04;color:var(--hm-ink);max-width:780px;margin:18px auto 16px}
:is(#hm,#hm2) .hm-cta-box h2 .g{color:var(--hm-green)}
:is(#hm,#hm2) .hm-cta-box p{font-size:1.06rem;color:var(--hm-muted);max-width:540px;margin:0 auto 32px;line-height:1.65}
:is(#hm,#hm2) .hm-cta-box .hm-actions{justify-content:center;margin-top:0}
:is(#hm,#hm2) .hm-cmd{display:inline-flex;align-items:center;gap:10px;margin-top:26px;height:38px;padding:0 14px;border-radius:9px;border:1px solid var(--hm-line);background:#fff;font:500 .78rem var(--hm-mono);color:var(--hm-muted)}
:is(#hm,#hm2) .hm-cmd b{color:var(--hm-green);font-weight:500}

/* reveal: custom.css .reveal already provides fade-up; add delays used here */
:is(#hm,#hm2) .reveal-delay-5{transition-delay:.5s}

/* ════════ RESPONSIVE ════════ */
@media (max-width:1100px){
  :is(#hm,#hm2) .hm-trust-in{grid-template-columns:repeat(3,1fr)}
  :is(#hm,#hm2) .hm-trust-in>:first-child{grid-column:1/-1;height:52px;border-right:0;border-bottom:1px solid var(--hm-line);justify-content:center}
  :is(#hm,#hm2) .hm-trust-in>div:nth-child(4),:is(#hm,#hm2) .hm-trust-in>div:nth-child(7){border-right:0}
  :is(#hm,#hm2) .hm-trust-in>div:nth-child(-n+4):not(:first-child){border-bottom:1px solid var(--hm-line)}
  :is(#hm,#hm2) .hm-float--a{right:8px}:is(#hm,#hm2) .hm-float--b{left:8px}
}
@media (max-width:1024px){
  :is(#hm,#hm2) .hm-section{padding:88px 0}
  :is(#hm,#hm2) .hm-split,:is(#hm,#hm2) .hm-faq{grid-template-columns:1fr;gap:48px}
  :is(#hm,#hm2) .hm-faq-side{position:static}
  :is(#hm,#hm2) .hm-orbit-frame{margin:0 auto}
  :is(#hm,#hm2) .hm-cell,:is(#hm,#hm2) .hm-cell--5,:is(#hm,#hm2) .hm-cell--7{grid-column:span 6}
  :is(#hm,#hm2) .hm-cell:last-child{grid-column:span 12}
  :is(#hm,#hm2) .hm-stats{grid-template-columns:repeat(3,1fr)}
  :is(#hm,#hm2) .hm-stat:nth-child(3){border-right:0}
  :is(#hm,#hm2) .hm-stat:nth-child(-n+3){border-bottom:1px solid var(--hm-line)}
  :is(#hm,#hm2) .hm-dash-body{grid-template-columns:1fr}
  :is(#hm,#hm2) .hm-side{display:none}
  :is(#hm,#hm2) .hm-audit-first{order:2}
}
@media (max-width:760px){
  :is(#hm,#hm2) .hm-wrap{padding:0 16px}
  :is(#hm,#hm2) .hm-section{padding:72px 0}
  :is(#hm,#hm2) .hm-hero{padding-top:118px}
  :is(#hm,#hm2) .hm-hero-cta .hm-btn{flex:1 1 100%}
  :is(#hm,#hm2) .hm-stage{margin-top:48px}
  :is(#hm,#hm2) .hm-float{display:none}
  :is(#hm,#hm2) .hm-main{padding:16px}
  :is(#hm,#hm2) .hm-main-head{flex-direction:column;align-items:flex-start}
  :is(#hm,#hm2) .hm-kpis{grid-template-columns:1fr}
  :is(#hm,#hm2) .hm-engines{grid-template-columns:1fr 1fr}
  :is(#hm,#hm2) .hm-eng:nth-child(2){border-right:0}
  :is(#hm,#hm2) .hm-eng:nth-child(-n+2){border-bottom:1px solid var(--hm-line)}
  :is(#hm,#hm2) .hm-checks{grid-template-columns:1fr 1fr}
  :is(#hm,#hm2) .hm-dash-url{display:none}
  :is(#hm,#hm2) .hm-trust-in{grid-template-columns:1fr 1fr}
  :is(#hm,#hm2) .hm-trust-in>div{height:64px;font-size:.8rem;padding:0 14px}
  :is(#hm,#hm2) .hm-trust-in>div:not(:first-child){border-right:1px solid var(--hm-line);border-bottom:1px solid var(--hm-line)}
  :is(#hm,#hm2) .hm-trust-in>div:nth-child(odd):not(:first-child){border-right:0}
  :is(#hm,#hm2) .hm-trust-in>div:nth-last-child(-n+2){border-bottom:0}
  :is(#hm,#hm2) .hm-cell,:is(#hm,#hm2) .hm-cell--5,:is(#hm,#hm2) .hm-cell--7,:is(#hm,#hm2) .hm-cell:last-child{grid-column:span 12}
  :is(#hm,#hm2) .hm-slide{flex-basis:280px}
  :is(#hm,#hm2) .hm-stats{grid-template-columns:1fr 1fr}
  :is(#hm,#hm2) .hm-stat{border-bottom:1px solid var(--hm-line);padding:22px 18px}
  :is(#hm,#hm2) .hm-stat:nth-child(odd){border-right:1px solid var(--hm-line)}
  :is(#hm,#hm2) .hm-stat:nth-child(even){border-right:0}
  :is(#hm,#hm2) .hm-stat:last-child{grid-column:1/-1;border-bottom:0;border-right:0}
  :is(#hm,#hm2) .hm-audit-grid{grid-template-columns:1fr}
  :is(#hm,#hm2) .hm-audit-grid>div:nth-child(odd){border-right:0}
  :is(#hm,#hm2) .hm-audit-grid>div:nth-last-child(2){border-bottom:1px solid var(--hm-line-2)}
  :is(#hm,#hm2) .hm-dgrid{grid-template-columns:1fr}
  :is(#hm,#hm2) .hm-faq-list summary{grid-template-columns:30px 1fr 24px;font-size:.95rem}
  :is(#hm,#hm2) .hm-faq-list details p{padding:0 0 22px 42px}
  :is(#hm,#hm2) .hm-cta-box{padding:64px 18px}
  :is(#hm,#hm2) .hm-cmd{max-width:100%;overflow:hidden;white-space:nowrap}
}
@media (prefers-reduced-motion:reduce){
  :is(#hm,#hm2) .hm-float,:is(#hm,#hm2) .hm-orbit .spin,:is(#hm,#hm2) .hm-node,:is(#hm,#hm2) .hm-badge b i,:is(#hm,#hm2) .hm-dash-live i,:is(#hm,#hm2) .hm-audit-h b i,:is(#hm,#hm2) .hm-pipe>div.run::before{animation:none}
}

/* hero trend card */
:is(#hm,#hm2) .hm-trend{border:1px solid var(--hm-line);border-radius:12px;padding:14px 16px 6px;display:flex;flex-direction:column;min-width:0}
:is(#hm,#hm2) .hm-trend-h{display:flex;justify-content:space-between;align-items:center;gap:10px}
:is(#hm,#hm2) .hm-trend-h small{font:500 .66rem var(--hm-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-trend .hm-spark{flex:1;min-height:56px;margin-top:6px}

/* ════════ OUR CUSTOMERS (home) — #customers overrides site .cust-* rules ════════ */
#customers{--g:#16a34a;--line:#e4e4e7;--mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;position:relative;padding:112px 0;background:#fff;font-family:'Inter',system-ui,sans-serif;color:#171717;overflow:hidden;isolation:isolate}
#customers::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(to right,rgba(0,0,0,.045) 1px,transparent 1px),linear-gradient(to bottom,rgba(0,0,0,.045) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 55% 60% at 50% 55%,#000 10%,transparent 75%);mask-image:radial-gradient(ellipse 55% 60% at 50% 55%,#000 10%,transparent 75%)}
#customers *{box-sizing:border-box}
#customers .cx-wrap{max-width:1200px;margin:0 auto;padding:0 24px}
#customers .cx-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:48px}
#customers .cx-label{display:inline-flex;align-items:center;gap:8px;font:500 .74rem/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#52525b}
#customers .cx-label i{width:6px;height:6px;border-radius:50%;background:var(--g);box-shadow:0 0 0 3px rgba(22,163,74,.15)}
#customers h2{margin:16px 0 0;font-size:clamp(2rem,4.2vw,3.25rem);font-weight:600;letter-spacing:-.035em;line-height:1.06;color:#0a0a0a;text-transform:none}
#customers h2 span{color:var(--g)}
#customers .cx-nav{display:flex;gap:8px}
#customers .cx-nav button{all:unset;cursor:pointer;width:44px;height:44px;border-radius:10px;border:1px solid var(--line);background:#fff;display:grid;place-items:center;color:#0a0a0a;transition:background .2s,border-color .2s}
#customers .cx-nav button:hover{background:#fafafa;border-color:#d4d4d8}
#customers .cx-nav button:focus-visible{outline:2px solid var(--g);outline-offset:2px}
#customers .cx-nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#customers .cx-frame{position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 1px 2px rgba(0,0,0,.03),0 40px 80px -40px rgba(0,0,0,.22)}
#customers .cx-plus{position:absolute;width:15px;height:15px;z-index:3;pointer-events:none}
#customers .cx-plus::before,#customers .cx-plus::after{content:"";position:absolute;background:#a1a1aa}
#customers .cx-plus::before{left:7px;top:0;width:1px;height:15px}#customers .cx-plus::after{top:7px;left:0;height:1px;width:15px}
#customers .cx-plus.tl{left:-8px;top:-8px}#customers .cx-plus.tr{right:-8px;top:-8px}#customers .cx-plus.bl{left:-8px;bottom:-8px}#customers .cx-plus.br{right:-8px;bottom:-8px}
#customers .cust-carousel{overflow:hidden;border-radius:20px 20px 0 0}
#customers .cust-slide{display:none !important}
#customers .cust-slide.is-active{display:grid !important;grid-template-columns:1.55fr 1fr;gap:0;animation:cxIn .55s cubic-bezier(.2,.8,.2,1)}
@keyframes cxIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
#customers .cx-quote{margin:0;padding:48px 52px 44px;display:flex;flex-direction:column;border-right:1px solid var(--line);min-width:0}
#customers .cx-brand{display:inline-flex;align-items:center;gap:10px;font-size:1.15rem;font-weight:600;letter-spacing:-.02em;color:#0a0a0a;text-transform:lowercase}
#customers .cx-brand span{width:34px;height:34px;border-radius:9px;background:#0a0a0a;color:#fff;display:grid;place-items:center;font-size:.95rem;font-weight:700;text-transform:uppercase}
#customers .cx-mark{width:40px;height:30px;fill:var(--g);margin:36px 0 18px;opacity:.9}
#customers blockquote{margin:0;flex:1;font-size:clamp(1.2rem,2.1vw,1.6rem);line-height:1.45;font-weight:500;letter-spacing:-.02em;color:#0a0a0a}
#customers figcaption{display:flex;align-items:center;gap:14px;margin-top:36px;padding-top:24px;border-top:1px dashed var(--line)}
#customers .cx-av{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#f0fdf4;border:1px solid #bbf7d0;color:#15803d;font:600 .82rem var(--mono)}
#customers figcaption b{display:block;font-size:.98rem;font-weight:600;color:#0a0a0a}
#customers figcaption small{display:block;font-size:.86rem;color:#71717a;margin-top:2px}
#customers .cx-stat{position:relative;padding:44px 40px 0;display:flex;flex-direction:column;background:radial-gradient(#e4e4e7 1px,transparent 1px) 0 0/16px 16px,#fafafa;min-width:0;overflow:hidden}
#customers .cx-stat-l{font:500 .7rem var(--mono);text-transform:uppercase;letter-spacing:.07em;color:#a1a1aa}
#customers .cx-num{margin:18px 0 6px;font-size:clamp(3.2rem,6vw,4.8rem);font-weight:600;letter-spacing:-.06em;line-height:1;color:#0a0a0a}
#customers .cx-what{margin:0;font-size:1.05rem;font-weight:600;color:var(--g)}
#customers .cx-desc{margin:12px 0 0;font-size:.9rem;line-height:1.6;color:#52525b;max-width:320px}
#customers .cx-chart{display:block;width:calc(100% + 80px);height:110px;margin:auto -40px 0;padding-top:24px}
#customers .cx-chart .f{fill:rgba(22,163,74,.1)}
#customers .cx-chart .l{fill:none;stroke:var(--g);stroke-width:2.2;stroke-linejoin:round;vector-effect:non-scaling-stroke}
#customers .cx-chart circle{fill:var(--g);stroke:#fff;stroke-width:2}
#customers .cx-tabs{position:relative;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
#customers .cx-tab{padding:18px 24px 20px;border-right:1px solid var(--line);display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:baseline;transition:background .25s;min-width:0}
#customers .cx-tab:nth-child(3){border-right:0}
#customers .cx-tab-n{grid-row:span 2;font:500 .72rem var(--mono);color:#a1a1aa}
#customers .cx-tab b{font-size:.95rem;font-weight:600;color:#a1a1aa;text-transform:lowercase;transition:color .25s}
#customers .cx-tab small{font:500 .7rem var(--mono);color:#a1a1aa;text-transform:uppercase;letter-spacing:.05em}
/* highlight the tab that matches the active slide */
#customers:has(.cust-slide:nth-child(1).is-active) .cx-tab:nth-child(1),
#customers:has(.cust-slide:nth-child(2).is-active) .cx-tab:nth-child(2),
#customers:has(.cust-slide:nth-child(3).is-active) .cx-tab:nth-child(3){background:#fcfcfc}
#customers:has(.cust-slide:nth-child(1).is-active) .cx-tab:nth-child(1) b,
#customers:has(.cust-slide:nth-child(2).is-active) .cx-tab:nth-child(2) b,
#customers:has(.cust-slide:nth-child(3).is-active) .cx-tab:nth-child(3) b{color:#0a0a0a}
#customers:has(.cust-slide:nth-child(1).is-active) .cx-tab:nth-child(1) .cx-tab-n,
#customers:has(.cust-slide:nth-child(2).is-active) .cx-tab:nth-child(2) .cx-tab-n,
#customers:has(.cust-slide:nth-child(3).is-active) .cx-tab:nth-child(3) .cx-tab-n{color:var(--g)}
/* main.js puts one .cust-dot per slide here; stretch them over the tab cells */
#customers .cx-dots{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr)}
#customers .cust-dot{all:unset;cursor:pointer;position:relative;width:auto;height:auto;border-radius:0;background:transparent;transform:none}
#customers .cust-dot:focus-visible{outline:2px solid var(--g);outline-offset:-2px}
#customers .cust-dot::after{content:"";position:absolute;left:0;top:-1px;height:2px;width:0;background:var(--g)}
#customers .cust-dot.is-active{background:transparent;transform:none}
#customers .cust-dot.is-active::after{animation:cxFill 5.5s linear forwards}
@keyframes cxFill{to{width:100%}}
@media (max-width:1024px){
  #customers{padding:88px 0}
  #customers .cust-slide.is-active{grid-template-columns:1fr}
  #customers .cx-quote{border-right:0;border-bottom:1px solid var(--line);padding:36px 32px}
  #customers .cx-stat{padding:32px 32px 0}
  #customers .cx-chart{width:calc(100% + 64px);margin:auto -32px 0;height:90px}
}
@media (max-width:760px){
  #customers{padding:72px 0}
  #customers .cx-wrap{padding:0 16px}
  #customers .cx-head{margin-bottom:32px}
  #customers .cx-quote{padding:28px 22px}
  #customers .cx-mark{margin:24px 0 12px}
  #customers .cx-stat{padding:26px 22px 0}
  #customers .cx-chart{width:calc(100% + 44px);margin:auto -22px 0}
  #customers .cx-tab{padding:14px 12px;grid-template-columns:1fr}
  #customers .cx-tab-n{grid-row:auto}
  #customers .cx-tab small{display:none}
  #customers .cx-tab b{font-size:.82rem}
}
@media (prefers-reduced-motion:reduce){
  #customers .cust-slide.is-active{animation:none}
  #customers .cust-dot.is-active::after{animation:none;width:100%}
}

/* ════════ PLATFORM MODULES (5 features bento, animated) ════════ */
@property --hm-p{syntax:'<number>';inherits:false;initial-value:0}
@property --hm-n{syntax:'<integer>';inherits:false;initial-value:0}
:is(#hm,#hm2) .hm-mods{position:relative;display:grid;grid-template-columns:repeat(12,1fr);gap:1px;margin-top:56px;background:var(--hm-line);border:1px solid var(--hm-line);border-radius:18px}
:is(#hm,#hm2) .hm-mod{background:#fff;display:flex;flex-direction:column;min-width:0;overflow:hidden;transition:background .25s}
:is(#hm,#hm2) .hm-mod:hover{background:#fcfcfc}
:is(#hm,#hm2) .hm-mod--a{grid-column:span 7;border-top-left-radius:17px}
:is(#hm,#hm2) .hm-mod--b{grid-column:span 5;border-top-right-radius:17px}
:is(#hm,#hm2) .hm-mod--c,:is(#hm,#hm2) .hm-mod--d,:is(#hm,#hm2) .hm-mod--e{grid-column:span 4}
:is(#hm,#hm2) .hm-mod--c{border-bottom-left-radius:17px}
:is(#hm,#hm2) .hm-mod--e{border-bottom-right-radius:17px}
:is(#hm,#hm2) .hm-mod-copy{padding:28px 28px 20px;display:flex;flex-direction:column;gap:10px}
:is(#hm,#hm2) .hm-mod-k{display:inline-flex;align-items:center;gap:8px;font:500 .72rem/1 var(--hm-mono);text-transform:uppercase;letter-spacing:.07em;color:var(--hm-muted)}
:is(#hm,#hm2) .hm-mod-k b{font-weight:500;color:var(--hm-green);background:var(--hm-green-bg);border:1px solid var(--hm-green-bd);padding:3px 6px;border-radius:5px}
:is(#hm,#hm2) .hm-mod h3{font-size:1.25rem;font-weight:600;letter-spacing:-.025em;line-height:1.25;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-mod-copy p{font-size:.92rem;line-height:1.6;color:var(--hm-muted);max-width:520px}
:is(#hm,#hm2) .hm-mod-links{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
:is(#hm,#hm2) .hm-mod-links a{display:inline-flex;align-items:center;height:28px;padding:0 10px;border-radius:7px;border:1px solid var(--hm-line);background:#fff;font-size:.76rem;font-weight:500;color:var(--hm-text);transition:border-color .15s,background .15s,color .15s}
:is(#hm,#hm2) .hm-mod-links a::after{content:"→";margin-left:6px;color:var(--hm-green);transition:transform .15s}
:is(#hm,#hm2) .hm-mod-links a:hover{border-color:var(--hm-green-bd);background:var(--hm-green-bg);color:var(--hm-ink)}
:is(#hm,#hm2) .hm-mod-viz{position:relative;margin:auto 20px 20px;border:1px solid var(--hm-line);border-radius:14px;background:radial-gradient(#e4e4e7 1px,transparent 1px) 0 0/16px 16px,#fafafa;padding:16px;min-height:200px;overflow:hidden}
:is(#hm,#hm2) .hm-viz-h{display:flex;justify-content:space-between;align-items:center;font:500 .66rem var(--hm-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-viz-h em{font-style:normal;border:1px solid var(--hm-line);background:#fff;padding:2px 6px;border-radius:5px}
:is(#hm,#hm2) .hm-viz-legend{display:flex;gap:14px;font:500 .66rem var(--hm-mono);color:var(--hm-muted)}
:is(#hm,#hm2) .hm-viz-legend span{display:inline-flex;align-items:center;gap:6px}
:is(#hm,#hm2) .hm-viz-legend span::before{content:"";width:10px;height:3px;border-radius:3px}
:is(#hm,#hm2) .hm-viz-legend .y::before{background:var(--hm-green)}
:is(#hm,#hm2) .hm-viz-legend .r::before{background:#d4d4d8}

/* shared growing bar */
:is(#hm,#hm2) .hm-gbar{display:block;height:6px;border-radius:9px;background:var(--hm-line-2);overflow:hidden}
:is(#hm,#hm2) .hm-gbar i{display:block;height:100%;width:var(--w);border-radius:9px;background:var(--hm-green)}
:is(#hm,#hm2) .hm-gbar i.a{background:#f59e0b}

/* 01 TrackMind */
:is(#hm,#hm2) .hm-viz-track{display:grid;grid-template-columns:1.4fr 1fr;grid-template-rows:auto 1fr auto;column-gap:18px;row-gap:8px;min-height:236px}
:is(#hm,#hm2) .hm-viz-track .hm-viz-h{grid-column:1/-1}
:is(#hm,#hm2) .hm-line{grid-column:1;grid-row:2;width:100%;height:100%;min-height:130px;overflow:visible}
:is(#hm,#hm2) .hm-line .grid{fill:none;stroke:#ececee;stroke-width:1;vector-effect:non-scaling-stroke}
:is(#hm,#hm2) .hm-line .area{fill:url(#hmModG)}
:is(#hm,#hm2) .hm-line .rival{fill:none;stroke:#d4d4d8;stroke-width:2;stroke-dasharray:4 5;vector-effect:non-scaling-stroke}
:is(#hm,#hm2) .hm-line .you{fill:none;stroke:var(--hm-green);stroke-width:2.6;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0}
:is(#hm,#hm2) .hm-line .dot{fill:var(--hm-green);stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke}
:is(#hm,#hm2) .hm-viz-track .hm-viz-legend{grid-column:1;grid-row:3}
:is(#hm,#hm2) .hm-engrows{grid-column:2;grid-row:2/4;display:flex;flex-direction:column;justify-content:center;gap:12px;padding-left:16px;border-left:1px dashed var(--hm-line)}
:is(#hm,#hm2) .hm-engrows>div{display:grid;grid-template-columns:18px 1fr 34px;gap:10px;align-items:center}
:is(#hm,#hm2) .hm-engrows img{width:16px;height:16px}
:is(#hm,#hm2) .hm-engrows b{font:500 .74rem var(--hm-mono);color:var(--hm-ink);text-align:right}

/* 02 TrueTrace */
:is(#hm,#hm2) .hm-viz-trace{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;min-height:236px}
:is(#hm,#hm2) .hm-ring-anim{--hm-p:78;width:132px;height:132px;border-radius:50%;position:relative;display:grid;place-items:center;background:conic-gradient(var(--hm-green) calc(var(--hm-p)*1%),#e4e4e7 0);box-shadow:0 18px 36px -18px rgba(22,163,74,.6)}
:is(#hm,#hm2) .hm-ring-anim::before{content:"";position:absolute;inset:11px;border-radius:50%;background:#fff}
:is(#hm,#hm2) .hm-ring-anim span{--hm-n:78;position:relative;counter-reset:hmn var(--hm-n);font-size:2.2rem;font-weight:600;letter-spacing:-.05em;color:var(--hm-ink);line-height:1;text-align:center}
:is(#hm,#hm2) .hm-ring-anim span::before{content:counter(hmn)}
:is(#hm,#hm2) .hm-ring-anim span::after{content:"citability";display:block;font:500 .6rem var(--hm-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--hm-faint);margin-top:4px}
:is(#hm,#hm2) .hm-pillars{display:flex;flex-direction:column;gap:14px;min-width:0}
:is(#hm,#hm2) .hm-pillars>div{display:grid;grid-template-columns:78px 1fr;gap:10px;align-items:center;font-size:.78rem;color:var(--hm-muted)}

/* 03 SearchIQ */
:is(#hm,#hm2) .hm-viz-search{display:flex;flex-direction:column;gap:12px}
:is(#hm,#hm2) .hm-query{display:flex;align-items:center;gap:8px;height:36px;padding:0 12px;border-radius:9px;background:#fff;border:1px solid var(--hm-green);box-shadow:0 0 0 3px rgba(22,163,74,.12);font:500 .78rem var(--hm-mono);color:var(--hm-ink);overflow:hidden;white-space:nowrap}
:is(#hm,#hm2) .hm-query svg{width:14px;height:14px;fill:none;stroke:var(--hm-faint);stroke-width:2.2;flex-shrink:0}
:is(#hm,#hm2) .hm-typed{display:inline-block;overflow:hidden;white-space:nowrap;border-right:1.5px solid var(--hm-green);max-width:21ch;padding-right:2px}
:is(#hm,#hm2) .hm-dual{flex:1;display:grid;grid-template-columns:repeat(5,1fr);gap:10px;align-items:end;min-height:100px;border-bottom:1px solid var(--hm-line);padding:0 4px}
:is(#hm,#hm2) .hm-dual>div{display:flex;align-items:flex-end;gap:3px;height:100%}
:is(#hm,#hm2) .hm-dual i{flex:1;height:var(--h);border-radius:3px 3px 0 0;background:#d4d4d8}
:is(#hm,#hm2) .hm-dual i.ai{background:var(--hm-green)}

/* 04 Content */
:is(#hm,#hm2) .hm-viz-doc{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center}
:is(#hm,#hm2) .hm-doc{position:relative;background:#fff;border:1px solid var(--hm-line);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:7px;overflow:hidden;box-shadow:0 12px 24px -16px rgba(0,0,0,.2)}
:is(#hm,#hm2) .hm-doc i{display:block;height:6px;border-radius:4px;background:#ececee}
:is(#hm,#hm2) .hm-doc i.t{height:9px;background:#d4d4d8;margin-bottom:3px}
:is(#hm,#hm2) .hm-doc i.t2{height:8px;background:#d4d4d8;margin-top:5px}
:is(#hm,#hm2) .hm-doc i.hl{background:#bbf7d0}
:is(#hm,#hm2) .hm-doc .scan{position:absolute;left:0;right:0;top:0;height:28px;background:linear-gradient(180deg,transparent,rgba(22,163,74,.14),transparent);border-bottom:1.5px solid rgba(22,163,74,.5);pointer-events:none;opacity:0}
:is(#hm,#hm2) .hm-docscore{text-align:center;padding:12px 14px;border-radius:12px;background:#fff;border:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-docscore small{display:block;font:500 .6rem var(--hm-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-count{--hm-n:74;counter-reset:hmc var(--hm-n);display:block;font-size:2rem;font-weight:600;letter-spacing:-.05em;color:var(--hm-green);line-height:1.1;margin-top:4px}
:is(#hm,#hm2) .hm-count::before{content:counter(hmc)}

/* 05 TrafficMind */
:is(#hm,#hm2) .hm-viz-traffic{display:flex;flex-direction:column;gap:12px}
:is(#hm,#hm2) .hm-srcs{display:flex;gap:4px}
:is(#hm,#hm2) .hm-srcs img{width:20px;height:20px;padding:3px;border-radius:6px;background:#fff;border:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-cols-anim{flex:1;display:flex;align-items:flex-end;gap:7px;min-height:120px;border-bottom:1px solid var(--hm-line)}
:is(#hm,#hm2) .hm-cols-anim i{flex:1;height:var(--h);border-radius:4px 4px 0 0;background:linear-gradient(180deg,#86efac,#bbf7d0)}
:is(#hm,#hm2) .hm-cols-anim i.g{background:linear-gradient(180deg,#22c55e,#16a34a)}

/* ── animation: starts when main.js adds .visible to .hm-mods, then loops ── */
@keyframes hmDraw{0%{stroke-dashoffset:1}35%,88%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes hmFade{0%,20%{opacity:0}40%,88%{opacity:1}100%{opacity:0}}
@keyframes hmDot{0%,33%{opacity:0;r:0}40%{opacity:1;r:7}46%,88%{opacity:1;r:5}100%{opacity:0}}
@keyframes hmGrowW{0%{width:0}30%,100%{width:var(--w)}}
@keyframes hmGrowH{0%{height:0}35%,100%{height:var(--h)}}
@keyframes hmRing{0%{--hm-p:0}40%,90%{--hm-p:78}100%{--hm-p:78}}
@keyframes hmNum78{0%{--hm-n:0}40%,100%{--hm-n:78}}
@keyframes hmNum74{0%{--hm-n:0}45%,100%{--hm-n:74}}
@keyframes hmType{0%,6%{max-width:0}40%,85%{max-width:21ch}100%{max-width:0}}
@keyframes hmCaret{50%{border-color:transparent}}
@keyframes hmScan{0%{top:-28px;opacity:0}10%{opacity:1}70%{top:100%;opacity:1}71%,100%{opacity:0;top:100%}}
@keyframes hmHl{0%,25%{background:#ececee}40%,90%{background:#bbf7d0}100%{background:#ececee}}

:is(#hm,#hm2) .hm-mods .hm-line .you{animation:hmDraw 7s cubic-bezier(.4,0,.2,1) infinite paused}
:is(#hm,#hm2) .hm-mods .hm-line .area{animation:hmFade 7s ease infinite paused}
:is(#hm,#hm2) .hm-mods .hm-line .dot{animation:hmDot 7s ease infinite paused}
:is(#hm,#hm2) .hm-mods .hm-gbar i{animation:hmGrowW 7s cubic-bezier(.2,.8,.2,1) var(--d,0s) infinite paused}
:is(#hm,#hm2) .hm-mods .hm-ring-anim{animation:hmRing 7s cubic-bezier(.2,.8,.2,1) infinite paused}
:is(#hm,#hm2) .hm-mods .hm-ring-anim span{animation:hmNum78 7s cubic-bezier(.2,.8,.2,1) infinite paused}
:is(#hm,#hm2) .hm-mods .hm-typed{animation:hmType 7s steps(21,end) infinite paused,hmCaret .8s step-end infinite}
:is(#hm,#hm2) .hm-mods .hm-dual i{animation:hmGrowH 7s cubic-bezier(.2,.8,.2,1) calc(var(--d,0s) + .6s) infinite paused}
:is(#hm,#hm2) .hm-mods .hm-doc .scan{animation:hmScan 7s linear infinite paused}
:is(#hm,#hm2) .hm-mods .hm-doc i.hl{animation:hmHl 7s ease infinite paused}
:is(#hm,#hm2) .hm-mods .hm-doc i.hl.d2{animation-delay:.8s}
:is(#hm,#hm2) .hm-mods .hm-count{animation:hmNum74 7s cubic-bezier(.2,.8,.2,1) infinite paused}
:is(#hm,#hm2) .hm-mods .hm-cols-anim i{animation:hmGrowH 7s cubic-bezier(.2,.8,.2,1) var(--d,0s) infinite paused}
:is(#hm,#hm2) .hm-mods.visible *,:is(#hm,#hm2) .hm-mods.visible .hm-line *{animation-play-state:running !important}

@media (max-width:1024px){
  :is(#hm,#hm2) .hm-mod--a,:is(#hm,#hm2) .hm-mod--b{grid-column:span 12}
  :is(#hm,#hm2) .hm-mod--b{border-top-right-radius:0}
  :is(#hm,#hm2) .hm-mod--a{border-top-right-radius:17px}
  :is(#hm,#hm2) .hm-mod--c,:is(#hm,#hm2) .hm-mod--d{grid-column:span 6}
  :is(#hm,#hm2) .hm-mod--c{border-bottom-left-radius:0}
  :is(#hm,#hm2) .hm-mod--e{grid-column:span 12;border-bottom-left-radius:17px}
}
@media (max-width:760px){
  :is(#hm,#hm2) .hm-mod--c,:is(#hm,#hm2) .hm-mod--d{grid-column:span 12}
  :is(#hm,#hm2) .hm-mod-copy{padding:22px 18px 16px}
  :is(#hm,#hm2) .hm-mod-viz{margin:auto 14px 14px;padding:14px}
  :is(#hm,#hm2) .hm-viz-track{grid-template-columns:1fr}
  :is(#hm,#hm2) .hm-engrows{grid-column:1;grid-row:auto;padding:12px 0 0;border-left:0;border-top:1px dashed var(--hm-line)}
  :is(#hm,#hm2) .hm-viz-trace{grid-template-columns:1fr;justify-items:center}
  :is(#hm,#hm2) .hm-pillars{width:100%}
}
@media (prefers-reduced-motion:reduce){
  :is(#hm,#hm2) .hm-mods *{animation:none !important}
  :is(#hm,#hm2) .hm-typed{border-right:0}
  :is(#hm,#hm2) .hm-doc .scan{display:none}
}

/* stats: public figures with a source line */
:is(#hm,#hm2) .hm-src{margin-top:auto;font:500 .66rem var(--hm-mono);text-transform:uppercase;letter-spacing:.05em;color:var(--hm-faint);border-top:1px dashed var(--hm-line);padding-top:10px;transition:color .15s}
:is(#hm,#hm2) .hm-src:hover{color:var(--hm-green)}

/* ════════ SEO AUDIT (v2: terminal + scores + fix) ════════ */
:is(#hm,#hm2) .hm-aud-head{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:end}
:is(#hm,#hm2) .hm-aud-head .hm-h2{margin-bottom:0}
:is(#hm,#hm2) .hm-aud-intro{display:flex;flex-direction:column;align-items:flex-start;gap:22px}
:is(#hm,#hm2) .hm-aud{position:relative;display:grid;grid-template-columns:1.25fr 1fr .95fr;margin-top:48px;background:#fff;border:1px solid var(--hm-line);border-radius:18px;box-shadow:0 1px 2px rgba(0,0,0,.03),0 40px 80px -40px rgba(0,0,0,.22)}
:is(#hm,#hm2) .hm-aud>*{min-width:0}
/* terminal */
:is(#hm,#hm2) .hm-term{margin:14px;border-radius:12px;background:#0a0a0a;color:#e4e4e7;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 40px -20px rgba(0,0,0,.5)}
:is(#hm,#hm2) .hm-term-bar{display:flex;align-items:center;gap:12px;height:38px;padding:0 14px;border-bottom:1px solid #27272a;font:500 .72rem var(--hm-mono);color:#71717a}
:is(#hm,#hm2) .hm-term-bar .hm-dots i{background:#3f3f46}
:is(#hm,#hm2) .hm-term-bar em{margin-left:auto;font-style:normal;font-size:.62rem;text-transform:uppercase;letter-spacing:.06em;border:1px solid #3f3f46;padding:2px 6px;border-radius:5px}
:is(#hm,#hm2) .hm-term-body{padding:16px 16px 18px;font:500 .8rem/1.2 var(--hm-mono);display:flex;flex-direction:column;gap:9px;min-height:360px}
:is(#hm,#hm2) .hm-term-body p{display:flex;align-items:center;gap:10px;color:#d4d4d8;white-space:nowrap;overflow:hidden}
:is(#hm,#hm2) .hm-term-body p b{color:#4ade80;font-weight:500}
:is(#hm,#hm2) .hm-term-body p.m{color:#71717a}
:is(#hm,#hm2) .hm-term-body p span{width:16px;height:16px;border-radius:4px;display:grid;place-items:center;font-size:.64rem;flex-shrink:0}
:is(#hm,#hm2) .hm-term-body p.ok span{background:rgba(74,222,128,.14);color:#4ade80}
:is(#hm,#hm2) .hm-term-body p.wr span{background:rgba(251,191,36,.14);color:#fbbf24}
:is(#hm,#hm2) .hm-term-body p em{margin-left:auto;font-style:normal;font-size:.72rem;color:#71717a}
:is(#hm,#hm2) .hm-term-body p.wr em{color:#fbbf24}
:is(#hm,#hm2) .hm-term-body p.ok em{color:#4ade80}
:is(#hm,#hm2) .hm-term-body p.dn{color:#4ade80;margin-top:4px;padding-top:10px;border-top:1px dashed #27272a}
:is(#hm,#hm2) .hm-term .cur{display:inline-block;width:7px;height:14px;background:#4ade80;margin-left:4px;animation:hmBlink 1s step-end infinite}
@keyframes hmBlink{50%{opacity:0}}
@keyframes hmTermLoop{0%{opacity:0;transform:translateY(4px)}6%,92%{opacity:1;transform:none}100%{opacity:0}}
:is(#hm,#hm2) .hm-aud .hm-term-body p:not(.c){opacity:0;animation:hmTermLoop 12s ease calc(var(--i) * .45s) infinite paused}
:is(#hm,#hm2) .hm-aud.visible .hm-term-body p:not(.c){animation-play-state:running}
/* scores */
:is(#hm,#hm2) .hm-aud-scores{padding:26px 24px;border-left:1px solid var(--hm-line);border-right:1px solid var(--hm-line);display:flex;flex-direction:column;gap:18px}
:is(#hm,#hm2) .hm-aud-ring{display:flex;align-items:center;gap:16px;padding-bottom:18px;border-bottom:1px dashed var(--hm-line)}
:is(#hm,#hm2) .hm-aud-ring .hm-ring{width:84px;height:84px}
:is(#hm,#hm2) .hm-aud-ring small{display:block;font:500 .66rem var(--hm-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-aud-ring strong{display:block;font-size:1rem;font-weight:600;color:var(--hm-ink);margin:3px 0 6px}
:is(#hm,#hm2) .hm-aud-ring .hm-up{color:#b45309;background:#fffbeb;border-color:#fde68a}
:is(#hm,#hm2) .hm-aud-scores .hm-audit-bars{padding:0}
/* fix card */
:is(#hm,#hm2) .hm-fix{margin:14px;padding:18px;border-radius:12px;border:1px solid var(--hm-line);background:radial-gradient(#e4e4e7 1px,transparent 1px) 0 0/14px 14px,#fafafa;display:flex;flex-direction:column;gap:10px}
:is(#hm,#hm2) .hm-fix-h{display:flex;justify-content:space-between;align-items:center;gap:8px}
:is(#hm,#hm2) .hm-fix-ai{display:inline-flex;align-items:center;gap:6px;font:500 .68rem var(--hm-mono);text-transform:uppercase;letter-spacing:.05em;color:var(--hm-green)}
:is(#hm,#hm2) .hm-fix-ai svg{width:14px;height:14px;fill:var(--hm-green)}
:is(#hm,#hm2) .hm-fix-w{font:500 .62rem var(--hm-mono);text-transform:uppercase;color:#b45309;background:#fffbeb;border:1px solid #fde68a;padding:2px 6px;border-radius:5px}
:is(#hm,#hm2) .hm-fix>b{font-size:.98rem;font-weight:600;color:var(--hm-ink);margin-top:4px}
:is(#hm,#hm2) .hm-fix>p{font-size:.84rem;line-height:1.55;color:var(--hm-muted)}
:is(#hm,#hm2) .hm-code{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:9px;background:#fff;border:1px solid var(--hm-line);font:500 .74rem/1.5 var(--hm-mono);overflow:hidden;white-space:nowrap}
:is(#hm,#hm2) .hm-code .del{color:#b91c1c;background:#fef2f2;margin:0 -12px;padding:0 12px}
:is(#hm,#hm2) .hm-code .add{color:#15803d;background:#f0fdf4;margin:0 -12px;padding:0 12px}
:is(#hm,#hm2) .hm-fix-btn{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;height:34px;padding:0 14px;border-radius:8px;background:var(--hm-green);color:#fff;font-size:.8rem;font-weight:600;box-shadow:0 8px 18px -8px rgba(22,163,74,.6)}
/* feature cells */
:is(#hm,#hm2) .hm-aud-cells{display:grid;grid-template-columns:repeat(4,1fr);margin-top:20px;border:1px solid var(--hm-line);border-radius:16px;background:#fff}
:is(#hm,#hm2) .hm-aud-cells>div{padding:22px;border-right:1px solid var(--hm-line);display:grid;grid-template-columns:auto 1fr;column-gap:10px;row-gap:6px;align-items:center;transition:background .2s;min-width:0}
:is(#hm,#hm2) .hm-aud-cells>div:last-child{border-right:0}
:is(#hm,#hm2) .hm-aud-cells>div:hover{background:#fcfcfc}
:is(#hm,#hm2) .hm-aud-cells .hm-mono{grid-column:1/-1;font-size:.68rem;color:var(--hm-green)}
:is(#hm,#hm2) .hm-aud-cells svg{width:18px;height:18px;fill:none;stroke:var(--hm-green);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
:is(#hm,#hm2) .hm-aud-cells h4{font-size:.98rem;font-weight:600;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-aud-cells p{grid-column:1/-1;font-size:.84rem;line-height:1.5;color:var(--hm-muted)}
@media (max-width:1024px){
  :is(#hm,#hm2) .hm-aud-head{grid-template-columns:1fr;gap:20px}
  :is(#hm,#hm2) .hm-aud{grid-template-columns:1fr 1fr}
  :is(#hm,#hm2) .hm-term{grid-column:1/-1}
  :is(#hm,#hm2) .hm-aud-scores{border-left:0;border-top:1px solid var(--hm-line)}
  :is(#hm,#hm2) .hm-aud-cells{grid-template-columns:1fr 1fr}
  :is(#hm,#hm2) .hm-aud-cells>div:nth-child(2){border-right:0}
  :is(#hm,#hm2) .hm-aud-cells>div:nth-child(-n+2){border-bottom:1px solid var(--hm-line)}
}
@media (max-width:760px){
  :is(#hm,#hm2) .hm-aud{grid-template-columns:1fr}
  :is(#hm,#hm2) .hm-term{margin:10px}
  :is(#hm,#hm2) .hm-term-body{min-height:0;font-size:.74rem}
  :is(#hm,#hm2) .hm-aud-scores{border-right:0;padding:22px 18px}
  :is(#hm,#hm2) .hm-fix{margin:0 10px 10px}
  :is(#hm,#hm2) .hm-aud-cells{grid-template-columns:1fr}
  :is(#hm,#hm2) .hm-aud-cells>div{border-right:0;border-bottom:1px solid var(--hm-line)}
  :is(#hm,#hm2) .hm-aud-cells>div:last-child{border-bottom:0}
}
@media (prefers-reduced-motion:reduce){
  :is(#hm,#hm2) .hm-aud .hm-term-body p:not(.c){animation:none;opacity:1}
  :is(#hm,#hm2) .hm-term .cur{animation:none}
}

:is(#hm,#hm2) .hm-aud-sum{margin-top:auto;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--hm-line);border-radius:10px;overflow:hidden}
:is(#hm,#hm2) .hm-aud-sum span{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-right:1px solid var(--hm-line);font:500 .64rem var(--hm-mono);text-transform:uppercase;letter-spacing:.05em;color:var(--hm-faint)}
:is(#hm,#hm2) .hm-aud-sum span:last-child{border-right:0}
:is(#hm,#hm2) .hm-aud-sum b{font:600 1.2rem Inter,sans-serif;letter-spacing:-.03em;color:var(--hm-ink)}
:is(#hm,#hm2) .hm-aud-sum .p b{color:var(--hm-green)}:is(#hm,#hm2) .hm-aud-sum .w b{color:#d97706}

/* ════════ HERO DEMO PLAY BUTTON + VIDEO DIALOG ════════ */
:is(#hm,#hm2) .hm-play{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 12px 0 4px;border-radius:999px;background:var(--hm-green-bg);border:1px solid var(--hm-green-bd);font-size:.8rem;font-weight:600;color:#15803d;white-space:nowrap;flex-shrink:0;transition:background .2s,border-color .2s,box-shadow .2s}
:is(#hm,#hm2) .hm-play:hover{background:#dcfce7;border-color:#86efac;box-shadow:0 6px 16px -8px rgba(22,163,74,.6)}
:is(#hm,#hm2) .hm-play:focus-visible{outline:2px solid var(--hm-green);outline-offset:2px}
:is(#hm,#hm2) .hm-play-ic{position:relative;width:22px;height:22px;border-radius:50%;background:var(--hm-green);display:grid;place-items:center;flex-shrink:0}
:is(#hm,#hm2) .hm-play-ic::before{content:"";position:absolute;inset:-3px;border-radius:50%;border:1.5px solid rgba(22,163,74,.45);animation:hmPlayPulse 2.2s ease-out infinite}
:is(#hm,#hm2) .hm-play-ic svg{width:10px;height:10px;fill:#fff;margin-left:1px}
@keyframes hmPlayPulse{0%{transform:scale(.9);opacity:1}100%{transform:scale(1.6);opacity:0}}
@media (prefers-reduced-motion:reduce){:is(#hm,#hm2) .hm-play-ic::before{animation:none}}

.hm-demo{padding:0;border:0;background:transparent;width:min(1080px,calc(100vw - 32px));max-width:none;max-height:none;overflow:visible}
.hm-demo::backdrop{background:rgba(10,10,10,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hm-demo[open]{animation:hmDemoIn .3s cubic-bezier(.2,.8,.2,1)}
@keyframes hmDemoIn{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.hm-demo-box{background:#0a0a0a;border:1px solid #27272a;border-radius:16px;overflow:hidden;box-shadow:0 40px 100px -20px rgba(0,0,0,.6)}
.hm-demo-bar{display:flex;align-items:center;justify-content:space-between;height:44px;padding:0 8px 0 16px;border-bottom:1px solid #27272a;font:500 .74rem 'Geist Mono',ui-monospace,monospace;color:#a1a1aa}
.hm-demo-x{all:unset;cursor:pointer;width:32px;height:32px;border-radius:8px;display:grid;place-items:center;color:#e4e4e7;font-size:.9rem}
.hm-demo-x:hover{background:#27272a}
.hm-demo-x:focus-visible{outline:2px solid #4ade80}
.hm-demo-media{position:relative;aspect-ratio:16/9;background:#000}
.hm-demo-media iframe,.hm-demo-media video{position:absolute;inset:0;width:100%;height:100%;border:0}
.hm-demo-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:24px;color:#a1a1aa;font-family:Inter,system-ui,sans-serif}
.hm-demo-empty b{color:#fff;font-size:1.1rem;font-weight:600}
.hm-demo-empty span{font-size:.9rem;max-width:420px}

.hm-demo-open{margin-top:10px;display:inline-flex;align-items:center;height:40px;padding:0 18px;border-radius:10px;background:#16a34a;color:#fff;font-weight:600;font-size:.9rem;text-decoration:none}
.hm-demo-open:hover{background:#15803d}

.hm-demo-thumb{position:absolute;inset:0;display:grid;place-items:center;background:#000 center/cover no-repeat;text-decoration:none}
.hm-demo-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.45))}
.hm-demo-thumb-play{position:relative;z-index:1;width:84px;height:84px;border-radius:50%;background:#16a34a;display:grid;place-items:center;box-shadow:0 0 0 10px rgba(22,163,74,.25),0 20px 40px -10px rgba(0,0,0,.6);transition:transform .2s}
.hm-demo-thumb:hover .hm-demo-thumb-play{transform:scale(1.06)}
.hm-demo-thumb-play svg{width:32px;height:32px;fill:#fff;margin-left:4px}
.hm-demo-thumb-note{position:absolute;z-index:1;left:50%;bottom:18px;transform:translateX(-50%);white-space:nowrap;font:500 .72rem 'Geist Mono',ui-monospace,monospace;color:#e4e4e7;background:rgba(0,0,0,.55);padding:6px 10px;border-radius:7px}
@media (max-width:600px){.hm-demo-thumb-note{white-space:normal;width:90%;text-align:center}}