/* CA Bundals landing page — design system: Plus Jakarta Sans, #1A56DB. */
body{margin:0;background:#fff;font-family:'Plus Jakarta Sans',system-ui,sans-serif;color:#1F2433;-webkit-font-smoothing:antialiased}
a{color:#1A56DB}
a:hover{color:#1240A8}
.hand{font-family:'Caveat',cursive}
.nl{color:#1F2433;text-decoration:none;font-size:15px;font-weight:500}
.nl:hover{color:#1A56DB}
.btn{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 24px;border-radius:8px;font-weight:600;font-size:16px;text-decoration:none;transition:background .2s,box-shadow .2s,transform .2s}
.bp{background:#1A56DB;color:#fff}
.bp:hover{background:#1240A8;color:#fff;box-shadow:0 8px 20px -8px rgba(26,86,219,.6)}
.bs{background:#EEF2FB;color:#1A56DB}
.bs:hover{background:#DDE6F8}
.app{display:flex;flex-direction:column;align-items:center;gap:12px;text-decoration:none;color:#1F2433;font-size:14px;font-weight:600;padding:18px 8px;border-radius:14px;transition:background .2s}
.app:hover{background:#F5F7FB}
.ico2{width:76px;height:76px;transition:transform .35s cubic-bezier(.3,1.5,.5,1),filter .35s}
.mx{mix-blend-mode:multiply}
.app:hover .ico2{transform:translateY(-6px) rotate(-4deg) scale(1.08);filter:drop-shadow(0 12px 14px rgba(31,36,51,.18))}
.ico{width:72px;height:72px;border-radius:18px;display:flex;align-items:center;justify-content:center;transition:transform .3s cubic-bezier(.3,1.4,.5,1),box-shadow .3s}
.tab{height:44px;padding:0 18px;border-radius:8px;border:0;font:600 15px 'Plus Jakarta Sans';cursor:pointer;transition:all .2s}
.chk{display:flex;gap:12px;font-size:16px;line-height:1.5}
.card{background:#fff;border:1px solid #E6E9F0;border-radius:16px;transition:box-shadow .25s,transform .25s}
.card:hover{box-shadow:0 18px 40px -20px rgba(31,36,51,.3);transform:translateY(-3px)}
@keyframes fade{from{opacity:0;transform:translateY(16px)}
to{opacity:1;transform:none}
}
@keyframes wA{from{opacity:0;transform:translateY(10px)}
to{opacity:1;transform:none}
}
@keyframes wB{from{opacity:0;transform:translateY(10px)}
to{opacity:1;transform:none}
}
@keyframes msg{0%,4%{opacity:0;transform:translateY(12px) scale(.97)}
9%,88%{opacity:1;transform:none}
96%,100%{opacity:0}
}
.faq{width:100%;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;border:0;background:transparent;font:700 17px 'Plus Jakarta Sans';color:#1F2433;text-align:left;cursor:pointer}
.faq:hover{color:#1A56DB}
.rot{display:inline-block;height:20px;line-height:20px;overflow:hidden;vertical-align:middle;color:#1A56DB;min-width:92px}
.rot-in{display:flex;flex-direction:column;animation:rot 13.2s cubic-bezier(.7,0,.3,1) infinite}
.rot-in span{height:20px;display:block;white-space:nowrap}
@keyframes rot{0%,13%{transform:translateY(0)}
16.6%,29.6%{transform:translateY(-20px)}
33.3%,46.3%{transform:translateY(-40px)}
50%,63%{transform:translateY(-60px)}
66.6%,79.6%{transform:translateY(-80px)}
83.3%,96.3%{transform:translateY(-100px)}
100%{transform:translateY(-120px)}
}
.vr{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.tabs label{height:44px;padding:0 18px;border-radius:8px;font:600 15px 'Plus Jakarta Sans';cursor:pointer;display:flex;align-items:center;color:#5B6275;transition:all .2s}
.tabs label:hover{color:#1A56DB}
.view{display:none;flex-grow:1;padding:28px 32px;flex-direction:column;gap:20px;animation:fade .4s ease-out both}
.sl{padding:10px 12px;border-radius:8px;color:#5B6275}
.url{display:none}
#vt1:checked~.tabs label[for=vt1],#vt2:checked~.tabs label[for=vt2],#vt3:checked~.tabs label[for=vt3],#vt4:checked~.tabs label[for=vt4]{background:#fff;color:#1A56DB;box-shadow:0 2px 6px rgba(31,36,51,.1)}
#vt1:checked~.win .v1,#vt2:checked~.win .v2,#vt3:checked~.win .v3,#vt4:checked~.win .v4{display:flex}
#vt1:checked~.win .u1,#vt2:checked~.win .u2,#vt3:checked~.win .u3,#vt4:checked~.win .u4{display:inline}
#vt1:checked~.win .s1,#vt2:checked~.win .s2,#vt3:checked~.win .s3,#vt4:checked~.win .s4{background:#EEF3FD;color:#1A56DB;font-weight:600}
#vt1:focus-visible~.tabs label[for=vt1],#vt2:focus-visible~.tabs label[for=vt2],#vt3:focus-visible~.tabs label[for=vt3],#vt4:focus-visible~.tabs label[for=vt4]{outline:2px solid #1A56DB}
.kp{border:1px solid #EEF0F4;border-radius:12px;padding:16px}
.kp b{display:block;font-size:28px;font-weight:800;margin-top:4px;letter-spacing:-.5px}
.kp i{font-style:normal;font-size:12px}
.kl{font-size:13px;color:#5B6275}
.tb{border:1px solid #EEF0F4;border-radius:12px;overflow:hidden;flex-grow:1}
.tr{display:grid;grid-template-columns:2fr 1.2fr 1fr 1.2fr 1fr;padding:14px 18px;border-top:1px solid #EEF0F4;font-size:14px;align-items:center}
.tr span:first-child{font-weight:600}
.tr span:nth-child(3),.tr span:nth-child(5){color:#5B6275}
.th{border-top:0;padding:12px 18px;background:#F7F8FB;font-size:13px;font-weight:600;color:#5B6275}
.th span{font-weight:600!important;color:#5B6275!important}
.pl{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600}
.pr{background:#FDECEC;color:#B42318}
.py{background:#FEF3E2;color:#8A4B00}
.pg{background:#E5F6EE;color:#067647}
.pn{background:#F2F4F8;color:#5B6275}
.vh{display:flex;align-items:center;justify-content:space-between}
.vh span{font-size:22px;font-weight:700}
.vh em{font-style:normal;background:#1A56DB;color:#fff;font-size:14px;font-weight:600;padding:9px 16px;border-radius:8px}
.k4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
details.fq{border-bottom:1px solid #E6E9F0}
details.fq summary{list-style:none;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;font:700 17px 'Plus Jakarta Sans';cursor:pointer}
details.fq summary::-webkit-details-marker{display:none}
details.fq summary:hover{color:#1A56DB}
details.fq summary i{flex-shrink:0;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;font-style:normal;background:#F2F4F8;transition:transform .25s,background .25s}
details.fq[open] summary i{transform:rotate(45deg);background:#1A56DB;color:#fff}
details.fq p{margin:0;padding:0 24px 22px;font-size:16px;line-height:1.65;color:#5B6275;animation:fade .3s ease-out both}
@keyframes draw{to{stroke-dashoffset:0}
}
.fade{animation:fade .7s ease-out both}
.fl{color:#5B6275;text-decoration:none;font-size:14px}
.fl:hover{color:#1A56DB}

/* ── fluid layout (the design was drawn at 1440px) ── */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
.lp { width: 100%; max-width: 1440px; margin: 0 auto; background: #fff; display: flex; flex-direction: column; }
.lp img, .lp svg { max-width: 100%; }
.lp-burger { display: none; }
.lp-only-sm { display: none; }
.win { max-width: 1200px; }
.view { min-width: 0; }

@media (max-width: 1200px) {
  .lp-head, .lp > section, .lp > footer { padding-left: 40px !important; padding-right: 40px !important; }
  .lp > section[style*="margin: 0 80px"] { margin-left: 24px !important; margin-right: 24px !important; }
  #apps > div { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
}

@media (max-width: 900px) {
  .lp-head { gap: 16px !important; padding: 0 20px !important; position: sticky; top: 0; background: #fff; z-index: 30; }
  .lp-nav { display: none !important; position: absolute; left: 0; right: 0; top: 72px; background: #fff; flex-direction: column;
    gap: 0 !important; padding: 8px 20px 16px; border-bottom: 1px solid #E6E9F0; box-shadow: 0 20px 30px -20px rgba(31,36,51,.3); }
  .lp-nav a { padding: 12px 0; border-top: 1px solid #F0F2F6; }
  .lp-only-sm { display: block; }
  .lp-hide-sm { display: none; }
  .lp-head .btn { margin-left: auto; }
  .lp-burger { display: flex; flex-direction: column; justify-content: center; gap: 4px; width: 42px; height: 42px; padding: 0 10px;
    border: 1px solid #D5DAE3; border-radius: 8px; background: #fff; cursor: pointer; }
  .lp-burger span { display: block; height: 2px; border-radius: 2px; background: #1F2433; }

  .lp > section, .lp > footer { padding: 64px 20px !important; }
  .lp > section[style*="margin: 0 80px"] { margin: 0 16px 64px !important; padding: 40px 20px !important; }
  .lp > section[style*="grid-template-columns"] { grid-template-columns: 1fr !important; gap: 24px !important; }
  .lp > section > [style*="grid-column: span"] { grid-column: 1 / -1 !important; padding: 28px 22px 0 !important; }
  .lp > section > [style*="grid-column: span 7"][style*="display: flex; gap: 40px"] { flex-direction: column; align-items: stretch !important; padding-bottom: 28px !important; }
  .lp > section > [style*="span 5"] { padding-bottom: 28px !important; }
  .lp h1 { font-size: 44px !important; letter-spacing: -1.4px !important; }
  .lp h2 { font-size: 34px !important; letter-spacing: -1px !important; }
  .lp h2 .hand { font-size: 42px !important; }
  .lp h3 { font-size: 24px !important; }
  .lp p { font-size: 17px !important; }
  #apps { padding: 0 16px 56px !important; }
  #apps > div { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; padding: 20px 12px !important; }
  #features .tabs { flex-wrap: wrap; justify-content: center; }
  .win > div[style*="display: flex"] > div[style*="width: 100%; max-width: 220px"],
  .win > div[style*="display: flex"] > div[style*="width: 220px"] { display: none !important; }
  .view { padding: 18px !important; }
  .k4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tb { overflow-x: auto; }
  .tr { min-width: 560px; }
  #pricing > div[style*="grid"] { grid-template-columns: 1fr !important; }
  .lp > section[style*="background: #1A56DB"] { flex-direction: column; align-items: flex-start !important; gap: 24px; }
  .lp > section[style*="background: #1A56DB"] > div:last-child { flex-wrap: wrap; }
  footer > div[style*="grid"] { grid-template-columns: 1fr 1fr !important; }
  footer > div[style*="grid"] > div:first-child { grid-column: 1 / -1; }
  #portal > div:last-child { flex-wrap: wrap; }
  .lp > section > div[style*="position: absolute; left: 16%"] { display: none; }
  .lp > section > div[style*="repeat(3"] > div[style*="position: absolute"] { display: none; }
}

@media (max-width: 560px) {
  .lp h1 { font-size: 34px !important; }
  .lp h2 { font-size: 28px !important; }
  .lp h2 .hand { font-size: 34px !important; }
  .lp h1 br { display: none; }
  .lp .btn[style*="height: 56px"] { width: 100%; padding: 0 16px !important; }
  .lp section > div.fade[style*="display: flex; gap: 14px"] { flex-direction: column; width: 100%; }
  .lp-head > .btn { display: none; }
  .lp-head > .lp-burger { margin-left: auto; }
  #apps > div { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 0 !important; }
  .ico2 { width: 56px; height: 56px; }
  .app { font-size: 12.5px; padding: 12px 4px; text-align: center; }
  .k4 { grid-template-columns: 1fr 1fr; gap: 10px; }
  .vh span { font-size: 17px; }
  .vh em { display: none; }
  details.fq summary { padding: 16px 4px; font-size: 16px; }
  details.fq p { padding: 0 4px 18px; }
  .lp > section[style*="margin: 0 80px"] { padding: 32px 16px !important; }
  #portal > div:last-child > .card { margin-bottom: 0 !important; }
  footer > div[style*="grid"] { grid-template-columns: 1fr !important; }
}
@media (max-width: 900px) {
  .lp div[style*="grid-template-columns: 90px 1fr 110px 120px"] { grid-template-columns: 76px 1fr auto !important; padding: 12px 14px !important; gap: 8px; }
  .lp div[style*="grid-template-columns: 90px 1fr 110px 120px"] > span:last-child { display: none; }
}
@media (max-width: 560px) {
  .lp > section:first-of-type > div.fade:first-child { height: auto !important; flex-wrap: wrap; justify-content: center; padding: 6px 12px !important; font-size: 13px !important; border-radius: 16px !important; }
}

/* App grid motion: icons never leave their cell. They rise in once when the
   grid scrolls into view, then breathe very slowly (3px) out of step with
   each other, so the grid feels alive but every target stays put. */
#apps .app{position:relative;opacity:0;transform:translateY(14px);transition:opacity .55s ease, transform .55s cubic-bezier(.2,.8,.2,1), background .2s}
#apps.in .app{opacity:1;transform:none}
#apps.in .ico2{animation:appBreathe 6s ease-in-out infinite;animation-delay:var(--d,0s)}
#apps .app:hover .ico2{animation-play-state:paused}
#apps .app::after{content:'Open \2192';position:absolute;bottom:2px;left:50%;transform:translateX(-50%);font-size:11.5px;font-weight:700;color:#1A56DB;opacity:0;transition:opacity .2s}
#apps .app:hover::after,#apps .app:focus-visible::after{opacity:1}
@keyframes appBreathe{0%,100%{translate:0 0}50%{translate:0 -3px}}
@media (prefers-reduced-motion:reduce){#apps .app{opacity:1;transform:none;transition:none}#apps.in .ico2{animation:none}}

/* Footer: the band runs edge to edge; its content stays in the 1440 column. */
.lp > footer { box-shadow: 0 0 0 100vmax #F7F8FB; clip-path: inset(0 -100vmax); }
html { overflow-x: clip; }

/* header rule runs edge to edge even though the page column is centred */
.lp-head { position: relative; border-bottom: 0 !important; }
.lp-head::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 100vw; height: 1px; transform: translateX(-50%); background: #EEF0F4; pointer-events: none; }

/* mobile: drop the "Get started in an afternoon" kicker above the three steps */
@media (max-width: 900px) { .lp-kick-steps { display: none !important; } }
/* mobile: drop the whole "Three steps to a calm filing season" section */
@media (max-width: 900px) { .lp-steps { display: none !important; } }

/* FAQ +/× : drawn with two bars so it sits dead centre in its circle at any size
   (the text glyph "+" sat low/right once rotated). */
details.fq summary i{position:relative;font-size:0!important;line-height:0;color:#1F2433}
details.fq summary i::before,details.fq summary i::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;margin:-1px 0 0 -7px;border-radius:2px;background:currentColor}
details.fq summary i::after{transform:rotate(90deg)}
details.fq[open] summary i{color:#fff}

/* ── phone menu: side drawer (app.js builds it on every marketing page) ── */
.md-scrim,.md-drawer{display:none}
@media (max-width:900px){
  .lp-nav,.sh-nav{display:none!important}
  .md-scrim{display:block;position:fixed;inset:0;z-index:998;background:rgba(15,20,35,.45);opacity:0;transition:opacity .25s}
  .md-scrim.on{opacity:1}
  .md-drawer{display:flex;flex-direction:column;position:fixed;top:0;right:0;bottom:0;z-index:999;width:min(86vw,340px);background:#fff;
    box-shadow:-24px 0 48px -16px rgba(15,20,35,.35);transform:translateX(100%);transition:transform .26s cubic-bezier(.2,.8,.2,1);
    font-family:'Plus Jakarta Sans',system-ui,sans-serif;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}
  .md-drawer.on{transform:none}
  .md-scrim[hidden],.md-drawer[hidden]{display:none!important}
  .md-top{display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 12px 0 20px;border-bottom:1px solid #EEF0F4}
  .md-title{font-size:13px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:#5B6275}
  .md-x{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:0;border-radius:10px;background:#F2F4F8;color:#1F2433;cursor:pointer}
  .md-links{display:flex;flex-direction:column;padding:8px 8px;overflow-y:auto}
  .md-links a{display:flex;align-items:center;min-height:52px;padding:0 12px;border-radius:10px;color:#1F2433;text-decoration:none;font-size:17px;font-weight:600}
  .md-links a:hover,.md-links a[aria-current=page]{background:#EEF3FD;color:#1A56DB}
  .md-foot{margin-top:auto;display:flex;flex-direction:column;gap:10px;padding:16px 20px 24px;border-top:1px solid #EEF0F4}
  .md-btn{width:100%;height:50px!important;display:flex!important}
  html.md-lock,html.md-lock body{overflow:hidden}
  html.md-lock body{position:fixed;left:0;right:0}
  .lp-burger,.sh-burger{width:44px!important;height:44px!important}
}

/* ── mobile quality pass (≤900px); desktop untouched ── */
@media (max-width:900px){
  /* tighter, even rhythm between sections — no big blank bands */
  .lp > section, .lp > footer { padding-top: 48px !important; padding-bottom: 48px !important; }
  .lp > section:first-of-type { padding-top: 32px !important; }
  #apps { padding-top: 8px !important; padding-bottom: 40px !important; }
  #features { gap: 28px !important; }
  #features + section { padding-top: 0 !important; gap: 16px !important; }
  .lp > section[style*="margin: 0 80px"] { margin: 0 16px 48px !important; }
  #faq { padding-top: 0 !important; }
  .lp > footer { margin-top: 48px !important; }
  .lp p { font-size: 16px !important; }
  .lp h3 { font-size: 22px !important; letter-spacing: -.5px !important; }

  /* hero pill: one neat line */
  .lp-pill { height: 36px !important; max-width: 100%; flex-wrap: nowrap !important; white-space: nowrap; gap: 8px !important;
    padding: 0 14px 0 4px !important; font-size: 13px !important; border-radius: 999px !important; }
  .lp-pill > span:first-child { padding: 4px 9px !important; font-size: 11.5px !important; }
  .lp-pill-tail { display: none; }
  .lp-pill .rot { min-width: 0; text-align: left; }

  /* bento cards */
  .lp > section > [style*="grid-column: span"] { padding: 24px 20px 0 !important; }
  .lp > section > [style*="span 5"], .lp > section > [style*="grid-column: span 7"][style*="display: flex; gap: 40px"] { padding-bottom: 24px !important; }
  .lp > section > [style*="grid-column: span 7"][style*="display: flex; gap: 40px"] { gap: 20px !important; }
  .lp > section > [style*="grid-column: span 7"][style*="display: flex; gap: 40px"] > div:first-child { max-width: none !important; }

  /* compliance calendar mini-table: date | label (wraps as one block) | status */
  .lp .lp-cal > div { grid-template-columns: 64px minmax(0,1fr) !important; padding: 12px 16px !important; gap: 4px 10px !important; font-size: 14px !important; align-items: start !important; }
  .lp .lp-cal > div > span:nth-child(3) { grid-column: 2; font-size: 13px; }
  .lp .lp-cal > div > span:last-child { display: none; }
  .lp .lp-cal .fx-tag { margin: 4px 0 0 !important; }
  .lp .lp-cal s.fx-old { display: block; font-size: 12px; }

  /* WhatsApp: a phone-sized chat, not a block */
  .lp-wa { max-width: 340px !important; margin: 0 auto; border-radius: 18px !important; }
  .lp-wa > div:first-child { height: 52px !important; }
  .lp-wa > div:last-child { min-height: 0 !important; padding: 14px 12px !important; gap: 10px !important; font-size: 13px !important; }
  .lp-wa > div:last-child > div { max-width: 82% !important; }
  .lp-wa-cards { grid-template-columns: 1fr !important; gap: 10px !important; }
  .lp-wa-cards .card { padding: 14px 16px !important; }
  .lp-wa-cards .card > div:first-child { font-size: 16px; overflow-wrap: anywhere; hyphens: auto; }

  /* client-portal ticks on the home page */
  #portal { gap: 28px !important; }
  #portal .chk { font-size: 16px !important; line-height: 1.45; }
  #portal .chk > span:first-child { flex: none; }

  /* pricing cards */
  #pricing > div[style*="grid"] > .card { padding: 24px 20px !important; }
  #pricing > div[style*="grid"] > .card span[style*="font-size: 48px"] { font-size: 40px !important; }
  #pricing { gap: 28px !important; }

  /* long words never push a box wider */
  .lp h1, .lp h2, .lp h3, .site h1, .site h2, .site h3 { overflow-wrap: break-word; }
  .lp .btn, .site .btn { min-height: 44px; }
}
@media (max-width:560px){
  .lp h1 { font-size: 36px !important; line-height: 1.1 !important; letter-spacing: -1.2px !important; }
  .lp h2 { font-size: 29px !important; line-height: 1.15 !important; }
  .lp h2 .hand { font-size: 35px !important; }
  .lp > section:first-of-type > div.lp-pill { height: 36px !important; flex-wrap: nowrap !important; padding: 0 14px 0 4px !important; border-radius: 999px !important; justify-content: flex-start; }
  #faq h2 { font-size: 29px !important; }
}
/* rotate the bars, not the circle (a rotated circle's box pokes out on phones) */
details.fq[open] summary i{transform:none}
details.fq summary i::before,details.fq summary i::after{transition:transform .25s}
details.fq[open] summary i::before{transform:rotate(45deg)}
details.fq[open] summary i::after{transform:rotate(135deg)}
/* phones: ≥44px tap targets on small controls (visuals unchanged) */
@media (max-width:900px){
  .lcf .lf-pp,.lf-host .lf-pp{width:44px;height:44px}
  .lf-host .lf-chp{height:32px}
  .dk .dk-dots{gap:0;bottom:3px}
  .dk .dk-dots button{box-sizing:content-box;height:6px;border:19px solid transparent;border-width:19px 4px;background-clip:padding-box}
  .dd-f button{min-height:44px}
}

/* ── brand mark (10 Oct 2026): the moving logo in the header (once per page),
   the still logo in the phone drawer and the footer, wordmark beside it.
   Markup: index.html (own header and footer), site/chrome.js, app.js. ── */
.blogo{display:inline-flex;align-items:center;gap:10px;flex:none;text-decoration:none;color:#1F2433}
.blogo-mark{display:block;flex:none;width:54px;height:54px;max-width:none}
.blogo-mark.sm{width:42px;height:42px}
.blogo-word{font-size:22px;font-weight:800;letter-spacing:-.5px;line-height:1;white-space:nowrap}
/* 901 to 1100px: the nav is still in the bar and space is tight, so the header
   lockup is held to the width of the old one (about 150px) */
@media (min-width:901px) and (max-width:1100px){
  header a.blogo.blogo{gap:6px}
  header .blogo-mark{width:48px;height:48px}
  header .blogo .blogo-word{font-size:18.5px}
}