/* ROOT COLORS */
:root{
  --purple:#6b2a6d;
  --teal:#2fb8d6;
  --muted:#f6f7f9;
}

body{
  font-family: 'Arial', sans-serif;
  scroll-behavior: smooth;
}

/* ---------------- LOGO ---------------- */
.navbar-brand .logo-thumb{
  width:64px;
  height:64px;
  object-fit:cover;
  border-radius:8px;
}

.brand-title{
  color:#2C041C;
  font-weight:700;
}

/* ---------------- HERO SECTION ---------------- */
.hero-section{
  padding:4.5rem 0;
  background:linear-gradient(90deg, rgba(107,42,109,0.06), rgba(47,184,214,0.02));
}

.hero-img{
  border-radius:12px;
  box-shadow:0 8px 30px rgba(0,0,0,0.08);
  max-height:420px;
  object-fit:cover;
}

.section-title{
  font-weight:700;
  font-size:2rem;
  color:var(--purple);
}

/* ---------------- SERVICE CARDS ---------------- */
.service-card{
  border-radius:12px;
  transition:0.3s ease;
}

.service-card .card-img-top{
  height:160px;
  object-fit:cover;
  border-top-left-radius:12px;
  border-top-right-radius:12px;
}

.service-card:hover{
  transform:translateY(-6px);
  box-shadow:0 8px 20px rgba(0,0,0,0.1);
}

/* ---------------- BUTTONS ---------------- */
.btn-purple{
  background:var(--purple);
  color:#fff;
  border:0;
}
.btn-purple:hover{
  opacity:0.9;
}

/* ---------------- ABOUT LIST ---------------- */
.about-list li{
  margin-bottom:0.8rem;
  font-size:1rem;
}

/* ---------------- FOOTER ---------------- */
footer{
  border-top:1px solid rgba(255,255,255,0.06);
}

/* ---------------- CAROUSEL ---------------- */
.carousel-control-prev-icon,
.carousel-control-next-icon{
  filter:invert(1);
}
.carousel-control-prev,
.carousel-control-next{
  width:5%;
}

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:992px){
  .hero-img{
    display:none;
  }
  .navbar-brand .logo-thumb{
    width:48px;
    height:48px;
  }
}

/* ============================================= */
/*             RIGHT SLIDE-IN NAVBAR MENU        */
/* ============================================= */

@media (max-width:992px){

  /* Drawer container */
  #nav{
    position:fixed;
    top:0;
    right:-280px;
    width:260px;
    height:100vh;
    background:#ffffff;
    box-shadow:-2px 0 12px rgba(0,0,0,0.15);
    padding:80px 25px;
    transition:0.4s ease-in-out;
    z-index:9999;
    overflow-y:auto;
  }

  /* Show drawer */
  #nav.show{
    right:0;
  }

  /* Overlay */
  .nav-overlay{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.45);
    display:none;
    z-index:9990;
    backdrop-filter: blur(2px);
  }
  .nav-overlay.active{
    display:block;
  }

  /* Nav links */
  .nav-link{
    padding:14px 0;
    font-size:1.15rem;
    font-weight:500;
    color:#333 !important;
    display:flex;
    align-items:center;
    border-bottom:1px solid #f1f1f1;
  }

  .nav-link i{
    width:22px;
    font-size:1.2rem;
    color:#2C041C;
  }

  .nav-link:hover{
    color:var(--purple) !important;
  }
}

/* END OF FILE */