/* ==========================================================
   SLEEK INTERIO — COMMON HEADER v2.0
   STAGING
   ========================================================== */

.sleek-header{
  width:100%;
  background:#fff;
  border-bottom:1px solid #eee5f5;

  position:sticky;
  top:0;
  z-index:1000;
}

.sleek-header *{
  box-sizing:border-box;
}

.sleek-header a,
.sleek-header button{
  font-family:inherit;
}

.sleek-header-inner{
  width:min(1180px, calc(100% - 40px));
  min-height:82px;
  margin:0 auto;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.sleek-brand{
  color:#24222c;
  text-decoration:none;
  font-weight:700;
  font-size:21px;
  line-height:1;
  letter-spacing:.02em;
  white-space:nowrap;
}

.sleek-brand span{
  color:#7040a6;
}

.sleek-brand small{
  display:block;
  margin-top:6px;

  color:#686371;
  font-size:8px;
  font-weight:600;
  letter-spacing:.16em;
}

.sleek-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  flex:1;
}

.sleek-nav a{
  position:relative;

  color:#4d4853;
  text-decoration:none;

  font-size:12px;
  font-weight:700;
  line-height:1.3;

  white-space:nowrap;

  transition:
    color .2s ease,
    opacity .2s ease;
}

.sleek-nav a:hover,
.sleek-nav a.is-active{
  color:#7040a6;
}

.sleek-nav a.is-active::after{
  content:"";
  position:absolute;

  left:0;
  right:0;
  bottom:-10px;

  height:2px;

  background:#7040a6;
  border-radius:20px;
}

.sleek-main-site::after{
  content:" ↗";
}

.sleek-header-actions{
  display:flex;
  align-items:center;
  gap:9px;
}

.sleek-call,
.sleek-whatsapp{
  min-height:42px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:0 14px;

  border-radius:10px;

  font-family:inherit;
  font-size:12px;
  font-weight:700;

  text-decoration:none;
  cursor:pointer;

  white-space:nowrap;
}

.sleek-call{
  color:#4e297d;
  background:#f4eef9;
  border:1px solid #ddd3e7;
}

.sleek-whatsapp{
  color:#fff;
  background:#24c663;
  border:1px solid #24c663;
}

.sleek-menu-toggle{
  display:none;

  width:44px;
  height:44px;

  align-items:center;
  justify-content:center;

  border:1px solid #ddd3e7;
  border-radius:10px;

  background:#fff;
  color:#24222c;

  font-size:23px;
  line-height:1;

  cursor:pointer;
}

.sleek-mobile-menu{
  display:none;
}


/* ==========================================================
   TABLET / SMALL DESKTOP
   ========================================================== */

@media (max-width:1100px){

  .sleek-header-inner{
    width:min(100% - 30px, 1180px);
    gap:16px;
  }

  .sleek-nav{
    gap:13px;
  }

  .sleek-nav a{
    font-size:11px;
  }

  .sleek-call,
  .sleek-whatsapp{
    padding:0 11px;
    font-size:11px;
  }

}


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

@media (max-width:900px){

  .sleek-header-inner{
    width:calc(100% - 32px);
    min-height:72px;
  }

  .sleek-nav,
  .sleek-header-actions{
    display:none;
  }

  .sleek-menu-toggle{
    display:inline-flex;
  }

  .sleek-mobile-menu{
    width:100%;

    padding:8px 16px 20px;

    background:#fff;
    border-top:1px solid #eee5f5;
  }

  .sleek-mobile-menu.is-open{
    display:block;
  }

  .sleek-mobile-menu-inner{
    width:100%;
    max-width:1180px;
    margin:0 auto;
  }

  .sleek-mobile-menu a,
  .sleek-mobile-menu button{
    width:100%;
    min-height:48px;

    display:flex;
    align-items:center;

    padding:0 14px;

    color:#24222c;
    background:#fff;

    border:0;
    border-bottom:1px solid #eee5f5;

    font-family:inherit;
    font-size:14px;
    font-weight:700;

    text-decoration:none;
    text-align:left;

    cursor:pointer;
  }

  .sleek-mobile-menu a.is-active{
    color:#7040a6;
  }

  .sleek-mobile-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;

    margin-top:16px;
  }

  .sleek-mobile-actions .sleek-mobile-call,
  .sleek-mobile-actions .sleek-mobile-whatsapp{
    justify-content:center;

    border:0;
    border-radius:10px;

    text-align:center;
  }

  .sleek-mobile-actions .sleek-mobile-call{
    color:#4e297d;
    background:#f4eef9;
  }

  .sleek-mobile-actions .sleek-mobile-whatsapp{
    color:#fff;
    background:#24c663;
  }

}


@media (max-width:480px){

  .sleek-header-inner{
    width:calc(100% - 24px);
  }

  .sleek-brand{
    font-size:19px;
  }

  .sleek-brand small{
    font-size:7px;
  }

  .sleek-mobile-actions{
    grid-template-columns:1fr;
  }

}
