:root{
    --vul-white:#FFFFFF;
    --vul-gold:#B8912F;
    --vul-gold-dark:#9C7A26;
    --vul-gold-light:#F3E9D2;
    --vul-ink:#1B2622;
    --vul-ink-soft:#3A4440;
    --vul-gray:#6B7280;
    --vul-border:#E7E1CE;
    --vul-bg-alur:url(../images/bg-alur.webp);
    --vul-corner-left:url(../images/corner-left.webp);
    --vul-corner-right:url(../images/corner-right.webp);
    --vul-bg-biaya:url(../images/bg-biaya.webp);

    
    --vul-wrap-px: clamp(20px, 5vw, 32px);
    --vul-section-py: clamp(48px, 8vw, 88px);
    --vul-gap-lg: clamp(24px, 4vw, 56px);
    --vul-gap-md: clamp(16px, 3vw, 24px);
    --vul-gap-sm: clamp(10px, 2vw, 16px);
    --vul-card-pad: clamp(24px, 4vw, 40px);
    --vul-hero-overlap: clamp(22px, 2.6vw, 30px); 
  }
.vul-landing, .vul-landing *{box-sizing:border-box; margin:0; padding:0;}
.vul-landing{
    font-family:'Readex Pro', sans-serif;
    background:var(--vul-white);
    color:var(--vul-ink);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
.vul-landing h1, .vul-landing h2, .vul-landing h3, .vul-landing h4{
    font-family:"Calistoga",serif;
    font-weight:500;
    line-height:1.2;
    color:var(--vul-ink);
  }
.vul-landing a{text-decoration:none !important; color:inherit;}
.vul-landing a:hover, .vul-landing a:focus, .vul-landing a:active, .vul-landing a:visited{text-decoration:none !important;}
.vul-landing img{max-width:100%; display:block;}
.vul-landing .wrap{max-width:1200px; margin:0 auto; padding:0 var(--vul-wrap-px);}
.vul-landing .placeholder-img{
    background:repeating-linear-gradient(45deg, #EFE6CE, #EFE6CE 10px, #E8DCC0 10px, #E8DCC0 20px);
    display:flex; align-items:center; justify-content:center;
    color:var(--vul-gold-dark); font-size:12px; text-align:center; padding:16px;
    border:1px dashed var(--vul-gold);
  }
.vul-landing section .wrap{padding-top:var(--vul-section-py); padding-bottom:var(--vul-section-py);}
.vul-landing .section-separator{width:100%; height:1px; background:var(--vul-border);}
.vul-landing .hero .wrap{
    position:relative;
    min-height:clamp(560px, 54vw, 720px); padding:clamp(40px, 6vw, 76px);
    display:flex; align-items:center;
  }
.vul-landing .hero .wrap::before{
    content:"";
    position:absolute; top:0; left:0; right:0; bottom:calc(-1 * var(--vul-hero-overlap)); z-index:0;
    background-image:
      linear-gradient(90deg, rgba(255,255,255,.6) 0%, rgba(255,255,255,0) 18%, rgba(255,255,255,0) 82%, rgba(255,255,255,.55) 100%),
      linear-gradient(180deg, rgba(255,255,255,0) 74%, rgba(255,255,255,.85) 100%),
      url('../images/background-header-hero.webp');
    background-size:cover; background-position:center;
    mask-image:
      linear-gradient(90deg, transparent 0%, black 10%, black 90%, transparent 100%),
      linear-gradient(180deg, transparent 0%, black 14%, black 82%, transparent 100%);
    mask-composite:intersect;
    -webkit-mask-image:
      linear-gradient(90deg, transparent 0%, black 10%, black 90%, transparent 100%),
      linear-gradient(180deg, transparent 0%, black 14%, black 82%, transparent 100%);
    -webkit-mask-composite:source-in;
  }
.vul-landing .hero .wrap::after{
    content:"";
    position:absolute; inset:0; z-index:0; pointer-events:none;
    background-image:linear-gradient(90deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.55) 40%, rgba(255,255,255,0) 62%);
  }
.vul-landing .hero-copy{position:relative; z-index:1; width:min(46%, 500px);}
.vul-landing .eyebrow{
    display:inline-flex; align-items:center; gap:6px;
    background:var(--vul-gold-light); color:var(--vul-gold-dark);
    font-size:11px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase;
    padding:8px 16px; border-radius:20px; margin-bottom:clamp(14px, 2vw, 18px);
  }
.vul-landing .hero h1{font-size:clamp(32px, 4.5vw, 56px); margin-bottom:clamp(18px, 2.5vw, 26px);}
.vul-landing .hero h1 .accent{color:var(--vul-gold); display:block;}
.vul-landing .hero p.lead{
    font-size:15px; color:var(--vul-ink); max-width:460px; margin-bottom:clamp(24px, 3vw, 32px); font-weight:500;
    text-shadow:0 1px 12px rgba(255,255,255,.8), 0 1px 2px rgba(255,255,255,.9);
  }
.vul-landing .feature-row{display:flex; margin-bottom:clamp(28px, 3.5vw, 36px); flex-wrap:wrap; gap:var(--vul-gap-sm) 0;}
.vul-landing .feature-item{
    display:flex; flex-direction:column; gap:10px; max-width:120px;
    padding:0 var(--vul-gap-sm);
  }
.vul-landing .feature-item:first-child{border-left:none; padding-left:0;}
.vul-landing .feature-item i{font-size:22px; color:var(--vul-gold-dark); text-shadow:0 1px 10px rgba(255,255,255,.85);}
.vul-landing .feature-item span{
    font-size:12.5px; font-weight:600; color:var(--vul-ink-soft); line-height:1.35;
    text-shadow:0 1px 10px rgba(255,255,255,.85), 0 1px 2px rgba(255,255,255,.9);
  }
.vul-landing .btn-row{display:flex; gap:var(--vul-gap-sm); flex-wrap:wrap;}
.vul-landing .btn-row .btn{flex:1 1 200px;}
.vul-landing .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    font-family:'Readex Pro', sans-serif; font-weight:600; font-size:13.5px;
    padding:15px 26px; border-radius:9px; transition:transform .15s ease, box-shadow .15s ease;
    cursor:pointer; border:1px solid transparent; white-space:nowrap;
  }
