/* Footer styles */
.site-footer { 
  background: linear-gradient(180deg, rgba(142,34,48,0.04), transparent 24%), var(--color-surface); 
  border-top: 1px solid rgba(255,255,255,0.06); 
  padding-block: var(--space-10);
  max-width: 100%;
  overflow: hidden;
}

.footer__inner { 
  display: grid; 
  gap: var(--space-10); 
  grid-template-columns: 1fr; 
  align-items: start;
  max-width: 100%;
  box-sizing: border-box;
}

@media (min-width: 720px) { 
  .footer__inner { 
    grid-template-columns: 1fr 1fr; 
  } 
}

@media (min-width: 960px) { 
  .footer__inner { 
    grid-template-columns: 1.2fr 1fr 1fr; 
  } 
}

.footer__brand { max-width: 100%; }
.footer__brand .brand { gap: var(--space-4); color: var(--gray-50); display: flex; align-items: center; flex-wrap: wrap; }
.footer__brand .brand__icon { border-radius: var(--radius-sm); box-shadow: 0 0 0 1px rgba(255,255,255,0.06), 0 10px 24px rgba(0,0,0,0.55); flex-shrink: 0; }
.footer__brand .brand__name { font-family: var(--font-display); font-weight: 700; letter-spacing: 0.04em; word-break: break-word; }
.footer__tagline { color: var(--gray-300); margin-top: var(--space-5); max-width: 52ch; width: 100%; }

.footer__nav { max-width: 100%; }
.footer__links { 
  display: grid; 
  grid-template-columns: 1fr; 
  gap: var(--space-3); 
  max-width: 100%;
}

@media (min-width: 480px) { 
  .footer__links { 
    grid-template-columns: repeat(2, 1fr); 
    gap: var(--space-4) var(--space-6); 
  } 
}

@media (min-width: 720px) { 
  .footer__links { 
    grid-template-columns: repeat(2, 1fr); 
    gap: var(--space-4) var(--space-8); 
  } 
}

@media (min-width: 960px) { 
  .footer__links { 
    grid-template-columns: repeat(3, 1fr); 
  } 
}

.footer__links li { max-width: 100%; }
.footer__links a { 
  color: var(--gray-100); 
  padding: var(--space-2) 0; 
  display: block;
  word-break: break-word;
}
.footer__links a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

.footer__meta { 
  display: flex; 
  align-items: center; 
  justify-content: space-between; 
  flex-wrap: wrap;
  gap: var(--space-6); 
  border-top: 1px solid rgba(255,255,255,0.06); 
  padding-top: var(--space-6); 
  grid-column: 1 / -1;
  max-width: 100%;
}

@media (max-width: 900px) {
  .footer__meta {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-4);
  }
}

.footer__copyright { 
  color: var(--gray-300);
  word-break: break-word;
  max-width: 100%;
}
.footer__top { 
  --btn-bg: transparent;
  width: 100%;
  max-width: 200px;
}

@media (max-width: 900px) {
  .footer__top {
    max-width: 100%;
  }
}

/* Cookie consent banner */
.cookie { 
  position: fixed; 
  left: 0; 
  right: 0; 
  bottom: 0; 
  z-index: 1100;
  max-width: 100%;
}

.cookie[hidden] { display: none !important; }

.cookie__inner { 
  display: grid; 
  gap: var(--space-6); 
  grid-template-columns: 1fr; 
  background: color-mix(in srgb, var(--color-elevated) 92%, #000 8%); 
  border-top: 1px solid rgba(255,255,255,0.08); 
  box-shadow: 0 -20px 40px rgba(0,0,0,0.5); 
  border-top-left-radius: var(--radius-lg); 
  border-top-right-radius: var(--radius-lg); 
  padding: var(--space-7); 
  transform: translateY(100%); 
  opacity: 0; 
  transition: transform var(--motion-slow), opacity var(--motion-base);
  max-width: 100%;
  box-sizing: border-box;
}

@media (max-width: 900px) {
  .cookie__inner {
    padding: var(--space-5);
    gap: var(--space-5);
  }
}

.cookie.is-visible .cookie__inner { transform: translateY(0); opacity: 1; }
.cookie.is-dismissed .cookie__inner { transform: translateY(100%); opacity: 0; }

.cookie__text { max-width: 100%; }
.cookie__text h2 { 
  font-size: var(--fs-lg); 
  margin: 0 0 var(--space-3);
  word-break: break-word;
}

@media (max-width: 900px) {
  .cookie__text h2 {
    font-size: var(--fs-md);
  }
}

.cookie__text p { 
  margin: 0; 
  color: var(--gray-100);
  word-break: break-word;
  max-width: 100%;
}

.cookie__text a { color: color-mix(in srgb, var(--color-primary) 85%, #fff 15%); }

.cookie__actions { 
  display: flex; 
  flex-wrap: wrap; 
  gap: var(--space-4); 
  align-items: center; 
  justify-content: flex-start;
  max-width: 100%;
}

@media (max-width: 900px) {
  .cookie__actions {
    flex-direction: column;
    width: 100%;
  }
  .cookie__actions button {
    width: 100%;
  }
}

@media (min-width: 920px) { 
  .cookie__inner { 
    grid-template-columns: 1fr auto; 
    align-items: center; 
  } 
}
