/* ==========================================================================
   VSSG India — Premium Enhancement Layer
   Loaded AFTER the template CSS so these refinements win.
   Goals: enterprise-grade typography, spacing, cards, buttons, forms & color.
   ========================================================================== */

:root {
  /* Refined brand palette — professional blue aligned to the VSSG identity */
  --base-color: #2450c9;          /* primary royal blue */
  --base-color-dark: #16357f;     /* deep navy for gradients / depth */
  --base-color-light: #eef2fe;    /* soft tint for pills & panels */
  --accent-gold: #f5a623;         /* logo gold — used sparingly */
  --dark-gray: #1c2333;           /* headings / near-black */
  --medium-gray: #667085;         /* body copy */
  --hairline: #e7eaf1;            /* subtle borders */
  --premium-shadow: 0 18px 45px -18px rgba(20, 33, 80, .28);
  --premium-shadow-sm: 0 8px 24px -12px rgba(20, 33, 80, .22);
}

/* ------- Global type rendering ------- */
html { scroll-behavior: smooth; }
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--medium-gray);
  text-rendering: optimizeLegibility;
}

/* ------- Typography hierarchy ------- */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 { color: var(--dark-gray); }
h1, .h1 { letter-spacing: -.03em; line-height: 1.06; }
h2, .h2 { letter-spacing: -.02em; line-height: 1.12; }
h3, .h3 { letter-spacing: -.02em; line-height: 1.18; }
h4, .h4 { letter-spacing: -.015em; line-height: 1.25; }
h5, .h5, h6, .h6 { letter-spacing: -.01em; }
.text-dark-gray { color: var(--dark-gray) !important; }
p { color: var(--medium-gray); }
.lead, .fs-20 { line-height: 1.7; }

/* Base color helpers remapped to the refined blue */
.text-base-color { color: var(--base-color) !important; }
.bg-base-color { background-color: var(--base-color) !important; }
.bg-base-color-transparent { background-color: rgba(36, 80, 201, .85) !important; }
.border-color-base-color { border-color: var(--base-color) !important; }

