/* ================================================================
   KANUN ADVISORY — "COUNSEL" DESIGN SYSTEM
   Editorial memorandum aesthetic. Typography-led. No cards, no
   pills, no shadows, no radius. Hairline ledger rules, mono meta,
   oversized optical-serif display, single bronze accent.
   ================================================================ */
:root{
  --ink:#051C2C;
  --ink-soft:#33404E;
  --paper:#FFFFFF;
  --paper-deep:#F0F2F5;
  --bronze:#2251FF;
  --accent-ondark:#9FB4FF;
  --grey:#5A6470;
  --rule:#D9DCE1;
  --rule-dark:#1E3346;

  --serif:'Besley', 'Clarendon', Georgia, serif;
  --serif-text:'Newsreader', 'Times New Roman', Georgia, serif;
  --sans:'Helvetica Neue', Helvetica, Arial, sans-serif;
  --mono:'Helvetica Neue', Helvetica, Arial, sans-serif;

  --gutter:clamp(1.25rem, 4vw, 4rem);
  --max:1440px;
}
*{margin:0;padding:0;box-sizing:border-box;}
::selection{background:var(--ink);color:var(--paper);}
html{scroll-behavior:smooth;}
body{
  font-family:var(--sans);
  background:var(--paper);
  color:var(--ink);
  font-size:1rem;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  position:relative;
}
.shell{max-width:var(--max);margin:0 auto;padding:0 var(--gutter);}

.mono{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);}
.mono .b{color:var(--bronze);}

a{color:inherit;}
.tlink{
  font-family:var(--mono);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;
  text-decoration:none;color:var(--ink);
  border-bottom:1px solid var(--ink);padding-bottom:.35em;
  transition:color .2s, border-color .2s;
}
.tlink:hover{color:var(--bronze);border-color:var(--bronze);}
.tlink .arr{display:inline-block;transition:transform .25s ease;margin-left:.5em;}
.tlink:hover .arr{transform:translateX(.35em);}

/* ---------------- top bar ---------------- */
.top{
  display:flex;align-items:baseline;justify-content:space-between;
  padding:1.4rem var(--gutter);
  border-bottom:1px solid var(--rule);
  max-width:var(--max);margin:0 auto;
}
.wordmark{font-family:var(--serif);font-size:1.05rem;font-weight:500;letter-spacing:.01em;text-decoration:none;}
.wordmark sup{font-family:var(--mono);font-size:.55rem;color:var(--bronze);margin-left:.4em;letter-spacing:.1em;}
.top-index{display:flex;gap:2.5rem;}
.top-index a{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--ink-soft);}
.top-index a i{font-style:normal;color:var(--bronze);margin-right:.6em;}
.top-index a:hover, .top-index a[aria-current]{color:var(--ink);}

/* ---------------- hero ---------------- */
.hero{padding:clamp(4rem,9vh,7.5rem) 0 0;}
.hero-meta{
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;
  padding-bottom:2.2rem;
}
h1{
  font-family:var(--serif);
  font-optical-sizing:auto;
  font-weight:300;
  font-size:clamp(2.7rem, 7.4vw, 6.6rem);
  line-height:.98;
  letter-spacing:-0.022em;
  text-wrap:balance;
  max-width:14ch;
}
h1 em{font-style:italic;font-weight:300;color:var(--bronze);}
.hero-foot{
  display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);
  gap:var(--gutter);align-items:end;
  padding:3.2rem 0 4.2rem;
}
.hero-foot .lede{
  font-family:var(--serif-text);font-weight:400;font-size:clamp(1.05rem,1.5vw,1.3rem);
  line-height:1.55;color:var(--ink-soft);max-width:44ch;
}
.hero-foot .cta-block{justify-self:end;text-align:right;}
.hero-foot .cta-block .note{font-family:var(--mono);font-size:.7rem;color:var(--grey);margin-top:1em;letter-spacing:.05em;}

/* ledger strip */
.ledger{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);}
.ledger-grid{display:grid;grid-template-columns:repeat(4,1fr);max-width:var(--max);margin:0 auto;}
.ledger-cell{padding:1.5rem var(--gutter) 1.6rem;border-left:1px solid var(--rule);}
.ledger-cell:first-child{border-left:none;}
.ledger-cell .k{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);display:block;margin-bottom:.55em;}
.ledger-cell .v{font-family:var(--serif-text);font-size:1.02rem;font-weight:400;line-height:1.35;}

