/*
Theme Name: Solahart Bali
Theme URI: https://bikinwebsite.co
Author: Bikinwebsite.co
Author URI: https://bikinwebsite.co
Description: Tema WordPress khusus untuk situs jasa service pemanas air. Berdiri sendiri, tanpa jQuery, satu berkas CSS. Skala huruf memakai rasio emas, warna dan bentuk sudut diatur dari Customizer dan disalurkan sebagai CSS variables. Dirancang untuk dipakai bersama BW Site Builder, BW Toolkit dan BW Sections Jasa.
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bw-solahart
Tags: one-column, custom-colors, custom-logo, custom-menu, block-styles
*/

/* ===========================================================
 * Token. Nilai di sini cuma cadangan — nilai hidupnya
 * disuntik Customizer sebagai blok :root tepat setelah berkas ini.
 * Nama token sengaja memakai awalan --bw- yang sama dengan
 * BW Theme, supaya BW Site Builder, BW Toolkit dan BW Sections
 * Jasa langsung ikut warna tanpa penyesuaian apa pun.
 * ======================================================== */
:root{
  --bw-primary:#0B3C5D; --bw-primary-900:#072638; --bw-primary-050:#E7EEF3;
  --bw-primary-rgb:11,60,93;
  --bw-on-primary:#ffffff; --bw-on-primary-soft:rgba(255,255,255,.78);
  --bw-accent:#D64A1F; --bw-accent-btn:#D64A1F; --bw-accent-btn-900:#AF3B17;
  --bw-on-accent:#ffffff; --bw-accent-050:#FBEDE8; --bw-accent-050-ink:#7A2910;
  --bw-surface:#F7F8F9; --bw-card:#ffffff; --bw-ink:#14202B;
  --bw-ink-hover:#0A1119; --bw-on-ink:#ffffff;
  --bw-muted:#5A6977; --bw-muted-2:#6B7A88; --bw-faint:#8C98A4;
  --bw-line:#E2E7EB;
  --bw-footer-bg:#14202B; --bw-footer-text:rgba(255,255,255,.72); --bw-footer-link:#ffffff;

  --bw-radius-s:8px; --bw-radius-m:14px; --bw-radius-l:22px;
  --bw-pill:999px; --bw-btn-radius:10px;
  --bw-container:1200px; --bw-base:17px;

  --bw-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --bw-font-head:var(--bw-font);

  /* Skala rasio emas (φ = 1.618). H1 selalu paling besar. */
  --bw-h1:clamp(2.45rem,1.30rem + 4.40vw,5.236rem);
  --bw-h2:clamp(1.95rem,1.17rem + 2.70vw,3.236rem);
  --bw-h3:clamp(1.45rem,1.10rem + 1.30vw,2.000rem);
  --bw-h4:clamp(1.10rem,1.00rem + 0.45vw,1.236rem);

  --bw-sec-y:clamp(56px,6vw,104px);
  --bw-gap-card:clamp(18px,2vw,30px);
}

/* ============ Dasar ============ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}}
body{margin:0;background:var(--bw-surface);color:var(--bw-ink);
  font-family:var(--bw-font);font-size:var(--bw-base);line-height:1.65;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--bw-accent);outline-offset:3px;border-radius:4px}

h1,h2,h3,h4,h5,h6{font-family:var(--bw-font-head);margin:0;
  line-height:1.12;letter-spacing:-.018em;font-weight:760;text-wrap:balance}
h1{font-size:var(--bw-h1)}
h2{font-size:var(--bw-h2)}
h3{font-size:var(--bw-h3)}
h4{font-size:var(--bw-h4)}
p{margin:0}

.bw-container{width:min(100% - 2*clamp(18px,4vw,40px),var(--bw-container));margin-inline:auto}
.bw-sec{padding-block:var(--bw-sec-y)}
.bw-prose>*+*{margin-top:1.05em}
.bw-prose h2,.bw-prose h3{margin-top:1.6em}
.bw-prose ul,.bw-prose ol{padding-left:1.25em}
.bw-prose a{color:var(--bw-accent);text-decoration:underline;text-underline-offset:3px}

.skip-link{position:absolute;left:-9999px;top:0;z-index:999;
  background:var(--bw-ink);color:var(--bw-on-ink);padding:12px 18px;border-radius:0 0 var(--bw-radius-s) 0}
.skip-link:focus{left:0}

/* ============ Tombol ============ */
.bw-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:13px 24px;border:1px solid transparent;border-radius:var(--bw-btn-radius);
  font-weight:650;font-size:.96rem;line-height:1.2;cursor:pointer;
  transition:transform .18s ease,background-color .18s ease,box-shadow .18s ease}
