:root{--bg:#101214;--card:#1f2327;--soft:#171a1d;--text:#f5f5f5;--muted:#a8adb3;--red:#d62828;--amber:#f4a261;--border:rgba(255,255,255,.09)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:400 16px/1.65 Inter,system-ui,sans-serif}body.menu-open{overflow:hidden}h1,h2,h3,h4{font-family:Archivo,system-ui,sans-serif;line-height:1.12;margin:0;text-transform:uppercase}h1{font-size:clamp(2.5rem,6vw,4.6rem);max-width:900px}h2{font-size:clamp(2rem,4vw,3.25rem)}h3{font-size:1.15rem}p{color:var(--muted)}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}svg{width:1.1em;height:1.1em;stroke-width:2}.container{width:min(1200px,calc(100% - 2rem));margin:auto}.narrow{max-width:820px}section{padding:6rem 0}.alt{background:rgba(23,26,29,.7);border-block:1px solid var(--border)}#header{position:fixed;inset:0 0 auto;z-index:30;transition:.25s}#header.scrolled{background:rgba(16,18,20,.94);border-bottom:1px solid var(--border);backdrop-filter:blur(12px)}.nav{height:66px;display:flex;align-items:center;gap:1.5rem}.brand{display:flex;align-items:center;gap:.7rem;margin-right:auto}.brand>b{display:grid;place-items:center;width:38px;height:38px;border-radius:7px;background:var(--red);font-family:Archivo}.brand span{display:flex;flex-direction:column;line-height:1.25}.brand small{font-size:.65rem;color:var(--muted)}nav{display:flex;gap:.3rem}nav a{padding:.5rem .7rem;color:var(--muted);font-size:.88rem}nav a:hover{color:white}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:46px;padding:.65rem 1.2rem;border:1px solid var(--red);border-radius:7px;background:var(--red);color:white;font-weight:700;cursor:pointer}.btn:hover{filter:brightness(1.13)}.btn.ghost{background:rgba(31,35,39,.72);border-color:var(--border)}.menu-button{display:none;border:1px solid var(--border);background:var(--card);color:white;padding:.6rem;border-radius:7px}.hero{min-height:780px;padding-top:10rem;position:relative;background:url('assets/hero-workshop.jpg') center/cover}.hero-shade{position:absolute;inset:0;background:linear-gradient(rgba(16,18,20,.88),rgba(16,18,20,.7) 60%,var(--bg))}.hero-content{position:relative}.hero-content>p{font-size:1.1rem;max-width:690px}.hero h1 em,.final-cta em{font-style:normal;color:#ff4747}.pills,.actions{display:flex;flex-wrap:wrap;gap:.7rem}.pills{margin-bottom:1.5rem}.pill{border:1px solid var(--border);border-radius:99px;padding:.35rem .8rem;font-size:.75rem;background:rgba(31,35,39,.7)}.pill b{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--amber);margin-right:.35rem}.pill.open b{background:#34d399}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;max-width:720px;margin-top:3rem}.stats div,.problem-grid>div,.adv-grid article,.flow li,figure,.rating,.location,form,.hours,.faq details{border:1px solid var(--border);background:rgba(31,35,39,.82);border-radius:11px}.stats div{padding:1rem}.stats b,.stats small{display:block}.stats b{font:900 1.5rem Archivo}.stats small{color:var(--muted)}.heading{max-width:790px;margin-bottom:2.5rem}.heading.center{text-align:center;margin-inline:auto}.heading>span{color:#ff4949;font-size:.75rem;font-weight:700;letter-spacing:.18em}.heading>p{font-size:1.05rem}.problem-grid,.adv-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}.problem-grid>div{display:flex;align-items:flex-start;gap:.7rem;padding:1rem;font-size:.9rem}.problem-grid svg,.check-grid svg,.card-body li svg{color:var(--red);flex:none}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}.service-card{overflow:hidden;border:1px solid var(--border);border-radius:13px;background:var(--card);transition:.3s}.service-card:hover{transform:translateY(-5px);border-color:rgba(214,40,40,.5)}.service-image{height:230px;position:relative}.service-image img{width:100%;height:100%;object-fit:cover}.icon-badge{position:absolute;top:12px;left:12px;display:grid;place-items:center;width:42px;height:42px;border-radius:7px;background:var(--red)}.card-body{padding:1.35rem}.card-body ul{list-style:none;padding:0}.card-body li{display:flex;gap:.5rem;align-items:center;font-size:.85rem;margin:.4rem 0}.card-body .btn{width:100%;margin-top:.5rem}.split{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}.feature-image{width:100%;aspect-ratio:5/4;object-fit:cover;border-radius:13px}.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}.check-grid div{padding:.85rem;border:1px solid var(--border);border-radius:8px;display:flex;gap:.5rem}.steps{list-style:none;padding:0}.steps li{display:flex;align-items:center;gap:1rem;margin:.6rem 0;padding:.8rem;background:var(--card);border:1px solid var(--border);border-radius:8px}.steps b{display:grid;place-items:center;width:34px;height:34px;color:#ff4949;background:rgba(214,40,40,.12);border-radius:6px}.adv-grid article{padding:1.4rem}.adv-grid article>svg,.flow li>svg{width:28px;height:28px;color:#ff4949}.adv-grid h3{margin-top:1rem}.flow{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.flow li{padding:1.5rem;position:relative}.flow li>b{position:absolute;right:1rem;top:-.7rem;padding:.1rem .5rem;background:var(--red);border-radius:5px}.flow h3{margin-top:1rem}.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}.gallery button{position:relative;aspect-ratio:1;border:1px solid var(--border);border-radius:9px;padding:0;overflow:hidden;background:none;cursor:pointer}.gallery img{width:100%;height:100%;object-fit:cover;transition:.3s}.gallery button:hover img{transform:scale(1.05)}.gallery span{position:absolute;inset:auto 0 0;padding:1.5rem .7rem .5rem;color:white;text-align:left;background:linear-gradient(transparent,rgba(0,0,0,.85))}.reviews{display:grid;grid-template-columns:1fr 1.5fr;gap:3rem}.reviews figure{padding:1.4rem;margin:0 0 1rem}.reviews figure>span,.rating span{color:var(--amber)}.reviews blockquote{margin:1rem 0}.rating{display:flex;align-items:center;gap:1rem;padding:1.4rem}.rating>b{font:900 3.2rem Archivo}.rating small{display:block;color:var(--muted)}form{padding:2rem}label{display:block;font-size:.86rem;font-weight:600;margin-bottom:1rem}input,select,textarea{display:block;width:100%;margin-top:.35rem;padding:.75rem;border:1px solid var(--border);border-radius:6px;background:var(--soft);color:white;font:inherit}textarea{resize:vertical}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}.wide{width:100%}.error{display:block;color:#ff5d5d}.faq details{padding:0 1.2rem;margin:.7rem 0}.faq summary{display:flex;justify-content:space-between;align-items:center;padding:1.1rem 0;cursor:pointer;font-weight:700}.faq details[open] summary svg{transform:rotate(180deg)}.location{padding:1.5rem;margin-bottom:1rem}iframe{border:1px solid var(--border);border-radius:11px;width:100%;height:300px}.hours{list-style:none;padding:0;overflow:hidden}.hours li{display:flex;justify-content:space-between;padding:1rem 1.3rem;border-bottom:1px solid var(--border)}.hours li.today{background:rgba(214,40,40,.13);color:#ff5555}.final-cta{text-align:center;background:radial-gradient(circle at 20%,rgba(214,40,40,.25),transparent 50%)}.final-cta p{font-size:1.1rem}.final-cta .btn{margin-top:1rem}footer{padding:4rem 0 6rem}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:3rem}.footer-grid a{display:block;color:var(--muted)}.copyright{border-top:1px solid var(--border);margin-top:3rem;padding-top:1.5rem;color:var(--muted);font-size:.8rem}.floating{position:fixed;right:1.5rem;bottom:1.5rem;z-index:20;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--red);box-shadow:0 10px 30px rgba(214,40,40,.4)}#lightbox{display:none;position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.92);place-items:center;padding:2rem}#lightbox.open{display:grid}#lightbox img{max-height:85vh;border-radius:8px}#lightbox button{position:absolute;right:2rem;top:1rem;border:0;background:none;color:white;font-size:3rem;cursor:pointer}
@media(max-width:900px){nav{display:none}.nav-wa{display:none}.menu-button{display:block}nav.open{display:flex;position:fixed;inset:66px 0 0;background:rgba(16,18,20,.98);flex-direction:column;padding:1.5rem}nav.open a{font-size:1.1rem;padding:1rem}.service-grid{grid-template-columns:repeat(2,1fr)}.problem-grid,.adv-grid{grid-template-columns:repeat(2,1fr)}.split,.reviews{grid-template-columns:1fr;gap:2rem}.flow{grid-template-columns:1fr 1fr}.gallery{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){section{padding:4rem 0}.hero{min-height:auto;padding-top:8rem}.stats{grid-template-columns:1fr 1fr}.service-grid,.problem-grid,.adv-grid,.flow,.check-grid,.form-grid{grid-template-columns:1fr}.gallery{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr}.actions .btn{width:100%}.floating{width:50px;height:50px}.hours li{font-size:.85rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* CTA khusus menu mobile; header tetap solid ketika menu sedang terbuka. */
.mobile-menu-cta{display:none}
#header.menu-active{background:rgba(16,18,20,.98);border-bottom:1px solid var(--border);backdrop-filter:blur(12px)}
@media(max-width:900px){
  nav.open{overflow-y:auto;padding-bottom:calc(1.5rem + env(safe-area-inset-bottom))}
  nav.open .mobile-menu-cta{display:inline-flex;margin-top:1rem;padding:.85rem 1rem;color:#fff;font-size:1rem}
  nav.open .mobile-menu-cta:hover{color:#fff}
}

/* Sticky navigation and dependency-free hamburger control. */
#header{position:sticky;top:0;background:rgba(16,18,20,.92);border-bottom:1px solid var(--border);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
#header.scrolled{box-shadow:0 8px 28px rgba(0,0,0,.28)}
.menu-button{position:relative;width:42px;height:42px;align-items:center;justify-content:center;cursor:pointer;z-index:2}
.hamburger-lines{display:flex;width:20px;height:16px;flex-direction:column;justify-content:space-between}
.hamburger-lines b{display:block;width:100%;height:2px;border-radius:2px;background:currentColor;transition:transform .2s ease,opacity .2s ease}
.menu-button[aria-expanded="true"] .hamburger-lines b:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-button[aria-expanded="true"] .hamburger-lines b:nth-child(2){opacity:0}
.menu-button[aria-expanded="true"] .hamburger-lines b:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:900px){
  .menu-button{display:flex}
  #mainNav.open{z-index:40;top:66px;height:calc(100dvh - 66px);inset-inline:0;bottom:auto}
}

/* Sticky quick-action bar from the original mobile landing page. */
.mobile-bottom-menu{display:none}
@media(max-width:767px){
  body{padding-bottom:70px}
  .floating{display:none}
  .mobile-bottom-menu{position:fixed;z-index:35;inset:auto 0 0;display:grid;grid-template-columns:repeat(3,1fr);padding-bottom:env(safe-area-inset-bottom);background:rgba(16,18,20,.97);border-top:1px solid var(--border);box-shadow:0 -8px 24px rgba(0,0,0,.3);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
  .mobile-bottom-menu a{display:flex;min-height:64px;align-items:center;justify-content:center;flex-direction:column;gap:3px;color:var(--text);font-size:.72rem;font-weight:600}
  .mobile-bottom-menu a+a{border-left:1px solid var(--border)}
  .mobile-bottom-menu svg{width:21px;height:21px;color:#ff4949}
  .mobile-bottom-menu a:active{background:rgba(255,255,255,.06)}
}

/* Cahaya Per brand artwork. */
.brand>img{width:48px;height:48px;flex:none;object-fit:contain;border-radius:50%;filter:drop-shadow(0 3px 8px rgba(0,0,0,.32))}
footer .brand>img{width:58px;height:58px}
@media(max-width:600px){.brand>img{width:44px;height:44px}.brand small{font-size:.58rem}}