/* ---------------- section heads ---------------- */
.sec-head{display:flex;align-items:baseline;gap:1.5rem;margin-bottom:3.5rem;}
.sec-num{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;color:var(--bronze);}
.sec-rule{flex:1;height:1px;background:var(--rule);}
.sec-label{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:inherit;opacity:.65;}

/* ---------------- dark dossier section ---------------- */
.dark{background:var(--ink);color:var(--paper);position:relative;padding:clamp(5rem,11vh,8.5rem) 0;}
.dark .shell{position:relative;}
.dark::before{
  content:"";position:absolute;inset:0;
  background-image:repeating-linear-gradient(90deg, transparent 0, transparent calc(25% - 1px), rgba(255,255,255,.05) calc(25% - 1px), rgba(255,255,255,.05) 25%);
}
.dark .sec-rule{background:rgba(255,255,255,.15);}
.dossier{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:calc(var(--gutter)*1.5);}
.dossier h2{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(1.9rem,3.6vw,3.3rem);
  line-height:1.12;letter-spacing:-0.015em;text-wrap:balance;
}
.dossier h2 em{font-style:italic;color:var(--accent-ondark);}
.dossier .body{margin-top:2.2rem;color:#B3BDC7;font-size:.95rem;max-width:56ch;}
.dossier .body p+p{margin-top:1.2em;}
.facts{border-left:1px solid rgba(255,255,255,.15);padding-left:calc(var(--gutter)*.75);align-self:start;}
.fact{padding:1.4rem 0;border-bottom:1px solid rgba(255,255,255,.12);}
.fact:first-child{padding-top:.2rem;}
.fact .n{font-family:var(--serif);font-weight:300;font-size:2.6rem;line-height:1;letter-spacing:-.02em;}
.fact .n span{color:var(--accent-ondark);}
.fact .d{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:#8C99A6;margin-top:.7em;line-height:1.7;}
.dark .pull{
  margin-top:3.5rem;max-width:30ch;
  font-family:var(--serif);font-style:italic;font-weight:300;
  font-size:clamp(1.35rem,2.4vw,2rem);line-height:1.35;letter-spacing:-.01em;
}
.dark .pull::before{content:"\201C";color:var(--bronze);}
.dark .pull::after{content:"\201D";color:var(--bronze);}

/* ---------------- services index ---------------- */
.services{padding:clamp(5rem,11vh,8rem) 0 0;}
.svc-list{border-top:1px solid var(--ink);}
.svc{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,4fr) minmax(0,5fr) minmax(0,2.2fr);
  gap:var(--gutter);align-items:baseline;
  padding:2.6rem 0 2.8rem;
  border-bottom:1px solid var(--rule);
  text-decoration:none;color:var(--ink);
  transition:background .25s ease;
  position:relative;
}
.svc:hover{background:var(--paper-deep);}
.svc-no{font-family:var(--mono);font-size:.78rem;color:var(--bronze);letter-spacing:.08em;}
.svc-name{font-family:var(--serif);font-weight:400;font-size:clamp(1.4rem,2.4vw,2.1rem);line-height:1.15;letter-spacing:-.01em;}
.svc-desc{font-size:.92rem;color:var(--ink-soft);max-width:48ch;line-height:1.65;}
.svc-terms{justify-self:end;text-align:right;}
.svc-terms .t1{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;display:block;}
.svc-terms .t2{font-family:var(--mono);font-size:.68rem;color:var(--grey);margin-top:.5em;letter-spacing:.06em;display:block;}
.svc .go{
  position:absolute;right:0;top:2.4rem;
  font-family:var(--serif);font-size:1.3rem;opacity:0;transform:translateX(-8px);
  transition:opacity .25s, transform .25s;
}
.svc:hover .go{opacity:1;transform:none;}

/* ---------------- principal ---------------- */
.principal{padding:clamp(5rem,11vh,8.5rem) 0;}
.pr-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,1fr) minmax(0,6fr);gap:var(--gutter);}
.portrait{
  aspect-ratio:3/4;
  background:linear-gradient(15deg, #0A2438 0%, #123049 55%, #1B3D5C 100%);
  position:relative;
}
.portrait img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(20%);}
.portrait::after{
  content:"PORTRAIT — M. KANAVENTI";
  position:absolute;left:1.1rem;bottom:1rem;
  font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;color:#7A8794;
}
.pr-copy h2{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(2rem,3.8vw,3.4rem);line-height:1.08;letter-spacing:-.018em;
  max-width:16ch;text-wrap:balance;
}
.pr-copy h2 em{font-style:italic;color:var(--bronze);}
.pr-copy .body{margin-top:2.2rem;max-width:52ch;}
.pr-copy .body p{font-family:var(--serif-text);font-size:1.05rem;line-height:1.7;color:var(--ink-soft);font-weight:400;}
.pr-copy .body p+p{margin-top:1.2em;}
.pr-copy .body p b{color:var(--ink);font-weight:500;}
.chronology{margin-top:2.8rem;border-top:1px solid var(--ink);}
.chrono-row{
  display:grid;grid-template-columns:7rem 1fr;gap:1.5rem;
  padding:.85rem 0;border-bottom:1px solid var(--rule);
  font-size:.85rem;
}
.chrono-row .yr{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;color:var(--grey);padding-top:.2em;}
.chrono-row .role b{font-weight:500;}
.chrono-row .role span{color:var(--grey);}

