/* Homepage only: all product illustrations are HTML/SVG, with no video payload. */
.home-page { --hm-muted:#738275; --hm-forest:#174f3b; background:#fafbf7; overflow:clip; }
.home-page .hm-wrap { width:calc(100% - 80px); max-width:1200px; margin-inline:auto; }
.home-page .public-nav { max-width:1280px; height:94px; padding-inline:40px; }
.home-page .lp-nav-links { margin-left:28px; gap:29px; }
.home-page .lp-brand { font-size:24px; }
.home-page .lp-button { min-height:49px; padding-inline:21px; border-radius:9px; font-size:12px; }
.home-page .lp-nav-cta { min-height:40px; font-size:11px; padding-inline:17px; }
.home-page button:focus-visible,.home-page a:focus-visible,.home-page summary:focus-visible { outline:0; text-decoration:underline; text-underline-offset:5px; box-shadow:0 0 0 3px #97b96c44; }
.home-page .hm-hero { display:grid; grid-template-columns:.92fr 1.08fr; align-items:center; gap:40px; padding:57px 0 60px; }
.hm-eyebrow { display:flex; align-items:center; gap:8px; font-size:9px; font-weight:750; letter-spacing:1.35px; line-height:1.6; color:#607557; }
.hm-status-dot { height:6px; width:6px; border-radius:50%; background:#86a65f; box-shadow:0 0 0 4px #e8efdf; margin-right:5px; }
.home-page h1 { font-size:clamp(46px,5vw,66px); line-height:1.11; font-weight:650; letter-spacing:-3.9px; white-space:normal; margin:24px 0 23px; color:#253d30; }
.home-page h1 > span:first-of-type { color:#66834e; font-weight:550; font-style:normal; }
.hm-lead { font-size:14px; line-height:1.95; color:var(--hm-muted); max-width:411px; margin:0 0 28px; }
.hm-hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:20px; }
.home-page .hm-text-link { display:inline-flex; align-items:center; gap:9px; font-size:11px; font-weight:650; color:#3d6547; text-decoration:none; }
.hm-text-link .lucide { width:15px; height:15px; transition:transform .2s; }
.hm-text-link:hover .lucide { transform:translateX(3px); }
.hm-free-note { display:flex; align-items:center; gap:6px; font-size:10px; color:#7d8c72; margin:14px 0 0; }
.hm-free-note .lucide { width:13px; height:13px; color:#7d9a5b; }
.hm-hero-proof { display:flex; flex-wrap:wrap; gap:22px; margin-top:35px; padding-top:20px; border-top:1px solid #e6ebdf; max-width:387px; }
.hm-hero-proof > span { display:flex; align-items:center; gap:7px; font-size:10px; color:#83907b; }
.hm-hero-proof .lucide { width:14px; height:14px; }
.hm-story { min-width:0; position:relative; border-radius:18px; }
.hm-story-top { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 5px 13px; }
.hm-story-top > span:first-child { display:flex; align-items:center; gap:6px; font-size:8px; letter-spacing:1.2px; font-weight:700; color:#55724d; }
.hm-story-top .lucide { width:11px; height:11px; }
.hm-story-top > span:last-child { font-size:9px; color:#8b957f; white-space:nowrap; }
.hm-story-stage { height:457px; position:relative; background:#edf2e5; border:1px solid #e3e9d9; border-radius:18px; transition:background .5s; isolation:isolate; }
.hm-story-grid { position:absolute; inset:0; border-radius:inherit; background-image:radial-gradient(#7d936927 .8px,transparent .8px); background-size:17px 17px; mask-image:linear-gradient(transparent,#000 20%,#000 75%,transparent); z-index:-1; }
.hm-story-stage::after { content:""; position:absolute; top:275px; bottom:54px; left:50%; border-left:1px dashed #9cb287; z-index:-1; }
.hm-browser { position:absolute; top:24px; left:25px; right:25px; background:white; border:1px solid #dce3d4; border-radius:11px; box-shadow:0 8px 26px #3c562512; overflow:hidden; transform:translateY(0); transition:transform .5s; }
.hm-browser-bar { height:36px; display:flex; align-items:center; gap:12px; padding:0 13px; background:#fbfcf9; border-bottom:1px solid #edf0e8; color:#8a9581; }
.hm-browser-dots { display:flex; gap:4px; }
.hm-browser-dots b { width:5px; height:5px; border-radius:50%; background:#d8ded0; }
.hm-address { display:flex; align-items:center; gap:6px; margin:auto; font-size:9px; color:#819077; }
.hm-browser-bar .lucide { width:10px; height:10px; }
.hm-example-site { padding:16px 23px 18px; }
.hm-example-nav { display:flex; align-items:center; justify-content:space-between; font-size:7px; color:#a0a796; }
.hm-example-nav > span:first-child { font-size:10px; font-weight:700; color:#38583d; display:flex; align-items:center; gap:4px; }
.hm-example-nav .lucide { width:16px; height:16px; }
.hm-example-content { display:grid; grid-template-columns:1.5fr 1fr; align-items:center; gap:18px; padding-top:19px; }
.hm-example-kicker { display:block; font-size:6px; font-weight:650; color:#a0a894; letter-spacing:1.1px; margin-bottom:7px; }
.hm-example-content strong { display:block; font-size:25px; line-height:1.1; letter-spacing:-1.3px; font-weight:600; color:#3d5638; }
.hm-example-line { display:block; margin-top:10px; height:3px; max-width:143px; border-radius:5px; background:#e8ecdf; }
.hm-example-line.short { margin-top:4px; max-width:108px; }
.hm-example-button { display:inline-flex; align-items:center; gap:10px; font-size:6px; padding:7px 9px; background:#5e7944; color:white; margin-top:13px; border-radius:3px; }
.hm-example-button .lucide { width:8px; height:8px; }
.hm-example-art { height:137px; position:relative; display:grid; place-items:center; border-radius:54% 54% 8px 8px; background:#e8eccf; overflow:hidden; }
.hm-example-art > span { position:absolute; width:54px; height:54px; background:#d2dcaf; border-radius:50%; top:15px; right:12px; }
.hm-example-art > svg { height:133px; width:124px; color:#6a814b; position:relative; }
.hm-code-panel { background:#f8faf5; border-top:1px solid #e8eddf; padding:11px 20px 12px; position:relative; transition:background .4s,border-color .4s; }
.hm-code-label { display:block; font-size:6px; letter-spacing:1.2px; font-weight:700; color:#8c9a7a; margin-bottom:6px; }
.hm-code-panel code { display:block; color:#839173; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:10px; line-height:1.55; }
.hm-code-panel code > span { color:#426745; }
.hm-code-panel code > b { color:#48753f; font-weight:500; padding:2px 4px; border-radius:3px; background:#eaf1df; }
.hm-code-panel code > .hm-code-blocked { color:#9c5b38; background:#fbe2ce; display:none; }
.hm-code-note { display:flex; align-items:center; gap:4px; font-size:7px; margin-top:7px; color:#879678; }
.hm-code-note .lucide { width:9px; height:9px; }
.hm-when-blocked { display:none; color:#a3744a; }
.hm-scan-line { opacity:0; position:absolute; left:0; right:0; top:0; height:50px; border-bottom:1px solid #6c9962aa; background:linear-gradient(transparent,#9ab77225); pointer-events:none; }
.hm-deploy-note { display:flex; gap:9px; align-items:center; position:absolute; top:167px; right:-12px; border:1px solid #ead9c3; background:#fffaf1; padding:12px 16px; border-radius:9px; box-shadow:0 6px 20px #64432013; opacity:0; visibility:hidden; transform:translateY(10px) rotate(2deg); transition:opacity .35s,transform .35s,visibility .35s; }
.hm-deploy-note > .lucide { color:#b48b5f; width:25px; height:25px; }
.hm-deploy-note > span { color:#ac9069; font-size:8px; line-height:1.8; }
.hm-deploy-note strong { color:#836948; font-weight:600; font-size:10px; }
.hm-notification { display:flex; align-items:flex-start; gap:10px; position:absolute; top:276px; right:-12px; width:334px; padding:16px; border:1px solid #e6d8c5; background:#fffdfa; border-radius:12px; box-shadow:0 12px 28px #4a43231c,0 2px 4px #4a432307; opacity:0; visibility:hidden; transform:translateY(12px) scale(.97); transition:opacity .4s,transform .4s,visibility .4s; z-index:2; }
.hm-notification-icon { display:grid; place-items:center; width:31px; height:31px; border-radius:8px; color:#a57951; background:#f5e8d5; flex-shrink:0; }
.hm-notification-icon .lucide { width:17px; height:17px; }
.hm-notification > div { flex:1; min-width:0; }
.hm-notification-from { display:flex; justify-content:space-between; gap:10px; font-size:6px; letter-spacing:1px; color:#96866d; font-weight:700; margin-bottom:7px; }
.hm-notification-from b { letter-spacing:0; font-size:7px; color:#aaa18f; font-weight:400; }
.hm-notification strong { display:block; color:#5b5942; font-size:11px; line-height:1.4; letter-spacing:-.2px; }
.hm-notification p { font-size:8px; color:#928972; margin:5px 0 10px; line-height:1.5; }
.hm-notification-tag { display:flex; align-items:center; justify-content:space-between; gap:6px; font-size:7px; font-weight:550; color:#9f815b; }
.hm-notification-tag .lucide { width:10px; height:10px; }
.hm-recovery-notification { border-color:#dce8ce; background:#fbfdf8; }
.hm-recovery-notification .hm-notification-icon { color:#5a8149; background:#eaf2dd; }
.hm-recovery-notification .hm-notification-tag { color:#7a9463; }
.hm-monitor { position:absolute; left:25px; right:25px; bottom:17px; height:52px; display:flex; align-items:center; gap:10px; padding:11px 14px; border:1px solid #dce6d2; border-radius:10px; background:#f8fbf3; }
.hm-monitor-icon { height:28px; width:28px; border-radius:8px; background:#1b503b; color:#d8e8bb; display:grid; place-items:center; flex-shrink:0; }
.hm-monitor-icon .lucide { width:20px; height:20px; }
.hm-monitor > div { flex:1; min-width:0; }
.hm-monitor strong { font-size:10px; color:#345b3e; display:block; }
.hm-monitor > div > span { display:none; font-size:7px; color:#8b9a7c; margin-top:3px; }
.hm-monitor-pulse { padding:4px; border:1px solid #bdcea8; border-radius:50%; }
.hm-monitor-pulse b { display:block; height:5px; width:5px; border-radius:50%; background:#83a266; }
.hm-story-controls { display:flex; align-items:center; gap:10px; margin:17px 0 0; }
.hm-story-steps { flex:1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; }
.hm-story-steps button { display:flex; align-items:center; gap:5px; border:0; background:transparent; padding:9px 4px 8px; border-top:2px solid #e4e9dc; font-size:9px; color:#8a977e; font-weight:550; transition:border-color .3s,color .3s; text-align:left; white-space:nowrap; }
.hm-story-steps button > span { font-size:7px; color:#a1ae95; font-weight:450; }
.hm-story-steps button[aria-current] { color:#315b3d; border-color:#7e9e5d; }
.hm-story-steps button[aria-current] > span { color:#779662; }
.hm-story-toggle { display:flex; align-items:center; justify-content:center; gap:4px; align-self:center; border:1px solid #e1e7d8; border-radius:6px; background:#fff; color:#718563; padding:7px; min-width:56px; font-size:8px; }
.hm-story-toggle .lucide { width:10px; height:10px; }
.hm-story-toggle .hm-pause-icon { display:none; }
.hm-story[data-story-paused="false"] .hm-pause-icon { display:block; }
.hm-story[data-story-paused="false"] .hm-play-icon { display:none; }
.hm-story-caption { color:#5f7752; font-size:10px; line-height:1.8; margin:8px 0 4px; min-height:36px; }
.hm-story-timing { color:#9ba58f; font-size:8px; line-height:1.6; }
.hm-story[data-scene="clear"] .hm-monitor-clear,.hm-story[data-scene="change"] .hm-monitor-change,.hm-story[data-scene="alert"] .hm-monitor-alert,.hm-story[data-scene="recovered"] .hm-monitor-recovered { display:block; }
.hm-story:is([data-scene="change"],[data-scene="alert"]) .hm-code-clear,.hm-story:is([data-scene="change"],[data-scene="alert"]) .hm-when-clear { display:none; }
.hm-story:is([data-scene="change"],[data-scene="alert"]) .hm-code-blocked { display:inline; }
.hm-story:is([data-scene="change"],[data-scene="alert"]) .hm-when-blocked { display:flex; }
.hm-story:is([data-scene="change"],[data-scene="alert"]) .hm-code-panel { background:#fdf8ef; border-color:#efe4d1; }
.hm-story[data-scene="change"] .hm-story-stage { background:#f0efe1; }
.hm-story[data-scene="change"] .hm-deploy-note { opacity:1; visibility:visible; transform:translateY(0) rotate(2deg); }
.hm-story[data-scene="alert"] .hm-alert-notification,.hm-story[data-scene="recovered"] .hm-recovery-notification { opacity:1; visibility:visible; transform:translateY(0) scale(1); }
.hm-story[data-scene="alert"] .hm-monitor { background:#fffaf0; border-color:#e9dfc9; }
.hm-story[data-scene="alert"] .hm-monitor-pulse b { background:#bd9063; }
.hm-story[data-scene="alert"][data-story-running="true"] .hm-scan-line { animation:hm-scan 3s ease-in-out infinite; }
.hm-story[data-story-running="true"] .hm-monitor-pulse { animation:hm-pulse 2s ease-in-out infinite; }
@keyframes hm-scan { 0% { opacity:0; transform:translateY(-45px); } 15%,75% { opacity:1; } 100% { opacity:0; transform:translateY(330px); } }
@keyframes hm-pulse { 50% { box-shadow:0 0 0 4px #9db48520; } }
.home-page .hm-platforms { border-top:1px solid #e5eadf; border-bottom:1px solid #e5eadf; padding:29px 0 32px; text-align:center; }
.hm-platforms > p { color:#97a089; font-size:8px; letter-spacing:1.7px; font-weight:600; margin-bottom:23px; }
.hm-platforms > div { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:65px; }
.hm-platforms > div > span { display:inline-flex; align-items:center; gap:7px; font-size:19px; letter-spacing:-.7px; color:#839079; font-weight:650; }
.hm-platforms > div > span:last-child { font-size:14px; letter-spacing:-.3px; font-weight:500; }
.hm-platforms .lucide { width:21px; height:21px; }
.hm-wordpress { font:18px Georgia,serif; border:1.5px solid; border-radius:50%; height:25px; width:25px; display:grid; place-items:center; }
.hm-platforms .hm-shopify { font-style:italic; }
.hm-platforms .hm-webflow { font-weight:750; font-style:italic; }
.hm-platforms .hm-next { font-weight:500; letter-spacing:-1px; }
.home-page .hm-section { padding-block:95px 88px; }
.hm-section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:35px; }
.home-page h2 { font-size:38px; line-height:1.23; letter-spacing:-1.7px; font-weight:600; color:#2a4231; margin:14px 0 0; }
.home-page h2 span { color:#839373; font-weight:500; }
.hm-section-heading > p { max-width:320px; color:#8a9680; font-size:12px; line-height:1.95; padding-bottom:4px; }
.hm-signal-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.hm-signal-card { padding:26px 25px 22px; background:white; border:1px solid #e3e9dd; border-radius:13px; }
.hm-signal-top { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:24px; }
.hm-feature-icon { width:38px; height:38px; display:grid; place-items:center; background:#eff4e7; color:#78965b; border-radius:10px; }
.hm-feature-icon.hm-peach { background:#faf0e3; color:#b99a70; }
.hm-feature-icon.hm-lilac { background:#f0edf5; color:#a190b0; }
.hm-signal-top > span:last-child { font-size:8px; letter-spacing:1px; color:#a1ac96; }
.home-page h3 { color:#3f5838; font-size:16px; font-weight:650; letter-spacing:-.5px; margin:0; }
.hm-signal-card > p { font-size:11px; line-height:1.95; color:#919d84; margin:12px 0 21px; min-height:64px; }
.hm-signal-code { display:flex; flex-direction:column; justify-content:center; min-height:85px; border:1px solid #e7ebe1; background:#f8faf4; border-radius:8px; padding:14px; gap:6px; font:11px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace; color:#749164; }
.hm-signal-code mark { background:#f4e4cf; color:#a17b50; padding:2px 4px; border-radius:3px; }
.hm-signal-code .hm-code-muted { color:#a3ac98; }
.hm-feature-bottom { margin-top:19px; display:flex; align-items:center; gap:7px; color:#97a18c; font-size:9px; }
.hm-feature-bottom .lucide { width:12px; height:12px; }
.hm-small-note { display:flex; align-items:flex-start; justify-content:center; gap:7px; margin-top:20px; font-size:9px; line-height:1.8; color:#a1aa95; }
.hm-small-note .lucide { width:12px; height:12px; margin-top:2px; }
.hm-how-section { padding:78px 0; background:#eef2e7; border-block:1px solid #e6ebdc; }
.hm-how-grid { display:grid; grid-template-columns:.95fr 1.05fr; gap:90px; align-items:center; }
.hm-how-copy > p { color:#8a987d; font-size:13px; line-height:1.9; max-width:330px; margin:20px 0 25px; }
.hm-handwritten { display:flex; align-items:flex-end; gap:5px; color:#a7b38f; margin-top:32px; font:italic 17px Georgia,serif; }
.hm-handwritten svg { width:65px; height:39px; transform:rotate(-5deg); }
.hm-how-steps { display:flex; flex-direction:column; gap:24px; }
.hm-how-steps article { display:flex; align-items:flex-start; gap:21px; }
.hm-step-number { color:#95a37f; font-size:10px; font-weight:650; border:1px solid #ced9bd; border-radius:50%; height:29px; width:29px; display:grid; place-items:center; flex-shrink:0; }
.hm-how-steps article > div { flex:1; padding-bottom:23px; border-bottom:1px solid #dfe6d3; }
.hm-how-steps article:last-child > div { border-bottom:0; padding-bottom:0; }
.hm-how-steps h3 { margin-top:4px; font-size:15px; }
.hm-how-steps p { color:#8a987c; font-size:11px; line-height:1.85; margin-top:10px; }
.hm-mini-url,.hm-mini-alert { display:flex; align-items:center; gap:8px; font-size:9px; border:1px solid #dfe6d4; background:#f9fbf5; border-radius:7px; padding:12px; margin-top:14px; color:#879c70; }
.hm-mini-url > span { margin-left:auto; }
.hm-mini-url .lucide,.hm-mini-alert .lucide { width:13px; height:13px; }
.hm-mini-bots { display:flex; gap:7px; flex-wrap:wrap; margin-top:14px; }
.hm-mini-bots > span { display:flex; align-items:center; gap:5px; background:#f8fbf2; border:1px solid #d9e3c9; border-radius:5px; padding:7px 9px; font-size:8px; color:#788e61; }
.hm-mini-bots .lucide { width:10px; height:10px; }
.hm-mini-alert { color:#a48b66; background:#fbf8ef; border-color:#e6dfcb; }
.hm-coverage-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.hm-bots-card,.hm-scale-card { border:1px solid #e1e8d8; border-radius:15px; padding:35px; }
.hm-bots-card { background:#f2f5e9; }
.hm-scale-card { background:#fff; }
.hm-card-kicker { display:flex; align-items:center; gap:8px; font-size:8px; letter-spacing:1.15px; font-weight:650; color:#91a17d; margin-bottom:24px; }
.hm-card-kicker .lucide { width:15px; height:15px; }
.home-page .hm-coverage-grid h3 { font-size:27px; line-height:1.25; letter-spacing:-1px; font-weight:600; }
.hm-coverage-grid article > p { font-size:11px; line-height:1.95; color:#8a9a79; max-width:370px; margin:17px 0 24px; }
.hm-bot-cloud { display:flex; flex-wrap:wrap; gap:9px; max-width:410px; }
.hm-bot-cloud > span { display:inline-flex; align-items:center; gap:7px; background:#fbfdf6; border:1px solid #e0e8d3; border-radius:7px; padding:10px 11px; font-size:10px; color:#7b9063; }
.hm-bot-cloud .lucide { width:14px; height:14px; }
.hm-bot-monogram { height:15px; width:15px; display:grid; place-items:center; font-size:14px; font-weight:650; }
.hm-coverage-grid article > .hm-card-note { font-size:8px; margin:19px 0 0; color:#a2af91; }
.hm-import-example { display:flex; align-items:center; gap:13px; border:1px solid #e5eadc; border-radius:10px; background:#fafbf7; padding:18px; margin:27px 0 20px; }
.hm-file-icon { display:grid; place-items:center; width:36px; height:44px; color:#879d6f; background:#ecf1e1; border:1px solid #dde6cf; border-radius:5px; }
.hm-import-example > div { flex:1; min-width:0; }
.hm-import-example strong { display:block; color:#6b8158; font-size:11px; font-weight:600; }
.hm-import-example > div > span { display:block; font-size:8px; color:#a0ac90; margin-top:5px; line-height:1.7; }
.hm-import-example > .lucide { color:#a0b487; width:18px; }
.hm-scale-foot { display:flex; gap:8px; flex-direction:column; margin-bottom:23px; }
.hm-scale-foot span { display:flex; align-items:center; gap:6px; color:#94a382; font-size:9px; }
.hm-scale-foot .lucide { width:12px; height:12px; }
.home-page .hm-faq { display:grid; grid-template-columns:.9fr 1.1fr; gap:80px; padding-block:0 90px; }
.hm-faq h2 { font-size:32px; }
.hm-faq-items details { border-bottom:1px solid #e3e9d9; padding:20px 0; }
.hm-faq-items details:first-child { border-top:1px solid #e3e9d9; }
.hm-faq-items summary { display:flex; justify-content:space-between; align-items:center; gap:15px; cursor:pointer; list-style:none; font-size:12px; font-weight:600; color:#607753; }
.hm-faq-items summary::-webkit-details-marker { display:none; }
.hm-faq-items summary .lucide { width:15px; height:15px; color:#96a585; }
.hm-faq-items details[open] summary .lucide { transform:rotate(45deg); }
.hm-faq-items details > p { font-size:11px; color:#8a997c; line-height:1.9; padding-right:23px; margin:15px 0 2px; }
.home-page .hm-last-call { padding:56px 30px 45px; text-align:center; background:#184d39; border-radius:18px; color:#fff; position:relative; overflow:hidden; }
.hm-last-call::before,.hm-last-call::after { content:""; position:absolute; border:1px solid #d6eeb415; width:450px; height:450px; border-radius:50%; bottom:-275px; pointer-events:none; }
.hm-last-call::before { left:-270px; box-shadow:0 0 0 45px #d6eeb406,0 0 0 85px #d6eeb406; }
.hm-last-call::after { right:-290px; box-shadow:0 0 0 45px #d6eeb406,0 0 0 85px #d6eeb406; }
.hm-cta-symbol { display:grid; place-items:center; border:1px solid #c3da9e3d; border-radius:12px; width:48px; height:48px; margin:0 auto 22px; color:#c1dba0; background:#c9e4a411; }
.hm-cta-symbol .lucide { width:31px; height:31px; }
.hm-last-call .hm-eyebrow { justify-content:center; color:#a5bd87; font-size:8px; }
.home-page .hm-last-call h2 { font-size:41px; color:#f4f8ec; line-height:1.19; }
.home-page .hm-last-call h2 > span { color:#c1d6a7; }
.hm-last-call > p { color:#9db393; font-size:12px; margin:17px 0 27px; }
.hm-last-call > div:not(.hm-cta-symbol) { display:flex; justify-content:center; align-items:center; gap:24px; flex-wrap:wrap; position:relative; }
.home-page .hm-last-call .lp-button-lime { background:#c8e6a1; color:#244734; min-height:46px; }
.home-page .hm-cta-link { display:inline-flex; align-items:center; gap:8px; font-size:11px; color:#d6e4c5; }
.hm-cta-link .lucide { width:14px; height:14px; }
.hm-cta-note { display:block; margin-top:19px; font-size:8px; color:#87a379; }
.home-page .public-footer { max-width:1280px; padding:40px; border-top:0; margin-top:10px; }
.home-page .public-footer .lp-brand { font-size:19px; }
.home-page .public-footer > p { font-size:10px; }
.home-page .public-footer > div { font-size:10px; gap:23px; }
@media(min-width:1500px) { .home-page .hm-hero { padding-block:78px 77px; gap:60px; } }
@media(max-width:1150px) { .home-page .hm-wrap { width:calc(100% - 64px); } .home-page .public-nav { padding-inline:32px; } .home-page .lp-nav-links { margin-left:0; gap:22px; } .home-page .hm-hero { gap:25px; padding-block:40px 50px; } .home-page h1 { font-size:54px; letter-spacing:-3px; } .hm-hero-actions { gap:16px; } .hm-hero-actions .lp-button { padding-inline:16px; font-size:11px; } .hm-hero-actions .hm-text-link { font-size:10px; } .hm-story-top > span:first-child { font-size:7px; letter-spacing:.8px; } .hm-story-stage { height:437px; } .hm-browser { left:16px; right:16px; } .hm-monitor { left:16px; right:16px; } .hm-notification { top:266px; width:305px; right:-8px; } .hm-example-site { padding:15px 18px; } .hm-example-content strong { font-size:23px; } .hm-example-art { height:127px; } .hm-story-steps button { font-size:8px; gap:4px; } .hm-platforms > div { gap:40px; } .hm-how-grid { gap:55px; } .home-page h2 { font-size:33px; } .hm-signal-card { padding:22px 20px; } .hm-signal-code { font-size:10px; padding:12px; } .hm-signal-card > p { min-height:65px; } .hm-how-grid { grid-template-columns:.9fr 1.1fr; } }
@media(max-width:900px) { .home-page .lp-nav-links { display:none; } .home-page .public-nav { height:80px; } .home-page .hm-hero { grid-template-columns:1fr; gap:40px; padding-block:35px 46px; max-width:650px; } .hm-hero-copy { max-width:570px; text-align:center; margin:auto; } .home-page h1 { font-size:64px; letter-spacing:-3.5px; } .hm-hero-copy > .hm-eyebrow,.hm-hero-actions,.hm-free-note,.hm-hero-proof { justify-content:center; } .hm-hero-actions { gap:24px; } .hm-lead { max-width:440px; margin-inline:auto; } .hm-hero-proof { margin-inline:auto; margin-top:26px; padding-top:16px; } .hm-story { width:100%; max-width:560px; margin:auto; } .hm-story-stage { height:457px; } .hm-browser { left:25px; right:25px; } .hm-notification { top:276px; width:334px; right:-12px; } .hm-monitor { left:25px; right:25px; } .hm-example-content strong { font-size:25px; } .hm-example-art { height:137px; } .hm-example-site { padding:16px 23px 18px; } .hm-story-top > span:first-child { font-size:8px; } .hm-story-steps button { font-size:9px; } .hm-platforms > div { gap:30px; } .hm-platforms > div > span { font-size:16px; } .home-page .hm-section { padding-block:70px; } .hm-section-heading { gap:25px; align-items:flex-start; } .hm-section-heading > p { max-width:240px; font-size:11px; } .home-page h2 { font-size:29px; } .hm-signal-grid { gap:12px; } .hm-signal-card { padding:20px 16px; } .home-page .hm-signal-card h3 { font-size:14px; } .hm-signal-card > p { min-height:86px; font-size:10px; } .hm-signal-code { font-size:8px; padding:10px; } .hm-signal-top > span:last-child { font-size:7px; letter-spacing:.2px; } .hm-how-grid { grid-template-columns:1fr 1.2fr; gap:32px; } .hm-bots-card,.hm-scale-card { padding:25px; } .home-page .hm-coverage-grid h3 { font-size:23px; } .home-page .hm-faq { gap:40px; padding-bottom:65px; } .home-page .hm-last-call h2 { font-size:35px; } .home-page .public-footer { padding-inline:32px; flex-wrap:wrap; gap:23px; } }
@media(max-width:600px) { .home-page .hm-wrap { width:calc(100% - 40px); } .home-page .public-nav { padding-inline:20px; height:76px; gap:15px; } .home-page .lp-brand { font-size:20px; gap:7px; } .home-page .lp-brand-mark { width:30px; height:30px; border-radius:8px; } .home-page .lp-brand-mark .lucide { width:22px; height:22px; } .home-page .lp-nav-actions { gap:15px; font-size:11px; } .home-page .lp-nav-cta { font-size:10px; padding-inline:12px; min-height:36px; } .home-page .lp-nav-cta .lucide { display:none; } .home-page .hm-hero { padding-top:25px; gap:34px; } .home-page h1 { font-size:49px; letter-spacing:-2.8px; margin-block:21px; line-height:1.11; } .hm-eyebrow { font-size:8px; letter-spacing:1.05px; } .hm-lead { font-size:12px; line-height:1.95; max-width:330px; margin-bottom:23px; } .hm-hero-actions { flex-direction:column; gap:17px; } .hm-hero-actions .lp-button { min-height:47px; font-size:12px; padding-inline:21px; } .hm-hero-actions .hm-text-link { font-size:11px; } .hm-free-note { font-size:9px; margin-top:15px; } .hm-hero-proof { font-size:9px; margin-top:21px; padding-top:15px; gap:18px; } .hm-hero-proof > span { font-size:9px; } .hm-story-top { padding-bottom:10px; } .hm-story-top > span:first-child { font-size:6px; letter-spacing:.7px; gap:4px; } .hm-story-top > span:last-child { font-size:7px; } .hm-story-stage { height:403px; border-radius:13px; } .hm-browser { top:18px; left:14px; right:14px; border-radius:8px; } .hm-browser-bar { height:31px; gap:7px; padding-inline:10px; } .hm-address { font-size:7px; gap:4px; } .hm-browser-dots { gap:3px; } .hm-browser-dots b { width:4px; height:4px; } .hm-example-site { padding:12px 15px 14px; } .hm-example-nav { font-size:5px; } .hm-example-nav > span:first-child { font-size:8px; } .hm-example-content { gap:12px; padding-top:15px; } .hm-example-content strong { font-size:19px; letter-spacing:-.8px; } .hm-example-kicker { font-size:5px; margin-bottom:6px; } .hm-example-art { height:112px; } .hm-example-art > svg { height:109px; width:100px; } .hm-example-art > span { width:40px; height:40px; } .hm-example-button { margin-top:10px; padding:5px 7px; font-size:5px; } .hm-example-line { margin-top:8px; } .hm-code-panel { padding:10px 13px 11px; } .hm-code-panel code { font-size:9px; } .hm-code-label { font-size:5px; } .hm-code-note { font-size:5.5px; } .hm-notification { top:242px; right:6px; width:280px; padding:13px; gap:9px; border-radius:10px; } .hm-notification strong { font-size:10px; } .hm-notification p { font-size:7px; margin-bottom:8px; } .hm-notification-from { font-size:5px; margin-bottom:5px; } .hm-notification-from b { font-size:6px; } .hm-notification-tag { font-size:6px; } .hm-notification-icon { width:27px; height:27px; border-radius:7px; } .hm-notification-icon .lucide { width:15px; height:15px; } .hm-monitor { bottom:13px; left:14px; right:14px; height:45px; padding:8px 11px; gap:8px; } .hm-monitor strong { font-size:9px; } .hm-monitor > div > span { font-size:6px; } .hm-monitor-icon { width:25px; height:25px; border-radius:7px; } .hm-monitor-icon .lucide { width:17px; height:17px; } .hm-deploy-note { right:4px; top:133px; padding:10px 12px; } .hm-deploy-note strong { font-size:8px; } .hm-deploy-note > span { font-size:6px; } .hm-deploy-note > .lucide { width:20px; height:20px; } .hm-story-controls { gap:7px; margin-top:12px; } .hm-story-steps { gap:4px; } .hm-story-steps button { font-size:7px; gap:3px; padding-inline:1px; } .hm-story-steps button > span { font-size:6px; } .hm-story-toggle { min-width:47px; font-size:7px; padding:6px; } .hm-story-caption { font-size:9px; min-height:33px; } .hm-story-timing { font-size:7px; } .home-page .hm-platforms { padding-block:24px; } .hm-platforms > p { font-size:7px; letter-spacing:1.1px; } .hm-platforms > div { gap:18px 26px; } .hm-platforms > div > span { font-size:15px; } .hm-platforms > div > span:last-child { font-size:12px; } .hm-platforms .lucide { width:17px; height:17px; } .hm-wordpress { width:20px; height:20px; font-size:14px; } .home-page .hm-section { padding-block:55px; } .hm-section-heading { flex-direction:column; gap:15px; margin-bottom:25px; } .home-page h2 { font-size:29px; line-height:1.22; letter-spacing:-1.3px; } .hm-section-heading > p { max-width:350px; font-size:11px; } .hm-signal-grid { grid-template-columns:1fr; gap:13px; } .hm-signal-card { padding:23px; } .hm-signal-top { margin-bottom:20px; } .hm-signal-top > span:last-child { font-size:8px; letter-spacing:1px; } .home-page .hm-signal-card h3 { font-size:17px; } .hm-signal-card > p { min-height:0; font-size:11px; margin:12px 0 19px; } .hm-signal-code { font-size:11px; padding:15px; min-height:79px; } .hm-small-note { justify-content:flex-start; font-size:8px; margin-top:17px; } .hm-how-section { padding-block:49px; } .hm-how-grid { grid-template-columns:1fr; gap:32px; } .hm-how-copy > p { font-size:12px; margin-block:17px 22px; } .hm-handwritten { display:none; } .hm-how-steps { gap:23px; } .hm-how-steps article { gap:17px; } .hm-how-steps article > div { padding-bottom:23px; } .hm-how-steps h3 { font-size:14px; } .hm-how-steps p { font-size:10px; } .hm-coverage-grid { grid-template-columns:1fr; gap:15px; } .hm-bots-card,.hm-scale-card { padding:26px 23px; } .home-page .hm-coverage-grid h3 { font-size:27px; } .hm-card-kicker { margin-bottom:20px; } .hm-bot-cloud > span { font-size:9px; padding:9px 10px; } .home-page .hm-faq { grid-template-columns:1fr; gap:28px; padding-bottom:49px; } .hm-faq-items summary { font-size:11px; line-height:1.8; } .hm-faq-items details { padding-block:18px; } .home-page .hm-last-call { width:calc(100% - 24px); padding:39px 20px 34px; border-radius:12px; } .home-page .hm-last-call h2 { font-size:29px; letter-spacing:-1.3px; } .hm-last-call .hm-eyebrow { font-size:6px; letter-spacing:1px; } .hm-last-call > p { font-size:10px; margin-block:15px 24px; } .hm-last-call > div:not(.hm-cta-symbol) { flex-direction:column; gap:20px; } .hm-cta-note { margin-top:23px; font-size:7px; } .home-page .public-footer { padding:30px 22px; margin:0; align-items:flex-start; gap:14px; } .home-page .public-footer .lp-brand { font-size:19px; } .home-page .public-footer > p { width:100%; font-size:9px; } .home-page .public-footer > div { gap:17px; flex-wrap:wrap; font-size:9px; margin-top:7px; justify-content:flex-start; } }
@media(max-width:365px) { .home-page .public-nav { padding-inline:15px; gap:8px; } .home-page .lp-brand { font-size:18px; } .home-page .lp-nav-actions { gap:10px; font-size:10px; } .home-page .lp-nav-cta { padding-inline:9px; font-size:9px; } .home-page .hm-wrap { width:calc(100% - 32px); } .home-page h1 { font-size:42px; letter-spacing:-2.4px; } .hm-lead { font-size:11px; } .hm-hero-copy > .hm-eyebrow { font-size:7px; } .hm-story-top > span:first-child { font-size:5.5px; } .hm-story-stage { height:389px; } .hm-browser { left:10px; right:10px; } .hm-example-nav > span:last-child { letter-spacing:-.3px; } .hm-example-content strong { font-size:17px; } .hm-example-art { height:102px; } .hm-code-panel code { font-size:8px; } .hm-code-note { font-size:5px; } .hm-notification { top:231px; width:257px; right:5px; padding:12px; gap:8px; } .hm-notification strong { font-size:9px; } .hm-notification p { font-size:6px; } .hm-monitor { left:10px; right:10px; } .hm-story-steps button { flex-direction:column; align-items:flex-start; gap:3px; } .hm-story-toggle { min-width:45px; } .hm-story-caption { font-size:8px; } .home-page h2 { font-size:26px; } .hm-signal-card { padding:21px; } .hm-how-steps article { gap:13px; } }
@media(prefers-reduced-motion:reduce) { .home-page *, .home-page *::before,.home-page *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
/* Keep the cause and its alert readable together at every screen size. */
.hm-lead,.hm-section-heading > p,.hm-signal-card > p,.hm-how-copy > p,.hm-how-steps p,.hm-coverage-grid article > p,.hm-faq-items details > p { color:#68785f; }
.hm-story:not([data-story-paused]) .hm-story-controls { visibility:hidden; }
.hm-story-caption { font-size:11px; color:#536c47; }
.hm-story-top > span:last-child,.hm-story-timing { color:#7f8b73; }
.hm-example-line { display:none; }
.hm-code-panel code { font-size:12px; }
.hm-code-panel code > b { font-size:14px; line-height:1.15; font-weight:650; }
.hm-code-note { font-size:8px; }
.hm-notification strong { font-size:13px; }
.hm-notification p { font-size:10px; }
.hm-notification-from { font-size:7px; }
.hm-notification-from b { font-size:8px; }
.hm-notification-tag { font-size:9px; }
.hm-monitor strong { font-size:11px; }
.hm-monitor > div > span { font-size:8px; }
.hm-story-steps button { font-size:10px; }
@media(min-width:601px) { .hm-story-stage { height:493px; } .hm-example-art { height:110px; } .hm-example-art > svg { height:109px; width:103px; } .hm-notification { top:299px; width:350px; } .hm-notification p { margin-bottom:9px; } .hm-code-panel code { font-size:11px; } .hm-story-steps button { min-height:40px; } }
@media(min-width:901px) and (max-width:1150px) { .hm-notification { top:292px; width:325px; } .hm-story-steps button { font-size:8px; } }
@media(max-width:600px) {
  .home-page .hm-hero { row-gap:0; }
  .hm-hero-copy { display:contents; }
  .hm-hero-copy > .hm-eyebrow { order:0; }
  .home-page .hm-hero h1 { order:1; font-size:42px; letter-spacing:-2.4px; text-align:center; margin:18px 0 27px; }
  .hm-hero .hm-story { order:2; }
  .hm-hero-copy > .hm-lead { order:3; text-align:center; max-width:335px; margin:23px auto 20px; }
  .hm-hero-copy > .hm-hero-actions { order:4; flex-direction:row; gap:18px; }
  .hm-hero-copy > .hm-free-note { order:5; }
  .hm-hero-copy > .hm-hero-proof { order:6; width:100%; }
  .hm-story-stage { height:433px; }
  .hm-browser { top:14px; }
  .hm-browser-bar { height:28px; }
  .hm-example-site { padding:12px 15px; }
  .hm-example-content { padding-top:12px; }
  .hm-example-content strong { font-size:17px; }
  .hm-example-art { height:83px; }
  .hm-example-art > svg { height:84px; width:82px; }
  .hm-example-kicker { margin-bottom:5px; }
  .hm-example-button { margin-top:9px; }
  .hm-code-panel code { font-size:10px; }
  .hm-code-panel code > b { font-size:13px; }
  .hm-code-note { font-size:7px; line-height:1.5; max-width:250px; }
  .hm-code-label { font-size:6px; }
  .hm-notification { top:265px; width:287px; padding:13px; right:6px; }
  .hm-notification strong { font-size:11px; }
  .hm-notification p { font-size:9px; margin:5px 0 8px; }
  .hm-notification-from { font-size:6px; margin-bottom:6px; }
  .hm-notification-from b { font-size:6px; }
  .hm-notification-tag { font-size:8px; }
  .hm-monitor > div > span { font-size:7px; }
  .hm-monitor strong { font-size:10px; }
  .hm-story-steps button { font-size:8px; min-height:37px; }
  .hm-story-caption { font-size:10px; min-height:36px; }
  .hm-story-timing { font-size:7px; }
  .hm-story-controls { margin-top:10px; }
}
@media(max-width:365px) { .home-page .hm-hero h1 { font-size:35px; letter-spacing:-1.8px; } .hm-code-panel code { font-size:9px; } .hm-code-note { font-size:6px; } .hm-notification { top:260px; right:5px; width:265px; padding:12px; } .hm-notification strong { font-size:10px; } .hm-notification p { font-size:8px; } .hm-notification-tag { font-size:7px; } .hm-monitor strong { font-size:9px; } .hm-monitor > div > span { font-size:6px; } .hm-story-stage { height:420px; } .hm-story-caption { font-size:9px; } }