/* The process illustrations are inline vectors, so they stay sharp without extra image requests. */
#process .stat-pair { gap:14px; border:0; padding:0; }
.stat-card { position:relative; padding:18px 18px 20px; border:1px solid #ffffff35; border-radius:17px; background:linear-gradient(145deg,#ffffff13,#ffffff04); overflow:hidden; }
.stat-card::after { content:""; position:absolute; inset:auto 16px 0; height:2px; background:#c3e4ff; transform:scaleX(var(--stat-progress,1)); transform-origin:left; border-radius:2px; }
.stat-top { display:flex; align-items:center; gap:8px; color:#d5e6ff; margin-bottom:14px; }
.stat-top svg { width:18px; height:18px; stroke-width:1.6; }
.stat-top>span { font-size:7px; font-weight:800; letter-spacing:.14em; }
#process .stat-pair strong { font-size:clamp(46px,4.7vw,64px); white-space:nowrap; display:flex; align-items:baseline; letter-spacing:-.035em; }
#process .stat-pair strong .stat-number, #process .stat-pair strong .stat-dash { font:inherit; font-variant-numeric:tabular-nums; letter-spacing:inherit; margin:0; }
#process .stat-pair strong .stat-number { display:inline-block; min-width:2ch; }
.stat-accessible { position:absolute; width:1px; height:1px; padding:0; margin:-1px!important; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
#process .stat-pair strong .stat-dash { margin-inline:1px; }
#process .stat-pair strong .stat-unit { font:600 11px var(--body); margin-left:8px; letter-spacing:0; }
#process .stat-pair small { font-size:11px; line-height:1.65; margin-top:11px; max-width:none; color:#e1eaff; }
#process .process-steps { gap:16px; border:0; align-items:stretch; }
#process .process-steps li { padding:22px!important; border:1px solid #ffffff32!important; border-radius:19px; background:linear-gradient(145deg,#ffffff10,#001e7914); box-shadow:0 8px 24px #06269b12; overflow:hidden; display:flex; flex-direction:column; isolation:isolate; transition:border-color .4s,background .4s,box-shadow .4s,translate .4s var(--motion-ease); }
#process .process-steps li::before { border-radius:inherit; background:linear-gradient(160deg,#ffffff0d,transparent 70%); }
#process .process-steps li.step-active { border-color:#ffffff70!important; background:linear-gradient(145deg,#ffffff17,#ffffff07); }
#process .process-card .step-number { position:static; display:flex; justify-content:space-between; align-items:center; color:#d7e7ff; margin:0 0 8px; font-size:8px; font-weight:800; letter-spacing:.11em; }
#process .process-card .step-number svg { display:block; width:17px; height:17px; }
.process-art { width:100%; height:153px; margin:2px auto 20px; display:grid; place-items:center; }
.process-vector { width:100%; height:100%; max-width:260px; overflow:visible; fill:none; stroke:none; stroke-width:0; }
#process .process-card h3 { font-size:21px; font-weight:800; letter-spacing:-.035em; line-height:1.25; margin-bottom:12px; }
#process .process-card p { font-size:13px; line-height:1.8; color:#e1eaff; min-height:0; margin-bottom:25px; }
#process .process-card .step-tag { margin-top:auto; padding-top:18px; border-top:1px solid #ffffff25; letter-spacing:.12em; font-size:7px; color:#cfe2ff; }
.research-lens, .script-pen, .wave-bar, .record-dot, .edit-playhead, .edit-badge, .vector-spark { transform-box:fill-box; transform-origin:center; }
html[data-motion="on"] .process-card.illustration-visible:is(.step-active,:hover) .research-lens { animation:lens-scan 4.8s ease-in-out infinite; }
html[data-motion="on"] .process-card.illustration-visible:is(.step-active,:hover) .script-pen { animation:pen-write 4.4s ease-in-out infinite; }
html[data-motion="on"] .process-card.illustration-visible:is(.step-active,:hover) .writing-line { stroke-dasharray:44; animation:line-write 4.4s ease-in-out infinite; }
html[data-motion="on"] .process-card.illustration-visible:is(.step-active,:hover) .wave-bar { animation:voice-wave 1.4s ease-in-out infinite; }
html[data-motion="on"] .process-card .wave-2 { animation-delay:-.3s!important; }
html[data-motion="on"] .process-card .wave-3 { animation-delay:-.6s!important; }
html[data-motion="on"] .process-card .wave-4 { animation-delay:-.9s!important; }
html[data-motion="on"] .process-card .wave-5 { animation-delay:-.4s!important; }
html[data-motion="on"] .process-card.illustration-visible:is(.step-active,:hover) .record-dot { animation:record-breathe 2.8s ease-in-out infinite; }
html[data-motion="on"] .process-card.illustration-visible:is(.step-active,:hover) .edit-playhead { animation:edit-scrub 5s ease-in-out infinite; }
html[data-motion="on"] .process-card.illustration-visible:is(.step-active,:hover) .edit-badge { animation:delivery-float 5s ease-in-out infinite; }
@keyframes lens-scan { 0%,100% { translate:-4px 0; } 50% { translate:6px -5px; } }
@keyframes pen-write { 0%,100% { translate:0 0; } 35% { translate:5px -3px; } 70% { translate:-3px 2px; } }
@keyframes line-write { 0%,12% { stroke-dashoffset:44; } 65%,100% { stroke-dashoffset:0; } }
@keyframes voice-wave { 0%,100% { scale:1 .48; } 50% { scale:1 1; } }
@keyframes record-breathe { 0%,100% { opacity:1; } 50% { opacity:.55; } }
@keyframes edit-scrub { 0%,100% { translate:-25px 0; } 50% { translate:63px 0; } }
@keyframes delivery-float { 0%,100% { translate:0 0; } 50% { translate:0 -4px; } }
html.tab-hidden .process-vector * { animation-play-state:paused!important; }
@media (min-width:1000px) and (hover:hover) and (pointer:fine) {
  html[data-motion="on"] #process .process-card:hover { translate:0 -5px; box-shadow:0 18px 34px #00278824; border-color:#ffffff90!important; }
}
@media(max-width:1150px) {
  #process .process-steps { gap:12px; }
  #process .process-steps li { padding:20px!important; }
  #process .process-card h3 { font-size:19px; }
  .process-art { height:136px; margin-bottom:18px; }
  #process .stat-pair { gap:10px; }
  .stat-card { padding:16px 13px 18px; }
  .stat-top>span { font-size:6px; letter-spacing:.1em; }
  #process .stat-pair strong { font-size:49px; }
  #process .stat-pair small { font-size:10px; }
}
@media(min-width:701px) and (max-width:950px) {
  #process .process-steps { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
  #process .process-steps li { padding:23px!important; }
  .process-art { height:150px; margin-bottom:18px; }
  #process .process-card h3 { font-size:23px; }
  #process .process-card p { font-size:13px; }
  #process .stat-pair strong { font-size:43px; }
}
@media(max-width:700px) {
  #process .process-heading { margin-bottom:26px; }
  #process .stat-pair { gap:12px; }
  .stat-card { border-radius:14px; padding:16px 14px 18px; }
  .stat-top { gap:7px; margin-bottom:13px; }
  .stat-top svg { width:16px; height:16px; }
  .stat-top>span { font-size:6px; }
  #process .stat-pair strong { font-size:48px; }
  #process .stat-pair small { font-size:10px; line-height:1.65; margin-top:9px; }
  #process .process-steps { display:grid; grid-template-columns:1fr; gap:13px; }
  #process .process-steps li { padding:19px 17px!important; display:grid; grid-template-columns:105px minmax(0,1fr); gap:0 14px; border-radius:16px; }
  #process .process-card .step-number { grid-column:1/-1; margin-bottom:15px; font-size:7px; }
  .process-art { grid-column:1; grid-row:2/4; width:116px; height:118px; align-self:center; margin:-4px 0 4px -6px; }
  #process .process-card h3 { grid-column:2; font-size:18px; margin:0 0 8px; align-self:end; }
  #process .process-card p { grid-column:2; font-size:12px; line-height:1.75; margin-bottom:0; }
  #process .process-card .step-tag { grid-column:1/-1; margin-top:16px; padding-top:13px; font-size:6px; }
}
@media(max-width:370px) {
  #process .process-steps li { grid-template-columns:90px minmax(0,1fr); gap:0 12px; padding:17px 15px!important; }
  .process-art { width:102px; height:112px; }
  #process .process-card h3 { font-size:17px; }
  #process .stat-pair strong { font-size:43px; }
}
@media(prefers-reduced-motion:reduce) { .process-vector * { animation:none!important; } }