/* ============================================================
   SARVAM PIPES — Additional CSS
   This file holds every non-utility, signature style used across
   the prototype (fonts, curves, motion, focus states, stat/step
   styling). Tailwind's utility classes (bg-navy, px-6, grid...)
   won't exist once the site is rebuilt in Elementor, so recreate
   spacing/layout with native Elementor controls — but paste THIS
   file, as-is, into WordPress → Appearance → Customize →
   Additional CSS to keep the signature styling identical.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;600;700;800&family=Inter:wght@400;500;600&display=swap');

:root{
  --navy:#132A52;
  --navy-dark:#0D1F3D;
  --orange:#F5891E;
  --bg-off:#F7F8FA;
  --text-gray:#5B6472;
  --border:#E7EAEF;
}

body{
  font-family:'Inter', sans-serif;
  color:var(--text-gray);
  background:var(--bg-off);
}
h1,h2,h3,h4,.font-heading{
  font-family:'Poppins', sans-serif;
}

/* Sticky header gains a shadow once the page scrolls */
#site-header.scrolled{
  box-shadow:0 4px 20px rgba(19,42,82,0.08);
}

/* Nav link underline (hover + active state) */
.nav-link{
  position:relative;
}
.nav-link::after{
  content:'';
  position:absolute;
  left:0; bottom:-2px;
  width:0; height:2px;
  background:var(--orange);
  transition:width .25s ease;
}
.nav-link:hover::after,
.nav-link.active::after{
  width:100%;
}
.nav-link.active{
  color:var(--orange);
}

/* Mobile nav panel */
#mobile-nav:not(.hidden){
  display:flex;
}

/* Hero curved decorative shape (bottom-left signature motif) */
.hero-curve{
  position:absolute;
  left:-60px; bottom:-80px;
  width:260px; height:260px;
  background:var(--orange);
  border-radius:50%;
  opacity:.15;
  filter:blur(2px);
  pointer-events:none;
}

/* Product / info / industry cards */
.card-lift{
  transition:transform .25s ease, box-shadow .25s ease;
}
.card-lift:hover{
  transform:translateY(-6px);
  box-shadow:0 20px 40px rgba(19,42,82,0.12);
}

/* Stat strip numbers */
.stat-number{
  font-family:'Poppins', sans-serif;
  font-weight:800;
}

/* Product category filter pills (Products page) */
.filter-pill{
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.filter-pill.active{
  background:var(--orange);
  color:#fff;
  border-color:var(--orange);
}

/* Quality process step connector line (Quality page) */
.step-item{
  position:relative;
}
.step-connector::before{
  content:'';
  position:absolute;
  top:28px; left:50%;
  width:100%; height:2px;
  background:var(--border);
  z-index:0;
}
.step-item:last-child .step-connector::before{
  display:none;
}

/* Page header banner decorative circle */
.banner-circle{
  position:absolute;
  right:-40px; top:-40px;
  width:260px; height:260px;
  border-radius:50%;
  background:rgba(245,137,30,0.10);
  pointer-events:none;
}

/* Accessibility: visible focus ring everywhere */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:3px solid var(--orange);
  outline-offset:2px;
}

/* Respect reduced-motion preference */
@media (prefers-reduced-motion: reduce){
  *{
    animation-duration:.001ms !important;
    transition-duration:.001ms !important;
  }
}