.bw-btn:hover{transform:translateY(-2px)}
.bw-btn--accent{background:var(--bw-accent-btn);color:var(--bw-on-accent);
  box-shadow:0 8px 22px -12px rgba(0,0,0,.55)}
.bw-btn--accent:hover{background:var(--bw-accent-btn-900)}
.bw-btn--dark{background:var(--bw-ink);color:var(--bw-on-ink)}
.bw-btn--dark:hover{background:var(--bw-ink-hover)}
.bw-btn--ghost{background:transparent;color:var(--bw-ink);border-color:var(--bw-line)}
.bw-btn--ghost:hover{border-color:var(--bw-ink);background:var(--bw-card)}

/* ============ Header ============ */
.bw-header{position:sticky;top:0;z-index:60;background:var(--bw-card);
  border-bottom:1px solid var(--bw-line)}
.bw-header__bar{display:flex;align-items:center;gap:clamp(16px,3vw,40px);
  min-height:74px;padding-block:10px}
.bw-brand{display:flex;align-items:center;gap:11px;flex:0 0 auto}
.bw-brand img{width:auto;max-height:42px}
.bw-brand__name{font-family:var(--bw-font-head);font-weight:780;font-size:1.03rem;
  line-height:1.15;letter-spacing:-.015em;display:flex;flex-direction:column}
.bw-brand__sub{font-size:.72rem;font-weight:520;color:var(--bw-muted);letter-spacing:.01em}

.bw-nav{margin-left:auto;display:flex;align-items:center;gap:clamp(14px,2vw,30px)}
.bw-nav ul{display:flex;align-items:center;gap:clamp(14px,2vw,30px);
  list-style:none;margin:0;padding:0}
.bw-nav a:not(.bw-btn){font-size:.95rem;font-weight:560;color:var(--bw-muted);
  padding-block:6px;position:relative;transition:color .18s ease}
.bw-nav a:not(.bw-btn):hover,.bw-nav .current-menu-item>a{color:var(--bw-ink)}
.bw-nav .current-menu-item>a::after{content:"";position:absolute;left:0;right:0;bottom:0;
  height:2px;background:var(--bw-accent);border-radius:2px}
.bw-nav__cta{margin-left:6px}

.bw-burger{display:none;margin-left:auto;background:none;border:1px solid var(--bw-line);
  border-radius:var(--bw-radius-s);padding:9px;cursor:pointer}

@media (max-width:960px){
  .bw-burger{display:inline-flex}
  .bw-nav{position:fixed;inset:74px 0 auto 0;margin:0;background:var(--bw-card);
    border-bottom:1px solid var(--bw-line);flex-direction:column;align-items:stretch;
    gap:0;padding:14px clamp(18px,4vw,40px) 22px;
    transform:translateY(-12px);opacity:0;visibility:hidden;
    transition:opacity .2s ease,transform .2s ease,visibility .2s}
  .bw-nav.is-open{transform:none;opacity:1;visibility:visible}
  .bw-nav ul{flex-direction:column;align-items:stretch;gap:0}
  .bw-nav li{border-bottom:1px solid var(--bw-line)}
  .bw-nav a:not(.bw-btn){display:block;padding:14px 0;font-size:1rem}
  .bw-nav__cta{margin:16px 0 0;justify-content:center}
}

/* ============ Footer ============ */
.bw-footer{background:var(--bw-footer-bg);color:var(--bw-footer-text);
  padding-block:clamp(48px,5vw,72px) 0;margin-top:0}
.bw-footer a{color:var(--bw-footer-link)}
.bw-footer a:hover{text-decoration:underline;text-underline-offset:3px}
.bw-footer__grid{display:grid;gap:clamp(28px,4vw,52px);
  grid-template-columns:minmax(0,1.4fr) repeat(auto-fit,minmax(170px,1fr))}
.bw-footer__brand{font-family:var(--bw-font-head);color:var(--bw-footer-link);
  font-weight:780;font-size:1.12rem;margin-bottom:12px}
.bw-footer__desc{font-size:.93rem;max-width:40ch}
.bw-footer h2{font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;
  color:var(--bw-footer-link);opacity:.6;font-weight:680;margin-bottom:14px}
.bw-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:.93rem}
.bw-footer__bar{margin-top:clamp(34px,4vw,54px);padding-block:22px;
  border-top:1px solid rgba(255,255,255,.12);
  display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:space-between;font-size:.85rem}

/* ============ Halaman biasa ============ */
/* --bw-h1 disediakan untuk hero section, bukan judul halaman biasa —
   kalau tidak, judul arsip jadi sebesar headline beranda. */
