/* ReclameMans – "Jouw bus beletterd" (all rules scoped to .bus-studio) */
.bus-studio{--bs-line:var(--line,#262633);--bs-card:var(--card,#15151f);--bs-acc:var(--pink,#ff2d9b);color:var(--txt,#f2f2f7);font-family:Inter,system-ui,sans-serif;margin:0 auto;max-width:1240px;width:100%}
.bus-studio *,.bus-studio *::before,.bus-studio *::after{box-sizing:border-box}
.bus-studio .bs-wrap{display:grid;gap:22px;grid-template-columns:minmax(0,1fr)}
.bus-studio .bs-stage{position:sticky;top:var(--bus-top,70px);z-index:5;align-self:start;background:var(--bg,#0a0a0f);padding:6px 0 4px}
.bus-studio .bs-frame{border:1px solid var(--bs-line);border-radius:var(--radius,16px);overflow:hidden;background:#0a0a0f;box-shadow:0 30px 70px -30px rgba(255,45,155,.28),0 0 0 1px rgba(255,255,255,.02) inset}
.bus-studio .bs-svg{display:block;width:100%;height:auto}
.bus-studio .bs-body{fill:#f3f4f6;transition:fill .45s ease}
.bus-studio .bs-van{animation:bs-in .9s cubic-bezier(.2,.8,.2,1) both}
@keyframes bs-in{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}}
.bus-studio .bs-disc{margin:10px 2px 0;font-size:13px;line-height:1.45;color:var(--muted,#9a9aae)}
.bus-studio .bs-ctrl{display:flex;flex-direction:column;gap:14px;min-width:0}
.bus-studio .bs-fs{border:1px solid var(--bs-line);border-radius:14px;background:var(--bs-card);padding:14px 16px 16px;margin:0;min-width:0}
.bus-studio legend{padding:0 6px;margin-left:-6px;font-weight:700;font-size:14px;letter-spacing:.02em}
.bus-studio legend small{font-weight:500;color:var(--muted,#9a9aae)}
.bus-studio .bs-f{display:block;margin-top:10px}
.bus-studio .bs-f span{display:block;font-size:13px;color:var(--muted,#9a9aae);margin-bottom:5px}
.bus-studio .bs-f input{width:100%;min-height:46px;padding:11px 13px;border-radius:10px;border:1.5px solid var(--bs-line);background:var(--bg-soft,#101018);color:inherit;font:inherit;font-size:16px;transition:border-color .2s}
.bus-studio .bs-f input::placeholder{color:#5f5f73}
.bus-studio .bs-f input:hover{border-color:#3a3a4c}
.bus-studio .bs-f input:focus{outline:none;border-color:var(--bs-acc);box-shadow:0 0 0 3px rgba(255,45,155,.25)}
.bus-studio .bs-row{display:flex;flex-wrap:wrap;gap:8px 9px;align-items:center;margin-top:8px}
.bus-studio .bs-sw,.bus-studio .bs-seg,.bus-studio .bs-up{position:relative;cursor:pointer}
.bus-studio .bs-sw input,.bus-studio .bs-seg input,.bus-studio .bs-up input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.bus-studio .bs-sw span{display:block;width:36px;height:36px;border-radius:50%;background:var(--c);border:2px solid rgba(255,255,255,.18);box-shadow:inset 0 -6px 10px rgba(0,0,0,.22),inset 0 4px 8px rgba(255,255,255,.18);transition:transform .15s}
.bus-studio .bs-sw:hover span{transform:scale(1.07)}
.bus-studio .bs-sw input:checked+span{border-color:#fff;box-shadow:0 0 0 3px var(--bs-acc),inset 0 -6px 10px rgba(0,0,0,.22)}
.bus-studio .bs-seg span{display:inline-flex;align-items:center;min-height:42px;padding:9px 15px;border-radius:10px;border:1.5px solid var(--bs-line);background:var(--bg-soft,#101018);font-size:14px;font-weight:600;transition:border-color .2s,background .2s}
.bus-studio .bs-seg:hover span{border-color:#3a3a4c}
.bus-studio .bs-seg input:checked+span{border-color:var(--bs-acc);background:rgba(255,45,155,.13);color:#fff}
.bus-studio .bs-up span{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:10px 16px;border-radius:10px;border:1.5px dashed #4a4a60;background:var(--bg-soft,#101018);font-weight:600;font-size:14px}
.bus-studio .bs-up span::before{content:"";width:16px;height:16px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 16V4M6 10l6-6 6 6M4 20h16'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 16V4M6 10l6-6 6 6M4 20h16'/%3E%3C/svg%3E") center/contain no-repeat}
.bus-studio .bs-up:hover span{border-color:var(--bs-acc);color:var(--pink-soft,#ff6cbd)}
.bus-studio .bs-rm{min-height:44px;padding:8px 12px;background:none;border:0;color:var(--muted,#9a9aae);font:inherit;font-size:14px;text-decoration:underline;cursor:pointer}
.bus-studio .bs-rm[hidden]{display:none}
.bus-studio .bs-note{margin:10px 0 0;font-size:12.5px;color:var(--muted,#9a9aae)}
.bus-studio .bs-sw input:focus-visible+span,.bus-studio .bs-seg input:focus-visible+span,.bus-studio .bs-up input:focus-visible+span,.bus-studio .bs-rm:focus-visible,.bus-studio .btn:focus-visible{outline:3px solid var(--cyan,#22d3ee);outline-offset:3px}
.bus-studio .bs-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bus-studio .bs-act{display:flex;flex-direction:column;gap:10px;padding-top:2px}
.bus-studio .bs-act .btn{width:100%;white-space:normal;text-align:center}
.bus-studio .bs-wa{order:-1;font-size:16px}
.bus-studio .bs-dl[disabled]{opacity:.6;cursor:progress}
.bus-studio .bs-tip{margin:0;font-size:13px;color:var(--muted,#9a9aae)}
.bus-studio .bs-st{margin:0;min-height:1em;font-size:13px;color:var(--cyan,#22d3ee)}
.bus-studio .bs-ov{position:fixed;inset:0;z-index:100;background:rgba(5,5,8,.9);display:flex;align-items:center;justify-content:center;padding:16px}
.bus-studio .bs-ovb{max-width:900px;width:100%;text-align:center}
.bus-studio .bs-ovb img{width:100%;height:auto;border-radius:12px;-webkit-touch-callout:default}
.bus-studio .bs-ovb p{color:var(--txt,#f2f2f7);font-size:15px}
@media (min-width:960px){
.bus-studio .bs-wrap{grid-template-columns:minmax(0,1.55fr) minmax(320px,1fr);gap:30px;align-items:start}
.bus-studio .bs-stage{top:calc(var(--bus-top,70px) + 18px);padding:0;background:none}
.bus-studio .bs-ctrl{max-height:none}
}
@media (max-width:959px){
.bus-studio .bs-stage{margin:0 -4px;padding:6px 4px 6px;box-shadow:0 14px 18px -14px rgba(0,0,0,.9)}
.bus-studio .bs-disc{font-size:12px;margin-top:6px}
.bus-studio .bs-seg{flex:1 1 0}.bus-studio .bs-seg span{width:100%;justify-content:center;padding:9px 8px;font-size:13.5px}
}
@media (prefers-reduced-motion:reduce){
.bus-studio .bs-van{animation:none}
.bus-studio .bs-body,.bus-studio .bs-sw span,.bus-studio .bs-seg span,.bus-studio .bs-f input{transition:none}
}
