/*==================================================
Project Name : Heartwell Home Care Website
Description : Heartwell Home Care Official Website
Design & Code: Shakib Hosen Sabbir
Portfolio: https://shakibhosensabbir.netlify.app
GitHub: https://github.com/shakibhosensabbir
Email: shakibhossin1234@gmail.com
Technologies: HTML5, Tailwind CSS, Vanilla JS, Font Awesome, AOS
==================================================*/
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400;1,9..144,500&family=Public+Sans:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght@100..700&display=swap');

html {
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: #3981b4 #f3eae0;
}

body {
  -webkit-font-smoothing: antialiased;
}

p {
  font-size: 1.125rem;
  /* Equivalent to text-lg */
  line-height: 1.75rem;
}

::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #f3eae0;
}

::-webkit-scrollbar-thumb {
  background: #3981b4;
  border-radius: 99px;
}

::-webkit-scrollbar-thumb:hover {
  background: #154d73;
}

.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  vertical-align: middle;
}

.fade-section {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

.fade-in {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

@media (prefers-reduced-motion: reduce) {
  .fade-section {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Gradients and Overlays */
.hero-gradient {
  background: linear-gradient(135deg, #154d73 0%, #10293d 100%);
}

.stats-band {
  background: #10293d;
}

.cta-gradient {
  background: linear-gradient(135deg, #10293d 0%, #154d73 100%);
}

.service-overlay {
  background: linear-gradient(180deg, transparent 40%, rgba(16, 41, 61, 0.82) 100%);
}

/* Editorial kicker label (replaces uppercase pill "eyebrows") */
.kicker {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-weight: 500;
}

/* Form Styles (Careers) */
.form-label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 6px;
  color: rgba(255, 255, 255, 0.9);
}

.form-input {
  width: 100%;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  padding: 8px 12px;
  background: white;
  color: #154d73;
  font-size: 13px;
}

.form-input:focus {
  outline: none;
  border-color: #c81f44;
  box-shadow: 0 0 0 2px rgba(200, 31, 68, 0.3);
}

/* Job Description Content Styles */
.job-description-content h2,
.job-description-content h3,
.job-description-content h4 {
  color: #154d73;
  /* hw-navy */
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 0.75rem;
}

.job-description-content p {
  margin-bottom: 1rem;
}

.job-description-content ul,
.job-description-content ol {
  margin-bottom: 1rem;
  padding-left: 1.5rem;
}

.job-description-content ul {
  list-style-type: disc;
}

.job-description-content ol {
  list-style-type: disc;
}

.job-description-content li {
  margin-bottom: 0.5rem;
}

.job-description-content strong {
  font-weight: 700;
}

.job-description-content a {
  text-decoration: underline !important;
  color: #c81f44 !important;

}