:root {
  --linha: #e2e7ef;
  --verdeTop5: #075d56;
}

html { min-width: 320px; min-height: 100vh;}
body { height: auto; min-height: 100vh;  letter-spacing: 0;}

a {  color: inherit;  text-decoration: none;}
a,button { -webkit-tap-highlight-color: transparent;}
button { font: inherit; cursor: pointer;}
a:focus-visible,button:focus-visible { outline: 2px solid var(--laranja); outline-offset: 4px;}
img,.icon { display: block;}
svg {fill: none; stroke: currentColor;stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.3;}
.icon { flex: 0 0 auto; width: 1em; height: 1em; object-fit: contain; filter: brightness(0) saturate(100%) invert(22%) sepia(42%) saturate(1743%) hue-rotate(202deg) brightness(92%) contrast(88%);}

.site-shell { width: min(100%, 1760px); min-height: 100vh; margin: 0 auto; display: flex; flex-direction: column; background: var(--corFundo); box-shadow: 0 0 0 1px var(--linha); overflow: hidden;}
.site-shell > main { flex: 1 0 auto;}
.site-header,.footer-strip { flex: 0 0 auto;}
.site-header { position: static; top: auto; width: auto; height: 130px; background: var(--corFundo); font-size: inherit; font-weight: inherit;}
.header-main { height: 130px; min-height: 0; padding: 20px 40px; gap: 40px;}
.logo-link { flex: 0 0 200px;  width: 200px;}
.logo-link img { width: 100%; height: auto; }
.logo-link:hover img { transform: translateY(-1px);}
.header-right { min-width: 0; gap: 25px; padding-top: 4px;}

.contact-strip { margin: 0px 5px 0; padding: 0; list-style: none; gap: clamp(18px, 3.6vw, 56px); color: var(--azul); font-size: 10pt; font-weight: 700; white-space: nowrap;}
.contact-strip .icon { width: 17px; height: 17px;}

.desktop-nav { gap: clamp(18px, 2.15vw, 36px); font-size: 10pt; font-weight: 900; letter-spacing: 0.5px; text-transform: uppercase;}
.desktop-nav a { position: relative; min-height: 34px; color: var(--corTxt); font-family: 'Roboto', sans-serif;}
.desktop-nav a > span {  display: block;}
.desktop-nav a.active {  color: var(--laranja);}
.desktop-nav a:hover { color: var(--laranja);}
.desktop-nav a:hover > span { transform: translateY(-7px);}
.desktop-nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -7px; height: 3px; background: var(--laranja); transform: scaleX(0); transform-origin: left center; opacity: 0;}
.desktop-nav a:hover::after,.desktop-nav a.active::after {  transform: scaleX(1);  opacity: 1;}
.desktop-nav .quote-link { min-height: 38px; padding: 0 18px; border-radius: 4px; color: var(--corFundo); background: var(--laranja); box-shadow: 1px 2px 4px rgba(0, 0, 0, .2);}
.desktop-nav .quote-link:hover { color: var(--corFundo); transform: translateY(-3px); box-shadow: 3px 5px 15px rgba(100, 9, 10, .3);}
.desktop-nav .quote-link:hover > span { transform: none;}
.desktop-nav .quote-link::after { display: none;}

.menu-button {  display: none;}
.menu-button:hover { transform: translateY(-1px); background: rgba(0, 40, 130, .06);}
.menu-button i {font-size: 20pt}