.bw-title{font-size:var(--bw-h2)}
.bw-page-head{background:var(--bw-card);border-bottom:1px solid var(--bw-line);
  padding-block:clamp(40px,5vw,72px)}
.bw-page-head h1{font-size:var(--bw-h2)}
.bw-page-head p{color:var(--bw-muted);margin-top:14px;max-width:62ch}

.bw-list{display:grid;gap:var(--bw-gap-card);
  grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.bw-card{background:var(--bw-card);border:1px solid var(--bw-line);
  border-radius:var(--bw-radius-m);overflow:hidden;
  transition:transform .2s ease,box-shadow .2s ease}
.bw-card:hover{transform:translateY(-3px);box-shadow:0 16px 36px -24px rgba(0,0,0,.4)}
.bw-card__body{padding:22px}
.bw-card__meta{font-size:.8rem;color:var(--bw-faint);margin-bottom:8px}
.bw-card h3{font-size:1.12rem;line-height:1.3}
.bw-card p{color:var(--bw-muted);font-size:.94rem;margin-top:9px}

.bw-pager{display:flex;gap:8px;flex-wrap:wrap;margin-top:40px}
.bw-pager .page-numbers{display:inline-flex;align-items:center;justify-content:center;
  min-width:42px;height:42px;padding:0 12px;border:1px solid var(--bw-line);
  border-radius:var(--bw-radius-s);background:var(--bw-card);font-size:.93rem}
.bw-pager .page-numbers.current{background:var(--bw-ink);color:var(--bw-on-ink);border-color:var(--bw-ink)}

.bw-404{text-align:center;padding-block:clamp(70px,9vw,140px)}
.bw-404 p{color:var(--bw-muted);margin:16px auto 28px;max-width:46ch}

/* ============ Blok inti WordPress ============ */
.wp-block-image img{border-radius:var(--bw-radius-m)}
.wp-block-quote{border-left:3px solid var(--bw-accent);padding-left:20px;
  font-size:1.08rem;font-style:normal;color:var(--bw-muted)}
.wp-block-table table{width:100%;border-collapse:collapse;font-size:.95rem}
.wp-block-table :is(td,th){border:1px solid var(--bw-line);padding:11px 14px;text-align:left}
.wp-block-table th{background:var(--bw-primary-050);font-weight:680}

/* =========================================================================
 * Dukungan section bawaan BW Site Builder.
 *
 * BW Site Builder tidak membawa CSS front-end — seluruh gaya ke-12 section
 * bawaannya diharapkan disediakan oleh tema. Tanpa blok ini, halaman yang
 * memakai section bawaan tampil tanpa tata letak sama sekali.
 * ====================================================================== */

.bw-sec{padding-block:var(--bw-sec-y)}
.bw-container{width:min(100% - 2*clamp(18px,4vw,40px),var(--bw-container));margin-inline:auto}

.bw-title{margin:0;color:var(--bw-ink);font-size:var(--bw-h2);
  line-height:1.3;font-weight:720;text-wrap:balance}
.bw-eyebrow{font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--bw-accent);font-weight:700;margin-bottom:12px}
.bw-lead{color:var(--bw-muted);margin:14px 0 0}
.bw-measure{max-width:62ch}

/* Hero halaman dalam */
.bw-hero .bw-row{display:grid;gap:clamp(24px,3vw,44px);
  grid-template-columns:minmax(0,1fr)}
.bw-hero .bw-title{font-size:var(--bw-h1)}
.bw-hero.bw-sec{padding-block:clamp(44px,5vw,78px)}

/* Baris dua kolom dipakai hero, about_split dan feature */
.bw-row{min-width:0}
.bw-container.bw-row{display:grid;gap:clamp(28px,4vw,52px);
  grid-template-columns:1.05fr .95fr;align-items:center}
.bw-split__body{min-width:0}
.bw-split__media img{width:100%;height:auto;border-radius:var(--bw-radius-m)}

/* Kartu bernomor */
.bw-grid{display:grid;gap:var(--bw-gap-card);
  grid-template-columns:repeat(auto-fit,minmax(285px,1fr));
  margin-top:clamp(28px,3vw,40px)}
.bw-grid.cols-2{grid-template-columns:repeat(auto-fit,minmax(360px,1fr))}
.bw-card{background:var(--bw-card);border:1px solid var(--bw-line);
  border-radius:var(--bw-radius-m);padding:30px}
.bw-card__num{display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;
  background:var(--bw-accent);color:var(--bw-on-accent);
  font-weight:800;font-size:15px;margin-bottom:18px}
