/*
Theme Name: BTU Company
Theme URI: https://banguntunggalutama.com
Author: PT. Bangun Tunggal Utama
Description: Tema resmi PT. Bangun Tunggal Utama
Version: 1.0
Text Domain: btu-company
*/

:root{
  --navy:#082d43;
  --navy-dark:#041d2b;
  --gold:#f0a400;
  --light:#f5f7f8;
  --text:#14232d;
  --white:#ffffff;
}

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  padding:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--text);
  background:#fff;
  overflow-x:hidden;
}

/* HEADER */
header{
  width:100%;
  background:#fff;
  border-bottom:1px solid #e7e7e7;
  position:relative;
  z-index:20;
}

header > div{
  width:min(1140px,92%);
  margin:0 auto;
  min-height:82px;
  padding:8px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
}

header img{
  width:58px !important;
  height:58px !important;
  max-width:58px !important;
  max-height:58px !important;
  object-fit:contain !important;
  display:block !important;
}

.btu-nav{
  display:flex;
  align-items:center;
  gap:24px;
  flex-wrap:wrap;
}

.btu-nav a{
  color:#14232d;
  text-decoration:none;
  font-size:14px;
  font-weight:700;
  transition:.2s;
}

.btu-nav a:hover{
  color:#f0a400;
}

/* GLOBAL */
main{
  width:100%;
}

.btu-container{
  width:min(1140px,92%);
  margin:auto;
}

/* HERO */
.btu-hero{
  position:relative;
  width:100%;
  min-height:720px;
  background:
    url('https://banguntunggalutama.com/wp-content/uploads/2026/08/bedground.jpeg')
    center/cover no-repeat;
  display:flex;
  align-items:center;
}

.btu-overlay{
  position:absolute;
  inset:0;
  background:rgba(3,31,46,.48);
}

.btu-hero-content{
  position:relative;
  z-index:2;
  color:#fff;
  text-align:center;
  padding:110px 0 70px;
}

.btu-eyebrow,
.btu-section-label{
  font-weight:800;
  letter-spacing:2px;
  font-size:13px;
}

.btu-hero h1{
  font-size:54px;
  line-height:1.08;
  max-width:850px;
  margin:18px auto;
}

.btu-hero p{
  font-size:18px;
  line-height:1.7;
  max-width:820px;
  margin:0 auto 30px;
  color:#eef3f5;
}

.btu-buttons{
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
}

.btu-btn{
  display:inline-block;
  padding:15px 26px;
  border-radius:999px;
  text-decoration:none;
  font-weight:800;
  font-size:13px;
  letter-spacing:.4px;
}

.btu-btn-gold{
  background:var(--gold);
  color:#111;
}

.btu-btn-outline{
  border:1px solid #fff;
  color:#fff;
}

.btu-hero-services{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:58px;
}

.btu-hero-card{
  background:rgba(8,45,67,.92);
  border-top:4px solid var(--gold);
  padding:25px;
}

.btu-hero-card h3{
  margin:0 0 10px;
}

.btu-hero-card p{
  font-size:14px;
  margin:0;
  color:#e5edf1;
}

/* SECTION */
.btu-section{
  width:100%;
  padding:90px 0;
}

.btu-two-column{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
}

.btu-section h2{
  font-size:40px;
  line-height:1.2;
  margin:12px 0 20px;
}

.btu-section p{
  line-height:1.75;
  color:#5a6870;
}

.btu-photo-box{
  border:1px solid #ddd;
  padding:12px;
  background:#fff;
  box-shadow:0 20px 50px rgba(0,0,0,.08);
}

.btu-photo-placeholder{
  min-height:420px;
  background:linear-gradient(135deg,#d9e1e5,#eef3f5);
  display:grid;
  place-items:center;
  color:#6c7a82;
  font-weight:800;
  text-align:center;
}

.btu-text-link{
  color:var(--navy);
  text-decoration:none;
  font-weight:800;
}

/* DARK */
.btu-dark{
  background:var(--navy);
  color:#fff;
}

.btu-dark p{
  color:#d9e5eb;
}

.btu-gold{
  color:var(--gold);
}

/* GRIDS */
.btu-grid-3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}

