/* =============================================
   GREENROUTE — GLOBAL STYLES
   Navy · Gold · White · Black
   ============================================= */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600;700;900&family=Exo+2:wght@300;400;500;600&family=Rajdhani:wght@300;400;500;600;700&display=swap');

:root {
  --navy:        #0a1628;
  --navy-mid:    #0d1f3c;
  --navy-light:  #152847;
  --gold:        #c9a227;
  --gold-light:  #e8c547;
  --gold-pale:   #f0d882;
  --white:       #f0f4ff;
  --black:       #060d1a;
  --green-neon:  #00e676;
  --green-glow:  #00c853;
  --cyan:        #00e5ff;
  --purple:      #e040fb;
  --glass:       rgba(13,31,60,0.72);
  --glass-light: rgba(255,255,255,0.04);
  --glass-border:rgba(201,162,39,0.28);
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   18px;
  --shadow-gold: 0 8px 30px rgba(201,162,39,0.18);
  --shadow-green:0 8px 30px rgba(0,230,118,0.18);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; scroll-behavior:smooth; }

body {
  background: var(--black);
  color: var(--white);
  font-family: 'Exo 2', sans-serif;
  overflow-x: hidden;
  cursor: none;
  line-height: 1.6;
}

/* ---- CURSOR ---- */
.gr-cursor {
  position: fixed; width: 12px; height: 12px;
  background: var(--gold); border-radius: 50%;
  pointer-events: none; z-index: 99999;
  transform: translate(-50%,-50%);
  transition: transform .1s;
  mix-blend-mode: difference;
}
.gr-cursor-trail {
  position: fixed; width: 30px; height: 30px;
  border: 1px solid var(--gold-light); border-radius: 50%;
  pointer-events: none; z-index: 99998;
  transform: translate(-50%,-50%);
  transition: all .15s ease;
  opacity: .45;
}

/* ---- PARTICLES ---- */
#gr-particles {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  pointer-events: none; z-index: 0;
}

/* ---- SCROLL PROGRESS ---- */
#gr-scroll-line {
  position: fixed; top: 0; left: 0; height: 3px; width: 0%;
  background: linear-gradient(90deg, var(--gold), var(--green-neon));
  z-index: 10000; transition: width .1s;
}

/* ---- NAVBAR ---- */
.gr-navbar {
  background: rgba(250, 250, 252, 0.96) !important;
  border-bottom: 1px solid var(--glass-border);
  backdrop-filter: blur(22px);
  padding: .7rem 0;
  position: fixed; top: 0; width: 100%; z-index: 1000;
}

.gr-logo-icon {
  width: 44px; height: 44px;
  background: linear-gradient(135deg, var(--navy-mid), var(--navy-light));
  border: 2px solid var(--gold); border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  position: relative; overflow: hidden;
}
.gr-logo-icon::before {
  content:''; position:absolute; width:100%; height:50%;
  background: linear-gradient(to bottom, var(--gold), transparent);
  top:0; opacity:.3;
}
.gr-logo-icon i { color: var(--gold); font-size: 1.2rem; z-index: 1; }

.gr-logo-main  { font-family:'Orbitron',monospace; font-weight:700; font-size:.92rem; color:var(--gold-light); letter-spacing:2px; line-height:1.1; }
.gr-logo-sub   { font-family:'Rajdhani',sans-serif; font-size:.62rem; color:var(--white); opacity:.65; letter-spacing:3px; text-transform:uppercase; }

.gr-nav-link {
  color: rgba(23, 23, 24, 0.8) !important;
  font-family:'Rajdhani',sans-serif; font-weight:500;
  font-size:.83rem; letter-spacing:1.5px; text-transform:uppercase;
  padding:.38rem .82rem !important; transition: all .3s; position:relative;
}
.gr-nav-link::after {
  content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%);
  width:0; height:1px; background:var(--gold); transition:width .3s;
}
.gr-nav-link:hover              { color: var(--gold-light) !important; }
.gr-nav-link:hover::after       { width:80%; }
.gr-nav-link.active             { color: var(--gold-light) !important; }
.gr-nav-link.active::after      { width:80%; }