.bw-card__title{margin:0;font-size:19px;line-height:1.32;font-weight:700;color:var(--bw-ink)}
.bw-card__text{margin:10px 0 0;color:var(--bw-muted);font-size:.94rem;line-height:1.75}
.bw-card__text--empty{opacity:.55;font-style:italic}

/* Kartu kecil di about_split */
.bw-pills{display:grid;gap:14px;margin:22px 0 0;padding:0;list-style:none}
.bw-pill{background:var(--bw-surface);border:1px solid var(--bw-line);
  border-radius:var(--bw-radius-s);padding:14px 18px}
.bw-pill__t{font-weight:700;color:var(--bw-ink)}
.bw-pill__d{color:var(--bw-muted);font-size:.93rem}

/* Ajakan bertindak */
.bw-cta{position:relative;overflow:hidden;text-align:center;
  padding-block:clamp(62px,7vw,92px);
  background:var(--bw-ink);color:var(--bw-on-ink)}
.bw-cta__bg{position:absolute;inset:0;opacity:.28}
.bw-cta__bg img{width:100%;height:100%;object-fit:cover;display:block}
.bw-cta__body{position:relative}
.bw-cta .bw-title{color:var(--bw-on-ink)}
.bw-cta .bw-lead{color:rgba(255,255,255,.88);max-width:60ch;margin-inline:auto}
.bw-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:26px}
.bw-btn--gold{background:var(--bw-accent);color:var(--bw-on-accent)}
.bw-btn--gold:hover{background:var(--bw-accent-btn-900)}
.bw-btn--onDark{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.bw-btn--onDark:hover{background:rgba(255,255,255,.12)}

/* Pita angka */
.bw-ribbon{display:grid;gap:var(--bw-gap-card);
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  background:var(--bw-primary-050);border-radius:var(--bw-radius-m);
  padding:clamp(24px,3vw,34px)}
.bw-ribbon__item{text-align:center}
.bw-ribbon__v{display:block;font-size:clamp(26px,1.4rem+1.2vw,36px);
  font-weight:800;color:var(--bw-ink);line-height:1.1}
.bw-ribbon__k{color:var(--bw-muted);font-size:.9rem;margin-top:6px;display:block}

/* Langkah */
.bw-steps{display:grid;gap:var(--bw-gap-card);
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  margin-top:clamp(28px,3vw,40px);counter-reset:bwstep}

/* Fitur */
.bw-feature{display:grid;gap:clamp(28px,4vw,52px);
  grid-template-columns:1fr 1fr;align-items:center}
.bw-feature__media img{width:100%;height:auto;border-radius:var(--bw-radius-m)}
.bw-feature__body{min-width:0}

/* Tanya jawab */
.bw-faq{display:grid;gap:12px;margin-top:clamp(26px,3vw,36px)}
.bw-faq__item{background:var(--bw-card);border:1px solid var(--bw-line);
  border-radius:var(--bw-radius-m);padding:20px 24px}
.bw-faq__q{margin:0;font-size:1.02rem;font-weight:700;color:var(--bw-ink)}
.bw-faq__a{margin:10px 0 0;color:var(--bw-muted)}

/* Peta & formulir */
.bw-map{border-radius:var(--bw-radius-m);overflow:hidden;margin-top:26px}
.bw-map iframe{display:block;width:100%;border:0;min-height:380px}
.bw-map__ph{background:var(--bw-primary-050);min-height:300px;
  display:grid;place-items:center;color:var(--bw-muted);text-align:center;padding:24px}
.bw-form__grid{display:grid;gap:16px;grid-template-columns:1fr 1fr;margin-top:22px}
.bw-form__grid :is(input,textarea,select){width:100%;padding:13px 16px;
  border:1px solid var(--bw-line);border-radius:var(--bw-radius-s);
  background:var(--bw-card);color:var(--bw-ink);font:inherit}
.bw-form__note{color:var(--bw-faint);font-size:.85rem;margin-top:10px}
.bw-form__msg{margin-top:12px;font-size:.93rem}

/* Kolase hero beranda */
.bw-collage{display:grid;gap:14px;grid-template-columns:1fr 1fr}
.bw-collage img{width:100%;height:100%;object-fit:cover;border-radius:var(--bw-radius-m)}

.bw-aside__box{background:var(--bw-surface);border:1px solid var(--bw-line);
  border-radius:var(--bw-radius-m);padding:24px}

.bw-panel{background:var(--bw-card)}

@media (max-width:860px){
  .bw-container.bw-row,.bw-feature,.bw-form__grid{grid-template-columns:1fr}
}