/* Advanced Interactive Widgets CSS */

/* Animated Counter Widget */
.vc-animated-counter-section{padding:48px 0}
.vc-counter-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:32px}
.vc-counter-card{padding:32px 24px;border-radius:10px;border:1px solid var(--vc-border);background:linear-gradient(180deg, rgba(255,255,255,0.98), rgba(255,255,255,0.92));box-shadow:0 16px 48px rgba(15,23,42,0.08);text-align:center;transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1)}
.vc-counter-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 24px 72px rgba(124,58,237,0.16);border-color:rgba(124,58,237,0.28)}
.vc-counter-icon{width:72px;height:72px;margin:0 auto 20px;border-radius:10px;background:linear-gradient(135deg, var(--vc-primary), var(--vc-primary2));display:flex;align-items:center;justify-content:center;box-shadow:0 16px 40px rgba(124,58,237,0.24);transition:transform 0.4s ease}
.vc-counter-card:hover .vc-counter-icon{transform:rotate(10deg) scale(1.1)}
.vc-counter-icon i{font-size:32px;color:#fff}
.vc-counter-number{font-size:48px;font-weight:950;letter-spacing:-0.04em;margin-bottom:12px;display:flex;align-items:baseline;justify-content:center;gap:4px}
.vc-counter-value{background:linear-gradient(135deg, var(--vc-primary), var(--vc-primary2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.vc-counter-suffix{font-size:32px;color:var(--vc-primary);opacity:0.8}
.vc-counter-label{font-size:15px;font-weight:800;color:var(--vc-muted);letter-spacing:0.02em}

/* Pricing Toggle Widget */
.vc-pricing-toggle-section{padding:48px 0}
.vc-pricing-toggle-wrapper{display:flex;justify-content:center;margin:32px 0}
.vc-pricing-toggle-switch{display:flex;align-items:center;gap:16px;padding:12px 20px;border-radius:999px;background:rgba(255,255,255,0.92);border:1px solid var(--vc-border);box-shadow:0 12px 32px rgba(15,23,42,0.08)}
.vc-toggle-label{font-weight:800;font-size:14px;color:var(--vc-muted);transition:color 0.3s ease}
.vc-toggle-label.active{color:var(--vc-primary)}
.vc-toggle{position:relative;display:inline-block;width:56px;height:28px}
.vc-toggle input{opacity:0;width:0;height:0}
.vc-toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:rgba(15,23,42,0.12);border-radius:999px;transition:0.3s}
.vc-toggle-slider:before{position:absolute;content:"";height:20px;width:20px;left:4px;bottom:4px;background:#fff;border-radius:999px;transition:0.3s;box-shadow:0 4px 12px rgba(15,23,42,0.16)}
.vc-toggle input:checked + .vc-toggle-slider{background:linear-gradient(135deg, var(--vc-primary), var(--vc-primary2))}
.vc-toggle input:checked + .vc-toggle-slider:before{transform:translateX(28px)}
.vc-toggle-badge{padding:6px 12px;border-radius:999px;background:linear-gradient(135deg, rgba(220,38,38,0.12), rgba(124,58,237,0.10));border:1px solid rgba(220,38,38,0.24);font-size:12px;font-weight:950;color:rgba(220,38,38,0.88);letter-spacing:0.02em}

.vc-pricing-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:32px}
.vc-pricing-card{padding:40px 32px;border-radius:10px;border:1px solid var(--vc-border);background:rgba(255,255,255,0.92);box-shadow:0 16px 48px rgba(15,23,42,0.08);transition:all 0.4s ease;position:relative}
.vc-pricing-card:hover{transform:translateY(-8px);box-shadow:0 24px 72px rgba(124,58,237,0.14);border-color:rgba(124,58,237,0.24)}
.vc-pricing-card-popular{border:2px solid var(--vc-primary);box-shadow:0 20px 60px rgba(124,58,237,0.16)}
.vc-pricing-card-popular:hover{transform:translateY(-12px);box-shadow:0 28px 84px rgba(124,58,237,0.22)}
.vc-pricing-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);padding:8px 20px;border-radius:999px;background:linear-gradient(135deg, var(--vc-primary), var(--vc-primary2));color:#fff;font-size:12px;font-weight:950;letter-spacing:0.06em;text-transform:uppercase;box-shadow:0 8px 24px rgba(124,58,237,0.28)}
.vc-pricing-name{font-size:24px;font-weight:950;letter-spacing:-0.02em;margin:0 0 20px;text-align:center}
.vc-pricing-price{text-align:center;margin-bottom:32px}
.vc-price-monthly,.vc-price-yearly{font-size:56px;font-weight:950;letter-spacing:-0.04em;background:linear-gradient(135deg, var(--vc-primary), var(--vc-primary2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.vc-price-period{font-size:16px;color:var(--vc-muted);font-weight:800;margin-left:4px}
.vc-pricing-features{list-style:none;padding:0;margin:0 0 32px;display:grid;gap:12px}
.vc-pricing-features li{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--vc-text)}
.vc-pricing-features i{color:var(--vc-success);font-size:18px;flex-shrink:0}
.vc-btn-block{width:100%;justify-content:center}

/* Video Section Widget */
.vc-video-section{padding:64px 0;background:linear-gradient(180deg, rgba(248,250,252,0.6), rgba(255,255,255,0.4))}
.vc-video-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.vc-video-content .vc-title{margin-bottom:16px}
.vc-video-content .vc-subtitle{margin-bottom:24px;font-size:16px;line-height:1.7}
.vc-video-player{position:relative;border-radius:10px;overflow:hidden;box-shadow:0 24px 72px rgba(15,23,42,0.14);aspect-ratio:16/9}
.vc-video-embed{position:relative;width:100%;height:100%}
.vc-video-embed iframe{width:100%;height:100%;border:none}
.vc-video-thumb{width:100%;height:100%;object-fit:cover}
.vc-video-play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:80px;height:80px;border-radius:999px;background:linear-gradient(135deg, var(--vc-primary), var(--vc-primary2));border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 16px 48px rgba(124,58,237,0.32);transition:all 0.3s ease}
.vc-video-play-btn:hover{transform:translate(-50%, -50%) scale(1.1);box-shadow:0 20px 60px rgba(124,58,237,0.42)}
.vc-video-play-btn i{font-size:32px;color:#fff;margin-left:4px}
.vc-video-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;background:rgba(15,23,42,0.04);color:var(--vc-muted)}
.vc-video-placeholder i{margin-bottom:16px;opacity:0.4}
.vc-video-placeholder p{margin:0;font-weight:800}

/* Accordion FAQ Widget */
.vc-accordion-section{padding:48px 0}
.vc-accordion{max-width:860px;margin:32px auto 0;display:grid;gap:16px}
.vc-accordion-item{border-radius:10px;border:1px solid var(--vc-border);background:rgba(255,255,255,0.92);overflow:hidden;transition:all 0.3s ease}
.vc-accordion-item:hover{box-shadow:0 12px 36px rgba(15,23,42,0.08)}
.vc-accordion-item-active{border-color:rgba(124,58,237,0.24);box-shadow:0 16px 48px rgba(124,58,237,0.10)}
.vc-accordion-header{width:100%;padding:20px 24px;background:none;border:none;display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer;font-size:17px;font-weight:950;letter-spacing:-0.01em;color:var(--vc-text);text-align:left;transition:all 0.3s ease}
.vc-accordion-header:hover{color:var(--vc-primary)}
.vc-accordion-icon{font-size:14px;color:var(--vc-muted);transition:transform 0.3s ease}
.vc-accordion-item-active .vc-accordion-icon{transform:rotate(180deg);color:var(--vc-primary)}
.vc-accordion-body{overflow:hidden;transition:all 0.3s ease}
.vc-accordion-content{padding:0 24px 24px;color:var(--vc-muted);font-size:15px;line-height:1.7}
.vc-accordion-content p{margin:0 0 12px}
.vc-accordion-content p:last-child{margin:0}

/* Newsletter Widget */
.vc-newsletter-section{padding:48px 0}
.vc-newsletter-box{padding:48px 40px;border-radius:10px;display:flex;align-items:center;gap:32px;box-shadow:0 20px 64px rgba(15,23,42,0.12)}
.vc-newsletter-gradient{background:linear-gradient(135deg, rgba(124,58,237,0.12), rgba(37,99,235,0.10));border:1px solid rgba(124,58,237,0.22)}
.vc-newsletter-solid{background:linear-gradient(135deg, var(--vc-primary), var(--vc-primary2));border:none}
.vc-newsletter-solid .vc-newsletter-title,.vc-newsletter-solid .vc-newsletter-text{color:#fff}
.vc-newsletter-minimal{background:rgba(255,255,255,0.96);border:2px solid var(--vc-border)}
.vc-newsletter-icon{width:80px;height:80px;border-radius:10px;background:linear-gradient(135deg, var(--vc-primary), var(--vc-primary2));display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 16px 48px rgba(124,58,237,0.26)}
.vc-newsletter-solid .vc-newsletter-icon{background:rgba(255,255,255,0.24)}
.vc-newsletter-icon i{font-size:36px;color:#fff}
.vc-newsletter-content{flex:1}
.vc-newsletter-title{font-size:28px;font-weight:950;letter-spacing:-0.03em;margin:0 0 8px}
.vc-newsletter-text{margin:0;color:var(--vc-muted);font-size:15px}
.vc-newsletter-solid .vc-newsletter-text{color:rgba(255,255,255,0.90)}
.vc-newsletter-form{flex-shrink:0;min-width:380px}
.vc-newsletter-input-group{display:flex;gap:12px}
.vc-newsletter-input{flex:1;padding:14px 20px;border-radius:10px;border:1px solid var(--vc-border);background:rgba(255,255,255,0.96);font-size:15px;transition:all 0.3s ease}
.vc-newsletter-input:focus{outline:none;border-color:var(--vc-primary);box-shadow:0 0 0 4px rgba(124,58,237,0.12)}
.vc-newsletter-solid .vc-newsletter-input{background:#fff;border-color:rgba(255,255,255,0.24)}

/* Theme Showcase Widget */
.vc-theme-showcase-section{padding:48px 0}
.vc-theme-grid{display:grid;gap:32px;margin-top:32px}
.vc-theme-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.vc-theme-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.vc-theme-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}

.vc-theme-card{border-radius:10px;overflow:hidden;background:rgba(255,255,255,0.96);border:1px solid var(--vc-border);box-shadow:0 16px 48px rgba(15,23,42,0.08);transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1)}
.vc-theme-card:hover{transform:translateY(-8px);box-shadow:0 24px 72px rgba(124,58,237,0.16);border-color:rgba(124,58,237,0.24)}

.vc-theme-preview{position:relative;overflow:hidden;background:linear-gradient(180deg, rgba(248,250,252,0.8), rgba(255,255,255,0.6))}
.vc-theme-category{position:absolute;top:16px;left:16px;padding:6px 14px;border-radius:999px;background:rgba(255,255,255,0.96);backdrop-filter:blur(8px);font-size:12px;font-weight:950;letter-spacing:0.04em;text-transform:uppercase;color:var(--vc-primary);border:1px solid rgba(124,58,237,0.24);z-index:2;box-shadow:0 8px 24px rgba(124,58,237,0.12)}
.vc-theme-price{position:absolute;top:16px;right:16px;padding:8px 16px;border-radius:999px;background:linear-gradient(135deg, var(--vc-primary), var(--vc-primary2));font-size:16px;font-weight:950;color:#fff;z-index:2;box-shadow:0 8px 24px rgba(124,58,237,0.28)}

.vc-theme-image-wrapper{position:relative;aspect-ratio:4/3;overflow:hidden}
.vc-theme-image{width:100%;height:100%;object-fit:cover;transition:transform 0.6s cubic-bezier(0.4, 0, 0.2, 1)}
.vc-theme-card:hover .vc-theme-image{transform:scale(1.08)}

.vc-theme-overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(15,23,42,0.0), rgba(15,23,42,0.92));display:flex;align-items:flex-end;justify-content:center;padding:32px;opacity:0;transition:opacity 0.4s ease}
.vc-theme-card:hover .vc-theme-overlay{opacity:1}

.vc-theme-actions{display:flex;gap:12px;transform:translateY(20px);transition:transform 0.4s cubic-bezier(0.4, 0, 0.2, 1)}
.vc-theme-card:hover .vc-theme-actions{transform:translateY(0)}
.vc-btn-white{background:#fff;color:var(--vc-text);border:1px solid rgba(255,255,255,0.24)}
.vc-btn-white:hover{background:rgba(255,255,255,0.92);color:var(--vc-primary)}

.vc-theme-content{padding:24px}
.vc-theme-header{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.vc-theme-name{font-size:20px;font-weight:950;letter-spacing:-0.02em;margin:0;color:var(--vc-text)}
.vc-theme-badge{padding:4px 12px;border-radius:999px;font-size:10px;font-weight:950;letter-spacing:0.06em;text-transform:uppercase;flex-shrink:0}
.vc-theme-badge-new{background:#10b981;color:#fff}
.vc-theme-badge-updated{background:#3b82f6;color:#fff}
.vc-theme-badge-sale{background:#ef4444;color:#fff}
.vc-theme-desc{margin:0;font-size:14px;color:var(--vc-muted);line-height:1.6}

.vc-btn-outline{background:transparent;border:2px solid var(--vc-border);color:var(--vc-text);padding:12px 24px;display:inline-flex;align-items:center;gap:8px;transition:all 0.3s ease}
.vc-btn-outline:hover{background:var(--vc-primary);border-color:var(--vc-primary);color:#fff}
.vc-btn-outline i{transition:transform 0.3s ease}
.vc-btn-outline:hover i{transform:translateX(4px)}

/* Responsive Adjustments */
@media (max-width: 960px){
  .vc-counter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vc-pricing-cards{grid-template-columns:1fr}
  .vc-video-wrapper{grid-template-columns:1fr;gap:32px}
  .vc-newsletter-box{flex-direction:column;text-align:center;padding:40px 32px}
  .vc-newsletter-form{min-width:100%;width:100%}
  .vc-newsletter-input-group{flex-direction:column}
  .vc-theme-grid-3,.vc-theme-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width: 720px){
  .vc-counter-grid{grid-template-columns:1fr}
  .vc-counter-number{font-size:40px}
  .vc-price-monthly,.vc-price-yearly{font-size:44px}
  .vc-pricing-toggle-switch{flex-wrap:wrap;justify-content:center}
  .vc-accordion-header{font-size:15px;padding:16px 20px}
  .vc-accordion-content{padding:0 20px 20px}
  .vc-newsletter-title{font-size:22px}
  .vc-theme-grid,.vc-theme-grid-2,.vc-theme-grid-3,.vc-theme-grid-4{grid-template-columns:1fr}
  .vc-theme-actions{flex-direction:column}
}