/* ---------------- interior pages ---------------- */
.page-head{padding:clamp(3.5rem,7vh,6rem) 0 0;}
.page-head .crumb{margin-bottom:2rem;display:block;}
.page-head h1{font-size:clamp(2.6rem,6vw,5.4rem);max-width:16ch;}
.page-head .standfirst{
  font-family:var(--serif);font-size:clamp(1.05rem,1.5vw,1.3rem);line-height:1.6;
  color:var(--ink-soft);max-width:56ch;margin:2.2rem 0 0;
}
.page-body{padding:3.5rem 0 clamp(4rem,9vh,7rem);}
.two-col{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:calc(var(--gutter)*1.5);align-items:start;}

.prose{max-width:62ch;}
.prose p{font-family:var(--serif-text);font-size:1.08rem;line-height:1.75;color:var(--ink-soft);}
.prose p+p, .prose ul+p, .prose p+ul, .prose h2+p, .prose p+h2, .prose ol+p, .prose p+ol{margin-top:1.3em;}
.prose h2{
  font-family:var(--serif);font-weight:400;font-size:1.6rem;line-height:1.25;
  letter-spacing:-.01em;margin-top:2.4em;
}
.prose h2:first-child{margin-top:0;}
.prose b, .prose strong{color:var(--ink);font-weight:500;}
.prose em{color:var(--bronze);}
.prose ul, .prose ol{list-style:none;}
.prose li{
  font-family:var(--serif-text);font-size:1.02rem;line-height:1.65;color:var(--ink-soft);
  padding:.9em 0;border-bottom:1px solid var(--rule);
}
.prose li::before{
  content:"—";color:var(--bronze);margin-right:1em;font-family:var(--mono);
}
.prose ol{counter-reset:c;}
.prose ol li::before{
  counter-increment:c;content:counter(c, upper-roman) ".";
  font-family:var(--mono);font-size:.75rem;color:var(--bronze);margin-right:1.2em;
}
.sidebar{border-left:1px solid var(--rule);padding-left:calc(var(--gutter)*.75);}
.side-item{padding:1.2rem 0;border-bottom:1px solid var(--rule);}
.side-item .k{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);display:block;margin-bottom:.5em;}
.side-item .v{font-family:var(--serif-text);font-size:1rem;line-height:1.45;}

/* qa list */
.qa-list{border-top:1px solid var(--ink);}
.qa{padding:2.4rem 0;border-bottom:1px solid var(--rule);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--gutter);}
.qa h2, .qa h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.2rem,1.9vw,1.6rem);line-height:1.3;letter-spacing:-.01em;max-width:24ch;}
.qa .a{font-family:var(--serif-text);font-size:1.02rem;line-height:1.7;color:var(--ink-soft);max-width:58ch;}
.qa .a p+p{margin-top:1em;}

/* article */
.article-meta{display:flex;gap:2.5rem;flex-wrap:wrap;padding:2rem 0 0;}
.article .prose{margin:0 auto;}
.article-shell{max-width:820px;margin:0 auto;padding:0 var(--gutter);}
.byline{
  border-top:1px solid var(--ink);margin-top:3.5rem;padding-top:1.5rem;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;color:var(--grey);line-height:1.9;
}
.byline a{color:var(--ink);}

