:root{
  --vq-night:#07090d;
  --vq-night-2:#0d1118;
  --vq-panel:#111722;
  --vq-panel-soft:#171f2d;
  --vq-white:#f7f9fc;
  --vq-silver:#aeb7c4;
  --vq-line:rgba(255,255,255,.09);
  --vq-blue:#5b7cff;
  --vq-blue-hot:#7f98ff;
  --vq-shadow:0 30px 90px rgba(0,0,0,.34);
}

html,body{background:var(--vq-night);}
body{color:var(--vq-white);}

.vq-app{
  position:relative;
  background:
    radial-gradient(900px 520px at 78% 6%,rgba(66,96,255,.20),transparent 62%),
    radial-gradient(700px 520px at 15% 92%,rgba(63,82,145,.12),transparent 64%),
    linear-gradient(180deg,#07090d 0%,#0a0e15 100%);
}
.vq-app:before{
  content:"";
  position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.65),transparent 72%);
}

.vq-topbar{
  border-bottom:1px solid rgba(255,255,255,.07);
  background:rgba(7,9,13,.72);
  backdrop-filter:blur(26px) saturate(150%);
}
.vq-brand{color:#fff;font-weight:900;letter-spacing:.18em;}
.vq-logo{
  background:linear-gradient(145deg,#eef2ff,#8fa6ff 52%,#5474ff);
  color:#07101f;
  box-shadow:0 10px 30px rgba(80,111,255,.28),inset 0 1px 0 rgba(255,255,255,.9);
}
.vq-top-note{
  color:#c6ced9;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.045);
  border-radius:999px;
  padding:8px 11px;
  letter-spacing:.04em;
}

.vq-start{gap:clamp(46px,6vw,90px);}
.vq-start-copy{position:relative;z-index:2;}
.vq-eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  color:#cbd3df;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.045);
  border-radius:999px;
  padding:9px 12px;
  font-size:9px;
  letter-spacing:.14em;
}
.vq-eyebrow:before{
  content:"";width:7px;height:7px;border-radius:50%;
  background:#7590ff;box-shadow:0 0 0 5px rgba(117,144,255,.11),0 0 20px rgba(117,144,255,.65);
}
.vq-start-copy h1{
  color:#fff;
  font-size:clamp(62px,6.8vw,96px);
  line-height:.91;
  letter-spacing:-.072em;
  font-weight:760;
  max-width:790px;
  text-wrap:balance;
  text-shadow:0 12px 50px rgba(0,0,0,.22);
}
.vq-start-copy h1 br{display:block;}
.vq-start-copy p{
  color:#aeb7c4;
  font-size:clamp(17px,1.34vw,20px);
  line-height:1.58;
  max-width:620px;
}
.vq-trustbar{margin-top:28px;gap:10px;}
.vq-trustbar span{
  color:#c8d0da;
  padding:9px 12px;
  border:1px solid rgba(255,255,255,.075);
  background:rgba(255,255,255,.035);
  border-radius:999px;
  font-size:10px;
}
.vq-trustbar b{
  width:16px;height:16px;
  background:rgba(119,145,255,.16);
  border:1px solid rgba(137,159,255,.28);
  color:#b8c7ff;
  box-shadow:none;
}

.vq-project-grid{
  position:relative;
  gap:14px;
  transform:perspective(1300px) rotateY(-3deg) rotateX(1deg);
  transform-origin:center;
}
.vq-project-grid:before{
  content:"PROJEKT WÄHLEN";
  position:absolute;top:-29px;left:4px;
  color:#718096;font-size:8px;font-weight:850;letter-spacing:.19em;
}
.vq-project-card{
  min-height:228px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:28px;
  box-shadow:0 24px 55px rgba(0,0,0,.27);
  transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s cubic-bezier(.2,.8,.2,1),border-color .28s ease;
}
.vq-project-card:before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.17);
}
.vq-project-card:hover{
  transform:translateY(-6px) scale(1.012);
  border-color:rgba(139,162,255,.38);
  box-shadow:0 30px 72px rgba(0,0,0,.37),0 0 0 1px rgba(112,139,255,.06);
}
.vq-project-shade{
  background:linear-gradient(180deg,rgba(4,7,12,.02) 0%,rgba(4,7,12,.12) 38%,rgba(4,7,12,.92) 100%);
}
.vq-project-featured{box-shadow:0 30px 75px rgba(36,57,124,.34);}
.vq-project-featured:after{
  content:'TOP-CHECK';
  background:rgba(9,13,21,.76);
  color:#e9eeff;
  border:1px solid rgba(255,255,255,.11);
  box-shadow:0 8px 20px rgba(0,0,0,.18);
}
.vq-project-copy{left:22px;right:60px;bottom:22px;}
.vq-project-card small{color:#b8c2d1;font-size:9px;font-weight:800;}
.vq-project-card b{font-size:29px;color:#fff;font-weight:760;letter-spacing:-.045em;}
.vq-project-card>i{
  right:20px;bottom:19px;width:36px;height:36px;border-radius:50%;
  display:grid;place-items:center;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(12px);
  font-size:18px;
}

.vq-start-foot{
  border-top:1px solid rgba(255,255,255,.065);
  padding-top:15px;
  color:#778393;
}
.vq-start-foot a{color:#939dac;transition:color .18s ease;}
.vq-start-foot a:hover{color:#fff;}

/* Wizard = premium product surface, not a form sheet */
.vq-wizard{
  background:
    radial-gradient(900px 500px at 50% -6%,rgba(78,105,255,.12),transparent 62%),
    linear-gradient(180deg,#0a0d13 0%,#0d121a 100%);
  color:#f8faff;
}
.vq-wizard-head{
  border-bottom:1px solid rgba(255,255,255,.07);
  background:rgba(10,13,19,.82);
  backdrop-filter:blur(24px) saturate(140%);
}
.vq-wizard-brand{color:#fff;}
.vq-icon-btn{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.045);
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.vq-progress{background:rgba(255,255,255,.07);}
.vq-progress span{background:linear-gradient(90deg,#617eff,#9bb0ff);box-shadow:0 0 20px rgba(97,126,255,.35);}
.vq-question-wrap,.vq-postcode-wrap,.vq-result-wrap,.vq-contact-wrap,.vq-success-card{position:relative;}
.vq-step-label{color:#76869b;font-weight:850;}
.vq-question-wrap h2,.vq-postcode-wrap h2,.vq-result-wrap h2,.vq-contact-wrap h2,.vq-success-card h2{
  color:#fff;font-weight:730;letter-spacing:-.055em;text-wrap:balance;
}
.vq-question-wrap>p,.vq-postcode-wrap>p,.vq-result-wrap>p,.vq-contact-wrap>p,.vq-success-card>p{color:#9da8b6;}

.vq-options{gap:12px;}
.vq-option{
  position:relative;overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.035));
  color:#f7f9fc;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 16px 40px rgba(0,0,0,.10);
}
.vq-option:before{
  content:"";position:absolute;inset:0;opacity:0;
  background:linear-gradient(135deg,rgba(105,134,255,.14),transparent 55%);
  transition:opacity .2s ease;
}
.vq-option:after{color:#8293ad;z-index:1;}
.vq-option span{position:relative;z-index:1;}
.vq-option:hover{
  border-color:rgba(113,142,255,.33);
  box-shadow:0 18px 45px rgba(0,0,0,.18);
}
.vq-option:hover:before{opacity:1;}

.vq-big-field,
.vq-profile-card,
.vq-contact-wrap label:not(.vq-consent){
  border-color:rgba(255,255,255,.09);
  background:rgba(255,255,255,.055);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 20px 50px rgba(0,0,0,.12);
}
.vq-big-field>span,.vq-profile-row span,.vq-contact-wrap label>span:first-child{color:#7c8a9e;}
.vq-big-field input,.vq-contact-wrap input:not([type=checkbox]){color:#fff;}
.vq-big-field:focus-within,.vq-contact-wrap label:focus-within{
  border-color:rgba(108,138,255,.46);
  box-shadow:0 0 0 4px rgba(85,115,255,.10),0 20px 50px rgba(0,0,0,.16);
}
.vq-mini-trust,.vq-trust-row{color:#7f8b9c;}

.vq-result-wrap{max-width:820px;padding-top:clamp(34px,6vh,66px);}
.vq-result-wrap:before{
  content:"VAYQUO ANALYSE";
  position:absolute;top:26px;right:42px;
  color:#5e6e84;font-size:8px;font-weight:850;letter-spacing:.18em;
}
.vq-profile-card{
  border-radius:26px;
  overflow:hidden;
  margin:10px 0 16px;
}
.vq-profile-row{border-bottom-color:rgba(255,255,255,.07);}
.vq-profile-row b{color:#eef3fa;font-weight:720;}

.vq-offer-preview{
  position:relative;overflow:hidden;
  border:1px solid rgba(132,157,255,.20);
  background:
    radial-gradient(460px 220px at 90% 0%,rgba(91,124,255,.24),transparent 65%),
    linear-gradient(145deg,#111927 0%,#0e1520 100%);
  border-radius:30px;
  padding:28px;
  box-shadow:0 32px 78px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.06);
}
.vq-offer-preview:after{
  content:"";position:absolute;right:-80px;top:-110px;width:250px;height:250px;border-radius:50%;
  border:1px solid rgba(145,166,255,.13);box-shadow:0 0 80px rgba(89,118,255,.13);
}
.vq-offer-label{color:#91a7ff;font-size:9px;}
.vq-offer-grid{gap:12px;position:relative;z-index:1;}
.vq-offer-grid>div{
  min-height:110px;
  border-color:rgba(255,255,255,.09);
  background:rgba(255,255,255,.045);
  border-radius:20px;
  display:flex;flex-direction:column;justify-content:center;
}
.vq-offer-grid b{font-size:clamp(22px,3vw,30px);color:#fff;}
.vq-offer-grid span{color:#a9b5c7;}
.vq-offer-preview p{color:#8f9cad;font-size:11px;}
.vq-offer-preview p strong{color:#d9e1ef;}
.vq-offer-preview p a{color:#b5c5ff!important;text-decoration:none;border-bottom:1px solid rgba(181,197,255,.35);}

.vq-result-cta,.vq-submit{
  border-radius:20px;
  background:linear-gradient(135deg,#5474ff,#6d8aff 52%,#4e6df0);
  box-shadow:0 18px 44px rgba(74,104,255,.27),inset 0 1px 0 rgba(255,255,255,.22);
  color:#fff;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}
.vq-result-cta:hover,.vq-submit:hover{
  transform:translateY(-2px);
  filter:brightness(1.04);
  box-shadow:0 23px 54px rgba(74,104,255,.36),inset 0 1px 0 rgba(255,255,255,.24);
}
.vq-consent{color:#8e99a8;}
.vq-consent a{color:#d6deea;}
.vq-form-status{color:#ff8c87;}

.vq-success-mark{
  background:linear-gradient(145deg,rgba(92,205,148,.20),rgba(59,161,111,.08));
  color:#7ce0ab;
  border:1px solid rgba(124,224,171,.16);
  box-shadow:0 14px 40px rgba(63,174,116,.10);
}
.vq-success-card button{
  border-color:rgba(255,255,255,.09);
  background:rgba(255,255,255,.05);
  color:#fff;
}

@media(max-width:860px){
  .vq-start{padding-top:26px;}
  .vq-start-copy h1{font-size:clamp(54px,14vw,76px);line-height:.93;max-width:700px;}
  .vq-project-grid{transform:none;margin-top:30px;}
  .vq-project-grid:before{top:-22px;}
  .vq-project-card{min-height:176px;}
  .vq-project-card b{font-size:24px;}
  .vq-start-foot{padding-bottom:20px;}
  .vq-result-wrap:before{display:none;}
}

@media(max-width:540px){
  .vq-topbar{background:rgba(7,9,13,.86);}
  .vq-top-note{padding:7px 9px;}
  .vq-start{padding:20px 16px 20px;}
  .vq-eyebrow{padding:8px 10px;font-size:7.5px;}
  .vq-start-copy h1{font-size:clamp(46px,14.7vw,65px);line-height:.95;letter-spacing:-.065em;margin:16px 0 16px;}
  .vq-start-copy p{font-size:15px;line-height:1.5;color:#a5afbc;}
  .vq-trustbar{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:20px;}
  .vq-trustbar span{justify-content:flex-start;padding:8px 9px;font-size:9px;}
  .vq-project-grid{grid-template-columns:1fr 1fr;gap:10px;margin-top:30px;}
  .vq-project-card{min-height:156px;border-radius:22px;}
  .vq-project-copy{left:14px;right:45px;bottom:14px;}
  .vq-project-card small{font-size:7.5px;}
  .vq-project-card b{font-size:19px;line-height:1.02;}
  .vq-project-card>i{width:30px;height:30px;right:12px;bottom:12px;font-size:15px;}
  .vq-project-featured:after{font-size:6.5px;padding:6px 7px;top:10px;right:10px;}
  .vq-start-foot{font-size:9px;gap:10px;margin-top:16px;}
  .vq-start-foot span{width:100%;}
  .vq-question-wrap,.vq-postcode-wrap,.vq-result-wrap,.vq-contact-wrap,.vq-success-card{padding-left:16px;padding-right:16px;}
  .vq-question-wrap h2,.vq-postcode-wrap h2,.vq-result-wrap h2,.vq-contact-wrap h2,.vq-success-card h2{font-size:clamp(40px,12vw,54px);line-height:.98;}
  .vq-options{grid-template-columns:1fr;}
  .vq-option{min-height:78px;border-radius:17px;font-size:16px;padding:16px;}
  .vq-profile-card{border-radius:21px;}
  .vq-profile-row{grid-template-columns:105px 1fr;padding:14px 15px;gap:10px;}
  .vq-profile-row b{font-size:15px;}
  .vq-offer-preview{padding:18px;border-radius:23px;}
  .vq-offer-grid{grid-template-columns:1fr;}
  .vq-offer-grid>div{min-height:auto;padding:14px 15px;border-radius:16px;}
  .vq-offer-grid b{font-size:23px;}
  .vq-result-cta{padding:17px 16px;border-radius:17px;}
}