/* NEXO brand finishes — layered after the original Webgen template. */
:root {
  --theme: #E3FF04;
  --theme2: #E3FF04;
  --nexo-green: #E3FF04;
}
html { scroll-behavior: smooth; }
#inicio, #sobre, #servicos, #projetos, #nexo-ia, #contato { scroll-margin-top: 90px; }

body { font-family: "Inter", Arial, sans-serif; }
h1, h2, h3, h4, h5, h6, span { font-family: "Inter", Arial, sans-serif; }

/* The navigation must be green both initially and after becoming sticky. */
.header-sectionv2,
.header-sectionv2.header-fixed {
  background-color: var(--nexo-green) !important;
  background-image: none !important;
}
.header-sectionv2 .navbar-toggle-item { background-color: transparent; }
.header-sectionv2 .custom-nav .contact-text,
.header-sectionv2 .search-shopcart a,
.header-sectionv2 .search-shopcart i,
.header-sectionv2 .search-trigger,
.header-sectionv2 .remove-clickbg-adding i {
  color: #101010 !important;
}
.header-sectionv2 .custom-nav .contact-text:hover,
.header-sectionv2 .custom-nav .contact-text:focus-visible,
.header-sectionv2 .search-shopcart a:hover {
  color: #101010 !important;
  opacity: .78;
}
.header-sectionv2 .navbar-toggle-btn span { background-color: #101010 !important; }
.header-section .brand-logo img { max-width: 180px; }
.header-section .custom-nav { gap: 16px !important; }

/* Inter restores the straight, geometric template look: no decorative Chewy
   letters, which also caused the hero text to collide with the stars. */
.hero-section-version2 .hero-v2-content {
  position: relative;
  z-index: 2;
  gap: 20px;
}
.hero-section-version2 .hero-v2-content h1 {
  min-width: 0;
  max-width: 100%;
  flex: 1 1 auto;
  font-family: "Inter", Arial, sans-serif !important;
}
.hero-section-version2 .hero-v2-content h1 span {
  font-family: "Inter", Arial, sans-serif !important;
  font-weight: 800;
  line-height: 1.08 !important;
  letter-spacing: -.048em;
}
.hero-section-version2 .hero-v2-content h1 > .black-clr { display: block; }
.hero-section-version2 .hero-v2-content h1 .text-adjust {
  display: inline-flex !important;
  align-items: center;
  gap: clamp(8px, 2vw, 30px);
  max-width: 100%;
  margin-top: clamp(8px, 1.5vw, 22px);
  white-space: nowrap;
}
.hero-section-version2 .hero-v2-content h1 .text-adjust img:not(.soft-star1) {
  width: clamp(24px, 6vw, 75px);
  height: auto;
  flex: 0 0 auto;
}
/* Keep the first star in the title's flex row as a separate item.
   Absolute positioning previously laid it on top of/behind the lettering. */
.hero-section-version2 .hero-v2-content h1 .text-adjust .soft-star1 {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  display: block;
  width: clamp(18px, 2.5vw, 36px) !important;
  height: auto !important;
  margin: 0;
  flex: 0 0 auto;
  object-fit: contain;
  pointer-events: none;
}
/* The second star sits in the open band ABOVE the headline, not over words. */
.hero-section-version2 > .soft-star2 {
  position: absolute !important;
  left: auto !important;
  right: clamp(25px, 6vw, 110px) !important;
  top: clamp(98px, 8.5vw, 140px) !important;
  width: 34px;
  height: 34px;
  object-fit: contain;
  z-index: 1;
  pointer-events: none;
}

a:focus-visible, button:focus-visible {
  outline: 3px solid var(--nexo-green);
  outline-offset: 3px;
}
@media (max-width: 1199px) {
  .hero-section-version2 .hero-v2-content h1 .text-adjust { gap: 18px; }
}
@media (max-width: 991px) {
  .header-sectionv2 .navbar-toggle-item { background: var(--nexo-green) !important; }
  .hero-section-version2 .hero-v2-content { flex-wrap: wrap; }
  .hero-section-version2 .hero-v2-content h1 { flex-basis: 100%; }
  .hero-section-version2 .hero-v2-content h1 span { font-size: clamp(42px, 5.6vw, 56px); }
  .hero-section-version2 > .soft-star2 { display: none !important; }
}
@media (max-width: 767px) {
  .hero-section-version2 .hero-v2-content h1 span { font-size: clamp(35px, 6.2vw, 48px); }
}
@media (max-width: 575px) {
  .hero-section-version2 .hero-v2-content h1 span { font-size: clamp(28px, 6.4vw, 36px); }
  .hero-section-version2 .hero-v2-content h1 .text-adjust { gap: 10px; }
  .hero-section-version2 .hero-v2-content h1 .text-adjust img:not(.soft-star1) { width: 28px; }
  .hero-section-version2 .hero-v2-content h1 .text-adjust .soft-star1 { width: 19px !important; }
}
@media (max-width: 400px) {
  .hero-section-version2 .hero-v2-content h1 span { font-size: clamp(24px, 6.8vw, 28px); }
  .hero-section-version2 .hero-v2-content h1 .text-adjust { gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    transition-duration: .001ms !important;
  }
}


/* NEXO sponsor ribbon: same transparent white logo throughout the original
   Swiper carousel. Deliberately decorative — never implies third-party clients. */
.sponsor-wrap .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}
.sponsor-wrap .brand-image.nexo-brand,
.sponsor-wrap .swiper-slide.swiper-slide-active .brand-image.nexo-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 88px;
  opacity: .36;
  filter: none !important;
  transform: none;
  transition: opacity .35s ease, transform .35s ease;
  cursor: default;
}
.sponsor-wrap .brand-image.nexo-brand img {
  display: block;
  width: min(100%, 175px);
  max-width: 175px;
  height: auto;
  object-fit: contain;
  filter: none !important;
}
.sponsor-wrap .brand-image.nexo-brand:hover,
.sponsor-wrap .swiper-slide.swiper-slide-active .brand-image.nexo-brand:hover {
  opacity: .85;
  transform: translateY(-2px);
}
@media (max-width: 575px) {
  .sponsor-wrap .brand-image.nexo-brand,
  .sponsor-wrap .swiper-slide.swiper-slide-active .brand-image.nexo-brand {
    min-height: 64px;
  }
  .sponsor-wrap .brand-image.nexo-brand img {
    width: min(100%, 145px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .sponsor-wrap .brand-image.nexo-brand {
    transition: none;
  }
}


/* Retrato NEXO: somente a fotografia original. Nenhum adorno ou sobreposição.
   Centraliza pelo mesmo eixo do container, inclusive em celulares estreitos. */
#sobre .row > .col-lg-6:first-child {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  min-width: 0;
}
#sobre .nexo-about-photo-frame {
  display: block;
  width: 100%;
  max-width: 520px;
  min-width: 0;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  border-radius: 12px;
}
#sobre .nexo-about-photo {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center;
  border-radius: inherit;
}
@media (max-width: 767px) {
  #sobre .row > .col-lg-6:first-child {
    width: 100%;
    padding-left: 12px;
    padding-right: 12px;
  }
  #sobre .nexo-about-photo-frame {
    width: 100%;
    max-width: 520px;
    margin-inline: auto;
  }
}
