/* CPA & Accounting Firms page styles converted from the supplied industry page. */
.page-cpa-accounting{
  --hm-tight:28ch;
  --hm-wide:46ch;
  --head-gap:clamp(32px,4.3vw,56px);
  --story-gap:clamp(44px,4.2vw,64px);
  --divider-soft:rgba(15,24,34,.07);
}
.page-cpa-accounting main .section{scroll-margin-top:100px;}
.page-cpa-accounting main .section + .section:not(.alt){border-top:0;}
.page-cpa-accounting main .eyebrow{color:var(--green-ink);}
.page-cpa-accounting main .brand-mark{display:inline-flex;align-items:center;margin-right:9px;vertical-align:-3px;}
.page-cpa-accounting main .brand-mark img{display:block;width:auto;height:16.5px;}
.page-cpa-accounting main .h2{font-size:var(--type-h2);line-height:1.08;letter-spacing:-0.018em;}
.page-cpa-accounting main .h3{font-size:clamp(23px,max(calc(19.87px + .32vw),1.7vw),25px);line-height:1.15;letter-spacing:0;}
.page-cpa-accounting main .lead{font-size:clamp(18px,1.5vw,21px);line-height:1.55;color:var(--muted);}
.page-cpa-accounting main .body-copy{font-size:17px;line-height:1.6;color:var(--muted);}
.page-cpa-accounting main .industry-intro{display:block;margin-bottom:var(--head-gap);}
.page-cpa-accounting main .industry-intro--no-para{margin-bottom:clamp(36px,4vw,44px);}
.page-cpa-accounting main .industry-intro__col{width:80%;margin-inline:auto;text-align:center;}
.page-cpa-accounting main .industry-intro .h2{font-weight:400; width:100%;max-inline-size:none;margin-inline:auto;text-wrap:balance;word-break:normal;overflow-wrap:normal;hyphens:none;}
.page-cpa-accounting main .industry-intro p{width:100%;max-inline-size:none;margin:clamp(16px,1.6vw,20px) auto 0;color:var(--muted);font-size:clamp(17px,1.2vw,19px);font-weight:400;line-height:1.55;text-wrap:pretty;}
.page-cpa-accounting main .lucide{display:block;flex:none;fill:none;stroke:currentColor;stroke-width:var(--icon-stroke,1.75);stroke-linecap:round;stroke-linejoin:round;}
.page-cpa-accounting main .ico{display:flex;align-items:center;justify-content:center;width:41px;height:41px;flex:none;border:1px solid rgba(0,129,74,.08);border-radius:12px;background:linear-gradient(145deg,rgba(0,171,82,.075),rgba(172,212,0,.035)),#fff;box-shadow:inset 0 1px rgba(255,255,255,.85),0 8px 16px -14px rgba(0,129,74,.28);color:var(--green-ink);}
.page-cpa-accounting main .ico .lucide{width:20px;height:20px;--icon-stroke:1.75;}
.page-cpa-accounting main .m-visual-stage{position:relative;container:canvas / inline-size;padding:10px;border:1px solid rgba(0,129,74,.08);border-radius:16px;background:radial-gradient(circle at 12% 18%,rgba(0,171,82,.07),transparent 34%),radial-gradient(circle at 88% 82%,rgba(242,228,0,.05),transparent 32%),linear-gradient(135deg,#f1f8f4 0%,#f7faf8 48%,#fffceb 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.6);}
.page-cpa-accounting main .industry-logo--bdo{--k:1.12;}
.page-cpa-accounting main .industry-logo--armanino{--k:1.1;}
.page-cpa-accounting main .industry-logo--forvis{--k:1.2;}
.page-cpa-accounting main .industry-logo--plante-moran{--k:.9;}
.page-cpa-accounting main .industry-logo--eisneramper{--k:.82;}
.page-cpa-accounting main .industry-logo--cbiz{--k:1.03;}
.page-cpa-accounting main .industry-logo--baker-tilly{--k:1.06;}
.page-cpa-accounting main .industry-card__accent--green{background:var(--green);}
.page-cpa-accounting main .industry-card__accent--lime{background:var(--lime);}
.page-cpa-accounting main .industry-card__accent--yellow{background:var(--yellow);}
.page-cpa-accounting main .m-testimonial__topline{position:absolute;top:0;right:0;left:0;z-index:1;height:2px;background:linear-gradient(90deg,rgba(242,228,0,0),rgba(242,228,0,.55) 20%,rgba(172,212,0,.55) 80%,rgba(172,212,0,0));}
.page-cpa-accounting main .m-testimonial__dots{position:absolute;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(circle at 1.5px 1.5px,rgba(255,255,255,.1) 1.5px,transparent 0);background-size:28px 28px;-webkit-mask-image:radial-gradient(65% 70% at 50% 30%,#000 10%,rgba(0,0,0,.3) 55%,transparent 88%);mask-image:radial-gradient(65% 70% at 50% 30%,#000 10%,rgba(0,0,0,.3) 55%,transparent 88%);}
.page-cpa-accounting main .m-testimonial__dots-side{position:absolute;top:0;right:0;bottom:0;left:33%;z-index:0;pointer-events:none;background-image:radial-gradient(circle at 1.5px 1.5px,rgba(255,255,255,.07) 1.5px,transparent 0);background-size:30px 30px;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 32%,#000 78%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 32%,#000 78%,transparent 100%);}
.page-cpa-accounting main .m-t-ribbon{position:absolute;right:-28px;bottom:-36px;z-index:0;width:21%;min-width:150px;max-width:270px;aspect-ratio:240/480;overflow:visible;pointer-events:none;}
.page-cpa-accounting main .m-t-ribbon__glow{position:absolute;inset:-45% -60% -20%;pointer-events:none;background:radial-gradient(circle at 92% 88%,rgba(172,212,0,.1),transparent 32%);}
.page-cpa-accounting main .m-t-ribbon__shape{position:relative;}
.page-cpa-accounting main .acct-sys__logo--quickbooks{--lh:29px;}
.page-cpa-accounting main .acct-sys__logo--xero{--lh:33px;}
.page-cpa-accounting main .acct-sys__logo--sage-intacct{--lh:23px;}
.page-cpa-accounting main .acct-sys__logo--netsuite{--lh:14px;}
.page-cpa-accounting main .acct-sys__logo--bill{--lh:19px;}
.page-cpa-accounting main .acct-sys__logo--tipalti{--lh:26px;}
@media (max-width:767px){.page-cpa-accounting main .industry-intro__col{width:100%;}}
/* ============================================================
   SHARED INDUSTRY HERO — synced to the approved Retirement Systems
   hero. All three industry pages use this atmosphere, column balance,
   artwork scale, and viewport-height behavior.
   ============================================================ */
.first-fold{display:block;}
.industry-hero{
  --header-h:114px;
  position:relative;color:var(--ink);
  isolation:isolate;
  overflow:hidden;overflow:clip;
  background:
    radial-gradient(46% 64% at 4% 8%,rgba(0,129,74,.085) 0%,rgba(0,171,82,.035) 40%,transparent 68%),
    radial-gradient(42% 58% at 88% 32%,rgba(0,171,82,.14) 0%,rgba(0,171,82,.065) 38%,rgba(0,171,82,.02) 58%,transparent 76%),
    radial-gradient(32% 38% at 72% 67%,rgba(242,228,0,.15) 0%,rgba(242,228,0,.075) 34%,rgba(172,212,0,.035) 54%,transparent 72%),
    radial-gradient(28% 46% at 101% 54%,rgba(172,212,0,.075) 0%,rgba(0,171,82,.03) 48%,transparent 74%),
    linear-gradient(105deg,#F7FBF9 0%,#fff 34%,#fff 57%,#FFFDF3 78%,#F8FCF9 100%);
}
.industry-hero__shell{container:hero / inline-size;}
.industry-hero__grid{
  display:grid;grid-template-columns:minmax(0,1fr);
  gap:32px;align-items:center;
  padding:clamp(40px,7vw,96px) 0 clamp(32px,6.4vw,88px);
}
.industry-hero h1{
  font-size:clamp(38px,4vw,56px);line-height:1.08;letter-spacing:0;
  margin:0 0 20px;text-wrap:balance;
}
.industry-hero .lead{margin:0 0 32px;max-width:60ch;text-wrap:pretty;}
.industry-hero__visual{
  position:relative;width:100%;
  display:flex;align-items:center;justify-content:center;
}
.industry-hero__art{
  display:block;width:100%;max-width:560px;height:auto;object-fit:contain;
}
@container hero (width <= 480px){
  .industry-hero .btn{width:100%;height:53px;}
}
@container hero (width >= 700px){
  .industry-hero__grid{
    grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
    gap:clamp(28px,4vw,40px);
    padding-block:clamp(40px,3vw,44px) clamp(44px,4.2vw,64px);
  }
  .industry-hero__visual{
    width:100%;min-width:0;
    justify-self:end;align-self:center;
    justify-content:flex-end;overflow:visible;
  }
  .industry-hero__art{width:min(560px,108%);max-width:none;transform:translateX(4%);}
  .industry-hero .lead{max-width:none;}
  .industry-hero h1{max-inline-size:none;}
}
@media (max-width:767px){
  .industry-hero__art{width:100%;max-width:560px;transform:none;}
  .industry-hero__visual{justify-content:center;}
}
@container hero (width >= 1100px){
  .industry-hero__grid{
    grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
    gap:clamp(48px,3.8vw,56px);
  }
}
@container hero (width >= 1280px){
  .industry-hero h1{margin-bottom:24px;}
}
@media (min-width:1024px){
  .industry-hero{--industry-art-w:var(--industry-art-w-base);}
  .industry-hero__art{
    flex:none;
    width:calc(var(--industry-art-w) * var(--industry-art-scale-factor,1));
    max-width:none;
    transform:translateX(11.6%);
  }
}
@media (min-width:1024px) and (max-width:1199px){
  .industry-hero{--industry-art-w-base:clamp(540px,52vw,620px);}
}
@media (min-width:1200px) and (max-width:1399px){
  .industry-hero{--industry-art-w-base:clamp(620px,47vw,680px);}
}
@media (min-width:1400px){
  .industry-hero{--industry-art-w-base:clamp(660px,44vw,720px);}
}
@media (min-width:1024px) and (max-height:700px){
  .industry-hero{--industry-art-w:min(var(--industry-art-w-base),620px);}
}
@media (min-width:1024px){
  .industry-hero{
    --industry-hero-y:clamp(32px,3svh,48px);
    --industry-trust-slot-h:102px;
    --industry-opening-h:min(calc(100svh - var(--header-h)),922px);
    --industry-hero-main-h:calc(var(--industry-opening-h) - var(--industry-trust-slot-h));
  }
  .industry-hero__shell{
    height:var(--industry-hero-main-h);min-height:0;
    display:flex;flex-direction:column;justify-content:center;
    overflow:visible;
  }
  .industry-hero__grid{
    height:100%;box-sizing:border-box;
    padding-block:var(--industry-hero-y);
    grid-template-rows:minmax(0,1fr);
    clip-path:inset(0 -25vw 0 -25vw);
  }
}

/* ============================================================
   HERO TRUST LOGOS — the last layer of the hero, inside
   .industry-hero and on the same atmosphere (it is not a section).
   ONE semantic list, completely static on every screen size: nothing
   scrolls, animates, is masked or is duplicated.
   Marks keep their own brand colours. Optical size is a shared fluid
   unit (--u) times a per-mark factor (--k): stacked / short marks
   are taller and long wordmarks shorter, so they carry equal visual
   weight instead of equal raw width.
   Row >= 976px: one evenly distributed row inside .wrap.
   Narrower: the same list wraps deliberately, centred.
   ============================================================ */
.industry-hero__logos{container:logos / inline-size;}
.industry-logos{
  list-style:none;margin:0;padding:clamp(22px,3vw,28px) 0 clamp(26px,3.4vw,32px);
  border-top:1px solid var(--divider-soft);
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  column-gap:clamp(28px,6vw,48px);row-gap:clamp(20px,4.6vw,26px);
  --u:clamp(22px,calc(17px + 1.6vw),28px);
}
.industry-logos li{display:flex;align-items:center;justify-content:center;flex:none;}
.industry-logo{display:block;height:calc(var(--u) * var(--k,1));width:auto;max-width:100%;}
@container logos (width >= 976px){
  .industry-logos{flex-wrap:nowrap;justify-content:space-between;column-gap:24px;--u:clamp(24px,calc(17px + 1.05vw),32px);}
}

@media (min-width:1024px){
  .industry-logos{
    height:var(--industry-trust-slot-h);min-height:0;
    box-sizing:border-box;padding-block:0;
  }
}

/* ============================================================
   INDUSTRY STATS BAND — Industry-page proof rail. Design kept
   (deep-green horizontal band, icon + value + descriptor); only
   the implementation moves onto shared tokens. All FIVE values
   share ONE Rowan scale and ONE Hanken label scale. The band reads
   as one premium proof environment — spacing and alignment group
   the five stats, not borders or divider lines.
   ============================================================ */
.industry-stats{
  position:relative;overflow:hidden;padding:clamp(28px,3vw,40px) 0;
  background:
    radial-gradient(70% 170% at 4% 50%, rgba(0,171,82,.22), transparent 64%),
    radial-gradient(60% 160% at 50% 130%, rgba(0,171,82,.12), transparent 66%),
    radial-gradient(70% 170% at 96% 50%, rgba(172,212,0,.16), transparent 64%),
    radial-gradient(45% 100% at 50% -20%, rgba(242,228,0,.05), transparent 62%),
    var(--green-deep);
}
.industry-stats .wrap{position:relative;z-index:1;container:stats / inline-size;}
/* ---------- stats rail: five equal values ----------
   Same band, icon surface, value scale and label scale as Gaming.
     < 600   2 + 2 + 1 (fifth item centred, spanning both columns)
     600-959 five columns, icon above value (vertical clusters)
     >= 960  five horizontal clusters in one calm row            */
.industry-stats__rail{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  justify-content:normal;column-gap:20px;row-gap:22px;
}
.industry-stat{display:flex;align-items:center;gap:12px;min-width:0;text-align:left;}
.industry-stat:last-child{grid-column:1 / -1;justify-self:center;}
.industry-stat__ico{
  width:32px;height:32px;flex:none;border-radius:var(--r-md);
  background:rgba(172,212,0,.09);border:1px solid rgba(172,212,0,.13);
  display:flex;align-items:center;justify-content:center;color:var(--lime);
}
.industry-stat__ico .lucide{width:17px;height:17px;--icon-stroke:1.85;}
.industry-stat__val{
  display:block;font-family:var(--serif);font-weight:400;white-space:nowrap;
  font-size:clamp(22px,7cqi,24px);line-height:1.08;letter-spacing:0;color:var(--on-dark);
}
.industry-stat__lbl{display:block;font-size:12.5px;line-height:1.35;color:var(--on-dark-muted);margin-top:3px;}
@container stats (width >= 600px){
  .industry-stats__rail{grid-template-columns:repeat(5,minmax(0,1fr));column-gap:16px;row-gap:26px;}
  .industry-stat{flex-direction:column;justify-content:flex-start;gap:12px;text-align:center;}
  .industry-stat:last-child{grid-column:auto;justify-self:stretch;}
  .industry-stat__ico{width:35px;height:35px;}
  .industry-stat__ico .lucide{width:18.5px;height:18.5px;}
  .industry-stat__val{font-size:clamp(22px,3.3cqi,26px);}
}
@container stats (width >= 960px){
  .industry-stats__rail{display:flex;justify-content:space-between;column-gap:24px;}
  .industry-stat{flex-direction:row;gap:14px;text-align:left;}
  .industry-stat__val{font-size:clamp(24px,1.9vw,29px);}
}

/* ============================================================
   INDUSTRY REALITY — shared 3-card composition (Gaming v14):
   stacked -> icon rail (520) -> three equal columns (930).
   ============================================================ */
.industry-reality{container:reality / inline-size;}
/* Shared industry-card component (Gaming v14, verbatim) — used by
   the portfolio outcomes. Only two structures exist: one card per
   row, or three equal columns. Never 2 + 1. */
.industry-reality__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;}
.industry-card{
  border-radius:var(--r-lg);border:1px solid var(--line);
  overflow:hidden;background:var(--paper);box-shadow:var(--shadow-sm);
}
.industry-card__accent{height:3px;}
.industry-card__body{padding:22px 20px;}
.industry-card h3{font-size:clamp(20px,1.5vw,22px);line-height:1.2;letter-spacing:0;color:var(--ink);margin-top:16px;}
.industry-card p{font-size:16px;line-height:1.6;color:var(--muted);margin-top:8px;}
/* Intermediate: still one per row, icon in a compact left rail. */
@container reality (520px <= width < 930px){
  .industry-reality__grid{gap:18px;}
  .industry-card__body{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:24px;align-items:start;padding:26px 28px;}
  .industry-card .ico{grid-row:1 / span 2;}
  .industry-card h3{margin-top:0;align-self:center;}
  .industry-card p{grid-column:2;margin-top:10px;}
}
/* Wide: three equal columns once each card keeps a ~300px measure. */
@container reality (width >= 930px){
  .industry-reality__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}
  .industry-card__body{padding:clamp(26px,2.2vw,32px);}
  .industry-card h3{margin-top:22px;}
  .industry-card p{margin-top:12px;}
}

/* ============================================================
   INDUSTRY STEP NARRATIVE — shared vertical step
   narrative (Gaming v14). Timeline + alternating text/visual are preserved;
   markers, connector and stages move onto shared tokens.
   Text is always first in the DOM; the desktop flip is a visual
   order only, so reading and focus order stay 01 -> 04.
   ============================================================ */
.industry-steps{position:relative;container:steps / inline-size;}
.industry-steps__line{display:none;position:absolute;left:18px;top:18px;bottom:18px;width:1px;background:var(--line-2);}
/* Each step is its own container. Stacked by default:
   number -> heading -> body -> visual (DOM order; no reordering). */
.industry-step{position:relative;container:step / inline-size;}
.industry-step + .industry-step{margin-top:clamp(46px,calc(30px + 3.1vw),74px);}
.industry-step__num{
  width:38px;height:38px;border-radius:999px;margin-bottom:18px;
  border:1px solid var(--line-2);background:var(--paper);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--sans);font-size:13.5px;font-weight:700;letter-spacing:.04em;color:var(--green-ink);
}
.industry-step__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:32px;align-items:center;}
.industry-step__grid > div:first-child{max-width:62ch;}
.industry-step h3{color:var(--ink);}
.industry-step__grid > div > p{margin-top:14px;}
/* Split: timeline rail + text | visual, alternating. Only once the step
   can give the artifact ~340px+ of useful canvas AND keep a ~300px
   text column (step >= 760px). Text stays first in the DOM; the flip
   is visual order only. */
@container steps (width >= 760px){
  .industry-steps__line{display:block;}
}
@container step (width >= 760px){
  .industry-step__num{position:absolute;left:0;top:0;width:36px;height:36px;margin:0;font-size:13px;}
  .industry-step__grid{
    margin-left:clamp(56px,6cqi,74px);
    grid-template-columns:minmax(0,1fr) minmax(368px,1.08fr);gap:clamp(32px,4.5cqi,56px);
  }
  .industry-step--flip .industry-step__grid{grid-template-columns:minmax(368px,1.08fr) minmax(0,1fr);}
  .industry-step--flip .industry-step__visual{order:-1;}
  .industry-step__grid > div:first-child{max-width:none;}
  .m-visual-stage{border-radius:20px;padding:clamp(12px,1.4cqi,18px);}
}

/* ============================================================
   CUSTOMER PROOF / TESTIMONIAL — the approved shared Zenwork
   testimonial component and its approved responsive behavior,
   ported as-is. No Gaming variant of the shell exists.
   ============================================================ */
.m-testimonial{
  position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(46% 52% at 100% 105%, rgba(242,228,0,.12), transparent 64%),
    radial-gradient(56% 62% at 96% 96%, rgba(172,212,0,.09), transparent 68%),
    radial-gradient(55% 60% at 8% 105%, rgba(172,212,0,.13), transparent 68%),
    radial-gradient(120% 90% at 50% -10%, #0E5C33 0%, #0C331E 55%, #071A10 100%);
  padding:clamp(56px,6.25vw,97px) 0;
}
.m-testimonial__shell{position:relative;z-index:1;container:proof / inline-size;}
/* Compact by default: headline -> quote -> avatar + identity ->
   2 equal metrics -> CTA. The portrait split appears only when the
   testimonial itself has room for portrait | story. */
.m-testimonial-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:stretch;}
.m-tphoto{
  display:none;position:relative;height:clamp(360px,calc(300px + 7.8vw),380px);border-radius:var(--r-lg);overflow:hidden;
  background:#0A2B1A;
  box-shadow:0 22px 48px -22px rgba(0,0,0,.4),0 0 0 1px rgba(255,255,255,.06);
}
.m-tphoto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 18%;}
/* Restrained bottom gradient for readable name/title over the photograph. */
.m-tphoto::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:58%;pointer-events:none;
  background:linear-gradient(180deg,transparent 0%,rgba(5,20,12,.18) 38%,rgba(5,20,12,.78) 100%);
}
.m-tphoto-identity{position:absolute;left:24px;right:22px;bottom:26px;z-index:1;display:flex;flex-direction:column;gap:4px;}
.m-tphoto-rule{width:24px;height:2px;background:var(--lime);margin-bottom:14px;}
.m-tphoto-name{font-size:18px;font-weight:700;letter-spacing:0;color:#fff;}
.m-tphoto-role{font-size:13px;line-height:1.4;color:rgba(255,255,255,.72);}
.m-tstory{display:flex;flex-direction:column;justify-content:center;gap:18px;min-width:0;width:100%;}
.m-t-h2{font-family:var(--serif);font-weight:400;font-size:clamp(28px,calc(23.41px + 1.43vw),44px);line-height:1.06;letter-spacing:0;margin:0;width:100%;text-wrap:pretty;}
.m-t-quote{margin:0;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(18px,calc(13px + .6vw),20px);line-height:1.5;letter-spacing:0;color:rgba(255,255,255,.9);width:100%;text-wrap:pretty;}
.m-t-identity-compact{display:flex;align-items:center;gap:16px;padding:4px 0 0;}
.m-t-identity-compact .m-t-avatar{
  position:relative;width:68px;height:68px;flex:none;border-radius:14px;overflow:hidden;
  box-shadow:0 0 0 1px rgba(255,255,255,.14);
}
.m-t-identity-compact .m-t-avatar img{width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block;}
.m-t-identity-compact b{display:block;font-size:16.5px;font-weight:700;letter-spacing:0;color:#fff;}
.m-t-identity-compact span{display:block;font-size:13.5px;line-height:1.4;color:rgba(255,255,255,.72);margin-top:3px;}
/* Two equal metric columns; the gradient rule is the ::before
   pseudo-element, so it takes no grid cell. */
.m-testimonial-metrics{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px;padding-top:22px;}
.m-testimonial-metrics::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,rgba(242,228,0,.4),rgba(172,212,0,.4) 55%,rgba(172,212,0,.08));
}
.m-testimonial-metrics > div{display:flex;flex-direction:column;gap:6px;min-width:0;}
.m-testimonial-metrics > div + div{padding-left:20px;border-left:1px solid rgba(255,255,255,.14);}
.m-t-metric-val{font-family:var(--serif);font-size:clamp(21px,calc(15px + 2.2vw),33px);line-height:1.1;letter-spacing:0;}
.m-t-metric-lbl{font-size:11px;font-weight:700;letter-spacing:.06em;line-height:1.35;text-transform:uppercase;color:rgba(255,255,255,.55);}
.m-t-cta{align-self:flex-start;margin-top:6px;box-shadow:0 14px 30px -14px rgba(0,0,0,.45);}
.m-t-cta:hover{box-shadow:0 18px 34px -14px rgba(0,0,0,.5);}
@container proof (width <= 480px){
  .m-t-cta{align-self:stretch;width:100%;}
}
@container proof (width >= 700px){
  .m-testimonial-grid{grid-template-columns:clamp(270px,calc(170px + 12vw),330px) minmax(0,1fr);gap:clamp(40px,5vw,84px);}
  .m-tphoto{display:block;}
  .m-tstory{gap:0;padding:clamp(8px,1.5vw,24px) 0;}
  .m-t-identity-compact{display:none;}
  .m-t-quote{margin-top:22px;}
  .m-testimonial-metrics{display:flex;align-items:baseline;gap:clamp(24px,4.5vw,64px);margin-top:30px;}
  .m-testimonial-metrics > div + div{padding-left:0;border-left:0;}
  .m-t-metric-val{font-size:clamp(26px,3.4cqi,33px);line-height:1;white-space:nowrap;}
  .m-t-metric-lbl{font-size:10.5px;letter-spacing:.1em;line-height:1.6;}
  .m-t-cta{margin-top:24px;}
}

/* ============================================================
   CLOSING CTA — the approved shared deep-green conversion
   chapter, ported verbatim (atmosphere, brand geometry,
   Rowan heading, Hanken copy, yellow CTA).
   ============================================================ */
.close{
  position:relative;overflow:hidden;text-align:center;
  padding:clamp(64px,12vw,160px) 0 clamp(56px,8vw,96px);
  background:
    radial-gradient(58% 65% at 84% 6%, rgba(242,228,0,.11), transparent 62%),
    radial-gradient(52% 60% at 12% 96%, rgba(172,212,0,.10), transparent 64%),
    linear-gradient(180deg,#0c331e 0%,#00351C 55%,#052013 100%);
  border-bottom:1px solid var(--on-dark-line);
}
.close::after{
  content:"";position:absolute;z-index:0;pointer-events:none;
  top:0;right:0;bottom:0;left:0;
  background-image:url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAzIiBoZWlnaHQ9IjkwNCIgdmlld0JveD0iMCAwIDQwMyA5MDQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIG9wYWNpdHk9IjAuMiI+CjxwYXRoIGQ9Ik00NzcuMjIxIDY0NS42MzRMMC4zMTM0NzcgMzIyLjgxN1Y1ODAuMzk1TDQ3Ny4yMjEgOTAzLjIxMlY2NDUuNjM0WiIgZmlsbD0iI0YyRTQwMCIvPgo8cGF0aCBkPSJNNDc3LjIyMSAyNTcuNTc4TDAuMzEzNDc3IDU4MC4zOTVWMzIyLjgxN0w0NzcuMjIxIC0xLjM4ODQ3ZS0wNVYyNTcuNTc4WiIgZmlsbD0idXJsKCNwYWludDBfbGluZWFyXzYyXzM5OCkiLz4KPC9nPgo8ZGVmcz4KPGxpbmVhckdyYWRpZW50IGlkPSJwYWludDBfbGluZWFyXzYyXzM5OCIgeDE9IjIzOC43NjciIHkxPSI1ODAuMzk1IiB4Mj0iMjM4Ljc2NyIgeTI9IjAiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj4KPHN0b3Agc3RvcC1jb2xvcj0iIzAwQUI1MiIvPgo8c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNBQ0Q0MDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPC9kZWZzPgo8L3N2Zz4K');
  background-repeat:no-repeat;
  background-position:right center;
  background-size:auto 130%;
}
.close::before{
  content:"";position:absolute;left:0;right:0;top:0;height:640px;z-index:0;pointer-events:none;
  background-image:radial-gradient(circle at 1.5px 1.5px,rgba(255,255,255,0.09) 1.5px,transparent 0);
  background-size:26px 26px;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.22) 55%,transparent 100%);
  mask-image:linear-gradient(180deg,rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.22) 55%,transparent 100%);
}
.close > *{position:relative;z-index:1;}
.close .h2{max-inline-size:var(--hm-tight);margin:0 auto 22px;color:#fff;text-wrap:balance;font-size:var(--type-h2);}
.close p{color:rgba(255,255,255,.72);font-size:clamp(17px,calc(15px + .5vw),19px);line-height:1.55;max-width:56ch;margin:0 auto clamp(30px,4vw,36px);}
.close .wrap{container:closing / inline-size;}
@container closing (width <= 480px){
  .close .btn{width:100%;}
}

/* ============================================================
   CPA & ACCOUNTING FIRMS — PAGE-SPECIFIC LAYER
   Everything above this banner is the shared Gaming v14 industry
   implementation. Everything below is scoped to this page's
   Accounting IA: section environments, the section-intro measure,
   the five-value stats rail, the 2027 convergence, the portfolio
   outcomes, the four engagement artifacts, the AI oversight flow,
   the supported-systems diagram and the identity-only testimonial
   media slot. No shared token is redefined here.
   ============================================================ */

/* ---------- section environments ----------
   Gradients mark chapters, not every section:
     2027         clean white (context)             pause
     portfolio    concentrated mist pool            highlighted chapter
     engagement   one long pale-green canvas        long workflow
     AI           white; atmosphere only in its visual stage
     access       solid mist                        quiet pause
     systems      white; atmosphere only in its visual stage
   Dark chapters (stats, proof, close) sit between them unchanged. */
.acct-season{
  padding:clamp(56px,6.2vw,92px) 0 clamp(44px,4.8vw,68px);scroll-margin-top:100px;
  background:#FFFFFF;
}
/* PORTFOLIO — the primary light chapter: a concentrated mist pool
   behind the heading and cards, fading in from white and out to
   white before the engagement chapter begins. */
.acct-portfolio{
  /* Tightened to sit closer to the shared --gap ceiling (132px) used
     between the later light chapters (AI / Access / Systems), so the
     season->portfolio and portfolio->engagement transitions read as
     deliberate rather than larger than the rest of the page. Portfolio
     keeps a touch more than a plain .section on both sides -- it is
     still the primary chapter -- but no longer exceeds the shared
     rhythm by 12-20px on each edge. */
  padding:clamp(84px,8.6vw,128px) 0 clamp(88px,9vw,132px);scroll-margin-top:100px;
  background:
    radial-gradient(46% 40% at 86% 30%, rgba(0,171,82,.085), transparent 72%),
    radial-gradient(40% 34% at 10% 78%, rgba(172,212,0,.05), transparent 72%),
    linear-gradient(180deg, #FFFFFF 0%, #F4F8F5 16%, #F1F6F3 52%, #F4F8F5 84%, #FFFFFF 100%);
}
/* LIGHT B — engagement: mostly white, per the W-9 page's own
   .m-light-a/.m-light-b surfaces (a white/mist base carrying ONE soft
   localized wash, not a continuous tinted fill). One chapter, felt
   rather than seen: white -> soft mint -> near-white -> subtle mint
   -> white. Visual stages keep their own atmosphere unchanged. */
.m-light-b{
  background:
    radial-gradient(50% 24% at 92% 18%, rgba(0,171,82,.04), transparent 70%),
    radial-gradient(44% 22% at 7% 75%, rgba(172,212,0,.025), transparent 70%),
    linear-gradient(180deg, #FFFFFF 0%, #F8FBF9 18%, #FBFDFC 42%, #F7FAF8 72%, #FFFFFF 100%);
}
/* ---------- CHAPTER SEAM ----------
   Where two long LIGHT narrative chapters meet and both backgrounds
   resolve back to white (Regulatory -> Portfolio, Portfolio ->
   Engagement), a single 1px hairline marks the start of the incoming
   chapter. Page-grid width, fades out at both ends, neutral ink with
   only a trace of Zenwork green at the centre. No label, icon, dot,
   shadow or geometry.
   It is a purely visual separator: an absolutely positioned
   pseudo-element on the section's top edge, so it takes no space in
   the flow and is independent of the section padding (change the
   padding and the seam neither adds nor removes any height). Not used
   above the white / mist AI-Access-Systems pauses (their own
   background change is visible) nor above dark chapters. */
.acct-portfolio,
.acct-engagement{position:relative;}
.acct-portfolio::before,
.acct-engagement::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  width:min(calc(100% - (var(--edge) * 2)), var(--maxw));margin-inline:auto;
  pointer-events:none;
  background:linear-gradient(90deg,transparent 0%,rgba(15,24,34,.045) 14%,rgba(0,129,74,.11) 50%,rgba(15,24,34,.045) 86%,transparent 100%);
}
.acct-env-ai{background:#FFFFFF;}
.acct-env-access{background:var(--mist);}
.acct-env-systems{background:#FFFFFF;}

/* ---------- section intro: type variants ----------
   Width comes from the shared lane defined with .industry-intro
   (centred, 80% of the content width). The container stays declared
   so the Portfolio lead can size its support copy from the intro's
   own width. */
.industry-intro{container:intro / inline-size;}
/* Section headings share the single .h2 scale (see .h2). The hero keeps
   the page's only eyebrow. */
@container intro (width >= 960px){
  .acct-intro-lead p{font-size:clamp(18px,1.35vw,20px);}
}
.acct-intro-lead{margin-bottom:clamp(44px,5.2vw,76px);}
/* Portfolio outcome cards — the shared industry card, tuned for the
   primary chapter: white on the mist pool, a slightly clearer
   hairline, a touch more air, a firmer H3. Equal heights come from
   the grid's default stretch. */
.acct-portfolio .industry-card{border-color:rgba(15,24,34,.1);box-shadow:0 1px 2px rgba(15,24,34,.04),0 16px 32px -28px rgba(12,51,30,.22);}
.acct-portfolio .industry-card .ico{width:44px;height:44px;}
.acct-portfolio .industry-card .ico .lucide{width:21px;height:21px;}
.acct-portfolio .industry-card h3{font-size:clamp(21px,1.65vw,24px);line-height:1.18;text-wrap:balance;}
.acct-portfolio .industry-card p{font-size:16.5px;}
@container reality (width >= 930px){
  .acct-portfolio .industry-card__body{padding:clamp(30px,2.6vw,38px) clamp(28px,2.4vw,34px) clamp(32px,2.8vw,40px);}
  .acct-portfolio .industry-card h3{margin-top:26px;}
  .acct-portfolio .industry-card p{margin-top:14px;}
}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ---------- 2027: compact context cards + precise convergence ----------
   Reuses the shared industry-card component as-is (no enhancement
   scope, unlike .acct-portfolio's), so these read lighter than the
   Portfolio cards by construction: smaller icon surface, tighter
   padding, plain hairline border. A small 01/02/03 metadata mark
   sits opposite the icon inside the same card body. */
.acct-context-grid{margin-top:0;}
.industry-card__body{position:relative;}
.acct-idx{
  position:absolute;top:22px;right:20px;
  font-size:11px;font-weight:600;letter-spacing:.14em;line-height:1;color:var(--muted-2);
  font-variant-numeric:tabular-nums;
}
@container reality (520px <= width < 930px){ .acct-idx{top:28px;right:28px;} }
@container reality (width >= 930px){ .acct-idx{top:clamp(26px,2.2vw,32px);right:clamp(24px,2vw,30px);} }

/* Precise convergence (decorative, aria-hidden): three short stems
   meet one hairline; a single centre drop carries a small node down
   to the consequence surface. Stem x-positions are the exact column
   centres of the 3-equal-column card grid above (same 24px gap), so
   the connector reads as literally attached to the cards it sums. */
.acct-converge{--ln:rgba(0,129,74,.22);position:relative;height:36px;margin-top:10px;}
.acct-converge > span{position:absolute;display:none;}
.acct-converge__drop{display:block !important;left:50%;top:0;height:36px;width:1px;margin-left:-.5px;background:var(--ln);}
.acct-converge__node{
  display:block !important;left:50%;top:18px;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:999px;
  background:var(--green);box-shadow:0 0 0 3px #FFFFFF;
}
@container reality (width >= 930px){
  .acct-converge{height:40px;margin-top:0;}
  .acct-converge__stem{display:block !important;top:0;height:18px;width:1px;background:var(--ln);}
  .acct-converge__stem--l{left:calc(100% / 6 - 8px);}
  .acct-converge__stem--r{left:calc(100% - 100% / 6 + 8px - 1px);}
  .acct-converge__rule{display:block !important;top:18px;height:1px;background:var(--ln);
    left:calc(100% / 6 - 8px);right:calc(100% / 6 - 8px);}
  .acct-converge__drop{top:19px;height:21px;}
  .acct-converge__node{top:40px;}
}

/* The consequence lives in a quiet contained surface — white on the
   season's near-white background, a hairline border, the shared
   radius, minimal shadow. ~64% of the grid at desktop, full width
   once the cards stack. Not a banner: no fill, no brand color. */
.acct-resolve-wrap{display:flex;justify-content:center;}
.acct-resolve{
  width:100%;box-sizing:border-box;text-align:center;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-sm);padding:22px clamp(20px,4vw,32px) 25px;
}
.acct-resolve h3{
  font-size:clamp(19px,calc(16px + .5vw),22px);line-height:1.22;letter-spacing:0;color:var(--ink);text-wrap:balance;
}
.acct-resolve p{
  font-size:15px;line-height:1.6;color:var(--muted);
  width:100%;max-inline-size:none;margin:8px auto 0;text-wrap:pretty;
}
@container reality (width >= 900px){
  .acct-resolve{width:64%;padding:26px clamp(28px,2.6vw,36px) 30px;}
}

/* ============================================================
   ENGAGEMENT ARTIFACTS — four Accounting workflow pieces on the
   shared stage/surface grammar. Each takes the structure its idea
   needs:
     01 payee record -> two source checks -> verified outcome
     02 one form's lifecycle after transmission (vertical track)
     03 a retained year index (horizontal ruler, current in front)
     04 a year of vendor activity -> carried into the 2026 form
   ============================================================ */
.wf{
  --px:clamp(14px,4.4cqi,22px);
  background:var(--paper);border:1px solid rgba(15,24,34,.11);border-radius:11px;
  overflow:hidden;color:var(--ink);font-family:var(--sans);
  box-shadow:0 1px 0 rgba(15,24,34,.03);
}
.wf-row{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:6px 16px;min-height:48px;padding:11px var(--px);
}
.wf-row + .wf-row{border-top:1px solid var(--line);}
.wf-name{font-size:15px;font-weight:500;color:var(--ink);}
.wf-state{display:inline-flex;align-items:center;gap:7px;margin-left:auto;font-size:13.5px;font-weight:600;white-space:nowrap;}
.wf-state .lucide{width:15px;height:15px;--icon-stroke:2;}
.wf-state--ok{color:var(--green-ink);}
.wf-state--quiet{color:var(--muted);font-weight:500;}
.wf-state--quiet .lucide{color:var(--muted-2);}
@container canvas (width < 380px){
  .wf-row{column-gap:10px;}
  .wf-name{font-size:14.5px;}
  .wf-state{font-size:13px;gap:6px;}
}

/* shared flow spine: record icon, connector and outcome share one axis */
.acct-flow{--px:clamp(14px,4.4cqi,22px);}
.acct-rec{display:flex;align-items:center;gap:12px;padding:14px var(--px);border-bottom:1px solid var(--line-2);background:var(--paper-2);}
.acct-rec__ico{
  width:30px;height:30px;flex:none;border-radius:999px;background:var(--paper);
  border:1px solid rgba(0,129,74,.18);color:var(--green-ink);display:flex;align-items:center;justify-content:center;
}
.acct-rec__ico .lucide{width:15px;height:15px;--icon-stroke:1.9;}
.acct-rec b{display:block;font-size:14.5px;font-weight:600;line-height:1.3;}
.acct-rec small{display:block;font-size:13px;line-height:1.35;color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:.01em;}
.acct-src{margin-left:8px;font-size:11.5px;font-weight:600;letter-spacing:.06em;color:var(--muted-2);}
.acct-link{height:26px;margin-left:calc(var(--px) + 14.4px);border-left:1.25px solid rgba(0,129,74,.34);position:relative;}
.acct-link::after{
  content:"";position:absolute;left:-4px;bottom:-1px;width:6.5px;height:6.5px;
  border-right:1.25px solid rgba(0,129,74,.5);border-bottom:1.25px solid rgba(0,129,74,.5);transform:rotate(45deg);
}
.acct-out{
  --px:clamp(14px,4.4cqi,22px);
  display:flex;align-items:center;gap:12px;padding:14px var(--px);border-radius:11px;
  background:var(--green-deep);color:var(--on-dark);
}
.acct-out__tick{
  width:30px;height:30px;flex:none;border-radius:999px;background:var(--green);color:var(--white);
  display:flex;align-items:center;justify-content:center;
}
.acct-out__tick .lucide{width:15px;height:15px;--icon-stroke:2.6;}
.acct-out b{display:block;font-size:14.5px;font-weight:600;line-height:1.3;}
.acct-out small{display:block;font-size:12.5px;line-height:1.35;color:var(--on-dark-muted);}

/* 02 — form lifecycle */
.acct-form__head{display:flex;align-items:center;gap:10px;padding:16px var(--px) 12px;}
.acct-form__head .lucide{width:18px;height:18px;--icon-stroke:1.75;color:var(--green-ink);}
.acct-form__head b{font-size:16px;font-weight:700;letter-spacing:0;}
.acct-track{list-style:none;margin:0;padding:0 var(--px) 8px;position:relative;}
.acct-track::before{
  content:"";position:absolute;left:calc(var(--px) + 11px);top:24px;bottom:32px;width:0;
  border-left:1.25px solid var(--line-2);
}
.acct-track li{position:relative;display:flex;align-items:center;gap:14px;min-height:52px;}
.acct-track li + li{border-top:1px solid var(--line);margin-left:36px;padding-left:0;}
.acct-track li + li .acct-track__node{margin-left:-36px;}
.acct-track__node{
  position:relative;z-index:1;width:23px;height:23px;flex:none;border-radius:999px;background:var(--paper);
  display:flex;align-items:center;justify-content:center;
}
.acct-track__node .lucide{width:17px;height:17px;--icon-stroke:1.9;}
.acct-track__name{font-size:15px;font-weight:500;}
.acct-track__state{margin-left:auto;font-size:13.5px;font-weight:600;white-space:nowrap;}
.acct-track .is-accepted .acct-track__node{color:var(--green-ink);}
.acct-track .is-accepted .acct-track__state{color:var(--green-ink);}
.acct-track .is-submitted .acct-track__node{color:#6F8A00;}
.acct-track .is-submitted .acct-track__state{color:#566A00;}
.acct-track .is-delivered .acct-track__node{color:var(--muted);}
.acct-track .is-delivered .acct-track__state{color:var(--ink);font-weight:500;}

/* 03 — retained year index */
.acct-years{container:years / inline-size;}
.acct-years__index{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));}
.acct-year{position:relative;padding:34px clamp(10px,4cqi,20px) 20px;display:flex;flex-direction:column;gap:6px;}
.acct-year + .acct-year{border-left:1px solid var(--line);}
/* the ruler: one continuous line through every retained year */
.acct-year::before{content:"";position:absolute;left:0;right:0;top:17px;border-top:1.25px solid var(--line-2);}
.acct-year::after{
  content:"";position:absolute;left:clamp(10px,4cqi,20px);top:13px;width:9px;height:9px;border-radius:999px;
  background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--muted-2);
}
.acct-year__num{font-size:clamp(19px,6.2cqi,24px);font-weight:600;line-height:1.1;letter-spacing:0;font-variant-numeric:tabular-nums;color:var(--muted-2);}
.acct-year__state{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:var(--muted-2);white-space:nowrap;}
.acct-year__state .lucide{width:14px;height:14px;--icon-stroke:1.9;}
.acct-year__tag{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--green-ink);}
.acct-year--current{background:linear-gradient(180deg,rgba(0,171,82,.07),rgba(0,171,82,.015) 80%);}
.acct-year--current::before{border-top:2px solid var(--green);top:16.5px;}
.acct-year--current::after{background:var(--green);box-shadow:0 0 0 3px rgba(0,171,82,.16);}
.acct-year--current .acct-year__num{color:var(--ink);font-size:clamp(23px,8cqi,30px);}
.acct-year--current .acct-year__state{color:var(--green-ink);font-weight:600;}
/* very narrow canvas: the same index becomes three ledger rows */
@container years (width < 330px){
  .acct-years__index{grid-template-columns:minmax(0,1fr);}
  .acct-year{flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 12px;padding:14px 16px 14px 36px;}
  .acct-year + .acct-year{border-left:0;border-top:1px solid var(--line);}
  .acct-year::before{display:none;}
  .acct-year::after{left:16px;top:50%;margin-top:-4.5px;}
  .acct-year__state{margin-left:auto;}
  .acct-year__tag{order:3;flex-basis:100%;}
}

/* 04 — a year of vendor activity */
.acct-months{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:3px;
  padding:12px var(--px) 12px;border-bottom:1px solid var(--line);
}
.acct-months span{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:10.5px;font-weight:600;color:var(--muted-2);line-height:1;}
.acct-months span::before{content:"";display:block;width:100%;height:6px;border-radius:2px;background:rgba(0,171,82,.22);}
.acct-doc{
  --px:clamp(14px,4.4cqi,22px);
  display:flex;align-items:center;gap:12px;padding:14px var(--px);border-radius:11px;
  background:var(--paper);border:1.5px solid rgba(0,129,74,.55);
  box-shadow:0 14px 28px -22px rgba(0,129,74,.45);
}
.acct-doc__ico{
  width:30px;height:30px;flex:none;border-radius:8px;background:rgba(0,171,82,.1);color:var(--green-ink);
  display:flex;align-items:center;justify-content:center;
}
.acct-doc__ico .lucide{width:17px;height:17px;--icon-stroke:1.9;}
.acct-doc b{display:block;font-size:14.5px;font-weight:700;line-height:1.3;}
.acct-doc small{display:block;font-size:12.5px;line-height:1.35;color:var(--muted);}

/* ============================================================
   AI-ASSISTED FIRM OPERATIONS
   Capabilities are open rows; the visual is a 1099-R review
   diagram where AI only flags, and the professional reviews and files.
   ============================================================ */
.acct-ai{container:ai / inline-size;}
.acct-ai__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:36px;align-items:center;}
@container ai (width >= 880px){
  .acct-ai__grid{grid-template-columns:minmax(0,.68fr) minmax(0,1fr);gap:clamp(44px,5cqi,80px);}
}
.acct-caps{border-top:1px solid var(--divider-soft);}
.acct-cap{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:16px;padding:24px 0;}
.acct-cap + .acct-cap{border-top:1px solid var(--divider-soft);}
.acct-cap .lucide{width:21px;height:21px;--icon-stroke:1.6;color:var(--green-ink);margin-top:3px;}
.acct-cap h3{font-size:clamp(20px,1.5vw,22px);line-height:1.22;letter-spacing:0;color:var(--ink);}
.acct-cap p{font-size:16px;line-height:1.6;color:var(--muted);margin-top:8px;}

/* 1099-R review — built from the page's own workflow grammar:
   .wf document with the step-02 form header, an .acct-out working
   strip for Zenwork AI, .wf-row fields with the amber attention
   state, a static scan band (motion optional), then a .wf
   professional-review surface whose rows answer each flag, an
   .acct-link and the File to IRS action.
     < 640 canvas  top-down: document -> review -> file
     >= 640 canvas document | one-to-one hand-offs | review -> file
   In the split, heights are tokens so each hand-off line leaves its
   flagged row and lands on the matching review row exactly. */
.acct-rvx-stage{padding:clamp(14px,2.4vw,32px);}
.acct-rvx{
  container:rvx / inline-size;--px:clamp(14px,4.4cqi,22px);
  --amber-ink:#6E5300;--amber-ico:#B98900;--ln:rgba(0,129,74,.34);
  --hh:52px;--hs:60px;--hr:50px;--ph:56px;
  --y1:calc(1px + var(--hh) + var(--hs) + var(--hr) * 1.5);
  --y2:calc(var(--y1) + var(--hr) * 2);
  --r1:calc(var(--y1) + var(--hr) / 2);
  --r2:calc(var(--y1) + var(--hr) * 1.5);
}
.acct-rvx__grid{display:grid;grid-template-columns:minmax(0,1fr);}
.acct-rvx__head{padding-bottom:14px;border-bottom:1px solid var(--line);}
.acct-rvx__who{margin-left:auto;font-size:13.5px;color:var(--muted);}
.acct-rvx__ai{border-radius:0;flex-wrap:wrap;row-gap:6px;}
.acct-rvx__ai-ico{background:rgba(172,212,0,.16);color:var(--lime);box-shadow:inset 0 0 0 1px rgba(172,212,0,.3);}
.acct-rvx__ai-ico .lucide{width:16px;height:16px;--icon-stroke:2;}
.acct-rvx__ai-by{display:block;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--lime);}
.acct-rvx__ai-found{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--yellow);white-space:nowrap;}
.acct-rvx__ai-found .lucide{width:14px;height:14px;--icon-stroke:2.2;}
.acct-rvx__rows{position:relative;overflow:hidden;}
.acct-rvx__val{margin-left:auto;font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums;}
.wf-row.is-flag{background:linear-gradient(90deg,rgba(242,228,0,.1),rgba(242,228,0,.03) 75%);box-shadow:inset 2px 0 0 rgba(185,137,0,.55);}
.wf-state--flag{color:var(--amber-ink);}
.wf-state--flag .lucide{color:var(--amber-ico);}
/* the scan: visible in a static frame; optional slow travel */
.acct-rvx__scan{
  position:absolute;left:0;right:0;top:30%;height:44px;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(0,171,82,0),rgba(0,171,82,.1));
  border-bottom:1.5px solid rgba(0,171,82,.5);
  animation:acct-scan 5s ease-in-out infinite alternate;
}
@keyframes acct-scan{from{top:-10%;}to{top:78%;}}
@media (prefers-reduced-motion:reduce){ .acct-rvx__scan{animation:none;top:30%;} }
.acct-rvx__pro{border-color:rgba(0,129,74,.3);}
.acct-rvx__pro .acct-rec{background:linear-gradient(90deg,rgba(0,171,82,.07),rgba(0,171,82,.015));}
.acct-rvx__pro-ico{background:var(--green);border-color:var(--green);color:#fff;}
.acct-rvx__pro .acct-rec b{font-size:15.5px;font-weight:700;}
.acct-rvx__conn{height:26px;margin-left:calc(var(--px) + 14.4px);border-left:1.25px solid var(--ln);position:relative;}
.acct-rvx__conn > span{display:none;position:absolute;background:var(--ln);}
.acct-file{
  display:inline-flex;align-items:center;gap:9px;height:42px;padding:0 18px;border-radius:9px;
  color:#0c331e;font-size:14.5px;font-weight:600;white-space:nowrap;
}
.acct-file .lucide{width:16px;height:16px;--icon-stroke:2;}

@container rvx (width >= 640px){
  .acct-rvx__grid{grid-template-columns:minmax(0,1.2fr) clamp(36px,7cqi,56px) minmax(0,1fr);align-items:start;}
  .acct-rvx__head{height:var(--hh);padding-block:0;}
  .acct-rvx__ai{height:var(--hs);padding-block:0;flex-wrap:nowrap;}
  .acct-rvx__rows .wf-row{height:var(--hr);min-height:0;padding-block:0;}
  .acct-rvx__pro .acct-rec{height:var(--ph);padding-block:0;}
  .acct-rvx__pro .wf-row{height:var(--hr);min-height:0;padding-block:0;}
  .acct-rvx__conn{height:calc(var(--y2) + 4px);margin-left:0;border-left:0;}
  .acct-rvx__conn > span{display:block;}
  .acct-rvx__c1a{left:0;width:50%;height:1px;top:var(--y1);}
  .acct-rvx__c1b{left:50%;width:1px;top:var(--y1);height:calc(var(--r1) - var(--y1) + 1px);}
  .acct-rvx__c1c{left:50%;right:0;height:1px;top:var(--r1);}
  .acct-rvx__c2a{left:0;width:50%;height:1px;top:var(--y2);}
  .acct-rvx__c2b{left:50%;width:1px;top:var(--r2);height:calc(var(--y2) - var(--r2) + 1px);}
  .acct-rvx__c2c{left:50%;right:0;height:1px;top:var(--r2);}
  /* review rows sit on --r1 / --r2 */
  .acct-rvx__side{padding-top:calc(var(--r1) - var(--hr) / 2 - var(--ph) - 1px);}
}
@container rvx (width < 360px){
  .acct-file{width:100%;justify-content:center;}
}

/* ---------- access / role control ---------- */
.acct-access{container:access / inline-size;}
.acct-access__grid{display:grid;grid-template-columns:minmax(0,1fr);align-items:center;}
.acct-access__visual{padding:clamp(14px,2.4vw,28px);}
.acct-roles .acct-track__node{color:var(--green-ink);}
.acct-role{display:inline-flex;align-items:center;gap:6px;color:var(--muted) !important;font-weight:500 !important;}
.acct-role .lucide{width:14px;height:14px;--icon-stroke:1.9;color:var(--muted-2);}
@container access (width >= 900px){
  .acct-access__grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"intro visual";
    column-gap:clamp(48px,6cqi,96px);align-items:center;
  }
  .acct-access__intro{grid-area:intro;margin-bottom:0;}
  /* Split composition: the intro belongs to its own column, so it keeps
     that column's left alignment instead of the centred 80% lane. */
  .acct-access__intro .industry-intro__col{width:100%;margin-inline:0;text-align:left;}
  .acct-access__intro .h2,.acct-access__intro p{margin-inline:0;}
  .acct-access__visual{grid-area:visual;}
}

