/* Clients page only: prevent the Chart.js canvas and grid content from forcing a wider layout. */
#section-clients, #section-clients * { box-sizing: border-box; }
#section-clients { width: 100%; max-width: 100%; min-width: 0; }
#section-clients .grid, #section-clients .grid > *,
#section-clients .chart-container, #section-clients .chart-container > canvas {
    min-width: 0;
    max-width: 100%;
}
#section-clients .chart-container { position: relative; width: 100%; margin-inline: auto; }
#section-clients .chart-container canvas { display: block; width: 100% !important; max-width: 100% !important; }
#section-clients h1, #section-clients h2, #section-clients h3,
#section-clients strong, #section-clients p { overflow-wrap: anywhere; }
@media (max-width: 767px) {
    #section-clients { width: 100%; overflow-x: clip; }
    #section-clients > .bg-white, #section-clients .grid > .bg-white { min-width: 0; }
    #section-clients .grid.md\:grid-cols-2 { grid-template-columns: minmax(0, 1fr); }
    #section-clients .chart-container { height: 285px; max-height: none; }
    #section-clients .grid.md\:grid-cols-2.items-center { padding: 16px !important; gap: 20px; }
    #section-clients .chart-container + p { max-width: 100%; font-size: 11px; }
    #section-clients .space-y-4.text-center > h3 { font-size: 14px; line-height: 1.4; }
    #section-clients .space-y-4.text-xs.text-slate-700 > h3 { font-size: 17px; line-height: 1.4; }
    #section-clients .space-y-4.text-xs.text-slate-700 .space-y-3 > div { overflow-wrap: anywhere; }
}
@media (max-width: 390px) {
    #section-clients .chart-container { height: 270px; }
    #section-clients .grid.md\:grid-cols-2.items-center { padding: 12px !important; }
}


/* Interactive SVG sector chart: responsive, with hover and keyboard tooltip. */
#section-clients .chart-container:has(.ssk-sector-chart) { height:auto!important; max-height:none!important; min-height:0!important; overflow:visible!important; }
#section-clients .ssk-sector-chart { width:100%; max-width:100%; min-width:0; display:flex; flex-direction:column; align-items:center; gap:12px; padding:4px 0 0; }
#section-clients .ssk-sector-visual {position:relative; width:min(345px,100%); aspect-ratio:1; flex-shrink:0;}
#section-clients .ssk-sector-svg {display:block; width:100%; height:100%; overflow:visible;}
#section-clients .ssk-sector-segment {cursor:pointer; transition:filter .15s ease; transform-origin:160px 160px; outline:none;}
#section-clients .ssk-sector-segment:hover, #section-clients .ssk-sector-segment:focus-visible {filter:brightness(1.08) drop-shadow(0 0 3px #0005);}
#section-clients .ssk-sector-segment:focus-visible {stroke:#0f172a;stroke-width:2;}
#section-clients .ssk-sector-tooltip {position:absolute;left:50%;top:50%;transform:translate(-50%,-120%);z-index:5;pointer-events:none;color:#fff;background:#303030;padding:9px 11px;border-radius:5px;font-size:12px;line-height:1.35;min-width:185px;max-width:245px;box-shadow:0 4px 14px #0003;white-space:normal;text-align:left;}
#section-clients .ssk-sector-tooltip[hidden] {display:none!important;}
#section-clients .ssk-sector-tooltip strong {display:block;margin-bottom:3px;}
#section-clients .ssk-sector-tooltip small {display:block;font-size:11px;}
#section-clients .ssk-sector-tooltip i {display:inline-block;width:10px;height:10px;margin-right:5px;vertical-align:middle;}
#section-clients .ssk-sector-legend {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 10px;width:100%;max-width:440px;}
#section-clients .ssk-sector-legend>div {display:flex;align-items:center;gap:5px;text-align:left;min-width:0;font-size:10px;line-height:1.35;color:#475569;}
#section-clients .ssk-sector-legend i {width:9px;height:9px;flex:0 0 9px;border-radius:1px;}
#section-clients .ssk-sector-legend span {min-width:0;flex:1;overflow-wrap:break-word;}
#section-clients .ssk-sector-legend b {font-weight:600;white-space:nowrap;color:#334155;}
@media (max-width:767px) {#section-clients .ssk-sector-visual{width:min(275px,82vw);} #section-clients .ssk-sector-legend{grid-template-columns:1fr 1fr;} #section-clients .ssk-sector-tooltip{font-size:11px;min-width:160px;}}
@media (max-width:390px){#section-clients .ssk-sector-legend{grid-template-columns:1fr;} }