/* VB0 (2026-10-24) — 시안 D 피트레인 라임: 레이싱 정비 구역, 사선 모서리·카본 무늬·속도선. 포인트 라임 #C6F432 한 가지 */
html.vb.vb0[data-c] { --acc: #C6F432; --acc-rgb: 198,244,50; --acc-ink: #000; --bg: #050505; --bg-2: #0E0E0E; --v3-r: 0px; }
.vb0 .en, .vb0 .vb0-tag, .vb0 .vb0-dash b, .vb0 .vb0-wheel span { font-family: "Barlow Condensed", "Pretendard", sans-serif; text-transform: uppercase; }
.vb0 .carbon, .vb0 .v3-gray, .vb0 .v3-subhd { background-color: #0E0E0E; background-image: linear-gradient(45deg, rgba(255,255,255,.022) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.022) 75%), linear-gradient(45deg, rgba(255,255,255,.022) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.022) 75%); background-size: 8px 8px; background-position: 0 0, 4px 4px; }
/* 사선 모서리 */
.vb0 .vb-btn, .vb0 .v3-btn, .vb0 .btn, .vb0 .v3-findbtn, .vb0 .v3-tel, .vb0 .rcard, .vb0 .tcard, .vb0 .v3-ibox, .vb0 .v3-why3 li, .vb0 .v3-torque, .vb0 .v3-free, .vb0 .v3-tips a, .vb0 .v3-svc a, .vb0 .v3-gate a, .vb0 .v3-gate button, .vb0 .v3-makers button, .vb0 .v3-inchgrid a, .vb0 .v3-sizechips button, .vb0 .svcgrid > li, .vb0 .box
  { border-radius: 0 !important; clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px)); }
.vb0 .vb-btn:not(.pri) { border: 0; background: rgba(255,255,255,.1); }

/* 첫 화면 */
.vb0-hero { min-height: min(92vh, 860px); display: flex; flex-direction: column; justify-content: flex-end; }
.vb0-hero .vb-hero-bg { filter: grayscale(1) brightness(.28) contrast(1.3); }
.vb0-speed { position: absolute; inset: 0; background: repeating-linear-gradient(100deg, transparent 0 60px, rgba(198,244,50,.05) 60px 61px); animation: vb0run 1.6s linear infinite; }
@keyframes vb0run { to { background-position: 122px 0; } }
.vb0-hero-in { display: grid; grid-template-columns: 1.25fr 1fr; gap: 30px; align-items: center; padding-block: 80px 50px; flex: 1; }
.vb0-tag { display: inline-flex; align-items: center; gap: 10px; color: var(--acc); font-size: 15px; letter-spacing: .15em; }
.vb0-tag::before { content: ""; width: 30px; height: 2px; background: var(--acc); }
.vb0-hero h1 { margin: 16px 0 20px; }
.vb0-hero h1 .en { display: block; font: italic 800 clamp(46px, 6.2vw, 88px)/.88 "Barlow Condensed", sans-serif; letter-spacing: -.01em; }
.vb0-hero h1 em { font-style: inherit; color: var(--acc); }
.vb0-hero h1 .ko { display: block; font-size: clamp(22px, 2.8vw, 36px); font-weight: 800; letter-spacing: -.04em; margin-top: 12px; }
.vb0-hero p { color: #B9B9B9; margin: 0 0 26px; font-size: 15px; }
.vb0-hero p b { color: #FFF; font-weight: 600; }
.vb0-wheel { justify-self: center; width: min(380px, 70vw); text-align: center; }
.vb0-wheel svg { width: 100%; animation: vb0spin 9s linear infinite; }
@keyframes vb0spin { to { transform: rotate(360deg); } }
.vb0-wheel span { display: block; margin-top: 14px; font-size: 16px; letter-spacing: .3em; color: #6E6E6E; white-space: nowrap; }
.vb0-dash { position: relative; z-index: 2; border-top: 1px solid rgba(255,255,255,.09); background: rgba(5,5,5,.75); backdrop-filter: blur(6px); }
.vb0-dash .v3-wrap { display: grid; grid-template-columns: repeat(4, 1fr); }
.vb0-dash .v3-wrap > div { padding: 22px 20px; border-right: 1px solid rgba(255,255,255,.09); }
.vb0-dash .v3-wrap > div:last-child { border: 0; }
.vb0-dash b { display: block; font: italic 800 40px/1 "Barlow Condensed", sans-serif; }
.vb0-dash b small { font-size: 18px; color: var(--acc); }
.vb0-dash span { color: #9A9A9A; font-size: 13px; }
@media (max-width: 899px) {
  .vb0-hero-in { grid-template-columns: 1fr; padding-block: 50px 30px; }
  .vb0-wheel { width: 52vw; order: -1; }
  .vb0-dash .v3-wrap { grid-template-columns: repeat(2, 1fr); padding: 0; }
  .vb0-dash .v3-wrap > div:nth-child(2) { border-right: 0; }
  .vb0-dash .v3-wrap > div:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.09); }
}

/* 섹션 제목·하위 화면 머리 */
.vb0 .v3-sec-h h2 { font-weight: 800; letter-spacing: -.04em; }
.vb0 .v3-sec-h h2 em { font-style: normal; color: var(--acc); }
.vb0 .v3-subhd { border-bottom: 1px solid rgba(255,255,255,.08); }
.vb0 .v3-subhd h1 { font-weight: 900; letter-spacing: -.04em; }
.vb0 .v3-subhd h1::before { content: ""; display: block; width: 34px; height: 3px; background: var(--acc); margin-bottom: 14px; }
.vb0 .v3-gnb a.on, .vb0 .v3-gnb a:hover { color: var(--acc); }

/* 휴대폰: 돌아가는 바퀴는 오른쪽 위에 흐리게 (첫 문구·단추가 첫 화면에 먼저 보이게) */
@media (max-width: 899px) {
  .vb0-hero-in { padding-block: 64px 28px; }
  .vb0-wheel { position: absolute; right: -18vw; top: 10px; width: 62vw; opacity: .28; order: 0; pointer-events: none; z-index: -1; }
  .vb0-wheel span { display: none; }
  .vb0-hero-in > div:first-child { position: relative; z-index: 1; }
}