/* WEBSHALT_HEADER_START | Developed by WebsHalt - Premium Web Solutions | Contact: +91 8389897880 | Email: contact@webshalt.com | Injected: 2025-09-20T15:14:49+00:00 | WEBSHALT_HEADER_END */

/* === Ecorail consolidated stylesheet ===
   Includes: base look, hero, utilities, stats, FAQ, and TIMELINE NO-OVERLAP patch.
*/
:root{
  --rail-red:#D7263D;
  --rail-blue:#004E98;
  --rail-amber:#FFBF00;
  --rail-gray:#f7f7f9;
  /* Timeline tokens */
  --tl-left: 20px;
  --tl-dot: 14px;
  --tl-line: 3px;
  --tl-gutter: 3.25rem; /* generous gutter to avoid overlap */
}
/* Base */
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,'Noto Sans',sans-serif}
.ec-hero{
  background: linear-gradient(180deg, rgba(0,78,152,.12), rgba(0,78,152,.02)), url('/assets/img/rail-pattern.svg');
  background-size: cover;
  border-bottom: 3px solid var(--rail-amber);
}
.ec-topbar{background: var(--rail-gray)}
.track-divider{
  height: 6px; background:
  repeating-linear-gradient(90deg, var(--rail-amber), var(--rail-amber) 40px, transparent 40px, transparent 80px);
}
.badge-rail{background: var(--rail-blue);}
.card-rail:hover{transform: translateY(-2px); transition:.2s; box-shadow:0 10px 24px rgba(0,0,0,.08)}
/* Spacing utilities */
.section-pad{ padding-top: clamp(2rem, 4vw, 3.75rem); padding-bottom: clamp(2rem, 4vw, 3.75rem); }
.section-gap{ margin-top: clamp(1.25rem, 2.5vw, 2.5rem); margin-bottom: clamp(1.25rem, 2.5vw, 2.5rem); }
.section-gap-lg{ margin-top: clamp(1.75rem, 3vw, 3rem); margin-bottom: clamp(1.75rem, 3vw, 3rem); }
/* ===== TIMELINE (NO OVERLAP) ===== */
.timeline{
  position:relative;
  padding-left: calc(var(--tl-left) + var(--tl-gutter));
}
.timeline::before{
  content:'';
  position:absolute;
  left: var(--tl-left);
  top: .3rem;
  bottom: .3rem;
  width: var(--tl-line);
  background: var(--rail-amber);
  border-radius: 2px;
  z-index: 0;
}
.timeline .t-item{
  position:relative;
  padding-bottom: 1.05rem;
  margin: 0;
}
.timeline .t-item:last-child{ padding-bottom: 0; }
.timeline .t-item::before{
  content:'';
  position:absolute;
  left: calc(var(--tl-left) - (var(--tl-dot)/2 - var(--tl-line)/2));
  top: .35rem;
  width: var(--tl-dot);
  height: var(--tl-dot);
  border-radius: 50%;
  background: #fff;
  border: 3px solid var(--rail-red);
  box-shadow: 0 0 0 3px rgba(215,38,61,.10);
  z-index: 0;
  pointer-events: none;
}
/* text above bullets/line */
.timeline .t-item > *{ position: relative; z-index: 1; }
.timeline h6{ margin: 0 0 .25rem 0; line-height: 1.25; }
.timeline .meta{ color:#6c757d; font-size:.95rem; }
/* Mobile tuning */
@media (max-width: 576px){
  :root{
    --tl-left: 14px;
    --tl-dot: 12px;
    --tl-line: 2px;
    --tl-gutter: 2.5rem;
  }
  .timeline .t-item{ padding-bottom: .9rem; }
}
/* ===== Stats bar ===== */
.stats-bar{
  background: linear-gradient(90deg, rgba(0,78,152,.06), rgba(255,191,0,.06));
  border-top: 1px solid #eef1f6;
  border-bottom: 1px solid #eef1f6;
}
.stat-card{ text-align:center; padding: 1.25rem 0; }
.stat-card .num{ font-weight:800; font-size: clamp(1.5rem, 2.5vw, 2.25rem); }
.stat-card .label{ color:#6c757d; }
/* ===== FAQ ===== */
.faq .accordion-button{ font-weight:600; }
.faq .accordion-button:focus{ box-shadow:none; }
.faq .accordion-item{ border:1px solid #eef1f6; border-radius:.5rem; overflow:hidden; }
.faq .accordion-item + .accordion-item{ margin-top:.5rem; }
.faq{ padding-top: clamp(2rem, 4vw, 3.5rem); padding-bottom: clamp(2rem, 4vw, 3.5rem); margin-bottomx: clamp(1.5rem, 3vw, 2.5rem); }
/* Optional extras retained */
.gallery img{border-radius:.5rem}

/* === TIMELINE GRID FIX — NO OVERLAP === */
:root{
  --tl-col: 44px;  /* width of the bullet column */
  --tl-dot: 12px;
  --tl-line: 3px;
}

/* Remove old padding-based layout and switch to a grid */
.timeline{ position: relative; padding-left: 0 !important; }

/* Vertical rail centered under the bullets */
.timeline::before{
  content:''; position: absolute;
  left: calc(var(--tl-col) / 2); transform: translateX(-50%);
  top: .2rem; bottom: .2rem; width: var(--tl-line);
  background: var(--rail-amber, #FFBF00); border-radius: 2px;
}

/* Each item = 2 columns: [bullet] [text] */
.timeline .t-item{
  display: grid;
  grid-template-columns: var(--tl-col) 1fr;
  column-gap: 1rem;
  padding-bottom: 1rem;
  margin: 0;
}
.timeline .t-item:last-child{ padding-bottom: 0; }

/* Bullet sits in the first column, never overlaps text */
.timeline .t-item::before{
  content:'';
  grid-column: 1;
  justify-self: center;     /* centers the dot on the rail */
  align-self: start;
  width: var(--tl-dot); height: var(--tl-dot);
  margin-top: .15rem;
  border-radius: 50%;
  background: #fff;
  border: 3px solid var(--rail-red, #D7263D);
  box-shadow: 0 0 0 3px rgba(215,38,61,.10);
}

/* All actual text goes in the second column */
.timeline .t-item > *{
  grid-column: 2;
  position: relative;
}

.timeline h6{ margin: 0 0 .25rem 0; line-height: 1.25; }
.timeline .meta{ color:#6c757d; font-size:.95rem; }

/* Mobile tuning */
@media (max-width: 576px){
  :root{ --tl-col: 36px; --tl-dot: 10px; --tl-line: 2px; }
  .timeline .t-item{ column-gap: .75rem; padding-bottom: .85rem; }
}