/* === STYLE DLA GAMING TEMATYCZNY (CUSTOM PC) === */

.wm-theme-header {
    text-align: center;
    margin-bottom: 40px;
}
.wm-theme-title {
    font-family: 'Arial Black', Impact, sans-serif;
    font-size: 48px;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 0 0 15px 0;
    text-shadow: 0 10px 30px rgba(0,0,0,0.8);
}
.wm-video-container {
    position: relative;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto 60px auto;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--border-subtle);
    box-shadow: 0 20px 50px rgba(0, 255, 204, 0.1);
}
.wm-video-container iframe {
    width: 100%;
    aspect-ratio: 16/9;
    display: block;
}

.wm-theme-description {
    max-width: 800px;
    margin: 0 auto 60px auto;
    text-align: center;
    font-size: 16px;
    color: var(--text-muted);
    line-height: 1.8;
}

/* Galeria 10 zdjęć - Grid na stronie */
.wm-grid-10 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 15px;
    margin-bottom: 80px;
}
.wm-grid-10 img {
    width: 100%;
    height: 320px;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid var(--border-subtle);
    transition: var(--transition);
    cursor: pointer;
    filter: brightness(0.7);
}
.wm-grid-10 img:hover {
    filter: brightness(1);
    border-color: var(--accent-main);
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,255,204,0.15);
}

/* Sekcja formularza Briefu */
.wm-contact-form-wrapper {
    position: relative;
    max-width: 100%;
    margin: 0 auto 80px auto;
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-top: 2px solid var(--accent-main);
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}
.wm-btn-contact-submit {
    max-width: 400px;
    display: block;
    margin: 0 auto;
    border-radius: 6px;
    clip-path: none;
}

/* LIGHTBOX - Natywny Swipe (Jak w Topazie) */
.wm-lightbox { 
    display: none; position: fixed; z-index: 9999999; left: 0; top: 0; 
    width: 100vw; height: 100vh; background-color: rgba(5, 6, 8, 0.95); 
    backdrop-filter: blur(10px); align-items: center; justify-content: center; 
    opacity: 0; transition: opacity 0.3s ease; 
}
.wm-lightbox.active { display: flex; opacity: 1; }
.wm-lightbox-close { 
    position: absolute; top: 30px; right: 40px; color: var(--text-muted); 
    font-size: 35px; cursor: pointer; transition: var(--transition); z-index: 2; 
}
.wm-lightbox-close:hover { color: var(--danger); transform: scale(1.1) rotate(90deg); }
.wm-lightbox-prev, .wm-lightbox-next { 
    position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,0.6); 
    border: 1px solid rgba(255,255,255,0.1); color: #fff; font-size: 24px; padding: 20px 25px; 
    cursor: pointer; border-radius: 8px; transition: var(--transition); z-index: 2; 
}
.wm-lightbox-prev { left: 30px; }
.wm-lightbox-next { right: 30px; }
.wm-lightbox-prev:hover, .wm-lightbox-next:hover { 
    background: var(--accent-main); color: #000; border-color: var(--accent-main); 
    box-shadow: 0 0 20px var(--accent-glow); 
}

.wm-lightbox-track { 
    display: flex; width: 100%; height: 100%; overflow-x: auto; 
    scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth; 
    align-items: center; 
}
.wm-lightbox-track::-webkit-scrollbar { display: none; }
.wm-lightbox-track img { 
    flex: 0 0 100%; max-width: 100%; max-height: 85vh; 
    object-fit: contain; scroll-snap-align: center; padding: 0 20px;
}

@media (max-width: 768px) {
    .wm-theme-title { font-size: 32px; }
    .wm-grid-10 { grid-template-columns: repeat(2, 1fr); }
    .wm-grid-10 img { height: 150px; }
    .wm-contact-form-wrapper { padding: 20px; }
    .wm-lightbox-prev, .wm-lightbox-next { padding: 15px; font-size: 18px; }
    .wm-lightbox-prev { left: 10px; }
    .wm-lightbox-next { right: 10px; }
    .wm-lightbox-close { top: 15px; right: 20px; font-size: 30px; }
}