/* =================================================================
   CA PARTNER PAGE (ca.html) — on top of styles.css
   ================================================================= */

/* ---------- HERO ---------- */
.ca-hero{overflow-x:clip}
.ca-hero__grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(32px,5vw,64px);align-items:center}
.ca-hero__title{font-size:clamp(2.3rem,5.6vw,4.2rem)}
.ca-hero__actions{margin-top:30px}
.ca-hero__line{margin-top:14px;font-size:.95rem;color:var(--text-mid);max-width:44ch}
.ca-hero__line strong{color:var(--text-high)}

.ca-stage{position:relative;display:flex;justify-content:center;align-items:center;min-height:560px}
/* The homepage hero phone's size: 300 x 544, zoomed by the same --ph-s steps
   as .hero__stage in styles.css. The screen is a column, so the ask box sits
   at its foot, as in the app. */
.ca-stage{--ph-s:.86}
@media (min-width:1440px){.ca-stage{--ph-s:.9}}
@media (min-width:1536px){.ca-stage{--ph-s:.94}}
@media (min-width:1600px){.ca-stage{--ph-s:.96}}
@media (min-width:1680px){.ca-stage{--ph-s:1}}
@media (min-width:1200px) and (max-width:1279px){.ca-stage{--ph-s:.78}}
@media (min-width:1280px) and (max-width:1365px){.ca-stage{--ph-s:.82}}
@media (max-width:1199px){.ca-stage{--ph-s:1}}
@media (max-width:899px){.ca-stage{--ph-s:.92}}
.ca-phone{width:300px;z-index:2;zoom:var(--ph-s)}
.ca-phone .phone__screen{display:flex;flex-direction:column;padding-bottom:16px}
.ca-chat{display:flex;flex-direction:column;gap:10px}
.ca-chat .cmp__msg{max-width:100%}
.ca-answer p{margin-bottom:6px}
.ca-answer .pty{grid-template-columns:minmax(0,1fr) auto}
.ca-answer .pty b{color:var(--blue-600)}
.ca-answer__foot{display:flex;justify-content:space-between;padding-top:8px;font-size:.72rem;color:var(--text-low)}
.ca-answer__foot b{color:var(--text-high);font-weight:600}
.ca-phone .ask-row{margin-top:auto}
.ca-chat{margin-bottom:14px}
.ca-phone__label{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:12px;font-size:.72rem;color:var(--text-low)}

.ca-person{position:absolute;z-index:3;display:flex;align-items:center;gap:10px;padding:11px 14px 11px 11px;
  background:rgba(255,255,255,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--el-2)}
/* Placed from the phone (544 x --ph-s tall, centred in the stage), so they
   keep clear of its question, answer and ask box at every zoom: the CA on
   the phone's top edge, the client in the gap between answer and ask box. */
