
/* =========================================================
   LHAG FOOTER STANDARD — LITTLE RESIDENCE
   Typography: Americana headings / Montserrat body
   Scope: Footer only
========================================================= */

.footer-lhag{
  --footer-bg:#7b1b20;
  --footer-text:#fff8ee;
  --footer-line:rgba(255,248,238,.18);
  --footer-line-soft:rgba(255,248,238,.12);

  width:100%;
  overflow:hidden;
  background:var(--footer-bg);
  color:var(--footer-text);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}

.footer-lhag,
.footer-lhag *{
  box-sizing:border-box;
}

.footer-lhag a{
  color:inherit;
  text-decoration:none;
}

/* =========================
   TOP LAYOUT
========================= */

.footer-lhag__top{
  min-height:300px;
  padding:58px 72px 64px;
  display:grid;
  grid-template-columns:minmax(260px,1fr) minmax(560px,34vw);
  column-gap:80px;
  align-items:start;
}

.footer-lhag__brand{
  padding-top:2px;
}

.footer-lhag__brand a{
  display:inline-block;
}

.footer-lhag__brand img{
  width:122px;
  max-width:100%;
  height:auto;
  display:block;
}

.footer-lhag__columns{
  display:grid;
  grid-template-columns:1fr 1fr 1.45fr;
  gap:44px;
  align-items:start;
  text-align:left;
}

.footer-lhag__col,
.footer-lhag__contact{
  text-align:left;
}

/* =========================
   TYPOGRAPHY
========================= */

.footer-lhag__col h4{
  margin:0 0 14px;
  font-family:var(--font-title);
  font-size:17px;
  line-height:1.16;
  font-weight:400;
  letter-spacing:.01em;
  text-transform:none;
  color:var(--footer-text);
}

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

.footer-lhag__col li,
.footer-lhag__contact p{
  margin:0 0 8px;
  font-family:var(--font-body);
  font-size:14px;
  line-height:1.55;
  font-weight:400;
  letter-spacing:.01em;
  color:rgba(255,248,238,.92);
}

.footer-lhag__contact p{
  max-width:270px;
}

.footer-lhag__contact a{
  word-break:break-word;
}

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

.footer-lhag__col a,
.footer-lhag__contact a,
.footer-lhag__legal a,
.footer-lhag__managed a,
.footer-lhag__group-credit a{
  position:relative;
  display:inline-block;
  color:inherit;
  text-decoration:none;
  transition:opacity .3s ease, transform .3s ease, color .3s ease;
}

.footer-lhag__col a::after,
.footer-lhag__contact a::after,
.footer-lhag__legal a::after,
.footer-lhag__managed a::after,
.footer-lhag__group-credit a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-3px;
  width:100%;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:right center;
  transition:transform .38s cubic-bezier(.22,.72,.22,1);
}

.footer-lhag__col a:hover,
.footer-lhag__contact a:hover,
.footer-lhag__legal a:hover,
.footer-lhag__managed a:hover,
.footer-lhag__group-credit a:hover{
  opacity:.78;
}

.footer-lhag__col a:hover::after,
.footer-lhag__contact a:hover::after,
.footer-lhag__legal a:hover::after,
.footer-lhag__managed a:hover::after,
.footer-lhag__group-credit a:hover::after{
  transform:scaleX(1);
  transform-origin:left center;
}

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

.footer-lhag__bottom{
  min-height:88px;
  border-top:1px solid var(--footer-line);
  padding:22px 72px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:38px;
}

.footer-lhag__copyright,
.footer-lhag__legal a{
  font-family:var(--font-body);
  font-size:12px;
  line-height:1.45;
  font-weight:400;
  letter-spacing:.015em;
  color:rgba(255,248,238,.90);
}

/* =========================
   SOCIAL
========================= */

.footer-lhag__social{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
}

.footer-lhag__social a{
  width:42px;
  height:42px;
  border:1px solid rgba(255,248,238,.26);
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:rgba(255,248,238,.92);
  transition:border-color .35s ease, background .35s ease, transform .35s ease, color .35s ease, opacity .35s ease;
}

