/* AgenPembantu.com - stylesheet situs publik (satu file, tanpa build step). */

/* ------------------------------------------------------------ fonts */
@font-face{font-family:'Nunito Sans';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/NunitoSans-400.woff2) format('woff2')}
@font-face{font-family:'Nunito Sans';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/NunitoSans-600.woff2) format('woff2')}
@font-face{font-family:'Nunito Sans';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/NunitoSans-700.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/Poppins-500.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/Poppins-600.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/Poppins-700.woff2) format('woff2')}

/* ------------------------------------------------------------ tokens */
:root{
  --cream:#FBF3E3;
  --cream-deep:#F3E5C8;
  --paper:#FFFCF6;
  --white:#FFFFFF;
  --green:#2F4A38;
  --green-deep:#243A2C;
  --green-mid:#4A6B52;
  --green-pale:#E4ECE3;
  --orange:#A8521C;          /* teks/tombol: kontras 5,4:1 dengan putih */
  --orange-hover:#8F4415;
  --orange-brand:#C96A2E;    /* dekoratif saja */
  --orange-light:#F0B27E;
  --orange-pale:#FBE9DA;
  --sage:#8FAE79;
  --sage-pale:#EAF1E4;
  --text:#3B3B3B;
  --muted:#66625A;
  --border:#E7DCC2;
  --border-soft:#EFE6D3;
  --on-dark:#FBF3E3;
  --on-dark-muted:#C9D6C8;

  --font-head:'Poppins',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:'Nunito Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;

  --r-sm:10px;
  --r:16px;
  --r-lg:24px;
  --shadow-sm:0 1px 2px rgba(47,74,56,.06),0 2px 8px rgba(47,74,56,.05);
  --shadow:0 2px 6px rgba(47,74,56,.06),0 12px 28px rgba(47,74,56,.08);
  --shadow-lg:0 6px 16px rgba(47,74,56,.08),0 22px 48px rgba(47,74,56,.12);
  --ease:cubic-bezier(.2,.7,.2,1);
  /* Bahasa gerak (satu sistem): masuk = expo-out, hover = cubic-out. */
  --m-out:cubic-bezier(.16,1,.3,1);
  --m-soft:cubic-bezier(.33,1,.68,1);
  --m-wipe:cubic-bezier(.62,.04,.22,1); /* sapuan foto: in-out panjang, terasa "membuka" */
  --m-t1:.2s;   /* mikro: warna, tekan */
  --m-t2:.45s;  /* hover: angkat kartu, ikon */
  --m-t3:.8s;   /* reveal teks/kartu */
  --m-t4:1.2s;  /* reveal foto */
  --m-step:70ms;/* jeda antar item satu kelompok */
  --m-rise:18px;
  --m-lift:-4px;
  --m-tx-hover:transform var(--m-t2) var(--m-soft),box-shadow var(--m-t2) var(--m-soft),border-color var(--m-t2) var(--m-soft),background-color var(--m-t1) var(--m-soft);
  --header-h:72px;
  --gutter:24px;
  --section-y:clamp(56px,8vw,104px);
}
@media (max-width:599px){:root{--gutter:16px;--header-h:64px}}

/* Mandarin (zh-Hans): Poppins/Nunito Sans tidak punya glyph CJK -> font sistem
   CJK dipasang setelah font Latin (tanpa web font CJK). */
:root{--font-cjk:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Noto Sans SC","Source Han Sans SC"}
html[lang="zh-Hans"]{
  --font-head:'Poppins',var(--font-cjk),ui-sans-serif,system-ui,sans-serif;
  --font-body:'Nunito Sans',var(--font-cjk),ui-sans-serif,system-ui,sans-serif;
}

/* ------------------------------------------------------------ base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--header-h) + 16px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--paper);color:var(--text);font-family:var(--font-body);font-size:1.0625rem;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
@media (max-width:599px){body{font-size:1rem}}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:var(--green);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--orange)}
h1,h2,h3,h4{font-family:var(--font-head);color:var(--green);line-height:1.25;margin:0 0 .5em;font-weight:600;letter-spacing:-.01em}
h1{font-weight:700}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:4px}
main:focus{outline:none}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:16px;top:-80px;z-index:200;background:var(--green);color:#fff;padding:12px 18px;border-radius:var(--r-sm);font-weight:700;text-decoration:none;transition:top .2s var(--ease)}
.skip-link:focus{top:12px;color:#fff}
.anchor{display:block;height:0;overflow:hidden}

.container{width:100%;max-width:1248px;margin:0 auto;padding:0 var(--gutter)}
.container--narrow{max-width:820px}
.container--article-media{max-width:1008px}

.icon{width:24px;height:24px;flex:none}
.icon--xs{width:14px;height:14px}
.icon--sm{width:18px;height:18px}
.icon--lg{width:32px;height:32px}

/* ------------------------------------------------------------ buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border-radius:999px;border:1.5px solid transparent;font-family:var(--font-head);font-weight:600;font-size:.98rem;line-height:1.2;text-decoration:none;cursor:pointer;text-align:center;transition:background-color .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease),box-shadow .2s var(--ease),transform .15s var(--ease)}
.btn:active{transform:translateY(1px) scale(.98)}
.btn--primary{background:var(--orange);color:#fff;box-shadow:0 6px 16px rgba(168,82,28,.22)}
.btn--primary:hover{background:var(--orange-hover);color:#fff}
.btn--secondary{background:transparent;color:var(--green);border-color:rgba(47,74,56,.35)}
.btn--secondary:hover{background:var(--green);color:#fff;border-color:var(--green)}
.btn--light{background:#fff;color:var(--green)}
.btn--light:hover{background:var(--cream);color:var(--green)}
.btn--ghost-light{background:transparent;color:#fff;border-color:rgba(251,243,227,.55)}
.btn--ghost-light:hover{background:rgba(251,243,227,.12);color:#fff;border-color:#fff}
.btn--wa{background:#1F7A3F;color:#fff}
.btn--wa:hover{background:#17602F;color:#fff}
.btn--text{background:none;color:var(--green);padding-left:8px;padding-right:8px}
.btn--text:hover{color:var(--orange)}
.btn--sm{min-height:42px;padding:9px 18px;font-size:.92rem}
.btn--lg{min-height:54px;padding:14px 26px;font-size:1.02rem}
.btn--block{display:flex;width:100%}
.btn[disabled],.btn.is-loading{opacity:.7;cursor:progress}

.link-more{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-head);font-weight:600;font-size:.95rem;color:var(--orange);text-decoration:none}
.link-more .icon{transition:transform .25s var(--ease)}
a.link-more:hover .icon{transform:translateX(3px)}

.eyebrow{display:inline-block;margin:0 0 12px;font-family:var(--font-head);font-weight:600;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--orange)}
.eyebrow a{color:inherit;text-decoration:none}
.eyebrow--light{color:var(--orange-light)}
.eyebrow--sm{font-size:.74rem;margin-bottom:8px}

/* ------------------------------------------------------------ header */
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,252,246,.94);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid transparent;transition:box-shadow .3s var(--ease),border-color .3s var(--ease)}
.site-header.is-scrolled{box-shadow:0 6px 24px rgba(47,74,56,.08);border-bottom-color:var(--border-soft)}
.site-header__inner{display:flex;align-items:center;gap:24px;min-height:var(--header-h)}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--green);flex:none}
.brand:hover{color:var(--green)}
.brand__mark{width:44px;height:40px}
.brand__name{font-family:var(--font-head);font-weight:700;font-size:1.22rem;letter-spacing:-.01em}
.brand__name span{color:var(--orange)}
.brand--light{color:#fff}
.brand--light:hover{color:#fff}
.brand--light .brand__name span{color:var(--orange-light)}
.brand--light .brand__mark{background:var(--cream);border-radius:12px;padding:4px;width:48px;height:44px}

.site-nav{display:flex;align-items:center;gap:14px;margin-left:auto}
.site-nav__list{display:flex;align-items:center;gap:2px;list-style:none}
.site-nav__list a{display:block;padding:10px 11px;border-radius:999px;font-family:var(--font-head);font-weight:500;font-size:.94rem;color:var(--text);text-decoration:none;transition:color .2s var(--ease),background-color .2s var(--ease)}
.site-nav__list a:hover{color:var(--green);background:var(--green-pale)}
.site-nav__list a[aria-current="page"]{color:var(--green);background:var(--green-pale);font-weight:600}
.nav-toggle{display:none;margin-left:auto;width:48px;height:48px;border-radius:12px;border:1px solid var(--border);background:#fff;color:var(--green);align-items:center;justify-content:center;cursor:pointer}
.nav-toggle__close{display:none}
.nav-toggle[aria-expanded="true"] .nav-toggle__open{display:none}
.nav-toggle[aria-expanded="true"] .nav-toggle__close{display:block}

.site-nav__list a,.site-nav__cta{white-space:nowrap}

/* Bilah atas (desktop): info singkat + pemilih bahasa. Tidak sticky. */
.topbar{background:var(--green-deep);color:var(--on-dark-muted);font-size:.84rem}
.topbar__inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:38px}
.topbar__info{display:flex;flex-wrap:wrap;gap:4px 20px;margin:0}
.topbar__info > span{display:inline-flex;align-items:center;gap:6px}
.topbar__info .icon{color:var(--orange-light)}

.lang-switch{display:flex;align-items:center;gap:2px;list-style:none;flex:none}
.lang-switch__link{display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:30px;padding:3px 10px;border-radius:999px;font-family:var(--font-head);font-weight:600;font-size:.8rem;letter-spacing:.02em;text-decoration:none;transition:color .2s var(--ease),background-color .2s var(--ease)}
.lang-switch__link[lang="zh-Hans"]{font-family:'Poppins',var(--font-cjk),sans-serif;letter-spacing:0}
.lang-switch--top .lang-switch__link{color:var(--on-dark)}
.lang-switch--top .lang-switch__link:hover{color:#fff;background:rgba(251,243,227,.14)}
.lang-switch--top .lang-switch__link[aria-current="true"]{background:var(--cream);color:var(--green)}
.lang-switch--nav{display:none;padding:4px;border:1px solid var(--border);border-radius:999px;background:#fff;align-self:flex-start}
.lang-switch--nav .lang-switch__link{color:var(--muted);min-width:56px;min-height:44px;font-size:.95rem;padding:8px 16px}
.lang-switch--nav .lang-switch__link:hover{color:var(--green);background:var(--green-pale)}
.lang-switch--nav .lang-switch__link[aria-current="true"]{background:var(--green);color:#fff}

@media (max-width:1199px){
  .js .nav-toggle{display:inline-flex}
  .js .site-nav{display:none;position:fixed;left:0;right:0;top:var(--header-h);bottom:0;z-index:99;flex-direction:column;align-items:stretch;gap:24px;margin:0;padding:24px var(--gutter) calc(32px + env(safe-area-inset-bottom));background:var(--paper);overflow-y:auto;border-top:1px solid var(--border-soft)}
  .js .site-nav.is-open{display:flex;animation:navIn .45s var(--m-out)}
  .js .site-nav__list{flex-direction:column;align-items:stretch;gap:4px}
  .js .site-nav__list a{padding:14px 16px;font-size:1.06rem;border-radius:var(--r-sm)}
  .js .site-nav__cta{min-height:52px}
  .js .topbar{display:none}
  .js .site-nav .lang-switch--nav{display:flex}
  html:not(.js) .site-header__inner{flex-wrap:wrap;padding-bottom:12px}
  html:not(.js) .site-nav{width:100%;flex-wrap:wrap;margin:0}
  html:not(.js) .site-nav__list{flex-wrap:wrap}
  body.nav-open{overflow:hidden}
  /* backdrop-filter menjadikan header "containing block" bagi panel menu fixed
     (panel jadi setinggi header); matikan selama menu terbuka. */
  body.nav-open .site-header{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--paper)}
}
@keyframes navIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}

/* ------------------------------------------------------------ hero */
.hero{background:linear-gradient(180deg,var(--cream) 0%,var(--paper) 100%);padding:clamp(40px,6vw,80px) 0 clamp(48px,7vw,96px)}
.hero__inner{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,72px);align-items:center}
.hero__title{font-size:clamp(2rem,1.3rem + 2.3vw,3.05rem);line-height:1.15;margin-bottom:20px;text-wrap:balance}
.hero__lead{font-size:clamp(1.02rem,.95rem + .3vw,1.16rem);color:var(--muted);max-width:60ch;margin-bottom:28px}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px}
.hero__wa{margin:18px 0 0;font-size:.98rem}
.hero__wa a{display:inline-flex;align-items:center;gap:8px;color:var(--green);font-weight:600}
.hero__wa .icon{color:#1F7A3F}
.hero__visual{position:relative}
.hero__frame{position:relative;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:4/3.4;background:var(--cream-deep)}
.hero__frame::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);pointer-events:none}
.hero__frame img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.hero__frame--sm{aspect-ratio:4/3}
.hero__visual::before{content:"";position:absolute;right:-18px;bottom:-18px;width:62%;height:62%;border-radius:var(--r-lg);background:var(--sage-pale);border:1px solid #D9E5CF;z-index:-1}
.hero__visual{z-index:0}
.hero__card{position:absolute;left:-20px;bottom:28px;display:flex;align-items:center;gap:12px;padding:14px 18px 14px 14px;background:#fff;border-radius:var(--r);box-shadow:var(--shadow-lg);color:var(--text);text-decoration:none;font-size:.95rem;line-height:1.35;max-width:270px;transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.hero__card:hover{transform:translateY(-2px);color:var(--text)}
.hero__card strong{display:block;font-family:var(--font-head);font-size:1.05rem;color:var(--green)}
.hero__card-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--green-pale);color:var(--green);flex:none}

