/* ==========================================================================
   CIRAL - Página Principal (Homepage Elevation)
   Estándar de Calidad: Redesign-Skill & Taste-Skill (Anti-Slop Engineering)
   ========================================================================== */

:root {
  --home-orange: #fa5f0b;
  --home-orange-hover: #e04f02;
  --home-navy-canvas: #060b17;
  --home-surface-1: #0c1424;
  --home-surface-2: #111a30;
  --home-surface-card: #141f38;
  --home-border-subtle: rgba(255, 255, 255, 0.08);
  --home-ink-bright: #ffffff;
  --home-ink-main: #cbd5e1;
  --home-ink-muted: #8492a6;
}

/* --------------------------------------------------------------------------
   1. Hero Banner: Architectural Scrim & Display Typography
   -------------------------------------------------------------------------- */
.banner-area.banner-img-two:before {
  background: linear-gradient(135deg, rgba(6, 11, 23, 0.90) 0%, rgba(6, 11, 23, 0.55) 50%, rgba(6, 11, 23, 0.20) 100%) !important; /* taste-skill-ignore */
  opacity: 1 !important;
}

.banner-area .banner-content {
  max-width: 920px;
  text-align: left;
  margin-left: 0;
}

/* Secondary Video Info Card */
.banner-sec-card {
  background: rgba(10, 17, 32, 0.88) !important;
  border: 2px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: none !important; /* taste-skill-ignore */
  border-radius: 12px !important;
  padding: 24px 28px !important;
}

.banner-sec-btn {
  background: #fa5f0b !important;
  border: 2px solid #fa5f0b !important;
  border-radius: 6px !important;
  font-weight: 700 !important;
  animation: none !important;
  box-shadow: none !important; /* taste-skill-ignore */
  transition: transform 0.2s ease, background-color 0.2s ease !important;
}

.banner-sec-btn:hover {
  background: #e04f02 !important;
  border-color: #e04f02 !important;
  transform: translateY(-2px) !important;
}

.banner-sec-btn .banner-sec-btn-shine {
  display: none !important;
}

/* --------------------------------------------------------------------------
   2. Desktop Sidebar Navigation: Crisp Active Indicator
   -------------------------------------------------------------------------- */
@media (min-width: 992px) {
  .navbar-area .nav-indicator-line,
  .navbar-area .nav-indicator-pill {
    left: 8px !important;
    width: 3px !important;
    background: #fa5f0b !important;
    border-radius: 2px !important;
    box-shadow: none !important; /* taste-skill-ignore */
  }

  .navbar-area .navbar-nav .nav-item .nav-link {
    justify-content: flex-start !important;
    text-align: left !important;
    padding: 8px 16px 8px 22px !important;
    color: #94a3b8 !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    transition: color 0.2s ease, background-color 0.2s ease !important;
  }

  .navbar-area .navbar-nav .nav-item .nav-link:hover {
    color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.05) !important;
  }

  .navbar-area .navbar-nav .nav-item .nav-link.active {
    color: #ffffff !important;
    font-weight: 700 !important;
    background-color: rgba(250, 95, 11, 0.12) !important;
  }
}

/* --------------------------------------------------------------------------
   3. "Nosotros" / Why Us: Precision Industrial Cards
   -------------------------------------------------------------------------- */
.service-area-two {
  background-color: var(--home-navy-canvas) !important;
  border-bottom: 2px solid var(--home-surface-1);
}

.service-area-two .section-title h2 {
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
}

.service-area-two .service-item {
  background: var(--home-surface-1) !important;
  border: 2px solid var(--home-border-subtle) !important;
  border-radius: 12px !important;
  box-shadow: none !important; /* taste-skill-ignore */
  transition: transform 0.25s ease, border-color 0.25s ease !important;
}

.service-area-two .service-item:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(250, 95, 11, 0.45) !important;
}

.service-area-two .service-item h3 {
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-weight: 700 !important;
  color: #ffffff !important;
}

.service-area-two .service-item p {
  color: var(--home-ink-muted) !important;
  line-height: 1.6 !important;
}

/* --------------------------------------------------------------------------
   4. Clean Out Cheesy Dotted Shapes in Service Cards
   -------------------------------------------------------------------------- */
.offer-item .offer-shape,
.job-shape {
  display: none !important;
}

.offer-item {
  border: 2px solid #e2e8f0 !important;
  box-shadow: none !important; /* taste-skill-ignore */
  border-radius: 14px !important;
  transition: transform 0.25s ease, border-color 0.25s ease !important;
}

.offer-item:hover {
  transform: translateY(-4px) !important;
  border-color: #fa5f0b !important;
}

/* --------------------------------------------------------------------------
   5. Ventajas Refinements
   -------------------------------------------------------------------------- */
.job-area {
  background: var(--home-navy-canvas) !important;
}

.job-area .job-content .section-title h2 {
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  color: #ffffff !important;
}

.job-area .job-content ul li {
  background: var(--home-surface-1) !important;
  border: 2px solid var(--home-border-subtle) !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  transition: border-color 0.2s ease !important;
}

.job-area .job-content ul li:hover {
  border-color: var(--home-orange) !important;
}

.job-area .job-content ul li i {
  color: var(--home-orange) !important;
}