/* ============================================================
   DESIGN SYSTEM
   Tokens first. Every colour, size and space below is a token.
   --display-scale exists so ICAI Guideline 3.1.3(I) can be
   satisfied in one edit: set it to 0 for a strict reading.
   ============================================================ */
:root{
  /* This site is light-only by choice. A practice website is a
     document, and a document is white. Honouring the visitor's
     dark mode produced a near-black page, which is wrong for the
     subject. color-scheme pins form controls and scrollbars too. */
  color-scheme:light;

  /* Ground & surface */
  --ground:#FFFFFF;
  --ground-alt:#FFFFFF;
  --surface:#FFFFFF;
  --surface-sunk:#F6F8FA;

  /* Ink */
  --ink:#0E1F2A;
  --ink-soft:#47606D;
  --ink-faint:#78909D;

  /* Brand: derived from the CA India logo palette
     #145886 blue  ·  #F37920 orange  ·  #55B848 green
     Orange and green are too light for body text on white
     (2.8:1 and 2.5:1), so text-bearing roles use darkened
     variants that clear WCAG AA. The logo itself is never
     recoloured and always sits on white. */
  --ca-blue:#145886;
  --ca-orange:#F37920;
  --ca-green:#55B848;
  --accent:#145886;
  --accent-soft:#1E74AD;
  --signal:#B4551B;
  --signal-soft:#D06A24;

  /* Semantic: assessment bands only */
  --band-1:#B4551B;
  --band-2:#B07C17;
  --band-3:#2F7EA8;
  --band-4:#3C8A2E;

  /* Structure */
  --line:#DCE6EB;
  --line-strong:#BFCED7;
  --focus:#B4551B;

  /* Type */
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --body:"Source Serif 4",Georgia,"Times New Roman",serif;
  --util:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  --display-scale:1;
  --fs-hero:clamp(2.4rem, 1.4rem + 3.6vw, 4.1rem);
  --fs-h1:clamp(2rem, 1.3rem + 2.4vw, 3.1rem);
  --fs-h2:clamp(1.55rem, 1.15rem + 1.5vw, 2.25rem);
  --fs-h3:clamp(1.15rem, 1rem + 0.5vw, 1.4rem);
  --fs-body:1.0625rem;
  --fs-lead:clamp(1.1rem, 1.02rem + 0.35vw, 1.3rem);
  --fs-small:0.9375rem;
  --fs-label:0.75rem;
  --fs-writeup:14px;

  /* Space: 8px base */
  --s1:4px; --s2:8px; --s3:16px; --s4:24px; --s5:32px;
  --s6:48px; --s7:64px; --s8:96px; --s9:128px;

  /* Motion: iOS-style deceleration. Strong ease-out, no bounce,
     the curve UIKit uses for sheet presentation. */
  --ease-ios:cubic-bezier(.32,.72,0,1);
  --ease-out:cubic-bezier(.22,.61,.36,1);

  --radius-sm:2px;
  --radius:4px;
  --maxw:1200px;
  --measure:68ch;
}

*,*::before,*::after{box-sizing:border-box}

/* The hidden attribute must beat any author display rule.
   Without this, .calc{display:grid} overrides the UA default and
   every calculator panel renders at once instead of tabbing. */
[hidden]{display:none !important}

body{
  margin:0;
  background:var(--ground);
  color:var(--ink);
  font-family:var(--body);
  font-size:var(--fs-body);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  font-synthesis-weight:none;
}

h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:400;
  font-optical-sizing:auto;
  color:var(--accent);
  line-height:1.12;
  letter-spacing:-0.015em;
  text-wrap:balance;
  margin:0;
}
p{margin:0}
a{color:var(--signal);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--signal-soft)}
ul,ol{margin:0;padding-left:1.25em}
li{margin-block:var(--s1)}
img{max-width:100%}
button{font:inherit;color:inherit}
hr{border:0;border-top:1px solid var(--line);margin:0}

:focus-visible{
  outline:2px solid var(--focus);
  outline-offset:3px;
  border-radius:var(--radius-sm);
}

/* ---------- Layout ---------- */
.wrap{
  width:100%;
  max-width:var(--maxw);
  margin-inline:auto;
  padding-inline:24px;
}
@media(max-width:600px){.wrap{padding-inline:16px}}

.section{padding-block:var(--s8)}
.section--tight{padding-block:var(--s7)}
@media(max-width:768px){
  .section{padding-block:var(--s7)}
  .section--tight{padding-block:var(--s6)}
}
.section--sunk{background:var(--ground-alt);border-top:1px solid var(--line)}
.section--rule{border-top:1px solid var(--line)}

.stack{display:flex;flex-direction:column}
.stack-2{gap:var(--s2)}.stack-3{gap:var(--s3)}.stack-4{gap:var(--s4)}
.stack-5{gap:var(--s5)}.stack-6{gap:var(--s6)}

