/* vk-pdp-tabs
   Split out of the monolithic product-page stylesheet so this section
   owns exactly one file. Do not merge these back together. */

.vpk-details {
 background: #000;
 padding: 60px 0 80px;
 font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
 color: #888;
 -webkit-font-smoothing: antialiased;
 position: relative;
 overflow: hidden;
 }

.vpk-details::before {
 content: '';
 position: absolute;
 top: 0;
 left: 50%;
 transform: translateX(-50%);
 width: 800px;
 height: 400px;
 background: radial-gradient(ellipse, rgba(170,255,0,0.02) 0%, transparent 70%);
 pointer-events: none;
 }

.vpk-details__inner {
 max-width: 1200px;
 margin: 0 auto;
 padding: 0 24px;
 position: relative;
 z-index: 1;
 }

.vpk-details__label {
 font-family: 'Inter', sans-serif;
 font-size: 10px;
 font-weight: 700;
 letter-spacing: 0.16em;
 text-transform: uppercase;
 color: #AAFF00;
 margin-bottom: 16px;
 display: flex;
 align-items: center;
 gap: 10px;
 }

.vpk-details__label::before {
 content: '';
 display: block;
 width: 20px;
 height: 1px;
 background: rgba(170,255,0,0.4);
 }

.vpk-tabs-wrap {
 position: relative;
 margin-bottom: 0;
 }

.vpk-tabs {
 display: flex;
 gap: 0;
 position: relative;
 overflow-x: auto;
 scrollbar-width: none;
 border-bottom: 1px solid #1a1a1a;
 }

.vpk-tabs::-webkit-scrollbar { display: none; }

.vpk-tab {
 flex-shrink: 0;
 padding: 16px 28px;
 font-family: 'Inter', sans-serif;
 font-size: 11.5px;
 font-weight: 600;
 letter-spacing: 0.07em;
 text-transform: uppercase;
 color: #444;
 background: transparent;
 border: none;
 cursor: pointer;
 transition: color 0.35s ease;
 white-space: nowrap;
 outline: none;
 position: relative;
 text-align: center;
 }

.vpk-tab:hover { color: #888; }

.vpk-tab.vpk-tab--on {
 color: #fff;
 }

.vpk-tab:focus-visible {
 outline: 2px solid rgba(170,255,0,0.4);
 outline-offset: -2px;
 }

.vpk-tabs__indicator {
 position: absolute;
 bottom: -1px;
 height: 2px;
 background: #AAFF00;
 border-radius: 2px 2px 0 0;
 transition: left 0.35s cubic-bezier(0.25, 0.1, 0.25, 1), width 0.35s cubic-bezier(0.25, 0.1, 0.25, 1);
 box-shadow: 0 0 12px rgba(170,255,0,0.3), 0 0 30px rgba(170,255,0,0.1);
 z-index: 2;
 }

.vpk-panels {
 position: relative;
 min-height: 220px;
 }

.vpk-panel {
 display: none;
 padding: 48px 0;
 opacity: 0;
 transform: translateY(10px);
 animation: vpkSlideIn 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
 }

.vpk-panel.vpk-panel--on { display: block; }

@media (max-width: 768px) {
  .vpk-details { padding: 40px 0 60px; }
  .vpk-details__inner { padding: 0 16px; }
  .vpk-tab {
 padding: 14px 18px;
 font-size: 12px;
 }
  .vpk-panel { padding: 32px 0; }
}

@media (max-width: 480px) {
  .vpk-panel { padding: 28px 0; }
  .vpk-tab {
 padding: 12px 14px;
 font-size: 12px;
 letter-spacing: 0.04em;
 }
}