.btu-grid-4{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}

/* CARDS */
.btu-service-card{
  padding:28px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.12);
  border-top:3px solid var(--gold);
}

.btu-service-card h3{
  margin-top:0;
}

.btu-product-card{
  background:#fff;
  border:1px solid #e6eaec;
  padding:12px;
}

.btu-product-image{
  min-height:210px;
  background:linear-gradient(135deg,#d9e1e5,#eef3f5);
  display:grid;
  place-items:center;
  color:#6c7a82;
  font-weight:800;
}

.btu-product-card h3{
  padding:6px 8px 12px;
}

.btu-portfolio{
  background:var(--light);
}

.btu-project{
  min-height:260px;
  background:linear-gradient(135deg,#d9e1e5,#eef3f5);
  display:grid;
  place-items:center;
  color:#6c7a82;
  font-weight:800;
}

.btu-why{
  border:1px solid #e2e7ea;
  background:#fff;
  padding:28px;
}

.btu-why span{
  color:var(--gold);
  font-size:30px;
  font-weight:800;
}

/* CONTACT */
.btu-contact{
  background:var(--navy-dark);
  color:#fff;
}

.btu-contact p{
  color:#dce6eb;
}

.btu-contact-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:60px;
  align-items:center;
}

.btu-contact-box{
  background:#fff;
  color:#111;
  padding:30px;
}

.btu-contact-box p{
  color:#333;
}

.btu-full{
  width:100%;
  text-align:center;
}

/* FOOTER */
footer{
  width:100%;
  margin:0;
}

/* RESPONSIVE */
@media(max-width:900px){
  header > div{
    flex-direction:column;
    align-items:flex-start;
  }

  .btu-nav{
    gap:14px;
  }

  .btu-hero h1{
    font-size:40px;
  }

  .btu-hero-services,
  .btu-grid-3{
    grid-template-columns:1fr 1fr;
  }

  .btu-two-column,
  .btu-contact-grid{
    grid-template-columns:1fr;
  }

  .btu-grid-4{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:600px){
  header > div{
    align-items:center;
  }

  .btu-nav{
    justify-content:center;
  }

  .btu-hero{
    min-height:auto;
  }

  .btu-hero-content{
    padding:80px 0 50px;
  }

  .btu-hero h1{
    font-size:34px;
  }

  .btu-hero p{
    font-size:16px;
  }

  .btu-hero-services,
  .btu-grid-3,
  .btu-grid-4{
    grid-template-columns:1fr;
  }

  .btu-section{
    padding:65px 0;
  }

  .btu-section h2{
    font-size:32px;
  }
}
/* ===== MENU HEADER FINAL ===== */

header .btu-nav{
  display:flex !important;
  align-items:center !important;
  gap:24px !important;
}

header .btu-nav a,
header .btu-nav a:visited{
  color:#14232d !important;
  text-decoration:none !important;
  font-size:14px !important;
  font-weight:700 !important;
}

header .btu-nav a:hover{
  color:#f0a400 !important;
  text-decoration:none !important;
}
/* ===== LOGO HEADER FIX FINAL ===== */

header{
  overflow:visible !important;
}

header > div{
  min-height:100px !important;
  overflow:visible !important;
}

header img{
  width:auto !important;
  height:78px !important;
  max-width:110px !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center !important;
  display:block !important;
  overflow:visible !important;
}
.btu-about-image{
  width:100%;
  height:420px;
  object-fit:cover;
  display:block;
}
/* ===== FIX TENTANG KAMI ===== */

#tentang .btu-two-column{
  display:grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap:50px !important;
  align-items:center !important;
  width:100% !important;
}

#tentang .btu-two-column > div{
  min-width:0 !important;
  width:100% !important;
}

#tentang .btu-photo-box{
  width:100% !important;
  max-width:100% !important;
  overflow:hidden !important;
  padding:10px !important;
}

#tentang .btu-about-image{
  width:100% !important;
  max-width:100% !important;
  height:420px !important;
  object-fit:cover !important;
  display:block !important;
  border-radius:14px;
}