.measure{max-width:var(--measure)}

/* ---------- Type utilities ---------- */
.label{
  font-family:var(--util);
  font-size:var(--fs-label);
  font-weight:500;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--ink-faint);
}
.lead{font-size:var(--fs-lead);color:var(--ink-soft);line-height:1.55}
.small{font-size:var(--fs-small)}
.soft{color:var(--ink-soft)}
.faint{color:var(--ink-faint)}
.util{font-family:var(--util)}
.num{font-variant-numeric:tabular-nums}

.h-hero{font-size:calc(var(--fs-hero) * var(--display-scale, 1));font-weight:300}
.h-1{font-size:calc(var(--fs-h1) * var(--display-scale, 1));font-weight:300}
.h-2{font-size:calc(var(--fs-h2) * var(--display-scale, 1));font-weight:400}
.h-3{font-size:calc(var(--fs-h3) * var(--display-scale, 1));font-weight:500}

/* Two-column splits that collapse cleanly */
.split{display:grid;gap:var(--s7)}
.split--about{grid-template-columns:200px minmax(0,1fr)}
.split--contact{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
@media(max-width:860px){
  .split{gap:var(--s6)}
  .split--about,.split--contact{grid-template-columns:1fr}
  .split--about > div:first-child{max-width:200px}
}

/* Placeholder tokens the firm must replace */
.ph{
  border-bottom:1px dotted var(--signal);
  color:inherit;
  font-style:normal;
}

/* ------------------------------------------------------------
   STRICT TYPOGRAPHY MODE: Guideline 3.1.3(I)
   If your CA reads "font size not exceeding 14" as governing the
   whole site rather than only the formal write-up, set
   data-compliance="strict" on the root element. Every display
   size collapses to 14px. Nothing else about the build changes.
   The toggle in the footer build-notes strip previews this.
   ------------------------------------------------------------ */
:root[data-compliance="strict"]{
  --fs-hero:14px; --fs-h1:14px; --fs-h2:14px; --fs-h3:14px;
  --fs-lead:14px; --fs-body:14px; --fs-small:14px;
}
:root[data-compliance="strict"] .h-hero,
:root[data-compliance="strict"] .h-1,
:root[data-compliance="strict"] .h-2,
:root[data-compliance="strict"] .h-3{
  font-weight:600;line-height:1.4;letter-spacing:0;
}
:root[data-compliance="strict"] .wordmark,
:root[data-compliance="strict"] .nav.is-compact .wordmark,
:root[data-compliance="strict"] .wordmark--foot{font-size:14px}
:root[data-compliance="strict"] .wordmark__text span{font-size:11px}
:root[data-compliance="strict"] .result__num{font-size:14px}
:root[data-compliance="strict"] .out__row--total dd{font-size:14px}
:root[data-compliance="strict"] .art h3{font-size:14px}
:root[data-compliance="strict"] .questions li{font-size:14px}
:root[data-compliance="strict"] .hero{padding-block:var(--s6)}

/* Build scaffolding: delete this block and .buildnotes before launch */
.buildnotes{
  margin-top:var(--s5);padding:var(--s3) var(--s4);
  border:1px dashed var(--line-strong);border-radius:var(--radius-sm);
  display:flex;flex-wrap:wrap;gap:var(--s3) var(--s5);align-items:center;
  font-family:var(--util);font-size:0.8125rem;color:var(--ink-faint);
}
.buildnotes__tag{
  font-size:var(--fs-label);font-weight:600;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--signal);
}

/* ---------- Skip link ---------- */
.skip{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--accent);color:var(--ground);
  padding:var(--s2) var(--s3);font-family:var(--util);font-size:var(--fs-small);
}
.skip:focus{left:var(--s3);top:var(--s3)}

/* ---------- Navigation ---------- */
.nav{
  position:sticky;
  top:env(safe-area-inset-top,0px);
  z-index:100;
  background:color-mix(in srgb, var(--ground) 92%, transparent);
  backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid var(--line);
  transition:padding .25s ease;
}
.nav__inner{
  display:flex;align-items:center;gap:var(--s5);
  padding-block:18px;
  transition:padding .25s ease;
}
.nav.is-compact .nav__inner{padding-block:10px}
.wordmark{
  display:flex;align-items:center;gap:11px;
  font-family:var(--display);
  font-size:1.2rem;
  font-weight:500;
  font-optical-sizing:auto;
  letter-spacing:0.01em;
  color:var(--accent);
  text-decoration:none;
  white-space:nowrap;
  transition:font-size .25s ease;
  flex-shrink:0;
}
.nav.is-compact .wordmark{font-size:1.05rem}
.wordmark__text span{font-size:0.72em;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-faint);display:block;font-family:var(--util);font-weight:500;margin-top:2px}
.wordmark--foot{font-size:1.15rem;display:block;margin-bottom:var(--s3)}
.nav.is-compact .wordmark__text span{display:none}