.ca-person--ca{left:0;top:calc(50% - 272px * var(--ph-s) - 30px)}
.ca-person--client{right:0;top:calc(50% + 112px * var(--ph-s) - 31px)}
.ca-person__av{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;
  font-family:var(--f-display);font-weight:700;font-size:.82rem;color:#fff}
.ca-person__av--ca{background:var(--grad-blue)}
.ca-person__av--client{background:var(--grad-ai)}
.ca-person__text{display:flex;flex-direction:column;line-height:1.3}
.ca-person__text b{font-size:.86rem;color:var(--text-high)}
.ca-person__text small{font-size:.74rem;color:var(--text-low)}

.ca-earn-chip{position:absolute;z-index:3;left:4%;bottom:calc(50% - 272px * var(--ph-s) - 22px);display:flex;align-items:center;gap:9px;
  padding:8px 15px 8px 8px;border-radius:var(--r-pill);background:var(--surface);border:1px solid rgba(22,163,74,.3);
  box-shadow:var(--el-2);font-size:.82rem;color:var(--text-mid)}
.ca-earn-chip b{color:var(--pos)}
.ca-earn-chip__ic{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;
  background:rgba(22,163,74,.12);color:var(--pos);font-weight:700}

/* CA → Tally → phone → answers → earn */
.ca-flow{list-style:none;display:flex;justify-content:center;align-items:flex-start;gap:0;
  margin:clamp(40px,6vw,64px) auto 0;max-width:720px}
.ca-flow li{flex:1;position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.ca-flow li+li::before{content:"";position:absolute;top:21px;right:calc(50% + 26px);width:calc(100% - 52px);height:2px;
  background:var(--grad-seam);opacity:.45}
.ca-flow__ic{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;
  background:var(--surface);border:1px solid rgba(37,99,235,.25);color:var(--blue-600);box-shadow:var(--el-1);
  font-family:var(--f-display);font-weight:700;font-size:.82rem}
.ca-flow__ic--ai{color:var(--ai-500);border-color:rgba(99,102,241,.3)}
.ca-flow__ic--earn{color:#fff;background:linear-gradient(135deg,#22C55E,#16A34A);border-color:transparent;font-size:1rem}
.ca-flow__label{font-size:.8rem;font-weight:500;color:var(--text-mid)}

/* ---------- SHARED ---------- */
.ca-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,72px);align-items:center}
.ca-split__copy .section__title,.ca-split__copy .section__sub{text-align:left;margin-inline:0}
.ca-muted{color:var(--text-low)}
.ca-cta-row{display:flex;justify-content:center;margin-top:clamp(32px,5vw,48px)}
.ca-cta-row--left{justify-content:flex-start;margin-top:28px}

/* ---------- 2. PROBLEM ----------
   As the v2 design (17-Oct-2026, owner): a plain label, the headline with
   its second half muted, "So they ask you." and the Arya callout on the
   left; the week's client questions, each with its sector and time, on the
   right. The copy sits on the callout's top edge, both centred on the inbox. */
/* The v2 label and headline, left-aligned (problem, how it works). */
.ca-label{margin-bottom:14px;font-size:.8125rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--blue-600)}
.ca-h2{font-family:var(--f-display);font-weight:700;font-size:clamp(1.9rem,3.4vw,2.875rem);line-height:1.08;
  letter-spacing:-.03em;color:var(--text-high);text-wrap:balance}

.ca-problem{padding:clamp(64px,9vw,112px) 0;background:var(--bg-soft)}
.ca-problem__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:28px clamp(40px,5vw,64px);
  grid-template-areas:"copy inbox" "callout inbox";align-items:end}
