/* =================
** SITE FOOTER 
** ================= 
*/

.site-footer {
  display: flex;  flex-direction: column;   /*   THIS fixes it */
  justify-content: center;
  align-items: center;
  text-align: center;
    flex-shrink: 0;
	  /*   preserve   height */
 /* min-height: 300px; */ min-height: 18rem; /* 288px but scalable */       
  padding: 3rem 2rem;
  background: #222;
  color: #ccc;   
}

/* CONTAINER */
.site-footer .footer-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;

  width: 90%;
  max-width: 1000px;
}

/* FOOTER ITEMS */
.site-footer .footer-container > div {
  flex: 1 1 200px;
  max-width: 14rem;
  padding: 1em 0.5em;
  display: flex;
  justify-content: center;
  align-items: center;
  border-right: 1px solid #555;
  box-sizing: border-box;
}
.site-footer .footer-container > div:not(:last-child) {
  border-right: 1px solid #555;
}
.site-footer .footer-container > div:last-child {
  border-right: none;
}

/* TEXT */
.site-footer p {
  margin: 0;
  font-size: 0.8rem;
  letter-spacing: 0.09em;
  font-family: Josefin, Roboto, Arial, sans-serif;
  line-height: 1.5;
}

.site-footer p:first-line {
  font-weight: 600;
  font-size: 0.9rem;
}

/* LINKS */
.site-footer a,
.site-footer a:visited {
  color: #CCC;
  text-decoration: none;
}

.site-footer a:focus-visible {
  outline: 2px dashed #FF4;
  outline-offset: 4px;
}

.site-footer a:hover {
  color: #FF4;
}

/* MAIL ICON */
.site-footer .mail::before {
  content: "\2709";
  display: inline-block;
  font-size: 1.2em;
  margin-right: 0.3em;  
  aria-hidden: true; /* if HTML supports it */
}

 
/* ul in footer  ================= */

.site-footer .footer-pages {
  list-style: none;
  padding: 0 0 0 1rem;
 /* margin:8.2rem auto 0;*/
   margin-top: clamp(2rem, 8vh, 8.2rem);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.9rem 1.4rem;
  max-width: 1000px;
  font-size: 0.65rem;
  letter-spacing: 0.08em;
}


/* LIST ITEMS */ 
.site-footer .footer-pages li {
  position: relative;
  padding: 0 0 0 2em;
}


@media screen and (max-width:600px){
	.site-footer .footer-pages li {
  padding: 0; margin: 0 auto;
  }  
}




/* SEPARATOR DOT (except first item) */
.site-footer .footer-pages li:not(:first-child)::before {
 content: "•";   /* content: "♬"; */
  position: absolute;
  left: -0.5rem;  top:-0.4em;
  color:#E6A700/*gold*/;font-size:2rem;
}
/*jan29/26  repeating colors (red, blue, green, purple) */
.site-footer .footer-pages li:nth-child(2)::before {
  color: red;
}

.site-footer .footer-pages li:nth-child(3)::before {
  color: blue;
}

.site-footer .footer-pages li:nth-child(4)::before {
  color: green;
}

.site-footer .footer-pages li:nth-child(5)::before {
  color: purple;
}

If you want it to repeat automatically (cleaner & scalable)

This cycles every 4 items:

.site-footer .footer-pages li:nth-child(4n + 2)::before {
  color: red;
}

.site-footer .footer-pages li:nth-child(4n + 3)::before {
  color: blue;
}

.site-footer .footer-pages li:nth-child(4n + 4)::before {
  color: green;
}

.site-footer .footer-pages li:nth-child(4n + 5)::before {
  color: purple;
}











/* LINKS */
.site-footer .footer-pages a,
.site-footer .footer-pages a:visited {
  color: #AAA;
  text-decoration: none;
  text-transform: uppercase;
}

.site-footer .footer-pages a:hover {
  color: #FF4;
  text-decoration: underline;
}

/* JUMP TO TOP SPECIAL (optional highlight) */
.site-footer .footer-pages .jump-to-top a {
  color: #DDD;
  font-weight: 600;
}

/* ================= MOBILE ================= */

@media (max-width: 768px) {
  .site-footer .footer-pages {
    margin-top: 1.6rem;
    gap: 0.6rem 1rem;
    font-size: 0.72rem;
  }

  /* Remove separators on wrap */
  .site-footer .footer-pages li::before {
    display: none;
  }
 

  .site-footer {
    padding: 2rem 1.5rem;
  }

  .site-footer .footer-container {
    flex-direction: column;
  }
 
  .site-footer .footer-container > div {
    max-width: 100%;
    width: 100%;
    border-right: none !important;
    border-bottom: 1px solid #555;
    padding: 1.2em 0;
  }

  .site-footer .footer-container > div:last-child {
    border-bottom: none;
  }
  
  /* === FOOTER PAGES: MOBILE STACK === */
.site-footer .footer-pages {
  flex-direction: column;
  align-items: stretch;
}

.site-footer .footer-pages li {
  width: 100%;
  height: 5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* remove separators if you have them */
.site-footer .footer-pages li::before {
  display: none;
}


} /* end min 768 */

/*****************************jan28/26*********************************/





@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}





/**/