/* ============================================================
   EXPERIENCES – Slider single-card (all entries)
   Namespace: tp-exp-*
============================================================ */

.tp-exp-card{
  background: radial-gradient(120% 120% at 100% 0%, #101010 0%, #0A0A0A 60%, #252525 100%);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:14px; color:#fff;
  box-shadow:0 0 16px rgba(0,0,0,0.45);

  /* equal-height support */
  height:100%;
  display:flex; flex-direction:column;
}

/* Header */
.tp-exp-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 18px;
  background:linear-gradient(180deg,#1a1a1a 0%,#101010 100%);
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.tp-exp-title{
  font-size:1.1rem; margin:0; font-weight:600;
  display:flex; align-items:center; gap:6px;
}
.tp-exp-ico-title{
  font-size:1.15rem; color:#D90404; margin-right:4px; position:relative; top:1px;
}
.tp-exp-sub{font-size:.9rem;opacity:.8;}
.tp-exp-empty{ padding:16px 18px; opacity:.8; }

/* Slider controls */
.tp-slider-controls{display:flex; align-items:center; gap:10px;}
.tp-btn{background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1);
  border-radius:10px; padding:6px 10px; color:#fff;}
.tp-btn:hover{background:rgba(255,255,255,0.1);}
.tp-count{opacity:.85; font-size:.92rem;}

/* Slider */
.tp-slider-viewport{
  overflow:hidden;

  /* equal-height: content area grows to fill */
  flex:1 1 auto;
  display:flex; /* so track can align to height */
}
.tp-slider-track{
  display:flex; transition: transform .35s ease; will-change: transform;
  width:100%;
}
.tp-slide{
  flex: 0 0 100%;
  padding:14px;

  /* equal-height: slide matches viewport height */
  display:flex;
}
  
/* Item */
.tp-exp-item{
  background: rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:12px; padding:14px;
  transition:box-shadow .25s ease;

  /* equal-height: fill the slide */
  width:100%;
  display:flex; flex-direction:column; height:100%;
}
.tp-exp-item:hover{ box-shadow:0 0 14px rgba(217,4,4,0.15); }

/* Topline (project + date) */
.tp-exp-topline{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.tp-exp-proj{ font-weight:600; }
.tp-exp-dates{ opacity:.8; white-space:nowrap; }

/* Meta chips */
.tp-exp-meta{ display:flex; flex-wrap:wrap; gap:8px; margin:10px 0 8px; }
.tp-exp-meta-chip{
  display:inline-flex; align-items:center; gap:8px;
  background: rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.12);
  color:#fff; padding:6px 12px; border-radius:999px; font-size:.92rem;
}

/* Kırmızı ikonlar (chip içi) */
.tp-exp-ico{ color:#D90404; font-size:1rem; line-height:1; }
.tp-exp-flag{ margin-right:4px; }

/* Website/Proje Linki – butonvari */
.tp-exp-link{
  position:relative;
  border-color: rgba(217,4,4,0.5);
  color:#d90404;
  background: rgba(217,4,4,0.06);
  text-decoration:none;
}
.tp-exp-link .tp-exp-ico{ color:#D90404; }
.tp-exp-link:hover{
  color:#fff;
  background: linear-gradient(90deg, #D90404, #730707);
  border-color: transparent;
  box-shadow: 0 0 12px rgba(217,4,4,0.25);
}
.tp-exp-link:hover .tp-exp-ico{ color:#fff; }

/* Açıklama + Detay butonu */
.tp-exp-desc{ opacity:.95; font-size:.95rem; line-height:1.55; margin-bottom:10px; }
.tp-exp-btn{
  background: linear-gradient(90deg, #D90404, #730707);
  border:0; color:#fff; padding:6px 12px; border-radius:10px;
  align-self:flex-start;
}
.tp-exp-btn:hover{ filter:brightness(1.05); }

/* Responsive */
@media (max-width:575.98px){
  .tp-slide{ padding:10px; }
  .tp-exp-topline{ flex-direction:column; align-items:flex-start; gap:4px; }
  .tp-exp-dates{ align-self:flex-start; }
}

/* Desktop equal-height helper (use on the row that contains Experiences & Biography) */
@media (min-width:992px){
  .tp-equal-row{ display:flex; align-items:stretch; gap:20px; }
  .tp-equal-row > [class*="col-lg-6"]{ display:flex; }
}