/* Native, accessible versions of the approved diagrams. */
.vg-service-diagram{padding:64px 0;background:var(--vg-surface-background,#F8F6F1);color:#23333F}
.vg-service-diagram header{border-bottom:1px solid #D5D4CC;padding-bottom:28px;margin-bottom:40px}
.vg-service-diagram h2{font-size:clamp(1.65rem,2.5vw,2.5rem);line-height:1.2;margin:0 0 16px}
.vg-service-diagram header p,.vg-diagram-item p,.vg-diagram-core p{margin:0;line-height:1.5}
.vg-service-diagram header p,.vg-diagram-item p,.vg-diagram-note{color:#5C6468}
.vg-diagram-layout{position:relative}
.vg-service-diagram .vg-diagram-items{list-style:none;margin:0;padding:0;display:grid;gap:28px;grid-template-columns:repeat(3,minmax(0,1fr))}
.vg-diagram-item{position:relative;border:1px solid #D5D4CC;background:#fff;padding:22px;min-width:0}
.vg-service-diagram h3{font-size:1.35rem;line-height:1.25;margin:12px 0}
.vg-diagram-number,.vg-diagram-eyebrow{color:#786B52;font-size:.85rem;font-weight:600}
.vg-diagram-core{background:#23333F;color:#F8F6F1;padding:32px;text-align:center}
.vg-diagram-core h3{color:inherit;font-size:1.7rem}
.vg-diagram-core small,.vg-diagram-core .vg-diagram-eyebrow{display:block;color:#D6C7AC;margin-top:20px}
.vg-diagram-note{border-top:1px solid #D5D4CC;margin:36px 0 0;padding-top:24px;font-size:.95rem}
.vg-service-diagram--family .vg-diagram-layout{display:grid;grid-template-columns:1fr 1.05fr 1fr;gap:0 50px}
.vg-service-diagram--family .vg-diagram-core{grid-column:2;grid-row:1;display:flex;flex-direction:column;justify-content:center;z-index:1}
.vg-service-diagram--family .vg-diagram-items{grid-column:1/4;grid-row:1;grid-template-columns:1fr 1.05fr 1fr;gap:24px 50px;pointer-events:none}
.vg-service-diagram--family .vg-diagram-item{pointer-events:auto}
.vg-service-diagram--family .vg-diagram-item:nth-child(-n+3){grid-column:1}
.vg-service-diagram--family .vg-diagram-item:nth-child(4){grid-column:3;grid-row:1}
.vg-service-diagram--family .vg-diagram-item:nth-child(5){grid-column:3;grid-row:2}
.vg-service-diagram--family .vg-diagram-item:nth-child(6){grid-column:3;grid-row:3}
.vg-service-diagram--family .vg-diagram-item:after{content:'';position:absolute;width:50px;height:1px;background:#786B52;top:50%;left:100%}
.vg-service-diagram--family .vg-diagram-item:nth-child(n+4):after{left:auto;right:100%}
.vg-service-diagram--risk .vg-diagram-items{grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
.vg-service-diagram--risk .vg-diagram-item{padding:18px}
.vg-service-diagram--risk .vg-diagram-item:not(:last-child):after{content:'→';position:absolute;left:calc(100% + 3px);top:24px;color:#786B52}
.vg-service-diagram--risk h3{font-size:1.2rem}
.vg-diagram-feedback{margin:32px 0 0 20%;padding:20px;border-left:1px solid #786B52;border-bottom:1px solid #786B52;color:#786B52;text-align:center}
.vg-service-diagram--protection .vg-diagram-core{margin:56px auto 0;max-width:800px;position:relative}
.vg-service-diagram--protection .vg-diagram-core:before{content:'';height:29px;width:1px;background:#786B52;position:absolute;bottom:100%;left:50%}
.vg-service-diagram--protection .vg-diagram-items{position:relative}
.vg-service-diagram--protection .vg-diagram-items:after{content:'';position:absolute;top:calc(100% + 28px);left:16%;right:16%;height:1px;background:#786B52}
.vg-service-diagram--protection .vg-diagram-item:after{content:'';position:absolute;top:100%;left:50%;height:29px;width:1px;background:#786B52}
@media(max-width:1000px){
.vg-service-diagram--family .vg-diagram-layout{display:flex;flex-direction:column;gap:24px}
.vg-service-diagram--family .vg-diagram-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.vg-service-diagram--family .vg-diagram-item:nth-child(n){grid-column:auto;grid-row:auto}
.vg-service-diagram--family .vg-diagram-item:after{display:none}
.vg-service-diagram--risk .vg-diagram-items{grid-template-columns:1fr}
.vg-service-diagram--risk .vg-diagram-item:not(:last-child):after{content:'↓';top:100%;left:50%}
.vg-diagram-feedback{margin-left:0}
}
@media(max-width:640px){
.vg-service-diagram{padding:40px 0}
.vg-service-diagram .vg-diagram-items{grid-template-columns:1fr}
.vg-service-diagram--protection .vg-diagram-items:after,.vg-service-diagram--protection .vg-diagram-item:after{display:none}
.vg-diagram-core{padding:26px 20px}
.vg-service-diagram--protection .vg-diagram-core{margin-top:28px}
}
