/* Theme-specific background colors */
body:not(.quarto-dark) {
  background-color: #ede8de !important;
}

body:not(.quarto-dark) #quarto-content,
body:not(.quarto-dark) .quarto-container,
body:not(.quarto-dark) main.content,
body:not(.quarto-dark) .content {
  background-color: #ede8de !important;
}

body.quarto-dark {
  background-color: #141414 !important;
}

body.quarto-dark #quarto-content,
body.quarto-dark .quarto-container,
body.quarto-dark main.content,
body.quarto-dark .content,
body.quarto-dark .page-layout-full,
body.quarto-dark .page-layout-full .quarto-container,
body.quarto-dark .page-layout-full #quarto-content,
body.quarto-dark footer,
body.quarto-dark .page-footer,
body.quarto-dark .quarto-footer,
body.quarto-dark .nav-footer,
body.quarto-dark .nav-footer-center,
body.quarto-dark .nav-footer-left,
body.quarto-dark .nav-footer-right {
  background-color: #141414 !important;
  color: #ede8de !important;
}

/* Dark mode specific styling */
body.quarto-dark {
  background-color: #141414 !important;
}

body.quarto-dark .about-entity {
  background-color: #141414 !important;
}

body.quarto-dark .about-entity .about-contents h1,
body.quarto-dark .about-entity .about-contents h2,
body.quarto-dark .about-entity .about-contents h3,
body.quarto-dark .about-entity .about-contents h4,
body.quarto-dark .about-entity .about-contents h5,
body.quarto-dark .about-entity .about-contents h6 {
  color: #ede8de !important;
}

body.quarto-dark .about-entity .about-contents p,
body.quarto-dark .about-entity .about-contents li,
body.quarto-dark .about-entity .about-contents span,
body.quarto-dark .about-entity .about-contents div {
  color: #ede8de !important;
}

body.quarto-dark .about-entity .about-contents a {
  color: #ede8de !important;
}

body.quarto-dark .about-entity .about-contents a:hover {
  color: #ede8de !important;
}

body.quarto-dark .content-block .about-links {
  color: #ede8de !important;
}

body.quarto-dark .content-block .about-links:hover {
  color: #ede8de !important;
}

/* Dark mode icon styling */
body.quarto-dark .about-entity i,
body.quarto-dark .about-entity .fa,
body.quarto-dark .about-entity .fa-solid,
body.quarto-dark .about-entity .fa-regular,
body.quarto-dark .about-entity .fa-brands,
body.quarto-dark .about-entity .ai,
body.quarto-dark .about-links i,
body.quarto-dark .about-link i,
body.quarto-dark .content-block .about-links i,
body.quarto-dark .social-icon i {
  color: #ede8de !important;
}

body.quarto-dark .fa-ul .fa-li i,
body.quarto-dark .fa-ul .fa-li .fa,
body.quarto-dark .fa-ul .fa-li .ai {
  color: #ede8de !important;
}

/* Ensure all icons use dark theme colors */
body.quarto-dark [class*="fa-"],
body.quarto-dark [class*="ai-"] {
  color: #ede8de !important;
}

/* Dark mode research cards - using same styling as light theme */
body.quarto-dark .research-card {
  background-color: #f8f9fa !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
}

body.quarto-dark .research-card:hover {
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15) !important;
}

body.quarto-dark .research-card p {
  color: #5a5a5a !important;
}

body.quarto-dark .card-title {
  color: #502c2c !important;
}

/* Dark mode card colors - using same colors as light theme */
body.quarto-dark .research-card.card-1 {
  background-color: #f5e9fa !important;
}

body.quarto-dark .research-card.card-2 {
  background-color: #c1e0e5 !important;
}

body.quarto-dark .research-card.card-3 {
  background-color: #c4ecef !important;
}

/* Hero banner - image at top */
.hero-banner {
  text-align: center;
  margin-bottom: 3rem;
  padding: 2rem 1rem 0;
  background-color: inherit;
}

/* Banner image styling */
.banner-image {
  max-width: 800px;
  width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.banner-image:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2);
}

/* Hero content - centered below image */
.hero-content-center {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 2rem 4rem;
  text-align: center;
  background-color: inherit;
}

/* Main title styling */
.hero-content-center h1 {
  font-size: 3.5rem;
  font-weight: 700;
  line-height: 1.1;
  color: #2c3e50;
  margin-bottom: 1rem;
}

/* Subtitle styling */
.hero-content-center h2 {
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #7f8c8d;
  margin-bottom: 2.5rem;
}

/* Research description styling */
.research-description {
  font-size: 1.4rem;
  line-height: 1.8;
  color: #2c3e50;
  margin-bottom: 2.5rem;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

/* Main content text styling - larger font for better readability */
.column[width="65%"] p {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #2c3e50;
  margin-bottom: 1.5rem;
}

body.quarto-dark .column[width="65%"] p {
  color: #ede8de;
}

/* CTA section */
.cta-section {
  margin-top: 2rem;
}

/* Research sketch styling */
.research-sketch {
  max-width: 400px;
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  background: white;
  padding: 1rem;
}

.research-sketch:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
}

/* Hero link styling */
.hero-link {
  display: inline-block;
  font-size: 1.2rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #e67e22;
  text-decoration: none;
  border-bottom: 2px solid #e67e22;
  padding-bottom: 2px;
  transition: all 0.3s ease;
}

.hero-link:hover {
  color: #d35400;
  border-bottom-color: #d35400;
  transform: translateY(-2px);
}

/* Social links styling */
.social-links {
  margin: 2rem 0;
  display: flex;
  gap: 1rem;
  align-items: center;
}

.social-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background-color: #f8f9fa;
  color: #7f8c8d;
  text-decoration: none;
  transition: all 0.3s ease;
  font-size: 1.4rem;
}

