/* =========================================================
   Footer redesign — background bed photo, desktop 3-column /
   mobile stacked layout. Loaded AFTER theme.css so these rules
   win on the same selectors without needing !important.

   IMAGES REQUIRED — place these two files yourself:
     public/images/home/footer-desktop.jpg   (wide crop, used above 768px)
     public/images/home/footer-mobile.jpg    (tall crop, used at 768px and below)
   (Your existing "Footer web" / "Footer mobile" files — just rename them
   to the two names above, or edit the two url(...) paths below to match
   whatever you actually name them.)
   ========================================================= */

.footer-hero{
  position:relative;
  overflow:hidden;
  background-image:url('../images/home/Footer\ web.jpg');
  background-size:cover;
  background-position:center;
  color:#f3ede4;
  padding-top:0;
}
.footer-hero-overlay{
  position:absolute; inset:0; z-index:0;
  background:linear-gradient(90deg, rgba(20,14,9,.88) 0%, rgba(20,14,9,.72) 45%, rgba(20,14,9,.55) 100%);
}
.footer-hero-inner{
  position:relative; z-index:1;
  display:flex; align-items:flex-start; justify-content:space-between; gap:40px;
  flex-wrap:wrap;
  padding:56px 0 40px;
}

/* ---- Brand block (logo + tagline) ---- */
.footer-brand{ flex:1 1 172px; max-width:340px; }
.footer-hero .footer-logo{
  display:flex; align-items:center; text-decoration:none;
  margin-bottom:16px;
}
.footer-hero .footer-logo-mark{ height:26px; width:auto; object-fit:contain; }
.footer-tagline{ font-size:13.5px; line-height:1.75; color:#e7ddd0; margin:0; }

/* ---- Nav columns ---- */
.footer-columns{
  display:flex; gap:56px; flex-wrap:wrap; flex:2 1 480px; justify-content:flex-end;
}
.footer-hero .footer-col h5{
  font-size:12.5px; text-transform:uppercase; letter-spacing:1px; font-weight:700;
  color:#f3ede4; margin:0 0 16px;
}
.footer-hero .footer-col ul{ list-style:none; margin:0; padding:0; }
.footer-hero .footer-col li{ margin-bottom:11px; }
.footer-hero .footer-col a{
  color:#e7ddd0; text-decoration:none; font-size:13.5px; transition:color .15s ease;
}
.footer-hero .footer-col a:hover{ color:#fff; text-decoration:underline; }
.footer-col-touch .footer-contact-value{ font-size:13.5px; color:#e7ddd0; margin:0 0 11px; }
.footer-col-touch .footer-contact-value a{ color:#e7ddd0; text-decoration:none; }
.footer-col-touch .footer-contact-value a:hover{ color:#fff; text-decoration:underline; }

/* ---- Social row ---- */
.footer-hero-social{
  position:relative; z-index:1;
  display:flex; gap:16px; justify-content:center; width:100%;
  padding-bottom:32px;
}
.footer-hero-social a{
  width:34px; height:34px; border-radius:50%; border:1px solid rgba(243,237,228,.4);
  display:flex; align-items:center; justify-content:center;
  color:#f3ede4; text-decoration:none; font-size:14px; transition:background .15s ease, color .15s ease;
}
.footer-hero-social a:hover{ background:#f3ede4; color:#2b1d14; }

/* ---- Bottom bar (copyright / payment icons) stays a plain strip
   below the photo, unchanged in spirit from before ---- */
.footer-hero + .footer-bottom,
.footer-hero .footer-bottom{
  position:relative; z-index:1;
  padding-top:18px; padding-bottom:18px;
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-size:12.5px; color:#cfc3b2;
}
.footer-bottom .pay-icons{ display:flex; gap:14px; font-size:16px; color:#cfc3b2; }

/* =========================================================
   Mobile — stacked, centered, taller crop background image
   ========================================================= */
@media (max-width:768px){
  .footer-hero{ background-image:url('../images/home/Footer\ mobile.jpg'); }
  .footer-hero-inner{
    flex-direction:column; align-items:flex-start; text-align:left;
    padding:40px 24px 32px; gap:26px;
  }
  .footer-brand{ max-width:none; }
  .footer-hero .footer-logo{ justify-content:flex-start; }
  .footer-columns{
    flex-direction:column; align-items:flex-start; gap:26px; width:100%;
  }
  .footer-col-touch{ order:3; }
}