.nav__links{display:flex;gap:var(--s4);margin-left:auto;align-items:center}
.nav__link{
  font-family:var(--util);font-size:var(--fs-small);font-weight:450;
  color:var(--ink-soft);text-decoration:none;padding-block:var(--s1);
  border-bottom:1px solid transparent;white-space:nowrap;
}
.nav__link:hover{color:var(--ink)}
.nav__link[aria-current="page"]{color:var(--accent);border-bottom-color:var(--accent)}

.nav__toggle{display:none;margin-left:auto;background:none;border:1px solid var(--line-strong);border-radius:var(--radius-sm);padding:8px 12px;font-family:var(--util);font-size:var(--fs-small);cursor:pointer}

@media(max-width:940px){
  .nav__links{
    display:none;position:fixed;inset:0;
    background:var(--ground);
    flex-direction:column;align-items:flex-start;justify-content:center;
    gap:var(--s4);padding:var(--s7) 24px;z-index:110;margin-left:0;
  }
  .nav__links.is-open{display:flex}
  .nav__link{font-size:1.5rem;font-family:var(--display);color:var(--accent)}
  .nav__toggle{display:block}
  .nav__toggle.is-open{position:fixed;top:calc(env(safe-area-inset-top,0px) + 18px);right:24px;z-index:120;background:var(--ground)}
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);
  font-family:var(--util);font-size:var(--fs-small);font-weight:500;
  padding:13px 22px;border-radius:var(--radius-sm);
  border:1px solid transparent;cursor:pointer;text-decoration:none;
  transition:background .18s ease,color .18s ease,border-color .18s ease;
  line-height:1.2;
}
.btn--primary{background:var(--accent);color:var(--ground);border-color:var(--accent)}
.btn--primary:hover{background:var(--accent-soft);border-color:var(--accent-soft);color:var(--ground)}
.btn--secondary{background:transparent;color:var(--accent);border-color:var(--line-strong)}
.btn--secondary:hover{border-color:var(--accent);color:var(--accent)}
.btn--ghost{background:transparent;color:var(--signal);border-color:transparent;padding-inline:0}
.btn--ghost:hover{color:var(--signal-soft)}
.btn--sm{padding:9px 16px;font-size:0.875rem}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center}

/* ---------- Panels & cards ---------- */
.panel{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:var(--s5);
}
@media(max-width:600px){.panel{padding:var(--s4)}}
.panel--sunk{background:var(--surface-sunk)}

.grid{display:grid;gap:var(--s4)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}

/* ---------- Hero ---------- */
.hero{padding-block:clamp(var(--s7),10vw,150px) var(--s8)}
.hero__eyebrow{margin-bottom:var(--s4)}
.hero__title{max-width:16ch;margin-bottom:var(--s4)}
.hero__sub{max-width:54ch;margin-bottom:var(--s6)}
.hero__trust{
  margin-top:var(--s6);padding-top:var(--s4);
  border-top:1px solid var(--line);
  font-family:var(--util);font-size:var(--fs-small);color:var(--ink-faint);
  letter-spacing:0.02em;
}

/* ---------- Numbered question list ---------- */
.questions{
  list-style:none;padding:0;margin:0;
  counter-reset:q;
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:0 var(--s7);
}
@media(max-width:820px){.questions{grid-template-columns:1fr;gap:0}}
.questions li{
  counter-increment:q;
  display:grid;grid-template-columns:2.6rem 1fr;
  gap:var(--s3);
  padding-block:var(--s4);
  border-bottom:1px solid var(--line);
  margin:0;
  font-size:1.125rem;
  line-height:1.45;
}
.questions li::before{
  content:counter(q,decimal-leading-zero);
  font-family:var(--util);font-size:var(--fs-label);font-weight:500;
  letter-spacing:0.08em;color:var(--ink-faint);
  padding-top:0.45em;
}

