/* ── FOOTER — Heritage Copper with Glassmorphism ──── */

/* ── BASE ── */
.footer {
  position: relative;
  overflow: hidden;
  color: rgba(229,226,225,.75);
  padding: 96px 0 0;
  border-top: none !important;

  /* Copper heritage image as base */
  background:
    /* Dark overlay for readability */
    linear-gradient(
      to bottom,
      rgba(8,6,4,.82) 0%,
      rgba(6,4,2,.88) 60%,
      rgba(4,3,2,.94) 100%
    ),
    url('/assets/images/footer-bg.png') center/cover no-repeat;
}

/* ── Animated scan-line shimmer across the bg image ── */
.footer::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(
    105deg,
    transparent 40%,
    rgba(242,202,80,.04) 50%,
    transparent 60%
  );
  background-size: 200% 100%;
  animation: footerShimmer 8s ease-in-out infinite;
  pointer-events: none; z-index: 1;
}
@keyframes footerShimmer {
  0%   { background-position: 200% center; }
  100% { background-position: -200% center; }
}

/* ── Rotating mandala top-right ── */
.footer::after {
  content: '';
  position: absolute;
  top: -100px; right: -100px;
  width: 480px; height: 480px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400'%3E%3Ccircle cx='200' cy='200' r='180' fill='none' stroke='%23f2ca50' stroke-width='0.7' opacity='0.1'/%3E%3Ccircle cx='200' cy='200' r='140' fill='none' stroke='%23f2ca50' stroke-width='0.5' opacity='0.08'/%3E%3Ccircle cx='200' cy='200' r='100' fill='none' stroke='%23f2ca50' stroke-width='0.5' opacity='0.07'/%3E%3Ccircle cx='200' cy='200' r='60' fill='none' stroke='%23f2ca50' stroke-width='0.6' opacity='0.1'/%3E%3Ccircle cx='200' cy='200' r='28' fill='none' stroke='%23f2ca50' stroke-width='0.7' opacity='0.12'/%3E%3Cpath d='M200 20L200 380M20 200L380 200M62 62L338 338M338 62L62 338' stroke='%23f2ca50' stroke-width='0.3' opacity='0.05'/%3E%3C/svg%3E");
  background-size: contain; background-repeat: no-repeat;
  pointer-events: none; z-index: 1;
  animation: footerMandalaRotate 70s linear infinite;
}
@keyframes footerMandalaRotate {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* ── Animated gold top border ── */
.footer__glass-top {
  position: absolute;
  top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(242,202,80,.2) 20%,
    rgba(242,202,80,.7) 50%,
    rgba(242,202,80,.2) 80%,
    transparent 100%
  );
  animation: footerGoldLine 5s ease-in-out infinite;
  z-index: 2;
}
@keyframes footerGoldLine {
  0%,100% { opacity: .5; }
  50%     { opacity: 1; box-shadow: 0 0 12px rgba(242,202,80,.4); }
}

/* ── Central glow ── */
.footer__glow {
  position: absolute;
  top: 0; left: 50%; transform: translateX(-50%);
  width: 800px; height: 400px;
  background: radial-gradient(ellipse, rgba(242,202,80,.06) 0%, transparent 70%);
  pointer-events: none; z-index: 1;
  animation: footerGlowPulse 7s ease-in-out infinite;
}
@keyframes footerGlowPulse {
  0%,100% { opacity: .6; transform: translateX(-50%) scale(1); }
  50%     { opacity: 1;  transform: translateX(-50%) scale(1.08); }
}

/* ── Floating ornaments ── */
.footer__ornament {
  position: absolute; pointer-events: none; z-index: 2; opacity: 0;
  animation: footerFloat 14s ease-in-out infinite;
}
.footer__ornament--1 { top:12%; left:5%;   animation-delay:0s;   animation-duration:16s; }
.footer__ornament--2 { top:55%; left:40%;  animation-delay:4s;   animation-duration:18s; }
.footer__ornament--3 { top:20%; right:8%;  animation-delay:8s;   animation-duration:14s; }
.footer__ornament--4 { bottom:15%; right:25%; animation-delay:12s; animation-duration:20s; }
@keyframes footerFloat {
  0%   { opacity:0; transform:translateY(0) rotate(0deg) scale(.8); }
  20%  { opacity:.14; }
  50%  { opacity:.09; transform:translateY(-20px) rotate(18deg) scale(1.05); }
  80%  { opacity:.14; }
  100% { opacity:0; transform:translateY(0) rotate(0deg) scale(.8); }
}

/* ── Ensure content above decorative layers ── */
.footer > .container,
.footer__grid,
.footer__bottom { position: relative; z-index: 3; }

/* ── Grid ── */
.footer__grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1.5fr;
  gap: 64px;
  padding: 0 80px 80px;
  max-width: 1440px; margin: 0 auto;
  border-bottom: 1px solid rgba(242,202,80,.12);
  position: relative;
}
/* Second mandala bottom-left of grid */
.footer__grid::before {
  content: '';
  position: absolute;
  bottom: -60px; left: -60px;
  width: 320px; height: 320px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 300'%3E%3Ccircle cx='150' cy='150' r='130' fill='none' stroke='%23f2ca50' stroke-width='0.5' opacity='0.07'/%3E%3Ccircle cx='150' cy='150' r='95' fill='none' stroke='%23d4af37' stroke-width='0.4' opacity='0.06'/%3E%3Ccircle cx='150' cy='150' r='60' fill='none' stroke='%23f2ca50' stroke-width='0.5' opacity='0.08'/%3E%3Ccircle cx='150' cy='150' r='30' fill='none' stroke='%23f2ca50' stroke-width='0.6' opacity='0.1'/%3E%3C/svg%3E");
  background-size: contain; background-repeat: no-repeat;
  pointer-events: none; z-index: 0;
  animation: footerMandalaRotate 90s linear infinite reverse;
  opacity: .7;
}

