/* Versa Consult – v1.5.0 */
/* Dark theme tokens */
:root{
  --vc-bg: #0b0b0b;
  --vc-card: #161616;
  --vc-text: #ffffff;
  --vc-muted: #b3b3b3;
  --vc-border: rgba(255,255,255,0.22);
  --vc-chip-active-bg: #ffffff;
  --vc-chip-active-text: #000000;
  --vc-shadow: 0 12px 30px rgba(0,0,0,0.35);
}

/* Container */
.versa-consult-form.ui-dark{ color:var(--vc-text); background:transparent; display:block; padding:1rem 0; }

.vc-h1{ font-size:clamp(1.25rem,1.1rem + 1vw,1.6rem); font-weight:700; margin:0 0 .75rem; }

/* Chips row */
.consult-options{ display:flex; flex-wrap:wrap; gap:.8rem; align-items:flex-start; overflow:visible; margin-bottom:1rem; }
.chip{
  display:inline-flex; align-items:center; padding:.7rem 1.05rem; border:1px solid var(--vc-border);
  border-radius:9999px; background:transparent; color:var(--vc-text); line-height:1; cursor:pointer;
  box-shadow:var(--vc-shadow); transition:transform .12s ease, background .2s, color .2s, border-color .2s; will-change:transform;
}
.chip:hover{ transform:translateY(-1px); }
input[type="checkbox"],input[type="radio"]{ position:absolute; opacity:0; pointer-events:none; }
input:checked + .chip{ background:var(--vc-chip-active-bg); color:var(--vc-chip-active-text); border-color:var(--vc-chip-active-bg); }
.chip[aria-pressed="true"]{ background:var(--vc-chip-active-bg); color:var(--vc-chip-active-text); border-color:var(--vc-chip-active-bg); }

/* Other pill */
.consult-other{ display:inline-flex; align-items:center; gap:.65rem; padding:.6rem .9rem; border:1px solid var(--vc-border);
  border-radius:9999px; max-width:100%; box-shadow:var(--vc-shadow); }
.consult-other input[type="text"]{ min-width:14rem; max-width:100%; width:100%; background:transparent; border:0; outline:0; color:var(--vc-text); opacity:.9; }

/* Fields */
.vc-field{ margin: .9rem 0; }
.vc-label{ display:block; margin:0 0 .35rem; color:var(--vc-muted); font-size:.95rem; }
.versa-consult-form input[type="text"],
.versa-consult-form input[type="email"],
.versa-consult-form input[type="tel"],
.versa-consult-form textarea{
  width:100%; max-width:100%; min-height:52px;
  background:var(--vc-card); color:var(--vc-text);
  border:1px solid var(--vc-border); border-radius:18px;
  padding:.85rem 1rem; box-shadow:var(--vc-shadow);
  box-sizing:border-box;
}

/* Responsive grid — no overlap ever */
.vc-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:1rem;
}
@media (max-width: 1200px){
  .vc-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px){
  .vc-grid{ grid-template-columns: 1fr; }
}

/* Button */
.vc-btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  padding:.95rem 1.35rem; border-radius:20px; border:1px solid #fff; background:transparent; color:var(--vc-text);
  cursor:pointer; box-shadow:var(--vc-shadow); overflow:hidden; transition:transform .12s ease, background .2s;
}
.vc-btn:hover{ transform:translateY(-1px); background:rgba(255,255,255,.06); }
.vc-btn-primary .vc-btn-glow{ position:absolute; inset:-1px; border-radius:20px; background:radial-gradient(120px 50px at 10% 0%, rgba(255,255,255,.12), transparent 60%), radial-gradient(180px 80px at 100% 100%, rgba(255,255,255,.06), transparent 70%); pointer-events:none; mix-blend-mode:screen; }

/* EPIC monochrome rocket */
.vc-rocket{ position:fixed; inset:0; pointer-events:none; opacity:0; transition:opacity .15s ease; z-index:99999; }
.vc-rocket-active{ opacity:1; }
.vc-rocket-icon{
  position:absolute; left:-12vw; top:65%; width:56px; height:56px; background:#000;
  border-radius:28px 28px 18px 18px; /* capsule */
  transform: translate3d(0,0,0) rotate(-12deg);
  box-shadow: inset 0 -8px 16px rgba(255,255,255,.08), 0 12px 30px rgba(0,0,0,.6);
}
.vc-rocket-icon::before{ /* nose */
  content:''; position:absolute; left:14px; top:-18px; width:28px; height:28px; background:#000; border-radius:50% 50% 4px 4px;
  transform: rotate(45deg);
}
.vc-rocket-icon::after{ /* fins */
  content:''; position:absolute; right:-10px; bottom:8px; width:18px; height:18px; background:#000; border-radius:0 12px 12px 12px;
  box-shadow: -64px 0 0 0 #000;
}

.vc-rocket-plume{
  position:absolute; left:-12vw; top:65%; width:40px; height:40px; transform: translate3d(0,0,0);
  filter: blur(10px); opacity:.9;
  background: radial-gradient(circle at 50% 50%, rgba(0,0,0,0.9), rgba(0,0,0,0.15) 60%, transparent 70%);
}
.vc-rocket-shock{
  position:absolute; left:-12vw; top:65%; width:120px; height:120px; border-radius:50%;
  background: radial-gradient(circle, rgba(0,0,0,.35), transparent 60%);
  transform: translate3d(-40px,20px,0) scale(0.4);
  opacity:0;
}
.vc-rocket-streak{
  position:absolute; left:0; top:0; right:0; bottom:0;
  background: linear-gradient(90deg, rgba(0,0,0,.45), transparent 25%);
  mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
  opacity:0;
}

/* Animations */
.vc-rocket-active .vc-rocket-icon{ animation: vc-fly 1.4s cubic-bezier(.2,.6,.2,1) forwards; }
.vc-rocket-active .vc-rocket-plume{ animation: vc-plume 1.4s ease-out forwards; }
.vc-rocket-active .vc-rocket-shock{ animation: vc-shock 1.4s ease-out forwards; }
.vc-rocket-active .vc-rocket-streak{ opacity:1; animation: vc-streak 1.4s ease-in forwards; }

@keyframes vc-fly{
  0% { transform: translate3d(-12vw, 0, 0) rotate(-12deg) scale(1); }
  40% { transform: translate3d(20vw, -14vh, 0) rotate(-4deg) scale(1.05); }
  70% { transform: translate3d(60vw, -30vh, 0) rotate(6deg) scale(1.08); }
  100% { transform: translate3d(110vw, -46vh, 0) rotate(0deg) scale(1.1); }
}
@keyframes vc-plume{
  0% { transform: translate3d(-12vw, 0, 0) scale(1); opacity:.95; filter: blur(18px); }
  60% { transform: translate3d(35vw, -10vh, 0) scale(2.2); opacity:.7; filter: blur(22px); }
  100% { transform: translate3d(110vw, -36vh, 0) scale(2.6); opacity:0; filter: blur(28px); }
}
@keyframes vc-shock{
  0% { opacity: 0; transform: translate3d(-40px,20px,0) scale(0.4); }
  25% { opacity: .5; transform: translate3d(0,0,0) scale(1.2); }
  60% { opacity: .2; transform: translate3d(30vw,-8vh,0) scale(2.2); }
  100% { opacity: 0; transform: translate3d(80vw,-20vh,0) scale(3); }
}
@keyframes vc-streak{
  0% { opacity: 0; }
  10% { opacity: .9; }
  100% { opacity: 0; }
}