/* ---------------- closing / form ---------------- */
.closing{border-top:1px solid var(--ink);padding:clamp(5rem,12vh,9rem) 0;}
.closing .mono{margin-bottom:2rem;display:block;}
.closing h2{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(2.4rem,6vw,5.2rem);line-height:1.05;letter-spacing:-.02em;
  max-width:18ch;text-wrap:balance;
}
.closing h2 em{font-style:italic;color:var(--bronze);}
.closing .sub{margin-top:2.2rem;font-family:var(--mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--grey);}

.brief-form{margin-top:3.5rem;max-width:640px;display:grid;gap:2.2rem;}
.field label{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);display:block;margin-bottom:.6em;}
.field input, .field textarea{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--ink);
  font-family:var(--serif);font-size:1.15rem;color:var(--ink);padding:.4em 0;
  border-radius:0;outline:none;
}
.field input:focus, .field textarea:focus{border-color:var(--bronze);}
.brief-form button{
  justify-self:start;background:transparent;border:none;cursor:pointer;
  font-family:var(--mono);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink);border-bottom:1px solid var(--ink);padding:0 0 .35em;
}
.brief-form button:hover{color:var(--bronze);border-color:var(--bronze);}

/* ---------------- footer ---------------- */
footer{background:var(--ink);color:#8C99A6;overflow:hidden;}
.foot-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gutter);
  padding:3.5rem var(--gutter) 2.5rem;max-width:var(--max);margin:0 auto;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;line-height:2;
}
.foot-grid .k{color:#5C6B7A;text-transform:uppercase;letter-spacing:.14em;font-size:.62rem;display:block;margin-bottom:.6em;}
.foot-grid a{color:#B3BDC7;text-decoration:none;}
.foot-grid a:hover{color:var(--paper);}
.ghost{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(4rem,14vw,13rem);line-height:.8;letter-spacing:-.03em;
  color:rgba(255,255,255,.05);
  padding:0 var(--gutter);max-width:var(--max);margin:0 auto;
  transform:translateY(.18em);
  user-select:none;
}

/* ---------------- reveals: PROGRESSIVE ENHANCEMENT ----------------
   Content is fully visible by default. Animation only applies when
   JS runs (html.js) AND motion is allowed. A safety timer in the
   script force-reveals everything after 1.2s regardless. */
@media (prefers-reduced-motion: no-preference){
  html.js .rv{opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.2,.6,.2,1), transform .7s cubic-bezier(.2,.6,.2,1);}
  html.js .rv.in{opacity:1;transform:none;}
}

@media(max-width:900px){
  .top-index{display:none;}
  .hero-foot{grid-template-columns:1fr;}
  .hero-foot .cta-block{justify-self:start;text-align:left;}
  .ledger-grid{grid-template-columns:1fr 1fr;}
  .ledger-cell:nth-child(3){border-left:none;}
  .ledger-cell{border-top:1px solid var(--rule);}
  .ledger-cell:nth-child(-n+2){border-top:none;}
  .dossier{grid-template-columns:1fr;}
  .facts{border-left:none;padding-left:0;border-top:1px solid rgba(255,255,255,.15);padding-top:1rem;}
  .svc{grid-template-columns:1fr;gap:.9rem;padding:2rem 0;}
  .svc-terms{justify-self:start;text-align:left;}
  .svc .go{display:none;}
  .pr-grid{grid-template-columns:1fr;}
  .portrait{max-width:340px;}
  .two-col{grid-template-columns:1fr;}
  .sidebar{border-left:none;padding-left:0;border-top:1px solid var(--rule);padding-top:1.5rem;}
  .qa{grid-template-columns:1fr;gap:1rem;}
  .foot-grid{grid-template-columns:1fr 1fr;}
}

/* logo lockup in nav */
.wordmark-img{height:24px;display:block;transform:translateY(3px);}
.closing-seal{width:96px;height:96px;margin-bottom:2rem;opacity:.92;}

/* hero seal — the stamp */
.hero .shell{position:relative;}
.hero-seal{position:absolute;right:var(--gutter);top:5.5rem;width:clamp(130px,15vw,210px);transform:rotate(-8deg);}
@media(max-width:900px){.hero-seal{position:static;transform:rotate(-6deg);width:110px;margin-bottom:1.5rem;display:block;}}

/* ================= v4 layout — broken grid ================= */
.hero4{padding:clamp(3rem,7vh,5.5rem) 0 0;overflow:hidden;}
.hero4 .shell{position:relative;}
.hero4-meta{display:flex;justify-content:space-between;margin-bottom:3.5rem;}
.hero4-h1{position:relative;z-index:2;font-family:var(--serif);font-weight:400;font-size:clamp(2.5rem,7vw,6.2rem);line-height:1.02;letter-spacing:-0.02em;}
.hero4-h1 span{display:block;}
.hero4-h1 .l2{margin-left:0;}
.hero4-h1 .l3{margin-left:0;}
.hero4-h1 em{font-style:italic;color:var(--bronze);}
.hero4-seal{position:absolute;z-index:1;right:var(--gutter);top:.5rem;width:clamp(140px,14vw,185px);}
.hero4-foot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--gutter);align-items:end;padding:3.5rem 0 4rem;}
.hero4-foot .lede{font-family:var(--sans);font-size:clamp(1rem,1.35vw,1.2rem);line-height:1.6;color:var(--ink-soft);max-width:46ch;}
.hero4-foot .cta-block{justify-self:end;text-align:right;}
.hero4-foot .note{font-family:var(--mono);font-size:.7rem;color:var(--grey);margin-top:1em;letter-spacing:.05em;}

