/* =========================================================
   S R ENERGY & DATA PROCESSING — Main Stylesheet
   Font: Poppins | Brand colors from logo
========================================================= */

:root{
  --green-dark:#2E6B27;
  --green:#4C9A3C;
  --lime:#8DC63F;
  --orange:#F2A81D;
  --orange-deep:#E0801B;
  --blue:#2E86AB;
  --blue-deep:#1C5770;
  --dark:#181E1B;
  --gray:#6E6E6E;
  --light-bg:#F7FAF5;
  --white:#ffffff;

  --grad-brand: linear-gradient(120deg, var(--green-dark), var(--blue-deep));
  --grad-warm: linear-gradient(120deg, var(--orange), var(--orange-deep));
  --shadow-soft: 0 20px 50px rgba(20,50,20,0.12);
  --radius-lg: 26px;
  --radius-md: 18px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth; overflow-x:hidden; width:100%;}
body{
  font-family:'Poppins', sans-serif;
  color:var(--dark);
  overflow-x:hidden;
  width:100%;
  max-width:100vw;
  position:relative;
  background:var(--white);
}
h1,h2,h3,h4,h5,h6{font-family:'Poppins',sans-serif; font-weight:700; color:var(--dark);}
p{color:var(--gray); line-height:1.75;}
a{text-decoration:none; transition:.3s ease;}
img{max-width:100%;}
section{position:relative; padding:100px 0;}
@media(max-width:991px){ section{padding:70px 0;} }

.section-eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  color:var(--orange-deep); font-weight:600; font-size:14px;
  letter-spacing:2px; text-transform:uppercase; margin-bottom:14px;
}
.section-eyebrow::before{
  content:""; width:28px; height:3px; background:var(--orange); border-radius:3px; display:inline-block;
}
.section-title{font-size:2.5rem; margin-bottom:18px;}
@media(max-width:768px){ .section-title{font-size:1.85rem;} }
.section-sub{max-width:620px; margin-bottom:20px;}
.text-brand-green{color:var(--green-dark) !important;}
.text-brand-orange{color:var(--orange-deep) !important;}
.text-brand-blue{color:var(--blue-deep) !important;}
.bg-light-soft{background:var(--light-bg);}

