/* AI24_GEO87A_EDITORIAL_DESIGN | isolated preview only */
:root {
  --geo-forest: #123e32;
  --geo-green: #087b51;
  --geo-deep: #0b3026;
  --geo-ink: #18392e;
  --geo-muted: #61776d;
  --geo-edge: #dce9e2;
  --geo-bg: #f7faf8;
  --geo-cream: #f2f6f3;
}
html { scroll-behavior: smooth; }
body { background: var(--geo-bg); color: var(--geo-ink); }
/* Preserve the accepted original video and Joomla navigational mechanisms. */
.nav-shell {
  background: rgb(251 253 252 / 86%) !important;
  border-bottom: 1px solid rgb(217 231 221 / 80%) !important;
  backdrop-filter: saturate(1.25) blur(18px) !important;
  -webkit-backdrop-filter: saturate(1.25) blur(18px) !important;
  box-shadow: 0 6px 20px rgba(20,65,44,.045) !important;
}
.nav-shell .nav a { transition: color .18s ease, background .18s ease; }
.nav-shell .nav a:hover, .nav-shell .nav a:focus-visible { color: #087b51 !important; }
/* Spacious editorial section rhythm. */
.section { padding-block: clamp(36px, 4.4vw, 74px) !important; }
.section .wrap, .stats .wrap { width: min(1200px, calc(100% - 44px)); margin-inline: auto; }
.section-head { display: flex; align-items: end; gap: 24px; margin-bottom: 26px !important; }
.section-head h2,
.section h2,
.stats h2 {
  font-weight: 720 !important;
  font-size: clamp(24px, 2.1vw, 34px) !important;
  line-height: 1.13 !important;
  text-transform: none !important;
  letter-spacing: -.035em !important;
}
.section-head .view-all { text-underline-offset: 5px; font-size: 14px !important; }
/* Statistics: light editorial panel with genuine visual emphasis, no fake counts. */
.stats {
  position: relative;
  isolation: isolate;
  background: linear-gradient(116deg,#eff7f2 0%,#f9fbf9 56%,#e6f2ea 100%) !important;
  padding: clamp(54px, 6vw, 95px) 0 !important;
  color: var(--geo-ink) !important;
  overflow: hidden;
}
.stats::before {
  content: ""; position: absolute; z-index: -1;
  right: -100px; top: -170px; width: 430px; height: 430px; border-radius: 50%;
  border: 1px solid rgba(21,111,73,.15);
  box-shadow: 0 0 0 70px rgba(22,112,72,.025), 0 0 0 145px rgba(22,112,72,.02);
  pointer-events: none;
}
.stats h2 {
  color: var(--geo-deep) !important;
  margin: 0 0 32px !important;
}
.stats-grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 14px !important; align-items: stretch !important; }
.stats-grid > * {
  position: relative;
  display: flex !important; flex-direction: column !important;
  justify-content: space-between !important; align-items: flex-start !important;
  text-align: left !important; min-height: 228px !important;
  background: rgba(255,255,255,.95) !important;
  border: 1px solid rgba(203,225,211,.88) !important;
  box-shadow: 0 12px 35px rgba(13,65,40,.06) !important;
  border-radius: 20px !important; margin: 0 !important;
  padding: 30px 26px !important; overflow: hidden;
  color: #3b5749 !important; font-size: clamp(13px,1.08vw,15px) !important;
  line-height: 1.45 !important; letter-spacing: 0 !important; font-weight: 520 !important;
  transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease;
}
.stats-grid > *::before { content: ""; position: absolute; left: 25px; bottom: 0; width: 46px; height: 3px; border-radius: 4px; background: #22a56b; }
.stats-grid > * strong {
  display: block !important; order: -1; margin: 0 0 23px !important;
  color: var(--geo-green) !important; font-weight: 760 !important;
  font-size: clamp(44px,4.7vw,68px) !important; line-height: 1 !important;
  font-variant-numeric: tabular-nums; letter-spacing: -.06em;
}
.stats-grid > *:hover { transform: translateY(-5px); box-shadow: 0 18px 38px rgba(13,65,40,.1) !important; border-color: #b1d8c1 !important; }
/* News becomes a visual reading surface with larger readable typography. */
.news { background: #fff !important; }
.news .news-grid > *,
.news .card,
.news article {
  background: #fff !important; border: 1px solid var(--geo-edge) !important;
  border-radius: 18px !important; box-shadow: 0 8px 30px rgba(23,60,43,.045) !important;
  padding: 19px !important;
  transition: transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.news .news-grid > *:hover,
.news .card:hover,
.news article:hover { border-color:#bcdbc9 !important; transform: translateY(-3px); box-shadow: 0 16px 36px rgba(23,60,43,.085) !important; }
.news strong, .news .card > span:nth-child(2), .news a { font-size: 15px !important; line-height: 1.48 !important; }
.news time { font-size: 12px !important; color:#708377 !important; }
.news img { width: 76px !important; height: 76px !important; object-fit: cover !important; border-radius: 13px !important; }
/* Activities: visual rhythm, accent backgrounds and real, unchanged content. */
.activities, .directions { background: #f8fbf9 !important; }
.activities .card-grid, .activities .cards,
.directions .card-grid { gap: 15px !important; }
.activities .card, .directions .card,
.section:not(.resources):not(.news) .card {
  background: #fff !important; color: var(--geo-ink) !important;
  border-radius: 16px !important; border: 1px solid #e0ebe4 !important;
  box-shadow: 0 7px 24px rgba(10,49,31,.035) !important;
  min-height: 130px !important;
  padding: 26px 22px !important;
  font-size: 16px !important; line-height: 1.48 !important;
  transition: transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.activities .card:hover, .directions .card:hover,
.section:not(.resources):not(.news) .card:hover { transform: translateY(-4px); border-color: #98cdb0 !important; box-shadow: 0 16px 34px rgba(10,49,31,.085) !important; }
/* Resource links: larger labels, no made-up icon identity. */
.resources { background:#fff !important; }
.resource-grid { gap: 15px !important; }
.resource-grid > a {
  background: #f8fbf9 !important; border: 1px solid #e0ebe4 !important;
  border-radius: 18px !important; min-height: 136px !important;
  padding: 20px !important; gap: 16px !important;
  box-shadow: 0 8px 25px rgba(11,50,34,.035) !important;
  transition: transform .22s ease, box-shadow .22s ease;
}
.resource-grid > a:hover { transform: translateY(-4px); box-shadow: 0 15px 32px rgba(11,50,34,.085) !important; }
.resource-grid .resource-title, .resource-grid span { font-size: 15px !important; line-height: 1.45 !important; }
.resource-grid img { width: 54px !important; height: 54px !important; object-fit: contain !important; }
/* Footer consistent with editorial layout */
.footer { background: #eaf2ed !important; color:#284c3c !important; padding-top: 42px !important; }
.footer .wrap { width: min(1200px, calc(100% - 44px)); }
.footer a { text-underline-offset: 4px; }
/* Small transitions only; no content invisibility on older browsers. */
@media (max-width: 950px) {
  .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .stats-grid > * { min-height: 195px !important; }
}
@media (max-width: 600px) {
  .section .wrap,.stats .wrap,.footer .wrap { width: min(100% - 28px,1200px); }
  .stats-grid { grid-template-columns: 1fr !important; }
  .stats-grid > * { min-height: 145px !important; padding: 22px !important; }
  .stats-grid > * strong { font-size: 46px !important; margin-bottom: 16px !important; }
  .section-head { align-items: flex-start; }
}
/* Do not override high-contrast user choices or motion preferences. */
@media (prefers-reduced-motion: reduce) {
  *, *::before,*::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
html.ai24-v27-dark .stats, html.ai24-v27-light .stats,
html.ai24-v27-dark .stats-grid > *, html.ai24-v27-light .stats-grid > * {
  background-image: none !important; box-shadow: none !important;
}