.footer-lhag__social svg{
  width:16px;
  height:16px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.footer-lhag__social a:hover{
  transform:translateY(-2px);
  border-color:rgba(255,248,238,.62);
  background:rgba(255,248,238,.06);
  color:#fff;
}

/* =========================
   LEGAL
========================= */

.footer-lhag__legal{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  flex-wrap:wrap;
  gap:20px;
  text-align:right;
}

.footer-lhag__legal a{
  white-space:nowrap;
}

/* =========================
   MANAGED BY GROUP
   Supports both class names used across the 5 footers.
========================= */

.footer-lhag__managed,
.footer-lhag__group-credit{
  width:calc(100% - 144px);
  margin:0 auto;
  padding:16px 0 22px;
  border-top:1px solid var(--footer-line-soft);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.footer-lhag__managed a,
.footer-lhag__group-credit a{
  max-width:100%;
  font-family:var(--font-body);
  font-size:9px;
  line-height:1.55;
  font-weight:400;
  letter-spacing:.20em;
  text-transform:uppercase;
  color:rgba(255,248,238,.72);
  white-space:normal;
}

.footer-lhag__managed a:hover,
.footer-lhag__group-credit a:hover{
  color:rgba(255,248,238,.94);
  opacity:.96;
}

/* =========================
   TABLET
========================= */

@media(max-width:1200px){
  .footer-lhag__top{
    grid-template-columns:38% 1fr;
    column-gap:52px;
  }

  .footer-lhag__columns{
    gap:32px;
  }

  .footer-lhag__bottom{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
    gap:18px;
  }

  .footer-lhag__legal{
    justify-content:center;
    text-align:center;
  }
}

/* =========================
   MOBILE
========================= */

@media(max-width:900px){
  .footer-lhag__top{
    min-height:auto;
    padding:54px 28px 46px;
    grid-template-columns:1fr;
    gap:42px;
  }

  .footer-lhag__brand{
    display:flex;
    justify-content:center;
  }

  .footer-lhag__brand img{
    width:178px;
  }

  .footer-lhag__columns{
    grid-template-columns:1fr 1fr;
    gap:34px 30px;
    text-align:left;
  }

  .footer-lhag__contact{
    grid-column:1 / -1;
    padding-top:8px;
  }

  .footer-lhag__bottom{
    padding:24px 24px 28px;
  }

  .footer-lhag__social{
    gap:15px;
  }

  .footer-lhag__managed,
  .footer-lhag__group-credit{
    width:calc(100% - 48px);
    padding:15px 0 21px;
  }
}

/* =========================
   SMALL MOBILE
========================= */

@media(max-width:520px){
  .footer-lhag__top{
    padding:46px 20px 38px;
  }

  .footer-lhag__brand img{
    width:160px;
  }

  .footer-lhag__columns{
    grid-template-columns:1fr;
    gap:30px;
  }

  .footer-lhag__col h4{
    margin-bottom:11px;
    font-size:18px;
    line-height:1.15;
  }

  .footer-lhag__col li,
  .footer-lhag__contact p{
    margin-bottom:7px;
    font-size:14px;
    line-height:1.55;
  }

  .footer-lhag__contact p{
    max-width:none;
  }

  .footer-lhag__copyright,
  .footer-lhag__legal a{
    font-size:12px;
    letter-spacing:.035em;
  }

  .footer-lhag__legal{
    gap:10px 16px;
  }

  .footer-lhag__social a{
    width:38px;
    height:38px;
  }

  .footer-lhag__social svg{
    width:15px;
    height:15px;
  }

  .footer-lhag__managed,
  .footer-lhag__group-credit{
    width:calc(100% - 40px);
    padding:14px 0 20px;
  }

  .footer-lhag__managed a,
  .footer-lhag__group-credit a{
    font-size:8.5px;
    line-height:1.6;
    letter-spacing:.14em;
  }
}


/* =========================================================
   LHAG MOTION STANDARD
========================================================= */
.fadein-up{
  --fade-y:28px !important;
  --fade-duration:.82s !important;
  --fade-delay:0ms !important;
  --fade-ease:cubic-bezier(.22,.72,.22,1) !important;

  opacity:0 !important;
  transform:translate3d(0,var(--fade-y),0) !important;
  transition:
    opacity var(--fade-duration) var(--fade-ease) var(--fade-delay),
    transform var(--fade-duration) var(--fade-ease) var(--fade-delay) !important;
  animation:none !important;
  will-change:opacity,transform;
}

.fadein-up.is-visible{
  opacity:1 !important;
  transform:translate3d(0,0,0) !important;
  will-change:auto;
}

@media (prefers-reduced-motion: reduce){
  .fadein-up{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
    animation:none !important;
  }
}
