/* ===================== PREMIUM VISUAL UPGRADE — Phase 1 (Homepage) =====================
   Additive only. Enhances existing classes; no markup/ID/class/JS-logic changes.
   Premium & bold: rich gradients, layered depth, gold accents, subtle motion. */
:root{ --prem-shadow:0 10px 30px rgba(0,32,90,.12),0 2px 8px rgba(0,32,90,.08);
       --prem-shadow-lg:0 22px 52px rgba(0,32,90,.24); }
html{ scroll-behavior:smooth; }
::selection{ background:var(--accent); color:#001a57; }
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-thumb{ background:linear-gradient(#003087,#001a57); border-radius:6px; border:2px solid #eef2fb; }
::-webkit-scrollbar-track{ background:#eef2fb; }

/* Nav — deeper premium shadow */
nav.main-nav{ box-shadow:0 8px 26px rgba(0,16,52,.38); }

/* Hero — premium arrows & rising content */
.hero-slider .slider-arrow{ backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.25); transition:background .3s, transform .3s, box-shadow .3s; }
.hero-slider .slider-arrow:hover{ background:var(--secondary); box-shadow:0 8px 22px rgba(200,16,46,.45); }
.hero-slider .slide.active .slide-content{ animation:premRise 1s cubic-bezier(.22,.61,.36,1) both; }
@keyframes premRise{ from{ opacity:0; transform:translateY(26px); } to{ opacity:1; transform:none; } }

/* Section titles — bold gradient underline */
.section-title h2{ letter-spacing:.3px; }
.section-title .divider{ height:4px; width:72px; border-radius:4px;
  background:linear-gradient(90deg,var(--accent),var(--secondary)); box-shadow:0 2px 8px rgba(200,16,46,.3); }

/* VC section — soft depth + photo glow */
.vc-section{ background:linear-gradient(135deg,#ffffff,#f4f8ff); }
.vc-photo-box img{ box-shadow:0 14px 34px rgba(0,32,90,.28); transition:transform .5s ease; }
.vc-photo-box:hover img{ transform:scale(1.03) rotate(-.5deg); }

/* Welcome — richer navy gradient with ambient glows */
.welcome-section{ position:relative; overflow:hidden;
  background:linear-gradient(135deg,#001233 0%,#002a6b 55%,#001a57 100%);
  box-shadow:inset 0 8px 46px rgba(0,0,0,.35); }
.welcome-section::before{ content:''; position:absolute; z-index:0; top:-45%; right:-8%; width:520px; height:520px; border-radius:50%;
  background:radial-gradient(circle,rgba(244,185,66,.18),transparent 70%); pointer-events:none; }
.welcome-section::after{ content:''; position:absolute; z-index:0; bottom:-45%; left:-8%; width:480px; height:480px; border-radius:50%;
  background:radial-gradient(circle,rgba(200,16,46,.16),transparent 70%); pointer-events:none; }
.welcome-section > *{ position:relative; z-index:1; }
.welcome-section .divider{ height:4px; width:92px; border-radius:4px;
  background:linear-gradient(90deg,var(--accent),#ffd97a); box-shadow:0 0 14px rgba(244,185,66,.5); }

/* Unit cards — top gradient accent + premium lift */
.unit-card{ position:relative; border:1px solid rgba(0,48,135,.06); box-shadow:var(--prem-shadow); }
.unit-card::before{ content:''; position:absolute; z-index:2; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg,var(--primary),var(--secondary),var(--accent));
  transform:scaleX(0); transform-origin:left; transition:transform .4s ease; }
.unit-card:hover{ transform:translateY(-8px); box-shadow:var(--prem-shadow-lg); }
.unit-card:hover::before{ transform:scaleX(1); }

/* Contact + recognitions — depth & lively logos */
.contact-section{ background:linear-gradient(135deg,#eef4ff,#e3ecff); box-shadow:inset 0 1px 0 rgba(255,255,255,.7); }
.recognitions-grid img{ transition:transform .35s ease, filter .35s ease; }
.recognitions-grid img:hover{ transform:translateY(-4px) scale(1.06); filter:drop-shadow(0 8px 16px rgba(0,32,90,.2)); }

/* Back button + ribbon micro-interactions */
.page-back-btn{ transition:transform .3s, box-shadow .3s; box-shadow:0 4px 14px rgba(200,16,46,.3); }
.page-back-btn:hover{ transform:translateX(-3px); box-shadow:0 6px 20px rgba(200,16,46,.45); }
.ribbon-link{ transition:transform .25s, background .25s; }
.ribbon-link:hover{ transform:translateY(-1px); }

/* Scroll-reveal motion (enabled only when JS adds .prem-anim -> safe if JS fails) */
#home-content.prem-anim .prem-reveal{ opacity:0; transform:translateY(32px);
  transition:opacity .85s cubic-bezier(.22,.61,.36,1), transform .85s cubic-bezier(.22,.61,.36,1); }
#home-content.prem-anim .prem-reveal.prem-in{ opacity:1; transform:none; }
@media(prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  #home-content.prem-anim .prem-reveal{ opacity:1 !important; transform:none !important; }
  .hero-slider .slide.active .slide-content{ animation:none !important; }
}