.vul-landing .btn:hover{transform:translateY(-2px);}
.vul-landing .btn-primary{background:var(--vul-gold); color:#fff; box-shadow:0 8px 20px -8px rgba(184,145,47,.6);}
.vul-landing .btn-outline{background:var(--vul-gray); border-color:var(--vul-ink); color:var(--vul-white); opacity: 0.7;}
.vul-landing .btn i{font-size:14px;}
.vul-landing .trust-bar{
    background:var(--vul-white); border-radius:18px; padding:var(--vul-gap-md) var(--vul-card-pad);
    display:grid; grid-template-columns:repeat(4,1fr);
    box-shadow:0 20px 50px -25px rgba(20,30,25,.15);
    border:1px solid var(--vul-border);
    margin-top:8px;
  }
.vul-landing .trust-item{
    display:flex; gap:14px; align-items:flex-start;
    padding:0 var(--vul-gap-sm); border-left:1px solid var(--vul-border);
  }
.vul-landing .trust-item:first-child{border-left:none; padding-left:0;}
.vul-landing .trust-item .icon-circle{
    width:42px; height:42px; border-radius:50%;
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
  }
.vul-landing .trust-item .icon-circle i{font-size:32px; color:var(--vul-gold-dark);}
.vul-landing .trust-item h4{font-size:14.5px; margin-bottom:4px;}
.vul-landing .trust-item p{font-size:14px; color:var(--vul-gray); font-weight:300;}
.vul-landing .section-head{text-align:center; max-width:520px; margin:0 auto var(--vul-gap-lg);}
.vul-landing .section-head h2{font-size:clamp(24px, 3vw, 34px); margin-bottom:14px;}
.vul-landing .section-head p{font-size:16px; color:var(--vul-gray); margin-top:14px; font-weight:300;}
.vul-landing .divider, .vul-landing .divider-standalone{
    display:flex; align-items:center; justify-content:center; gap:10px;
  }
.vul-landing .divider-img{width:140px; height:auto; display:block;}
.vul-landing #alur-proses{
    position:relative;
    isolation:isolate;
  }
