/* ---------- Base / fixes ---------- */
html, body {
  box-sizing: border-box;
}
*, *::before, *::after { box-sizing: inherit; }

/* Base background and text */
body {
  background-color: #ffffff;
  color: #333333;
  font-family: "Helvetica", Arial, sans-serif;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings Color */
h1, h2, h3, h4 {
  color: #4C7D31;
}

/* Paragraph justification */
.qmd-content p,
.article p,
.page p,
.content p,
.quarto-body p,
main p,
.container p,
.columns .column p {
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
  widows: 2;
  orphans: 2;
}

/* Lists also justified */
.qmd-content li,
.article li,
.page li {
  text-align: justify;
}

/* Navbar */
.navbar,
.navbar.navbar-default,
.site-navbar {
  background-color: #4C7D31;
  position: relative;
  z-index: 2000;
  overflow: visible;
}
.navbar a,
.site-navbar a {
  color: #ffffff !important;
}
.navbar a:hover,
.site-navbar a:hover {
  color: #cce0b3 !important;
}

.navbar .dropdown-menu .dropdown-item,
.site-navbar .dropdown-menu .dropdown-item {
  color: #ffffff !important;
  background-color: #4C7D31;
  padding: 0.5rem 1rem;
  white-space: nowrap;
  font-family: inherit;
  font-size: 1rem;
}

/* --- Custom Callout Styles --- */

.callout-red {
    /* Box appearance */
    border-left: 5px solid #E34A3E; /* A warning red for the left bar */
    background-color: #FEEBEA; /* Very light pink background */
    padding: 1.25rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.callout-red h2, .callout-red h3, .callout-red h4 {
    color: #A92C23; /* Darker red for the heading text */
    margin-top: 0 !important;
    margin-bottom: 0.5rem;
}

.callout-red p {
    color: #333333; /* Standard text color inside the box */
    margin-top: 0;
}

/* Links */
a { color: #4C7D31; text-decoration: none; }
a:hover { text-decoration: underline; }

/* Buttons */
.btn-primary {
  background-color: #4C7D31;
  border-color: #4C7D31;
  color: #ffffff;
}
.btn-primary:hover {
  background-color: #3e6627;
  border-color: #3e6627;
}

/* Logo header */
.logo-header {
  position: absolute;
  top: 18px;
  left: 18px;
  z-index: 1000;
}

/* Columns / partner logos */
.columns {
  display: flex !important;
  gap: 1rem;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
}
.columns .column {
  display: flex !important;
  justify-content: center;
  align-items: center;
  padding: 0.25rem;
}
.columns .column img {
  max-height: 110px;
  width: auto;
  object-fit: contain;
}

@media (max-width: 768px) {
  .columns .column img { max-height: 70px; }
  .columns { flex-wrap: wrap; }
}

/* Map card */
.map-card {
  background: #4C7D31;
  border-radius: 12px;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: flex-start;
  color: #ffffff;
}

.map-card .map-card-text {
  width: 100%;
  max-width: 100%;
}

.map-card .map-card-text p,
.map-card .map-card-text h3,
.map-card .map-card-text h4 { 
  color: #ffffff; 
  text-align: justify; 
  text-justify: inter-word; 
  hyphens: auto; 
}

.map-card .map-card-image {
  width: 100%;
  max-width: 100%;
}

.map-card .map-card-image .map-wrapper {
  border-radius: 8px;
  overflow: hidden;
}

.map-card .map-card-image img {
  display: block;
  width: 100%;
  border-radius: 8px;
  box-shadow: 0 0px 0px rgba(0,0,0,0.18);
}

@media (max-width: 900px) {
  .map-card {
    flex-direction: column;
  }
}

/* ========================================= */
/* SPACING & LAYOUT OVERRIDES           */
/* ========================================= */

/* 1. General Headings & Text (Global) */
h2, h3, h4 {
  margin-top: 1.5rem;     /* Tighten space before headers */
  margin-bottom: 0.5rem;  /* Keep headers close to text below */
}

p {
  margin-bottom: 1rem;
  margin-top: 0;
}

/* 2. Title Block (The Main Page Header) */
#title-block-header {
  margin-top: 0.5rem;           /* Close to navbar */
  margin-bottom: 0 !important;  /* No space below title container */
  padding-bottom: 0 !important; /* No padding inside title container */
}

#title-block-header .title {
  margin-bottom: 0;             /* Remove margin from the H1 text itself */
}

/* 3. Dates / Metadata Section */
#title-block-header .quarto-title-meta {
  margin-top: 0.5rem;               /* Slight gap from Title */
  margin-bottom: 0.5rem !important; /* Minimal gap before buttons */
}

/* 4. Solana Template Specifics (The Image/About Section) */
/* Removes the default container padding so it slides up to the header */
.quarto-about-solana {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Ensures the internal columns (Image and Text) start flush at top */
.quarto-about-solana .about-entity, 
.quarto-about-solana .about-contents {
  margin-top: 0 !important;
}

/* Ensures the first paragraph inside the About section has no top margin */
.quarto-about-solana .about-contents > :first-child {
  margin-top: 0 !important;
}

/* Removes extra space above the "Website/Github" buttons */
.quarto-about-solana .about-links {
  margin-top: 0 !important;
}