/*
 * Footer Stylesheet — Kumudamluxe
 *
 * Assumes CSS variables from header.css are already loaded.
 *
 * @package KumudamLuxe
 * @since 1.0.0
 */


/* =========================================================================
   FOOTER SHELL
   ========================================================================= */

.kl-footer{
    position: relative;
    overflow: hidden;

    background:
        radial-gradient(circle at top center,
            rgba(212,175,55,.08) 0%,
            transparent 45%),
        linear-gradient(
            180deg,
            #080808 0%,
            #050505 100%
        );

    border-top: 1px solid rgba(212,175,55,.15);
}


/* =========================================================================
   CONTAINER
   ========================================================================= */

.kl-footer__container {
  max-width:   var(--kl-container-max);
  margin:      0 auto;
  padding-left:  var(--kl-container-px);
  padding-right: var(--kl-container-px);
}


/* =========================================================================
   TOP SECTION — four-column grid
   ========================================================================= */

.kl-footer__top {
  padding:3rem 0 2rem;
}

.kl-footer__top .kl-footer__container{
    display:grid;
    grid-template-columns:2.2fr 1fr 1fr;
    gap:0;
    align-items:start;
}


/* =========================================================================
   FOOTER COLUMN
   ========================================================================= */

.kl-footer__col {}

.kl-footer__col--brand {}


/* =========================================================================
   LOGO + TAGLINE
   ========================================================================= */

.kl-footer__logo{
    display:inline-flex;
    align-items:center;
}

.kl-footer__logo-img{
    display:block;
    width:auto;
    height:40px;      /* Adjust to 64px, 72px, or 80px */
    max-width:none;
}

.kl-footer__tagline {
  font-family:var(--kl-font-display);
font-style:normal;
font-size:1.05rem;
line-height:1.8;
color:#C6C6C6;
  margin:        0 0 var(--kl-space-6);
  max-width:     280px;
}


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

.kl-social {
  display:     flex;
  align-items: center;
  gap:         var(--kl-space-2);
}

.kl-social__link {
  display:         flex;
  align-items:     center;
  justify-content: center;
  width:           36px;
  height:          36px;
  background:      var(--kl-surface-2);
  border:          1px solid var(--kl-border);
  border-radius:   var(--kl-radius-sm);
  color:           var(--kl-text-muted);
  font-size:       1rem;
  text-decoration: none;
  transition:      color var(--kl-dur-fast),
                   border-color var(--kl-dur-fast),
                   background var(--kl-dur-fast);
  outline-offset:  2px;
}

.kl-social__link:hover,
.kl-social__link:focus-visible {
  color:        var(--kl-gold);
  border-color: var(--kl-border-gold);
  background:   var(--kl-gold-muted);
}


/* =========================================================================
   FOOTER HEADING
   ========================================================================= */

.kl-footer__heading {
  font-family: var(--kl-font-display);
    font-size: .8rem;
    font-weight: 400;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--kl-gold);
  margin:          0 0 var(--kl-space-5, 1.25rem);
	 margin-bottom:2rem;
}


/* =========================================================================
   FOOTER MENUS
   ========================================================================= */

.kl-footer__menu .menu-item {
  margin-bottom:1rem;
}

.kl-footer__menu .menu-item:last-child {
  margin-bottom: 0;
}

.kl-footer__menu a {
  font-size:       var(--kl-text-sm);
  color:           var(--kl-text-muted);
  text-decoration: none;
  transition:      color var(--kl-dur-fast);
  outline-offset:  2px;
}

.kl-footer__menu a:hover,
.kl-footer__menu a:focus-visible {
  color: var(--kl-text);
}


/* =========================================================================
   NEWSLETTER
   ========================================================================= */

.kl-footer__newsletter-desc {
  font-size:    var(--kl-text-sm);
  color:        var(--kl-text-muted);
  line-height:  1.6;
  margin:       0 0 var(--kl-space-4);
}

