/* CellAssist site stylesheet. One file for every page on www.cellassist.ai.
 *
 * Linked as /assets/site.css?v=<hash>; scripts/build-marketing-pages.mjs stamps the hash into
 * every page, generated and hand-written, so the 30-day /assets cache never serves stale CSS.
 * Edit this file, then re-run `npm run pages`.
 *
 * Sections: fonts · tokens · base · type · layout · chrome (header, menu, footer, sticky bar,
 * cookie banner) · components · home · pricing · industry · guides · legal · motion · phone.
 * The phone layout lives in ONE breakpoint, max-width 760px, at the end of the file.
 * Values are the CellAssist design system's (reference_designs, "CellAssist Landing Page
 * Redesign"); a raw hex below is a design value with no token of its own.
 * ⚠ The design measures widths in content-box (max-width 1200px PLUS its padding), and this
 * file is border-box, so containers read calc(1200px + 2 * var(--gutter)). Writing a plain
 * 1200px narrows every column by 48px and re-wraps the hero headline onto three lines. */

/* ── Fonts ─────────────────────────────────────────────────────────────────────────────── */
/* Self-hosted; see fonts/README.md. All variable. unicode-range keeps each page to the
 * scripts it renders. */

@font-face{font-family:'DM Sans';font-style:normal;font-weight:100 1000;font-display:swap;
  src:url(fonts/dm-sans-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:100 1000;font-display:swap;
  src:url(fonts/dm-sans-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Noto Sans Devanagari';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(fonts/noto-sans-devanagari.woff2) format('woff2');
  unicode-range:U+0900-097F,U+1CD0-1CF4,U+1CF7-1CF9,U+200C-200D,U+20A8,U+20F0,U+25CC,U+A830-A839,U+A8E0-A8FF,U+11B00-11B0A}
@font-face{font-family:'Noto Sans Kannada';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(fonts/noto-sans-kannada.woff2) format('woff2');
  unicode-range:U+0951-0952,U+0964-0965,U+0B83,U+0C80-0CF3,U+1CD0,U+1CD2-1CD3,U+1CDA,U+1CF2,U+1CF4,U+200C-200D,U+25CC,U+A830-A835}
@font-face{font-family:'Noto Sans Tamil';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(fonts/noto-sans-tamil.woff2) format('woff2');
  unicode-range:U+0964-0965,U+0B82-0BFA,U+200C-200D,U+25CC}
@font-face{font-family:'Noto Sans Telugu';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(fonts/noto-sans-telugu.woff2) format('woff2');
  unicode-range:U+0951-0952,U+0964-0965,U+0B83,U+0C00-0C7F,U+1CD5-1CD6,U+1CD8,U+1CDA,U+1CF2,U+200C-200D,U+25CC}
/* The greetings: one family, eight tiny files, each holding one word's glyphs. Devanagari
   is the ninth and larger one: it holds every Devanagari letter the English, Kannada, Tamil
   and Telugu pages show (two greetings and the homepage's Hindi call card), so those pages
   skip the 121 KB Noto file, which only /hi and /mr load. See fonts/README.md. */
@font-face{font-family:'CA Greet';font-weight:100 900;font-display:swap;src:url(fonts/greet-devanagari.woff2) format('woff2');unicode-range:U+0900-097F,U+200C-200D,U+25CC}
@font-face{font-family:'CA Greet';font-weight:100 900;font-display:swap;src:url(fonts/greet-bengali.woff2) format('woff2');unicode-range:U+0980-09FE}
@font-face{font-family:'CA Greet';font-weight:100 900;font-display:swap;src:url(fonts/greet-tamil.woff2) format('woff2');unicode-range:U+0B82-0BFA}
@font-face{font-family:'CA Greet';font-weight:100 900;font-display:swap;src:url(fonts/greet-telugu.woff2) format('woff2');unicode-range:U+0C00-0C7F}
@font-face{font-family:'CA Greet';font-weight:100 900;font-display:swap;src:url(fonts/greet-kannada.woff2) format('woff2');unicode-range:U+0C80-0CF3}
@font-face{font-family:'CA Greet';font-weight:100 900;font-display:swap;src:url(fonts/greet-malayalam.woff2) format('woff2');unicode-range:U+0D00-0D7F}
@font-face{font-family:'CA Greet';font-weight:100 900;font-display:swap;src:url(fonts/greet-gujarati.woff2) format('woff2');unicode-range:U+0A80-0AFF}
@font-face{font-family:'CA Greet';font-weight:100 900;font-display:swap;src:url(fonts/greet-gurmukhi.woff2) format('woff2');unicode-range:U+0A01-0A76}
@font-face{font-family:'CA Greet';font-weight:100 900;font-display:swap;src:url(fonts/greet-oriya.woff2) format('woff2');unicode-range:U+0B01-0B77}

/* ── Tokens ────────────────────────────────────────────────────────────────────────────── */

:root{
  --brand:#6C5CE7;--brand-hover:#5B4BD9;--brand-soft:#EEEBFD;--brand-accent-soft:#CFC7FA;
  --brand-bright:#6C63FF;--mark-soft:#A99AF3;--coral:#F5A07A;
  --ink:#14141A;--ink-2:#4A4A55;--ink-3:#6F6F78;--ink-legal:#2E2A3D;
  --bg:#F5F4F1;--surface:#FFFFFF;--surface-soft:#F8F7FC;
  --dark:#16141A;--dark-2:#26232E;--dark-3:#3A3645;--on-dark-2:#B9B6C6;--on-dark-3:#8E8A9E;
  --border:#E6E4EE;--border-soft:#EFEDF5;--divider:#F1F0F6;
  --shadow-md:0 8px 24px rgba(35,43,93,.08);--shadow-lg:0 18px 48px rgba(35,43,93,.10);
  --shadow-xl:0 30px 70px rgba(35,43,93,.12);--shadow-brand:0 12px 28px rgba(107,127,245,.32);
  --ease-out:cubic-bezier(.22,1,.36,1);--ease-wave:cubic-bezier(.45,0,.55,1);
  --font:'DM Sans','CA Greet',system-ui,-apple-system,'Segoe UI',sans-serif;
  --gutter:24px;
  /* Old name, still used inside guide bodies (scripts/site/guides/*.mjs). */
  --gh-muted:var(--ink-3);
}

/* ── Base ──────────────────────────────────────────────────────────────────────────────── */

*,*::before,*::after{box-sizing:border-box}
/* not until-found: the browser keeps that rendered (content-visibility) so find-in-page reaches it */
[hidden]:not([hidden="until-found"]){display:none!important}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.5;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
html:lang(hi) body,html:lang(mr) body{--font:'DM Sans','Noto Sans Devanagari','CA Greet',system-ui,sans-serif}
html:lang(kn) body{--font:'DM Sans','Noto Sans Kannada','CA Greet',system-ui,sans-serif}
html:lang(ta) body{--font:'DM Sans','Noto Sans Tamil','CA Greet',system-ui,sans-serif}
html:lang(te) body{--font:'DM Sans','Noto Sans Telugu','CA Greet',system-ui,sans-serif}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--brand-hover)}
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--brand);outline-offset:3px;border-radius:4px}
button{font:inherit;color:inherit}
summary{cursor:pointer}
p,h1,h2,h3,h4,ul,ol,figure{margin:0}
/* A long word (an Indic compound, a URL) wraps rather than widening the page on a phone. */
h1,h2,h3,p,li,summary,dd{overflow-wrap:break-word}
main[tabindex="-1"]:focus{outline:none}
.ca-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.ca-ico{display:block;flex-shrink:0}

/* Indic text: letter-spacing pulls conjuncts apart (क्लि becomes क् लि), and a 1.0 line-height
 * clips the vowel signs above and below the line. */
html:not([lang="en"]) h1,html:not([lang="en"]) h2,html:not([lang="en"]) h3{letter-spacing:0!important;line-height:1.3!important}
html:not([lang="en"]) body{line-height:1.7}
[lang]:not([lang="en"]) .ca-msg{line-height:1.6}

