:root{
    --char:#0a0a0d;
    --char-2:#131317;
    --steel:#1c1c22;
    --steel-line: rgba(255,255,255,0.08);
    --alarm:#e8291c;
    --alarm-glow: #ff4b36;
    --amber:#ffb020;
    --amber-glow:#ffd166;
    --off-white:#f4f1ea;
    --muted:#9a9aa2;
    --font-display: 'Rajdhani', 'Oswald', sans-serif;
    --font-body: 'Inter', system-ui, sans-serif;
  }
  @import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--char);
    color:var(--off-white);
    font-family:var(--font-body);
    line-height:1.6;
    overflow-x:hidden;
  }
  a{color:inherit; text-decoration:none;}
  img{max-width:100%; display:block;}
  section{position:relative; padding:110px 8vw;}
  h1,h2,h3,h4{font-family:var(--font-display); letter-spacing:0.02em; text-transform:uppercase;}

  /* subtle laser grid backdrop used across dark sections */
  .grid-bg{
    position:absolute; inset:0; pointer-events:none; opacity:0.35;
    background-image:
      linear-gradient(var(--steel-line) 1px, transparent 1px),
      linear-gradient(90deg, var(--steel-line) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: radial-gradient(ellipse at 50% 0%, black 40%, transparent 85%);
  }

  /* ---------- NAV ---------- */
  header{
    position:fixed; top:0; left:0; right:0; z-index:100;
    display:flex; align-items:center; justify-content:space-between;
    padding:22px 6vw;
    background:linear-gradient(to bottom, rgba(10,10,13,0.9), transparent);
    backdrop-filter:blur(6px);
  }
  .brand{display:flex; align-items:center; gap:12px; font-family:var(--font-display); font-weight:700; font-size:1.3rem;}
  .brand-mark{
    width:36px; height:36px; border-radius:6px;
    background: linear-gradient(135deg, var(--alarm), var(--amber));
    position:relative;
    box-shadow: 0 0 18px rgba(232,41,28,0.55);
    
    /* Centraliza o conteúdo */
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .brand-logo{
    width:35px;
    height:35px;
    display:block;
  }
  nav ul{display:flex; gap:36px; list-style:none;}
  nav a{font-size:0.85rem; letter-spacing:0.08em; text-transform:uppercase; font-weight:600; color:var(--muted); transition:color .25s;}
  nav a:hover{color:var(--amber);}
  .nav-cta{
    padding:10px 20px; border:1px solid var(--alarm); border-radius:4px;
    font-size:0.8rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--off-white); background:rgba(232,41,28,0.12);
    transition:all .25s;
  }
  .nav-cta:hover{background:var(--alarm); box-shadow:0 0 20px rgba(232,41,28,0.6);}
  .nav-toggle{display:none;}

  /* ---------- HERO ---------- */
  .hero{
    height:100vh; min-height:640px;
    display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
    padding:0 8vw;
    position:relative;
    background:
      radial-gradient(ellipse 120% 80% at 20% 0%, rgba(232,41,28,0.18), transparent 60%),
      radial-gradient(ellipse 100% 70% at 90% 100%, rgba(255,176,32,0.14), transparent 60%),
      var(--char);
    overflow:hidden;
  }
  .hero-video{
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
    opacity:0.28; filter:saturate(1.3) contrast(1.1);
  }
  .hero-scanline{
    position:absolute; left:0; right:0; height:2px;
    background:linear-gradient(90deg, transparent, var(--alarm-glow), var(--amber-glow), transparent);
    box-shadow:0 0 24px 4px rgba(255,75,54,0.6);
    animation:scan 5s linear infinite;
    opacity:0.85;
  }
  @keyframes scan{
    0%{top:-2%;}
    100%{top:102%;}
  }
  .hero-content{position:relative; z-index:2; max-width:820px;}
  .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-family:var(--font-display); font-weight:600; letter-spacing:0.22em; font-size:0.78rem;
    color:var(--amber); margin-bottom:22px; text-transform:uppercase;
  }
  .eyebrow::before{
    content:''; width:8px; height:8px; border-radius:50%;
    background:var(--alarm); box-shadow:0 0 10px 3px rgba(232,41,28,0.8);
    animation:pulse 1.6s ease-in-out infinite;
  }
  @keyframes pulse{
    0%,100%{opacity:1; transform:scale(1);}
    50%{opacity:0.4; transform:scale(0.7);}
  }
  .hero h1{
    font-size:clamp(2.6rem, 6vw, 5rem); line-height:1.02; font-weight:700;
    background:linear-gradient(100deg, var(--off-white) 40%, var(--amber-glow) 65%, var(--alarm-glow) 100%);
    -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  .hero p{
    margin-top:26px; max-width:560px; color:var(--muted); font-size:1.08rem;
  }
  .hero-actions{display:flex; gap:18px; margin-top:44px; flex-wrap:wrap;}
  .btn-primary, .btn-secondary{
    padding:16px 30px; border-radius:4px; font-weight:700; font-size:0.85rem;
    letter-spacing:0.06em; text-transform:uppercase; font-family:var(--font-display);
    transition:all .25s;
  }
  .btn-primary{
    background:linear-gradient(120deg, var(--alarm), #ff6a3c);
    color:#0a0a0d; box-shadow:0 6px 30px rgba(232,41,28,0.35);
  }
  .btn-primary:hover{transform:translateY(-2px); box-shadow:0 10px 36px rgba(232,41,28,0.55);}
  .btn-secondary{border:1px solid var(--steel-line); color:var(--off-white);}
  .btn-secondary:hover{border-color:var(--amber); color:var(--amber);}

  .hero-stats{
    position:absolute; bottom:48px; right:8vw; display:flex; gap:44px; z-index:2;
  }
  .stat{text-align:right;}
  .stat b{display:block; font-family:var(--font-display); font-size:1.9rem; color:var(--amber);}
  .stat span{font-size:0.72rem; color:var(--muted); letter-spacing:0.06em; text-transform:uppercase;}

  /* ---------- SOBRE ---------- */
  .sobre{background:var(--char);}
  .sobre-grid{
    display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; position:relative; z-index:1;
  }
  .tag{
    font-family:var(--font-display); font-size:0.78rem; letter-spacing:0.22em; color:var(--alarm-glow);
    text-transform:uppercase; margin-bottom:14px; display:block;
  }
  .sobre h2{font-size:clamp(1.9rem,3.4vw,2.6rem); margin-bottom:22px;}
  .sobre p{color:var(--muted); margin-bottom:16px; max-width:520px;}
  .sobre-visual{
    position:relative; border-radius:8px; overflow:hidden; border:1px solid var(--steel-line);
    aspect-ratio:4/3; background:var(--steel);
  }
  .sobre-visual img{width:100%; height:100%; object-fit:cover; opacity:0.85;}
  .sobre-visual::after{
    content:''; position:absolute; inset:0;
    background:linear-gradient(160deg, rgba(232,41,28,0.25), transparent 55%);
  }
  .pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:60px; position:relative; z-index:1;}
  .pillar{
    background:var(--steel); border:1px solid var(--steel-line); border-radius:8px; padding:30px 26px;
    transition:border-color .25s, transform .25s;
  }
  .pillar:hover{border-color:var(--alarm); transform:translateY(-4px);}
  .pillar h4{font-size:1.05rem; margin-bottom:10px; color:var(--amber);}
  .pillar p{color:var(--muted); font-size:0.92rem;}

  /* ---------- SERVICOS ---------- */
  .servicos{background:var(--char-2); border-top:1px solid var(--steel-line); border-bottom:1px solid var(--steel-line);}
  .servicos-head{max-width:640px; margin-bottom:60px; position:relative; z-index:1;}
  .servicos-head h2{font-size:clamp(1.9rem,3.4vw,2.6rem); margin-bottom:16px;}
  .servicos-head p{color:var(--muted);}
  .service-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:26px; position:relative; z-index:1;}
  .service-card{
    background:linear-gradient(180deg, var(--steel), var(--char-2));
    border:1px solid var(--steel-line); border-radius:10px; padding:36px 30px;
    position:relative; overflow:hidden; transition:transform .3s, border-color .3s;
  }
  .service-card:hover{transform:translateY(-6px); border-color:var(--alarm);}
  .service-card .icon-wrap{
    width:56px; height:56px; border-radius:10px; margin-bottom:26px;
    display:flex; align-items:center; justify-content:center;
    background:rgba(232,41,28,0.12); border:1px solid rgba(232,41,28,0.35);
  }
  .service-card.solar .icon-wrap{background:rgba(255,176,32,0.14); border-color:rgba(255,176,32,0.4);}
  .service-card h3{font-size:1.2rem; margin-bottom:12px; color:var(--off-white);}
  .service-card p{color:var(--muted); font-size:0.94rem;}
  .service-card .num{
    position:absolute; top:24px; right:26px; font-family:var(--font-display);
    font-size:0.78rem; color:var(--steel-line); letter-spacing:0.1em;
  }
  .service-card::before{
    content:''; position:absolute; left:0; right:0; bottom:0; height:2px;
    background:linear-gradient(90deg, var(--alarm), var(--amber)); transform:scaleX(0);
    transform-origin:left; transition:transform .35s;
  }
  .service-card:hover::before{transform:scaleX(1);}

  /* ---------- SOLAR HIGHLIGHT / PAINEIS ---------- */
  .solar-strip{
    background:var(--char); position:relative; overflow:hidden;
    display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;
  }
  .panel-field{
    position:relative; aspect-ratio:4/3; border-radius:10px; overflow:hidden;
    background:
      linear-gradient(160deg, rgba(255,176,32,0.12), rgba(232,41,28,0.08)),
      repeating-linear-gradient(0deg, #14161c 0 46px, #191c24 46px 48px),
      repeating-linear-gradient(90deg, #14161c 0 46px, #191c24 46px 48px);
    border:1px solid var(--steel-line);
  }
  
  .panel-field .sweep{
    position:absolute; top:0; bottom:0; width:40%;
    background:linear-gradient(90deg, transparent, rgba(255,176,32,0.28), transparent);
    animation:sweep 4s ease-in-out infinite;
  }
  
  .images{
    position:absolute;
    inset:15px;

    display:grid;
    gap:12px;

    grid-template-columns:1fr 1fr;
    grid-template-rows:1fr 1.6fr;

    height:calc(100% - 30px);

    z-index:1;
  }

  .images img{
    width:100%;
    height:100%;
    object-fit:cover;

    border-radius:12px;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
  }

  .images img:nth-child(3){
    grid-column:1 / span 2;
  }

  .images img:hover{
    transform:scale(1.03);
    box-shadow:0 8px 25px rgba(0,0,0,.35);
    border:1px solid var(--amber);
    box-shadow:0 0 18px rgba(255,176,32,.35);
  }
  
  /* ---------- RESPONSIVO ---------- */

   @media (max-width:900px){

    .panel-field{
        aspect-ratio:1/1;
        min-height:340px;
    }

    .images{
        inset:10px;
        gap:8px;
        height:calc(100% - 20px);
    }

    .images img{
        border-radius:10px;
    }

   }
  
  @keyframes sweep{
    0%{left:-40%;}
    100%{left:100%;}
  }
  .solar-copy h2{font-size:clamp(1.9rem,3.2vw,2.4rem); margin-bottom:18px;}
  .solar-copy p{color:var(--muted); margin-bottom:16px; max-width:480px;}
  .check-list{list-style:none; margin-top:24px; display:flex; flex-direction:column; gap:12px;}
  .check-list li{display:flex; gap:12px; align-items:flex-start; font-size:0.95rem; color:var(--off-white);}
  .check-list li::before{
    content:'▲'; color:var(--amber); font-size:0.7rem; margin-top:5px;
  }

  /* ---------- CLIENTES ---------- */
  .clientes{background:var(--char-2); border-top:1px solid var(--steel-line);}
  .clientes h2{font-size:1rem; letter-spacing:0.18em; color:var(--muted); text-align:center; margin-bottom:44px; text-transform:uppercase;}

   /* .logo-row img{height:38px; width:auto; object-fit:contain;} */
  
  /* ---------- CLIENTES ---------- */

.logo-row{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
    gap:30px;
    align-items:center;
    justify-items:center;
}

.logo-item{
    width:180px;
    height:90px;

    display:flex;
    justify-content:center;
    align-items:center;

    flex:0 0 180px;

    background:transparent;
}

.logo-item img{
    max-width:160px;
    max-height:70px;

    width:auto;
    height:auto;

    object-fit:contain;

    transition:transform .3s ease;
}

.logo-item img:hover{
    transform:scale(1.05);
}

  /* ---------- CONTATO ---------- */
  .contato{background:var(--char); position:relative;}
  .contato-grid{display:grid; grid-template-columns:1fr 1fr; gap:70px; position:relative; z-index:1;}
  .contato h2{font-size:clamp(1.9rem,3.4vw,2.6rem); margin-bottom:16px;}
  .contato > .contato-grid > div > p{color:var(--muted); margin-bottom:34px; max-width:440px;}
  .info-item{display:flex; gap:16px; margin-bottom:26px;}
  .info-item .ico{
    width:42px; height:42px; border-radius:8px; flex-shrink:0;
    background:rgba(232,41,28,0.12); border:1px solid rgba(232,41,28,0.3);
    display:flex; align-items:center; justify-content:center; color:var(--amber); font-weight:700;
  }
  .info-item b{display:block; font-size:0.95rem;}
  .info-item span{color:var(--muted); font-size:0.9rem;}
  form{display:flex; flex-direction:column; gap:16px;}
  .field-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
  input, textarea{
    background:var(--steel); border:1px solid var(--steel-line); border-radius:6px;
    padding:14px 16px; color:var(--off-white); font-family:var(--font-body); font-size:0.92rem;
    transition:border-color .25s;
  }
  input::placeholder, textarea::placeholder{color:#6b6b74;}
  input:focus, textarea:focus{outline:none; border-color:var(--alarm);}
  textarea{resize:vertical; min-height:120px;}
  .submit-btn{
    align-self:flex-start; margin-top:6px; padding:16px 34px; border-radius:4px; border:none;
    background:linear-gradient(120deg, var(--alarm), var(--amber)); color:#0a0a0d;
    font-family:var(--font-display); font-weight:700; letter-spacing:0.06em; text-transform:uppercase;
    cursor:pointer; transition:transform .2s;
  }
  .submit-btn:hover{transform:translateY(-2px);}

  footer{
    background:var(--char-2); border-top:1px solid var(--steel-line);
    padding:36px 8vw; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;
  }
  footer .brand{font-size:1rem;}
  .foot-links{display:flex; gap:26px;}
  .foot-links a{color:var(--muted); font-size:0.85rem; transition:color .2s;}
  .foot-links a:hover{color:var(--amber);}
  .socials{display:flex; gap:14px;}
  .socials a{
    width:36px; height:36px; border-radius:50%; border:1px solid var(--steel-line);
    display:flex; align-items:center; justify-content:center; font-size:0.85rem; color:var(--muted);
    transition:all .2s;
  }
  .socials a:hover{border-color:var(--alarm); color:var(--amber);}
  .socials img{
    width:36px; height:36px; border-radius:50%; border:1px solid var(--steel-line);
    display:flex; align-items:center; justify-content:center; font-size:0.85rem; color:var(--muted);
    transition:all .2s;
  }


  @media (max-width:900px){
    nav ul{display:none;}
    .sobre-grid, .solar-strip, .contato-grid{grid-template-columns:1fr;}
    .pillars, .service-cards{grid-template-columns:1fr;}
    .hero-stats{position:static; margin-top:60px; justify-content:flex-start;}
    .field-row{grid-template-columns:1fr;}
    section{padding:80px 6vw;}
  }

 /* @media (prefers-reduced-motion: reduce){
    .hero-scanline, .eyebrow::before, .panel-field .sweep{animation:none;}
  }
  
  */

/* ---------- PAGE HERO (internal pages) ---------- */
.page-hero{
  min-height:52vh; display:flex; flex-direction:column; justify-content:center;
  padding:150px 8vw 70px;
  background:
    radial-gradient(ellipse 100% 70% at 15% 0%, rgba(232,41,28,0.18), transparent 60%),
    radial-gradient(ellipse 90% 60% at 90% 100%, rgba(255,176,32,0.12), transparent 60%),
    var(--char);
  position:relative; overflow:hidden;
}
.page-hero .grid-bg{opacity:0.4;}
.page-hero .eyebrow{position:relative; z-index:1;}
.page-hero h1{
  position:relative; z-index:1;
  font-size:clamp(2.2rem, 5vw, 3.6rem); line-height:1.05; font-weight:700; max-width:820px;
  background:linear-gradient(100deg, var(--off-white) 40%, var(--amber-glow) 70%, var(--alarm-glow) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.page-hero p.lead{position:relative; z-index:1; margin-top:22px; max-width:600px; color:var(--muted); font-size:1.05rem;}
.breadcrumb{
  position:relative; z-index:1; font-size:0.8rem; color:var(--muted); margin-bottom:18px;
  letter-spacing:0.04em;
}
.breadcrumb a{color:var(--muted); transition:color .2s;}
.breadcrumb a:hover{color:var(--amber);}
.breadcrumb span{color:var(--off-white);}

nav a.active{color:var(--amber);}

/* ---------- CLIENTES PAGE ---------- */
.clientes-full{background:var(--char); padding-top:0;}
.client-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:26px; position:relative; z-index:1;}
.client-card{
  background:var(--steel); border:1px solid var(--steel-line); border-radius:10px;
  padding:34px 28px; display:flex; flex-direction:column; align-items:flex-start; gap:18px;
  transition:border-color .25s, transform .25s;
}
.client-card:hover{border-color:var(--amber); transform:translateY(-4px);}
.client-card img{max-height:52px; width:auto; object-fit:contain; opacity:0.85;}
.client-card p{color:var(--muted); font-size:0.9rem;}
.testimonial{
  margin-top:70px; background:linear-gradient(135deg, rgba(232,41,28,0.1), rgba(255,176,32,0.06));
  border:1px solid var(--steel-line); border-radius:12px; padding:50px; position:relative; z-index:1;
}
.testimonial p{font-size:1.3rem; font-family:var(--font-display); font-weight:500; max-width:760px; line-height:1.5;}
.testimonial span{display:block; margin-top:20px; color:var(--amber); font-size:0.85rem; letter-spacing:0.06em; text-transform:uppercase;}
.testimonial img{max-height:52px; width:auto; object-fit:contain; opacity:0.85;}

/* ---------- SERVICOS PAGE (detail) ---------- */
.service-detail{
  display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start;
  padding:70px 0; border-bottom:1px solid var(--steel-line); position:relative; z-index:1;
}
.service-detail:last-child{border-bottom:none;}
.service-detail .num-big{
  font-family:var(--font-display); font-size:5rem; color:var(--steel-line); line-height:1; font-weight:700;
}
.service-detail h3{font-size:1.7rem; margin:16px 0 18px; color:var(--off-white);}
.service-detail p{color:var(--muted); margin-bottom:14px;}
.service-detail .visual{
  aspect-ratio:16/11; border-radius:10px; border:1px solid var(--steel-line); overflow:hidden;
  background:var(--steel); position:relative;
}
.service-detail .visual img{width:100%; height:100%; object-fit:cover; opacity:0.85;}
.service-detail .visual::after{content:''; position:absolute; inset:0; background:linear-gradient(160deg, rgba(232,41,28,0.22), transparent 55%);}
.tag-list{display:flex; flex-wrap:wrap; gap:10px; margin-top:20px;}
.tag-list span{
  border:1px solid var(--steel-line); border-radius:20px; padding:6px 16px; font-size:0.78rem;
  color:var(--muted); letter-spacing:0.04em;
}

/* ---------- FOTOVOLTAICA PAGE ---------- */
.process-steps{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; position:relative; z-index:1;}
.process-step{
  background:var(--steel); border:1px solid var(--steel-line); border-radius:10px; padding:30px 24px;
  position:relative; transition:border-color .25s, transform .25s;
}
.process-step:hover{border-color:var(--amber); transform:translateY(-4px);}
.process-step .step-num{
  font-family:var(--font-display); font-size:0.78rem; color:var(--amber); letter-spacing:0.14em; margin-bottom:14px; display:block;
}
.process-step h4{font-size:1.02rem; margin-bottom:10px;}
.process-step p{color:var(--muted); font-size:0.88rem;}
.solar-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:50px; position:relative; z-index:1;}
.solar-stat{
  text-align:center; padding:34px 20px; border:1px solid var(--steel-line); border-radius:10px; background:var(--char-2);
}
.solar-stat b{display:block; font-family:var(--font-display); font-size:2.4rem; color:var(--amber);}
.solar-stat span{color:var(--muted); font-size:0.82rem; letter-spacing:0.04em; text-transform:uppercase;}

/* ---------- SOBRE PAGE (timeline) ---------- */
.timeline{position:relative; margin-top:60px; padding-left:40px; z-index:1;}
.timeline::before{content:''; position:absolute; left:8px; top:6px; bottom:6px; width:2px; background:linear-gradient(var(--alarm), var(--amber));}
.timeline-item{position:relative; padding-bottom:46px;}
.timeline-item:last-child{padding-bottom:0;}
.timeline-item::before{
  content:''; position:absolute; left:-40px; top:4px; width:14px; height:14px; border-radius:50%;
  background:var(--char); border:2px solid var(--alarm); box-shadow:0 0 12px rgba(232,41,28,0.6);
}
.timeline-item b{display:block; color:var(--amber); font-family:var(--font-display); letter-spacing:0.04em; margin-bottom:6px;}
.timeline-item p{color:var(--muted); max-width:560px;}

@media (max-width:900px){
  .service-detail, .clientes .client-cards, .client-cards{grid-template-columns:1fr;}
  .process-steps{grid-template-columns:repeat(2,1fr);}
  .solar-stats{grid-template-columns:1fr;}
}

/* ---------- PAGE HERO WITH VIDEO (ex: Fotovoltaica) ---------- */
.page-hero--video{
  min-height:64vh;
}
.page-hero--video .hero-video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0.5; filter:saturate(1.15) contrast(1.05);
}
.page-hero-overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(10,10,13,0.55) 0%, rgba(10,10,13,0.75) 55%, var(--char) 100%),
    linear-gradient(90deg, rgba(10,10,13,0.6) 0%, transparent 45%);
  z-index:1;
}
.page-hero--video .grid-bg,
.page-hero--video .breadcrumb,
.page-hero--video .eyebrow,
.page-hero--video h1,
.page-hero--video p.lead{
  position:relative; z-index:2;
}