/* Mark1Lab — v5. Full rewrite, not another patch on top of four earlier ones.

   WHAT THE AUDIT FOUND
   Alro was only on two elements. The real noise was 89 monospace elements in
   letterspaced caps, plus ten numbered section indices. That combination, not
   the display face on its own, is what reads as generated. So:

   TYPE
   One family does the work: Inter, with weight, size and colour carrying the
   hierarchy instead of a second typeface. Alro stays in the wordmark, where a
   display face belongs. Mono drops from 89 elements to the small handful that
   are genuinely data.

   LAYOUT
   Numbered indices out. Giant stat band out. Ghost numerals out. Corner ticks,
   scroll bar and count-up animation out, all of them decoration pretending to
   be craft. What replaces them is measure control, asymmetry and restraint. */

:root{
  --ink-2:#f4f0e8;
  --bone-3:#e5dfd3;
  --line-l:#14141417;
  --line-d:#ede8de1f;
  --tx-1:#141414;
  --tx-2:#5a554f;
  --tx-3:#867f76;
  --tx-1r:#ede8de;
  --tx-2r:#a9a29a;
  --tx-3r:#7d776f;
  --sp-y:clamp(42px,3.4vw,56px);
  --ease:cubic-bezier(.22,.7,.24,1);
}

/* ---------------- type ---------------- */
body.v2{font-family:var(--font-body);letter-spacing:-.011em}
body.v2 h1,body.v2 h2,body.v2 h3,body.v2 h4{font-family:var(--font-body);text-wrap:balance}
body.v2 .brand img,body.v2 .footer__brand img{}

body.v2 h1,body.v2 .h1{
  font-weight:600;font-size:clamp(38px,3.9vw,62px);line-height:1.06;
  letter-spacing:-.035em;margin:0;max-width:17ch}
body.v2 .h-xl,body.v2 .section h2{
  font-weight:600;font-size:clamp(28px,2.7vw,42px);line-height:1.12;
  letter-spacing:-.03em;margin:0;max-width:20ch}
body.v2 h3{font-weight:600;font-size:19px;line-height:1.3;letter-spacing:-.022em;margin:0}

.lede{font-size:clamp(17px,1.28vw,20px);line-height:1.6;color:var(--tx-2);
  letter-spacing:-.008em;margin:0;max-width:52ch}
.section--ink .lede,.section--slate .lede{color:var(--tx-2r)}
body.v2 p{max-width:68ch}

/* the only mono left: one eyebrow per section, lowercase, quiet */
.eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.02em;
  color:var(--tx-3);margin:0 0 clamp(16px,1.5vw,22px);display:block;text-transform:none}
.section--ink .eyebrow,.section--slate .eyebrow{color:var(--tx-3r)}
.eyebrow b{color:var(--clay);font-weight:400}

/* ---------------- rhythm ---------------- */
body.v2 .section{padding-block:var(--sp-y) !important}
body.v2 .head{padding-bottom:clamp(26px,2.4vw,38px);max-width:none}
body.v2 .head-2col{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.68fr);
  gap:clamp(26px,4vw,72px);align-items:start;padding:0 0 clamp(26px,2.4vw,38px)}
body.v2 .head-2col p{margin:0;padding-top:9px}
@media (width<=1180px){body.v2 .head-2col p{padding-top:0}}
body.v2 .moments{padding-top:var(--sp-y) !important}
body.v2 .hero{min-height:0;padding-bottom:0}
body.v2 .hero__frame{min-height:0;border-bottom:0;
  grid-template-columns:minmax(0,1.06fr) minmax(430px,.94fr);gap:clamp(30px,5vw,90px)}