/* ── Type ──────────────────────────────────────────────────────────────────────────────── */

.ca-h1{font-size:clamp(48px,6.4vw,88px);line-height:1;letter-spacing:-.035em;font-weight:500}
.ca-h1-page{font-size:clamp(44px,5.6vw,76px);line-height:1.02;letter-spacing:-.035em;font-weight:500}
.ca-h1-doc{font-size:clamp(40px,5vw,64px);line-height:1.04;letter-spacing:-.03em;font-weight:500}
.ca-h2{font-size:clamp(34px,3.6vw,48px);line-height:1.1;letter-spacing:-.02em;font-weight:500}
.ca-h2-sm{font-size:clamp(32px,3.4vw,44px);line-height:1.1;letter-spacing:-.02em;font-weight:500}
.ca-h2-band{font-size:clamp(36px,4.4vw,60px);line-height:1.05;letter-spacing:-.03em;font-weight:500}
.ca-h3-list{font-size:28px;font-weight:500;letter-spacing:-.01em}
.ca-lead{font-size:20px;line-height:1.55;color:var(--ink-2);max-width:30em;text-wrap:pretty}
.ca-lead-sm{font-size:19px;line-height:1.55;color:var(--ink-2);max-width:34em;text-wrap:pretty}
.ca-sub{font-size:18px;line-height:1.55;color:var(--ink-2);max-width:26em}
.ca-caption{font-size:15px;color:var(--ink-3)}

/* ── Layout ────────────────────────────────────────────────────────────────────────────── */

.ca-wrap{max-width:calc(1200px + 2 * var(--gutter));margin-left:auto;margin-right:auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.ca-narrow{max-width:calc(820px + 2 * var(--gutter))}
.ca-section{padding-top:112px;padding-bottom:112px}
.ca-stack{display:flex;flex-direction:column}
.ca-band-white{background:var(--surface);border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-soft)}
.ca-only-phone{display:none}

/* ── Chrome: skip link and header ──────────────────────────────────────────────────────── */

