.chz{--chz-accent:#2E7483;--chz-accent-hover:#024F5F;--chz-cta:#024F5F;--chz-cta-hover:#013A46;--chz-text:#111;--chz-sub:#474C58;--chz-line:#EEEEEE;--chz-green:#40C700;--chz-green-deep:#2F9400;--chz-amber:#E59700;--chz-head:var(--font-sans),'Inter',system-ui,sans-serif;font-family:var(--font-sans),'Inter',system-ui,sans-serif;color:var(--chz-text);-webkit-font-smoothing:antialiased}
.chz *,.chz *::before,.chz *::after{box-sizing:border-box}
.chz button{font-family:inherit}

/* ---------------- card ---------------- */
.chz-card{position:relative;display:flex;width:100%;max-width:1100px;height:480px;margin:0 auto;background:#fff;border-radius:24px;box-shadow:0 3px 8px rgba(0,0,0,.12);transition:max-width .4s cubic-bezier(.22,1,.36,1);text-align:left}
.chz-card.is-split{max-width:1280px}

/* ---------------- tool rail (expands on hover, labels fade in) ---------------- */
.chz-rail{position:relative;flex:none;width:56px;border-right:1px solid var(--chz-line);z-index:6}
.chz-rail-nav{position:absolute;top:0;bottom:0;left:0;width:56px;padding:16px 8px;display:flex;flex-direction:column;gap:8px;border-radius:24px 0 0 24px;overflow:hidden;transition:width .18s ease,background-color .18s ease,box-shadow .18s ease}
.chz-rail:hover .chz-rail-nav,.chz-rail:focus-within .chz-rail-nav{width:216px;background:#fff;border-right:1px solid var(--chz-line);box-shadow:1px 0 5px rgba(19,37,56,.08)}
.chz-rail-item{display:flex;align-items:center;gap:10px;flex:none;height:40px;min-width:40px;padding:0 10px;border-radius:12px;color:var(--chz-sub);text-decoration:none;white-space:nowrap;transition:background-color .15s,color .15s}
.chz-rail-item svg{flex:none}
.chz-rail-item:hover{background:#F6F8FA;color:var(--chz-text)}
.chz-rail-item[aria-current=page]{background:#F1F7F8;color:var(--chz-accent)}
.chz-rail-label{font-size:14px;font-weight:500;line-height:20px;max-width:0;opacity:0;overflow:hidden;transition:max-width .18s ease,opacity .12s ease}
.chz-rail:hover .chz-rail-label,.chz-rail:focus-within .chz-rail-label{max-width:160px;opacity:1}

/* ---------------- panes ---------------- */
.chz-panes{flex:1;min-width:0;display:grid;grid-template-columns:minmax(0,1fr)}
.chz-card.is-split .chz-panes{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.chz-pane{position:relative;display:flex;flex-direction:column;min-width:0;min-height:0;padding:20px 24px}
.chz-pane+.chz-pane{border-left:1px solid var(--chz-line)}
.chz-title{display:flex;align-items:center;gap:8px;margin:0;font-family:var(--chz-head);font-size:18px;font-weight:600;line-height:27px;color:var(--chz-text)}
.chz-body{position:relative;flex:1;min-height:0;margin-top:12px}
.chz-textarea{display:block;width:100%;height:100%;resize:none;border:0;outline:0;background:transparent;padding:0 16px 0 0;font-family:inherit;font-size:16px;line-height:1.6;color:var(--chz-sub)}
.chz-textarea:focus-visible{outline:2px solid var(--chz-accent);outline-offset:4px;border-radius:8px} /* K-1: the borderless field shows the site focus ring */
.chz-textarea::placeholder{color:#9AA0AA}
.chz-scroll{height:100%;overflow-y:auto;margin-right:-16px;padding-right:16px;white-space:pre-wrap;word-break:break-word;font-size:16px;line-height:26px;color:var(--chz-sub)}
.chz-scroll::-webkit-scrollbar{width:6px}.chz-scroll::-webkit-scrollbar-thumb{background:#0003;border-radius:3px}

/* empty state: centered actions over the textarea */
.chz-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}
.chz-empty-actions{display:flex;gap:12px;pointer-events:auto}
.chz-empty-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;min-width:104px;padding:0 21px;border:1px solid var(--chz-accent);border-radius:48px;background:#fff;color:var(--chz-text);font-size:16px;line-height:24px;cursor:pointer;transition:background-color .15s}
.chz-empty-btn svg{color:var(--chz-accent)}
.chz-empty-btn:hover{background:#F1F7F8}
.chz-or{margin-top:16px;font-size:13px;font-weight:500;line-height:20px;color:var(--chz-sub)}
.chz-samples{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:8px;padding:0 16px;pointer-events:auto}
.chz-sample{height:32px;padding:0 12px;border:0;border-radius:40px;background:#F6F8FA;color:var(--chz-sub);font-size:13px;line-height:20px;cursor:pointer;transition:background-color .15s,color .15s}
.chz-sample:hover{background:#F1F7F8;color:var(--chz-accent)}
@media (max-width:768px){.chz-sample{height:40px}}

/* typewriter behind the funnel dialog */
.chz-typed{height:100%;overflow:hidden;white-space:pre-wrap;word-break:break-word;font-size:16px;line-height:1.6;color:#B9BEC7;filter:blur(1.2px)}
.chz-caret{display:inline-block;width:2px;height:18px;margin-left:1px;vertical-align:-3px;background:var(--chz-accent);animation:chz-blink 1s steps(2,start) infinite}

/* footer */
.chz-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;margin-top:12px;padding-top:20px;border-top:1px solid var(--chz-line)}
/* pinned action bar: when the card runs past the viewport (short screens: 800x600, phones) the footer with the
   Humanize button sticks to the bottom edge until the pane scrolls into view; the negative margin keeps the layout */
.chz-foot{position:sticky;bottom:0;z-index:3;margin-bottom:-12px;padding-bottom:12px;background:#fff;border-radius:0 0 16px 16px}
.chz-count{flex:none;font-size:14px;line-height:21px;color:var(--chz-sub)}
.chz-foot-right{display:flex;align-items:center;gap:8px;min-width:0}
.chz-clear{padding:6px 16px;border:0;border-radius:1000px;background:#fff;color:var(--chz-sub);font-size:14px;font-weight:500;line-height:24px;cursor:pointer}
.chz-clear:hover{background:#F6F8FA}
.chz-go{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;min-width:120px;padding:9px 24px;border:0;border-radius:50px;background:var(--chz-cta);color:#fff;font-size:14px;font-weight:600;line-height:24px;cursor:pointer;transition:background-color .15s,opacity .15s}
.chz-go:hover:not(:disabled){background:var(--chz-cta-hover)}
.chz-go.is-dim{opacity:.5}
.chz-go:disabled{cursor:default}
.chz-spin{animation:chz-spin .9s linear infinite}

/* check-grammar switch */
.chz-switch{display:inline-flex;align-items:center;gap:8px;padding:0;border:0;background:none;color:var(--chz-sub);font-size:14px;line-height:21px;cursor:pointer}
.chz-switch-track{position:relative;flex:none;width:32px;height:18px;border-radius:9px;background:#D9DCE1;transition:background-color .15s}
.chz-switch-track::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .15s}
.chz-switch[aria-checked=true] .chz-switch-track{background:var(--chz-accent)}
.chz-switch[aria-checked=true] .chz-switch-track::after{transform:translateX(14px)}

/* ---------------- result pane ---------------- */
.chz-badge{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 8px;border-radius:40px;background:#EEFAE6;color:var(--chz-green-deep);font-family:var(--font-sans),'Inter',sans-serif;font-size:12px;font-weight:500;line-height:1}
.chz-badge.is-warn{background:#FFF4E0;color:#A86A00}
.chz-result{transition:filter .35s ease}
.chz-result.is-locked{overflow:hidden}
.chz-locked{color:var(--chz-text);filter:blur(2px);-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
.chz-result .is-changed{color:var(--chz-green)}
.chz-stale{margin:0 0 10px;padding:8px 12px;border-radius:10px;background:#FFF7E6;color:#8A5A00;font-size:13px;line-height:18px}
.chz-text-btn{padding:4px 8px;border:0;border-radius:8px;background:none;color:var(--chz-sub);font-size:14px;font-weight:500;line-height:21px;cursor:pointer;text-decoration:none;white-space:nowrap}
.chz-text-btn.chz-check-ai{color:var(--chz-accent)}
.chz-text-btn:hover,.chz-icon-btn:hover{background:#F6F8FA;color:var(--chz-text)}
.chz-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:0;border-radius:8px;background:none;color:var(--chz-sub);cursor:pointer}

/* gate card over the locked placeholder (bottom-aligned: the clear preview stays readable above it) */
.chz-gate-wrap{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;padding:12px 12px 64px;pointer-events:none}
.chz-gate{margin-top:auto;display:flex;flex-direction:column;align-items:center;gap:16px;width:358px;max-width:100%;padding:20px 40px;border-radius:20px;background:#fff;box-shadow:0 6px 24px rgba(16,24,40,.2);text-align:center;pointer-events:auto;animation:chz-pop .32s cubic-bezier(.22,1,.36,1)}
.chz-gate-title{margin:0;font-family:var(--chz-head);font-size:18px;font-weight:600;line-height:24px;color:var(--chz-text)}
.chz-gate-title em{font-style:normal;color:var(--chz-green-deep)}
.chz-gate-title em.is-warn{color:#A86A00}
.chz-gauge{display:flex;flex-direction:column;align-items:center;gap:8px}
.chz-ring{position:relative;width:96px;height:96px}
.chz-ring svg{display:block}
.chz-ring-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--chz-head);font-size:16px;font-weight:600;color:var(--chz-green-deep)}
.chz-ring-label.is-warn{color:#A86A00}
.chz-ring-check{position:absolute;right:2px;bottom:6px;display:flex;align-items:center;justify-content:center;width:24px;height:24px;border:2px solid #fff;border-radius:50%;background:var(--chz-green);color:#fff}
.chz-gate-note{margin:0;font-size:11px;line-height:14px;color:var(--chz-sub)}
.chz-gate-btn,.chz-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:272px;max-width:100%;min-height:40px;padding:8px 12px;border:0;border-radius:55px;background:var(--chz-cta);color:#fff;font-size:14px;font-weight:600;line-height:24px;text-decoration:none;cursor:pointer;transition:background-color .15s}
.chz-gate-btn:hover,.chz-cta:hover{background:var(--chz-cta-hover)}

/* ---------------- dialogs ---------------- */
.chz-overlay{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;padding:24px;overflow-y:auto;background:rgba(17,17,17,.42);animation:chz-fade .2s ease-out}
.chz-dialog{position:relative;width:100%;max-width:480px;max-height:calc(100dvh - 48px);overflow-y:auto;border-radius:24px;background:#fff;box-shadow:0 20px 30px rgba(16,24,40,.18);color:#000;animation:chz-pop .28s cubic-bezier(.22,1,.36,1)}
.chz-dialog.is-loading{padding:30px 40px 40px;background:linear-gradient(180deg,#E8F2F4 0,#fff 30%)}
.chz-dialog.is-quiz{padding:32px 40px}
.chz-dialog.is-validate{max-width:500px;padding:24px 32px 32px}
.chz-dlg-title{margin:0;text-align:center;font-family:var(--chz-head);font-size:18px;font-weight:600;line-height:27px;color:var(--chz-text);overflow-wrap:anywhere}
.chz-doc{display:block;width:150px;height:100px;margin:0 auto 8px}
.chz-doc .chz-scan{animation:chz-scan 1.6s ease-in-out infinite}
.chz-doc .chz-spark{transform-origin:center;transform-box:fill-box;animation:chz-twinkle 1.4s ease-in-out infinite}
.chz-stages{display:flex;flex-direction:column;gap:6px;margin-top:20px}
.chz-stage{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:24px;font-size:14px;font-weight:500;line-height:24px;color:var(--chz-text)}
.chz-stage-label{flex:1;min-width:0}
.chz-stage-pct{flex:none;color:var(--chz-sub)}
.chz-stage svg{flex:none;color:var(--chz-green)}
.chz-bar{height:8px;margin-top:10px;overflow:hidden;border-radius:99px;background:#F2F2F2}
.chz-bar i{display:block;height:100%;border-radius:inherit;background:var(--chz-accent)}
.chz-kicker{margin:0;font-size:14px;line-height:20px;color:var(--chz-sub)}
.chz-q{margin:4px 0 16px;font-family:var(--chz-head);font-size:18px;font-weight:600;line-height:27px;color:var(--chz-text)}
.chz-opts{display:flex;flex-direction:column;gap:8px}
.chz-opt{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:58px;padding:12px 16px;border:1px solid #E6E8EA;border-radius:16px;background:#fff;text-align:left;font-size:16px;font-weight:500;line-height:24px;color:var(--chz-text);cursor:pointer;transition:border-color .15s,background-color .15s}
.chz-opt:hover{border-color:#A7D5DC;background:#F7FBFF}
.chz-opt.is-picked{border-color:var(--chz-accent)}
.chz-radio{display:flex;align-items:center;justify-content:center;flex:none;width:22px;height:22px;border:1.5px solid #D9D9D9;border-radius:11px;color:#fff;transition:background-color .12s,border-color .12s}
.chz-opt.is-picked .chz-radio{background:var(--chz-accent);border-color:var(--chz-accent)}
.chz-radio svg{animation:chz-check-in .16s cubic-bezier(.22,1,.36,1)}
.chz-checks{display:grid;grid-template-columns:repeat(3,max-content);justify-content:center;gap:16px 20px;margin:20px auto 16px}
.chz-check{display:flex;align-items:center;gap:6px;height:24px;font-size:13px;font-weight:600;color:var(--chz-text);white-space:nowrap}
.chz-check-status{display:flex;align-items:center;justify-content:center;flex:none;width:20px;height:20px}
.chz-check-status.is-pass{color:var(--chz-green)}
.chz-check-status.is-warn{color:var(--chz-amber)}
.chz-check-status.is-pending{color:#B9BEC7}
.chz-val-note{margin:0;text-align:center;font-size:12px;line-height:18px;color:var(--chz-sub)}
.chz-x{position:absolute;top:16px;right:16px;z-index:2;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:var(--chz-sub);cursor:pointer}
.chz-x:hover{background:#F2F4F7;color:var(--chz-text)}

/* sign-up dialog */
.chz-auth{display:grid;grid-template-columns:1fr 1fr;max-width:924px;padding:0;overflow:hidden}
.chz-auth-left{display:flex;flex-direction:column;align-items:center;padding:56px 72px 36px;text-align:center}
.chz-auth-h{margin:0 0 32px;font-family:var(--chz-head);font-size:32px;font-weight:700;line-height:45px;color:var(--chz-text)}
.chz-auth-h span{display:block;background:linear-gradient(90deg,#14A39A,#2E7483);-webkit-background-clip:text;background-clip:text;color:transparent}
.chz-auth-sub{margin:-20px 0 24px;font-size:14px;line-height:21px;color:var(--chz-sub)}
.chz-sso{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;max-width:315px;height:52px;margin-bottom:12px;border:1px solid #D0D4DA;border-radius:100px;background:#fff;font-family:var(--font-google-sans),"Google Sans",arial,sans-serif;font-size:18.2px;font-weight:500;letter-spacing:.3px;color:#1f1f1f;cursor:pointer;transition:background-color .15s,border-color .15s}/* text = Google's official button in the same dialog (14px Google Sans 500 ×1.3) */
.chz-sso svg{flex:none;width:23px;height:23px}/* = the G of Google's button (18px ×1.3) */
.chz-sso:hover:not(:disabled){background:#F8FAFC;border-color:#B8BEC7}
.chz-sso:disabled{opacity:.6;cursor:wait}
.chz-divider{display:flex;align-items:center;gap:12px;width:100%;max-width:315px;margin:8px 0 16px;font-size:13px;color:var(--chz-sub)}
.chz-divider::before,.chz-divider::after{content:"";flex:1;height:1px;background:#E6E8EA}
.chz-input{width:100%;max-width:315px;height:52px;padding:0 22px;border:1px solid #D0D4DA;border-radius:100px;outline:0;background:#fff;font-family:inherit;font-size:14px;color:var(--chz-text);transition:border-color .15s}
.chz-input:focus{border-color:var(--chz-accent)}
.chz-input.is-code{letter-spacing:8px;text-align:center;font-size:18px;font-weight:600}
.chz-next{width:100%;max-width:315px;height:52px;margin-top:16px;border:0;border-radius:100px;background:var(--chz-cta);color:#fff;font-family:var(--chz-head);font-size:18px;font-weight:600;cursor:pointer;transition:background-color .15s}
.chz-next:hover:not(:disabled){background:var(--chz-cta-hover)}
.chz-next:disabled{background:#EEE;color:#CCC;cursor:default}
.chz-auth-alt{margin:16px 0 0;font-size:14px;color:var(--chz-sub)}
.chz-link{padding:0;border:0;background:none;color:var(--chz-accent);font:inherit;font-weight:500;cursor:pointer;text-decoration:none}
.chz-link:hover{text-decoration:underline}
.chz-optin{display:flex;align-items:center;gap:8px;margin-top:20px;font-size:12px;line-height:18px;color:var(--chz-sub);cursor:pointer}
.chz-optin input{width:14px;height:14px;accent-color:var(--chz-accent)}
.chz-legal{margin:8px 0 0;font-size:12px;line-height:18px;color:#8A8F99}
.chz-legal a{color:inherit;text-decoration:underline}
.chz-auth-err{margin:10px 0 0;font-size:13px;color:#D92D20}
.chz-auth-right{display:flex;flex-direction:column;padding:56px 48px;background:linear-gradient(180deg,#E8F2F4 0%,#F6FAFF 100%);text-align:left}
.chz-auth-rt{max-width:350px;margin:0 0 28px;font-family:var(--chz-head);font-size:24px;font-weight:600;line-height:31.2px;color:var(--chz-text)}
.chz-mock{position:relative;padding:16px 18px;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(16,24,40,.08)}
.chz-mock-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;font-family:var(--chz-head);font-size:14px;font-weight:600}
.chz-mock p{margin:0;font-size:12px;line-height:19px;color:var(--chz-sub)}
.chz-mock p b{font-weight:400;color:var(--chz-green)}
.chz-auth-list{display:flex;flex-direction:column;gap:14px;margin:28px 0 0;padding:0;list-style:none;font-size:15px;line-height:22px;color:var(--chz-text)}
.chz-auth-list li{display:flex;align-items:flex-start;gap:10px}
.chz-auth-list svg{flex:none;margin-top:1px;color:var(--chz-accent)}

/* paywall dialog */
.chz-pay{max-width:520px;padding:36px 40px 28px;text-align:center;background:linear-gradient(180deg,#E8F2F4 0,#fff 34%)}
.chz-pay-h{margin:0;font-family:var(--chz-head);font-size:24px;font-weight:700;line-height:32px;color:var(--chz-text)}
.chz-pay-sub{margin:8px 0 24px;font-size:15px;line-height:22px;color:var(--chz-sub)}
.chz-pay-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;text-align:left}
.chz-pay-f{display:flex;gap:10px;padding:12px;border-radius:14px;background:#F6F8FA}
.chz-pay-f svg{flex:none;margin-top:2px;color:var(--chz-accent)}
.chz-pay-f b{display:block;font-size:14px;font-weight:600;line-height:20px;color:var(--chz-text)}
.chz-pay-f span{display:block;font-size:12px;line-height:17px;color:var(--chz-sub)}
.chz-pay .chz-cta{width:100%;min-height:48px;margin-top:24px;font-size:16px}
.chz-pay-later{margin-top:10px}

/* file drop overlay */
.chz-drop{position:fixed;inset:12px;z-index:9100;display:flex;align-items:center;justify-content:center;border:3px dashed var(--chz-accent);border-radius:24px;background:rgba(2,79,95,.08);font-family:var(--chz-head);font-size:24px;font-weight:600;color:var(--chz-accent);pointer-events:none;animation:chz-fade .15s ease-out}

@keyframes chz-fade{from{opacity:0}to{opacity:1}}
@keyframes chz-pop{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
@keyframes chz-blink{to{visibility:hidden}}
@keyframes chz-spin{to{transform:rotate(360deg)}}
@keyframes chz-scan{0%,100%{transform:translateY(0)}50%{transform:translateY(34px)}}
@keyframes chz-twinkle{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.1)}}
@keyframes chz-check-in{from{opacity:0;transform:scale(.55)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.chz *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* ---------------- responsive ---------------- */
@media (max-width:833px){
  .chz-card{flex-direction:column;height:auto}
  .chz-rail{width:100%;height:56px;border-right:0;border-bottom:1px solid var(--chz-line)}
  .chz-rail-nav,.chz-rail:hover .chz-rail-nav,.chz-rail:focus-within .chz-rail-nav{position:static;width:100%;height:56px;flex-direction:row;padding:8px;overflow-x:auto;border-radius:24px 24px 0 0;border-right:0;box-shadow:none;background:transparent}
  .chz-rail-label{display:none}
  .chz-card.is-split .chz-panes{grid-template-columns:minmax(0,1fr)}
  .chz-pane{min-height:400px;padding:16px}
  /* phones: the body is short (≈ 170 px) and the centered actions + samples overflowed it upward, over the
     placeholder (audit loop round 4) → textarea and actions share one grid cell (the cell grows to the taller one),
     actions start below 3 placeholder lines (de @ 320 px wraps to 3), Solvely-style */
  .chz-body:has(.chz-empty){display:grid}
  .chz-body:has(.chz-empty)>*{grid-area:1/1}
  .chz-empty{position:static;justify-content:flex-start;padding:calc(3 * 1.6em + 12px) 0 8px}
  .chz-pane+.chz-pane{border-left:0;border-top:1px solid var(--chz-line)}
  .chz-auth{grid-template-columns:1fr;max-width:440px}
  .chz-auth-right{display:none}
  .chz-auth-left{padding:48px 24px 28px}
  .chz-dialog.is-loading,.chz-dialog.is-quiz{padding:28px 20px}
  .chz-dialog.is-validate{padding:24px 16px}
  .chz-checks{grid-template-columns:repeat(2,max-content);gap:12px 16px}
  .chz-pay{padding:32px 20px 24px}
  .chz-pay-grid{grid-template-columns:1fr}
}
@media (max-width:520px){
  .chz-empty-btn{min-width:0;padding:0 16px;font-size:15px}
  .chz-count{font-size:13px}
}
.chz-modes{padding:8px 0 0}
.chz-count.is-over{color:#D92D20}

.hzr-fresh .hzr-w{animation:hzr-word .72s cubic-bezier(.22,1,.36,1) var(--hzr-d,0ms) backwards;border-radius:3px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.hzr-fresh .hzr-l{animation:hzr-line .6s cubic-bezier(.22,1,.36,1) var(--hzr-d,0ms) backwards}
@keyframes hzr-word{0%{filter:blur(5px);opacity:.25;background-color:var(--hzr-glow,rgba(64,199,0,.2))}45%{filter:blur(0);opacity:1;background-color:var(--hzr-glow,rgba(64,199,0,.2))}}
@keyframes hzr-line{from{filter:blur(4px);opacity:.2}}
@media (prefers-reduced-motion:reduce){.hzr-fresh .hzr-w,.hzr-fresh .hzr-l{animation:none!important}}


/* ---------------- hero shell ---------------- */
.jdh-thero { padding:44px 0 72px; scroll-margin-top:96px; }
.jdh-thero-wrap { width:100%; max-width:1280px; margin:0 auto; padding:0 24px; text-align:center; }
.jdh-thero-trust { display:inline-flex; align-items:center; gap:10px; font-size:14px; line-height:20px; color:var(--jd-ink); opacity:.78; }
.jdh-thero-avatars { display:inline-flex; }
.jdh-thero-avatars img { width:26px; height:26px; margin-left:-8px; border-radius:50%; border:2px solid #fff; object-fit:cover;
  display:block; background:#E6EEF0; }
.jdh-thero-avatars img:first-child { margin-left:0; }
.jdh-thero-h1 { margin-top:18px; font-size:60px; line-height:68px; }
.jdh-thero-h1 em { font-style:italic; color:var(--jd-teal); }
/* H1 entrance: words fade in from a soft blur, 42 ms apart (order --w from the server markup, clamped ≤ 6 → ≤ 592 ms in
   all). No movement at all: the words stay plain inline text (wrapping / text-wrap:balance / CJK line breaking untouched)
   and nothing is laid out per frame — no CLS on the LCP heading. Text is in the HTML; only its paint is eased in. */
.jdh-thero-w { animation:jdh-thero-rise .34s cubic-bezier(.22,1,.36,1) calc(var(--w,0) * 42ms) backwards; } /* opacity + blur only: no layout per frame, no CLS on the LCP heading */
@keyframes jdh-thero-rise { from { opacity:0; filter:blur(6px); } }
@media (prefers-reduced-motion:reduce) { .jdh-thero-w { animation:none; } }
.jdh-thero-sub { max-width:720px; margin:18px auto 0; font-size:18px; line-height:28px; color:var(--jd-ink); opacity:.78; }

/* ---------------- editor card ---------------- */
.jdh-hzw { margin-top:36px; text-align:left; min-width:0; }
.jdh-hz { position:relative; display:grid; grid-template-columns:64px minmax(0,1fr) minmax(0,1fr); height:480px;
  text-align:left; background:#fff; border-radius:24px; border:1px solid rgba(24,27,41,.06);
  box-shadow:0 40px 90px -50px rgba(24,27,41,.45), 0 2px 8px rgba(24,27,41,.04); }

.jdh-hz-rail { display:flex; flex-direction:column; align-items:center; gap:6px; padding:14px 0;
  background:#FBFCFE; border-right:1px solid var(--jd-line); border-radius:24px 0 0 24px; }
.jdh-hz-rail-btn { position:relative; width:40px; height:40px; border-radius:12px; color:#6B7280;
  display:inline-flex; align-items:center; justify-content:center; transition:background .15s ease, color .15s ease; }
.jdh-hz-rail-btn:hover { background:#EEF4F6; color:var(--jd-teal-deep); }
.jdh-hz-rail-btn.is-active { background:#E3EFF2; color:var(--jd-teal-deep); }
.jdh-hz-rail-btn::after { content:attr(data-tip); position:absolute; left:calc(100% + 10px); top:50%; z-index:5;
  transform:translate(-4px,-50%); opacity:0; pointer-events:none; white-space:nowrap; padding:5px 9px; border-radius:6px;
  background:var(--jd-ink); color:#fff; font-size:12px; font-weight:500; line-height:16px; transition:opacity .15s ease, transform .15s ease; }
.jdh-hz-rail-btn:hover::after, .jdh-hz-rail-btn:focus-visible::after { opacity:1; transform:translate(0,-50%); }

.jdh-hz-pane { display:flex; flex-direction:column; min-width:0; min-height:0; padding:22px 24px 16px; }
.jdh-hz-in { border-right:1px solid var(--jd-line); }
.jdh-hz-title { display:flex; align-items:center; gap:8px; font-size:17px; line-height:24px; font-weight:600; color:var(--jd-ink); }
.jdh-hz-badge { padding:2px 9px; border-radius:100px; background:#E3EFF2; color:var(--jd-teal-deep); font-size:12px; font-weight:600; line-height:18px; }

.jdh-hz-field { position:relative; flex:1; min-height:0; margin-top:12px; }
.jdh-hz-field textarea { width:100%; height:100%; resize:none; border:0; outline:0; background:transparent; padding:0;
  font:inherit; font-size:16px; line-height:26px; color:var(--jd-ink); }
.jdh-hz-field textarea::placeholder { color:#9CA3AF; }
.jdh-hz-chips { position:absolute; left:0; top:40px; display:flex; flex-wrap:wrap; gap:8px; }
.jdh-hz-chips button { display:inline-flex; align-items:center; gap:6px; height:34px; padding:0 12px; border-radius:100px;
  border:1px solid var(--jd-line); background:#fff; font:inherit; font-size:14px; font-weight:500; color:var(--jd-ink); cursor:pointer;
  transition:border-color .15s ease, color .15s ease; }
.jdh-hz-chips button:hover { border-color:rgba(46,116,131,.45); color:var(--jd-teal-deep); }

.jdh-hz-foot { display:flex; align-items:center; gap:12px; min-height:58px; margin-top:10px; padding-top:14px; border-top:1px solid var(--jd-line); }
.jdh-hz-count { font-size:14px; color:var(--jd-muted); white-space:nowrap; }
.jdh-hz-count em { font-style:normal; color:#B45309; }
.jdh-hz-notice { flex:1; min-width:0; font-size:13px; line-height:18px; color:#B45309; }
.jdh-hz-foot-actions { margin-left:auto; display:flex; align-items:center; gap:14px; }
.jdh-hz-clear { border:0; background:none; padding:6px 4px; font:inherit; font-size:14px; font-weight:500; color:var(--jd-ink); opacity:.7; cursor:pointer; }
.jdh-hz-clear:hover { opacity:1; }
.jdh-hz-go { display:inline-flex; align-items:center; gap:8px; height:44px; padding:0 20px; border:0; border-radius:100px;
  background:var(--jd-teal); color:#fff; font:inherit; font-size:15px; font-weight:600; cursor:pointer;
  transition:background .2s ease, box-shadow .2s ease, opacity .2s ease; }
.jdh-hz-go:hover:not(:disabled) { background:var(--jd-teal-deep); box-shadow:0 12px 26px -14px rgba(2,79,95,.7); }
.jdh-hz-go:disabled { opacity:.45; cursor:not-allowed; }
.jdh-hz-go:focus-visible, .jdh-hz-copy:focus-visible, .jdh-hz-unlock:focus-visible,
.jdh-hz-chips button:focus-visible, .jdh-hz-rail-btn:focus-visible { outline:2px solid var(--jd-teal); outline-offset:2px; }

.jdh-hz-empty { margin-top:12px; font-size:16px; line-height:26px; color:var(--jd-muted); }
.jdh-hz-result { flex:1; min-height:0; margin-top:12px; overflow:auto; white-space:pre-wrap; font-size:16px; line-height:26px; color:var(--jd-ink); }
.jdh-hz-result mark { background:#E3F6F3; color:var(--jd-teal-deep); border-radius:3px; padding:1px 0; }
.jdh-hz-switch { display:inline-flex; align-items:center; gap:8px; font-size:14px; color:var(--jd-ink); cursor:pointer; white-space:nowrap; }
.jdh-hz-switch input { position:absolute; opacity:0; width:1px; height:1px; }
.jdh-hz-switch span { position:relative; width:34px; height:20px; border-radius:20px; background:#D6DBE3; transition:background .2s ease; }
.jdh-hz-switch span::after { content:''; position:absolute; left:2px; top:2px; width:16px; height:16px; border-radius:50%; background:#fff;
  box-shadow:0 1px 2px rgba(0,0,0,.2); transition:transform .2s var(--jd-ease); }
.jdh-hz-switch input:checked + span { background:var(--jd-teal); }
.jdh-hz-switch input:checked + span::after { transform:translateX(14px); }
.jdh-hz-switch input:focus-visible + span { outline:2px solid var(--jd-teal); outline-offset:2px; }
.jdh-hz-link { font-size:14px; font-weight:500; color:var(--jd-teal) !important; white-space:nowrap; }
.jdh-hz-link:hover { text-decoration:underline; }
.jdh-hz-copy { display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 14px; border-radius:100px; border:1px solid var(--jd-line);
  background:#fff; font:inherit; font-size:14px; font-weight:500; color:var(--jd-ink); cursor:pointer; transition:border-color .15s ease; }
.jdh-hz-copy:hover { border-color:rgba(46,116,131,.45); }

.jdh-hz-locked { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; text-align:center; }
.jdh-hz-locked p { font-size:15px; color:var(--jd-ink); opacity:.8; }
.jdh-hz-lock-ico { width:44px; height:44px; border-radius:50%; background:#E3EFF2; color:var(--jd-teal-deep);
  display:inline-flex; align-items:center; justify-content:center; }
.jdh-hz-unlock { display:inline-flex; align-items:center; justify-content:center; height:48px; padding:0 26px; border:0; border-radius:100px;
  background:linear-gradient(90deg,var(--jd-teal-deep),var(--jd-teal)); color:#fff !important; font:inherit; font-size:15px; font-weight:600;
  cursor:pointer; transition:filter .2s ease, box-shadow .2s ease; }
.jdh-hz-unlock:hover { filter:brightness(1.08); box-shadow:0 14px 28px -14px rgba(2,79,95,.7); }

/* ---------------- gate (guest result) ---------------- */
.jdh-hz-result.is-gated { max-height:220px; overflow:hidden; }
.jdh-hz-locked-lines { color:var(--jd-ink); filter:blur(2px);
  -webkit-mask-image:linear-gradient(#000 35%, transparent); mask-image:linear-gradient(#000 35%, transparent); }
.jdh-hz-gate { display:flex; flex-direction:column; align-items:center; gap:10px; margin-top:-40px; padding:22px; border-radius:18px;
  text-align:center; background:#fff; border:1px solid #DDEFEC; box-shadow:0 24px 50px -30px rgba(2,79,95,.45); position:relative; }
.jdh-hz-gate .jdh-hz-gate-t { font-size:17px; font-weight:600; color:var(--jd-ink); }
.jdh-hz-gate .jdh-hz-gate-b { max-width:340px; font-size:14px; line-height:21px; color:var(--jd-muted); }
.jdh-spin { animation:jdh-spin .8s linear infinite; }
@keyframes jdh-spin { to { transform:rotate(360deg); } }

/* ---------------- shared funnel dialogs (components/humanizer) re-themed to the JustDone palette ---------------- */
.chz.jdh-chz { --chz-accent:var(--jd-teal); --chz-accent-hover:var(--jd-teal-deep); --chz-head:var(--jd-serif); }

@media (max-width:900px) {
  .jdh-thero { padding:28px 0 48px; scroll-margin-top:64px; }
  .jdh-thero-wrap { padding:0 16px; }
  .jdh-thero-h1 { font-size:40px; line-height:46px; }
  .jdh-thero-sub { font-size:16px; line-height:25px; }
  .jdh-hzw { margin-top:28px; }
  .jdh-hz { grid-template-columns:minmax(0,1fr); height:auto; border-radius:20px; }
  .jdh-hz-rail { flex-direction:row; justify-content:flex-start; gap:4px; padding:8px 10px; overflow-x:auto;
    border-right:0; border-bottom:1px solid var(--jd-line); border-radius:20px 20px 0 0; }
  .jdh-hz-rail-btn::after { display:none; }
  .jdh-hz-pane { padding:18px 16px 14px; }
  .jdh-hz-in { border-right:0; border-bottom:1px solid var(--jd-line); }
  .jdh-hz-field { min-height:200px; }
  .jdh-hz-out { min-height:220px; }
  .jdh-hz-chips { top:60px; }
  .jdh-hz-chips button { height:40px; }
  .jdh-hz-foot { flex-wrap:wrap; }
}
/* Basic / Advanced (components/humanizer/HumanizeModeBar) — teal accent, report kept compact in the fixed-height card */
.jdh-hz { --hzm-accent:var(--jd-teal); }
.jdh-hz-modes { padding-top:8px; }
.jdh-hz-out .hzm-report { flex:none; max-height:132px; overflow-y:auto; }
/* Versions strip (components/humanizer/HumanizeVersionBar) — under the card, JustDone surface: white, soft line, teal */
.jdh-hzw { --hzv-accent:var(--jd-teal-deep); }
.jdh-hzw .hzv { margin-top:14px; padding:14px 18px; border-radius:20px; border-color:rgba(24,27,41,.06); background:#fff;
  box-shadow:0 2px 8px rgba(24,27,41,.04); color:var(--jd-ink); }
.jdh-hzw .hzv-label, .jdh-hzw .hzv-dl-label { color:var(--jd-ink); }
.jdh-hzw .hzv-chip, .jdh-hzw .hzv-act { border-color:var(--jd-line); }
.jdh-hzw .hzv-tab:hover { background:#F3F7F8; }
.jdh-hzw .hzv-tab[aria-checked=true] { background:#E3EFF2; color:var(--jd-teal-deep); box-shadow:none; }
@media (max-width:900px) { .jdh-hzw .hzv { margin-top:12px; padding:12px; border-radius:16px; } }


.jdh-howto { padding:88px 0; }
.jdh-howto-head { text-align:center; }
.jdh-howto .jdh-howto-sub { max-width:640px; margin:16px auto 0; font-size:18px; line-height:28px; color:var(--jd-body); }

/* ---- frosted card: steps | demo ---- */
.jdh-howto-card { display:grid; grid-template-columns:minmax(0,420px) minmax(0,600px); justify-content:space-between;
  align-items:center; column-gap:clamp(32px,4vw,64px); margin-top:48px; padding:56px clamp(32px,4.5vw,64px); }
.jdh-howto-demo { min-width:0; width:100%; }

/* ---- numbered steps (ol is outside the base reset) ---- */
.jdh-howto-steps { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:32px; }
.jdh-howto-step { position:relative; display:grid; grid-template-columns:36px minmax(0,1fr); column-gap:18px; }
.jdh-howto-step:not(:last-child)::after { content:''; position:absolute; left:17px; top:44px; bottom:-24px;
  border-left:1.5px dashed rgba(46,116,131,.28); }
.jdh-howto-num { width:36px; height:36px; border-radius:50%; border:1.5px solid var(--jd-teal);
  display:inline-flex; align-items:center; justify-content:center; background:rgba(255,255,255,.6);
  font-family:var(--jd-serif); font-size:19px; line-height:1; font-weight:400; color:var(--jd-teal); }
.jdh-howto-copy { padding-top:4px; }
.jdh-howto .jdh-howto-t { font-size:22px; line-height:28px; font-weight:500; letter-spacing:-.2px; color:var(--jd-ink); }
.jdh-howto .jdh-howto-d { margin-top:8px; font-size:17px; line-height:25px; color:var(--jd-body); }

/* ---- mobile: drop the card chrome, steps then full-width demo ---- */
@media (max-width:900px) {
  .jdh-howto { padding:48px 0; }
  .jdh-howto .jdh-howto-sub { font-size:16px; line-height:26px; }
  .jdh-card.jdh-howto-card { grid-template-columns:minmax(0,1fr); row-gap:40px; margin-top:32px; padding:0;
    background:transparent; border:0; border-radius:0; }
  .jdh-howto-steps { gap:28px; }
  .jdh-howto-step:not(:last-child)::after { bottom:-20px; }
  .jdh-howto .jdh-howto-t { font-size:19px; line-height:26px; }
  .jdh-howto-copy { padding-top:5px; }
  .jdh-howto .jdh-howto-d { font-size:16px; line-height:24px; }
}

/* ---- desktop scroll stack (> 900px, motion allowed) ----------------------------------------------
   Sticky li's share one containing block (the ol), so they pile up instead of leaving one by one.
   Each card scrolls up (margin-bottom = scroll distance) and sticks 18px lower than the previous one;
   the ol's bottom padding holds the finished stack for a moment before it scrolls away together.
   The demo sticks beside the stack. Later li's paint over earlier ones (DOM order). */
@media (min-width:901px) and (prefers-reduced-motion:no-preference) {
  .jdh-howto { --jdh-hs-top:124px; }
  .jdh-howto-card { align-items:start; }
  .jdh-howto-demo { position:sticky; top:var(--jdh-hs-top); }
  .jdh-howto-steps { gap:0; padding-bottom:14vh; }
  .jdh-howto-step { position:sticky; top:calc(var(--jdh-hs-top) + var(--jdh-hs-i, 0) * 18px);
    padding:28px 28px 30px; background:#fff; border:1px solid var(--jd-line); border-radius:24px;
    box-shadow:0 22px 50px -30px rgba(24,27,41,.32); transform-origin:50% 0; }
  .jdh-howto-step:not(:last-child) { margin-bottom:30vh; }
  .jdh-howto-step:not(:last-child)::after { content:none; }
}
/* covered card shrinks while the next one enters (from fully entered to its centre at mid-viewport —
   finished before it sticks, so sticky never stalls the timeline). Browsers without view timelines keep
   the plain stack. Supports up to 4 steps. */
@supports (animation-timeline:view()) and (timeline-scope:--x) {
  @media (min-width:901px) and (prefers-reduced-motion:no-preference) {
    .jdh-howto-steps { timeline-scope:--jdh-hs-2, --jdh-hs-3, --jdh-hs-4; }
    .jdh-howto-step:nth-child(2) { view-timeline-name:--jdh-hs-2; }
    .jdh-howto-step:nth-child(3) { view-timeline-name:--jdh-hs-3; }
    .jdh-howto-step:nth-child(4) { view-timeline-name:--jdh-hs-4; }
    .jdh-howto-step:not(:last-child) { animation-name:jdh-hs-under; animation-duration:auto; animation-timing-function:linear;
      animation-fill-mode:both; animation-range:entry 100% cover 50%; }
    .jdh-howto-step:nth-child(1) { animation-timeline:--jdh-hs-2; }
    .jdh-howto-step:nth-child(2) { animation-timeline:--jdh-hs-3; }
    .jdh-howto-step:nth-child(3) { animation-timeline:--jdh-hs-4; }
  }
}
@keyframes jdh-hs-under { to { transform:scale(.94); opacity:.8; } }


/* ------------------------------------------------------------------ *
 *  Demo card — fixed 706×440 stage, scaled to the column (canvas-like)
 * ------------------------------------------------------------------ */
.jdh-demo { position:relative; width:100%; aspect-ratio:706/440; background:#fff; border-radius:20px; overflow:hidden;
  border:1px solid rgba(24,27,41,.05); box-shadow:0 40px 90px -45px rgba(24,27,41,.45), 0 2px 6px rgba(24,27,41,.04); }
.jdh-demo-stage { position:absolute; left:0; top:0; width:706px; height:440px; transform-origin:0 0; }
.jdh-demo-bar { position:absolute; left:0; right:0; top:0; height:64px; padding:0 12px 0 20px;
  display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--jd-line); }
.jdh-demo-avatar { width:40px; height:40px; border-radius:50%; background:var(--jd-lav); color:#024F5F;
  display:inline-flex; align-items:center; justify-content:center; }
.jdh-demo-body { position:absolute; left:0; right:0; top:65px; bottom:0; overflow:hidden; color:var(--jd-ink); }
.jdh-demo-body > * { position:absolute; transition:opacity .45s ease, transform .6s var(--jd-ease); }

/* welcome */
.jdh-d-welcome { inset:0; opacity:0; transform:translateY(-8px); }
.jdh-d-title { position:absolute; top:39px; left:0; right:0; text-align:center; font-size:20px; line-height:24px; font-weight:500; }
.jdh-d-option { position:absolute; top:121px; left:231px; width:243px; height:46px; display:flex; align-items:center; gap:12px;
  padding:0 8px; border:1px solid #E1E4EB; border-radius:12px; background:#fff; font-size:16px; font-weight:500; }
.jdh-d-option + .jdh-d-option { top:177px; }
.jdh-d-option-ico { width:28px; height:28px; border-radius:7px; background:#E8F2F4; color:#2E7483;
  display:inline-flex; align-items:center; justify-content:center; }
[data-phase="welcome"] .jdh-d-welcome { opacity:1; transform:none; }
[data-phase="welcome"] .jdh-d-option--click { animation:jdh-d-press .35s ease 1.05s both; }
@keyframes jdh-d-press { 50% { transform:scale(.96); background:#F2F4FB; } }

/* thread: attached file + prompt bubble */
.jdh-d-file { left:148px; top:240px; height:40px; padding:0 14px; display:inline-flex; align-items:center; gap:8px;
  border-radius:8px; background:#F1F2F5; font-size:14px; opacity:0; transform:translateY(8px); }
[data-phase="attach"] .jdh-d-file { opacity:1; transform:none; }
[data-phase="sent"] .jdh-d-file { opacity:1; transform:translateY(-69px); }
[data-phase="respond"] .jdh-d-file { opacity:.45; transform:translateY(-263px); }
[data-phase="humanize"] .jdh-d-file { opacity:0; transform:translateY(-263px); }

.jdh-d-bubble { right:148px; top:232px; height:40px; padding:0 12px; display:inline-flex; align-items:center;
  border-radius:8px; background:#E8F2F4; font-size:14px; color:#2A2F45; opacity:0; transform:translateY(10px); }
[data-phase="sent"] .jdh-d-bubble { opacity:1; transform:none; }
[data-phase="respond"] .jdh-d-bubble { opacity:.45; transform:translateY(-194px); }
[data-phase="humanize"] .jdh-d-bubble { opacity:0; transform:translateY(-194px); }

/* answer + humanized text */
.jdh-d-text { left:150px; width:386px; font-size:14px; line-height:20px; }
.jdh-d-answer { top:103px; opacity:0; }
[data-phase="respond"] .jdh-d-answer { opacity:1; }
[data-phase="humanize"] .jdh-d-answer { opacity:0; transition-duration:.2s; }
.jdh-d-human { top:81px; opacity:0; }
[data-phase="humanize"] .jdh-d-human, [data-phase="scan"] .jdh-d-human, [data-phase="result"] .jdh-d-human { opacity:1; }
.jdh-d-skeleton { display:inline-block; width:150px; height:13px; margin-left:4px; vertical-align:-2px; border-radius:3px;
  background:linear-gradient(90deg,#E6E8EC 0%,#F3F4F6 50%,#E6E8EC 100%); background-size:200% 100%; animation:jdh-d-shimmer 1s linear infinite; }
@keyframes jdh-d-shimmer { to { background-position:-200% 0; } }

/* scan: vertical line + a teal band that travels with it */
.jdh-d-tint { position:absolute; inset:0; color:var(--jd-mint); opacity:0;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 10px,#000 50px,transparent 58px); mask-image:linear-gradient(90deg,transparent 0,#000 10px,#000 50px,transparent 58px);
  -webkit-mask-size:58px 100%; mask-size:58px 100%; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-position:-72px 0; mask-position:-72px 0; }
.jdh-d-scanline { left:130px; top:61px; width:2px; height:215px; background:var(--jd-mint); opacity:0; }
[data-phase="scan"] .jdh-d-tint { opacity:1; animation:jdh-d-band 1.15s cubic-bezier(.45,.05,.55,.95) .05s both; }
[data-phase="scan"] .jdh-d-scanline { opacity:1; animation:jdh-d-line 1.15s cubic-bezier(.45,.05,.55,.95) .05s both; }
@keyframes jdh-d-line { from { transform:translateX(0); } to { transform:translateX(426px); } }
@keyframes jdh-d-band { from { -webkit-mask-position:-72px 0; mask-position:-72px 0; } to { -webkit-mask-position:354px 0; mask-position:354px 0; } }

/* composer */
.jdh-d-composer { left:148px; top:294px; width:410px; height:50px; border-radius:25px; background:#F2F3F7;
  display:flex; align-items:center; gap:12px; padding:0 5px 0 16px; transform-origin:50% 100%; }
.jdh-d-clip { color:#2E7483; flex:none; }
.jdh-d-placeholder { font-size:18px; color:#8B90A0; }
.jdh-d-typed { font-size:17px; color:var(--jd-ink); }
.jdh-d-caret { display:inline-block; width:2px; height:18px; margin-left:1px; vertical-align:-3px; background:#2E7483; animation:jdh-caret 1s steps(1) infinite; }
@keyframes jdh-caret { 50% { opacity:0; } }
.jdh-d-send { margin-left:auto; flex:none; width:40px; height:40px; border-radius:50%; color:#fff;
  background:linear-gradient(135deg,#1FB5C9,#2E7483); display:inline-flex; align-items:center; justify-content:center; }
[data-phase="respond"] .jdh-d-composer, [data-phase="humanize"] .jdh-d-composer,
[data-phase="scan"] .jdh-d-composer, [data-phase="result"] .jdh-d-composer { opacity:0; transform:translateY(18px) scale(.72); }

/* tool chips */
.jdh-d-actions { left:20px; top:282px; display:flex; gap:14px; }
.jdh-d-action { flex:none; height:74px; padding:0 16px; display:inline-flex; align-items:center; gap:10px; white-space:nowrap;
  border:2px solid #DADDE3; border-radius:8px; background:#fff; font-size:16px; font-weight:500;
  opacity:0; transform:translateY(110px); transition:opacity .4s ease, transform .6s var(--jd-ease); transition-delay:calc(var(--i) * 40ms); }
.jdh-d-action svg { color:#2E7483; }
[data-phase="respond"] .jdh-d-action { opacity:1; transform:none; transition-delay:calc(.45s + var(--i) * 70ms); }
[data-phase="humanize"] .jdh-d-action { opacity:1; transform:none; transition-delay:0s; }
[data-phase="humanize"] .jdh-d-action--click { animation:jdh-d-press .3s ease both; }

/* verdict */
.jdh-d-result { top:282px; left:0; right:0; text-align:center; font-size:20px; line-height:24px; font-weight:500;
  color:var(--jd-mint); letter-spacing:-.2px; opacity:0; transform:translateY(6px); }
[data-phase="result"] .jdh-d-result { opacity:1; transform:none; }

/* cursor — stage coordinates of the arrow tip */
.jdh-demo-cursor { position:absolute; left:0; top:0; pointer-events:none; filter:drop-shadow(0 2px 3px rgba(0,0,0,.2));
  transform:translate(465px,394px); transition:transform .9s var(--jd-ease), opacity .3s ease; }
[data-phase="welcome"] .jdh-demo-cursor { transform:translate(413px,208px); transition-delay:.1s; }
[data-phase="attach"] .jdh-demo-cursor { opacity:0; transform:translate(413px,208px); }
[data-phase="sent"] .jdh-demo-cursor { opacity:0; transform:translate(300px,420px); }
[data-phase="respond"] .jdh-demo-cursor { transform:translate(114px,377px); transition-delay:.6s; }
[data-phase="humanize"] .jdh-demo-cursor { transform:translate(114px,377px); }
[data-phase="scan"] .jdh-demo-cursor { transform:translate(452px,386px); }
@media (max-width:900px) { .jdh-demo { border-radius:14px; } }


.jdh-feat { --jdh-feat-link:#2E7483; --jdh-feat-blue:#2E7483; --jdh-feat-soft:#F1F2F4; --jdh-feat-hl:#E3F6F3;
  --jdh-feat-radio:#C9CDD6;
  --jdh-feat-shadow:0 24px 60px -30px rgba(24,27,41,.25);
  --jdh-feat-grad:linear-gradient(90deg, var(--jd-mint), var(--jdh-feat-blue));
  padding:85px 0; }
.jdh-feat-list { display:flex; flex-direction:column; gap:50px; }

/* ---- row: frosted card, text column + mock column ---- */
.jdh-feat-row { display:grid; grid-template-columns:minmax(0,547px) minmax(0,var(--jdh-feat-mock));
  justify-content:space-between; align-items:center; column-gap:48px;
  padding:60px clamp(40px, 7vw, 100px); } /* height follows the mock, as on the reference */
.jdh-feat-row.is-flip { grid-template-columns:minmax(0,var(--jdh-feat-mock)) minmax(0,547px); }
.jdh-feat-row.is-flip .jdh-feat-mock { order:-1; }
.jdh-feat-mock { min-width:0; }
.jdh-feat .jdh-feat-lead { margin-top:24px; }
.jdh-ghost.jdh-feat-cta { display:flex; width:fit-content; margin:40px 0 0 -24px; }

.jdh-feat .jdh-feat-pills { display:flex; flex-wrap:wrap; gap:8px; margin-top:40px; }
.jdh-feat-pill { display:inline-flex; align-items:center; gap:12px; padding:12px 16px; border-radius:8px;
  background:rgba(255,255,255,.75); font-size:17px; font-weight:600; line-height:24px; color:var(--jd-ink); }
.jdh-feat-pill svg { flex:none; color:var(--jd-teal-deep); }

/* ---- shared white mock card + atoms ---- */
.jdh-feat-win { background:#fff; border:1px solid var(--jd-line); border-radius:20px; box-shadow:var(--jdh-feat-shadow);
  font-family:var(--jd-sans); color:var(--jd-ink); overflow:hidden; }
.jdh-feat-grad-pill { display:inline-flex; align-items:center; padding:12px 16px; border-radius:100px;
  background:var(--jdh-feat-grad); color:#fff; font-size:14px; font-weight:600; line-height:20px; white-space:nowrap; }
.jdh-feat-mhead { display:flex; align-items:center; gap:8px; padding:16px 20px; border-bottom:1px solid var(--jd-line);
  font-size:18px; font-weight:600; line-height:24px; letter-spacing:-.2px; }
.jdh-feat-spark { flex:none; color:var(--jd-teal); }
.jdh-feat-mfoot { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 20px 16px;
  font-size:13px; font-weight:500; line-height:18px; color:var(--jd-muted); }
.jdh-feat-hl { background:var(--jdh-feat-hl); color:var(--jd-teal-deep); border-radius:3px; padding:1px 2px;
  -webkit-box-decoration-break:clone; box-decoration-break:clone; }
.jdh-feat-go { display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:100px;
  background:var(--jd-teal); color:#fff; font-size:13px; font-weight:600; line-height:16px; white-space:nowrap;
  box-shadow:0 8px 16px -10px rgba(2,79,95,.7); }
.jdh-feat-chip { display:inline-flex; align-items:center; gap:5px; padding:5px 10px; border-radius:100px;
  background:var(--jdh-feat-soft); color:var(--jd-body); font-size:12px; font-weight:600; line-height:14px; white-space:nowrap; }

/* ---- mock 1: AI detection report ---- */
.jdh-feat-ai { min-height:409px; }
.jdh-feat-ai-head { display:flex; align-items:center; gap:10px; padding:17px 20px; border-bottom:1px solid var(--jd-line);
  font-size:20px; font-weight:600; line-height:28px; letter-spacing:-.2px; }
.jdh-feat-ai-bot { flex:none; color:var(--jd-ai-red); }
.jdh-feat-ai-body { padding:16px 20px 20px; font-size:14px; line-height:21px; color:var(--jd-ink); }
.jdh-feat-ai-hit { background:var(--jd-ai-red-bg); box-shadow:inset 0 -2px 0 var(--jd-ai-red); padding:1px 0; }

/* ---- mock 2: plagiarism report ---- */
.jdh-feat-plag { padding:24px 20px 20px; min-height:444px; }
.jdh-feat-plag-head { display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center; }
.jdh-feat-plag-head strong { font-size:16px; font-weight:600; line-height:22px; }
.jdh-feat-plag-head span { font-size:13px; font-weight:500; line-height:18px; color:var(--jdh-feat-link); }
.jdh-feat-plag-doc { margin-top:22px; padding:14px; border-radius:16px; background:var(--jdh-feat-soft);
  font-size:14px; line-height:20px; color:var(--jd-ink); }
.jdh-feat-plag-hit { background:var(--jd-plag-bg); box-shadow:inset 0 -2px 0 var(--jd-plag); padding:1px 0; }
.jdh-feat-plag-foot { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:20px; padding-left:12px; }
.jdh-feat-plag-report { display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:500; color:var(--jdh-feat-link); }

/* ---- mock 3: Academic Mode panel ---- */
.jdh-feat-acad { display:flex; flex-direction:column; min-height:520px; }
.jdh-feat-acad-body { flex:1; padding:18px 20px 0; }
.jdh-feat-acad-group + .jdh-feat-acad-group { margin-top:18px; }
.jdh-feat-acad-label { font-size:12px; font-weight:600; line-height:16px; letter-spacing:.5px; text-transform:uppercase;
  color:var(--jd-muted); }
.jdh-feat-acad-tones { display:flex; flex-direction:column; gap:6px; margin-top:10px; }
.jdh-feat-acad-tone { display:flex; align-items:center; gap:10px; height:36px; padding:0 12px; border:1px solid var(--jd-line);
  border-radius:10px; font-size:14px; font-weight:500; line-height:18px; color:var(--jd-body); white-space:nowrap; }
.jdh-feat-acad-tone.is-on { border-color:var(--jd-teal); background:rgba(46,116,131,.05); color:var(--jd-ink); font-weight:600; }
.jdh-feat-acad-radio { flex:none; width:16px; height:16px; border-radius:50%; border:1.5px solid var(--jdh-feat-radio); background:#fff; }
.jdh-feat-acad-tone.is-on .jdh-feat-acad-radio { border-color:var(--jd-teal); background:var(--jd-teal); box-shadow:inset 0 0 0 3px #fff; }
.jdh-feat-acad-seg { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; margin-top:10px; padding:4px;
  border-radius:100px; background:var(--jdh-feat-soft); }
.jdh-feat-acad-seg > span { display:flex; align-items:center; justify-content:center; height:32px; border-radius:100px;
  font-size:13px; font-weight:600; color:var(--jd-muted); }
.jdh-feat-acad-seg > .is-on { background:var(--jd-teal); color:#fff; box-shadow:0 6px 12px -8px rgba(2,79,95,.8); }
.jdh-feat-acad-preview { margin-top:18px; padding:12px 14px; border-radius:12px; background:var(--jdh-feat-soft);
  font-size:13.5px; line-height:21px; color:var(--jd-ink); }

/* ---- mock 4: AI writers -> humanized result ---- */
.jdh-feat-src { display:grid; grid-template-columns:auto 56px minmax(0,1fr); min-height:380px; padding:22px;
  border:2px solid #fff; border-radius:28px; background:linear-gradient(135deg,#EAF4F5,#F3FAF8);
  box-shadow:var(--jdh-feat-shadow); font-family:var(--jd-sans); color:var(--jd-ink); }
.jdh-feat-src-list { display:grid; grid-template-rows:repeat(5,minmax(0,1fr)); align-items:center; }
.jdh-feat-src-pill { display:flex; align-items:center; gap:8px; padding:5px 12px 5px 5px; border:1px solid var(--jd-line);
  border-radius:100px; background:#fff; box-shadow:0 8px 18px -14px rgba(24,27,41,.45);
  font-size:13.5px; font-weight:600; line-height:18px; white-space:nowrap; }
.jdh-feat-src-ico { flex:none; width:24px; height:24px; border-radius:50%; background:var(--jdh-feat-hl);
  color:var(--jd-teal-deep); display:inline-flex; align-items:center; justify-content:center; }
.jdh-feat-src-wire { position:relative; }
.jdh-feat-src-lines { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.jdh-feat-src-lines path { fill:none; stroke:var(--jd-teal); stroke-opacity:.5; stroke-width:1.5; stroke-dasharray:3 4; }
.jdh-feat-src-lines path.is-out { stroke-opacity:1; stroke-dasharray:none; }
.jdh-feat-src-chev { position:absolute; left:50%; top:50%; width:28px; height:28px; transform:translate(-50%,-50%);
  border-radius:50%; background:var(--jd-teal); color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow:0 0 0 4px rgba(46,116,131,.14), 0 8px 16px -8px rgba(2,79,95,.7); }
.jdh-feat-src-card { align-self:center; border-radius:16px; }
.jdh-feat-src-card .jdh-feat-mhead { padding:12px 16px; font-size:15px; line-height:20px; }
.jdh-feat-src-text { padding:12px 16px 4px; font-size:13px; line-height:20px; }
.jdh-feat-src-card .jdh-feat-mfoot { padding:10px 16px 14px; font-size:12px; }

/* ---- mobile: drop the card chrome, mock first, one column ---- */
@media (max-width:900px) {
  .jdh-feat { padding:40px 0; }
  .jdh-feat-list { gap:56px; }
  .jdh-card.jdh-feat-row { grid-template-columns:minmax(0,1fr); row-gap:32px; background:transparent; border:0;
    border-radius:0; padding:0; min-height:0; }
  .jdh-feat-mock { order:-1; width:100%; max-width:var(--jdh-feat-mock); justify-self:center; }
  .jdh-feat .jdh-feat-pills { margin-top:28px; }
  .jdh-feat-pill { font-size:15px; line-height:22px; padding:10px 14px; gap:10px; }
  .jdh-ghost.jdh-feat-cta { margin-top:28px; }
  .jdh-feat-ai-head { font-size:18px; }
  .jdh-feat-acad { min-height:0; }
  .jdh-feat-acad-tone { white-space:normal; }
  .jdh-feat-src { grid-template-columns:auto 36px minmax(0,1fr); min-height:0; padding:14px; border-radius:22px; }
  .jdh-feat-src-pill { gap:6px; padding:4px 9px 4px 4px; font-size:12px; line-height:16px; }
  .jdh-feat-src-ico { width:20px; height:20px; }
  .jdh-feat-src-chev { width:24px; height:24px; }
  .jdh-feat-src-card .jdh-feat-mhead { padding:10px 12px; font-size:14px; }
  .jdh-feat-src-text { padding:10px 12px 2px; font-size:12.5px; line-height:19px; }
  .jdh-feat-src-card .jdh-feat-mfoot { padding:8px 12px 12px; }
}


.jdh-ba { --jdh-ba-red-ink:#B42318; --jdh-ba-mint:#E3F6F3;
  padding:88px 0; overflow-x:clip; background:linear-gradient(180deg, rgba(230,241,244,.75), rgba(242,245,253,.35)); }
.jdh-ba .jdh-ba-title { text-align:center; }
.jdh-ba-stage { max-width:960px; margin:48px auto 0; }

/* ---- side labels (always visible, outside the clipped layers) ---- */
.jdh-ba-caps { display:flex; justify-content:space-between; align-items:flex-end; gap:16px; margin-bottom:16px; }
.jdh-ba .jdh-ba-cap { display:flex; align-items:center; flex-wrap:wrap; gap:6px 10px; min-width:0; }
.jdh-ba .jdh-ba-cap.is-after { justify-content:flex-end; text-align:right; }
.jdh-ba-label { font-size:16px; line-height:24px; font-weight:600; color:var(--jd-ink); }
.jdh-ba-chip { display:inline-flex; align-items:center; padding:3px 10px; border-radius:100px;
  font-size:12.5px; line-height:18px; font-weight:600; letter-spacing:.1px; white-space:nowrap; }
.jdh-ba-chip.is-ai { background:var(--jd-ai-red-bg); color:var(--jdh-ba-red-ink); }
.jdh-ba-chip.is-hu { background:var(--jdh-ba-mint); color:var(--jd-teal-deep); }

/* ---- frame + layers ---- */
.jdh-ba-frame { --jdh-ba-pos:50; position:relative; display:grid; border-radius:24px; border:1px solid var(--jd-line);
  background:#fff; box-shadow:0 24px 60px -34px rgba(24,27,41,.3); isolation:isolate;
  cursor:ew-resize; touch-action:pan-y; user-select:none; -webkit-user-select:none; -webkit-tap-highlight-color:transparent; }
.jdh-ba-layer { grid-area:1 / 1; min-width:0; padding:32px 40px; border-radius:inherit; }
.jdh-ba-layer.is-before { background:#FFFAF9; clip-path:inset(0 calc(100% - var(--jdh-ba-pos) * 1%) 0 0); }
.jdh-ba-layer.is-after { background:#F7FCFB; clip-path:inset(0 0 0 calc(var(--jdh-ba-pos) * 1%)); }
.jdh-ba .jdh-ba-text { font-family:var(--jd-sans); font-size:16px; line-height:27px; color:var(--jd-ink); }
.jdh-ba-text mark { color:inherit; border-radius:3px; padding:1px 1px; -webkit-box-decoration-break:clone; box-decoration-break:clone; }
.jdh-ba-text .jdh-ba-ai { background:var(--jd-ai-red-bg); box-shadow:inset 0 -2px 0 var(--jd-ai-red); border-radius:2px 2px 0 0; }
.jdh-ba-text .jdh-ba-hu { background:var(--jdh-ba-mint); color:var(--jd-teal-deep); }

/* ---- divider rail + slider handle ---- */
.jdh-ba-rail { position:absolute; top:0; bottom:0; right:100%; width:100%; z-index:2; pointer-events:none;
  transform:translateX(calc(var(--jdh-ba-pos) * 1%)); }
.jdh-ba-rail::before { content:''; position:absolute; top:0; bottom:0; right:0; width:2px; transform:translateX(50%);
  background:var(--jd-teal); box-shadow:0 0 0 3px rgba(255,255,255,.7); }
.jdh-ba-handle { position:absolute; top:50%; right:0; width:44px; height:44px; transform:translate(50%,-50%);
  display:inline-flex; align-items:center; justify-content:center; border-radius:50%; pointer-events:auto;
  background:var(--jd-teal); color:#fff; border:3px solid #fff; box-shadow:0 14px 28px -12px rgba(2,79,95,.6);
  cursor:grab; touch-action:none; }
.jdh-ba-frame.is-drag, .jdh-ba-frame.is-drag .jdh-ba-handle { cursor:grabbing; }
.jdh-ba .jdh-ba-handle:focus-visible { outline:3px solid var(--jd-teal); outline-offset:3px; }

@media (max-width:900px) {
  .jdh-ba { padding:56px 0; }
  .jdh-ba-stage { margin-top:32px; }
  .jdh-ba-layer { padding:26px 28px; }
  .jdh-ba .jdh-ba-text { font-size:15px; line-height:25px; }
}
/* phones: labels stack per side, roomier layers so text clears the handle, larger touch target */
@media (max-width:600px) {
  .jdh-ba-caps { align-items:flex-start; gap:12px; margin-bottom:12px; }
  .jdh-ba .jdh-ba-cap { flex-direction:column; align-items:flex-start; gap:6px; }
  .jdh-ba .jdh-ba-cap.is-after { align-items:flex-end; }
  .jdh-ba-label { font-size:15px; line-height:21px; }
  .jdh-ba-frame { border-radius:20px; }
  .jdh-ba-layer { padding:24px 18px 28px; }
  .jdh-ba .jdh-ba-text { font-size:15.5px; line-height:26px; }
  .jdh-ba-handle { width:46px; height:46px; }
}


.jdh-who { padding:88px 0; }
.jdh-who .jdh-who-title { text-align:center; }
.jdh-who-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; max-width:1040px; margin:48px auto 0; }
.jdh-who-card { background:rgba(255,255,255,.7); border:2px solid #fff; border-radius:24px; padding:26px 28px; }
.jdh-who .jdh-who-tag { display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:100px;
  background:#E8F1F3; color:var(--jd-teal-deep); font-size:14px; line-height:20px; font-weight:600; }
.jdh-who-tag svg { flex:none; }
.jdh-who .jdh-who-body { margin-top:14px; font-size:16px; line-height:25px; color:var(--jd-body); }

@media (max-width:900px) {
  .jdh-who { padding:48px 0; }
  .jdh-who-grid { grid-template-columns:minmax(0,1fr); gap:14px; margin-top:28px; }
  .jdh-who-card { padding:22px 20px; border-radius:20px; }
}


.jdh-save { padding:32px 0 64px; }
.jdh-save .jdh-save-title { text-align:center; margin-bottom:40px; }
.jdh-save-grid { display:grid; grid-template-columns:minmax(0,620fr) minmax(0,451fr); column-gap:52px;
  align-items:center; max-width:1123px; margin:0 auto; }

/* ---------- media panel + crossfading panes ---------- */
.jdh-save-media { position:relative; width:100%; aspect-ratio:620/394; overflow:hidden; border-radius:24px;
  background:linear-gradient(135deg,#EAF4F5,#F3FAF8); border:2px solid #D9F0EC;
  box-shadow:0 20px 50px -30px rgba(24,27,41,.25); container-type:inline-size; --u:1px; }
@supports (width:1cqw) { .jdh-save-media { --u:calc(100cqw / 616); } }
.jdh-save-pane { position:absolute; inset:0; opacity:0; transition:opacity .5s ease;
  font-family:var(--jd-sans); font-size:calc(14 * var(--u)); color:var(--jd-ink); user-select:none; }
.jdh-save-pane.is-on { opacity:1; }
:where(.jdh-save-pane) svg { flex:none; width:calc(16 * var(--u)); height:calc(16 * var(--u)); }
.jdh-save-media .jdh-save-cursor { position:absolute; width:calc(22 * var(--u)); height:calc(22 * var(--u)); color:var(--jd-ink); z-index:3; }

/* (1) paraphrase toolbar */
.jdh-save-m1-badge { position:absolute; left:calc(168 * var(--u)); top:calc(12 * var(--u)); z-index:2; width:calc(52 * var(--u)); height:calc(52 * var(--u));
  border-radius:50%; border:calc(3 * var(--u)) solid transparent; color:var(--jd-teal);
  background:linear-gradient(#fff,#fff) padding-box,
    conic-gradient(from 210deg, var(--jd-mint), #2E7483, var(--jd-teal-deep), var(--jd-mint)) border-box;
  display:flex; align-items:center; justify-content:center; box-shadow:0 calc(10 * var(--u)) calc(20 * var(--u)) calc(-8 * var(--u)) rgba(2,79,95,.45); }
.jdh-save-m1-badge svg { width:calc(26 * var(--u)); height:calc(26 * var(--u)); }
.jdh-save-m1-src { position:absolute; left:calc(212 * var(--u)); top:calc(36 * var(--u)); width:calc(292 * var(--u)); padding:calc(12 * var(--u)) calc(18 * var(--u));
  background:rgba(255,255,255,.75); border-radius:calc(6 * var(--u)); transform:rotate(2.5deg);
  font-size:calc(17 * var(--u)); line-height:calc(28 * var(--u)); }
.jdh-save-m1-src mark { background:#DCECEF; color:inherit; -webkit-box-decoration-break:clone; box-decoration-break:clone; }
.jdh-save-m1-pin { position:absolute; width:calc(8 * var(--u)); height:calc(8 * var(--u)); border-radius:50%; background:#2E7483; }
.jdh-save-m1-pin[data-at="a"] { left:calc(12 * var(--u)); top:calc(10 * var(--u)); }
.jdh-save-m1-pin[data-at="b"] { right:calc(12 * var(--u)); bottom:calc(8 * var(--u)); }
.jdh-save-m1-tip { position:absolute; left:calc(128 * var(--u)); top:calc(158 * var(--u)); z-index:2; padding:calc(4 * var(--u)) calc(9 * var(--u));
  border-radius:calc(4 * var(--u)); background:var(--jd-ink-2); color:#fff; font-size:calc(12 * var(--u)); line-height:calc(16 * var(--u)); font-weight:500; }
.jdh-save-m1-card { position:absolute; left:calc(118 * var(--u)); top:calc(186 * var(--u)); width:calc(384 * var(--u)); padding:calc(12 * var(--u)) calc(16 * var(--u));
  background:#fff; border-radius:calc(12 * var(--u)); box-shadow:0 calc(18 * var(--u)) calc(40 * var(--u)) calc(-20 * var(--u)) rgba(24,27,41,.35); }
.jdh-save-m1-tools { position:relative; display:flex; align-items:center; gap:calc(8 * var(--u)); }
.jdh-save-m1-ico { width:calc(32 * var(--u)); height:calc(32 * var(--u)); border-radius:50%; color:#3D5F66;
  display:inline-flex; align-items:center; justify-content:center; }
.jdh-save-m1-ico svg { width:calc(17 * var(--u)); height:calc(17 * var(--u)); }
.jdh-save-m1-ico.is-on { background:#EEF1F6; color:var(--jd-teal); }
.jdh-save-m1-sep { width:1px; height:calc(20 * var(--u)); margin:0 calc(4 * var(--u)); background:var(--jd-line); }
.jdh-save-m1-tools .jdh-save-cursor { left:calc(58 * var(--u)); top:calc(18 * var(--u)); }
.jdh-save-m1-stats { display:flex; gap:calc(16 * var(--u)); margin-top:calc(10 * var(--u)); font-size:calc(11 * var(--u)); line-height:calc(16 * var(--u)); color:#A3A9B6; }
.jdh-save-m1-out { margin-top:calc(8 * var(--u)); font-size:calc(14 * var(--u)); line-height:calc(21 * var(--u)); }
.jdh-save-m1-foot { display:flex; align-items:center; justify-content:space-between; margin-top:calc(12 * var(--u)); }
.jdh-save-m1-copy { display:inline-flex; align-items:center; gap:calc(6 * var(--u)); padding:calc(5 * var(--u)) calc(11 * var(--u)); border-radius:100px;
  background:#EEF4F5; font-size:calc(12 * var(--u)); line-height:calc(16 * var(--u)); font-weight:500; color:#3D5F66; }
.jdh-save-m1-copy svg { width:calc(13 * var(--u)); height:calc(13 * var(--u)); }
.jdh-save-m1-mark { font-size:calc(15 * var(--u)); font-weight:700; letter-spacing:-.3px; color:#C9CFDB; }

/* (2) 3x2 grid of the six real tools + "one plan" callout */
.jdh-save-m2-grid { position:absolute; left:calc(102 * var(--u)); top:calc(40 * var(--u)); display:grid;
  grid-template-columns:repeat(3,calc(128 * var(--u))); grid-auto-rows:calc(120 * var(--u)); gap:calc(14 * var(--u)); }
.jdh-save-m2-tile { padding:calc(14 * var(--u)); display:flex; flex-direction:column; justify-content:space-between;
  background:#fff; border:1px solid #E6EAF2; border-radius:calc(12 * var(--u)); box-shadow:0 calc(8 * var(--u)) calc(20 * var(--u)) calc(-16 * var(--u)) rgba(24,27,41,.35); }
.jdh-save-m2-ico { width:calc(40 * var(--u)); height:calc(40 * var(--u)); border-radius:calc(10 * var(--u)); background:#E3F6F3; color:var(--jd-teal-deep);
  display:flex; align-items:center; justify-content:center; }
.jdh-save-m2-ico svg { width:calc(20 * var(--u)); height:calc(20 * var(--u)); }
.jdh-save-m2-label { font-size:calc(14 * var(--u)); line-height:calc(17 * var(--u)); font-weight:600; letter-spacing:-.1px; }
.jdh-save-m2-call { position:absolute; left:50%; top:calc(316 * var(--u)); transform:translateX(-50%); padding:calc(10 * var(--u)) calc(22 * var(--u));
  border-radius:100px; background:var(--jd-teal-deep); color:#fff; white-space:nowrap;
  font-size:calc(17 * var(--u)); line-height:calc(22 * var(--u)); font-weight:600; letter-spacing:-.2px;
  box-shadow:0 calc(12 * var(--u)) calc(24 * var(--u)) calc(-12 * var(--u)) rgba(2,79,95,.6); }

/* (3) plagiarism report fan */
.jdh-save-m3-doc { position:absolute; width:calc(130 * var(--u)); height:calc(200 * var(--u)); border-radius:calc(8 * var(--u)); border:1px solid #EEF0F5;
  background-color:#fff; background-repeat:no-repeat; background-position:calc(14 * var(--u)) calc(32 * var(--u));
  background-size:calc(100% - calc(28 * var(--u))) calc(100% - calc(46 * var(--u)));
  background-image:repeating-linear-gradient(180deg,#EDF0F5 0 calc(5 * var(--u)),transparent calc(5 * var(--u)) calc(13 * var(--u)));
  box-shadow:0 calc(12 * var(--u)) calc(28 * var(--u)) calc(-18 * var(--u)) rgba(24,27,41,.35); }
.jdh-save-m3-doc::before { content:''; position:absolute; left:calc(14 * var(--u)); top:calc(14 * var(--u)); width:calc(56 * var(--u)); height:calc(7 * var(--u));
  border-radius:calc(3 * var(--u)); background:#D5DAE5; }
.jdh-save-m3-doc[data-d="1"] { left:calc(28 * var(--u)); top:calc(110 * var(--u)); transform:rotate(-10deg); opacity:.8; }
.jdh-save-m3-doc[data-d="2"] { left:calc(96 * var(--u)); top:calc(66 * var(--u)); transform:rotate(-5deg); opacity:.92; }
.jdh-save-m3-doc[data-d="3"] { left:calc(396 * var(--u)); top:calc(44 * var(--u)); transform:rotate(3deg); }
.jdh-save-m3-doc[data-d="4"] { left:calc(462 * var(--u)); top:calc(82 * var(--u)); transform:rotate(8deg); opacity:.88;
  background-image:repeating-linear-gradient(180deg,rgba(229,72,77,.32) 0 calc(5 * var(--u)),transparent calc(5 * var(--u)) calc(13 * var(--u))); }
.jdh-save-m3-card { position:absolute; left:calc(176 * var(--u)); top:calc(26 * var(--u)); z-index:1; width:calc(264 * var(--u)); height:calc(400 * var(--u));
  padding:calc(16 * var(--u)); background:#fff; border:1px solid #EEF0F5; border-radius:calc(14 * var(--u));
  box-shadow:0 calc(24 * var(--u)) calc(50 * var(--u)) calc(-24 * var(--u)) rgba(24,27,41,.45); }
.jdh-save-m3-head { display:flex; align-items:center; gap:calc(10 * var(--u)); font-size:calc(14 * var(--u)); line-height:calc(18 * var(--u)); font-weight:600; }
.jdh-save-m3-hico { width:calc(28 * var(--u)); height:calc(28 * var(--u)); border-radius:calc(7 * var(--u)); background:var(--jd-lav); color:var(--jd-teal-deep);
  display:flex; align-items:center; justify-content:center; }
.jdh-save-m3-hico svg { width:calc(15 * var(--u)); height:calc(15 * var(--u)); }
.jdh-save-m3-desc { margin-top:calc(12 * var(--u)); font-size:calc(10.5 * var(--u)); line-height:calc(15 * var(--u)); color:var(--jd-body); }
.jdh-save-m3-btn { margin-top:calc(12 * var(--u)); height:calc(36 * var(--u)); border-radius:calc(8 * var(--u)); display:flex; align-items:center;
  justify-content:center; gap:calc(6 * var(--u)); background:linear-gradient(90deg,var(--jd-mint),#2E7483); color:#fff;
  font-size:calc(10.5 * var(--u)); font-weight:700; letter-spacing:.3px; }
.jdh-save-m3-btn svg { width:calc(12 * var(--u)); height:calc(12 * var(--u)); }
.jdh-save-m3-bars { margin-top:calc(14 * var(--u)); display:flex; flex-direction:column; gap:calc(10 * var(--u)); }
.jdh-save-m3-bars > span { display:block; height:calc(14 * var(--u)); border-radius:calc(4 * var(--u)); background:#EEF1F6; }
.jdh-save-m3-bars > span:nth-child(2) { width:86%; }
.jdh-save-m3-bars > span:nth-child(4) { width:70%; }
.jdh-save-m3-chip { position:absolute; z-index:2; display:flex; align-items:baseline; gap:calc(8 * var(--u)); padding:calc(9 * var(--u)) calc(14 * var(--u));
  white-space:nowrap; background:#fff; border:1px solid #E4E7F2; border-radius:calc(8 * var(--u));
  box-shadow:0 calc(10 * var(--u)) calc(22 * var(--u)) calc(-12 * var(--u)) rgba(2,79,95,.35); }
.jdh-save-m3-chip b { font-size:calc(18 * var(--u)); line-height:calc(22 * var(--u)); font-weight:700; color:var(--jd-teal-deep); }
.jdh-save-m3-chip span { font-size:calc(11.5 * var(--u)); line-height:calc(16 * var(--u)); font-weight:500; }
.jdh-save-m3-chip.is-alert b { color:var(--jd-ai-red); }
.jdh-save-m3-chip[data-c="1"] { left:calc(62 * var(--u)); top:calc(206 * var(--u)); transform:rotate(3deg); }
.jdh-save-m3-chip[data-c="2"] { left:calc(384 * var(--u)); top:calc(196 * var(--u)); transform:rotate(-6deg); }
.jdh-save-m3-chip[data-c="3"] { left:calc(52 * var(--u)); top:calc(292 * var(--u)); transform:rotate(-7deg); }
.jdh-save-m3-chip[data-c="4"] { left:calc(356 * var(--u)); top:calc(290 * var(--u)); transform:rotate(6deg); }

/* (4) AI-score card: ring gauge, verdict, one bar per sentence + review chip */
.jdh-save-m4-card { position:absolute; left:calc(128 * var(--u)); top:calc(50 * var(--u)); width:calc(360 * var(--u)); padding:calc(20 * var(--u));
  background:#fff; border:1px solid #E6EAF2; border-radius:calc(14 * var(--u)); box-shadow:0 calc(24 * var(--u)) calc(50 * var(--u)) calc(-24 * var(--u)) rgba(24,27,41,.45); }
.jdh-save-m4-head { display:flex; align-items:center; gap:calc(18 * var(--u)); }
.jdh-save-m4-ring { flex:none; width:calc(108 * var(--u)); height:calc(108 * var(--u)); }
.jdh-save-m4-ring circle { fill:none; stroke-width:10; }
.jdh-save-m4-ring .is-human { stroke:var(--jd-mint); }
.jdh-save-m4-ring .is-ai { stroke:var(--jd-ai-red); }
.jdh-save-m4-pct { font-size:24px; font-weight:700; letter-spacing:-.5px; fill:var(--jd-ink);
  text-anchor:middle; dominant-baseline:middle; }
.jdh-save-m4-unit { font-size:11px; font-weight:600; letter-spacing:.6px; fill:var(--jd-muted);
  text-anchor:middle; dominant-baseline:middle; }
.jdh-save-m4-cap { font-size:calc(11 * var(--u)); line-height:calc(14 * var(--u)); font-weight:600; letter-spacing:.5px; text-transform:uppercase;
  color:var(--jd-muted); }
.jdh-save-m4-verdict { display:flex; align-items:center; gap:calc(6 * var(--u)); margin-top:calc(6 * var(--u)); font-size:calc(17 * var(--u));
  line-height:calc(22 * var(--u)); font-weight:600; letter-spacing:-.2px; color:var(--jd-teal-deep); white-space:nowrap; }
.jdh-save-m4-verdict svg { width:calc(18 * var(--u)); height:calc(18 * var(--u)); color:var(--jd-mint); }
.jdh-save-m4-sub { margin-top:calc(4 * var(--u)); font-size:calc(12 * var(--u)); line-height:calc(16 * var(--u)); color:var(--jd-muted); }
.jdh-save-m4-rows { display:flex; flex-direction:column; gap:calc(12 * var(--u)); margin-top:calc(18 * var(--u)); padding-top:calc(16 * var(--u));
  border-top:1px solid #EEF0F5; }
.jdh-save-m4-row { display:block; height:calc(10 * var(--u)); border-radius:calc(5 * var(--u)); background:rgba(20,163,154,.34); }
.jdh-save-m4-row[data-r="2"] { width:88%; }
.jdh-save-m4-row[data-r="4"] { width:72%; }
.jdh-save-m4-row.is-ai { width:46%; background:rgba(229,72,77,.6); }
.jdh-save-m4-legend { display:flex; gap:calc(16 * var(--u)); margin-top:calc(16 * var(--u)); font-size:calc(11 * var(--u)); line-height:calc(14 * var(--u)); color:var(--jd-muted); }
.jdh-save-m4-legend > span { display:inline-flex; align-items:center; gap:calc(6 * var(--u)); }
.jdh-save-m4-legend > span::before { content:''; width:calc(8 * var(--u)); height:calc(8 * var(--u)); border-radius:50%; background:var(--jd-mint); }
.jdh-save-m4-legend > span.is-ai::before { background:var(--jd-ai-red); }
.jdh-save-m4-chip { position:absolute; left:calc(420 * var(--u)); top:calc(238 * var(--u)); z-index:2; display:flex; align-items:center; gap:calc(7 * var(--u));
  padding:calc(8 * var(--u)) calc(13 * var(--u)); white-space:nowrap; background:#fff; border:1px solid #E4E7F2; border-radius:calc(8 * var(--u));
  font-size:calc(12 * var(--u)); line-height:calc(16 * var(--u)); font-weight:600; color:var(--jd-ai-red); transform:rotate(-4deg);
  box-shadow:0 calc(10 * var(--u)) calc(22 * var(--u)) calc(-12 * var(--u)) rgba(2,79,95,.35); }
.jdh-save-m4-chip::before { content:''; width:calc(7 * var(--u)); height:calc(7 * var(--u)); border-radius:50%; background:var(--jd-ai-red); }

/* ---------- feature list with 5s progress tracks ---------- */
.jdh-save-list { display:flex; flex-direction:column; gap:13px; }
.jdh-save-item { position:relative; text-align:left; transition:opacity .4s ease; }
.jdh-save .jdh-save-t { font-family:var(--jd-sans); font-size:22px; line-height:28px; font-weight:500;
  letter-spacing:-.2px; color:var(--jd-ink); transition:color .2s ease; }
.jdh-save-t button { font:inherit; color:inherit; letter-spacing:inherit; text-align:inherit; padding:0; border:0;
  background:none; cursor:pointer; }
.jdh-save-t button::after { content:''; position:absolute; inset:-8px -10px; border-radius:10px; }
.jdh-save-t button:focus-visible { outline:none; }
.jdh-save-t button:focus-visible::after { outline:2px solid var(--jd-teal); }
.jdh-save .jdh-save-d { margin-top:4px; font-size:17px; line-height:25px; color:var(--jd-body); }
.jdh-save-track { display:block; height:3px; margin-top:10px; border-radius:2px; background:#C9DCE0; overflow:hidden; }
.jdh-save-fill { display:block; height:100%; background:var(--jd-teal-deep); transform:scaleX(0); transform-origin:left center; }
.jdh-save-item.is-active .jdh-save-fill { animation:jdh-save-fill 5s linear forwards; }
@keyframes jdh-save-fill { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@media (hover:hover) {
  .jdh-save:hover .jdh-save-fill { animation-play-state:paused; }
  .jdh-save-item:not(.is-active):hover .jdh-save-t { color:var(--jd-teal-deep); }
}

.jdh-save-dots { display:none; justify-content:center; gap:2px; margin-top:16px; }
.jdh-save-dot { width:18px; height:18px; padding:0; border:0; background:none; cursor:pointer; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center; }
.jdh-save-dot::before { content:''; width:8px; height:8px; border-radius:50%; background:#E3E6EE; transition:background .25s ease; }
.jdh-save-dot[aria-current="true"]::before { background:var(--jd-teal); }
.jdh-save-dot:focus-visible { outline:2px solid var(--jd-teal); outline-offset:1px; }

.jdh-save-cta { display:flex; justify-content:center; margin-top:40px; }

@media (prefers-reduced-motion:reduce) {
  .jdh-save-item.is-active .jdh-save-fill { animation:none; transform:none; }
}

/* ---------- mobile: panel on top, only the active caption, dots ---------- */
@media (max-width:900px) {
  .jdh-save { padding:24px 0 48px; }
  .jdh-save .jdh-save-title { margin-bottom:24px; }
  .jdh-save-grid { grid-template-columns:minmax(0,1fr); row-gap:20px; }
  .jdh-save-media { border-radius:16px; }
  /* captions share one grid cell: height = tallest caption, so nothing below jumps */
  .jdh-save-list { display:grid; }
  .jdh-save-item { grid-area:1/1; text-align:center; }
  .jdh-save-item:not(.is-active) { opacity:0; visibility:hidden; }
  .jdh-save .jdh-save-t { font-size:20px; line-height:26px; }
  .jdh-save .jdh-save-d { font-size:16px; line-height:24px; }
  /* track stays in the tree (its animationend drives auto-advance) but takes no space */
  .jdh-save-track { height:0; margin-top:0; }
  .jdh-save-dots { display:flex; gap:0; }
  .jdh-save-dot { width:40px; height:40px; }
  .jdh-save-cta { margin-top:28px; }
}


.jdh-hc { padding:72px 0; }
.jdh-hc-row { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:48px; align-items:center;
  max-width:1120px; }
.jdh-hc .jdh-hc-tag { display:inline-flex; padding:6px 12px; border-radius:100px; background:#E3F6F3;
  color:var(--jd-teal-deep); font-size:14px; line-height:18px; font-weight:500; }
.jdh-hc .jdh-hc-title { margin-top:14px; }
.jdh-hc .jdh-hc-sub { margin-top:14px; font-size:17px; line-height:26px; color:var(--jd-body); }
.jdh-hc .jdh-hc-cta { margin-top:28px; }
.jdh-hc-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.jdh-hc-card { background:rgba(255,255,255,.7); border:2px solid #fff; border-radius:20px; padding:22px 22px 24px; }
.jdh-hc-ico { width:40px; height:40px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center;
  background:var(--jd-lav); color:var(--jd-teal-deep); }
.jdh-hc .jdh-hc-name { margin-top:14px; font-size:17px; line-height:24px; font-weight:600; color:var(--jd-ink); }
.jdh-hc .jdh-hc-body { margin-top:6px; font-size:15px; line-height:22px; color:var(--jd-body); }

@media (max-width:900px) {
  .jdh-hc { padding:48px 0; }
  .jdh-hc-row { grid-template-columns:minmax(0,1fr); gap:28px; }
  .jdh-hc-copy { text-align:center; }
  .jdh-hc-grid { gap:12px; }
  .jdh-hc-card { padding:18px 16px 20px; border-radius:18px; }
}
@media (max-width:560px) {
  .jdh-hc-grid { grid-template-columns:minmax(0,1fr); }
}


.jdh-tg { padding:64px 0; }
.jdh-tg .jdh-tg-title { text-align:center; }
.jdh-tg-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; max-width:1000px; margin:40px auto 0; }

.jdh-tg .jdh-tg-card { display:flex; align-items:center; gap:14px; height:100%; padding:18px 20px;
  background:#fff; border:1px solid var(--jd-line); border-radius:16px;
  transition:transform .25s var(--jd-ease), border-color .2s ease, box-shadow .25s ease; }
.jdh-tg-ico { flex:none; width:40px; height:40px; border-radius:12px; display:inline-flex; align-items:center;
  justify-content:center; background:var(--jdh-tg-tint, var(--jd-lav)); color:var(--jd-teal-deep); }
.jdh-tg-text { flex:1; min-width:0; display:flex; flex-direction:column; }
.jdh-tg-name { font-size:17px; line-height:24px; font-weight:500; color:var(--jd-ink); }
.jdh-tg-desc { margin-top:1px; font-size:13px; line-height:18px; color:var(--jd-muted); }
.jdh-tg-chev { flex:none; color:var(--jd-muted); transition:transform .25s var(--jd-ease), color .2s ease; }
.jdh-tg .jdh-tg-card:focus-visible { outline:2px solid var(--jd-teal); outline-offset:3px; }

@media (hover:hover) {
  .jdh-tg .jdh-tg-card:hover { transform:translateY(-2px); border-color:rgba(46,116,131,.35);
    box-shadow:0 16px 32px -22px rgba(2,79,95,.45); }
  .jdh-tg-card:hover .jdh-tg-chev { transform:translateX(3px); color:var(--jd-teal); }
}

@media (max-width:900px) {
  .jdh-tg { padding:48px 0; }
  .jdh-tg-grid { grid-template-columns:minmax(0,1fr); gap:10px; margin-top:28px; }
  .jdh-tg .jdh-tg-card { padding:14px 16px; }
}


.jdh-faq { background:#fff; padding:64px 0 42px; }
.jdh-faq-grid { display:grid; grid-template-columns:340px minmax(0,1fr); column-gap:24px; align-items:start; }
.jdh-faq .jdh-faq-title { font-family:var(--jd-serif); font-weight:300; font-optical-sizing:auto;
  font-size:38px; line-height:46px; letter-spacing:-.64px; color:var(--jd-ink); }

.jdh-faq-list { display:flex; flex-direction:column; gap:40px; }
.jdh-faq-q { min-height:48px; }

/* question row: chevron + serif question, whole row is the button */
.jdh-faq-q button { display:flex; align-items:flex-start; gap:16px; width:100%; min-height:48px; padding:0; border:0;
  background:none; cursor:pointer; text-align:left; color:var(--jd-ink-2);
  font-family:var(--jd-serif); font-weight:300; font-optical-sizing:auto;
  font-size:26px; line-height:32px; letter-spacing:-.4px; }
.jdh-faq-q button > span { transition:color .2s ease; }
.jdh-faq-chev { flex:none; width:24px; height:24px; margin-top:4px; color:var(--jd-ink-2);
  transition:transform .3s var(--jd-ease), color .2s ease; }
.jdh-faq-item.is-open .jdh-faq-chev { transform:rotate(90deg); color:var(--jd-teal); }
.jdh-faq-q button:focus-visible { outline:2px solid var(--jd-teal); outline-offset:4px; border-radius:4px; }
@media (hover:hover) {
  .jdh-faq-q button:hover > span, .jdh-faq-q button:hover .jdh-faq-chev { color:var(--jd-teal-deep); }
}

/* answer: 0fr -> 1fr row animates height without measuring; hidden from AT once collapsed */
.jdh-faq-panel { display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s var(--jd-ease); }
.jdh-faq-item.is-open .jdh-faq-panel { grid-template-rows:1fr; }
.jdh-faq-inner { min-height:0; overflow:hidden; visibility:hidden; transition:visibility 0s linear .3s; }
.jdh-faq-item.is-open .jdh-faq-inner { visibility:visible; transition-delay:0s; }
.jdh-faq .jdh-faq-a { padding:20px 0 0 40px; font-family:var(--jd-sans); font-size:16px; line-height:24px;
  font-weight:500; color:#0A0A0A; }

@media (max-width:900px) {
  .jdh-faq { padding:40px 0 32px; }
  .jdh-faq-grid { grid-template-columns:minmax(0,1fr); row-gap:20px; }
  .jdh-faq .jdh-faq-title { font-family:var(--jd-sans); font-weight:700; font-size:20px; line-height:28px;
    letter-spacing:0; text-align:left; }
  .jdh-faq-list { gap:24px; }
  .jdh-faq-q button { gap:12px; font-family:var(--jd-sans); font-weight:600; font-size:16px; line-height:24px;
    letter-spacing:0; }
  .jdh-faq-chev { width:20px; height:20px; margin-top:2px; }
  .jdh-faq .jdh-faq-a { padding:12px 0 0 32px; font-size:15px; line-height:23px; }
}


.jdh-fcta { position:relative; isolation:isolate; padding:96px 0; text-align:center; }
.jdh-fcta::before { content:''; position:absolute; left:50%; top:50%; z-index:-1; width:min(920px, 96vw); height:440px;
  transform:translate(-50%,-50%); pointer-events:none; filter:blur(36px);
  background:
    radial-gradient(closest-side at 36% 50%, rgba(46,116,131,.12), rgba(46,116,131,0)),
    radial-gradient(closest-side at 64% 52%, rgba(248,200,160,.25), rgba(248,200,160,0)); }
.jdh-fcta-inner { display:flex; flex-direction:column; align-items:center; }
.jdh-fcta .jdh-fcta-sub { max-width:560px; margin-top:16px; font-size:18px; line-height:28px; color:var(--jd-body); }
.jdh-btn.jdh-fcta-btn { margin-top:32px; }
.jdh-fcta .jdh-fcta-points { display:flex; flex-wrap:wrap; justify-content:center; gap:10px 24px; margin-top:24px; }
.jdh-fcta-points li { display:inline-flex; align-items:center; gap:6px; font-size:15px; line-height:22px;
  font-weight:500; color:var(--jd-ink); }
.jdh-fcta-points svg { flex:none; color:var(--jd-teal); }

@media (max-width:900px) {
  .jdh-fcta { padding:64px 0; }
  .jdh-fcta::before { height:360px; filter:blur(28px); }
  .jdh-fcta .jdh-fcta-sub { font-size:16px; line-height:26px; }
  .jdh-btn.jdh-fcta-btn { margin-top:28px; }
  .jdh-fcta .jdh-fcta-points { flex-direction:column; align-items:center; gap:8px; margin-top:20px; }
}