body.v2 .hero__copy{padding:clamp(46px,4.6vw,74px) 0 clamp(46px,4.6vw,74px)}
body.v2 .hero__copy>p{font-size:clamp(17px,1.28vw,20px);line-height:1.6;
  max-width:50ch;margin-top:26px;color:#b3aca3}
body.v2 .hero__actions{margin-top:34px;gap:30px}
.hero-note{color:var(--tx-3r);font-size:14px;line-height:1.6;margin:24px 0 0;max-width:48ch}
.stack-cta{padding-top:clamp(28px,2.6vw,40px)}
.section--ink{background:var(--ink);color:var(--tx-1r)}
.section--slate{background:var(--slate);color:var(--tx-1r)}
.section--bone2{background:var(--ink-2)}
:where(a,button,summary,label,input,select,textarea):focus-visible{
  outline:2px solid var(--clay);outline-offset:3px}

/* ---------------- header ---------------- */
body.v2 .site-header{height:82px}
body.v2 .site-header--scrolled{height:70px}
body.v2 .brand{width:150px}
body.v2 .site-nav a,body.v2 .header-cta{font-size:14px;font-weight:450;letter-spacing:-.008em}
.cta-short{display:none}
body.v2 .header-cta{white-space:nowrap;font-weight:500}
@media (width<=1180px){body.v2 .cta-long{display:none}body.v2 .cta-short{display:inline}}
@media (width<=820px){
  body.v2 .header-cta{border:1px solid var(--clay);width:auto;height:36px;
    padding:0 14px;gap:8px;font-size:12px;justify-content:center;align-items:center}
  body.v2 .header-cta span[aria-hidden]{display:inline}}
@media (width<=520px){body.v2 .brand{width:116px}}

/* ---------------- proof line, replaces the stat band ---------------- */
.proofline{border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d);
  background:var(--ink);color:var(--tx-2r);padding:clamp(20px,2vw,28px) max(24px,50vw - 770px);
  font-size:15px;line-height:1.75;max-width:none}
.proofline p{margin:0;max-width:96ch}
.proofline b{color:var(--tx-1r);font-weight:600;font-variant-numeric:tabular-nums}

/* ---------------- outcomes: editorial rows, not a card grid ---------------- */
.outcomes{border-top:1px solid var(--line-d)}
.outcomes article{border-bottom:1px solid var(--line-d);display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(28px,4.5vw,80px);
  padding:clamp(26px,2.6vw,38px) 0;align-items:start;transition:opacity .2s var(--ease)}
.outcomes h3{font-size:clamp(20px,1.6vw,26px);line-height:1.24;color:var(--tx-1r);
  letter-spacing:-.028em;max-width:22ch}
.outcomes .who{color:var(--tx-3r);font-size:13px;margin:12px 0 0;letter-spacing:0}
.outcomes p{margin:0;color:var(--tx-2r);font-size:16px;line-height:1.7;max-width:56ch}
.outcomes a{color:var(--clay);font-size:14px;font-weight:500;display:inline-flex;
  gap:10px;margin-top:18px}
.outcomes a:hover{color:var(--tx-1r)}