/* ------------------------------------------------------------ trust strip */
.trust{background:var(--white);border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-soft)}
.trust__list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;list-style:none;padding-top:22px;padding-bottom:22px}
.trust__list li{display:flex;align-items:center;gap:12px;font-family:var(--font-head);font-weight:500;font-size:.95rem;color:var(--green)}
.trust__list .icon{color:var(--orange);flex:none}

/* ------------------------------------------------------------ sections */
.section{padding:var(--section-y) 0}
.section--tight{padding:clamp(40px,5vw,64px) 0}
.section--top0{padding-top:0}
.section--cream{background:var(--cream)}
.section--sage{background:var(--sage-pale)}
.section__head{max-width:720px;margin:0 auto clamp(32px,4vw,48px);text-align:center}
.section__head--left{margin-left:0;text-align:left}
.section__head--row{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;max-width:none;text-align:left}
.section__head--row .section__lead{margin-bottom:0}
.section__head--row > .btn{flex:none;white-space:nowrap}
.section__title{font-size:clamp(1.55rem,1.15rem + 1.5vw,2.3rem);margin-bottom:14px;text-wrap:balance}
.section__title--sm{font-size:clamp(1.25rem,1.1rem + .6vw,1.55rem)}
.section__lead{color:var(--muted);font-size:1.06rem;margin:0 auto}
.section__lead--left{margin-left:0}
.section__foot{margin-top:clamp(28px,4vw,44px);text-align:center}
.section__foot--left{text-align:left}
.section__note{max-width:760px;margin:32px auto 0;text-align:center;color:var(--muted);font-size:.96rem}

.grid{display:grid;gap:clamp(16px,2vw,24px);list-style:none}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid > *{min-width:0}
.grid--center{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),380px));justify-content:center}
.grid > div.reveal{display:flex}
.grid > div.reveal > *{flex:1}

/* ------------------------------------------------------------ media */
.media{position:relative;overflow:hidden;background:var(--cream-deep)}
.media img{width:100%;height:100%;object-fit:cover}
.media--4x3{aspect-ratio:4/3}
.media--16x10{aspect-ratio:16/10}
.media--16x9{aspect-ratio:16/9}
.media--4x5{aspect-ratio:4/5}
.media--rounded{border-radius:var(--r-lg)}
.media__placeholder{position:absolute;inset:0;display:grid;place-items:center;color:var(--green-mid)}

/* ------------------------------------------------------------ cards */
.stretched::after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit}
.layanan-card,.artikel-card,.worker-card,.city-card{position:relative;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease)}
.layanan-card:hover,.artikel-card:hover,.worker-card:hover,.city-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--border)}
.layanan-card:focus-within,.artikel-card:focus-within,.worker-card:focus-within,.city-card:focus-within{box-shadow:var(--shadow)}
.layanan-card .stretched:focus-visible,.artikel-card .stretched:focus-visible,.worker-card .stretched:focus-visible,.city-card .stretched:focus-visible{outline:none}
.layanan-card .stretched:focus-visible::after,.artikel-card .stretched:focus-visible::after,.worker-card .stretched:focus-visible::after,.city-card .stretched:focus-visible::after{outline:3px solid var(--orange);outline-offset:2px}
/* Kartu ber-overflow:hidden memotong outline di luar kartu: gambar di dalam. */
.layanan-card .stretched:focus-visible::after,.artikel-card .stretched:focus-visible::after{outline-offset:-3px;border-radius:var(--r)}

