/**
 * AH – Vuur Explorer
 * Widget: dc-ah-vuur-explorer
 *
 * Instelbare waarden komen binnen als custom properties via de Elementor
 * control-selectors; er staat niets inline in de PHP.
 */

.dc-ah-vuur-explorer{--vx-a:#c8956c;--vx-w:#e8a86d;--vx-bg:#faf8f5;--vx-t:#2c2420;--vx-m:#8a7d72;position:relative;background:var(--vx-bg);padding:clamp(80px,0vw,140px) 0;overflow:hidden}
.dc-ah-vuur-explorer .vex__glow{position:absolute;border-radius:50%;pointer-events:none;z-index:0}
.dc-ah-vuur-explorer .vex__glow--1{top:-120px;right:5%;width:500px;height:500px;background:radial-gradient(ellipse,rgba(200,149,108,.09) 0%,transparent 70%)}
.dc-ah-vuur-explorer .vex__glow--2{bottom:-100px;left:8%;width:400px;height:400px;background:radial-gradient(ellipse,rgba(200,149,108,.06) 0%,transparent 70%)}
.dc-ah-vuur-explorer .vex__c{position:relative;z-index:5;max-width:1320px;margin:0 auto;padding:0 60px}

/* Header */
.dc-ah-vuur-explorer .vex__hd{text-align:center;max-width:640px;margin:0 auto clamp(40px,4vw,64px)}
.dc-ah-vuur-explorer .vex__ey{display:inline-flex;align-items:center;gap:14px;font-size:11px;font-weight:600;letter-spacing:4px;text-transform:uppercase;color:var(--vx-a);margin-bottom:20px}
.dc-ah-vuur-explorer .vex__ey-fl{width:16px;height:16px;color:var(--vx-a);flex-shrink:0;animation:vxFl 3s ease-in-out infinite}
@keyframes vxFl{0%,100%{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}
.dc-ah-vuur-explorer .vex__ey::after{content:'';width:28px;height:1px;background:linear-gradient(90deg,var(--vx-a),transparent)}
.dc-ah-vuur-explorer .vex__ti{font-family:Georgia,'Times New Roman',serif;font-size:clamp(28px,3.5vw,48px);font-weight:400;line-height:1.15;color:var(--vx-t);margin:0 0 14px}
.dc-ah-vuur-explorer .vex__hl{color:var(--vx-a);font-style:italic}
.dc-ah-vuur-explorer .vex__st{font-size:15px;line-height:1.75;color:var(--vx-m);margin:0}

/* ═══ Type Selector Tabs ═══ */
.dc-ah-vuur-explorer .vex__tabs{display:flex;justify-content:center;gap:8px;margin-bottom:clamp(32px,3.5vw,52px);flex-wrap:wrap}
.dc-ah-vuur-explorer .vex__tab{display:flex;align-items:center;gap:10px;padding:14px 28px;border-radius:100px;border:1px solid rgba(44,36,32,.08);background:#fff;cursor:pointer;transition:all .4s ease;box-shadow:0 2px 8px rgba(44,36,32,.03);position:relative;overflow:hidden}
.dc-ah-vuur-explorer .vex__tab::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--vx-a),var(--vx-w));border-radius:100px;opacity:0;transition:opacity .4s ease}
.dc-ah-vuur-explorer .vex__tab.is-active::before{opacity:1}
.dc-ah-vuur-explorer .vex__tab-ico{width:20px;height:20px;position:relative;z-index:1;color:var(--vx-a);transition:color .3s ease}
.dc-ah-vuur-explorer .vex__tab.is-active .vex__tab-ico{color:#fff}
.dc-ah-vuur-explorer .vex__tab-name{font-size:13px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--vx-t);position:relative;z-index:1;transition:color .3s ease}
.dc-ah-vuur-explorer .vex__tab.is-active .vex__tab-name{color:#fff}
.dc-ah-vuur-explorer .vex__tab:hover:not(.is-active){border-color:rgba(200,149,108,.25);transform:translateY(-2px);box-shadow:0 8px 24px rgba(44,36,32,.06)}

/* ═══ Main Stage ═══ */
.dc-ah-vuur-explorer .vex__stage{display:grid;grid-template-columns:1fr 420px;gap:32px;align-items:start}

/* ── Left: Visual ── */
.dc-ah-vuur-explorer .vex__visual{position:relative;border-radius:24px;overflow:hidden;aspect-ratio:4/3;background:#f0ebe5;box-shadow:0 20px 60px rgba(44,36,32,.08);border:1px solid rgba(44,36,32,.06)}
.dc-ah-vuur-explorer .vex__vis-img{position:absolute;inset:0;opacity:0;transform:scale(1.05);transition:opacity .7s ease,transform .9s ease}
.dc-ah-vuur-explorer .vex__vis-img.is-active{opacity:1;transform:scale(1)}
.dc-ah-vuur-explorer .vex__vis-img img{width:100%;height:100%;object-fit:cover}
.dc-ah-vuur-explorer .vex__vis-img::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(44,36,32,.25) 100%);pointer-events:none}

