/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 06 2026 | 19:32:09 */
:root {
  --navy: #0B1D3A;
  --navy-deep: #061225;
  --blue-mid: #1A3A5C;
  --teal: #0097A7;
  --teal-light: #00BCD4;
  --teal-glow: #00E5FF;
  --copper: #D4803A;
  --copper-light: #E8A662;
  --white: #FFFFFF;
  --off-white: #F4F7FA;
  --gray-100: #E8ECF1;
  --gray-200: #CDD4DC;
  --gray-500: #6B7A8D;
  --gray-700: #3A4A5C;
  
}
/* ── TIMELINE ── */
.timeline {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  position: relative;
  margin-top: 48px;
}
.timeline::before {
  content: '';
  position: absolute;
  top: 38px;
  left: 10%;
  right: 10%;
  height: 2px;
  background: linear-gradient(90deg, var(--teal), var(--teal-light), var(--copper));
}
.timeline-step { text-align: center; position: relative; }
.timeline-num {
  width: 76px;
  height: 76px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  font-size: 28px;
  font-weight: 700;
  position: relative;
  z-index: 2;
}
.timeline-step:nth-child(1) .timeline-num { background: var(--teal); color: white; }
.timeline-step:nth-child(2) .timeline-num { background: rgba(0,151,167,.7); color: white; }
.timeline-step:nth-child(3) .timeline-num { background: rgba(212,128,58,.8); color: white; }
.timeline-step:nth-child(4) .timeline-num { background: var(--copper); color: white; }
.timeline-step h4 {
  font-size: 16px;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 8px;
}
.timeline-step p {
  font-size: 13px;
  color: var(--gray-500);
  max-width: 200px;
  margin: 0 auto;
  line-height: 1.5;
}

/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
  
  .timeline { grid-template-columns: repeat(2, 1fr); gap: 40px; }
  .timeline::before { display: none; }
}

@media (max-width: 768px) {
  
  .timeline { grid-template-columns: 1fr; }
  
}