.vul-landing #alur-proses::before{
    content:"";
    position:absolute; inset:0; z-index:-1; pointer-events:none;
    background-image:var(--vul-bg-alur);
    background-repeat:repeat-x;
    background-position:top center;
    mask-image:linear-gradient(90deg, transparent 0%, black 12%, black 88%, transparent 100%);
    -webkit-mask-image:linear-gradient(90deg, transparent 0%, black 12%, black 88%, transparent 100%);
  }
.vul-landing #biaya{
    position:relative;
    isolation:isolate;
  }
.vul-landing #biaya::before{
    content:"";
    position:absolute; inset:0; z-index:-1; pointer-events:none;
    background-image:var(--vul-bg-biaya);
    background-repeat:repeat-x;
    background-position:top center;
    mask-image:linear-gradient(90deg, transparent 0%, black 12%, black 88%, transparent 100%);
    -webkit-mask-image:linear-gradient(90deg, transparent 0%, black 12%, black 88%, transparent 100%);
  }
.vul-landing .services-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--vul-gap-md);}
.vul-landing .service-card{
    position:relative; background:var(--vul-white); border:1px solid var(--vul-border);
    border-radius:14px; padding:var(--vul-card-pad) var(--vul-gap-md); text-align:center;
  }
.vul-landing .card-corner{position:absolute; width:32px; height:32px; background-repeat:no-repeat; background-size:contain; pointer-events:none; z-index:2;}
.vul-landing .card-corner.tl{top:4px; left:4px; background-image:var(--vul-corner-left);}
.vul-landing .card-corner.tr{top:4px; right:4px; background-image:var(--vul-corner-right);}
.vul-landing .service-icon{
    display:flex; align-items:center; justify-content:center; margin:0 auto 22px;
  }
.vul-landing .service-icon i{font-size:44px; color:var(--vul-gold-dark);}
.vul-landing .service-card h3{font-size:17px; margin-bottom:10px;}
.vul-landing .service-card p{font-size:15px; color:var(--vul-gray); font-weight:300;}
.vul-landing .process-row{display:grid; grid-template-columns:repeat(5,1fr); gap:var(--vul-gap-md) 0; position:relative;}
.vul-landing .process-step{text-align:center; padding:0 10px; position:relative;}
.vul-landing .process-step .ring-wrap{position:relative; width:76px; height:76px; margin:0 auto 18px;}
.vul-landing .process-step .icon-ring{
    width:76px; height:76px; border-radius:50%; border:1.5px solid var(--vul-border);
    display:flex; align-items:center; justify-content:center;
    background:var(--vul-white); position:relative; z-index:2;
  }
.vul-landing .process-step .icon-ring i{font-size:26px; color:var(--vul-gold-dark);}
.vul-landing .process-step .num{
    position:absolute; top:-6px; left:-6px; z-index:3;
    width:26px; height:26px; border-radius:50%; background:var(--vul-gold); color:#fff;
    font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center;
    border:2px solid var(--vul-white);
  }
.vul-landing .process-step h4{font-size:17px; margin-bottom:8px;}
.vul-landing .process-step p{font-size:14px; color:var(--vul-gray); font-weight:300;}
.vul-landing .process-step::after{
    content:''; position:absolute; top:38px; left:calc(50% + 38px); width:calc(100% - 76px);
    height:0; border-top:2px dashed var(--vul-border); z-index:1;
  }
.vul-landing .process-step:last-child::after{display:none;}
.vul-landing .testi-heading{max-width:340px;}
.vul-landing .testi-heading .divider{justify-content:flex-start; margin-top:14px;}
.vul-landing .testi-top{display:flex; justify-content:space-between; align-items:flex-end; gap:var(--vul-gap-md); margin-bottom:var(--vul-gap-lg); flex-wrap:wrap;}
.vul-landing .testi-top h2{font-size:clamp(22px, 2.6vw, 30px);}
.vul-landing .testi-top p{font-size:13px; color:var(--vul-gray); max-width:340px; font-weight:300;}
.vul-landing .testi-viewport{overflow:hidden; width:100%; touch-action:pan-y;}
.vul-landing .testi-track{display:flex; gap:var(--vul-gap-md); transition:transform .5s cubic-bezier(.4,0,.2,1); cursor:grab; user-select:none;}
.vul-landing .testi-track.dragging{transition:none; cursor:grabbing;}
.vul-landing .testi-card{
    flex:0 0 calc((100% - 2*var(--vul-gap-md))/3); box-sizing:border-box;
    background:var(--vul-white); border-radius:14px; padding:var(--vul-gap-md); border:1px solid var(--vul-border);
  }
