/* === GLOV SECURE PAGE SPECIFIC STYLES (/secure) === */
.bg-secure {
  background-color: #001713;
}

.bg-secure-2 {
  background-color: #062925;
}

.bg-secure-card {
  background-color: #062925;
}

.bg-secure-card-2 {
  background-color: #001713;
}

.bg-success {
  background-color: #28a745 !important;
}

.bg-dark {
  background-color: #000000 !important;
}

.text-cs {
  color: rgb(234, 179, 13) !important
}

.bg-secure-btn {
  background-color: #00584a;
}
.secure-hero {
  height: 100vh;
  background: url('/images/projects/glovfond-secure.png') no-repeat center center/cover;
  color: #ffffff;
}

.text-secure {
  color: #1dd3c0; /* couleur GLOV Secure ou personnalise selon Excel */
}

.text-warning {
  color: #ffc107 !important;
}

.secure-hero .btn {
  padding: 12px 25px;
  background: #00584a;
  color: #fff;
  border-radius: 8px;
  font-weight: 600;
  transition: all 0.3s ease;
}

.secure-hero .btn:hover {
  background: #0ca99d;
}

/* Styles pour la section prix sur la page /secure */
.pricing-section {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 0.375rem;
  padding: 0.75rem;
  border: 1px solid rgba(255, 193, 7, 0.3);
}

.pricing-item {
  text-align: center;
}

.pricing-item small {
  font-size: 0.75rem;
  opacity: 0.8;
}

.pricing-item .fw-bold {
  font-size: 1.1rem;
  font-weight: 600;
}

/* Styles pour les cartes Coming Soon */
.coming-soon-card {
  opacity: 0.7;
  position: relative;
}

.coming-soon-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: repeating-linear-gradient(
    45deg,
    transparent,
    transparent 10px,
    rgba(255, 255, 255, 0.05) 10px,
    rgba(255, 255, 255, 0.05) 20px
  );
  pointer-events: none;
  border-radius: 0.375rem;
}

.coming-soon-card:hover {
  opacity: 0.8;
  transform: translateY(-2px);
  transition: all 0.3s ease;
}

/* Responsive - réduire la taille sur mobile */
@media (max-width: 768px) {
  .pricing-section {
    padding: 0.5rem;
  }
  
  .pricing-item .fw-bold {
    font-size: 1rem;
  }
}