/* MOBILE */
@media(max-width:900px){
  #tentang .btu-two-column{
    grid-template-columns:1fr !important;
    gap:30px !important;
  }

  #tentang .btu-about-image{
    height:320px !important;
  }
}
/* ===== FINAL CLEANUP BTU ===== */

html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden !important;
}

/* HEADER */
header{
  width:100%;
  overflow:visible !important;
}

header > div{
  width:92%;
  max-width:1140px;
  min-height:100px !important;
  margin:0 auto;
  overflow:visible !important;
}

/* LOGO */
header img{
  width:auto !important;
  height:78px !important;
  max-width:110px !important;
  max-height:78px !important;
  object-fit:contain !important;
  object-position:center !important;
  display:block !important;
}

/* MENU */
header .btu-nav{
  display:flex !important;
  align-items:center !important;
  gap:24px !important;
}

header .btu-nav a,
header .btu-nav a:visited,
header .btu-nav a:active{
  color:#14232d !important;
  text-decoration:none !important;
  font-size:14px !important;
  font-weight:700 !important;
}

header .btu-nav a:hover{
  color:#f0a400 !important;
}

/* ANCHOR MENU */
#beranda,
#tentang,
#layanan,
#produk,
#portofolio,
#kontak{
  scroll-margin-top:110px;
}

/* TENTANG KAMI */
#tentang .btu-two-column{
  width:100% !important;
  max-width:100% !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:50px !important;
  align-items:center !important;
}

#tentang .btu-photo-box{
  width:100% !important;
  min-width:0 !important;
  overflow:hidden !important;
}

#tentang .btu-about-image{
  width:100% !important;
  max-width:100% !important;
  height:420px !important;
  object-fit:cover !important;
  display:block !important;
  border-radius:14px;
}

@media(max-width:900px){
  #tentang .btu-two-column{
    grid-template-columns:1fr !important;
    gap:30px !important;
  }

  #tentang .btu-about-image{
    height:320px !important;
  }
}
/* ===== LOGO HEADER BARU ===== */

.btu-header-logo{
  width:300px !important;
  height:auto !important;
  max-width:300px !important;
  max-height:none !important;
  object-fit:contain !important;
  display:block !important;
}

/* HP */
@media(max-width:600px){
  .btu-header-logo{
    width:240px !important;
    max-width:90vw !important;
  }
}
/* ===== HEADER FINAL RAPI ===== */

.btu-header{
  width:100% !important;
  background:#fff !important;
  border-bottom:1px solid #e7e7e7 !important;
}

.btu-header-inner{
  width:min(1140px,92%) !important;
  margin:0 auto !important;
  min-height:90px !important;
  padding:10px 0 !important;

  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:30px !important;
}

.btu-logo-link{
  display:block !important;
  flex-shrink:0 !important;
}

.btu-header-logo{
  width:360px !important;
  max-width:360px !important;
  height:auto !important;
  max-height:82px !important;
  object-fit:contain !important;
  display:block !important;
}

.btu-header .btu-nav{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:22px !important;
  flex-wrap:nowrap !important;
}

.btu-header .btu-nav a,
.btu-header .btu-nav a:visited{
  color:#14232d !important;
  text-decoration:none !important;
  font-size:14px !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}

.btu-header .btu-nav a:hover{
  color:#f0a400 !important;
}

/* TABLET */
@media(max-width:900px){
  .btu-header-inner{
    flex-direction:column !important;
    justify-content:center !important;
    padding:12px 0 !important;
  }

  .btu-header-logo{
    width:320px !important;
    max-width:90vw !important;
  }

  .btu-header .btu-nav{
    justify-content:center !important;
    flex-wrap:wrap !important;
  }
}

/* HP */
@media(max-width:600px){
  .btu-header-logo{
    width:280px !important;
  }

  .btu-header .btu-nav{
    gap:12px !important;
  }

  .btu-header .btu-nav a{
    font-size:12px !important;
  }
}
/* ===== HEADER FINAL RAPI ===== */

