/* ===============================
   PROFESSIONAL FOOTER
   File: footer.css
================================ */

/* ===============================
   FOOTER BASE
================================ */

.site-footer {
  position: relative;
  overflow: hidden;

  padding: 52px 20px 22px;

  color: #fff8ef;
  background:
    radial-gradient(circle at 12% 20%, rgba(217, 174, 124, 0.14), transparent 28%),
    radial-gradient(circle at 88% 78%, rgba(181, 139, 96, 0.10), transparent 34%),
    linear-gradient(180deg, #352216 0%, #24160f 100%);

  font-family: 'Lora', serif;
}

.site-footer::before {
  content: "";
  position: absolute;
  inset: 18px;

  border: 1px solid rgba(240, 203, 166, 0.12);
  border-radius: 26px;

  pointer-events: none;
}

.site-footer::after {
  content: "";
  position: absolute;
  top: -125px;
  left: 50%;

  width: min(640px, 90%);
  height: 250px;

  transform: translateX(-50%);

  background:
    radial-gradient(circle, rgba(217, 174, 124, 0.12), transparent 68%);

  pointer-events: none;
}

/* ===============================
   FOOTER LAYOUT
================================ */

.footer-container {
  position: relative;
  z-index: 2;

  width: min(1080px, 100%);
  margin: 0 auto;

  display: grid;
  grid-template-columns: 1.2fr 0.95fr 0.8fr 1.05fr;
  gap: 32px;
}

/* ===============================
   FOOTER COLUMNS
================================ */

.footer-column {
  min-width: 0;
}

.footer-column h3,
.footer-column h4 {
  margin: 0 0 13px;

  color: #f0cba6;

  font-family: 'Playfair Display', serif;
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: 0;
}

.footer-column h3 {
  font-size: 28px;
}

.footer-column h4 {
  font-size: 20px;
}

.footer-column p {
  margin: 0 0 10px;

  color: rgba(255, 248, 239, 0.78);

  font-size: 14.2px;
  line-height: 1.55;
}

.footer-column:first-child p {
  max-width: 300px;
}

/* ===============================
   FOOTER LINKS
================================ */

.footer-column ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer-column ul li {
  margin-bottom: 8px;
}

.footer-column a {
  position: relative;

  display: inline-flex;
  align-items: center;
  gap: 8px;

  color: rgba(255, 248, 239, 0.82);

  font-family: 'Poppins', sans-serif;
  font-size: 13.2px;
  font-weight: 700;
  text-decoration: none;

  transition:
    color 0.25s ease,
    transform 0.25s ease;
}

.footer-column a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;

  width: 0;
  height: 2px;

  border-radius: 999px;
  background: #f0cba6;

  transition: width 0.25s ease;
}

.footer-column a:hover {
  color: #f0cba6;
  transform: translateX(3px);
}

.footer-column a:hover::after {
  width: 100%;
}

/* ===============================
   CONTACT ITEMS
================================ */

