/* ============================================================
   FOOTER.CSS — Gunya Shutters
   Footer layout · Links · Social · Bottom bar
   ============================================================ */

/* ── FOOTER BASE ─────────────────────────────────────────── */
footer{background:var(--green-dark);color:rgba(255,255,255,0.75);}
.footer-top{padding:64px 0 48px;border-bottom:1px solid rgba(255,255,255,0.1);}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;}

/* ── FOOTER BRAND ────────────────────────────────────────── */
.footer-brand .brand-name{font-family:'Playfair Display',serif;font-size:24px;color:var(--white);margin-bottom:12px;}
.footer-brand p{font-size:14px;line-height:1.7;color:rgba(255,255,255,0.6);}

/* ── FOOTER LINKS ────────────────────────────────────────── */
.footer-heading{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:16px;}
.footer-links{list-style:none;}
.footer-links li{margin-bottom:10px;}
.footer-links a{font-size:14px;color:rgba(255,255,255,0.6);text-decoration:none;transition:color 0.2s;}
.footer-links a:hover{color:var(--gold-light);}

/* ── FOOTER BOTTOM BAR ───────────────────────────────────── */
.footer-bottom{padding:20px 0;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:13px;color:rgba(255,255,255,0.4);}

/* ── FOOTER SOCIAL ───────────────────────────────────────── */
.footer-social{display:flex;gap:12px;}
.footer-social a{width:34px;height:34px;border:1px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--gold);color:var(--green-dark);text-decoration:none;font-size:13px;font-weight:700;transition:all 0.2s;}
.footer-social a:hover{background:transparent;border-color:rgba(255,255,255,0.5);color:rgba(255,255,255,0.8);}

/* ============================================================
   RESPONSIVE — TABLET (≤1024px)
   ============================================================ */
@media(max-width:1024px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:36px;}
}

/* ============================================================
   RESPONSIVE — MOBILE (≤768px)
   ============================================================ */
@media(max-width:768px){
  .footer-grid{grid-template-columns:1fr;gap:28px;}
  .footer-top{padding:40px 0 32px;}
  .footer-bottom{flex-direction:column;align-items:center;text-align:center;gap:8px;}
  .footer-brand img{height:52px;}
}

/* ============================================================
   RESPONSIVE — SMALL MOBILE (≤480px)
   ============================================================ */
@media(max-width:480px){
  .footer-grid{grid-template-columns:1fr;}
}