.btu-header{
  width:100% !important;
  background:#fff !important;
  border-bottom:1px solid #e7e7e7 !important;
}

.btu-header-inner{
  width:min(1140px,92%) !important;
  margin:0 auto !important;
  min-height:90px !important;
  padding:10px 0 !important;

  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:30px !important;
}

.btu-logo-link{
  display:block !important;
  flex-shrink:0 !important;
}

.btu-header-logo{
  width:360px !important;
  max-width:360px !important;
  height:auto !important;
  max-height:82px !important;
  object-fit:contain !important;
  display:block !important;
}

.btu-header .btu-nav{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:22px !important;
  flex-wrap:nowrap !important;
}

.btu-header .btu-nav a,
.btu-header .btu-nav a:visited{
  color:#14232d !important;
  text-decoration:none !important;
  font-size:14px !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}

.btu-header .btu-nav a:hover{
  color:#f0a400 !important;
}

/* TABLET */
@media(max-width:900px){
  .btu-header-inner{
    flex-direction:column !important;
    justify-content:center !important;
    padding:12px 0 !important;
  }

  .btu-header-logo{
    width:320px !important;
    max-width:90vw !important;
  }

  .btu-header .btu-nav{
    justify-content:center !important;
    flex-wrap:wrap !important;
  }
}

/* HP */
@media(max-width:600px){
  .btu-header-logo{
    width:280px !important;
  }

  .btu-header .btu-nav{
    gap:12px !important;
  }

  .btu-header .btu-nav a{
    font-size:12px !important;
  }
}
/* ===== FORCE HEADER BTU 2026 ===== */

header.btu-header{
  height:auto !important;
  min-height:0 !important;
  padding:0 !important;
  margin:0 !important;
}

header.btu-header .btu-header-inner{
  width:92% !important;
  max-width:1140px !important;
  height:100px !important;
  min-height:100px !important;
  margin:0 auto !important;
  padding:8px 0 !important;

  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:space-between !important;
}

header.btu-header .btu-logo-link{
  display:flex !important;
  align-items:center !important;
}

header.btu-header img.btu-header-logo{
  width:360px !important;
  max-width:360px !important;
  height:auto !important;
  max-height:80px !important;
  object-fit:contain !important;
}

header.btu-header .btu-nav{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:22px !important;
  margin:0 !important;
  padding:0 !important;
}

header.btu-header .btu-nav a{
  color:#14232d !important;
  text-decoration:none !important;
  font-size:14px !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}
/* ===== HEADER SIZE FIX ===== */

header.btu-header .btu-header-inner{
  width:92% !important;
  max-width:1200px !important;
  height:110px !important;
  min-height:110px !important;
  padding:10px 0 !important;
  margin:0 auto !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:space-between !important;
  overflow:visible !important;
}

header.btu-header .btu-logo-link{
  width:430px !important;
  max-width:430px !important;
  display:block !important;
  flex-shrink:0 !important;
}

header.btu-header img.btu-header-logo{
  width:430px !important;
  max-width:430px !important;
  height:90px !important;
  max-height:90px !important;
  object-fit:contain !important;
  object-position:left center !important;
  display:block !important;
}

header.btu-header .btu-nav{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:20px !important;
  flex-wrap:nowrap !important;
}

header.btu-header .btu-nav a{
  font-size:14px !important;
  color:#14232d !important;
  text-decoration:none !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}
/* ===== HEADER POLISH ===== */

header.btu-header .btu-header-inner{
  max-width:1280px !important;
  min-height:105px !important;
}

header.btu-header img.btu-header-logo{
  width:460px !important;
  max-width:460px !important;
  height:auto !important;
  max-height:90px !important;
}

header.btu-header .btu-nav{
  gap:24px !important;
}

header.btu-header .btu-nav a{
  font-size:15px !important;
  font-weight:700 !important;
}
/* FOTO PRODUK */
.btu-product-image{
  height:230px !important;
  min-height:230px !important;
  overflow:hidden !important;
  padding:0 !important;
}

.btu-product-photo{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
  display:block !important;
}