/* ---------- Stage selector ---------- */
.stages{display:flex;flex-wrap:wrap;gap:var(--s2);margin-bottom:var(--s5)}
.stage-tab{
  font-family:var(--util);font-size:var(--fs-small);font-weight:450;
  padding:10px 18px;border:1px solid var(--line-strong);
  background:transparent;color:var(--ink-soft);
  border-radius:var(--radius-sm);cursor:pointer;
  transition:all .18s ease;
}
.stage-tab:hover{border-color:var(--accent);color:var(--ink)}
.stage-tab[aria-selected="true"]{
  background:var(--accent);border-color:var(--accent);color:var(--ground);font-weight:500;
}
.stage-panel__quote{
  font-family:var(--display);font-size:var(--fs-h3);font-weight:300;
  font-optical-sizing:auto;
  color:var(--ink);font-style:italic;
  margin-bottom:var(--s5);max-width:48ch;
}
.pill-list{display:flex;flex-wrap:wrap;gap:var(--s2);list-style:none;padding:0;margin:0}
.pill-list li{
  font-family:var(--util);font-size:var(--fs-small);
  padding:7px 14px;border:1px solid var(--line);border-radius:var(--radius-sm);
  background:var(--surface);color:var(--ink-soft);margin:0;
}
.stage-watch{
  margin-top:var(--s5);padding-top:var(--s4);border-top:1px solid var(--line);
  font-size:var(--fs-small);color:var(--ink-soft);max-width:60ch;
}
.stage-watch strong{font-family:var(--util);font-weight:500;color:var(--ink);font-size:var(--fs-label);letter-spacing:0.08em;text-transform:uppercase;display:block;margin-bottom:var(--s2)}

/* ---------- Accordion (the pull model) ---------- */
.acc{border-top:1px solid var(--line)}
.acc__item{border-bottom:1px solid var(--line)}
.acc__btn{
  width:100%;display:flex;align-items:baseline;gap:var(--s4);
  background:none;border:0;padding:var(--s5) 0;
  text-align:left;cursor:pointer;
}
.acc__btn:hover .acc__title{color:var(--signal)}
.acc__idx{font-family:var(--util);font-size:var(--fs-label);font-weight:500;letter-spacing:0.08em;color:var(--ink-faint);flex-shrink:0;width:2.2rem}
.acc__title{font-family:var(--display);font-size:var(--fs-h3);font-weight:400;color:var(--accent);flex:1;transition:color .18s ease}
.acc__hint{font-family:var(--util);font-size:var(--fs-small);color:var(--ink-faint);flex-shrink:0}
.acc__sign{flex-shrink:0;width:14px;height:14px;position:relative;align-self:center}
.acc__sign::before,.acc__sign::after{
  content:"";position:absolute;background:var(--ink-faint);
  transition:transform .22s ease,opacity .22s ease;
}
.acc__sign::before{left:0;top:6px;width:14px;height:1px}
.acc__sign::after{left:6px;top:0;width:1px;height:14px}
.acc__btn[aria-expanded="true"] .acc__sign::after{transform:rotate(90deg);opacity:0}
.acc__body{padding:0 0 var(--s6) calc(2.2rem + var(--s4))}
@media(max-width:600px){.acc__body{padding-left:0}.acc__btn{gap:var(--s3)}.acc__idx{display:none}}
.acc__body[hidden]{display:none}

.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s2) var(--s6);list-style:none;padding:0;margin:0}
@media(max-width:700px){.svc-grid{grid-template-columns:1fr}}
.svc-grid li{
  padding-block:10px;border-bottom:1px solid var(--line);
  font-size:var(--fs-small);margin:0;color:var(--ink-soft);
}

.scope-note{
  margin-top:var(--s5);padding:var(--s4);
  background:var(--surface-sunk);border-left:2px solid var(--accent);
  font-size:var(--fs-small);color:var(--ink-soft);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
}
.scope-note strong{color:var(--ink);font-family:var(--util);font-weight:600}

/* ---------- Assessment ---------- */
.assess{max-width:780px}
.assess__progress{
  display:flex;align-items:center;gap:var(--s3);
  font-family:var(--util);font-size:var(--fs-label);letter-spacing:0.08em;
  text-transform:uppercase;color:var(--ink-faint);margin-bottom:var(--s5);
}
.assess__bar{flex:1;height:2px;background:var(--line);position:relative}
.assess__bar span{position:absolute;inset:0 auto 0 0;background:var(--accent);transition:width .35s ease}
.assess__q{font-family:var(--display);font-size:var(--fs-h3);font-weight:400;color:var(--ink);margin-bottom:var(--s5);max-width:44ch}
.opts{display:flex;flex-direction:column;gap:var(--s2);border:0;padding:0;margin:0 0 var(--s5)}
.opt{
  display:flex;align-items:flex-start;gap:var(--s3);
  padding:15px 18px;border:1px solid var(--line);border-radius:var(--radius-sm);
  background:var(--surface);cursor:pointer;
  font-size:var(--fs-small);transition:border-color .16s ease,background .16s ease;
}
.opt:hover{border-color:var(--accent-soft)}
.opt input{margin:0;margin-top:0.3em;accent-color:var(--accent);flex-shrink:0}
.opt:has(input:checked){border-color:var(--accent);background:var(--surface-sunk)}

