/* kamol.dev: "Ledger, under sodium light". See design/direction.md */
@font-face{font-family:Archivo;src:url(/f/archivo.woff2) format('woff2');font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:'Geist Mono';src:url(/f/geist-mono.woff2) format('woff2');font-weight:100 900;font-display:swap}

:root{
  --ink-0:#0B0B0A; --ink-1:#141412; --line:#2A2925; --text:#ECE8DF; --dim:#8E8A80; --faint:#5A5750; --accent:#FFB547;
  --m:clamp(20px,4vw,64px); --max:1600px; --ease:cubic-bezier(.2,.7,.2,1);
  --display:Archivo,'Arial Narrow',Arial,sans-serif; --mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--ink-0);color:var(--text);-webkit-text-size-adjust:100%;scroll-padding-top:72px}
body{margin:0;font:400 18px/1.5 var(--display);font-stretch:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
img,video,picture{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
::selection{background:var(--accent);color:var(--ink-0)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
h1,h2,h3,p,ol,ul,dl,dd,figure{margin:0;padding:0}
ol,ul{list-style:none}
em{font-style:normal}

.label{font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--dim)}
.skip{position:absolute;left:-9999px;top:8px;z-index:50;background:var(--accent);color:var(--ink-0);padding:8px 12px;font:600 13px var(--mono)}
.skip:focus{left:8px}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--faint);margin-right:8px;vertical-align:1px}
.dot.is-live{background:var(--accent)}

/* links: a sodium line draws over the base rule (200ms) */
.ul,.credits dd a{color:var(--text);text-decoration:none;padding-bottom:2px;
  background:linear-gradient(var(--accent),var(--accent)) left bottom/0% 1px no-repeat,linear-gradient(var(--line),var(--line)) left bottom/100% 1px no-repeat;
  transition:background-size .2s var(--ease)}
.ul:hover,.ul:focus-visible,.credits dd a:hover{background-size:100% 1px,100% 1px}

/* ---------- top rail ---------- */
.rail{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:32px;height:52px;padding:0 var(--m);
  background:color-mix(in srgb,var(--ink-0) 94%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);
  font:500 12.5px/1 var(--mono);text-transform:uppercase;letter-spacing:.09em}
.rail a{text-decoration:none}
.rail-name{color:var(--text)}
.rail-tag{color:var(--dim)}
.rail-clock{color:var(--dim)}
.rail-clock time{color:var(--text);margin-left:.6em}
.rail nav{display:flex;gap:28px}
.rail nav a{color:var(--text);transition:color .16s}
.rail nav a:hover,.rail nav a[aria-current]{color:var(--accent)}