/* ticker */
.ticker{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);overflow:hidden;padding:1.15rem 0;}
.ticker-track{display:flex;gap:2rem;width:100%;justify-content:space-between;flex-wrap:wrap;}
.ticker-track span:nth-child(n+6){display:none;}
.ticker-track span{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);white-space:nowrap;}
.ticker-track b{color:var(--ink);font-weight:500;}
.ticker-track i{font-style:normal;color:var(--bronze);}
@keyframes tick{to{transform:translateX(-50%);}}
@media (prefers-reduced-motion: reduce){.ticker-track{animation:none;}}

/* dark situation — art-directed */
.dark4{background:var(--ink);color:var(--paper);position:relative;overflow:hidden;padding:clamp(5rem,11vh,8rem) 0 clamp(5rem,10vh,7rem);}
.dark4 .giant{position:absolute;left:-2.5rem;top:-3rem;font-family:var(--serif);font-weight:400;font-size:clamp(11rem,26vw,22rem);line-height:1;color:rgba(255,255,255,.04);user-select:none;pointer-events:none;}
.dark4 .trace{position:absolute;right:-6%;bottom:-4%;width:clamp(340px,46vw,700px);opacity:.9;pointer-events:none;}
.dark4 .shell{position:relative;z-index:2;}
.dark4 .when{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#8C99A6;margin-bottom:2.5rem;}
.dark4 .when i{font-style:normal;color:var(--accent-ondark);}
.dark4 h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.9rem,3.6vw,3.2rem);line-height:1.12;letter-spacing:-0.015em;max-width:20ch;text-wrap:balance;}
.dark4 h2 em{font-style:italic;color:var(--accent-ondark);}
.dark4 .body{margin-top:2.2rem;color:#B3BDC7;font-size:.95rem;max-width:46ch;}
.dark4 .body p+p{margin-top:1.2em;}
.dark4 .pull{margin-top:3rem;max-width:28ch;font-family:var(--serif-text);font-style:italic;font-weight:400;font-size:clamp(1.3rem,2.2vw,1.85rem);line-height:1.4;}
.dark4 .pull::before{content:"\201C";color:var(--accent-ondark);}
.dark4 .pull::after{content:"\201D";color:var(--accent-ondark);}
.dark4 .facts4{display:flex;gap:3.5rem;margin-top:3.5rem;flex-wrap:wrap;}
.dark4 .fact{border:none;padding:0;}

/* engagements — numerals oversized */
.eng{padding:clamp(5rem,10vh,7.5rem) 0 0;}
.eng-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:1rem;}
.eng-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.2rem,4.5vw,4rem);letter-spacing:-.015em;}
.svc4{position:relative;}
.svc4 .svc-no{font-size:clamp(2.4rem,4.5vw,4rem);font-family:var(--serif);color:var(--bronze);opacity:.5;letter-spacing:0;line-height:1;align-self:start;transform:translateY(.1em);}

/* principal overlap */
.principal4{padding:0 0 clamp(5rem,11vh,8.5rem);}
.principal4 .pr-grid{margin-top:-3.5rem;}
.principal4 .portrait{transform:translateY(-2.5rem);}

