@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=Inter:wght@400;500;600;700;800&display=swap');
:root{--navy:#061a3a;--navy2:#0a2855;--orange:#f58220;--gold:#ffb347;--ink:#12213a;--muted:#64748b;--light:#f4f7fb;--white:#fff;--line:#e4eaf2}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:Inter,Arial,sans-serif;background:#fff;line-height:1.65}a{text-decoration:none;color:inherit}.container{width:min(1180px,92%);margin:auto}
.topbar{background:var(--navy);color:#fff;font-size:13px}.topbar .container{display:flex;justify-content:space-between;gap:20px;padding:9px 0}
nav{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}nav .container{height:82px;display:flex;align-items:center;justify-content:space-between}.brand img{width:185px;display:block}.menu{display:flex;align-items:center;gap:28px;font-weight:700;font-size:14px}.menu a:hover,.menu a.active{color:var(--orange)}.nav-cta{background:var(--orange);color:#fff;padding:13px 19px;border-radius:2px}.hamb{display:none;font-size:28px}
h1,h2,h3,h4{font-family:"Barlow Condensed",Arial,sans-serif;text-transform:uppercase;line-height:.98;margin:0 0 18px;color:var(--navy)}h1{font-size:clamp(48px,7vw,88px);letter-spacing:-1px}h2{font-size:clamp(38px,5vw,62px)}h3{font-size:30px}p{margin:0 0 18px}.eyebrow{color:var(--orange);font-size:13px;font-weight:800;letter-spacing:2px;text-transform:uppercase;margin-bottom:14px}.btn{display:inline-flex;align-items:center;gap:10px;background:var(--orange);color:#fff;padding:15px 23px;font-weight:800;text-transform:uppercase;font-size:13px;letter-spacing:.5px;border:0;cursor:pointer}.btn.alt{background:var(--navy)}.btn.outline{background:transparent;border:1px solid rgba(255,255,255,.45)}.btn:hover{transform:translateY(-2px)}
.hero{min-height:650px;display:flex;align-items:center;position:relative;overflow:hidden;background:linear-gradient(90deg,rgba(5,22,51,.96) 0%,rgba(5,22,51,.78) 45%,rgba(5,22,51,.22) 100%),url('https://images.unsplash.com/photo-1509391366360-2e959784a276?auto=format&fit=crop&w=1800&q=85') center/cover}.hero:after{content:"";position:absolute;right:-8%;bottom:-25%;width:55%;height:50%;background:var(--orange);transform:skewX(-25deg);opacity:.9}.hero .container{position:relative;z-index:2}.hero h1{color:#fff;max-width:800px}.hero p{color:#e7eef9;max-width:680px;font-size:18px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.strip{background:var(--orange);color:#fff}.strip .container{display:grid;grid-template-columns:repeat(4,1fr)}.strip div{padding:20px;border-right:1px solid rgba(255,255,255,.25);font-weight:800;text-transform:uppercase;font-size:14px}
.section{padding:95px 0}.section.altbg{background:var(--light)}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.image-box{min-height:430px;background-size:cover;background-position:center;position:relative}.image-box:before{content:"";position:absolute;inset:18px;border:1px solid rgba(255,255,255,.5)}.image-solar{background-image:url('https://images.unsplash.com/photo-1497435334941-8c899ee9e8e9?auto=format&fit=crop&w=1000&q=85')}.image-fuel{background-image:url('https://images.unsplash.com/photo-1625047509248-ec889cbff17f?auto=format&fit=crop&w=1000&q=85')}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{background:#fff;border:1px solid var(--line);padding:32px;position:relative;overflow:hidden}.card:after{content:"";position:absolute;left:0;bottom:0;width:45px;height:4px;background:var(--orange)}.icon{width:52px;height:52px;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:22px;margin-bottom:22px}.card p{color:var(--muted)}.card a{color:var(--orange);font-weight:800;text-transform:uppercase;font-size:13px}
.dark{background:var(--navy);color:#dbe7f7}.dark h2,.dark h3{color:#fff}.dark .eyebrow{color:var(--gold)}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.step{padding:25px;background:#0c2c5d;border-top:4px solid var(--orange)}.step b{font-family:"Barlow Condensed";font-size:40px;color:var(--orange)}.step h3{font-size:22px;margin-top:8px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.stat{border-left:4px solid var(--orange);padding:15px 20px}.stat strong{font-family:"Barlow Condensed";font-size:54px;color:var(--navy);display:block}.stat span{text-transform:uppercase;font-weight:800;font-size:12px}
.pagehero{background:linear-gradient(90deg,rgba(6,26,58,.95),rgba(6,26,58,.55)),url('https://images.unsplash.com/photo-1473341304170-971dccb5ac1e?auto=format&fit=crop&w=1800&q=85') center/cover;padding:110px 0;color:#fff}.pagehero h1{color:#fff;font-size:70px}.pagehero p{max-width:650px}
.list{padding:0;margin:25px 0;list-style:none}.list li{padding:10px 0 10px 28px;border-bottom:1px solid var(--line);position:relative}.list li:before{content:"✓";position:absolute;left:0;color:var(--orange);font-weight:900}
.form-wrap{display:grid;grid-template-columns:1fr 1.35fr;gap:40px}.form{background:#fff;padding:36px;border:1px solid var(--line);box-shadow:0 15px 45px rgba(6,26,58,.08)}label{display:block;font-weight:700;font-size:13px;margin:0 0 7px}input,select,textarea{width:100%;padding:14px;border:1px solid #d7dfeb;background:#fff;font:inherit;margin-bottom:18px}textarea{min-height:140px;resize:vertical}.checkgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}.checkgrid label{font-weight:600}.checkgrid input{width:auto;margin:0 7px 0 0}
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.product{border:1px solid var(--line);background:#fff}.product-img{height:230px;background-size:cover;background-position:center}.product-body{padding:24px}.tag{display:inline-block;background:#fff1e6;color:#b95500;padding:5px 9px;font-size:11px;font-weight:800;text-transform:uppercase}.price{font-family:"Barlow Condensed";font-size:28px;color:var(--navy);margin:10px 0}
.cart{position:fixed;right:20px;bottom:85px;width:330px;background:#fff;box-shadow:0 20px 60px rgba(0,0,0,.2);z-index:70;padding:22px;border-top:4px solid var(--orange);display:none}.cart.show{display:block}.cart h3{font-size:25px}.cart-item{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}
footer{background:#031127;color:#aebbd0;padding:60px 0 25px}.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:35px}.footer-logo{width:180px;background:#fff;padding:7px;margin-bottom:20px}.footer-title{color:#fff;font-weight:800;text-transform:uppercase;font-size:13px;letter-spacing:1px;margin-bottom:15px}.footer-links a{display:block;padding:4px 0}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:40px;padding-top:18px;font-size:12px}
.whatsapp{position:fixed;right:22px;bottom:20px;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;display:grid;place-items:center;font-size:28px;z-index:80;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.notice{background:#fff7ef;border-left:4px solid var(--orange);padding:18px;margin-top:20px}
@media(max-width:900px){.menu{display:none}.hamb{display:block}.topbar .container{flex-direction:column;gap:3px}.strip .container,.cards,.product-grid,.stats,.footer-grid,.split,.form-wrap,.steps{grid-template-columns:1fr 1fr}.hero{min-height:590px}.section{padding:70px 0}}
@media(max-width:600px){nav .container{height:72px}.brand img{width:145px}.strip .container,.cards,.product-grid,.stats,.footer-grid,.split,.form-wrap,.steps{grid-template-columns:1fr}.hero{min-height:650px}.hero:after{display:none}.pagehero{padding:80px 0}.pagehero h1{font-size:54px}.cart{width:calc(100% - 40px)}}

/* ===== Enhanced responsive navigation ===== */
.site-nav{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.98);backdrop-filter:blur(10px);box-shadow:0 2px 18px rgba(6,26,58,.06)}
.nav-inner{position:relative}
.menu{display:flex;align-items:center;gap:24px}
.nav-drop{position:relative;height:100%;display:flex;align-items:center}
.drop-btn{border:0;background:none;font:inherit;font-weight:700;color:var(--ink);cursor:pointer;padding:12px 0}
.drop-btn span{margin-left:4px;color:var(--orange)}
.drop-menu{position:absolute;left:-16px;top:58px;min-width:235px;background:#fff;border-top:3px solid var(--orange);box-shadow:0 18px 45px rgba(6,26,58,.14);padding:8px;display:none}
.nav-drop:hover .drop-menu,.nav-drop.open .drop-menu{display:block}
.drop-menu a{display:block!important;padding:11px 13px!important;font-size:13px!important}
.drop-menu a:hover{background:var(--light)}
.menu.open{display:flex}
.hamb{background:none;border:0;color:var(--navy);cursor:pointer;line-height:1}
.nav-cta{white-space:nowrap}
.whatsapp{font-family:Arial,sans-serif;font-weight:900;font-size:15px;text-decoration:none}
@media(max-width:900px){
 .site-nav .nav-inner{height:72px}
 .hamb{display:block}
 .menu{display:none;position:absolute;left:0;right:0;top:72px;background:#fff;border-top:1px solid var(--line);box-shadow:0 20px 35px rgba(6,26,58,.13);padding:12px 4%;flex-direction:column;align-items:stretch;gap:0}
 .menu.open{display:flex}
 .menu>a,.drop-btn{display:block;width:100%;padding:14px 4px!important;border-bottom:1px solid #edf1f6;text-align:left}
 .nav-cta{text-align:center!important;margin-top:10px;border-bottom:0!important}
 .nav-drop{display:block;height:auto}
 .drop-menu{position:static;box-shadow:none;border-top:0;border-left:3px solid var(--orange);padding:0 0 0 10px;background:#fafbfd}
 .nav-drop.open .drop-menu{display:block}
}

.cart-item button{border:0;background:none;font-size:20px;cursor:pointer;color:var(--muted)}

/* FINAL MOBILE MENU FIX */
@media (max-width: 900px) {
  .site-nav { z-index: 9999; }
  .site-nav .nav-inner { height: 72px; }
  .site-nav .hamb {
    display: block !important;
    position: relative;
    z-index: 10001;
    width: 48px;
    height: 48px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--navy);
    font-size: 30px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .site-nav .menu {
    display: none !important;
    position: absolute;
    z-index: 10000;
    left: 0;
    right: 0;
    top: 72px;
    width: 100%;
    max-height: calc(100vh - 72px);
    overflow-y: auto;
    background: #fff;
    padding: 12px 5% 24px;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    box-shadow: 0 20px 45px rgba(6,26,58,.18);
  }
  .site-nav .menu.open {
    display: flex !important;
  }
  .site-nav .menu > a,
  .site-nav .drop-btn {
    width: 100%;
    min-height: 48px;
    padding: 14px 4px !important;
    text-align: left;
  }
  .site-nav .nav-cta {
    text-align: center !important;
    margin-top: 10px;
  }
}
@media (min-width: 901px) {
  .site-nav .hamb { display: none !important; }
}