/* ═══════════════════════════════════════════════
   sitemap-page.css
═══════════════════════════════════════════════ */

.sm-container {
  max-width: 900px;
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}

/* ── Small navbar ─────────────────────────────── */
.navbar-sm {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(6,15,9,.85);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(34,197,94,.12);
}
.navbar-sm__inner {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  max-width: 900px; margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
  height: 62px;
}
.navbar-sm__actions { display: flex; align-items: center; gap: .75rem; }
.btn-sm-back {
  font-family: var(--font-body); font-size: .85rem;
  color: rgba(255,255,255,.55); transition: color .2s;
}
.btn-sm-back:hover { color: var(--g400); }

/* ── Hero ─────────────────────────────────────── */
.sitemap-main { padding-top: 62px; }
.sitemap-hero {
  position: relative; overflow: hidden;
  padding: 4rem 0 3rem;
  background-image:
    linear-gradient(rgba(34,197,94,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(34,197,94,.03) 1px, transparent 1px);
  background-size: 48px 48px;
}
.sitemap-hero__blob {
  position: absolute; width: 500px; height: 300px;
  background: radial-gradient(ellipse, rgba(34,197,94,.09) 0%, transparent 70%);
  top: -50px; right: -100px; pointer-events: none;
}
.sitemap-hero__h1 {
  font-family: var(--font-display);
  font-size: clamp(2rem, 5vw, 3.2rem);
  font-weight: 900; line-height: 1.1;
  margin-block: .75rem 1rem;
}
.sitemap-hero__sub {
  color: var(--text-2); font-size: 1rem; line-height: 1.7;
  max-width: 480px; margin-bottom: 1.5rem;
}
.xml-link {
  display: inline-flex; align-items: center; gap: .45rem;
  font-family: var(--font-mono); font-size: .75rem;
  color: var(--g400); background: rgba(34,197,94,.08);
  border: 1px solid rgba(34,197,94,.25);
  padding: .4rem .9rem; border-radius: 99px;
  transition: background .2s;
}
.xml-link:hover { background: rgba(34,197,94,.16); }

/* ── Body ─────────────────────────────────────── */
.sitemap-body { padding-block: 3rem 5rem; }
.sitemap-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  margin-bottom: 2.5rem;
}

/* ── Section card ─────────────────────────────── */
.smap-section {
  background: rgba(34,197,94,.04);
  border: 1px solid rgba(34,197,94,.14);
  border-radius: 1.25rem;
  overflow: hidden;
}
.smap-section__header {
  display: flex; align-items: center; gap: .75rem;
  padding: 1.1rem 1.5rem;
  border-bottom: 1px solid rgba(34,197,94,.1);
  background: rgba(34,197,94,.03);
}
.smap-section__header h2 {
  font-family: var(--font-display);
  font-size: 1rem; font-weight: 700;
}
.smap-section__icon {
  width: 34px; height: 34px; border-radius: .6rem;
  background: rgba(34,197,94,.1); border: 1px solid rgba(34,197,94,.2);
  display: flex; align-items: center; justify-content: center;
  color: var(--g400); flex-shrink: 0;
}

/* ── Sitemap list ─────────────────────────────── */
.smap-list {
  padding: .5rem 0;
}
.smap-list li + li {
  border-top: 1px solid rgba(34,197,94,.06);
}
.smap-link {
  display: flex; align-items: center; gap: .75rem;
  padding: .75rem 1.5rem;
  transition: background .2s;
  flex-wrap: wrap;
}
.smap-link:hover {
  background: rgba(34,197,94,.05);
}
.smap-link--parent {
  font-weight: 600;
}
.smap-link--child {
  padding-left: 2.5rem;
}
.smap-link--child::before {
  content: '';
  display: block; width: 14px; height: 1.5px;
  background: rgba(34,197,94,.35);
  flex-shrink: 0;
  margin-left: -1rem;
}
.smap-link__name {
  font-size: .9rem; color: var(--text);
  transition: color .2s; flex-shrink: 0;
}
.smap-link:hover .smap-link__name { color: var(--g400); }
.smap-link__url {
  font-family: var(--font-mono); font-size: .7rem;
  color: rgba(255,255,255,.3); margin-left: auto;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.smap-link__badge {
  font-family: var(--font-mono); font-size: .65rem;
  background: rgba(34,197,94,.12); color: var(--g400);
  border: 1px solid rgba(34,197,94,.25);
  padding: .15rem .5rem; border-radius: 99px;
  flex-shrink: 0;
}
.smap-empty {
  padding: 1rem 1.5rem;
  font-size: .875rem; color: var(--text-3); font-style: italic;
}

/* ── Stats row ────────────────────────────────── */
.sitemap-stats {
  display: flex; gap: 1.5rem;
  padding: 1.5rem; justify-content: center;
  background: rgba(34,197,94,.03);
  border: 1px solid rgba(34,197,94,.1);
  border-radius: 1rem;
  flex-wrap: wrap;
}
.sstat { text-align: center; }
.sstat__n {
  display: block;
  font-family: var(--font-display); font-size: 2rem; font-weight: 900;
  color: var(--g400); line-height: 1;
  text-shadow: 0 0 24px rgba(34,197,94,.4);
}
.sstat__l {
  display: block;
  font-family: var(--font-mono); font-size: .72rem;
  color: rgba(255,255,255,.4); margin-top: .3rem;
}

/* ── Footer ───────────────────────────────────── */
.sitemap-footer {
  border-top: 1px solid rgba(34,197,94,.1);
  padding-block: 1.75rem;
}
.sitemap-footer p {
  font-family: var(--font-mono); font-size: .72rem;
  color: rgba(255,255,255,.2); text-align: center;
}
.sitemap-footer a {
  color: rgba(34,197,94,.5); transition: color .2s;
}
.sitemap-footer a:hover { color: var(--g400); }

/* ── Responsive ───────────────────────────────── */
@media (min-width: 640px) {
  .sitemap-grid { grid-template-columns: 1fr 1fr; }
  .smap-section:first-child { grid-column: 1 / -1; }
}
@media (min-width: 900px) {
  .sitemap-grid { grid-template-columns: 1fr 1fr 1fr; }
  .smap-section:first-child { grid-column: auto; }
}