/* ---------- home: statement + index + proof frame ---------- */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,36%);gap:clamp(32px,4vw,64px);max-width:var(--max);margin:0 auto;padding:28px var(--m) 0}
.statement{font-family:var(--display);font-stretch:62%;font-weight:800;text-transform:uppercase;font-size:clamp(40px,5.9vw,116px);line-height:.86;letter-spacing:-.004em}
.statement span{display:block}
.statement em{color:var(--accent)}
.sub{max-width:46ch;margin:18px 0 0;color:var(--dim);font-size:17px;line-height:1.5}
.index-label{display:flex;gap:.6em;margin-top:26px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.index-label span{color:var(--dim)}
.row a{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:24px;padding:5px 0 7px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--text)}
.row a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .22s var(--ease)}
.row.is-active a::after{transform:scaleX(1)}
.row-name{font-weight:500;font-size:clamp(32px,min(3.1vw,4.15svh),76px);line-height:1;letter-spacing:-.047em;white-space:nowrap;transition:color .16s var(--ease)}
.row-name sup{font:500 13px/1 var(--mono);letter-spacing:.04em;color:var(--dim);margin-left:.7em;vertical-align:top;position:relative;top:.55em;transition:color .16s var(--ease)}
.row.is-active sup{color:var(--accent)}
.row-meta{font:500 12px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--dim);white-space:nowrap;text-align:right}
.row.is-private .row-name{color:#77736a}
.index.is-pointing .row:not(.is-active) .row-name{color:var(--dim)}
.row-thumb{display:none}

.proof{position:sticky;top:72px;align-self:start;display:flex;flex-direction:column;height:calc(100svh - 96px);max-height:880px;min-height:520px}
.proof-frame{position:relative;flex:1;border-radius:18px;overflow:hidden;background:var(--ink-1);border:1px solid var(--line)}
.proof-fig{position:absolute;inset:0;visibility:hidden;clip-path:inset(0 100% 0 0)}
.proof-fig.was-on{visibility:visible;z-index:1;clip-path:inset(0)}
.proof-fig.is-on{visibility:visible;z-index:2;clip-path:inset(0);transition:clip-path .28s var(--ease)}
.proof-fig picture,.proof-fig img{width:100%;height:100%}
.proof-fig img{object-fit:cover}
.proof-fig video{width:100%;height:100%;object-fit:contain;background:#0a0a0c}
.proof-cap{margin:12px 2px 0;font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--dim)}
.proof-cap::before{content:"";display:inline-block;width:7px;height:7px;background:var(--accent);margin-right:10px;vertical-align:1px}

/* ---------- about ---------- */
.about{max-width:var(--max);margin:0 auto;padding:clamp(96px,12vw,180px) var(--m) 0}
.about-lead{margin-top:20px;max-width:28ch;font-size:clamp(26px,3vw,46px);line-height:1.12;letter-spacing:-.025em;font-weight:400}
.groups{display:grid;grid-template-columns:repeat(3,1fr);margin-top:64px;border-top:1px solid var(--line)}
.grp{padding:22px 28px 8px;border-left:1px solid var(--line)}
.grp:first-child{border-left:0;padding-left:0}
.grp h3{margin:14px 0 10px;font-weight:500;font-size:clamp(26px,2.4vw,36px);letter-spacing:-.035em;line-height:1.05}
.grp p{color:var(--dim);font-size:17px}
.grp-n{margin-top:18px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.grp-n a{font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em}

/* ---------- footer ---------- */
.foot{position:relative;overflow:hidden;margin-top:clamp(120px,14vw,200px);border-top:1px solid var(--line);padding:48px var(--m) 0}
.foot>*{max-width:var(--max);margin-left:auto;margin-right:auto}
.foot-line{font-stretch:62%;font-weight:800;text-transform:uppercase;font-size:clamp(44px,6.4vw,118px);line-height:.88;max-width:15ch}
.foot-links{display:flex;flex-wrap:wrap;gap:12px 32px;margin-top:28px;font:500 14px/1.4 var(--mono);letter-spacing:.02em}
.strip{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:56px;padding-top:16px;border-top:1px solid var(--line);font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em}
.strip a{text-decoration:none;color:var(--dim);transition:color .16s}
.strip a:hover{color:var(--text)}
.foot-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin-top:18px;font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--dim)}
.wordmark{max-width:none!important;margin:36px 0 0 -0.05em!important;font-weight:600;font-stretch:100%;font-size:31.5vw;line-height:.74;letter-spacing:-.07em;color:var(--text);white-space:nowrap;height:.5em;overflow:hidden;user-select:none}