.kl-footer__newsletter-form {
  display: flex;
  flex-direction: column;
  gap: var(--kl-space-2);
}

.kl-footer__newsletter-input-wrap {
  display:         flex;
  align-items:     stretch;
  border:          1px solid var(--kl-border);
  border-radius:   var(--kl-radius-sm);
  overflow:        hidden;
  transition:      border-color var(--kl-dur-fast);
}

.kl-footer__newsletter-input-wrap:focus-within {
  border-color: var(--kl-border-gold);
  box-shadow:   0 0 0 2px var(--kl-gold-muted);
}

.kl-footer__newsletter-input {
  flex:         1;
  padding:      0.65rem var(--kl-space-3);
  background:   transparent;
  border:       none;
  color:        var(--kl-text);
  font-family:  var(--kl-font-body);
  font-size:    var(--kl-text-sm);
  outline:      none;
}

.kl-footer__newsletter-input::placeholder {
  color: var(--kl-text-faint);
}

.kl-footer__newsletter-btn {
  display:         flex;
  align-items:     center;
  justify-content: center;
  width:           42px;
  background:      var(--kl-gold);
  border:          none;
  border-left:     1px solid var(--kl-gold-rich);
  color:           #000;
  font-size:       1rem;
  cursor:          pointer;
  transition:      background var(--kl-dur-fast);
  outline-offset:  2px;
}

.kl-footer__newsletter-btn:hover {
  background: var(--kl-gold-rich);
}


/* =========================================================================
   DIVIDER
   ========================================================================= */

.kl-footer__col{
    position:relative;
    padding:0 3rem;
}

.kl-footer__col:first-child{
    padding-left:0;
}

.kl-footer__col:last-child{
    padding-right:0;
}

.kl-footer__col:not(:last-child)::after{
    content:"";
    position:absolute;
    top:0;
    right:0;
    width:1px;
    height:100%;
    background:linear-gradient(
        to bottom,
        transparent,
        rgba(212,175,55,.15),
        transparent
    );
}




.kl-footer__divider {
  height:     1px;
  background:linear-gradient(
90deg,
transparent,
rgba(212,175,55,.25),
transparent
);
  margin:     0 var(--kl-container-px);
}


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

.kl-footer__bottom {
  padding:2rem 0;
}

.kl-footer__bottom-inner {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  flex-wrap:       wrap;
  gap:             var(--kl-space-4);
}

.kl-footer__copy{
    margin:0;

    font-family:var(--kl-font-body);

    font-size:.85rem;

    font-weight:400;

    letter-spacing:.02em;

    color:rgba(255,255,255,.68);

    line-height:1.7;
}
/* Legal menu */
.kl-footer__legal-menu {
  display:    flex;
  align-items: center;
  flex-wrap:  wrap;
  gap:        var(--kl-space-4);
}

.kl-footer__legal-menu .menu-item {}

.kl-footer__legal-menu a {
  font-size:       var(--kl-text-xs);
  color:           var(--kl-text-faint);
  text-decoration: none;
  transition:      color var(--kl-dur-fast);
  outline-offset:  2px;
}

.kl-footer__legal-menu a:hover {
  color: var(--kl-text-muted);
}


/* =========================================================================
   RESPONSIVE
   ========================================================================= */

@media (max-width:1023px){

    .kl-footer__top .kl-footer__container{
        grid-template-columns:1fr;
        gap:3rem;
    }

    .kl-footer__col{
        padding:0;
    }

    .kl-footer__col::after{
        display:none;
    }
}
@media (max-width: 599px) {
  .kl-footer__top .kl-footer__container {
    grid-template-columns: 1fr;
    gap: var(--kl-space-6);
  }

  .kl-footer__col--brand,
  .kl-footer__col--newsletter {
    grid-column: auto;
  }

  .kl-footer__bottom-inner {
    flex-direction: column;
    align-items:    center;
    text-align:     center;
  }

  .kl-footer__legal-menu {
    justify-content: center;
  }
}
