/* ================= MOD refined mockup ================= */
.mr{--ink:#0E0E11; --ink2:#17171B; --paper:#FFFFFF; --mist:#F5F6F1; --mist2:#EAECE2; --line:#E3E5DC; --muted:#5C6157; --lime:#D9F066; --lime050:#F2F8D6; --lime3:#BACA6E; --olive:#47531A;
  --disp:var(--mr-disp), "Helvetica Neue", Arial, sans-serif; --body:"Source Sans 3","Helvetica Neue",Arial,sans-serif; --mono:"IBM Plex Mono",ui-monospace,monospace;
  background:var(--paper); color:var(--ink); font-family:var(--body); font-size:15px; line-height:1.55}
.mr .shell{padding-inline:clamp(20px,5cqi,64px)}
.mr .disp{font-family:var(--disp)}
.mr header.top{display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:16px; border-bottom:1px solid var(--line); background:#fff}
.mr .logo img{height:34px; width:auto; display:block}
.mr .logo{display:flex; align-items:center; filter:brightness(0) saturate(100%)}
.mr .nav{display:flex; gap:26px; font-size:14px; font-weight:500; color:var(--ink)}
.mr .nav span{display:flex; align-items:center; gap:6px}
.mr .nav span i{width:6px; height:6px; border-right:1.5px solid var(--muted); border-bottom:1.5px solid var(--muted); transform:rotate(45deg) translateY(-2px); display:inline-block}
.mr .btn{display:inline-flex; align-items:center; gap:8px; font-family:var(--disp); font-weight:600; font-size:14px; padding:12px 20px; border-radius:999px; text-decoration:none; white-space:nowrap; border:1px solid transparent}
.mr .btn-lime{background:var(--lime); color:var(--ink)}
.mr .btn-ghost{background:#fff; color:var(--ink); border-color:var(--line)}
.mr .btn-dark{background:var(--ink); color:#fff}
.mr .arrow{width:14px; height:14px}
.mr .eb{font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--olive)}
.mr .eb.on-dark{color:var(--lime)}
/* hero */
.mr .hero{position:relative; overflow:hidden; padding-block:64px 52px}
.mr .hero::before{content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size:72px 72px;
  -webkit-mask-image:radial-gradient(90% 80% at 75% 20%,#000,transparent 70%); mask-image:radial-gradient(90% 80% at 75% 20%,#000,transparent 70%); opacity:.7}
.mr .hero::after{content:""; position:absolute; top:-20%; right:-8%; width:60%; height:120%; pointer-events:none; background:radial-gradient(48% 48% at 60% 40%,rgba(217,240,102,.22),transparent 70%)}
.mr .hero-grid{position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,1fr); gap:48px; align-items:center}
.mr h1.h{font-family:var(--disp); font-weight:700; font-size:clamp(34px,5.2cqi,60px); line-height:1.04; letter-spacing:-.035em; margin:16px 0 18px; text-wrap:balance}
.mr .sub{font-size:17px; color:var(--muted); max-width:52ch; margin:0 0 26px}
.mr .ctas{display:flex; gap:12px; flex-wrap:wrap}
.mr .results{margin-top:30px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-top:1px solid var(--line)}
.mr .results div{padding:14px 16px 0 0}
.mr .results div+div{padding-left:16px; border-left:1px solid var(--line)}
.mr .results b{display:block; font-family:var(--disp); font-size:22px; font-weight:700; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.mr .results span{display:block; font-size:12.5px; color:var(--muted); line-height:1.4}
.mr .arch{background:#fff; border:1px solid var(--line); border-radius:16px; padding:18px 18px 12px; box-shadow:0 20px 50px -30px rgba(14,14,17,.25)}
.mr .arch svg{width:100%; height:auto; display:block}
.mr .arch figcaption{font-family:var(--mono); font-size:11px; color:var(--muted); display:flex; justify-content:space-between; gap:12px; border-top:1px solid var(--line); padding-top:10px; margin-top:6px}
/* proof */
.mr .proof{border-block:1px solid var(--line); background:var(--mist); padding-block:26px 30px; display:grid; gap:18px}
.mr .proof .t{font-family:var(--mono); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); flex:0 0 auto}
.mr .logos{display:flex; align-items:center; justify-content:space-between; gap:24px 36px; flex-wrap:wrap}
.mr .logos img{width:auto; display:block; filter:brightness(0); opacity:.66}
.mr .logos .l-nestle{height:46px} .mr .logos .l-daikin{height:20px} .mr .logos .l-ldc{height:40px}
.mr .logos .l-techsol{height:44px} .mr .logos .l-colaraz{height:30px} .mr .logos .l-drive{height:46px}
.mr .logos .to{display:flex; align-items:center; gap:7px; font-family:var(--body); font-weight:600; font-size:16px; color:var(--ink); opacity:.62; letter-spacing:-.01em}
.mr .logos .to svg{width:22px; height:22px}
/* sections */
.mr .sec{padding-block:72px}
.mr .sec.mist{background:var(--mist)}
.mr .head{display:grid; gap:12px; margin-bottom:36px; max-width:720px}
.mr .head h2{font-family:var(--disp); font-weight:700; font-size:clamp(28px,3.6cqi,40px); line-height:1.1; letter-spacing:-.03em; margin:0; text-wrap:balance}
.mr .head p{margin:0; color:var(--muted); font-size:16px}
.mr .three{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px}
.mr .card{background:#fff; border:1px solid var(--line); border-radius:16px; padding:26px; display:grid; gap:12px; align-content:start}
.mr .ico{width:42px; height:42px; border-radius:11px; background:var(--lime050); display:grid; place-items:center; color:var(--olive)}
.mr .ico svg{width:20px; height:20px}
.mr .tag{font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--olive)}
.mr .card h3{font-family:var(--disp); font-weight:700; font-size:21px; letter-spacing:-.02em; line-height:1.2; margin:0}
.mr .card p{margin:0; color:var(--muted); font-size:14.5px}
.mr .more{font-family:var(--disp); font-weight:600; font-size:14px; color:var(--ink); text-decoration:none; display:inline-flex; align-items:center; gap:6px; margin-top:4px}
/* services grouped */
.mr .groups{display:grid; grid-template-columns:1fr 2fr 1.4fr; gap:18px}
.mr .group{border:1px solid var(--line); border-radius:16px; background:#fff; overflow:hidden; display:grid; align-content:start}
.mr .group > .gh{padding:16px 22px; border-bottom:1px solid var(--line); font-family:var(--mono); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); display:flex; justify-content:space-between}
.mr .svc{padding:20px 22px; display:grid; gap:6px; border-bottom:1px solid var(--line)}
.mr .svc:last-child{border-bottom:0}
.mr .svc h4{font-family:var(--disp); font-weight:700; font-size:18px; letter-spacing:-.015em; margin:0; display:flex; justify-content:space-between; gap:12px; align-items:baseline}
.mr .svc h4 span{font-family:var(--mono); font-weight:400; font-size:11px; color:var(--muted); letter-spacing:.04em; white-space:nowrap}
.mr .svc p{margin:0; font-size:14px; color:var(--muted)}
.mr .group.dark{background:var(--ink); border-color:var(--ink); color:#fff}
.mr .group.dark .gh{border-color:rgba(255,255,255,.14); color:#A9AF9E}
.mr .group.dark .svc{border-color:rgba(255,255,255,.14)}
.mr .group.dark .svc p,.mr .group.dark .svc h4 span{color:#A9AF9E}
/* case */
.mr .case{background:var(--ink); color:#fff; border-radius:20px; padding:clamp(24px,4cqi,48px); display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:32px; align-items:center; position:relative; overflow:hidden}
.mr .case::after{content:""; position:absolute; right:-120px; top:-160px; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(217,240,102,.22),transparent 62%)}
.mr .case h3{font-family:var(--disp); font-weight:700; font-size:clamp(24px,3.2cqi,34px); letter-spacing:-.025em; line-height:1.12; margin:12px 0}
.mr .case p{margin:0 0 20px; color:#C3C7BB; max-width:52ch}
.mr .case .fig{position:relative; z-index:1; border-left:1px solid rgba(255,255,255,.16); padding-left:32px; display:grid; gap:6px}
.mr .case .fig b{white-space:nowrap; font-family:var(--disp); font-weight:700; font-size:clamp(40px,5.4cqi,64px); letter-spacing:-.04em; line-height:1; font-variant-numeric:tabular-nums}
.mr .case .fig b em{font-style:normal; color:var(--lime)}
.mr .case .fig span{font-family:var(--mono); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:#A9AF9E}
.mr .case .btn-lime{position:relative; z-index:1}
/* service page */
.mr .phero{background:var(--ink); color:#fff; position:relative; overflow:hidden; padding-block:64px 60px}
.mr .phero::before{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px); background-size:66px 66px; -webkit-mask-image:radial-gradient(80% 90% at 80% 0%,#000,transparent 75%); mask-image:radial-gradient(80% 90% at 80% 0%,#000,transparent 75%)}
.mr .phero::after{content:""; position:absolute; width:520px; height:520px; right:-160px; top:-240px; border-radius:50%; background:radial-gradient(circle,rgba(217,240,102,.32),transparent 62%)}
.mr .phero .in{position:relative; z-index:1; max-width:760px}
.mr .crumb{font-family:var(--mono); font-size:12px; color:#A9AF9E; display:flex; gap:8px}
.mr .phero h1{font-family:var(--disp); font-weight:700; font-size:clamp(32px,4.8cqi,54px); line-height:1.05; letter-spacing:-.035em; margin:16px 0; text-wrap:balance}
.mr .phero p{color:#C3C7BB; font-size:17px; margin:0 0 26px; max-width:58ch}
.mr .phero .btn-ghost{background:transparent; color:#fff; border-color:rgba(255,255,255,.25)}
.mr .two{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:48px; align-items:start}
.mr .checks{list-style:none; margin:0; padding:0; display:grid; gap:0; border-top:1px solid var(--line)}
.mr .checks li{display:grid; grid-template-columns:24px minmax(0,1fr); gap:12px; padding:14px 0; border-bottom:1px solid var(--line); font-size:15px}
.mr .checks li b{display:block; font-family:var(--disp); font-weight:700; font-size:16px; letter-spacing:-.01em}
.mr .checks li span{color:var(--muted); font-size:14px}
.mr .tick{width:22px; height:22px; border-radius:50%; background:var(--lime); display:grid; place-items:center; margin-top:1px}
.mr .tick svg{width:12px; height:12px}
.mr .chips{display:flex; flex-wrap:wrap; gap:8px}
.mr .chips span{border:1px solid var(--line); background:#fff; border-radius:999px; padding:7px 14px; font-size:13.5px; font-weight:500}
.mr .steps{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:0; border-top:2px solid var(--ink)}
.mr .step{padding:18px 18px 0 0}
.mr .step+.step{padding-left:18px; border-left:1px solid var(--line)}
.mr .step .n{font-family:var(--mono); font-size:12px; color:var(--olive)}
.mr .step h4{font-family:var(--disp); font-weight:700; font-size:17px; letter-spacing:-.01em; margin:6px 0 6px}
.mr .step p{margin:0; font-size:13.5px; color:var(--muted)}
.mr .faq{display:grid; gap:0; border-top:1px solid var(--line)}
.mr .faq details{border-bottom:1px solid var(--line); padding:16px 0}
.mr .faq summary{cursor:pointer; font-family:var(--disp); font-weight:600; font-size:17px; list-style:none; display:flex; justify-content:space-between; gap:16px}
.mr .faq summary::-webkit-details-marker{display:none}
.mr .faq summary::after{content:"+"; font-family:var(--mono); color:var(--olive)}
.mr .faq details[open] summary::after{content:"–"}
.mr .faq p{margin:10px 0 0; color:var(--muted); max-width:70ch}
.mr .band{background:var(--lime); border-radius:20px; padding:clamp(24px,4cqi,44px); display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap}
.mr .band h3{font-family:var(--disp); font-weight:700; font-size:clamp(24px,3cqi,32px); letter-spacing:-.025em; margin:0; max-width:24ch; line-height:1.15}
.mr .draft{font-family:var(--mono); font-size:11px; color:var(--muted); letter-spacing:.04em}

@container (max-width:860px){
  .mr .nav{display:none}
  .mr .hero-grid,.mr .two,.mr .case{grid-template-columns:1fr}
  .mr .three{grid-template-columns:1fr}
  .mr .groups{grid-template-columns:1fr}
  .mr .steps{grid-template-columns:1fr; border-top:0}
  .mr .step,.mr .step+.step{padding:14px 0; border-left:0; border-top:1px solid var(--line)}
  .mr .case .fig{border-left:0; border-top:1px solid rgba(255,255,255,.16); padding:20px 0 0}
  .mr .results{grid-template-columns:1fr}
  .mr .results div,.mr .results div+div{padding:12px 0; border-left:0; border-bottom:1px solid var(--line)}
  .mr header.top .btn{display:none}
  .mr .sec{padding-block:52px}
}
/* ===== v3 additions: visuals ===== */
:root{--mr-disp:"Source Serif 4"}
.mr .hero-vis{display:grid; gap:14px; position:relative}
.mr .arch{padding:16px 16px 10px}
.mr .arch .flow{stroke-dasharray:3 7; animation:mrflow 1.6s linear infinite}
@keyframes mrflow{to{stroke-dashoffset:-20}}
.mr .arch .pulse{animation:mrpulse 2.4s ease-in-out infinite; transform-box:fill-box; transform-origin:center}
@keyframes mrpulse{0%,100%{opacity:.35; transform:scale(.8)}50%{opacity:1; transform:scale(1.15)}}
.mr .arch .bar{transform-box:fill-box; transform-origin:bottom; animation:mrbar 3.2s ease-in-out infinite}
@keyframes mrbar{0%,100%{transform:scaleY(.55)}50%{transform:scaleY(1)}}
.mr .arch .bar:nth-of-type(2){animation-delay:.3s}.mr .arch .bar:nth-of-type(3){animation-delay:.6s}.mr .arch .bar:nth-of-type(4){animation-delay:.9s}.mr .arch .bar:nth-of-type(5){animation-delay:1.2s}
.mr .arch .spark{stroke-dasharray:120; stroke-dashoffset:120; animation:mrdraw 3.6s ease-in-out infinite}
@keyframes mrdraw{0%{stroke-dashoffset:120}45%,80%{stroke-dashoffset:0}100%{stroke-dashoffset:-120}}

/* chatbot */
.mr .chat{background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:0 24px 60px -34px rgba(14,14,17,.35); overflow:hidden}
.mr .chat-h{display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 14px; border-bottom:1px solid var(--line); background:var(--mist)}
.mr .chat-h b{font-family:var(--disp); font-size:13.5px; display:flex; align-items:center; gap:8px}
.mr .chat-h b i{width:8px; height:8px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 3px rgba(217,240,102,.35)}
.mr .chat-h span{font-family:var(--mono); font-size:10.5px; color:var(--muted); letter-spacing:.06em; text-transform:uppercase}
.mr .chat-b{padding:14px; display:grid; gap:10px; min-height:236px; align-content:start}
.mr .msg{max-width:92%; font-size:13.5px; line-height:1.45; border-radius:12px; padding:9px 12px}
.mr .msg.q{justify-self:end; background:var(--ink); color:#fff; border-bottom-right-radius:4px}
.mr .msg.a{justify-self:start; background:var(--mist); color:var(--ink); border-bottom-left-radius:4px; display:grid; gap:8px}
.mr .msg.a .mini{display:flex; align-items:flex-end; gap:6px; height:46px; padding-top:4px}
.mr .msg.a .mini div{flex:1; display:grid; gap:3px; justify-items:center; font-family:var(--mono); font-size:9.5px; color:var(--muted)}
.mr .msg.a .mini i{display:block; width:100%; background:var(--lime3); border-radius:3px 3px 0 0}
.mr .msg.a .mini i.hi{background:var(--olive)}
.mr .src{display:flex; gap:6px; flex-wrap:wrap; font-family:var(--mono); font-size:10px; color:var(--muted)}
.mr .src span{border:1px solid var(--line); background:#fff; border-radius:999px; padding:2px 8px}
.mr .typing{justify-self:start; background:var(--mist); border-radius:12px; padding:10px 12px; display:flex; gap:4px}
.mr .typing i{width:6px; height:6px; border-radius:50%; background:var(--muted); animation:mrdot 1s infinite}
.mr .typing i:nth-child(2){animation-delay:.15s}.mr .typing i:nth-child(3){animation-delay:.3s}
@keyframes mrdot{0%,100%{opacity:.25}50%{opacity:1}}
.mr .chat-f{display:flex; gap:8px; align-items:center; padding:10px 14px; border-top:1px solid var(--line)}
.mr .chat-f span{flex:1; font-size:13px; color:var(--muted); border:1px solid var(--line); border-radius:999px; padding:8px 12px; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.mr .chat-f i{width:32px; height:32px; border-radius:50%; background:var(--lime); display:grid; place-items:center; flex:0 0 auto}
.mr .fade-in{animation:mrin .35s ease both}
@keyframes mrin{from{opacity:0; transform:translateY(6px)}to{opacity:1; transform:none}}

/* card visuals */
.mr .vis{background:var(--mist); border:1px solid var(--line); border-radius:12px; height:138px; display:grid; place-items:center; overflow:hidden; margin-bottom:4px}
.mr .vis svg{width:100%; height:100%; display:block}
.mr .card.v{padding:14px 14px 22px}
.mr .card.v > :not(.vis){margin-inline:8px}
.mr .vlbl{font-family:var(--mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; fill:#5C6157}

/* service rows icons */
.mr .svc{grid-template-columns:36px minmax(0,1fr); column-gap:14px; align-items:start}
.mr .svc > *:not(.sico){grid-column:2}
.mr .sico{grid-row:1 / span 2; width:36px; height:36px; border-radius:10px; background:var(--lime050); color:var(--olive); display:grid; place-items:center}
.mr .group.dark .sico{background:rgba(217,240,102,.14); color:var(--lime)}
.mr .sico svg{width:18px; height:18px}

/* how we work */
.mr .phases{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; position:relative}
.mr .track{grid-column:1 / -1; height:4px; background:var(--mist2); border-radius:4px; position:relative; overflow:hidden; margin-bottom:8px}
.mr .track i{position:absolute; inset:0 auto 0 0; width:0; background:var(--olive); border-radius:4px; animation:mrtrack 6s ease-in-out infinite}
@keyframes mrtrack{0%{width:0}30%{width:33.3%}60%{width:66.6%}90%,100%{width:100%}}
.mr .phase{display:grid; gap:12px; align-content:start}
.mr .phase .ph{display:flex; align-items:center; gap:10px}
.mr .phase .ph b{width:30px; height:30px; border-radius:50%; background:var(--ink); color:var(--lime); display:grid; place-items:center; font-family:var(--mono); font-size:12px; font-weight:500}
.mr .phase h3{font-family:var(--disp); font-weight:700; font-size:20px; letter-spacing:-.02em; margin:0}
.mr .phase p{margin:0; color:var(--muted); font-size:14.5px}
.mr .artifact{background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px; display:grid; gap:8px; box-shadow:0 12px 30px -24px rgba(14,14,17,.4)}
.mr .artifact .al{font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); display:flex; justify-content:space-between}
.mr .artifact svg{width:100%; height:auto; display:block}

/* case chart */
.mr .case{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}
.mr .case .chart{position:relative; z-index:1; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.12); border-radius:14px; padding:16px}
.mr .case .chart svg{width:100%; height:auto; display:block}
.mr .case .chart .leg{display:flex; gap:14px; flex-wrap:wrap; font-family:var(--mono); font-size:10.5px; color:#A9AF9E; margin-top:8px}
.mr .case .chart .leg i{display:inline-block; width:14px; height:3px; border-radius:2px; vertical-align:middle; margin-right:6px}
.mr .case .stat{display:flex; gap:28px; flex-wrap:wrap; margin:0 0 22px}
.mr .case .stat b{display:block; font-family:var(--disp); font-weight:700; font-size:30px; letter-spacing:-.03em; line-height:1}
.mr .case .stat b em{font-style:normal; color:var(--lime)}
.mr .case .stat span{font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:#A9AF9E}
.mr .case .draw{stroke-dasharray:600; stroke-dashoffset:600; animation:mrline 2.4s .3s ease-out forwards}
@keyframes mrline{to{stroke-dashoffset:0}}

/* industries */
.mr .inds{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px}
.mr .ind{background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; display:grid; align-content:start}
.mr .ind .iv{height:110px; background:var(--ink); position:relative; overflow:hidden}
.mr .ind .iv svg{width:100%; height:100%; display:block}
.mr .ind .ib{padding:18px; display:grid; gap:6px}
.mr .ind h3{font-family:var(--disp); font-weight:700; font-size:18px; letter-spacing:-.015em; margin:0}
.mr .ind p{margin:0; color:var(--muted); font-size:13.5px}
.mr .ind .proof-l{font-family:var(--mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--olive); margin-top:4px}

/* insights */
.mr .posts{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px}
.mr .post{display:grid; gap:12px; align-content:start}
.mr .post .th{aspect-ratio:16/10; max-width:100%; border-radius:14px; overflow:hidden; border:1px solid var(--line); background:var(--mist)}
.mr .post .th svg{width:100%; height:100%; display:block}
.mr .post .meta{font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted)}
.mr .post h3{font-family:var(--disp); font-weight:700; font-size:18px; letter-spacing:-.015em; margin:0; line-height:1.25}

/* final CTA with brief form */
.mr .final{background:var(--ink); color:#fff; border-radius:22px; padding:clamp(24px,4cqi,48px); display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px; position:relative; overflow:hidden}
.mr .final::after{content:""; position:absolute; left:-140px; bottom:-200px; width:440px; height:440px; border-radius:50%; background:radial-gradient(circle,rgba(217,240,102,.18),transparent 62%)}
.mr .final h2{font-family:var(--disp); font-weight:700; font-size:clamp(28px,3.6cqi,40px); letter-spacing:-.03em; line-height:1.1; margin:12px 0}
.mr .final p{color:#C3C7BB; margin:0 0 18px}
.mr .final ol{margin:0; padding:0; list-style:none; display:grid; gap:10px; position:relative; z-index:1}
.mr .final ol li{display:grid; grid-template-columns:26px minmax(0,1fr); gap:10px; font-size:14px; color:#C3C7BB}
.mr .final ol li b{width:26px; height:26px; border-radius:50%; border:1px solid rgba(255,255,255,.25); display:grid; place-items:center; font-family:var(--mono); font-size:11px; color:var(--lime); font-weight:500}
.mr .form{background:#fff; color:var(--ink); border-radius:16px; padding:20px; display:grid; gap:12px; position:relative; z-index:1}
.mr .form .row{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.mr .fld{display:grid; gap:5px}
.mr .fld span{font-size:12.5px; font-weight:600}
.mr .fld i{display:block; height:40px; border:1px solid var(--line); border-radius:10px; background:var(--mist)}
.mr .fld i.tall{height:84px}
.mr .form .btn{justify-self:start}

/* service hero with dashboard */
.mr .phero .in{max-width:none; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:44px; align-items:center}
.mr .dash{background:#17171B; border:1px solid rgba(255,255,255,.12); border-radius:16px; padding:14px; display:grid; gap:10px; position:relative; z-index:1}
.mr .dash .dh{display:flex; justify-content:space-between; font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:#A9AF9E}
.mr .kpis{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px}
.mr .kpi{background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); border-radius:10px; padding:10px}
.mr .kpi span{display:block; font-size:11px; color:#A9AF9E}
.mr .kpi b{display:block; font-family:var(--disp); font-size:20px; letter-spacing:-.02em; margin-top:2px; font-variant-numeric:tabular-nums}
.mr .kpi em{font-style:normal; font-family:var(--mono); font-size:10.5px; color:var(--lime)}
.mr .kpi em.dn{color:#F0A08A}
.mr .dash svg{width:100%; height:auto; display:block}
.mr .dict{background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; margin-top:22px}
.mr .dict .dt{display:flex; justify-content:space-between; padding:10px 14px; border-bottom:1px solid var(--line); font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); background:var(--mist)}
.mr .dict table{width:100%; border-collapse:collapse; font-size:12.5px; min-width:0}
.mr .dict td,.mr .dict th{padding:9px 14px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top}
.mr .dict th{font-family:var(--mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); font-weight:500}
.mr .dict tr:last-child td{border-bottom:0}
.mr .dict .ok{display:inline-block; font-family:var(--mono); font-size:10px; padding:2px 8px; border-radius:999px; background:var(--lime050); color:var(--olive)}
.mr .rel{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:0; border:1px solid var(--line); border-radius:18px; overflow:hidden; background:#fff}
.mr .rel .rv{background:var(--mist); padding:18px; display:grid; place-items:center}
.mr .rel .rv svg{width:100%; height:auto; display:block}
.mr .rel .rt{padding:28px; display:grid; gap:10px; align-content:center}
.mr .rel h3{font-family:var(--disp); font-weight:700; font-size:24px; letter-spacing:-.02em; margin:0; line-height:1.2}
.mr .rel p{margin:0; color:var(--muted)}
.mr .rel .nums{display:flex; gap:28px; flex-wrap:wrap; margin-top:6px}
.mr .rel .nums b{display:block; font-family:var(--disp); font-size:24px; letter-spacing:-.02em}
.mr .rel .nums span{font-family:var(--mono); font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted)}
.mr .steps .sv{height:70px; margin:10px 0 4px; border-radius:10px; background:var(--mist); border:1px solid var(--line); overflow:hidden}
.mr .steps .sv svg{width:100%; height:100%; display:block}

@container (max-width:860px){
  .mr .inds,.mr .posts,.mr .phases,.mr .final,.mr .rel,.mr .phero .in{grid-template-columns:1fr}
  .mr .form .row{grid-template-columns:1fr}
  .mr .kpis{grid-template-columns:1fr 1fr 1fr}
  .mr .track{display:none}
}
@container (max-width:1100px) and (min-width:861px){ .mr .inds{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (prefers-reduced-motion: reduce){
  .mr .arch .flow,.mr .arch .pulse,.mr .arch .bar,.mr .arch .spark,.mr .track i,.mr .typing i,.mr .case .draw{animation:none!important}
  .mr .arch .spark,.mr .case .draw{stroke-dashoffset:0}
  .mr .track i{width:100%}
}

.mr .svc h4{flex-direction:column; align-items:flex-start; gap:2px}
.mr .groups{grid-template-columns:1.15fr 2fr 1.4fr}

/* v4 */
.mr .ind .iv{height:150px}
.mr .ind .pulse,.mr .why .pulse{animation:mrpulse 2.4s ease-in-out infinite; transform-box:fill-box; transform-origin:center}
.mr .ind .spark{animation:mrdraw 4s ease-in-out infinite}
.mr .rock{transform-origin:0px -31px; animation:mrrock 2.6s ease-in-out infinite}
@keyframes mrrock{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
.mr .why{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px}
.mr .why .card h3{font-size:18px}
.mr .why .vis{height:132px}
.mr .gvis{padding:18px 22px 22px; border-top:1px solid var(--line)}
.mr .gvis svg{width:100%; height:auto; display:block}
.mr .quote{display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:40px; align-items:center; border:1px solid var(--line); border-radius:20px; padding:clamp(24px,4cqi,44px); background:#fff}
.mr .quote blockquote{margin:14px 0 22px; font-family:var(--disp); font-weight:600; font-size:clamp(20px,2.4cqi,26px); line-height:1.35; letter-spacing:-.015em}
.mr .quote .who{display:grid; gap:2px; border-left:3px solid var(--lime); padding-left:12px}
.mr .quote .who b{font-family:var(--disp); font-size:15px}
.mr .quote .who span{font-size:13px; color:var(--muted)}
.mr .quote .qv{background:var(--mist); border-radius:14px; padding:12px}
.mr .quote .qv svg{width:100%; height:auto; display:block}
.mr .grow{transform-box:fill-box; transform-origin:left; animation:mrgrow 3.5s ease-in-out infinite}
@keyframes mrgrow{0%{transform:scaleX(5)}40%,100%{transform:scaleX(1)}}
.mr .stack{display:grid; gap:0; border-top:1px solid var(--line)}
.mr .srow{display:grid; grid-template-columns:120px minmax(0,1fr); gap:16px; align-items:center; padding:16px 0; border-bottom:1px solid var(--line)}
.mr .sl{font-family:var(--mono); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--olive)}
.mr .posts-foot{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:28px}
.mr .rlogo{height:22px; width:auto; filter:brightness(0); opacity:.7; justify-self:start}
@container (max-width:1100px){ .mr .why{grid-template-columns:repeat(2,minmax(0,1fr))} }
@container (max-width:860px){ .mr .why,.mr .quote{grid-template-columns:1fr} .mr .srow{grid-template-columns:1fr; gap:8px} }
@media (prefers-reduced-motion: reduce){ .mr .rock,.mr .grow,.mr .ind .pulse,.mr .ind .spark{animation:none!important} .mr .ind .spark{stroke-dashoffset:0!important} }

/* ===== MOD site layer (page shell, nav, footer, forms, templates) ===== */
:root{--mr-disp:"Source Serif 4"; color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{margin:0; background:#fff; color:#0E0E11}
img{max-width:100%}
[hidden]{display:none!important}
.cq{container-type:inline-size; min-width:0}
.mr a{color:inherit}
.mr p a,.mr .prose a,.mr .faq a{color:var(--olive); text-decoration:underline; text-underline-offset:3px}
.mr :focus-visible{outline:2px solid var(--olive); outline-offset:3px; border-radius:4px}
.skip{position:absolute; left:-9999px; top:8px; background:var(--ink); color:#fff; padding:10px 16px; border-radius:8px; z-index:100}
.skip:focus{left:12px}
.mr .shell{padding-inline:max(20px, calc((100% - 1200px) / 2))}
.mr main{display:block}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}

/* header */
.mr header.top{position:sticky; top:env(safe-area-inset-top,0px); z-index:50; background:#fff; border-bottom:1px solid var(--line)}
.mr .logo{text-decoration:none}
.mr .nav{align-items:center}
.mr .nav > a,.mr .dd > a{text-decoration:none; padding:8px 0; display:flex; align-items:center; gap:6px; color:var(--ink)}
.mr .nav > a:hover,.mr .dd > a:hover{color:var(--olive)}
.mr .nav i{width:6px; height:6px; border-right:1.5px solid var(--muted); border-bottom:1.5px solid var(--muted); transform:rotate(45deg) translateY(-2px); display:inline-block}
.mr .dd{position:relative}
.mr .ddp{position:absolute; top:100%; left:-18px; padding-top:10px; display:none; z-index:60}
.mr .dd:hover .ddp,.mr .dd:focus-within .ddp,.mr .dd.open .ddp{display:block}
.mr .ddp .in{background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:0 24px 60px -28px rgba(14,14,17,.35); padding:10px; min-width:280px; display:grid; gap:2px}
.mr .ddp a{display:grid; gap:2px; padding:10px 12px; border-radius:10px; text-decoration:none}
.mr .ddp a:hover,.mr .ddp a:focus-visible{background:var(--mist)}
.mr .ddp a b{font-family:var(--disp); font-size:14.5px; font-weight:600}
.mr .ddp a span{font-size:12.5px; color:var(--muted); font-weight:400}
.mr .ddp .mega{display:grid; grid-template-columns:repeat(4,minmax(190px,1fr)); gap:6px; min-width:860px}
.mr .ddp .col h6{margin:6px 12px 4px; font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-weight:500}
.mr .services-dd .ddp{left:-300px}
.mr .hdr-cta{display:flex; align-items:center; gap:10px}
.mr .mnav{display:none}
.mr .mnav summary{list-style:none; cursor:pointer; width:42px; height:42px; border-radius:12px; border:1px solid var(--line); display:grid; place-items:center; background:#fff}
.mr .mnav summary::-webkit-details-marker{display:none}
.mr .mnav summary span{width:18px; height:2px; background:var(--ink); position:relative; display:block}
.mr .mnav summary span::before,.mr .mnav summary span::after{content:""; position:absolute; left:0; width:18px; height:2px; background:var(--ink)}
.mr .mnav summary span::before{top:-6px} .mr .mnav summary span::after{top:6px}
.mr .mnav[open] summary span{background:transparent}
.mr .mnav[open] summary span::before{top:0; transform:rotate(45deg)} .mr .mnav[open] summary span::after{top:0; transform:rotate(-45deg)}
.mr .drawer{position:absolute; top:100%; left:0; right:0; height:calc(100vh - 72px); height:calc(100dvh - 72px); background:#fff; overflow-y:auto; padding:12px 20px 40px; border-top:1px solid var(--line); z-index:70}
.mr .drawer h6{margin:18px 0 6px; font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-weight:500}
.mr .drawer a{display:block; padding:10px 0; border-bottom:1px solid var(--line); text-decoration:none; font-family:var(--disp); font-weight:600; font-size:16px}
.mr .drawer .btn{display:inline-flex; margin-top:22px; border-bottom:0}
@container (max-width:1020px){
  .mr .nav{display:none}
  .mr header.top .hdr-cta .btn{display:none}
  .mr .mnav{display:block}
}

/* page hero (light) */
.mr .lhero{position:relative; overflow:hidden; padding-block:56px 52px; border-bottom:1px solid var(--line)}
.mr .lhero::before{content:""; position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size:72px 72px; -webkit-mask-image:radial-gradient(80% 90% at 80% 10%,#000,transparent 70%); mask-image:radial-gradient(80% 90% at 80% 10%,#000,transparent 70%); opacity:.7}
.mr .lhero::after{content:""; position:absolute; top:-30%; right:-10%; width:55%; height:140%; pointer-events:none; background:radial-gradient(48% 48% at 60% 40%,rgba(217,240,102,.22),transparent 70%)}
.mr .lhero .in{position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:44px; align-items:center}
.mr .lhero .in.solo{grid-template-columns:minmax(0,760px)}
.mr .lhero h1{font-family:var(--disp); font-weight:700; font-size:clamp(32px,4.6cqi,54px); line-height:1.05; letter-spacing:-.035em; margin:14px 0 16px; text-wrap:balance}
.mr .lhero p.sub{margin:0 0 24px}
.mr .crumb a{text-decoration:none; color:inherit}
.mr .crumb a:hover{text-decoration:underline}
.mr .lhero .crumb{color:var(--muted)}
.mr .phero .crumb a{color:#A9AF9E}
.mr .phero .in > div > p{color:#C3C7BB}
.mr .heroimg{background:#fff; border:1px solid var(--line); border-radius:18px; padding:16px; box-shadow:0 24px 60px -36px rgba(14,14,17,.35)}
.mr .heroimg svg{width:100%; height:auto; display:block}
.mr .heroimg.dark{background:#0E0E11; border-color:#0E0E11}
.mr .heroimg figcaption{font-family:var(--mono); font-size:11px; color:var(--muted); display:flex; justify-content:space-between; border-top:1px solid var(--line); padding-top:10px; margin-top:8px}
.mr .heroimg.dark figcaption{color:#A9AF9E; border-color:rgba(255,255,255,.12)}
@container (max-width:860px){ .mr .lhero .in{grid-template-columns:1fr} }

/* generic grids and blocks */
.mr .grid2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px}
.mr .grid3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px}
.mr .grid4{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px}
@container (max-width:1020px){ .mr .grid4{grid-template-columns:repeat(2,minmax(0,1fr))} }
@container (max-width:860px){ .mr .grid2,.mr .grid3,.mr .grid4{grid-template-columns:1fr} }
.mr a.card{text-decoration:none; transition:border-color .2s, transform .2s}
.mr a.card:hover{border-color:#C9CDBF; transform:translateY(-2px)}
.mr .card .more{color:var(--ink)}
.mr .note-tbc,.mr .tbc{background:#FFF4D6; color:#7A5B00; border-radius:4px; padding:0 4px; font-family:var(--mono); font-size:.85em; white-space:normal}
.mr .symptoms{list-style:none; margin:0; padding:0; display:grid; gap:12px}
.mr .symptoms li{display:grid; grid-template-columns:28px minmax(0,1fr); gap:12px; align-items:start; background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px 18px; font-size:15.5px}
.mr .symptoms li::before{content:"!"; width:28px; height:28px; border-radius:50%; background:#FCE9E4; color:#A8321C; display:grid; place-items:center; font-family:var(--mono); font-weight:600; font-size:13px}
.mr .ba{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); border:1px solid var(--line); border-radius:18px; overflow:hidden; background:#fff}
.mr .ba > div{padding:24px}
.mr .ba > div + div{background:var(--ink); color:#fff}
.mr .ba h3{font-family:var(--disp); font-size:18px; margin:0 0 14px; display:flex; align-items:center; gap:10px}
.mr .ba ul{margin:0; padding:0; list-style:none; display:grid; gap:10px; font-size:14.5px}
.mr .ba li{display:grid; grid-template-columns:18px minmax(0,1fr); gap:10px}
.mr .ba > div:first-child li::before{content:"✕"; color:#A8321C; font-size:12px; margin-top:2px}
.mr .ba > div + div li::before{content:"✓"; color:var(--lime); font-size:13px; margin-top:1px}
.mr .ba > div + div li{color:#D6DACE}
@container (max-width:860px){ .mr .ba{grid-template-columns:1fr} }
.mr .metrics{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-top:2px solid var(--ink)}
.mr .metrics div{padding:18px 18px 0 0}
.mr .metrics div+div{padding-left:18px; border-left:1px solid var(--line)}
.mr .metrics b{display:block; font-family:var(--disp); font-size:18px; letter-spacing:-.01em; margin-bottom:6px}
.mr .metrics span{font-size:14px; color:var(--muted)}
@container (max-width:860px){ .mr .metrics{grid-template-columns:1fr} .mr .metrics div,.mr .metrics div+div{padding:14px 0; border-left:0; border-bottom:1px solid var(--line)} }
.mr .uses .card h3{font-size:19px}
.mr .svc-links{display:flex; flex-wrap:wrap; gap:10px}
.mr .svc-links a{display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); background:#fff; border-radius:999px; padding:9px 16px; font-family:var(--disp); font-weight:600; font-size:14px; text-decoration:none}
.mr .svc-links a:hover{border-color:var(--olive)}
.mr .artifact-box{background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden}
.mr .artifact-box .ah{display:flex; justify-content:space-between; padding:10px 14px; background:var(--mist); border-bottom:1px solid var(--line); font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted)}
.mr .artifact-box .ab{padding:16px}
.mr .artifact-box table{width:100%; border-collapse:collapse; font-size:13px}
.mr .artifact-box td,.mr .artifact-box th{padding:9px 10px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top}
.mr .artifact-box th{font-family:var(--mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); font-weight:500}
.mr .artifact-box tr:last-child td{border-bottom:0}
.mr .artifact-box svg{width:100%; height:auto; display:block}
.mr .pill-ok{display:inline-block; font-family:var(--mono); font-size:10.5px; padding:2px 8px; border-radius:999px; background:var(--lime050); color:var(--olive); white-space:nowrap}
.mr .pill-warn{display:inline-block; font-family:var(--mono); font-size:10.5px; padding:2px 8px; border-radius:999px; background:#FCE9E4; color:#A8321C; white-space:nowrap}

/* case pages */
.mr .case-hero h1{max-width:20ch}
.mr .case-layout{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:48px; align-items:start}
.mr .snap{position:sticky; top:96px; background:var(--mist); border:1px solid var(--line); border-radius:18px; padding:22px; display:grid; gap:14px}
.mr .snap dl{margin:0; display:grid; gap:12px}
.mr .snap dt{font-family:var(--mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.mr .snap dd{margin:2px 0 0; font-size:14.5px; font-weight:500}
.mr .snap img{height:30px; width:auto; filter:brightness(0); opacity:.75; justify-self:start}
.mr .prose{max-width:70ch; font-size:16.5px; line-height:1.65}
.mr .prose h2{font-family:var(--disp); font-weight:700; font-size:clamp(24px,3cqi,30px); letter-spacing:-.025em; margin:48px 0 14px; line-height:1.15}
.mr .prose h2:first-child{margin-top:0}
.mr .prose p{margin:0 0 14px; color:#2C2F33}
.mr .prose ul{margin:0 0 14px; padding-left:20px; display:grid; gap:6px; color:#2C2F33}
.mr .approach{list-style:none; margin:8px 0 18px; padding:0; display:grid; gap:12px; counter-reset:ap}
.mr .approach li{counter-increment:ap; display:grid; grid-template-columns:34px minmax(0,1fr); gap:14px; background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px 18px}
.mr .approach li::before{content:counter(ap,decimal-leading-zero); width:34px; height:34px; border-radius:50%; background:var(--ink); color:var(--lime); display:grid; place-items:center; font-family:var(--mono); font-size:12px}
.mr .approach b{display:block; font-family:var(--disp); font-size:16.5px; margin-bottom:2px}
.mr .approach span{color:var(--muted); font-size:14.5px}
.mr .impact{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:6px 0 18px}
.mr .impact div{background:var(--ink); color:#fff; border-radius:16px; padding:20px}
.mr .impact b{display:block; font-family:var(--disp); font-size:30px; letter-spacing:-.03em; line-height:1.05; color:var(--lime)}
.mr .impact span{display:block; margin-top:6px; font-size:14px; color:#C3C7BB}
.mr .figbox{background:var(--mist); border:1px solid var(--line); border-radius:18px; padding:18px; margin:6px 0 22px}
.mr .figbox svg{width:100%; height:auto; display:block}
.mr .figbox figcaption{font-family:var(--mono); font-size:11px; color:var(--muted); margin-top:8px}
@container (max-width:960px){ .mr .case-layout{grid-template-columns:1fr} .mr .snap{position:static} }
@container (max-width:600px){ .mr .impact{grid-template-columns:1fr} }
.mr .worklist .card .metric{font-family:var(--disp); font-weight:700; font-size:22px; letter-spacing:-.02em}
.mr .worklist .card .vis{height:150px}
.mr .soon{display:inline-block; font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; padding:3px 10px; border-radius:999px; background:var(--mist2); color:var(--muted)}

/* forms */
.mr .form label{display:grid; gap:6px; font-size:13px; font-weight:600}
.mr .form input,.mr .form textarea,.mr .form select{font:inherit; font-weight:400; font-size:15px; width:100%; border:1px solid #D5D8CC; border-radius:10px; background:#fff; padding:11px 12px; color:var(--ink)}
.mr .form textarea{min-height:110px; resize:vertical}
.mr .form input:focus,.mr .form textarea:focus{outline:2px solid var(--olive); outline-offset:1px; border-color:var(--olive)}
.mr .form .opt{font-weight:400; color:var(--muted)}
.mr .form button.btn{border:0; cursor:pointer; justify-self:start}
.mr .form .status{font-size:14px; border-radius:10px; padding:12px 14px; display:none}
.mr .form .status.show{display:block}
.mr .form .status.ok{background:var(--lime050); color:var(--olive)}
.mr .form .status.err{background:#FCE9E4; color:#8A2A16}
.mr .form .status.info{background:var(--mist); color:var(--ink)}
.mr .form .hp{position:absolute; left:-9999px}
.mr .contact-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:48px; align-items:start}
.mr .contact-grid .form{border:1px solid var(--line); box-shadow:0 24px 60px -40px rgba(14,14,17,.35)}
@container (max-width:860px){ .mr .contact-grid{grid-template-columns:1fr} }
.mr .copy{display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:14px; background:var(--mist); border:1px solid var(--line); border-radius:10px; padding:8px 12px; user-select:all}

/* footer */
.mr footer.site{background:var(--ink); color:#C3C7BB; padding-block:64px 32px; margin-top:0}
.mr footer .fgrid{display:grid; grid-template-columns:1.4fr repeat(4,minmax(0,1fr)); gap:32px}
.mr footer .flogo img{height:34px; width:auto}
.mr footer p{font-size:14px; margin:14px 0 0; max-width:34ch}
.mr footer h6{margin:0 0 12px; font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:#7E8476; font-weight:500}
.mr footer ul{list-style:none; margin:0; padding:0; display:grid; gap:8px; font-size:14px}
.mr footer a{text-decoration:none; color:#E6E8E0}
.mr footer a:hover{color:var(--lime)}
.mr footer .fbot{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; border-top:1px solid rgba(255,255,255,.12); margin-top:48px; padding-top:20px; font-size:13px; color:#7E8476}
@container (max-width:860px){ .mr footer .fgrid{grid-template-columns:1fr 1fr} .mr footer .fgrid > div:first-child{grid-column:1 / -1} }

/* page-level tweaks to mockup components */
.mr .sec.tight{padding-block:48px}
.mr .head.center{margin-inline:auto; text-align:center}
.mr .band.dark{background:var(--ink); color:#fff}
.mr .band.dark h3{color:#fff}
.mr .band p{margin:8px 0 0; color:inherit; opacity:.8; max-width:52ch}
.mr .notfound{padding-block:120px; text-align:center}
.mr .notfound h1{font-family:var(--disp); font-size:clamp(40px,7cqi,72px); letter-spacing:-.04em; margin:12px 0}

.mr .rel .rlogo{height:30px}
.mr .figbox svg{max-width:620px; margin-inline:auto}

/* hero "what we do" strip */
.mr .wwd{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:26px}
.mr .wwd a{display:flex; gap:10px; align-items:flex-start; text-decoration:none; background:#fff; border:1px solid var(--line); border-radius:14px; padding:12px; transition:border-color .2s, transform .2s}
.mr .wwd a:hover{border-color:var(--olive); transform:translateY(-1px)}
.mr .wwd .wi{flex:0 0 32px; width:32px; height:32px; border-radius:9px; background:var(--lime050); color:var(--olive); display:grid; place-items:center}
.mr .wwd .wi svg{width:16px; height:16px}
.mr .wwd b{display:block; font-family:var(--disp); font-size:14.5px; letter-spacing:-.01em; line-height:1.25}
.mr .wwd em{display:block; font-style:normal; font-size:12.5px; color:var(--muted); line-height:1.35; margin-top:2px}
.mr .hero .results{margin-top:22px}
@container (max-width:1100px){ .mr .wwd{grid-template-columns:1fr} }

/* v6: AI */
.mr h1.h{font-size:clamp(30px,3.9cqi,46px); line-height:1.06; margin:14px 0 16px}
.mr .hero .sub{font-size:17.5px; max-width:44ch}
.mr .groups{grid-template-columns:repeat(4,minmax(0,1fr))}
@container (max-width:1100px){ .mr .groups{grid-template-columns:repeat(2,minmax(0,1fr))} }
@container (max-width:700px){ .mr .groups{grid-template-columns:1fr} }
.mr .group.ai{border-color:var(--olive); box-shadow:0 0 0 1px var(--olive) inset}
.mr .group.ai .gh{background:var(--lime050); color:var(--olive)}
.mr .models{display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; margin-top:22px; font-size:14px; color:var(--muted)}
.mr .models b{font-family:var(--disp); color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:999px; padding:6px 12px; font-size:13.5px}
.mr .aicaps{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px}
@container (max-width:1100px){ .mr .aicaps{grid-template-columns:repeat(2,minmax(0,1fr))} }
@container (max-width:700px){ .mr .aicaps{grid-template-columns:1fr} }
.mr .aicaps .card h3{font-size:19px}
.mr .step{animation:mrstep 9s ease-in-out infinite both}
.mr .step.s1{animation-delay:0s}.mr .step.s2{animation-delay:.8s}.mr .step.s3{animation-delay:1.6s}.mr .step.s4{animation-delay:2.4s}.mr .step.s5{animation-delay:3.2s}
@keyframes mrstep{0%{opacity:0}6%,90%{opacity:1}100%{opacity:0}}
.mr .draw2{stroke-dasharray:700; stroke-dashoffset:700; animation:mrline 2.4s .2s ease-out forwards}
@media (prefers-reduced-motion: reduce){ .mr .step{animation:none!important; opacity:1} .mr .draw2{animation:none!important; stroke-dashoffset:0} }

/* ===== fixes & page-level helpers ===== */
.mr a.svc{text-decoration:none; color:inherit; transition:background .2s}
.mr a.svc:hover{background:var(--mist)}
.mr .group.dark a.svc:hover{background:#1C1C21}
.mr a.svc:hover h4{color:var(--olive)}
.mr .group.dark a.svc:hover h4{color:var(--lime)}
.mr .pulse{animation:mrpulse 2.4s ease-in-out infinite; transform-box:fill-box; transform-origin:center}
.mr .ind{position:relative; text-decoration:none; color:inherit; transition:transform .2s, border-color .2s}
.mr a.ind:hover{transform:translateY(-2px); border-color:#C9CDBF}
.mr .ind h3 a{text-decoration:none}
.mr .ind h3 a::after{content:""; position:absolute; inset:0}
.mr .ind .proof-l{position:relative}
.mr .card .vis{flex:0 0 auto}
.mr .worklist a.card .more{margin-top:auto}
.mr .worklist a.card{display:flex; flex-direction:column; gap:12px}
.mr .rel .rlogo{margin-bottom:4px}
.mr .phero .heroimg,.mr .phero .chat{position:relative; z-index:1}
.mr .lhero .chat{position:relative; z-index:1}
.mr .lhero .arch,.mr .lhero figure{position:relative; z-index:1}
.mr .heroimg .vlbl,.mr .figbox .vlbl{fill:#5C6157}
.mr .heroimg.dark .vlbl{fill:#A9AF9E}
.mr .phases .phase .svc-links{margin-top:4px}
.mr .chat-f span.typing-now{color:var(--ink)}
.mr .snap .btn{justify-self:start}
.mr .lhero .ctas .btn-ghost{background:#fff}
.mr .post p{max-width:46ch}
@media (prefers-reduced-motion: reduce){ .mr .pulse,.mr [style*="mrflow"]{animation:none!important} }


/* ===== v2 site-wide: fonts, logo, section style, colour client logos ===== */
.mr{--mr-disp:"Source Serif 4"; --disp:"Source Serif 4", Georgia, serif; --body:"Source Sans 3", "Helvetica Neue", Arial, sans-serif}
.mr, .mr p, .mr li{font-family:var(--body)}
.mr h1, .mr h2, .mr h3{font-family:var(--disp); letter-spacing:-.015em}
.mr h1{font-weight:600}
.mr h2{font-weight:600}
.mr h3{font-weight:600; letter-spacing:-.005em}
.mr .btn, .mr nav, .mr header.top a, .mr label, .mr button, .mr .more, .mr .svc-links a, .mr .drawer a{font-family:var(--body)}
.mr .btn{font-weight:600}

/* logo (live site mark, no box) */
.mr .logo img, .mr footer .flogo img{height:34px; width:auto; display:block}
.mr header.top{border-bottom:1px solid var(--line)}

/* section heads: pill label, larger centred heading */
.mr .sec > .head{margin-inline:auto; text-align:center; justify-items:center; max-width:780px; gap:14px; margin-bottom:40px}
.mr .sec .head h2{font-size:clamp(30px,4cqi,46px); line-height:1.08}
.mr .sec > .head p{max-width:60ch}
.mr .two > .head{gap:14px; justify-items:start}
.mr .head .eb:not(.on-dark), .mr .lhero .eb:not(.on-dark){display:inline-flex; align-items:center; gap:8px; width:max-content; max-width:100%; font-family:var(--body); font-weight:500; font-size:13.5px; letter-spacing:0; text-transform:none; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:10px; padding:6px 12px; box-shadow:0 1px 0 rgba(14,14,17,.04)}
.mr .head .eb:not(.on-dark)::before, .mr .lhero .eb:not(.on-dark)::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 3px rgba(217,240,102,.35)}
.mr .lhero h1{letter-spacing:-.02em}

/* cards: softer, rounder */
.mr .card{border-radius:18px; transition:border-color .2s, box-shadow .2s, transform .2s}
.mr a.card:hover{border-color:#C9CDBE; box-shadow:0 16px 34px -26px rgba(14,14,17,.4); transform:translateY(-2px)}

/* colour client logos */
.mr .snap img, .mr .rlogo{filter:none; opacity:1}

@media (prefers-reduced-motion: reduce){ .mr a.card:hover{transform:none} }

/* ===== homepage visual theme on inner pages ===== */
/* timeline steps (homepage "How we work" style) */
.mr .steps2 .tline{position:relative; height:16px; margin:0 0 20px}
.mr .steps2 .tline::before, .mr .steps2 .tline i{content:""; position:absolute; left:var(--inset); right:var(--inset); top:7px; height:2px; border-radius:2px; background:#DADDCF}
.mr .steps2 .tline i{right:auto; width:0; background:var(--olive); transition:width 1.4s cubic-bezier(.3,.6,.2,1) .1s}
.mr .steps2 .tline b{position:absolute; top:0; width:16px; height:16px; margin-left:-8px; border-radius:50%; background:#fff; border:2px solid #DADDCF; transition:background .3s .5s, border-color .3s .5s}
.mr .steps2.in .tline i{width:calc(100% - 2 * var(--inset))}
.mr .steps2.in .tline b{border-color:var(--olive); background:var(--lime)}
.mr .tcs{display:grid; grid-template-columns:repeat(var(--n),minmax(0,1fr)); gap:14px}
.mr .tc2{background:#fff; border:1px solid var(--line); border-radius:18px; padding:12px; display:grid; gap:6px; align-content:start; opacity:0; transform:translateY(18px); transition:opacity .55s ease var(--d), transform .55s cubic-bezier(.2,.7,.2,1) var(--d), border-color .2s, box-shadow .2s}
.mr .steps2.in .tc2{opacity:1; transform:none}
.mr .tc2:hover{border-color:#C9CDBE; box-shadow:0 18px 38px -28px rgba(14,14,17,.4)}
.mr .tc2 .sv{background:var(--mist); border:1px solid var(--line); border-radius:12px; height:96px; display:grid; place-items:center; padding:6px; margin-bottom:8px}
.mr .tc2 .sv svg{width:100%; height:100%; display:block}
.mr .tc2 .n, .mr .tc2 h4, .mr .tc2 p{margin-inline:6px}
.mr .tc2 .n{font-family:var(--mono); font-size:11.5px; color:var(--muted)}
.mr .tc2 h4{font-family:var(--disp); font-weight:600; font-size:18px; letter-spacing:-.01em; margin-block:0}
.mr .tc2 p{margin-block:0 6px; font-size:14px; color:var(--muted)}
.mr .tc2 p .more{display:block; margin-top:10px; color:var(--ink); font-weight:600; text-decoration:none}
.mr .sec.mist .tc2{background:#fff}
/* tool logos in circles */
.mr .tech2{list-style:none; margin:0 auto; padding:0; display:flex; flex-wrap:wrap; justify-content:center; gap:26px 22px; max-width:1040px}
.mr .tech2 li{display:grid; justify-items:center; gap:10px; width:92px; font-size:14px; color:var(--ink); text-align:center; line-height:1.25}
.mr .tech2 .tc{width:72px; height:72px; border-radius:50%; background:#fff; border:1px solid var(--line); display:grid; place-items:center; box-shadow:0 10px 24px -18px rgba(14,14,17,.4)}
.mr .tech2 .tc svg{width:36px; height:36px; display:block}
.mr .tech2-more{justify-content:center; margin-top:22px}
.mr .tech2-more span{background:transparent}
.mr .models{justify-content:center; margin-top:22px}
/* plain link row ("Also" / "More AI services") */
.mr .also2{display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:6px 18px; margin-top:24px; font-size:14.5px}
.mr .also2 span{font-family:var(--mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.mr .also2 a{color:var(--ink); text-decoration:none; font-weight:500; border-bottom:1px solid transparent}
.mr .also2 a:hover{border-bottom-color:var(--olive)}
/* measures as cards */
.mr .metrics2{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px}
.mr .metrics2 > div{background:#fff; border:1px solid var(--line); border-radius:18px; padding:22px; display:grid; gap:6px; align-content:start}
.mr .metrics2 .mi .tick{width:30px; height:30px; border-radius:9px; background:var(--lime); display:grid; place-items:center; margin-bottom:6px}
.mr .metrics2 .mi svg{width:14px; height:14px}
.mr .metrics2 b{font-family:var(--disp); font-weight:600; font-size:19px; letter-spacing:-.01em}
.mr .metrics2 span:not(.mi):not(.tick){color:var(--muted); font-size:14.5px}
/* services overview: no empty icon column */
.mr .groups .svc{grid-template-columns:1fr}
.mr .groups .svc > *:not(.sico){grid-column:auto}
/* related case + snapshot cards: homepage card feel */
.mr .rel{border-radius:20px}
.mr .snap{border-radius:20px}
@container (max-width:980px){ .mr .tcs{grid-template-columns:repeat(min(var(--n),3),minmax(0,1fr))} .mr .steps2 .tline{display:none} }
@container (max-width:700px){ .mr .tcs{grid-template-columns:1fr; gap:10px} .mr .tc2{grid-template-columns:96px minmax(0,1fr); column-gap:12px; align-items:center} .mr .tc2 .sv{grid-row:1 / span 3; height:72px; margin:0} .mr .tc2 .n, .mr .tc2 h4, .mr .tc2 p{grid-column:2; margin-inline:0} .mr .metrics2{grid-template-columns:1fr} .mr .tech2 li{width:78px} .mr .tech2 .tc{width:60px; height:60px} .mr .tech2 .tc svg{width:30px; height:30px} }
@media (prefers-reduced-motion: reduce){ .mr .tc2{opacity:1; transform:none; transition:none} .mr .steps2 .tline i, .mr .steps2 .tline b{transition:none} }

/* dropdown menus: icon in a light tinted square, title and one line (option A, light tint only) */
.mr .ddp a{display:flex; align-items:flex-start; gap:12px; color:var(--ink)}
.mr .ddp a .mt{display:grid; gap:2px}
.mr .ddp a .mi{flex:0 0 auto; width:34px; height:34px; border-radius:10px; background:#F2F8D6; border:1px solid #E3EBC0; color:var(--olive); display:grid; place-items:center; transition:background .2s, border-color .2s}
.mr .ddp a .mi svg{width:18px; height:18px}
.mr .ddp a b{color:var(--ink)}
.mr .ddp a:hover .mi, .mr .ddp a:focus-visible .mi{background:#E9F2C4; border-color:#D6E3A0}
.mr .ddp .in{min-width:330px}
.mr .ddp .mega{min-width:980px}