/* Richer dark gradients used by the hero + page titles */
.bg-gradient-sherpa-blue-black {
  background-image: linear-gradient(125deg, #16357f 0%, #1c2f6b 45%, #131a2e 100%) !important;
}
.bg-gradient-sherpa-black-blue {
  background-image: linear-gradient(125deg, #131a2e 0%, #1c2f6b 55%, #16357f 100%) !important;
}

/* ------- Section rhythm & soft backgrounds ------- */
.bg-solitude-blue { background-color: #f4f7fe !important; }
.bg-very-light-gray { background-color: #f7f8fb !important; }
section { padding-top: 92px; padding-bottom: 92px; }
@media (max-width: 991px){ section { padding-top: 66px; padding-bottom: 66px; } }
@media (max-width: 575px){ section { padding-top: 52px; padding-bottom: 52px; } }

/* Eyebrow / pill labels above section headings */
.bg-solitude-blue.text-uppercase,
.bg-white.text-uppercase {
  background-color: var(--base-color-light) !important;
  color: var(--base-color) !important;
  letter-spacing: .12em !important;
  font-weight: 600 !important;
  box-shadow: inset 0 0 0 1px rgba(36, 80, 201, .12);
}

/* ------- Buttons ------- */
.btn { letter-spacing: .01em; font-weight: 600; transition: all .3s cubic-bezier(.2,.7,.3,1); }
.btn-base-color {
  background: var(--base-color) !important;
  border-color: var(--base-color) !important;
  color: #fff !important;
  box-shadow: 0 12px 26px -12px rgba(36, 80, 201, .65) !important;
}
.btn-base-color:hover {
  background: var(--base-color-dark) !important;
  border-color: var(--base-color-dark) !important;
  transform: translateY(-3px);
  box-shadow: 0 18px 34px -14px rgba(22, 53, 127, .7) !important;
}
.btn-dark-gray { background: var(--dark-gray) !important; border-color: var(--dark-gray) !important; }
.btn-dark-gray:hover { background: var(--base-color) !important; border-color: var(--base-color) !important; transform: translateY(-3px); }
.btn.with-rounded span { background: #fff !important; color: var(--base-color) !important; }

/* ------- Cards & feature boxes ------- */
.feature-box.bg-white,
.card {
  border: 1px solid var(--hairline);
  border-radius: 14px !important;
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.feature-box.bg-white { box-shadow: var(--premium-shadow-sm) !important; }
.feature-box.bg-white:hover,
.icon-with-text-style-04 .feature-box:hover {
  transform: translateY(-8px);
  box-shadow: var(--premium-shadow) !important;
  border-color: rgba(36, 80, 201, .18);
}
/* keep dark-hover overlays coherent with the new blue */
.feature-box .feature-box-overlay.bg-base-color { background: linear-gradient(135deg, var(--base-color), var(--base-color-dark)) !important; }

/* Service tab image */
.tab-style-05 .nav-tabs > li.nav-item > a.nav-link {
  border-radius: 12px;
  padding: 14px 18px;
  transition: background .3s ease, color .3s ease, box-shadow .3s ease;
}
.tab-style-05 .nav-tabs > li.nav-item > a.nav-link.active {
  background: #fff;
  box-shadow: var(--premium-shadow-sm);
}
.tab-style-05 .nav-tabs > li.nav-item > a.nav-link.active i { color: var(--base-color) !important; }

/* Blog / core-value image cards */
.blog-image { border-radius: 14px; box-shadow: var(--premium-shadow-sm); }
.blog-image img { transition: transform .6s cubic-bezier(.2,.7,.3,1); }
.blog-classic .grid-item:hover .blog-image img { transform: scale(1.06); }

/* Process steps */
.process-step-icon.bg-light-red { background: var(--base-color-light) !important; }
.process-step-style-05 .process-step-icon .box-overlay.bg-base-color { background: var(--base-color) !important; }

/* ------- Images ------- */
.border-radius-5px, .border-radius-6px { border-radius: 14px !important; }
img.box-shadow-quadruple-large, img.box-shadow-medium { box-shadow: var(--premium-shadow) !important; }

/* ------- Header / navigation ------- */
.navbar .navbar-nav .nav-link { font-weight: 500; letter-spacing: .005em; }
header.sticky-active nav.navbar {
  box-shadow: 0 8px 30px -18px rgba(20, 33, 80, .45);
  backdrop-filter: saturate(140%) blur(6px);
}
.navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu {
  background-color: #fff !important;
  border-radius: 12px;
  box-shadow: var(--premium-shadow);
  padding: 10px;
  border: 1px solid var(--hairline);
}
.navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li a {
  color: var(--dark-gray) !important;
  border-bottom: 1px solid var(--hairline) !important;
  border-radius: 8px;
  padding: 11px 14px;
}
.navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li:last-child a { border-bottom: 0 !important; }
.navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li:hover a,
.navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li.active a {
  background: var(--base-color-light); color: var(--base-color) !important; opacity: 1;
}

/* ------- Forms (contact) ------- */
.contact-form-style-01 .form-control {
  border: 1px solid var(--hairline);
  border-radius: 12px;
  padding: 15px 18px 15px 46px;
  background: #fff;
  font-size: 16px;
  color: var(--dark-gray);
  transition: border-color .25s ease, box-shadow .25s ease;
}
.contact-form-style-01 textarea.form-control { padding-top: 15px; }
.contact-form-style-01 .form-control:focus {
  border-color: var(--base-color);
  box-shadow: 0 0 0 4px rgba(36, 80, 201, .12);
  outline: none;
}
.contact-form-style-01 .form-icon { color: var(--base-color); opacity: .8; }
.contact-form-style-01 .form-control::placeholder { color: #9aa2b1; }

/* ------- Footer ------- */
footer.bg-extra-medium-slate-blue {
  background: linear-gradient(160deg, #182a5f 0%, #131a2e 100%) !important;
  border-top: 3px solid var(--base-color);
}
footer .alt-font.text-white { font-weight: 600; letter-spacing: .02em; opacity: .95; }
footer ul li a { transition: color .25s ease, padding-left .25s ease; }
footer ul li a:hover { color: #fff; padding-left: 4px; }

/* ------- Client logo strip ------- */
.clients-style-08 img { filter: grayscale(100%); opacity: .55; transition: all .35s ease; }
.clients-style-08 .swiper-slide:hover img { filter: grayscale(0); opacity: 1; }

/* ------- Page-title hero refinements ------- */
.page-title-big-typography { padding-top: 190px; padding-bottom: 130px; }
.page-title-extra-large h1 { letter-spacing: -.03em; }
.opacity-extra-medium.bg-dark-slate-blue { background: #131a2e !important; opacity: .62 !important; }

/* Scroll-to-top accent */
.scroll-progress .scroll-top .scroll-point { background: var(--base-color); }
