/* BantuKita Landing Natural Lynk Style
   Scope: public landing only.
   Goal: natural, soft, clean, not AI-template-looking.
*/

:root{
  --bk-green:#23b47e;
  --bk-green-dark:#168a62;
  --bk-ink:#293c37;
  --bk-text:#536760;
  --bk-muted:#7a8b86;
  --bk-soft:#eff9f5;
  --bk-soft-2:#f8fcfa;
  --bk-line:#e6efeb;
  --bk-white:#ffffff;
  --bk-shadow:0 10px 28px rgba(40,91,74,.075);
  --bk-shadow-soft:0 6px 18px rgba(40,91,74,.055);
}

html{
  scroll-behavior:smooth;
}

body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]){
  font-family:Poppins,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  color:var(--bk-text) !important;
  background:
    radial-gradient(circle at 84% 13%, rgba(35,180,126,.075), transparent 27%),
    linear-gradient(180deg,#eef9f5 0%,#f7fcfa 42%,#ffffff 100%) !important;
  -webkit-font-smoothing:antialiased;
  text-rendering:auto;
}

body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) *{
  box-sizing:border-box;
}

body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) a{
  text-decoration:none;
}

/* Jangan semua elemen jadi bold */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) strong,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) b{
  font-weight:600 !important;
}

/* Header natural seperti Lynk: simpel, tidak terlalu shadow */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) header{
  background:transparent !important;
}

body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) header nav,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .navbar,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .nav-wrapper,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .site-header,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .landing-header{
  border-radius:999px !important;
  border:1px solid rgba(224,237,232,.82) !important;
  background:rgba(255,255,255,.78) !important;
  box-shadow:0 8px 22px rgba(43,91,76,.055) !important;
  backdrop-filter:blur(12px);
}

/* Nav text diturunkan biar tidak kaku */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) header a,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) nav a{
  font-size:13px !important;
  font-weight:600 !important;
  letter-spacing:-.01em !important;
  color:#263d36 !important;
}

/* Brand jangan terlalu berat */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) [class*="brand"],
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) [class*="logo"]{
  font-weight:700 !important;
  letter-spacing:-.025em !important;
}

/* Headline: dari AI-bold jadi natural editorial */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) h1{
  color:#33413d !important;
  font-weight:600 !important;
  letter-spacing:-.045em !important;
  line-height:1.04 !important;
  text-wrap:balance;
}

body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) h2{
  color:#2f403b !important;
  font-weight:600 !important;
  letter-spacing:-.03em !important;
  line-height:1.18 !important;
}

body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) h3,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) h4{
  color:#31443e !important;
  font-weight:600 !important;
  letter-spacing:-.018em !important;
}

/* Paragraph lebih halus */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) p,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) li,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) span{
  line-height:1.72;
}

/* Hero subtitle jangan terlalu besar/berat */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) p{
  color:var(--bk-text) !important;
  font-weight:400 !important;
}

/* Search/input natural */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) input[type="text"],
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) input[type="search"],
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) input[type="email"],
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) input[type="password"],
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) select,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) textarea{
  border:1px solid var(--bk-line) !important;
  border-radius:14px !important;
  background:#fff !important;
  box-shadow:0 6px 16px rgba(39,88,71,.055) !important;
  color:#566862 !important;
  font-size:14px !important;
  font-weight:400 !important;
  outline:none !important;
}

body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) input::placeholder{
  color:#7f8d89 !important;
  font-weight:400 !important;
}

/* Button tidak terlalu “SaaS template” */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) button,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .btn,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .button,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) a[class*="btn"],
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) a[class*="button"]{
  font-weight:600 !important;
  letter-spacing:-.01em !important;
  transition:all .16s ease !important;
}

body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .btn-primary,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .button-primary,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) button[type="submit"],
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) a[href*="register"],
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) a[href*="daftar"]{
  background:var(--bk-green) !important;
  border-color:var(--bk-green) !important;
  color:#fff !important;
  box-shadow:0 8px 18px rgba(35,180,126,.18) !important;
  font-weight:600 !important;
}

body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .btn-primary:hover,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .button-primary:hover,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) button[type="submit"]:hover,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) a[href*="register"]:hover,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) a[href*="daftar"]:hover{
  background:var(--bk-green-dark) !important;
  border-color:var(--bk-green-dark) !important;
  transform:translateY(-1px);
}

/* Card lebih flat natural */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .card,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .product-card,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .category-card,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .feature-card,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) article,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) [class*="card"]{
  border-color:var(--bk-line) !important;
  border-radius:18px !important;
  box-shadow:var(--bk-shadow-soft) !important;
}

body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .card:hover,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .product-card:hover,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .category-card:hover,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .feature-card:hover,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) article:hover{
  transform:translateY(-1px);
  box-shadow:var(--bk-shadow) !important;
}

/* Badge/chip lebih kalem */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .badge,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .chip,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) [class*="badge"],
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) [class*="chip"],
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) [class*="tag"]{
  border-radius:999px !important;
  border-color:#dcefe7 !important;
  background:#f3fbf7 !important;
  color:#16815e !important;
  font-weight:500 !important;
}

/* Matikan kesan terlalu tebal dari utility class */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .font-bold,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .fw-bold{
  font-weight:600 !important;
}

body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .font-extrabold,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .font-black{
  font-weight:600 !important;
}

/* Shadow utility diturunkan */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .shadow,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .shadow-lg,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .shadow-xl,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .shadow-2xl{
  box-shadow:var(--bk-shadow-soft) !important;
}

/* Section jangan terlalu kontras */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) section:nth-of-type(even){
  background:rgba(248,252,250,.62) !important;
}

/* Hero spacing lebih natural */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) section:first-of-type{
  background:transparent !important;
}

/* Ilustrasi tetap, tapi visual sekitar lebih soft */
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) img,
body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) svg{
  max-width:100%;
}

/* Responsive */
@media(max-width:768px){
  body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) header nav,
  body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .navbar,
  body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .nav-wrapper,
  body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .site-header,
  body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) .landing-header{
    border-radius:22px !important;
  }

  body:not(.admin):not(.admin-body):not(.metronic):not([class*="admin"]) h1{
    font-weight:600 !important;
    letter-spacing:-.04em !important;
    line-height:1.06 !important;
  }
}