/* Overview page — src/pages/overview.astro */
.overview-pillars-section{ background:var(--bg-2); }
.prose-lg{ color:var(--muted); margin-top:18px; font-size:17px; line-height:1.65; }
.prose{ color:var(--muted); margin-top:14px; font-size:15px; line-height:1.65; }
.pillars-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:20px;
}
.pillar{
  background:#fff; border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:26px 24px;
  transition:transform .2s, box-shadow .2s, border-color .2s;
}
.pillar:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:transparent; }
.pillar .num{
  font-family:var(--font-display); font-size:40px; font-weight:700;
  color:var(--red); opacity:.18; line-height:1; margin-bottom:12px;
}
.pillar h3{ font-size:17px; font-weight:600; margin-bottom:8px; }
.pillar p{ font-size:14px; color:var(--muted); line-height:1.55; }

.values-section{ background:var(--navy); color:#fff; }

.values-grid{
  display:grid; grid-template-columns:repeat(5,1fr); gap:16px;
  margin-top:40px;
}
.value-card{
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1);
  border-radius:var(--radius-lg); padding:28px 20px; text-align:center;
  transition:background .2s, border-color .2s;
}
.value-card:hover{ background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.2); }
.value-card .icon{
  width:48px; height:48px; background:rgba(228,33,45,.15); color:var(--red);
  border-radius:50%; display:grid; place-items:center; margin:0 auto 14px;
}
.value-card h4{ font-size:16px; font-weight:600; color:#fff; margin-bottom:6px; }
.value-card p{ font-size:13px; color:rgba(255,255,255,.65); line-height:1.5; }

.story-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;
}
.story-copy p{ max-width:52ch; }
.story-visual{
  position:relative; aspect-ratio:4/3.6;
  border-radius:var(--radius-lg); overflow:hidden;
  background:linear-gradient(160deg,#1B3A6F,#0E2A5E);
  box-shadow:var(--shadow-lg);
}
.story-visual img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
.story-visual::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,transparent 40%,rgba(14,42,94,.6) 100%);
}
.timeline{ margin-top:32px; display:flex; flex-direction:column; gap:20px; }
.tl-item{ display:flex; gap:16px; }
.tl-year{
  font-family:var(--font-body); font-size:12px; font-weight:600;
  color:var(--red); min-width:40px; padding-top:2px;
  letter-spacing:.05em;
}
.tl-dot{
  width:8px; height:8px; border-radius:50%; background:var(--red);
  margin-top:6px; flex-shrink:0;
  box-shadow:0 0 0 3px rgba(228,33,45,.15);
}
.tl-body h4{ font-size:14px; font-weight:600; margin-bottom:2px; }
.tl-body p{ font-size:13px; color:var(--muted); }

.certs-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:20px;
}
.cert-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:28px 24px; text-align:center;
  transition:transform .2s, box-shadow .2s;
}
.cert-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); }
.cert-card .badge{
  width:56px; height:56px; background:var(--navy-50); border-radius:50%;
  display:grid; place-items:center; margin:0 auto 14px; color:var(--navy);
}
.cert-card h4{ font-size:15px; font-weight:600; margin-bottom:4px; }
.cert-card p{ font-size:13px; color:var(--muted); }

@media(max-width:900px){
  .pillars-grid{ grid-template-columns:1fr 1fr; }
  .values-grid{ grid-template-columns:1fr 1fr; }
  .story-grid{ grid-template-columns:1fr; gap:32px; }
  .certs-grid{ grid-template-columns:1fr 1fr; }
}
@media(max-width:560px){
  .pillars-grid{ grid-template-columns:1fr; }
  .values-grid{ grid-template-columns:1fr; }
  .certs-grid{ grid-template-columns:1fr; }
}
