/* ===============================================================
   footer.css
   Footer layout + appearance (isolated)
   - Forces 5 columns on desktop
   - Prevents columns mixing/overlapping by using grid + min-width:0
   - Tight row spacing (~1cm total rhythm via compact gaps)
   - Keeps deep navy background + warm gold links
   =============================================================== */

/* ---------- Footer base (colors + spacing) ---------- */
.site-footer{
  background: hsl(224 58% 16%);
  border-top: 1px solid hsl(224 40% 26%);
  color: hsl(40 22% 96%);

  /* compact */
  padding: 0.9rem 0;

  /* never clip footer content */
  height: auto;
  min-height: 0;
  max-height: none;
  overflow: visible;
}

/* ---------- Column layout: FORCE GRID (overrides 03-layout flex) ---------- */
.site-footer .footer-inner{
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;

  /* Increase space between columns (your request) */
  column-gap: 2.2rem;
  /* Reduce vertical spacing between rows */
  row-gap: 0.45rem;

  align-items: start;
}

/* Critical: allow long strings (emails/labels) to wrap INSIDE their column */
.site-footer .footer-col{
  min-width: 0;
}

/* ---------- Headings ---------- */
.site-footer .footer-col h2,
.site-footer .footer-col .h5{
  color: hsl(40 22% 96%);
  font-size: clamp(0.78rem, 0.95vw, 0.95rem);
  line-height: 1.15;
  margin: 0 0 0.45rem 0;
  letter-spacing: 0.01em;
}

.site-footer .footer-col h3,
.site-footer .footer-col .h6{
  color: hsl(40 22% 96%);
  font-size: clamp(0.74rem, 0.9vw, 0.9rem);
  line-height: 1.15;
  margin: 0.65rem 0 0.35rem 0;
  letter-spacing: 0.01em;
}

/* ---------- Lists (tight rows) ---------- */
.site-footer .footer-list{
  list-style: none;
  margin: 0;
  padding: 0;

  display: grid;
  gap: 0.35rem; /* tight: stops “too much space between texts” */
}

.site-footer .footer-item,
.site-footer .footer-link{
  font-size: clamp(0.70rem, 0.9vw, 0.88rem);
  line-height: 1.28;
}

/* ---------- Links: warm gold ---------- */
.site-footer a{
  color: hsl(46 92% 66%);
  text-decoration: none;
}

.site-footer a:hover{
  color: hsl(46 95% 72%);
  text-decoration: underline;
  text-underline-offset: 0.18em;
  text-decoration-thickness: 1px;
}

/* Wrap long text safely */
.site-footer a,
.site-footer span{
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* ---------- Footer link rows with icons ---------- */
.site-footer .footer-link{
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

/* Lucide icon sizing inside footer only */
.site-footer svg.lucide,
.site-footer i[data-lucide]{
  width: 14px;
  height: 14px;
  stroke: currentColor;
}

/* ---------- Partners badge ---------- */
.site-footer .footer-partner__badge{
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}

.site-footer .footer-partner__logo{
  height: 16px;
  width: auto;
  display: block;
}

/* ---------- Social: icons row (replace names with icons if you later remove spans) ---------- */
.site-footer .footer-col[aria-label="Social media"] .footer-list{
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.site-footer .footer-col[aria-label="Social media"] a{
  display: inline-flex;
  align-items: center;
  gap: 0;
}

.site-footer .footer-col[aria-label="Social media"] a i[data-lucide]{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 34px;
  height: 34px;

  border: 1px solid color-mix(in srgb, hsl(46 92% 66%) 32%, transparent);
  border-radius: 999px;

  background: color-mix(in srgb, hsl(46 92% 66%) 18%, transparent);
  color: hsl(46 92% 66%);

  transition:
    background-color 160ms ease,
    color 160ms ease,
    transform 160ms ease;
}

.site-footer .footer-col[aria-label="Social media"] a:hover i[data-lucide]{
  background: hsl(46 92% 66%);
  color: hsl(224 58% 16%);
  transform: translateY(-1px);
}

/* If your markup still contains the social names, hide them cleanly */
.site-footer .footer-col[aria-label="Social media"] a span{
  display: none;
}

/* ---------- Responsive ---------- */
@media (max-width: 1200px){
  .site-footer .footer-inner{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-gap: 1.6rem;
    row-gap: 0.6rem;
  }
}

@media (max-width: 780px){
  .site-footer .footer-inner{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 1.2rem;
    row-gap: 0.6rem;
  }
}

@media (max-width: 520px){
  .site-footer .footer-inner{
    grid-template-columns: 1fr !important;
  }
}

/* ---------- Print ---------- */
@media print{
  .site-footer{
    padding: 1rem 0;
    overflow: visible !important;
    background: #fff;
    color: #000;
    border-top: 1px solid #ccc;
  }

  .site-footer a{
    color: #000;
    text-decoration: underline;
  }
}