.result__score{
  display:flex;align-items:baseline;gap:var(--s3);margin-bottom:var(--s4);
}
.result__num{font-family:var(--display);font-size:3.6rem;font-weight:300;font-optical-sizing:auto;line-height:1;color:var(--accent);font-variant-numeric:tabular-nums}
.result__band{font-family:var(--util);font-size:var(--fs-small);font-weight:600;letter-spacing:0.04em;text-transform:uppercase}
.dims{display:grid;gap:var(--s4);margin-block:var(--s6)}
.dim{display:grid;grid-template-columns:130px 1fr 44px;gap:var(--s3);align-items:center;font-family:var(--util);font-size:var(--fs-small)}
@media(max-width:560px){.dim{grid-template-columns:100px 1fr 40px}}
.dim__track{height:3px;background:var(--line);position:relative}
.dim__fill{position:absolute;inset:0 auto 0 0;background:var(--accent);transition:width .6s ease}
.dim__val{text-align:right;font-variant-numeric:tabular-nums;color:var(--ink-soft)}

/* ---------- Calculators ---------- */
.calc-tabs{display:flex;flex-wrap:wrap;gap:0;border-bottom:1px solid var(--line);margin-bottom:var(--s6)}
.calc-tab{
  font-family:var(--util);font-size:var(--fs-small);font-weight:450;
  padding:12px 18px;background:none;border:0;border-bottom:2px solid transparent;
  color:var(--ink-soft);cursor:pointer;margin-bottom:-1px;
}
.calc-tab:hover{color:var(--ink)}
.calc-tab[aria-selected="true"]{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}

.calc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:var(--s7);align-items:start}
@media(max-width:900px){.calc{grid-template-columns:1fr;gap:var(--s5)}}

.field{display:flex;flex-direction:column;gap:6px;margin-bottom:var(--s4)}
.field label{font-family:var(--util);font-size:var(--fs-label);font-weight:500;letter-spacing:0.07em;text-transform:uppercase;color:var(--ink-soft)}
.field input,.field select,.field textarea{
  font-family:var(--util);font-size:var(--fs-body);
  padding:11px 13px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);
  background:var(--surface);color:var(--ink);width:100%;
  font-variant-numeric:tabular-nums;
}
.field textarea{font-family:var(--body);min-height:110px;resize:vertical;font-variant-numeric:normal}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent);outline-offset:1px}
.field__hint{font-family:var(--util);font-size:0.8125rem;color:var(--ink-faint)}
.field__err{font-family:var(--util);font-size:0.8125rem;color:var(--signal);display:none}
.field.is-error input,.field.is-error select{border-color:var(--signal)}
.field.is-error .field__err{display:block}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
@media(max-width:560px){.field-row{grid-template-columns:1fr}}

.seg{display:flex;gap:0;border:1px solid var(--line-strong);border-radius:var(--radius-sm);overflow:hidden}
.seg button{
  flex:1;padding:10px;background:var(--surface);border:0;cursor:pointer;
  font-family:var(--util);font-size:var(--fs-small);color:var(--ink-soft);
}
.seg button + button{border-left:1px solid var(--line-strong)}
.seg button[aria-pressed="true"]{background:var(--accent);color:var(--ground);font-weight:500}

.out{background:var(--surface-sunk);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s5);position:sticky;top:110px}
@media(max-width:900px){.out{position:static}}
.out__row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s3);padding-block:11px;border-bottom:1px solid var(--line);font-family:var(--util);font-size:var(--fs-small)}
.out__row:last-of-type{border-bottom:0}
.out__row dt{color:var(--ink-soft)}
.out__row dd{margin:0;font-variant-numeric:tabular-nums;font-weight:500;color:var(--ink);text-align:right}
.out__row--total{border-top:1px solid var(--line-strong);border-bottom:0;padding-top:var(--s4);margin-top:var(--s2)}
.out__row--total dt{color:var(--ink);font-weight:600}
.out__row--total dd{font-family:var(--display);font-size:1.7rem;font-weight:400;font-optical-sizing:auto;color:var(--accent);line-height:1.1}
.out dl{margin:0}

/* ---------- Links table ---------- */
.linkset{border-top:1px solid var(--line)}
.linkrow{
  display:flex;align-items:baseline;gap:var(--s3);
  padding-block:14px;border-bottom:1px solid var(--line);
  text-decoration:none;color:var(--ink);
}
.linkrow:hover .linkrow__name{color:var(--signal)}
.linkrow__name{font-family:var(--util);font-size:var(--fs-small);font-weight:450;flex:1;transition:color .16s ease}
.linkrow__host{font-family:var(--util);font-size:0.8125rem;color:var(--ink-faint);font-variant-numeric:tabular-nums}
.linkrow__ext{flex-shrink:0;width:11px;height:11px;stroke:var(--ink-faint);fill:none;stroke-width:1.5}
.linkrow:hover .linkrow__ext{stroke:var(--signal)}

