/* ============================================================
   HOME v2 — extra sections for index-v2.html only.
   Builds on style.css tokens; nothing here is shared.
   ============================================================ */

/* ---------- two practices ---------- */
.practices{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.practice{
  background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:36px 36px 32px;display:flex;flex-direction:column;
}
.practice.p-agentic{background:var(--dark);border-color:var(--dark);color:#EDEFF5}
.practice .pr-k{
  font-family:var(--font-m);font-size:10px;font-weight:600;letter-spacing:.15em;
  text-transform:uppercase;color:var(--blue);margin-bottom:18px;
}
.practice.p-agentic .pr-k{color:#8AA3FF}
.practice h3{
  font-family:var(--font-d);font-weight:500;font-size:clamp(24px,2.8vw,32px);
  line-height:1.12;letter-spacing:-.03em;margin-bottom:14px;max-width:20ch;
}
.practice > p{color:var(--muted);font-size:15px;line-height:1.6;margin-bottom:24px;max-width:46ch}
.practice.p-agentic > p{color:var(--dark-mut)}
.practice ul{list-style:none;margin:0 0 26px;padding:0;border-top:1px solid var(--line)}
.practice.p-agentic ul{border-top-color:var(--dark-line)}
.practice li{
  display:grid;grid-template-columns:150px 1fr;gap:16px;padding:13px 0;
  border-bottom:1px solid var(--line);font-size:14px;line-height:1.5;color:var(--ink-2);
}
.practice.p-agentic li{border-bottom-color:var(--dark-line);color:#D5DAE6}
.practice li b{font-family:var(--font-d);font-weight:500;color:var(--ink)}
.practice.p-agentic li b{color:#fff}
.practice .link-arrow{margin-top:auto}
.practice.p-agentic .link-arrow{color:#8AA3FF}

/* ---------- services grid (reuses .svc-card) ---------- */
/* Pointer-driven vars, set by assets/js/home-v2.js:
   --mx/--my  cursor position in px inside the section
   --px/--py  cursor offset from centre, -1…1 (eased)
   --spot     0…1, fades in while the pointer is over the section */
.v2-services{
  --mx:50%;--my:50%;--px:0;--py:0;--spot:0;
  padding:120px 0;border-block:1px solid var(--line);
  /* soft light that follows the cursor */
  background:
    radial-gradient(340px circle at var(--mx) var(--my),rgba(28,92,255,calc(.12 * var(--spot))),transparent 70%),
    var(--bg-elev);
  position:relative;overflow:hidden;isolation:isolate;
}
.v2-services > .container{position:relative;z-index:1}
/* ambient background: a drifting dot grid, faded out towards the edges… */
.v2-services::before,
.v2-services .v2-spot{
  content:"";position:absolute;inset:-40px;z-index:-1;pointer-events:none;
  background-size:26px 26px;
  animation:v2-grid 26s linear infinite;
  /* grid leans slightly away from the cursor */
  translate:calc(var(--px) * -14px) calc(var(--py) * -14px);
}
.v2-services::before{
  background-image:radial-gradient(rgba(28,92,255,.40) 1.2px,transparent 1.8px);
  -webkit-mask-image:radial-gradient(ellipse 80% 75% at 50% 55%,#000 40%,transparent 88%);
          mask-image:radial-gradient(ellipse 80% 75% at 50% 55%,#000 40%,transparent 88%);
}
/* the same grid, bolder, revealed only in a circle around the cursor.
   Mask coords are offset by the -40px inset and the lean above. */
.v2-services .v2-spot{
  background-image:radial-gradient(rgba(28,92,255,.95) 1.6px,transparent 2.2px);
  --sx:calc(var(--mx) + 40px + var(--px) * 14px);
  --sy:calc(var(--my) + 40px + var(--py) * 14px);
  -webkit-mask-image:radial-gradient(200px circle at var(--sx) var(--sy),#000,transparent 75%);
          mask-image:radial-gradient(200px circle at var(--sx) var(--sy),#000,transparent 75%);
  opacity:var(--spot);
}
/* …and two soft brand glows wandering slowly behind the cards, drawn towards the cursor */
.v2-services::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(520px 400px at 22% 38%,rgba(28,92,255,.24),transparent 70%),
    radial-gradient(480px 380px at 78% 70%,rgba(138,107,255,.22),transparent 70%);
  animation:v2-glow 16s ease-in-out infinite alternate;
  translate:calc(var(--px) * 60px) calc(var(--py) * 40px);
}
@keyframes v2-grid{to{background-position:26px 26px}}
@keyframes v2-glow{
  0%  {transform:translate3d(0,0,0) scale(1)}
  50% {transform:translate3d(10%,-7%,0) scale(1.1)}
  100%{transform:translate3d(-9%,8%,0) scale(1)}
}
@media(prefers-reduced-motion:reduce){
  .v2-services::before,.v2-services::after,.v2-services .v2-spot{animation:none}
  .pill::before,.run-steps li .bar i{animation:none!important}
}
.v2-services .svc-cards{grid-template-columns:repeat(3,1fr)}
/* isometric service icons (same kit as the illustrations) */
.v2-services .svc-icon{width:76px;height:76px;background:none;border-radius:0;margin:-6px 0 14px -8px}
.v2-services .svc-icon svg{width:100%;height:100%}
.v2-services .svc-card:hover .svc-icon{transform:translateY(-4px)}
.svc-card .deliv{
  margin:4px 0 14px;font-family:var(--font-m);font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--blue);line-height:1.7;
}

/* ---------- agent anatomy ---------- */
.anatomy{padding:130px 0}
.anatomy-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:56px;align-items:start}
.anatomy-grid .how-visual{position:sticky;top:calc(var(--nav-h) + 30px)}
.app-note{margin-top:18px;max-width:440px;color:var(--muted);font-size:14.5px;line-height:1.6}
.parts{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.part{display:grid;grid-template-columns:1fr;gap:14px;padding:22px 0;border-bottom:1px solid var(--line)}
.part{position:relative;transition:background .4s var(--ease)}
.part::before{
  content:"";position:absolute;left:-14px;top:22px;bottom:22px;width:2px;background:var(--blue);
  transform:scaleY(0);transition:transform .4s var(--ease);
}
.part.is-live{background:linear-gradient(90deg,var(--blue-tint),transparent 80%)}
.part.is-live::before{transform:scaleY(1)}
.part .pn{font-family:var(--font-m);font-size:11px;color:var(--blue);padding-top:4px}

/* ---------- agent console mock (driven by home-v2.js) ----------
   States on .app: is-playing → is-waiting (approval) → is-finished → is-resetting
   States on each step li: is-running / is-wait / is-done (+ is-approved on the gate) */
.app{
  --ok:#17A36B;--ok-t:#E3F6EC;--wait:#C98A12;--wait-t:#FDF4DF;--sub:#8A93A3;
  background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;
  box-shadow:0 1px 2px rgba(5,6,10,.04),0 24px 60px -18px rgba(15,40,110,.22);
  font-family:var(--font-b);font-size:12.5px;color:var(--ink-2);
}
.app-bar{
  display:flex;align-items:center;gap:14px;height:38px;padding:0 14px;
  background:#F6F8FB;border-bottom:1px solid var(--line);
}
.app-bar .lights{display:flex;gap:6px}
.app-bar .lights i{width:10px;height:10px;border-radius:50%;background:#E1E5EC}
.app-bar .lights i:nth-child(1){background:#FF6159}
.app-bar .lights i:nth-child(2){background:#FFBD2E}
.app-bar .lights i:nth-child(3){background:#28C941}
.app-bar .crumb{font-size:12px;color:var(--sub)}
.app-bar .crumb b{font-weight:400;margin:0 4px;opacity:.6}
.app-bar .crumb span{color:var(--ink);font-weight:500}
.app-bar .env{
  margin-left:auto;font-family:var(--font-m);font-size:10px;color:var(--sub);
  padding:3px 8px;border:1px solid var(--line);border-radius:20px;background:#fff;
}
.app-body{display:grid;grid-template-columns:132px 1fr}

/* sidebar */
.app-side{border-right:1px solid var(--line);background:#FAFBFD;padding:14px 10px}
.side-k{
  font-family:var(--font-m);font-size:9px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--sub);margin:0 6px 8px;
}
.side-k:not(:first-child){margin-top:18px}
.side-runs{list-style:none;margin:0;padding:0}
.side-runs li{
  display:grid;grid-template-columns:8px 1fr auto;align-items:center;gap:8px;
  padding:6px;border-radius:6px;font-family:var(--font-m);font-size:11px;color:var(--ink-2);
}
.side-runs li.cur{background:var(--blue-tint);color:var(--blue-ink)}
.side-runs .rt{font-size:10px;color:var(--sub)}
.side-runs .sd{width:7px;height:7px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 3px rgba(28,92,255,.18)}
.side-runs .sd.ok{background:var(--ok);box-shadow:none}
.side-runs .sd.hand{background:var(--wait);box-shadow:none}
.side-stat{padding:3px 6px;font-size:11.5px;color:var(--sub)}
.side-stat b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}

/* main pane */
.app-main{min-width:0;display:flex;flex-direction:column}
.run-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 18px 12px}
.run-name{font-family:var(--font-d);font-size:16px;font-weight:500;color:var(--ink);letter-spacing:-.01em}
.run-name span{color:var(--sub);font-weight:400}
.run-meta{margin-top:3px;font-size:11.5px;color:var(--sub)}
.pill{
  flex:none;display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:20px;
  font-size:11px;font-weight:600;background:var(--blue-tint);color:var(--blue-ink);
  transition:background .3s,color .3s;
}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;animation:blink 1.4s infinite}
.pill .p-wait,.pill .p-done{display:none}
.app.is-waiting .pill{background:var(--wait-t);color:var(--wait)}
.app.is-waiting .pill .p-run{display:none}
.app.is-waiting .pill .p-wait{display:inline}
.app.is-finished .pill{background:var(--ok-t);color:var(--ok)}
.app.is-finished .pill::before{animation:none}
.app.is-finished .pill .p-run{display:none}
.app.is-finished .pill .p-done{display:inline}

.run-task{
  display:flex;gap:10px;margin:0 18px 12px;padding:9px 12px;border-radius:6px;
  background:#F6F8FB;border:1px solid var(--line-soft);line-height:1.45;color:var(--ink);
}
.run-task .k,.run-foot b{
  flex:none;font-family:var(--font-m);font-size:9px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--sub);padding-top:.25em;
}
.tabs{display:flex;gap:18px;padding:0 18px;border-bottom:1px solid var(--line);font-size:12px;color:var(--sub)}
.tabs span{padding:8px 0 9px;border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs .on{color:var(--ink);font-weight:500;border-bottom-color:var(--blue)}

/* trace rows */
.run-steps{list-style:none;margin:0;padding:6px 0}
.run-steps li{
  display:grid;grid-template-columns:16px 20px minmax(0,1fr) 34% 38px;align-items:center;gap:9px;
  padding:7px 18px;transition:opacity .35s var(--ease),background .35s var(--ease);
}
.run-steps .nm{font-family:var(--font-m);font-size:11.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.run-steps .nm em{font-style:normal;color:var(--sub);margin-left:4px}
.run-steps .tm{font-family:var(--font-m);font-size:10.5px;color:var(--sub);text-align:right;font-variant-numeric:tabular-nums;transition:opacity .3s}

/* step type icons */
.run-steps .ic{width:20px;height:20px;border-radius:5px;display:grid;place-items:center;background:var(--blue-tint)}
.run-steps .ic::before{content:"";width:10px;height:10px;background:var(--blue);-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.ic-plan {--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0l5 5-5 5-5-5z'/%3E%3C/svg%3E")}
.ic-doc  {--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1 0h5l3 3v7H1zM3 5h4v1H3zm0 2h4v1H3z'/%3E%3C/svg%3E")}
.ic-tool {--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3 1L0 5l3 4 1-1-2-3 2-3zm4 0L6 2l2 3-2 3 1 1 3-4z'/%3E%3C/svg%3E")}
.ic-mem  {--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cellipse cx='5' cy='2' rx='4' ry='1.6'/%3E%3Cpath d='M1 3.5c1 1.3 7 1.3 8 0V6c-1 1.3-7 1.3-8 0zm0 3.5c1 1.3 7 1.3 8 0v1c-1 1.8-7 1.8-8 0z'/%3E%3C/svg%3E")}
.ic-guard{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0l4 1.5V5c0 2.6-1.8 4.3-4 5-2.2-.7-4-2.4-4-5V1.5z'/%3E%3C/svg%3E")}
.ic-act  {--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M6 0L1 6h3l-1 4 5-6H5z'/%3E%3C/svg%3E")}
.run-steps .ic-plan{background:#EFEAFF}.run-steps .ic-plan::before{background:var(--violet)}
.run-steps .ic-guard{background:var(--wait-t)}.run-steps .ic-guard::before{background:var(--wait)}
.run-steps .ic-act{background:var(--ok-t)}.run-steps .ic-act::before{background:var(--ok)}

/* waterfall: bar sits at --s% and spans --w% of the run's 3.9s */
.run-steps .bar{position:relative;height:6px;border-radius:3px;background:var(--line-soft)}
.run-steps .bar i{
  position:absolute;top:0;bottom:0;left:calc(var(--s) * 1%);width:calc(var(--w) * 1%);
  min-width:3px;border-radius:3px;background:var(--blue);transform-origin:left;
}
.run-steps .gate .bar i{background:var(--wait)}

/* status: pending ○, running spinner, waiting ‖, done ✓ */
.run-steps .st{position:relative;width:14px;height:14px;border-radius:50%;border:1.5px solid #D5DAE3}
.run-steps .st::after{content:"";position:absolute;opacity:0}
.run-steps li.is-running .st{border-color:rgba(28,92,255,.2);border-top-color:var(--blue);animation:run-spin .8s linear infinite}
.run-steps li.is-running,.run-steps li.is-wait{background:#F6F8FF}
.run-steps li.is-wait .st{border-color:var(--wait)}
.run-steps li.is-wait .st::after{opacity:1;left:3.2px;top:2.7px;width:4.5px;height:5.5px;border-left:1.5px solid var(--wait);border-right:1.5px solid var(--wait)}
.run-steps li.is-wait{background:#FFFBF1}
.run-steps li.is-done .st{background:var(--ok);border-color:var(--ok)}
.run-steps li.is-done .st::after{opacity:1;left:3.6px;top:1.4px;width:3.5px;height:6.5px;border:solid #fff;border-width:0 1.6px 1.6px 0;transform:rotate(45deg)}
@keyframes run-spin{to{transform:rotate(360deg)}}

/* playback: pending rows dim, bars grow while a step runs, timings appear when done */
.app.is-playing .run-steps li:not(.is-running):not(.is-wait):not(.is-done){opacity:.4}
.app.is-playing .run-steps li:not(.is-done) .tm{opacity:0}
.app.is-playing .run-steps li:not(.is-running):not(.is-wait):not(.is-done) .bar i{transform:scaleX(0)}
.app.is-playing .run-steps li.is-running .bar i{animation:bar-grow .9s linear both}
/* the gate's bar spans running + waiting as one continuous grow */
.app.is-playing .run-steps li.gate.is-running .bar i,
.app.is-playing .run-steps li.gate.is-wait .bar i{animation:bar-grow 3.3s linear both}
@keyframes bar-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* approval card */
.run-steps .approve{
  grid-column:3 / -1;display:flex;align-items:center;gap:10px;margin-top:8px;padding:9px 10px;
  border:1px solid #F1DDB0;border-radius:8px;background:#fff;
  box-shadow:0 6px 18px -10px rgba(201,138,18,.45);transition:opacity .35s var(--ease),border-color .3s,box-shadow .3s;
}
.run-steps .approve .av{
  flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;
  background:var(--wait-t);color:var(--wait);font-family:var(--font-m);font-size:9px;font-weight:600;
}
.run-steps .approve .who{display:flex;flex-direction:column;min-width:0;font-size:11.5px;line-height:1.35}
.run-steps .approve .who b{color:var(--ink);font-weight:600}
.run-steps .approve .who > span{color:var(--sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.run-steps .approve .btns{display:flex;gap:6px;margin-left:auto}
.run-steps .approve .b{
  font-size:11px;font-weight:500;padding:5px 10px;border-radius:6px;border:1px solid var(--line);
  color:var(--ink-2);background:#fff;transition:transform .15s,background .25s,box-shadow .25s;
}
.run-steps .approve .b.ok{background:var(--ink);border-color:var(--ink);color:#fff}
.run-steps .approve .w-ok,.run-steps li.is-approved .approve .w-wait{display:none}
.run-steps li.is-approved .approve .w-ok{display:inline;color:var(--ok)}
.run-steps li.is-approved .approve{border-color:#BFE8D3;box-shadow:none}
.run-steps li.is-approved .approve .av{background:var(--ok-t);color:var(--ok)}
.run-steps li.is-approved .approve .b.ok{background:var(--ok);border-color:var(--ok);transform:scale(.95);box-shadow:0 0 0 4px rgba(23,163,107,.18)}
.app.is-playing .gate:not(.is-wait):not(.is-done) .approve{opacity:0}

.run-foot{
  display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:12px;padding:10px 18px;
  border-top:1px solid var(--line);background:#FAFBFD;
  font-family:var(--font-m);font-size:10.5px;color:var(--sub);transition:opacity .4s var(--ease);
}
.run-foot b{padding:0}
.run-foot .ev{color:var(--ok);margin-left:auto;font-weight:600}
.app.is-playing:not(.is-finished) .run-foot{opacity:.35}
.app.is-resetting .run-steps,.app.is-resetting .run-foot{opacity:0;transition:opacity .4s}

@media(max-width:760px){
  .app-body{grid-template-columns:1fr}
  .app-side{display:none}
  .app-bar .env{display:none}
  .run-steps li{grid-template-columns:16px 20px minmax(0,1fr) 38px}
  .run-steps .bar{display:none}
  .run-steps .approve{grid-column:1 / -1}
  .run-steps .approve .b:not(.ok){display:none}
}
.part h4{font-family:var(--font-d);font-size:19px;font-weight:500;letter-spacing:-.02em;margin-bottom:6px}
.part p{font-size:14.5px;color:var(--muted);line-height:1.6}

/* ---------- agents at work ---------- */
.usecases{padding:0 0 130px}
.uc-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.uc{
  padding:28px 26px 26px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  transition:background .3s var(--ease);
}
.uc:hover{background:var(--blue-tint)}
.uc .fn{font-family:var(--font-m);font-size:10px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
.uc h4{font-family:var(--font-d);font-size:19px;font-weight:500;letter-spacing:-.02em;margin:12px 0 8px}
.uc p{font-size:14px;color:var(--ink-2);line-height:1.55}
.uc .hitl{
  display:flex;gap:8px;margin-top:16px;padding-top:14px;border-top:1px dashed var(--line);
  font-size:12.5px;color:var(--muted);line-height:1.5;
}
.uc .hitl::before{content:"";flex:none;width:6px;height:6px;margin-top:.5em;border-radius:50%;background:var(--mint)}

/* ---------- the shift: copy left, pilot → production illustration right ---------- */
.shift-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:40px;align-items:center}
.shift-grid .shift-statement{max-width:none}
.shift-grid .shift-statement .glow{display:inline-block}
.shift-ill svg{width:100%;height:auto;max-width:700px;margin-inline:auto;display:block}

/* ---------- engagement models ---------- */
.engage{padding:130px 0}
.eng-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.eng{
  border:1px solid var(--line);border-radius:var(--radius-sm);padding:30px 28px;
  display:flex;flex-direction:column;background:var(--bg);
}
.eng.featured{border-color:var(--blue);box-shadow:var(--shadow-blue)}
.eng .dur{font-family:var(--font-m);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.eng h4{font-family:var(--font-d);font-size:24px;font-weight:500;letter-spacing:-.025em;margin:12px 0 10px}
.eng > p{font-size:14.5px;color:var(--muted);line-height:1.6;margin-bottom:20px}
.eng .yg{font-family:var(--font-m);font-size:9.5px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--ink);margin-bottom:10px}
.eng ul{list-style:none;margin:0 0 24px;padding:0}
.eng li{display:flex;gap:10px;font-size:14px;color:var(--ink-2);line-height:1.5;margin-bottom:9px}
.eng li::before{content:"■";flex:none;font-size:8px;color:var(--blue);padding-top:.45em}
.eng .btn{margin-top:auto;align-self:flex-start}

/* ---------- industries ---------- */
.industries{padding:120px 0 0}
.ind-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.ind{border-radius:var(--radius-sm);padding:24px 22px;min-height:170px;display:flex;flex-direction:column;justify-content:space-between}
.ind:nth-child(6n+1){background:var(--tint-1)}
.ind:nth-child(6n+2){background:var(--tint-2)}
.ind:nth-child(6n+3){background:var(--tint-3)}
.ind:nth-child(6n+4){background:var(--tint-4)}
.ind:nth-child(6n+5){background:var(--green-tint)}
.ind:nth-child(6n+6){background:var(--amber-tint)}
.ind h4{font-family:var(--font-d);font-size:20px;font-weight:500;letter-spacing:-.02em}
.ind p{font-size:13.5px;line-height:1.5;opacity:.7;margin-top:10px}

/* ---------- trust & governance ---------- */
.trust{padding:120px 0}
.trust-top{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center;margin-bottom:56px}
.trust-top h2{font-size:clamp(34px,4.4vw,54px);margin-top:16px}
.trust-lede{margin-top:18px;max-width:420px;color:var(--muted);font-size:15px;line-height:1.65}
.trust-ill svg{width:100%;height:auto;max-width:700px;margin-inline:auto;display:block}
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}
.tr{padding:28px 26px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg)}
.tr:nth-child(3n){border-right:none}
.tr:nth-last-child(-n+3){border-bottom:none}
.tr .tk{font-family:var(--font-m);font-size:10px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--blue)}
.tr h4{font-family:var(--font-d);font-size:18px;font-weight:500;letter-spacing:-.02em;margin:10px 0 8px}
.tr p{font-size:14px;color:var(--muted);line-height:1.55}
.trust-note{margin-top:18px;font-size:12.5px;color:var(--muted);max-width:760px}

/* ---------- FAQ ---------- */
.faq{padding:120px 0;background:var(--bg-elev);border-top:1px solid var(--line)}
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start}
.faq-list{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;
  padding:22px 0;font-family:var(--font-d);font-size:18px;font-weight:500;letter-spacing:-.015em;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font-family:var(--font-m);color:var(--blue);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 40px 22px 0;font-size:15px;color:var(--ink-2);line-height:1.65}
.faq summary:focus-visible{outline:2px solid var(--blue);outline-offset:4px}

@media(max-width:1020px){
  .trust-top{grid-template-columns:1fr;gap:28px}
  .shift-grid{grid-template-columns:1fr;gap:28px}
  .shift-ill svg{max-width:560px}
  .practices,.anatomy-grid,.faq-grid{grid-template-columns:1fr}
  .anatomy-grid{gap:48px}
  .anatomy-grid .how-visual{position:static}
  .faq-grid{gap:30px}
  .v2-services .svc-cards,.uc-grid,.ind-grid,.eng-grid{grid-template-columns:repeat(2,1fr)}
  .trust-grid{grid-template-columns:repeat(2,1fr)}
  .tr:nth-child(3n){border-right:1px solid var(--line)}
  .tr:nth-child(2n){border-right:none}
  .tr:nth-last-child(-n+3){border-bottom:1px solid var(--line)}
  .tr:nth-last-child(-n+2){border-bottom:none}
}
@media(max-width:760px){
  .v2-services .svc-cards,.uc-grid,.ind-grid,.eng-grid,.trust-grid{grid-template-columns:1fr}
  .tr,.tr:nth-child(3n){border-right:none}
  .tr:nth-last-child(-n+2){border-bottom:1px solid var(--line)}
  .tr:last-child{border-bottom:none}
  .practice{padding:28px 22px}
  .practice li{grid-template-columns:1fr;gap:2px}
  .anatomy,.engage{padding:90px 0}
  .usecases{padding-bottom:90px}
  .v2-services,.trust,.faq{padding:80px 0}
  .industries{padding-top:80px}
}

/* ============================================================
   HERO — background artwork anchored right, left tip tucks under the headline
   ============================================================ */
.hero h1{font-size:clamp(32px,3.1vw,42px);margin:24px 0 20px;max-width:none}
.hero-lede{font-size:clamp(16px,1.4vw,18px);max-width:480px}
.hero-sub{max-width:480px}
.hero-inner{grid-template-columns:1fr;width:100%}
/* hero art is near-square: the text column is capped at 560px and the art takes the
   space to its right, minus a fixed 72px gap, so the two never crowd each other */
.hero .hero-inner>div{max-width:560px}
@media(min-width:1201px){.hero .hero-meta{width:max-content;max-width:none;flex-wrap:nowrap}}
.hero-bg-art{
  --art-r:max(16px,calc((100vw - 1180px)/2 - 40px));
  --text-l:max(26px,calc((100vw - 1180px)/2 + 26px));
  position:absolute;z-index:1;right:var(--art-r);top:50%;transform:translateY(-46%);
  width:min(660px,78vh,calc(100vw - var(--art-r) - var(--text-l) - 560px - 72px));
  height:auto;pointer-events:none;user-select:none;
}
@media(max-width:1020px){
  .hero-bg-art{top:auto;bottom:-2%;transform:none;right:-24vw;width:118vw;opacity:.4}
}

/* ---------- three practices + grouped services ---------- */
.practices.three{grid-template-columns:repeat(3,1fr)}
.practices.three .practice{padding:32px 28px 28px}
.practices.three .practice h3{font-size:clamp(22px,2.2vw,27px)}
.practices.three .practice li{grid-template-columns:1fr;gap:2px}
.svc-group-h{
  display:flex;justify-content:space-between;align-items:baseline;margin:0 0 16px;padding-bottom:12px;
  border-bottom:1px solid var(--line);font-family:var(--font-m);font-size:11px;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;color:var(--ink-2);
}
.svc-group-h .c{color:var(--blue)}
.svc-cards + .svc-group-h{margin-top:56px}
.fc-line a{color:inherit}
@media(max-width:1020px){.practices.three{grid-template-columns:1fr}}
/* hero-style service icons are wider than tall */
.v2-services .svc-icon{width:112px;height:79px;margin:-8px 0 14px -6px}

/* ============================================================
   SERVICES PAGE (services.html)
   ============================================================ */
.svd-sec{padding:110px 0}
.svd-sec.alt{background:var(--bg-elev)}
.svd-jump{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}
.svd-jump a{
  display:inline-flex;gap:14px;align-items:center;padding:11px 16px;border:1px solid var(--line);border-radius:4px;
  background:rgba(255,255,255,.75);font-family:var(--font-m);font-size:11px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-2);transition:border-color .2s,color .2s;
}
.svd-jump a span{color:var(--blue)}
.svd-jump a:hover{border-color:var(--blue);color:var(--blue)}
.svd{
  display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.6fr);gap:48px;padding:44px 0;
  border-top:1px solid var(--line);scroll-margin-top:calc(var(--nav-h) + 24px);
}
.svd:last-child{border-bottom:1px solid var(--line)}
.svd-head{display:flex;flex-direction:column;align-items:flex-start}
.svd-n{font-family:var(--font-m);font-size:11px;font-weight:600;letter-spacing:.14em;color:var(--blue)}
.svd-ico{display:block;width:120px;height:84px;margin:10px 0 12px -8px}
.svd-ico svg{width:100%;height:100%}
.svd-head h3{font-family:var(--font-d);font-weight:500;font-size:clamp(22px,2.2vw,27px);letter-spacing:-.025em;line-height:1.15}
.svd-head .deliv{
  margin-top:10px;font-family:var(--font-m);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);
}
.svd-lead{font-size:clamp(17px,1.5vw,19px);line-height:1.55;color:var(--ink);max-width:56ch;margin-bottom:26px}
.svd-cols{display:grid;grid-template-columns:1.25fr 1fr;gap:32px}
.svd-more{margin-top:24px}
.g-eng .svd-more{color:var(--peach-ink)}
.svd-cols h4{
  font-family:var(--font-m);font-size:10px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;
  color:var(--muted);margin-bottom:12px;
}
.svd-cols ul{list-style:none;margin:0;padding:0}
.svd-cols li{
  position:relative;padding:9px 0 9px 20px;border-top:1px solid var(--line-soft);font-size:14.5px;line-height:1.5;color:var(--ink-2);
}
.svd-cols li::before{content:"";position:absolute;left:0;top:16px;width:8px;height:8px;border:1.5px solid var(--blue);border-radius:1px}
.svd-cols .leave li::before{background:var(--blue)}
.svd-engage{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.svd-engage > div{border:1px solid var(--line);border-radius:var(--radius-sm);padding:28px 26px;background:var(--bg)}
.svd-engage .k{font-family:var(--font-m);font-size:10px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--blue)}
.svd-engage h4{font-family:var(--font-d);font-weight:500;font-size:21px;letter-spacing:-.02em;margin:14px 0 8px}
.svd-engage p{font-size:14.5px;line-height:1.55;color:var(--muted)}
.svd-fit{
  margin-top:28px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;
  padding:28px 30px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--blue-tint);
}
.svd-fit p{font-family:var(--font-d);font-size:clamp(19px,2vw,24px);letter-spacing:-.02em;color:var(--ink)}
.svd-fit p span{color:var(--blue)}
@media(max-width:1020px){
  .svd{grid-template-columns:1fr;gap:18px}
  .svd-engage{grid-template-columns:1fr}
}
@media(max-width:640px){
  .svd-sec{padding:80px 0}
  .svd-cols{grid-template-columns:1fr;gap:22px}
}

/* ============================================================
   COLOUR ROLES — the four brand pastels, each with one meaning
     lavender  advise / strategy        blue   AI / agents
     peach     software engineering     pink   run / people / trust
   Pastels are fills only; text on or beside them uses the matching ink.
   ============================================================ */
:root{
  --lav-ink:#4B3FC4;  --peach-ink:#A3431C;  --pink-ink:#9C2B74;
  --blue-wash:#EEF3FF; --lav-wash:#F4F3FF; --peach-wash:#FFF5F0; --pink-wash:#FEF4FB;
}

/* practices: advise = lavender, agentic stays dark, engineering = peach */
.practice.p-advise{background:var(--tint-4);border-color:transparent}
.practice.p-eng{background:var(--tint-3);border-color:transparent}
.practice.p-advise .pr-k,.practice.p-advise .link-arrow{color:var(--lav-ink)}
.practice.p-eng .pr-k,.practice.p-eng .link-arrow{color:var(--peach-ink)}
.practice.p-advise ul,.practice.p-advise li{border-color:rgba(75,63,196,.18)}
.practice.p-eng ul,.practice.p-eng li{border-color:rgba(163,67,28,.18)}
.practice.p-advise > p,.practice.p-eng > p{color:var(--ink-2)}

/* home services: group colour on the header marker, hover wash and hover bar */
.svc-group-h .g{display:inline-flex;align-items:center;gap:10px}
.svc-group-h .g::before{content:"";width:10px;height:10px;border-radius:2px}
.svc-group-h.g-ai .g::before{background:var(--tint-1);box-shadow:inset 0 0 0 1.5px var(--blue)}
.svc-group-h.g-eng .g::before{background:var(--tint-3);box-shadow:inset 0 0 0 1.5px var(--peach-ink)}
.svc-group-h.g-eng .c{color:var(--peach-ink)}
.v2-services .g-ai .svc-card:hover{background:var(--blue-wash)}
.v2-services .g-eng .svc-card:hover{background:var(--peach-wash)}
.v2-services .g-eng .svc-card::after{background:var(--peach-ink)}
.v2-services .g-eng .svc-card .deliv,.v2-services .g-eng .svc-card .more{color:var(--peach-ink)}

/* engagement models: discovery = lavender, pilot stays featured, operations = pink */
.eng.t-lav{background:var(--tint-4);border-color:transparent}
.eng.t-pink{background:var(--tint-2);border-color:transparent}
.eng.t-lav .dur,.eng.t-lav li::before{color:var(--lav-ink)}
.eng.t-pink .dur,.eng.t-pink li::before{color:var(--pink-ink)}
.eng.t-lav > p,.eng.t-pink > p{color:var(--ink-2)}
.eng.featured .dur{background:var(--tint-1);color:var(--blue-ink);padding:5px 9px;border-radius:3px;align-self:flex-start}

/* trust & governance: each control gets a coloured key */
.tr .tk{display:inline-block;padding:5px 9px;border-radius:3px;background:var(--tint-1);color:var(--blue-ink)}
.tr:nth-child(4n+2) .tk{background:var(--tint-4);color:var(--lav-ink)}
.tr:nth-child(4n+3) .tk{background:var(--tint-2);color:var(--pink-ink)}
.tr:nth-child(4n+4) .tk{background:var(--tint-3);color:var(--peach-ink)}

/* services page */
.svd-jump a.j-ai{background:var(--tint-1);border-color:transparent;color:var(--blue-ink)}
.svd-jump a.j-eng{background:var(--tint-3);border-color:transparent;color:var(--peach-ink)}
.svd-jump a.j-ai span{color:var(--blue-ink)} .svd-jump a.j-eng span{color:var(--peach-ink)}
.svd-jump a.j-ai:hover{border-color:var(--blue)} .svd-jump a.j-eng:hover{border-color:var(--peach-ink)}
.svd-sec.g-eng{background:var(--peach-wash)}
.g-eng .eyebrow,.g-eng .svd-n,.g-eng .svd-head .deliv{color:var(--peach-ink)}
.g-eng .svd-cols li::before{border-color:var(--peach-ink)}
.g-eng .svd-cols .leave li::before{background:var(--peach-ink)}
.g-eng .svd{border-color:rgba(163,67,28,.16)}
.svd-engage > div.t-lav{background:var(--tint-4);border-color:transparent}
.svd-engage > div.t-blue{background:var(--tint-1);border-color:transparent}
.svd-engage > div.t-pink{background:var(--tint-2);border-color:transparent}
.svd-engage > div.t-lav .k{color:var(--lav-ink)}
.svd-engage > div.t-blue .k{color:var(--blue-ink)}
.svd-engage > div.t-pink .k{color:var(--pink-ink)}
.svd-engage > div[class^="t-"] p{color:var(--ink-2)}

/* contact page: the three next steps */
.book-why .why-item:nth-of-type(1) .wi{background:var(--tint-4);color:var(--lav-ink)}
.book-why .why-item:nth-of-type(2) .wi{background:var(--tint-1);color:var(--blue-ink)}
.book-why .why-item:nth-of-type(3) .wi{background:var(--tint-2);color:var(--pink-ink)}

/* ============================================================
   ABOUT PAGE (about.html) — colours follow the roles above
   ============================================================ */
.ab-sec{padding:110px 0}
.ab-sec.alt{background:var(--bg-elev)}
.ab-timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;position:relative}
.ab-step,.ab-pr{border-radius:var(--radius-sm);padding:30px 28px}
.ab-step .k{font-family:var(--font-d);font-size:clamp(30px,3vw,40px);font-weight:500;letter-spacing:-.03em;line-height:1}
.ab-step h4,.ab-pr h4{font-family:var(--font-d);font-weight:500;font-size:20px;letter-spacing:-.02em;margin:18px 0 8px}
.ab-step p,.ab-pr p{font-size:14.5px;line-height:1.6;color:var(--ink-2)}
.t-peach{background:var(--tint-3)} .t-pink{background:var(--tint-2)} .t-blue{background:var(--tint-1)} .t-lav{background:var(--tint-4)}
.ab-step.t-peach .k,.ab-pr.t-peach .n{color:var(--peach-ink)}
.ab-step.t-pink .k,.ab-pr.t-pink .n{color:var(--pink-ink)}
.ab-step.t-blue .k,.ab-pr.t-blue .n{color:var(--blue-ink)}
.ab-pr.t-lav .n{color:var(--lav-ink)}
.ab-principles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ab-pr .n{font-family:var(--font-m);font-size:11px;font-weight:600;letter-spacing:.14em}
.ab-lead{display:grid;grid-template-columns:1.2fr 1fr;gap:16px}
.ab-person{display:flex;gap:26px;align-items:flex-start;border:1px solid var(--line);border-radius:var(--radius-sm);padding:34px}
.ab-avatar{
  flex:none;width:84px;height:84px;border-radius:6px;display:grid;place-items:center;
  background:var(--tint-1);color:var(--blue-ink);font-family:var(--font-d);font-size:28px;font-weight:500;letter-spacing:-.02em;
}
.ab-person h3{font-family:var(--font-d);font-weight:500;font-size:26px;letter-spacing:-.025em}
.ab-person .role{display:block;font-family:var(--font-m);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--blue);margin:6px 0 14px}
.ab-person p{font-size:15px;line-height:1.65;color:var(--ink-2);max-width:52ch}
.ab-team{border-radius:var(--radius-sm);padding:34px;background:var(--dark);color:#EDEFF5;display:flex;flex-direction:column;gap:16px}
.ab-team .eyebrow{color:#8AA3FF}
.ab-team p{font-family:var(--font-d);font-size:clamp(19px,1.8vw,23px);line-height:1.35;letter-spacing:-.02em}
.ab-team .link-arrow{margin-top:auto;color:#8AA3FF}
.ab-logos-label{display:inline-flex;margin-bottom:22px}
.ab-logos{padding:30px 0;border-block:1px solid var(--line)}
@media(max-width:1020px){
  .ab-timeline,.ab-lead{grid-template-columns:1fr}
  .ab-principles{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .ab-sec{padding:80px 0}
  .ab-principles{grid-template-columns:1fr}
  .ab-person{flex-direction:column;padding:26px}
}

/* ============================================================
   WORK PAGE — case cards without a detail page don't lift; industry tags use the colour roles
   ============================================================ */
article.case-card{cursor:default}
article.case-card:hover{transform:none;box-shadow:none}
.work-grid .case-card .cc-ind{display:inline-flex;align-self:flex-start;padding:5px 9px;border-radius:3px}
.work-grid .case-card:nth-child(1) .cc-ind{background:var(--tint-4);color:var(--lav-ink)}
.work-grid .case-card:nth-child(2) .cc-ind{background:var(--tint-2);color:var(--pink-ink)}
.work-grid .case-card:nth-child(3) .cc-ind{background:var(--tint-3);color:var(--peach-ink)}

/* ============================================================
   HOW WE WORK — the five steps take the colour roles
   discover/design = advise (lavender) · build = engineering (peach) · deploy = AI (blue) · monitor = run (pink)
   ============================================================ */
.steps .step .marker{border-width:2px}
.steps .step:nth-child(1) .marker,.steps .step:nth-child(2) .marker{border-color:var(--lav-ink);background:var(--tint-4)}
.steps .step:nth-child(3) .marker{border-color:var(--peach-ink);background:var(--tint-3)}
.steps .step:nth-child(4) .marker{border-color:var(--blue);background:var(--tint-1)}
.steps .step:nth-child(5) .marker{border-color:var(--pink-ink);background:var(--tint-2)}
.steps .step:nth-child(1) .s-num,.steps .step:nth-child(2) .s-num{color:var(--lav-ink)}
.steps .step:nth-child(3) .s-num{color:var(--peach-ink)}
.steps .step:nth-child(4) .s-num{color:var(--blue-ink)}
.steps .step:nth-child(5) .s-num{color:var(--pink-ink)}
.steps .step.hl .hl-tag{background:var(--tint-3);color:var(--peach-ink);border-color:transparent}

/* ============================================================
   CASE STUDY · LEGAL · 404
   ============================================================ */
.cs-h1{max-width:20ch}
.cs-story{border-top:1px solid var(--line)}
.cs-row{display:grid;grid-template-columns:180px 1fr;gap:32px;padding:28px 0;border-bottom:1px solid var(--line);align-items:baseline}
.cs-row .k{
  justify-self:start;padding:6px 11px;border-radius:3px;font-family:var(--font-m);font-size:10.5px;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;
}
.cs-row .k.t-lav{color:var(--lav-ink)} .cs-row .k.t-pink{color:var(--pink-ink)}
.cs-row .k.t-peach{color:var(--peach-ink)} .cs-row .k.t-blue{color:var(--blue-ink)}
.cs-row p{font-family:var(--font-d);font-size:clamp(20px,2vw,26px);line-height:1.35;letter-spacing:-.02em;color:var(--ink);max-width:40ch}
.cs-built-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.cs-built{border-radius:var(--radius-sm);padding:28px 26px;display:flex;flex-direction:column}
.cs-built .svd-ico{margin:0 0 18px -8px}
.cs-built .k{font-family:var(--font-m);font-size:10px;font-weight:600;letter-spacing:.15em;text-transform:uppercase}
.cs-built h4{font-family:var(--font-d);font-weight:500;font-size:22px;letter-spacing:-.02em;margin:10px 0 8px}
.cs-built p{font-size:14.5px;line-height:1.6;color:var(--ink-2);margin-bottom:18px}
.cs-built .link-arrow{margin-top:auto}
.cs-built.t-blue .k,.cs-built.t-blue .link-arrow{color:var(--blue-ink)}
.cs-built.t-lav .k,.cs-built.t-lav .link-arrow{color:var(--lav-ink)}
.cs-built.t-peach .k,.cs-built.t-peach .link-arrow{color:var(--peach-ink)}
.legal-hero{padding-bottom:40px}
.legal-hero .lede{font-family:var(--font-m);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.legal{padding:40px 0 120px}
.legal-grid{display:grid;grid-template-columns:220px minmax(0,720px);gap:64px}
.legal-toc{position:sticky;top:calc(var(--nav-h) + 30px);align-self:start;display:flex;flex-direction:column;gap:2px;border-left:1px solid var(--line)}
.legal-toc a{padding:6px 0 6px 16px;font-size:13.5px;color:var(--muted);transition:color .2s}
.legal-toc a:hover{color:var(--blue)}
.legal-body h2{font-family:var(--font-d);font-weight:500;font-size:24px;letter-spacing:-.02em;margin:44px 0 12px;scroll-margin-top:calc(var(--nav-h) + 24px)}
.legal-body h2:first-child{margin-top:0}
.legal-body p,.legal-body li{font-size:15.5px;line-height:1.7;color:var(--ink-2)}
.legal-body p + p{margin-top:12px}
.legal-body ul{margin:12px 0;padding-left:20px}
.legal-body li{margin:4px 0}
.legal-body a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}
.nf{min-height:70vh;display:flex;align-items:center}
@media(max-width:1020px){
  .cs-built-grid{grid-template-columns:1fr}
  .legal-grid{grid-template-columns:1fr;gap:28px}
  .legal-toc{display:none}
}
@media(max-width:640px){.cs-row{grid-template-columns:1fr;gap:12px}}

/* how we work: the agent workflow card, light to match the isometric illustrations */
.agent-card.light{background:var(--bg);border:1px solid var(--line);box-shadow:var(--shadow-md)}
.agent-card.light .ac-title{color:var(--muted)}
.agent-card.light .ac-live{color:#1F7A52}
.agent-card.light svg{display:block;margin-top:4px}

/* ============================================================
   RESPONSIVE PASS (phones 375 · tablets 768 / 1024)
   ============================================================ */
/* nav: switch to the menu button before the links get cramped */
@media(max-width:1020px){
  .nav-links,.nav-cta{display:none}
  .theme-toggle{margin-left:auto}
  .burger{display:flex;margin-left:4px}
}
/* home hero: below 1200px the illustration sits under the text instead of behind it */
@media(max-width:1200px){
  .hero{flex-direction:column;align-items:stretch;min-height:0;padding-bottom:40px}
  .hero-inner{order:1}
  .hero-bg-art{
    position:relative;order:2;z-index:1;top:auto;bottom:auto;right:auto;transform:none;opacity:1;
    width:min(100%,640px);margin:28px auto 0;-webkit-mask-image:none;mask-image:none;
  }
}
/* engagement models: three narrow columns don't fit a tablet; stack them */
@media(max-width:1020px){
  .eng-grid{grid-template-columns:1fr}
  .eng{max-width:640px}
}
/* phones: let illustrations use the full screen width so their labels stay legible */
@media(max-width:640px){
  .hero-bg-art{width:calc(100% + 40px);max-width:none;margin:22px -20px 0}
  .shift-ill svg,.trust-ill svg,.mach svg{width:calc(100% + 32px);max-width:none;margin-left:-16px}
  .cta-twinkles{display:none}
}
/* touch screens: give small text links a comfortable tap area (≥ 34px) without changing their look */
@media(pointer:coarse),(max-width:900px){
  .link-arrow,.breadcrumb a{padding-block:8px;margin-block:-8px}
  .foot-bottom{row-gap:6px}
  .foot-bottom a{padding:8px 4px;margin:-8px -4px}
  .consent input{width:18px;height:18px;flex:none;margin-top:1px}
}
/* mobile menu: the call-to-action keeps normal button size instead of the large link size */
.mobile-menu a.btn{font-size:13px;padding:18px 20px;justify-content:center;border-bottom:0}