/* Refinement: distinct roles, controlled contrast, clean routing. */
body[data-refinement=clear] .pain.solid .qm{color:#1868db;opacity:1}
body[data-refinement=clear] .pain.solid .qm svg{fill:#1868db}
body[data-refinement=clear] .pain.photo .photo-label{position:absolute;left:29px;right:22px;bottom:28px;font-size:clamp(25px,2.1vw,32px);line-height:1.4;font-weight:650;letter-spacing:-.035em;color:white;z-index:2;text-shadow:0 2px 14px #14273766}
body[data-refinement=clear] .pain.photo:after{inset:0;background:linear-gradient(180deg,transparent 26%,#10203540 48%,#102035dd 100%)}
body[data-refinement=clear] .stack .stk{color:#687585;opacity:1}
body[data-refinement=clear] .stack .track{gap:0;animation-duration:85s}
.cf-logo-group{display:flex;align-items:center;gap:56px;padding-right:56px;flex:none}
body[data-refinement=clear] .stk svg{width:23px;height:23px}
body[data-refinement=clear] .stack-lbl{color:#617082}
/* Equal visual centers; the diagonal background no longer pulls the composition. */
body[data-refinement=clear] .flow{background:linear-gradient(180deg,#f9fafc,#fff);padding-bottom:64px}
body[data-refinement=clear] .flow:before{display:none}
body[data-refinement=clear] .flow-head{grid-template-columns:1fr;margin-bottom:27px}
body[data-refinement=clear] .flow-head .sub{grid-column:1;max-width:none}
body[data-refinement=clear] .identity-motif{aspect-ratio:420/320;margin-bottom:27px}
body[data-refinement=clear] .identity-motif svg{overflow:visible}
body[data-refinement=clear] .step h3{color:#26374d}
body[data-refinement=clear] .step p{color:#637083}
.cf-motion-bar{display:flex;justify-content:flex-end;max-width:1240px;margin:28px auto 0}
body[data-refinement=clear] .cf-motion-bar .motion-control{position:static;border-color:#dce2e9;background:white;color:#708094;font-size:10px;padding:10px 13px;min-height:40px;box-shadow:none}
/* Keep the approved card grid and proportions. Contrast sits inside each picture. */
body[data-refinement=clear] .suites .cell{background:linear-gradient(135deg,#fff,#f6f8fb);border-color:#dce2e9;box-shadow:0 10px 20px -22px #16376055}
body[data-refinement=clear] .suites .cell:before{display:none}
body[data-refinement=clear] .cell[data-kind=os]{background:linear-gradient(110deg,#fff 26%,#f2f5f9)}
body[data-refinement=clear] .cell[data-kind=content]{background:linear-gradient(100deg,#f4f6f9,#fff 80%)}
body[data-refinement=clear] .identity-flow svg{font-family:var(--nf-fontFamily);overflow:visible}
body[data-refinement=clear] .cell h3{color:#26374d}
body[data-refinement=clear] .cell .hook{color:#365c89}
body[data-refinement=clear] .cell p{color:#637083}
.cf-signal{stroke-dasharray:5 95;animation:cf-travel 11s linear infinite}
.cf-core{animation:cf-core-light 7s ease-in-out infinite}
@keyframes cf-travel{to{stroke-dashoffset:-100}}
@keyframes cf-core-light{0%,100%{opacity:1}50%{opacity:1}}
body[data-motion=paused] :is(.cf-signal,.cf-core){animation-play-state:paused}
@media(max-width:800px){.cf-logo-group{gap:38px;padding-right:38px}body[data-refinement=clear] .identity-motif{width:100%;margin-left:0;margin-right:0}body[data-refinement=clear] .flow{padding-bottom:48px}}
@media(max-width:600px){body[data-refinement=clear] .pain.photo .photo-label{font-size:29px;left:25px;bottom:28px}body[data-refinement=clear] .identity-motif{margin-bottom:23px;aspect-ratio:420/310}body[data-refinement=clear] .cf-motion-bar{margin-top:22px}body[data-refinement=clear] .stack-lbl{font-size:12px}body[data-refinement=clear] .stk svg{width:21px;height:21px}}
@media(prefers-reduced-motion:reduce){.cf-signal,.cf-core{animation:none!important}}
body[data-refinement=clear] .cf-motif{display:flex;flex-direction:column}
body[data-refinement=clear] .cf-motif>svg{height:calc(100% - 26px);min-height:0;flex:1}
.cf-caption{display:block;text-align:center;font-size:12px;line-height:26px;color:#647184;font-weight:400;flex:none}
@media(min-width:601px) and (max-width:1100px){body[data-refinement=clear] .step h3{min-height:3em}body[data-refinement=clear] .step p{min-height:3.7em}.cf-caption{font-size:10px}}

/* Stronger accents without tinting the full canvas. */
body[data-refinement=clear] .suites .cell{background:#f8f9fb}
body[data-refinement=clear] .cell[data-kind=os],body[data-refinement=clear] .cell[data-kind=content]{background:linear-gradient(110deg,#fff,#f5f6f8)}
body[data-refinement=clear] .cell .hook{color:#123263}
body[data-refinement=clear] .step .own,body[data-refinement=clear] .identity-link{color:#0f51b4}
