.tfw-footer, .tfw-footer *{ box-sizing:border-box; }
.tfw-footer{ display:block; font-family:'Bricolage Grotesque','Inter',sans-serif; width:100%; max-width:100%; }
.tfw-footer a{ color:inherit; text-decoration:none; }
.tfw-footer button{ font-family:inherit; cursor:pointer; background:none; border:none; color:inherit; }
.tfw-footer .container{ max-width:1440px; margin:0 auto; padding:0 40px; width:100%; box-sizing:border-box; }
.tfw-footer .site-footer{ background:#FFFBF2; padding:60px 0 24px; text-align:center; width:100%; max-width:100%; }
.tfw-footer .footer-logo-image{ width:140px; height:auto; margin:0 auto 30px; display:block; }
.tfw-footer .footer-logo{ display:inline-flex; flex-direction:column; align-items:center; color:#C99E43; margin-bottom:30px; }
.tfw-footer .footer-logo span{ font-family:'Playfair Display',Georgia,serif; font-size:12px; letter-spacing:.05em; margin-top:2px; }
.tfw-footer .stay-heading{ font-size:16px; letter-spacing:.05em; color:#C99E43; font-weight:500; margin:0 0 10px; text-transform:uppercase; }
.tfw-footer .newsletter-form{
  max-width:431px; margin:0 auto 4px; display:flex; align-items:center; border-bottom:1px solid #CCCCCC; padding-bottom:10px;
}
.tfw-footer .newsletter-form input{ flex:1; border:none; background:transparent; outline:none; font-size:12px; color: rgba(15,15,15,.6); text-align:center; letter-spacing:.05em; font-weight:300; }
.tfw-footer .newsletter-form button{ font-size:17px; color:#0F0F0F; transition: transform .2s ease; }
.tfw-footer .newsletter-form button:hover{ transform: translateX(3px); }
.tfw-footer .newsletter-msg{ font-size:12px; color:#B08A38; min-height:18px; margin-bottom:40px; }

.tfw-footer .footer-links{ display:flex; justify-content:center; align-items:flex-start; gap:60px; max-width:900px; margin:32px auto; flex-wrap:wrap; }
.tfw-footer .footer-links > div{ display:flex; flex-direction:column; align-items:center; gap:12px; width:175px; }
.tfw-footer .footer-links h6{ font-size:16px; letter-spacing:.05em; color:#C99E43; text-transform:uppercase; font-weight:600; margin:0; }
.tfw-footer .footer-links a{ display:flex; align-items:center; gap:8px; font-size:14px; color:#0F0F0F; font-weight:300; transition: color .2s ease; }
.tfw-footer .footer-links a:hover{ color:#B08A38; }
.tfw-footer .footer-links a i{ font-size:.95em; }

.tfw-footer .footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:12px; color:#0F0F0F; font-weight:300; }
.tfw-footer .footer-bottom p{ opacity:.9; margin:0; }
.tfw-footer .footer-bottom-links{ display:flex; }
.tfw-footer .footer-bottom-links p{ margin:0 0 0 60px; }
.tfw-footer .footer-bottom-links p:first-child{ margin-left:0; }
.tfw-footer .footer-bottom a{ color:#0F0F0F; }
.tfw-footer .footer-bottom a:hover{ color:#B08A38; }

@media (max-width:980px){
  .tfw-footer .container{ padding:0 24px; }
  .tfw-footer .footer-links{ gap:40px; }
}
@media (max-width:720px){
  .tfw-footer .site-footer{ padding:44px 0 26px; }
  /* DOM order is Information, Help, Social (columns 1, 2, 3) to match the
     3-column desktop layout, which is untouched here. Figma's mobile
     frame instead shows Social FIRST as its own centered single column,
     then Information + Help together as a two-column row underneath.
     Reorder visually with flex `order` (not DOM order) so desktop keeps
     its original column order, and size Info/Help to sit side by side
     within the mobile container width. */
  .tfw-footer .footer-links{ flex-direction:row; flex-wrap:wrap; align-items:flex-start; justify-content:center; gap:30px 24px; }
  .tfw-footer .footer-links > div{ width:auto; }
  .tfw-footer .footer-links > div:nth-child(3){ order:-1; flex-basis:100%; width:100%; }
  .tfw-footer .footer-links > div:nth-child(1),
  .tfw-footer .footer-links > div:nth-child(2){ flex:0 1 140px; }
  .tfw-footer .footer-bottom{ flex-direction:column; text-align:center; }
  .tfw-footer .footer-bottom-links{ justify-content:center; }
}