/* =====================================================================
   footer.css — Lagoon skin: site footer + the footer's white logo panel.
   ===================================================================== */

.footer{background:var(--sp-secondary-d);color:rgba(255,255,255,.75);padding:60px 0 24px;position:relative}
.footer::before{
  content:'';position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--sp-primary),var(--sp-secondary) 50%,var(--sp-peach));
}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:32px;margin-bottom:36px}
.footer__inner{position:relative;z-index:1}
.footer-grid--regions{grid-template-columns:minmax(260px,2fr) repeat(4,minmax(150px,1fr));gap:44px}
.footer .block{margin:0}
.footer-brand p{font-size:13px;line-height:1.7;margin-top:14px;max-width:340px;color:rgba(255,255,255,.7)}
.footer-brand .field--name-body p{margin:22px 0 0}
.footer-brand .nav-logo{color:#fff}
.footer-brand .nav-logo small{color:rgba(255,255,255,.55)}
.footer-col h2,
.footer-col h4{color:#fff;font-size:12px;font-weight:800;margin:0 0 16px;text-transform:uppercase;letter-spacing:1.6px}
body.skin .footer-col h2,
body.skin .footer-col h4{color:var(--sp-peach)!important;font-family:'Lexend',sans-serif;font-weight:700;font-size:13px;letter-spacing:1.6px;text-transform:uppercase}
.footer-col nav > ul,
.footer__legal nav > ul{list-style:none;margin:0;padding:0}
.footer-col nav > ul > li,
.footer__legal nav > ul > li{margin:0;padding:0}
.footer-col nav > ul > li > a{display:block;font-size:14px;padding:5px 0;color:rgba(255,255,255,.75);line-height:1.6;transition:color .2s}
.footer-col nav > ul > li > a:hover{color:var(--sp-peach)}
.footer-bottom{
  padding-top:22px;border-top:1px solid rgba(255,255,255,.12);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
  font-size:12.5px;color:rgba(255,255,255,.7);
}
.footer-bottom--regions{align-items:center}
.footer__copyright p{margin:0}
.footer__legal nav > ul{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:0}
.footer__legal nav > ul > li:not(:last-child)::after{content:'·';margin:0 6px;color:rgba(255,255,255,.45)}
.footer__legal nav > ul > li > a{display:inline;padding:0}
.footer-bottom > .footer__legal nav > ul > li > a,
.footer-bottom > .footer__copyright a{color:rgba(255,255,255,.75)}
.footer-bottom > .footer__legal nav > ul > li > a:hover,
.footer-bottom > .footer__copyright a:hover{color:#fff}

/* Keep Drupal contextual menus isolated from footer menu layout rules. */
body.skin .footer .contextual .contextual-links a,
.footer .contextual .contextual-links a{
  color:#333!important;
  display:block;
  font-size:13px;
  font-weight:400;
  line-height:1.2;
  padding:.4em .6em;
  white-space:nowrap;
}
.footer .contextual .contextual-links li::after{content:none!important}
.footer-bottom .contextual-region.focus{outline:none}
.footer-bottom .contextual.open .contextual-links{
  transform:translateY(calc(-100% - 28px));
  border-radius:4px;
}

/* Footer sits on navy bg — wrap the logo in a white panel so it stays legible */
.footer .footer-brand-lockup{
  display:inline-flex;
  align-items:center;
  background:#fff;
  padding:8px 12px;
  border-radius:8px;
  margin-bottom:0;
}
.footer .footer-brand-lockup .brand-logo{
  display:block;
  width:auto;
  height:48px;
  max-width:240px;
  object-fit:contain;
}
.footer .nav-logo .brand-logo{
  background:#fff;
  padding:8px 12px;
  border-radius:8px;
  height:64px;
}
.footer .nav-logo small{color:rgba(255,255,255,.5)}

@media (max-width: 900px){
  .footer{padding:50px 0 24px}
  .footer-grid,
  .footer-grid--regions{grid-template-columns:1fr 1fr;gap:30px 28px}
  .footer-brand,
  .footer__brand{grid-column:1 / -1}
  .footer-bottom,
  .footer-bottom--regions{align-items:flex-start;flex-direction:column}
  .footer__legal nav > ul{justify-content:flex-start}
}

@media (max-width: 560px){
  .footer{padding:44px 0 24px}
  .footer-grid,
  .footer-grid--regions{grid-template-columns:1fr;gap:26px}
  .footer-brand p{max-width:none}
  .footer .footer-brand-lockup .brand-logo{height:44px;max-width:220px}
}