.contact-buttons{
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
  margin: 10px 0 0 0;
}

.contact-buttons .btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
}


.intro-justify p{
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
}

/* Justify paragraphs in the main page content */
#quarto-document-content p{
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
}

/* Optional: don't justify buttons/nav/headers/lists */
#quarto-document-content li,
#quarto-document-content h1,
#quarto-document-content h2,
#quarto-document-content h3,
#quarto-document-content h4{
  text-align: left;
}

/* colors */

/* --- Links same color as navbar (#2C3E50) --- */
#quarto-document-content a{
  color: #2C3E50;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

/* Optional: keep visited links consistent */
#quarto-document-content a:visited{
  color: #2C3E50;
}

#quarto-document-content h1,
#quarto-document-content h2,
#quarto-document-content h3,
#quarto-document-content h4{
  color: #2C3E50;
}

/* --- TOC styling (match #2C3E50) --- */
/* ===== Force TOC colors (kill the green) ===== */

/* Scope to the margin/sidebar TOC (Quarto) */
#quarto-margin-sidebar nav#TOC,
#quarto-margin-sidebar nav[role="doc-toc"],
.sidebar nav[role="doc-toc"]{
  --bs-link-color: #2C3E50 !important;
  --bs-link-hover-color: #1f2d3a !important;
  --bs-primary: #2C3E50 !important;   /* this usually controls the "active" accent */
}

/* Regular TOC links */
#quarto-margin-sidebar nav#TOC a,
#quarto-margin-sidebar nav[role="doc-toc"] a{
  color: #2C3E50 !important;
  text-decoration: none !important;
}

/* Hover */
#quarto-margin-sidebar nav#TOC a:hover,
#quarto-margin-sidebar nav[role="doc-toc"] a:hover{
  color: #1f2d3a !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* Active item (the green culprit) */
#quarto-margin-sidebar nav#TOC .toc-active > a,
#quarto-margin-sidebar nav[role="doc-toc"] .toc-active > a{
  color: #2C3E50 !important;
  font-weight: 600 !important;
  background: transparent !important;     /* removes any green fill */
  border-left: 3px solid #2C3E50 !important;
  padding-left: .6rem !important;
}

/* If your theme uses an "active" class directly */
#quarto-margin-sidebar nav#TOC a.active,
#quarto-margin-sidebar nav[role="doc-toc"] a.active{
  color: #2C3E50 !important;
  background: transparent !important;
}

/* ===== Buttons: readable hover/active (match #2C3E50) ===== */

/* Outline primary: default */
.btn-outline-primary{
  color: #2C3E50 !important;
  border-color: #2C3E50 !important;
}

/* Outline primary: hover + active + focus => dark background, WHITE text */
.btn-outline-primary:hover,
.btn-outline-primary:active,
.btn-outline-primary:focus{
  background-color: #2C3E50 !important;
  border-color: #2C3E50 !important;
  color: #ffffff !important;
}

/* Some themes put the active state on "show > .btn-outline-primary.dropdown-toggle" */
.show > .btn-outline-primary.dropdown-toggle{
  background-color: #2C3E50 !important;
  border-color: #2C3E50 !important;
  color: #ffffff !important;
}

/* Ensure icons inside buttons also turn white */
.btn-outline-primary:hover *,
.btn-outline-primary:active *,
.btn-outline-primary:focus *{
  color: #ffffff !important;
}

/* Optional: nicer focus ring */
.btn:focus{
  box-shadow: 0 0 0 .2rem rgba(44, 62, 80, 0.25) !important;
}

/* ===== TOC: kill the green "you are here" bar ===== */

/* Cover the common Quarto TOC containers */
#quarto-margin-sidebar nav[role="doc-toc"] a.active,
#quarto-margin-sidebar nav[role="doc-toc"] .toc-active > a,
#quarto-margin-sidebar nav#TOC a.active,
#quarto-margin-sidebar nav#TOC .toc-active > a{
  color: #2C3E50 !important;
  background: transparent !important;
  border-left: 3px solid #2C3E50 !important;          /* our bar */
  box-shadow: none !important;                         /* remove theme bar */
}

/* Some themes draw the bar with an inset shadow */
#quarto-margin-sidebar nav[role="doc-toc"] a.active,
#quarto-margin-sidebar nav[role="doc-toc"] .toc-active > a{
  box-shadow: inset 3px 0 0 #2C3E50 !important;        /* override if used */
}

/* Some themes draw the bar with a pseudo-element */
#quarto-margin-sidebar nav[role="doc-toc"] a.active::before,
#quarto-margin-sidebar nav[role="doc-toc"] .toc-active > a::before,
#quarto-margin-sidebar nav#TOC a.active::before,
#quarto-margin-sidebar nav#TOC .toc-active > a::before{
  background-color: #2C3E50 !important;
}

/* Ensure navbar content sits above the overlay */
.navbar .container,
.navbar .navbar-collapse {
  position: relative;
  z-index: 1;
}


.quote,
.quote p,
.quote blockquote {
  text-align: center !important;
}

.quote {
  margin: 3rem auto 2rem;
  max-width: 760px;

  font-style: italic;
  font-size: 0.95rem;
  line-height: 1.6;
  color: rgba(0,0,0,.65);
}

/* Remove default margins that can make it look "off-center" */
.quote p {
  margin: 0.25rem 0;
}

.btn i.bi {
  margin-right: 0.4rem;
  vertical-align: -0.1em;
}


/* keywords */

/* Tag cloud container */
.tag-cloud{
  display: flex;
  flex-wrap: wrap;
  max-width: 900px;
  margin: 1.5rem 0 2rem;

  /* forces true row spacing */
  line-height: 2rem; /* increases distance between rows */
}

/* Make tags closer horizontally + control vertical rhythm */
.tag-cloud .tag{
  margin-right: 0.35rem;   /* closer keywords */
  margin-bottom: 0.9rem;   /* modest bottom gap */
}


.tag {
  font-size: 0.85rem;
  padding: 0.22rem 0.6rem;     /* slightly tighter */
  border-radius: 999px;
  background: rgba(44, 62, 80, 0.08);
  color: #2C3E50;
  font-weight: 400;            /* 300 is very light; 400 reads cleaner */
  line-height: 1.4;            /* better vertical balance */
  white-space: nowrap;

  transition: transform 0.15s ease, background-color 0.15s ease;
}

.tag:hover{
  transform: translateY(-1px);
  background: rgba(44, 62, 80, 0.15);
}