.hero {
  position: relative; min-height: 420px; min-height: clamp(420px, calc(100vh - 298px), 465px); display: grid; grid-template-columns: 1fr minmax(300px, 420px); align-items: center;
  padding: 45px 80px 60px;
  isolation: isolate; overflow: hidden; background: var(--azul) url("../imgs/hero-industrial.jpg") center / cover no-repeat;
}
.hero::before { content: ""; position: absolute; inset: 0 auto 0 0; z-index: -1; width: 60%; background: linear-gradient(90deg, rgba(0, 0, 30, .9) 0%, rgba(0, 39, 88, .9) 50%, rgba(0, 35, 78, 0) 100%);}
.hero-content {  color: var(--corFundo);}
.eyebrow { margin: 0 0 16px; color: var(--laranja); font-size: 14pt; font-weight: 900; letter-spacing: 0.5px; text-transform: uppercase; font-family: 'Roboto', sans-serif;}
.hero h1 { margin: 0; font-size: clamp(38px, 3.3vw, 52px); line-height: 1.14; font-weight: 900; letter-spacing: 0.5px; text-transform: uppercase;}
.hero h1 span {  display: block;  font-weight: 500;}

.orange-dot { display: inline-block !important; width: 10px; height: 10px; color: var(--laranja); background: var(--laranja); margin: -1px 5px; }

.title-rule,.section-rule { display: block; width: 82px; height: 3px; background: var(--laranja);}
.title-rule {  margin: 28px 0 24px;}

.hero-copy { max-width: 430px; margin: 0; color: rgba(255, 255, 255, .84); font-size: 13pt; line-height: 1.55; font-weight: 500; font-family: 'Roboto', sans-serif;}
.hero-actions { gap: 26px; margin-top: 30px;}

.button { min-height: 43px; padding: 0 23px; border-radius: 5px; font-size: 10pt; font-weight: 900; letter-spacing: 0.05px; text-transform: uppercase;  font-family: 'Roboto', sans-serif;}

.button.primary { min-width: 214px;color: var(--corFundo); background: var(--laranja); box-shadow: 0 10px 22px rgba(230, 100, 0, .28);}
.button.primary span {  margin-left: 10px;  font-size: 17px;}
.button.secondary { min-width: 238px; color: var(--corFundo); border: 2px solid rgba(255, 255, 255, .52);}

.button:hover { transform: translateY(-2px);}
.button.primary:hover { background: var(--laranja); box-shadow: 0 14px 28px rgba(230, 100, 0, .34);}
.button.primary:hover span { transform: translateX(4px);}
.button.secondary:hover { border-color: rgba(255, 255, 255, .86); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18), 0 12px 24px rgba(0, 0, 0, .18);}

.score-panel {
  justify-self: center;
  align-self: end;
  width: min(100%, 300px);
  display: grid;
  justify-items: center;
  gap: 0;
  color: var(--corFundo);
  position: relative;
}

.score-badge { position: relative; z-index: 2; width: 205px; height: auto; filter: drop-shadow(0 12px 22px rgba(0, 0, 0, .24));}

.score-text {
  position: relative;
  z-index: 1;
  width: 250px;
  min-height: 122px;
  margin-top: -42px;
  padding: 25px 16px 15px;
  display: grid;
  align-content: center;
  text-align: center;
  border: 2px solid rgba(33, 198, 176, .5);
  border-radius: 8px;
  background: var(--verdeTop5);
  box-shadow: 0 12px 26px rgba(0, 0, 0, .28);
}

.score-text strong {  font-size: 14px;  line-height: 1.25; letter-spacing: 0.5px; font-family: 'Roboto', sans-serif;}
.score-text span {  margin-top: 8px;  color: rgba(255, 255, 255, .82);  font-size: 12px;}

.service-strip {
  display: grid;
  grid-template-columns: repeat(5, 1fr) minmax(250px, 330px);
  color: var(--corFundo);
  background: var(--azulEscuro);
}

.service-card {
  min-height: 168px;
  padding: 24px 20px 20px;
  display: grid;
  justify-items: center;
  align-content: start;
  text-align: center;
  border-right: 2px solid rgba(255, 255, 255, .28);
  }

.service-card:last-child {  border-right: 0;}

.service-strip .icon { width: 48px; height: 48px; margin-bottom: 11px; filter: brightness(0) invert(1) opacity(.78); }

