/* Start Project Mabur (/start-project). Hanya dimuat oleh page-start-project.php. */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{display:block;max-width:100%}
h1,h2,h3{margin:0;line-height:1.12;text-wrap:balance}
p{margin:0}
.i{width:20px;height:20px;flex:none}
.wrap{max-width:1160px;margin:0 auto;padding-inline:24px}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}

/* isi: kartu form menimpa tepi bawah hero + kolom samping */
.spb .wrap{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start;padding-block:0 96px}
.card{margin-top:-72px;border-radius:20px;background:#fff;box-shadow:0 30px 60px -40px rgba(0,0,0,.45),0 0 0 1px var(--line)}
.fm{margin:0}
.sec{margin:0;padding:34px 40px 36px;border:0;border-bottom:1px solid var(--line)}
.sec h2{position:relative;padding-bottom:12px;font-size:24px;font-weight:800;letter-spacing:-.01em;color:var(--head)}
.sec h2::after{content:"";position:absolute;left:0;bottom:0;width:44px;height:4px;border-radius:2px;background:var(--acc2)}
.sec .hn{margin-top:12px;font-size:15.5px;color:var(--muted)}
.fld{display:block;margin-top:20px}
.fld>span{display:block;margin-bottom:7px;font-size:15px;font-weight:700}
.fld>span em{font-style:normal;font-weight:500;color:var(--muted)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
input[type=text],input[type=email],input[type=tel],input[type=url],textarea{display:block;width:100%;min-height:50px;padding:12px 15px;border:1.5px solid var(--field);border-radius:12px;background:var(--fbg);color:var(--ink);font:inherit;font-size:16px;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}
textarea{min-height:112px;resize:vertical}
input:hover,textarea:hover{border-color:var(--field-h)}
input:focus,textarea:focus{outline:none;border-color:var(--acc);background:#fff;box-shadow:0 0 0 4px var(--ring)}
::placeholder{color:#98A2AA}
/* tujuan: ubin berikon */
.gt{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:4px}
.gt label{position:relative;display:flex;flex-direction:column;gap:10px;padding:16px;border:1.5px solid var(--field);border-radius:14px;background:#fff;cursor:pointer;transition:border-color .2s ease,background-color .2s ease,transform .2s ease,box-shadow .2s ease}
.gt label:hover{border-color:var(--acc);transform:translateY(-2px);box-shadow:0 14px 24px -20px rgba(0,0,0,.5)}
.gt input{position:absolute;opacity:0;pointer-events:none}
.gt .gi{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:var(--tint);color:var(--acc);transition:background-color .2s ease,color .2s ease}
.gt b{font-size:15.5px;font-weight:800;line-height:1.25;color:var(--head)}
.gt small{font-size:13.5px;line-height:1.4;color:var(--muted)}
.gt .ck{position:absolute;right:12px;top:12px;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--field);background:#fff;transition:all .2s ease}
.gt label:has(input:checked){border-color:var(--acc);background:var(--acc);box-shadow:0 18px 30px -22px var(--acc)}
.gt label:has(input:checked) b{color:#fff}
.gt label:has(input:checked) small{color:var(--on-acc-muted)}
.gt label:has(input:checked) .gi{background:rgba(255,255,255,.14);color:var(--acc2)}
.gt label:has(input:checked) .ck{border-color:var(--acc2);background:var(--acc2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") 50%/13px no-repeat}
.gt label:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
/* anggaran & waktu: dropdown khusus */
.dd{position:relative}
.ddb{display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:8px 14px 8px 8px;border:1.5px solid var(--field);border-radius:14px;background:#fff;color:var(--ink);font:inherit;font-size:16px;text-align:left;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease}
.ddb:hover{border-color:var(--field-h)}
.ddb[aria-expanded=true],.ddb:focus-visible{outline:none;border-color:var(--acc);box-shadow:0 0 0 4px var(--ring)}
.ddi{width:40px;height:40px;border-radius:10px;flex:none;display:flex;align-items:center;justify-content:center;background:var(--tint);color:var(--acc);transition:background-color .2s ease,color .2s ease}
.ddv{flex:1;min-width:0;color:#98A2AA}
.dd.set .ddv{color:var(--head);font-weight:700}
.dd.set .ddi{background:var(--acc);color:var(--acc2)}
.ddb>.i:last-child{width:18px;height:18px;color:var(--muted);transition:transform .2s ease}
.ddb[aria-expanded=true]>.i:last-child{transform:rotate(180deg)}
.ddl{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:20;margin:0;padding:6px;list-style:none;border-radius:14px;background:#fff;box-shadow:0 22px 44px -18px rgba(0,0,0,.35),0 0 0 1px var(--line);animation:ddin .16s ease-out}
.ddl:focus{outline:none}
.ddl li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;border-radius:10px;font-size:15.5px;font-weight:600;color:var(--head);cursor:pointer}
.ddl li .i{width:17px;height:17px;color:var(--acc2);opacity:0}
.ddl li.act{background:var(--tint)}
.ddl li[aria-selected=true]{background:var(--acc);color:#fff}
.ddl li[aria-selected=true] .i{opacity:1}
@keyframes ddin{from{opacity:0;transform:translateY(-4px)}}
.bad .ddb{border-color:#E3A29D}
.err{display:none;margin-top:7px;font-size:13.5px;font-weight:700;color:#B3261E}
.bad .err{display:block}
.bad input:not([type=radio]):not([type=hidden]),.bad textarea,.bad .gt label{border-color:#E3A29D}
/* kaki form */
.send{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;padding:26px 40px;border-radius:0 0 20px 20px;background:var(--foot-bg);color:var(--foot-ink)}
.send p{display:flex;align-items:center;gap:10px;font-size:14.5px}
.send p .i{color:var(--acc2)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 30px;border:0;border-radius:12px;background:var(--btn);color:var(--btn-ink);font:800 16.5px/1 var(--font);text-decoration:none;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 28px -14px var(--btn)}
.btn .i{width:19px;height:19px;transition:transform .2s ease}
.btn:hover .i{transform:translateX(3px)}
.done{padding:44px 40px}
.done .ok{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--acc);color:var(--acc2)}
.done .ok .i{width:30px;height:30px}
.done h2{margin-top:20px;font-size:30px;font-weight:800;color:var(--head)}
.done>p{margin-top:8px;color:var(--muted);font-size:17px}
.done dl{display:grid;grid-template-columns:150px minmax(0,1fr);gap:10px 16px;margin:24px 0 0;padding:20px 22px;border-radius:14px;background:var(--tint);font-size:15px}
.done dt{color:var(--muted)}
.done dd{margin:0;font-weight:700}
/* kolom samping */
.side{position:sticky;top:24px;display:grid;gap:16px;margin-top:-72px}
.nx{position:relative;overflow:hidden;padding:26px;border-radius:20px;background:var(--side-bg);color:#fff}
.nx .orn{position:absolute;right:-70px;bottom:-60px;width:260px;opacity:.28;pointer-events:none}
.nx h3{position:relative;font-size:20px;font-weight:800}
.nx ol{position:relative;list-style:none;margin:18px 0 0;padding:0}
.nx li{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr);gap:14px;padding-bottom:20px}
.nx li:last-child{padding-bottom:0}
.nx li::before{content:"";position:absolute;left:16px;top:34px;bottom:2px;width:2px;background:rgba(255,255,255,.18)}
.nx li:last-child::before{display:none}
.nx li span{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--acc2);color:var(--side-bg);font-weight:800}
.nx li b{display:block;font-size:15.5px}
.nx li small{display:block;margin-top:2px;font-size:14px;line-height:1.45;color:var(--side-muted)}
.lnk{padding:8px;border-radius:20px;background:#fff;box-shadow:0 0 0 1px var(--line)}
.lnk a{display:flex;align-items:center;gap:14px;padding:14px;border-radius:14px;text-decoration:none;transition:background-color .2s ease}
.lnk a:hover{background:var(--tint)}
.lnk .li{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:var(--tint);color:var(--acc)}
.lnk b{display:block;font-size:15.5px;color:var(--head)}
.lnk small{display:block;font-size:13.5px;color:var(--muted);line-height:1.4}
.lnk a>.i:last-child{width:17px;height:17px;margin-left:auto;color:var(--muted);transition:transform .2s ease}
.lnk a:hover>.i:last-child{transform:translateX(3px);color:var(--acc)}
.lnk a+a{border-top:1px solid var(--line);border-radius:0 0 14px 14px}
footer{padding:24px 0;font-size:14px}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px}
@media (max-width:1000px){
  .spb .wrap{grid-template-columns:minmax(0,1fr)}
  .side{position:static;margin-top:0;grid-template-columns:1fr 1fr}
  .gt{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .wrap{padding-inline:14px}
  .card{margin-top:-44px;border-radius:18px}
  .sec{padding:26px 18px 28px;text-align:center}
  .sec h2{font-size:21px}
  .sec h2::after{left:50%;margin-left:-22px}
  .fld{text-align:left}
  .two{grid-template-columns:minmax(0,1fr)}
  .gt{gap:8px}
  .gt label{align-items:center;padding:14px 10px;text-align:center}
  .gt small{display:none}
  .gt .ck{right:8px;top:8px;width:18px;height:18px}
  .send{flex-direction:column;align-items:stretch;padding:22px 18px;text-align:center;border-radius:0 0 18px 18px}
  .send p{justify-content:center}
  .send p .i{display:none}
  .btn{width:100%}
  .done{padding:32px 20px;text-align:center}
  .done .ok{margin-inline:auto}
  .done dl{grid-template-columns:minmax(0,1fr);gap:2px;text-align:left}
  .done dd{margin-bottom:8px}
  .side{grid-template-columns:minmax(0,1fr)}
  footer .wrap{flex-direction:column;align-items:center;text-align:center}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* huruf & sudut khas Mabur */
.sec h2,.nx h3,.done h2{font-family:var(--fd);font-weight:600;letter-spacing:-.005em}
.sec h2{font-size:29px}.nx h3{font-size:25px}.done h2{font-size:34px}
.sec h2::after{width:56px;height:3px;border-radius:0;background:repeating-linear-gradient(90deg,var(--acc2) 0 6px,transparent 6px 11px)}
.fld>span,.gt b,.ddv,.lnk b,.nx li b,.btn,.send p,.ddl li{font-family:var(--fx)}
.gt b,.lnk b,.nx li b{font-weight:600}.btn{font-weight:700}
.card{border-radius:24px 24px 64px 24px}.send{border-radius:0 0 64px 24px}
.nx{border-radius:24px 24px 64px 24px}.lnk{border-radius:24px}
.gt label{border-radius:16px}.btn{border-radius:999px}
.nx{padding-bottom:92px}.nx .plane-o{position:absolute;right:34px;bottom:8px;width:150px;opacity:.55;pointer-events:none}
.top{background:#fff;border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:76px}
.top img{height:40px;width:auto;mix-blend-mode:multiply}
.top nav{display:flex;gap:26px;font:500 16px/1 var(--fx)}
.top nav a{padding:12px 0;text-decoration:none}
.top nav a:hover{text-decoration:underline;text-decoration-color:var(--acc2);text-decoration-thickness:2px;text-underline-offset:6px}
.hero{position:relative;overflow:hidden;background:linear-gradient(#fff 0,#fff 30%,var(--bg) 100%)}
.hero .in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center;padding-block:60px 140px}
.hero .eyb{display:inline-flex;align-items:center;gap:10px;font:600 12.5px/1 var(--fx);letter-spacing:.16em;text-transform:uppercase;color:var(--acc)}
.hero .eyb .i{width:18px;height:18px}
.hero h1{margin-top:16px;font:600 clamp(44px,5.4vw,70px)/1.04 var(--fd);letter-spacing:-.015em;color:var(--ink)}
.hero h1 em{font-style:italic;color:var(--acc)}
.hero .ld{margin-top:16px;max-width:30em;font:400 18.5px/1.55 var(--fx);color:var(--muted)}
.hero .fx{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:24px;font:500 15px/1.4 var(--fx);color:var(--head)}
.hero .fx span{display:inline-flex;align-items:center;gap:9px}
.hero .fx span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--acc2)}
/* kabin: jalur pesawat kertas + tiga jendela pesawat berisi liputan */
.cab{position:relative;text-align:center}
.cab .lbl{display:inline-block;font:600 12px/1 var(--fx);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.cab .trail{display:block;width:100%;height:auto;margin-top:6px;color:var(--acc2)}
.wins{display:flex;justify-content:space-between;margin:0 0 30px;padding:0;list-style:none;position:relative}
.wins::before{content:"";position:absolute;left:0;right:0;top:34%;border-top:1px solid #CFE0E3}
.wins li{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;width:17%}
.wins li:nth-child(even){transform:translateY(30px)}
.win{width:100%;margin:0;aspect-ratio:30/38;padding:6px;border-radius:46% / 32%;background:linear-gradient(160deg,#fff,#DCE6E9);box-shadow:0 24px 44px -26px rgba(21,25,28,.55);animation:glow 1.2s ease-out var(--d) both}
.win img{width:100%;height:100%;object-fit:cover;border-radius:44% / 30%}
.wl{display:inline-flex;align-items:center;white-space:nowrap;font:600 11px/1 var(--fx);letter-spacing:.08em;text-transform:uppercase;color:var(--head);background:#fff;border-radius:999px;padding:5px 12px 5px 6px;box-shadow:0 6px 16px -10px rgba(21,25,28,.4)}
.wl b{display:inline-flex;align-items:center;justify-content:center;height:20px;padding:0 5px;margin-right:1px;border-radius:6px;background:var(--acc);color:#fff;font-size:13px;letter-spacing:0}
.wl i{font-style:normal}.wcap{display:none}
@keyframes glow{0%{box-shadow:0 24px 44px -26px rgba(21,25,28,.55),0 0 0 0 rgba(127,182,192,0)}35%{box-shadow:0 24px 44px -26px rgba(21,25,28,.55),0 0 0 6px rgba(127,182,192,.55)}100%{box-shadow:0 24px 44px -26px rgba(21,25,28,.55),0 0 0 0 rgba(127,182,192,0)}}
footer{background:#fff;color:var(--muted);border-top:1px solid var(--line)}
@media (max-width:1000px){.hero .in{grid-template-columns:minmax(0,1fr);gap:28px;padding-bottom:120px}.cab{max-width:520px;margin-inline:auto;width:100%}}
@media (max-width:640px){
  .top .wrap{min-height:64px}.top img{height:32px}.top nav{gap:16px;font-size:15px}.top nav a:first-child{display:none}
  .hero .in{padding-block:34px 84px;text-align:center}.hero .eyb{justify-content:center}
  .hero h1{font-size:clamp(38px,11vw,48px)}.hero .ld{font-size:16px;margin-inline:auto}.hero .fx{justify-content:center;gap:6px 18px;font-size:14px}
  /* ponsel: jendela sejajar, huruf M-A-B-U-R terbaca dalam satu baris, nama rubrik di bawah */
  .cab .trail{margin-top:0}.wins{margin-bottom:0}.wins::before{top:40%}.wins li{gap:8px;width:18%}.wins li:nth-child(even){transform:none}.win{padding:4px}
  .wl{padding:0;background:none;box-shadow:none}.wl i{display:none}.wl b{height:24px;min-width:24px;margin:0;font-size:14px}
  .wcap{display:block;margin-top:12px;font:500 13px/1.5 var(--fx);color:var(--muted)}
  .card{border-radius:20px 20px 48px 20px}.send{border-radius:0 0 48px 20px}.nx{border-radius:20px 20px 48px 20px}
}
/* judul tidak terpengaruh CSS global tema/plugin */
body.start-project h1,body.start-project h2,body.start-project h3{color:inherit}
body.start-project .sec h2,body.start-project .done h2{color:var(--head)}
.ss-hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.notice-err{margin:0 40px;padding:14px 16px;border-left:3px solid #B3261E;border-radius:8px;background:#FCF1F0;font-size:15px}
.notice-err b{display:block}
@media (max-width:640px){.notice-err{margin:0 18px}}
/* hero tanpa label & keterangan; desktop: pesawat terbang melintasi seluruh hero */
.hero .in{padding-block:104px 140px}
.hero h1{margin-top:0}
.hero .fly{position:absolute;left:0;right:0;top:8px;width:100%;height:auto;color:var(--acc2);pointer-events:none}
@media (min-width:1001px){.cab .trail{display:none}}
@media (max-width:1000px){.hero .fly{display:none}.hero .in{padding-top:48px}}
/* ponsel: huruf M-A-B-U-R sejajar, nama rubrik tepat di bawah tiap huruf */
@media (max-width:640px){
  .hero .in{padding-block:36px 84px}
  .wins li{gap:6px}
  .wl{flex-direction:column;align-items:center;gap:5px}
  .wl::after{font:600 10px/1.15 var(--fx);letter-spacing:0;text-transform:none;white-space:nowrap;color:var(--muted)}
  .wins li:nth-child(1) .wl::after{content:"Masyarakat"}
  .wins li:nth-child(2) .wl::after{content:"Arsitektur"}
  .wins li:nth-child(3) .wl::after{content:"Budaya"}
  .wins li:nth-child(4) .wl::after{content:"Usaha"}
  .wins li:nth-child(5) .wl::after{content:"Rekreasi"}
  .cab .wcap{display:none}
}
/* Popup login Foxiz dicetak di wp_footer untuk pengunjung yang belum login; CSS Foxiz dilepas di halaman ini, jadi sembunyikan. */
#rb-user-popup-form{display:none!important}