.footer-column p:has(.footer-icon-small) {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Fallback for browsers without :has support */
.footer-column p img.footer-icon-small {
  margin-right: 2px;
}

.footer-icon-small {
  width: 34px;
  height: 34px;

  flex: 0 0 auto;

  object-fit: contain;
  display: inline-block;

  border-radius: 50%;
  background:
    radial-gradient(circle at 32% 24%, #fffdf8 0%, #fff3e4 44%, #e8c9aa 100%);

  padding: 5px;

  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.86);

  /*
    Helps GIF icons with white background blend better.
  */
  mix-blend-mode: normal;

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.footer-icon-small:hover {
  transform: translateY(-2px) scale(1.04);
  box-shadow:
    0 11px 22px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* ===============================
   TRUST LINE
================================ */

.footer-trust {
  position: relative;
  z-index: 2;

  width: min(760px, 100%);
  margin: 28px auto 0;
  padding: 13px 18px;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  border-radius: 999px;
  border: 1px solid rgba(240, 203, 166, 0.18);

  background: rgba(255, 248, 239, 0.06);

  color: #f0cba6;

  font-family: 'Poppins', sans-serif;
  font-size: 13px;
  font-weight: 700;
  text-align: center;

  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.footer-trust img {
  width: 32px;
  height: 32px;
}

/* ===============================
   FOOTER BOTTOM
================================ */

.footer-bottom {
  position: relative;
  z-index: 2;

  width: min(1080px, 100%);
  margin: 22px auto 0;
  padding-top: 15px;

  border-top: 1px solid rgba(255, 248, 239, 0.14);

  text-align: center;
}

.footer-bottom p {
  margin: 0;

  color: rgba(255, 248, 239, 0.64);

  font-family: 'Poppins', sans-serif;
  font-size: 12.5px;
  font-weight: 600;
}

/* ===============================
   FLOATING reCAPTCHA BADGE
================================ */

.recaptcha-badge {
  position: fixed;
  right: -166px;
  bottom: 20px;
  z-index: 999999;

  max-width: 230px;
  padding: 10px 14px;

  display: flex;
  align-items: center;
  gap: 10px;

  border-radius: 12px;
  border: 1px solid rgba(90, 56, 37, 0.12);

  background: rgba(255, 255, 255, 0.96);
  color: #4d3a2f;

  box-shadow:
    0 10px 26px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);

  font-family: 'Poppins', sans-serif;
  font-size: 11px;
  line-height: 1.35;

  transition:
    right 0.32s ease,
    transform 0.32s ease;
}

.recaptcha-badge:hover {
  right: 12px;
  transform: translateY(-2px);
}

.recaptcha-badge img {
  width: 28px;
  height: 28px;

  object-fit: contain;
  flex: 0 0 auto;
}

.recaptcha-badge a {
  color: #5a3825;
  font-weight: 700;
  text-decoration: none;
}

.recaptcha-badge a:hover {
  text-decoration: underline;
}

/* ===============================
   RESPONSIVE
================================ */

@media (max-width: 980px) {
  .site-footer {
    padding: 68px 18px 26px;
  }

  .site-footer::before {
    inset: 18px 12px;
    border-radius: 26px;
  }

  .footer-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 36px 32px;
  }

  .footer-column h3 {
    font-size: 30px;
  }

  .footer-column h4 {
    font-size: 22px;
  }

  .footer-trust {
    width: min(680px, 100%);
    border-radius: 24px;
  }
}

@media (max-width: 640px) {
  .site-footer {
    padding: 62px 14px 24px;
    text-align: center;
  }

  .site-footer::before {
    inset: 14px 8px;
    border-radius: 22px;
  }

  .footer-container {
    width: min(390px, 100%);

    grid-template-columns: 1fr;
    gap: 34px;

    text-align: center;
  }

  .footer-column:first-child p {
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
  }

  .footer-column ul li {
    margin-bottom: 9px;
  }

  .footer-column a {
    justify-content: center;
  }

  .footer-column a:hover {
    transform: none;
  }

  .footer-column p {
    justify-content: center;
  }

  .footer-column p:has(.footer-icon-small) {
    justify-content: center;
    text-align: left;
  }

  .footer-icon-small {
    width: 36px;
    height: 36px;
    padding: 5px;
  }

  .footer-trust {
    width: min(390px, 100%);
    margin-top: 34px;
    padding: 16px 18px;

    flex-direction: column;
    gap: 8px;

    border-radius: 22px;

    font-size: 13px;
    line-height: 1.5;
  }

  .footer-trust img {
    width: 34px;
    height: 34px;
  }

  .footer-bottom {
    width: min(390px, 100%);
    margin-top: 24px;
  }

  .recaptcha-badge {
    right: -156px;
    bottom: 14px;

    padding: 9px 12px;

    font-size: 10.5px;
  }

  .recaptcha-badge:hover {
    right: 10px;
  }
}

@media (max-width: 380px) {
  .footer-column h3 {
    font-size: 28px;
  }

  .footer-column h4 {
    font-size: 21px;
  }

  .footer-column p {
    font-size: 14.5px;
  }

  .footer-trust {
    font-size: 12.5px;
  }

  .recaptcha-badge {
    right: -150px;
    max-width: 210px;
  }
}

/* ===============================
   REDUCED MOTION
================================ */

@media (prefers-reduced-motion: reduce) {
  .footer-column a,
  .footer-column a::after,
  .footer-icon-small,
  .recaptcha-badge {
    transition: none;
  }
}

/* ===============================
   GLOBAL OVERFLOW FIX
================================ */

html,
body {
  overflow-x: hidden;
}
/* ===============================
   HARD MOBILE FOOTER FIX
   Put at VERY BOTTOM of footer.css
================================ */

@media (max-width: 768px) {
  .site-footer {
    width: 100% !important;
    max-width: 100% !important;

    padding: 58px 14px 24px !important;

    text-align: center !important;
    box-sizing: border-box !important;
  }

  .site-footer *,
  .site-footer *::before,
  .site-footer *::after {
    box-sizing: border-box !important;
  }

  .site-footer::before {
    inset: 14px 8px !important;
    border-radius: 22px !important;
  }

  .site-footer::after {
    width: 90% !important;
    height: 220px !important;
    top: -110px !important;
  }

  .footer-container {
    width: 100% !important;
    max-width: 390px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 34px !important;

    text-align: center !important;
  }

  .footer-column {
    width: 100% !important;
    max-width: 100% !important;

    margin-left: auto !important;
    margin-right: auto !important;

    text-align: center !important;
  }

  .footer-column h3 {
    margin-bottom: 12px !important;

    font-size: 30px !important;
    line-height: 1.1 !important;
  }

  .footer-column h4 {
    margin-bottom: 14px !important;

    font-size: 22px !important;
    line-height: 1.15 !important;
  }

  .footer-column p {
    max-width: 320px !important;

    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 12px !important;

    display: block !important;

    font-size: 14.8px !important;
    line-height: 1.6 !important;

    text-align: center !important;
  }

  .footer-column:first-child p {
    max-width: 310px !important;
  }

  .footer-column ul {
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;

    text-align: center !important;
  }

  .footer-column ul li {
    margin-bottom: 9px !important;
  }

  .footer-column a {
    justify-content: center !important;
    text-align: center !important;
  }

  .footer-column a:hover {
    transform: none !important;
  }

  /* Contact rows with icons */
  .footer-column p:has(.footer-icon-small) {
    max-width: 300px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;

    text-align: left !important;
  }

  .footer-icon-small {
    width: 34px !important;
    height: 34px !important;

    padding: 5px !important;

    flex: 0 0 34px !important;
  }

  .footer-trust {
    width: 100% !important;
    max-width: 350px !important;

    margin: 34px auto 0 !important;
    padding: 16px 16px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;

    border-radius: 22px !important;

    font-size: 13px !important;
    line-height: 1.45 !important;
    text-align: center !important;
  }

  .footer-trust img {
    width: 34px !important;
    height: 34px !important;
  }

  .footer-bottom {
    width: 100% !important;
    max-width: 350px !important;

    margin: 24px auto 0 !important;
    padding-top: 18px !important;
  }

  .footer-bottom p {
    font-size: 13px !important;
  }

  .recaptcha-badge {
    right: -158px !important;
    bottom: 12px !important;

    max-width: 220px !important;
    padding: 8px 11px !important;

    border-radius: 10px !important;

    font-size: 10px !important;
    line-height: 1.3 !important;
  }

  .recaptcha-badge:hover {
    right: 8px !important;
  }

  .recaptcha-badge img {
    width: 25px !important;
    height: 25px !important;
  }
}

@media (max-width: 430px) {
  .site-footer {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .footer-container {
    max-width: 340px !important;
  }

  .footer-column h3 {
    font-size: 28px !important;
  }

  .footer-column h4 {
    font-size: 21px !important;
  }

  .footer-column p {
    max-width: 300px !important;
    font-size: 14.2px !important;
  }

  .footer-column p:has(.footer-icon-small) {
    max-width: 285px !important;
  }

  .footer-trust,
  .footer-bottom {
    max-width: 320px !important;
  }

  .recaptcha-badge {
    right: -150px !important;
    max-width: 205px !important;
  }
}

@media (max-width: 360px) {
  .footer-container {
    max-width: 310px !important;
  }

  .footer-column h3 {
    font-size: 26px !important;
  }

  .footer-column h4 {
    font-size: 20px !important;
  }

  .footer-column p {
    font-size: 13.8px !important;
  }

  .footer-column p:has(.footer-icon-small) {
    max-width: 270px !important;
  }

  .footer-icon-small {
    width: 32px !important;
    height: 32px !important;
    flex-basis: 32px !important;
  }

  .footer-trust,
  .footer-bottom {
    max-width: 300px !important;
  }

  .recaptcha-badge {
    right: -146px !important;
    max-width: 200px !important;
  }
}
/* =========================================================
   FINAL FOOTER MOBILE SAFETY FIX
   Prevents text/link/icon overflow on small screens
========================================================= */

.site-footer,
.site-footer *,
.site-footer *::before,
.site-footer *::after {
  box-sizing: border-box;
}

.site-footer {
  max-width: 100%;
  overflow: hidden;
}

.footer-container,
.footer-column,
.footer-trust,
.footer-bottom {
  min-width: 0;
}

.footer-column p,
.footer-column a,
.footer-bottom p,
.footer-trust {
  overflow-wrap: anywhere;
  word-break: normal;
}

/* Safer link wrapping on mobile */
@media (max-width: 768px) {
  .footer-column a {
    max-width: 100%;
    flex-wrap: wrap;
    line-height: 1.45;
  }

  .footer-column p {
    width: 100%;
  }

  /* Contact rows without relying only on :has() */
  .footer-column p img.footer-icon-small {
    vertical-align: middle;
  }

  .footer-icon-small {
    flex-shrink: 0 !important;
  }
}

/* Very small phones */
@media (max-width: 360px) {
  .site-footer {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .footer-container {
    max-width: 100% !important;
  }

  .footer-column p,
  .footer-column a {
    font-size: 13.5px !important;
  }

  .footer-trust {
    max-width: 100% !important;
    padding: 14px 12px !important;
  }

  .footer-bottom {
    max-width: 100% !important;
  }

  .recaptcha-badge {
    display: none !important;
  }
}

/* Stable autohide handle: padlock only at rest, full badge on hover. */
.recaptcha-badge {
  right: 0 !important;
  display: flex !important;
  transform: translateX(calc(100% - 52px)) !important;
  transition:
    transform 0.32s ease,
    box-shadow 0.32s ease !important;
}

.recaptcha-badge:hover {
  right: 0 !important;
  transform: translateX(0) translateY(-2px) !important;
}

@media (max-width: 640px) {
  .recaptcha-badge {
    display: flex !important;
    transform: translateX(calc(100% - 46px)) !important;
  }

  .recaptcha-badge:hover {
    right: 0 !important;
    transform: translateX(0) translateY(-2px) !important;
  }
}