/* ---------- Disclaimers ---------- */
.note{
  font-family:var(--util);font-size:0.8125rem;line-height:1.55;
  color:var(--ink-faint);
}
.note--inline{margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid var(--line)}
.note--panel{
  background:var(--surface-sunk);border:1px solid var(--line);
  border-radius:var(--radius);padding:var(--s4);color:var(--ink-soft);
}

/* ---------- Method list ---------- */
.method{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s5) var(--s7)}
@media(max-width:768px){.method{grid-template-columns:1fr}}
.method li{margin:0;padding-top:var(--s4);border-top:1px solid var(--line-strong)}
.method h3{margin-bottom:var(--s2)}
.method p{font-size:var(--fs-small);color:var(--ink-soft)}

/* ---------- Article cards ---------- */
.art{display:block;text-decoration:none;color:inherit;padding-top:var(--s4);border-top:1px solid var(--line-strong)}
.art:hover h3{color:var(--signal)}
.art h3{font-size:1.15rem;margin-block:var(--s2);transition:color .16s ease}
.art__meta{font-family:var(--util);font-size:var(--fs-label);letter-spacing:0.07em;text-transform:uppercase;color:var(--ink-faint)}
.art p{font-size:var(--fs-small);color:var(--ink-soft)}

/* ---------- Conversation flow ---------- */
.concern-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2);margin-bottom:var(--s5)}
@media(max-width:768px){.concern-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){.concern-grid{grid-template-columns:1fr}}
.concern{
  padding:16px;border:1px solid var(--line);background:var(--surface);
  border-radius:var(--radius-sm);cursor:pointer;text-align:left;
  font-family:var(--util);font-size:var(--fs-small);color:var(--ink);
  transition:border-color .16s ease,background .16s ease;
}
.concern:hover{border-color:var(--accent-soft)}
.concern[aria-pressed="true"]{border-color:var(--accent);background:var(--surface-sunk);font-weight:500}

/* ---------- Footer ---------- */
.foot{background:var(--ground-alt);border-top:1px solid var(--line);padding-block:var(--s7) var(--s6)}
.foot__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:var(--s6) var(--s5)}
@media(max-width:900px){.foot__grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.foot__grid{grid-template-columns:1fr}}
.foot h4{font-family:var(--util);font-size:var(--fs-label);font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:var(--s3)}
.foot ul{list-style:none;padding:0;margin:0}
.foot li{margin-block:9px}
.foot a{font-family:var(--util);font-size:var(--fs-small);color:var(--ink-soft);text-decoration:none}
.foot a:hover{color:var(--signal)}

/* The statutory write-up block, capped at 14px per Guideline 3.1.3(I) */
.writeup{
  font-family:var(--util);
  font-size:var(--fs-writeup);
  line-height:1.6;
  color:var(--ink-soft);
  max-width:46ch;
}
.writeup dt{font-size:var(--fs-label);letter-spacing:0.08em;text-transform:uppercase;color:var(--ink-faint);margin-top:12px}
.writeup dd{margin:0;color:var(--ink)}
.writeup dl{margin:var(--s3) 0 0}

.foot__base{
  margin-top:var(--s6);padding-top:var(--s4);border-top:1px solid var(--line-strong);
  display:flex;flex-wrap:wrap;gap:var(--s3) var(--s5);align-items:baseline;
  font-family:var(--util);font-size:0.8125rem;color:var(--ink-faint);
}
.foot__base a{font-size:0.8125rem}

/* ---------- Pages ---------- */
.page[hidden]{display:none}

/* ---------- Setup legend ---------- */
.legend{
  display:inline-flex;align-items:center;gap:var(--s2);
  font-family:var(--util);font-size:0.8125rem;color:var(--ink-faint);
}
.legend i{width:20px;border-bottom:1px dotted var(--signal);display:inline-block;height:1px}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
  html{scroll-behavior:auto}
}
html{scroll-behavior:smooth}
/* ---------- Article prose ---------- */
.prose{font-size:1.09rem;line-height:1.72}
.prose > p{margin-block:var(--s4)}
.prose h2{font-size:calc(1.5rem * var(--display-scale,1));font-weight:400;margin-block:var(--s6) var(--s3)}
.prose h3{font-size:calc(1.12rem * var(--display-scale,1));font-weight:600;margin-block:var(--s5) var(--s2);color:var(--ink)}
.prose ul,.prose ol{margin-block:var(--s4);padding-left:1.35em}
.prose li{margin-block:var(--s2)}
.prose strong{font-weight:600;color:var(--ink)}
.prose .lead{margin-bottom:var(--s5)}
.prose .note--panel{margin-block:var(--s5)}
:root[data-compliance="strict"] .prose{font-size:14px}
:root[data-compliance="strict"] .prose h2,
:root[data-compliance="strict"] .prose h3{font-size:14px}

