/* ---------------- SPI Country List page ---------------- */
.list-main{ padding:26px clamp(14px, 4vw, 48px) 70px; }

.list-section-title{
  color:var(--blue-dark);
  font-family:var(--font-display);
  font-weight:800;
  font-size:1.15rem;
  margin:34px 0 10px;
  padding-bottom:6px;
  border-bottom:2px solid rgba(33,95,154,0.18);
}
.list-section-title:first-of-type{ margin-top:8px; }

.list-main .container{ max-width:1400px; }

.country-columns{
  columns:6 148px;
  column-gap:16px;
}
.country-columns a{
  display:block;
  break-inside:avoid;
  padding:5px 4px;
  color:var(--blue-dark);
  font-weight:500;
  font-size:0.98rem;
  border-radius:6px;
}
.country-columns a:hover{ background:rgba(33,95,154,0.1); text-decoration:underline; }

.chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.chip-row a{
  display:inline-block;
  padding:8px 16px;
  background:#fff;
  border:1px solid rgba(33,95,154,0.25);
  border-radius:999px;
  color:var(--blue-dark);
  font-weight:600;
  font-size:0.92rem;
}
.chip-row a:hover{ background:var(--blue-dark); color:var(--white-neg); }

.compare-cta{
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
  margin:50px 0 10px;
}
.compare-cta .btn-outline svg{
  width:18px; height:18px; margin-right:6px; vertical-align:-4px;
}

@media (max-width: 760px){
  .country-columns{ columns:2 140px; }
}
@media (min-width:761px) and (max-width:1100px){
  .country-columns{ columns:3 160px; }
}
@media (min-width:1101px) and (max-width:1400px){
  .country-columns{ columns:4 170px; }
}

/* ---------------- Compare modal ---------------- */
.compare-overlay{
  position:fixed; inset:0;
  background:rgba(15,30,48,0.6);
  display:none;
  align-items:flex-start;
  justify-content:center;
  overflow-y:auto;
  padding:30px 16px;
  z-index:220;
}
.compare-overlay.open{ display:flex; }
.compare-card{
  background:var(--white-neg);
  width:min(1080px, 100%);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  position:relative;
  padding:0 0 30px;
}
.compare-banner{
  background:var(--blue-dark);
  color:var(--white-neg);
  font-family:var(--font-display);
  font-weight:800;
  font-size:1.3rem;
  text-align:center;
  padding:16px 20px;
  border-radius:var(--radius-lg) var(--radius-lg) 0 0;
}
.compare-close{
  position:absolute; top:14px; right:14px;
  width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,0.85);
  color:var(--blue-dark); border:none;
  font-size:1.2rem; display:flex; align-items:center; justify-content:center;
}
.compare-body{ padding:20px clamp(14px, 3vw, 32px) 0; }

.compare-year-shared{
  display:flex; align-items:center; gap:10px;
  margin-bottom:18px;
  font-weight:600;
  color:var(--blue-dark);
}
.compare-year-shared select{
  padding:6px 10px;
  border-radius:8px;
  border:1px solid #b9cbdd;
}

.compare-slots{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:14px;
  margin-bottom:20px;
}
.compare-slot{
  background:#fff;
  border-radius:12px;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.compare-slot label{ font-size:0.78rem; font-weight:700; color:#4c6a86; text-transform:uppercase; letter-spacing:.04em; }
.compare-slot select{
  padding:7px 8px;
  border-radius:8px;
  border:1px solid #b9cbdd;
  font-size:0.92rem;
}

.compare-table-wrap{ overflow-x:auto; }
table.compare-table{
  width:100%;
  border-collapse:collapse;
  font-size:0.92rem;
  background:#fff;
  border-radius:10px;
  overflow:hidden;
}
table.compare-table th, table.compare-table td{
  padding:9px 12px;
  text-align:right;
  border-bottom:1px solid rgba(33,95,154,0.12);
  white-space:nowrap;
}
table.compare-table th:first-child, table.compare-table td:first-child{
  text-align:left;
  position:sticky; left:0;
  background:#fff;
}
table.compare-table thead th{
  background:var(--blue-dark);
  color:var(--white-neg);
  font-family:var(--font-display);
}
table.compare-table thead th:first-child{ background:var(--blue-dark); }
table.compare-table tbody tr:nth-child(even){ background:rgba(33,95,154,0.04); }
table.compare-table tr.spi-row td{ font-weight:800; color:var(--red); }

.compare-run-btn{ margin-top:4px; }
