/* Source-backed FTTH case studies */
.ftth-hero h1 { max-width: 860px; font-size: clamp(32px,5vw,62px); }
.ftth-hero .sub { max-width: 740px; }
.ftth-eyebrow { display:flex; align-items:center; flex-wrap:wrap; gap:14px; margin-top:26px; font-size:12px; }
.ftth-jump { display:inline-flex; align-items:center; gap:30px; margin-top:24px; padding:12px 20px; background:var(--accent); color:var(--ink); border-radius:40px; font-size:13px; font-weight:600; }
.ftth-jump:hover { background:#e4ff91; }
.ftth-main { background:#f7f9fb; }
.ftth-main > .wrap { max-width:1240px; }
.ftth-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; position:relative; margin-top:-30px; background:var(--line); border:1px solid var(--line); border-radius:16px; overflow:hidden; box-shadow:0 20px 40px -30px #153c6480; }
.ftth-kpis > div { padding:26px 20px; background:white; }
.ftth-kpis b { display:block; font-size:clamp(23px,2.6vw,34px); letter-spacing:-.04em; line-height:1.2; }
.ftth-kpis span { display:block; margin-top:9px; color:#586776; font-size:12px; }
.ftth-context { font-size:11px; color:#607181; margin:20px 0 0; line-height:1.7; }
.ftth-main section { padding:52px 0; }
.ftth-overview { display:grid; grid-template-columns:1fr 1.35fr; gap:48px; align-items:start; }
.ftth-overview h2 { font-size:clamp(24px,3vw,34px); line-height:1.17; letter-spacing:-.035em; margin:12px 0; }
.ftth-overview p { font-size:16px; color:#465a6a; margin:0; }
.ftth-chart-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; align-items:stretch; }
.ftth-chart-grid.single { grid-template-columns:1fr; }
.ftth-chart { min-width:0; background:#fff; padding:26px; border:1px solid #dfe7ee; border-radius:16px; display:flex; flex-direction:column; }
.ftth-chart h3 { margin:0 0 24px; font-size:18px; letter-spacing:-.02em; }
.ftth-bar-row { margin-bottom:17px; }
.ftth-bar-label { display:flex; justify-content:space-between; gap:12px; font-size:12px; line-height:1.4; margin-bottom:8px; }
.ftth-bar-label span { max-width:72%; }
.ftth-bar-label b { flex-shrink:0; font-weight:500; font-variant-numeric:tabular-nums; }
.ftth-bar-label small { font-weight:400; color:#607181; }
.ftth-bar-track { height:7px; background:#edf2f7; border-radius:5px; overflow:hidden; }
.ftth-bar-track i { display:block; height:100%; background:#258db8; border-radius:5px; }
.ftth-phase { margin-bottom:15px; }
.ftth-phase .ftth-bar-track { height:5px; margin-bottom:4px; }
.ftth-phase .ftth-bar-track i { background:#aab9c8; }
.ftth-phase .actual i { background:#168db8; }
.ftth-legend, .ftth-line-key { display:flex; flex-wrap:wrap; gap:18px; font-size:11px; margin:0 0 18px; }
.ftth-legend span::before, .ftth-line-key i { content:""; display:inline-block; width:9px; height:9px; background:#aab9c8; margin-right:6px; border-radius:2px; }
.ftth-legend span:last-child::before { background:#168db8; }
.ftth-line-chart { width:100%; height:auto; overflow:visible; }
.ftth-line-chart text { font:11px var(--font); fill:#5a6d7d; }
.ftth-chart-caption { font-size:11px; color:#607181; }
.ftth-source { font-size:10.5px; color:#657887; margin-top:20px; padding-top:12px; border-top:1px solid #e6edf2; overflow-wrap:anywhere; }
.ftth-chart > .ftth-source { margin-top:auto; }
.ftth-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; }
.ftth-steps article { border-top:1px solid #cfdae3; padding-top:18px; }
.ftth-steps h3 { font-size:17px; line-height:1.3; margin:14px 0 10px; }
.ftth-steps p { font-size:14px; color:#536776; margin:0; }
.ftth-data-section { scroll-margin-top:20px; }
.ftth-toolbar { display:flex; align-items:end; gap:14px; flex-wrap:wrap; background:#eaf0f5; padding:18px; border-radius:12px; }
.ftth-toolbar label { display:flex; flex-direction:column; gap:7px; font-size:11px; font-weight:600; flex:1 1 200px; min-width:0; }
.ftth-toolbar [hidden] { display:none; }
.ftth-toolbar input,.ftth-toolbar select { border:1px solid #c5d4df; border-radius:7px; min-height:44px; width:100%; padding:10px 12px; font:13px var(--font); background:#fff; color:#1e3547; }
.ftth-main :is(input,select,button,a,[tabindex]):focus-visible { outline:3px solid #057ead; outline-offset:3px; }
.ftth-view-note { font-size:12px; color:#5b6e7f; margin:16px 0; max-width:100ch; }
.ftth-table-scroll { max-width:100%; overflow:auto; border:1px solid #d5e1e9; border-radius:10px; background:white; max-height:620px; overscroll-behavior-x:contain; }
.ftth-table { width:100%; border-collapse:separate; border-spacing:0; font-size:12px; line-height:1.55; }
.ftth-table caption { text-align:left; padding:16px; font-weight:600; color:#1c3547; }
.ftth-table th { position:sticky; top:0; background:#17384a; color:white; font-weight:500; font-size:11px; text-align:left; padding:14px; white-space:pre-line; min-width:110px; z-index:1; }
.ftth-table td { padding:13px 14px; border-bottom:1px solid #e8edf2; vertical-align:top; min-width:125px; max-width:360px; white-space:pre-line; overflow-wrap:break-word; }
.ftth-table tr:nth-child(even) td { background:#f4f8fb; }
.ftth-table .ftth-numeric { white-space:nowrap; font-variant-numeric:tabular-nums; text-align:right; }
.ftth-missing { color:#8496a4; }
.ftth-table .ftth-empty { padding:32px 16px; color:#5b6e7f; }
.ftth-pagination { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-top:14px; }
.ftth-pagination p { font-size:12px; color:#536776; margin:0; }
.ftth-pagination > div { display:flex; gap:8px; }
.ftth-pagination button { min-height:42px; padding:9px 14px; border:1px solid #bfceda; background:white; border-radius:7px; font:12px var(--font); color:#17384a; cursor:pointer; }
.ftth-pagination button:disabled { opacity:.4; cursor:default; }
.ftth-notes { border-left:3px solid #71b4d2; background:#edf4f8; padding:24px; border-radius:0 12px 12px 0; }
.ftth-notes h3 { margin:0 0 12px; font-size:15px; }
.ftth-notes p { font-size:13px; color:#4f6474; margin:10px 0 0; }
.ftth-workflow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.ftth-workflow article { padding:22px; border:1px solid #d8e4ec; background:#fff; border-radius:12px; }
.ftth-workflow article:nth-child(3) { background:#fff8e9; border-color:#ebd7a5; }
.ftth-workflow article > span { font:11px var(--mono); color:#53788e; }
.ftth-workflow h3 { font-size:17px; margin:10px 0; }
.ftth-workflow p,.ftth-rule-list { font-size:13px; color:#536776; }
.ftth-rule-list li { margin:9px 0; }
.ftth-cover { min-height:280px; width:100%; min-width:0; height:100%; display:flex; flex-direction:column; justify-content:center; padding:24px; background:linear-gradient(145deg,#10364a,#0b82af); color:white; border-radius:10px; }
.ftth-cover-label { font:9px var(--mono); text-transform:uppercase; letter-spacing:.08em; opacity:.8; }
.ftth-cover strong { font-size:36px; line-height:1.2; margin:24px 0 4px; letter-spacing:-.04em; overflow-wrap:anywhere; }
.case-body { min-width:0; }
.ftth-cover > span:not(.ftth-cover-label) { font-size:12px; }
.ftth-cover-lines { height:45px; display:flex; align-items:end; gap:7px; margin:25px 0; }
.ftth-cover-lines i { width:15%; height:60%; background:#d8fb5c; opacity:.75; border-radius:3px 3px 0 0; }
.ftth-cover-lines i:nth-child(2) { height:80%; }.ftth-cover-lines i:nth-child(3) { height:68%; }.ftth-cover-lines i:nth-child(4) { height:100%; }.ftth-cover-lines i:nth-child(5) { height:86%; }
.ftth-cover-foot { opacity:.7; }
@media(max-width:860px) {
  .ftth-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ftth-overview { grid-template-columns:1fr; gap:12px; }
  .ftth-chart-grid { grid-template-columns:1fr; }
  .ftth-steps { grid-template-columns:1fr; gap:22px; }
  .ftth-workflow { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ftth-main section { padding:36px 0; }
}
@media(max-width:480px) {
  .ftth-kpis > div { padding:20px 14px; }
  .ftth-chart { padding:20px 16px; }
  .ftth-bar-label { font-size:11px; }
  .ftth-bar-label span { max-width:60%; }
  .ftth-pagination { align-items:flex-start; flex-direction:column; }
  .ftth-workflow { grid-template-columns:1fr; }
  .ftth-hero h1 { font-size:34px; }
}