/* ============================================================
   energia-solar.css — Estilos exclusivos de energia-solar.html
   Ajuste aqui para mudanças visuais específicas desta página.
   ============================================================ */

    /* ── Page Hero ── */
    .page-hero {
      background: linear-gradient(to right, rgba(10,22,40,0.92) 0%, rgba(10,22,40,0.55) 100%),
                  url('https://www.diversitec.com.br/assets/img/banner/08a.jpg') center/cover no-repeat;
      min-height: 380px;
      display: flex;
      align-items: center;
      padding: 100px 0 60px;
    }
    .page-hero h1 { font-size: clamp(28px,4vw,46px); color:#fff; font-weight:700; line-height:1.2; margin-bottom:14px; }
    .page-hero h1 span { color: var(--primary); }
    .page-hero p   { color:rgba(255,255,255,0.78); font-size:15px; line-height:1.8; max-width:560px; margin-bottom:24px; }
    .breadcrumb    { display:flex; align-items:center; gap:8px; font-size:13px; color:rgba(255,255,255,0.55); margin-bottom:20px; }
    .breadcrumb a  { color:rgba(255,255,255,0.55); transition:var(--tr); }
    .breadcrumb a:hover { color:var(--primary); }
    .breadcrumb i  { font-size:10px; }

    /* ── Solar Services detail ── */
    .solar-detail-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 60px;
      align-items: center;
    }
    .solar-detail-grid.reverse { direction: rtl; }
    .solar-detail-grid.reverse > * { direction: ltr; }
    .solar-detail-img { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); }
    .solar-detail-img img { width:100%; display:block; transition: transform 0.5s; }
    .solar-detail-img:hover img { transform: scale(1.04); }
    .solar-detail-body .sec-badge { margin-bottom: 10px; }
    .solar-detail-body h2 { font-size: clamp(22px,3vw,32px); font-weight:700; color:var(--secondary); margin-bottom:14px; line-height:1.3; }
    .solar-detail-body h2 span { color:var(--primary); }
    .solar-detail-body p  { font-size:14px; color:var(--gray); line-height:1.85; margin-bottom:18px; }
    .solar-check-list { display:flex; flex-direction:column; gap:10px; margin-bottom:24px; }
    .solar-check-list li { display:flex; align-items:flex-start; gap:10px; font-size:13px; color:var(--text); }
    .solar-check-list li i { color:var(--primary); margin-top:3px; min-width:16px; }
    .solar-alt { background: var(--light); }

    /* ── Stats bar ── */
    .stats-bar { background: var(--secondary); padding: 50px 0; }
    .stats-bar-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:20px; }
    .stats-bar-item { text-align:center; }
    .stats-bar-item .n { font-size:34px; font-weight:700; color:var(--primary); display:block; line-height:1; margin-bottom:6px; }
    .stats-bar-item .l { font-size:12px; color:rgba(255,255,255,0.7); line-height:1.5; }

    /* ── Process ── */
    .solar-process { background: var(--secondary); }

    /* Grid 2 linhas × 3 colunas — imagens dobradas (176px → 352px) */
    .solar-process .proc-grid {
      grid-template-columns: repeat(3, 1fr);
      gap: 40px 30px;
    }
    .solar-process .proc-icon { width: 352px; height: 352px; max-width: 100%; }
    .solar-process .proc-num  { width: 44px; height: 44px; font-size: 18px; font-weight: 700; top: -23px; right: -15px; }
    .solar-process .proc-item h5 { font-size: 15px; margin-top: -140px; margin-bottom: 40px; }

    /* Tablet (≤ 1024px) — 3 colunas, imagem menor */
    @media(max-width:1024px){
      .solar-process .proc-icon { width: 260px; height: 260px; }
      .solar-process .proc-num  { width: 36px; height: 36px; font-size: 15px; }
    }

    /* Tablet pequeno (≤ 768px) — 2 colunas, imagem adaptada */
    @media(max-width:768px){
      .solar-process .proc-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px 20px;
      }
      .solar-process .proc-icon { width: 100%; height: auto; aspect-ratio: 1; }
      .solar-process .proc-num  { width: 32px; height: 32px; font-size: 14px; top: -15px; right: -10px; }
      .solar-process .proc-item h5 { font-size: 13px; margin-top: -100px; margin-bottom: 30px; }
    }

    /* Mobile (≤ 480px) — 1 coluna, imagem fluida */
    @media(max-width:480px){
      .solar-process .proc-grid {
        grid-template-columns: 1fr;
        gap: 28px;
      }
      .solar-process .proc-icon { width: 80%; height: auto; aspect-ratio: 1; margin: 0 auto 14px; }
    }

    /* ── FAQ solar ── */
    .solar-faq { background: var(--light); }

    @media(max-width:900px){
      .solar-detail-grid { grid-template-columns:1fr; }
      .solar-detail-grid.reverse { direction: ltr; }
    }