/* ============================================================
   SUPPORTED CLIENT SYSTEMS — ONE connected visual, not three cards:

     [ ONE light working surface: client systems | intake methods ]
                            |
                            v
     [       ONE dark outcome block: Zenwork workflow          ]

   The light surface holds INPUT + PROCESS as two zones separated by
   whitespace and a single hairline that doubles as the systems ->
   intake connector. A second connector carries the working surface
   into the Zenwork outcome and visibly resolves into its edge -- it
   never stops in empty space. Geometry adapts to the figure's own
   available width (container queries), not to viewport labels:
     >= 900   work surface | Zenwork, side by side
     520-899  work surface stacked above Zenwork (still fits the
              systems/intake split horizontally inside it)
     < 520    fully vertical: systems above intake above Zenwork,
              logos 2 x 3
   ============================================================ */
figure.m-visual-stage{margin:0;}
.acct-sys-stage{
  padding:clamp(32px,4.4vw,44px) clamp(20px,3.4vw,40px);
  /* Same mint -> warm direction as the shared stage, with the warm
     stop pulled back so it reads as quiet support behind Zenwork
     rather than a third bright object competing with the outcome. */
  background:
    radial-gradient(circle at 12% 18%, rgba(0,171,82,.07), transparent 34%),
    radial-gradient(circle at 88% 82%, rgba(242,228,0,.028), transparent 30%),
    linear-gradient(135deg, #F1F8F4 0%, #F7FAF8 48%, #FDFBF2 100%);
}
.acct-sys{container:sys / inline-size;}
.acct-sys__lbl{display:block;line-height:16px;font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;}

.acct-sys__flow{display:flex;flex-direction:column;gap:20px;}

/* The one light working surface: input + process. */
.acct-sys__work{
  container:work / inline-size;
  background:var(--paper);border:1px solid rgba(15,24,34,.1);border-radius:14px;
  box-shadow:0 1px 0 rgba(15,24,34,.03),0 18px 36px -30px rgba(15,24,34,.16);
  padding:clamp(22px,3cqi,30px) clamp(22px,3cqi,30px);
}
.acct-sys__zones{display:flex;flex-direction:column;gap:22px;}
.acct-sys__zone{min-width:0;}

/* Logos: 3 x 2, structure carried by the marks and whitespace, not a
   drawn grid. Row separation only; no vertical rules across marks. */
.acct-sys__logos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(20px,4cqi,40px);row-gap:4px;}
.acct-sys__logos li{display:flex;align-items:center;min-height:52px;}
.acct-sys__logos li:nth-child(n+3){border-top:1px solid rgba(15,24,34,.06);padding-top:4px;}
/* Real marks, used as supplied -- no tile, ring or card behind them.
   Height is set per mark by optical weight, not one literal pixel
   value: a compact circular icon and a long wordmark at the same CSS
   height do not read as the same size. Both dimensions scale down
   together on narrow columns so a wide wordmark never overflows. */
