/* TSIC History Timeline */

.tsic-htl{--htl-navy:#173f58;--htl-accent:#63aed5;--htl-light:#9fcde5;--htl-card:#ffffff;--htl-text:#4a5b66;
  --htl-gap:28px;--htl-per:3;position:relative;width:100%;box-sizing:border-box;}
.tsic-htl *,.tsic-htl *::before,.tsic-htl *::after{box-sizing:border-box;}

/* header row: title left, arrows right */
.tsic-htl__head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:6px 24px;margin-bottom:36px;}
.tsic-htl__eyebrow{grid-column:1;color:var(--htl-accent);text-transform:uppercase;letter-spacing:.18em;font-size:13px;font-weight:600;}
.tsic-htl__heading{grid-column:1;margin:0 !important;color:var(--htl-navy);line-height:1.2;}
.tsic-htl__nav{grid-column:2;grid-row:1 / span 2;display:flex;gap:10px;}
.tsic-htl__btn{width:48px;height:48px;border-radius:50% !important;border:1.5px solid var(--htl-navy) !important;
  background:transparent !important;color:var(--htl-navy) !important;display:flex;align-items:center;justify-content:center;
  padding:0 !important;cursor:pointer;transition:background .25s,color .25s,opacity .25s;box-shadow:none !important;}
.tsic-htl__btn:hover:not(:disabled){background:var(--htl-navy) !important;color:#fff !important;}
.tsic-htl__btn:disabled{opacity:.3;cursor:default;}
.tsic-htl__btn svg{display:block;}


/* scrolling track */
.tsic-htl__track{display:flex;gap:var(--htl-gap);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  scrollbar-width:none;-ms-overflow-style:none;padding:6px 24px 48px;margin:0 -24px -28px;scroll-padding:0 24px;outline:none;}
.tsic-htl__track::-webkit-scrollbar{display:none;}
.tsic-htl__item{flex:0 0 calc((100% - (var(--htl-per) - 1) * var(--htl-gap)) / var(--htl-per));scroll-snap-align:start;
  display:flex;flex-direction:column;}


/* line + dot + year */
.tsic-htl__marker{position:relative;height:74px;}
.tsic-htl__marker::before{content:"";position:absolute;left:0;right:calc(var(--htl-gap) * -1);top:51px;height:2px;background:var(--htl-light);}
.tsic-htl__item:last-child .tsic-htl__marker::before{right:0;}
.tsic-htl__year{position:absolute;left:0;top:0;font-size:26px;font-weight:700;line-height:1;color:var(--htl-navy);letter-spacing:.02em;}
.tsic-htl__dot{position:absolute;left:0;top:43px;width:18px;height:18px;border-radius:50%;background:#fff;
  border:4px solid var(--htl-accent);box-shadow:0 0 0 5px rgba(99,174,213,.18);transition:background .25s,transform .25s;}
.tsic-htl__item:hover .tsic-htl__dot{background:var(--htl-accent);transform:scale(1.15);}


/* card */
.tsic-htl__card{position:relative;flex:1;background:var(--htl-card);border-radius:14px;padding:28px 28px 30px;
  box-shadow:0 8px 22px rgba(23,63,88,.07);transition:transform .3s,box-shadow .3s;}
.tsic-htl__card::before{content:"";position:absolute;top:-7px;left:2px;width:14px;height:14px;background:var(--htl-card);transform:rotate(45deg);}
.tsic-htl__item:hover .tsic-htl__card{transform:translateY(-4px);box-shadow:0 14px 30px rgba(23,63,88,.12);}
.tsic-htl__title{margin:0 0 10px !important;font-size:21px !important;line-height:1.3 !important;color:var(--htl-navy) !important;}
.tsic-htl__text{margin:0 !important;color:var(--htl-text);font-size:15px;line-height:1.7;}


/* responsive */
@media (max-width:1024px){ .tsic-htl{--htl-per:2;} }
@media (max-width:767px){
  .tsic-htl{--htl-per:1.15;--htl-gap:18px;}
  .tsic-htl__btn{width:42px;height:42px;}
  .tsic-htl__head{margin-bottom:24px;}
}
