/* ===== services.css - BoaBique Szolgáltatások oldal ===== */

/* ----- Szakaszok elválasztása ----- */
.services-hero {
  margin-top: var(--space-8);
  margin-bottom: var(--space-8);
  text-align: center;
}

.services-list-section {
  margin-bottom: var(--space-8);
}
.services-list {
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-3);
}
.service-card {
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  padding: var(--space-5);
  transition: box-shadow var(--transition);
  border-left: 5px solid var(--color-primary);
}
.service-card h3 {
  margin-bottom: var(--space-2);
}
.service-card:hover {
  box-shadow: var(--shadow-lg);
  border-left: 5px solid var(--color-danger);
}

/* ----- Service Benefits ----- */
.service-benefits-section {
  margin-bottom: var(--space-8);
}
.service-benefits-list {
  padding-left: var(--space-4);
  list-style: disc inside;
  font-size: var(--font-size-lg);
  color: var(--color-primary);
  margin: 0;
  display: grid;
  gap: var(--space-2);
}
.service-benefits-list li {
  color: var(--color-text);
  font-size: var(--font-size-base);
  margin-bottom: var(--space-1);
}

/* ----- Service Packages ----- */
.service-packages-section {
  margin-bottom: var(--space-8);
}
.packages-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: var(--space-4);
}
.package-card {
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  padding: var(--space-5);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border-top: 4px solid var(--color-primary);
  height: 100%;
}
.package-card h3 {
  margin-bottom: var(--space-1);
  color: var(--color-primary);
}
.package-price {
  font-family: var(--font-serif);
  font-size: var(--font-size-xl);
  color: var(--color-danger);
  margin-bottom: var(--space-2);
  font-weight: 700;
}
.package-card ul {
  margin: 0;
  padding-left: var(--space-4);
  list-style: disc inside;
  color: var(--color-text);
}
.package-card li {
  margin-bottom: var(--space-1);
}
.package-cta {
  text-align: center;
  margin-top: var(--space-4);
}

/* ----- Testimonials ----- */
.service-testimonials-section {
  margin-bottom: var(--space-8);
}
.testimonials-grid {
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: var(--space-4);
  margin-top: var(--space-3);
}
.testimonial {
  background: var(--color-gray-50);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  box-shadow: var(--shadow-xs);
  font-size: var(--font-size-base);
  position: relative;
}
.testimonial p {
  font-style: italic;
  color: var(--color-primary);
}
.testimonial footer {
  margin-top: var(--space-2);
  color: var(--color-gray-500);
  font-size: var(--font-size-sm);
}

/* ----- Service Comparison Table ----- */
.service-comparison-section {
  margin-bottom: var(--space-8);
}
.comparison-responsive {
  width: 100%; 
  overflow-x: auto;
}
.service-comparison-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xs);
  font-size: var(--font-size-base);
  min-width: 580px;
}
.service-comparison-table th, .service-comparison-table td {
  padding: var(--space-3);
  text-align: left;
  border-bottom: 1px solid var(--color-gray-100);
}
.service-comparison-table th {
  background: var(--color-primary);
  color: #fff;
  font-weight: 600;
}
.service-comparison-table tr:last-child td {
  border-bottom: none;
}
@media (max-width: 700px) {
  .service-comparison-table th, .service-comparison-table td { padding: var(--space-2); }
  .service-comparison-table { font-size: var(--font-size-sm); }
}

/* ----- Service Guarantee ----- */
.service-guarantee-section {
  margin-bottom: var(--space-8);
}
.service-guarantee-list {
  list-style: disc inside;
  padding-left: var(--space-4);
  display: grid;
  gap: var(--space-2);
}
.service-guarantee-list li { color: var(--color-text); }

/* ----- FAQ Section ----- */
.service-faq-section {
  margin-bottom: var(--space-8);
}
.service-faq-list {
  margin: 0;
}
.service-faq-list dt {
  font-weight: bold;
  margin-top: var(--space-3);
  color: var(--color-primary);
  font-size: var(--font-size-base);
}
.service-faq-list dd {
  margin-left: 0;
  margin-bottom: var(--space-2);
  color: var(--color-text);
  font-size: var(--font-size-base);
}
.service-faq-list a { text-decoration: underline; color: var(--color-primary); }
.service-faq-list a:hover { color: var(--color-danger); }

/* ----- Contact CTA Section ----- */
.service-contact-section {
  text-align: center;
}
.contact-links {
  display: flex;
  gap: var(--space-3);
  justify-content: center;
  flex-wrap: wrap;
  margin-top: var(--space-3);
}
.button.button-outline {
  background: #fff;
  color: var(--color-primary);
  border: 2px solid var(--color-primary);
}
.button.button-outline:hover, .button.button-outline:focus-visible {
  background: var(--color-primary);
  color: #fff;
}

@media (max-width:600px) {
  .services-hero{margin-top:var(--space-5);margin-bottom:var(--space-5);}
  .service-card,.package-card,.testimonial{padding:var(--space-3);}
  .service-comparison-table{min-width:400px;}
  .contact-links{gap:var(--space-2);}
}