.acct-sys__logo{display:flex;align-items:center;max-width:100%;}
.acct-sys__logo img,.acct-sys__logo svg{display:block;width:auto;height:var(--lh,20px);max-width:100%;}

/* Zone divider + connector in one quiet element. Stacked (default):
   a short vertical connector between the two zones, same language as
   the outer work->Zenwork connector. Side by side: a thin vertical
   hairline with a small right-pointing chevron -- divider and
   "move into intake" gesture in one mark. */
.acct-sys__zdiv{position:relative;height:24px;margin:2px 0 2px 4px;}
.acct-sys__zdiv::before{content:"";position:absolute;left:0;top:0;bottom:0;border-left:1.25px solid rgba(0,129,74,.32);}
.acct-sys__zdiv::after{
  content:"";position:absolute;left:0;bottom:-1px;width:6.5px;height:6.5px;margin-left:-3.4px;
  border-right:1.25px solid rgba(0,129,74,.5);border-bottom:1.25px solid rgba(0,129,74,.5);transform:rotate(45deg);
}

.acct-sys__intake-list{list-style:none;margin:0;padding:0;}
.acct-sys__intake-list li{display:flex;align-items:center;gap:12px;min-height:38px;font-size:15px;font-weight:600;color:var(--ink);letter-spacing:0;}
.acct-sys__intake-list li + li{border-top:1px solid rgba(15,24,34,.06);}
.acct-sys__intake-list .lucide{width:17px;height:17px;--icon-stroke:1.8;color:var(--green-ink);flex:none;}

