/* General body styling */
body {
  font-family: 'Segoe UI', Tahoma, sans-serif;
  margin: 0;
  background: #f8f9fa;
  color: #222;
  line-height: 1.6; /* Improve readability */
  font-size: 18px; /* Slightly larger base font size for body content */
}

/* Links */
a {
  color: #007bff; /* Blue color for all links after the header */
  text-decoration: none;
  font-size: 18px; /* Increase font size of links */
}

a:hover {
  text-decoration: underline;
  color: #0056b3; /* Darker blue when hovered */
}

/* Header styling (unchanged) */
header {
  background: #0A192F;
  color: white;
  padding: 40px 20px;
}

header a {
  color: #64ffda;
  text-decoration: none;
  font-weight: 500;
}

header a:hover {
  color: #fff;
  text-decoration: underline;
}

/* Header container */
.header-container {
  display: flex;
  align-items: center;
  gap: 20px;
}

/* Profile image (square) */
.profile-img {
  width: 250px; /* Keep the size */
  height: 250px; /* Keep the size */
  object-fit: cover; /* Ensures the image covers the area */
  border: 3px solid #64ffda; /* Keeps the border */
  /* border-radius removed to make it square */
}

/* Header text */
.header-text {
  max-width: 800px;
}

/* Navigation bar */
nav {
  display: flex;
  justify-content: flex-end; /* Right-align the nav menu */
  background: #112240;
  padding: 10px 20px;
  margin-top: 10px;
}

nav ul {
  list-style: none;
  display: flex;
  gap: 15px;
  margin: 0;
  padding: 0;
}

nav li {
  margin: 0;
}

nav a {
  color: #64ffda;
  text-decoration: none;
  font-weight: bold;
}

nav a:hover {
  text-decoration: underline;
}

/* Sections */
section {
  max-width: 950px;
  margin: 40px auto;
  padding: 0 20px;
  text-align: justify; /* Justify text for better readability */
  font-size: 18px; /* Increased font size for body content */
}

h2 {
  color: #0A192F;
  border-bottom: 2px solid #64ffda;
  display: inline-block;
  padding-bottom: 4px;
  margin-bottom: 20px; /* Add space after headings */
  font-size: 24px; /* Larger font size for headings */
}

.subsection {
  margin-top: 20px;
}

ul li {
  margin-bottom: 15px; /* More space between list items */
  font-size: 18px; /* Increased font size for list items */
}

/* Footer */
footer {
  background: #0A192F;
  color: #a8b2d1;
  text-align: center;
  padding: 20px;
  margin-top: 40px; /* Space above the footer */
  font-size: 18px; /* Increased font size for footer text */
  width: 100%; /* Make the footer span the full width */
  position: relative; /* Ensure it spans across the screen */
  bottom: 0;
}

/* Mobile responsiveness */
@media screen and (max-width: 768px) {
  /* Make sure the header remains intact */
  header {
    padding: 30px 20px; /* Adjust the padding for mobile */
  }

  .header-container {
    flex-direction: column; /* Stack profile image and text vertically */
    text-align: center; /* Center the content */
  }

  /* Profile image adjustment for mobile (square) */
  .profile-img {
    width: 150px;
    height: 150px;
    margin-bottom: 20px; /* Space below the image */
    /* border-radius removed for square image */
  }

  nav {
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }

  nav ul {
    flex-direction: column;
    gap: 15px;
    padding: 0;
  }

  /* Sections adjustments for smaller screens */
  section {
    padding: 0 15px;
    font-size: 18px; /* Increased font size for readability on mobile */
  }

  /* Footer */
  footer {
    padding: 15px;
    font-size: 18px; /* Mobile font size */
  }
}

/* Tablet and larger screen responsiveness */
@media screen and (min-width: 769px) {
  /* Make sure the text is justified for large screens */
  section {
    text-align: justify;
  }
}