.wall{margin-top:clamp(40px,3.6vw,60px)}
.wall-note{color:var(--tx-3r);font-size:14px;margin:18px 0 0;line-height:1.7;max-width:74ch}
body.v2 .brand-field span{font-family:var(--font-body);font-size:clamp(14px,1.15vw,18px);
  letter-spacing:-.01em;min-height:96px;color:#b5aea5}
body.v2 .brand-field span:nth-child(6n+2),body.v2 .brand-field span:nth-child(6n+5){color:#b5aea5}

/* ---------------- situations ---------------- */
.situations{border-top:1px solid var(--line-l);display:grid;grid-template-columns:repeat(3,1fr)}
.situations a{border-right:1px solid var(--line-l);border-bottom:1px solid var(--line-l);
  padding:clamp(24px,2.2vw,34px) clamp(24px,2.2vw,34px) clamp(26px,2.4vw,38px) 0;
  display:flex;flex-direction:column;gap:14px;transition:color .2s var(--ease)}
.situations a+a{padding-left:clamp(24px,2.2vw,34px)}
.situations a:last-child{border-right:0;padding-right:0}
.situations a:hover{color:var(--clay)}
.situations a:hover p{color:var(--tx-2)}
.situations .who{color:var(--clay);font-size:13px;margin:0}
.situations h3{font-size:clamp(19px,1.45vw,23px);line-height:1.24}
.situations p{margin:0;color:var(--tx-2);font-size:15px;line-height:1.65;max-width:40ch}
.situations i{margin-top:auto;padding-top:18px;font-style:normal;font-size:15px;color:var(--clay)}
.disqualify{padding:26px 0 0;color:var(--tx-2);font-size:16px;line-height:1.7;max-width:78ch}
.disqualify b{color:var(--tx-1);font-weight:600}

/* ---------------- build components ---------------- */
.builds{border-top:1px solid var(--line-d)}
.builds a{border-bottom:1px solid var(--line-d);display:grid;
  grid-template-columns:minmax(160px,.3fr) 1fr 26px;gap:clamp(22px,3vw,54px);
  align-items:baseline;padding:clamp(20px,1.9vw,28px) 0;
  transition:color .2s var(--ease)}
.builds a:hover{color:var(--clay)}
.builds a:hover p{color:var(--tx-2r)}
.builds h3{font-size:clamp(17px,1.35vw,21px);color:inherit}
.builds p{margin:0;color:var(--tx-2r);font-size:15px;line-height:1.7;max-width:64ch}
.builds i{justify-self:end;font-style:normal;font-size:15px;color:var(--clay)}

/* ---------------- phases ---------------- */
.phases{border-top:1px solid var(--line-l);display:grid;grid-template-columns:repeat(3,1fr)}
.phases article{border-right:1px solid var(--line-l);
  padding:clamp(22px,2vw,30px) clamp(26px,3vw,48px) clamp(24px,2.2vw,34px) 0;
  display:flex;flex-direction:column;gap:12px}
.phases article+article{padding-left:clamp(26px,3vw,48px)}
.phases article:last-child{border-right:0;padding-right:0}
.phases .who{color:var(--clay);font-size:13px;margin:0}
.phases h3{font-size:clamp(19px,1.45vw,23px);line-height:1.22}
.phases .price{font-size:14px;color:var(--tx-1);font-variant-numeric:tabular-nums;
  padding-bottom:14px;border-bottom:1px solid var(--line-l);margin:2px 0 6px}
.phases .price b{color:var(--clay);font-weight:600}
.phases p{margin:0;color:var(--tx-2);font-size:15px;line-height:1.7}

/* ---------------- handover pack: a list, not a numbered grid ---------------- */
.pack{border-top:1px solid var(--line-l);columns:2;column-gap:clamp(34px,5vw,80px);margin:0;padding:0}
.pack li{list-style:none;break-inside:avoid;border-bottom:1px solid var(--line-l);
  padding:15px 0;font-size:16px;line-height:1.55;color:var(--tx-2)}
.pack li::before{content:"";display:inline-block;width:5px;height:5px;background:var(--clay);
  border-radius:50%;vertical-align:middle;margin-right:14px;transform:translateY(-2px)}

/* ---------------- staffing ---------------- */
.staffing{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line-d)}
.staffing>div{padding:clamp(26px,2.6vw,38px) clamp(34px,5vw,80px) clamp(26px,2.6vw,38px) 0}
.staffing>div+div{border-left:1px solid var(--line-d);
  padding:clamp(26px,2.6vw,38px) 0 clamp(26px,2.6vw,38px) clamp(34px,5vw,80px)}
.staffing p{margin:0 0 16px;font-size:16px;line-height:1.7;color:var(--tx-2r);max-width:52ch}
.staffing p:last-child{margin-bottom:0}
.staffing b{color:var(--tx-1r);font-weight:600}
.disciplines{margin:22px 0 0;padding:0;color:var(--tx-3r);font-size:14px;line-height:1.8;max-width:52ch}

/* ---------------- pricing ---------------- */
.price-strip{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-l)}
.price-strip div{border-right:1px solid var(--line-l);border-bottom:1px solid var(--line-l);
  padding:clamp(22px,2vw,30px) clamp(24px,2.2vw,34px) clamp(24px,2.2vw,34px) 0;
  display:flex;flex-direction:column;gap:10px}