/* Connector from the working surface into Zenwork: it touches both
   edges -- no ambiguous gap. */
.acct-sys__link{position:relative;height:28px;margin-left:50%;}
.acct-sys__link::before{content:"";position:absolute;left:0;top:0;bottom:0;border-left:1.25px solid rgba(0,129,74,.4);}
.acct-sys__link::after{
  content:"";position:absolute;left:0;bottom:-1px;width:7px;height:7px;margin-left:-3.4px;
  border-right:1.25px solid rgba(0,129,74,.55);border-bottom:1.25px solid rgba(0,129,74,.55);transform:rotate(45deg);
}

/* The dark outcome block. Vertically centred on the icon; the Rowan
   line is the dominant object, the icon supports it. */
.acct-sys__zw{
  position:relative;display:flex;flex-direction:column;justify-content:center;gap:9px;border-radius:14px;
  padding:clamp(26px,4vw,34px) clamp(24px,3.6vw,32px);
  background:radial-gradient(64% 54% at 100% 0%, rgba(172,212,0,.12), transparent 72%), var(--green-deep);
  box-shadow:0 26px 48px -32px rgba(10,61,36,.7);
}
.acct-sys__zw-ico{
  width:38px;height:38px;flex:none;border-radius:999px;background:rgba(255,255,255,.07);
  box-shadow:inset 0 0 0 1.4px rgba(172,212,0,.42);color:var(--lime);display:flex;align-items:center;justify-content:center;
}
.acct-sys__zw-ico .lucide{width:18px;height:18px;--icon-stroke:1.8;}
.acct-sys__zw .acct-sys__lbl{color:#9DC9AE;margin:2px 0 0;}
.acct-sys__zw h3{font-size:clamp(23px,2.1vw,28px);line-height:1.14;letter-spacing:0;color:#fff;margin-top:1px;}

/* ---- zones side by side once the working surface itself has room ---- */
@container work (width >= 460px){
  .acct-sys__zones{flex-direction:row;align-items:stretch;gap:0;}
  .acct-sys__zone--systems{flex:1.55 1 0;padding-right:clamp(24px,4cqi,40px);}
  .acct-sys__zone--intake{flex:1 1 0;padding-left:clamp(24px,4cqi,40px);align-self:center;}
  .acct-sys__zdiv{
    height:auto;flex:none;width:1px;align-self:stretch;margin:0;
    background:rgba(0,129,74,.16);
  }
  .acct-sys__zdiv::before{display:none;}
  .acct-sys__zdiv::after{
    content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;
    border-right:1.25px solid rgba(0,129,74,.55);border-bottom:1.25px solid rgba(0,129,74,.55);transform:rotate(-45deg);
    background:var(--paper);
  }
}

/* ---- flow: work surface | Zenwork side by side, once the figure has room ---- */
@container sys (width >= 900px){
  .acct-sys__flow{flex-direction:row;align-items:stretch;gap:0;}
  .acct-sys__work{flex:2.25 1 0;}
  .acct-sys__link{
    flex:none;width:clamp(36px,4.4cqi,56px);height:auto;margin-left:0;
    align-self:center;
  }
  .acct-sys__link::before{left:0;right:0;top:50%;bottom:auto;height:0;border-left:0;border-top:1.25px solid rgba(0,129,74,.4);}
  .acct-sys__link::after{left:auto;right:0;top:50%;bottom:auto;margin:-3.4px -3.4px 0 0;transform:rotate(-45deg);}
  .acct-sys__zw{flex:1 1 0;justify-content:center;}
}

/* Three short source-backed metrics. Mobile keeps the approved
   3-column rail; from 520px up (the story is no longer squeezed
   against a stacked photo) the group becomes a single compact,
   LEFT-anchored cluster that stops at its own content width rather
   than spreading across the full story column. */
.m-testimonial-metrics{grid-template-columns:repeat(3,minmax(0,1fr));}
@container proof (width >= 520px){
  .m-testimonial-metrics{
    display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:flex-start;
    column-gap:clamp(32px,4vw,56px);row-gap:16px;width:fit-content;max-width:100%;
  }
  .m-testimonial-metrics > div{flex:none;text-align:left;}
  .m-testimonial-metrics > div + div{padding-left:0;border-left:0;}
}
@container proof (width >= 700px){
  .m-t-context{margin-top:18px;font-size:16.5px;}
  .m-t-quote{margin-top:20px;}
}

/* closing: the shared component, wide centred measure for this copy */
.close--wide .h2{max-inline-size:var(--hm-wide);}

/* ============================================================
   RESPONSIVE ARCHITECTURE
   Page-level rhythm is fluid via clamp(); composition changes are
   container queries co-located with each component:

   hero      stacked -> split .............. hero     >= 700
   logos     static wrap -> one static row .. logos    >= 976
   intro     centred 80% lane -> full width . viewport <= 767
   stats     2x2 -> 5-across ................ stats    600 / 960
   2027      rows -> 3 open columns ......... reality  >= 900
             centre rule -> stems + hairline  reality  >= 900
   portfolio cards stacked -> rail -> 3 ..... reality  520 / 930
   step      stacked -> rail + text|visual .. step     >= 760
   years     ruler -> ledger rows ........... years    < 330
   proof     compact -> portrait|story ...... proof    700; metrics 520
   ai        stacked -> two columns ......... ai       >= 880
   1099-R    top-down -> doc | links | review  rvx      >= 640
   access    stacked -> copy | role visual .. access   >= 900
   systems   work+Zenwork vertical -> row .. sys      >= 900
             zones vertical -> row ........ work     >= 460
   closing   full-width CTA ................. closing  <= 480
   ============================================================ */

/* Industry pages: FAQ heading scrolls with the section (no sticky). */
.page-cpa-accounting .faq__intro,.page-gaming-casinos .faq__intro,.page-retirement-systems .faq__intro{position:static;}