.ca-problem__copy{grid-area:copy}
.ca-problem__muted{color:#7A879C}
.ca-problem__lead{margin-top:22px;max-width:500px;font-size:1.125rem;line-height:1.65;color:var(--text-mid)}
.ca-problem__ask{margin-top:26px;font-family:var(--f-display);font-weight:700;font-size:1.625rem;letter-spacing:-.02em;color:var(--text-high)}
.ca-problem__callout{grid-area:callout;align-self:start;display:flex;gap:14px;align-items:flex-start;max-width:500px;
  padding:18px 20px;border-radius:16px;background:#F5F5FF;border:1px solid #E0E1FB}
.ca-problem__callout .orb{margin-top:3px}
.ca-problem__callout p{font-size:1rem;line-height:1.55;color:var(--text-mid)}
.ca-problem__callout b{color:var(--text-high);font-weight:600}
.ca-inbox{grid-area:inbox;align-self:center;padding:22px;border-radius:24px;background:var(--surface);
  border:1px solid var(--border);box-shadow:0 30px 70px -30px rgba(16,42,93,.28)}
.ca-inbox__head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 4px 16px}
.ca-inbox__title{font-size:.8125rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-mid)}
.ca-inbox__count{padding:3px 10px;border-radius:var(--r-pill);background:#FEF3C7;color:#92400E;font-size:.75rem;font-weight:600;white-space:nowrap}
.ca-inbox__list{list-style:none;display:flex;flex-direction:column;gap:8px}
.ca-msg{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:var(--surface-2)}
.ca-msg__av{display:grid;place-items:center;width:36px;height:36px;flex:none;border-radius:50%;font-size:.75rem;font-weight:700}
.ca-msg__av--tr{background:#DBEAFE;color:#1D4ED8}
.ca-msg__av--mf{background:#E0E7FF;color:#4338CA}
.ca-msg__av--ds{background:#CCFBF1;color:#0F766E}
.ca-msg__av--rt{background:#FEF3C7;color:#92400E}
.ca-msg__av--sv{background:#FCE7F3;color:#9D174D}
.ca-msg__av--wh{background:#DCFCE7;color:#166534}
.ca-msg__body{flex:1;min-width:0}
.ca-msg__meta{display:flex;justify-content:space-between;gap:8px;font-size:.78rem;color:#5B6779}
.ca-msg__text{margin-top:2px;font-size:.9375rem;color:var(--text-high)}

/* ---------- 3. HOW IT WORKS ----------
   As the v2 design (17-Oct-2026, owner): the 5 steps as a timeline, each
   node joined to the next by its own connector (blue, turning green into
   Get paid); a vertical timeline from 900px down. */
.ca-how{padding:clamp(64px,9vw,104px) 0}
.ca-how__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 48px}
.ca-how__main{flex:1 1 480px;min-width:0}
.ca-how__side{flex:0 1 400px;font-size:1.0625rem;line-height:1.6;color:var(--text-mid)}
.ca-tl{list-style:none;margin-top:60px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:32px 28px}
.ca-tl__step{position:relative}
.ca-tl__step:not(:last-child)::after{content:"";position:absolute;top:23px;left:60px;right:-16px;height:2px;border-radius:2px;background:#BFD3FB}
.ca-tl__step:nth-last-child(2)::after{background:linear-gradient(90deg,#BFD3FB,#86EFAC)}
.ca-tl__node{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#fff;border:2px solid #BFD3FB;
  font-size:.9375rem;font-weight:600;color:var(--blue-600)}
.ca-tl__step--paid .ca-tl__node{background:#16A34A;border-color:#16A34A;color:#fff;font-family:var(--f-display);font-size:1.2rem;font-weight:700}
.ca-tl__body h3{margin-top:22px;font-family:var(--f-display);font-weight:700;font-size:1.25rem;letter-spacing:-.01em;color:var(--text-high)}
.ca-tl__body p{margin-top:8px;font-size:.9375rem;line-height:1.55;color:var(--text-mid)}
.ca-tl__chip{display:inline-block;margin-top:12px;padding:4px 10px;border-radius:var(--r-pill);background:#DCFCE7;color:#166534;font-size:.78rem;font-weight:600}

@media (max-width:1024px){
  /* One column: copy, the questions, then the Arya callout. */
  .ca-problem__grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "inbox" "callout";max-width:680px}
  .ca-problem__callout{max-width:none}
}
@media (max-width:900px){
  .ca-tl{grid-template-columns:minmax(0,1fr);gap:26px;margin-top:36px}
  .ca-tl__step{display:flex;gap:16px}
  .ca-tl__step:not(:last-child)::after{top:52px;bottom:-14px;left:19px;right:auto;width:2px;height:auto}
  .ca-tl__step:nth-last-child(2)::after{background:linear-gradient(180deg,#BFD3FB,#86EFAC)}
  .ca-tl__node{width:40px;height:40px;flex:none;font-size:.8125rem}
  .ca-tl__body{padding-top:6px}
  .ca-tl__body h3{margin-top:0;font-size:1.125rem}
  .ca-tl__body p{margin-top:4px}
}
@media (max-width:760px){
  .ca-hide-sm{display:none}
  .ca-label{margin-bottom:12px;font-size:.78rem}
  .ca-how__side{font-size:1rem}
  .ca-problem__lead{margin-top:16px;font-size:1.03rem}
  .ca-problem__ask{margin-top:18px;font-size:1.44rem}
  .ca-inbox{padding:16px;border-radius:20px}
  .ca-inbox__title{font-size:.75rem}
  .ca-msg{padding:10px 12px;gap:10px}
  .ca-msg__av{width:32px;height:32px;font-size:.69rem}
  .ca-msg__time{display:none}
  .ca-msg__text{font-size:.9rem}
  .ca-problem__callout{padding:16px 18px}
  .ca-problem__callout p{font-size:.94rem}
}

/* ---------- 3. CA BENEFIT ---------- */
.ca-cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ca-big{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-2xl);padding:32px 28px;box-shadow:var(--el-1);
  transition:transform .3s var(--e-expo),box-shadow .3s}
.ca-big:hover{transform:translateY(-4px);box-shadow:var(--el-2)}
.ca-big__ic{display:grid;place-items:center;width:54px;height:54px;border-radius:var(--r-lg);margin-bottom:22px;
  background:rgba(37,99,235,.08);color:var(--blue-600);border:1px solid rgba(37,99,235,.16);font-weight:700;font-size:1.3rem}
.ca-big h3{font-family:var(--f-display);font-weight:600;font-size:1.5rem;line-height:1.15;color:var(--text-high);margin-bottom:10px}
.ca-big p{color:var(--text-mid)}
.ca-big strong{color:var(--text-high)}
.ca-big--earn{border-color:rgba(22,163,74,.35);background:linear-gradient(180deg,rgba(22,163,74,.06),#fff)}
.ca-big--earn .ca-big__ic{background:rgba(22,163,74,.12);color:var(--pos);border-color:rgba(22,163,74,.25)}

/* ---------- 4. WHAT YOUR CLIENT GETS ---------- */
.ca-gets{background:var(--bg-soft)}
.ca-gets__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ca-feat{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);padding:26px;box-shadow:var(--el-1)}
.ca-feat--wide{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.3fr;gap:28px;align-items:center}
.ca-feat__ic{display:grid;place-items:center;width:48px;height:48px;border-radius:var(--r-md);margin-bottom:16px;
  background:rgba(37,99,235,.08);color:var(--blue-600);border:1px solid rgba(37,99,235,.16)}
.ca-feat__ic--ai{background:rgba(99,102,241,.1);color:var(--ai-500);border-color:rgba(99,102,241,.22)}
.ca-feat h3{font-family:var(--f-display);font-weight:600;font-size:1.3rem;color:var(--text-high);margin-bottom:8px}
.ca-feat p{font-size:.93rem;color:var(--text-mid)}
.ca-feat__num{color:var(--blue-600)}
.ca-feat__qs{display:flex;flex-direction:column;gap:10px}
.ca-feat__qs span{align-self:flex-start;padding:11px 16px;border-radius:16px 16px 16px 4px;font-size:.95rem;font-weight:500;
  color:var(--text-high);background:rgba(99,102,241,.08);border:1px solid rgba(99,102,241,.2)}
.ca-feat__qs span:nth-child(even){align-self:flex-end;border-radius:16px 16px 4px 16px;background:var(--bg-tint);border-color:var(--border)}
.ca-feat__chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}
.ca-mini{margin-top:16px;padding-top:6px;border-top:1px solid var(--hairline)}
.ca-mini .drv i{width:var(--w)}
.ca-mini .list__row{padding:11px 2px;font-size:.86rem}

/* ---------- 5. BIG CA MESSAGE ----------
   As the v2 design (17-Oct-2026, owner): the centred headline with its
   second half in the gradient, the three "You already…" points as cards
   with icons in a row (a column from 900px down), the line under them. */
.ca-message{padding:clamp(64px,9vw,112px) 0;border-block:1px solid var(--hairline)}
.ca-message__title{max-width:900px;margin:0 auto;text-align:center;font-family:var(--f-display);font-weight:700;
  font-size:clamp(2rem,4vw,3.375rem);line-height:1.06;letter-spacing:-.035em;color:var(--text-high);text-wrap:balance}
.ca-already{list-style:none;margin-top:52px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ca-already li{display:flex;gap:16px;align-items:center;padding:22px 24px;border-radius:18px;background:var(--surface);
  border:1px solid var(--border);font-size:1.0625rem;line-height:1.4;font-weight:500;color:var(--text-high)}
.ca-already__ic{display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:12px;background:var(--bg-tint);color:var(--blue-600)}
.ca-message__copy,.ca-message__note{max-width:680px;margin:28px auto 0;text-align:center;font-size:1.125rem;line-height:1.6;color:var(--text-mid)}
.ca-message__note{margin-top:10px;font-weight:600;color:var(--text-high)}
@media (max-width:900px){
  .ca-already{grid-template-columns:minmax(0,1fr);gap:10px;max-width:560px;margin:32px auto 0}
}
@media (max-width:760px){
  .ca-message__title{font-size:2rem;line-height:1.1}
  .ca-already{margin-top:26px}
  .ca-already li{padding:16px 18px;font-size:.97rem}
  .ca-already__ic{width:40px;height:40px}
  .ca-message__copy,.ca-message__note{font-size:1rem}
  .ca-message__copy{margin-top:20px}
}

/* ---------- 7. EARNINGS ---------- */
.ca-money{background:var(--bg-soft)}
/* The calculator as the v2 design (17-Oct-2026, owner), without its quick
   picks: a yearly / monthly switch, the slider with its filled track (ca.js
   sets --fill), the sum, and the 25% share a year with what one client
   brings in. The slider keeps the page's earlier colour, a solid blue knob,
   not v2's white one, and the switch is smaller than v2's (owner, 17-Oct). */
.ca-calc{background:var(--surface);border:1px solid var(--border);border-radius:24px;box-shadow:var(--el-3);padding:clamp(22px,3.5vw,32px)}
.ca-calc__top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px}
.ca-calc__title{font-family:var(--f-display);font-weight:700;font-size:1.25rem;letter-spacing:-.01em;color:var(--text-high)}
.ca-seg{display:inline-flex;padding:3px;gap:2px;border-radius:var(--r-pill);background:#F1F5FB;border:1px solid var(--border)}
.ca-seg__btn{min-height:30px;padding:0 12px;border:0;border-radius:var(--r-pill);background:transparent;color:var(--text-mid);
  font:600 .8125rem/1 var(--f-body);cursor:pointer;transition:background-color .15s,color .15s,box-shadow .15s}
.ca-seg__btn:hover{color:var(--text-high)}
.ca-seg__btn[aria-pressed="true"]{background:var(--surface);color:var(--text-high);box-shadow:0 1px 3px rgba(16,42,93,.14)}
.ca-calc__row{margin-top:28px;display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.ca-calc__label{font-size:.8125rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#5B6779}
.ca-calc__big{font-size:2.5rem;font-weight:600;letter-spacing:-.03em;line-height:1;color:var(--blue-600)}
.ca-calc__range{--fill:4.5%;-webkit-appearance:none;appearance:none;display:block;width:100%;height:30px;margin:14px 0 0;
  background:transparent;cursor:pointer}
.ca-calc__range::-webkit-slider-runnable-track{height:8px;border-radius:99px;
  background:linear-gradient(90deg,var(--blue-600) var(--fill),var(--border) var(--fill))}
.ca-calc__range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;margin-top:-8px;border-radius:50%;
  background:var(--blue-600);border:3px solid var(--blue-600);box-shadow:0 2px 6px rgba(16,42,93,.25)}
.ca-calc__range::-moz-range-track{height:8px;border-radius:99px;background:var(--border)}
.ca-calc__range::-moz-range-progress{height:8px;border-radius:99px;background:var(--blue-600)}
.ca-calc__range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--blue-600);border:3px solid var(--blue-600);
  box-shadow:0 2px 6px rgba(16,42,93,.25)}
.ca-calc__eq{margin-top:22px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:16px 18px;
  border-radius:16px;background:var(--surface-2);border:1px solid var(--border);text-align:center}
.ca-calc__cell{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center}
.ca-calc__cell--wide{flex-grow:1.3}
.ca-calc__cell .mono{font-size:1.1875rem;font-weight:600;color:var(--text-high);white-space:nowrap}
.ca-calc__cell small{font-size:.78rem;line-height:1.3;color:#5B6779}
.ca-calc__op{font-size:1.125rem;color:#93A3BF}
.ca-calc__result{display:flex;flex-direction:column;margin-top:14px;padding:22px 24px;border-radius:18px;
  background:linear-gradient(135deg,#F0FDF4,#ECFDF5);border:1px solid #BBF7D0}
.ca-calc__result .ca-calc__label{color:#166534}
.ca-calc__earn{margin-top:4px;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px}
.ca-calc__earn .mono{font-size:3.125rem;font-weight:600;letter-spacing:-.04em;line-height:1.1;color:#15803D}
.ca-calc__earn small{font-size:1.0625rem;font-weight:500;color:#166534}
.ca-calc__per{margin-top:6px;font-size:.875rem;color:#166534}
.ca-calc__note{margin-top:14px;font-size:.8125rem;line-height:1.55;color:#5B6779}
@media (max-width:1024px){
  .ca-calc{width:100%;max-width:600px;margin-inline:auto;text-align:left}
}

/* ---------- 8. WHY ---------- */
.ca-why__card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-2xl);box-shadow:var(--el-2);padding:clamp(24px,4vw,36px)}
.ca-nots{list-style:none;display:flex;flex-direction:column;gap:12px}
.ca-nots li{position:relative;padding-left:32px;font-size:1.02rem;color:var(--text-low);text-decoration:line-through;text-decoration-color:rgba(239,68,68,.5)}
.ca-nots li::before{content:"✕";position:absolute;left:0;top:1px;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;
  background:rgba(239,68,68,.1);color:var(--danger);font-size:.7rem;font-weight:700}
.ca-why__want{margin-top:26px;padding-top:20px;border-top:1px solid var(--hairline);font-size:.85rem;color:var(--text-low)}
.ca-why__quote{margin-top:4px;font-family:var(--f-display);font-weight:600;font-size:clamp(1.5rem,3vw,2rem);line-height:1.2;color:var(--blue-600)}

/* ---------- 9. QUESTIONS ---------- */
.ca-qs{background:linear-gradient(180deg,var(--bg-tint),var(--bg-soft))}
.ca-bubbles{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;max-width:1000px;margin:0 auto}
.ca-bubble{padding:14px 22px;border-radius:22px 22px 22px 6px;background:var(--surface);border:1px solid var(--border);
  box-shadow:var(--el-1);font-weight:500;color:var(--text-high);font-size:clamp(.98rem,1.6vw,1.12rem)}
.ca-bubble--lg{font-size:clamp(1.05rem,2vw,1.3rem)}
.ca-bubble--xl{font-size:clamp(1.15rem,2.6vw,1.6rem);font-family:var(--f-display);font-weight:600;background:var(--grad-blue);color:#fff;border-color:transparent;box-shadow:var(--glow-blue)}
.ca-bubble--ai{background:rgba(99,102,241,.08);border-color:rgba(99,102,241,.24)}
.ca-qs__tag{margin-top:clamp(36px,5vw,56px);text-align:center;font-family:var(--f-display);font-weight:600;
  font-size:clamp(1.5rem,3.4vw,2.4rem);letter-spacing:-.02em;color:var(--text-high)}

/* ---------- 10. DASHBOARD ---------- */
.ca-dash{max-width:960px;margin:0 auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-2xl);
  box-shadow:var(--el-3);overflow:hidden}
.ca-dash__bar{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--hairline);background:var(--surface-2)}
.ca-dash__dots{display:flex;gap:6px}
.ca-dash__dots i{width:10px;height:10px;border-radius:50%;background:var(--border-strong)}
.ca-dash__title{font-family:var(--f-display);font-weight:600;font-size:.92rem;color:var(--text-high)}
.ca-dash__tag{margin-left:auto;font-size:.68rem;font-weight:600;color:var(--ai-600);padding:3px 9px;border-radius:var(--r-pill);
  background:rgba(99,102,241,.1);border:1px solid rgba(99,102,241,.25);white-space:nowrap}
.ca-dash__body{padding:clamp(16px,3vw,26px)}
.ca-dash__kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.ca-kpi{padding:14px;border-radius:var(--r-md);border:1px solid var(--border);background:var(--surface)}
.ca-kpi small{display:block;font-size:.68rem;color:var(--text-low);text-transform:uppercase;letter-spacing:.04em;line-height:1.3}
.ca-kpi b{display:block;margin-top:8px;font-size:1.6rem;font-weight:600;color:var(--text-high);line-height:1}
.ca-kpi--earn{border-color:rgba(22,163,74,.3);background:rgba(22,163,74,.05)}
.ca-kpi--earn b{color:var(--pos)}
.ca-dash__row{display:flex;align-items:flex-end;gap:14px;margin-top:18px}
.ca-ref{flex:1;min-width:0}
.ca-ref small{display:block;font-size:.72rem;color:var(--text-low);margin-bottom:6px}
.ca-ref__box{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:var(--r-md);
  border:1px dashed var(--border-strong);background:var(--surface-2);font-size:.84rem;color:var(--text-high)}
.ca-ref__box .mono{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ca-ref__copy{flex:none;font-size:.78rem;font-weight:600;color:var(--blue-600)}
.ca-dash__invite{pointer-events:none}
.ca-table{margin-top:18px;border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden}
.ca-table__row{display:grid;grid-template-columns:1.6fr 1fr .7fr;gap:10px;align-items:center;padding:11px 14px;
  border-top:1px solid var(--hairline);font-size:.88rem;color:var(--text-high)}
.ca-table__row:first-child{border-top:none}
.ca-table__row--head{background:var(--surface-2);font-size:.7rem;color:var(--text-low);text-transform:uppercase;letter-spacing:.05em}
.ca-table__row span:last-child{text-align:right}
.ca-table .tag{font-size:.68rem;padding:3px 9px}

/* ---------- 11. OBJECTIONS ---------- */
.ca-obj{background:var(--bg-soft)}
.ca-obj__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ca-obj__card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);padding:24px;box-shadow:var(--el-1)}
.ca-obj__card h3{font-family:var(--f-display);font-weight:600;font-size:1.1rem;line-height:1.25;color:var(--text-high);margin-bottom:10px}
.ca-obj__card p{font-size:.93rem;color:var(--blue-700);font-weight:500}

/* ---------- 12. WHO ---------- */
.ca-who .section__head{margin-bottom:0}
.ca-who .section__sub strong{color:var(--text-high)}

/* ---------- STICKY CTA (phones) ---------- */
.ca-float{display:none}
@media (max-width:760px){
  .ca-float{position:fixed;z-index:90;left:max(16px,env(safe-area-inset-left));bottom:max(16px,env(safe-area-inset-bottom));
    display:inline-flex;align-items:center;height:54px;padding:0 22px;border-radius:var(--r-pill);
    background:var(--grad-blue);color:#fff;font-weight:600;font-size:.95rem;box-shadow:var(--glow-blue),var(--el-2);
    opacity:0;visibility:hidden;transform:translateY(14px);
    transition:opacity .25s var(--e-standard),transform .25s var(--e-standard),visibility 0s linear .25s}
  .ca-float.is-on{opacity:1;visibility:visible;transform:none;
    transition:opacity .25s var(--e-standard),transform .25s var(--e-standard),visibility 0s}
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1024px){
  /* One column, mobile order: headline → phone → CTA → the rest. */
  .ca-hero__grid{grid-template-columns:1fr;gap:0;text-align:center}
  .ca-hero__copy{display:contents}
  .ca-hero__copy>.eyebrow{justify-self:center}
  .ca-stage{order:1;margin-top:28px}
  .ca-hero__actions{order:2}
  .ca-hero__sub{order:3;margin-inline:auto}
  .ca-hero__trust{order:4;justify-content:center}
  .ca-hero__line{margin-inline:auto}
  .ca-split{grid-template-columns:1fr}
  .ca-split__copy .section__title,.ca-split__copy .section__sub{text-align:center;margin-inline:auto}
  .ca-split__copy{text-align:center}
  .ca-cta-row--left{justify-content:center}
  .ca-gets__grid{grid-template-columns:1fr 1fr}
  .ca-feat--wide{grid-template-columns:1fr}
  .ca-obj__grid{grid-template-columns:1fr 1fr}
  .ca-dash__kpis{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:760px){
  .ca-stage{min-height:0;padding:30px 0 40px}
  /* Alone on the stage here, so it keeps its 280px width (the homepage's
     shares the row with the laptop and runs much smaller). */
  .ca-stage{--ph-s:.93}
  /* The two people become small tags on the phone's top corners. */
  .ca-person{top:0;padding:6px 11px 6px 6px;border-radius:var(--r-pill)}
  .ca-person--ca{left:0}
  .ca-person--client{right:0;top:0}
  .ca-person__av{width:28px;height:28px;font-size:.7rem}
  .ca-person__av svg{width:14px;height:14px}
  .ca-person__text small{display:none}
  .ca-person__text b{font-size:.78rem}
  .ca-earn-chip{left:50%;bottom:0;transform:translateX(-50%);white-space:nowrap;font-size:.78rem}
  .ca-cards3,.ca-gets__grid,.ca-obj__grid{grid-template-columns:1fr}
  .ca-dash__kpis{grid-template-columns:1fr 1fr}
  .ca-kpi--earn{grid-column:1/-1}
  .ca-dash__row{flex-direction:column;align-items:stretch}
  .ca-calc__top{display:block}
  .ca-seg{display:flex;margin-top:14px}
  .ca-seg__btn{flex:1;min-height:42px}
  .ca-calc__row{margin-top:22px}
  .ca-calc__big{font-size:2.125rem}
  .ca-calc__eq{margin-top:18px;padding:12px 10px;gap:4px}
  .ca-calc__cell .mono{font-size:.9375rem}
  .ca-calc__cell small{font-size:.72rem}
  .ca-calc__op{font-size:.9375rem}
  .ca-calc__result{padding:18px}
  .ca-calc__earn .mono{font-size:2.5rem}
  .ca-bubble{font-size:1rem}
  .ca-bubble--xl{font-size:1.2rem}
}
@media (max-width:420px){
  .ca-flow__label{font-size:.7rem}
  .ca-flow__ic{width:38px;height:38px}
  .ca-flow li+li::before{top:18px;right:calc(50% + 22px);width:calc(100% - 44px)}
  .ca-table__row{grid-template-columns:1.3fr 1fr .6fr;font-size:.8rem;padding:10px}
}

/* ---------- Payouts (added) ---------- */
.ca-payout{display:flex;align-items:center;gap:14px;margin-top:16px;padding:14px 16px;border-radius:var(--r-md);
  background:rgba(22,163,74,.06);border:1px solid rgba(22,163,74,.28)}
.ca-payout__ic{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;
  background:rgba(22,163,74,.14);color:var(--pos);font-weight:700}
.ca-payout__text small{display:block;font-size:.72rem;color:#166534;font-weight:600}
.ca-payout__text b{font-size:1.3rem;font-weight:600;color:var(--text-high)}
.ca-payout__meta{margin-left:auto;font-size:.8rem;color:var(--text-mid);text-align:right}
.ca-table__row{grid-template-columns:1.6fr 1fr .7fr .7fr}

/* Section backgrounds alternate now that How it works sits third. */
.ca-benefit,.ca-message,.ca-why{background:var(--bg-soft)}
.ca-gets,.ca-money{background:transparent}

@media (max-width:760px){
  .ca-payout{flex-wrap:wrap}
  .ca-payout__meta{margin-left:0;text-align:left;flex-basis:100%}
  .ca-table__row{grid-template-columns:1.4fr 1fr .7fr}
  .ca-table__date{display:none}
}

/* ---------- Gateways to the main site (nav menu, hero, section) ---------- */
.nav-drop{position:relative}
.nav-drop__btn{display:inline-flex;align-items:center;gap:5px;font-size:.9rem;color:var(--text-mid);padding:8px 13px;border-radius:var(--r-sm);
  transition:color .2s,background .2s}
.nav-drop__btn svg{transition:transform .2s var(--e-standard)}
.nav-drop:hover .nav-drop__btn,.nav-drop:focus-within .nav-drop__btn{color:var(--text-high);background:var(--bg-tint)}
.nav-drop:hover .nav-drop__btn svg,.nav-drop:focus-within .nav-drop__btn svg{transform:rotate(180deg)}
.nav-drop__menu{position:absolute;top:100%;left:50%;width:270px;padding:8px;margin-top:6px;z-index:110;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--el-3);
  opacity:0;visibility:hidden;transform:translate(-50%,6px);
  transition:opacity .18s var(--e-standard),transform .18s var(--e-standard),visibility 0s linear .18s}
.nav-drop__menu::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px} /* hover bridge */
.nav-drop:hover .nav-drop__menu,.nav-drop:focus-within .nav-drop__menu{opacity:1;visibility:visible;transform:translate(-50%,0);
  transition:opacity .18s var(--e-standard),transform .18s var(--e-standard),visibility 0s}
.nav__links .nav-drop__menu a{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:var(--r-sm)}
.nav-drop__menu b{display:inline-flex;align-items:center;gap:5px;font-weight:600;font-size:.88rem;color:var(--text-high)}
.nav-drop__menu small{font-size:.76rem;color:var(--text-low)}
.nav-drop__menu a:hover{background:var(--bg-tint)}
.mobile-menu__label{margin-top:12px;padding:0 8px 4px;font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-low)}
@media (max-width:1180px){ .nav__links>a[href="#for-cas"]{display:none} }

.ca-hero__gate{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;margin-top:10px;font-size:.92rem;color:var(--text-low)}
.ca-hero__gate .text-link{padding:4px 2px;font-size:.92rem}
@media (max-width:1024px){ .ca-hero__gate{justify-content:center} }

.ca-gate__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ca-gate__card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);
  padding:26px;box-shadow:var(--el-1);transition:transform .3s var(--e-expo),border-color .3s,box-shadow .3s}
.ca-gate__card:hover{transform:translateY(-4px);border-color:var(--blue-300);box-shadow:var(--el-2)}
.ca-gate__card h3{font-family:var(--f-display);font-weight:600;font-size:1.25rem;color:var(--text-high);margin-bottom:8px}
.ca-gate__card p{font-size:.93rem;color:var(--text-mid);flex:1}
.ca-gate__go{margin-top:18px;font-weight:600;font-size:.92rem;color:var(--blue-600)}
.ca-gate__card--try{border-color:rgba(99,102,241,.3);background:linear-gradient(180deg,rgba(99,102,241,.05),#fff)}
.ca-gate__card--try .ca-gate__go{color:var(--ai-600)}
@media (max-width:760px){ .ca-gate__grid{grid-template-columns:1fr} }
.ca-gate{background:linear-gradient(180deg,var(--bg-tint),var(--bg-soft))}