.price-strip div+div{padding-left:clamp(24px,2.2vw,34px)}
.price-strip div:last-child{border-right:0;padding-right:0}
.price-strip .who{color:var(--clay);font-size:13px;margin:0}
.price-strip b{font-size:clamp(22px,1.8vw,28px);font-weight:600;letter-spacing:-.03em;
  font-variant-numeric:tabular-nums}
.price-strip em{font-style:normal;color:var(--tx-2);font-size:14px;line-height:1.65;margin-top:auto;padding-top:10px}

.ptable{border-top:1px solid var(--line-l);width:100%;border-collapse:collapse;
  font-variant-numeric:tabular-nums}
.ptable th,.ptable td{text-align:left;padding:20px 20px 20px 0;
  border-bottom:1px solid var(--line-l);font-size:16px;vertical-align:baseline;color:var(--tx-2)}
.ptable th{font-size:13px;color:var(--tx-3);padding-bottom:12px;font-weight:450;letter-spacing:0}
.ptable td:first-child{font-weight:600;font-size:17px;color:var(--tx-1);width:24%;letter-spacing:-.02em}
.ptable td:last-child{color:var(--clay);font-weight:600;text-align:right;padding-right:0;white-space:nowrap}
.ptable tr.total td{border-bottom:1px solid var(--tx-1);font-weight:700;color:var(--tx-1)}
.section--ink .ptable,.section--ink .ptable td{border-bottom-color:var(--line-d);color:var(--tx-2r)}
.section--ink .ptable{border-top-color:var(--line-d)}
.section--ink .ptable td:first-child,.section--ink .ptable tr.total td{color:var(--tx-1r)}
.tax-note{color:var(--tx-3);font-size:14px;line-height:1.7;margin:20px 0 0;max-width:74ch}
.section--ink .tax-note{color:var(--tx-2r);font-size:15px}

.estimator{border:1px solid var(--line-l);background:var(--bone)}
.estimator fieldset{border:0;border-bottom:1px solid var(--line-l);margin:0;
  padding:22px clamp(20px,2.2vw,34px) 26px}
.estimator legend{font-size:13px;color:var(--tx-3);margin-bottom:14px;padding:0;letter-spacing:0}
.opts{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line-l)}
.opts label{border-right:1px solid var(--line-l);min-height:64px;display:flex;align-items:center;
  justify-content:center;cursor:pointer;position:relative;text-align:center;
  transition:background .18s var(--ease)}