.artnav{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);
  margin-top:var(--s7);padding-top:var(--s5);border-top:1px solid var(--line);
}
@media(max-width:600px){.artnav{grid-template-columns:1fr}.artnav a:last-child{text-align:left !important}}
.artnav a{text-decoration:none;color:var(--accent);font-family:var(--display);font-size:1.02rem;line-height:1.35}
.artnav a:hover{color:var(--signal)}
.artnav .label{display:block;margin-bottom:6px}

/* ---------- Industry sectors ---------- */
.sectors{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--s4) var(--s7);max-width:900px;margin-top:var(--s4);
}
@media(max-width:700px){.sectors{grid-template-columns:1fr;gap:var(--s4)}}
.sector{padding-top:var(--s3);border-top:1px solid var(--line-strong)}
.sector h3{
  font-family:var(--util);font-size:var(--fs-small);font-weight:600;
  color:var(--ink);margin-bottom:6px;letter-spacing:0.01em;
}
.sector p{font-size:var(--fs-small);color:var(--ink-soft);line-height:1.55}
:root[data-compliance="strict"] .sector h3,
:root[data-compliance="strict"] .sector p{font-size:14px}


/* ---------- CA India logo lockup ----------
   Guideline: the mark is never recoloured, rotated, cropped or
   distorted, and its white background is part of the mark. On a
   dark ground it therefore sits on a white plate. */
.wordmark__logo{
  flex-shrink:0;height:38px;width:auto;display:block;
  background:#FFFFFF;border-radius:3px;padding:3px 4px;
  transition:height .25s ease;
}
.nav.is-compact .wordmark__logo{height:32px}
.wordmark__text{display:block;line-height:1.15}
.wordmark__rule{
  flex-shrink:0;width:1px;align-self:stretch;
  background:var(--line-strong);margin-block:3px;
}
.wordmark--foot{display:flex;align-items:center;gap:11px}
.wordmark--foot .wordmark__logo{height:34px}
:root[data-compliance="strict"] .wordmark__logo{height:22px}
@media(max-width:420px){
  .wordmark__logo{height:32px}
  .wordmark{gap:8px;font-size:1.02rem}
}

/* ---------- Figures ----------
   Original drawn figures. Text uses ink tokens, never the series colour;
   the coloured mark beside a label carries the identity. */
.fig{margin:0;max-width:600px}
.fig__cap{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:6px var(--s4);
  margin-bottom:var(--s3);
}
.fig__title{
  font-family:var(--util);font-size:var(--fs-label);font-weight:600;
  letter-spacing:0.09em;text-transform:uppercase;color:var(--ink-soft);
}
.fig__legend{display:flex;flex-wrap:wrap;gap:var(--s3);margin-left:auto}
.fig__key{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--util);font-size:0.8125rem;color:var(--ink-soft);
}
.fig__key i{width:10px;height:10px;border-radius:2px;flex-shrink:0}
.fig__svg{display:block;width:100%;height:auto;overflow:visible}
.fig__tick{font-family:var(--util);font-size:11px;fill:var(--ink-faint)}
.fig__unit{font-family:var(--util);font-size:10px;fill:var(--ink-faint);letter-spacing:0.06em;text-transform:uppercase}
.fig__label{font-family:var(--util);font-size:12px;font-weight:600}
.fig__rowlab{font-family:var(--util);font-size:12px;fill:var(--ink-soft)}
.fig__rowlab--strong{fill:var(--ink);font-weight:600}
.fig__inbar{font-family:var(--util);font-size:11px;font-weight:500;fill:#FFFFFF}
.fig__note{
  margin-top:var(--s3);font-family:var(--util);font-size:0.8125rem;
  line-height:1.5;color:var(--ink-faint);max-width:52ch;
}
@media(max-width:600px){
  .fig__legend{margin-left:0;width:100%}
  .fig__title{font-size:11px}
}

/* Hero split: copy left, figure right */
.hero--split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);gap:var(--s7);align-items:center}
@media(max-width:980px){
  .hero--split{grid-template-columns:1fr;gap:var(--s6)}
  .hero--split .fig{max-width:560px}
}

/* ---------- Figures: additions ---------- */
.fig--wheel{max-width:400px;margin-inline:auto}
.fig__centre{font-family:var(--display);font-size:30px;font-weight:400;fill:var(--accent)}
.fig__centreSub{font-family:var(--util);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;fill:var(--ink-faint)}
.fig__keys{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);margin-top:var(--s4)}
.fig__lead{font-family:var(--util);font-size:13px;font-weight:600}
.fig__small{font-family:var(--util);font-size:12px;fill:var(--ink-soft)}

.assess-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:var(--s7);align-items:start}
@media(max-width:1020px){.assess-split{grid-template-columns:1fr;gap:var(--s6)}}

/* ============================================================
   MOTION
   Everything is visible at rest. JS adds .js-reveal to <html>,
   which is the only thing that arms the entrance states, so a
   reader without JS (and every crawler) sees the finished page.
   All of it collapses under prefers-reduced-motion.
   ============================================================ */

