/* SABRE — footer styles for the SPLIT (Elementor Form) footer build.
   Paste into Site Settings > Custom CSS. Use this instead of the <style>
   block inside footer.html when you build the footer as Elementor columns. */

/* Section itself: set background #0A0A0A and padding 64px / gutter / 28px
   in Elementor's section settings, or uncomment below and use a CSS class. */
/* .sabre-footer-section { background: #0A0A0A; padding: 64px var(--sabre-gutter) 28px; } */

.sabre-ftr__brand-top { display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.sabre-ftr__logo { display: block; line-height: 0; border: 0; }
.sabre-ftr__logo-img { width: 148px; height: auto; display: block; }

.sabre-ftr__news-label {
  font-family: var(--sabre-mono); font-size: 13px; letter-spacing: 0.16em;
  text-transform: uppercase; color: #FFFFFF;
}

.sabre-ftr__social { display: flex; gap: 6px; margin-left: -7px; }
.sabre-ftr__social a {
  width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center;
  color: var(--sabre-fg-on-dark-2); border-bottom: 0;
  transition: color var(--sabre-fast) var(--sabre-ease);
}
.sabre-ftr__social a:hover { color: var(--sabre-lime); border-bottom: 0; }
.sabre-ftr__social svg {
  width: 18px; height: 18px; display: block;
  fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linejoin: round;
}

/* Elementor: set the gap between the brand column and this block to 96px
   (section > Layout > Columns Gap: Custom) to match the design. */
.sabre-ftr__cols { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 48px; }
.sabre-ftr__col { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.sabre-ftr__heading {
  /* also used as an <button> for the mobile accordion — reset UA chrome at all widths */
  appearance: none; -webkit-appearance: none;
  background: transparent; border: 0; padding: 0; margin: 0 0 2px;
  text-align: left; width: auto; cursor: default; display: block;
  font-family: var(--sabre-mono); font-size: 10px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--sabre-fg-on-dark-3);
}
.sabre-ftr__col a {
  font-family: var(--sabre-display); font-size: 13px; line-height: 1.4;
  color: var(--sabre-fg-on-dark-2); text-decoration: none;
  border-bottom: 1px solid transparent;
}
.sabre-ftr__col a:hover { color: #FFFFFF; border-bottom-color: var(--sabre-lime); }

/* Service links underline in their own service-line color */
.sabre-ftr__col a[href*="real-estate-brokerage"]:hover { border-bottom-color: var(--sabre-brokerage); }
.sabre-ftr__col a[href*="national-advisory"]:hover { border-bottom-color: var(--sabre-advisory); }
.sabre-ftr__col a[href*="business-consulting"]:hover { border-bottom-color: var(--sabre-consulting); }
.sabre-ftr__col a[href*="studio"]:hover { border-bottom-color: var(--sabre-studio); }

.sabre-ftr__base {
  padding-top: 20px; border-top: 1px solid var(--sabre-line-on-dark);
  display: flex; justify-content: space-between; align-items: center;
  gap: 24px; flex-wrap: wrap;
}
.sabre-ftr__copy, .sabre-ftr__legal a {
  font-family: var(--sabre-mono); font-size: 10px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--sabre-fg-on-dark-3);
}
.sabre-ftr__legal { display: flex; gap: 20px; }
.sabre-ftr__legal a {
  color: var(--sabre-fg-on-dark-2); text-decoration: none;
  border-bottom: 1px solid transparent;
}
.sabre-ftr__legal a:hover { color: #FFFFFF; border-bottom-color: var(--sabre-lime); }

/* --- Responsive: keep the three link columns 3-across on mobile --- */
@media (max-width: 1024px) {
  .sabre-ftr__grid { grid-template-columns: minmax(0,1fr); gap: 40px; }
  .sabre-ftr__cols { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 24px; }
}
@media (max-width: 720px) {
  .sabre-ftr { padding: 48px var(--sabre-gutter) 24px; }
  .sabre-ftr__col a { font-size: 11px; line-height: 1.45; }
  .sabre-ftr__logo-img { width: 120px; }
  .sabre-ftr__news-label { font-size: 11px; }
  .sabre-ftr__base { margin-top: 36px; }
}
@media (max-width: 420px) {
  .sabre-ftr__cols { gap: 12px; }
  .sabre-ftr__col a { font-size: 10px; }
  .sabre-ftr__copy, .sabre-ftr__legal a { font-size: 9px; letter-spacing: 0.1em; }
}

/* --- Mobile: each column collapses, one open at a time --- */
@media (max-width: 720px) {
  .sabre-ftr__cols, .sabre-ftr__links { grid-template-columns: minmax(0,1fr) !important; gap: 0 !important; }
  .sabre-ftr__col { border-top: 1px solid var(--sabre-line-on-dark); gap: 0; }
  .sabre-ftr__heading {
    width: 100%; display: flex; align-items: center; justify-content: space-between;
    gap: 12px; min-height: 44px; padding: 12px 0; margin: 0; cursor: pointer;
    font-size: 11px; letter-spacing: 0.16em; color: #FFFFFF;
  }
  .sabre-ftr__heading::after {
    content: "+"; font-size: 13px; color: var(--sabre-lime);
  }
  .sabre-ftr__col.is-open .sabre-ftr__heading::after { content: "\2212"; }
  .sabre-ftr__panel {
    overflow: hidden; max-height: 0;
    transition: max-height 300ms var(--sabre-ease);
  }
  .sabre-ftr__col.is-open .sabre-ftr__panel { max-height: 260px; padding-bottom: 16px; }
}
.sabre-ftr__panel { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }