/* Basic style for personal website */
body {
  /* Base font stack for readability */
  font-family: 'Source Sans Pro', 'Segoe UI', 'Open Sans', Arial, sans-serif;
  /* Global reset and base font */
a, a:visited {
  /* Link color using accent variable */
  color: var(--accent);
  /* Underline links for clarity */
  text-decoration: underline;
  /* Smooth color change on hover */
  transition: color 0.2s;
}
a:hover, a:focus {
  /* Darken link color when hovered or focused */
  color: #000;
}
  /* Remove default page margin */
  margin: 0;
  /* Remove default page padding */
  padding: 0;
  /* Page background image with beige fallback */
  /* Full-page background image centered and covering */
  background: url('assets/background.jpeg') center/cover no-repeat;
  /* Fallback beige background color */
  background-color: #fffff9;
  /* Default text color */
  color: #000;
  /* Increased line height for readability */
  line-height: 1.7;
}

:root {
  /* Accent color variable */
  /* Define primary accent color */
  --accent: rgb(51, 51, 153);
}


.btn {
/* Button styling */
  /* Allow padding and margin on button */
  display: inline-block;
  /* Button background color */
  background: var(--accent);
  /* Button text color */
  color: #fff;
  /* Button padding for click area */
  padding: 0.6em 1.4em;
  /* Rounded corners on button */
  border-radius: 5px;
  /* Remove underline from button link */
  text-decoration: none;
  /* External spacing around buttons */
  margin: 0.7em 0.3em;
  /* Bold button text */
  font-weight: 600;
  /* Slightly larger text in buttons */
  font-size: 1.08em;
  /* Subtle shadow for depth */
  box-shadow: 0 1px 4px rgba(51,51,153,0.07);
  /* Smooth transitions for hover effects */
  transition: background 0.2s, box-shadow 0.2s;
}
.btn:hover {
  /* Button hover background */
  background: #000;
  /* Ensure text stays white on hover */
  color: #fff;
  /* Deeper shadow on hover */
  box-shadow: 0 2px 8px rgba(51,51,153,0.10);
}

main {
  /* Max width for main container */
  max-width: 760px;
  /* Main content container centered with equal top/bottom spacing */
  /* Vertical and horizontal centering */
  margin: 3em auto 1em auto;
  /* Match main panel to page beige background */
  background: #fffff9;
  /* Inner padding for content area */
  padding: 0.1em 2em 0.5em 2em;
  /* Rounded corners for main panel */
  border-radius: 10px;
  /* Outer shadow for lift effect */
  box-shadow: 0 4px 24px rgba(51,51,153,0.08);
}

section {
  /* Section spacing */
  /* Space below each section */
  margin-bottom: 0.25em;
  margin-top: 0em;
}

/* Remove bullets from research section */
#research ul {
  /* Remove default bullets */
  list-style: none;
  /* Remove default list indent */
  padding-left: 0;
}
/* Make research text size match the intro */
#research {
  /* Match research text to intro size */
  font-size: 1.18em;
}
/* Match intro text size to research section */
#intro-section p {
  /* Apply consistent paragraph font size */
  font-size: 1.18em;
}

h2 {
  /* Section header color */
  color: var(--accent);
  /* Underline effect for headers */
  border-bottom: 2px solid var(--accent);
  /* Space below header text */
  padding-bottom: 0.2em;
  /* Space to next content */
  margin-bottom: 0.4em;
  /* Font size for section headers */
  font-size: 1.6em;
  /* Bold section headers */
  font-weight: 600;
  /* Slight letter spacing for clarity */
  letter-spacing: 0.01em;
}

#intro-section h2 {
  /* Larger size for intro heading */
  font-size: 2em;
}

/* Publication links group spacing is handled inline in HTML for maximum compatibility */

ul {
  /* Default indent for lists */
  padding-left: 1.2em;
}
li {
  /* Space between list items */
  margin-bottom: 1.2em;
}

footer {
  /* Center footer text */
  text-align: center;
  /* Footer text color */
  color: #000;
  /* Footer font size */
  font-size: 1em;
  /* Spacing above and below footer */
  margin: 0em 0 0em 0;
}

/* small copy button next to email link */
.email-link {
  color: var(--accent); /* use accent color */
  text-decoration: underline;
}
.email-link i { margin-right: 3px; }

/* Mobile responsiveness adjustments */
@media (max-width: 600px) {
  main {
    /* Expand main container to almost full viewport width */
    max-width: 98vw;
    /* Reduce padding for smaller screens */
    padding: 1em 1em;
    /* Tighter vertical margins */
    margin: 1em auto;
  }
  /* Smaller section headers on mobile */
  h2 {
    font-size: 1.4em;
  }
  /* Adjust intro heading size on mobile */
  #intro-section h2 {
    font-size: 1.8em;
  }
}