/*
  Brand Overrides for Toplax
  - Centralize brand-to-theme mapping here so it’s easy to remove/replace.
  - Adjust variables below to match the logo/brand palette.
*/

:root{
  /* Base brand color comes from header inline var --brand-color */
  /* If the main brand is muito escuro, set a lighter accent here */
  /*--brand-accent: #ff5a4f; !* ajuste aqui para combinar com a 2ª cor do logo *!*/
  --brand-accent: #03680f; /* ajuste aqui para combinar com a 2ª cor do logo */
  --accent-color: var(--brand-accent, var(--brand-color));
  /* Optionally tune primary/secondary based on the logo (update as needed) */
  /* --primary-color: #0F1F3D; */
  /* --secondary-color: #F5F7FB; */
}

/* Buttons */
.btn-default{ background-color: var(--accent-color); }
.btn-default::after{ background: var(--primary-color); }

/* Links/accents */
.section-title h2 span{ color: var(--accent-color); }
.service-item .service-footer a{ background: var(--accent-color); }

/* Stars / rating */
.testimonial-rating i,
.client-testimonial-rating i{ color: var(--accent-color); }

/* Icon colors if using font icons */
.icon-box i{ color: var(--accent-color); }

/* Ensure video background stays behind content */
.about-us.video-bg .mb_YTPlayer,
.about-us.video-bg .mb_YTPlayer iframe,
.about-us.video-bg .YTPOverlay{
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

/* Fallback to avoid broken icon images flashing */
.icon-box img[onerror]{ display: none; }

/* About page: ensure full-bleed bands have no extra gaps */
.page-header + .about-us{ padding-bottom: 0; }
.about-us + .our-story{ padding-top: 0; padding-bottom: 0; }
.our-story + .our-mission-vision{ margin-top: 0; }
.our-mission-vision{ margin-left: 0; margin-right: 0; }
.what-we-do{ margin-top: 0 !important; }

/* Home About: background video layer behind content */
.about-us.video-bg{ position: relative; overflow: hidden; }
.about-us.video-bg .video-bg-layer{ position: absolute; inset: 0; z-index: 0; }
.about-us.video-bg .video-bg-layer video{ width: 100%; height: 100%; object-fit: cover; }
.about-us.video-bg .video-overlay{ background: linear-gradient(180deg, rgba(0,0,0,.25) 0%, rgba(0,0,0,.35) 100%); }
.about-us.video-bg .container, .about-us.video-bg .section-title, .about-us.video-bg .about-content, .about-us.video-bg .about-content-body{ position: relative; z-index: 1; }

/* Portfolio list: show short description on hover */
.project-item{ position: relative; }
.project-item .project-hover{
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,0) 20%, rgba(0,0,0,.65) 100%);
  color: #fff; display: flex; align-items: flex-end; opacity: 0; transition: opacity .25s ease;
}
.project-item:hover .project-hover{ opacity: 1; }
.project-item .project-hover-content{ padding: 18px; width: 100%; }
.project-item .project-hover-content p{ margin: 0; font-size: 16px; line-height: 1.45; max-height: calc(1.45em * 6); overflow: hidden; }
@media (min-width: 1400px){
  .project-item .project-hover-content p{ max-height: calc(1.45em * 7); }
}

@media (max-width: 767px){
  /* keep hover disabled on touch, overlay remains hidden but CSS present */
  .project-item .project-hover{ opacity: 0; }
}