/*
Theme Name:   Kadence Child — BCK Consulting
Template:     kadence
Version:      1.0.0
*/

/* ── CSS Variables ── */
:root {
  --bck-green      : #2E7D32;
  --bck-green-light: #4CAF50;
  --bck-navy       : #1a237e;
  --bck-red        : #c62828;
  --bck-white      : #ffffff;
}

/* ── Light Mode (default) ── */
body {
  --bg-main    : #ffffff;
  --bg-section : #f5f7fa;
  --text-main  : #1a1a2e;
  --text-muted : #666677;
  --border     : #e0e0e0;
}

/* ── Dark Mode ── */
body.dark-mode {
  --bg-main    : #0d1117;
  --bg-section : #161b22;
  --text-main  : #e6edf3;
  --text-muted : #8b949e;
  --border     : #30363d;
}

/* ── Transisi smooth mode switch ── */
body, body * {
  transition: background-color 0.3s ease,
              color 0.3s ease,
              border-color 0.3s ease;
}

/* ── Apply ke elemen Kadence ── */
body.dark-mode .site-header,
body.dark-mode .kadence-navigation {
  background-color: var(--bg-section) !important;
  border-bottom: 1px solid var(--border) !important;
}

body.dark-mode .entry-content,
body.dark-mode .wp-site-blocks {
  background-color: var(--bg-main);
  color: var(--text-main);
}

/* ── Dark mode toggle button di navbar ── */
.dark-mode-toggle {
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 50px;
  padding: 4px 12px;
  cursor: pointer;
  font-size: 13px;
  color: var(--text-muted);
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 6px;
}

.dark-mode-toggle:hover {
  border-color: var(--bck-green);
  color: var(--bck-green);
}

/* ── Hero Section ── */
.bck-hero {
  background: var(--bg-main);
  padding: 80px 0;
}

