/* City product explainer: independent component, shared Clever tokens and native HTML. */
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever{
 display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);grid-template-areas:"art heading" "art content" "art actions";column-gap:var(--clvr-sp-10,40px);row-gap:var(--clvr-sp-3,12px);
 margin:var(--clvr-sp-10,40px) 0;padding:var(--clvr-sp-8,32px) 0;border-block:0;
}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever>h2{grid-area:heading;margin:0;font:700 28px/1.25 var(--clvr-font-heading);color:var(--clvr-text);}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__art{grid-area:art;margin:0;align-self:center;min-width:0;}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__art img{display:block;width:100%;height:auto;max-width:440px;margin-inline:auto;}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__content{grid-area:content;min-width:0;}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__intro{margin:0 0 var(--clvr-sp-6,24px);font:400 14px/1.65 var(--clvr-font);color:var(--clvr-text);}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__intro strong{font-weight:600;}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__steps{counter-reset:clever-step;list-style:none;display:grid;gap:var(--clvr-sp-6,24px);padding:0;margin:0;}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__steps>li{counter-increment:clever-step;display:grid;grid-template-columns:32px minmax(0,1fr);gap:var(--clvr-sp-3,12px);margin:0;}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__steps>li::before{content:counter(clever-step,decimal-leading-zero);font:600 24px/1.2 var(--clvr-font-heading);color:var(--clvr-link);}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__steps h3{margin:0 0 var(--clvr-sp-1,4px);font:600 16px/1.35 var(--clvr-font-heading);color:var(--clvr-text);}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__steps p{margin:0;font:400 14px/1.6 var(--clvr-font);color:var(--clvr-text);}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__actions{grid-area:actions;display:flex;flex-wrap:wrap;align-items:center;gap:var(--clvr-sp-4,16px);margin-top:var(--clvr-sp-2,8px);}
:is(.cash-buyers-page-v1,.cb-sbr-v1) a.directory-how-clever__cta{display:inline-flex;align-items:center;justify-content:center;gap:var(--clvr-sp-2,8px);min-height:44px;padding:var(--clvr-sp-3,12px) var(--clvr-sp-6,24px);border:0;border-radius:var(--clvr-btn-radius,4px);background:var(--clvr-cta-orange,#ff6900);color:var(--clvr-text-inverse,#fff);font:600 14px/1.4 var(--clvr-font);text-decoration:none;white-space:nowrap;transition:background-color var(--clvr-transition,200ms ease);}
:is(.cash-buyers-page-v1,.cb-sbr-v1) a.directory-how-clever__cta:hover{background:var(--clvr-cta-orange-dark,#e85d00);color:var(--clvr-text-inverse,#fff);}
:is(.cash-buyers-page-v1,.cb-sbr-v1) a.directory-how-clever__cta:focus-visible{outline:2px solid var(--clvr-link);outline-offset:3px;}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__arrow{width:16px;height:16px;flex:none;}
:is(.cash-buyers-page-v1,.cb-sbr-v1) a.directory-how-clever__learn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;color:var(--clvr-text-secondary);font:500 14px/1.4 var(--clvr-font);text-decoration:underline;text-underline-offset:3px;white-space:nowrap;}
:is(.cash-buyers-page-v1,.cb-sbr-v1) a.directory-how-clever__learn:hover{color:var(--clvr-link);}
:is(.cash-buyers-page-v1,.cb-sbr-v1) a.directory-how-clever__learn:focus-visible{outline:2px solid var(--clvr-link);outline-offset:3px;}
:is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__external{width:14px;height:14px;flex:none;}
@container(max-width:760px){
 :is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever{grid-template-columns:minmax(0,1fr);grid-template-areas:"heading" "art" "content" "actions";row-gap:var(--clvr-sp-4,16px);margin-block:var(--clvr-sp-8,32px);padding-block:var(--clvr-sp-6,24px);}
 :is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever>h2{font-size:24px;}
 :is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__art img{max-width:320px;}
 :is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__steps{gap:var(--clvr-sp-4,16px);}
 :is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__actions{justify-content:center;}
 :is(.cash-buyers-page-v1,.cb-sbr-v1) a.directory-how-clever__cta{width:auto;}
 }
@media(prefers-reduced-motion:reduce){:is(.cash-buyers-page-v1,.cb-sbr-v1) a.directory-how-clever__cta{transition:none;}}

/* The City shell hands phone gutters to each section. */
@media(max-width:767px){
 .cash-buyers-page-v1 .directory-how-clever{padding-inline:var(--clvr-sp-4,16px);}
 /* Absorb transparent image margins without shrinking the visible illustration. */
 :is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__art{display:flex;justify-content:center;}
 :is(.cash-buyers-page-v1,.cb-sbr-v1) .directory-how-clever__art img{margin-block:-48px -22px;}
}

/* Match SBR: desktop actions follow the step copy, not its number column. */
@container(min-width:761px){
 .cash-buyers-page-v1 .directory-how-clever__actions{margin-inline-start:calc(32px + var(--clvr-sp-3,12px));}
}

/* Paint a flat, edge-to-edge directory band without widening the content box.
   Zero-width image outsets add no border, shadow or scrollable overflow. */
.cash-buyers-page-v1 .directory-how-clever{
 border-image:linear-gradient(var(--directory-how-clever-band,#faf8f5),var(--directory-how-clever-band,#faf8f5)) fill 0 / 0 / 0 100vw;
}