/* Vantik brand utility classes - applied via native Elementor "CSS Classes" advanced control */
@keyframes vtk-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
@keyframes vtk-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(1.25)}}
@keyframes vtk-blob1{0%,100%{transform:translate(0,0)}50%{transform:translate(40px,-30px)}}
@keyframes vtk-blob2{0%,100%{transform:translate(0,0)}50%{transform:translate(-50px,40px)}}
@keyframes vtk-blob3{0%,100%{transform:translate(0,0)}50%{transform:translate(30px,30px)}}
@keyframes vtk-rotate-border{0%{filter:hue-rotate(0deg)}100%{filter:hue-rotate(360deg)}}
@keyframes vtk-glow{0%,100%{box-shadow:0 0 16px rgba(91,124,255,.5)}50%{box-shadow:0 0 32px rgba(139,92,246,.8)}}

.vtk-grad-text,.vtk-grad-text .elementor-heading-title,.vtk-grad-text .elementor-widget-container{background:linear-gradient(135deg,#3B82F6 0%,#8B5CF6 60%,#EC4899 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;display:inline-block}
.vtk-grad-text-warm,.vtk-grad-text-warm .elementor-heading-title,.vtk-grad-text-warm .elementor-widget-container{background:linear-gradient(135deg,#F59E0B 0%,#EC4899 50%,#8B5CF6 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;display:inline-block}
.vtk-grad-text-cool,.vtk-grad-text-cool .elementor-heading-title,.vtk-grad-text-cool .elementor-widget-container{background:linear-gradient(90deg,#fff,#60A5FA,#A78BFA);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;display:inline-block}

.vtk-glass{background:rgba(255,255,255,.75);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(20,20,46,.08)}
.vtk-glass-dark{background:rgba(255,255,255,.06);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.1)}
.vtk-glass-card{background:rgba(20,20,46,.03);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(20,20,46,.08);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease}
.vtk-glass-card:hover{transform:translateY(-8px);border-color:rgba(91,124,255,.4);box-shadow:0 26px 60px rgba(91,124,255,.18)}

.vtk-float{animation:vtk-float 7s ease-in-out infinite}
.vtk-float-slow{animation:vtk-float 9s ease-in-out infinite}
.vtk-pulse-dot{animation:vtk-pulse 2s ease-in-out infinite}
.vtk-glow{animation:vtk-glow 2.6s ease-in-out infinite}
.vtk-rotate-border{animation:vtk-rotate-border 4s linear infinite}

.vtk-blob{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;z-index:0}
.vtk-blob-1{animation:vtk-blob1 18s ease-in-out infinite}
.vtk-blob-2{animation:vtk-blob2 22s ease-in-out infinite}
.vtk-blob-3{animation:vtk-blob3 20s ease-in-out infinite}

.vtk-lift{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.vtk-lift:hover{transform:translateY(-6px)}
.vtk-lift-shadow:hover{box-shadow:0 20px 50px rgba(91,124,255,.22)}

.vtk-scale:hover{transform:translateY(-4px) scale(1.02)}

.vtk-badge-row{display:flex;flex-wrap:wrap;gap:8px}

body{overflow-x:hidden}
.vtk-glass-header{background:rgba(255,255,255,.96);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(20,20,46,.08)}

.elementor-icon-list-icon svg{width:var(--e-icon-list-icon-size,1em);height:var(--e-icon-list-icon-size,1em);max-width:2em;max-height:2em;flex-shrink:0}
.elementor-icon-list-icon i{font-size:var(--e-icon-list-icon-size,1em)}
.elementor-icon-list-icon{display:inline-flex;align-items:center;justify-content:center}
.elementor-icon svg{width:1em;height:1em;max-width:2.5em;max-height:2.5em}

.vtk-badge-wrap{align-items:flex-start !important}
.vtk-badge-wrap>*:first-child{flex-shrink:0 !important}

.vtk-badge-box{width:42px !important;height:42px !important;flex:0 0 42px !important;min-width:42px !important;max-width:42px !important}

.vtk-grow{flex:1 1 0% !important;min-width:0 !important}

/* vtk-fixedbox: hard override for Elementor's broken --width var on flex/grid children */
.vtk-fixedbox-11{width:11px !important;height:11px !important;min-width:11px !important;max-width:11px !important;flex:0 0 11px !important}
.vtk-fixedbox-52{width:52px !important;height:52px !important;min-width:52px !important;max-width:52px !important;flex:0 0 52px !important}
.vtk-fixedbox-56{width:56px !important;height:56px !important;min-width:56px !important;max-width:56px !important;flex:0 0 56px !important}
.vtk-fixedbox-44{width:44px !important;height:44px !important;min-width:44px !important;max-width:44px !important;flex:0 0 44px !important}
.vtk-fixedbox-42{width:42px !important;height:42px !important;min-width:42px !important;max-width:42px !important;flex:0 0 42px !important}
.vtk-fixedbox-36{width:36px !important;height:36px !important;min-width:36px !important;max-width:36px !important;flex:0 0 36px !important}

.vtk-force-row{flex-direction:row !important}

/* vtk-wpct: hard override for Elementor's broken --width var (percentage widths) on flex/grid children */
.vtk-wpct-14_29{width:14% !important;flex:0 1 14% !important}
.vtk-wpct-31{width:31% !important;flex:0 1 31% !important}
.vtk-wpct-23{width:23% !important;flex:0 1 23% !important}
.vtk-wpct-45{width:45% !important;flex:0 1 45% !important}
.vtk-wpct-50{width:50% !important;flex:0 1 50% !important}
.vtk-wpct-25{width:25% !important;flex:0 1 25% !important}
.vtk-wpct-54{width:54% !important;flex:0 1 54% !important}
.vtk-wpct-38{width:38% !important;flex:0 1 38% !important}
.vtk-wpct-52{width:52% !important;flex:0 1 52% !important}
.vtk-wpct-40{width:40% !important;flex:0 1 40% !important}
.vtk-wpct-48{width:48% !important;flex:0 1 48% !important}
.vtk-wpct-18{width:18% !important;flex:0 1 18% !important}
.vtk-wpct-42{width:42% !important;flex:0 1 42% !important}

/* Global fix: Elementor's .e-con-boxed.e-flex base rule hardcodes flex-direction:column,
   overriding the per-element --flex-direction variable due to CSS specificity. This restores
   the intended per-element direction site-wide instead of patching individual elements. */
.e-con-boxed.e-flex{flex-direction:var(--flex-direction,row) !important}

.elementor-icon-list-items,.elementor-icon-list-item{list-style:none !important;display:list-item}
.elementor-icon-list-item{display:block}

.wpforms-container .wpforms-submit-container button.wpforms-submit,
.wpforms-container button[type=submit].wpforms-submit{background:linear-gradient(135deg,#3B82F6 0%,#8B5CF6 100%) !important;border:none !important;border-radius:12px !important;font-weight:700 !important;padding:14px 28px !important;transition:transform .2s ease,box-shadow .2s ease !important}
.wpforms-container button[type=submit].wpforms-submit:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(91,124,255,.35) !important}

/* Footer 4-column layout: Elementor's --width var wasn't set for these columns, causing them
   to default to 100% width and stack vertically instead of forming a proper footer row. */
.vtk-footer-brand{width:300px !important;flex:0 1 300px !important;max-width:340px !important}
.vtk-footer-col{width:160px !important;flex:0 1 160px !important;max-width:200px !important}
.vtk-footer-col-wide{width:220px !important;flex:0 1 220px !important;max-width:260px !important}
@media (max-width:1024px){.vtk-footer-brand,.vtk-footer-col,.vtk-footer-col-wide{width:auto !important;max-width:none !important;flex:1 1 200px !important}}

.vtk-btn-row{align-items:center !important}

/* Hero 2-column grid: left text / right dashboard */
.vtk-hero-grid.e-con-boxed>.e-con-inner{display:grid !important;grid-template-columns:1.12fr 0.88fr !important;align-items:center !important;gap:60px !important}
.vtk-hero-left.vtk-hero-left{width:auto !important;max-width:none !important;flex:none !important}
.vtk-hero-right.vtk-hero-right{width:auto !important;max-width:none !important;flex:none !important;justify-self:stretch !important}
@media (max-width:1024px){
  .vtk-hero-grid.e-con-boxed>.e-con-inner{grid-template-columns:1fr !important;gap:40px !important}
}
@media (max-width:767px){
  .vtk-hero-grid.e-con-boxed>.e-con-inner{gap:32px !important}
}

/* Dashboard cards: soft shadow + hover lift (glassmorphism bg/blur already applied via vtk-glass) */
.vtk-card-shadow{box-shadow:0 20px 50px rgba(20,20,46,0.10) !important;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s !important}
.vtk-card-shadow:hover{transform:translateY(-6px) !important;box-shadow:0 30px 70px rgba(91,124,255,0.20) !important}
@media (max-width:767px){.vtk-card-shadow:hover{transform:none !important}}

/* Floating badge on hero dashboard: shrink to content instead of full-width */
.vtk-badge-float{width:fit-content !important;max-width:260px !important;white-space:nowrap !important}
@media (max-width:600px){.vtk-badge-float{white-space:normal !important;max-width:200px !important}}

/* Single post: share buttons */
.vtk-share-row{display:flex;gap:10px}
.vtk-share-btn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:999px;background:rgba(139,92,246,0.08);color:#8B5CF6 !important;font-family:Inter,sans-serif;font-weight:700;font-size:13px;text-decoration:none !important;border:1px solid rgba(139,92,246,0.15);transition:transform .25s ease,background .25s ease,color .25s ease}
.vtk-share-btn:hover{transform:translateY(-3px);background:#8B5CF6;color:#fff !important}

/* Single post: article body typography (matches site fonts/colors) */
.xpro-elementor-content{font-family:Inter,sans-serif;font-size:17px;line-height:1.8;color:#3D3A56}
.xpro-elementor-content p{margin:0 0 22px}
.xpro-elementor-content h2{font-family:Manrope,sans-serif;font-weight:800;font-size:26px;color:#1A1A2E;margin:40px 0 16px;line-height:1.3}
.xpro-elementor-content h3{font-family:Manrope,sans-serif;font-weight:700;font-size:21px;color:#1A1A2E;margin:32px 0 14px;line-height:1.35}
.xpro-elementor-content h4{font-family:Manrope,sans-serif;font-weight:700;font-size:18px;color:#1A1A2E;margin:28px 0 12px}
.xpro-elementor-content a{color:#8B5CF6;text-decoration:underline;text-decoration-color:rgba(139,92,246,0.35);text-underline-offset:2px}
.xpro-elementor-content a:hover{color:#6D28D9}
.xpro-elementor-content strong{color:#1A1A2E;font-weight:700}
.xpro-elementor-content ul,.xpro-elementor-content ol{margin:0 0 22px;padding-left:22px}
.xpro-elementor-content li{margin-bottom:10px}
.xpro-elementor-content blockquote{margin:28px 0;padding:20px 24px;background:#F6F4FD;border-left:3px solid #8B5CF6;border-radius:12px;font-style:italic;color:#4C4870}
.xpro-elementor-content img{border-radius:16px;max-width:100%;height:auto;margin:8px 0}
.xpro-elementor-content code{background:rgba(20,20,46,0.06);padding:2px 6px;border-radius:6px;font-size:15px}
.xpro-elementor-content hr{border:none;border-top:1px solid rgba(20,20,46,0.1);margin:36px 0}

/* Single post: category badge hover */
.xpro-theme-builder-singular-wrapper a{transition:opacity .2s ease}
.xpro-theme-builder-singular-wrapper a:hover{opacity:0.85}

/* Hero badge: fade+drop-in entrance, icon nudge on hover (matches hero-badge component motion) */
.vtk-hero-badge{display:inline-flex;align-items:center;gap:8px;font-family:Inter,sans-serif;font-weight:700;font-size:12px;letter-spacing:.3px;color:#1A1A2E;background:rgba(20,20,46,0.05);border:1px solid rgba(20,20,46,0.12);border-radius:999px;padding:8px 18px;opacity:0;transform:translateY(-20px);animation:vtk-badge-in .8s cubic-bezier(.16,1,.3,1) forwards;transition:background .25s ease,border-color .25s ease,transform .25s ease}
.vtk-hero-badge:hover{background:rgba(20,20,46,0.09);border-color:rgba(20,20,46,0.22)}
@keyframes vtk-badge-in{to{opacity:1;transform:translateY(0)}}
.vtk-hero-badge-icon{display:inline-block;transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
.vtk-hero-badge:hover .vtk-hero-badge-icon{transform:rotate(-10deg)}
@media (prefers-reduced-motion:reduce){.vtk-hero-badge{animation:none;opacity:1;transform:none}.vtk-hero-badge-icon{transition:none}}

/* Feature icon badges: distinct gradient per icon + hover scale/rotate/glow */
.vtk-feat-icon{transition:transform .4s cubic-bezier(.34,1.56,.64,1),box-shadow .4s ease !important}
.vtk-feat-icon:hover{transform:scale(1.12) rotate(-6deg) !important}
.vtk-feat-icon svg,.vtk-feat-icon i{transition:transform .4s ease}
.vtk-feat-icon-1:hover{box-shadow:0 14px 30px rgba(59,130,246,0.45)}
.vtk-feat-icon-2:hover{box-shadow:0 14px 30px rgba(16,185,129,0.45)}
.vtk-feat-icon-3:hover{box-shadow:0 14px 30px rgba(99,102,241,0.45)}
.vtk-feat-icon-4:hover{box-shadow:0 14px 30px rgba(236,72,153,0.45)}
.vtk-feat-icon-5:hover{box-shadow:0 14px 30px rgba(168,85,247,0.45)}
.vtk-feat-icon-6:hover{box-shadow:0 14px 30px rgba(14,165,233,0.45)}
@media (prefers-reduced-motion:reduce){.vtk-feat-icon,.vtk-feat-icon:hover{transform:none !important}}

/* Feature cards: bordered box wrapping icon+text+tags, hover lift */
.vtk-feat-card{transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s ease,background .35s ease,box-shadow .35s ease}
.vtk-feat-card:hover{transform:translateY(-6px);border-color:rgba(255,255,255,0.22) !important;background:rgba(255,255,255,0.06) !important;box-shadow:0 20px 44px rgba(0,0,0,0.28)}

/* ---- Pricing section (#tarifs) redesign overrides ---- */
#tarifs .vtk-cta-team a.elementor-button,
#tarifs .vtk-cta-team.elementor-button,
#tarifs a.vtk-cta-team.elementor-button {
    background: linear-gradient(135deg,#8B5CF6,#D946EF) !important;
}
#tarifs .vtk-cta-biz a.elementor-button,
#tarifs .vtk-cta-biz.elementor-button,
#tarifs a.vtk-cta-biz.elementor-button {
    background: linear-gradient(135deg,#22C55E,#16A34A) !important;
}
#tarifs .vtk-price-grad {
    background: linear-gradient(135deg,#8B5CF6,#EC4899) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: #EC4899;
}
#tarifs .vtk-badge-team {
    background: linear-gradient(135deg,#F59E0B,#F97316) !important;
}
#tarifs .vtk-badge-biz {
    background: linear-gradient(135deg,#22C55E,#16A34A) !important;
}
#tarifs .elementor-icon.elementor-view-stacked svg,
#tarifs .elementor-icon.elementor-view-stacked i {
    color: #FFFFFF !important;
}
/* ---- Pricing cards: pin CTA buttons to bottom, let middle card protrude ---- */
#tarifs .vtk-price-spacer {
    flex: 1 1 auto;
}