.vul-landing .stars{color:var(--vul-gold); font-size:12px; margin-bottom:12px; letter-spacing:3px;}
.vul-landing .testi-card p.quote{font-size:13px; color:var(--vul-ink-soft); margin-bottom:20px; min-height:60px; font-weight:300;}
.vul-landing .testi-person .name{font-size:13px; font-weight:700;}
.vul-landing .testi-person .city{font-size:11px; color:var(--vul-gray); font-weight:300; margin-top:2px;}
.vul-landing .dots{display:flex; gap:8px; justify-content:center; margin-top:var(--vul-gap-md); flex-wrap:wrap;}
.vul-landing .dots span{width:7px; height:7px; border-radius:50%; background:var(--vul-border); cursor:pointer; transition:background .2s ease, transform .2s ease;}
.vul-landing .dots span.active{background:var(--vul-gold); transform:scale(1.2);}
.vul-landing .gallery-wrap{width:100%;}
.vul-landing .gallery-viewport{overflow:hidden; width:100%; touch-action:pan-y;}
.vul-landing .gallery-track{display:flex; gap:18px; transition:transform .5s cubic-bezier(.4,0,.2,1); cursor:grab; user-select:none;}
.vul-landing .gallery-track.dragging{transition:none; cursor:grabbing;}
.vul-landing .gallery-card{
    flex:0 0 236px; height:420px; border-radius:16px;
    position:relative; background:var(--vul-white);
    box-shadow:inset 0 0 0 1px var(--vul-border);
  }
.vul-landing .gallery-card-clip{
    width:100%; height:100%; border-radius:16px; overflow:hidden;
  }
.vul-landing .gallery-card img{width:100%; height:100%; object-fit:cover; display:block; pointer-events:none;}
.vul-landing .lightbox{
    position:fixed; inset:0; background:rgba(20,15,10,.92); display:none;
    align-items:center; justify-content:center; z-index:999; padding:40px 16px;
  }
.vul-landing .lightbox.open{display:flex;}
.vul-landing .lightbox-img{max-height:90vh; max-width:90vw; border-radius:10px; box-shadow:0 20px 60px rgba(0,0,0,.4); display:block;}
.vul-landing .lightbox-close{
    position:absolute; top:20px; right:24px; background:none; border:none;
    color:#fff; font-size:32px; line-height:1; cursor:pointer;
  }
.vul-landing .lightbox-prev, .vul-landing .lightbox-next{
    position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.14);
    border:none; color:#fff; width:44px; height:44px; border-radius:50%; cursor:pointer; font-size:15px;
  }
.vul-landing .lightbox-prev:hover, .vul-landing .lightbox-next:hover, .vul-landing .lightbox-close:hover{background:rgba(255,255,255,.24); color:#fff;}
.vul-landing .lightbox-close:hover{background:none; opacity:.7;}
.vul-landing .lightbox-prev{left:20px;}
.vul-landing .lightbox-next{right:20px;}
.vul-landing .requirements-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:var(--vul-gap-md);}
.vul-landing .requirement-card{
    background:var(--vul-white); border:1px solid var(--vul-border); border-radius:14px;
    padding:var(--vul-gap-md) var(--vul-gap-sm); text-align:center;
  }
.vul-landing .requirement-icon{
    display:flex; align-items:center; justify-content:center; margin:0 auto 16px;
  }
.vul-landing .requirement-icon i{font-size:40px; color:var(--vul-gold-dark);}
.vul-landing .requirement-card h4{font-size:17px; margin-bottom:6px;}
.vul-landing .requirement-card p{font-size:14px; color:var(--vul-gray); font-weight:300;}
.vul-landing .biaya-grid{
    display:grid; grid-template-columns:repeat(2,1fr); gap:var(--vul-gap-md);
    max-width:820px; margin:0 auto;
  }