.social-icon:hover {
  background-color: #e67e22;
  color: white;
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* About template styling for left-right layout */
.about-entity {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 3rem !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 2rem 1rem !important;
}

/* Text content on the left */
.about-entity .about-contents {
  flex: 1 !important;
  text-align: left !important;
  order: 1 !important;
  padding-right: 2rem !important;
}

/* Photo on the right */
.about-entity .about-image {
  flex: 0 0 15em !important;
  order: 2 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Make photo perfectly round */
.about-entity .about-image img {
  border-radius: 50% !important;
  width: 15em !important;
  height: 15em !important;
  object-fit: cover !important;
  border: 4px solid var(--bs-light) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* Title and subtitle styling */
.about-entity .about-contents h1 {
  font-size: 2.5rem !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  margin-bottom: 0.5rem !important;
  text-align: left !important;
}

.about-entity .about-contents h2 {
  font-size: 1.2rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #141414 !important;
  margin-bottom: 2rem !important;
  text-align: left !important;
}

/* Override any default Quarto about template behavior */
.about-entity .about-image {
  position: relative !important;
  display: block !important;
}

/* Ensure the container uses horizontal layout */
@media screen and (min-width: 992px) {
  .about-entity {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
  }
  
  .about-entity .about-contents {
    width: auto !important;
    max-width: none !important;
  }
  
  .about-entity .about-image {
    width: 15em !important;
    min-width: 15em !important;
  }
}

/* Learn more link */
.content-block .about-links {
  font-size: 1rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--bs-primary);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: border-color 0.3s ease;
}

.content-block .about-links:hover {
  border-bottom-color: var(--bs-primary);
}

/* subtitle + Learn More About Me */
.subtitle {
  font-family: "Petrona";
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

/* heading, subtitle, and blurb */
.entity-contents {
  text-align: right !important;
  padding: 0 2em 0 2em;
}

/* blurb */
.about-contents {
  padding: 0 0 0 2em !important;
}

/* social links: block of links */
.about-entity .about-links {
  justify-content: flex-end !important;
  column-gap: 0em !important;
  font-size: 1.1rem !important;
}

/* social links: individual links */
.about-entity .about-link {
  padding: 0.25em 0.25em !important;
  border: none !important;  
}

/* Learn More About Me */
.about-links.subtitle {
  font-size: 1.1rem !important;
  font-family: "Red Hat Text";
  justify-content: flex-end !important;
}

/* image */
.about-image {
  margin-top: -2em;
  padding: 0 2em 0em 0;
}

/* // Home

// social links
.about-entity {
  // block of links
  .about-links {
    column-gap: 0em !important;
    font-size: 1.2em;
  }
  // individual links
  .about-link {
    padding: 0.25em 0.25em !important;
    border: none !important;
  }
} */

/* mobile query up for screens up to ~992px wide */
@media screen and (max-width: 991.98px) {
    /* move text up & center */
    .entity-contents {
      order: 2 !important;
      margin: -4em 0 0 0 !important;
      padding: 0 0 0 0em !important;
      text-align: center !important;
    }

    /* center subtitle */
    .subtitle {
      text-align: center !important;
    }

    /* social links: block of links */
    .about-entity .about-links {
      justify-content: center !important;
      font-size: 1rem !important;
    }

    /* blurb */
    .about-contents {
      padding: 0 0 0 0em !important;
    }

    /* center Learn More About Me */
    .about-links.subtitle {
      justify-content: center !important;
    }

    /* move image up, adjust padding */
    .about-image {
      order: 1 !important;
      padding: 0 2em 0 2em !important;
    }
}

/* Section separator line */
.section-separator {
  max-width: 1400px !important;
  width: 100% !important;
  margin: 4rem auto !important;
  padding: 0 2rem !important;
  position: relative;
}

.section-separator::before {
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background: linear-gradient(to right, transparent, #d0d0d0 20%, #d0d0d0 80%, transparent);
  margin: 0 auto;
}

/* Column screen container */
.column-screen {
  max-width: 1400px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 2rem !important;
}

/* Content container */
.content-container {
  max-width: 1400px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 2rem !important;
}

/* Research intro section */
.research-intro {
  max-width: 1400px !important;
  width: 100% !important;
  margin: 2rem auto 3rem !important;
  padding: 0 2rem !important;
  text-align: left;
  font-size: 1.1rem;
  line-height: 1.7;
  color: #4a4a4a;
}

/* Override any Quarto/Bootstrap container constraints */
body .research-intro,
html .research-intro,
.quarto-container .research-intro,
#quarto-content .research-intro,
.page-layout-article .research-intro,
.page-layout-full .research-intro,
.column-body .research-intro,
.column-page .research-intro,
.container .research-intro,
.container-fluid .research-intro,
.row .research-intro {
  max-width: 1400px !important;
  width: 100% !important;
}

.research-intro p {
  margin-bottom: 1.5rem;
}

/* Style for the left column in research-intro */
.research-intro .column:first-child {
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.6;
  padding-right: 3rem;
}

/* Preserve original column widths on desktop */
.research-intro .column[style*="width: 30%"] {
  width: 30% !important;
}

.research-intro .column[style*="width: 5%"] {
  width: 5% !important;
}

.research-intro .column[style*="width: 65%"] {
  width: 65% !important;
}

.featured-section .column[style*="width: 30%"] {
  width: 30% !important;
}

.featured-section .column[style*="width: 20%"] {
  width: 20% !important;
}

.featured-section .column[style*="width: 50%"] {
  width: 50% !important;
}

/* Add gap between columns in research-intro */
.research-intro .columns {
  column-gap: 0rem;
}

/* General responsive column behavior - preserve original desktop layout */
.research-intro .columns,
.featured-section .columns {
  display: flex;
  align-items: flex-start;
}

/* Ensure columns maintain proper spacing */
.research-intro .column,
.featured-section .column {
  box-sizing: border-box;
}

/* Ensure columns don't overflow on smaller screens */
@media screen and (max-width: 1200px) {
  .research-intro .columns {
    column-gap: 5rem;
  }
}

@media screen and (max-width: 768px) {
  .research-intro .columns {
    column-gap: 2rem;
  }
}

/* Research cards container */
.research-cards {
  max-width: 1400px !important;
  width: 100% !important;
  margin: 0 auto 6rem !important;
  padding: 0 2rem !important;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.5rem;
  align-items: stretch;
}

/* Override any Quarto/Bootstrap container constraints for cards */
body .research-cards,
html .research-cards,
.quarto-container .research-cards,
#quarto-content .research-cards,
.page-layout-article .research-cards,
.page-layout-full .research-cards,
.column-body .research-cards,
.column-page .research-cards,
.container .research-cards,
.container-fluid .research-cards,
.row .research-cards {
  max-width: 1400px !important;
  width: 100% !important;
}

/* Individual research card */
.research-card {
  background-color: #f8f9fa;
  border-radius: 20px;
  padding: 0 2rem 1rem 2rem;
  text-align: left;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  display: flex;
  flex-direction: column;
  min-height: 280px;
}

.research-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
}

/* Card images */
.card-image {
  width: 100%;
  height: 200px;
  object-fit: contain;
  margin-bottom: 0rem;
  opacity: 0.8;
}

/* Card-specific colors */
.research-card.card-3 {
  background-color: #c4ecef; /* Light purple - Computational Neuroscience card */
}

.research-card.card-1 {
  background-color: #f5e9fa; /* Warm beige - Machine Learning card */
}

.research-card.card-2 {
  background-color: #c1e0e5 /* Soft teal - Medical Image Analysis card */
}

/* Card titles */
.card-title {
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 1rem;
  color: #502c2c;
  line-height: 1.3;
}

/* Card text */
.research-card p {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.6;
  color: #5a5a5a;
  margin: 1.5rem 0 0 0;
  flex-grow: 1;
  text-align: center;
}

body.quarto-dark .research-card p {
  color: #5a5a5a !important;
}

/* Mobile responsive design for vertical layout */
@media screen and (max-width: 768px) {
    .hero-banner {
        margin-bottom: 2rem;
        padding: 1rem;
    }
    
    .banner-image {
        max-width: 600px;
    }
    
    .hero-content-center {
        padding: 0 1rem 2rem;
    }
    
    .section-separator {
        margin: 2rem auto;
        padding: 0 1rem;
    }
    
    .research-intro {
        margin: 1.5rem auto 2rem;
        padding: 0 1rem;
        font-size: 1rem;
    }
    
    /* Mobile responsive columns - stack vertically ONLY on mobile */
    .research-intro .columns {
        flex-direction: column !important;
        column-gap: 0 !important;
        align-items: center !important;
    }
    
    .research-intro .column {
        width: 100% !important;
        padding: 0 !important;
        margin-bottom: 1.5rem !important;
        text-align: center !important;
    }
    
    /* Center the left column text on mobile */
    .research-intro .column:first-child {
        text-align: center !important;
        font-size: 1.2rem !important;
        padding-right: 0 !important;
    }
    
    /* Mobile responsive featured section columns */
    .featured-section .columns {
        flex-direction: column !important;
        column-gap: 0 !important;
        align-items: center !important;
    }

    /* Make the research intro paragraph larger on mobile */
    .research-intro .column:first-child {
        font-size: 1.8rem !important;
        line-height: 1.6 !important;
    }
    
    
    .featured-section .column {
        width: 100% !important;
        padding: 0 !important;
        margin-bottom: 1rem !important;
        text-align: center !important;
    }
    
    /* Center the "Featured" title on mobile */
    .featured-section .column:first-child {
        text-align: center !important;
        margin-bottom: 1.5rem !important;
        font-size: 1.8rem !important;
    }
    
    .research-cards {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 0 1rem;
        margin-bottom: 4rem;
    }
    
    .research-card {
        padding: 2rem 1.5rem;
        min-height: auto;
    }
    
    .hero-content-center h1 {
        font-size: 2.5rem;
    }
    
    .hero-content-center h2 {
        font-size: 1.1rem;
    }
    
    .research-description {
        font-size: 1.3rem;
        line-height: 1.7;
    }
}

/* Tablet responsive design */
@media screen and (max-width: 1200px) and (min-width: 768px) {
    .research-cards {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }
    
    .research-card.card-3 {
        grid-column: 1 / -1;
        max-width: 50%;
        margin: 0 auto;
    }
}

/* Medium screen adjustments - keep horizontal layout but reduce gaps */
@media screen and (max-width: 991.98px) and (min-width: 769px) {
    .research-intro .columns {
        column-gap: 2rem;
    }
    
    .featured-section .columns {
        column-gap: 1rem;
    }
        
    .hiring-section .columns {
      column-gap: 1rem;
  }
}

@media screen and (max-width: 576px) {
    .hero-banner {
        padding: 0.5rem;
    }
    
    .banner-image {
        max-width: 400px;
    }
    
    .hero-content-center h1 {
        font-size: 2.2rem;
    }
    
    .hero-content-center h2 {
        font-size: 1rem;
    }
    
    .research-description {
        font-size: 1.2rem;
    }
    
    /* Extra small screen column adjustments */
    .research-intro .column:first-child {
      font-size: 1.6rem !important;
      line-height: 1.7 !important;
    }
    
    .featured-section .column:first-child {
        font-size: 1.5rem !important;
    }
}

/* Featured Section Styles */
.featured-section {
    max-width: 1400px !important;
    width: 100% !important;
    margin: 10rem auto 2rem auto;
    padding: 0 2rem;
    background-color: inherit !important;
}

/* Dark mode featured section */
body.quarto-dark .featured-section,
body.quarto-dark .featured-items,
body.quarto-dark .featured-item {
    background-color: #141414 !important;
}

body.quarto-dark .featured-item {
    border-bottom-color: #404040 !important;
}

body.quarto-dark .featured-link {
    color: #ede8de !important;
}

body.quarto-dark .featured-link:hover {
    color: #3498db !important;
}

body.quarto-dark .featured-meta {
    color: #adb5bd !important;
}

body.quarto-dark .featured-type {
    background-color: #1a1a1a !important;
    color: #ede8de !important;
}

/* Override any parent container constraints for featured section */
body .featured-section,
html .featured-section,
.quarto-container .featured-section,
#quarto-content .featured-section,
.page-layout-article .featured-section,
.page-layout-full .featured-section,
.column-body .featured-section,
.column-page .featured-section,
.container .featured-section,
.container-fluid .featured-section,
.row .featured-section {
    max-width: 1400px !important;
    width: 100% !important;
}

.featured-section h2 {
    font-size: 2.5rem;
    font-weight: 700;
    color: #2c3e50;
    margin-bottom: 0;
    margin-top: -1rem;
    line-height: 1.2;
}

body.quarto-dark .featured-section h2 {
    color: #ede8de;
}

.featured-items {
    display: flex;
    flex-direction: column;
    gap: 0rem;
}

.featured-item {
    border-bottom: 1px solid #e9ecef;
    padding-bottom: 1rem;
}

.featured-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

body.quarto-dark .featured-item {
    border-bottom-color: #404040;
}

.featured-link {
    font-size: 1.3rem;
    font-weight: 600;
    color: #2c3e50 !important;
    text-decoration: none;
    display: block;
    margin-bottom: 0.5rem;
    transition: color 0.2s ease;
}

.featured-link:hover {
    color: #3498db !important;
    text-decoration: none;
}

body.quarto-dark .featured-link {
    color: #ede8de !important;
}

body.quarto-dark .featured-link:hover {
    color: #3498db !important;
}

.featured-meta {
    font-size: 1rem;
    color: #6c757d;
    margin-top: 0.3rem;
}

body.quarto-dark .featured-meta {
    color: #adb5bd;
}

.featured-type {
    background-color: #f8f9fa;
    color: #495057;
    padding: 0.2rem 0.6rem;
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

body.quarto-dark .featured-type {
    background-color: #404040;
    color: #ede8de;
}

/* Responsive adjustments for featured section */
@media (max-width: 768px) {
    .featured-section {
        margin: 5rem auto 1rem auto;
        padding: 0 1rem;
    }
    
    .featured-section .columns {
        flex-direction: column;
    }
    
    .featured-section h2 {
        font-size: 2rem;
        margin-bottom: 1.5rem;
        text-align: center;
    }
    
    .featured-link {
        font-size: 1.2rem;
    }
    
    .featured-items {
        gap: 0rem;
    }
}

/* Hiring Section Styles */
.hiring-section {
    max-width: 1400px !important;
    width: 100% !important;
    margin: 8rem auto 2rem auto;
    padding: 0 2rem;
    background-color: inherit !important;
}

/* Dark mode hiring section */
body.quarto-dark .hiring-section,
body.quarto-dark .hiring-items,
body.quarto-dark .hiring-item {
    background-color: #141414 !important;
}

body.quarto-dark .hiring-item {
    border-bottom-color: #404040 !important;
}

body.quarto-dark .hiring-link {
    color: #ede8de !important;
}

body.quarto-dark .hiring-link:hover {
    color: #3498db !important;
}

body.quarto-dark .hiring-meta {
    color: #adb5bd !important;
}

body.quarto-dark .hiring-type {
    background-color: #1a1a1a !important;
    color: #ede8de !important;
}

/* Override any parent container constraints for hiring section */
body .hiring-section,
html .hiring-section,
.quarto-container .hiring-section,
#quarto-content .hiring-section,
.page-layout-article .hiring-section,
.page-layout-full .hiring-section,
.column-body .hiring-section,
.column-page .hiring-section,
.container .hiring-section,
.container-fluid .hiring-section,
.row .hiring-section {
    max-width: 1400px !important;
    width: 100% !important;
}

.hiring-section h2 {
    font-size: 2.5rem;
    font-weight: 700;
    color: #2c3e50;
    margin-top: -1rem;
    margin-bottom: 0;
    line-height: 1.2;
}

body.quarto-dark .hiring-section h2 {
    color: #ede8de;
}

.hiring-items {
    display: flex;
    flex-direction: column;
    gap: 0rem;
}

.hiring-item {
    border-bottom: 1px solid #e9ecef;
    padding-bottom: 1rem;
}

.hiring-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

body.quarto-dark .hiring-item {
    border-bottom-color: #404040;
}

.hiring-link {
    font-size: 1.3rem;
    font-weight: 600;
    color: #2c3e50 !important;
    text-decoration: none;
    display: block;
    margin-bottom: 0.5rem;
    transition: color 0.2s ease;
}

.hiring-link:hover {
    color: #3498db !important;
    text-decoration: none;
}

body.quarto-dark .hiring-link {
    color: #ede8de !important;
}

body.quarto-dark .hiring-link:hover {
    color: #3498db !important;
}

.hiring-meta {
    font-size: 1rem;
    color: #6c757d;
    margin-top: 0.3rem;
}

body.quarto-dark .hiring-meta {
    color: #adb5bd;
}

.hiring-type {
    background-color: #f8f9fa;
    color: #495057;
    padding: 0.2rem 0.6rem;
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

body.quarto-dark .hiring-type {
    background-color: #404040;
    color: #ede8de;
}

/* Responsive adjustments for hiring section */
@media (max-width: 768px) {
    .hiring-section {
        margin: 3rem auto 1rem auto;
        padding: 0 1rem;
    }
    
    .hiring-section .columns {
      flex-direction: column !important;
      column-gap: 0 !important;
      align-items: center !important;
  }
  
  .hiring-section .column {
      width: 100% !important;
      padding: 0 !important;
      margin-bottom: 1rem !important;
      text-align: center !important;
  }
  
  /* Center the "Vacancies" title on mobile */
  .hiring-section .column:first-child {
      text-align: center !important;
      margin-bottom: 1.5rem !important;
      font-size: 1.8rem !important;
  }
    
    .hiring-link {
        font-size: 1.2rem;
    }
    
    .hiring-items {
        gap: 0rem;
    }
}

/* Extra small screen column adjustments for hiring section */
@media screen and (max-width: 576px) {
  .hiring-section .column:first-child {
      font-size: 1.5rem !important;
  }
}

/* Dark theme pagination fixes */
body.quarto-dark .pagination .page-item .page-link {
  color: #ede8de !important;
  background-color: transparent !important;
  border-color: #ede8de !important;
}

body.quarto-dark .pagination .page-item .page-link:hover {
  color: #141414 !important;
  background-color: #ede8de !important;
  border-color: #ede8de !important;
}

body.quarto-dark .pagination .page-item.active .page-link {
  color: #141414 !important;
  background-color: #ede8de !important;
  border-color: #ede8de !important;
}

body.quarto-dark .pagination .page-item.disabled .page-link {
  color: #666 !important;
  background-color: transparent !important;
  border-color: #666 !important;
}