/* UI overhaul v2. All page families share the same wifimurah-inspired navigation,
   page spacing, hero shape, responsive cards and responsive menu.
   HTML business copy, package data, routing, and functional form selectors remain unchanged. */
:root{--wm-navy:#0c2461;--wm-deep:#081c47;--wm-red:#ef2334;--wm-ink:#182844;--wm-muted:#61728a;--wm-soft:#f4f7fb;--wm-line:#e5eaf2;--wm-shadow:0 15px 40px rgba(9,31,74,.08)}
body.site-theme{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif!important;background:#fff!important;color:var(--wm-ink)!important}
body.site-theme :is(h1,h2,h3,h4){text-wrap:pretty;letter-spacing:-.035em}
body.site-theme button,body.site-theme a{touch-action:manipulation}
/* Only superseded navigation is hidden; the content and source links are retained. */
body.site-home > header:not(.wm-global-header),
body.site-package > header.site-header,
body.site-region > header.topbar,
body.site-seo > nav.nav,
body.site-editorial > header:not(.wm-global-header),
body.site-info > header:not(.wm-global-header){display:none!important}
/* Unified identity and primary menu on all 47 HTML pages. */
body.site-theme .wm-global-header{display:block!important;position:sticky;top:0;z-index:4000;background:rgba(255,255,255,.975);border-bottom:1px solid var(--wm-line);box-shadow:0 2px 22px rgba(10,32,72,.055);backdrop-filter:blur(17px);-webkit-backdrop-filter:blur(17px);font-size:14px;line-height:1.2}
body.site-theme .wm-global-inner{max-width:1180px;min-height:76px;margin:auto;padding:10px 22px;display:flex;align-items:center;justify-content:space-between;gap:20px}
body.site-theme .wm-brand{flex:0 0 auto;display:flex;align-items:center;gap:10px;text-decoration:none!important;color:var(--wm-navy)!important;background:none!important;font-weight:900;letter-spacing:.07em;font-size:13px}
body.site-theme .wm-brand img{width:103px;height:42px;object-fit:contain;display:block}
body.site-theme .wm-brand span{padding:5px 0 4px 10px;border-left:1px solid #dce3ed;white-space:nowrap}
body.site-theme .wm-main-navigation{display:flex;align-items:center;justify-content:center;gap:3px;flex-wrap:nowrap;margin-left:auto}
body.site-theme .wm-main-navigation a{color:#354968!important;background:transparent!important;text-decoration:none!important;font-size:13px!important;font-weight:750!important;padding:12px 12px!important;border-radius:12px;white-space:nowrap;transition:background-color .18s,color .18s}
body.site-theme .wm-main-navigation a:hover,body.site-theme .wm-main-navigation a.wm-active{background:#fff0f1!important;color:#d61b2a!important}
body.site-theme .wm-global-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:0 0 auto;border:1px solid var(--wm-red)!important;background:var(--wm-red)!important;color:#fff!important;text-decoration:none!important;border-radius:999px!important;padding:14px 18px!important;font-size:12.5px!important;font-weight:800!important;line-height:1.2!important;white-space:nowrap;box-shadow:none!important}
body.site-theme .wm-global-cta:hover{background:#cd1928!important;border-color:#cd1928!important}
body.site-theme .wm-menu-toggle{display:none;flex:0 0 44px;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;padding:0;background:#fff;border:1px solid var(--wm-line);border-radius:12px;cursor:pointer}
body.site-theme .wm-menu-toggle span{width:20px;height:2px;border-radius:3px;background:var(--wm-navy);transition:transform .18s,opacity .18s}
body.site-theme .wm-menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(7px) rotate(45deg)}
body.site-theme .wm-menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
body.site-theme .wm-menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-7px) rotate(-45deg)}
/* Preserve the regional intra-page section nav as a quieter second bar. */
body.site-region .wm-local-nav{background:#fff;position:relative;z-index:2;border-bottom:1px solid var(--wm-line)}
body.site-region .wm-local-links{width:min(1180px,calc(100% - 40px));margin:auto;display:flex;justify-content:center;align-items:center;gap:10px;min-height:50px;overflow-x:auto;scrollbar-width:none}
body.site-region .wm-local-links::-webkit-scrollbar{display:none}
body.site-region .wm-local-links a{white-space:nowrap;font-size:12.5px;font-weight:750;text-decoration:none;color:#52627e;padding:8px 14px;border-radius:100px}
body.site-region .wm-local-links a:hover{background:#fff0f1;color:#d21c2c}
/* Sections and cards across all layouts */
body.site-theme :is(.container,.shell,.wrap){max-width:1180px}
body.site-theme :is(.section,.catalog,.guide,.faq){scroll-margin-top:90px}
body.site-theme :is(.section-alt,.section.alt,.section-soft){background:#f5f7fb}
body.site-theme :is(.feature-card,.fitur-item,.area-card,.card,.pkg,.rpc-card,.tip-card,.help-card,.faq-item,.step,.trust-card,.value-card,.addon-card){border-radius:20px;box-shadow:var(--wm-shadow);border-color:var(--wm-line)}
body.site-theme :is(.section-title,.section-head h2,.section-heading h2){font-weight:850;letter-spacing:-.04em;line-height:1.18;color:var(--wm-ink)}
body.site-theme :is(.section-subtitle,.section-head p,.section-heading p,.lead){color:var(--wm-muted)}
body.site-theme :is(.eyebrow,.hero-chip,.hero-eyebrow,.section-tag,.help-badge,.privacy-badge,.disclaimer-badge){border-radius:999px}
body.site-theme :is(.btn-main,.btn-primary,.button-red,.btn-red,.btn.primary,.wm-red-btn){background:var(--wm-red)!important;color:#fff!important;border-color:var(--wm-red)!important;border-radius:12px}
body.site-theme :is(.btn-main,.btn-primary,.button-red,.btn-red,.btn.primary,.wm-red-btn):hover{background:#ce1c2c!important}
body.site-theme :is(.footer,.site-footer){background:var(--wm-deep)!important;color:#dee8f6!important}
body.site-theme :is(.footer,.site-footer) :is(a,p,small,li){color:#d5dff1}
body.site-theme :is(.footer,.site-footer) a:hover{color:#fff}
/* Page-specific improvements, not homepage-only. */
body.site-package .package-hero{padding-top:0!important;background:linear-gradient(120deg,#091d49,#17377b)!important}
body.site-package .package-hero .hero-inner{min-height:600px}
body.site-package .catalog{background:#f5f7fb!important}
body.site-package .package-toolbar{border:1px solid var(--wm-line);border-radius:20px;padding:16px;background:#fff;box-shadow:var(--wm-shadow)}
body.site-package .pkg{background:#fff;border:1px solid var(--wm-line)}
body.site-package .pkg .price strong{color:var(--wm-red)}
body.site-package .tip-number{background:#fff0f1;color:#dc2232}
body.site-region .hero{background:linear-gradient(120deg,#091d49,#17377b)!important}
body.site-region .hero-wrap{padding-top:70px;padding-bottom:70px}
body.site-region .hero-card{box-shadow:0 18px 45px rgba(3,17,50,.19)}
body.site-region .hero-card :is(p,li){color:#52627a}
body.site-region .section{padding-top:80px;padding-bottom:80px}
body.site-region .rpc-card{background:#fff;border:1px solid var(--wm-line)}
/* Directory, blog hub and add-on subpages: typographic split hero and catalog cards */
body.site-seo > header.hero{position:relative;isolation:isolate;min-height:350px;overflow:hidden;background:linear-gradient(119deg,#091d49,#15357d)!important;padding:75px 0!important}
body.site-seo > header.hero::before{content:"";position:absolute;z-index:-1;width:520px;height:520px;right:-170px;top:-260px;background:rgba(255,255,255,.045);border-radius:50%}
body.site-seo > header.hero::after{content:"";position:absolute;z-index:-1;width:270px;height:270px;right:8%;bottom:-205px;border-radius:50%;border:45px solid rgba(255,255,255,.04)}
body.site-seo > header.hero .wrap{position:relative;z-index:1}
body.site-seo > header.hero h1{max-width:880px!important;margin:20px 0!important;text-align:left!important;font-size:clamp(34px,4.6vw,58px)!important}
body.site-seo > header.hero p{max-width:745px!important;font-size:16px!important;line-height:1.8!important}
body.site-seo > header.hero .actions{margin-top:24px}
body.site-seo main section{padding-top:80px!important;padding-bottom:80px!important}
body.site-seo .grid{gap:22px}
body.site-seo .card{padding:28px!important;border:1px solid var(--wm-line)!important;background:#fff}
body.site-seo .card h2,body.site-seo .card h3{line-height:1.3}
body.site-seo .card a:not(.btn){color:#bd1b29}
body.site-seo .cta{padding:38px!important;border-radius:24px}
/* Guides and individual articles */
body.site-editorial main.article-page{background:#f5f7fb!important;padding-top:65px!important;padding-bottom:76px!important}
body.site-editorial .article-header{overflow:hidden;isolation:isolate;padding:50px 54px!important;background:linear-gradient(122deg,#091d49,#17377b)!important;margin-bottom:36px!important}
body.site-editorial .article-header::before{content:"";position:absolute;z-index:-1;width:400px;height:400px;border-radius:50%;background:rgba(255,255,255,.04);right:-100px;top:-200px}
body.site-editorial .article-header::after{content:"";position:absolute;z-index:-1;width:230px;height:230px;border:35px solid rgba(255,255,255,.035);border-radius:50%;right:-90px;bottom:-150px}
body.site-editorial .article-header h1{max-width:990px;margin-inline:0;text-align:left}
body.site-editorial .article-header p{max-width:825px;margin-inline:0;text-align:left}
body.site-editorial .article-content{background:#fff!important;padding:44px!important}
body.site-editorial .article-content .toc{border-radius:20px;background:#f5f7fb}
body.site-editorial .article-content blockquote{border-left:4px solid var(--wm-red);border-radius:0 14px 14px 0;background:#f5f7fb}
body.site-editorial .article-nav-bottom{border-color:var(--wm-line)}
/* Static information pages incl. bantuan, profil, disclaimer and privacy */
body.site-info :is(.hero,.help-hero,.privacy-hero,.disclaimer-hero){position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(120deg,#091d49,#17377b)!important;color:#fff!important;padding-top:72px!important;padding-bottom:72px!important;min-height:310px!important}
body.site-info :is(.hero,.help-hero,.privacy-hero,.disclaimer-hero)::after{content:"";z-index:-1;position:absolute;right:-170px;top:-210px;width:450px;height:450px;border-radius:50%;background:rgba(255,255,255,.045)}
body.site-info :is(.hero,.help-hero,.privacy-hero,.disclaimer-hero) :is(h1,h2){color:#fff!important;text-align:center}
body.site-info :is(.hero,.help-hero,.privacy-hero,.disclaimer-hero) p{color:rgba(255,255,255,.82)!important}
body.site-info .hero-image-wrapper{opacity:.14!important}
body.site-info :is(.section,.privacy-layout,.disclaimer-layout){scroll-margin-top:80px}
body.site-info .section{padding-top:78px;padding-bottom:78px}
body.site-info :is(.help-badge,.privacy-badge,.disclaimer-badge){background:rgba(255,255,255,.12)!important;color:#fff!important;border:1px solid rgba(255,255,255,.24)!important}
body.site-info :is(.card,.help-card,.faq-item){border:1px solid var(--wm-line);background:#fff}
/* Keep small screens without horizontal overflow. */
@media(max-width:1100px){
 body.site-theme .wm-global-inner{gap:10px;padding-inline:16px}
 body.site-theme .wm-main-navigation a{font-size:12px!important;padding:10px 9px!important}
 body.site-theme .wm-brand img{width:95px}
 body.site-theme .wm-brand span{font-size:11px}
 body.site-theme .wm-global-cta{padding:12px 14px!important;font-size:11px!important}
}
@media(max-width:920px){
 body.site-theme .wm-global-inner{min-height:69px;position:relative;flex-wrap:nowrap}
 body.site-theme .wm-main-navigation{display:none;position:absolute;top:calc(100% + 1px);left:0;right:0;z-index:50;background:#fff;border:1px solid var(--wm-line);border-top:0;border-radius:0 0 18px 18px;box-shadow:0 18px 30px rgba(9,31,74,.14);padding:14px;align-items:stretch;flex-direction:column;gap:4px;margin:0}
 body.site-theme .wm-main-navigation.wm-menu-open{display:flex}
 body.site-theme .wm-main-navigation a{display:block;width:100%;font-size:14px!important;padding:13px 15px!important}
 body.site-theme .wm-menu-toggle{display:flex}
 body.site-theme .wm-global-cta{margin-left:auto}
 body.site-region .wm-local-links{justify-content:flex-start}
 body.site-region .section{padding-block:64px}
}
@media(max-width:650px){
 body.site-theme .wm-global-inner{min-height:64px;padding:8px 14px;gap:9px}
 body.site-theme .wm-brand img{width:85px;height:35px}
 body.site-theme .wm-brand span{font-size:10px;padding-left:7px}
 body.site-theme .wm-global-cta{padding:10px 10px!important;font-size:10.5px!important;border-radius:12px!important}
 body.site-theme .wm-global-cta span{display:none}
 body.site-theme .wm-menu-toggle{flex-basis:40px;height:40px;width:40px}
 body.site-seo > header.hero{min-height:0;padding:51px 0!important}
 body.site-seo > header.hero h1{font-size:clamp(31px,8.7vw,43px)!important}
 body.site-seo main section{padding-block:54px!important}
 body.site-seo .grid{grid-template-columns:1fr!important}
 body.site-seo .card{padding:22px!important}
 body.site-editorial main.article-page{padding-top:28px!important}
 body.site-editorial .article-header{padding:31px 23px!important;border-radius:20px}
 body.site-editorial .article-content{padding:25px 20px!important;border-radius:20px}
 body.site-editorial .article-header h1{font-size:clamp(28px,8vw,38px)!important}
 body.site-region .wm-local-links{width:calc(100% - 20px);gap:2px}
 body.site-region .wm-local-links a{padding:9px 11px;font-size:12px}
 body.site-region .hero-wrap{padding-block:46px}
 body.site-region .section{padding-block:55px}
 body.site-package .package-hero .hero-inner{min-height:0}
 body.site-package .package-toolbar{padding:12px}
 body.site-info :is(.hero,.help-hero,.privacy-hero,.disclaimer-hero){min-height:0!important;padding-block:48px!important}
 body.site-info .section{padding-block:54px}
}
@media(max-width:370px){
 body.site-theme .wm-brand span{display:none}
 body.site-theme .wm-global-cta{font-size:10px!important}
}
@media(prefers-reduced-motion:reduce){body.site-theme .wm-main-navigation a,body.site-theme .wm-menu-toggle span{transition:none}}
/* Preserve the poster's natural ratio on narrow screens; the old 675px fixed image
   box left several hundred pixels of blank navy space before the actual artwork. */
@media(max-width:950px){
 body.site-package .hero-poster{height:auto!important;min-height:0!important;padding-top:0!important;padding-bottom:26px!important;display:flex;align-items:flex-start!important;justify-content:center!important}
 body.site-package .hero-poster img{display:block;width:100%!important;max-width:550px!important;height:auto!important;aspect-ratio:auto!important;object-fit:contain!important}
 body.site-package .hero-copy-wrap{padding-bottom:18px!important}
}
/* Profil uses the same two-column marketing hero as the reference: copy + agent card. */
@media(min-width:861px){
 body.site-info .about-hero .hero-shell{display:grid!important;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)!important;gap:56px!important;align-items:center!important;justify-items:stretch!important;min-height:580px!important;max-width:1180px;padding:85px 22px!important}
 body.site-info .about-hero .hero-left{max-width:none!important;margin:0!important;text-align:left!important}
 body.site-info .about-hero .hero-left h1,body.site-info .about-hero .hero-left p{text-align:left!important;margin-left:0!important;margin-right:0!important}
 body.site-info .about-hero .hero-left h1{font-size:clamp(36px,4.5vw,58px)!important;line-height:1.1!important}
 body.site-info .about-hero .hero-actions{justify-content:flex-start!important}
 body.site-info .about-hero .hero-right{justify-content:flex-end!important;width:100%}
 body.site-info .about-hero .hero-panel{max-width:450px!important}
}
body.site-info .about-hero .hero-panel{background:#fff!important;color:#172744!important;border:1px solid #e5eaf2!important;border-radius:24px!important;box-shadow:0 22px 48px rgba(3,17,50,.19)!important}
body.site-info .about-hero .hero-panel :is(h2,h3,h4){color:#172744!important}
body.site-info .about-hero .hero-panel :is(p,.hero-panel-item){color:#56657b!important}
body.site-info .about-hero .hero-panel .hero-mini-label{color:#df1f30!important}
body.site-info .about-hero .hero-panel .hero-panel-cta{color:#fff!important;background:#ef2334!important;border-radius:13px!important}
body.site-info .about-hero .hero-left .section-tag{background:rgba(255,255,255,.085)!important;color:#fff!important;border:1px solid rgba(255,255,255,.23)!important}
@media(max-width:860px){
 body.site-info .about-hero .hero-shell{display:grid!important;grid-template-columns:1fr!important;gap:24px!important;min-height:0!important;padding:48px 20px!important}
 body.site-info .about-hero .hero-right{width:100%;justify-content:center!important}
 body.site-info .about-hero .hero-panel{max-width:570px!important;margin:0!important}
 body.site-info .about-hero .hero-left{max-width:650px}
 body.site-info .about-hero .hero-left h1{font-size:clamp(32px,8vw,44px)!important}
}