.layanan-card,.artikel-card{display:flex;flex-direction:column;overflow:hidden}
.layanan-card__media,.artikel-card__media{border-radius:0}
.layanan-card__media img,.artikel-card__media img{transition:transform .6s var(--ease)}
.layanan-card:hover .layanan-card__media img,.artikel-card:hover .artikel-card__media img{transform:scale(1.03)}
.layanan-card__icon{position:relative;margin:-23px 0 14px;display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:#fff;color:var(--green);box-shadow:var(--shadow-sm);z-index:2;pointer-events:none}
.layanan-card__body{display:flex;flex-direction:column;align-items:flex-start;flex:1;padding:0 20px 20px}
.layanan-card__title{font-size:1.08rem;margin-bottom:8px}
.layanan-card__title a,.artikel-card__title a,.worker-card__name a,.city-card a{color:var(--green);text-decoration:none}
.layanan-card__body p{color:var(--muted);font-size:.95rem;margin-bottom:16px}
.layanan-card__body .link-more{margin-top:auto}
.layanan-card:hover .link-more .icon{transform:translateX(3px)}

.artikel-card__body{display:flex;flex-direction:column;flex:1;padding:20px 22px 22px}
.artikel-card__title{font-size:1.12rem;margin-bottom:10px}
.artikel-card__body p{color:var(--muted);font-size:.95rem}
.artikel-card__date{margin:auto 0 0;font-size:.88rem;color:var(--muted)}

.worker-card{display:flex;flex-direction:column;padding:22px}
.worker-card__head{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.worker-card__name{font-size:1.1rem;margin:0}
.worker-card__id{margin:2px 0 0;font-size:.85rem;color:var(--muted);letter-spacing:.02em}
.worker-card__role{margin:0 0 10px;font-family:var(--font-head);font-weight:600;font-size:.95rem;color:var(--orange)}
.worker-card__meta{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;margin:4px 0 12px;font-size:.92rem;color:var(--text)}
.worker-card__meta li{display:flex;align-items:center;gap:6px;min-width:0}
.worker-card__meta .icon{color:var(--green-mid)}
.worker-card__skills{font-size:.92rem;color:var(--muted);margin-bottom:14px}
.quals{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 12px}
.qual{display:inline-flex;align-items:center;gap:5px;max-width:100%;min-width:0;padding:3px 10px;border-radius:999px;border:1px solid #D9E5CF;background:var(--sage-pale);color:#33503B;font-family:var(--font-head);font-weight:500;font-size:.78rem;line-height:1.5}
.qual > span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.qual .icon{flex:none}
.qual--edu{background:var(--cream);border-color:var(--border);color:#5E4A20}
.qual--cert{background:var(--orange-pale);border-color:#F0D3BC;color:#8A4515}
.qual__ok{display:inline-flex;align-items:center;gap:2px;margin-left:2px;padding-left:6px;border-left:1px solid rgba(138,69,21,.3);flex:none}
.qual--more{background:#fff;border-color:var(--border);color:var(--muted);font-weight:600}
.worker-card__more{margin-top:auto;display:inline-flex;align-items:center;gap:6px;font-family:var(--font-head);font-weight:600;font-size:.92rem;color:var(--orange)}
.worker-card__more .icon{transition:transform .25s var(--ease)}
.worker-card:hover .worker-card__more .icon{transform:translateX(3px)}

.avatar{display:grid;place-items:center;flex:none;width:56px;height:56px;border-radius:50%;font-family:var(--font-head);font-weight:600;font-size:1.1rem;letter-spacing:.02em;overflow:hidden}
.avatar--t0{background:var(--green-pale);color:var(--green)}
.avatar--t1{background:var(--orange-pale);color:#8A4515}
.avatar--t2{background:var(--sage-pale);color:#3D5E44}
.avatar--t3{background:var(--cream-deep);color:#5E4A20}
.avatar--photo img{width:100%;height:100%;object-fit:cover}
.avatar--xl{width:112px;height:112px;font-size:2rem;box-shadow:0 0 0 6px #fff,var(--shadow)}

.badges{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 10px}
.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;font-family:var(--font-head);font-weight:600;font-size:.76rem;letter-spacing:.02em;border:1px solid transparent}
.badge--silver{background:#F1F2F2;color:#4D5354;border-color:#DADDDD}
.badge--gold{background:#FBF0D5;color:#6E5212;border-color:#EBD8A6}
.badge--platinum{background:#E8EEF3;color:#334A5C;border-color:#CCD8E2}
.badge--star{background:var(--green);color:#fff}
.badge--star .icon{color:var(--orange-light)}

.city-card{display:flex;align-items:center;gap:14px;padding:18px 20px}
.city-card h3{margin:0;font-size:1.08rem}
.city-card p{margin:0;color:var(--muted);font-size:.9rem}
.city-card__icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--green-pale);color:var(--green);flex:none}
.city-card__arrow{margin-left:auto;color:var(--orange);transition:transform .25s var(--ease)}
.city-card:hover .city-card__arrow{transform:translateX(3px)}

.card{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);padding:clamp(20px,3vw,28px);box-shadow:var(--shadow-sm);margin-bottom:20px}
.card--sage{background:var(--sage-pale);border-color:#D9E5CF}
.card__title{display:flex;align-items:center;gap:10px;font-size:1.15rem;margin-bottom:14px}
.pre-line{white-space:pre-line;margin:0}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 24px;margin:0}
.facts div{border-bottom:1px solid var(--border-soft);padding-bottom:10px}
.facts dt{font-size:.85rem;color:var(--muted);margin-bottom:2px}
.facts dd{margin:0;font-weight:700;color:var(--text)}

/* ------------------------------------------------------------ korporat strip */
.corp-strip{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:clamp(28px,4vw,44px);border-radius:var(--r-lg);background:var(--green);color:var(--on-dark);background-image:radial-gradient(circle at 100% 0,rgba(143,174,121,.25),transparent 55%)}
.corp-strip h2{color:#fff;font-size:clamp(1.3rem,1.1rem + .8vw,1.75rem);margin-bottom:16px}
.chip-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none}
.chip{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:999px;border:1px solid var(--border);background:#fff;color:var(--green);font-family:var(--font-head);font-weight:500;font-size:.9rem;text-decoration:none;transition:background-color .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease)}
.chip:hover{border-color:var(--green);color:var(--green);background:var(--green-pale)}
.chip.is-active{background:var(--green);border-color:var(--green);color:#fff}
.chip__count{font-size:.78rem;opacity:.8}
.chip--light{background:rgba(255,255,255,.08);border-color:rgba(251,243,227,.35);color:#fff}
.chip--light:hover{background:rgba(255,255,255,.16);border-color:#fff;color:#fff}
.chips-nav{margin-bottom:28px}

/* ------------------------------------------------------------ stats */
.stats-band{background:var(--green-deep);color:var(--on-dark);padding:clamp(36px,5vw,56px) 0;background-image:radial-gradient(circle at 0 100%,rgba(143,174,121,.18),transparent 50%)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:24px;margin:0}
.stat{display:flex;flex-direction:column-reverse;gap:4px;padding-left:18px;border-left:2px solid rgba(240,178,126,.55)}
.stat dt{color:var(--on-dark-muted);font-size:.95rem}
.stat dd{margin:0;font-family:var(--font-head);font-weight:700;font-size:clamp(1.8rem,1.4rem + 1.4vw,2.5rem);line-height:1.1;color:#fff}
.stat dd small{font-size:.55em;font-weight:600;color:var(--orange-light)}
.stat .stat__text{font-size:clamp(1.25rem,1.1rem + .6vw,1.55rem);padding-top:.35em}

/* ------------------------------------------------------------ steps */
.steps{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;counter-reset:step}
.steps--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.step{position:relative;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);padding:24px 20px;box-shadow:var(--shadow-sm)}
.step h3{font-size:1.04rem;margin-bottom:8px}
.step p{margin:0;color:var(--muted);font-size:.94rem}
.step__num{display:inline-grid;place-items:center;width:44px;height:44px;margin-bottom:16px;border-radius:12px;background:var(--orange-pale);color:#8A4515;font-family:var(--font-head);font-weight:700;font-size:.95rem}

/* ------------------------------------------------------------ split & features */
.split{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(32px,5vw,72px);align-items:center}
.split--reverse{grid-template-columns:1.1fr .9fr}
.split__media .media{box-shadow:var(--shadow)}
.features{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 28px}
.feature{display:flex;gap:14px;align-items:flex-start}
.feature h3{font-size:1.02rem;margin-bottom:4px}
.feature p{margin:0;color:var(--muted);font-size:.94rem}
.feature__icon{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--green-pale);color:var(--green);flex:none}
.features--compact{grid-template-columns:1fr;gap:18px;margin-bottom:28px}
.benefit{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);padding:24px;box-shadow:var(--shadow-sm)}
.benefit .feature__icon{margin-bottom:16px}
.benefit h3{font-size:1.06rem;margin-bottom:8px}
.benefit p{margin:0;color:var(--muted);font-size:.95rem}

.check-list{list-style:none;display:grid;gap:10px;margin:0 0 24px}
.check-list li{display:flex;gap:10px;align-items:flex-start}
.check-list .icon{color:var(--green-mid);margin-top:3px}
.check-list--lg{gap:16px;font-size:1.04rem}
.check-list--lg .icon{width:24px;height:24px;padding:4px;border-radius:50%;background:var(--green-pale);color:var(--green);margin-top:0}

/* ------------------------------------------------------------ pricing */
.price-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);padding:26px 24px;box-shadow:var(--shadow-sm)}
.price-card h3{font-size:1.04rem;margin-bottom:6px}
.price-card p{color:var(--muted);font-size:.94rem;margin:0}
.price-card .price-card__value{font-family:var(--font-head);font-weight:700;font-size:1.32rem;color:var(--green);margin:0 0 12px;line-height:1.3}
.price-card__value small{font-size:.65em;font-weight:500;color:var(--muted)}
.price-card__icon{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--cream);color:var(--orange);margin-bottom:18px}
.price-card--accent{border-color:var(--green);box-shadow:0 0 0 1px var(--green),var(--shadow)}
.price-card--accent .price-card__icon{background:var(--green);color:#fff}

/* ------------------------------------------------------------ testimoni & galeri */
.testi{margin:0;display:flex;flex-direction:column;background:#fff;border-radius:var(--r);padding:26px;border:1px solid #D9E5CF;box-shadow:var(--shadow-sm)}
.testi blockquote{margin:0 0 18px;font-size:1rem}
.testi blockquote p{margin:0}
.testi figcaption{margin-top:auto;display:flex;flex-direction:column;font-size:.92rem;color:var(--muted)}
.testi figcaption strong{font-family:var(--font-head);color:var(--green);font-size:1rem}
.testi__rating{display:flex;gap:2px;margin:0 0 12px;color:#D8CDB4}
.testi__rating .on{color:var(--orange-brand)}
.galeri-item{margin:0}
.galeri-item figcaption{display:flex;flex-direction:column;margin-top:12px;font-size:.94rem;color:var(--muted)}
.galeri-item figcaption strong{color:var(--green);font-family:var(--font-head)}

/* ------------------------------------------------------------ FAQ */
.faq-list{display:grid;gap:12px}
.faq-item{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);box-shadow:var(--shadow-sm);transition:box-shadow .3s var(--ease),border-color .3s var(--ease)}
.faq-item[open]{border-color:var(--border);box-shadow:var(--shadow)}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;cursor:pointer;list-style:none;border-radius:var(--r)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item__q{margin:0;font-size:1.02rem;font-weight:600;color:var(--green)}
.faq-item__icon{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--green-pale);color:var(--green);flex:none;transition:transform .3s var(--ease),background-color .3s var(--ease)}
.faq-item__icon .icon{width:18px;height:18px}
.faq-item[open] .faq-item__icon{transform:rotate(180deg);background:var(--orange-pale);color:#8A4515}
.faq-item__a{padding:0 22px 20px;color:var(--text)}
.faq-item[open] .faq-item__a{animation:faqIn .35s var(--ease)}
@keyframes faqIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@supports selector(::details-content){
  :root{interpolate-size:allow-keywords}
  .faq-item::details-content{block-size:0;overflow:hidden;opacity:0;transition:block-size .35s var(--ease),opacity .35s var(--ease),content-visibility .35s allow-discrete}
  .faq-item[open]::details-content{block-size:auto;opacity:1}
  .faq-item[open] .faq-item__a{animation:none}
}
.faq-group{margin-bottom:44px}
.faq-group__title{font-size:1.3rem;margin-bottom:16px}

/* ------------------------------------------------------------ city links */
.city-links{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;list-style:none}
.city-links--left{justify-content:flex-start}
.city-links a{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;background:#fff;border:1px solid var(--border);color:var(--green);font-family:var(--font-head);font-weight:500;font-size:.94rem;text-decoration:none;transition:border-color .2s var(--ease),background-color .2s var(--ease)}
.city-links a:hover{border-color:var(--green);background:var(--green-pale);color:var(--green)}
.city-links .icon{color:var(--orange)}

/* ------------------------------------------------------------ mitra band & CTA */
.mitra-band{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;border-radius:var(--r-lg);overflow:hidden;background:var(--cream);border:1px solid var(--border-soft)}
.mitra-band__media{min-height:320px}
.mitra-band__media img{position:absolute;inset:0}
.mitra-band__body{padding:clamp(28px,4vw,56px)}
.mitra-band__body h2{font-size:clamp(1.45rem,1.15rem + 1.1vw,2rem)}
.mitra-band__body > p{color:var(--muted)}

.cta-band{background:var(--green);color:var(--on-dark);padding:clamp(48px,6vw,80px) 0;background-image:radial-gradient(circle at 100% 0,rgba(240,178,126,.16),transparent 45%),radial-gradient(circle at 0 100%,rgba(143,174,121,.22),transparent 50%)}
.cta-band__inner{display:flex;align-items:center;justify-content:space-between;gap:32px}
.cta-band h2{color:#fff;font-size:clamp(1.5rem,1.15rem + 1.3vw,2.15rem);margin-bottom:10px;max-width:30ch}
.cta-band p{margin:0;color:var(--on-dark-muted);max-width:56ch}
.cta-band__actions{display:flex;flex-wrap:wrap;gap:12px;flex:none}
.cta-band .btn--primary{box-shadow:none}

/* ------------------------------------------------------------ page hero */
.page-hero{background:linear-gradient(180deg,var(--cream) 0%,var(--paper) 100%);padding:clamp(20px,3vw,32px) 0 clamp(36px,5vw,64px)}
.page-hero__grid{display:block}
.page-hero--media .page-hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,64px);align-items:center}
.page-hero__title{font-size:clamp(1.85rem,1.3rem + 2vw,2.85rem);line-height:1.18;margin-bottom:16px;max-width:22ch;text-wrap:balance}
.page-hero--article .page-hero__title{max-width:none}
.page-hero__lead{font-size:clamp(1.02rem,.96rem + .25vw,1.14rem);color:var(--muted);max-width:66ch;margin-bottom:0}
.page-hero__meta{color:var(--muted);font-size:.94rem;margin:0}
.page-hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.page-hero__actions--center{justify-content:center}
.page-hero--center{text-align:center}
.page-hero--center .page-hero__title,.page-hero--center .page-hero__lead{margin-left:auto;margin-right:auto}
.page-hero__media{position:relative}

.breadcrumb{margin-bottom:clamp(16px,2.5vw,28px);font-size:.9rem}
.breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;list-style:none}
.breadcrumb li{display:inline-flex;align-items:center;gap:6px;color:var(--muted);min-width:0}
.breadcrumb a{color:var(--muted);text-decoration:none}
.breadcrumb a:hover{color:var(--green);text-decoration:underline}
.breadcrumb [aria-current]{color:var(--text);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60vw}
.breadcrumb__sep{width:14px;height:14px;color:#B3AA94}

/* ------------------------------------------------------------ sidebar layout */
.layout-sidebar{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(28px,4vw,56px);align-items:start}
.layout-sidebar__aside{position:sticky;top:calc(var(--header-h) + 20px)}
.side-card{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);padding:26px;box-shadow:var(--shadow)}
.side-card__title{font-size:1.2rem;margin-bottom:8px}
.side-card > p{color:var(--muted);font-size:.96rem}
.side-card .btn + .btn{margin-top:10px}
.side-card__list{list-style:none;display:grid;gap:10px;margin:22px 0 0;padding-top:18px;border-top:1px solid var(--border-soft);font-size:.93rem}
.side-card__list li{display:flex;gap:10px;align-items:flex-start}
.side-card__list .icon{color:var(--green-mid);margin-top:2px}
.side-card__back{display:inline-flex;align-items:center;gap:4px;margin-top:18px;font-size:.93rem}
.detail-figure{margin:0 0 32px;box-shadow:var(--shadow)}

/* ------------------------------------------------------------ prose */
.prose{font-size:1.06rem;line-height:1.75;color:var(--text)}
.prose > :first-child{margin-top:0}
.prose h2{font-size:clamp(1.3rem,1.15rem + .6vw,1.6rem);margin:1.8em 0 .6em}
.prose h3{font-size:1.15rem;margin:1.5em 0 .5em}
.prose p,.prose ul,.prose ol,.prose blockquote{margin:0 0 1.1em}
.prose ul,.prose ol{padding-left:1.4em}
.prose li{margin-bottom:.45em}
.prose li::marker{color:var(--orange-brand)}
.prose a{color:var(--orange);font-weight:600}
.prose a:hover{color:var(--orange-hover)}
.prose strong{color:#2B2B2B}
.prose blockquote{padding:16px 20px;border-left:4px solid var(--sage);background:var(--sage-pale);border-radius:0 var(--r-sm) var(--r-sm) 0}
.prose blockquote p{margin:0}
.prose--lead > p:first-child{font-size:1.15rem;color:#2F2F2F}
.prose--article{font-size:1.1rem}
.faq-item__a.prose{font-size:1rem}
.faq-item__a.prose > :last-child{margin-bottom:0}

/* ------------------------------------------------------------ article */
.article__meta{display:flex;flex-wrap:wrap;gap:8px 22px;margin:22px 0 0;color:var(--muted);font-size:.94rem}
.article__meta span{display:inline-flex;align-items:center;gap:6px}
.article__meta .icon{color:var(--green-mid)}
.article__figure{margin:0 0 clamp(32px,5vw,56px);box-shadow:var(--shadow)}
.share{margin:48px 0 clamp(48px,6vw,80px);padding-top:28px;border-top:1px solid var(--border)}
.share__title{font-size:1rem;margin-bottom:14px}
.share__list{display:flex;flex-wrap:wrap;gap:10px;list-style:none}
.share__btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:9px 16px;border-radius:999px;border:1px solid var(--border);background:#fff;color:var(--green);font-family:var(--font-head);font-weight:500;font-size:.9rem;text-decoration:none;transition:border-color .2s var(--ease),background-color .2s var(--ease)}
.share__btn:hover{border-color:var(--green);background:var(--green-pale);color:var(--green)}

/* ------------------------------------------------------------ pekerja list */
.filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:end;padding:20px;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);margin-bottom:20px}
.filters__field{min-width:0}
.filters__field--q{grid-column:span 2}
.filters__field label{display:block;font-family:var(--font-head);font-weight:500;font-size:.85rem;color:var(--green);margin-bottom:6px}
.filters__field--check{grid-column:span 2;display:flex;align-items:center;gap:10px;min-height:48px}
.filters__field--check input{flex:none;width:20px;height:20px;margin:0;accent-color:var(--green)}
.filters__field--check label{display:inline;margin:0;font-family:var(--font-body);font-weight:600;font-size:.95rem;color:var(--text);cursor:pointer}
.filters__actions{grid-column:span 2;display:flex;gap:6px;align-items:center;justify-content:flex-end}
.input-icon{position:relative}
.input-icon .icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}
.input-icon input[type=search]{padding-left:42px}
.results-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:20px}
.results-head__title{font-size:1.2rem;margin:0}
.results-head__page{margin:0;color:var(--muted);font-size:.93rem}
.empty{text-align:center;padding:clamp(32px,5vw,56px) 24px;background:#fff;border:1px dashed var(--border);border-radius:var(--r-lg);color:var(--muted)}
.empty p{max-width:56ch;margin:0 auto 20px}
.empty__icon{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--green-pale);color:var(--green);margin-bottom:16px}
.empty__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.disclaimer{display:flex;gap:8px;align-items:flex-start;margin:28px 0 0;color:var(--muted);font-size:.9rem}
.disclaimer .icon{margin-top:3px;flex:none}

.pagination{margin-top:36px}
.pagination ul{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;list-style:none}
.pagination a,.pagination span.is-current,.pagination span.is-disabled{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;min-height:44px;padding:8px 14px;border-radius:999px;font-family:var(--font-head);font-weight:500;font-size:.93rem;text-decoration:none}
.pagination a{background:#fff;border:1px solid var(--border);color:var(--green)}
.pagination a:hover{border-color:var(--green);background:var(--green-pale)}
.pagination .is-current{background:var(--green);color:#fff}
.pagination .is-disabled{color:#B3AA94}
.pagination__gap{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:var(--muted)}

.profile-head{display:flex;align-items:center;gap:clamp(20px,3vw,32px)}
.profile-head .page-hero__title{margin-bottom:6px}
.profile-head__role{margin:0 0 12px;font-family:var(--font-head);font-weight:600;color:var(--orange)}
.profile-head__role a{color:inherit;text-decoration:none}
.profile-head__role a:hover{text-decoration:underline}

/* ------------------------------------------------------------ forms */
.form-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,64px);align-items:start}
.form-layout__aside > p{color:var(--muted)}
.form-layout__photo{margin-top:8px;box-shadow:var(--shadow)}
.form-card{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);padding:clamp(22px,3.5vw,36px);box-shadow:var(--shadow);scroll-margin-top:calc(var(--header-h) + 16px)}
.form-card__title{font-size:clamp(1.3rem,1.15rem + .5vw,1.55rem);margin-bottom:8px}
.form-card__intro{color:var(--muted);margin-bottom:18px}
.form-note{font-size:.88rem;color:var(--muted);margin-bottom:18px}
.req{color:var(--orange);font-weight:700}
.opt{font-weight:400;color:var(--muted);font-size:.9em}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.field{min-width:0}
.field--full{grid-column:1/-1}
.field label{display:block;font-family:var(--font-head);font-weight:500;font-size:.92rem;color:var(--green);margin-bottom:6px}
input[type=text],input[type=tel],input[type=email],input[type=number],input[type=date],input[type=search],select,textarea{display:block;width:100%;min-height:48px;padding:11px 14px;border:1px solid #D9CDB0;border-radius:12px;background:#fff;font-size:1rem;line-height:1.4;color:var(--text);transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}
textarea{min-height:120px;resize:vertical}
select{appearance:none;-webkit-appearance:none;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F4A38' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:18px}
input:hover,select:hover,textarea:hover{border-color:#BFB08C}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(74,107,82,.22)}
input::placeholder,textarea::placeholder{color:#8C877A}
.hint{margin:6px 0 0;font-size:.86rem;color:var(--muted)}
.field--check{display:flex;gap:12px;align-items:flex-start;margin:22px 0 4px;padding:14px 16px;border-radius:12px;background:var(--cream)}
.field--check input{flex:none;width:20px;height:20px;margin:3px 0 0;accent-color:var(--green)}
.field--check label{font-family:var(--font-body);font-weight:400;font-size:.94rem;color:var(--text);margin:0}
.form-actions{margin-top:20px}
.form-privacy{display:flex;align-items:center;justify-content:center;gap:6px;margin:12px 0 0;font-size:.86rem;color:var(--muted);text-align:center}
.hp-field{position:absolute!important;left:-10000px!important;top:auto;width:1px;height:1px;overflow:hidden}

.alert{display:flex;gap:12px;align-items:flex-start;padding:16px 18px;border-radius:12px;margin-bottom:18px;border:1px solid}
.alert p{margin:0}
.alert__title{font-family:var(--font-head);font-weight:600;margin-bottom:2px!important}
.alert__icon{flex:none;width:28px;height:28px;padding:5px;border-radius:50%}
.alert--ok{background:#ECF5EC;border-color:#BCD8BF;color:#1E4D2B}
.alert--ok .alert__icon{background:#1F7A3F;color:#fff}
.alert--error{background:#FBEDE8;border-color:#EBC2B3;color:#7A2C12}
.alert--error .alert__icon{background:#A33A16;color:#fff}

.picked{display:flex;gap:14px;align-items:center;padding:16px 18px;margin-bottom:28px;background:#fff;border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow-sm)}
.picked p{margin:0}
.picked__label{font-size:.82rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.picked__name{font-family:var(--font-head);font-weight:600}
.picked__role{font-size:.92rem;color:var(--muted)}

/* ------------------------------------------------------------ mitra page */
.star-card{padding:clamp(28px,4vw,48px);border-radius:var(--r-lg);background:var(--green);color:var(--on-dark);background-image:radial-gradient(circle at 100% 0,rgba(240,178,126,.2),transparent 50%)}
.star-card__head{display:flex;gap:20px;align-items:flex-start;margin-bottom:28px}
.star-card__head h2{color:#fff;font-size:clamp(1.5rem,1.2rem + 1vw,2rem);margin-bottom:8px}
.star-card__head p{color:var(--on-dark-muted);max-width:62ch;margin:0}
.star-card__badge{display:grid;place-items:center;width:64px;height:64px;border-radius:18px;background:rgba(240,178,126,.18);color:var(--orange-light);flex:none}
.star-card__badge .icon{width:32px;height:32px}
.star-card__list{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.star-card__list li{display:flex;gap:12px;align-items:flex-start;padding:18px;border-radius:var(--r);background:rgba(255,255,255,.06);border:1px solid rgba(251,243,227,.16)}
.star-card__list .icon{color:var(--orange-light);flex:none}
.star-card__list strong{display:block;color:#fff;font-family:var(--font-head);font-weight:600;margin-bottom:2px}
.star-card__list span{color:var(--on-dark-muted);font-size:.93rem}
.corp-note{margin:28px 0 0;color:var(--muted)}
.corp-note .icon{display:inline-block;vertical-align:-3px;margin-right:6px;color:var(--green-mid)}

/* ------------------------------------------------------------ kontak */
.contact-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,64px);align-items:start}
.contact-list{list-style:none;display:grid;gap:14px;margin-bottom:28px}
.contact-item{display:flex;gap:14px;align-items:flex-start;padding:18px;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);box-shadow:var(--shadow-sm)}
.contact-item h2{font-size:.98rem;margin:0 0 2px}
.contact-item p{margin:0;overflow-wrap:anywhere}
.contact-item a{font-weight:600}
.contact-item__icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--green-pale);color:var(--green);flex:none}
.contact-photo{margin-bottom:28px;box-shadow:var(--shadow)}
.contact-photo img{object-position:50% 25%}
.contact-shortcuts__title{font-size:1.08rem}
.contact-shortcuts ul{list-style:none;display:grid;gap:8px}
.contact-shortcuts a{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 16px;border-radius:12px;background:var(--cream);color:var(--green);font-weight:600;text-decoration:none;transition:background-color .2s var(--ease)}
.contact-shortcuts a:hover{background:var(--cream-deep)}

.link-grid{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.link-grid a{display:flex;gap:14px;align-items:center;padding:18px;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);text-decoration:none;color:var(--text);box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.link-grid a:hover{transform:translateY(-2px);box-shadow:var(--shadow);color:var(--text)}
.link-grid .icon{color:var(--orange)}
.link-grid strong{display:block;font-family:var(--font-head);color:var(--green)}
.link-grid span{font-size:.92rem;color:var(--muted)}

/* ------------------------------------------------------------ multi-bahasa & kualifikasi */
.lang-notice{display:flex;gap:10px;align-items:flex-start;margin:0 0 clamp(28px,4vw,40px);padding:12px 16px;border-radius:12px;background:var(--cream);border:1px solid var(--border);color:var(--text);font-size:.95rem}
.lang-notice .icon{color:var(--green-mid);margin-top:3px;flex:none}
.lang-chips{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 14px;margin-top:clamp(24px,3vw,36px)}
.lang-chips--left{justify-content:flex-start;margin:0 0 28px}
.lang-chips--spaced{margin:clamp(32px,4vw,48px) 0 0}
.lang-chips__label{margin:0;font-family:var(--font-head);font-weight:600;font-size:.95rem;color:var(--green)}
.lang-chips .chip-list{justify-content:center}
.lang-chips--left .chip-list{justify-content:flex-start}
.page-hero .lang-notice{max-width:760px;margin:0 0 20px}
.chip .icon{color:var(--orange)}
.chip.is-active .icon{color:#fff}
.lang-links{margin:-12px 0 24px}
.qual-grid .benefit{height:100%}
.features--odd-wide > li:last-child:nth-child(odd){grid-column:1/-1}
.lang-levels{list-style:none;display:grid;gap:0;margin:0 0 12px}
.lang-levels li{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--border-soft)}
.lang-levels li:last-child{border-bottom:0}
.lang-levels__name{font-weight:700;color:var(--text)}
.level{display:inline-flex;align-items:center;padding:2px 11px;border-radius:999px;font-family:var(--font-head);font-weight:600;font-size:.78rem;line-height:1.6;border:1px solid transparent;white-space:nowrap}
.level--fasih{background:var(--green);color:#fff}
.level--percakapan{background:var(--green-pale);color:var(--green);border-color:#CFDDCD}
.level--dasar{background:var(--cream);color:#5E4A20;border-color:var(--border)}
.edu-line{margin:0;font-weight:700}
.cert-list{list-style:none;display:grid;gap:0;margin:0 0 12px}
.cert{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--border-soft)}
.cert:last-child{border-bottom:0}
.cert__main{min-width:0}
.cert__name{margin:0;font-weight:700;color:var(--text)}
.cert__meta{margin:2px 0 0;color:var(--muted);font-size:.9rem}
.cert__badge{flex:none;display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;font-family:var(--font-head);font-weight:600;font-size:.76rem;line-height:1.5;color:var(--muted);background:#F4F1EA;border:1px solid var(--border-soft);white-space:nowrap}
.cert__badge--ok{background:#ECF5EC;border-color:#BCD8BF;color:#1E4D2B}
.card .hint{margin-top:4px}
.lp-intro p{color:var(--text)}
.level-legend{list-style:none;display:grid;gap:12px;margin:8px 0 0;padding:18px 20px;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);box-shadow:var(--shadow-sm);font-size:.95rem;color:var(--muted)}
.level-legend li{display:grid;grid-template-columns:minmax(118px,auto) 1fr;gap:12px;align-items:center}
.level-legend .level{justify-self:start}

/* ------------------------------------------------------------ footer */
.site-footer{background:var(--green-deep);color:var(--on-dark-muted);padding-top:clamp(48px,6vw,72px);font-size:.96rem}
.site-footer__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:clamp(28px,4vw,48px);padding-bottom:clamp(36px,5vw,56px)}
.site-footer__about > p{margin:18px 0 20px;max-width:42ch}
.site-footer__title{color:#fff;font-size:1rem;margin-bottom:14px}
.site-footer__title--spaced{margin-top:28px}
.site-footer ul{list-style:none;display:grid;gap:8px}
.site-footer a{color:var(--on-dark);text-decoration:none}
.site-footer a:hover{color:var(--orange-light);text-decoration:underline}
.footer-contact li{display:flex;gap:10px;align-items:flex-start}
.footer-contact .icon{width:18px;height:18px;margin-top:3px;color:var(--orange-light)}
.social{display:flex!important;gap:10px!important;margin-top:20px}
.social a{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid rgba(251,243,227,.28);color:var(--on-dark);transition:background-color .2s var(--ease),border-color .2s var(--ease)}
.social a:hover{background:rgba(251,243,227,.12);border-color:var(--on-dark);color:#fff}
.social .icon{width:20px;height:20px}
.site-footer__bottom{border-top:1px solid rgba(251,243,227,.14);padding:20px 0}
.site-footer__bottom p{margin:0;font-size:.9rem}

/* ------------------------------------------------------------ WhatsApp float */
.wa-float{position:fixed;z-index:90;right:max(20px,env(safe-area-inset-right));bottom:calc(20px + env(safe-area-inset-bottom));display:inline-flex;align-items:center;gap:10px;min-height:56px;padding:0 20px 0 16px;border-radius:999px;background:#1F7A3F;color:#fff;font-family:var(--font-head);font-weight:600;font-size:.95rem;text-decoration:none;box-shadow:0 10px 24px rgba(31,122,63,.32);transition:background-color .2s var(--ease),transform .2s var(--ease),box-shadow .2s var(--ease)}
.wa-float:hover{background:#17602F;color:#fff;transform:translateY(-2px);box-shadow:0 14px 28px rgba(31,122,63,.36)}
.wa-float .icon{width:26px;height:26px}
@media (max-width:1599px){
  .wa-float{width:56px;height:56px;padding:0;justify-content:center}
  .wa-float__label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media (max-width:767px){
  .wa-float{right:max(16px,env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom))}
  .has-wa .site-footer__bottom{padding-bottom:calc(92px + env(safe-area-inset-bottom))}
  body.nav-open .wa-float{display:none}
}

/* ------------------------------------------------------------ reveal on scroll */
.js .reveal{opacity:0;translate:0 var(--m-rise)}
/* --d = urutan elemen dalam satu "batch" yang masuk layar bersamaan (site.js).
   Transisi hover (transform/bayangan/border) ikut didaftarkan TANPA jeda,
   karena aturan ini menimpa transition milik kartu yang juga .reveal. */
.js .reveal.is-visible{--rv-delay:calc(var(--d,0) * var(--m-step));opacity:1;translate:none;transition:opacity var(--m-t3) var(--m-soft) var(--rv-delay),translate var(--m-t3) var(--m-out) var(--rv-delay),var(--m-tx-hover)}
.js.no-reveal .reveal{opacity:1;translate:none}

/* ------------------------------------------------------------ responsive */
@media (max-width:1139px){
  .grid--4{grid-template-columns:repeat(3,minmax(0,1fr))}
  .steps{grid-template-columns:repeat(3,minmax(0,1fr))}
  .filters{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filters__field--q{grid-column:1/-1}
  .site-footer__grid{grid-template-columns:1fr 1fr}
  .site-footer__about{grid-column:1/-1}
}
@media (max-width:899px){
  .hero__inner,.page-hero--media .page-hero__grid,.split,.split--reverse,.layout-sidebar,.form-layout,.contact-layout,.mitra-band{grid-template-columns:1fr}
  .hero__visual{max-width:620px}
  .hero__card{left:12px;bottom:12px}
  .hero__visual::before{right:-10px;bottom:-10px}
  .grid--3,.grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .trust__list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .layout-sidebar__aside{position:static}
  .corp-strip,.cta-band__inner{flex-direction:column;align-items:flex-start}
  .star-card__list{grid-template-columns:1fr}
  .split__media{order:-1}
  .split--reverse .split__media{order:0}
  .split__media .media--4x5{aspect-ratio:16/10}
  .page-hero--media .page-hero__media{order:-1}
  .page-hero--media .hero__frame{aspect-ratio:16/10}
  .section__head--row{flex-direction:column;align-items:flex-start}
}
@media (max-width:599px){
  .grid--2,.grid--3,.grid--4,.steps,.steps--3,.features,.form-grid,.facts,.link-grid{grid-template-columns:1fr}
  .trust__list{grid-template-columns:1fr;gap:12px}
  .filters{grid-template-columns:1fr 1fr;padding:16px}
  .filters__actions,.filters__field--check{grid-column:1/-1}
  .filters__actions .btn--primary{flex:1}
  .hero__actions .btn,.page-hero__actions .btn,.cta-band__actions .btn{width:100%}
  .cta-band__actions{width:100%}
  .site-footer__grid{grid-template-columns:1fr}
  .hero__card{position:relative;left:auto;bottom:auto;margin:-28px 12px 0;max-width:none}
  .hero__visual::before{display:none}
  .profile-head{flex-direction:column;align-items:flex-start}
  .avatar--xl{width:88px;height:88px;font-size:1.6rem}
  .mitra-band__media{min-height:220px}
  .stats{grid-template-columns:1fr 1fr}
  .results-head{flex-direction:column;gap:4px}
  .star-card__head{flex-direction:column}
  .level-legend li{grid-template-columns:1fr;gap:4px}
  .cert{flex-direction:column;gap:6px}
}

/* ============================================================ motion (gerak halus)
   Semua efek: sekali jalan, ease-out (--ease), 400–900 ms, hanya transform/
   opacity. Status akhir = tampilan tanpa JS; JS hanya "mempersenjatai"
   (arm) elemen bila prefers-reduced-motion: no-preference. */

/* ---- angka hitung naik (site.js). Selama animasi lebar kotak dikunci JS
   persis selebar angka akhir; angka sementara rata kiri (titik awal tetap,
   jadi tidak ada layout shift sama sekali). */
.countup{display:inline-block;font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---- hero: foto "settle" sekali + kartu info menyusul */
/* Foto hero: "jendela" membuka dari bingkai membulat + zoom yang mengendap.
   Gambar terlihat sejak frame pertama (aman untuk LCP). */
@keyframes heroSettle{from{scale:1.08;clip-path:inset(6% 6% 6% 6% round 22px)}to{scale:1;clip-path:inset(0 0 0 0 round 0)}}
@keyframes heroCardIn{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@keyframes fxFade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:no-preference){
  .js .hero__img{animation:heroSettle 1.6s var(--m-out) both}
  .js .hero__card{animation:heroCardIn .8s var(--m-out) .55s backwards}
}
/* Ruang parallax: foto 48px lebih tinggi dari bingkai sejak render pertama
   (tanpa layout shift); site.js menggeser 0–24px saat scroll. */
@media (min-width:1024px) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .hero .hero__frame > .hero__img,.hero .hero__frame > .hero__video{position:absolute;left:0;top:-24px;width:100%;height:calc(100% + 48px)}
}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;opacity:0;transition:opacity .9s var(--ease);pointer-events:none}
.hero__video.is-playing{opacity:1}

/* ---- kartu layanan: panel tugas saat hover/fokus (perangkat ber-mouse saja) */
.layanan-card__tasks{display:none}
@media (hover:hover) and (pointer:fine){
  .layanan-card__tasks{display:flex;flex-direction:column;justify-content:flex-end;position:absolute;inset:0;padding:16px 18px 32px;background:rgba(36,58,44,.93);color:#fff;transform:translateY(101%);transition:transform .5s var(--ease);pointer-events:none}
  .layanan-card:hover .layanan-card__tasks,.layanan-card:focus-within .layanan-card__tasks{transform:none}
  .layanan-card__tasks-label{margin:0 0 6px;font-family:var(--font-head);font-weight:600;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--orange-light)}
  .layanan-card__tasks ul{list-style:none;display:grid;gap:5px;margin:0}
  .layanan-card__tasks li{position:relative;padding-left:14px;font-size:.86rem;line-height:1.4;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
  .layanan-card__tasks li::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--orange-light)}
  html[lang="zh-Hans"] .layanan-card__tasks-label{letter-spacing:.04em}
}

/* ---- proses 5 langkah: garis penghubung + lencana aktif bergiliran */
.steps--timeline{--tl-b:44px;--tl-gap:20px;--tl-seg:140ms;--tl-off:scaleX(0);gap:var(--tl-gap)}
.steps--timeline .step__num{position:absolute;z-index:1;margin:0;background:var(--green);color:#fff;box-shadow:0 0 0 5px var(--cream);transition:background-color .3s var(--ease),color .3s var(--ease),box-shadow .3s var(--ease)}
.steps--timeline .step:not(:last-child)::before,.steps--timeline .step:not(:last-child)::after{content:"";position:absolute;pointer-events:none;border-radius:2px}
.steps--timeline .step::before{background:var(--border)}
.steps--timeline .step::after{background:var(--green-mid)}
@media (min-width:1024px){
  .steps--timeline{grid-template-columns:repeat(5,minmax(0,1fr));padding-top:calc(var(--tl-b) + 18px)}
  .steps--timeline .step{padding-top:22px}
  .steps--timeline .step__num{top:calc(-18px - var(--tl-b));left:20px}
  .steps--timeline .step::before,.steps--timeline .step::after{top:calc(-19px - var(--tl-b) / 2);left:calc(20px + var(--tl-b) / 2);width:calc(100% + var(--tl-gap));height:2px;transform-origin:left center}
}
@media (max-width:1023px){
  .steps--timeline{--tl-gap:16px;--tl-off:scaleY(0);grid-template-columns:1fr;max-width:680px;margin:0 auto}
  .steps--timeline .step{margin-left:calc(var(--tl-b) + 16px)}
  .steps--timeline .step__num{top:20px;left:calc(-17px - var(--tl-b))}
  .steps--timeline .step::before,.steps--timeline .step::after{left:calc(-18px - var(--tl-b) / 2);top:calc(20px + var(--tl-b) / 2);width:2px;height:calc(100% + var(--tl-gap));transform-origin:center top}
}
@media (prefers-reduced-motion:no-preference){
  .steps--timeline.tl-armed .step::after{transform:var(--tl-off)}
  .steps--timeline.tl-armed .step__num{background:#fff;color:var(--muted);box-shadow:inset 0 0 0 1.5px var(--border),0 0 0 5px var(--cream)}
  .steps--timeline.tl-armed.is-drawn .step::after{transform:none;transition:transform var(--tl-seg) linear calc(var(--i,0) * var(--tl-seg))}
  .steps--timeline.tl-armed.is-drawn .step:first-child::after{transition-timing-function:cubic-bezier(.5,0,1,1)}
  .steps--timeline.tl-armed.is-drawn .step:nth-last-child(2)::after{transition-timing-function:cubic-bezier(0,0,.4,1)}
  .steps--timeline.tl-armed.is-drawn .step__num{background:var(--green);color:#fff;box-shadow:0 0 0 5px var(--cream);transition-delay:calc(var(--i,0) * var(--tl-seg))}
}

/* ---- korsel testimoni (>= 3 testimoni). Tanpa JS: geser/scroll biasa. */
.carousel{--c-gap:clamp(16px,2vw,24px)}
.carousel__track{margin:0 -4px;padding:4px 4px 10px;display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 2 * var(--c-gap) - 8px) / 3);gap:var(--c-gap);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:4px;scrollbar-width:thin;border-radius:var(--r)}
.js .carousel__track{scrollbar-width:none}
.js .carousel__track::-webkit-scrollbar{display:none}
.carousel__track:focus-visible{outline-offset:2px}
.carousel__slide{display:flex;min-width:0;scroll-snap-align:start}
.carousel__slide > .testi{flex:1}
.carousel__controls{display:flex;align-items:center;gap:8px;min-height:44px;margin-top:16px}
html:not(.js) .carousel__controls{display:none}
.carousel__dots{display:flex;flex-wrap:wrap;align-items:center;gap:2px;margin-right:auto;min-height:44px}
.carousel__dot{display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:999px;background:none;cursor:pointer}
.carousel__dot::before{content:"";width:8px;height:8px;border-radius:999px;background:#A9BEA0;transition:width .3s var(--ease),background-color .3s var(--ease)}
.carousel__dot[aria-current="true"]::before{width:22px;background:var(--green)}
.carousel__dot:hover::before{background:var(--green-mid)}
.carousel__btn{display:inline-grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border-radius:999px;border:1.5px solid rgba(47,74,56,.35);background:#fff;color:var(--green);cursor:pointer;transition:background-color .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease),transform .15s var(--ease)}
.carousel__btn:hover{background:var(--green);border-color:var(--green);color:#fff}
.carousel__btn:active{transform:scale(.94)}
.carousel__btn[hidden]{display:none}
.carousel__ic-play{display:none}
.carousel.is-stopped .carousel__ic-pause{display:none}
.carousel.is-stopped .carousel__ic-play{display:block}
@media (max-width:899px){.carousel__track{grid-auto-columns:calc((100% - var(--c-gap) - 8px) / 2)}}
@media (max-width:599px){.carousel__track{grid-auto-columns:86%}}

/* ------------------------------------------------------------ Mandarin typography */
html[lang="zh-Hans"] body{line-height:1.75;letter-spacing:0}
html[lang="zh-Hans"] h1,html[lang="zh-Hans"] h2,html[lang="zh-Hans"] h3,html[lang="zh-Hans"] h4,
html[lang="zh-Hans"] .btn,html[lang="zh-Hans"] .brand__name,html[lang="zh-Hans"] .badge,html[lang="zh-Hans"] .chip{letter-spacing:0}
html[lang="zh-Hans"] h1,html[lang="zh-Hans"] h2,html[lang="zh-Hans"] h3,html[lang="zh-Hans"] h4{line-height:1.4}
html[lang="zh-Hans"] .hero__title{line-height:1.3}
html[lang="zh-Hans"] .eyebrow{letter-spacing:.06em}
html[lang="zh-Hans"] .prose{line-height:1.85}
html[lang="zh-Hans"] .page-hero__title{max-width:26ch}
html[lang="zh-Hans"] .qual{font-size:.8rem}
html[lang="zh-Hans"] [lang="id"],html[lang="en"] [lang="id"]{letter-spacing:normal}

/* ------------------------------------------------------------ reduced motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .reveal{opacity:1;translate:none}
  .layanan-card:hover,.artikel-card:hover,.worker-card:hover,.city-card:hover,.link-grid a:hover,.wa-float:hover,.hero__card:hover{transform:none}
  .layanan-card:hover .layanan-card__media img,.artikel-card:hover .artikel-card__media img{transform:none}
  .btn:active,.carousel__btn:active{transform:none}
}

/* ------------------------------------------------------------ print */
@media print{
  .site-header,.site-footer,.wa-float,.cta-band,.share,.form-card,.skip-link{display:none!important}
  .js .reveal{opacity:1;transform:none}
  .hero__video,.carousel__controls,.layanan-card__tasks{display:none!important}
  .carousel__track{display:block;overflow:visible}
  .carousel__slide{margin-bottom:16px}
  body{background:#fff}
}

/* ------------------------------------------------------------ area layanan (dikelompokkan per provinsi) */
.area-groups{display:grid;gap:22px 32px}
.area-groups--block{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.area-group__title{margin:0 0 8px;font-family:var(--font-head);font-weight:600;font-size:.95rem;color:var(--green)}
.area-group__list,.area-group__sub{list-style:none;margin:0;padding:0}
.area-group__list{display:grid;gap:6px}
.area-group__sub{display:flex;flex-wrap:wrap;gap:4px 12px;margin:6px 0 0 14px;padding-left:12px;border-left:2px solid var(--border)}
.area-groups--block a{color:var(--green);font-weight:600;text-decoration:none}
.area-groups--block a:hover{color:var(--orange);text-decoration:underline}
.area-groups--block .area-group__sub a{font-weight:500}
.area-groups [aria-current="page"]{font-weight:700;color:var(--orange)}
.area-groups--footer{gap:14px}
.area-groups--footer .area-group__title{color:var(--on-dark-muted);font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;margin-bottom:4px}
.site-footer .area-group__list{display:flex;flex-wrap:wrap;gap:4px 12px}
.site-footer .area-group__sub{display:inline-flex;margin:0 0 0 4px;padding-left:8px;border-left-color:rgba(251,243,227,.28);gap:2px 10px;font-size:.9rem}
.site-footer__more{margin:16px 0 0}
.area-province + .area-province{margin-top:clamp(28px,4vw,44px)}
.area-province .section__title{margin-bottom:16px}
.area-note{margin:clamp(28px,4vw,40px) 0 0;color:var(--muted)}
.city-card__children{position:relative;z-index:2;list-style:none;display:flex;flex-wrap:wrap;gap:4px 10px;margin:6px 0 0;padding:0;font-size:.9rem}
.city-card__children a{color:var(--green-mid,var(--green));text-decoration:underline;text-underline-offset:2px}
.city-card__children a:hover{color:var(--orange)}
.hero__expat{margin:10px 0 0;font-size:.98rem}
.hero__expat a{display:inline-flex;align-items:center;gap:8px;color:var(--green);font-weight:600}
.hero__expat .icon{color:var(--orange)}
.corp-strip__text > p{margin:0 0 16px;color:var(--on-dark);max-width:62ch}

/* ------------------------------------------------------------ ikon (Phosphor Icons, MIT) */
/* Duotone: garis memakai currentColor, lapisan isi (.ic-d) memakai --ic-d. */
.icon .ic-d{fill:var(--ic-d,currentColor);opacity:var(--ic-d-o,.2)}
:root{--ic-d:var(--orange-brand);--ic-d-o:.32}
/* Wadah ikon fitur: tanpa kotak pucat, ikon lebih besar dengan garis aksen tipis */
.feature__icon,.hero__card-icon,.city-card__icon,.contact-item__icon,.price-card__icon{
  position:relative;width:auto;height:auto;padding:0 0 10px;border-radius:0;background:none;color:var(--green);place-items:start}
.benefit .feature__icon::after,.price-card__icon::after{content:"";position:absolute;left:0;bottom:0;width:22px;height:2px;border-radius:2px;background:var(--orange-brand)}
.feature__icon .icon,.price-card__icon .icon{width:36px;height:36px}
.feature .feature__icon{padding:0}
.feature .feature__icon .icon{width:32px;height:32px}
.hero__card-icon,.city-card__icon,.contact-item__icon{padding:2px 0 0}
.hero__card-icon .icon,.city-card__icon .icon,.contact-item__icon .icon{width:30px;height:30px}
.price-card__icon{color:var(--orange)}
.price-card--accent .price-card__icon{background:none;color:var(--green)}
.layanan-card__icon{border-radius:50%;width:52px;height:52px;margin-top:-26px;border:1px solid var(--border-soft)}
.layanan-card__icon .icon{width:28px;height:28px}
.check-list .icon{color:var(--green);--ic-d:var(--sage);--ic-d-o:.55}
.check-list--lg .icon{width:24px;height:24px;padding:0;background:none;margin-top:1px}
.trust__list .icon{width:28px;height:28px;color:var(--green)}
.chip .icon{color:var(--green-mid);--ic-d:var(--green-mid)}
.chip.is-active .icon{color:#fff;--ic-d:#fff}
.star-card__badge,.star-card__list .icon,.footer-contact .icon,.topbar__info .icon,.price-card--accent .icon{--ic-d:currentColor;--ic-d-o:.25}
.empty__icon{background:none;border:1px solid var(--border);color:var(--green)}
.empty__icon .icon{width:36px;height:36px}
.btn .icon,.wa-float .icon,.hero__wa .icon{--ic-d:currentColor;--ic-d-o:.25}

/* ============================================================ motion v2 (halus & elegan)
   Satu bahasa gerak: masuk = --m-out (expo-out), hover = --m-soft; durasi
   --m-t1..t4; jeda --m-step. Hanya transform/translate/scale/opacity/
   clip-path/filter. Status tersembunyi HANYA di bawah .js-motion (dipasang
   skrip <head> bila gerak diizinkan; dicabut lagi bila site.js gagal dalam
   2,5 dtk) -> tanpa JS / reduced motion semua konten langsung terlihat. */
@keyframes fxRise{from{opacity:0;translate:0 var(--m-rise)}}
@keyframes fxRiseSm{from{opacity:0;translate:0 10px}}
/* Teks/gambar di kepala halaman = kandidat LCP: TANPA opacity (animasi opacity
   menunda LCP sampai animasi selesai); cukup fokus dari blur + naik sedikit. */
@keyframes fxHead{from{translate:0 .3em;filter:blur(7px)}}
@keyframes fxFocus{from{translate:0 12px;filter:blur(4px)}}
@keyframes fxSlide{from{translate:-12px 0;filter:blur(3px)}}
@keyframes fxScale{from{scale:.85;filter:blur(4px)}}
@keyframes fxLine{from{scale:0 1}}
@keyframes fxPop{from{opacity:0;scale:.82}}
@keyframes fxImg{from{scale:1.08;clip-path:inset(5% 5% 5% 5% round 18px)}to{scale:1;clip-path:inset(0 0 0 0 round 0)}}

/* ---- transisi antar halaman (View Transitions lintas dokumen; browser lain: pindah biasa) */
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
}
.site-header{view-transition-name:site-header}
.wa-float{view-transition-name:wa-float}
::view-transition-group(*){animation-duration:.5s;animation-timing-function:var(--m-out)}
::view-transition-old(root){animation:vtOut .25s var(--m-soft) both}
::view-transition-new(root){animation:vtIn .55s var(--m-out) .06s both}
@keyframes vtOut{to{opacity:0;translate:0 -10px}}
@keyframes vtIn{from{opacity:0;translate:0 16px}}
/* Bilah muat tipis saat tautan diklik (site.js, setelah 150 ms agar tidak berkedip) */
html.is-navigating body::before{content:"";position:fixed;z-index:300;left:0;top:0;width:100%;height:3px;background:linear-gradient(90deg,var(--orange-brand),var(--orange-light));transform-origin:0 50%;animation:fxLoad 8s cubic-bezier(.08,.82,.17,1) forwards;pointer-events:none}
@keyframes fxLoad{from{scale:0 1}to{scale:.94 1}}

/* ---- bilah progres baca (dibuat site.js di halaman panjang) */
.scroll-progress{position:fixed;z-index:101;left:0;top:0;width:100%;height:3px;background:linear-gradient(90deg,var(--orange-brand),var(--orange-light));transform-origin:0 50%;transform:scaleX(0);pointer-events:none}
@supports (animation-timeline:scroll()){
  .scroll-progress{animation:fxGrow linear both;animation-timeline:scroll(root)}
}
@keyframes fxGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* ---- header: mengecil saat scroll TANPA mengubah tinggi tata letak (tanpa CLS):
   latar (::before) diskalakan, isi digeser naik; tinggi kotak header tetap. */
.site-header{background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:0;box-shadow:none;transition:none}
.site-header::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(255,252,246,.94);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid transparent;transform-origin:50% 0;transition:scale var(--m-t2) var(--m-out),box-shadow var(--m-t2) var(--m-soft),border-color var(--m-t2) var(--m-soft),background-color var(--m-t2) var(--m-soft)}
.site-header.is-scrolled{box-shadow:none}
.site-header.is-scrolled::before{box-shadow:0 6px 24px rgba(47,74,56,.08);border-bottom-color:var(--border-soft);background:rgba(255,252,246,.97)}
.brand,.brand__mark,.nav-toggle{transition:translate var(--m-t2) var(--m-out),scale var(--m-t2) var(--m-out)}
@media (prefers-reduced-motion:no-preference){
  .site-header.is-scrolled::before{scale:1 .86}
  .site-header.is-scrolled .brand,.site-header.is-scrolled .nav-toggle{translate:0 calc(var(--header-h) * -.07)}
  .site-header.is-scrolled .brand__mark{scale:.88}
}
@media (min-width:1200px){
  .site-nav{transition:translate var(--m-t2) var(--m-out)}
  .site-header.is-scrolled .site-nav{translate:0 calc(var(--header-h) * -.07)}
}
body.nav-open .site-header::before{scale:none;background:var(--paper);-webkit-backdrop-filter:none;backdrop-filter:none}
body.nav-open .site-header .brand,body.nav-open .site-header .nav-toggle,body.nav-open .site-header .brand__mark{translate:none;scale:none}
@media (max-width:1199px){
  body.nav-open .site-header{background:none;-webkit-backdrop-filter:none;backdrop-filter:none}
  /* menu mobile: buka = navIn + tautan bergiliran; tutup = memudar (display allow-discrete) */
  .js-motion .site-nav{transition:opacity .3s var(--m-soft),translate .35s var(--m-out)}
  .js-motion .site-nav{transition:opacity .3s var(--m-soft),translate .35s var(--m-out),display .35s allow-discrete}
  .js-motion .site-nav:not(.is-open){opacity:0;translate:0 -8px;pointer-events:none}
  .js-motion .site-nav.is-open .site-nav__list > li,.js-motion .site-nav.is-open > .lang-switch,.js-motion .site-nav.is-open > .site-nav__cta{animation:fxRiseSm .5s var(--m-out) backwards;animation-delay:calc(70ms + var(--n,0) * 35ms)}
  .site-nav__list > li:nth-child(2){--n:1}.site-nav__list > li:nth-child(3){--n:2}.site-nav__list > li:nth-child(4){--n:3}
  .site-nav__list > li:nth-child(5){--n:4}.site-nav__list > li:nth-child(6){--n:5}.site-nav__list > li:nth-child(7){--n:6}
  .site-nav__list > li:nth-child(n+8){--n:7}.site-nav > .lang-switch{--n:8}.site-nav > .site-nav__cta{--n:9}
}
.nav-toggle{transition:translate var(--m-t2) var(--m-out),scale var(--m-t2) var(--m-out),background-color var(--m-t1) var(--m-soft),border-color var(--m-t1) var(--m-soft)}
.nav-toggle:hover{border-color:var(--green-mid)}
.nav-toggle.is-used .icon{animation:fxSpin .4s var(--m-out)}
@keyframes fxSpin{from{opacity:0;rotate:-90deg;scale:.6}}

/* ---- pemilih bahasa */
.lang-switch__link{transition:color var(--m-t1) var(--m-soft),background-color var(--m-t1) var(--m-soft),translate var(--m-t1) var(--m-soft)}
@media (hover:hover){.lang-switch__link:not([aria-current="true"]):hover{translate:0 -1px}}

/* ---- hero beranda & kepala halaman: muncul bertahap (CSS saja, sejak frame pertama) */
.js-motion .hero__text > *,.js-motion .page-hero__text > *,.js-motion .page-hero--article .container > *,.js-motion .profile-head > div > *{animation:fxFocus var(--m-t3) var(--m-out) backwards}
.js-motion .page-hero .breadcrumb,.js-motion .page-hero .lang-notice{animation:fxFocus .6s var(--m-out) backwards}
.js-motion :is(.hero__text,.page-hero__text,.page-hero--article .container,.profile-head > div) > :nth-child(2){animation-delay:40ms}
.js-motion :is(.hero__text,.page-hero__text,.page-hero--article .container,.profile-head > div) > :nth-child(3){animation-delay:170ms}
.js-motion :is(.hero__text,.page-hero__text,.page-hero--article .container,.profile-head > div) > :nth-child(4){animation-delay:260ms}
.js-motion :is(.hero__text,.page-hero__text,.page-hero--article .container,.profile-head > div) > :nth-child(5){animation-delay:340ms}
.js-motion :is(.hero__text,.page-hero__text,.page-hero--article .container,.profile-head > div) > :nth-child(n+6){animation-delay:400ms}
/* Judul utama & lead: naik + fokus dari blur, mulai di frame pertama (LCP tidak tertunda). */
.js-motion :is(.hero__title,.page-hero__title){animation:fxHead 1s var(--m-out) backwards}
.js-motion :is(.hero__text,.page-hero__text,.page-hero--article .container,.profile-head > div) > .eyebrow{animation:fxSlide .8s var(--m-out) backwards}
.js-motion .profile-head > .avatar{animation:fxScale .9s var(--m-out) backwards}
.js-motion :is(.page-hero__media .hero__frame,.detail-figure,.article__figure,.contact-photo) > img{animation:fxImg var(--m-t4) var(--m-out) backwards}
.js-motion .hero__visual::before{animation:fxPop 1.2s var(--m-out) .25s backwards;transform-origin:100% 100%}

/* ---- eyebrow: garis aksen yang "tumbuh" (kiri; di kepala tengah juga kanan) */
.eyebrow:not(.eyebrow--sm)::before,.section__head:not(.section__head--left):not(.section__head--row) > .eyebrow::after,.page-hero--center .eyebrow::after{content:"";display:inline-block;width:22px;height:2px;border-radius:2px;background:currentColor;opacity:.75;vertical-align:.3em;margin-right:10px;transform-origin:100% 50%}
.section__head:not(.section__head--left):not(.section__head--row) > .eyebrow::after,.page-hero--center .eyebrow::after{margin:0 0 0 10px;transform-origin:0 50%}
.js-motion :is(.hero__text,.page-hero__text,.page-hero--article .container,.profile-head > div) > .eyebrow::before{animation:fxLine .9s var(--m-out) .25s backwards}
.js-motion :is(.reveal,.rv-g):not(.is-visible) .eyebrow{translate:-10px 0}
.js-motion :is(.reveal,.rv-g):not(.is-visible) .eyebrow::before,.js-motion :is(.reveal,.rv-g):not(.is-visible) .eyebrow::after{scale:0 1}
.js-motion .reveal .eyebrow{transition:translate var(--m-t3) var(--m-out) calc(var(--d,0) * var(--m-step) + 60ms)}
.js-motion .reveal .eyebrow::before,.js-motion .reveal .eyebrow::after{transition:scale .9s var(--m-out) calc(var(--d,0) * var(--m-step) + 280ms)}

/* ---- judul bagian: kata demi kata (site.js membungkus kata ke .sw; nama
   aksesibel tetap utuh lewat aria-label pada judul) */
.sw{display:inline-block}
.js-motion .reveal:not(.is-visible) .sw{opacity:0;translate:0 .45em;filter:blur(4px)}
.js-motion .reveal .sw{--sw-delay:calc(var(--d,0) * var(--m-step) + 90ms + var(--w,0) * 40ms);transition:opacity .7s var(--m-soft) var(--sw-delay),translate .9s var(--m-out) var(--sw-delay),filter .7s var(--m-soft) var(--sw-delay)}

/* ---- anak-anak daftar/kelompok bergiliran (site.js: .rv-c + --j) */
.js-motion :is(.reveal,.rv-g):not(.is-visible) .rv-c{opacity:0;translate:0 12px}
.js-motion .rv-c{--rc-delay:calc(var(--d,0) * var(--m-step) + 120ms + var(--j,0) * 45ms);transition:opacity .7s var(--m-soft) var(--rc-delay),translate .8s var(--m-out) var(--rc-delay)}

/* ---- foto: sapuan clip-path dari bawah + zoom mengendap */
.js-motion :is(.reveal,.rv-g):not(.is-visible) .media > img,.js-motion .rv-m:not(.is-visible) > img{clip-path:inset(100% 0 0 0);scale:1.14}
/* status akhir eksplisit: clip-path tidak bisa diinterpolasi ke 'none' */
.js-motion :is(.reveal,.rv-m) .media > img,.js-motion .rv-m > img{clip-path:inset(0 0 0 0);--im-delay:calc(var(--d,0) * var(--m-step) + 140ms);transition:clip-path var(--m-t4) var(--m-wipe) var(--im-delay),scale 2s cubic-bezier(.3,.6,.25,1) var(--im-delay),transform .9s var(--m-soft)}

/* ---- ikon duotone: garis muncul dulu, lapisan isi (.ic-d) menyusul */
.icon .ic-d{transform-box:fill-box;transform-origin:50% 50%}
.js-motion :is(.reveal,.rv-g):not(.is-visible) .icon .ic-d{opacity:0;scale:.4}
.js-motion :is(.reveal,.rv-g) .icon .ic-d{--ic-delay:calc(var(--d,0) * var(--m-step) + 420ms + var(--j,0) * 45ms);transition:opacity .6s var(--m-soft) var(--ic-delay),scale .9s var(--m-out) var(--ic-delay)}
.js-motion :is(.reveal,.rv-g):not(.is-visible) :is(.feature__icon,.price-card__icon,.layanan-card__icon,.city-card__icon,.contact-item__icon,.star-card__badge) > .icon{opacity:0;scale:.7;rotate:-12deg}
.js-motion :is(.reveal,.rv-g) :is(.feature__icon,.price-card__icon,.layanan-card__icon,.city-card__icon,.contact-item__icon,.star-card__badge) > .icon{--ic2:calc(var(--d,0) * var(--m-step) + 220ms);transition:opacity .6s var(--m-soft) var(--ic2),scale .8s var(--m-out) var(--ic2),rotate .8s var(--m-out) var(--ic2),transform var(--m-t2) var(--m-soft)}
.js-motion .hero__card-icon .ic-d{animation:fxPop .8s var(--m-out) .9s backwards}

/* ---- parallax halus foto bagian (desktop, scroll-driven CSS; lainnya diam) */
@supports (animation-timeline:view()){
  @media (min-width:1024px) and (pointer:fine) and (prefers-reduced-motion:no-preference){
    .split__media .media > img,.mitra-band__media > img{animation:fxParallax linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
  }
}
@keyframes fxParallax{from{transform:translateY(-4.5%) scale(1.12)}to{transform:translateY(4.5%) scale(1.12)}}

/* ---- kartu: terangkat lembut + bayangan + border hangat (hanya perangkat hover) */
.layanan-card,.artikel-card,.worker-card,.city-card,.benefit,.price-card,.step,.testi,.contact-item,.link-grid a,.faq-item,.side-card{transition:var(--m-tx-hover)}
@media (hover:hover){
  :is(.layanan-card,.artikel-card,.worker-card,.city-card,.benefit,.price-card,.testi,.contact-item,.link-grid a,.steps:not(.steps--timeline) .step):hover{transform:translateY(var(--m-lift));box-shadow:0 4px 10px rgba(47,74,56,.06),0 18px 40px rgba(47,74,56,.12);border-color:#DFC9A2}
  .price-card--accent:hover{border-color:var(--green);box-shadow:0 0 0 1px var(--green),0 18px 40px rgba(47,74,56,.14)}
  .faq-item:not([open]):hover{border-color:var(--border)}
  /* ikon kartu: sedikit naik & miring, lapisan duotone menebal */
  :is(.layanan-card__icon,.feature__icon,.price-card__icon,.city-card__icon,.contact-item__icon,.link-grid a) > .icon{transition:transform var(--m-t2) var(--m-out)}
  :is(.layanan-card,.benefit,.feature,.price-card,.city-card,.contact-item):hover :is(.layanan-card__icon,.feature__icon,.price-card__icon,.city-card__icon,.contact-item__icon) > .icon,.link-grid a:hover > .icon{transform:translateY(-2px) rotate(-7deg)}
  :is(.layanan-card,.benefit,.feature,.price-card,.city-card,.contact-item,.link-grid a):hover .icon .ic-d{scale:1.12;opacity:calc(var(--ic-d-o,.2) + .15);transition:scale var(--m-t2) var(--m-out),opacity var(--m-t2) var(--m-soft)}
  .layanan-card__icon{transition:transform var(--m-t2) var(--m-out),box-shadow var(--m-t2) var(--m-soft)}
  .layanan-card:hover .layanan-card__icon{transform:translateY(-3px);box-shadow:var(--shadow)}
}
.layanan-card__media img,.artikel-card__media img{transition:transform .9s var(--m-soft)}
.layanan-card:hover .layanan-card__media img,.artikel-card:hover .artikel-card__media img{transform:scale(1.06)}
.layanan-card__tasks{transition-timing-function:var(--m-out)}

/* ---- tombol: terangkat 1px, panah bergeser, kilau menyapu (primer/WA) */
.btn{position:relative;isolation:isolate;overflow:hidden;transition:background-color var(--m-t1) var(--m-soft),border-color var(--m-t1) var(--m-soft),color var(--m-t1) var(--m-soft),box-shadow var(--m-t2) var(--m-soft),transform .15s var(--m-soft),translate var(--m-t2) var(--m-out)}
.btn > .icon{transition:transform var(--m-t2) var(--m-out)}
.btn--primary::after,.btn--wa::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.24) 50%,transparent 70%);translate:-105% 0;pointer-events:none}
@media (hover:hover){
  .btn:not(.btn--text):hover{translate:0 -1px}
  .btn--primary:hover{box-shadow:0 10px 24px rgba(168,82,28,.3)}
  .btn--secondary:hover,.btn--wa:hover{box-shadow:0 8px 20px rgba(47,74,56,.18)}
  .btn--primary:hover::after,.btn--wa:hover::after{translate:105% 0;transition:translate .9s var(--m-out)}
  .btn:hover > .icon:last-child:not(:first-child),.link-more:hover .icon{transform:translateX(4px)}
  .btn:hover > .icon:first-child:not(:last-child){transform:scale(1.1) rotate(-6deg)}
}
.btn.is-loading::after{display:none}

/* ---- chip, tautan kota, tombol bagikan */
.chip,.city-links a,.share__btn,.social a{transition:background-color var(--m-t1) var(--m-soft),border-color var(--m-t1) var(--m-soft),color var(--m-t1) var(--m-soft),translate var(--m-t2) var(--m-out),box-shadow var(--m-t2) var(--m-soft)}
.chip .icon,.city-links a .icon,.share__btn .icon{transition:transform var(--m-t2) var(--m-out)}
@media (hover:hover){
  .chip:hover,.city-links a:hover,.share__btn:hover,.social a:hover{translate:0 -2px;box-shadow:0 6px 14px rgba(47,74,56,.1)}
  .chip:hover .icon,.share__btn:hover .icon{transform:rotate(-8deg) scale(1.1)}
  .city-links a:hover .icon{transform:translateY(-2px)}
}

/* ---- FAQ: buka/tutup halus (::details-content di atas; lainnya site.js/WAAPI) */
.faq-item summary .faq-item__q{transition:color var(--m-t1) var(--m-soft)}
.faq-item summary:hover .faq-item__q{color:var(--green-mid)}
.faq-item__icon{transition:transform var(--m-t2) var(--m-out),background-color var(--m-t2) var(--m-soft),color var(--m-t2) var(--m-soft)}
@supports selector(::details-content){
  .faq-item::details-content{transition:block-size .45s var(--m-out),opacity .35s var(--m-soft),content-visibility .45s allow-discrete}
}

/* ---- tombol WhatsApp: masuk lembut + denyut halus 3x (hanya halaman pertama sesi) */
@keyframes fxWaIn{from{opacity:0;scale:.6;translate:0 18px}}
@keyframes fxWaPulse{0%{opacity:.5;scale:1}30%,100%{opacity:0;scale:1.55}}
.wa-float::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:#1F7A3F;opacity:0;pointer-events:none}
.wa-float .icon{transition:transform var(--m-t2) var(--m-out)}
.wa-float:hover .icon{transform:rotate(-10deg) scale(1.06)}
.js-motion:not(.is-return) .wa-float{animation:fxWaIn .9s var(--m-out) 1.2s backwards}
.js-motion:not(.is-return) .wa-float::before{animation:fxWaPulse 6s var(--m-soft) 3.4s 3}

/* ---- statistik: garis aksen kiri tumbuh saat masuk */
.js-motion .stat.reveal:not(.is-visible){border-left-color:transparent}
.js-motion .stat.reveal.is-visible{transition:opacity var(--m-t3) var(--m-soft) var(--rv-delay),translate var(--m-t3) var(--m-out) var(--rv-delay),border-color 1s var(--m-soft) calc(var(--rv-delay) + 200ms)}

/* ---- reduced motion & cetak: semua status akhir, tanpa gerak */
@media (prefers-reduced-motion:reduce){
  :is(.layanan-card,.artikel-card,.worker-card,.city-card,.benefit,.price-card,.testi,.contact-item,.link-grid a,.step):hover{transform:none}
  .btn:hover,.chip:hover,.city-links a:hover,.share__btn:hover,.social a:hover,.lang-switch__link:hover{translate:none}
  .btn:hover > .icon,.link-more:hover .icon,.chip:hover .icon,.city-links a:hover .icon,.share__btn:hover .icon,.wa-float:hover .icon,:is(.layanan-card,.benefit,.feature,.price-card,.city-card,.contact-item):hover .icon,.layanan-card:hover .layanan-card__icon{transform:none}
  .btn--primary::after,.btn--wa::after,.scroll-progress{display:none}
}
@media print{
  .rv-c,.sw,.eyebrow{opacity:1!important;translate:none!important;filter:none!important}
  .media > img,.rv-m > img{clip-path:none!important;scale:none!important}
  .scroll-progress{display:none}
}
.corp-strip .btn{white-space:nowrap;flex:none}