@media(max-width:900px){
  .hero4-seal{position:static;transform:none;width:110px;margin-bottom:1.5rem;display:block;}
  .hero4-h1 .l2,.hero4-h1 .l3{margin-left:0;}
  .hero4-foot{grid-template-columns:1fr;}
  .hero4-foot .lede{margin-left:0;}
  .hero4-foot .cta-block{justify-self:start;text-align:left;}
  .dark4 .trace{position:static;width:100%;margin-top:2.5rem;}
  .principal4 .pr-grid{margin-top:0;}
  .principal4 .portrait{transform:none;}
}

/* ---- exhibit (McKinsey register) ---- */
.exhibit{border:1px solid rgba(255,255,255,.18);padding:1.25rem 1.25rem 1rem;max-width:560px;}
.exhibit img{width:100%;display:block;}
.exhibit .cap{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:#8C99A6;margin-top:.9rem;line-height:1.6;}
.exhibit .cap b{color:var(--paper);font-weight:500;}
.dark4 .giant{display:none;}
.dark4 .trace{display:none;}
.dark4-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:calc(var(--gutter)*1.5);align-items:center;}
.qlist{counter-reset:q;margin-top:2.5rem;max-width:46ch;}
.qlist div{display:grid;grid-template-columns:2.4rem 1fr;gap:1rem;padding:1rem 0;border-top:1px solid rgba(255,255,255,.15);font-size:.95rem;color:#B3BDC7;line-height:1.6;}
.qlist div::before{counter-increment:q;content:counter(q, decimal-leading-zero);font-family:var(--serif);font-size:1.1rem;color:var(--accent-ondark);}
.closing-seal{width:76px;height:76px;}

/* ================================================================
   AGENCY CRAFT LAYER — from production-CSS research
   One signature easing. Durations 150–400ms. Staggered reveals.
   Masked line reveals. Underline-draw hovers. Tabular numerals.
   ================================================================ */
:root{
  --ease:cubic-bezier(.22,.61,.18,1);       /* the house curve — use everywhere */
  --dur-1:.15s; --dur-2:.3s; --dur-3:.55s;  /* micro / standard / reveal */
}

/* numerals: tabular where numbers align */
.svc-terms,.fact .n,.side-item .v,.qlist div::before{font-variant-numeric:tabular-nums;}

/* underline-draw hover (replaces static border on text links) */
.tlink{
  border-bottom:none;
  background-image:linear-gradient(currentColor,currentColor),linear-gradient(currentColor,currentColor);
  background-size:100% 1px,0 1px;
  background-position:100% 100%,0 100%;
  background-repeat:no-repeat;
  transition:background-size var(--dur-2) var(--ease),color var(--dur-1) var(--ease);
  padding-bottom:.35em;
}
.tlink:hover{background-size:0 1px,100% 1px;}
.top-index a{position:relative;transition:color var(--dur-1) var(--ease);}
.top-index a::after{
  content:"";position:absolute;left:0;bottom:-4px;height:1px;width:100%;
  background:currentColor;transform:scaleX(0);transform-origin:right;
  transition:transform var(--dur-2) var(--ease);
}
.top-index a:hover::after,.top-index a[aria-current]::after{transform:scaleX(1);transform-origin:left;}

/* staggered reveal system — js sets --i per element */
@media (prefers-reduced-motion: no-preference){
  html.js .rv{
    opacity:0;transform:translateY(16px);
    transition:opacity var(--dur-3) var(--ease),transform var(--dur-3) var(--ease);
    transition-delay:calc(var(--i,0)*55ms);
  }
  html.js .rv.in{opacity:1;transform:none;}
  /* hero masked line reveal */
  html.js .hero4-h1 span{display:block;overflow:hidden;}
  html.js .hero4-h1 span i{
    display:block;font-style:inherit;transform:translateY(110%);
    transition:transform .8s var(--ease);
  }
  html.js .hero4-h1.in span:nth-child(1) i{transition-delay:.05s;}
  html.js .hero4-h1.in span:nth-child(2) i{transition-delay:.13s;}
  html.js .hero4-h1.in span:nth-child(3) i{transition-delay:.21s;}
  html.js .hero4-h1.in span i{transform:none;}
}
.svc{transition:background var(--dur-2) var(--ease);}
.svc .go{transition:opacity var(--dur-2) var(--ease),transform var(--dur-2) var(--ease);}
.btn-under:hover{color:var(--bronze);}

/* insight band */
.insight-band{border-top:1px solid var(--rule);padding:clamp(4rem,8vh,6rem) 0;}
.insight-band .band-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:2.5rem;}
.insight-band .band-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.6rem,2.8vw,2.4rem);letter-spacing:-.01em;}
.insight-card{
  display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,6fr) minmax(0,2fr);
  gap:var(--gutter);align-items:baseline;
  padding:1.8rem 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  text-decoration:none;color:var(--ink);transition:background var(--dur-2) var(--ease);
}
.insight-card:hover{background:var(--paper-deep);}
.insight-card .k{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);}
.insight-card .t{font-family:var(--serif);font-size:clamp(1.1rem,1.8vw,1.5rem);line-height:1.3;letter-spacing:-.01em;}
.insight-card .m{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--grey);justify-self:end;}
.subscribe-line{margin-top:1.6rem;font-size:.9rem;color:var(--grey);}
.subscribe-line a{color:var(--ink);}

