/* Basic Reset */
body,
h1,
h2,
p,
ul {
  margin: 0;
  padding: 0;
}

/* Added smooth scrolling */
html {
  scroll-behavior: smooth;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
    Arial, sans-serif;
  line-height: 1.6;
  background: linear-gradient(
    to bottom,
    #ffffff,
    #f0f2f5
  ); /* Subtle white-to-light-grey gradient */
  background-attachment: fixed; /* Keeps the gradient smooth on scroll */
  color: #333;
}

.container {
  width: 85%;
  max-width: 1100px;
  margin: auto;
  overflow: hidden;
}

/* Header */
header {
  background: #ffffff;
  color: #333;
  /* --- CHANGED --- */
  padding: 10px 0; /* Was 20px 0 */
  border-bottom: #00c6ff 4px solid;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000; /* Ensures it's above all other content */
}

header .container {
  display: flex;
  justify-content: center; /* This centers the content horizontally */
  align-items: center;
}

.header-content {
  display: flex;
  flex-direction: column;
  align-items: center;
}

header .logo img {
  /* --- CHANGED --- */
  height: 45px; /* Was 60px */
  width: auto;
}

.header-phone p {
  color: #004a99;
  font-weight: bold;
  font-size: 1.1rem;
  /* --- CHANGED --- */
  margin: 5px 0 0 0; /* Was 10px 0 0 0 */
  padding: 0;
}

/* (These old styles are no longer used but do no harm) */
header .header-text {
  text-align: right;
}
header h1 {
  font-size: 28px;
  color: #004a99;
  margin: 0;
}
header .tagline {
  font-style: italic;
  font-size: 18px;
  color: #555;
  margin: 0;
}

/* Navigation */
nav {
  background: #525151;
  color: #ffffff;
  padding: 5px 0;
  text-align: center;
  /* --- CHANGED --- */
  /* Adjusted for new, smaller header size */
  margin-top: 100px; /* Was 140px */
}

nav a {
  color: #ffffff;
  text-decoration: none;
  padding: 10px 20px;
  display: inline-block;
  transition: background-color 0.3s ease, color 0.3s ease; /* Smooth transition */
}

/* Nav hover effect */
nav a:hover {
  background: #00c6ff;
  color: #333;
}

/* Main Content */
main {
  padding-top: 30px;
}

/* --- NEW PROMO IMAGE STYLES --- */
.promo-image-section {
  background: none; /* Override default section background */
  box-shadow: none; /* Override default section shadow */
  padding: 0; /* Override default section padding */
  margin-bottom: 25px;
}
.promo-image {
  width: 100%;
  border-radius: 8px; /* Match the style of other sections */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
  display: block;
}

section {
  background: #ffffff;
  padding: 25px;
  margin-bottom: 25px;
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08); /* Added shadow for depth */
  transition: transform 0.3s ease, box-shadow 0.3s ease; /* Added transition */
}

/* Section hover effect */
section:hover {
  transform: translateY(-5px); /* Lifts the section up */
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.12); /* Increases shadow */
}

section h2 {
  color: #004a99;
  margin-bottom: 20px;
  border-bottom: 2px solid #f4f4f4;
  padding-bottom: 10px;
}

section ul {
  list-style: disc;
  padding-left: 20px;
}

section ul li {
  margin-bottom: 10px;
}

/* --- CAROUSEL STYLES --- */
.swiper {
  width: 100%;
  height: 400px; /* Give the carousel a set height */
  border-radius: 8px;
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.swiper-slide a {
  display: block;
  width: 100%;
  height: 100%;
  line-height: 0; /* Fixes potential whitespace issues */
}

/* Style the navigation arrows to match your theme */
:root {
  --swiper-navigation-color: #00c6ff;
  --swiper-pagination-color: #00c6ff;
}

/* Contact Section */
#contact p {
  margin-bottom: 10px;
  font-size: 16px;
}

#contact a {
  color: #004a99;
  text-decoration: none;
  font-weight: bold;
}

#contact a:hover {
  text-decoration: underline;
}

/* Footer */
footer {
  background: #333;
  color: #ffffff;
  text-align: center;
  padding: 25px;
  margin-top: 30px;
}