/* ---------- case pages ---------- */
.case{max-width:var(--max);margin:0 auto;padding:36px var(--m) 0}
.case-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 24px}
.kicker{grid-column:1/-1;font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--dim)}
.case-name{grid-column:1/-1;margin-top:10px;font-weight:500;font-size:clamp(56px,11.5vw,210px);line-height:.9;letter-spacing:-.058em}
.case-outcome{grid-column:1/span 7;margin-top:30px;font-size:clamp(22px,2.3vw,34px);line-height:1.2;letter-spacing:-.014em}
.credits{grid-column:9/-1;margin-top:30px;border-top:1px solid var(--line)}
.credits div{display:grid;grid-template-columns:104px 1fr;gap:16px;padding:10px 0 11px;border-bottom:1px solid var(--line)}
.credits dt{font:500 11.5px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--dim);padding-top:2px}
.credits dd{font-size:15px;line-height:1.45}
.case-hero{position:relative;margin-top:56px;border-radius:18px;overflow:hidden;background:var(--ink-1);border:1px solid var(--line)}
.case-hero img{width:100%}
.tag{position:absolute;left:16px;bottom:16px;font:500 11.5px/1 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--text);background:rgba(11,11,10,.78);border:1px solid var(--line);padding:8px 11px;border-radius:99px}
.block{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 24px;margin-top:clamp(96px,10vw,150px)}
.block>.label{grid-column:1/span 3;padding-top:4px}
.caps ol{grid-column:4/-1;border-top:1px solid var(--line)}
.caps li{display:grid;grid-template-columns:56px minmax(0,1fr) minmax(0,1.35fr);gap:24px;padding:26px 0 28px;border-bottom:1px solid var(--line)}
.cap-n{font:500 12px/1.9 var(--mono);color:var(--dim)}
.caps h3{font-weight:500;font-size:clamp(24px,2.2vw,32px);line-height:1.08;letter-spacing:-.032em}
.caps p{color:var(--dim);font-size:17px;line-height:1.55}
.see-fig{grid-column:4/-1;position:relative}
.see-fig video,.see-fig img{width:100%;height:auto;border-radius:16px;border:1px solid var(--line);background:var(--ink-1)}
.see-fig.is-tall{max-width:560px}
.see-fig figcaption{margin-top:14px;max-width:72ch;font:400 13px/1.65 var(--mono);color:var(--dim)}
.ledger ul{grid-column:4/-1;border-top:1px solid var(--line)}
.ledger li{display:grid;grid-template-columns:minmax(200px,36%) minmax(0,1fr) auto;align-items:baseline;gap:24px;padding:16px 0 22px;border-bottom:1px solid var(--line)}
.num{font-stretch:62%;font-weight:300;font-size:clamp(56px,7vw,124px);line-height:.92;letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap}
.what{font-size:18px;line-height:1.4;max-width:42ch}
.src{font:500 11.5px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--dim);white-space:nowrap}
.is-claim .num{color:#77736a}
.is-claim .what{color:var(--dim)}
.is-claim .src{color:var(--text);border:1px solid var(--faint);border-radius:99px;padding:4px 9px}
.withheld{grid-column:4/-1;margin-top:20px;padding-left:16px;border-left:2px solid var(--line);font:400 13px/1.65 var(--mono);color:var(--dim);max-width:78ch}
.gal{grid-column:1/-1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;margin-top:28px}
.gal figure{grid-column:span 6}
.gal .g-wide{grid-column:1/span 11}
.gal .g-wide:nth-child(even){grid-column:2/span 11}
.gal .g-half:nth-child(even){margin-top:72px}
.gal img{width:100%;border-radius:14px}
.gal-note{grid-column:1/-1;margin-top:18px;font:400 13px/1.6 var(--mono);color:var(--dim)}
.next{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px 24px;margin-top:clamp(120px,12vw,180px);padding-top:22px;border-top:1px solid var(--line);text-decoration:none;color:var(--text)}
.next .label{grid-column:1/-1}
.next-name{font-weight:500;font-size:clamp(48px,9.5vw,176px);line-height:.95;letter-spacing:-.056em}
.next-arrow{font-size:clamp(40px,6vw,110px);line-height:1;transition:transform .18s var(--ease),color .18s var(--ease)}
.next:hover .next-arrow,.next:focus-visible .next-arrow{transform:translateX(12px);color:var(--accent)}

/* film controls (WCAG 2.2.2: anything that loops gets a pause) */
.film-wrap:not(.proof-fig){position:relative}
.film-toggle{position:absolute;right:12px;bottom:12px;z-index:3;font:500 11px/1 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--text);background:rgba(11,11,10,.78);border:1px solid var(--line);border-radius:99px;padding:8px 11px;cursor:pointer}
.film-toggle:hover{border-color:var(--accent)}
.see-fig .film-toggle{bottom:auto;top:12px}