body.dark-mode .bck-hero {
  background: linear-gradient(135deg, #0d1117 0%, #0d1f12 100%);
}

/* ── Accent color ── */
.bck-accent { color: var(--bck-green); }
.bck-accent-bg { background-color: var(--bck-green); }

/* ── Section alternating background ── */
.section-alt {
  background-color: var(--bg-section);
}

/* ── Card style ── */
.bck-card {
  background: var(--bg-main);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 24px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.bck-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(46, 125, 50, 0.15);
}

body.dark-mode .bck-card {
  background: var(--bg-section);
  border-color: var(--border);
}
/*--- tambahan baru
/* Hide page title di Beranda */
.page-id-12 .entry-header,
.page-id-12 .wp-block-post-title,
.page-id-12 h1.entry-title,
.home .entry-header {
    display: none !important;
}

/* Full width — hapus padding Kadence */
.page-id-12 .entry-content,
.page-id-12 .content-container,
.home .entry-content {
    padding: 0 !important;
    max-width: 100% !important;
}

.page-id-12 .kadence-inner-column-inner,
.page-id-12 .wp-block-group__inner-container {
    max-width: 100% !important;
    padding: 0 !important;
}

/* Fix grid keahlian */
@media (min-width: 768px) {
    .page-id-12 [style*="grid-template-columns"] {
        display: grid !important;
    }
}

/* ═══════════════════════════════════════════════
   BCK HOMEPAGE FIXES
═══════════════════════════════════════════════ */

/* ── 1. Full viewport hero ── */
.page-id-12 .entry-content > div:first-child,
.home .entry-content > div:first-child {
    min-height: 100vh !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ── 2. Fix tombol "Lihat Layanan" ── */
.page-id-12 a[href*="layanan"]:not([style*="background:#2E7D32"]) {
    border: 1.5px solid rgba(255,255,255,0.5) !important;
    border-radius: 8px !important;
    padding: 14px 32px !important;
    display: inline-block !important;
}

/* ── 3. Fix grid keahlian — 3 kolom ── */
.page-id-12 div[style*="repeat(auto-fill"],
.page-id-12 div[style*="auto-fill"] {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
}

@media (max-width: 900px) {
    .page-id-12 div[style*="repeat(auto-fill"],
    .page-id-12 div[style*="auto-fill"] {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 600px) {
    .page-id-12 div[style*="repeat(auto-fill"],
    .page-id-12 div[style*="auto-fill"] {
        grid-template-columns: 1fr !important;
    }
}

/* ── 4. Fix grid Visi/Misi — 2 kolom ── */
.page-id-12 div[style*="grid-template-columns:1fr 1fr"],
.page-id-12 div[style*="grid-template-columns: 1fr 1fr"] {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 32px !important;
}

@media (max-width: 768px) {
    .page-id-12 div[style*="grid-template-columns:1fr 1fr"],
    .page-id-12 div[style*="grid-template-columns: 1fr 1fr"] {
        grid-template-columns: 1fr !important;
    }
}

/* ── 5. Fix grid Tentang — 2 kolom ── */
.page-id-12 div[style*="grid-template-columns:1fr 1fr"],
.page-id-12 div[style*="1fr 1fr"][style*="gap:48px"],
.page-id-12 div[style*="gap: 48px"] {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
}

/* ── 6. Sticky navbar ── */
.site-header,
.kadence-sticky-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 999 !important;
    background: rgba(255,255,255,0.95) !important;
    backdrop-filter: blur(8px) !important;
    box-shadow: 0 1px 12px rgba(0,0,0,0.08) !important;
}

/* ── 7. Transparent header di hero area ── */
/*.page-id-12 .site-header {
    background: transparent !important;
    box-shadow: none !important;
    position: absolute !important;
    width: 100% !important;
}

/* Setelah scroll, header jadi solid */
/**.page-id-12 .site-header.kadence-scrolled,
.page-id-12 .site-header.scroll-down {
    background: rgba(255,255,255,0.97) !important;
    box-shadow: 0 1px 12px rgba(0,0,0,0.1) !important;
    position: fixed !important;
}

/* ── 8. Warna link navbar di atas hero ── */
/*.page-id-12 .site-header:not(.kadence-scrolled) .main-navigation a,
.page-id-12 .site-header:not(.scroll-down) .nav-link {
    color: #ffffff !important;
}

.page-id-12 .site-header:not(.kadence-scrolled) .site-branding a {
    color: #ffffff !important;
}
/*Penggantinya */
/* ── 7. Transparent header di hero area ── */
/* ── Navbar solid — always visible ── */
/*.site-header {
    background: #ffffff !important;
    box-shadow: 0 1px 8px rgba(0,0,0,0.08) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 999 !important;
}

.main-navigation a,
.nav-link,
.kadence-navigation .menu-item a {
    color: #1a1a2e !important;
    font-weight: 500 !important;
}

.main-navigation a:hover,
.nav-link:hover {
    color: #2E7D32 !important;
}

.site-branding a,
.site-title a {
    color: #1a1a2e !important;
    font-weight: 700 !important;
}
/* ── Navbar solid — always visible ── */
/* ── Sticky navbar — always on top ── */
.site-header,
#masthead,
.kadence-header,
header.site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
    background: #ffffff !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08) !important;
    width: 100% !important;
}

/* ── 9. Max width konten sections ── */
.page-id-12 .entry-content > div > div[style*="max-width"] {
    width: 100% !important;
}

/* ── 10. Hapus padding default Kadence di halaman ini ── */
.page-id-12 .content-container,
.page-id-12 article.page {
    padding: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
}

.page-id-12 .entry-content {
    padding: 0 !important;
    margin: 0 !important;
}

/* ── 11. Stats row di hero — flex ── */
.page-id-12 div[style*="justify-content:center"][style*="gap:48px"] {
    display: flex !important;
    justify-content: center !important;
    gap: 48px !important;
    flex-wrap: wrap !important;
}

/* ── 12. CTA buttons row ── */
.page-id-12 div[style*="justify-content:center"][style*="gap:14px"] {
    display: flex !important;
    justify-content: center !important;
    gap: 14px !important;
    flex-wrap: wrap !important;
}

/* ── 13. Hero full viewport ── */
.page-id-12 .entry-content > div:first-child {
    min-height: calc(100vh - 72px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
/*----Tambahan 20260421 */
/* ── Fix semua halaman inner pages ── */

/* Sembunyikan page title di semua inner pages */
.page-id-13 .entry-header,
.page-id-14 .entry-header,
.page-id-15 .entry-header,
.page-id-16 .entry-header,
.single .entry-header .entry-title {
    display: none !important;
}

/* Full width content semua pages */
.page .entry-content,
.page article {
    max-width: 100% !important;
    padding: 0 !important;
}

/* Fix grid 2 kolom di halaman kontak */
div[style*="grid-template-columns:1fr 1fr"],
div[style*="grid-template-columns: 1fr 1fr"] {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
}

@media (max-width: 768px) {
    div[style*="grid-template-columns:1fr 1fr"],
    div[style*="grid-template-columns: 1fr 1fr"] {
        grid-template-columns: 1fr !important;
    }
}

/* Fix grid layanan */
div[style*="repeat(auto-fill,minmax(320px"] {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important;
}

/* Style CF7 form */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea,
.wpcf7 select {
    width: 100% !important;
    padding: 10px 14px !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    margin-bottom: 4px !important;
    box-sizing: border-box !important;
    font-family: inherit !important;
}

.wpcf7 input[type="submit"] {
    background: #2E7D32 !important;
    color: #fff !important;
    padding: 12px 28px !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    width: 100% !important;
    margin-top: 8px !important;
}

.wpcf7 input[type="submit"]:hover {
    background: #1B5E20 !important;
}

.wpcf7 label {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #444 !important;
    margin-bottom: 4px !important;
    display: block !important;
}

.wpcf7-form p {
    margin-bottom: 16px !important;
}

/* ── Fix kontak form full width ── */
.wpcf7,
.wpcf7-form,
.wpcf7 form {
    width: 100% !important;
}

.wpcf7 .wpcf7-form-control-wrap,
.wpcf7 span.wpcf7-form-control-wrap {
    display: block !important;
    width: 100% !important;
}

/* Perbaiki padding section kontak */
div[style*="padding:60px 40px"] {
    padding: 40px 20px !important;
}

@media (min-width: 769px) {
    div[style*="padding:60px 40px"] {
        padding: 60px 40px !important;
    }
}

/* ── BCK Contact Grid — 2 kolom ── */
.bck-contact-grid {
    display: grid !important;
    grid-template-columns: 1.2fr 0.8fr !important;
    gap: 32px !important;
    align-items: start !important;
}

.bck-form-col {
    background: #ffffff;
    border-radius: 14px;
    padding: 28px;
    border: 1px solid #e8ecf0;
}

.bck-info-col {
    display: flex;
    flex-direction: column;
    gap: 0;
}

@media (max-width: 768px) {
    .bck-contact-grid {
        grid-template-columns: 1fr !important;
    }
}