/* WS-11: semantic, content-height infographic components. No raster stretching. */
.ws11-process{
 --ws11-icon-box:48px;
 --ws11-icon-size:26px;
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:18px;
 margin:34px 0 0;
 padding:0;
}
.ws11-process-step{
 position:relative;
 min-width:0;
 min-height:0;
 margin:0;
 padding:24px;
 display:grid;
 grid-template-columns:var(--ws11-icon-box) minmax(0,1fr);
 gap:16px;
 align-items:start;
 background:#fff;
 border:1px solid var(--border);
}
.ws11-process-step h3{margin:1px 0 8px;font-size:clamp(1.08rem,1.7vw,1.35rem)}
.ws11-process-step p{margin:0;line-height:1.55;color:#4a5550}
.ws11-icon-badge,
.semantic-blocks .detail-card-index,
.semantic-blocks .ws11-check-icon{
 width:var(--ws11-icon-box,48px);
 height:var(--ws11-icon-box,48px);
 min-width:var(--ws11-icon-box,48px);
 display:grid;
 place-items:center;
 color:var(--primary);
 background:var(--surface-alt);
 border:1px solid var(--border);
 border-radius:12px;
 line-height:1;
}
.ws11-icon-badge .ui-icon,
.semantic-blocks .detail-card-index .ui-icon,
.semantic-blocks .ws11-check-icon .ui-icon{width:var(--ws11-icon-size,26px);height:var(--ws11-icon-size,26px);margin:0;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}

/* Full-width process direction: connector is structural, never a stretched image. */
.ws11-process--diagram{gap:0;border-block:1px solid var(--border)}
.ws11-process--diagram .ws11-process-step{border:0;background:transparent;padding:30px 34px 30px 0}
.ws11-process--diagram .ws11-process-step:not(:last-child)::after{
 content:'';
 position:absolute;
 left:48px;
 right:0;
 top:53px;
 height:1px;
 background:var(--border);
 z-index:0;
}
.ws11-process--diagram .ws11-icon-badge{position:relative;z-index:1;background:#fff;border-radius:50%}

/* Preserve profile identity instead of one family-wide card style. */
.layout-profile-split-conversion-b .ws11-process--compact .ws11-process-step{border-radius:0;box-shadow:none}
.layout-profile-modular-service-a .ws11-process--compact .ws11-process-step{border-radius:4px;border-top:4px solid var(--primary)}
.layout-profile-modular-service-b .ws11-process--compact{gap:0;border-block:1px solid var(--border)}
.layout-profile-modular-service-b .ws11-process--compact .ws11-process-step{border:0;border-right:1px solid var(--border);border-radius:0;background:transparent}
.layout-profile-modular-service-b .ws11-process--compact .ws11-process-step:last-child{border-right:0}
.layout-profile-local-warm-a .ws11-process--compact .ws11-process-step,
.layout-profile-local-warm-b .ws11-process--compact .ws11-process-step{border-radius:24px 5px 24px 5px}
.layout-profile-editorial-local-a .ws11-process--diagram .ws11-icon-badge,
.layout-profile-editorial-local-b .ws11-process--diagram .ws11-icon-badge{border-radius:4px}
.layout-profile-photo-process-a .ws11-process--diagram .ws11-icon-badge,
.layout-profile-photo-process-b .ws11-process--diagram .ws11-icon-badge{border-radius:50%;box-shadow:0 8px 24px rgba(0,0,0,.09)}

/* Existing service/GEO cards stay content-driven and use explicit semantic roles. */
.semantic-blocks .detail-card{min-height:0;height:auto;padding:clamp(20px,2.2vw,26px);align-content:start;overflow-wrap:anywhere}
.semantic-blocks .detail-card-grid{align-items:stretch}
.semantic-blocks .detail-block,.layout-process,.layout-advantages{min-height:0;height:auto}
.semantic-blocks .detail-block>.container,.layout-process>.container,.layout-advantages>.container{min-height:0}
.semantic-blocks .detail-card h3,.semantic-blocks .detail-card p{max-width:42ch}
.semantic-blocks .detail-card-index{margin:0 0 18px;border-radius:12px}
.semantic-blocks .checklist-list article{
 min-height:0;
 grid-template-columns:var(--ws11-icon-box) minmax(0,1fr);
 gap:15px;
 padding:13px 16px;
 align-items:center;
}
.semantic-blocks .ws11-check-icon{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);color:inherit}

/* Optical corrections: visual center is not always the SVG box center. */
.ui-icon-role-route{transform:translate(.75px,-.25px)}
.ui-icon-role-truck{transform:translate(.5px,.5px)}
.ui-icon-role-home{transform:translateY(-.5px)}
.ui-icon-role-building{transform:translate(.25px,-.25px)}
.ui-icon-role-estimate{transform:translate(.25px,-.25px)}
.ui-icon-role-access{transform:translate(.5px,-.5px)}
.ui-icon-role-phone{transform:translate(.5px,.25px)}

@media(max-width:900px){
 .ws11-process{--ws11-icon-box:44px}
 .ws11-process-step{padding:20px;grid-template-columns:44px minmax(0,1fr);gap:13px}
 .ws11-process--diagram .ws11-process-step{padding-right:22px}
 .ws11-process--diagram .ws11-process-step:not(:last-child)::after{left:44px;top:49px}
}
@media(max-width:700px){
 .ws11-process{grid-template-columns:1fr;gap:12px;margin-top:24px}
 .ws11-process--diagram{gap:0;border-block:1px solid var(--border)}
 .ws11-process--diagram .ws11-process-step{padding:20px 0;border-bottom:1px solid var(--border)}
 .ws11-process--diagram .ws11-process-step:last-child{border-bottom:0}
 .ws11-process--diagram .ws11-process-step::after{display:none}
 .layout-profile-modular-service-b .ws11-process--compact .ws11-process-step{border-right:0;border-bottom:1px solid var(--border)}
 .layout-profile-modular-service-b .ws11-process--compact .ws11-process-step:last-child{border-bottom:0}
 .semantic-blocks .detail-card-index{width:44px;height:44px;min-width:44px;margin-bottom:14px}
 .semantic-blocks .checklist-list article{grid-template-columns:44px minmax(0,1fr);padding:12px 14px;align-items:start}
 .semantic-blocks .ws11-check-icon{width:44px;height:44px;min-width:44px}
}