/* thevijai.com · page stylesheet for /mock-drill-requirement-india-msihc-rules · row 27.
   PULSEAI L1. Load order: vijai-chrome.css -> vijai-base.css -> this file.

   PALETTE TOKENS ONLY. The single hex literal is #fff, on bold inside body copy, which
   is the same exemption every approved page carries. No green anywhere · the brand
   signal set is amber and red. IBM Plex Mono and DM Sans only, no third typeface.
   Every fixed multi-column rule carries a narrow query · CR-29.

   .cbody, .cbody h2, .cbody p, .lead2 and .note ARE DEFINED HERE ON PURPOSE. They are
   NOT in vijai-base.css · base carries only ".cbody .ctarow". Every approved page
   stylesheet declares them itself (vijai-capa, vijai-drill, vijai-schedm, vijai-dgms).
   vijai-muster.css omits them, which is a measured defect on sealed row 28 and is
   reported with this build. Do not drop this block on the assumption base has it. */

/* ── the reading column ──────────────────────────────────────────────────── */
.cbody{max-width:920px}
.cbody h2{font-size:clamp(24px,3.1vw,36px);margin:64px 0 16px;max-width:24ch}
.cbody h2:first-of-type{margin-top:0}
.cbody p{font-size:16px;line-height:1.72;color:var(--dtx2);margin:0 0 16px;max-width:70ch}
.cbody p b{color:#fff;font-weight:600}
.lead2{font-size:17.5px;color:var(--dtx);font-weight:500;letter-spacing:-.008em}
.note{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.03em;color:var(--dtx3);
  border-left:2px solid var(--line);padding-left:16px;line-height:1.75;max-width:66ch}

/* ── the head-term deck line under the H1 ────────────────────────────────── */
.dsub{font:600 13px/1.6 "IBM Plex Mono",monospace;letter-spacing:.04em;
  color:var(--cy);margin:0 0 18px}

/* ── THE CORRECTABLE ERROR · the signature block of this page ─────────────
   Two panels. Left is what the market is being told, outlined in amber because
   amber is the brand's caution signal. Right is what binds, outlined in cyan.
   No red: red is reserved for a failure state and a repealed statute is not one. */
.dlaw{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:28px 0}
.dlawc{padding:19px 21px;border:1px solid var(--line);border-radius:4px;background:var(--ink2)}
.dlawc.is-stale{border-color:var(--amb);background:rgba(240,165,0,.05)}
.dlawc.is-live{border-color:var(--cy);background:rgba(0,185,242,.06)}
.dlawc .t{display:block;font:600 10.5px/1.5 "IBM Plex Mono",monospace;letter-spacing:.16em;
  text-transform:uppercase;margin-bottom:9px;color:var(--dtx3)}
.dlawc.is-stale .t{color:var(--amb)}
.dlawc.is-live .t{color:var(--cy)}
.dlawc b{display:block;color:#fff;font-size:17.5px;line-height:1.35;font-weight:600;
  letter-spacing:-.012em;margin-bottom:9px}
.dlawc p{margin:0;color:var(--dtx2);font-size:14.5px;line-height:1.62;max-width:none}
@media(max-width:760px){.dlaw{grid-template-columns:minmax(0,1fr)}}

/* ── the statutory chain · rule by rule ──────────────────────────────────── */
.drule{margin:26px 0;border:1px solid var(--line);border-radius:4px;overflow:hidden}
.drulei{display:grid;grid-template-columns:168px minmax(0,1fr);gap:0 20px;
  padding:17px 21px;border-top:1px solid var(--line);align-items:start}
.drulei:first-child{border-top:0;background:var(--ink2)}
.drulei .r{font:600 11.5px/1.65 "IBM Plex Mono",monospace;letter-spacing:.1em;
  text-transform:uppercase;color:var(--cy)}
.drulei p{margin:0;color:var(--dtx2);font-size:14.5px;line-height:1.62;max-width:none}
.drulei p b{color:#fff}
@media(max-width:680px){
  .drulei{grid-template-columns:minmax(0,1fr);gap:7px 0}
  .drulei .r{letter-spacing:.14em}}

/* ── the measured line · our own number, labelled as ours ────────────────── */
.dmeas{margin:30px 0;padding:22px 24px;border-left:3px solid var(--cy);
  background:rgba(0,185,242,.05)}
.dmeas b{display:block;font-size:clamp(19px,2.4vw,25px);line-height:1.25;
  color:var(--dtx);font-weight:700}
.dmeas b+b{margin-top:6px;color:var(--cy)}
.dmeas .src{display:block;margin-top:12px;font:400 12.5px/1.6 "IBM Plex Mono",monospace;
  color:var(--dtx3)}
/* a bold INSIDE the source line is an emphasis, not a second headline. Without this it
   inherits .dmeas b and renders at clamp(19px,2.4vw,25px) in the middle of 12.5px mono,
   which is what the preview showed on the first pass. */
.dmeas .src b{display:inline;font-size:inherit;line-height:inherit;font-weight:700;
  color:var(--dtx)}
.dmeas .src i{font-style:italic;color:var(--dtx2)}

/* ── THE MID-PAGE OFFER BAND ─────────────────────────────────────────────────
   Not a .ctarow · see the note in the page source. The T3 structure gate indexes
   CTA 3 and CTA 4 by document order, so a sixth ctarow would shift them. This does
   the commercial job with an anchor into the enquiry block instead.
   Cyan border, because this is the one block on the page that is an offer. */
.doffer{margin:30px 0;padding:22px 24px;border:1px solid var(--cy);border-radius:4px;
  background:rgba(0,185,242,.06);max-width:70ch}
.doffer .t{display:block;font:600 10.5px/1.5 "IBM Plex Mono",monospace;letter-spacing:.18em;
  text-transform:uppercase;color:var(--cy);margin-bottom:10px}
.doffer b{display:block;color:#fff;font-size:clamp(17px,2.1vw,21px);line-height:1.3;
  font-weight:700;letter-spacing:-.012em;margin-bottom:10px}
.doffer p{margin:0;color:var(--dtx2);font-size:15px;line-height:1.62;max-width:none}
.doffer p b{display:inline;font-size:inherit;line-height:inherit;margin:0;color:#fff}
.olink{display:inline-block;margin-top:14px;font:600 14px/1 "DM Sans",system-ui,sans-serif;
  color:var(--cy);text-decoration:none;border-bottom:1px solid var(--cyd);padding-bottom:3px}
.olink:hover{color:#fff;border-bottom-color:var(--cy)}
@media(max-width:640px){.doffer{padding:18px}}

/* ── the state table · five directorates ─────────────────────────────────── */
.tw{overflow-x:auto;border:1px solid var(--line);background:rgba(255,255,255,.02);
  margin:0 0 22px;border-radius:14px}
table.cmp{border-collapse:collapse;width:100%;min-width:660px;font-size:14.5px;table-layout:fixed}
table.cmp th{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--dtx3);font-weight:600;text-align:left;
  padding:15px 18px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.03)}
table.cmp td{padding:17px 18px;border-bottom:1px solid var(--line);vertical-align:top;
  color:var(--dtx2);line-height:1.55}
table.cmp tr:last-child td{border-bottom:0}
table.cmp td b{color:#fff}
table.cmp td:first-child,table.cmp th:first-child{width:24%;min-width:150px}

/* ── the interval callout · the one number the page is built to land ─────── */
.closeline{border:1px solid var(--cyd);border-radius:14px;padding:22px 24px;margin:0 0 22px;
  background:rgba(0,185,242,.06);max-width:70ch}
.closeline b{display:block;color:var(--cy);font-family:"IBM Plex Mono",monospace;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px;font-weight:600}
.closeline span{display:block;color:#fff;font-size:19px;line-height:1.45;font-weight:600;
  letter-spacing:-.012em}
.closeline i{display:block;font-style:normal;color:var(--dtx2);font-size:15px;
  line-height:1.6;margin-top:10px}

/* ── the ladder carries FOUR cards on this page, not three ───────────────────
   The locked template's .ladder is a hard repeat(3,...), which leaves the fourth
   card alone on a second row with two empty tracks beside it. Overridden HERE, in
   the page stylesheet, so the locked t3 file is not touched: four across when there
   is room, two-by-two in the middle band, one column on a phone.
   This page needs four because the L2 card is in by the CEO's ruling on D1. */
.ladder{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1180px){.ladder{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.ladder{grid-template-columns:minmax(0,1fr)}}

/* THE GO LINK IN A LADDER CARD HAS NEVER BEEN STYLED. The locked t3 stylesheet
   defines .lcard .lay, .lcard b and .lcard p, and nothing for .go · .go exists only
   as ".rc .go" in the base file, which is the HOMEPAGE resource card. A .go span
   inside an unstyled <a> therefore falls back to the browser's default link blue,
   and blue is not in the brand set. It is rendering that way right now on rows 19,
   21 and 28. Fixed here for this page only; the estate fix is one line in the
   locked t3 file and needs a CR. */
.lcard .go{display:inline-block;margin-top:10px;font-size:14px;font-weight:600;color:var(--cy)}
.lcard:hover .go{color:#fff}
/* and the anchor itself: the locked rule sets no colour, so .lcard computes to the
   browser default rgb(0,0,238). Every child overrides it today, which is why nobody
   saw it · but one unwrapped word in a future card would render blue. Closed. */
.lcard{color:var(--dtx2)}

/* ── CR-13 · the five CTA positions, one button per row ──────────────────── */
.ctarow{margin:30px 0 4px}
.cbody .ctarow{margin:34px 0 10px}

@media(max-width:640px){
  .cbody h2{margin-top:46px}
  .closeline{padding:18px}
  .closeline span{font-size:17px}
  .dlawc{padding:16px 18px}
  .dlawc b{font-size:16px}}

/* ── 02b IS IN ON THIS PAGE · CEO ruling 2 October 2026 ──────────────────────
   The hero is a normal two-column T3 hero and the PulseAI muster engine fills the
   stage. The .t3solo single-column override that was here is DELETED, not left as
   dead code: this page carries the module animation like every other PulseAI page.
   The deck line is the one hero element the locked grid does not already size. */
.t3hero .dsub{max-width:46ch}