.nf{max-width:var(--max);margin:0 auto;padding:120px var(--m) 0}
.nf .statement{margin:16px 0 28px}

/* ---------- responsive ---------- */
@media (max-width:1279px){
  .row a{grid-template-columns:minmax(0,1fr)}
  .row-meta{text-align:left}
}
@media (max-width:1099px){
  .hero{grid-template-columns:1fr}
  .statement{font-size:clamp(40px,11.4vw,120px)}
  .proof{display:none}
  .row a{grid-template-columns:minmax(0,1fr) 104px;grid-template-areas:"name thumb" "meta thumb";row-gap:6px;align-items:center;padding:12px 0 14px}
  .row-name{grid-area:name;font-size:clamp(30px,6.4vw,64px);white-space:normal}
  .row-meta{grid-area:meta;text-align:left;white-space:normal}
  .row-thumb{grid-area:thumb;display:block;width:104px;aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:var(--ink-1);border:1px solid var(--line)}
  .row-thumb img{width:100%;height:100%;object-fit:cover}
  .case-outcome{grid-column:1/-1}
  .credits{grid-column:1/-1}
}
@media (max-width:900px){
  .rail{grid-template-columns:1fr auto;gap:16px}
  .rail-tag,.rail-clock{display:none}
  .rail nav{gap:18px}
  .groups{grid-template-columns:1fr}
  .grp{border-left:0;padding:22px 0;border-bottom:1px solid var(--line)}
  .block>.label,.caps ol,.see-fig,.ledger ul,.withheld{grid-column:1/-1}
  .block>.label{margin-bottom:16px}
  .caps li{grid-template-columns:40px minmax(0,1fr);gap:8px 16px}
  .caps li p{grid-column:2}
  .ledger li{grid-template-columns:1fr;gap:6px}
  .gal figure,.gal .g-wide,.gal .g-wide:nth-child(even){grid-column:1/-1}
  .gal .g-half:nth-child(even){margin-top:0}
}
@media (max-width:520px){
  body{font-size:17px}
  .row-thumb{width:84px}
  .row a{grid-template-columns:minmax(0,1fr) 84px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}

/* ---------- lab notes: /blog/ (continues the index and case-page systems) ---------- */
.notes{max-width:var(--max);margin:0 auto;padding:36px var(--m) 0}
.notes .statement{margin-top:14px}
.notes .index-label{margin-top:clamp(56px,7vw,112px)}
.notes-label a{margin-left:auto;color:var(--text)}
.note-row a{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px 24px;align-items:baseline;padding:22px 0 26px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--text)}
.note-row a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .22s var(--ease)}
.note-row a:hover::after,.note-row a:focus-visible::after{transform:scaleX(1)}
.note-n{grid-column:1/span 2;font:500 13px/1 var(--mono);letter-spacing:.04em;color:var(--dim);transition:color .16s var(--ease)}
.note-row a:hover .note-n,.note-row a:focus-visible .note-n{color:var(--accent)}
.note-main{grid-column:3/span 7;display:flex;flex-direction:column;gap:10px}
.note-title{font-weight:500;font-size:clamp(28px,3vw,52px);line-height:1.02;letter-spacing:-.04em}
.note-desc{max-width:60ch;color:var(--dim);font-size:17px;line-height:1.5}
.note-meta{grid-column:10/-1;text-align:right;font:500 12px/1.7 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--dim)}
.note-meta span{display:block}
.note-row.is-draft .note-title{color:#77736a}
.note-row.is-draft .note-n{color:var(--accent)}
.note-empty p{padding:22px 0 26px;border-bottom:1px solid var(--line);font-size:clamp(22px,2.3vw,34px);line-height:1.2;letter-spacing:-.014em;color:var(--dim)}

.note-name{grid-column:1/-1;max-width:15em;margin-top:10px;font-weight:500;font-size:clamp(48px,7.4vw,136px);line-height:.94;letter-spacing:-.05em}
.draft-tag{color:var(--ink-0);background:var(--accent);padding:3px 8px;border-radius:99px}
.note-body .prose{grid-column:4/span 7}
.prose{font-size:19px;line-height:1.62}
.prose>*+*{margin-top:1.05em}
.prose h2{margin-top:2.2em;font-weight:500;font-size:clamp(26px,2.4vw,36px);line-height:1.08;letter-spacing:-.035em}
.prose h3{margin-top:1.8em;font-weight:500;font-size:clamp(21px,1.8vw,26px);line-height:1.15;letter-spacing:-.025em}
.prose h4{margin-top:1.8em;font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--dim)}
.prose h2+*,.prose h3+*,.prose h4+*{margin-top:.7em}
.prose strong{font-weight:600}
.prose em{font-style:italic}
.prose li{position:relative;padding-left:44px}
.prose li+li{margin-top:.5em}
.prose ul>li::before{content:"–";position:absolute;left:0;color:var(--dim)}
.prose ol{counter-reset:n}
.prose ol>li{counter-increment:n}
.prose ol>li::before{content:counter(n,decimal-leading-zero);position:absolute;left:0;top:.28em;font:500 12px/1.9 var(--mono);color:var(--dim)}
.prose blockquote{margin:0;padding-left:16px;border-left:2px solid var(--line);color:var(--dim)}
.prose code{font:400 .84em/1 var(--mono);background:var(--ink-1);border:1px solid var(--line);border-radius:4px;padding:.12em .36em}
.prose pre{overflow:auto;padding:18px 20px;background:var(--ink-1);border:1px solid var(--line);border-radius:14px;font:400 14px/1.6 var(--mono)}
.prose pre code{font:inherit;background:none;border:0;padding:0}
.prose hr{border:0;border-top:1px solid var(--line);margin:2.4em 0}
.prose table{width:100%;border-collapse:collapse;font:400 14px/1.5 var(--mono)}
.prose th,.prose td{text-align:left;padding:8px 12px 8px 0;border-bottom:1px solid var(--line);vertical-align:top}
.prose th{font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.09em;color:var(--dim);white-space:nowrap}
.table-scroll{overflow-x:auto}
.prose .note-fig{margin-top:1.8em}
.note-fig img{width:100%;border-radius:14px;border:1px solid var(--line);background:var(--ink-1)}
.note-fig figcaption{margin-top:12px;font:400 13px/1.65 var(--mono);color:var(--dim)}
.note .next-name{font-size:clamp(40px,6vw,104px)}
@media (max-width:520px){.rail-notes{display:none}} /* the rail keeps its phone layout; the footer links the notes there */
@media (max-width:900px){
  .note-row a{grid-template-columns:minmax(0,1fr);gap:10px}
  .note-n,.note-main,.note-meta{grid-column:1/-1}
  .note-meta{text-align:left}
  .note-meta span{display:inline}
  .note-meta span::before{content:" · "}
  .note-body .prose{grid-column:1/-1}
  .prose{font-size:18px}
  .prose li{padding-left:32px}
  .prose table{min-width:560px}
}

