/* Base */
:root {
  /* Palette */
  --graphite: #2B2B2B;  /* fundo principal/cabeçalho */
  --steel:    #4A4A4A;  /* conteúdo/menus/divisores */
  --gray:     #707070;  /* texto secundário/ícones */
  --light:    #B8B8B8;  /* fundo de cards/hover leve */
  --ice:      #F4F4F4;  /* fundo principal internas */

  /* Theme accents (mantemos verde como destaque de ação) */
  --bs-primary: #2fa94f;
  --bs-primary-rgb: 47,169,79;
  --bs-link-color: var(--bs-primary);
  --bs-link-hover-color: #248a40;

  /* Gradients com leve acento */
  --brand-gradient: radial-gradient(1200px 600px at 10% 10%, rgba(47,169,79,0.18), rgba(47,169,79,0) 60%),
                    radial-gradient(1000px 500px at 90% 20%, rgba(74,74,74,0.25), rgba(74,74,74,0) 60%);
  
  /* CTA color */
  --cta: #F2CB05;
}

html { scroll-behavior: smooth; }
body { font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; background: var(--ice); color: #1b1b1b; }

.fw-extrabold { font-weight: 800; }

/* Effects */
.glass { backdrop-filter: saturate(160%) blur(10px); background: rgba(43, 43, 43, 0.62)!important; border-bottom: 1px solid rgba(255,255,255,.06); transition: background .25s ease, padding .25s ease; }
.glass.scrolled { background: rgba(43, 43, 43, 0.9)!important; }
.hover-lift { transition: transform .25s ease, box-shadow .25s ease; }
.hover-lift:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(0,0,0,.08)!important; }
.icon-round { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 16px; font-size: 1.8rem; margin-left: auto; margin-right: auto; }
.feature-box { border-radius: 16px; background: #fff; border: 1px solid rgba(0,0,0,.04); }
.sector-tile { background: #fff; border: 1px solid rgba(0,0,0,.06); padding: 18px; border-radius: 12px; text-align: center; font-weight: 600; box-shadow: 0 4px 14px rgba(0,0,0,.04); }
.sector-tile:hover { background: #fff; border-color: var(--light); }
.sector-tile:hover { box-shadow: 0 10px 24px rgba(0,0,0,.06); }

/* Hero */
.hero-section { min-height: 92vh; background: linear-gradient(180deg, #2B2B2B 0%, #4A4A4A 100%); position: relative; }
.hero-section .grad-overlay { position: absolute; inset: 0; background-image: var(--brand-gradient); pointer-events: none; }
.hero-visual { width: 340px; height: 340px; border-radius: 32px; background: conic-gradient(from 180deg at 50% 50%, #2fa94f, #6fb550, #2fa94f);
  box-shadow: inset 0 0 120px rgba(255,255,255,.06), 0 30px 80px rgba(0,0,0,.25); animation: rotate 12s linear infinite; }

/* Hero interactive icons */
.hero-icons { position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none; }
.hero-icon { position: absolute; width: 56px; height: 56px; border-radius: 14px; border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06); color: #fff; display: grid; place-items: center; font-size: 1.6rem; box-shadow: 0 10px 24px rgba(0,0,0,.25);
  transition: transform .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease; pointer-events: auto; }
.hero-icon:hover { transform: translateY(-4px) scale(1.04); background: rgba(242,203,5,.25); border-color: rgba(242,203,5,.7); box-shadow: 0 18px 36px rgba(0,0,0,.35); }
.hero-icon:nth-child(1) { top: 14%; left: 16%; }
.hero-icon:nth-child(2) { top: 22%; right: 12%; }
.hero-icon:nth-child(3) { bottom: 16%; left: 22%; }
.hero-icon:nth-child(4) { bottom: 20%; right: 18%; }
.hero-icon:nth-child(5) { top: 46%; left: 48%; }

@keyframes rotate { to { transform: rotate(360deg); } }
.animate-float { animation: float 6s ease-in-out infinite; }
@keyframes float { 0% { transform: translateY(0) } 50% { transform: translateY(-12px) } 100% { transform: translateY(0) } }

/* CTA */
.cta-section { background: var(--graphite); }
.cta-section .grad-overlay { position: absolute; inset: 0; background-image: radial-gradient(1000px 500px at 50% 50%, rgba(74,74,74,.4), rgba(47,169,79,0.22) 60%); pointer-events: none; }
.cta-decor { background-image: radial-gradient(700px 260px at 10% 50%, rgba(242,203,5,.18), rgba(242,203,5,0) 60%), radial-gradient(700px 260px at 90% 50%, rgba(47,169,79,.22), rgba(47,169,79,0) 60%); }

.btn-ripple { position: relative; overflow: hidden; }
.btn-ripple::after { content: ""; position: absolute; inset: 0; background: radial-gradient(120px 120px at var(--x) var(--y), rgba(255,255,255,.25), transparent 60%); transform: scale(0); transition: transform .35s ease; }
.btn-ripple:active::after { transform: scale(1); }

.badge-card { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 14px; padding: 10px 12px; text-align: center; min-width: 92px; }
.badge-num { font-weight: 800; color: #fff; letter-spacing: .5px; }
.badge-label { color: rgba(255,255,255,.7); font-size: .8rem; }

/* Reveal on scroll */
.reveal { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.reveal.show { opacity: 1; transform: none; }
.animate-up { opacity: 0; transform: translateY(14px); animation: none; }
.animate-up.show { opacity: 1; transform: none; transition: opacity .7s ease, transform .7s ease; }

/* Back to top */
.back-to-top { position: fixed; right: 16px; bottom: 16px; opacity: 0; visibility: hidden; transform: translateY(12px); transition: all .3s ease; border-radius: 50%; width: 48px; height: 48px; display: grid; place-items: center; z-index: 1080; }
.back-to-top.show { opacity: 1; visibility: visible; transform: none; }

/* WhatsApp Floating */
.whatsapp-fab { position: fixed; right: 16px; bottom: 76px; width: 56px; height: 56px; display: grid; place-items: center; border-radius: 50%; background: #25D366; color: #0b0f1a; box-shadow: 0 8px 22px rgba(0,0,0,.25); z-index: 1080; transition: transform .2s ease, box-shadow .2s ease; }
.whatsapp-fab:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(0,0,0,.3); color: #0b0f1a; }
.whatsapp-fab i { font-size: 1.6rem; }

@media (max-width: 420px) {
  .whatsapp-fab { display: none; }
}

@media (max-width: 576px) {
  .whatsapp-fab { bottom: 96px; }
  .back-to-top { bottom: 24px; }
}

/* Utilities */
section { scroll-margin-top: 84px; }
.card, .sector-tile { border-radius: 16px; }

/* Neutrals application */
.text-muted { color: var(--gray)!important; }
.bg-light { background-color: var(--ice)!important; }
hr, .border-top { border-top-color: var(--steel)!important; }
.border { border-color: rgba(0,0,0,.08)!important; }
.navbar.bg-dark { background-color: var(--graphite)!important; }
.nav-logo { height: 32px; width: auto; filter: drop-shadow(0 2px 4px rgba(0,0,0,.12)); }

/* Navbar links: estados suaves */
.navbar .nav-link { color: #e7e7e7; opacity: .9; transition: color .2s ease, opacity .2s ease; }
.navbar .nav-link:hover, .navbar .nav-link:focus { color: #fff; opacity: 1; }
.navbar .nav-link { position: relative; }
.navbar .nav-link::after { content: ""; position: absolute; left: 12%; right: 12%; bottom: -4px; height: 3px; background: var(--cta); transform: scaleX(0); transform-origin: center; transition: transform .25s ease; border-radius: 3px; }
.navbar .nav-link:hover::after, .navbar .nav-link:focus::after { transform: scaleX(.85); }
.navbar .nav-link.active { color: #fff; opacity: 1; }
.navbar .nav-link.active::after { transform: scaleX(1); }
/* Não aplicar sublinhado no CTA (botão) */
.navbar .btn::after { display: none !important; content: none !important; }
.navbar .btn.btn-primary.btn-sm { border-radius: 999px; font-weight: 600; }

/* Compact navbar when scrolled or on small devices */
.navbar.scrolled { padding-top: .25rem; padding-bottom: .25rem; }
.navbar.scrolled .nav-logo { height: 28px; }

@media (max-width: 576px) {
  .navbar { padding-top: .35rem; padding-bottom: .35rem; }
  .nav-logo { height: 28px; }
}

/* CTA buttons */
.btn-primary { background-color: var(--cta)!important; border-color: var(--cta)!important; color: #2B2B2B!important; }
.btn-primary:hover, .btn-primary:focus { background-color: #d9b804!important; border-color: #d9b804!important; color: #1b1b1b!important; }
.btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle { background-color: #c9ab03!important; border-color: #c9ab03!important; color: #1b1b1b!important; }
.btn-primary.disabled, .btn-primary:disabled { background-color: #f2d53a!important; border-color: #f2d53a!important; color: #3a3a3a!important; }

/* Cards: destacar ícone e borda no hover com CTA */
.card .icon-round { background: rgba(0,0,0,.025); color: var(--bs-primary); }
.card:hover .icon-round { background: rgba(242,203,5,.22); color: #2B2B2B; }
.card:hover { border-color: rgba(242,203,5,.55)!important; box-shadow: 0 10px 28px rgba(0,0,0,.08)!important; }

/* Products grid filters */
.filters .btn { border-radius: 999px; }
.product-card { transition: transform .2s ease, box-shadow .2s ease; }
.product-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(0,0,0,.08)!important; }

/* Links: sublinhado com CTA em hover/focus */
a:hover, a:focus { text-decoration-color: var(--cta); text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid rgba(242,203,5,.7); outline-offset: 2px; }

/* Footer */
.site-footer { background: #fff; color: #1b1b1b; }
.site-footer .footer-logo { height: 36px; width: auto; filter: drop-shadow(0 2px 6px rgba(0,0,0,.08)); }
.site-footer .text-footer { color: var(--gray); }
.footer-links li { margin-bottom: .5rem; }
.footer-links a { color: #1b1b1b; text-decoration: none; }
.footer-links a:hover { color: #000; text-decoration: underline; text-decoration-color: var(--cta); }
.footer-bar { background: var(--ice); }
.social { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 8px; color: #1b1b1b; background: #fff; border: 1px solid rgba(0,0,0,.06); transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.social:hover { transform: translateY(-2px); color: #1b1b1b; background: rgba(242,203,5,.22); border-color: rgba(242,203,5,.6); }

/* Newsletter */
.newsletter { background: #fff; }
.newsletter-form .form-control { min-width: 260px; }

/* Quick access */
.quick-access { border-bottom: 1px solid rgba(0,0,0,.06); }
.qa-item { display: grid; grid-template-columns: 48px 1fr 28px; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid rgba(0,0,0,.06); border-radius: 14px; background: #fff; text-decoration: none; color: inherit; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease; position: relative; overflow: hidden; }
.qa-item:hover { transform: translateY(-2px); border-color: rgba(242,203,5,.55); box-shadow: 0 10px 24px rgba(0,0,0,.06); background: #fff; }
.qa-icon { width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; background: rgba(0,0,0,.03); color: var(--bs-primary); font-size: 1.4rem; transition: box-shadow .2s ease, background .2s ease, color .2s ease; }
.qa-item:hover .qa-icon { box-shadow: 0 0 0 6px rgba(242,203,5,.14) inset, 0 0 0 0 rgba(0,0,0,0); background: rgba(242,203,5,.12); color: #1b1b1b; }
.qa-title { font-weight: 700; }
.qa-sub { color: var(--gray); font-size: .9rem; }
.qa-arrow { color: var(--gray); font-size: 1.6rem; transition: transform .2s ease; }
.qa-item:hover .qa-arrow { transform: translateX(4px); color: #1b1b1b; }

/* Ripple effect */
.qa-item .ripple { position: absolute; border-radius: 50%; transform: scale(0); animation: qa-ripple .6s ease-out; background: rgba(242,203,5,.35); pointer-events: none; }
@keyframes qa-ripple { to { transform: scale(8); opacity: 0; } }

/* Tech badges and decorative background */
.tech-badges .chip { background: #fff; border: 1px solid rgba(0,0,0,.06); padding: 8px 12px; border-radius: 999px; font-weight: 600; color: #1b1b1b; }
.tech-badges .chip i { color: var(--bs-primary); }
.tech-badges .chip:hover { background: rgba(242,203,5,.2); border-color: rgba(242,203,5,.6); }

.footer-decor { position: absolute; inset: -24px 0 auto 0; height: 80px; background:
  radial-gradient(600px 200px at 10% 50%, rgba(47,169,79,.18), rgba(47,169,79,0) 60%),
  radial-gradient(600px 200px at 90% 50%, rgba(242,203,5,.28), rgba(242,203,5,0) 60%),
  repeating-linear-gradient(90deg, rgba(0,0,0,.03) 0, rgba(0,0,0,.03) 1px, transparent 1px, transparent 6px);
  pointer-events: none; border-radius: 0 0 24px 24px; }

/* About / Sobre */
#sobre .chip { background: #fff; border: 1px solid rgba(0,0,0,.06); padding: 8px 12px; border-radius: 999px; font-weight: 600; color: #1b1b1b; }
.kw { color: #1b1b1b; background: rgba(242,203,5,.12); padding: 0 4px; border-radius: 6px; cursor: help; text-decoration: none; transition: background .2s ease, box-shadow .2s ease; }
.kw:hover, .kw:focus { background: rgba(242,203,5,.18); box-shadow: 0 1px 0 rgba(0,0,0,.04) inset; outline: none; }
.kw strong { font-weight: 700; text-decoration: none; }
.about-overlay { position: absolute; inset: 0; background: radial-gradient(900px 400px at 0% 0%, rgba(242,203,5,.12), rgba(242,203,5,0) 60%), radial-gradient(900px 400px at 100% 100%, rgba(47,169,79,.12), rgba(47,169,79,0) 60%); pointer-events: none; }
.about-visual { min-height: 360px; }
.about-card { position: absolute; top: 10%; left: 8%; border-radius: 16px; backdrop-filter: blur(4px); }
.about-card.second { top: auto; bottom: 10%; right: 8%; left: auto; }
.about-ring { position: absolute; border: 1px dashed rgba(0,0,0,.1); border-radius: 50%; }
.about-ring-1 { width: 260px; height: 260px; top: 12%; left: 14%; }
.about-ring-2 { width: 180px; height: 180px; bottom: 12%; right: 12%; }

/* Contact modern cards */
.contact-actions .contact-card { width: 100%; display: grid; grid-template-columns: 44px 1fr; gap: 12px; align-items: center; padding: 14px 16px; border: 1px solid rgba(0,0,0,.06); border-radius: 14px; background: #fff; color: inherit; text-decoration: none; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.contact-actions .contact-card:hover { transform: translateY(-2px); border-color: rgba(242,203,5,.55); box-shadow: 0 10px 24px rgba(0,0,0,.06); }
.contact-actions .contact-card i { font-size: 1.4rem; color: var(--bs-primary); background: rgba(0,0,0,.03); width: 44px; height: 44px; display: grid; place-items: center; border-radius: 10px; }
.contact-actions .contact-card .label { font-weight: 700; }
.contact-actions .contact-card .value { color: var(--gray); font-size: .92rem; }
.contact-actions .copy-address { background: #fff; border: 1px solid rgba(0,0,0,.06); cursor: pointer; }

/* Section titles (h2) modern style */
section h2.fw-bold { position: relative; color: #1b1b1b; letter-spacing: .2px; }
section.bg-light h2.fw-bold, section.text-white h2.fw-bold { color: inherit; }
section h2.fw-bold::after { content: ""; position: absolute; left: 0; bottom: -8px; height: 3px; width: 96px; background: linear-gradient(90deg, var(--cta), rgba(242,203,5,0)); border-radius: 3px; transform-origin: left; transform: scaleX(0); animation: underline-in .6s ease forwards .1s; }
@keyframes underline-in { to { transform: scaleX(1); } }


