/* 
 * Main Styles for Stradiax Website
 * Contains general styles, typography, and layout elements
 */

/* === Base Styles === */
html { 
  scroll-behavior: smooth; 
}

/* === Layout & Sections === */
.hero {
  background: #fff !important;
  color: #222;
  padding: 2.2rem 0 1.2rem 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

/* Consistent section spacing */
section, 
.assist-section, 
.featured-grid, 
.insights-section {
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
}

/* Remove double spacing if two sections are adjacent */
section + section, 
.assist-section + section, 
section + .assist-section, 
.featured-grid + section, 
.insights-section + section {
  margin-top: 0;
}

/* Language switcher */
.lang-switch {
  position: absolute;
  right: 1rem;
  top: 1rem;
}

/* === Assistance Section === */
.assist-section .card,
.assist-section .bg-white {
  border-radius: 1.25rem;
}

.assist-section select.form-select {
  border-radius: 2rem;
  font-size: 1rem;
}

/* === Services Section === */
.services-highlight {
  background-color: #f8f9fa;
  padding: 3rem 0;
}

.service-title {
  font-size: 1.18rem;
}

/* === Featured Grid Section === */
.featured-grid-section .card {
  border-radius: 1.25rem;
  overflow: hidden;
}

.featured-grid-section .card-img,
.featured-grid-section .card-img-overlay {
  border-radius: 1.25rem;
}

.featured-grid-section .btn-success {
  background: #29a8df;
  color: #fff;
  border: none;
  transition: background 0.2s;
}

.featured-grid-section .btn-success:hover {
  background: #1c8fc3;
  color: #fff;
}

.featured-grid-section .card-img-overlay {
  background: none;
}

.featured-grid-section .card-img {
  filter: brightness(0.8);
}

/* === Responsive Styles === */
@media (max-width: 991.98px) {
  .featured-grid-section .row.g-4 {
    flex-direction: column;
  }
  
  .featured-grid-section .col-lg-6 {
    max-width: 100%;
    flex: 0 0 100%;
  }
  
  .featured-grid-section .card {
    margin-bottom: 1.5rem;
  }
}

@media (max-width: 767.98px) {
  .hero {
    padding: 2.5rem 0 2rem 0;
  }
  
  section, 
  .assist-section, 
  .featured-grid, 
  .insights-section {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }
}