/* ---------- service: /migrate/ (case-page system; one goal: book the assessment) ---------- */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:99px;border:1px solid transparent;font:500 13px/1 var(--mono);text-transform:uppercase;letter-spacing:.09em;text-decoration:none;cursor:pointer;transition:background-color .16s var(--ease),border-color .16s var(--ease)}
.btn-call{background:var(--accent);color:var(--ink-0)}
.btn-call .dot{background:var(--ink-0);margin:0}
.btn-call:hover{background:var(--text)}
.btn-ghost{background:transparent;border-color:var(--faint);color:var(--text)}
.btn-ghost:hover{border-color:var(--accent)}
.svc-statement{grid-column:1/-1;margin-top:14px;font-size:clamp(40px,5.6vw,108px)}
.svc-statement span{display:inline}
.svc-lede{grid-column:1/span 7}
.svc-sub2{margin-top:16px;max-width:58ch;color:var(--dim);font-size:18px;line-height:1.55}
.svc-cta{margin-top:30px;padding-top:18px;border-top:1px solid var(--line)}
.svc-cta-line{font-size:clamp(19px,1.6vw,24px);line-height:1.3;letter-spacing:-.012em}
.svc-cta-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.svc-text{grid-column:4/span 8}
.svc-text p{max-width:58ch;font-size:19px;line-height:1.6}
.svc-text p+p{margin-top:1.05em}
.svc-text .svc-lead{max-width:24ch;margin-bottom:1.2em;font-size:clamp(28px,3.2vw,50px);line-height:1.1;letter-spacing:-.028em}
.svc-price{margin-top:12px;font:500 12px/1.6 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--text)}
.caps li p em{color:var(--text)}
.lanes{grid-column:4/-1;border-top:1px solid var(--line)}
.lanes li{padding:12px 0 16px;border-bottom:1px solid var(--line)}
.lane-name{font-weight:500;font-size:clamp(34px,4.6vw,88px);line-height:1;letter-spacing:-.047em}
.lane-from{color:var(--dim)}
.lane-name sup{font:500 13px/1 var(--mono);letter-spacing:.04em;color:var(--dim);margin-left:.7em;vertical-align:top;position:relative;top:.55em}
.lanes-also{grid-column:4/-1;display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:18px;font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em}
.lanes-also .label{color:var(--dim)}
.svc-proof-text{grid-column:4/span 8;font-size:clamp(22px,2.3vw,34px);line-height:1.22;letter-spacing:-.014em}
.svc-fig{grid-column:4/-1;position:relative;margin-top:44px;border-radius:18px;overflow:hidden;background:var(--ink-1);border:1px solid var(--line)}
.svc-fig img{width:100%}
.svc-proof ul{margin-top:44px}
.what .dim{color:var(--dim)}
.svc-work{grid-column:4/-1;margin-top:56px;border-top:1px solid var(--line)}
.svc-work a{position:relative;display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:8px 24px;align-items:baseline;padding:20px 0 24px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--text)}
.svc-work a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .22s var(--ease)}
.svc-work a:hover::after,.svc-work a:focus-visible::after{transform:scaleX(1)}
.svc-work .note-n{grid-column:auto}
.svc-work a:hover .note-n,.svc-work a:focus-visible .note-n{color:var(--accent)}
.svc-work-main{display:flex;flex-direction:column;gap:8px}
.svc-work-role{font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--dim)}
.svc-work-name{font-weight:500;font-size:clamp(30px,3.2vw,56px);line-height:1;letter-spacing:-.045em}
.svc-work-desc{max-width:60ch;color:var(--dim);font-size:17px;line-height:1.5}
.svc-work-arrow{font-size:clamp(28px,3vw,52px);line-height:1;transition:transform .18s var(--ease),color .18s var(--ease)}
.svc-work a:hover .svc-work-arrow,.svc-work a:focus-visible .svc-work-arrow{transform:translateX(10px);color:var(--accent)}
.fit{grid-column:4/-1;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}
.fit>div{padding:22px 28px 8px;border-left:1px solid var(--line)}
.fit>div:first-child{border-left:0;padding-left:0}
.fit p{margin-top:14px;font-size:clamp(22px,2vw,30px);line-height:1.22;letter-spacing:-.018em}
.fit>div+div p{color:var(--dim)}
.svc-book{margin-top:clamp(120px,12vw,180px);padding-top:22px;border-top:1px solid var(--line)}
.svc-book .statement{margin-top:14px}
.svc-book-sub{margin-top:20px;font-size:clamp(22px,2.3vw,34px);line-height:1.2;letter-spacing:-.014em}
.svc-book-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 24px;margin-top:64px}
.svc-call{grid-column:1/span 5}
.svc-phone{display:inline-block;margin-top:14px;font-stretch:62%;font-weight:300;font-size:clamp(60px,6.6vw,124px);line-height:.92;letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--text);text-decoration:none;transition:color .16s var(--ease)}
.svc-phone:hover{color:var(--accent)}
.svc-call .withheld{margin-top:28px}
.svc-form{grid-column:7/-1}
.fld-row{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.fld{display:block;margin-top:20px}
.fld-k{font:500 11.5px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--dim)}
.fld-k i{font-style:normal;color:var(--faint);margin-left:6px}
.fld-hint{display:block;margin-top:2px;font:400 13px/1.5 var(--mono);color:var(--dim)}
.fld input,.fld textarea{display:block;width:100%;margin-top:6px;padding:8px 0 10px;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;color:var(--text);font:400 19px/1.4 var(--display);transition:border-color .16s var(--ease)}
.fld textarea{resize:vertical;min-height:104px}
.fld input:focus,.fld textarea:focus{outline:none;border-bottom-color:var(--accent);box-shadow:0 1px 0 var(--accent)}
.svc-form-note{margin-top:24px;max-width:60ch;font:400 13px/1.65 var(--mono);color:var(--dim)}
.svc-form-note .ul{color:var(--text)}
.svc-form-acts{margin-top:18px}
.svc-form-status{margin-top:14px;max-width:60ch;font-size:16px;line-height:1.5}
.svc-form-status:empty{display:none}
.svc-form-out{margin-top:14px}
.svc-form-out textarea{display:block;width:100%;padding:14px 16px;background:var(--ink-1);border:1px solid var(--line);border-radius:14px;color:var(--text);font:400 13px/1.6 var(--mono);resize:vertical}
.svc-form-out .btn{margin-top:12px}
.callbar{display:none}
.svc-page .foot{margin-top:clamp(96px,10vw,150px)}
.svc-page .strip{margin-top:0;padding-top:0;border-top:0}
@media (max-width:1099px){
  .svc-statement{font-size:clamp(34px,8.6vw,92px)}
  .svc-lede{grid-column:1/-1}
}
@media (max-width:900px){
  .svc-text,.lanes,.lanes-also,.svc-proof-text,.svc-fig,.svc-work,.fit{grid-column:1/-1}
  .fit{grid-template-columns:1fr}
  .fit>div{border-left:0;padding:22px 0;border-bottom:1px solid var(--line)}
  .svc-work a{grid-template-columns:minmax(0,1fr) auto}
  .svc-work .note-n{grid-column:1/-1}
  .svc-book-grid{grid-template-columns:1fr;margin-top:40px}
  .svc-call,.svc-form{grid-column:1/-1}
  .svc-form{margin-top:56px}
  .callbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;margin:0;padding:10px var(--m);background:color-mix(in srgb,var(--ink-0) 94%,transparent);backdrop-filter:blur(8px);border-top:1px solid var(--line)}
  .callbar .btn{flex:1}
  .svc-page{padding-bottom:70px}
}
@media (max-width:520px){
  .fld-row{grid-template-columns:1fr}
  .svc-phone{font-size:clamp(54px,16vw,80px)}
}
.ledger .svc-work li{display:block;padding:0;border-bottom:0}
.lane-to>[aria-hidden]{margin-right:.22em;color:var(--dim)}
@media (max-width:900px){.svc-cta-acts .btn-call{display:none}} /* the call bar carries it on phones */