/* Palet biru #2564EA dan kuning logo Harmani Bike. */
:root{
  --blue:#2564ea;
  --blue-dark:#1f55c9;
  --blue-logo:#2564ea;
  --navy:#2564ea;
  --yellow:#ffc400;
  --yellow-bright:#ffda2e;
  --yellow-soft:#fff2a5;
  --yellow-ink:#685000;
  --mist:#f4f8ff;
  --line:#d7e5ff;
  --shadow:0 18px 42px rgba(37,100,234,.12);
  --shadow-deep:0 24px 56px rgba(37,100,234,.22);
}

.site-header{border-top:3px solid var(--yellow)}
.site-nav a:hover{color:var(--blue-logo)}
.site-nav a:after{background:var(--yellow)}
.button{border-color:var(--blue-logo);background:var(--blue-logo);box-shadow:0 10px 24px rgba(37,100,234,.23)}
.button:hover{background:var(--blue-dark);box-shadow:0 16px 30px rgba(37,100,234,.30)}
.header-book{border-color:var(--yellow);background:var(--yellow);color:#17335f;box-shadow:0 10px 22px rgba(255,196,0,.30)}
.header-book:hover{background:var(--yellow-bright);box-shadow:0 15px 28px rgba(255,196,0,.38)}
.button.ghost{border-color:#cde0ff;color:var(--blue-logo)}

.hero{background:radial-gradient(circle at 10% 11%,rgba(255,241,156,.58),transparent 19rem),radial-gradient(circle at 86% 68%,rgba(202,224,255,.76),transparent 22rem),linear-gradient(180deg,#fff 0%,#f8fbff 100%)}
.hero:after{background:rgba(255,208,35,.17)}
.e-bike-chip{background:var(--yellow-soft);color:var(--yellow-ink);box-shadow:inset 0 0 0 1px rgba(255,196,0,.28)}
.eyebrow{color:var(--blue-logo)}
.hero-card{border-color:var(--navy);background:linear-gradient(145deg,#3f7cf0,#2564ea);box-shadow:0 0 0 4px rgba(255,196,0,.70),var(--shadow-deep)}
.hero-photo:before{background:linear-gradient(0deg,rgba(37,100,234,.88),rgba(37,100,234,.04) 60%)}
.hero-card div{background:rgba(37,100,234,.92)}
.hero-card small{color:#e1ecff}
.hero-stats b{color:var(--blue-logo)}
.hero-stats span:nth-child(2) b{color:#8a6900}

.section.mist{background:linear-gradient(180deg,#fffdf5 0%,#f0f6ff 100%)}
.card:hover{border-color:#a9ccff;box-shadow:0 18px 42px rgba(37,100,234,.14)}
.service-card:before{background:rgba(255,196,0,.25)}
.service-card .price{color:var(--blue-logo)}
.grid.services .service-card:nth-child(2),.grid.services .service-card:nth-child(5){border-color:var(--blue-logo);background:linear-gradient(145deg,#3f7cf0,#2564ea);box-shadow:inset 0 4px 0 var(--yellow),0 18px 36px rgba(37,100,234,.22)}
.grid.services .service-card:nth-child(2) .price,.grid.services .service-card:nth-child(5) .price{color:var(--yellow-soft)}
.step-number,.service-index{color:#dbeaff}

.gallery-tile{border-color:rgba(255,196,0,.38)}
.gallery-tile:after{background:linear-gradient(0deg,rgba(37,100,234,.90),rgba(37,100,234,.02) 68%)}
.gallery-tile span{border-color:rgba(255,221,68,.9);background:rgba(37,100,234,.68);color:#fff4b5}
.stars{color:var(--yellow)}
.gallery-filters button,.testimonial-controls button{color:var(--blue-logo)}
.gallery-filters button:hover,.testimonial-controls button:hover,.gallery-filters .active{border-color:var(--yellow);background:var(--yellow);color:#17335f}
.why{background:linear-gradient(135deg,#2564ea,#1f55c9)}
.why:before{border-color:rgba(255,221,68,.42)}
.why .eyebrow{color:var(--yellow-soft)}

.booking-note{border:1px solid rgba(255,196,0,.56);background:linear-gradient(145deg,#3f7cf0,#2564ea);box-shadow:inset 0 4px 0 var(--yellow),var(--shadow-deep)}
.hb-form input:focus,.hb-form select:focus,.hb-form textarea:focus{border-color:var(--blue-logo);box-shadow:0 0 0 4px rgba(37,100,234,.14)}
.hb-form button{border-color:var(--yellow);background:var(--yellow);color:#17335f;box-shadow:0 10px 24px rgba(255,196,0,.28)}
.hb-form button:hover{background:var(--yellow-bright);box-shadow:0 16px 30px rgba(255,196,0,.35)}
.notice{border:1px solid rgba(255,196,0,.50);background:#fff8cf;color:#725700}
.site-footer{border-top:5px solid var(--yellow);background:linear-gradient(135deg,#2564ea,#1f55c9)}
.review-link{color:#ffe58a!important}
.footer-bottom{border-top-color:rgba(255,221,68,.30)}
.float-wa{border-color:rgba(255,221,68,.82);background:var(--blue-logo);box-shadow:0 16px 34px rgba(37,100,234,.35)}
.float-wa:hover{background:var(--blue-dark)}

@media(max-width:680px){.site-header{border-top-width:2px}.hero-card{box-shadow:0 0 0 3px rgba(255,196,0,.70),var(--shadow-deep)}}