/* ── Brand col ── */
.footer__logo {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 20px; text-decoration: none;
}
.footer__logo .navbar__logo-text { font-size: 1.2rem; letter-spacing: .15em; }
.footer__logo img { height: 32px; object-fit: contain; }

.footer__desc {
  font-size: .875rem; color: rgba(208,197,175,.65);
  line-height: 1.75; margin-bottom: 28px; max-width: 280px;
}

/* ── Social icons — glass pills ── */
.footer__socials { display: flex; gap: 10px; }
.footer__social {
  width: 36px; height: 36px;
  background: rgba(242,202,80,.07);
  border: 1px solid rgba(242,202,80,.18);
  backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  color: rgba(242,202,80,.7);
  transition: all .25s ease;
  border-radius: 6px;
}
.footer__social:hover {
  background: rgba(242,202,80,.15);
  border-color: rgba(242,202,80,.5);
  color: #f2ca50;
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(242,202,80,.2);
}

/* ── Link columns ── */
.footer__heading {
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: .65rem; font-weight: 700;
  letter-spacing: .2em; text-transform: uppercase;
  color: #f2ca50; margin-bottom: 24px;
  position: relative; display: inline-block;
}
.footer__heading::after {
  content: '';
  position: absolute; bottom: -6px; left: 0;
  width: 100%; height: 1px;
  background: linear-gradient(90deg, rgba(242,202,80,.5), transparent);
}
.footer__links { display: flex; flex-direction: column; gap: 12px; }
.footer__links a {
  font-size: .875rem; color: rgba(208,197,175,.6);
  transition: color .15s, padding-left .15s;
  display: flex; align-items: center; gap: 6px;
}
.footer__links a::before {
  content: '';
  width: 0; height: 1px;
  background: #f2ca50;
  transition: width .2s;
  flex-shrink: 0;
}
.footer__links a:hover { color: #f2ca50; padding-left: 4px; }
.footer__links a:hover::before { width: 12px; }

/* ── Contact ── */
.footer__contact { display: flex; flex-direction: column; gap: 12px; }
.footer__contact li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: .84rem; color: rgba(208,197,175,.65);
}
.footer__contact svg { flex-shrink: 0; color: #f2ca50; margin-top: 2px; }

/* ── Newsletter — glass card ── */
.footer__newsletter-form {
  display: flex;
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(242,202,80,.2) !important;
  border-radius: 4px;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  transition: border-color .3s, background .3s, box-shadow .3s;
  overflow: hidden;
}
.footer__newsletter-form:focus-within {
  border-color: rgba(242,202,80,.5) !important;
  background: rgba(255,255,255,.08) !important;
  box-shadow: 0 0 20px rgba(242,202,80,.1) !important;
}
.footer__newsletter-form input {
  flex: 1; background: transparent; border: none;
  padding: 12px 16px; color: #e5e2e1;
  font-size: .84rem; outline: none;
}
.footer__newsletter-form input::placeholder { color: rgba(153,144,124,.4); }
.footer__newsletter-form button {
  background: none; border: none; border-left: 1px solid rgba(242,202,80,.15);
  padding: 0 16px; color: #f2ca50; cursor: pointer;
  transition: background .2s, transform .2s;
}
.footer__newsletter-form button:hover {
  background: rgba(242,202,80,.1);
  transform: translateX(2px);
}

/* ── Bottom bar ── */
.footer__bottom {
  max-width: 1440px; margin: 0 auto;
  padding: 20px 80px;
  display: flex; align-items: center; justify-content: space-between;
  font-size: .65rem; color: #5a5048;
  letter-spacing: .12em; text-transform: uppercase;
  border-top: 1px solid rgba(242,202,80,.08);
}
.footer__bottom-links { display: flex; gap: 24px; }
.footer__bottom-links a { color: #5a5048; transition: color .15s; }
.footer__bottom-links a:hover { color: #f2ca50; }

/* ── Payments ── */
.footer__payments { margin-top: 24px; }
.footer__payment-icons { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.payment-icon {
  padding: 4px 10px;
  background: rgba(242,202,80,.06);
  border: 1px solid rgba(242,202,80,.15);
  backdrop-filter: blur(6px);
  font-size: .62rem; font-weight: 700;
  letter-spacing: .08em; color: rgba(242,202,80,.6);
  transition: all .2s;
}
.payment-icon:hover { background: rgba(242,202,80,.12); color: #f2ca50; }

/* ── Responsive ── */
@media (max-width: 1100px) {
  .footer__grid { grid-template-columns: 2fr 1fr 1fr 1.5fr; gap: 40px; padding: 0 48px 64px; }
}
@media (max-width: 768px) {
  .footer { padding: 64px 0 0; }
  .footer__grid { grid-template-columns: 1fr 1fr; gap: 32px; padding: 0 20px 48px; }
  .footer__bottom { flex-direction: column; gap: 12px; text-align: center; padding: 16px 20px; }
  .footer::after { width: 280px; height: 280px; top: -60px; right: -60px; opacity: .4; }
}
@media (max-width: 480px) {
  .footer__grid { grid-template-columns: 1fr; }
}