/* ── Floating Ember Particles ── */
.dc-ah-vuur-explorer .vex__particles{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}
.dc-ah-vuur-explorer .vex__ember{position:absolute;width:var(--size,3px);height:var(--size,3px);background:var(--vx-w);border-radius:50%;bottom:-10px;opacity:0;filter:blur(0.5px);animation:vxEmber var(--dur,8s) var(--delay,0s) infinite}
@keyframes vxEmber{0%{opacity:0;transform:translateY(0) translateX(0) scale(1)}10%{opacity:.6}50%{opacity:.3}100%{opacity:0;transform:translateY(calc(-100vh - 40px)) translateX(var(--drift,30px)) scale(.3)}}

/* ── Ambient Glow ── */
.dc-ah-vuur-explorer .vex__ambient-glow{position:absolute;bottom:-100px;left:50%;transform:translateX(-50%);width:100%;height:300px;background:radial-gradient(ellipse,rgba(200,149,108,.15) 0%,transparent 70%);z-index:2;pointer-events:none;animation:vxGlowPulse 6s ease-in-out infinite}
@keyframes vxGlowPulse{0%,100%{opacity:.5;transform:translateX(-50%) scale(1)}50%{opacity:.8;transform:translateX(-50%) scale(1.08)}}

/* Scene tag */
.dc-ah-vuur-explorer .vex__vis-tag{position:absolute;top:20px;left:20px;z-index:4;background:#fff;border-radius:100px;padding:8px 20px;font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--vx-a);box-shadow:0 4px 16px rgba(44,36,32,.1);opacity:0;transform:translateY(-10px);transition:all .4s ease .2s}
.dc-ah-vuur-explorer .vex__vis-tag.is-visible{opacity:1;transform:translateY(0)}

/* ── Right: Info Panel ── */
.dc-ah-vuur-explorer .vex__info{position:relative}

.dc-ah-vuur-explorer .vex__info-name{font-family:Georgia,'Times New Roman',serif;font-size:clamp(24px,2.5vw,34px);font-weight:400;color:var(--vx-t);margin:0 0 4px;opacity:0;transform:translateX(20px);transition:all .5s ease .1s}
.dc-ah-vuur-explorer .vex__info-name.is-vis{opacity:1;transform:translateX(0)}

.dc-ah-vuur-explorer .vex__info-tag{font-size:14px;color:var(--vx-a);margin:0 0 16px;font-weight:500;opacity:0;transform:translateX(20px);transition:all .5s ease .2s}
.dc-ah-vuur-explorer .vex__info-tag.is-vis{opacity:1;transform:translateX(0)}

.dc-ah-vuur-explorer .vex__info-desc{font-size:15px;line-height:1.75;color:var(--vx-m);margin:0 0 28px;opacity:0;transform:translateX(20px);transition:all .5s ease .3s}
.dc-ah-vuur-explorer .vex__info-desc.is-vis{opacity:1;transform:translateX(0)}

/* ═══ Score Bars ═══ */
.dc-ah-vuur-explorer .vex__scores{display:flex;flex-direction:column;gap:14px;margin-bottom:28px;opacity:0;transform:translateX(20px);transition:all .5s ease .35s}
.dc-ah-vuur-explorer .vex__scores.is-vis{opacity:1;transform:translateX(0)}

.dc-ah-vuur-explorer .vex__score-row{display:grid;grid-template-columns:90px 1fr 36px;align-items:center;gap:12px}
.dc-ah-vuur-explorer .vex__score-label{font-size:12px;font-weight:500;color:var(--vx-m);text-transform:uppercase;letter-spacing:1px}
.dc-ah-vuur-explorer .vex__score-track{height:6px;background:rgba(44,36,32,.06);border-radius:10px;overflow:hidden;position:relative}
.dc-ah-vuur-explorer .vex__score-fill{height:100%;border-radius:10px;background:linear-gradient(90deg,var(--vx-a),var(--vx-w));width:0;transition:width 1s cubic-bezier(.25,.8,.25,1)}
.dc-ah-vuur-explorer .vex__score-val{font-family:Georgia,serif;font-size:14px;color:var(--vx-t);font-weight:400;text-align:right}

/* Pros */
.dc-ah-vuur-explorer .vex__pros{list-style:none;padding:0;margin:0 0 20px;opacity:0;transform:translateX(20px);transition:all .5s ease .45s}
.dc-ah-vuur-explorer .vex__pros.is-vis{opacity:1;transform:translateX(0)}
.dc-ah-vuur-explorer .vex__pros li{display:flex;align-items:center;gap:10px;padding:9px 0;font-size:14px;color:var(--vx-t);border-bottom:1px solid rgba(44,36,32,.05)}
.dc-ah-vuur-explorer .vex__pros li:last-child{border-bottom:none}
.dc-ah-vuur-explorer .vex__pros li svg{width:16px;height:16px;color:var(--vx-a);flex-shrink:0}

/* Ideal for */
.dc-ah-vuur-explorer .vex__ideal{display:flex;align-items:flex-start;gap:10px;padding:16px 20px;background:rgba(200,149,108,.06);border-radius:12px;border:1px solid rgba(200,149,108,.1);margin-bottom:24px;opacity:0;transform:translateX(20px);transition:all .5s ease .5s}
.dc-ah-vuur-explorer .vex__ideal.is-vis{opacity:1;transform:translateX(0)}
.dc-ah-vuur-explorer .vex__ideal svg{width:18px;height:18px;color:var(--vx-a);flex-shrink:0;margin-top:1px}
.dc-ah-vuur-explorer .vex__ideal-text{font-size:13px;line-height:1.5;color:var(--vx-m)}
.dc-ah-vuur-explorer .vex__ideal-text strong{color:var(--vx-t);font-weight:600;display:block;margin-bottom:2px;font-size:11px;letter-spacing:1px;text-transform:uppercase}

/* Type CTA */
.dc-ah-vuur-explorer .vex__type-cta{opacity:0;transform:translateX(20px);transition:all .5s ease .55s}
.dc-ah-vuur-explorer .vex__type-cta.is-vis{opacity:1;transform:translateX(0)}
.dc-ah-vuur-explorer .vex__type-btn{display:inline-flex;align-items:center;gap:10px;padding:16px 36px;font-size:12px;font-weight:600;letter-spacing:2px;text-transform:uppercase;text-decoration:none;color:#fff;background:linear-gradient(135deg,var(--vx-a),var(--vx-w));border-radius:100px;transition:all .4s ease;box-shadow:0 6px 24px rgba(200,149,108,.2)}
.dc-ah-vuur-explorer .vex__type-btn:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(200,149,108,.3);color:#fff}
.dc-ah-vuur-explorer .vex__type-btn svg{width:14px;height:14px;transition:transform .3s ease}
.dc-ah-vuur-explorer .vex__type-btn:hover svg{transform:translateX(4px)}

/* ═══ Bottom CTA Band ═══ */
.dc-ah-vuur-explorer .vex__bcta{margin-top:clamp(40px,4vw,60px)}
.dc-ah-vuur-explorer .vex__bcta-band{position:relative;background:#fff;border:1px solid rgba(44,36,32,.06);border-radius:24px;overflow:hidden;display:grid;grid-template-columns:1fr 420px;min-height:340px;box-shadow:0 12px 48px rgba(44,36,32,.06)}

/* Left content */
.dc-ah-vuur-explorer .vex__bcta-content{position:relative;z-index:2;padding:clamp(36px,3.5vw,52px) clamp(32px,3.5vw,52px);display:flex;flex-direction:column;justify-content:center}

.dc-ah-vuur-explorer .vex__bcta-eyebrow{display:inline-flex;align-items:center;gap:14px;font-size:11px;font-weight:600;letter-spacing:4px;text-transform:uppercase;color:var(--vx-a);margin-bottom:14px}
.dc-ah-vuur-explorer .vex__bcta-ey-flame{width:16px;height:16px;color:var(--vx-a);flex-shrink:0;animation:vxFl 3s ease-in-out infinite}
.dc-ah-vuur-explorer .vex__bcta-eyebrow::after{content:'';width:28px;height:1px;background:linear-gradient(90deg,var(--vx-a),transparent)}

.dc-ah-vuur-explorer .vex__bcta-title{font-family:Georgia,'Times New Roman',serif;font-size:clamp(24px,2.5vw,36px);font-weight:400;color:var(--vx-t);margin:0 0 10px;line-height:1.25}
.dc-ah-vuur-explorer .vex__bcta-title em{color:var(--vx-a);font-style:italic}

.dc-ah-vuur-explorer .vex__bcta-desc{font-size:14px;line-height:1.7;color:var(--vx-m);margin:0 0 24px;max-width:420px}

.dc-ah-vuur-explorer .vex__bcta-btn{display:inline-flex;align-items:center;gap:12px;padding:18px 40px;font-size:12px;font-weight:600;letter-spacing:2px;text-transform:uppercase;text-decoration:none;color:#fff;background:linear-gradient(135deg,var(--vx-a),var(--vx-w));border-radius:100px;transition:all .4s ease;box-shadow:0 6px 24px rgba(200,149,108,.25);align-self:flex-start;margin-bottom:20px}
.dc-ah-vuur-explorer .vex__bcta-btn:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(200,149,108,.35);color:#fff}
.dc-ah-vuur-explorer .vex__bcta-btn svg{width:14px;height:14px;transition:transform .3s ease}
.dc-ah-vuur-explorer .vex__bcta-btn:hover svg{transform:translateX(4px)}

/* Contact row */
.dc-ah-vuur-explorer .vex__bcta-contacts{display:flex;gap:24px;flex-wrap:wrap;margin-bottom:18px}
.dc-ah-vuur-explorer .vex__bcta-contact{display:flex;align-items:center;gap:10px;text-decoration:none;transition:color .3s ease}
.dc-ah-vuur-explorer .vex__bcta-contact-icon{width:36px;height:36px;border-radius:10px;background:rgba(200,149,108,.08);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .3s ease}
.dc-ah-vuur-explorer .vex__bcta-contact-icon svg{width:16px;height:16px;color:var(--vx-a)}
.dc-ah-vuur-explorer .vex__bcta-contact:hover .vex__bcta-contact-icon{background:var(--vx-a)}
.dc-ah-vuur-explorer .vex__bcta-contact:hover .vex__bcta-contact-icon svg{color:#fff}
.dc-ah-vuur-explorer .vex__bcta-contact-label{font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--vx-m)}
.dc-ah-vuur-explorer .vex__bcta-contact-value{font-size:14px;font-weight:600;color:var(--vx-t)}

/* USP row */
.dc-ah-vuur-explorer .vex__bcta-usps{display:flex;flex-wrap:wrap;gap:16px}
.dc-ah-vuur-explorer .vex__bcta-usp{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--vx-m)}
.dc-ah-vuur-explorer .vex__bcta-usp svg{width:14px;height:14px;color:var(--vx-a);flex-shrink:0}

/* Right image */
.dc-ah-vuur-explorer .vex__bcta-visual{position:relative;overflow:hidden}
.dc-ah-vuur-explorer .vex__bcta-visual img{width:100%;height:100%;object-fit:cover;transition:transform 6s ease}
.dc-ah-vuur-explorer .vex__bcta-band:hover .vex__bcta-visual img{transform:scale(1.04)}

/* Floating badge on image */
.dc-ah-vuur-explorer .vex__bcta-badge{position:absolute;bottom:24px;right:24px;z-index:3;background:#fff;border-radius:14px;padding:14px 20px;box-shadow:0 8px 28px rgba(44,36,32,.1);display:flex;align-items:center;gap:10px;animation:vxBadgeFloat 5s ease-in-out infinite}
@keyframes vxBadgeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.dc-ah-vuur-explorer .vex__bcta-badge-icon{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--vx-a),var(--vx-w));display:flex;align-items:center;justify-content:center;flex-shrink:0}
.dc-ah-vuur-explorer .vex__bcta-badge-icon svg{width:18px;height:18px;color:#fff}
.dc-ah-vuur-explorer .vex__bcta-badge-text{font-size:13px;font-weight:600;color:var(--vx-t);line-height:1.3}
.dc-ah-vuur-explorer .vex__bcta-badge-text span{display:block;font-size:11px;font-weight:400;color:var(--vx-m)}

/* Gradient overlay on image left edge */
.dc-ah-vuur-explorer .vex__bcta-visual::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,transparent 30%);z-index:2;pointer-events:none}

/* ═══ Responsive ═══ */
@media(max-width:1024px){
    .dc-ah-vuur-explorer .vex__stage{grid-template-columns:1fr;gap:28px}
    .dc-ah-vuur-explorer .vex__c{padding:0 40px}
    .dc-ah-vuur-explorer .vex__bcta-band{grid-template-columns:1fr 360px}
}
@media(max-width:768px){
    .dc-ah-vuur-explorer .vex__bcta-band{grid-template-columns:1fr}
    .dc-ah-vuur-explorer .vex__bcta-visual{min-height:240px}
    .dc-ah-vuur-explorer .vex__bcta-visual::before{background:linear-gradient(180deg,#fff 0%,transparent 30%)}
    .dc-ah-vuur-explorer .vex__c{padding:0 24px}
}
@media(max-width:640px){
    .dc-ah-vuur-explorer .vex__c{padding:0 20px}
    .dc-ah-vuur-explorer .vex__tabs{gap:6px}
    .dc-ah-vuur-explorer .vex__tab{padding:10px 16px;min-height:44px}
    .dc-ah-vuur-explorer .vex__tab-ico{width:16px;height:16px}
    .dc-ah-vuur-explorer .vex__tab-name{font-size:10px;letter-spacing:0.5px}
    .dc-ah-vuur-explorer .vex__visual{aspect-ratio:4/3;border-radius:16px}
    .dc-ah-vuur-explorer .vex__score-row{grid-template-columns:64px 1fr 30px;gap:8px}
    .dc-ah-vuur-explorer .vex__score-label{font-size:10px;letter-spacing:0.5px}
    .dc-ah-vuur-explorer .vex__info-name{font-size:clamp(20px,5vw,28px)}
    .dc-ah-vuur-explorer .vex__info-desc{font-size:14px}
    .dc-ah-vuur-explorer .vex__type-btn{padding:14px 28px;font-size:11px;width:100%;justify-content:center}
    .dc-ah-vuur-explorer .vex__bcta-band{grid-template-columns:1fr;min-height:auto}
    .dc-ah-vuur-explorer .vex__bcta-visual{min-height:260px}
    .dc-ah-vuur-explorer .vex__bcta-visual::before{background:linear-gradient(180deg,#fff 0%,transparent 30%)}
    .dc-ah-vuur-explorer .vex__bcta-content{text-align:center;align-items:center;padding:32px 20px}
    .dc-ah-vuur-explorer .vex__bcta-btn{align-self:center;width:100%;justify-content:center;min-height:48px}
    .dc-ah-vuur-explorer .vex__bcta-contacts{justify-content:center;flex-direction:column;align-items:center;gap:16px}
    .dc-ah-vuur-explorer .vex__bcta-usps{justify-content:center}
    .dc-ah-vuur-explorer .vex__bcta-badge{bottom:16px;right:16px;padding:10px 14px}
    .dc-ah-vuur-explorer .vex__bcta-desc{max-width:100%}
    .dc-ah-vuur-explorer .vex__ideal{padding:14px 16px}
    .dc-ah-vuur-explorer .vex__pros li{font-size:13px;padding:8px 0}
}

/* Vonkjes: positie, grootte en timing per vonk. */
.dc-ah-vuur-explorer .vex__ember:nth-child(1) { left: 51%; --size: 5px; --dur: 9s; --delay: 3.6s; --drift: -7px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(2) { left: 34%; --size: 5px; --dur: 6s; --delay: 5.2s; --drift: 49px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(3) { left: 89%; --size: 4px; --dur: 7.5s; --delay: 2.8s; --drift: -59px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(4) { left: 42%; --size: 4px; --dur: 11.2s; --delay: 4.2s; --drift: 25px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(5) { left: 23%; --size: 4px; --dur: 6.1s; --delay: 2.8s; --drift: 17px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(6) { left: 37%; --size: 2px; --dur: 11.7s; --delay: 1.9s; --drift: 43px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(7) { left: 82%; --size: 2px; --dur: 8.9s; --delay: 5.8s; --drift: 16px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(8) { left: 85%; --size: 4px; --dur: 7.4s; --delay: 3.9s; --drift: -14px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(9) { left: 38%; --size: 5px; --dur: 11s; --delay: 1.1s; --drift: -16px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(10) { left: 68%; --size: 5px; --dur: 9.3s; --delay: 2.2s; --drift: 12px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(11) { left: 42%; --size: 2px; --dur: 7.8s; --delay: 1s; --drift: 46px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(12) { left: 5%; --size: 4px; --dur: 7.5s; --delay: 6.2s; --drift: -41px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(13) { left: 44%; --size: 4px; --dur: 8s; --delay: 5.8s; --drift: -2px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(14) { left: 13%; --size: 3px; --dur: 10.4s; --delay: 6.1s; --drift: 33px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(15) { left: 6%; --size: 5px; --dur: 11.3s; --delay: 6.2s; --drift: -59px; }
.dc-ah-vuur-explorer .vex__ember:nth-child(16) { left: 65%; --size: 2px; --dur: 8.9s; --delay: 7.8s; --drift: -50px; }
