/*
Theme Name: Raynetic Energy
Description: Solar & Renewable Energy website for Raynetic Energy Pvt. Ltd.
Version: 1.0.0
*/

/* =====================================================================
   RAYNETIC ENERGY — BRAND OVERRIDES & CUSTOM COMPONENTS
   Design system: green #5B9B37 (primary) + solar gold #F8BC26 (accent)
   Loaded last, so these rules win over main.css.
   ===================================================================== */

/* ---- Logo lockup (icon + wordmark) ---- */
.rn-logo{display:inline-flex;align-items:center;gap:12px;line-height:1;text-decoration:none;}
.rn-logo img{height:52px;width:auto;flex:0 0 auto;}
.rn-logo span{font-family:"Krona One",system-ui,sans-serif;font-size:22px;font-weight:400;color:#fff;letter-spacing:.2px;white-space:nowrap;}
.rn-logo span b{color:#F8BC26;font-weight:400;}
.rn-logo--dark span{color:#1F242C;}
.footer-section .rn-logo span{color:#fff;}
.footer-section .rn-logo{margin-bottom:22px;}
@media (max-width:480px){.rn-logo img{height:42px;}.rn-logo span{font-size:18px;}}

/* Header logo sits in a colored bar in this template; keep wordmark readable */
.header-2 .main-logo{display:flex;align-items:center;}
/* On mobile/tablet the mobile menu shows its own logo, so hide the sticky-header one to avoid a duplicate */
@media (max-width:1199px){.header-2 .main-logo{display:none;}}

/* ---- Footer contact list ---- */
.footer-contact-list{margin:0;padding:0;list-style:none;}
.footer-contact-list li{position:relative;color:#c9cccf;font-size:15px;line-height:1.7;padding-left:28px;margin-bottom:14px;}
.footer-contact-list li i{position:absolute;left:0;top:5px;color:#F8BC26;}
.footer-contact-list a{color:#c9cccf;transition:.3s;}
.footer-contact-list a:hover{color:#F8BC26;}

/* ---- Projects gallery ---- */
.rn-gallery{margin-top:10px;}
.rn-project-group{margin-bottom:60px;}
.rn-project-group .group-head{margin-bottom:26px;}
.rn-project-group .group-head h3{font-size:28px;margin-bottom:6px;}
.rn-project-group .group-head .loc{color:#5B9B37;font-weight:600;display:inline-flex;align-items:center;gap:8px;font-size:15px;}
.rn-gallery-item{position:relative;display:block;overflow:hidden;border-radius:12px;height:100%;box-shadow:0px 4px 25px rgba(0,0,0,0.06);}
.rn-gallery-item img{width:100%;height:280px;object-fit:cover;display:block;transition:transform .5s ease;}
.rn-gallery-item:hover img{transform:scale(1.07);}
.rn-gallery-item .overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(31,36,44,.72),rgba(31,36,44,0) 55%);opacity:0;transition:.4s;display:flex;align-items:flex-end;padding:22px;}
.rn-gallery-item:hover .overlay{opacity:1;}
.rn-gallery-item .overlay .zoom{position:absolute;top:18px;right:18px;width:46px;height:46px;border-radius:50%;background:#5B9B37;color:#fff;display:flex;align-items:center;justify-content:center;transform:translateY(-10px);transition:.4s;}
.rn-gallery-item:hover .overlay .zoom{transform:translateY(0);}
.rn-gallery-item .overlay span{color:#fff;font-weight:600;font-size:15px;}
@media (max-width:575px){.rn-gallery-item img{height:220px;}}

/* ---- Responsive video embeds ---- */
.rn-video-card{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0px 4px 25px rgba(0,0,0,0.07);height:100%;}
.rn-video-embed{position:relative;width:100%;padding-top:56.25%;background:#1F242C;}
.rn-video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.rn-video-card .v-body{padding:22px 24px 26px;}
.rn-video-card .v-body h4{font-size:20px;margin-bottom:8px;}
.rn-video-card .v-body p{margin:0;color:#5f6570;font-size:15px;}

/* ---- Simple info cards / value grid ---- */
.rn-icard{background:#fff;border:1px solid #ededed;border-radius:14px;padding:34px 30px;height:100%;transition:.35s;}
.rn-icard:hover{box-shadow:0px 20px 40px rgba(0,0,0,0.08);transform:translateY(-6px);border-color:transparent;}
.rn-icard .ic{width:64px;height:64px;border-radius:14px;background:rgba(91,155,55,.1);color:#5B9B37;display:flex;align-items:center;justify-content:center;font-size:26px;margin-bottom:22px;}
.rn-icard h4{font-size:21px;margin-bottom:12px;}
.rn-icard p{margin:0;color:#5f6570;}
.rn-icard .num{font-family:"Krona One",sans-serif;color:#F8BC26;font-size:15px;margin-bottom:14px;display:block;}

/* ---- Process / steps ---- */
.rn-step{background:#fff;border-radius:14px;padding:36px 30px;height:100%;position:relative;border:1px solid #ededed;transition:.35s;}
.rn-step:hover{box-shadow:0px 20px 40px rgba(0,0,0,0.08);transform:translateY(-6px);}
.rn-step .step-num{font-family:"Krona One",sans-serif;font-size:40px;color:rgba(91,155,55,.18);line-height:1;margin-bottom:16px;}
.rn-step h4{font-size:20px;margin-bottom:12px;}
.rn-step p{margin:0;color:#5f6570;}

/* ---- Standards / certification badges ---- */
.rn-badge{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid #ededed;border-radius:12px;padding:20px 22px;height:100%;transition:.3s;}
.rn-badge:hover{box-shadow:0px 14px 30px rgba(0,0,0,0.07);}
.rn-badge .b-ic{width:52px;height:52px;flex:0 0 auto;border-radius:10px;background:rgba(248,188,38,.14);color:#F8BC26;display:flex;align-items:center;justify-content:center;font-size:22px;}
.rn-badge h5{margin:0 0 3px;font-size:17px;}
.rn-badge p{margin:0;font-size:13px;color:#5f6570;}

/* ---- Placeholder marker (visible so client can spot gaps) ---- */
.rn-placeholder{background:#fff8e6;border:1px dashed #F8BC26;border-radius:10px;padding:14px 18px;color:#8a6d1f;font-size:14px;}

/* ---- Secondary / outline button ---- */
.theme-btn.theme-btn-2{background:transparent;border:2px solid #fff;color:#fff;}
.theme-btn.theme-btn-2:hover{background:#F8BC26;border-color:#F8BC26;color:#1F242C;}
.theme-btn.theme-btn-2:before{background:#F8BC26;}

/* ---- Counter / stat band ---- */
.counter-section{position:relative;}
.counter-section:before{content:"";position:absolute;inset:0;background:rgba(31,36,44,.82);}
.counter-section .container{position:relative;z-index:2;}
.counter-box h2{font-family:"Krona One",sans-serif;color:#fff;font-size:46px;margin-bottom:6px;}
.counter-box h2 .count{color:#F8BC26;}
.counter-box p{color:#e9eaec;margin:0;font-size:16px;}
@media (max-width:575px){.counter-box h2{font-size:34px;}}

/* ---- CTA band ---- */
.cta-section{position:relative;}
.cta-section:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(31,36,44,.9),rgba(91,155,55,.82));}
.cta-section .container{position:relative;z-index:2;}

/* ---- Quote form ---- */
.rn-form input,.rn-form textarea{width:100%;border:1px solid #e3e3e3;background:#fff;border-radius:10px;padding:15px 18px;font-size:15px;color:#1F242C;outline:none;transition:.3s;font-family:"Lato",sans-serif;}
.rn-form textarea{resize:vertical;min-height:130px;}
.rn-form input:focus,.rn-form textarea:focus{border-color:#5B9B37;box-shadow:0 0 0 3px rgba(91,155,55,.12);}
.rn-form input::placeholder,.rn-form textarea::placeholder{color:#9aa0a6;}
.rn-form .theme-btn{border:0;cursor:pointer;margin-top:8px;}
.rn-form-msg{margin:10px 0 0;font-size:15px;}
.rn-form-msg.success{color:#28a745;font-weight:600;}
.rn-form-msg.error{color:#dc3545;font-weight:600;}

/* ---- Map ---- */
.rn-map{line-height:0;}
.rn-map iframe{filter:grayscale(.15);}

/* ---- Hero tweaks ---- */
.hero-1 .hero-content h6{color:#F8BC26;}
/* Hero overlay (template disables it by default) — darker on the left for text legibility, fading right */
.hero-section{position:relative;}
.hero-section.hero-1.hero-2::before{
  display:block;
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(31,36,44,.82) 0%, rgba(31,36,44,.55) 42%, rgba(31,36,44,.15) 78%, rgba(31,36,44,.05) 100%);
  z-index:1;
}
.hero-section.hero-1.hero-2 .container{position:relative;z-index:2;}

/* ---- Floating Call / WhatsApp buttons (fixed, every page) ---- */
.rn-float{position:fixed;bottom:28px;width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:27px;z-index:9999;box-shadow:0 6px 22px rgba(0,0,0,.28);transition:transform .3s ease, box-shadow .3s ease;text-decoration:none;}
.rn-float:hover{transform:scale(1.1);color:#fff;}
.rn-float i{line-height:1;}
.rn-float-whatsapp{right:26px;background:#25D366;}
.rn-float-call{left:26px;background:#5B9B37;}
.rn-float::before{content:"";position:absolute;inset:0;border-radius:50%;z-index:-1;}
.rn-float-whatsapp::before{animation:rnPulseGreen 2s infinite;}
.rn-float-call::before{animation:rnPulseBrand 2s infinite;}
@keyframes rnPulseGreen{0%{box-shadow:0 0 0 0 rgba(37,211,102,.55);}70%{box-shadow:0 0 0 18px rgba(37,211,102,0);}100%{box-shadow:0 0 0 0 rgba(37,211,102,0);}}
@keyframes rnPulseBrand{0%{box-shadow:0 0 0 0 rgba(91,155,55,.55);}70%{box-shadow:0 0 0 18px rgba(91,155,55,0);}100%{box-shadow:0 0 0 0 rgba(91,155,55,0);}}
@media (max-width:480px){.rn-float{width:50px;height:50px;font-size:23px;bottom:20px;}.rn-float-whatsapp{right:18px;}.rn-float-call{left:18px;}}

/* ---- Utility ---- */
.rn-bg-light{background:#F7F7F7;}
.rn-lead{font-size:18px;line-height:1.75;color:#5f6570;}
.rn-check-list{margin:0;padding:0;list-style:none;}
.rn-check-list li{position:relative;padding-left:32px;margin-bottom:14px;color:#5f6570;}
.rn-check-list li:before{content:"\f00c";font-family:"Font Awesome 5 Pro";font-weight:900;position:absolute;left:0;top:2px;color:#5B9B37;background:rgba(91,155,55,.12);width:22px;height:22px;border-radius:50%;font-size:11px;display:flex;align-items:center;justify-content:center;}


/*
=================================
|***    Table of contents:   ***|
=================================

Main Style file-> assets/css/main.css 

All the SCSS File in SCSS Folder of Assets Folder. You can read the doc file also for better understand.

// BASIC
@import 'basic';

// MIXIN
@import 'variables';

// TYPOGRAPHY
@import 'typography';

// MIX
@import 'mix';

// HELPER
@import 'helper';

// ICON FONTS
@import 'icon';

// ANIMATION
@import 'animation';

// Button 
@import 'btn';

// Colors 
@import 'colors';

// Preloader 
@import 'preloader';

/* ----------------------------------
    Template Section Styles
 ------------------------------------*/

 /* // Menu - Header Section 
 @import 'header';
 
 // Hero Slide - Section 
 @import 'hero';
 
 // Section Title - Heading 
 @import 'section';
 
 // About - Section 
 @import 'about';
 
 // Features - Section 
 @import 'features';
 
 // services - Section 
 @import 'services';
 
 // testimonial - Section 
 @import 'testimonial';
 
 // Portfolio - Cases - Section 
 @import 'project';
 
 // Price Table - Section 
 @import 'price';
 
 // Call To Action - Section 
 @import 'cta';
 
 // Content Block - Section 
 @import 'contentblock';
 
 // team - Section 
 @import 'team';
 
 // funfact - Section 
 @import 'funfact';
 
 // Download - Section 
 @import 'carousel';
 
 // FAQ - Section 
 @import 'faq';
 
 // Blog - Section 
 @import 'blog';
 
 // Contact Us - Section 
 @import 'contact';
 
 // footer - Section 
 @import 'footer';n facts */