/* Buttons */
.btn-brand-primary{
  background:var(--grad-brand); color:#fff; border:none; font-weight:600;
  padding:14px 32px; transition:.35s ease; box-shadow:0 10px 25px rgba(46,107,39,.25);
}
.btn-brand-primary:hover{transform:translateY(-3px); box-shadow:0 16px 32px rgba(46,107,39,.35); color:#fff;}
.btn-brand-secondary{
  background:var(--grad-warm); color:#fff; font-weight:600; border:none;
  padding:14px 32px; box-shadow:0 10px 25px rgba(224,128,27,.3);
}
.btn-brand-secondary:hover{transform:translateY(-3px); color:#fff;}
.btn-outline-brand{
  border:2px solid var(--green-dark); color:var(--green-dark); font-weight:600; padding:12px 30px; border-radius:50px; background:transparent;
}
.btn-outline-brand:hover{background:var(--green-dark); color:#fff;}

/* ============ PRELOADER ============ */
#preloader{
  position:fixed; inset:0; background:#fff; z-index:99999;
  display:flex; align-items:center; justify-content:center;
  transition:opacity .5s ease, visibility .5s ease;
}
#preloader.loaded{opacity:0; visibility:hidden;}
.loader-sun{position:relative; width:70px; height:70px;}
.loader-core{
  position:absolute; inset:18px; background:var(--orange); border-radius:50%;
  box-shadow:0 0 25px var(--orange); animation:pulse 1.2s ease-in-out infinite;
}
.ray{position:absolute; width:4px; height:14px; background:var(--green); left:33px; top:-6px; border-radius:3px; transform-origin:2px 41px; animation:spin 1.6s linear infinite;}
.ray-1{transform:rotate(0deg);} .ray-2{transform:rotate(45deg);} .ray-3{transform:rotate(90deg);} .ray-4{transform:rotate(135deg);}
.ray-5{transform:rotate(180deg);} .ray-6{transform:rotate(225deg);} .ray-7{transform:rotate(270deg);} .ray-8{transform:rotate(315deg);}
@keyframes spin{from{opacity:.3;} 50%{opacity:1;} to{opacity:.3;}}
@keyframes pulse{0%,100%{transform:scale(1);} 50%{transform:scale(1.15);}}

/* ============ TOPBAR ============ */
.topbar{background:var(--dark); color:#cfe0cf; font-size:13.5px;}
.topbar i{color:var(--orange); margin-right:6px;}
.topbar .social-icons a{color:#cfe0cf; margin-left:12px; font-size:14px;}
.topbar .social-icons a:hover{color:var(--orange);}
.topbar-left span{margin-right:26px;}

/* ============ NAVBAR ============ */
.main-nav{background:#fff; padding:14px 0; transition:.35s ease; z-index:1000; box-shadow:0 2px 20px rgba(0,0,0,.05);}
.main-nav.scrolled{padding:8px 0; box-shadow:0 8px 30px rgba(0,0,0,.08);}
.navbar-brand{display:flex; align-items:center; gap:10px;}
.navbar-brand img{height:48px; width:auto; transition:.3s;}
.main-nav.scrolled .navbar-brand img{height:40px;}
.brand-text{display:flex; flex-direction:column; line-height:1.1;}
.brand-text strong{color:var(--green-dark); font-size:17px; letter-spacing:.5px;}
.brand-text small{color:var(--blue-deep); font-size:11px; letter-spacing:1px;}
.navbar-nav .nav-link{font-weight:500; color:var(--dark) !important; margin:0 10px; position:relative; padding:8px 2px !important;}
.navbar-nav .nav-link::after{
  content:""; position:absolute; bottom:0; left:0; width:0; height:2px; background:var(--orange); transition:.3s ease;
}
.navbar-nav .nav-link:hover::after, .navbar-nav .nav-link.active::after{width:100%;}
.navbar-nav .nav-link.active{color:var(--green-dark) !important;}

/* ============ HERO ============ */
.hero{
  position:relative; min-height:92vh; display:flex; align-items:center;
  background:var(--grad-brand); overflow:hidden; padding-top:60px;
}
.hero-swiper{width:100%;}
.hero-slide{min-height:80vh; display:flex; align-items:center;}
.hero-pattern{
  position:absolute; inset:0; opacity:.08;
  background-image:radial-gradient(circle, #fff 2px, transparent 2px);
  background-size:26px 26px;
}
.hero-glow{
  position:absolute; width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle, rgba(242,168,29,.35), transparent 70%);
  top:-150px; right:-150px; animation:float 8s ease-in-out infinite;
}
.hero-glow2{
  position:absolute; width:400px; height:400px; border-radius:50%;
  background:radial-gradient(circle, rgba(141,198,63,.3), transparent 70%);
  bottom:-120px; left:-100px; animation:float 10s ease-in-out infinite reverse;
}
@keyframes float{0%,100%{transform:translateY(0px) translateX(0);} 50%{transform:translateY(30px) translateX(20px);}}
.hero-eyebrow{
  display:inline-block; background:rgba(255,255,255,.15); color:#fff; padding:8px 22px;
  border-radius:50px; font-size:13px; letter-spacing:2px; font-weight:600; margin-bottom:22px;
  backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.25);
}
.hero h1{color:#fff; font-size:3.4rem; font-weight:800; line-height:1.15; margin-bottom:22px;}
.hero h1 span{color:var(--orange); position:relative;}
@media(max-width:991px){.hero h1{font-size:2.3rem;}}
.hero p.lead{color:rgba(255,255,255,.85); font-size:1.15rem; max-width:520px; margin-bottom:32px;}
.hero-btns{display:flex; gap:16px; flex-wrap:wrap;}
.btn-hero-ghost{
  border:2px solid rgba(255,255,255,.5); color:#fff; font-weight:600; padding:12px 30px; border-radius:50px;
}
.btn-hero-ghost:hover{background:#fff; color:var(--green-dark);}
.hero-img-wrap{position:relative;}
.hero-img-wrap img{
  border-radius:24px; box-shadow:0 30px 60px rgba(0,0,0,.35); animation:floatY 5s ease-in-out infinite;
}
@keyframes floatY{0%,100%{transform:translateY(0);} 50%{transform:translateY(-18px);}}
.hero-badge{
  position:absolute; bottom:-25px; left:-25px; background:#fff; border-radius:20px; padding:18px 22px;
  box-shadow:var(--shadow-soft); display:flex; align-items:center; gap:14px; animation:floatY 6s ease-in-out infinite;
}
.hero-badge .icon-circle{width:52px; height:52px; border-radius:50%; background:var(--grad-warm); display:flex; align-items:center; justify-content:center; color:#fff; font-size:22px;}
.hero-badge h5{margin:0; font-size:1.3rem;}
.hero-badge span{font-size:12.5px; color:var(--gray);}
.hero-scroll-cue{
  position:absolute; bottom:26px; left:50%; transform:translateX(-50%); color:#fff; opacity:.75;
  display:flex; flex-direction:column; align-items:center; gap:6px; font-size:12px;
}
.mouse{width:26px; height:42px; border:2px solid #fff; border-radius:16px; position:relative;}
.mouse::before{content:""; position:absolute; top:6px; left:50%; width:4px; height:8px; background:#fff; border-radius:2px; transform:translateX(-50%); animation:scrollDown 1.6s ease infinite;}
@keyframes scrollDown{0%{opacity:1; top:6px;} 100%{opacity:0; top:22px;}}

/* swiper pagination custom */
.hero .swiper-pagination-bullet{background:#fff; opacity:.5; width:10px; height:10px;}
.hero .swiper-pagination-bullet-active{opacity:1; background:var(--orange); width:26px; border-radius:6px;}

/* ============ MARQUEE (brands / clients) ============ */
.marquee-wrap{overflow:hidden; background:var(--light-bg); padding:26px 0; border-top:1px solid #eaeee8; border-bottom:1px solid #eaeee8;}
.marquee-track{display:flex; gap:70px; width:max-content; animation:scrollLeft 22s linear infinite;}
.marquee-track img{height:38px; opacity:.6; filter:grayscale(100%); transition:.3s;}
.marquee-track img:hover{opacity:1; filter:grayscale(0);}
@keyframes scrollLeft{from{transform:translateX(0);} to{transform:translateX(-50%);}}

/* ============ ABOUT ============ */
.about-media{position:relative;}
.about-media img{border-radius:var(--radius-lg); box-shadow:var(--shadow-soft);}
.about-media-2{position:absolute; bottom:-40px; right:-40px; width:55%; border:8px solid #fff; border-radius:20px; box-shadow:var(--shadow-soft);}
.about-exp-badge{
  position:absolute; top:-30px; left:-30px; background:var(--grad-brand); color:#fff; border-radius:50%;
  width:130px; height:130px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; box-shadow:var(--shadow-soft); animation:spinSlow 14s linear infinite;
}
.about-exp-badge span{font-size:2rem; font-weight:800; display:block;}
.about-exp-badge small{font-size:10.5px; letter-spacing:1px;}
@keyframes spinSlow{from{transform:rotate(0deg);} to{transform:rotate(360deg);}}
.about-checklist{list-style:none; padding:0; margin:24px 0;}
.about-checklist li{display:flex; align-items:flex-start; gap:12px; margin-bottom:14px; font-weight:500;}
.about-checklist li i{color:#fff; background:var(--green); border-radius:50%; width:26px; height:26px; min-width:26px; display:flex; align-items:center; justify-content:center; font-size:13px; margin-top:2px;}

/* ============ STATS ============ */
.stats-section{background:var(--grad-brand); color:#fff; position:relative; overflow:hidden;}
.stats-section .stat-item{text-align:center; position:relative; z-index:2;}
.stats-section .stat-item i{font-size:2.2rem; color:var(--orange); margin-bottom:10px; display:inline-block;}
.stats-section h3{color:#fff; font-size:2.8rem; font-weight:800; margin-bottom:6px;}
.stats-section p{color:rgba(255,255,255,.8); margin:0;}
.stats-pattern{position:absolute; inset:0; opacity:.06; background-image:radial-gradient(circle, #fff 2px, transparent 2px); background-size:24px 24px;}

/* ============ SERVICE CARDS ============ */
.service-card{
  background:#fff; border-radius:var(--radius-md); padding:38px 30px; height:100%;
  box-shadow:0 10px 30px rgba(0,0,0,.05); transition:.4s ease; position:relative; overflow:hidden; border:1px solid #f0f2ed;
}
.service-card::before{
  content:""; position:absolute; top:0; left:0; width:100%; height:4px; background:var(--grad-warm);
  transform:scaleX(0); transform-origin:left; transition:.4s ease;
}
.service-card:hover{transform:translateY(-10px); box-shadow:0 25px 50px rgba(0,0,0,.12);}
.service-card:hover::before{transform:scaleX(1);}
.service-icon{
  width:70px; height:70px; border-radius:20px; display:flex; align-items:center; justify-content:center;
  font-size:30px; color:#fff; background:var(--grad-brand); margin-bottom:24px; transition:.4s ease;
}
.service-card:nth-child(3n+2) .service-icon{background:var(--grad-warm);}
.service-card:nth-child(3n) .service-icon{background:linear-gradient(120deg, var(--blue), var(--blue-deep));}
.service-card:hover .service-icon{transform:rotate(-8deg) scale(1.08);}
.service-card h4{font-size:1.25rem; margin-bottom:12px;}
.service-card .learn-more{font-weight:600; color:var(--green-dark); display:inline-flex; align-items:center; gap:6px;}
.service-card .learn-more i{transition:.3s;}
.service-card:hover .learn-more i{transform:translateX(5px);}

/* ============ WHY CHOOSE / FEATURES ============ */
.feature-box{display:flex; gap:20px; margin-bottom:34px;}
.feature-box .f-icon{
  min-width:64px; height:64px; border-radius:16px; background:var(--light-bg); color:var(--green-dark);
  display:flex; align-items:center; justify-content:center; font-size:26px; transition:.35s;
}
.feature-box:hover .f-icon{background:var(--grad-brand); color:#fff; transform:rotate(-6deg);}
.feature-box h5{margin-bottom:8px;}
.why-media{position:relative;}
.why-media img{border-radius:var(--radius-lg); box-shadow:var(--shadow-soft);}
.why-play-badge{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
}
.why-play-badge .play-btn{
  width:80px; height:80px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center;
  font-size:26px; color:var(--green-dark); box-shadow:0 10px 30px rgba(0,0,0,.25); animation:pulseRing 2.2s infinite;
}
@keyframes pulseRing{0%{box-shadow:0 0 0 0 rgba(255,255,255,.5),0 10px 30px rgba(0,0,0,.25);} 100%{box-shadow:0 0 0 24px rgba(255,255,255,0),0 10px 30px rgba(0,0,0,.25);}}

/* ============ PROCESS STEPS ============ */
.process-card{
  text-align:center; padding:40px 26px; border-radius:var(--radius-md); background:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.05); position:relative; height:100%; transition:.35s;
}
.process-card:hover{transform:translateY(-8px); box-shadow:0 20px 40px rgba(0,0,0,.1);}
.process-num{
  width:60px; height:60px; margin:0 auto 20px; border-radius:50%; background:var(--grad-warm); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:1.3rem;
}
.process-connector{
  position:absolute; top:50px; right:-50%; width:100%; height:2px; background:repeating-linear-gradient(90deg, var(--lime) 0 8px, transparent 8px 16px);
}
@media(max-width:991px){.process-connector{display:none;}}

/* ============ PROJECTS ============ */
.project-card{border-radius:var(--radius-md); overflow:hidden; position:relative; box-shadow:0 10px 30px rgba(0,0,0,.08);}
.project-card img{width:100%; height:280px; object-fit:cover; transition:.6s ease;}
.project-card:hover img{transform:scale(1.12);}
.project-overlay{
  position:absolute; inset:0; background:linear-gradient(0deg, rgba(24,30,27,.92), rgba(24,30,27,.05) 60%);
  display:flex; flex-direction:column; justify-content:flex-end; padding:26px; opacity:0; transition:.4s ease;
}
.project-card:hover .project-overlay{opacity:1;}
.project-overlay .cat{color:var(--orange); font-size:12.5px; letter-spacing:1.5px; text-transform:uppercase; font-weight:600;}
.project-overlay h5{color:#fff; margin:6px 0 0;}
.project-plus{
  position:absolute; top:20px; right:20px; width:44px; height:44px; border-radius:50%; background:var(--orange);
  color:#fff; display:flex; align-items:center; justify-content:center; opacity:0; transform:scale(.5); transition:.35s;
}
.project-card:hover .project-plus{opacity:1; transform:scale(1);}

/* ============ FAQ ============ */
.faq-accordion .accordion-item{border:none; margin-bottom:16px; border-radius:16px !important; overflow:hidden; box-shadow:0 6px 20px rgba(0,0,0,.05);}
.faq-accordion .accordion-button{font-weight:600; padding:22px 26px; background:#fff;}
.faq-accordion .accordion-button:not(.collapsed){color:var(--green-dark); background:var(--light-bg);}
.faq-accordion .accordion-button:focus{box-shadow:none;}
.faq-accordion .accordion-button::after{filter:none;}

/* ============ CTA STRIP ============ */
.cta-strip{
  background:var(--grad-warm); padding:60px 0; position:relative; overflow:hidden; margin-top:0;
}
.cta-strip h3{color:#fff; font-size:2rem; margin-bottom:8px;}
.cta-strip p{color:rgba(255,255,255,.9); margin:0;}
.cta-strip .btn-brand-secondary{background:#fff; color:var(--orange-deep); box-shadow:0 10px 25px rgba(0,0,0,.15);}
.cta-blob{position:absolute; border-radius:50%; background:rgba(255,255,255,.12);}
.blob-1{width:220px; height:220px; top:-80px; left:-60px;}
.blob-2{width:160px; height:160px; bottom:-80px; right:10%;}

/* ============ FOOTER ============ */
.footer{background:var(--dark); color:#b9c4b8; padding-top:80px; position:relative; overflow:hidden;}
.footer h6{color:#fff; font-weight:700; margin-bottom:20px; letter-spacing:.5px;}
.footer-logo{display:flex; align-items:center; gap:12px; color:#fff; font-weight:700; font-size:1.2rem;}
.footer-logo img{height:48px; background:#fff; border-radius:10px; padding:4px;}
.footer-logo small{color:var(--lime); font-weight:400;}
.footer-links{list-style:none; padding:0;}
.footer-links li{margin-bottom:12px; font-size:14.5px;}
.footer-links a{color:#b9c4b8;}
.footer-links a:hover{color:var(--orange); padding-left:4px;}
.footer-social a{
  display:inline-flex; width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.08); color:#fff;
  align-items:center; justify-content:center; margin-right:8px; margin-top:10px;
}
.footer-social a:hover{background:var(--orange);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08); font-size:13.5px; margin-top:20px;}

/* ============ BACK TO TOP / WHATSAPP ============ */
.back-to-top{
  position:fixed; bottom:26px; right:26px; width:50px; height:50px; border-radius:50%; background:var(--grad-brand);
  color:#fff; display:flex; align-items:center; justify-content:center; font-size:20px; box-shadow:0 10px 25px rgba(0,0,0,.25);
  opacity:0; visibility:hidden; transform:translateY(20px); transition:.3s ease; z-index:998;
}
.back-to-top.show{opacity:1; visibility:visible; transform:translateY(0);}
.whatsapp-float{
  position:fixed; bottom:26px; left:26px; width:56px; height:56px; border-radius:50%; background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:26px; box-shadow:0 10px 25px rgba(0,0,0,.25); z-index:998;
  animation:pulseWA 2.4s infinite;
}
@keyframes pulseWA{0%{box-shadow:0 0 0 0 rgba(37,211,102,.5);} 70%{box-shadow:0 0 0 16px rgba(37,211,102,0);} 100%{box-shadow:0 0 0 0 rgba(37,211,102,0);}}

/* ============ PAGE HEADER (inner pages) ============ */
.page-header{background:var(--grad-brand); padding:180px 0 100px; position:relative; overflow:hidden;}
.page-header h1{color:#fff; font-size:2.6rem; margin-bottom:14px;}
.page-header .breadcrumb-nav{color:rgba(255,255,255,.8); font-weight:500;}
.page-header .breadcrumb-nav a{color:#fff;}
.page-header .breadcrumb-nav i{margin:0 8px; font-size:12px;}

/* ============ CONTACT ============ */
.contact-info-card{background:#fff; border-radius:var(--radius-md); padding:34px; box-shadow:0 10px 30px rgba(0,0,0,.06); height:100%; text-align:center; transition:.35s;}
.contact-info-card:hover{transform:translateY(-8px);}
.contact-info-card .c-icon{width:64px; height:64px; border-radius:50%; background:var(--light-bg); color:var(--green-dark); display:flex; align-items:center; justify-content:center; font-size:24px; margin:0 auto 18px;}
.contact-form-wrap{background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow-soft); padding:46px;}
.form-control, .form-select{
  border:1.5px solid #e5e9e2; border-radius:12px; padding:13px 16px; font-family:'Poppins',sans-serif;
}
.form-control:focus, .form-select:focus{border-color:var(--green); box-shadow:0 0 0 4px rgba(76,154,60,.12);}
.map-wrap{border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-soft); height:100%; min-height:400px;}
.map-wrap iframe{width:100%; height:100%; min-height:400px; border:0;}

/* ============ MISC ============ */
.team-card{text-align:center; border-radius:var(--radius-md); overflow:hidden; background:#fff; box-shadow:0 10px 30px rgba(0,0,0,.06); transition:.35s;}
.team-card:hover{transform:translateY(-8px);}
.team-card img{width:100%; height:280px; object-fit:cover;}
.team-card .team-info{padding:20px;}
.team-card .socials a{width:34px; height:34px; border-radius:50%; background:var(--light-bg); color:var(--green-dark); display:inline-flex; align-items:center; justify-content:center; margin:0 3px;}

.divider-wave{display:block; width:100%; height:60px; margin-bottom:-6px;}

::selection{background:var(--green); color:#fff;}

/* Scrollbar */
::-webkit-scrollbar{width:9px;}
::-webkit-scrollbar-track{background:#eef2ec;}
::-webkit-scrollbar-thumb{background:var(--green); border-radius:10px;}

/* ============ QUICK CONTACT (common section on every page) ============ */
.quick-contact-section{padding:100px 0;}
.c-icon-sm{width:48px; height:48px; border-radius:12px; background:var(--white); color:var(--green-dark); display:flex; align-items:center; justify-content:center; font-size:19px; box-shadow:0 6px 16px rgba(0,0,0,.06);}
.quick-contact-form label.form-label{font-weight:600; font-size:13.5px; color:var(--dark); margin-bottom:6px;}

/* ============ PARTNERS ============ */
.partners-section .partner-card{
  background:#fff; border-radius:16px; padding:22px; display:flex; align-items:center; justify-content:center;
  height:110px; box-shadow:0 8px 24px rgba(0,0,0,.05); transition:.3s ease;
}
.partners-section .partner-card:hover{transform:translateY(-6px); box-shadow:0 16px 32px rgba(0,0,0,.1);}
.partners-section .partner-card img{max-height:60px; max-width:100%; object-fit:contain;}

/* ============ BLOG CARDS ============ */
.blog-card{background:#fff; border-radius:var(--radius-md); overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.06); height:100%; transition:.35s ease;}
.blog-card:hover{transform:translateY(-8px); box-shadow:0 20px 45px rgba(0,0,0,.12);}
.blog-card-img{position:relative; overflow:hidden; height:220px;}
.blog-card-img img{width:100%; height:100%; object-fit:cover; transition:.6s ease;}
.blog-card:hover .blog-card-img img{transform:scale(1.1);}
.blog-date{position:absolute; bottom:14px; left:14px; background:var(--green-dark); color:#fff; font-size:12.5px; font-weight:600; padding:6px 14px; border-radius:50px;}
.blog-card-body{padding:24px;}
.blog-cat{color:var(--orange-deep); font-size:12px; font-weight:700; letter-spacing:1px; text-transform:uppercase; text-decoration:underline;}
.blog-card-body h5{margin:10px 0 12px; font-size:1.1rem; line-height:1.4;}
.blog-meta{font-size:13px; color:var(--gray); display:flex; align-items:center; gap:6px; padding-top:12px; border-top:1px solid #eee;}

/* ============ MISSION / VISION ============ */
.mission-vision-section{padding:100px 0;}
.mv-card{background:#fff; border-radius:var(--radius-lg); padding:44px; height:100%; box-shadow:0 15px 40px rgba(0,0,0,.06); position:relative; overflow:hidden;}
.mv-card::before{content:""; position:absolute; top:0; left:0; width:6px; height:100%; background:var(--grad-brand);}
.mv-mission::before{background:var(--grad-warm);}
.mv-icon{width:70px; height:70px; border-radius:20px; background:var(--light-bg); color:var(--green-dark); display:flex; align-items:center; justify-content:center; font-size:30px; margin-bottom:22px;}
.mv-mission .mv-icon{background:var(--light-orange-bg, #FDF3E2); color:var(--orange-deep);}
.mv-card h4{margin-bottom:16px;}
.mv-card p{margin:0;}

/* ============ PROJECT CARD V2 (auto-slide, attractive) ============ */
.projects-section{padding-bottom:80px;}
.projects-swiper{padding:10px 6px 20px;}
.project-card-v2{
  position:relative; border-radius:24px; overflow:hidden; height:420px; box-shadow:0 20px 45px rgba(0,0,0,.12);
}
.project-card-v2 img{width:100%; height:100%; object-fit:cover; transition:.7s ease;}
.project-card-v2:hover img{transform:scale(1.12);}
.project-progress-badge{
  position:absolute; top:20px; right:20px; width:56px; height:56px; border-radius:50%; background:var(--green);
  color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px;
  box-shadow:0 8px 20px rgba(0,0,0,.25); border:3px solid rgba(255,255,255,.5);
}
.project-card-v2-overlay{
  position:absolute; left:16px; right:16px; bottom:16px; background:var(--grad-brand); border-radius:18px;
  padding:22px 24px; color:#fff;
}
.project-card-v2-overlay h5{color:#fff; margin-bottom:10px; font-size:1.15rem;}
.project-card-v2-overlay .tags{display:flex; gap:8px; flex-wrap:wrap;}
.project-card-v2-overlay .tags span{
  background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.35); font-size:11.5px; font-weight:600;
  padding:5px 12px; border-radius:50px; text-transform:uppercase; letter-spacing:.5px;
}
.project-arrow{
  position:absolute; right:18px; bottom:18px; width:44px; height:44px; border-radius:50%; background:#fff;
  color:var(--green-dark); display:flex; align-items:center; justify-content:center; font-size:18px; transition:.3s;
}
.project-card-v2:hover .project-arrow{background:var(--orange); color:#fff; transform:rotate(45deg);}
.swiper-nav-btn{
  width:48px; height:48px; border-radius:50%; border:2px solid var(--green-dark); background:#fff; color:var(--green-dark);
  display:flex; align-items:center; justify-content:center; font-size:18px; transition:.3s;
}
.swiper-nav-btn:hover{background:var(--green-dark); color:#fff;}

/* ============ SOLAR CALCULATOR ============ */
.calc-card{background:#fff; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-soft);}
.calc-header{background:var(--grad-brand); color:#fff; padding:30px; text-align:center;}
.calc-header h4{color:#fff; margin-bottom:4px;}
.calc-header p{color:rgba(255,255,255,.85); margin:0;}
.calc-body{padding:34px; background:var(--light-bg);}
.calc-label{font-weight:700; color:var(--dark); margin-bottom:12px; display:block; font-size:15px;}
.calc-sublabel{font-weight:600; color:var(--gray); font-size:13px; margin-bottom:6px; display:block;}
.calc-option-tabs{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:22px;}
.calc-tab{
  flex:1; min-width:150px; border:2px solid var(--green-dark); background:#fff; color:var(--green-dark);
  padding:12px 16px; border-radius:12px; font-weight:600; font-size:13.5px; transition:.25s;
}
.calc-tab.active, .calc-tab:hover{background:var(--green-dark); color:#fff;}
.calc-field{margin-bottom:6px;}
.calc-body hr{border-top:1px dashed #cfd8cc; margin:26px 0;}
.calc-results{background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow-soft); padding:34px; margin-top:30px;}
.calc-results h6{color:var(--green-dark); font-weight:700;}

/* ============ RESPONSIVE HARDENING ============ */
@media(max-width:576px){
  .hero-badge{left:10px; bottom:-18px; padding:12px 16px;}
  .about-media-2{width:48%; bottom:-20px; right:-10px;}
  .about-exp-badge{width:100px; height:100px; top:-16px; left:-16px;}
  .about-exp-badge span{font-size:1.5rem;}
  .project-card-v2{height:340px;}
}

/* ============ NEWSLETTER ============ */
.newsletter-section{
  position:relative; padding:110px 0; overflow:hidden;
  background:url("/static/img/uploads/hero-2.d8d4e2ccc043.webp") center/cover no-repeat;
}
.newsletter-overlay{
  position:absolute; inset:0; background:linear-gradient(180deg, rgba(255,255,255,.15), rgba(46,134,171,.25));
}
.newsletter-title{
  position:relative; color:var(--dark); font-size:2.6rem; font-weight:800; line-height:1.3; margin-bottom:40px;
}
@media(max-width:768px){ .newsletter-title{ font-size:1.7rem; } }
.newsletter-form-box{
  position:relative; max-width:650px; margin:0 auto; background:#fff; border-radius:50px; padding:8px;
  display:flex; gap:8px; box-shadow:0 20px 45px rgba(0,0,0,.18);
}
.newsletter-input{
  flex:1; border:none; outline:none; background:transparent; padding:14px 24px; font-family:'Poppins',sans-serif; font-size:15px;
}
.newsletter-btn{
  background:var(--green-dark); color:#fff; border:none; font-weight:700; padding:14px 30px; border-radius:50px; white-space:nowrap;
}
.newsletter-btn:hover{background:var(--green);}
@media(max-width:576px){
  .newsletter-form-box{flex-direction:column; border-radius:20px;}
  .newsletter-btn{width:100%; justify-content:center; display:flex;}
}
/* ============ 404 / 500 ERROR PAGES ============ */
.error-page{padding:160px 0 120px; min-height:70vh; display:flex; align-items:center; position:relative; overflow:hidden; background:var(--light-bg);}
.error-icon{
  width:110px; height:110px; border-radius:50%; background:var(--grad-brand); color:#fff; font-size:44px;
  display:flex; align-items:center; justify-content:center; margin:0 auto 20px; box-shadow:0 20px 40px rgba(46,107,39,.25);
}
.error-code{font-size:7rem; font-weight:800; color:var(--green-dark); line-height:1; margin-bottom:10px;}
@media(max-width:576px){ .error-code{font-size:4.5rem;} }

/* ============ FOOTER LEGAL LINKS FIX ============ */
.footer-legal-links a{color:#e8efe6 !important; font-size:13.5px; text-decoration:none;}
.footer-legal-links a:hover{color:var(--orange) !important;}
.hostgrow-link{color:#e8efe6 !important; font-weight:600; text-decoration:none;}
.hostgrow-link:hover{color:var(--orange) !important; text-decoration:underline;}

/* ============ CORE FEATURES SECTION ============ */
.core-features-section{padding:100px 0;}
.cf-side-img{width:100%; height:340px; object-fit:cover; border-radius:var(--radius-lg); box-shadow:var(--shadow-soft);}
.cf-mini-card{background:#fff; border-radius:var(--radius-md); padding:30px 26px; height:100%; box-shadow:0 10px 30px rgba(0,0,0,.05); transition:.3s;}
.cf-mini-card:hover{transform:translateY(-8px); box-shadow:0 20px 40px rgba(0,0,0,.1);}
.cf-icon{width:54px; height:54px; border-radius:14px; background:var(--grad-brand); color:#fff; display:flex; align-items:center; justify-content:center; font-size:22px; margin-bottom:18px;}
.cf-mini-card h6{margin-bottom:10px; font-size:1.05rem;}
.cf-mini-card p{margin:0; font-size:14px;}

/* ============ DISCOVER SOLAR SECTION ============ */
.discover-solar-section{padding:100px 0;}
.discover-main-img{width:100%; height:280px; object-fit:cover; border-radius:var(--radius-lg); margin-top:26px; box-shadow:var(--shadow-soft);}
.discover-top-img{width:100%; height:230px; object-fit:cover; border-radius:var(--radius-lg); box-shadow:var(--shadow-soft);}
.discover-mini-card{border-radius:var(--radius-md); padding:26px 22px; height:100%; color:#fff;}
.discover-mini-card i{font-size:26px; margin-bottom:14px; display:block;}
.discover-mini-card h6{color:#fff; margin-bottom:8px; font-size:1rem;}
.discover-mini-card p{color:rgba(255,255,255,.8); font-size:13px; margin:0;}
.discover-card-dark{background:var(--green-dark);}
.discover-card-green{background:var(--green);}

/* ============ TESTIMONIALS V2 (fixed: hover-only green, equal card sizes) ============ */
.testimonial-section-v2{padding:100px 0; background:#fff;}
.testimonial-section-v2 em{font-style:italic; color:var(--green-dark);}
.testimonial-swiper .swiper-wrapper{align-items:stretch;}
.testimonial-swiper .swiper-slide{height:auto; align-self:stretch; display:flex;}
.testimonial-card-v2{
  background:var(--light-bg) !important;
  border-radius:var(--radius-md);
  padding:36px;
  width:100%;
  height:100%;
  min-height:280px;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  border:2px solid transparent;
  cursor:pointer;
  transition:background .35s ease, border-color .35s ease, transform .35s ease, box-shadow .35s ease;
}
.testimonial-card-v2:hover{
  background:var(--green) !important;
  border-color:var(--green-dark);
  transform:translateY(-6px);
  box-shadow:0 20px 40px rgba(76,154,60,.25);
}
.testimonial-card-v2 .msg{
  font-size:15.5px; line-height:1.7; margin-bottom:26px; color:var(--dark);
  display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical; overflow:hidden;
  transition:color .35s ease;
}
.testimonial-card-v2:hover .msg{color:#fff !important;}
.testimonial-author-v2{display:flex; align-items:center; gap:14px; position:relative;}
.testimonial-author-v2 img{width:46px; height:46px; border-radius:50%; object-fit:cover; flex-shrink:0;}
.testimonial-author-v2 h6{margin:0; font-size:15px; transition:color .35s ease;}
.testimonial-author-v2 span{font-size:12.5px; color:var(--gray); transition:color .35s ease;}
.testimonial-card-v2:hover .testimonial-author-v2 h6{color:#fff !important;}
.testimonial-card-v2:hover .testimonial-author-v2 span{color:rgba(255,255,255,.85) !important;}
.quote-mark{
  position:absolute; left:0; bottom:100%; margin-bottom:14px; font-size:2.6rem; line-height:1; color:var(--green-dark); opacity:.25;
  transition:color .35s ease, opacity .35s ease;
}
.testimonial-card-v2:hover .quote-mark{color:#fff !important; opacity:.4;}
/* ============ PROJECT LIST (non-slider, dedicated page) ============ */
.project-list-item{
  display:flex; gap:26px; background:#fff; border-radius:var(--radius-md); box-shadow:0 10px 30px rgba(0,0,0,.06);
  overflow:hidden; margin-bottom:26px; transition:.3s;
}
.project-list-item:hover{box-shadow:0 20px 45px rgba(0,0,0,.12);}
.project-list-item .pli-img{width:320px; min-width:320px; height:auto; object-fit:cover;}
.project-list-item .pli-body{padding:28px; display:flex; flex-direction:column; justify-content:center;}
.project-list-item .tags span{
  background:var(--light-green-bg,#EBF4E6); color:var(--green-dark); font-size:11.5px; font-weight:700;
  padding:5px 14px; border-radius:50px; margin-right:8px; text-transform:uppercase; letter-spacing:.5px;
}
.project-list-item h4{margin:14px 0 10px;}
@media(max-width:767px){
  .project-list-item{flex-direction:column;}
  .project-list-item .pli-img{width:100%; height:220px;}
}

/* ============ GALLERY ============ */
.gallery-card{position:relative; border-radius:var(--radius-md); overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.08); height:280px;}
.gallery-card img{width:100%; height:100%; object-fit:cover; transition:.6s ease;}
.gallery-card:hover img{transform:scale(1.12);}
.gallery-overlay{
  position:absolute; inset:0; background:linear-gradient(0deg, rgba(24,30,27,.9), rgba(24,30,27,.05) 65%);
  display:flex; flex-direction:column; justify-content:flex-end; padding:20px; opacity:0; transition:.35s ease;
}
.gallery-card:hover .gallery-overlay{opacity:1;}
.gallery-overlay h6{color:#fff; margin-bottom:6px;}
.gallery-overlay span{color:rgba(255,255,255,.85); font-size:12.5px; display:block;}

/* ============ COMPANY INFO STATS (About page) ============ */
.company-info-section{padding:100px 0;}
.ci-card{background:#fff; border-radius:var(--radius-md); padding:28px; text-align:center; height:100%; box-shadow:0 10px 30px rgba(0,0,0,.05); transition:.3s;}
.ci-card:hover{transform:translateY(-6px);}
.ci-card .ci-icon{width:56px; height:56px; border-radius:14px; background:var(--grad-brand); color:#fff; display:flex; align-items:center; justify-content:center; font-size:22px; margin:0 auto 16px;}
.ci-card h3{font-size:1.7rem; margin-bottom:6px; color:var(--green-dark);}
.ci-card p{margin:0; font-size:13.5px; color:var(--gray);}

/* ============ SAFETY & QUALITY ============ */
.safety-section{background:var(--grad-brand); padding:90px 0; color:#fff;}
.safety-section .section-eyebrow{color:var(--lime);}
.safety-section .section-eyebrow::before{background:var(--orange);}
.safety-section h2{color:#fff;}
.safety-section p{color:rgba(255,255,255,.88);}
.safety-icons{display:flex; gap:20px; flex-wrap:wrap; margin-top:24px;}
.safety-icons .si-item{display:flex; align-items:center; gap:10px; background:rgba(255,255,255,.1); padding:12px 20px; border-radius:50px; font-size:14px; font-weight:600;}

/* ============ CERTIFICATIONS ============ */
.cert-card{background:#fff; border-radius:var(--radius-md); padding:26px; text-align:center; height:100%; box-shadow:0 10px 30px rgba(0,0,0,.05);}
.cert-card img{max-height:70px; margin-bottom:16px; object-fit:contain;}
.cert-card h6{margin-bottom:6px;}
.cert-card p{font-size:13px; margin:0; color:var(--gray);}
.cert-placeholder{
  border:2px dashed #d5ddd0; border-radius:var(--radius-md); padding:40px 20px; text-align:center; color:var(--gray);
}