.vul-landing .biaya-card{
    position:relative; background:var(--vul-white); border:1px solid var(--vul-border); border-radius:16px;
    padding:var(--vul-card-pad); text-align:center; display:flex; flex-direction:column; align-items:center;
  }
.vul-landing .biaya-icon{
    display:flex; align-items:center; justify-content:center; margin-bottom:20px;
  }
.vul-landing .biaya-icon i{font-size:44px; color:var(--vul-gold-dark);}
.vul-landing .biaya-card h3{font-size:16px; margin-bottom:14px;}
.vul-landing .biaya-price{
    font-family:Georgia,"Times New Roman",serif; font-weight:700;
    font-size:clamp(28px, 3.4vw, 36px); color:var(--vul-gold-dark); line-height:1;
  }
.vul-landing .biaya-price .currency{font-size:14px; font-weight:600; color:var(--vul-gray); margin-right:6px; font-family:'Readex Pro', sans-serif;}
.vul-landing .biaya-note{font-size:13px; color:var(--vul-gray); font-weight:300; margin-top:8px;}
.vul-landing .biaya-convert{
    margin-top:16px; padding-top:16px; border-top:1px dashed var(--vul-border);
    font-size:13px; color:var(--vul-ink-soft); font-weight:300; width:100%;
  }
.vul-landing .biaya-convert.is-loading{color:var(--vul-gray); font-style:italic;}
.vul-landing .biaya-convert .rate-value{font-weight:700; color:var(--vul-gold-dark); font-style:normal;}
.vul-landing .biaya-foot{text-align:center; font-size:11px; color:var(--vul-gray); font-weight:300; margin-top:var(--vul-gap-md);}
.vul-landing .faq-list{max-width:760px; margin:0 auto; display:flex; flex-direction:column; gap:var(--vul-gap-sm);}
.vul-landing .faq-item{
    border:1px solid var(--vul-border); border-radius:14px; background:var(--vul-white); overflow:hidden;
  }
.vul-landing .faq-item summary{
    cursor:pointer; list-style:none; padding:var(--vul-gap-sm) var(--vul-card-pad);
    display:flex; align-items:center; gap:16px; font-size:16px; font-weight:600;
  }
.vul-landing .faq-item summary::-webkit-details-marker{display:none;}
.vul-landing .faq-item summary .faq-q-icon{
    width:34px; height:34px; border-radius:50%; background:var(--vul-gold-light); flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
  }
.vul-landing .faq-item summary .faq-q-icon i{font-size:13px; color:var(--vul-gold-dark);}
.vul-landing .faq-item summary .faq-question{flex:1;}
.vul-landing .faq-item summary .faq-toggle{color:var(--vul-gold-dark); font-size:14px; transition:transform .2s ease; flex-shrink:0;}
.vul-landing .faq-item[open] summary .faq-toggle{transform:rotate(45deg);}
.vul-landing .faq-item .faq-answer{
    padding:0 var(--vul-card-pad) var(--vul-gap-sm) calc(34px + var(--vul-card-pad) + 16px);
    font-size:15px; color:var(--vul-gray); font-weight:300;
  }
.vul-landing .faq-answer p{margin:0 0 12px;}
.vul-landing .faq-answer p:last-child{margin-bottom:0;}
.vul-landing .faq-answer a{color:var(--vul-gold-dark); text-decoration:underline !important; font-weight:400;}
.vul-landing .faq-answer a:hover, .vul-landing .faq-answer a:focus{color:var(--vul-gold);}
.vul-landing .faq-answer ul, .vul-landing .faq-answer ol{margin:0 0 12px; padding-left:20px;}
.vul-landing .faq-answer ul:last-child, .vul-landing .faq-answer ol:last-child{margin-bottom:0;}
.vul-landing .faq-answer ul{list-style:disc outside;}
.vul-landing .faq-answer ol{list-style:decimal outside;}
.vul-landing .faq-answer li{margin:0 0 6px; padding:0;}
.vul-landing .faq-answer li:last-child{margin-bottom:0;}
.vul-landing .faq-answer li > ul, .vul-landing .faq-answer li > ol{margin-top:6px;}
.vul-landing .faq-answer strong{font-weight:600; color:var(--vul-ink-soft);}
.vul-landing .cta-band{
    background:var(--vul-gold-light); border-radius:22px; padding:var(--vul-card-pad);
    display:flex; align-items:center; justify-content:space-between; gap:var(--vul-gap-md); flex-wrap:wrap;
  }
