* {font-family: 'Poppins', sans-serif !important;}
body {font-family: 'Poppins', sans-serif !important;}
.container{max-width:1320px;}
/* ===== Navbar ===== */
.top-bar small{font-size: 18px;}
.top-bar .social-icons i{font-size: 18px;display: flex; align-items: center;justify-content: center;}
.navbar-brand img{height: 60px;}
.navbar-nav .nav-link {margin: 0 12px;font-weight: 500;font-style: Medium;font-size: 20px;}
.navbar .btn {padding: 14px 32px;font-weight: 500;background-color: #2F7EF2;border-radius: 999px;font-size: 20px;}
.top-bar{position: fixed;top: 0; left: 0; right: 0;z-index: 1031;transform: translateY(0);transition: transform .28s ease;height: 60px;background-color: #2F7EF2;display: flex;align-items: center;}
.top-bar.hide{transform: translateY(-100%);  }
.navbar{position: fixed;left: 0; right: 0;top: 60px;  z-index: 1030;transition: top .28s ease;}
.top-bar.hide + .navbar{top: 0;}
.social-btn {width: 40px;height: 40px;border-radius: 50%;background: #fff;display: flex;align-items: center;justify-content: center;color: #2F7EF2;font-size: 20px;text-decoration: none;transition: all 0.25s ease;}
.social-btn:hover {background: #2f7df2cc;color: #fff;border: solid 2px #ffffffc4;}
.social-icons {display: flex;align-items: center;gap: 10px; }
.navbar-nav .nav-link.active,
.sidebar-menu a.active {color: #2F7EF2 !important;font-weight: 600;}

/* ===== Mobile Sidebar ===== */
.navbar-toggler {border: none !important;box-shadow: none !important;outline: none !important;background: transparent !important;padding: 0.25rem 0.5rem;}
.sidebar-mobile {width: 70% !important;border: 0;--bs-offcanvas-bg: #ffffff;--bs-offcanvas-zindex: 1055;--bs-offcanvas-transition: transform .28s ease-in-out;}
.sidebar-mobile .offcanvas-header {padding: 16px 20px 8px;}
.sidebar-mobile .sidebar-logo {height: 44px;}
.sidebar-mobile .sidebar-close {background: transparent;width: 28px; height: 28px;display: inline-flex; align-items: center; justify-content: center;opacity: 1;}
.sidebar-mobile .sidebar-close i { font-size: 14px; }
.sidebar-mobile .offcanvas-body { padding: 8px 20px 20px; }
.sidebar-menu li + li { border-top: 1px solid #e9eef5; }
.sidebar-menu a {display: block;padding: 16px 0;text-decoration: none;color: #2a2a2a;font-weight: 500;}
.sidebar-menu a:hover { color: #2F7EF2; }
.sidebar-mobile .social-btn {width: 36px; height: 36px;border-radius: 50%;color: #2F7EF2;background-color: #fff;display: inline-flex; align-items: center; justify-content: center;text-decoration: none;font-size: 16px;box-shadow: 0 6px 16px rgba(0,0,0,.08);}

@media (min-width: 992px){.sidebar-mobile { display: none; }}

/* ===== Hero ===== */
.hero{background-color: #F5F5F5;padding-top: 32px !important;max-height: fit-content;}
.hero-tag{font-weight: 400;font-size: 20px;color: #707070;background-color: #fff;border-radius: 999px;padding: 12px;width: fit-content;margin-bottom: 24px;}
.col-hero{transform: translateY(-60px);}
.hero-title{font-weight: 600;font-style: SemiBold;font-size: 46px;color: #292929;padding-bottom: 32px;line-height: 4rem;}
.hero-desc {font-weight: 400;font-size: 20px;color: #707070;padding-bottom: 46px;margin: 0px;max-width: 567px;}
.hero-desc a {text-decoration: none;font-weight: 600;}
.hero-avatar{margin: 0px;padding-top: 46px;}
.hero-avatar span {font-weight: 500;font-style: Medium;font-size: 24px;line-height: 25px;color: #292929;}
.hero-avatar-text small{font-weight: 400;font-size: 18px;color: #707070;}
.hero .btn{padding: 14px 32px;font-weight: 500;background-color: #2F7EF2;border-radius: 999px;font-size: 20px;}

.owl-carousel{padding-top: 100px;}
.owl-carousel .card{margin: 10px;}
.owl-carousel a{text-decoration: none;}
.owl-carousel .card:hover{ transform: scale(1.01); box-shadow: 0 2px 8px rgba(0,0,0,0.2);}
.owl-carousel .card, .properti .card {border-radius: 16px;overflow: hidden;border: none;box-shadow: 0 6px 16px rgba(0,0,0,.08);  }
.owl-carousel .card-body, .properti .card-body {padding: 34px 20px 20px;}
.owl-carousel .card-body .card-title, .properti .card-body .card-title{font-weight: 500;font-style: Medium;font-size: 24px;color: #292929;padding-bottom: 20px;margin: 0px;}
.owl-carousel .card-body .card-desc, .properti .card-body .card-desc {font-weight: 400;font-style: Regular;font-size: 20px;color: #707070;margin: 0px;line-height: 1.7rem;}
.owl-carousel .card-body .small, .properti .card-body .small {font-weight: 400;font-style: Regular;font-size: 14px;color: #292929;display: flex;align-items: center;gap: 4px;}
.owl-carousel .owl-stage {padding-left: 0 !important;padding-bottom: 20px;}

.owl-carousel .owl-nav {position: absolute;top: -30px; left: 0;display: flex;gap: 10px;margin-top: 40px;}
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {background: #fff !important;border-radius: 50%;width: 64px;height: 64px;box-shadow: 0 2px 8px rgba(0,0,0,0.1);border: none;display: flex;justify-content: center;align-items: center;font-size: 24px !important;color: #000 !important;transition: all 0.3s ease;}
.owl-carousel .owl-nav button.owl-prev:hover,
.owl-carousel .owl-nav button.owl-next:hover {background: #2F7EF2 !important; color: #fff !important;}
.rounded-circle{margin-left: -20px;}

/* ===== Properti ===== */
.properti{padding-top: 64px;}
.properti .text-muted,.properti-rumah .text-muted,.fasilitas .text-muted, .lokasi .text-muted,.contact .text-muted{font-weight: 400;font-style: Regular;font-size: 20px;padding-bottom: 10px;margin: 0px !important;color: #707070 !important;}
.properti-title { font-weight: 600;font-style: SemiBold;font-size: 46px;padding-bottom: 64px;margin: 0px !important;}
.tag-group {position: absolute; top: 18px; left: 18px;display: flex; gap: 10px; flex-wrap: wrap;}
.property-divider {margin: 16px 0 14px; opacity: .25;}
.property-meta .item { display:flex; align-items:center; gap:6px;}
.property-card.shadow-sm { box-shadow: 0 12px 24px rgba(0,0,0,.06)!important;}
.properti a{text-decoration: none;}
.properti .card:hover{ transform: scale(1.01); box-shadow: 0 2px 8px rgba(0,0,0,0.2);}

/* ===== Fasilitas ===== */
.fasilitas{padding-top: 90px;}
.fasilitas-title{font-weight: 600;font-style: SemiBold;font-size: 46px;color: #292929;padding-bottom: 64px;margin: 0px;}
.fasilitas-card{position: relative;border-radius: 22px;background: #f4f5f7;padding: 28px;overflow: hidden;box-shadow: 0 10px 26px rgba(0,0,0,.10);min-height: 320px;}
.fasilitas-copy{position: relative;z-index: 2;max-width: 44%;}
.fasilitas-copy .title{font-weight: 500;font-style: Medium;font-size: 32px;color: #292929;margin: 0px;padding-bottom: 16px;}
.fasilitas-copy .desc{font-weight: 400;font-style: Regular;font-size: 20px;color: #707070;margin: 0px;padding-bottom: 50px;}
.fasilitas-btn{border-radius: 999px;padding: 10px 18px;font-weight: 400;font-size: 20px;}
.fasilitas-illustration{position: absolute;right: -6%;bottom: -2%;width: 70%;z-index: 1;}
.fasilitas-illustration img{width: 100%;height: auto;display: block;border-bottom-right-radius: 22px;}
.fasilitas-illustration.fade-left img{-webkit-mask-image: linear-gradient(to left, rgba(0,0,0,1) 70%, rgba(0,0,0,0) 100%);mask-image: linear-gradient(to left, rgba(0,0,0,1) 70%, rgba(0,0,0,0) 100%);}

.wrapper {max-width: 100%;overflow: hidden;background-color: #2F7EF2;margin: 120px 0px 90px;}
.marquee {white-space: nowrap;overflow: hidden;display: inline-block;animation: marquee 25s linear infinite;margin-bottom: 0px;}
.marquee img{padding: 14px 64px 7px 0px;}
.marquee p {display: inline-block;}

@keyframes marquee {
  0% {transform: translate3d(0, 0, 0);}
  100% {transform: translate3d(-50%, 0, 0);}
}

/* ===== Lokasi ===== */
.lokasi-title { font-weight: 600;font-style: SemiBold;font-size: 46px;padding-bottom: 64px;margin: 0px !important;}
.lokasi-preview {border-radius: 14px;overflow: hidden;flex: 1; }
.lokasi-preview img {width: 100%;height: 100%;object-fit: cover;display: block;transition: opacity .25s ease;border-radius: 14px;}
.lokasi-card{flex: 1;display: flex;flex-direction: column;justify-content: center;background:#fff;border-radius: 14px;padding: 20px 32px;box-shadow: 0 10px 24px rgba(0,0,0,.06);border: 1px solid rgba(0,0,0,.06);cursor: pointer;outline: none;transition: box-shadow .2s ease, border-color .2s ease, transform .08s ease;}
.lokasi-card-title{font-weight: 600;font-style: Medium;font-size: 24px;padding-bottom: 14px;}
.lokasi-card-desc{font-weight: 400;font-style: Regular;font-size: 20px;opacity: 0.8;}
.lokasi-card-desc span{font-weight: 600;color: #292929; }
.lokasi-card:hover{background-color: #2F7EF2;box-shadow: 0 12px 28px rgba(0,0,0,.08);color: #fff !important; }
.lokasi-card:hover span{font-weight: 600;color: #fff !important; }
.lokasi-card.active{background-color: #2F7EF2;box-shadow: 0 14px 28px rgba(0,0,0,.1);color: #fff !important;}
.lokasi-card.active span{font-weight: 600;color: #fff !important;}

/* ===== Produk (CTA Banner) ===== */
.produk{padding-top: 90px;}
.produk-cta{position: relative;background: #2F7EF2;border-radius: 22px;height: fit-content;padding: 32px 32px 32px 64px;overflow: hidden;box-shadow: 0 10px 26px rgba(0,0,0,.08);color: #fff;display: flex;align-items: center;}
.produk-copy{position: relative;z-index: 2;max-width: 48%;}
.produk-eyebrow{ font-weight: 400;font-style: Regular;font-size: 20px;padding-bottom: 8px;margin: 0px;}
.produk-headline{font-weight: 600;font-style: SemiBold;font-size: 46px;padding-bottom: 24px;line-height: 4rem;margin: 0px;}
.produk-sub{ font-weight: 400;font-style: Regular;font-size: 20px;padding-bottom: 60px;margin: 0px;}
.produk-btn{border-radius: 999px;padding: 10px 18px;font-weight: 400;color: #fff;font-size: 20px;}
.produk-illustration{position: absolute;right: 0;bottom: 0;width: 48%;height: 100%;display: flex;align-items: end;justify-content: flex-end;pointer-events: none;}
.produk-illustration img{height: auto;width: 100%;object-fit: contain;display: block;filter: drop-shadow(0 14px 28px rgba(0,0,0,.25));border-bottom-right-radius: 22px;}

@media (max-width: 991.98px){
  .produk-cta{ padding: 28px 20px 80px; }
  .produk-copy{ max-width: 100%; }
  .produk-illustration{position: absolute; right: -12%; bottom: -6%; width: 70%; opacity: .35;}
  .produk-headline{ font-size: 28px; }
  .produk-btn{ left: 20px; bottom: 24px; }
}

/* ===== Contact ===== */
.contact{padding-top: 0px;}
.contact-title { font-weight: 600;font-style: SemiBold;font-size: 46px;padding-bottom: 64px;margin: 0px !important;}
.contact-label{ font-weight: 400;font-style: Regular;font-size: 20px;padding: 12px 0px;margin: 0px }
.contact-control{background:#f6f7f9;border-radius:12px;height:46px;padding:10px 14px;box-shadow:none;font-weight: 400;font-size: 18px;margin: 0px;}
.contact-control:focus{border-color:#2F7EF2;background:#fff;outline:0;box-shadow:0 0 0 .15rem rgba(47,126,242,.15);}
.contact-notes{ height:auto; min-height:180px; resize:vertical; }
.contact-submit{border-radius:999px; padding:10px 20px;font-weight: 400;font-size: 20px;margin-top: 20px;}
.contact-card{border-radius:14px; padding:16px; box-shadow:0 10px 24px rgba(0,0,0,.06);}
.contact-card.primary{background:#2F7EF2; color:#fff; padding:18px; margin-top: 12px;}
.contact-card.secondary{background:#fff; border:1px solid #eef1f5;}
.contact-item{ display:flex;align-items: center !important; gap:10px; align-items:flex-start; padding:10px 6px; font-weight: 400;font-size: 20px;}
.contact-item + .contact-item{ display:flex;align-items: center;border-top:1px solid rgba(255,255,255,.15);font-weight: 400;font-size: 20px; }
.contact-item .icon{width:60px; height:60px; border-radius:50%;flex-shrink: 0;display:flex; align-items:center; justify-content:center;background:#fff;color: #000;}
.contact-maps{margin-top:20px;width:100%;border-radius:999px;background-color: #2F7EF2;font-weight: 400;font-size: 20px;color: #fff; padding: 17px !important;}

/* ===== Footer ===== */
.site-footer{background:#2F7EF2;color:#fff;margin-top:90px;padding:46px 0 22px;position:relative;}
.footer-title{font-weight: 500;font-style: Medium;font-size: 24px;margin: 0px;padding-bottom: 32px;}
.footer-brand{padding-bottom:46px ;margin: 0px;}
.footer-text{ font-weight: 400;font-style: Regular;font-size: 18px;padding-bottom: 60px;}
.footer-text-2{ font-weight: 400;font-size: 20px;line-height: 32px;padding-bottom: 32px;margin: 0px;}
.footer-links{ list-style:none; padding:0; margin:0; }
.footer-links li a{color:#eaf1ff; text-decoration:none; display:block; padding:6px 0;font-weight: 400;font-size: 20px;}
.footer-links li a:hover{ text-decoration:underline; }
.subscribe{background:rgba(255,255,255,.22);border-radius:999px;padding:6px;display:flex;align-items:center;gap:8px;width:100%;max-width:420px;}
.subscribe-input{background:transparent; border:0; outline:0; color:#fff; flex:1;padding:10px 14px; border-radius:999px;}
.subscribe-input::placeholder{ color:#dbe6ff; opacity:.9; }
.subscribe-btn{background:#F2B33A; border:0; color:#ffffff; font-weight:600;padding:10px 22px; border-radius:999px; box-shadow:0 2px 0 rgba(0,0,0,.1);}
.subscribe-btn:hover{ filter:brightness(.95); }
.footer-divider{border:0; height:2px; background:rgba(255, 255, 255, 0.541);margin:60px 0 24px;}
.footer-copy{ font-weight: 400;font-size: 18px;text-align: center;color:#eaf1ff;}
.footer-social .soc{width:60px; height:60px; border-radius:50%; border: solid 4px #2f7df29a;display:flex; align-items:center; justify-content:center;background:#fff; color:#2F7EF2; text-decoration:none; font-size: 20px;box-shadow:0 6px 16px rgba(0,0,0,.12);}
.footer-social .soc:hover{ transform:translateY(-1px); }

/* =========================
   RESPONSIVE – MOBILE (≤ 575.98px)
   ========================= */
@media (max-width: 800px) {
  /* Header compact */
  .top-bar { display: none !important; }
  .top-bar small, .top-bar i { font-size: 14px; }
  .social-icons { gap: 6px; }
  .social-btn { width: 34px; height: 34px; font-size: 16px; }
  .navbar { top: 0px !important; padding-top: 6px; padding-bottom: 6px; }
  .navbar-brand img { height: 40px; }
  .navbar-nav .nav-link { font-size: 15px; margin: 4px 8px; }
  .navbar .btn { padding: 10px 16px; font-size: 15px; }
  .container{padding: 0px 20px;}

  /* Hero */
  .hero { padding-top: 80px !important; }
  .hero-tag { font-size: 14px; padding: 8px 12px; margin-bottom: 14px; }
  .hero-title { font-size: 32px; line-height: 2.5rem; padding-bottom: 12px; }
  .hero-desc { font-size: 16px; padding-bottom: 24px; max-width: 100%; }
  .hero .btn { width: 100%; font-size: 16px; padding: 10px; margin-bottom: 20px;}
  .hero-avatar { padding-top: 20px; }
  .hero-avatar span { font-size: 16px; line-height: 1.3rem; }
  .hero-avatar small { font-size: 16px; line-height: 1.1rem; }
  .rounded-circle { width: 44px !important; height: 44px !important; }

  /* Owl */
  .owl-carousel { padding-top: 16px; }
  .owl-card{padding: 0px;}
  .owl-carousel .card-body { padding: 18px 14px; }
  .owl-carousel .card:hover{ transform: none;}
  .owl-carousel .card-body .card-title { font-size: 18px; }
  .owl-carousel .card-body .card-desc { font-size: 14px; line-height: 1.3rem; }
  .owl-carousel .owl-nav { top: -90px; }
  .owl-carousel .owl-nav button.owl-prev,
  .owl-carousel .owl-nav button.owl-next { width: 40px; height: 40px; font-size: 16px !important; }

  /* Properti */
  .properti { padding-top: 40px; }
  .properti .text-muted, .properti-rumah .text-muted { font-size: 16px !important; }
  .properti-title { font-size: 28px; padding-bottom: 18px; }
  .properti .card-body {padding: 24px 16px 16px;}
  .properti .card-body img { max-width: 100%;height: auto;display: inline-block; object-fit: contain;}
  .properti .card-body .card-desc { font-size: 16px; line-height: 1.5rem; }
  .properti .card-body .card-title { font-size: 20px; }

  /* Fasilitas */
  .fasilitas { padding-top: 40px; }
  .fasilitas .text-muted { font-size: 16px; }
  .fasilitas-title { font-size: 28px; padding-bottom: 18px; }
  .fasilitas-card { padding: 0px; min-height: auto; border-radius: 14px; background: #f5f5f5;box-shadow: 0 2px 8px rgba(0,0,0,0.18);}
  .fasilitas-copy { padding: 18px; max-width: 100%; }
  .fasilitas-copy .title { font-size: 22px; }
  .fasilitas-copy .desc { font-size: 16px; padding-bottom: 20px; }
  .fasilitas-illustration { position: static; width: 100%; margin-top: 10px; }
  .fasilitas-illustration img { border-radius: 0px 0px 14px 14px; -webkit-mask-image: none; mask-image: none; padding: 0;  }
  .fasilitas-btn{font-size: 18px; padding: 8px 18px;}
  
  /* Marquee */
  .wrapper {margin: 60px 0px;}

  /* Lokasi */
  .lokasi-title { font-size: 28px; padding-bottom: 18px; }
  .lokasi .text-muted {font-size: 16px;}
  .lokasi-preview { height: 240px; }
  .lokasi-card { padding: 16px; }
  .lokasi-card-title { font-size: 18px; margin: 0px; padding-bottom: 10px; }
  .lokasi-card-desc { font-size: 16px; }

  /* Produk (CTA) */
  .produk { padding-top: 40px; }
  .produk-cta { padding: 20px 16px ; border-radius: 18px; }
  .produk-headline { font-size: 28px; line-height: 2.2rem; padding-bottom: 12px; }
  .produk-sub { font-size: 16px; padding-bottom: 40px; }
  .produk-btn { width: 100%; font-size: 16px; }
  .produk-illustration { position: absolute; bottom: 0; width: 100%; opacity: .4; }

  /* Contact */
  .contact { padding-top: 0; }
  .contact .text-muted { font-size: 16px; }
  .contact-title { font-size: 28px; padding-bottom: 18px; }
  .contact-label { font-size: 14px; }
  .contact-control { height: 42px; font-size: 15px; }
  .contact-submit { width: 100%; font-size: 16px; margin-top: 24px; }
  .contact-item { font-size: 16px !important; text-decoration: none; color: #fff !important; }
  .contact-item .icon { width: 42px; height: 42px; }
  .contact-maps { padding: 12px !important; font-size: 16px; }

  /* Footer */
  .footer-title { font-size: 18px;padding-bottom: 16px; padding-top: 20px;}
  .footer-brand{padding-bottom: 20px !important; margin: 0px !important;}
  .footer-brand img{height: 60px; }
  .footer-text,.footer-text-2{padding-bottom: 30px; line-height: 1.5rem; margin: 0px;}
  .footer-text, .footer-text-2, .footer-copy, .footer-links a { font-weight: 400px !important; font-size: 16px !important; color: #fff !important;}
  .footer-divider { margin: 28px 0 16px; }
  .footer-social .soc { width: 44px; height: 44px; font-size: 16px; }
  .site-footer .row > [class*="col-"] {flex: 0 0 100% !important;max-width: 100% !important;}
  .site-footer > .container > .d-flex {flex-direction: column-reverse !important; align-items: center !important;text-align: center;gap: 12px;}
}

/* =========================
   RESPONSIVE – TABLET (901px – 1400px)
   ========================= */
@media (min-width:801px) and (max-width:1400px){

  /* Header / Navbar */
  .top-bar{ height:56px;}
  .top-bar small,.top-bar i{font-size: 14px;}
  .navbar{ top:56px; }
  .navbar-brand img{ height:52px; }
  .navbar-nav .nav-link{ font-size:18px; margin:0 10px; }
  .navbar .btn{ padding:12px 24px; font-size:18px; }
  .social-btn{ width:36px; height:36px; font-size:18px; }

  /* Container breathing space */
  .container{ padding-left:24px; padding-right:24px; }

  /* Hero */
  .hero{ padding-top:24px !important; }
  .col-hero{ transform: translateY(-24px); }
  .hero-tag{ font-size:18px; padding:10px 14px; }
  .hero-title{ font-size:40px; line-height:3.2rem; padding-bottom:22px; }
  .hero-desc{ font-size:18px; max-width:520px; padding-bottom:32px; }
  .hero .btn{ padding:12px 24px; font-size:18px; }
  .hero-avatar{ padding-top:32px; }
  .hero-avatar span{ font-size:20px; }
  .hero-avatar-text small{ font-size:16px; }

  /* Owl (hero cards) */
  .owl-carousel{ padding-top:100px; }
  .owl-carousel .card-body{ padding:28px 18px 18px; }
  .owl-carousel .card-body .card-title{ font-size:18px; }
  .owl-carousel .card-body .card-desc{ font-size:14px; line-height: 1.5rem; }
  .owl-carousel .owl-nav{ top:-26px; }
  .owl-carousel .owl-nav button.owl-prev,
  .owl-carousel .owl-nav button.owl-next{width:56px; height:56px; font-size:20px !important;}

  /* Properti */
  .properti{ padding-top:70px; }
  .properti .text-muted{ font-size:18px; }
  .properti-title{ font-size:40px; padding-bottom:40px; }
  .properti .card-body{ padding:28px 18px 18px; }
  .properti .card-body .card-title{ font-size:18px; }
  .properti .card-body .card-desc{ font-size:15px; line-height: 1.5rem; }

  /* Fasilitas */
  .fasilitas{ padding-top:70px; }
  .fasilitas .text-muted{ font-size:18px; }
  .fasilitas-title{ font-size:40px; padding-bottom:40px; }
  .fasilitas-card{ padding:24px; min-height:300px; }
  .fasilitas-copy{ max-width:52%; }
  .fasilitas-copy .title{ font-size:28px; }
  .fasilitas-copy .desc{ font-size:16px; padding-bottom:36px; }
  .fasilitas-illustration{ right:-6%; bottom:-2%; width:64%; }

  /* Running marquee */
  .wrapper{ margin:90px 0 70px; }

  /* Lokasi */
  .lokasi-title{ font-size:40px; padding-bottom:40px; }
  .lokasi .text-muted{ font-size:18px; }
  .lokasi-preview{ height:420px; }
  .lokasi-card{ padding:20px 24px; }
  .lokasi-card-title{ font-size:22px; }
  .lokasi-card-desc{ font-size:20px; }

  /* Produk (CTA) */
  .produk{ padding-top:70px; }
  .produk-cta{ padding:28px 28px 28px 48px; }
  .produk-copy{ max-width:52%; }
  .produk-headline{ font-size:36px; line-height:3.2rem; padding-bottom:18px; }
  .produk-sub{ font-size:18px; padding-bottom:48px; }
  .produk-btn{ font-size:18px; padding:10px 22px; }
  .produk-illustration{ width:50%; }

  /* Contact */
  .contact-title{ font-size:40px; padding-bottom:40px; }
  .contact-label{ font-size:18px; }
  .contact-control{ height:44px; font-size:16px; }
  .contact-submit{ font-size:18px; margin-top:40px; }
  .contact-item{ font-size:16px !important; }
  .contact-item .icon{ width:52px; height:52px; }
  .contact-maps{ font-size:18px; padding:14px !important; }

  /* Footer */
  .footer-title{ font-size:22px; padding-bottom:24px; }
  .footer-brand img{ height:80px; }
  .footer-text{ font-size:16px; padding-bottom:40px; }
  .footer-text-2{ font-size:18px; line-height:28px; padding-bottom:24px; }
  .footer-links li a{ font-size:18px; }
  .subscribe{ max-width:520px; }
  .footer-social .soc{ width:52px; height:52px; font-size:18px; }
  .footer-copy{ font-size:16px; }
}

/* ===== Page Tentang Kami - Hero ===== */
.tentang-kami-hero { background: #fff; padding-top: 64px; }

.tk-pill{background: #f4f6fb;border: 1px solid #e7ecf6;color: #6b7687;padding: 8px 14px;border-radius: 999px;line-height: 1;font-weight: 400;font-size: 20px;margin-bottom: 18px;}
.tk-pill i{width: 35px; height: 35px;font-size: 20px !important;border-radius: 50%;background: #e9f1ff;color: #2F7EF2;display: inline-flex; align-items: center; justify-content: center;}
.tk-heading{padding-bottom: 46px;}
.tk-title{font-weight: 600;font-style: SemiBold;font-size: 46px;line-height: 3.5rem;margin: 0px;}
.tk-desc{font-weight: 400;font-style: Regular;font-size: 19px;color: #707070;}

.tk-image-wrap{ border-radius: 18px; overflow: hidden; }
.tk-image{width: 100%;display: block;border-radius: 18px;box-shadow: 0 12px 28px rgba(0,0,0,.08);}

@media (min-width:901px) and (max-width:1400px){
  .tk-title, .vm-title{ font-size: 32px !important; line-height: 2.5rem !important; }
  .tk-desc,.vm-desc{ font-size: 15px; }
}

.visi-misi{ background:#fff; padding: 90px 0px; }
.visi-misi .text-muted{font-size: 20px;color: #707070 !important;}
.vm-title{ font-weight: 600;font-style: SemiBold;font-size: 46px;line-height: 3.5rem; }
.vm-desc{ font-weight: 400;font-style: Regular;font-size: 19px;color: #707070; }
.visi-misi .stats{padding: 46px 0px 90px;}
.vm-number{ font-weight: 600;font-style: SemiBold;font-size: 64px;color: #292929; }
.vm-label{ font-weight: 400;font-style: Regular;font-size: 24px;color: #707070;}

.vm-card-wrap{ position:relative; }
.vm-bg{ width:100%; border-radius:18px;}
.vm-card{background:#fff;border-radius:12px;padding:46px;max-width:786px;margin:-420px auto 0;position:relative;z-index:2;text-align: center; }
.vm-tabs{display: inline-flex !important; width: auto;max-width: 100%;background: #f1f3f7;padding: 6px;border-radius: 999px;margin: 0 auto 24px;gap: 0;}
.vm-tab{border: 0;background: transparent;color: #444;padding: 10px 22px;border-radius: 999px;cursor: pointer;transition: all .25s ease;font-weight: 400;font-style: Regular;font-size: 20px;}
.vm-tab.active{background: #2F7EF2;color: #fff;box-shadow: 0 4px 10px rgba(0,0,0,.12);}
.vm-content{text-align: left;}
.vm-content .content-title{font-weight: 600;font-style: SemiBold;font-size: 46px;padding-bottom: 32px;color: #292929;line-height: 3.5rem; }
.vm-content p{ font-weight: 400;font-style: Regular;font-size: 20px;color: #707070; }

@media(max-width:800px){
  .tentang-kami-hero { padding-top: 40px; }
  .tk-heading{padding-bottom: 30px;}
  .tk-pill{ font-size: 14px; padding: 7px 12px; }
  .tk-title{ font-size: 28px; line-height: 2.5rem; }
  .tk-desc{ font-size: 16px; margin-top: -6px; }
  .tk-image{ border-radius: 14px; }

  .visi-misi{padding: 40px 0px;}
  .visi-misi .text-muted{font-size: 16px;}
  .vm-title{ font-size:28px; line-height: 2.5rem;}
  .vm-desc{font-size: 16px;}
  .vm-number{ font-size:28px; }
  .vm-card{ padding:20px; margin-top:30px; }
  .vm-label{font-size: 16px;}
  .vm-tab{font-size: 14px;}
  .visi-misi .stats{padding: 20px 0px;}
  .vm-content .content-title{font-size: 28px;line-height: 2.5rem; padding-bottom: 30px;}
  .vm-content p{font-size: 16px;}
}

/* ===== Pege Section Mushola ===== */
.mushola { background: #fff; padding-top: 90px;}
.kolam-renang { background: #fff; padding-top: 90px;}
.kolam-renang-teks{padding-bottom: 20px !important; margin: 0px;}
.kolam-renang li{font-size: 20px; font-weight: 600;}
.kolam-renang ul{margin: 0px !important;}
.mushola-title{font-weight: 500;font-style: Medium;font-size: 40px;text-align: center;color: #292929;padding-bottom: 64px;line-height: 3.5rem;}
.mushola-figure{border-radius: 14px;overflow: hidden;margin: 0px;box-shadow: 0 12px 26px rgba(0,0,0,.06);}
.mushola-figure img{display: block;width: 100%;height: auto;}
.content-mushola, .content-kolam-renang{padding-top: 80px;}
.mushola-subtitle{font-weight: 500;font-style: Medium;font-size: 28px;color: #292929;padding-bottom: 24px;}
.mushola p, .kolam-renang p{font-weight: 400;font-style: Regular;font-size: 20px;color: #292929;padding-bottom: 46px;}

/* ===== Mobile ===== */
@media (max-width: 900px){
  .mushola,.kolam-renang{padding-top: 32px;}
  .mushola-title{font-size: 28px;line-height: 2rem;padding-bottom: 32px;}
  .content-mushola,.content-kolam-renang{padding-top: 32px;}
  .content-kolam-renang p{font-size: 16px !important;margin: 0px;padding-bottom: 32px;}
  .mushola p{font-size: 16px !important;margin: 0px;padding-bottom: 32px;}
  .mushola-figure{border-radius: 12px;margin: 12px 0 16px;box-shadow: 0 8px 18px rgba(0,0,0,.05);}
  .mushola-subtitle{font-size: 20px;padding-bottom: 15px;font-weight: 600 !important;line-height: 1.7rem;}
  .kolam-renang li{line-height: 1.5rem;}
}

/* ===== Page Blog Section ===== */
.blog{padding-top: 64px;}
.blog .text-muted{font-size: 20px;}
.blog-title{font-weight: 600;font-style: SemiBold;font-size: 46px;color: #292929;}
.content-blog{padding-top: 64px;margin: 0px;}
.blog-card{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:18px;padding:18px 18px 20px;box-shadow:0 10px 24px rgba(0,0,0,.06);transition:transform .15s ease, box-shadow .15s ease;height:100%;display:flex;flex-direction:column;}
.blog-card:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(0,0,0,.08);}

.blog-thumb{border-radius:14px;overflow:hidden;margin-bottom:16px;}
.blog-thumb img{width:100%;height:220px;object-fit:cover;display:block;}
.blog-heading{font-weight:600;color:#292929;line-height:1.5;margin-bottom:12px;font-size: 20px;}
.blog-excerpt{color:#707070;margin-bottom:20px;flex:1;}
.blog-btn{align-self:flex-start;background:#2F7EF2;color:#fff;border-radius:999px;padding:10px 18px;text-decoration:none;font-weight:600;display:inline-flex;align-items:center;gap:6px;box-shadow:0 6px 14px rgba(47,126,242,.28);}
.blog-btn:hover{ color:#fff; filter:brightness(.95); }

@media (min-width:901px) and (max-width:1400px){
  .blog-title{ font-size:36px; }
  .blog-thumb img{ height:200px; }
}

@media (max-width:800px){
  .blog{padding-top: 40px;}
  .content-blog{padding-top: 30px; margin: 0px;}
  .blog-title{ font-size:26px; }
  .blog-card{ padding:14px 14px 16px; border-radius:16px; }
  .blog-thumb{ border-radius:12px; }
  .blog-thumb img{ height:180px; }
  .blog-heading{ font-size:18px; line-height: 1.5rem; }
  .blog-excerpt{ font-size:16px; }
  .blog-btn{ width:100%; justify-content:center; }
}

/* ===== Page Properti-rumah-dijual Section ===== */
.properti-rumah{padding-top: 0px;}
.properti-rumah-title {font-weight: 600;font-size: 46px;padding-bottom: 24px;margin: 0 !important;}
.properti-rumah-preview {display: flex;justify-content: center;align-items: center;width: 100%;position: relative;margin: 0 auto;}
.embed-ig{max-height: 730px;}
.content-ig{padding-top: 60px;}
.properti-rumah-preview blockquote.instagram-media {position: absolute !important;inset: 0;margin: 0 auto !important;max-width: 100% !important;width: 100% !important;}
.properti-rumah-card {flex: 1;display: flex;flex-direction: column;justify-content: center;background: #fff;border-radius: 14px;padding: 20px 32px;border: 1px solid rgba(0,0,0,.06);box-shadow: 0 10px 24px rgba(0,0,0,.06);color: #111;cursor: default;pointer-events: none;}
.properti-rumah-card-title {font-weight: 600;font-size: 24px;padding-bottom: 10px;}
.properti-rumah-card-desc {font-size: 20px;color: #707070;}

@media (max-width: 800px) {
  .properti-rumah-title { font-size: 26px; padding-bottom: 16px;line-height: 2rem; }
  .properti-rumah-card { padding: 18px; }
  .properti-rumah-card-title { font-size: 18px; }
  .properti-rumah-card-desc { font-size: 14.5px; }
  .content-ig{padding-top: 10px;}
}

@media (min-width: 901px) and (max-width: 1400px) {
  .properti-rumah-title { font-size: 40px; }
  .properti-rumah-card { padding: 20px 24px; }
  .properti-rumah-card-title { font-size: 22px; }
  .properti-rumah-card-desc { font-size: 16.5px; }
}

/* ===== Article isi Blog ===== */
.article{padding-top: 64px;}
.article-card{max-width: 840px;margin: 0 auto;background: #fff;border: 1px solid rgba(0,0,0,.06);border-radius: 14px;box-shadow: 0 10px 24px rgba(0,0,0,.06);padding: 28px 32px 40px;}
.article-date{text-align: center;font-weight: 400;font-style: Regular;font-size: 20px;color: #707070;  margin: 4px 0 12px;}
.article-title{text-align: center;font-weight: 500;font-style: Medium;font-size: 40px;padding-bottom: 64px;margin: 0px;}
.article-hero{margin: 0 0 18px;}
.article-hero img{display: block;width: 100%;height: auto;border-radius: 14px;box-shadow: 0 8px 18px rgba(0,0,0,.06);}
.article-body{padding-top: 64px;color: #292929;}
.article-body p{ font-weight: 400;font-style: Regular;font-size: 20px; }
.article-steps{margin: 12px 0 0 1.1rem;padding: 0;}
.article-steps a{text-decoration: none;}
.article-steps > li{margin-bottom: 14px;font-weight: 400;font-style: Regular;font-size: 20px;}
.article-steps .article-blog-title{font-size: 20px;font-weight: 600;margin: 0 0 6px;}
.article-steps li ul li strong{font-weight: 600 !important;}
.article-steps li ul{padding-left: 1rem;margin: 16px 0 16px;}
.article-steps li ul li{margin: 4px 0;}

@media (max-width: 800px){
  .article{padding-top: 40px;}
  .article-date{font-size: 16px;}
  .article-card{ padding: 22px 18px 28px; }
  .article-title{ font-size: 28px; padding-bottom: 40px;}
  .article-body{ padding-top: 20px; }
  .article-body p, .article-body li, .article-blog-title{ font-size: 16px !important; }
}

@media (min-width:901px) and (max-width:1400px){
  .article-title{ font-size: 26px; }
}

.btn-floating-kiri,.btn-floating-kanan {position: fixed;z-index: 999;display: flex;align-items: center;justify-content: center;border: none;
  border-radius: 50px;padding: 10px 18px;font-weight: 600;box-shadow: 0 4px 10px rgba(0,0,0,0.2);cursor: pointer;transition: all 0.3s ease;}
.btn-floating-kiri{border-radius: 50px 50px 50px 0px;}

.hubungi-btn {bottom: 20px;left: 20px;background: #0d6efd ;color: #fff;text-decoration: none;font-weight: 400;font-style: Regular;font-size: 20px;}
.hubungi-btn:hover {background: #0d6efd;color: #fff;}
.icon-circle {background: #fff;color: #000000;width: 28px;height: 28px;display: flex;align-items: center;justify-content: center;margin-right: 8px;font-size: 18px;border-radius: 50%;}
@media (max-width: 800px) {
  .hubungi-btn {padding: 10px;justify-content: center;font-size: 0;}
  .icon-circle{margin: 0px;}
}

.top-btn {bottom: 20px;right: 20px;background: #0d6efd;color: #fff;font-size: 20px;width: 48px;height: 48px;border-radius: 50%;display: none;border: solid 2px #fff;}
.top-btn:hover {background: #0b5ed7;}

/* ====== GALERY SECTION ====== */
.galery{padding-top: 64px; margin: 0px;}
.galery__title{font-weight: 500;font-size: 46px;color: #292929;padding-bottom: 32px;}
.content-galery{padding-bottom: 80px; margin: 0px;}
.galery-card{position: relative;display: block;overflow: hidden;border-radius: 16px;background: #f5f6f7;}
.galery-card img{width: 100%;height: 100%;object-fit: cover;display: block;border-radius: inherit;}
.content-kitchen{padding: 0px 12px;}
.galery-ratio-4-5 { aspect-ratio: 4 / 5; }  

@media (min-width: 800px){
  .galery-equal-row > [class*="col-"]{ display: flex; } 
  .galery-equal-row > [class*="col-"] > *{ width: 100%; }
  .galery-card--ratio{ aspect-ratio: 4 / 3; }  
  .galery-card--fill{ height:100%; }
  .galery-card--fill img{ height:100%; }
}

@media (max-width: 800px){
  .galery{padding-top: 40px; margin: 0px;}
  .galery-ratio-4-5{ aspect-ratio: 4 / 5; } 
  .galery__title{font-size: 32px;color: #292929;padding-bottom: 20px; margin: 0px;}
  .content-galery{padding-bottom: 32px; margin: 0px;}
  .galery-card--ratio{ aspect-ratio: 4 / 3; }
}

/* ===== HERO PAGE LUXORA (baru) ===== */
.hero-page-luxora{ padding-top: 46px; } 
.hero-lx-toolbar{ display:flex; align-items:center; justify-content:space-between; padding-bottom: 46px; margin: 0px; }
.hero-lx-link{ display:inline-flex; align-items:center; gap:8px;background:#fff; border:0; color:#1d1d1f; text-decoration:none;padding:6px 10px; border-radius:10px;font-weight: 400;font-size: 20px;}
.hero-lx-link:hover{font-weight: 600;}
.hero-lx-thumbs{display:grid; grid-template-columns:1fr 1fr; gap:12px; width:100%;}
.hero-lx-thumb-cta{ position:relative; }
.hero-lx-more{position:absolute; right:25px; bottom:12px;background:#fff; color:#1d1d1f; padding:8px 12px;border-radius:999px;  font-size:14px;box-shadow:0 6px 16px rgba(0,0,0,.12); display:inline-flex; align-items:center; gap:5px;font-weight: 400;}
.ratio-16x9{ aspect-ratio: 16 / 9; }

@media (min-width: 800px){.hero-lx-thumbs{ gap:16px; height:100%; }}
@media (max-width: 800px){
.hero-lx-toolbar{  padding-bottom: 20px; margin: 0px; }
.hero-lx-link{  font-size: 16px !important; }
.hero-lx-more{ right:10px; bottom:10px; font-size:10px; }}

/* ===== DESKRIPSI RUMAH ===== */
.deskripsi-rumah { padding-top:46px ; background:#fff; margin: 0px; }
.dr-title{ font-weight: 500;font-style: Medium;font-size: 32px;line-height: 2.5rem;padding-bottom: 24px;margin: 0px; }
.dr-lead{ font-weight: 400;font-style: Regular;font-size: 20px;color: #707070;margin: 0px !important; }
.dr-more{ font-size: 20px;font-weight:600;color: #292929; text-decoration:none; }
.dr-hero{margin: 0px; padding-bottom: 64px;}
.dr-card{background:transparent;padding:0px;;}
.dr-section-title{ font-weight: 500;font-style: Medium;font-size: 32px;color: #292929; }

.dr-map{padding-top: 24px;}
.dr-map img{ width:100%; height:100%; aspect-ratio:16/9; object-fit:cover; border-radius:12px; }

/* ===== ACCORDION ===== */
.dr-acc .dr-acc-toggle{width:100%; background:transparent; border:0; padding:30px 20px 6px 0px; margin-top: 30px; ;
  display:flex; align-items:center; justify-content:space-between; cursor:pointer;border-top: solid 1px rgb(112, 112, 112, 0.5);}
.dr-acc .dr-acc-toggle .bi{ transition: transform .25s ease; }
.dr-acc .dr-acc-toggle[aria-expanded="true"] .bi{ transform: rotate(180deg); }
.dr-acc-panel{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s ease; }
.dr-acc-panel.show{ grid-template-rows:1fr; }
.dr-acc-inner{ overflow:hidden;background: transparent !important;background-color: transparent !important;border: 0 !important;box-shadow: none !important; }
.dr-chips,.dr-chips-elev {display: flex;flex-wrap: wrap;gap: 15px;}
.dr-chips-elev .dr-chip{border:1px solid #e6e9ef; background:#fff; color:#6b7280;padding:8px 14px; border-radius:999px;box-shadow:0 2px 6px rgba(17,24,39,.06);font-weight: 400;font-size: 20px;}
.dr-chips-elev .dr-chip.is-active{background:#eef4ff; border-color:#c7d2fe; color:#1d4ed8;}

.dr-dest-list,.dr-list{ list-style:none; margin:0; padding:0; display:grid; gap:14px; padding: 32px 0px; }
.dr-list-item{display:grid;grid-template-columns: 1fr auto;align-items:center;box-shadow:0 2px 6px rgba(17,24,39,.15);margin: 5px;}
.dr-list-card{background:#fff;border-radius:16px;padding:16px 16px;position:relative;}
.dr-list-main{ min-width:0; }
.dr-list-title{font-weight: 400;font-size: 24px;color: #292929;}
.dr-list-meta{display:flex;gap:18px;font-weight: 400;font-size: 16px;color: #707070;}
.dr-list-meta i{ margin-right:8px; }

.dr-list-cta{position:relative;display:inline-flex;width:40px; height:40px;border-radius:999px;align-items:center; justify-content:center;background:#eaf2ff;color:#2d6cf6;text-decoration:none;margin-left:16px;}
.dr-list-cta:hover{ background:#dce9ff; color:#1e5cf0; }
.dr-list-card .dr-list-cta::before{content:"";position:absolute;left:-16px;top:6px; bottom:6px;width:1px;background:#e6eaf1;}

.dr-price-card{ padding:20px;box-shadow:0 2px 6px rgba(17,24,39,.15);border-radius: 14px; }
.dr-price-caption,.dr-price-caption-2{font-weight: 400;font-size: 20px;color: #707070; }
.dr-price-caption-2{color: #292929; padding-bottom: 18px;}
.dr-price{ font-weight: 600;font-style: SemiBold;font-size: 40px;color: #292929; }
.dr-divider{ height:1px; background:#eef0f2; }

.dr-agent{ display:flex; align-items:center; gap:12px; padding-bottom: 32px; }
.dr-avatar{ width:80px; height:80px; border-radius:50%; object-fit:cover; }
.dr-agent-name{ font-weight: 400;font-style: Regular;font-size: 24px;color: #292929; }
.dr-agent-role{ font-weight: 400;font-style: Regular;font-size: 20px;color: #707070;}
.dr-lead.clamp-3{display: -webkit-box;line-clamp: 3;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}

.dr-lead.dr-expanded{display: block;line-clamp: unset;-webkit-line-clamp: unset;overflow: visible;}
.dr-btn{display:inline-flex; align-items:center; justify-content:center; gap:6px;border-radius:10px; padding:10px 12px; font-weight:700; text-decoration:none;}
.dr-btn-outline{ background:#fff; border:1px solid #e5e7eb; color:#111827; }
.dr-btn-outline:hover{ background:#f9fafb; }
.dr-btn-primary{ background:#1e74ff; color:#fff; border:1px solid #1e74ff; }
.dr-btn-primary:hover{ background:#0d5ed7; }
.dr-price-actions{display:flex;align-items:center;gap:16px;}

.dr-btn-icon{width:52px; height:52px;border-radius:12px;background:#f5f5f5;border:none;color:#1f2937;box-shadow:0 6px 14px rgba(17,24,39,.1);justify-content:center;padding:0;}
.dr-btn-icon i{ font-size:20px; }
.dr-btn-pesan{flex:1;height:52px;border-radius:999px;justify-content:center;background:#2F7EF2;border-color:#2F7EF2;color:#fff;font-weight: 400;font-size: 20px;}
.dr-btn-pesan:hover{ background:#1e5cf0; border-color:#1e5cf0; }
.dr-btn-pesan i{ font-size:18px; margin-right:8px; }

.dr-note{ font-weight: 400;font-style: Regular;font-size: 20px;color: #707070;padding-top: 28px;}
.dr-spec-list{list-style: none;margin-top: 20px !important;padding: 0px;margin: 5px;display: grid;gap: 12px;}
.dr-spec-item{background: #fff;border-radius: 8px;padding: 20px ;box-shadow:0 2px 6px rgba(17,24,39,.15);color: #707070;font-weight: 400;font-size: 20px;}

@media (max-width: 800px){
  .dr-title{ font-size:28px; line-height: 2.5rem; }
  .dr-card{ border-radius:12px; padding:14px; }
  .dr-lead{font-size: 16px;}
  .dr-section-title{ font-size: 28px; text-align: left;}
  .dr-chips-elev .dr-chip{font-size: 16px;}
  .dr-list-title{font-size: 18px;}
  .dr-dest-list,.dr-list{ gap:8px; padding-bottom: 0px;}
  .dr-spec-item{font-size: 16px;}
  .dr-price{font-size: 24px;}
  .dr-note{font-size: 16px;}
  .dr-more{ font-size: 16px;}
}

.dr-map > *{width: 100%;aspect-ratio: 16 / 9;border: 0;border-radius: 12px;display: block;}
.dr-content-destinasi{border-bottom: solid 1px #707070; margin: 20px 0px;}
.sm-backdrop{position: fixed; inset: 0;background: rgba(0,0,0,.35);display: none;place-items: center;z-index: 9999;}
.sm-backdrop.is-open{ display: grid; }
.sm-dialog{width: min(520px, calc(100vw - 32px));background: #fff;border-radius: 14px;box-shadow: 0 24px 64px rgba(0,0,0,.18);padding: 16px 16px 14px;position: relative;}
.sm-close{position: absolute; top: 12px; right: 12px;background: #f3f4f6; border: 0; width: 34px; height: 34px;border-radius: 50%; display:flex; align-items:center; justify-content:center;}
.sm-head{font-weight: 500; font-size: 18px; margin: 4px 0 12px; color: #1f2937;}

.sm-grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px 22px;margin-bottom: 32px;}
.sm-app{text-decoration: none; color: #111827;display: flex; flex-direction: column; align-items: center; gap: 10px;}
.sm-icon{width: 56px; height: 56px; border-radius: 50%;display:flex; align-items:center; justify-content:center;box-shadow: 0 8px 18px rgba(0,0,0,.10);background: #eef2ff;}
.sm-icon i{ font-size: 26px; }

.sm-wa{ background:#e8f6ee; } .sm-wa i{ color:#25D366; }
.sm-ig{ background:#f3e7ff; } .sm-ig i{ color:#C13584; }
.sm-fb{ background:#e8f1ff; } .sm-fb i{ color:#1877F2; }
.sm-tt{ background:#f1f5f9; } .sm-tt i{ color:#111827; }
.sm-tg{ background:#e9f4ff; } .sm-tg i{ color:#229ED9; }
.sm-dc{ background:#eef1ff; } .sm-dc i{ color:#5865F2; }

.sm-label{ font-weight:500; font-size:14px; color:#111827; }
.sm-link{ margin-top: 8px; }
.sm-link-label{ display:block; font-weight:500; margin: 6px 0 6px; color:#1f2937; }
.sm-link-row{ display:flex; gap:8px; }
.sm-input{flex:1; height: 44px;border:1px solid #e5e7eb; border-radius: 10px; padding: 8px 12px;background: #f8fafc; color:#374151;}
.sm-copy{width: 44px; height: 44px; border:1px solid #e5e7eb;border-radius: 10px; background:#fff;display:flex; align-items:center; justify-content:center;}
.sm-toast{ opacity:0; transition: opacity .2s; display:block; margin-top:6px; color:#6b7280; }
.sm-toast.is-show{ opacity:1; }

@media (max-width: 480px){
  .sm-grid{ grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .sm-icon{ width:52px; height:52px; }
}

/* ===== HITUNG (layout & form) ===== */
.hitung{padding-top: 64px;}
.hk-card{ box-shadow:0 6px 16px rgba(17,24,39,.06);border-radius: 14px; padding:18px; }
.hk-label{ font-weight: 400;font-size: 20px;display:block;  color:#1f2937; margin-bottom:6px; }
.hk-input{ position:relative; }
.hk-input input{width:100%; height:44px; border:1px solid #e7ebf2; border-radius:10px;padding:8px 12px; background:#fff; color:#374151;}
.hk-input input[readonly]{ background:#f3f4f6; }
.hk-suffix{position:absolute; right:8px; top:50%; transform:translateY(-50%);padding:4px 8px; border-radius:8px; background:#eef2ff; color:#2F7EF2; font-weight:500;}

.hk-select{ position:relative; }
.hk-select select{width:100%; height:44px; border:1px solid #e7ebf2;border-radius:10px;padding:8px 36px 8px 12px; background:#fff; color:#374151; appearance:none;}
.hk-select i{ position:absolute; right:12px; top:50%; transform:translateY(-50%); color:#6b7280; }
.hk-banks{ display:flex; gap:12px; flex-wrap:wrap; }
.hk-bank{width:90px; height:90px; border-radius:12px; border:1px solid #e7ebf2; background:#fff;display:flex; align-items:center; justify-content:center; box-shadow:0 6px 16px rgba(17,24,39,.06);}
.hk-bank img{ max-width:48px; max-height:48px; }
.hk-bank.is-active{ border:2px solid #2F7EF2; }

.hk-cta{ width:100%; justify-content:center; border-radius:999px; }

/* ===== Hasil Kanan ===== */
.hk-bank-head{ display:flex; gap:20px; align-items:center; margin-bottom:10px; }
.hk-bank-head img{  height:40px; object-fit:cover; }
.hk-bank-name{ font-weight: 500;font-style: Medium;font-size: 24px;color:#292929; }
.hk-bank-sub{ font-weight: 400;font-size: 16px;color:#707070; }
.hk-sep{ height:1px; background:#eef0f2; margin:8px 0 10px; }

.hk-row{display:flex; align-items:center; justify-content:space-between;background:#fff; border:1px solid #eef0f4; border-radius:12px; padding:12px 14px;box-shadow:0 8px 18px rgba(17,24,39,.05); margin-bottom:10px;}
.lk-row:last-child{ margin-bottom:0; }
.hk-rate{ font-weight: 400;font-size: 16px;color:#707070; }
.hk-desc{ font-weight: 400;font-size: 20px;color:#292929; margin-top:2px; }
.hk-val{ font-weight: 600;font-size: 20px;color:#292929; }
.hk-val-2{ font-weight: 600;font-size: 20px;color:#292929; }

.hk-mini{ background:#fff; border:1px solid #eef0f4; border-radius:12px;padding:10px 12px;box-shadow:0 8px 18px rgba(17,24,39,.05); }
.hk-mini-row{font-weight: 400;font-size: 20px;display:flex; align-items:center; justify-content:space-between; padding:10px 0; border-bottom:1px solid #eef0f2; }
.hk-mini-row:last-child{ border-bottom:0; }
.hk-mini-total strong{ color:#1f2937; }

@media (max-width: 800px){
  .hk-bank-name{font-size: 18px;}
  .hk-bank-sub{font-size: 14px;}
  .hk-desc, .hk-val, .hk-mini-row{font-size: 16px;}
  .hk-card{ border-radius:12px; padding:14px; }
  .hk-bank{ width:56px; height:56px; }
  .hk-bank img{ max-width:44px; max-height:44px; }
  .hitung .hk-row{ flex-direction:column; align-items:flex-start; gap:6px; }
  .hitung .hk-mini-row{ display: grid !important;grid-template-columns: 1fr !important;row-gap: 3px !important; }
  .hitung .hk-mini-row .hk-val-2{ margin-top:2px; }
  .hitung .hk-banks{ grid-template-columns:repeat(4,1fr); }
  .hitung .hk-mini-row > span{grid-column: 1 / -1;}
  .hitung .hk-mini-row > .hk-val-2{grid-column: 1 / -1;justify-self: start;margin-top: 2px;font-size: 16px;}
}

.grecaptcha-badge {visibility: hidden;}
.capt{font-size: 12px !important; padding-top: 10px;}
#preloader {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: #fff; display: flex;align-items: center;justify-content: center;z-index: 9999;}
.preloader-logo {width: 150px;height: 150px;animation: zoomInOut 2s ease-in-out infinite;}

@keyframes zoomInOut {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.2); }
  100% { transform: scale(1); }
}

/* ===== Visit Modal (reuse .sm-*) ===== */
.vm-dialog{padding-top: 22px;}
.vm-head{font-weight: 500;font-style: Medium;font-size: 24px;color: #292929;padding-bottom: 28px;}
.vm-label{display:block; font-weight: 400;font-style: Regular;color: #292929;padding-bottom: 7px;font-size: 20px;}
.vm-field{position:relative;}
.vm-input,.vm-textarea{
  width:100%; border:1px solid #e5e7eb; border-radius:10px; padding:10px 12px;
  background:#f8fafc; color:#111827; font-size:18px;
}
.vm-input{height:44px;}
.vm-textarea{min-height:110px; resize:vertical;}
.vm-field-icon{position:absolute; right:12px; top:50%; transform:translateY(-50%); color:#6b7280;}
.vm-actions{display:flex; justify-content:flex-end; margin-top:16px;}
.vm-submit{border-radius:999px; height:46px; padding:10px auto; width: 100%;font-weight: 400;font-size: 20px;}

/* ===== Testimoni Page ===== */
.testimoni-page{ padding-top: 64px; }
.testimoni-page .tp-title{font-weight: 500;font-style: Medium;font-size: 32px;line-height: 2.5rem;padding-bottom: 0px;margin-bottom: -64px;}
.tp-carousel{padding-top: 80px;}
.testimoni-page .tp-card{background:#fff; border-radius:16px;padding:24px; height:100%;}
.testimoni-page .tp-quote{color:#707070; font-size:20px; line-height:1.7rem; margin:0 0 18px;}
.testimoni-page .tp-author{ display:flex; align-items:center; gap:14px; }
.testimoni-page .tp-avatar{width:56px !important; border-radius:50%; object-fit:cover; flex-shrink:0;box-shadow:0 6px 16px rgba(0,0,0,.08);}
.testimoni-page .tp-name{ font-weight:600; color:#292929; font-size:20px; line-height:1.2; }
.testimoni-page .tp-role{ color:#707070; font-size:16px; }
.testimoni-page .owl-nav{position:absolute; top:-30px; right:0; left:auto; display:flex; gap:10px;}
.testimoni-page .owl-nav button.owl-prev,
.testimoni-page .owl-nav button.owl-next{background:#fff !important; border:none; width:48px; height:48px; border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.12); color:#000 !important; font-size:18px !important;}
.testimoni-page .owl-nav button.owl-prev:hover,
.testimoni-page .owl-nav button.owl-next:hover{background:#2F7EF2 !important; color:#fff !important;}

/* responsive */
@media (max-width:800px){
  .testimoni-page{ padding-top:40px; }
  .testimoni-page .tp-title{ font-size:28px; margin-bottom: -40px; max-width: 200px; }
  .tp-carousel{padding-top: 60px;}
  .testimoni-page .tp-card{ padding:18px; }
  .testimoni-page .tp-quote{ font-size:16px; }
  .testimoni-page .tp-name{ font-size:18px; }
  .testimoni-page .tp-role{ font-size:14px; }
  .testimoni-page .owl-nav{ top:-60px; }
}
