/* Run Have Fun Etc. — energetic running-blog theme (Tailwind v2 base)
   Palette: cream #FBFDF6, lime #8BC34A, coral #FF7043, forest ink #1F2A17 */

:root {
  --rh-bg: #FBFDF6;
  --rh-ink: #1F2A17;
  --rh-text: #2E2E2E;
  --rh-lime: #8BC34A;
  --rh-lime-dark: #6ea23a;
  --rh-coral: #FF7043;
  --rh-subtle: #E4EAD9;
}

body {
  background: var(--rh-bg);
  color: var(--rh-text);
  font-family: 'Nunito', system-ui, sans-serif;
  font-size: 1.05rem; line-height: 1.7;
}

h1, h2, h3, h4, .wordmark {
  font-family: 'Poppins', 'Nunito', sans-serif;
  color: var(--rh-ink); font-weight: 800; line-height: 1.15;
}
h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); }
h2 { font-size: 1.9rem; }
h3 { font-size: 1.4rem; }

a { color: var(--rh-ink); }
a:hover { color: var(--rh-lime-dark); }

.container-wide { max-width: 1100px; margin-inline: auto; padding-inline: 1rem; }

/* ---------- Header ---------- */
.site-header { position: sticky; top: 0; z-index: 50; background: var(--rh-bg); border-bottom: 3px solid var(--rh-lime); }
.site-header .wordmark { font-size: 1.5rem; color: var(--rh-ink); }
.site-header a.navlink {
  font-family: 'Poppins', sans-serif; font-weight: 700; color: var(--rh-ink);
  padding: 0.4rem 0.85rem; border-radius: 999px; display: inline-block;
}
.site-header a.navlink:hover { background: var(--rh-lime); color: #fff; }
.nav-dd { position: relative; }
.nav-dd > .nav-dd-menu {
  display: none; position: absolute; top: 100%; left: 0; z-index: 60; min-width: 230px;
  background: var(--rh-bg); border: 1px solid var(--rh-subtle); border-radius: 8px; padding: 0.4rem 0;
}
.nav-dd:hover > .nav-dd-menu, .nav-dd:focus-within > .nav-dd-menu { display: block; }
.nav-dd-menu a { display: block; padding: 0.45rem 1rem; border-radius: 0; }
.nav-dd-menu a:hover { background: var(--rh-lime); color: #fff; }

/* ---------- Hero ---------- */
.rh-hero {
  background: linear-gradient(120deg, var(--rh-lime), var(--rh-ink));
  color: #fff; text-align: center; padding: 3.5rem 1rem; border-radius: 0 0 12px 12px;
}
.rh-hero h1 { color: #fff; }
.rh-hero .tagline { font-family: 'Poppins'; font-weight: 600; opacity: 0.95; }

/* ---------- Tags & buttons ---------- */
.tag-lime {
  display: inline-block; background: var(--rh-lime); color: #fff;
  font-family: 'Poppins'; font-weight: 700; font-size: 0.72rem; text-transform: uppercase;
  letter-spacing: 0.05em; padding: 0.18rem 0.6rem; border-radius: 999px;
}
.read-more { color: var(--rh-coral); font-weight: 700; }
.read-more:hover { color: var(--rh-lime-dark); }

/* ---------- Cards ---------- */
.rh-card {
  background: #fff; border: 1px solid var(--rh-subtle); border-radius: 12px; overflow: hidden;
  box-shadow: 0 4px 14px rgba(0,0,0,.05); transition: transform .2s ease, box-shadow .2s ease;
  display: flex; flex-direction: column;
}
.rh-card:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(0,0,0,.10); }
.rh-card img { width: 100%; aspect-ratio: 16/10; object-fit: cover; }
.rh-card .body { padding: 1rem 1.1rem 1.25rem; }
.rh-card h3 a:hover { color: var(--rh-lime-dark); }

/* ---------- Article / prose ---------- */
.prose-body { max-width: 46rem; margin-inline: auto; line-height: 1.75; }
.prose-body img, .prose img { max-width: 100%; height: auto; border-radius: 10px; margin-block: 1.1rem; }
.prose a, .prose-body a { color: var(--rh-lime-dark); text-decoration: underline; text-decoration-color: var(--rh-lime); }
.prose a:hover { color: var(--rh-coral); }
.article-meta { color: var(--rh-coral); font-family: 'Poppins'; font-weight: 700; font-size: 0.85rem; }
.article-lead { font-size: 1.15rem; color: #4A4A4A; border-left: 4px solid var(--rh-lime); padding-left: 1rem; }
.toc-top { border: 1px solid var(--rh-subtle); background: #fff; border-radius: 10px; padding: 0.8rem 1rem; margin-bottom: 1.5rem; }
.toc-top ul { list-style: none; display: flex; flex-wrap: wrap; gap: 0.4rem 1.2rem; margin: 0.4rem 0 0; padding: 0; }

/* ---------- Gallery ---------- */
.rh-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px,1fr)); gap: 0.6rem; }
.rh-gallery img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; }

/* ---------- CTA ---------- */
.cta-band { background: var(--rh-coral); color: #fff; text-align: center; padding: 2.5rem 1rem; border-radius: 12px; margin-block: 2.5rem; }
.cta-band h2 { color: #fff; }

/* ---------- Footer ---------- */
.site-footer { background: var(--rh-ink); color: #cdd6c4; margin-top: 3rem; padding-block: 2.5rem; }
.site-footer .wordmark { color: #fff; }
.site-footer a { color: #cdd6c4; }
.site-footer a:hover { color: var(--rh-lime); }
.footer-copy { opacity: 0.7; font-size: 0.8rem; margin-top: 1.2rem; border-top: 1px solid rgba(255,255,255,.15); padding-top: 1rem; }

/* ---------- Tables & pagination ---------- */
table { border-collapse: collapse; width: 100%; }
table th, table td { border: 1px solid var(--rh-subtle); padding: 0.5rem 0.7rem; }
.rh-pagination { display: flex; gap: 0.5rem; flex-wrap: wrap; list-style: none; padding: 0; }
.rh-pagination a { border: 1px solid var(--rh-subtle); border-radius: 8px; padding: 0.3rem 0.8rem; }
.rh-pagination a:hover { background: var(--rh-lime); color: #fff; }

@media print { .site-header, .site-footer, .cta-band { display: none; } a { color: #000; } }