:root {
  --navy: #061a3a;
  --green: #0b4f9c;
  --lime: #ff7900;
  --ink: #101d35;
  --muted: #657086;
  --soft: #f4f6fa;
  --line: #dfe4ed;
  --shadow: 0 18px 50px rgba(6, 26, 58, .12);
}

.header,
.header:has(+ main .product-page),
.header:has(+ main .cart-page) {
  background: rgba(5, 20, 49, .94);
  border-bottom-color: rgba(255, 121, 0, .22);
}

.brand-logo { display: block; width: 155px; height: 54px; flex: 0 0 auto; overflow: hidden; }
.brand-logo img { display: block; width: 100%; height: auto; transform: translateY(-34%); }
.footer-brand { display: block; width: 245px; height: 92px; max-width: 100%; overflow: hidden; }
.footer-brand img { display: block; width: 100%; height: auto; transform: translateY(-34%); }

.cart-count,
.btn.primary,
.new-badge,
.success > div { background: linear-gradient(135deg, #ffb000, #ff5a00); color: #061a3a; }
.add-cart { background: var(--navy); color: #ff8a00; }
.eyebrow { color: #ff9a1f; }
.eyebrow.dark,
.category,
.section-link,
.filter-title button,
.help-card a,
.continue { color: #e85f00; }

.hero { width: 100%; height: auto; min-height: 0; aspect-ratio: 2 / 1; padding: 0; background: var(--navy); }
.hero-photo { background: none; overflow: hidden; }
.hero-slide { position: absolute; inset: 0; opacity: 0; transform: scale(1.018); transition: opacity .55s ease, transform 6s ease; background-color: var(--navy); background-position: center; background-size: contain; background-repeat: no-repeat; }
.hero-slide.active { opacity: 1; transform: scale(1); }
.slide-eleva-1 { background-image: url('../images/hero-modulos-solares-v4.png'); }
.slide-eleva-2 { background-image: url('../images/hero-inversores-solares-v4.png'); }
.slide-eleva-3 { background-image: url('../images/hero-acessorios-estrutura-v4.png'); }
.slide-eleva-4 { background-image: url('../images/hero-armazenamento-v4.png'); }
.slide-eleva-5 { background-image: url('../images/hero-mobilidade-eletrica-v4.png'); }
.slide-eleva-6 { background-image: url('../images/hero-parcelamento-21x-v4.png'); }
.slide-eleva-7 { background-image: url('../images/hero-presenca-sergipe-v4.png'); }
.hero-carousel-controls { position: absolute; z-index: 3; right: max(20px, calc((100vw - 1160px) / 2)); bottom: 28px; display: flex; align-items: center; gap: 13px; }
.hero-arrow { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; background: rgba(6,26,58,.45); color: #fff; font-size: 25px; line-height: 1; cursor: pointer; backdrop-filter: blur(8px); transition: .2s; }
.hero-arrow:hover { color: #ff8a00; border-color: #ff8a00; background: rgba(6,26,58,.8); }
.hero-dots { display: flex; align-items: center; gap: 7px; }
.hero-dots button { width: 7px; height: 7px; padding: 0; border: 0; border-radius: 20px; background: rgba(255,255,255,.5); cursor: pointer; transition: .3s; }
.hero-dots button.active { width: 25px; background: #ff7900; }
.hero h1 em,
.proof strong { color: #ff8a00; }
.hero p { color: #c5cee0; }
.proof div { border-left-color: rgba(255, 121, 0, .35); }
.proof span { color: #9facbf; }
.float-card small,
.availability,
.coupon-box p.valid,
.summary .discount-row { color: #db5b00; }

.product-card:hover { box-shadow: 0 18px 45px rgba(6, 26, 58, .14); }
.badge { background: var(--navy); }
.best-sellers { background: linear-gradient(180deg, #fff 0%, #f5f7fb 100%); }
.rated-products { background: #fff; }
.rated-products .product-card { border-color: #f0d7bb; }
.new-products { background: linear-gradient(135deg, #041431, #0b2f66); }
.new-products .section-head p { color: #aebbd2; }
.new-products .mobile-catalog-link .btn { background: linear-gradient(135deg, #ffb000, #ff5a00); }
.light-link { color: #ff9a1f; }

.catalog-hero { background: linear-gradient(110deg, #041431, #0b3470); }
.catalog-hero h1 em { color: #ff8500; }
.catalog-hero p { color: #bdc8dc; }
.help-card,
.coupon-box button { background: var(--navy); }
.help-card > span { display: block; width: 58px; height: 58px; font-size: 0; background: url('../brand/simbolo-eleva.png') center/contain no-repeat; filter: drop-shadow(0 6px 10px rgba(255, 121, 0, .22)); }
.filter-group input { accent-color: #ff7900; }

.solutions-section .steps { background: #dfe4ed; border-color: #dfe4ed; }
.solutions-section .steps > div:hover { background: #fff8ef; }
.solutions-section .steps b { color: #e85f00; }
.banner { background: #fff1df; }

footer { background: #030f27; }
.footer-grid p { color: #a8b3c7; }
.copyright { border-top-color: #1c3157; color: #7888a4; }
.toast { background: var(--navy); border: 1px solid rgba(255, 121, 0, .3); }

/* Mantem os links do menu alinhados como no cabecalho do blog. */
@media (min-width: 851px) {
  .public-layout .header > .nav {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0;
  }
  .public-layout .header .menu {
    width: 100%;
    margin: 0;
    padding-left: clamp(22px, 4vw, 56px);
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
  }
  .public-layout .header .menu a {
    display: inline-flex;
    min-height: 38px;
    flex: 0 0 auto;
    align-items: center;
    padding: 10px 2px;
    white-space: nowrap;
  }
}

@media (max-width: 850px) {
  .brand-logo { width: 132px; height: 50px; }
  .menu { border-top: 3px solid #ff7900; }
  .hero-slide { background-position: 62% center; }
  .hero-carousel-controls { right: 20px; bottom: 20px; }
}

@media (max-width: 560px) {
  .brand-logo { width: 118px; height: 47px; }
  .footer-brand { width: 210px; }
  .hero-slide { background-position: 68% center; }
  .hero-carousel-controls { left: 14px; right: auto; bottom: 17px; }
  .hero-arrow { width: 34px; height: 34px; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-slide { transition: opacity .2s ease; transform: none; }
}