.service-strip h2 { margin: 0;  font-size: 10pt;  line-height: 1.2;  font-weight: 900; letter-spacing: 0.5px;  text-transform: uppercase; font-family: 'Roboto', sans-serif;}
.service-strip p {  margin: 10px 0 0;  color: rgba(255, 255, 255, .74);  font-size: 9pt;  line-height: 1.45;  font-weight: 700;}
.service-card:hover {
  background: linear-gradient(90deg, rgba(0, 35, 78, .9) 0%, rgba(0, 39, 88, .9) 50%, rgba(0, 35, 78, 0) 100%);
  box-shadow: inset 0 8px 0 rgba(230, 100, 0, .9);
    
}

.service-card:hover .icon {  transform: translateY(-3px);  filter: brightness(0) invert(1);}
.quality-card {  position: relative;  align-content: center !important;  justify-items: start !important;  padding: 20px 36px !important;  text-align: left !important;  background: var(--azul);}
.quality-card:hover {background: var(--laranja);}
.quality-card::before {  content: "";  position: absolute;  left: 0;  top: 0;  bottom: 0;  width: 4px;  background: var(--laranja);}
.quality-card .icon {  width: 52px;  height: 52px;  margin: 0 0 10px;}
.quality-card h2 {  font-size: 18px;  line-height: 1.15;}
.quality-card p {  font-size: 10pt;}

.content-grid { padding: 34px 72px 36px; display: grid; grid-template-columns: 1.05fr .95fr; gap: 44px; background: var(--corFundo);}

.materials-panel {  padding-right: 44px;  border-right: 1px solid var(--linha);}

.content-grid h2 { margin: 0; color: var(--corTxt); font-size: 17pt; line-height: 1.2; font-weight: 900; letter-spacing: 0.5px; text-transform: uppercase;}

.section-rule {  width: 42px;  height: 3px;  margin: 10px 0 18px;}
.material-cards {  display: grid;  grid-template-columns: 1fr 1fr;  gap: 18px;}

.material-card {
  min-height: 112px;
  padding: 20px 22px;
  display: grid;
  grid-template-columns: 58px 1fr auto;
  align-items: center;
  gap: 15px;
  border: 1px solid var(--linha);
  border-radius: 7px;
  background: var(--corFundo);
  box-shadow: 0 8px 18px rgba(15, 45, 92, .06);
 }

.material-card .icon {  width: 50px;  height: 50px;}

.material-card.orange .icon { filter: none !important;}

.material-card strong { display: block; color: var(--corTxt); font-size: 15pt; font-weight: 900; letter-spacing: 0.5px; text-transform: uppercase;}
.material-card small { display: block; margin-top: 6px; color: var(--azul); font-size: 10pt; line-height: 1.45; font-weight: 700;}
.material-card b {  display: none;  color: var(--corTxt);  font-size: 34px;  line-height: 1; }
.material-card:hover { transform: translateY(-3px); border-color: rgba(0, 40, 130, .22); box-shadow: 0 16px 34px rgba(15, 45, 92, .14);}
.material-card:hover .icon { transform: scale(1.04);}
.material-card:hover b { color: var(--laranja); transform: translateX(3px);}

.sector-list { width: 100%; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); align-items: start; justify-content: stretch; gap: 16px;}
.sector-list a { min-width: 0; display: grid; justify-items: center; gap: 12px; text-align: center; color: var(--azul);  }
.sector-list .icon {  width: 42px;  height: 42px; }
.sector-list span { max-width: 100%; color: var(--corTxt); font-size: 9pt; font-weight: 900; letter-spacing: 0.5px; text-transform: uppercase; overflow-wrap: break-word; }
.sector-list a:hover { transform: translateY(-3px); color: var(--laranja);}
.sector-list a:hover .icon { transform: scale(1.08); filter: brightness(0) saturate(100%) invert(49%) sepia(98%) saturate(2332%) hue-rotate(354deg) brightness(102%) contrast(102%);}
.sector-list a:hover span { color: var(--laranja);}