.ca-skip{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 16px;border-radius:12px;background:var(--ink);color:#fff;font-size:15px}
.ca-skip:focus{top:12px;color:#fff}

.ca-header{position:sticky;top:0;z-index:50;background:rgba(245,244,241,.86);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid var(--border-soft)}
.ca-nav{max-width:calc(1200px + 2 * var(--gutter));margin:0 auto;padding:14px var(--gutter);display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.ca-brand{display:inline-flex;align-items:center;gap:10px;font-size:19px;font-weight:700;letter-spacing:-.032em;line-height:1;color:var(--ink);white-space:nowrap}
.ca-brand:hover{color:var(--ink)}
.ca-brand .ca-mark{width:32px;height:32px}
/* --brand-hover, not --brand-bright: 5.5:1 on the header against 3.9:1, and 4.5:1 is the bar */
.ca-brand b{font-weight:500;color:var(--brand-hover)}
.ca-mark{display:block;flex-shrink:0;overflow:visible}
.ca-navlinks{display:flex;gap:28px;margin-left:24px;font-size:15px;flex-grow:1}
.ca-navlinks a[aria-current]{color:var(--brand-hover);font-weight:500}
.ca-navcta{display:flex;gap:12px;align-items:center;margin-left:auto}
.ca-navdemo{font-size:15px;padding:12px 8px;color:var(--ink-3)}
.ca-menu-btn{display:none;margin-left:auto;width:44px;height:44px;border:1px solid var(--border);border-radius:12px;background:var(--surface);align-items:center;justify-content:center;cursor:pointer;padding:0}

/* ── Chrome: phone menu (a modal <dialog>, opened by site.js) ──────────────────────────── */

.ca-menu{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--bg);color:var(--ink);overflow:hidden}
.ca-menu[open]{display:flex;flex-direction:column}
.ca-menu::backdrop{background:transparent}
.ca-menu-top{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-bottom:1px solid var(--border-soft)}
.ca-menu-top .ca-mark{width:28px;height:28px}
.ca-menu-top .ca-brand{font-size:17px}
.ca-menu-close{width:44px;height:44px;border:1px solid var(--border);border-radius:12px;background:var(--surface);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.ca-menu-nav{flex-grow:1;overflow-y:auto;padding:16px 20px}
.ca-menu-list{list-style:none;padding:0}
.ca-menu-list a{display:flex;align-items:center;justify-content:space-between;min-height:60px;border-bottom:1px solid var(--border);font-size:24px;letter-spacing:-.01em;font-weight:500}
.ca-menu-list a[aria-current]{color:var(--brand-hover)}
.ca-menu-demo{display:flex;align-items:center;min-height:44px;margin-top:16px;font-size:16px;color:var(--ink-2)}
.ca-menu-foot{display:flex;flex-direction:column;gap:8px;padding:16px 20px max(28px,env(safe-area-inset-bottom));border-top:1px solid var(--border)}
.ca-menu-foot span{text-align:center;font-size:13px;color:var(--ink-3)}
html.ca-lock{overflow:hidden}

/* ── Chrome: footer ────────────────────────────────────────────────────────────────────── */

.ca-footer{border-top:1px solid var(--border)}
.ca-footer-in{max-width:calc(1200px + 2 * var(--gutter));margin:0 auto;padding:32px var(--gutter) 40px;display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;font-size:14px;color:var(--ink-3)}
.ca-footer-line{flex-grow:1}
.ca-footer-links{display:flex;flex-wrap:wrap;gap:16px 32px}
.ca-footer a{color:var(--ink-3)}
.ca-footer a:hover{color:var(--brand-hover)}
.ca-footer a[aria-current]{color:var(--ink)}
.ca-footer-langs{max-width:calc(1200px + 2 * var(--gutter));margin:-24px auto 0;padding:0 var(--gutter) 32px;display:flex;flex-wrap:wrap;gap:8px 16px;font-size:14px;color:var(--ink-3)}
/* Every industry page, on every page: the one row that links all nine, so none of them hangs
 * off a single link. */
.ca-footer-ind{flex-basis:100%;display:flex;flex-wrap:wrap;gap:8px 24px}
.ca-footer-ind-label{color:var(--ink-2);font-weight:600}
/* The address and the two mailboxes, under the line and the links. Underlined: in this grey,
 * colour alone would not mark them as links (WCAG 1.4.1). */
.ca-footer-contact{flex-basis:100%;display:flex;flex-wrap:wrap;gap:6px 32px;padding-top:16px;border-top:1px solid var(--border-soft);font-style:normal}
.ca-footer-addr{width:100%}
.ca-footer-contact a{text-decoration:underline;text-underline-offset:3px}

/* ── Chrome: sticky bar (phones only) and cookie banner ────────────────────────────────── */

.ca-mcta{display:none}
.ca-mcta-note{text-align:center;font-size:13px;color:var(--ink-3)}

.ca-cookie{position:fixed;left:50%;bottom:16px;z-index:60;width:calc(100% - 32px);max-width:680px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:16px 20px;border-radius:16px;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-lg);
  transform:translate(-50%,140%);opacity:0;transition:transform .45s var(--ease-out),opacity .45s ease}
.ca-cookie.is-in{transform:translate(-50%,0);opacity:1}
.ca-cookie p{flex:1;min-width:220px;font-size:14px;line-height:1.5;color:var(--ink-2)}
.ca-cookie strong{color:var(--ink);font-weight:600}
.ca-cookie-btns{display:flex;gap:10px}

/* ── Components ────────────────────────────────────────────────────────────────────────── */

.ca-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;box-sizing:border-box;border:1px solid transparent;border-radius:14px;
  padding:14px 24px;font-size:16px;line-height:1.2;font-weight:600;text-align:center;white-space:nowrap;cursor:pointer;
  transition:background-color .16s var(--ease-out),border-color .16s var(--ease-out),box-shadow .16s var(--ease-out),color .16s var(--ease-out),transform .16s var(--ease-out)}
.ca-btn:active{transform:scale(.97)}
.ca-btn-primary{background:var(--brand);color:#fff;box-shadow:var(--shadow-brand)}
.ca-btn-primary:hover{background:var(--brand-hover);color:#fff;box-shadow:var(--shadow-lg)}
.ca-btn-flat{box-shadow:none}
.ca-btn-flat:hover{box-shadow:none}
.ca-btn-ghost{background:transparent;color:var(--ink);border-color:var(--border);font-weight:500}
.ca-btn-ghost:hover{background:var(--surface-soft);border-color:var(--brand-accent-soft);color:var(--ink)}
.ca-btn-soft{background:var(--brand-soft);color:var(--brand-hover)}
.ca-btn-soft:hover{background:var(--brand-accent-soft);color:var(--brand-hover)}
.ca-btn-outline{background:var(--surface);color:var(--ink);border-color:var(--border)}
.ca-btn-outline:hover{border-color:var(--brand-accent-soft);background:var(--surface-soft);color:var(--ink)}
.ca-btn-white{background:#fff;color:var(--ink)}
.ca-btn-white:hover{background:var(--brand-soft);color:var(--ink)}
.ca-btn-nav{min-height:44px;padding:0 20px;border-radius:12px;font-size:15px;font-weight:500;box-shadow:none}
.ca-btn-nav:hover{box-shadow:none}
.ca-btn-lg{min-height:56px;padding:0 32px;border-radius:16px;font-size:17px}
.ca-btn-sm{padding:9px 16px;border-radius:12px;font-size:14px}
.ca-btn-block{display:flex;width:100%}

.ca-badge{display:inline-flex;align-items:center;padding:6px 12px;border-radius:999px;font-size:13px;font-weight:500;line-height:1;background:var(--brand-soft);color:var(--brand-hover);white-space:nowrap}
.ca-badge-solid{background:var(--brand);color:#fff}

.ca-chips{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.ca-chip{display:inline-flex;align-items:center;padding:7px 15px;border-radius:999px;border:1.5px solid var(--border);background:var(--surface);font-size:14px;line-height:1.2}
.ca-chip-on{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:var(--shadow-brand)}

.ca-pills{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.ca-pill{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:999px;background:var(--surface);border:1px solid var(--border);font-size:15px;white-space:nowrap;
  transition:background-color .16s var(--ease-out),border-color .16s var(--ease-out),color .16s var(--ease-out)}
.ca-pill:hover{background:var(--brand-soft);border-color:var(--brand-accent-soft);color:var(--brand-hover)}
.ca-pill-on{background:var(--brand);border-color:var(--brand);color:#fff}
.ca-pill-on:hover{background:var(--brand-hover);border-color:var(--brand-hover);color:#fff}

.ca-num{width:36px;height:36px;border-radius:999px;background:var(--brand-soft);color:var(--brand-hover);display:flex;align-items:center;justify-content:center;font-weight:600;flex-shrink:0}

.ca-checks{list-style:none;padding:0;display:flex;flex-direction:column;gap:12px;font-size:16px}
.ca-checks li{display:flex;gap:10px;align-items:flex-start}
.ca-checks .ca-ico{margin-top:2px}

.ca-faq{display:flex;flex-direction:column;gap:28px;padding-top:96px;padding-bottom:96px}
.ca-faq-list details{padding:20px 0;border-bottom:1px solid var(--border)}
.ca-faq-list summary{font-size:19px;font-weight:500;line-height:1.4}
.ca-faq-list details p{margin-top:12px;font-size:17px;line-height:1.6;color:var(--ink-2)}

.ca-callout{padding:24px 28px;border-radius:20px;background:var(--brand-soft);font-size:17px;line-height:1.6;color:var(--ink-legal)}
.ca-callout strong{font-weight:600;color:var(--ink)}
.ca-note{padding:16px 20px;border-radius:16px;background:#FFF7E6;border:1px solid #F5D98B;font-size:15px;line-height:1.6;color:#6B5200}

/* The call card: a sample conversation, used on home and every /for/ page. */
.ca-callwrap{position:relative;justify-self:end;max-width:480px;width:100%}
.ca-glow{position:absolute;inset:-60px -40px;border-radius:999px;background:radial-gradient(circle,rgba(140,124,240,.45) 0%,rgba(108,92,231,.14) 45%,rgba(108,92,231,0) 72%);pointer-events:none}
.ca-call{position:relative;background:var(--surface);border:1px solid var(--border-soft);border-radius:28px;box-shadow:var(--shadow-xl);padding:24px;display:flex;flex-direction:column;gap:14px}
.ca-call-head{display:flex;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--divider)}
.ca-call-head .ca-mark{width:36px;height:36px}
.ca-call-who{display:flex;flex-direction:column;gap:2px;flex-grow:1;min-width:0}
.ca-call-who b{font-size:15px;font-weight:600}
.ca-call-who span{font-size:13px;color:var(--ink-3)}
.ca-call-time{font-size:13px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.ca-lines{display:flex;flex-direction:column;gap:10px;font-size:16px;line-height:1.5}
.ca-msg{max-width:82%;padding:10px 14px}
.ca-msg-a{align-self:flex-start;border-radius:16px 16px 16px 4px;background:var(--surface-soft)}
.ca-msg-c{align-self:flex-end;border-radius:16px 16px 4px 16px;background:var(--ink);color:#fff}
.ca-outcomes{list-style:none;margin-top:4px;padding:14px 0 0;border-top:1px solid var(--divider);display:flex;flex-direction:column;gap:10px;font-size:14px}
.ca-outcomes li{display:flex;align-items:center;gap:10px}
.ca-outcomes strong{font-weight:600}
.ca-call-note{padding-top:10px;border-top:1px solid var(--divider);font-size:13px;color:var(--ink-3)}
.ca-live{display:flex;align-items:center;gap:12px;padding:10px 16px;border-radius:999px;background:var(--dark);color:#fff}
.ca-live-dot{width:8px;height:8px;border-radius:999px;background:var(--coral);flex-shrink:0}
.ca-live-label{font-size:13px;flex-grow:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ca-bars{display:flex;align-items:center;gap:3px;height:22px;flex-shrink:0}
.ca-bars>span{display:block;width:3px;height:20px;border-radius:2px;background:var(--brand-accent-soft);transform-origin:center;transform:scaleY(.25)}
.ca-bars>span:nth-child(3n){background:var(--mark-soft)}
.ca-bars>span:nth-child(7){background:var(--coral)}

/* The homepage card, which plays the call "Play a booking call" plays (site.js, section 4).
 * Its lines and outcomes share one window of fixed height, so the card never changes size:
 * each arrives at its second and the window glides to it. The window reaches up to the header's
 * rule (the negative margin eats the card's gap), so earlier lines slide away under it the way a
 * chat's do. It scrolls by hand only once the call has ended (or without JS). */
.ca-call-sync{--ca-view:368px}
.ca-call-sync .ca-lines{height:var(--ca-view);margin-top:-14px;padding-top:14px;overflow-y:auto;scrollbar-width:none;transition:opacity .9s var(--ease-out)}
.ca-call-sync .ca-lines::-webkit-scrollbar{display:none}
.ca-call-sync .ca-lines>*{flex-shrink:0}
.js .ca-call-sync:not(.is-ended) .ca-lines{overflow-y:hidden}
.js .ca-call-sync [data-at]:not(.is-on){display:none}
.ca-call-sync.is-scrolled .ca-lines{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 20px);mask-image:linear-gradient(to bottom,transparent,#000 20px)}
.ca-call-sync.is-fading .ca-lines{opacity:0}
.ca-call-sync .ca-outcomes{margin-top:2px;padding-top:12px;gap:8px}
.ca-oi{display:grid;place-items:center;width:28px;height:28px;border-radius:999px;background:var(--brand-soft);flex-shrink:0}
.ca-oi svg{width:16px;height:16px}
.ca-oi-wa{background:#25D366}
.ca-live-end{display:none;flex-shrink:0}
.ca-call-sync.is-paused .ca-live-dot{background:var(--on-dark-3)}
.ca-call-sync.is-paused .ca-bars>span{animation:none}
.ca-call-sync.is-ended .ca-live-dot,.ca-call-sync.is-ended .ca-bars{display:none}
.ca-call-sync.is-ended .ca-live-end{display:block}

/* Closing bands */
.ca-band-wrap{padding:0 var(--gutter) 112px}
.ca-band{max-width:1296px;margin:0 auto;border-radius:32px;background:var(--brand);color:#fff;padding:80px 48px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px}
.ca-band .ca-mark{width:64px;height:64px}
/* White, not --brand-soft: 4.9:1 on --brand against 4.2:1 */
.ca-band p{font-size:18px;line-height:1.55;color:#fff;max-width:30em}
.ca-band p.ca-band-small{font-size:15px}
.ca-band p a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.ca-band p a:hover{color:var(--brand-soft)}
.ca-band-dark{background:var(--dark);flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;text-align:left;padding:64px 48px;gap:28px}

/* ── Home ──────────────────────────────────────────────────────────────────────────────── */

/* The call card's glow reaches 40px past the card, beyond the 24px gutter, so between about 760px and 1330px wide it scrolled the page sideways. */
.ca-hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:64px;align-items:center;padding-top:88px;padding-bottom:96px;overflow-x:clip}
.ca-hero-copy{display:flex;flex-direction:column;gap:28px;min-width:0}
.ca-hero-page{padding-bottom:104px}
.ca-hero-page .ca-hero-copy{gap:26px}
.ca-actions{display:flex;gap:12px 16px;flex-wrap:wrap;align-items:center}

/* Pilot logos under the hero (home:logos). Static on purpose, so there is nothing to pause. */
.ca-logos{display:flex;flex-direction:column;gap:22px;padding-bottom:88px}
.ca-logos-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.ca-logos-grid li{display:flex;align-items:center;justify-content:center;min-height:100px;padding:18px 12px;background:var(--surface);border:1px solid var(--border-soft);border-radius:18px}
/* Wide wordmarks are capped by width and round seals by height, so they read at a similar weight. */
.ca-logos-grid img{display:block;width:auto;height:auto;max-width:min(150px,100%);max-height:64px}
/* High contrast turns the tiles black and the grey logos would vanish, so keep the tiles white. */
@media (forced-colors:active){.ca-logos-grid li{forced-color-adjust:none;background:#fff;border-color:CanvasText}}
.ca-logos-proof{font-size:15px;color:var(--ink-2)}

.ca-greet{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:12px;row-gap:4px;font-size:20px;color:var(--ink-2)}
.ca-rot{display:inline-grid;align-items:baseline}
.ca-rot>span{grid-area:1/1;opacity:0;font-size:32px;line-height:1.2;font-weight:600;color:var(--brand-hover);white-space:nowrap}
.ca-rot small{font-size:13px;font-weight:400;color:var(--ink-3)}

.ca-play svg{width:16px;height:16px}
.ca-play .ca-ico-pause,.ca-play .ca-play-bars{display:none}
.ca-play.is-playing .ca-ico-play{display:none}
.ca-play.is-playing .ca-ico-pause{display:block}
.ca-play.is-playing .ca-play-bars{display:flex;height:16px}
.ca-play .ca-play-bars>span{height:14px}

.ca-langs{background:var(--dark);color:#fff}
.ca-langs-in{padding-top:72px;padding-bottom:72px;display:flex;flex-direction:column;gap:40px}
.ca-langs-intro{font-size:18px;color:var(--on-dark-2)}
.ca-langs-foot{font-size:15px;color:var(--on-dark-2)}
.ca-marqs{display:flex;flex-direction:column;gap:28px}
.ca-marq{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.ca-track{display:flex;width:max-content;list-style:none;padding:0}
.ca-track li{flex-shrink:0;display:flex;flex-direction:column;gap:4px;padding-right:56px}
.ca-track .ca-word{font-size:56px;line-height:1.2;white-space:nowrap}
.ca-track .ca-word-label{font-size:13px;color:var(--on-dark-3)}
/* Set per item, not by position, so a row's duplicate half matches its first half exactly and
 * the loop has no seam. */
.ca-track .ca-c1{color:#fff}
.ca-track .ca-c2{color:var(--brand-accent-soft)}
.ca-track .ca-c3{color:var(--mark-soft)}
.ca-track .ca-c4{color:var(--coral)}

.ca-how{display:flex;flex-direction:column;gap:48px}
.ca-how .ca-h2{max-width:16em}
.ca-cards3{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px}
.ca-card{display:flex;flex-direction:column;gap:18px;padding:28px;background:var(--surface);border:1px solid var(--border-soft);border-radius:24px}
.ca-card h3{font-size:22px;font-weight:500;line-height:1.25}
.ca-card p{font-size:16px;line-height:1.55;color:var(--ink-2)}
.ca-card ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px;font-size:16px;line-height:1.55;color:var(--ink-2)}
.ca-tile{margin-top:auto;padding:14px;border-radius:16px;background:var(--surface-soft);font-size:14px;line-height:1.5}
.ca-tile-row{display:flex;align-items:center;gap:12px}
.ca-tile-row span:first-of-type{flex-grow:1}
.ca-tile-ok{color:var(--brand-hover);font-weight:500}
.ca-tile-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;font-size:13px}
.ca-tile-stats>span{display:flex;flex-direction:column;gap:2px}
.ca-tile-stats>span>span:first-child{color:var(--ink-3)}
.ca-tile-stats b{font-weight:600}

.ca-ind{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:48px;align-items:start;padding-bottom:112px}
.ca-ind-copy{display:flex;flex-direction:column;gap:16px}

/* ── Pricing ───────────────────────────────────────────────────────────────────────────── */

.ca-pagehead{display:flex;flex-direction:column;gap:20px;padding-top:88px;padding-bottom:56px}
.ca-pagehead .ca-h1-page{max-width:13em}
.ca-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:20px;align-items:stretch;padding-bottom:112px}
.ca-plan{display:flex;flex-direction:column;gap:22px;padding:32px;border-radius:28px;background:var(--surface);border:1px solid var(--border)}
.ca-plan-main{border:2px solid var(--brand);box-shadow:var(--shadow-lg)}
.ca-plan-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.ca-plan h2{font-size:22px;font-weight:600}
.ca-price{display:flex;align-items:baseline;gap:10px}
.ca-price b{font-size:56px;line-height:1;letter-spacing:-.03em;font-weight:500}
.ca-price span{font-size:16px;color:var(--ink-3)}
.ca-plan .ca-btn{margin-top:auto;padding:16px 24px;font-size:17px}
.ca-plan-p{font-size:17px;line-height:1.6;color:var(--ink-2)}
.ca-plan-call{margin-top:auto;font-size:16px;color:var(--ink-2)}
.ca-plan-call+.ca-btn{margin-top:0}
.ca-plan-call a{font-weight:600;text-decoration:underline;text-underline-offset:3px}
/* /contact: three plan cards, each a short note and its email or phone rows. */
.ca-contact .ca-plan{gap:16px}
.ca-contact .ca-plan>p{font-size:17px;line-height:1.6;color:var(--ink-2)}
.ca-contact .ca-plan>.ca-contact-note{font-size:15px;color:var(--ink-3)}
.ca-contact-rows{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:8px 20px;margin:0;font-size:17px}
.ca-contact-rows dt{color:var(--ink-3)}
.ca-contact-rows dd{margin:0;font-weight:600}
.ca-contact a:not(.ca-btn){color:var(--brand-hover);text-decoration:underline;text-underline-offset:3px}
.ca-contact address{font-style:normal;font-size:17px;line-height:1.6;color:var(--ink-2)}
.ca-split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:48px;padding-top:96px;padding-bottom:96px}
.ca-split-copy{display:flex;flex-direction:column;gap:14px}
.ca-rows{list-style:none;padding:0;display:flex;flex-direction:column;font-size:17px}
.ca-rows li{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid var(--divider)}
.ca-rows li:last-child{border-bottom:0}
.ca-rows .ca-ico{margin-top:2px}

/* ── Industry pages ────────────────────────────────────────────────────────────────────── */

.ca-pains-in{display:flex;flex-direction:column;gap:40px;padding-top:96px;padding-bottom:96px}
.ca-answer{font-size:18px;line-height:1.6;color:var(--ink-2);max-width:44em;margin-top:-16px}
.ca-pains{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,480px),1fr));gap:0 48px}
.ca-pains>div{display:flex;flex-direction:column;gap:6px;padding:24px 0;border-top:1px solid var(--border)}
.ca-pains h3{font-size:20px;font-weight:600}
.ca-pains p{font-size:17px;line-height:1.55;color:var(--ink-2)}
.ca-limit-wrap{padding-top:96px}
.ca-limit{border-radius:28px;background:var(--brand-soft);padding:48px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:24px 48px;align-items:center}
.ca-limit h2{font-size:clamp(28px,3vw,40px);line-height:1.1;letter-spacing:-.02em;font-weight:500}
.ca-limit p{font-size:18px;line-height:1.6;color:var(--ink-legal)}
.ca-related{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:8px}
/* Guide titles run longer than industry names, so their pills wrap instead of overflowing a phone. */
.ca-related-guides .ca-pill{white-space:normal;padding-top:10px;padding-bottom:10px;line-height:1.35}
.ca-related-label{font-size:15px;color:var(--ink-3);margin-right:4px}

/* ── Guides ────────────────────────────────────────────────────────────────────────────── */

.ca-feature-wrap{padding-bottom:40px}
.ca-feature{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:32px;align-items:center;padding:40px;border-radius:28px;background:var(--dark);color:#fff;transition:box-shadow .24s var(--ease-out)}
.ca-feature:hover{color:#fff;box-shadow:var(--shadow-xl)}
.ca-feature-copy{display:flex;flex-direction:column;gap:14px}
.ca-feature-kicker{font-size:15px;color:var(--brand-accent-soft)}
.ca-feature h2{font-size:clamp(30px,3.2vw,42px);line-height:1.1;letter-spacing:-.02em;font-weight:500}
.ca-feature p{font-size:17px;line-height:1.55;color:var(--on-dark-2)}
.ca-feature-btn{align-self:flex-start;margin-top:6px;padding:14px 24px;border-radius:14px;background:var(--brand);font-size:16px;line-height:1.2;font-weight:600;white-space:nowrap;transition:background-color .16s var(--ease-out)}
.ca-feature:hover .ca-feature-btn{background:var(--brand-hover)}
.ca-feature ol{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px;font-size:16px}
.ca-feature li{display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:14px;background:var(--dark-2)}
.ca-feature li span{width:28px;height:28px;border-radius:999px;background:var(--dark-3);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;flex-shrink:0}
.ca-feature li:first-child span{background:var(--brand)}
.ca-guides-in{display:flex;flex-direction:column;gap:28px;padding-top:32px;padding-bottom:112px}
.ca-guides{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:20px}
.ca-guide{height:100%;display:flex;flex-direction:column;gap:12px;padding:28px;border-radius:24px;background:var(--surface);border:1px solid var(--border-soft);transition:border-color .24s var(--ease-out),box-shadow .24s var(--ease-out)}
.ca-guide:hover{color:var(--ink);border-color:var(--brand-accent-soft);box-shadow:var(--shadow-md)}
.ca-guide h3{font-size:21px;line-height:1.25;font-weight:500}
.ca-guide p{font-size:16px;line-height:1.55;color:var(--ink-2)}
.ca-guide-more{margin-top:auto;padding-top:8px;font-size:15px;font-weight:500;color:var(--brand-hover)}
.ca-guide-chev{display:none}

/* An article: a guide, the setup guide or a legal page. */
.ca-doc{display:flex;flex-wrap:wrap;gap:56px;align-items:flex-start;padding-top:64px;padding-bottom:112px}
.ca-doc-main{flex:999 1 560px;min-width:0;max-width:780px;display:flex;flex-direction:column;gap:28px}
.ca-back{font-size:15px;color:var(--brand-hover);align-self:flex-start}
.ca-meta{font-size:16px;color:var(--ink-3)}
.ca-doc-aside{flex:1 1 336px;max-width:396px;display:flex;flex-direction:column;gap:16px;padding:28px;border-radius:24px;background:var(--dark);color:#fff;position:sticky;top:96px}
.ca-doc-aside .ca-mark{width:44px;height:44px}
.ca-doc-aside h2{font-size:24px;line-height:1.2;font-weight:500}
.ca-doc-aside p{font-size:15px;line-height:1.55;color:var(--on-dark-2)}
.ca-doc-aside a.ca-aside-link{font-size:15px;color:var(--brand-accent-soft);text-align:center}
.ca-doc-aside a.ca-aside-link:hover{color:#fff}
.ca-doc-faq{display:flex;flex-direction:column;gap:12px;margin-top:24px}
.ca-doc-band{margin-top:32px;border-radius:28px;background:var(--brand);color:#fff;padding:48px 40px;display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.ca-doc-band h2{font-size:clamp(28px,3vw,40px);line-height:1.1;letter-spacing:-.02em;font-weight:500}
.ca-doc-band p{font-size:17px;line-height:1.55;color:#fff}
.ca-doc-band p a{color:#fff;text-decoration:underline;text-underline-offset:3px}

/* The setup guide's six steps. */
.ca-steps{list-style:none;padding:0;margin-top:16px;display:flex;flex-direction:column}
.ca-steps>li{display:flex;gap:24px;padding-bottom:40px}
.ca-steps>li:last-child{padding-bottom:0}
.ca-steps-rail{display:flex;flex-direction:column;align-items:center;flex-shrink:0}
.ca-steps-rail .ca-num{width:44px;height:44px;font-size:18px}
.ca-steps>li:first-child .ca-num{background:var(--brand);color:#fff}
.ca-steps-rail::after{content:"";width:2px;flex-grow:1;background:var(--border);margin-top:8px}
.ca-steps>li:last-child .ca-steps-rail::after{display:none}
.ca-steps-body{display:flex;flex-direction:column;gap:12px;padding-top:6px;min-width:0}
.ca-steps-body h2{font-size:26px;line-height:1.2;font-weight:500}
.ca-steps-body p{font-size:17px;line-height:1.65;color:var(--ink-2)}
.ca-steps-body .ca-btn{align-self:flex-start;margin-top:4px}
.ca-example{padding:20px 22px;border-radius:18px;background:var(--surface);border:1px solid var(--border);font-size:15px;line-height:1.7;color:var(--ink-legal)}
.ca-example p{font-size:15px;line-height:1.7;color:var(--ink-legal)}
.ca-example .ca-example-label{margin-bottom:8px;font-size:13px;color:var(--ink-3)}
.ca-tests{margin-top:24px;padding:32px;border-radius:24px;background:var(--surface);border:1px solid var(--border);display:flex;flex-direction:column;gap:16px}
.ca-tests h2{font-size:24px;font-weight:500}
.ca-tests ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:12px;font-size:17px;line-height:1.55;color:var(--ink-legal)}
.ca-tests li{display:flex;gap:12px}
.ca-tests .ca-ico{margin-top:2px}

/* Long-form text: guide bodies and the legal pages. The classes below are the ones the
 * content modules in scripts/site/guides and scripts/site/legal write. */
.ca-prose{font-size:17px;line-height:1.7;color:var(--ink-legal)}
.ca-prose>:first-child{margin-top:0}
.ca-prose h2{font-size:26px;line-height:1.25;font-weight:500;letter-spacing:-.01em;color:var(--ink);margin:56px 0 16px;scroll-margin-top:96px}
.ca-prose h3{font-size:19px;font-weight:600;color:var(--ink);margin:28px 0 10px;scroll-margin-top:96px}
.ca-prose p{margin:0 0 16px}
.ca-prose ul,.ca-prose ol{margin:0 0 16px;padding-left:22px}
.ca-prose li{margin:0 0 10px;padding-left:4px}
.ca-prose ol.g-alpha{list-style:lower-alpha}
.ca-prose strong{font-weight:600;color:var(--ink)}
.ca-prose a{color:var(--brand-hover);text-decoration:underline;text-underline-offset:3px}
.ca-prose a:hover{color:var(--brand)}
.ca-prose .callout{margin:0 0 24px;padding:24px 28px;border-radius:20px;background:var(--brand-soft);color:var(--ink-legal)}
.ca-prose .callout ul{margin:12px 0 0}
.ca-prose .note{margin:24px 0;padding:16px 20px;border-radius:16px;background:#FFF7E6;border:1px solid #F5D98B;font-size:15px;color:#6B5200}
.ca-prose p.updated{font-size:15px;color:var(--ink-3)}
.ca-prose table{border-collapse:collapse;width:100%;font-size:15px;line-height:1.55;margin:0 0 16px;background:var(--surface)}
.ca-prose th,.ca-prose td{border:1px solid var(--border);padding:10px 12px;text-align:left;vertical-align:top}
.ca-prose th{background:var(--surface-soft);font-weight:600;color:var(--ink)}
.ca-prose .g-table{overflow-x:auto;margin:0 0 16px}
.ca-prose .g-table table{margin:0}
.ca-prose .g-table table:has(th:nth-child(3)){min-width:520px}
.ca-prose .g-card{margin:24px 0;padding:24px 28px;border-radius:20px;background:var(--surface);border:1px solid var(--border-soft)}
.ca-prose .g-card p:last-child{margin-bottom:0}
.ca-prose .g-card-label{margin:0 0 8px;font-size:15px;font-weight:600;color:var(--brand-hover)}
.ca-prose .g-officer dl{margin:12px 0 0;display:grid;grid-template-columns:max-content 1fr;gap:10px 28px;font-size:17px;line-height:1.55}
.ca-prose .g-officer dt{color:var(--ink-3)}
.ca-prose .g-officer dd{margin:0;color:var(--ink);font-weight:600}
.ca-prose .g-toc{display:none}
/* The buyer's guides (hand-written) also carry stat tiles, an inline FAQ and related links. */
.ca-prose tbody td:first-child{font-weight:600;color:var(--ink)}
.ca-prose .g-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:24px 0}
.ca-prose .g-stat{padding:20px 16px;border-radius:16px;background:var(--surface);border:1px solid var(--border-soft);display:flex;flex-direction:column;gap:4px;text-align:center}
.ca-prose .g-stat-value{font-size:28px;line-height:1.2;font-weight:500;letter-spacing:-.02em;color:var(--brand-hover)}
.ca-prose .g-stat-label{font-size:14px;line-height:1.4;color:var(--ink-3)}
.ca-prose .g-faq{display:flex;flex-direction:column;gap:20px;margin:16px 0}
.ca-prose .g-faq-item h3{margin:0 0 6px}
.ca-prose .g-faq-item p{margin:0}
.ca-prose .g-related{font-size:15px;color:var(--ink-3);margin-top:24px}
.ca-prose .g-hindi a{font-weight:600;text-decoration:none}

/* Native share row on guides. */
.share{margin-top:24px;padding-top:24px;border-top:1px solid var(--border);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.share .share-label{font-size:15px;color:var(--ink-3);margin-right:4px}
.share a,.share button{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;background:var(--surface);border:1px solid var(--border);color:var(--ink);font-size:14px;font-weight:500;cursor:pointer;transition:border-color .16s var(--ease-out),background-color .16s var(--ease-out)}
.share a:hover,.share button:hover{border-color:var(--brand-accent-soft);background:var(--brand-soft);color:var(--brand-hover)}

/* ── Legal ─────────────────────────────────────────────────────────────────────────────── */

.ca-legal-head{display:flex;flex-direction:column;gap:16px;max-width:760px;padding-top:72px;padding-bottom:40px}
.ca-legal-cols{display:flex;flex-wrap:wrap;gap:56px;align-items:flex-start;padding-bottom:112px}
.ca-toc{flex:1 1 308px;max-width:348px;display:flex;flex-direction:column;gap:10px;padding:24px;border-radius:20px;background:var(--surface);border:1px solid var(--border-soft);position:sticky;top:88px;max-height:calc(100vh - 112px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border) transparent}
.ca-toc h2{font-size:15px;font-weight:600;margin-bottom:4px}
.ca-toc ol{list-style:none;padding:0;font-size:14px;line-height:1.4}
.ca-toc a{display:block;padding:6px 0;color:var(--ink-2)}
.ca-toc a:hover{color:var(--brand-hover)}
.ca-legal-main{flex:999 1 560px;min-width:0;max-width:760px}
.ca-inshort{padding:28px 32px;border-radius:24px;background:var(--brand-soft);display:flex;flex-direction:column;gap:14px;margin-bottom:24px}
.ca-inshort h2{font-size:20px;font-weight:600}
.ca-inshort ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:12px;font-size:16px;line-height:1.55;color:var(--ink-legal)}
.ca-inshort li{display:flex;gap:12px}
.ca-inshort .ca-ico{margin-top:2px}
.ca-inshort-note{font-size:14px;color:var(--ink-2)}
.ca-legal-sec h2 .ca-sec-n{font-variant-numeric:tabular-nums}
.ca-legal-main:not(.is-acc) .ca-legal-about>h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
/* Phone accordions are built by site.js from these headings; see the phone section. */
.ca-acc-btn{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:14px 0;cursor:pointer;font-size:16px;font-weight:500;line-height:1.35;color:var(--ink)}
.ca-acc-btn:focus-visible{outline:3px solid var(--brand);outline-offset:2px;border-radius:4px}
.ca-acc-n{width:28px;flex-shrink:0;color:var(--ink-3);font-variant-numeric:tabular-nums}
.ca-acc-t{flex-grow:1}
.ca-acc-i{font-size:20px;line-height:1;color:var(--brand);transition:transform .2s var(--ease-out)}
.ca-acc-btn[aria-expanded="true"] .ca-acc-i{transform:rotate(45deg)}

/* ── Motion ────────────────────────────────────────────────────────────────────────────── */
/* The design's own keyframes. Motion is kept to the logo drawing itself in once, and to the
 * call card's lines, the greeting and the marquee: the things that show a phone being answered.
 * Everything stops for prefers-reduced-motion (the block at the end of this section). */

/* The logo drawing itself in (.cav-draw), as in the brand's reference video: each arc grows
 * from its middle, right to left, the coral arc first and each one 170ms after the last; then
 * the mark holds still. It plays once and never loops, wherever the logo appears. The header
 * plays it on load. Every other mark (.cav-onview: the call card, the closing band, the guide
 * aside) waits until site.js sees it on screen, so the draw is not spent out of sight. */
@keyframes cavDraw{0%{stroke-dasharray:0 100;stroke-dashoffset:-50;opacity:0}30%{opacity:1}100%{stroke-dasharray:100 100;stroke-dashoffset:0;opacity:1}}
.cav-draw path{opacity:0;animation:cavDraw 900ms cubic-bezier(.22,.9,.25,1) forwards}
.cav-draw path:nth-child(1){animation-delay:680ms}
.cav-draw path:nth-child(2){animation-delay:510ms}
.cav-draw path:nth-child(3){animation-delay:340ms}
.cav-draw path:nth-child(4){animation-delay:170ms}
.js .cav-onview:not(.is-in) path{animation-play-state:paused}

/* The greeting: 11 languages, 2s each, a 22s loop. */
@keyframes caRot{0%{opacity:0;transform:translateY(.45em)}1.6%,7.6%{opacity:1;transform:none}9.09%,100%{opacity:0;transform:translateY(-.45em)}}
.ca-rot>span{animation:caRot 22s var(--ease-out) infinite}
.ca-rot>span:nth-child(2){animation-delay:2s}.ca-rot>span:nth-child(3){animation-delay:4s}
.ca-rot>span:nth-child(4){animation-delay:6s}.ca-rot>span:nth-child(5){animation-delay:8s}
.ca-rot>span:nth-child(6){animation-delay:10s}.ca-rot>span:nth-child(7){animation-delay:12s}
.ca-rot>span:nth-child(8){animation-delay:14s}.ca-rot>span:nth-child(9){animation-delay:16s}
.ca-rot>span:nth-child(10){animation-delay:18s}.ca-rot>span:nth-child(11){animation-delay:20s}

/* The call: each line arrives in turn over a 13s loop, holds, and all fade out together. */
@keyframes caS1{0%{opacity:0;transform:translateY(10px)}3%,90%{opacity:1;transform:none}97%,100%{opacity:0;transform:none}}
@keyframes caS2{0%,12.31%{opacity:0;transform:translateY(10px)}15.31%,90%{opacity:1;transform:none}97%,100%{opacity:0;transform:none}}
@keyframes caS3{0%,26.15%{opacity:0;transform:translateY(10px)}29.15%,90%{opacity:1;transform:none}97%,100%{opacity:0;transform:none}}
@keyframes caS4{0%,38.46%{opacity:0;transform:translateY(10px)}41.46%,90%{opacity:1;transform:none}97%,100%{opacity:0;transform:none}}
@keyframes caS5{0%,49.23%{opacity:0;transform:translateY(10px)}52.23%,90%{opacity:1;transform:none}97%,100%{opacity:0;transform:none}}
@keyframes caS6{0%,55.38%{opacity:0;transform:translateY(10px)}58.38%,90%{opacity:1;transform:none}97%,100%{opacity:0;transform:none}}
@keyframes caS7{0%,61.54%{opacity:0;transform:translateY(10px)}64.54%,90%{opacity:1;transform:none}97%,100%{opacity:0;transform:none}}
.ca-t1{animation:caS1 13s var(--ease-out) infinite}.ca-t2{animation:caS2 13s var(--ease-out) infinite}
.ca-t3{animation:caS3 13s var(--ease-out) infinite}.ca-t4{animation:caS4 13s var(--ease-out) infinite}
.ca-t5{animation:caS5 13s var(--ease-out) infinite}.ca-t6{animation:caS6 13s var(--ease-out) infinite}
.ca-t7{animation:caS7 13s var(--ease-out) infinite}

/* The homepage call (.ca-call-sync) is timed by site.js instead: each line and outcome rises in
 * as it arrives (caRise, below), and the transcript fades out before the idle loop starts over. */
.ca-call-sync .ca-msg.is-on,.ca-call-sync .ca-outcomes li.is-on{animation:caRise .4s var(--ease-out) both}

/* The live waveform. */
@keyframes caBar{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}
.ca-bars>span{animation:caBar 900ms var(--ease-wave) infinite}
.ca-bars>span:nth-child(1){animation-delay:0ms;animation-duration:700ms}
.ca-bars>span:nth-child(2){animation-delay:137ms;animation-duration:873ms}
.ca-bars>span:nth-child(3){animation-delay:274ms;animation-duration:1046ms}
.ca-bars>span:nth-child(4){animation-delay:411ms;animation-duration:1219ms}
.ca-bars>span:nth-child(5){animation-delay:548ms;animation-duration:792ms}
.ca-bars>span:nth-child(6){animation-delay:685ms;animation-duration:965ms}
.ca-bars>span:nth-child(7){animation-delay:822ms;animation-duration:1138ms}
.ca-bars>span:nth-child(8){animation-delay:59ms;animation-duration:711ms}
.ca-bars>span:nth-child(9){animation-delay:196ms;animation-duration:884ms}
.ca-bars>span:nth-child(10){animation-delay:333ms;animation-duration:1057ms}
.ca-bars>span:nth-child(11){animation-delay:470ms;animation-duration:1230ms}
.ca-bars>span:nth-child(12){animation-delay:607ms;animation-duration:803ms}
.ca-bars>span:nth-child(13){animation-delay:744ms;animation-duration:976ms}
.ca-bars>span:nth-child(14){animation-delay:881ms;animation-duration:1149ms}

/* The glow behind the call card, breathing. */
@keyframes caGlow{0%,100%{opacity:.35;transform:scale(1)}50%{opacity:.6;transform:scale(1.06)}}
.ca-glow{animation:caGlow 2600ms var(--ease-wave) infinite}

/* The marquee: each row holds its items twice and slides by half its width. */
@keyframes caMarq{to{transform:translateX(-50%)}}
.ca-track{animation:caMarq 46s linear infinite}
.ca-track.ca-rev{animation-direction:reverse;animation-duration:54s}
.ca-marq:hover .ca-track{animation-play-state:paused}

/* Motion that answers a click: the menu opening, an answer unfolding. */
@keyframes caRise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes caFade{from{opacity:0}to{opacity:1}}
.ca-menu[open]{animation:caFade .2s ease-out}
.ca-menu[open] .ca-menu-list li{animation:caRise .32s var(--ease-out) both}
.ca-menu[open] .ca-menu-list li:nth-child(2){animation-delay:30ms}
.ca-menu[open] .ca-menu-list li:nth-child(3){animation-delay:60ms}
.ca-menu[open] .ca-menu-list li:nth-child(4){animation-delay:90ms}
.ca-menu[open] .ca-menu-list li:nth-child(5){animation-delay:120ms}
.ca-faq-list details[open]>:not(summary),.ca-acc-body:not([hidden]){animation:caFade .24s ease-out}

@media (prefers-reduced-motion:reduce){
  .cav-draw path{animation:none!important;opacity:1!important;stroke-dasharray:none!important}
  .ca-rot>span,.ca-t,.ca-call-sync .is-on,.ca-bars>span,.ca-glow,.ca-track,.ca-menu,.ca-menu-list li,.ca-faq-list details>*,.ca-acc-body{animation:none!important;opacity:1!important;transform:none!important}
  .ca-call-sync .ca-lines{transition:none!important}
  .ca-bars>span{transform:scaleY(.6)!important}
  .ca-glow{opacity:.45!important}
  /* The greeting stops on Hindi; the marquee wraps in place and drops its duplicates. */
  .ca-rot>span{opacity:0!important}
  .ca-rot>span:nth-child(2){opacity:1!important}
  .ca-track{flex-wrap:wrap;width:auto;row-gap:16px}
  .ca-dup{display:none!important}
  .ca-btn,.ca-cookie,.ca-acc-i{transition:none!important}
}

/* ── Phone ─────────────────────────────────────────────────────────────────────────────── */

@media (max-width:760px){
  :root{--gutter:20px}
  .ca-hide-phone{display:none!important}
  .ca-only-phone{display:revert}

  /* Header: logo and a menu button. Without JS the links wrap onto their own row instead. */
  .ca-nav{padding:12px var(--gutter);gap:12px 16px}
  .ca-brand{font-size:17px}
  .ca-brand .ca-mark{width:28px;height:28px}
  .ca-navcta{display:none}
  .ca-navlinks{order:3;width:100%;margin-left:0;gap:20px;overflow-x:auto;scrollbar-width:none;white-space:nowrap}
  html.js .ca-navlinks{display:none}
  html.js .ca-menu-btn{display:flex}

  /* The sticky Try-it-free bar. */
  .ca-mcta{display:flex;position:sticky;bottom:0;z-index:40;flex-direction:column;gap:6px;padding:12px 20px max(20px,env(safe-area-inset-bottom));background:rgba(245,244,241,.95);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-top:1px solid var(--border)}
  .ca-mcta .ca-btn{padding:16px 20px;border-radius:16px;font-size:17px;box-shadow:var(--shadow-brand)}
  .ca-mcta~.ca-cookie{bottom:calc(126px + env(safe-area-inset-bottom, 0px))}

  /* Footer: links first, then the industries, the line, then the address and mailboxes. */
  .ca-footer-in{padding:24px var(--gutter) 32px;gap:12px}
  .ca-footer-links{gap:4px 20px}
  .ca-footer-links a{padding:8px 0}
  .ca-footer-ind{order:1;gap:0 20px;align-items:center}
  .ca-footer-ind-label{flex-basis:100%;padding-top:4px}
  .ca-footer-ind a{padding:8px 0}
  .ca-footer-line{order:2;flex-basis:100%}
  .ca-footer-contact{order:3;flex-direction:column;gap:2px;padding-top:12px}
  .ca-footer-contact a{display:inline-block;padding:6px 0}
  .ca-footer-langs{margin-top:-16px}

  /* Type */
  .ca-h1{font-size:42px;line-height:1.03}
  .ca-h1-page{font-size:40px;line-height:1.04}
  .ca-h1-doc{font-size:36px;line-height:1.08}
  .ca-h2,.ca-h2-sm{font-size:30px}
  .ca-h2-band{font-size:32px;line-height:1.1}
  .ca-h3-list{font-size:22px}
  .ca-lead,.ca-lead-sm{font-size:17px}
  .ca-sub{font-size:16px}
  .ca-section{padding-top:48px;padding-bottom:48px}

  /* Home */
  .ca-hero{gap:32px;padding-top:32px;padding-bottom:40px}
  .ca-logos{gap:16px;padding-bottom:48px}
  .ca-logos-proof{font-size:14px}
  .ca-logos-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ca-logos-grid li{min-height:76px;padding:14px 10px}
  .ca-logos-grid img{max-width:min(128px,100%);max-height:52px}
  .ca-hero-copy{gap:18px}
  .ca-hero-page{padding-bottom:48px}
  .ca-greet{font-size:16px}
  .ca-rot>span{font-size:26px}
  .ca-play{width:100%}
  .ca-callwrap{justify-self:stretch;max-width:none}
  .ca-glow{inset:-30px -10px}
  .ca-call{padding:18px;border-radius:24px}
  .ca-msg{font-size:15px}
  .ca-call-sync{--ca-view:314px}
  .ca-langs-in{padding-top:40px;padding-bottom:40px;gap:24px}
  .ca-langs-intro{font-size:15px}
  .ca-langs-foot{display:none}
  .ca-marqs{gap:16px}
  .ca-track li{padding-right:28px}
  .ca-track .ca-word{font-size:30px}
  .ca-track .ca-word-label{font-size:12px}
  .ca-how{gap:24px}
  .ca-cards3{gap:0}
  .ca-card{display:grid;grid-template-columns:36px 1fr;column-gap:16px;row-gap:4px;padding:20px 0;background:none;border:0;border-radius:0;border-top:1px solid var(--border)}
  .ca-card:last-child{border-bottom:1px solid var(--border)}
  .ca-card:not(:has(.ca-num)){display:flex;flex-direction:column;gap:6px}
  .ca-card .ca-num{grid-row:1/span 3}
  .ca-card>:not(.ca-num){grid-column:2}
  .ca-card h3{font-size:18px;font-weight:600}
  .ca-card p,.ca-card ul{font-size:15px}
  .ca-card .ca-tile{display:none}
  .ca-ind{gap:20px;padding-bottom:48px}
  .ca-ind .ca-pills{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * var(--gutter));padding:0 var(--gutter)}
  .ca-ind .ca-pills::-webkit-scrollbar{display:none}
  .ca-ind .ca-pills li{flex-shrink:0}
  .ca-band-wrap{padding:0 var(--gutter) 48px}
  .ca-band{border-radius:28px;padding:40px 24px;gap:18px}
  .ca-band .ca-mark{width:52px;height:52px}
  .ca-band p{font-size:16px}
  .ca-band>.ca-btn{width:100%}
  .ca-band-dark{flex-direction:column;align-items:stretch;text-align:left}

  /* Pricing */
  .ca-pagehead{padding-top:40px;padding-bottom:28px;gap:14px}
  .ca-plans{gap:16px;padding-bottom:48px}
  .ca-plan{padding:24px;border-radius:24px;gap:18px}
  .ca-contact-rows{grid-template-columns:minmax(0,1fr);gap:2px}
  .ca-contact-rows dd{margin-bottom:10px}
  .ca-price b{font-size:48px}
  .ca-split{padding-top:48px;padding-bottom:48px;gap:20px}
  .ca-rows{font-size:16px}
  .ca-faq{padding-top:48px;padding-bottom:48px;gap:12px}
  .ca-faq-list summary{font-size:17px}
  .ca-faq-list details p{font-size:16px}

  /* Industry */
  .ca-pains-in{padding-top:48px;padding-bottom:48px;gap:16px}
  .ca-answer{font-size:16px;margin-top:-4px}
  .ca-pains h3{font-size:17px}
  .ca-pains p{font-size:15px}
  .ca-pains>div{padding:18px 0}
  .ca-limit-wrap{padding-top:48px}
  .ca-limit{padding:28px 24px;border-radius:22px;gap:12px}
  .ca-limit h2{font-size:26px}
  .ca-limit p{font-size:16px}

  /* Guides */
  .ca-feature-wrap{padding-bottom:24px}
  .ca-feature{padding:24px;border-radius:24px;gap:16px}
  .ca-feature ol{display:none}
  .ca-feature h2{font-size:26px}
  .ca-feature p{font-size:16px}
  .ca-feature-btn{align-self:stretch;text-align:center}
  .ca-guides-in{gap:4px;padding-top:24px;padding-bottom:48px}
  .ca-guides{gap:0}
  .ca-guide{display:grid;grid-template-columns:1fr 20px;column-gap:12px;row-gap:4px;align-items:center;padding:18px 0;border-radius:0;background:none;border:0;border-bottom:1px solid var(--border)}
  .ca-guide:hover{box-shadow:none}
  .ca-guide h3{font-size:17px}
  .ca-guide p{grid-column:1;font-size:14px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
  .ca-guide-more{display:none}
  .ca-guide-chev{display:block;grid-column:2;grid-row:1/span 2}

  /* Articles */
  .ca-doc{padding-top:24px;padding-bottom:48px;gap:32px}
  .ca-doc-main{gap:20px}
  .ca-doc-aside{display:none}
  .ca-prose{font-size:16px}
  .ca-prose h2{font-size:22px;margin-top:40px}
  .ca-prose>table{display:block;overflow-x:auto;max-width:100%}
  .ca-callout{padding:20px;font-size:16px}
  .ca-steps>li{gap:16px;padding-bottom:28px}
  .ca-steps-rail .ca-num{width:36px;height:36px;font-size:16px}
  .ca-steps-body{padding-top:4px;gap:8px}
  .ca-steps-body h2{font-size:19px;font-weight:600}
  .ca-steps-body p{font-size:15px}
  .ca-steps-body .ca-btn,.ca-steps-body .ca-example,.ca-steps-body .ca-chips{display:none}
  .ca-tests{padding:22px;margin-top:8px}
  .ca-tests h2{font-size:19px}
  .ca-tests ul{font-size:15px}
  .ca-doc-band{padding:32px 24px;border-radius:24px}

  /* Legal: the contents card goes; each section folds behind its heading (site.js). */
  .ca-legal-head{padding-top:32px;padding-bottom:20px;gap:8px}
  .ca-legal-cols{display:block;padding-bottom:48px}
  .ca-toc{display:none}
  .ca-inshort{padding:20px;border-radius:22px}
  .ca-inshort ul{font-size:15px}
  .ca-legal-main.is-acc .ca-legal-sec{border-bottom:1px solid var(--border)}
  .ca-legal-main.is-acc .ca-legal-about{margin-bottom:12px;padding:0 18px;border:1px solid var(--border);border-radius:18px;background:var(--surface)}
  .ca-legal-main.is-acc .ca-legal-about .ca-acc-n{display:none}
  .ca-legal-main.is-acc .ca-legal-about .ca-acc-body{padding-left:0}
  .ca-legal-main.is-acc .ca-legal-sec>h2{margin:0;font-size:16px;letter-spacing:0}
  .ca-legal-main.is-acc .ca-acc-body{padding:0 0 0 40px}
  .ca-legal-main.is-acc .ca-acc-body:not([hidden]){padding-bottom:12px}
  .ca-prose .g-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ca-prose .g-officer dl{grid-template-columns:1fr;gap:2px}
  .ca-prose .g-officer dd{margin-bottom:12px}

  .ca-cookie{bottom:12px}
}