.vul-landing .cta-band .cta-left{display:flex; align-items:center; gap:var(--vul-gap-sm);}
.vul-landing .cta-band .lamp-icon{
    width:44px; height:44px; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  }
.vul-landing .cta-band .lamp-icon i{font-size:30px; color:var(--vul-gold-dark);}
.vul-landing .cta-band h3{font-size:clamp(18px, 2.2vw, 22px); margin-bottom:6px;}
.vul-landing .cta-band p{font-size:12.5px; color:var(--vul-gray); font-weight:300;}
.vul-landing .cta-right{text-align:right;}
.vul-landing .cta-right p{font-size:11px; color:var(--vul-gray); margin-top:8px; font-weight:300;}
@media(max-width:900px){.vul-landing .hero .wrap{
      min-height:0; padding:clamp(36px, 8vw, 56px) var(--vul-wrap-px);
    }
.vul-landing .hero .wrap::before{
      bottom:0;
      background-image:
        linear-gradient(90deg, rgba(255,255,255,.6) 0%, rgba(255,255,255,0) 18%, rgba(255,255,255,0) 82%, rgba(255,255,255,.55) 100%),
        linear-gradient(180deg, rgba(255,255,255,0) 74%, rgba(255,255,255,.85) 100%),
        url('../images/background-header-hero.webp');
      background-position:62% center;
    }
.vul-landing .hero .wrap::after{
      background-image:linear-gradient(90deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.75) 55%, rgba(255,255,255,.3) 100%);
    }
.vul-landing .hero-copy{width:min(100%, 500px);}
.vul-landing .services-grid{grid-template-columns:1fr;}
.vul-landing .process-row{grid-template-columns:repeat(2,1fr);}
.vul-landing .process-step::after{display:none;}
.vul-landing .requirements-grid{grid-template-columns:repeat(3,1fr);}
.vul-landing .biaya-grid{grid-template-columns:1fr;}
.vul-landing .testi-card{flex:0 0 calc((100% - var(--vul-gap-md))/2);}
.vul-landing .testi-top{flex-direction:column; align-items:flex-start;}
.vul-landing .gallery-card{flex:0 0 203px; height:360px;}
.vul-landing .cta-band{flex-direction:column; align-items:flex-start; text-align:left;}
.vul-landing .cta-right{text-align:left;}
.vul-landing .feature-item{border-left:none; padding-left:0; padding-right:0;}

  }
@media(max-width:1000px){.vul-landing .trust-item{flex-direction:column; align-items:center; text-align:center;}

  }
@media(max-width:600px){.vul-landing .trust-bar{grid-template-columns:1fr;}
.vul-landing .trust-item{
      flex-direction:column; align-items:center; text-align:center;
      border-left:none; border-top:1px solid var(--vul-border);
      padding:var(--vul-gap-sm) 0 0; margin-top:var(--vul-gap-sm);
    }
.vul-landing .trust-item:first-child{border-top:none; padding-top:0; margin-top:0;}
.vul-landing .requirements-grid{grid-template-columns:1fr;}
.vul-landing .faq-item .faq-answer{padding-left:var(--vul-card-pad);}
.vul-landing .testi-card{flex:0 0 100%;}
.vul-landing .gallery-card{flex:0 0 169px; height:300px;}
.vul-landing .gallery-track{gap:14px;}
.vul-landing .lightbox-prev{left:8px;}
.vul-landing .lightbox-next{right:8px;}

  }
@media(max-width:480px){.vul-landing .btn-row{flex-direction:column;}
.vul-landing .btn-row .btn{width:100%; flex:none;}

  }

