.sv-feature{border-block:1px solid var(--rule)}
.sv-examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,3vw,56px);margin-top:clamp(26px,3.5vw,58px)}
.sv-example{border-top:2px solid var(--rule);padding-top:18px}
.sv-example h3{margin-bottom:12px}
.sv-social .sv-example{border-radius:16px;padding:clamp(18px,2vw,32px);border:1px solid var(--rule)}
.sv-social .sv-example:nth-child(2){background:color-mix(in srgb,var(--paper) 90%,var(--accent))}
.sv-local .sv-feature{display:grid;grid-template-columns:.85fr 1.15fr;gap:7%}
.sv-local .sv-examples{grid-template-columns:1fr;margin:0}
.sv-local .sv-example{padding-left:20px;border:0;border-left:2px solid var(--rule)}
.sv-brand .sv-example:nth-child(1){border-color:#df6b2d}
.sv-brand .sv-example:nth-child(2){border-color:#5776a2}
.sv-brand .sv-example:nth-child(3){border-color:#8691a2}
.sv-ads .sv-example{position:relative}
.sv-ads .sv-example:not(:last-child)::after{content:'→';color:var(--accent);position:absolute;right:-.85em;top:-.8em;font-size:22px}
.sv-print .sv-example{border-top:1px dashed var(--muted)}
.wd-project-panel .wd-project-copy p{max-width:40ch}
.wd-project-panel figure.wd-browser img{object-position:center}
@media(max-width:740px){
 .sv-examples,.sv-local .sv-feature{grid-template-columns:1fr;gap:20px}
 .sv-ads .sv-example:not(:last-child)::after{display:none}
}