/* Cross-document view transitions: smooth page-to-page navigation,
   no JavaScript, ignored by browsers that do not support it. */
@view-transition{navigation:auto}

::view-transition-old(root){animation:vt-out .26s var(--ease-out) both}
::view-transition-new(root){animation:vt-in .46s var(--ease-ios) both}
@keyframes vt-out{to{opacity:0;transform:scale(.992)}}
@keyframes vt-in{from{opacity:0;transform:translateY(14px) scale(.994)}}

/* The masthead stays put across navigations instead of cross-fading */
.nav{view-transition-name:masthead}
.foot{view-transition-name:footer}

/* Scroll reveals */
html.js-reveal [data-reveal]{
  opacity:0;
  transform:translateY(22px) scale(.985);
  transition:opacity .72s var(--ease-ios), transform .82s var(--ease-ios);
  transition-delay:var(--reveal-delay,0ms);
  will-change:opacity, transform;
}
html.js-reveal [data-reveal].is-in{opacity:1;transform:translateY(0) scale(1)}

/* First screen settles on load rather than waiting for a scroll */
html.js-reveal .hero [data-reveal]{transform:translateY(16px) scale(.99)}

/* Micro-interactions */
.btn{transition:background .22s var(--ease-out),color .22s var(--ease-out),border-color .22s var(--ease-out),transform .34s var(--ease-ios)}
.btn:active{transform:scale(.967)}
.art,.sector,.linkrow,.opt,.concern,.stage-tab{transition:
  color .24s var(--ease-out), border-color .24s var(--ease-out),
  background .24s var(--ease-out), transform .42s var(--ease-ios)}
.opt:active,.concern:active,.stage-tab:active{transform:scale(.985)}
.art:hover{transform:translateY(-3px)}
.nav__link{transition:color .2s ease,border-color .2s ease}
.acc__btn{transition:background .2s ease}
.acc__body{animation:acc-open .46s var(--ease-ios) both}
@keyframes acc-open{from{opacity:0;transform:translateY(-10px) scale(.99)}}
.calc[aria-labelledby]{animation:panel-in .44s var(--ease-ios) both}
@keyframes panel-in{from{opacity:0;transform:translateY(12px) scale(.992)}}

@media (prefers-reduced-motion:reduce){
  html.js-reveal [data-reveal]{opacity:1 !important;transform:none !important;transition:none !important}
  .acc__body,.calc[aria-labelledby]{animation:none !important}
  ::view-transition-old(root),::view-transition-new(root){animation:none !important}
  .art:hover,.btn:active{transform:none}
}


/* ---------- Monthly report figure ---------- */
.fig--report{max-width:500px}
.fig--report .fig__svg{
  filter:drop-shadow(0 1px 2px rgba(14,31,42,.05)) drop-shadow(0 12px 28px rgba(14,31,42,.08));
}
.fig__docTitle{font-family:var(--display);font-size:17px;font-weight:500;fill:var(--accent)}
.fig__docMeta{font-family:var(--util);font-size:11px;fill:var(--ink-faint)}
.fig__secLab{font-family:var(--util);font-size:10px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;fill:var(--ink-faint)}
.fig__tileLab{font-family:var(--util);font-size:10px;font-weight:500;letter-spacing:.07em;text-transform:uppercase;fill:var(--ink-faint)}
.fig__tileVal{font-family:var(--util);font-size:19px;font-weight:600;fill:var(--ink);font-variant-numeric:tabular-nums}
.fig__tileDelta{font-family:var(--util);font-size:10px;font-weight:600}

/* ---------- Category marks ---------- */
.icon{width:32px;height:32px;display:block;color:var(--accent);flex-shrink:0}
.icon--card{width:30px;height:30px;color:var(--accent);opacity:.9;margin-top:3px}
.icon--lg{width:40px;height:40px;margin-top:6px}

.art--card{display:grid;grid-template-columns:30px minmax(0,1fr);gap:var(--s3)}
.art--card h3{margin-block:var(--s2)}
.art--card .icon{transition:transform .42s var(--ease-ios),color .24s var(--ease-out)}
.art--card:hover .icon{transform:translateY(-2px) scale(1.06);color:var(--signal)}

.art__head{display:flex;align-items:flex-start;gap:var(--s3);margin-bottom:var(--s4)}
.art__head h1{margin:0}
.art__fig{margin-block:var(--s6)}

/* ---------- compare / steps / flow figures ---------- */
.fig__colTitle{font-family:var(--util);font-size:13px;font-weight:600;fill:var(--ink)}
.fig__colItem{font-family:var(--util);font-size:12px;fill:var(--ink-soft)}
.fig__stepNum{font-family:var(--util);font-size:11px;font-weight:700;fill:var(--accent)}