.footer-strip {
  min-height: 78px;
  display: grid;
  grid-template-columns: 1.05fr 1.05fr 1.05fr 1.5fr 1.6fr;
  align-items: stretch;
  color: var(--corFundo);
  background: var(--azulEscuro);
}

.footer-strip a {
  min-width: 0;
  padding: 18px 24px;
  flex-flow: row nowrap;
  border-right: 3px solid rgba(230, 100, 0, .65);
  text-align: center;
  }

.footer-strip a:last-child {  border-right: 0;}

.footer-strip .icon {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  filter: brightness(0) invert(1) opacity(.75);
 }

.footer-strip span {
  min-width: 0;
  font-size: 11pt;
  line-height: 1.25;
  font-weight: 900; letter-spacing: 0.5px;
  text-transform: uppercase;  font-family: 'Roboto', sans-serif;
}

.footer-strip a:hover {
  background: var(--laranja);
}

.footer-strip a:hover .icon {
  transform: translateY(-2px);
  filter: brightness(0) invert(1);
}

@media (max-width: 1250px) {
  .header-main { gap: 30px; padding-inline: 32px;  }
  .logo-link { flex-basis: 190px; width: 190px;  }
  .desktop-nav, .contact-strip { gap: 18px; font-size: 10pt;  }
  .hero {  padding-inline: 70px; }
  .content-grid { padding-inline: 54px;}
  .sector-list { gap: 12px;}
  .sector-list .icon { width: 38px; height: 38px;}
  .sector-list span { font-size: 8pt;}
  .footer-strip a { padding: 16px 14px; gap: 8px;}
  .footer-strip .icon { width: 32px; height: 32px;}
  .footer-strip span { font-size: 10pt;}
}

@media (max-width: 1120px) {
  .content-grid { grid-template-columns: 1fr; gap: 30px;}
  .materials-panel { padding-right: 0; padding-bottom: 30px; border-right: 0; border-bottom: 1px solid var(--linha);}
  .sector-list { grid-template-columns: repeat(6, minmax(0, 1fr));}
}

@media (max-width: 1060px) {
  .site-header { height: auto;}
  .header-main { min-height: 126px;padding: 24px 27px 22px; align-items: center; gap: 22px;}
  .logo-link { flex: 0 1 205px; width: 205px; }
  .header-right,.contact-strip,.desktop-nav { display: none; }
  .menu-button{width:50px;height:50px;padding:0;display:grid;align-content:center;border:0;color:var(--azul);background:transparent;}
  .footer-strip a { padding: 13px 8px; gap: 6px;}
  .footer-strip .icon { width: 30px; height: 30px;}
  .footer-strip span { font-size: 9pt; line-height: 1.18;}
}

@media (max-width: 920px) {
  .footer-strip a { display: grid; justify-items: center; align-content: center; gap: 6px; padding: 10px 4px;}
  .footer-strip .icon { width: 28px; height: 28px;}
  .footer-strip span { font-size: 9pt; line-height: 1.15;}
}

