.section-video-wrapper,.section-video-wrapper .video-container{position:relative;display:inline-block;width:100%}.section-video-wrapper .video-container{max-width:100%}.vertical-controls{position:absolute;left:16px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:16px;z-index:20;align-items:center}.control-item,.volume-control-wrapper{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px}.volume-control-wrapper{transition:all .3s ease}.volume-control-wrapper.expanded{gap:12px}.volume-control{flex-direction:column;gap:8px}.control-button,.volume-control{position:relative;display:flex;align-items:center}.control-button{background:rgba(255,255,255,.9);border:2px solid rgba(255,255,255,.95);border-radius:50%;width:52px;height:52px;padding:0;cursor:pointer;justify-content:center;color:#1f2937;transition:all .25s ease;box-shadow:0 4px 12px rgba(0,0,0,.2);overflow:hidden}.control-item.hovered .control-button,.volume-control.hovered .control-button{background:rgba(255,255,255,1);box-shadow:0 6px 16px rgba(0,0,0,.25);transform:translateY(-2px)}.play-pause-control .control-button.playing{color:#3b82f6}.play-pause-control .control-button.paused{color:#ef4444}.replay-control .control-button{color:#8b5cf6}.volume-control .control-button.unmuted{color:#10b981}.volume-control .control-button.muted{color:#ef4444}.control-button:active{transform:scale(.93)}.control-tooltip{position:absolute;left:70px;background:rgba(31,41,55,.95);color:white;padding:8px 12px;border-radius:6px;font-size:12px;font-weight:600;white-space:nowrap;opacity:0;pointer-events:none;transform:translateX(-10px);transition:all .2s ease;backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.1)}.control-item.hovered .control-tooltip,.volume-control.hovered .control-tooltip{opacity:1;transform:translateX(0)}.volume-slider-panel{position:absolute;left:70px;bottom:50%;transform:translateY(50%);display:flex;flex-direction:column;align-items:center;gap:12px;background:rgba(255,255,255,.95);padding:12px 14px;border-radius:12px;backdrop-filter:blur(8px);box-shadow:0 8px 32px rgba(0,0,0,.15);border:1px solid rgba(255,255,255,1);animation:volumeSlideIn .3s cubic-bezier(.34,1.56,.64,1);pointer-events:auto}@keyframes volumeSlideIn{0%{opacity:0;transform:translateY(50%) translateX(-10px)}to{opacity:1;transform:translateY(50%) translateX(0)}}.volume-slider-track{display:flex;flex-direction:column;align-items:center;height:120px;justify-content:center}.volume-slider-input{width:8px;height:120px;-webkit-appearance:slider-vertical;-webkit-writing-mode:bt-lr;appearance:slider-vertical;writing-mode:bt-lr;border-radius:4px;outline:none;cursor:pointer}.volume-slider-input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#2563eb);cursor:pointer;box-shadow:0 4px 12px rgba(59,130,246,.4);transition:all .2s ease;border:2px solid rgba(255,255,255,.8)}.volume-slider-input::-webkit-slider-thumb:hover{transform:scale(1.25);box-shadow:0 6px 16px rgba(59,130,246,.6)}.volume-slider-input::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#2563eb);cursor:pointer;border:2px solid rgba(255,255,255,.8);box-shadow:0 4px 12px rgba(59,130,246,.4);transition:all .2s ease}.volume-slider-input::-moz-range-thumb:hover{transform:scale(1.25);box-shadow:0 6px 16px rgba(59,130,246,.6)}.volume-slider-input::-moz-range-track{background:transparent;border:none}.volume-percentage-display{display:flex;align-items:flex-end;gap:2px;min-width:48px}.percentage-number{font-size:18px;font-weight:700;color:#3b82f6;line-height:1}.percentage-symbol{font-size:12px;font-weight:600;color:#6b7280;line-height:1.2}@media (max-width:768px){.vertical-controls{left:8px;gap:12px}.control-button{width:44px;height:44px}.control-button svg{width:22px;height:22px}.control-tooltip{left:60px;font-size:11px}.volume-slider-panel{left:60px;padding:10px 12px;gap:10px}.volume-slider-track{height:100px}.volume-slider-input{height:100px;width:6px}.volume-slider-input::-webkit-slider-thumb{width:16px;height:16px}.volume-slider-input::-moz-range-thumb{width:16px;height:16px}.percentage-number{font-size:16px}}@media (max-width:480px){.vertical-controls{left:6px;gap:10px}.control-button{width:40px;height:40px}.control-button svg{width:20px;height:20px}.control-tooltip,.volume-slider-panel{display:none}}