.gr-nav-cta {
  background: linear-gradient(135deg, var(--gold), #8a6215);
  color: var(--black) !important; border-radius: var(--radius-sm);
  font-weight: 700; padding: .4rem 1.2rem !important;
}
.gr-nav-cta:hover { background: var(--gold-light) !important; }

/* ---- SECTION WRAPPERS ---- */
.sec-dark  { background: var(--black);    padding: 6rem 0; position:relative; z-index:1; }
.sec-navy  { background: var(--navy);     padding: 6rem 0; position:relative; z-index:1; }
.sec-mid   { background: var(--navy-mid); padding: 6rem 0; position:relative; z-index:1; }

/* ---- SECTION HEADER ---- */
.gr-section-label {
  display:inline-block;
  font-family:'Rajdhani',sans-serif; font-size:.74rem; letter-spacing:4px;
  text-transform:uppercase; color:var(--green-neon);
  border:1px solid rgba(0,230,118,.3); padding:.28rem 1rem; border-radius:20px;
  margin-bottom:1rem;
}
.gr-section-title {
  font-family:'Orbitron',monospace;
  font-size: clamp(1.55rem, 3.5vw, 2.5rem);
  font-weight:700; color:var(--white); margin-bottom:.7rem;
}
.gr-section-title .t-gold  { color: var(--gold-light); }
.gr-section-title .t-green {
  background:linear-gradient(90deg,var(--green-neon),var(--cyan));
  background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.gr-section-sub {
  color:rgba(240,244,255,.6); font-size:.94rem;
  max-width:600px; margin:0 auto; line-height:1.75;
}
.gr-title-line {
  width:58px; height:2px;
  background:linear-gradient(90deg, var(--gold), transparent);
  margin:1rem auto 0;
}

/* ---- GLASS CARD ---- */
.gr-glass {
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-md);
  backdrop-filter: blur(16px);
  transition: all .3s;
}
.gr-glass:hover {
  border-color: rgba(201,162,39,.55);
  box-shadow: var(--shadow-gold);
  transform: translateY(-4px);
}

/* ---- FEATURE CARD ---- */
.gr-feat-card {
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-md);
  padding: 1.7rem; height:100%;
  backdrop-filter:blur(15px);
  transition: all .3s; position:relative; overflow:hidden;
}
.gr-feat-card::before {
  content:''; position:absolute; top:0; left:0; width:100%; height:3px;
  background: linear-gradient(90deg, var(--gold), var(--gold-light), transparent);
}
.gr-feat-card.c-green::before { background:linear-gradient(90deg,var(--green-neon),var(--cyan),transparent); }
.gr-feat-card.c-cyan::before  { background:linear-gradient(90deg,var(--cyan),#7c4dff,transparent); }
.gr-feat-card.c-purple::before{ background:linear-gradient(90deg,var(--purple),#ff80ab,transparent); }
.gr-feat-card:hover {
  border-color: rgba(201,162,39,.5);
  box-shadow: 0 14px 36px rgba(0,0,0,.4);
  transform: translateY(-5px);
}

/* ---- ICON WRAP ---- */
.gr-icon-wrap {
  width:54px; height:54px; border-radius:var(--radius-sm);
  display:flex; align-items:center; justify-content:center; margin-bottom:1.1rem;
}
.iw-gold   { background:rgba(201,162,39,.14); border:1px solid rgba(201,162,39,.3); }
.iw-green  { background:rgba(0,230,118,.12);  border:1px solid rgba(0,230,118,.25); }
.iw-cyan   { background:rgba(0,229,255,.12);  border:1px solid rgba(0,229,255,.25); }
.iw-purple { background:rgba(224,64,251,.12); border:1px solid rgba(224,64,251,.25);}
.iw-gold i   { color:var(--gold-light); font-size:1.4rem; }
.iw-green i  { color:var(--green-neon); font-size:1.4rem; }
.iw-cyan i   { color:var(--cyan);       font-size:1.4rem; }
.iw-purple i { color:var(--purple);     font-size:1.4rem; }

/* ---- CARD TEXT ---- */
.gr-card-title { font-family:'Orbitron',monospace; font-size:.95rem; font-weight:600; color:var(--white); margin-bottom:.55rem; }
.gr-card-desc  { font-size:.84rem; color:rgba(240,244,255,.65); line-height:1.72; margin-bottom:.9rem; }
.gr-tags       { display:flex; flex-wrap:wrap; gap:.4rem; }
.gr-tag {
  background:rgba(201,162,39,.1); border:1px solid rgba(201,162,39,.2);
  color:var(--gold-pale); font-size:.63rem; padding:.18rem .6rem;
  border-radius:20px; font-family:'Rajdhani',sans-serif; letter-spacing:1px;
}
.gr-tag.green  { background:rgba(0,230,118,.1); border-color:rgba(0,230,118,.2); color:var(--green-neon); }
.gr-tag.cyan   { background:rgba(0,229,255,.1); border-color:rgba(0,229,255,.2); color:var(--cyan); }
.gr-tag.purple { background:rgba(224,64,251,.1); border-color:rgba(224,64,251,.2); color:var(--purple); }

/* ---- BUTTONS ---- */
.gr-btn-primary {
  background: linear-gradient(135deg, var(--gold), #8a6215);
  color: var(--black); border:none;
  padding:.88rem 2rem;
  font-family:'Orbitron',monospace; font-size:.78rem; font-weight:700; letter-spacing:2px;
  border-radius:var(--radius-sm); cursor:pointer; transition:all .3s;
  position:relative; overflow:hidden; text-decoration:none; display:inline-block;
}
.gr-btn-primary::before {
  content:''; position:absolute; top:0; left:-100%; width:100%; height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
  transition: left .5s;
}
.gr-btn-primary:hover { transform:translateY(-2px); box-shadow:0 8px 26px rgba(201,162,39,.42); color:var(--black); }
.gr-btn-primary:hover::before { left:100%; }

.gr-btn-outline {
  background:transparent; color:var(--white);
  border:1px solid rgba(201,162,39,.48);
  padding:.88rem 2rem;
  font-family:'Orbitron',monospace; font-size:.78rem; font-weight:600; letter-spacing:2px;
  border-radius:var(--radius-sm); cursor:pointer; transition:all .3s;
  text-decoration:none; display:inline-block;
}
.gr-btn-outline:hover { border-color:var(--gold); color:var(--gold-light); box-shadow:0 0 22px rgba(201,162,39,.22); }

/* ---- PROGRESS BAR ---- */
.gr-progress { height:6px; border-radius:3px; background:rgba(255,255,255,.1); overflow:hidden; margin-top:.8rem; }
.gr-progress-fill { height:100%; border-radius:3px; animation:progressLoad 2.5s ease-out forwards; }
@keyframes progressLoad { from{width:0} }

/* ---- METRIC CARD ---- */
.gr-metric {
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius-md); padding:1.4rem; text-align:center;
}
.gr-metric-val { font-family:'Orbitron',monospace; font-size:1.9rem; font-weight:700; display:block; }
.gr-metric-lbl { font-family:'Rajdhani',sans-serif; font-size:.68rem; letter-spacing:2px; text-transform:uppercase; color:rgba(240,244,255,.48); }

/* ---- FADE UP ---- */
.fade-up { opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease; }
.fade-up.visible { opacity:1; transform:translateY(0); }

/* ---- SECTION DIVIDER ---- */
.gr-divider {
  height:2px;
  background:linear-gradient(90deg,transparent,var(--gold),var(--green-neon),var(--gold),transparent);
  opacity:.28;
}

/* ---- BACK-TOP & MODE TOGGLE ---- */
.gr-back-top {
  position:fixed; bottom:5.5rem; right:2rem; z-index:999;
  width:46px; height:46px; border-radius:50%;
  background:linear-gradient(135deg,var(--gold),#8a6215);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--black); transition:all .3s;
  opacity:0; pointer-events:none;
}
.gr-back-top.show { opacity:1; pointer-events:all; }
.gr-back-top:hover { transform:translateY(-3px); box-shadow:0 8px 22px rgba(201,162,39,.42); }

.gr-mode-btn {
  position:fixed; bottom:2rem; right:2rem; z-index:999;
  width:50px; height:50px; border-radius:50%;
  background:var(--glass); border:1px solid var(--glass-border);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; backdrop-filter:blur(10px); transition:all .3s;
}
.gr-mode-btn:hover { border-color:var(--gold); box-shadow:0 0 22px rgba(201,162,39,.32); }
.gr-mode-btn i { font-size:1.18rem; color:var(--gold-light); }

/* ---- ANIMATIONS ---- */
@keyframes pulse-glow {
  0%,100%{ box-shadow:0 0 10px rgba(0,230,118,.2); }
  50%    { box-shadow:0 0 26px rgba(0,230,118,.55); }
}
@keyframes blink     { 0%,100%{opacity:1} 50%{opacity:.2} }
@keyframes shimmer   { 0%{background-position:0%} 100%{background-position:200%} }
@keyframes spinSlow  { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
@keyframes spinFast  { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
@keyframes arrowPulse{ 0%,100%{opacity:.3} 50%{opacity:1} }
@keyframes slide     { from{transform:translateX(-100%)} to{transform:translateX(100%)} }
@keyframes transmit  { from{left:-30%} to{left:130%} }
@keyframes routeMove { from{left:-20%} to{left:120%} }
@keyframes gridShift { 0%{background-position:0 0} 100%{background-position:60px 60px} }

/* ---- FOOTER ---- */
.gr-footer {
  background:var(--black);
  border-top:1px solid rgba(201,162,39,.14);
  padding:4rem 0 0; position:relative; overflow:hidden;
}
.gr-footer::before {
  content:''; position:absolute; top:0; left:0; width:100%; height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),var(--green-neon),var(--gold),transparent);
  animation:shimmer 4s linear infinite; background-size:200% 100%;
}
.gr-footer-col h6 {
  font-family:'Orbitron',monospace; font-size:.68rem; color:var(--gold-light);
  letter-spacing:2px; text-transform:uppercase; margin-bottom:1.1rem;
}
.gr-footer-col ul { list-style:none; padding:0; }
.gr-footer-col ul li { margin-bottom:.58rem; }
.gr-footer-col ul li a {
  color:rgba(240,244,255,.52); text-decoration:none; font-size:.84rem;
  transition:all .3s; display:flex; align-items:center; gap:.4rem;
}
.gr-footer-col ul li a:hover { color:var(--gold-light); padding-left:5px; }
.gr-footer-bottom {
  border-top:1px solid rgba(201,162,39,.1);
  padding:1.5rem 0; margin-top:3rem;
  position:relative; overflow:hidden;
}
.gr-footer-bottom::after {
  content:''; position:absolute; bottom:0; left:0; width:100%; height:2px;
  background:linear-gradient(90deg,transparent,var(--green-neon),transparent);
  animation:slide 3s linear infinite;
}
.gr-social-btn {
  width:36px; height:36px;
  background:rgba(201,162,39,.1); border:1px solid rgba(201,162,39,.2);
  border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center;
  color:var(--gold-light); text-decoration:none; transition:all .3s; font-size:.78rem;
}
.gr-social-btn:hover { background:rgba(201,162,39,.22); color:var(--gold-light); }

/* ---- RESPONSIVE ---- */
@media(max-width:768px) {
  .sec-dark,.sec-navy,.sec-mid { padding:4rem 0; }
}


.gr-navbar-logo{
    height:85px;
    width:auto;
}


.dropdown-submenu {
  position: relative;
}

.dropdown-submenu .dropdown-menu {
  top: 0;
  left: 100%;
  margin-left: 0.1rem;
  display: none;
}

.dropdown-submenu:hover .dropdown-menu {
  display: block;
}

.gr-nav-link,
.dropdown-item {
  text-decoration: none !important;
  color: inherit;
}

.gr-nav-link:hover,
.dropdown-item:hover {
  text-decoration: none !important;
}

/* ════════════════════════════════════════
   WIND ENERGY — MAIN LANDING PAGE
   Pragathi Powers · same navy/gold theme
════════════════════════════════════════ */

/* ── WIND HERO ── */
.wind-hero {
  min-height: 100vh; position: relative; overflow: hidden;
  background: linear-gradient(150deg, var(--black) 0%, #071524 40%, var(--navy) 80%, #0d2d50 100%);
  display: flex; align-items: center; padding-top: 80px;
}
.wind-hero-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(201,168,76,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201,168,76,.03) 1px, transparent 1px);
  background-size: 70px 70px;
}
/* Animated wind lines sweeping across */
.wind-lines { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.wl { position: absolute; height: 1px; background: linear-gradient(90deg, transparent, rgba(201,168,76,.18), transparent); border-radius: 1px; animation: windSweep linear infinite; }
.wl:nth-child(1) { width: 40%; top: 18%; animation-duration: 4s; animation-delay: 0s; }
.wl:nth-child(2) { width: 55%; top: 32%; animation-duration: 5s; animation-delay: .8s; }
.wl:nth-child(3) { width: 35%; top: 50%; animation-duration: 3.5s; animation-delay: 1.4s; }
.wl:nth-child(4) { width: 48%; top: 65%; animation-duration: 4.5s; animation-delay: .4s; }
.wl:nth-child(5) { width: 30%; top: 80%; animation-duration: 3.8s; animation-delay: 1.9s; }
.wl:nth-child(6) { width: 60%; top: 42%; animation-duration: 6s; animation-delay: 2.5s; }
@keyframes windSweep { from { left: -65%; opacity: 0; } 20% { opacity: 1; } 80% { opacity: 1; } to { left: 110%; opacity: 0; } }

/* Turbine SVG scene */
.turbine-scene {
  position: absolute; right: -2%; bottom: 0;
  width: 54%; height: 100%;
  display: flex; align-items: flex-end; justify-content: flex-end;
  pointer-events: none;
}
.turbine-silhouette { position: relative; }
.turbine-tower { width: 14px; background: linear-gradient(to top, var(--navy-light), #2a5a8c, rgba(42,90,140,.4)); border-radius: 7px 7px 3px 3px; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }
.turbine-hub { position: absolute; width: 18px; height: 18px; border-radius: 50%; background: radial-gradient(circle, #ddd, #aaa); border: 2px solid rgba(201,168,76,.4); top: 0; left: 50%; transform: translateX(-50%) translateY(-50%); z-index: 5; box-shadow: 0 0 14px rgba(201,168,76,.3); }
.turbine-blades { position: absolute; top: 0; left: 50%; transform: translateX(-50%) translateY(-50%); transform-origin: center; animation: spinBlade linear infinite; }
.blade { position: absolute; width: 5px; border-radius: 3px 3px 0 0; background: linear-gradient(to top, rgba(200,220,255,.9), rgba(150,180,220,.7)); transform-origin: bottom center; left: 50%; transform: translateX(-50%); }

/* big turbine */
.t-big { bottom: 0; right: 5%; }
.t-big .turbine-tower { height: 400px; }
.t-big .turbine-blades { animation-duration: 5s; }
.t-big .blade { height: 180px; }
.t-big .blade:nth-child(1) { transform: translateX(-50%) rotate(0deg); }
.t-big .blade:nth-child(2) { transform: translateX(-50%) rotate(120deg); }
.t-big .blade:nth-child(3) { transform: translateX(-50%) rotate(240deg); }

/* medium turbine */
.t-med { bottom: 0; right: 22%; }
.t-med .turbine-tower { height: 280px; }
.t-med .turbine-blades { animation-duration: 6s; }
.t-med .blade { height: 120px; }
.t-med .blade:nth-child(1) { transform: translateX(-50%) rotate(0deg); }
.t-med .blade:nth-child(2) { transform: translateX(-50%) rotate(120deg); }
.t-med .blade:nth-child(3) { transform: translateX(-50%) rotate(240deg); }

/* small turbine */
.t-sml { bottom: 0; right: 38%; }
.t-sml .turbine-tower { height: 180px; }
.t-sml .turbine-blades { animation-duration: 7s; }
.t-sml .blade { height: 75px; }
.t-sml .blade:nth-child(1) { transform: translateX(-50%) rotate(60deg); }
.t-sml .blade:nth-child(2) { transform: translateX(-50%) rotate(180deg); }
.t-sml .blade:nth-child(3) { transform: translateX(-50%) rotate(300deg); }

@keyframes spinBlade { from { transform: translateX(-50%) translateY(-50%) rotate(0deg); } to { transform: translateX(-50%) translateY(-50%) rotate(360deg); } }

/* ground line */
.turbine-ground { position: absolute; bottom: 0; left: 0; right: 0; height: 80px; background: linear-gradient(to top, rgba(8,31,58,.9), transparent); border-top: 1px solid rgba(201,168,76,.08); }

/* orbs */
.orb { position: absolute; border-radius: 50%; filter: blur(90px); pointer-events: none; }

/* HERO CONTENT */
.hero-badge {
  display: inline-flex; align-items: center; gap: .5rem;
  background: rgba(201,168,76,.1); border: 1px solid rgba(201,168,76,.25);
  color: var(--gold); padding: .4rem 1.1rem; border-radius: 50px;
  font-size: .65rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
  margin-bottom: 1.8rem; animation: fadeUp .7s ease both;
}
.hero-title {
  font-size: clamp(3rem,6.5vw,5.5rem); font-weight: 700; line-height: 1.03;
  color: var(--white); margin-bottom: 1.5rem; animation: fadeUp .7s .1s ease both;
}
.hero-title em { font-style: italic; color: var(--gold); }
.hero-title .wind-icon { display: inline-block; animation: windRock 2.5s ease-in-out infinite; }
@keyframes windRock { 0%,100%{transform:rotate(-5deg)} 50%{transform:rotate(5deg)} }
.hero-desc { color: var(--gray-light); font-size: 1.05rem; line-height: 1.88; max-width: 520px; margin-bottom: 2.5rem; animation: fadeUp .7s .2s ease both; }
.hero-btns { display: flex; gap: 1rem; flex-wrap: wrap; animation: fadeUp .7s .3s ease both; }
.wind-stat-grid {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 1px;
  background: rgba(201,168,76,.1); border: 1px solid rgba(201,168,76,.1);
  border-radius: 18px; overflow: hidden; margin-top: 3rem;
  animation: fadeUp .7s .4s ease both;
}
.wstat { background: rgba(8,15,26,.8); backdrop-filter: blur(8px); padding: 1.4rem; text-align: center; }
.wstat-n { font-family: var(--font-display); font-size: 2rem; font-weight: 700; color: var(--gold); }
.wstat-l { font-size: .66rem; color: var(--gray); text-transform: uppercase; letter-spacing: .13em; margin-top: .25rem; }

/* ── MARQUEE STRIP ── */
.marquee-strip {
  background: rgba(201,168,76,.06); border-top: 1px solid rgba(201,168,76,.12); border-bottom: 1px solid rgba(201,168,76,.12);
  padding: .8rem 0; overflow: hidden; white-space: nowrap;
}
.marquee-inner { display: inline-flex; gap: 3rem; animation: marqueeScroll 22s linear infinite; }
.marquee-item { display: inline-flex; align-items: center; gap: .6rem; font-size: .72rem; color: var(--gold); letter-spacing: .14em; text-transform: uppercase; font-weight: 600; }
.marquee-item i { opacity: .6; }
@keyframes marqueeScroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ── SECTION CARDS ── */
.wind-section-card {
  background: linear-gradient(135deg, var(--navy-mid), var(--navy));
  border: 1px solid rgba(201,168,76,.1); border-radius: 24px;
  overflow: hidden; transition: all var(--transition); height: 100%;
  display: flex; flex-direction: column; position: relative;
}
.wind-section-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity: 0; transition: opacity var(--transition);
}
.wind-section-card:hover { transform: translateY(-10px); box-shadow: 0 40px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(201,168,76,.22); border-color: rgba(201,168,76,.28); }
.wind-section-card:hover::before { opacity: 1; }
.wsc-img { height: 220px; overflow: hidden; position: relative; }
.wsc-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.wind-section-card:hover .wsc-img img { transform: scale(1.07); }
.wsc-img-ov { position: absolute; inset: 0; background: linear-gradient(to top, rgba(8,15,26,.92) 0%, rgba(8,15,26,.2) 60%, transparent 100%); }
.wsc-num-badge {
  position: absolute; top: 1rem; left: 1rem;
  width: 38px; height: 38px; border-radius: 50%;
  background: rgba(8,15,26,.85); backdrop-filter: blur(10px);
  border: 1px solid rgba(201,168,76,.35); color: var(--gold);
  font-family: var(--font-display); font-size: 1rem; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.wsc-body { padding: 1.8rem; flex: 1; display: flex; flex-direction: column; }
.wsc-icon { font-size: 2rem; margin-bottom: .9rem; }
.wsc-title { font-family: var(--font-display); font-size: 1.45rem; font-weight: 700; color: var(--white); margin-bottom: .7rem; }
.wsc-text { color: var(--gray); font-size: .87rem; line-height: 1.8; flex: 1; margin-bottom: 1.5rem; }
.wsc-link { display: inline-flex; align-items: center; gap: .5rem; color: var(--gold); font-size: .76rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; transition: gap var(--transition); }
.wind-section-card:hover .wsc-link { gap: .9rem; }

/* ── WHY WIND ── */
.why-wind-card {
  background: rgba(255,255,255,.025); border: 1px solid rgba(201,168,76,.1);
  border-radius: 18px; padding: 1.8rem; transition: all var(--transition);
  position: relative; overflow: hidden;
}
.why-wind-card::after { content: ''; position: absolute; bottom: 0; right: 0; width: 80px; height: 80px; background: radial-gradient(circle, rgba(201,168,76,.07), transparent); border-radius: 50%; }
.why-wind-card:hover { border-color: rgba(201,168,76,.3); transform: translateY(-7px); box-shadow: 0 24px 50px rgba(0,0,0,.45); }
.wwc-icon { width: 50px; height: 50px; border-radius: 14px; background: rgba(201,168,76,.1); border: 1px solid rgba(201,168,76,.2); display: flex; align-items: center; justify-content: center; font-size: 1.3rem; margin-bottom: 1.1rem; transition: all var(--transition); }
.why-wind-card:hover .wwc-icon { background: rgba(201,168,76,.2); box-shadow: 0 6px 20px rgba(201,168,76,.2); }
.wwc-title { font-family: var(--font-display); font-size: 1.1rem; font-weight: 700; color: var(--white); margin-bottom: .5rem; }
.wwc-text { font-size: .86rem; color: var(--gray); line-height: 1.76; }

/* ── CTA SECTION ── */
.wind-cta {
  position: relative; overflow: hidden; padding: 8rem 0;
  background: linear-gradient(135deg, var(--navy), var(--navy-mid), var(--navy));
}
.wind-cta::before {
  content: '🌬'; position: absolute; right: -2rem; top: 50%; transform: translateY(-50%);
  font-size: 24rem; opacity: .03; line-height: 1; pointer-events: none;
}
.wind-cta-orb { position: absolute; top: -200px; left: 50%; transform: translateX(-50%); width: 700px; height: 700px; background: radial-gradient(circle, rgba(201,168,76,.1), transparent 65%); border-radius: 50%; pointer-events: none; }

/* ── BREADCRUMB ── */
.breadcrumb-bar { background: rgba(255,255,255,.02); border-bottom: 1px solid rgba(201,168,76,.08); padding: .65rem 0; }
.gr-breadcrumb { display: flex; align-items: center; gap: .5rem; font-size: .74rem; color: var(--gray); }
.gr-breadcrumb a { color: var(--gray); transition: color var(--transition); }
.gr-breadcrumb a:hover { color: var(--gold); }
.gr-breadcrumb .sep { color: rgba(201,168,76,.3); }
.gr-breadcrumb .current { color: var(--gold); }



/*============domestic===========*/
/* PAGE HEADER */
.page-header{padding:140px 0 80px;position:relative;overflow:hidden;background:linear-gradient(155deg,var(--black) 0%,var(--navy) 55%,#0d2d50 100%)}
.page-header-bg{position:absolute;inset:0;background:url('https://images.unsplash.com/photo-1593941707882-a5bba14938c7?w=1400&q=80') center/cover no-repeat;opacity:.1}
.ph-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(201,168,76,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(201,168,76,.04) 1px,transparent 1px);background-size:55px 55px}
.page-badge{display:inline-flex;align-items:center;gap:.5rem;background:rgba(201,168,76,.1);border:1px solid rgba(201,168,76,.25);color:var(--gold);padding:.38rem 1rem;border-radius:50px;font-size:.65rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;margin-bottom:1.2rem;animation:fadeUp .6s ease both}
.page-title{font-size:clamp(2.4rem,5.5vw,4.5rem);font-weight:700;line-height:1.08;color:var(--white);animation:fadeUp .7s .1s ease both}
.page-title em{color:var(--gold);font-style:italic}
.page-sub{color:var(--gray-light);font-size:1.02rem;line-height:1.85;max-width:580px;margin-top:1rem;animation:fadeUp .7s .2s ease both}
.page-meta{display:flex;align-items:center;gap:2rem;flex-wrap:wrap;margin-top:2rem;padding-top:1.5rem;border-top:1px solid rgba(201,168,76,.1);animation:fadeUp .7s .3s ease both}
.mp{display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:var(--gray)}
.mp i{color:var(--gold)}
.breadcrumb-bar{background:rgba(255,255,255,.02);border-bottom:1px solid rgba(201,168,76,.08);padding:.65rem 0}
.gr-breadcrumb{display:flex;align-items:center;gap:.5rem;font-size:.74rem;color:var(--gray)}
.gr-breadcrumb a{color:var(--gray);transition:color var(--transition)}
.gr-breadcrumb a:hover{color:var(--gold)}
.gr-breadcrumb .sep{color:rgba(201,168,76,.3)}
.gr-breadcrumb .current{color:var(--gold)}

/* FLOW DIAGRAM */
.flow-card{background:rgba(255,255,255,.025);border:1px solid rgba(201,168,76,.1);border-radius:18px;padding:1.8rem;text-align:center;transition:all var(--transition);position:relative}
.flow-card:hover{border-color:rgba(201,168,76,.3);transform:translateY(-7px);box-shadow:0 28px 60px rgba(0,0,0,.5)}
.flow-icon-wrap{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,rgba(201,168,76,.15),rgba(201,168,76,.05));border:1px solid rgba(201,168,76,.25);display:flex;align-items:center;justify-content:center;font-size:2rem;margin:0 auto 1.1rem;transition:all var(--transition)}
.flow-card:hover .flow-icon-wrap{background:rgba(201,168,76,.2);box-shadow:0 8px 28px rgba(201,168,76,.25)}
.flow-title{font-family:var(--font-display);font-size:1.05rem;font-weight:700;color:var(--white);margin-bottom:.5rem}
.flow-text{font-size:.82rem;color:var(--gray);line-height:1.72}
.flow-arrow{display:flex;align-items:center;justify-content:center;color:rgba(201,168,76,.4);font-size:1.5rem;padding:0 .5rem}
@media(max-width:767px){.flow-arrow{transform:rotate(90deg);margin:.5rem auto}}

/* APPLICATION CARDS */
.app-ev-card{background:linear-gradient(135deg,var(--navy-mid),var(--navy));border:1px solid rgba(201,168,76,.1);border-radius:20px;overflow:hidden;transition:all var(--transition);height:100%}
.app-ev-card:hover{transform:translateY(-8px);box-shadow:0 36px 72px rgba(0,0,0,.55);border-color:rgba(201,168,76,.28)}
.aec-img{height:190px;overflow:hidden;position:relative}
.aec-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.app-ev-card:hover .aec-img img{transform:scale(1.07)}
.aec-img-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(8,15,26,.88) 0%,transparent 55%)}
.aec-badge{position:absolute;top:.8rem;right:.8rem;background:rgba(8,15,26,.85);backdrop-filter:blur(8px);border:1px solid rgba(201,168,76,.25);color:var(--gold);font-size:.58rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;padding:.22rem .7rem;border-radius:50px}
.aec-body{padding:1.5rem}
.aec-icon{font-size:1.7rem;margin-bottom:.7rem}
.aec-title{font-family:var(--font-display);font-size:1.18rem;font-weight:700;color:var(--white);margin-bottom:.5rem}
.aec-text{font-size:.84rem;color:var(--gray);line-height:1.75}

/* IMPACT SPLIT */
.impact-num-lg{font-family:var(--font-display);font-size:clamp(3rem,5vw,5rem);font-weight:700;color:var(--gold);line-height:1}
.impact-desc{color:var(--gray-light);font-size:.88rem;line-height:1.78;max-width:420px}

/* WIND EV CYCLE VISUAL */
.cycle-wrap{position:relative;width:340px;height:340px;margin:0 auto}
.cycle-ring{position:absolute;inset:0;border-radius:50%;border:1px dashed rgba(201,168,76,.2);animation:spin 30s linear infinite}
.cycle-ring-2{position:absolute;inset:30px;border-radius:50%;border:1px dashed rgba(201,168,76,.12);animation:spin 20s linear infinite reverse}
.cycle-center{position:absolute;inset:80px;border-radius:50%;background:radial-gradient(circle,rgba(201,168,76,.15),rgba(201,168,76,.04));border:1px solid rgba(201,168,76,.25);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:.3rem}
.cycle-node{position:absolute;width:54px;height:54px;border-radius:50%;background:var(--navy-mid);border:2px solid rgba(201,168,76,.3);display:flex;align-items:center;justify-content:center;font-size:1.4rem;box-shadow:0 8px 24px rgba(0,0,0,.4)}
.cn-top{top:-27px;left:50%;transform:translateX(-50%)}
.cn-right{right:-27px;top:50%;transform:translateY(-50%)}
.cn-bottom{bottom:-27px;left:50%;transform:translateX(-50%)}
.cn-left{left:-27px;top:50%;transform:translateY(-50%)}

/* consult form */
.consult-card{background:linear-gradient(135deg,var(--navy-mid),var(--navy));border:1px solid rgba(201,168,76,.15);border-radius:24px;padding:3rem;position:relative;overflow:hidden}
.consult-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold),var(--gold-light))}


 /* Side Buttons - Positioned at Right Edge */
.side-buttons {
    position: fixed;
    right: 0;              /* Changed from 20px to 0 to remove the gap */
    top: 30%;
    z-index: 1050;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.side-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(12, 18, 34, 0.9);
    backdrop-filter: blur(10px);
    padding: 12px 24px;
    border-radius: 50px 0 0 50px; /* Flattens the right side to sit seamlessly on the edge */
    text-decoration: none;
    color: #fff;
    font-weight: 600;
    font-size: 0.9rem;
    border: 1px solid rgba(228, 179, 99, 0.4);
    border-right: none;           /* Removes the right border since it touches the edge */
    transition: all 0.3s ease;
    box-shadow: -4px 4px 12px rgba(0, 0, 0, 0.2); /* Adjusted shadow to look better on edge */
    cursor: pointer;
}

.side-btn i {
    font-size: 1.2rem;
    color: #e4b363;
}

.side-btn:hover {
    background: #e4b363;
    color: #0a0f1a;
    transform: translateX(-10px); /* Slides the button out slightly when hovered */
}

.side-btn:hover i {
    color: #0a0f1a;
}

/* Adjust for smaller screens */
@media (max-width: 768px) {
    .side-buttons {
        top: 140px;
        right: 0;          /* Changed to 0 */
        gap: 10px;
    }
    
    .side-btn {
        padding: 8px 16px;
        font-size: 0.8rem;
    }
    
    .side-btn i {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .side-buttons {
        top: 120px;
        right: 0;          /* Changed to 0 */
        gap: 8px;
    }
    
    .side-btn {
        padding: 6px 12px;
        font-size: 0.7rem;
        min-width: 120px;
    }
}