@media (max-width: 820px) {
  body {  background: var(--corFundo); }
  .site-shell {  width: 100%; box-shadow: none; }
  .hero { min-height: 610px;min-height: clamp(610px, calc(100vh - 210px), 649px);display: block; padding: 58px 32px 28px; background-position: 64% center; }

  .hero::before { width: 78%; background: linear-gradient(90deg, rgba(0, 31, 69, .98) 0%, rgba(0, 38, 86, .92) 58%, rgba(0, 32, 72, 0) 100%),
      linear-gradient(0deg, rgba(0, 25, 56, .95) 0%, rgba(0, 25, 56, .54) 45%, rgba(0, 25, 56, .16) 100%); }

  .hero-content { max-width: 330px; }
  .eyebrow { margin-bottom: 14px;font-size: 15px; }
  .hero h1 { font-size: 30px;line-height: 1.18; }
  .title-rule {display: none;}
  .hero-copy { margin-top: 18px; max-width: 255px; font-size: 14px;line-height: 1.65;}
  .hero-actions { gap: 10px; margin-top: 21px; }
  .button { min-height: 38px; padding: 0 19px; border-radius: 4px; font-size: 12px;}
  .button.primary { min-width: 178px; }
  .button.secondary { min-width: 170px; border-width: 2px;}
  .button.primary span { margin-left: 8px; font-size: 16px; }
  .score-panel { width: 210px;margin: 24px auto 0; gap: 0; }
  .score-badge { width: 152px;}
  .score-text { width: 200px;  min-height: 94px; padding: 30px 12px 10px; border-radius: 6px; }
  .score-text strong {font-size: 11px; line-height: 1.25;}
  .score-text span { margin-top: 6px; font-size: 10px; }

  .service-strip {grid-template-columns: repeat(5, 1fr);color: var(--corTxt);background: var(--corFundo);border-bottom: 1px solid var(--linha);
    box-shadow: 0 4px 18px rgba(7, 31, 70, .08); }

  .service-card { min-height: 80px; padding: 14px 6px 10px;border-right: 1px solid var(--linha); }
  .service-card:nth-child(5) {border-right: 0; }
  .service-card:nth-child(n+6) { display: none;}
  .service-strip .icon { width: 30px;  height: 30px; margin-bottom: 7px;
    filter: brightness(0) saturate(100%) invert(44%) sepia(18%) saturate(1142%) hue-rotate(185deg) brightness(94%) contrast(90%);
  }
  .service-strip h2 { font-size: 9px;}
  .service-strip p {display: none;}
  .content-grid { padding: 28px 28px 24px; display: block;}
  .materials-panel { padding-right: 0; border-right: 0;}
  .content-grid h2 {font-size: 16px; }
  .section-rule { width: 38px; height: 3px;margin: 9px 0 13px; }
  .material-cards { grid-template-columns: 1fr;  gap: 8px; }
  .material-card { min-height: 63px;  padding: 11px 13px; grid-template-columns: 44px 1fr 16px;  gap: 12px; border-radius: 5px; }
  .material-card .icon { width: 38px; height: 38px; }
  .material-card strong { font-size: 13px; }
  .material-card small { margin-top: 3px; font-size: 10px; line-height: 1.25; }
  .material-card b { display: block; font-size: 26px;}
  .sectors-panel { margin-top: 24px;}
  .sector-list { grid-template-columns: repeat(5, 1fr); gap: 10px; }
  .sector-list a:nth-child(5) { display: none;}
  .sector-list .icon { width: 28px; height: 28px;}
  .sector-list span { font-size: 8px;}
  .footer-strip { min-height: 72px; grid-template-columns: repeat(5, 1fr);}
  .footer-strip a {padding: 10px 4px; border-right: 1px solid rgba(230, 100, 0, .45); }
  .footer-strip .icon { width: 27px; height: 27px;}
  .footer-strip span { font-size: 8px; line-height: 1.15;}
  .footer-strip a:nth-child(4) span { font-size: 0;}
  .footer-strip a:nth-child(4) span::after {content: "Acess\00f3rios"; font-size: 8px; }
  .footer-strip a:nth-child(5) span { font-size: 0;}
  .footer-strip a:nth-child(5) span::after { content: "Fornecimento"; font-size: 8px;}
}

@media (max-width: 380px) {
  .header-main { padding-inline: 22px;}
  .logo-link { flex-basis: 186px; width: 186px;}
  .hero {padding-inline: 27px; }
  .hero-actions { flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after {
    transition-duration: 0ms !important;
    animation-duration: 0ms !important;
  }
}