/* ============================================================
   Shared site footer — ONE component for every page on this site
   (landing page, all checkout steps, Terms and Privacy pages).
   Markup (copy exactly; only the image/link paths change per folder):

   <footer class="pf-footer">
     <img class="pf-footer__logo" src="…/vacation-gurus-logo-white.png" width="155" height="22" alt="Vacation Gurus">
     <a class="pf-footer__bbb" href="https://www.bbb.org/…#sealclick" target="_blank" rel="nofollow noopener">
       <img src="…/bbb-seal.png" width="250" height="52" alt="VacationVIP.com BBB Business Review"></a>
     <p class="pf-footer__legal">This Promotion is Sponsored by: …</p>
     <p class="pf-footer__legal">THIS MATERIAL IS FOR THE PURPOSE OF SOLICITING TIMESHARE OWNERSHIP INTERESTS.</p>
     <div class="pf-footer__links"><a href="…terms-and-conditions.html">Terms &amp; Conditions</a><span>|</span><a href="…privacy-policy.html">Privacy Policy</a></div>
     <img class="pf-footer__eho" src="…/EHO-Logo.svg" width="38" height="40" alt="Equal Housing Opportunity">
   </footer>

   Change the footer's look HERE only. Page-specific spacing (e.g. room for a
   fixed bottom bar) stays in that page's own CSS.
   ============================================================ */
.pf-footer {
  color: #fff;
  text-align: center;
  background-color: #0C1F48;
  background-image: url('pattern.png'), linear-gradient(135deg, #406EB6, #0C1F48);   /* Pick Your Paradise footer gradient under the pattern */
  background-repeat: repeat, no-repeat;
  background-blend-mode: overlay;
  padding: 30px 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  font-family: Roboto, Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  /* small print stays thin: without this, white on navy renders heavy and reads as bold */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.pf-footer__logo { width: auto; display: block; }
.pf-footer__bbb { display: inline-block; background: #fff; border-radius: 8px; }
.pf-footer__bbb img { display: block; border: 0; }
.pf-footer__legal { color: #fff; max-width: 120ch; text-wrap: pretty; margin: 0; font-weight: 400; }
.pf-footer__links { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; align-items: center; }
.pf-footer a { color: #fff; font-weight: 400; text-decoration: underline; }
.pf-footer a:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.pf-footer__eho { display: none; }
@media (max-width: 767px) { .pf-footer { padding-left: 16px; padding-right: 16px; } }