/*
Upper Template
http://www.templatemo.com/tm-497-upper
*/

/* ========= Base ========= */
body{
  background-color:#010101;
  color:black;
  font-family:'Open Sans',Helvetica,Arial,sans-serif;
  font-size:17px;
  font-weight:800;
  overflow-x:hidden;
}

ul{padding:0;margin:0;}
figure{margin:0;}
p:last-child{margin-bottom:0;}
a{color:#3f97c9;transition:all .3s ease;}
a:hover,a:focus{text-decoration:none;outline:none;}
button{transition:all .3s ease;}
button:focus{outline:none;}

.tm-white{color:#fff;}
.container-fluid{width:100%;} /* IE fix */
.tm-brand-icon{
  padding:10px;background:none;color:black;
  font-size:3rem;margin-right:15px;
}

/* ========= Navbar ========= */
.cd-slider-nav{
  position:absolute;left:0;right:0;top:10px;z-index:1002;background:none;
}
.cd-slider-nav nav{width:100%;padding:0 10px;}
.tm-navbar{float:right;}
.tm-navbar-bg{
  display:flex;align-items:center;justify-content:space-between;
  padding-left:10px;padding-right:10px;
  background:linear-gradient(to bottom right,#010101 10%,#4d0000 75%,#e41e26 100%);
  overflow:auto;
}
.navbar-toggler{
  float:right;font-size:1.75rem;padding:1rem 1.5rem;background:rgba(255,255,255,.7);
  border-radius:0;position:absolute;right:20px;top:5px;
}
.cd-slider-nav a.navbar-brand{
  font-size:2.5rem;padding:0;display:flex;align-items:center;justify-content:center;width:auto;
}
.cd-slider-nav a{ text-transform:capitalize; }
.cd-slider-nav .navbar-nav{display:inline-block;float:none;vertical-align:top;}
.navbar-nav .nav-item{float:none;}
.navbar-nav .nav-item+.nav-item{margin-left:0;}

.cd-slider-nav li{display:block;float:none;width:auto;}
.cd-slider-nav a,
.navbar-nav .nav-link{
  background-color:transparent;color:white;display:table-cell;
  font-weight:700;font-size:1em;vertical-align:middle;width:130px;height:40px;
}
.cd-slider-nav .nav-item.selected .nav-link,
.cd-slider-nav .nav-link:hover,
.cd-slider-nav .nav-link:focus{background-color:#fff;color:#5394D6;}

/* ========= Hero Slider ========= */
.cd-hero-slider{height:100vh;}
.cd-hero-slider li{
  list-style:none;background-color:#2c343b;
  background-size:cover;background-position:center;
}
/* Sesuaikan jumlah slide (1..5) */
.cd-hero-slider li:nth-of-type(1){background-image:url("../img/BCG1.png");}
.cd-hero-slider li:nth-of-type(2){background-image:url("../img/tm-bg-2.jpeg");}
.cd-hero-slider li:nth-of-type(3){background-image:url("../img/BG3.jpeg");}
.cd-hero-slider li:nth-of-type(4){background-image:url("../img/BCG1.png");}
.cd-hero-slider li:nth-of-type(5){background-image:url("../img/BG3.jpeg");}

.cd-hero-slider .cd-full-width{text-align:left;padding-top:0;}
.cd-hero-slider h2,.cd-hero-slider p{max-width:none;width:100%;}
.cd-hero-slider .tm-text{font-size:1em;line-height:1.8;}
.cd-hero-slider h2.tm-text-title{color:#000002;font-size:2.6em;font-weight:1000;}
.cd-hero-slider.small-screen{height:100%;}

.cd-full-width{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
}
.cd-full-width .container-fluid.tm-page-width{
  max-width:none;margin-left:auto;margin-right:auto;width:100%;
}

/* ========= Footer ========= */
.tm-footer{
  position:absolute;bottom:0;left:0;width:100%;color:white;z-index:1001;padding:50px 11px 20px;
}
.tm-social-icons-container{margin-bottom:30px;}
.tm-social-link{
  background-color:rgba(255,255,255,.40);color:black;display:inline-block;
  width:35px;height:35px;text-align:center;padding-top:5px;margin-right:10px;
}
.tm-social-link:last-child{margin-right:0;}
.tm-copyright-text{
  background-color:rgba(0,0,0,.3);color:white;display:inline-block;
  font-size:1.8rem;font-weight:400;padding:5px 12px;width:100%;
}

/* ========= Layout blocks ========= */
.tm-textbox{display:inline-block;width:100%;}
.tm-textbox-padding{padding:40px 35px;}
.tm-bg-white-translucent{background-color:rgba(255,255,255,.8);}
.tm-bg-white-translucent p{color:black;}

.tm-3-col-container{overflow:auto;}
.tm-3-col-textbox{max-width:100%;padding:0 10px;margin-bottom:30px;width:100%;}
.tm-3-col-textbox-inner{ text-align:center; height:auto; min-height:300px; overflow:visible; }

.tm-2-col-textbox-2{
  width:100%;padding:25px;margin-bottom:30px;flex:0 1 auto;
}

/* ========= Contact ========= */
.tm-contact-page{margin:0 auto;max-width:980px;padding:0 12px; margin:0 auto;}
.tm-contact-container{max-width:1100px;}
.form-group{margin-bottom:1.5rem;}
.form-control,.tm-submit-btn{font-size:1.8rem;}
.form-control{
  background-color:rgba(255,255,255,.7);border-radius:0;padding:1rem 2rem;
}
.form-control::-webkit-input-placeholder,
.form-control:-moz-placeholder,
.form-control::-moz-placeholder,
.form-control:-ms-input-placeholder{color:#000;}
.tm-submit-btn{
  background-color:#0066CC;border:none;color:white;padding:10px 50px;margin-top:10px;
  font-weight:400;font-size:2.5rem;
}
.tm-submit-btn:hover,.tm-submit-btn:focus{background-color:#2277EE;}
textarea{height:168px;}
#google-map{height:430px;width:100%;}

/* ========= Preloader ========= */
#loader-wrapper{position:fixed;top:0;left:0;width:100%;height:100%;z-index:2000;}
#loader{
  display:block;position:relative;left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;
  border-radius:50%;border:3px solid transparent;border-top-color:#3498db;animation:spin 2s linear infinite;z-index:2001;
}
#loader:before{
  content:"";position:absolute;top:5px;left:5px;right:5px;bottom:5px;border-radius:50%;
  border:3px solid transparent;border-top-color:#e74c3c;animation:spin 3s linear infinite;
}
#loader:after{
  content:"";position:absolute;top:15px;left:15px;right:15px;bottom:15px;border-radius:50%;
  border:3px solid transparent;border-top-color:#f9c922;animation:spin 1.5s linear infinite;
}
@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
#loader-wrapper .loader-section{
  position:fixed;top:0;width:51%;height:100%;background:#222;z-index:2000;transform:translateX(0);
}
#loader-wrapper .loader-section.section-left{left:0;}
#loader-wrapper .loader-section.section-right{right:0;}
.loaded #loader-wrapper .loader-section.section-left{transform:translateX(-100%);transition:all .7s .3s cubic-bezier(.645,.045,.355,1)}
.loaded #loader-wrapper .loader-section.section-right{transform:translateX(100%);transition:all .7s .3s cubic-bezier(.645,.045,.355,1)}
.loaded #loader{opacity:0;transition:all .3s ease-out;}
.loaded #loader-wrapper{visibility:hidden;transform:translateY(-100%);transition:all .3s 1s ease-out;}
.no-js #loader-wrapper{display:none;}

/* ========= Video BG (First Gallery) ========= */
.first-gallery{position:relative;overflow:hidden;}
.first-gallery .gallery-video{
  position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;z-index:-1;
}
.first-gallery-text{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  text-align:center;width:100%;animation:slideUp 2s ease-in-out;
}
.first-gallery-text .tm-gallery-title{font-size:6rem;font-weight:bold;color:#fff;}
.first-gallery-image{text-align:center;margin-top:300px;}
.first-gallery-image img{max-width:300px;animation:fadeIn 2s ease-in-out .8s both;}
@keyframes slideUp{from{opacity:0;transform:translate(-50%,50%)}to{opacity:1;transform:translate(-50%, -50%)}}
@keyframes fadeIn{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}

/* ========= Icons / images ========= */
.detect-icon{width:100px;margin-bottom:15px;}

/* ========= Galleries ========= */
.grid-item{margin-bottom:20px;padding:0 1px;float:left;width:100%;}
.grid-item:last-child{margin-bottom:0;}
.tm-img-gallery-container{max-width:320px;margin:0 auto;}
.tm-img-gallery-container-2{max-width:453px;}
.tm-img-gallery-container-3{max-width:1360px;} /* still used on gallery pages */
.tm-img-gallery{margin:0 auto 10px;display:inline-block;}
.tm-img-gallery-info-container{display:block;margin:0 auto;padding:30px 1px;}
.tm-img{max-width:320px;width:100%;height:auto;border:none;margin:0 auto;}
.gallery-two .tm-img,.gallery-three .tm-img{max-width:none;}
.tm-white-box-margin-b{margin-bottom:30px;}
.gallery-one .grid-item{max-width:340px;}
.gallery-two .grid-item{max-width:453px;}
.tm-gallery-title span{width:100%;}

.grid-item figure{position:relative;overflow:hidden;text-align:center;}
.grid-item figure figcaption,.grid-item figure figcaption>a{
  position:absolute;top:0;left:0;width:100%;height:100%;
}
.grid-item figure figcaption{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:1em;color:#fff;text-transform:uppercase;font-size:1.25em;backface-visibility:hidden;
}
figure.effect-ruby{background-color:#17819c;}
.cd-hero-slider .selected .cd-full-width figure.effect-ruby h2.tm-figure-title{
  margin-bottom:0;transition:transform .35s;transform:translate3d(0,20px,0);
}
.cd-hero-slider .selected .cd-full-width figure.effect-ruby:hover h2.tm-figure-title{
  transform:translate3d(0,0,0);
}
figure.effect-ruby img{
  opacity:.7;transition:opacity .35s,transform .35s;transform:scale(1.15);
}
figure.effect-ruby p{
  margin:1em 0 0;padding:3em;border:1px solid #fff;opacity:0;
  transition:opacity .35s,transform .35s;transform:translate3d(0,20px,0) scale(1.1);
}
figure.effect-ruby:hover img{opacity:.2;transform:scale(1);}
.grid-item figure img{position:relative;display:block;max-width:100%;opacity:.8;}
.cd-hero-slider h2{font-size:1.5em;}
.cd-hero-slider .selected .cd-full-width p.tm-figure-description{
  font-weight:400;margin:1em 0 0;padding:2rem;border:1px solid #fff;opacity:0;
  transition:opacity .35s,transform .35s;transform:translate3d(0,20px,0) scale(1.1);
}
.cd-hero-slider .selected .cd-full-width figure.effect-ruby:hover p.tm-figure-description{
  opacity:1;transform:translate3d(0,0,0) scale(1);
}
.grid-item figure figcaption>a{z-index:1000;text-indent:200%;white-space:nowrap;font-size:0;opacity:0;}

/* ========= Drone Slider (Slick) ========= */
.tm-drone-slider{width:100%;max-width:100%;margin:0 auto;}
.tm-drone-slider .slick-slide{padding:10px;}
.tm-drone-slider img{
  width:100%;max-height:900px;object-fit:cover;border-radius:10px;
}
.slick-slide{padding:10px;transition:transform .3s ease-in-out;}
.slick-center img{transform:scale(1.1);box-shadow:0 0 15px rgba(255,255,255,.6);}
.slick-prev:before,.slick-next:before{color:#fff;font-size:30px;}
.slick-dots li button:before{color:#fff;font-size:12px;}

/* ========= Helpers ========= */
.tm-home-fa{display:block;text-align:center;padding:15px 0 30px;}
.tm-gallery-title span{width:100%;}

/* ========= Spacing / width tweaks ========= */
.cd-full-width .container-fluid.tm-page-width{padding-left:10px;padding-right:10px;}
.tm-3-col-container{margin-left:0;margin-right:0;}

/* ========= Responsive ========= */
@media (min-width:400px){
  .cd-hero-slider h2{font-size:2em;}
  .cd-hero-slider .selected .cd-full-width figure.effect-ruby h2.tm-figure-title{margin-bottom:14px;}
  .grid-item figure figcaption{padding:2em;}
}
@media (min-width:480px){
  .cd-full-width .container-fluid{margin-top:-80px;}
  .cd-hero-slider h2.tm-text-title{font-size:1.8em;}
  .tm-textbox-padding,
  .tm-textbox-padding-contact{padding:18px 20px !important;;}
  .tm-img-gallery-container{margin:40px auto 20px;max-width:680px;}
  .grid-item{padding:0 10px;width:50%;}
  .gallery-two .grid-item,.gallery-three .grid-item{width:100%;}
  .tm-img-gallery-info-container{padding:0 11px 30px;max-width:700px;margin:0 auto 0 0;}
  .grid-item figure figcaption{padding:1em;}
  .cd-hero-slider .selected .cd-full-width .gallery-one figure.effect-ruby h2.tm-figure-title,
  .cd-hero-slider .selected .cd-full-width .gallery-two figure.effect-ruby h2.tm-figure-title{font-size:1.5em;}
}
@media (min-width:600px){
  .tm-footer{padding:50px 30px 20px;}
  .tm-copyright-text{width:auto;}
}
@media (min-width:652px){
  .gallery-two .grid-item{width:50%;}
  .tm-img-gallery-container-2{max-width:906px;}
}
@media (min-width:720px){
  .tm-footer{flex-direction:row;}
  .tm-copyright-text{margin-top:0;}
}
@media (min-width:768px){
  .cd-slider-nav .nav-item.selected .nav-link,
  .cd-slider-nav .nav-link:hover,

  .cd-slider-nav .nav-link:focus{background-color:rgba(255,255,255,.7);}
  .tm-3-col-textbox{width:50%;}
  .tm-flex{display:flex;}
  .tm-2-col-textbox-2{margin-bottom:0;margin-right:30px;width:100%;}
  .tm-2-col-textbox-2:last-child{margin-right:0;}
  .tm-3-col-container,.cd-full-width .container-fluid.tm-page-width{max-width:800px;}
  .tm-3-col-textbox{max-width:400px;}
}
@media (min-width:992px){
  .tm-navbar-bg{padding-left:25px;padding-right:0;}
  .tm-navbar{position:static;height:auto!important;}
  .cd-slider-nav .navbar-nav{background:transparent;display:flex;}
  .cd-slider-nav li{display:inline-block;width:auto;height:auto;}
  .cd-slider-nav a,.navbar-nav .nav-link{height:80px;}
  .tm-social-icons-container{margin-bottom:20px;}
  .cd-full-width .container-fluid{margin-top:0;padding-left:0;padding-right:0;}
  .cd-full-width .container-fluid.tm-page-pad{padding-left:10px;padding-right:10px;}
  .tm-3-col-container,.cd-full-width .container-fluid.tm-page-width{max-width:1200px;}
  .tm-3-col-textbox{width:33.333333%;margin-bottom:0;}
  .tm-img-gallery-container,.tm-img-gallery-container-2,.tm-img-gallery-container-3{max-width:1360px;}
  .grid-item{width:25%;}
  .gallery-two .grid-item{width:33.3333%;}
  .grid-item figure figcaption{padding:1em;}
  .cd-hero-slider .selected .cd-full-width .gallery-one figure.effect-ruby h2.tm-figure-title,
  .cd-hero-slider .selected .cd-full-width .gallery-two figure.effect-ruby h2.tm-figure-title{font-size:1.5em;}
}
@media (min-width:1063px){
  .cd-slider-nav{top:30px;}
  .cd-slider-nav nav{padding:0 30px;}
  .tm-contact-page{padding:20px;}
  .cd-full-width .container-fluid{padding-left:20px;padding-right:20px;}
  .cd-full-width .container-fluid.tm-page-width{padding-left:30px;padding-right:30px;}
  .tm-page-width{padding-left:30px;padding-right:30px;}
  .tm-3-col-container{margin-left:15px;margin-right:15px;}
  .tm-3-col-textbox{padding-left:15px;padding-right:15px;}
}
@media (min-width:1170px){
  .cd-hero-slider h2,.cd-hero-slider p{margin-bottom:5%;}
  .cd-hero-slider h2.tm-gallery-title{margin-bottom:25px;}
  .cd-hero-slider .tm-text{font-size:1em;}
  .grid-item figure figcaption{padding:2em;}
}
@media (min-width:1230px){
  .tm-3-col-container{margin-left:auto;margin-right:auto;}
}
@media (min-width:1333px){
  .cd-slider-nav a,.navbar-nav .nav-link{font-size:1.2em;width:160px;height:110px;}
  .cd-slider-nav a.navbar-brand{font-size:3.5rem;}
  .tm-brand-icon{font-size:4rem;padding:10px;margin-right:15px;}
  .tm-navbar-bg{padding-left:30px;}
}
@media (min-width:1340px){
  .cd-full-width .container-fluid.tm-page-width{padding-left:0;padding-right:0;}
}
@media (min-width:768px) and (max-width:991px){
  .tm-2-col-textbox-2{margin-right:15px;}
  #google-map{height:520px;}
}

/* ========= Aksesibilitas kecil ========= */
a:focus-visible, .tm-submit-btn:focus-visible, .btn-daftar-fixed:focus-visible{
  outline:3px solid #2277EE; outline-offset:2px;
}
/* Tampilkan hanya slide yang .selected */
.cd-hero-slider > li { display: none; }
.cd-hero-slider > li.selected { display: block; }

/* NAVBAR: transparan 90% tanpa blur */
.tm-navbar-bg{
  background: rgba(0,0,0,0.10) !important;  /* 10% hitam = 90% transparan */
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Warna teks menu tetap putih */
.cd-slider-nav a,
.navbar-nav .nav-link{ color:#fff !important; }

/* State aktif/hover: highlight tipis, teks tetap putih */
.cd-slider-nav .nav-item.selected .nav-link,
.cd-slider-nav .nav-link:hover,
.cd-slider-nav .nav-link:focus{
  background: rgba(255,255,255,0.15) !important;
  color:#fff !important;
}

/* Dorong konten turun supaya tidak di belakang navbar */
.cd-full-width .container-fluid{
  margin-top: 0 !important;     /* override bawaan tema */
  padding-top: 110px;           /* sesuaikan tinggi navbar (80–120px) */
}
@media (max-width:480px){
  .cd-full-width .container-fluid{ padding-top: 80px; }
}

/* Menu kolaps (mobile) biar tetap terbaca */
#tmNavbar{ background: rgba(0,0,0,0.60) !important; }

/* ==== FIX NABRAK NAVBAR ==== */
:root{ --nav-h: 110px; }             /* tinggi navbar di desktop */
@media (max-width: 480px){
  :root{ --nav-h: 80px; }            /* tinggi navbar di mobile */
}

/* navbar tetap di atas, transparan tanpa blur */
.cd-slider-nav{
  position: fixed;                   /* dari absolute -> fixed */
  top: 0; left: 0; right: 0;
  z-index: 1002;
}
.tm-navbar-bg{
  background: rgba(0,0,0,0.10) !important;  /* 90% transparan */
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* dorong seluruh slider turun setinggi navbar */
.cd-hero-slider{ padding-top: var(--nav-h); }

/* hapus offset/margin minus bawaan tema */
.cd-full-width .container-fluid{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* konten “About Us” & lainnya tetap di bawah navbar */
.js-tm-page-content,
.tm-img-gallery-container{
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* teks menu selalu putih (tidak ikut jadi hitam) */
.cd-slider-nav a,
.navbar-nav .nav-link{ color:#fff !important; text-shadow:0 2px 6px rgba(0,0,0,.35); }

/* state aktif/hover: highlight tipis, teks tetap putih */
.cd-slider-nav .nav-item.selected .nav-link,
.cd-slider-nav .nav-link:hover,
.cd-slider-nav .nav-link:focus{
  background: rgba(255,255,255,0.15) !important;
  color:#fff !important;
}


/*untuk style navbar
/* ==== Floating translucent navbar (tanpa blur) ==== */
.cd-slider-nav{
  position: fixed; top:0; left:0; right:0; z-index:1002; background: transparent;
}
.tm-navbar-bg{
  max-width: 1180px;
  margin: 10px auto;
  padding: 10px 16px;
  display:flex; align-items:center; justify-content:space-between;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(0,0,0,.24), rgba(0,0,0,.18));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 8px 30px rgba(0,0,0,.35);
}

/* Brand size */
.cd-slider-nav a.navbar-brand img{ height:60px; }
@media (max-width:768px){ .cd-slider-nav a.navbar-brand img{ height:46px; } }

/* Nav links = pill buttons */
.navbar-nav{ gap:8px; }
.navbar-nav .nav-link{
  color:#fff !important;
  padding:10px 18px;
  height:auto; width:auto;
  border-radius:9999px;
  letter-spacing:.3px;
  font-weight:700;
  position:relative;
  transition: background .25s ease, transform .15s ease;
}
.navbar-nav .nav-link:hover{
  background: rgba(255,255,255,.12);
  transform: translateY(-1px);
}

/* Active pill */
.cd-slider-nav .nav-item.selected .nav-link{
  background: linear-gradient(135deg,#e41e26 0%, #e8643a 100%);
  box-shadow: 0 6px 16px rgba(228,30,38,.35);
  color:#fff !important;
}

/* Hover underline (desktop) */
@media (min-width:992px){
  .navbar-nav .nav-link::after{
    content:''; position:absolute; left:18px; right:18px; bottom:6px; height:2px;
    background:#fff; border-radius:1px; transform:scaleX(0); transform-origin:left;
    transition:transform .2s ease; opacity:.8;
  }
  .navbar-nav .nav-link:hover::after{ transform:scaleX(1); }
  .cd-slider-nav .nav-item.selected .nav-link::after{ display:none; }
}

/* Mobile collapse tray */
@media (max-width:991px){
  #tmNavbar{
    background: rgba(0,0,0,.5);
    border-radius:12px; padding:8px; margin-top:8px;
  }
  .navbar-toggler{ background:rgba(255,255,255,.2); color:#fff; }
}

/* ==== Konten turun setinggi navbar (dinamis lewat JS) ==== */
:root{ --nav-h: 120px; }
.cd-hero-slider{ padding-top: var(--nav-h); }

/* Compact saat scroll */
body.nav-compact .tm-navbar-bg{
  padding:6px 12px;
  background: linear-gradient(180deg, rgba(0,0,0,.32), rgba(0,0,0,.22));
}
body.nav-compact .cd-slider-nav a.navbar-brand img{ height:50px; }

/* Pastikan tidak ada offset minus dari style lama */
.cd-full-width .container-fluid{ margin-top:0 !important; padding-top:0 !important; }

/* Page 6: kedua heading "Contact Us" & "alamat" */
div[data-page-no="6"] .tm-contact-info{
  background: linear-gradient(90deg, #e41e26, #ff9b00);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Grup 3 logo kanan — gaya disamakan dengan .logo-fixed */
/* Logo partner di tengah atas */
.logo-right-group{
  position: fixed;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;

  padding: 6px 10px;
  background: rgba(255,255,255,.65);
  border-radius: 8px;
  backdrop-filter: blur(4px);
}

.logo-right-item{ display:inline-flex; align-items:center; transition:transform .15s ease; }
.logo-right-item:hover{ transform: translateY(-1px); }

.logo-right-group img{
  height:46px; width:auto; object-fit:contain; display:block;
}

/* beri ruang konten di bawah bar logo */
.page-wrap{ padding: 90px 16px 40px; }

/* Mobile */
@media (max-width: 480px){
  .logo-right-group{ gap:8px; padding:6px 8px; }
  .logo-right-group img{ height:32px; }
  .page-wrap{ padding-top: 80px; }
}


/* === NAVBAR: kapsul, center, dark translucent === */
@media (min-width: 992px){
  .tm-navbar-bg{
    max-width: 1240px;              /* lebar kapsul */
    margin: 12px auto;               /* center */
    padding: 12px 20px;
    background: rgba(0,0,0,.85) !important;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 10px 30px rgba(0,0,0,.35);
  }
}
.cd-slider-nav a,
.navbar-nav .nav-link{
  width:auto !important; height:auto !important;
  display:inline-flex; align-items:center;
  padding:10px 18px; border-radius:999px;
  color:#fff !important;
}
.cd-slider-nav .nav-item.selected .nav-link,
.cd-slider-nav .nav-link:hover,
.cd-slider-nav .nav-link:focus{
  background: rgba(255,255,255,.15) !important;
  color:#fff !important;
}

/* === Batas lebar konten halaman (biar sejajar dengan navbar) === */
.cd-full-width .container-fluid.tm-page-pad,
.cd-full-width .container-fluid.tm-page-width{
  max-width: 1240px;
  margin-left:auto; margin-right:auto;
  padding-left: 15px; padding-right: 15px;
}

/* === Hero/Home 3 kotak: pastikan grid rapi === */
.tm-3-col-textbox{ width:100%; }
.tm-3-col-textbox-inner{
  min-height: 300px;                /* tinggi konsisten */
  display:flex; flex-direction:column; justify-content:center;
}

/* === Padding top: konten turun setinggi navbar === */
:root{ --nav-h: 100px; }
@media (max-width: 480px){ :root{ --nav-h: 80px; } }
.cd-hero-slider{ padding-top: var(--nav-h); }

/* Hapus offset bawaan tema yang mengangkat konten */
.cd-full-width .container-fluid{ margin-top:0 !important; padding-top:0 !important; }

/* Peta responsive penuh kotaknya */
#google-map{ position:relative; height:430px; }
#google-map iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }

.logo-fixed{ display:none !important; }

/* === Perbesar logo partner (±1.5×) === */
.logo-right-group{
  gap: 16px;           /* sedikit lebih renggang */
  padding: 8px 14px;   /* naikkan padding agar proporsional */
}

.logo-right-group img{
  height: 70px !important;   /* dari ~46px → ~70px (1.5×) */
  width: auto;
  object-fit: contain;
}

/* beri ruang ekstra di atas form karena bar logo jadi lebih tinggi */
.page-wrap{ padding-top: 110px; }

/* Mobile */
@media (max-width: 480px){
  .logo-right-group img{ height: 48px !important; }  /* dari 32px → 48px */
  .page-wrap{ padding-top: 100px; }
}
/* Turunin posisi form supaya tidak nabrak logo kanan */
.page-wrap{
  padding-top: 150px !important;   /* sebelumnya 110px */
}

/* Mobile: beri jarak cukup juga */
@media (max-width: 480px){
  .page-wrap{ padding-top: 125px !important; }  /* sebelumnya 100px */
}
/* ===== Logo bar di mobile: 1 baris, lebih kecil ===== */
@media (max-width: 480px){
  .logo-right-group{
    left: 50%;
    transform: translateX(-50%);  /* tetap center */
    right: auto;
    flex-wrap: nowrap;             /* jangan bungkus ke baris baru */
    gap: 6px;
    padding: 6px 8px;
    white-space: nowrap;           /* jaga tetap 1 baris */
  }
  .logo-right-group img{
    height: 15px;                  /* perkecil supaya muat 1 baris */
  }
  /* turunkan form agar tidak ketabrak logo */
  .page-wrap{ padding-top: 120px; }
}

/* Tablet kecil juga dibikin lebih ramping sedikit */
@media (min-width: 481px) and (max-width: 768px){
  .logo-right-group{ flex-wrap: nowrap; gap: 8px; }
  .logo-right-group img{ height: 34px; }
}

/* ===== Mobile: logo bar rapat, 1 baris, full lebar, center ===== */
@media (max-width: 480px){
  .logo-right-group{
    position: fixed;
    top: 10px;
    left: 10px;              /* batasi kiri-kanan supaya tidak keluar layar */
    right: 10px;
    transform: none;         /* jangan translateX, cukup pakai left+right */
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;       /* tetap 1 baris */
    gap: 4px;
    padding: 6px 8px;
    max-width: none;         /* biar lebar mengikuti viewport */
    white-space: nowrap;
  }
  .logo-right-group img{
    height: 10px;            /* diperkecil lagi */
    width: auto;
    display: block;
  }
  /* turunkan form agar tidak nabrak logo bar */
  .page-wrap{ padding-top: 140px; }
}

/* Tablet kecil: sedikit lebih besar tapi tetap 1 baris */
@media (min-width: 481px) and (max-width: 768px){
  .logo-right-group{
    left: 12px; right: 12px;
    gap: 6px;
  }
  .logo-right-group img{ height: 28px; }
  .page-wrap{ padding-top: 130px; }
}

/* tombol di area aksi form */
.form-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;         /* biar rapi kalau sempit */
  margin-top:6px;
}

/* gaya tombol sekunder */
.tm-btn-secondary{
  background: rgba(255,255,255,.92);
  color:#111 !important;
  border: 1px solid rgba(0,0,0,.12);
  padding: 12px 20px;
  border-radius: 999px;
  font-size:16px;
  font-weight:700;
  text-decoration:none !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.12);
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.tm-btn-secondary:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 26px rgba(0,0,0,.18);
}

/* mobile: tombol menumpuk & full width */
@media (max-width: 576px){
  .form-actions{ flex-direction:column; align-items:stretch; }
  .tm-submit-btn, .tm-btn-secondary{ width:100%; text-align:center; }
}

/* nambah responsif kecilin gambar

/* === Logo partner responsif (pendaftaran.html) === */
.logo-right-group{
  position: fixed;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);     /* pusatkan di atas */
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;                  /* boleh 2 baris kalau sempit */
  gap: clamp(4px, 1.4vw, 12px);
  padding: 6px 10px;
  max-width: 96vw;                  /* cegah melebar keluar layar */
  background: rgba(255,255,255,.65);
  border-radius: 10px;
  backdrop-filter: blur(4px);
}

.logo-right-item{ flex: 0 1 auto; }

.logo-right-group img{
  /* Tinggi gambar mengecil otomatis saat viewport mengecil */
  height: clamp(14px, 4.8vw, 37px);
  width: auto;
  display: block;
  object-fit: contain;
}

/* Tambah ruang di atas form saat layar makin kecil
   (supaya kartu form tidak nabrak grup logo) */
@media (max-width: 768px){
  .page-wrap{ padding-top: 150px; }
}
@media (max-width: 480px){
  .page-wrap{ padding-top: 180px; }
}

/* Pusatkan & izinkan wrap (jadi 2 baris) */
.logo-right-group{
  position: fixed;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;

  display: flex;
  flex-wrap: wrap;              /* <- penting supaya bisa 2 baris */
  justify-content: center;
  gap: 8px 12px;                /* jarak vertikal & horizontal */
  padding: 6px 10px;
  background: rgba(255,255,255,.65);
  border-radius: 8px;
  backdrop-filter: blur(4px);
  max-width: 92vw;              /* biar nggak melebar keluar layar */
}

/* ukuran logo (sudah -20%) */
.logo-right-group img{
  height: clamp(10px, 3vw, 30px);
  width: auto;
  display: block;
  object-fit: contain;
}

/* default padding atas form (nanti dioverride JS) */
.page-wrap{ padding-top: 110px; }

/* === OVERRIDE AKHIR: Logo partner tidak numpuk & pindah ke sudut === */

/* default (desktop): bar tetap atas, center, single-line, scalable */
.logo-right-group{
  position: fixed !important;
  top: 12px !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  z-index: 1005 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: nowrap !important;             /* ← kunci: jangan pernah wrap */
  gap: clamp(6px, 1vw, 14px) !important;
  padding: 6px 10px !important;

  background: rgba(255,255,255,.65) !important;
  border-radius: 10px !important;
  backdrop-filter: blur(4px) !important;
  max-width: 96vw !important;               /* cegah melebar keluar layar */
  overflow: hidden !important;               /* potong glow/shadow berlebih */
}

/* ukuran logo berskala sesuai lebar layar (mengecil otomatis) */
.logo-right-group img{
  height: clamp(16px, 4.2vw, 40px) !important;  /* desktop besar sampai kecil */
  width: auto !important;
  object-fit: contain !important;
  display: block !important;
}

/* tablet & ke bawah: pindah ke sudut kanan atas supaya menjauh dari form */
@media (max-width: 992px){
  .logo-right-group{
    left: auto !important;
    right: 12px !important;
    transform: none !important;
    justify-content: flex-end !important;      /* deret ke kanan */
    max-width: calc(100vw - 24px) !important;  /* jaga jarak kiri-kanan */
  }
}

/* ponsel: lebih kompak lagi, tetap 1 baris */
@media (max-width: 480px){
  .logo-right-group{
    gap: 6px !important;
    padding: 5px 6px !important;
    right: 10px !important;
    top: 10px !important;
  }
  .logo-right-group img{
    height: clamp(14px, 7vw, 22px) !important; /* makin kecil di layar sempit */
  }
}

/* beri ruang konten di bawah bar logo (JS-mu sudah mengatur dinamis),
   tapi tambahkan fallback kalau JS terlambat */
.page-wrap{ padding-top: max(110px, 12px + 40px + 20px); } /* fallback aman */

/* Tombol sosial bundar di footer */
.tm-footer .social-btn{
  display:inline-flex; align-items:center; justify-content:center;
  width:56px; height:36px; border-radius:999px;
  color:#fff; background: rgba(255,255,255,.12);
  transition: transform .15s ease, background .2s ease, box-shadow .2s ease;
}
.tm-footer .social-btn:hover{
  background: rgba(255,255,255,.2);
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.25);
}
/* varian warna Instagram (opsional) */
.tm-footer .social-btn.ig:hover{ background: radial-gradient(circle at 30% 30%, #ffd776, #f8465b 45%, #7c36f3); }

/* kalau dimasukkan ke <nav class="links">, beri sedikit jarak */
.tm-footer .links .social-btn{ padding:0; }
/* Pusatkan blok media sosial di footer */
.tm-footer .social-center{
  display:flex; justify-content:center; align-items:center;
  gap:10px; margin:8px 0;
}

/* Tombol sosial bundar */
.tm-footer .social-btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:10px;
  min-width:36px; height:36px; padding:0 12px;   /* ruang utk label */
  border-radius:999px;
  color:#000; background: rgba(255,255,255,.12);
  text-decoration:none; font-weight:800; font:#000;
  transition: transform .15s ease, background .2s ease, box-shadow .2s ease;
}
.tm-footer .social-btn:hover{
  background: rgba(255,255,255,.2);
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.25);
}

/* Gradasi khas IG saat hover (opsional) */
.tm-footer .social-btn.ig:hover{
  background: radial-gradient(circle at 30% 30%, #ffd776, #f8465b 45%, #7c36f3);
}

/* Label: tampil di layar lebar, sembunyikan di mobile */
.tm-footer .social-btn .label{ display:none; }
@media (min-width: 768px){
  .tm-footer .social-btn .label{ display:inline; white-space:nowrap; }
}

/* Kalau sebelumnya ikon IG ada di .links, hilangkan yang lama biar tidak dobel */
.tm-footer .links .social-btn{ display:none; }

/* Tombol IG di form actions */
.form-actions{
  display:flex;
  align-items:center;
  justify-content: flex-start;   /* default: tombol2 di kiri */
  gap:10px;
  flex-wrap:wrap;
  margin-top:6px;
}
.form-actions .ig-btn{
  display:inline-flex; align-items:center; gap:8px;
  font-weight:700; text-decoration:none;
  background: rgba(255,255,255,.92);
  color:#111 !important;
  border: 1px solid rgba(0,0,0,.12);
  padding: 10px 14px;
  border-radius: 999px;
  transition: transform .15s ease, box-shadow .15s ease;
}
.form-actions .ig-btn:hover{
  background: radial-gradient(circle at 30% 30%, #ffd776, #f8465b 45%, #7c36f3);
  color:#fff !important;
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(0,0,0,.12);
}
.form-actions .ig-btn .label{ display:inline; color:#111; }
.form-actions .ig-btn:hover .label{ color:#fff; }

@media (min-width:768px){
  .form-actions .ig-btn .label{ display:inline; }
}

/* mobile: tombol menumpuk full width */
@media (max-width: 576px){
  .form-actions{ flex-direction:column; align-items:stretch; }
  .tm-submit-btn, .tm-btn-secondary, .ig-btn{ width:100%; text-align:center; }
}


/*update 22 09 2025 */

/* === ENLARGE: Drone slider lebih besar & fokus ke slide tengah === */
.tm-drone-slider{
  width:100%;
  max-width: 1400px;   /* perbesar lebar maksimal */
  margin: 0 auto;
  padding: 0 24px;
}

.tm-drone-slider .slick-slide{ 
  padding: 12px;
  transition: transform .3s ease, opacity .3s ease, box-shadow .3s ease;
  opacity: .65;
}
.tm-drone-slider .slick-center{ 
  transform: scale(1.05);
  opacity: 1;
}
.tm-drone-slider img{
  width:100%;
  max-height: 78vh;      /* perbesar tinggi slider */
  object-fit: cover;
  border-radius: 14px;
}

/* Arrow & dots sedikit diperbesar */
.slick-prev:before, .slick-next:before{ font-size: 34px; }
.slick-dots li button:before{ font-size: 12px; }

/* Lightbox (klik gambar) – kasih rasa "zoomable" */
.tm-drone-slider a.tm-zoom{ cursor: zoom-in; }

/* Responsif tinggi maksimal */
@media (max-width: 1024px){
  .tm-drone-slider img{ max-height: 65vh; }
}
@media (max-width: 768px){
  .tm-drone-slider img{ max-height: 58vh; }
}
@media (max-width: 576px){
  .tm-drone-slider{ padding: 0 10px; }
  .tm-drone-slider img{ max-height: 52vh; }
}

/* --- Hapus semua bentuk thumbnail di dots --- */
.slick-dots img,
.slick-dots picture,
.slick-dots svg { display: none !important; }

/* buang kemungkinan background thumbnail di button */
.slick-dots li button { background-image: none !important; }

/* matikan pseudo bawaan slick */
.slick-dots li button:before { content: '' !important; }

/* wadah & dot bulat polos */
.slick-dots{ display:flex !important; gap:8px; bottom:-22px; }
.slick-dots li{ width:auto; height:auto; }

.slick-dots li button .dot{
  display:block; width:12px; height:12px;
  border-radius:50%;
  background: rgba(255,255,255,.45);
  transition: transform .15s ease, background .2s ease, opacity .2s ease;
}
.slick-dots li.slick-active button .dot{
  background:#fff; transform: scale(1.15);
}

/* fokus keyboard */
.slick-dots li button:focus { outline:2px solid #fff; outline-offset:2px; }


/* --- Reset semua kemungkinan thumbnail di dots --- */
.tm-drone-slider .slick-dots img,
.tm-drone-slider .slick-dots picture,
.tm-drone-slider .slick-dots svg{ display:none !important; }
.tm-drone-slider .slick-dots li button:before{ content:'' !important; } /* matikan icon default */

/* --- BAR hitam di belakang dots --- */
.tm-drone-slider .slick-dots{
  position: absolute !important;
  bottom: -26px;                 /* geser posisi */
  left: 50%; transform: translateX(-50%);
  display: flex !important; gap: 8px;
  width: auto; height: auto;     /* agar pas mengikuti isi */
  padding: 6px 10px;
  background: rgba(0,0,0,.65);   /* bar hitam transparan */
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(0,0,0,.35);
  z-index: 3;
}

/* --- Tombol bulat putih di atas bar --- */
.tm-drone-slider .slick-dots li{ width:auto; height:auto; margin:0; }
.tm-drone-slider .slick-dots li button{
  width: 12px; height: 12px;
  border-radius: 50%;
  background: rgba(255,255,255,.75);   /* putih pudar (inactive) */
  border: 0; padding: 0;
  cursor: pointer;
  transition: transform .15s ease, background .2s ease, opacity .2s ease;
}
.tm-drone-slider .slick-dots li.slick-active button{
  background: #fff;               /* putih solid (active) */
  transform: scale(1.15);
}
.tm-drone-slider .slick-dots li button:focus{
  outline: 2px solid #fff; outline-offset: 2px; /* aksesibilitas */
}

/* Responsif kecil: dekatkan ke slider */
@media (max-width: 576px){
  .tm-drone-slider .slick-dots{ bottom: -20px; gap: 6px; padding: 5px 8px; background-color:transparent}
  .tm-drone-slider .slick-dots li button{ width:10px; height:10px; background-color:transparent }
}

/* Hide slick dots khusus untuk section Drones (page-no="2") */

/* Hide slick dots khusus untuk Drones (page 2) & Tactical (page 3) */
:is(div[data-page-no="2"], div[data-page-no="3"]) .tm-drone-slider .slick-dots{
  display: none !important;
}

/* ===== Fix: Contact Info ketabrak header di mobile ===== */
@media (max-width: 576px){
  /* Tambah ruang di atas konten page 6 */
  div[data-page-no="6"].js-tm-page-content {
    padding-top: calc(var(--nav-h) + 16px) !important;
  }

  /* Sedikit dorong container-nya juga (jaga-jaga) */
  div[data-page-no="6"] .tm-contact-page{
    margin-top: 12px !important;
  }

  /* Kalau ada jump/scroll ke heading, pastikan tidak tertutup navbar */
  div[data-page-no="6"] .tm-contact-info{
    scroll-margin-top: calc(var(--nav-h) + 16px);
  }
}


/* ====== CONTACT (page 6) — versi ringkas & proporsional ====== */
div[data-page-no="6"] .tm-contact-page{
  max-width: 980px;              /* dari 1190+ → lebih ramping */
  padding: 0 12px;               /* kecilkan gutter */
  margin: 0 auto;
}

div[data-page-no="6"] .tm-contact-container{
  max-width: 1100px;             /* rampingkan container luar */
}

div[data-page-no="6"] .tm-textbox-padding,
div[data-page-no="6"] .tm-textbox-padding-contact{
  padding: 18px 20px !important; /* kurangi padding box */
}

/* Heading & teks */
div[data-page-no="6"] .tm-contact-info{
  font-size: 1.55rem;            /* ~20px → lebih kecil */
  line-height: 1.35;
  margin-bottom: 10px;
}
div[data-page-no="6"] .tm-text{   /* paragraf */
  font-size: 0.95rem;            /* ~15–16px */
  line-height: 1.55;
}

/* Form controls lebih compact */
div[data-page-no="6"] .form-group{ margin-bottom: 10px; }
div[data-page-no="6"] .form-control{
  font-size: 0.95rem;
  padding: 10px 14px;
}
div[data-page-no="6"] .tm-submit-btn{
  font-size: 1rem;
  padding: 10px 20px;
}

/* Map lebih pendek */
div[data-page-no="6"] #google-map{
  height: 320px;                 /* default desktop ringkas */
}
div[data-page-no="6"] #google-map iframe{
  height: 100%;
}

/* Desktop sedang: lebih ringkas lagi */
@media (max-width: 1200px){
  div[data-page-no="6"] .tm-contact-page{ max-width: 900px; }
  div[data-page-no="6"] #google-map{ height: 300px; }
}

/* Tablet & mobile: tipografi & jarak diperkecil, map makin pendek */
@media (max-width: 768px){
  div[data-page-no="6"] .tm-contact-page{ max-width: 680px; }
  div[data-page-no="6"] .tm-contact-info{ font-size: 1.1rem; }
  div[data-page-no="6"] .tm-text{ font-size: 0.92rem; }
  div[data-page-no="6"] #google-map{ height: 260px; }
}

/* Mobile kecil */
@media (max-width: 480px){
  div[data-page-no="6"] .tm-textbox-padding,
  div[data-page-no="6"] .tm-textbox-padding-contact{ padding: 14px 14px !important; }
  div[data-page-no="6"] .tm-contact-info{ font-size: 1rem; }
  div[data-page-no="6"] .tm-text,
  div[data-page-no="6"] .form-control{ font-size: 0.9rem; }
  div[data-page-no="6"] .tm-submit-btn{ font-size: 0.95rem; padding: 9px 16px; }
  div[data-page-no="6"] #google-map{ height: 220px; }
}