/* General body styles */
body {
  background-color: #f6f9f4; /* soft off-white green */
  color: #2e3d30; /* dark green-gray for text */
  font-family: "Georgia", serif;
  line-height: 1.6;
  padding-bottom: 2rem;
}

/* Headings with subtle gradient text */
h1, h2, h3, h4 {
  color: #3a6351; /* deep earthy green */
  font-family: "Georgia", serif;
}

h1 {
  background: linear-gradient(135deg, #3a6351, #4f8a8b);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  border-bottom: 3px solid #a68a64;
  padding-bottom: 0.5rem;
}

h2 {
  border-left: 4px solid #93748a;
  padding-left: 1rem;
  margin-left: -1rem;
}

/* Links */
a {
  color: #4f8a8b; /* soft teal blue */
  text-decoration: none;
}

a:hover {
  color: #93748a; /* muted lavender */
  text-decoration: underline;
}

/* Enhanced Navbar */
.navbar {
  background: linear-gradient(135deg, #dbe9d8, #e8f4e5); /* gradient pale moss green */
  border-bottom: 3px solid #a68a64; /* soft brown accent */
  box-shadow: 0 2px 8px rgba(166, 138, 100, 0.2);
}

.navbar a {
  color: #3a4d39 !important; /* darker green for nav links */
  font-weight: bold;
  padding: 0.5rem 1rem;
  border-radius: 6px;
  transition: all 0.3s ease;
}

.navbar a:hover {
  color: #6a5d4d !important; /* warm brown hover */
  background-color: rgba(166, 138, 100, 0.1);
}

/* Code blocks and inline code */
code {
  background: linear-gradient(135deg, #eaf2ea, #f1f7f0); /* pale green gradient */
  color: #4a6c59; /* dark sage */
  padding: 2px 4px;
  border-radius: 4px;
  font-family: monospace;
  border: 1px solid #cbd5cb;
}

pre {
  background: linear-gradient(135deg, #f1f7f0, #f6f9f4);
  border-left: 4px solid #8c7c68;
  padding: 1rem;
  overflow-x: auto;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(140, 124, 104, 0.1);
}

/* Enhanced Blockquotes */
blockquote {
  border-left: 5px solid #a68a64; /* brown accent */
  background: linear-gradient(135deg, #f9fdf8, #f6f9f4);
  padding: 1rem;
  color: #5c6d5c;
  font-style: italic;
  border-radius: 0 8px 8px 0;
  box-shadow: 0 2px 8px rgba(166, 138, 100, 0.1);
}

/* Enhanced Footer */
footer {
  background: linear-gradient(135deg, #dce6dc, #cbd5cb);
  color: #3a4d39;
  padding: 1rem;
  text-align: center;
  border-top: 3px solid #a68a64;
  box-shadow: 0 -2px 8px rgba(166, 138, 100, 0.1);
}

/* Enhanced Gallery 1 - No captions */
.hobby-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
  max-width: 1000px;
  margin: 2rem auto;
  padding: 1.5rem;
  background: linear-gradient(135deg, #f9fdf8, #f6f9f4);
  border-radius: 12px;
  border: 2px solid #cbd5cb;
  box-shadow: 0 4px 12px rgba(203, 213, 203, 0.2);
}

.hobby-gallery img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border: 3px solid #a68a64; /* brown frame */
  box-shadow: 0 4px 12px rgba(166, 138, 100, 0.2);
  transition: all 0.3s ease;
  border-radius: 8px;
}

.hobby-gallery img:hover {
  transform: scale(1.02);
  border-color: #93748a; /* lavender hover */
  box-shadow: 0 6px 16px rgba(147, 116, 138, 0.3);
}

/* Enhanced Gallery 2 - With captions */
.hobby2-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 20px;
  max-width: 1000px;
  margin: 2rem auto;
  padding: 1.5rem;
  background: linear-gradient(135deg, #f9fdf8, #eaf2ea);
  border-radius: 12px;
  border: 2px solid #4f8a8b;
  box-shadow: 0 4px 12px rgba(79, 138, 139, 0.15);
}

.hobby2-gallery figure {
  margin: 0;
  background: linear-gradient(135deg, #f0f4f1, #f7fdf7);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(79, 138, 139, 0.15);
  transition: all 0.3s ease;
  border: 2px solid #cbd5cb;
}

.hobby2-gallery figure:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(79, 138, 139, 0.25);
  border-color: #93748a;
}

.hobby2-gallery img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border: none;
  transition: none;
}

.hobby2-gallery figcaption {
  font-size: 0.95rem;
  color: white;
  padding: 0.75rem 1rem;
  text-align: center;
  background: linear-gradient(135deg, #4f8a8b, #3a6351);
  margin: 0;
  font-weight: 500;
}

/* Enhanced Resume Cards */
.resume-card {
  background: linear-gradient(135deg, #f7fdf7, #f1f7f0);
  border: 2px solid #cbd5cb;
  border-radius: 12px;
  padding: 1rem 1.5rem;
  margin-bottom: 1.5rem;
  box-shadow: 0 4px 12px rgba(203, 213, 203, 0.2);
  transition: all 0.3s ease;
}

.resume-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(203, 213, 203, 0.3);
  border-color: #4f8a8b;
}

.resume-card h3, .resume-card h4 {
  margin-top: 0;
  color: #2d4739;
}

.resume-card ul {
  margin-top: 0.5rem;
}

/* Enhanced Resume Download Button */
a.resume-download {
  display: inline-block;
  background: linear-gradient(135deg, #3a6351, #4f8a8b);
  color: white;
  padding: 0.8rem 1.5rem;
  border-radius: 10px;
  text-decoration: none;
  font-weight: 600;
  font-size: 1rem;
  margin-top: 1rem;
  transition: all 0.3s ease;
  box-shadow: 0 4px 8px rgba(58, 99, 81, 0.3);
}

a.resume-download:hover {
  background: linear-gradient(135deg, #2e4e3d, #37685f);
  box-shadow: 0 6px 12px rgba(58, 99, 81, 0.4);
  transform: translateY(-2px);
}

h3, h4 {
  color: #3a6351;
}

a {
  color: #4f8a8b;
  text-decoration: none;
  font-weight: 500;
}

a:hover {
  text-decoration: underline;
  color: #37685f;
}

/* Enhanced HR */
hr {
  border: none;
  height: 2px;
  background: linear-gradient(90deg, transparent, #a68a64, transparent);
  margin: 2rem 0;
}

/* Enhanced Project Gallery */
.project-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 2rem;
  margin: 2rem 0;
  padding: 1.5rem;
  background: linear-gradient(135deg, #f9fdf8, #f6f9f4);
  border-radius: 12px;
  border: 2px solid #cbd5cb;
}

.project-card {
  background: linear-gradient(135deg, #fdfdfd, #f9fdf8);
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 4px 12px rgba(79, 138, 139, 0.1);
  transition: all 0.3s ease;
  display: flex;
  flex-direction: column;
  border: 2px solid #eaf2ea;
}

.project-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 8px 20px rgba(79, 138, 139, 0.2);
  border-color: #4f8a8b;
}

.project-image {
  width: 100%;
  height: 180px;
  object-fit: cover;
}

.project-content {
  padding: 1.5rem;
}

.project-tag {
  font-size: 0.85rem;
  color: white;
  font-weight: bold;
  text-transform: uppercase;
  background: linear-gradient(135deg, #4f8a8b, #93748a);
  padding: 0.3rem 0.8rem;
  border-radius: 20px;
  display: inline-block;
  margin-bottom: 0.5rem;
}

.project-title {
  margin: 0.5rem 0 0.3rem;
  font-size: 1.2rem;
  font-weight: bold;
  color: #3a6351;
}

.project-description {
  font-size: 0.95rem;
  color: #444;
}

/* Add some accent elements */
.accent-line {
  height: 3px;
  background: linear-gradient(90deg, #4f8a8b, #93748a, #a68a64);
  margin: 2rem 0;
  border-radius: 2px;
}

/* Content sections with subtle backgrounds */
.content-section {
  background: linear-gradient(135deg, #f9fdf8, #f6f9f4);
  padding: 2rem;
  border-radius: 12px;
  margin: 2rem 0;
  border-left: 4px solid #4f8a8b;
  box-shadow: 0 2px 8px rgba(79, 138, 139, 0.1);
}

/* Additional styles specific to this project page */

.research-question {
  background: linear-gradient(135deg, #f7fdf7, #f1f7f0);
  border-left: 5px solid #8b4513;
  padding: 1.5rem;
  margin: 2rem 0;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(203, 213, 203, 0.2);
}

.research-question strong {
  color: #8b4513;
  font-size: 1.1rem;
}

.key-findings-section {
  background: linear-gradient(135deg, #f9fdf8, #f6f9f4);
  padding: 2rem;
  border-radius: 12px;
  margin: 2rem 0;
  border: 2px solid #cbd5cb;
}

.findings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem;
  margin-top: 1.5rem;
}

.key-finding {
  background: linear-gradient(135deg, #fdfdfd, #f9fdf8);
  border-left: 4px solid #cd853f;
  padding: 1.25rem;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(79, 138, 139, 0.1);
  transition: all 0.3s ease;
  border: 2px solid #eaf2ea;
}

.key-finding:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 16px rgba(79, 138, 139, 0.2);
  border-color: #4f8a8b;
}

.key-finding h3 {
  color: #8b4513;
  margin-top: 0;
  font-size: 1.1rem;
  margin-bottom: 0.75rem;
}

.soil-comparison {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 2rem;
  margin: 2rem 0;
}

.soil-card {
  background: linear-gradient(135deg, #f7fdf7, #f1f7f0);
  border: 2px solid #cbd5cb;
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 4px 12px rgba(203, 213, 203, 0.2);
  transition: all 0.3s ease;
}

.soil-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(203, 213, 203, 0.3);
  border-color: #8b4513;
}

.soil-card h3 {
  color: #8b4513;
  margin-top: 0;
  border-left: 4px solid #cd853f;
  padding-left: 1rem;
  margin-left: 0;
}

.soil-card ul {
  margin-top: 1rem;
  list-style-position: inside;
}

.soil-card li {
  margin: 0.5rem 0;
  color: #2e3d30;
}

.visual-section {
  background: linear-gradient(135deg, #f9fdf8, #f6f9f4);
  padding: 2rem;
  border-radius: 12px;
  margin: 2rem 0;
  border: 2px solid #cbd5cb;
  box-shadow: 0 2px 8px rgba(79, 138, 139, 0.1);
}

.figure-container {
  background: white;
  padding: 1.5rem;
  border-radius: 8px;
  margin: 2rem 0;
  box-shadow: 0 2px 8px rgba(203, 213, 203, 0.15);
  border: 1px solid #eaf2ea;
}

.figure-container img {
  border: 3px solid #a68a64;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(166, 138, 100, 0.2);
}

.conclusion-box {
  background: linear-gradient(135deg, #8b4513, #cd853f);
  color: white;
  padding: 2rem;
  border-radius: 12px;
  margin: 2rem 0;
  box-shadow: 0 4px 12px rgba(139, 69, 19, 0.3);
}

.conclusion-box h2 {
  color: white;
  border-left: none;
  padding-left: 0;
  margin-left: 0;
}

.conclusion-box p {
  color: white;
  font-size: 1.05rem;
}
