/* Global nuclear stockpiles teaser ([ploughshares_stockpiles_summary]).
   Loads after stockpiles.css and uses its tokens (--psf-*), font and
   host-theme guard through the shared .psf-nuke class; everything here is
   scoped under .psf-sum. */

.psf-nuke.psf-sum{
  --psf-sum-usa:var(--psf-deployed);   /* Twilight */
  --psf-sum-rus:var(--psf-reserve);    /* Twilight, lightened */
  --psf-sum-oth:var(--psf-neutral);
  /* Top: 16px plus the Beaver Builder row's 20px puts the heading's text as far
     below the homepage divider as the previous section's content sits above it
     (100px at every width, measured on staging 2026-11-10). */
  padding:16px 0 64px;
}

.psf-sum .psf-sum-h{
  font-size:clamp(26px,4vw,40px);
  font-weight:600;
  line-height:1.2;
  margin:0 0 32px;
}

/* ---------- tiles: the full page's three colours and square corners ---------- */
.psf-sum .psf-sum-tiles{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--psf-gap);
  margin:0 0 36px;
}
.psf-sum .psf-sum-tile{
  margin:0;
  border-radius:0 !important;   /* square, as the full page's .psf-stat tiles */
  padding:22px 24px;
  color:#fff;
}
.psf-sum .psf-sum-tile:nth-child(1){background:var(--psf-tile-1);}
.psf-sum .psf-sum-tile:nth-child(2){background:var(--psf-tile-2);}
.psf-sum .psf-sum-tile:nth-child(3){background:var(--psf-tile-3);}
.psf-sum .psf-sum-tile b{
  display:block;
  font-size:clamp(34px,4.4vw,48px);
  font-weight:700;
  line-height:1.05;
  margin-bottom:6px;
}
.psf-sum .psf-sum-tile span{
  display:block;
  font-size:15px;
  line-height:1.4;
  overflow-wrap:break-word;
}

/* ---------- share bar ---------- */
.psf-sum .psf-sum-barhead{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:12px;
  font-size:14px;
  color:var(--psf-muted);
  margin-bottom:8px;
}
.psf-sum .psf-sum-bar{
  display:flex;
  height:44px;
  border-radius:8px;
  overflow:hidden;
}
.psf-sum .psf-sum-bar div{
  flex-basis:0;
  min-width:0;
  display:flex;
  align-items:center;
  padding:0 14px;
  color:#fff;
  font-size:14px;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
}
.psf-sum .psf-sum-usa{background:var(--psf-sum-usa);}
.psf-sum .psf-sum-rus{background:var(--psf-sum-rus);}
.psf-sum .psf-sum-oth{background:var(--psf-sum-oth);}
.psf-sum .psf-sum-bar .psf-sum-oth{
  color:var(--psf-ink);
  justify-content:center;
  padding:0 4px;
}

.psf-sum .psf-sum-legend{
  display:flex;
  flex-wrap:wrap;
  gap:6px 22px;
  margin:14px 0 0;
  padding:0;
  list-style:none;
  font-size:14px;
  color:var(--psf-ink-2);
}
/* The theme puts a sunflower on every list item; the swatch is this list's marker. */
.psf-sum .psf-sum-legend li{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0;
  padding:0;
  list-style:none;
  list-style-image:none;
}
.psf-sum .psf-sum-legend i{
  flex:0 0 12px;
  width:12px;
  height:12px;
  border-radius:3px;
}
.psf-sum .psf-sum-others{
  font-size:14px;
  line-height:1.6;
  color:var(--psf-muted);
  margin:10px 0 0;
}

/* ---------- link and source ---------- */
.psf-sum .psf-sum-cta{
  text-align:center;
  margin:40px 0 0;
}
.psf-sum a.psf-sum-btn,
.psf-sum a.psf-sum-btn:visited{
  display:inline-block;
  border:2px solid var(--psf-blue-dark);
  border-radius:999px;
  padding:12px 30px;
  background:transparent;
  color:var(--psf-blue-dark);
  font-size:14px;
  font-weight:600;
  letter-spacing:.04em;
  line-height:1.4;
  text-transform:uppercase;
  text-decoration:none;
}
.psf-sum a.psf-sum-btn:hover,
.psf-sum a.psf-sum-btn:focus-visible{
  background:var(--psf-blue-dark);
  color:#fff;
}
.psf-sum a.psf-sum-btn:focus-visible{
  outline:3px solid var(--psf-blue-dark);
  outline-offset:3px;
}
.psf-sum .psf-sum-src{
  text-align:center;
  font-size:13px;
  color:var(--psf-muted);
  margin:14px 0 0;
}

@media (max-width:720px){
  .psf-nuke.psf-sum{padding:16px 0 48px;}
  .psf-sum .psf-sum-tiles{grid-template-columns:1fr;gap:12px;}
  .psf-sum .psf-sum-tile{
    display:flex;
    align-items:center;
    gap:16px;
    padding:18px 20px;
  }
  .psf-sum .psf-sum-tile b{margin:0;flex:0 0 112px;font-size:32px;}
  .psf-sum .psf-sum-bar{height:36px;}
  .psf-sum .psf-sum-bar div{font-size:12px;padding:0 8px;}
  /* too narrow for "7 others"; the legend below names it */
  .psf-sum .psf-sum-bar .psf-sum-oth{font-size:0;}
}