/* practice-of + delivery honesty */
.practice-line{font-family:var(--serif);font-size:1.02rem;color:var(--ink);}
.delivery-note{
  margin-top:2rem;padding:1.4rem 1.6rem;border-left:2px solid var(--bronze);
  background:var(--paper-deep);font-size:.92rem;color:var(--ink-soft);line-height:1.65;max-width:52ch;
}

/* persistent pre-footer CTA (BCG pattern) */
.foot-cta{background:var(--ink);border-bottom:1px solid rgba(255,255,255,.12);}
.foot-cta .shell{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding-top:2.2rem;padding-bottom:2.2rem;flex-wrap:wrap;}
.foot-cta .q{font-family:var(--serif);font-size:clamp(1.15rem,1.9vw,1.5rem);color:var(--paper);letter-spacing:-.01em;}
.foot-cta .tlink{color:var(--paper);}
@media(max-width:900px){
  .insight-card{grid-template-columns:1fr;gap:.6rem;}
  .insight-card .m{justify-self:start;}
}

/* ---- hero grid + animated exhibit ---- */
.hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:calc(var(--gutter)*1.25);align-items:start;}
.hero-right{display:flex;flex-direction:column;align-items:flex-end;gap:1.4rem;}
.hero4-seal{position:static;width:clamp(96px,9vw,128px);}
.hero-fig{border:1px solid var(--rule);padding:1.1rem 1.1rem .9rem;margin:0;width:100%;background:var(--paper);}
.hero-fig svg{width:100%;height:auto;display:block;}
.hero-fig .cap{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--grey);margin-top:.8rem;line-height:1.7;}
.hero4-foot{grid-template-columns:1fr;gap:1.8rem;padding:2.8rem 0 3.5rem;}
.hero4-foot .cta-block{justify-self:start;text-align:left;}
@media (prefers-reduced-motion: no-preference){
  .trace-anim .tp{stroke-dasharray:var(--plen);stroke-dashoffset:var(--plen);animation:tdraw 2.6s var(--ease) .5s forwards;}
  @keyframes tdraw{to{stroke-dashoffset:0;}}
  .trace-anim .tn,.trace-anim .tend,.trace-anim .tring,.trace-anim .tring2{opacity:0;animation:tin .5s var(--ease) forwards;}
  .trace-anim .tn:nth-of-type(1){animation-delay:.9s;} .trace-anim .tn:nth-of-type(2){animation-delay:1.2s;}
  .trace-anim .tn:nth-of-type(3){animation-delay:1.5s;} .trace-anim .tn:nth-of-type(4){animation-delay:1.7s;}
  .trace-anim .tn:nth-of-type(5){animation-delay:1.9s;} .trace-anim .tn:nth-of-type(6){animation-delay:2.1s;}
  .trace-anim .tn:nth-of-type(7){animation-delay:2.3s;} .trace-anim .tn:nth-of-type(8){animation-delay:2.5s;}
  .trace-anim .tend{animation-delay:2.9s;} .trace-anim .tring{animation-delay:3.05s;} .trace-anim .tring2{animation-delay:3.2s;}
  @keyframes tin{to{opacity:1;}}
  .trace-anim .tring{opacity:0;} .trace-anim .tring2{opacity:0;}
  @keyframes tin{to{opacity:1;}}
}
@media(max-width:900px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-right{align-items:flex-start;}
  .hero4-seal{width:96px;}
}

/* real portrait — pre-treated duotone, no CSS filter, no placeholder caption */
.portrait.has-photo{background:none;}
.portrait.has-photo img{filter:none;}
.portrait.has-photo::after{display:none;}