.opts label:last-child{border-right:0}
.opts label:hover{background:var(--bone-3)}
.opts input{position:absolute;opacity:0;width:100%;height:100%;cursor:pointer}
.opts span{padding:12px 14px;font-size:14px;line-height:1.4;color:var(--tx-2)}
.opts label:has(input:checked){background:var(--clay)}
.opts label:has(input:checked) span{color:#fff}
.est-out{padding:26px clamp(20px,2.2vw,34px) 30px;display:grid;grid-template-columns:1fr auto;
  gap:clamp(22px,3vw,46px);align-items:center}
.est-out p{margin:0;font-size:clamp(17px,1.32vw,21px);line-height:1.5;max-width:56ch;letter-spacing:-.015em}
.est-out p b{color:var(--clay);font-weight:600;font-variant-numeric:tabular-nums}
.est-out small{display:block;margin-top:10px;font-size:14px;color:var(--tx-3);line-height:1.6}

.detail{border-top:1px solid var(--line-l);padding:clamp(28px,2.8vw,42px) 0;
  display:grid;grid-template-columns:minmax(170px,.3fr) 1fr;gap:clamp(24px,4vw,64px)}
.detail h3{font-size:15px;color:var(--clay);margin:0;font-weight:500;letter-spacing:-.012em}
.detail p{margin:0 0 16px;font-size:16px;line-height:1.72;color:var(--tx-2);max-width:70ch}
.detail p:last-child{margin-bottom:0}
.detail b{font-weight:600;color:var(--tx-1)}
.detail ol{margin:20px 0 0;padding:0;list-style:none}
.detail ol li{border-bottom:1px solid var(--line-l);padding:14px 0;font-size:15px;
  line-height:1.6;color:var(--tx-2)}
.detail ol li:first-child{border-top:1px solid var(--line-l)}

.excl{border-top:1px solid var(--line-l)}
.excl div{border-bottom:1px solid var(--line-l);padding:20px 0;display:grid;
  grid-template-columns:minmax(190px,.32fr) 1fr;gap:clamp(22px,3vw,54px);align-items:baseline}
.excl b{font-size:16px;letter-spacing:-.022em;font-weight:600;color:var(--tx-1)}
.excl p{margin:0;color:var(--tx-2);font-size:15px;line-height:1.7;max-width:74ch}

/* ---------------- FAQ ---------------- */
.faq{border-top:1px solid var(--line-l);margin-bottom:0}
.faq details:last-child{border-bottom:0}
.faq details{border-bottom:1px solid var(--line-l)}
.faq summary{cursor:pointer;display:grid;grid-template-columns:1fr 24px;gap:22px;padding:22px 0;
  list-style:none;font-size:clamp(16px,1.22vw,19px);letter-spacing:-.02em;font-weight:500;
  transition:color .18s var(--ease)}
.faq summary:hover{color:var(--clay)}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{color:var(--clay);font-style:normal;justify-self:end;font-size:18px;
  transition:transform .22s var(--ease);line-height:1}
.faq details[open] summary i{transform:rotate(45deg)}
.faq details p{margin:0;padding:0 14% 24px 0;color:var(--tx-2);font-size:16px;line-height:1.72;max-width:74ch}
.section--ink .faq,.section--ink .faq details{border-color:var(--line-d)}
.section--ink .faq details p{color:var(--tx-2r)}

/* ---------------- statement + closing ---------------- */
body.v2 .ai-statement{background:var(--clay);padding-block:clamp(56px,5vw,88px)}
body.v2 .ai-statement h2{font-size:clamp(28px,2.9vw,46px);font-weight:600;
  letter-spacing:-.03em;line-height:1.16;max-width:24ch;color:#fff}
body.v2 .ai-statement h2 span{color:var(--ink)}
body.v2 .ai-statement p{color:#40211a;font-size:clamp(16px,1.24vw,19px);line-height:1.65;
  margin:26px 0 0;max-width:56ch}
body.v2 .start{min-height:0;grid-template-columns:.55fr 1.45fr}
body.v2 .start__copy{padding:clamp(52px,4.8vw,84px) clamp(40px,5vw,90px)}
body.v2 .start__copy h2{font-size:clamp(28px,2.7vw,42px);font-weight:600;
  letter-spacing:-.03em;line-height:1.12;margin:16px 0 20px}
body.v2 .start__copy>span{font-family:var(--font-mono);font-size:11px;letter-spacing:.02em;
  color:var(--tx-3r);text-transform:none}
body.v2 .start__copy p{font-size:clamp(16px,1.24vw,19px);line-height:1.65;
  color:var(--tx-2r);margin-bottom:32px;max-width:52ch}
body.v2 .start__mark img{width:62%;opacity:.5}
body.v2 .footer{padding-top:clamp(44px,3.8vw,62px)}
body.v2 .footer span,body.v2 .footer__nav>span,body.v2 .footer__contact>span{
  font-family:var(--font-body);font-size:13px;letter-spacing:0;color:var(--tx-3r);text-transform:none}
body.v2 .footer__bar{font-size:13px}

/* ---------------- field notes ---------------- */
body.v2 .article-list{border-top:1px solid var(--line-l)}
body.v2 .article-list>a{grid-template-columns:82px 1fr 70px 24px;min-height:88px;
  border-bottom:1px solid var(--line-l)}
body.v2 .article-list span,body.v2 .article-list em{font-family:var(--font-body);
  font-size:13px;letter-spacing:0;color:var(--tx-3)}
body.v2 .article-list h3{font-size:clamp(17px,1.35vw,21px);font-weight:500}
body.v2 .thinking__heading>a{font-size:14px}
body.v2 .comparison__row>span{font-size:17px;font-weight:600;letter-spacing:-.022em}
body.v2 .comparison__row p{font-size:16px;line-height:1.65;color:var(--tx-2)}
body.v2 .comparison__row em{font-family:var(--font-body);font-size:13px;
  letter-spacing:0;text-transform:none;color:var(--tx-3)}
body.v2 .comparison__row--mark1 em{color:#fff}
body.v2 .comparison__row{min-height:94px}

/* ---------------- case pages ---------------- */
.case-body{max-width:70ch;padding-top:6px}
.case-body p{margin:0 0 20px;font-size:17px;line-height:1.75;color:var(--tx-2)}
.case-lede{font-size:clamp(18px,1.42vw,22px) !important;line-height:1.58 !important;
  color:var(--tx-1) !important;margin-bottom:24px !important;letter-spacing:-.015em}
.case-kicker{border-left:2px solid var(--clay);padding:1px 0 1px 20px;
  color:var(--tx-1) !important;font-weight:500}
.case-note{color:var(--tx-3) !important;font-size:15px !important;
  border-top:1px solid var(--line-l);padding-top:20px;margin-top:26px !important}
.work-grid a{min-height:auto}

/* ---------------- responsive ---------------- */
@media (width<=1180px){
  body.v2 .hero__frame{grid-template-columns:1fr}
  body.v2 .head-2col{grid-template-columns:1fr;gap:22px;align-items:start}
  .outcomes article{grid-template-columns:1fr;gap:16px}
  .situations,.phases,.price-strip{grid-template-columns:1fr}
  .situations a,.situations a+a,.phases article,.phases article+article,
  .price-strip div,.price-strip div+div{border-right:0;padding-left:0;padding-right:0;
    border-bottom:1px solid var(--line-l)}
  .staffing{grid-template-columns:1fr}
  .staffing>div,.staffing>div+div{border-left:0;padding:26px 0}
  .staffing>div+div{border-top:1px solid var(--line-d)}
  .detail,.excl div{grid-template-columns:1fr;gap:14px}
  .opts{grid-template-columns:1fr 1fr}
  .opts label:nth-child(2n){border-right:0}
  .opts label:nth-child(-n+2){border-bottom:1px solid var(--line-l)}
  .est-out{grid-template-columns:1fr}
  .est-out .button{justify-self:start}
  .pack{columns:1}
  body.v2 .start{grid-template-columns:1fr}
  body.v2 .start__mark{display:none}
}
@media (width<=820px){
  body.v2 .builds a{grid-template-columns:1fr 22px;gap:10px}
  body.v2 .builds p{grid-column:1/-1}
  body.v2 .builds i{grid-column:2;grid-row:1}
  .faq details p{padding-right:4%}
  .ptable,.ptable tbody,.ptable tr,.ptable td{display:block;width:100%}
  .ptable thead{display:none}
  .ptable td{border-bottom:0;padding:3px 0;font-size:15px}
  .ptable tr{border-bottom:1px solid var(--line-l);padding:18px 0}
  .ptable td:first-child{width:auto;font-size:18px;margin-bottom:6px}
  .ptable td:last-child{text-align:left;padding-top:8px}
  body.v2 .article-list>a{grid-template-columns:1fr 22px}
  body.v2 .article-list em{display:none}
}
@media (width<=520px){.opts{grid-template-columns:1fr}
  .opts label{border-right:0;border-bottom:1px solid var(--line-l)}
  .opts label:last-child{border-bottom:0}}
