/* ================================================================
   about.css  –  Shivap Solutions  |  About Page Styles ONLY
   ================================================================ */

* { font-family: 'Poppins', sans-serif; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: #fff; color: #1e293b; -webkit-font-smoothing: antialiased; }
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #1d4ed8; border-radius: 10px; }

/* ── Gradient text ── */
.gt {
  background: linear-gradient(135deg, #1d4ed8, #0d9488);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.gto {
  background: linear-gradient(135deg, #f97316, #dc2626);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ── Pulse dot ── */
@keyframes pd { 0%,100%{opacity:1} 50%{opacity:.25} }
.pd { animation: pd 1.5s infinite; }

/* ── Reveal utilities (controlled by header.js) ── */
.rv  { opacity:0; transform:translateY(28px); transition:opacity .65s ease,         transform .65s ease; }
.rv2 { opacity:0; transform:translateY(28px); transition:opacity .65s ease .12s,    transform .65s ease .12s; }
.rv3 { opacity:0; transform:translateY(28px); transition:opacity .65s ease .24s,    transform .65s ease .24s; }
.rv.vis, .rv2.vis, .rv3.vis { opacity:1; transform:translateY(0); }

/* ── Lift hover ── */
.lift { transition: transform .3s, box-shadow .3s; }
.lift:hover { transform: translateY(-5px); box-shadow: 0 18px 40px rgba(29,78,216,.1); }

/* ── Hero floating animations ── */
@keyframes hFloat  { 0%,100%{transform:translateY(0)}  50%{transform:translateY(-14px)} }
@keyframes hFloat2 { 0%,100%{transform:translateY(0)}  50%{transform:translateY(-9px)} }
@keyframes hSpin   { from{transform:rotate(0deg)}  to{transform:rotate(360deg)} }
@keyframes dotPulse{ 0%,100%{transform:scale(1);opacity:.7} 50%{transform:scale(1.8);opacity:1} }

/* ── Skill bars ── */
@keyframes barFill { from{width:0} to{width:var(--w)} }
.skill-bar {
  animation: barFill 1.4s ease forwards;
  width: 0;
}

/* ── Team card hover overlay ── */
.team-card .overlay {
  opacity: 0;
  transition: opacity .3s ease;
  background: linear-gradient(to top, rgba(29,78,216,.9) 0%, rgba(29,78,216,.5) 60%, transparent 100%);
}
.team-card:hover .overlay { opacity: 1; }

.team-card .social-row {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .3s ease .05s, transform .3s ease .05s;
}
.team-card:hover .social-row { opacity: 1; transform: translateY(0); }

.team-card .info-row { transform: translateY(0); transition: transform .3s ease; }
.team-card:hover .info-row { transform: translateY(-8px); }

/* ── Value card hover ── */
.val-card { transition: transform .3s, box-shadow .3s, border-color .3s; }
.val-card:hover { transform: translateY(-5px); }

/* ── Timeline line ── */
@keyframes lineGrow { from{height:0} to{height:100%} }

/* ── Testimonial ── */
.tq::before {
  content: '"';
  position: absolute; top: -8px; left: 16px;
  font-size: 70px; color: #dbeafe;
  line-height: 1; font-weight: 800;
}
