/* ==========================================================
   SEARCH V1
   ========================================================== */

.search-page {
    max-width: 1100px;
    margin: 0 auto;
    padding: 32px 16px 48px;
}

.search-hero {
    text-align: center;
    margin-bottom: 28px;
    padding: 28px 20px;
    border-top: 1px solid rgba(255,255,255,.1);
    border-bottom: 1px solid rgba(255,255,255,.1);
    background: rgba(255,255,255,.02);
}

.search-kicker {
    margin: 0 0 8px;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    opacity: .65;
}

.search-hero h1 {
    margin: 0;
}

.search-filters,
.search-results {
    margin-top: 28px;
    padding: 24px 20px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 12px;
    background: rgba(255,255,255,.04);
}

.search-filters h2,
.search-results h2 {
    margin: 0;
}

.search-filter-form {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-top: 20px;
}

.search-filter-field {
    display: grid;
    gap: 7px;
}

.search-filter-field-wide {
    grid-column: 1 / -1;
}

.search-filter-field label {
    font-size: .9rem;
    opacity: .75;
}

.search-filter-field input,
.search-filter-field select {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 7px;
    background: rgba(0,0,0,.28);
    color: inherit;
}

.search-filter-actions {
    grid-column: 1 / -1;
    display: flex;
    gap: 10px;
    align-items: center;
}

.search-submit,
.search-reset,
.search-link-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 14px;
    border-radius: 7px;
    border: 1px solid rgba(255,255,255,.15);
    text-decoration: none;
    cursor: pointer;
}

.search-submit {
    background: transparent;
    color: #ffd166;
}

.search-reset {
    color: rgba(255,255,255,.7);
}

.search-submit:hover,
.search-reset:hover {
    border-color: #ffd166;
}

.search-results-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.search-results-count {
    margin: 0;
    opacity: .6;
    font-size: .9rem;
}

.search-table-wrap {
    overflow-x: auto;
}

.search-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 680px;
}

.search-table th,
.search-table td {
    padding: 11px 10px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    text-align: left;
    vertical-align: top;
}

.search-table th {
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    opacity: .65;
}

.search-table a {
    color: #fb923c;
    text-decoration: none;
}

.search-table a:hover {
    color: #ffd166;
    text-decoration: underline;
}

.search-result-name {
    font-weight: 700;
}

.search-empty {
    padding: 28px 0 6px;
    text-align: center;
    opacity: .75;
}

.search-empty h3 {
    margin: 0 0 8px;
}

.search-empty p {
    margin: 0;
}

.search-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    margin-top: 22px;
}

.search-pagination a {
    color: #fb923c;
    text-decoration: none;
}

.search-pagination a:hover {
    text-decoration: underline;
}

.search-pagination span {
    opacity: .65;
}

.search-navigation {
    max-width: 1100px;
    margin: 0 auto;
    padding: 28px 16px 40px;
}

@media (max-width: 850px) {
    .search-filter-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .search-page {
        padding: 24px 10px 40px;
    }

    .search-hero {
        padding: 22px 14px;
    }

    .search-filters,
    .search-results {
        padding: 20px 14px;
        border-radius: 10px;
    }

    .search-filter-form {
        grid-template-columns: 1fr;
    }

    .search-filter-field-wide,
    .search-filter-actions {
        grid-column: auto;
    }

    .search-results-header {
        display: block;
    }

    .search-results-count {
        margin-top: 6px;
    }

    .search-table {
        min-width: 0;
    }

    .search-table thead {
        display: none;
    }

    .search-table,
    .search-table tbody,
    .search-table tr,
    .search-table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }

    .search-table tr {
        padding: 12px 0;
        border-bottom: 1px solid rgba(255,255,255,.1);
    }

    .search-table td {
        display: grid;
        grid-template-columns: 145px minmax(0,1fr);
        gap: 12px;
        padding: 6px 0;
        border: 0;
    }

    .search-table td::before {
        content: attr(data-label);
        font-weight: 700;
        opacity: .6;
    }

    .search-table td[data-label="Nazwa"]::before,
    .search-table td[data-label="Event"]::before {
        opacity: .75;
    }
}


/* ==========================================================================
   1. RESET I STYLE BAZOWE
   ========================================================================== */
* { 
    box-sizing: border-box; 
    margin: 0; 
    padding: 0; 
}

html, body { 
    background: #000; 
    color: #fff; 
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; 
    line-height: 1.5; 
    -webkit-font-smoothing: antialiased; 
}

a { 
    color: #ffd166; 
    text-decoration: none; 
    transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

a:hover { 
    text-decoration: underline; 
}

.container { 
    max-width: 1200px; 
    margin: 0 auto; 
    padding: 0 16px; 
}

/* ==========================================================================
   2. NAGŁÓWEK STRONY (HEADER)
   ========================================================================== */
.site-header { 
    border-bottom: 1px solid rgba(255,255,255,0.1); 
    background: rgba(0,0,0,0.6); 
    padding: 32px 16px; 
    text-align: center; 
}

.site-header h1 { 
    font-size: clamp(28px, 5vw, 48px); 
    font-weight: 800; 
    letter-spacing: -0.02em; 
    background: linear-gradient(90deg, #ffd166, #fde047, #fb923c); 
    -webkit-background-clip: text; 
    background-clip: text; 
    color: transparent; 
}

.site-header p { 
    margin-top: 12px; 
    color: rgba(255,255,255,0.7); 
    max-width: 640px; 
    margin-left: auto; 
    margin-right: auto; 
    font-size: clamp(14px, 1.6vw, 16px); 
}

/* ==========================================================================
   3. UKŁAD GŁÓWNY (LAYOUT & RESPONSIVE GRID)
   ========================================================================== */
main { 
    padding: 8px 0 40px; 
}

.layout { 
    display: flex; 
    flex-direction: column; 
    gap: 24px; 
}

@media (min-width: 1024px) { 
    .layout { 
        display: grid;
        grid-template-columns: 1fr 360px; 
        gap: 32px; 
        align-items: start;
    } 
    .panel-wrap { 
        position: sticky; 
        top: 24px; 
    } 
}

/* ==========================================================================
   4. INTERAKTYWNA MAPA SVG
   ========================================================================== */
.map-wrap {
    width: 100%;
    margin: -20px auto -40px auto;
}

@media (min-width: 1024px) {
    .map-wrap {
        margin-top: -80px;
        margin-bottom: -120px;  
    }
}

.map-wrap svg {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 1 / 1;
    overflow: visible;
}

.poland-bg {
    fill: #141414 !important;
    stroke: rgba(255, 255, 255, 0.5) !important;
    stroke-width: 2px !important;                  
}

.city-group {
    cursor: pointer !important;
    outline: none;
}
.city-group:focus { 
    outline: none; 
}


.main-event-link {
    display: inline-flex;
    align-items: center;
    padding: 9px 14px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 7px;
    color: #ffd166;
    text-decoration: none;
}

.main-event-link:hover {
    border-color: #ffd166;
    text-decoration: none;
}

.city-dot {
    fill: #ffffff !important;
    stroke: #000000 !important;
    stroke-width: 2px !important;
    cursor: pointer !important;
    /* FIX: Bezpieczne przejście tylko dla właściwości geometrycznych i koloru */
    transition: r 0.2s ease, fill 0.2s ease;
}

.city-group:hover .city-dot, 
.city-dot.active {
    fill: #ffd166 !important;
    r: 10px !important;
}

.city-label {
    fill: rgba(255, 255, 255, 0.9) !important;
    font-size: 14px !important;
    font-family: sans-serif;
    font-weight: 600;
    user-select: none;
    pointer-events: auto !important; 
    cursor: pointer !important;
    paint-order: stroke;
    stroke: #000000;
    stroke-width: 3px;
    stroke-linejoin: round;
    /* FIX: Bezpieczna animacja koloru */
    transition: fill 0.2s ease !important;
}

.city-group:hover .city-label, 
.city-label.active {
    fill: #ffd166 !important;
}

/* ==========================================================================
   5. PANEL BOCZNY (SZCZEGÓŁY MIASTA)
   ========================================================================== */
.panel { 
    border: 1px solid rgba(255,255,255,0.15); 
    background: rgba(255,255,255,0.05); 
    border-radius: 12px; 
    padding: 24px; 
    backdrop-filter: blur(6px); 
}

.panel.empty { 
    text-align: center; 
    color: rgba(255,255,255,0.6); 
    min-height: 280px; 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    justify-content: center; 
}

.panel .eyebrow { 
    color: #ffd166; 
    font-size: 11px; 
    text-transform: uppercase; 
    letter-spacing: 0.15em; 
    font-weight: 600; 
    margin-bottom: 8px; 
}

.panel h2 { 
    font-size: 28px; 
    font-weight: 700; 
    margin-bottom: 12px; 
}

.panel .date { 
    color: rgba(255,255,255,0.8); 
    font-size: 14px; 
    margin-bottom: 16px; 
}

.panel .desc { 
    color: rgba(255,255,255,0.85); 
    margin-bottom: 20px; 
    white-space: pre-line; 
}

.panel .links { 
    display: flex; 
    flex-direction: column; 
    gap: 8px; 
    font-size: 14px; 
}

/* Boks kontaktowy CTA pod panelem */
.cta-panel {
    margin-top: 12px;
    padding: 12px; 
    text-align: center;
    border: 1px solid rgba(255,255,255,0.15); 
    background: rgba(255,255,255,0.05); 
    border-radius: 12px;
}

.cta-panel-text {
    margin: 0 0 10px 0;
    font-weight: normal;
    color: rgba(255,255,255,0.6);
}

.cta-panel-links {
    display: flex;
    flex-direction: row;      
    justify-content: center;  
    align-items: center;
    gap: 12px;                
}

.cta-panel-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto;
    min-width: 110px;        
    max-width: 140px;        
    text-align: center;
    text-decoration: none;
    font-size: 13px;
    padding: 8px 16px;
}

/* ==========================================================================
   6. SEKCJA WSZYSTKICH WYDARZEŃ (DOLNA SIATKA - SEO / PHP)
   ========================================================================== */
.events-list { 
    max-width: 1200px; 
    margin: 48px auto 0 auto; 
    border-top: 1px solid rgba(255,255,255,0.1); 
    padding-top: 32px; 
    width: 100%;
}

.events-list h2 { 
    font-size: 22px; 
    font-weight: 700; 
    margin-bottom: 24px; 
}

.events-list ul.events-grid { 
    display: grid; 
    grid-template-columns: 1fr; 
    gap: 24px; 
    list-style: none; 
    padding: 0; 
    margin: 20px 0;
    width: 100%;
}

@media (min-width: 768px) { 
    .events-list ul.events-grid { 
        grid-template-columns: repeat(2, 1fr); 
    } 
}

.event-card { 
    border: 1px solid rgba(255,255,255,0.1); 
    background: rgba(255,255,255,0.05); 
    border-radius: 8px; 
    padding: 20px; 
    margin: 0;
    display: flex;
    flex-direction: column;
}

.event-card h3 { 
    font-size: 18px; 
    font-weight: 600; 
    margin-bottom: 6px; 
}

.event-card .date { 
    color: #cecece; 
    font-size: 13px; 
    margin-bottom: 10px; 
}

.event-card p { 
    font-size: 14px; 
    color: rgba(255,255,255,0.8); 
    margin-bottom: 14px; 
}

/* ==========================================================================
   7. DUŻE PRZYCISKI MOBILNE Z DATAMI TURNIEJÓW (Wewnątrz kart)
   ========================================================================== */
.upcoming-dates-box {
    margin: 16px 0;
    background: rgba(255, 255, 255, 0.02);
    padding: 14px;
    border-radius: 8px;
    border-left: 3px solid #ffd166;
}

.upcoming-dates-box strong {
    color: #ffd166;
    display: block;
    margin-bottom: 12px;
    font-size: 14px;
}

.dates-btn-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 12px; 
    width: 100%;
}

/* Duży element dotykowy dla palców */
.dates-btn-grid a.date-mobile-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #1b1632;
    border: 1px solid #7055ff;
    color: #fb923c;
    padding: 12px 6px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    min-height: 48px;
    box-sizing: border-box;
    /* FIX PAGESPEED: Animacja ograniczona wyłącznie do tła i koloru tekstu w celu eliminacji błędu uncomposited animation */
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.dates-btn-grid a.date-mobile-btn:hover {
    background: #7055ff;
    color: #fff;
    border-color: #ffd166;
    /* FIX CLS: Usunięto transform: translateY(-1px), który podbijał współczynnik przesunięcia makiety */
    text-decoration: none;
}

/* Zewnętrzne odnośniki na dole karty (WWW / Fanpage) */
.event-card .links { 
    display: flex; 
    flex-wrap: wrap; 
    gap: 12px; 
    margin-top: auto; 
    padding-top: 10px;
}

.event-card .links a.ext-link {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 10px 16px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    color: #ffd166;
    text-decoration: none;
    /* FIX: Bezpieczne płynne przejście koloru tła i obramowania */
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.event-card .links a.ext-link:hover {
    background: rgba(112, 85, 255, 0.2);
    border-color: #7055ff;
    text-decoration: none;
}

/* ==========================================================================
   8. ARTYKUŁY I TEKSTY (SEO CONTENT SECTION)
   ========================================================================== */
.seo-content-section {
    max-width: 800px;
    margin: 40px auto;
    padding: 20px;
    background: #111; 
    border-radius: 8px;
    border: 1px solid #222;
    color: #e5e5e5; 
    font-size: 15px;
    line-height: 1.6;
}

.seo-content-section h2 {
    color: #fff;
    margin-bottom: 15px;
    font-size: 22px;
}

/* OPRACOWANE DLA STARYCH KAFELKÓW (Zabezpieczenie spójności wstecznej) */
.seo-event-tile {
    display: flex;
    flex-direction: column;
    background: #1b1632;
    border: 2px solid #7055ff;
    border-radius: 10px;
    padding: 18px;
    min-height: 110px;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 4px 6px rgba(0,0,0,0.2);
    /* FIX: Bezpieczna animacja obramowania i cienia, usunięto modyfikację wysokości makiety we właściwościach */
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.seo-event-tile:hover {
    border-color: #ffd166;
    background-color: rgba(112, 85, 255, 0.1);
    box-shadow: 0 6px 12px rgba(112, 85, 255, 0.25);
    /* FIX CLS: Usunięto transform: translateY(-2px) */
    text-decoration: none;
}

.seo-event-tile .tile-city { font-size: 18px; font-weight: bold; color: #ffb700; margin-bottom: 4px; }
.seo-event-tile .tile-shop { font-size: 14px; color: #fff; margin-bottom: auto; padding-bottom: 8px; }
.seo-event-tile .tile-date { font-size: 13px; color: rgba(255, 255, 255, 0.6); font-weight: 500; }

/* ==========================================================================
   9. STOPKA STRONY (FOOTER)
   ========================================================================== */
.site-footer { 
    border-top: 1px solid rgba(255,255,255,0.1); 
    background: rgba(0,0,0,0.6); 
    margin-top: 48px; 
    padding: 32px 16px; 
    text-align: center; 
    color: rgba(255,255,255,0.7); 
    font-size: 14px; 
}

.footer-links { 
    display: flex; 
    justify-content: center; 
    gap: 16px; 
    margin-top: 16px; 
    flex-wrap: wrap; 
}

.footer-links a { 
    display: inline-flex; 
    align-items: center; 
    gap: 8px; 
    padding: 8px 16px; 
    border: 1px solid rgba(255,255,255,0.15); 
    border-radius: 6px; 
    color: #fff; 
    text-decoration: none; 
    /* FIX: Poprawna deklaracja przejść na hover */
    transition: border-color 0.2s ease, color 0.2s ease; 
}

.footer-links a:hover { 
    border-color: #ffd166; 
    color: #ffd166; 
    text-decoration: none; 
}

.footer-copyright { 
    margin-top: 24px; 
    font-size: 14px; 
    color: #9e9e9e; 
}

/* ==========================================================================
   STRONA BŁĘDU / ARCHIWUM (404)
   ========================================================================== */
html, body.error-page-body { 
    background: #09090b; 
    color: #f4f4f5; 
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; 
    margin: 0; 
    padding: 0; 
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    justify-content: center;
    align-items: center;
}

.error-main {
    width: 100%; 
    display: flex; 
    justify-content: center;
}

.error-container { 
    max-width: 480px; 
    width: 90%;
    background: #18181b; 
    border: 1px solid rgba(251, 146, 60, 0.2); 
    padding: 40px 30px; 
    border-radius: 12px; 
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.5);
    text-align: center;
    box-sizing: border-box;
}

.error-icon {
    font-size: 40px; 
    margin-bottom: 15px;
}

.error-container h1 { 
    color: #fb923c; 
    font-size: 26px; 
    margin: 0 0 15px 0; 
    font-weight: 700;
}

.error-container p {
    font-size: 15px;
    line-height: 1.6;
    color: #a1a1aa;
    margin: 0 0 25px 0;
}

.error-container .btn-primary { 
    display: inline-block;
    background: #fb923c; 
    color: #000; 
    text-decoration: none; 
    font-weight: bold; 
    padding: 12px 24px;
    border-radius: 6px;
    font-size: 14px;
    transition: background 0.2s ease;
    margin-bottom: 15px;
    width: 100%;
    box-sizing: border-box;
}

.error-container .btn-primary:hover {
    background: #ea580c;
}

.error-container .btn-secondary {
    display: inline-block;
    color: #a1a1aa;
    text-decoration: none;
    font-size: 13px;
    transition: color 0.2s ease;
}

.error-container .btn-secondary:hover {
    color: #fb923c;
}

.error-container .debug-info {
    font-size: 11px; 
    color: rgba(255,255,255,0.2); 
    margin-top: 30px;
    border-top: 1px solid rgba(255,255,255,0.05);
    padding-top: 15px;
}
/* ==========================================================================
   STRONA 410 (GONE / WYGASŁE WYDARZENIE)
   ========================================================================== */
html:has(body.error-410-body) {
    background-color: #0f172a;
    height: 100%;
}

body.error-410-body {
    background-color: #0f172a;
    color: #f8fafc;
    font-family: 'Segoe UI', Roboto, sans-serif;
    line-height: 1.6;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    margin: 0;
    padding: 20px;
    box-sizing: border-box;
}

.error-container-410 {
    background-color: #1e293b;
    width: 100%;
    max-width: 500px;
    border-radius: 16px;
    border: 1px solid #334155;
    padding: 40px 32px;
    text-align: center;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.5);
    box-sizing: border-box;
}

.error-container-410 .error-code {
    font-size: 4.5rem;
    font-weight: 900;
    color: #fb923c;
    line-height: 1;
    margin-bottom: 16px;
    letter-spacing: -0.05em;
}

.error-container-410 .error-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 12px;
}

.error-container-410 .error-message {
    color: #94a3b8;
    font-size: 1rem;
    margin-bottom: 32px;
}

.error-container-410 .home-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    color: #f8fafc;
    border: 2px solid #334155;
    padding: 12px 24px;
    border-radius: 12px;
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.error-container-410 .home-button:hover {
    background-color: #334155;
    border-color: #fb923c;
    text-decoration: none;
}

.error-container-410 .home-button svg {
    margin-right: 8px;
}

/* ==========================================================================
   STRONA POJEDYNCZEGO WYDARZENIA (EVENT DETAILS)
   ========================================================================== */
.event-header {
    text-align: center;
    padding: 20px 0;
}

.site-main-title {
    font-size: 20px;
    opacity: 0.9;
    font-weight: bold;
    display: block;
}

#site-subtitle {
    font-size: 14px;
    margin-top: 5px;
    color: #b8b5c6;
}

.layout-single {
    max-width: 700px;
    margin: 40px auto;
    padding: 0 16px;
    width: 100%;
    box-sizing: border-box;
    display: block;
}

.panel-event {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.15);
    padding: 30px;
    border-radius: 8px;
    min-height: 500px;
    box-sizing: border-box;
    display: block;
    text-align: center;
}

.event-main-title {
    background: linear-gradient(90deg, #ffd166, #fb923c);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-size: 24px;
    line-height: 1.3;
    margin-bottom: 25px;
    font-weight: 800;
    display: inline-block;
}

.quick-info-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    margin-bottom: 20px;
    min-height: 150px;
}

@media (max-width: 550px) {
    .quick-info-grid {
        grid-template-columns: 1fr;
    }
    .rel-navigation {
        flex-direction: column;
    }
}

.quick-card {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    padding: 12px 15px;
    border-radius: 6px;
}

.quick-card small {
    display: block;
    color: rgba(255, 255, 255, 0.5);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 600;
}

.quick-card span {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    margin-top: 2px;
}

.level-badge {
    color: #4ade80;
}

.archive-banner {
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid #ef4444;
    color: #fca5a5;
    padding: 15px;
    border-radius: 6px;
    margin-bottom: 25px;
    text-align: left;
    font-size: 14px;
    line-height: 1.5;
}

.section-divider {
    margin: 30px 0;
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.section-title {
    font-size: 18px;
    color: #ffd166;
    margin-bottom: 15px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.section-title-spacing {
    margin-top: 25px;
}

.agenda-list {
    list-style: none;
    padding: 0;
    margin: 15px 0;
}

.agenda-list li {
    padding: 10px 0;
    border-left: 3px solid #fb923c;
    padding-left: 15px;
    margin-bottom: 8px;
    background: rgba(255, 255, 255, 0.01);
    text-align: left;
}

.agenda-list .time {
    color: #fb923c;
    font-weight: bold;
    margin-right: 10px;
    font-family: monospace;
    font-size: 15px;
}

.organizer-details-box {
    color: #ffffff;
    line-height: 1.6;
    background: rgba(0, 0, 0, 0.4);
    padding: 20px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    font-size: 15px;
    margin-bottom: 20px;
    text-align: left;
}

.organizer-details-box .detail-item {
    margin-bottom: 10px;
}

.organizer-details-box .detail-item-cycle {
    margin-bottom: 15px;
}

.organizer-description {
    white-space: pre-line;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    padding-top: 15px;
    color: #eeeeee;
}

.event-actions {
    display: flex;
    gap: 12px;
    margin-top: 20px;
    flex-wrap: wrap;
    justify-content: center;
}

.event-actions a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border: 2px solid #fb923c;
    border-radius: 6px;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    transition: all 0.2s;
    text-decoration: none;
    background: rgba(251, 146, 60, 0.1);
}

.event-actions a:hover {
    border-color: #ffd166;
    color: #ffd166;
    background: rgba(255, 255, 255, 0.05);
    text-decoration: none;
}

.rel-navigation {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.nav-link {
    flex: 1;
    background: #14121f;
    border: 1px solid #4f3da6;
    border-radius: 6px;
    padding: 12px;
    color: #fff;
    text-decoration: none;
    font-size: 0.9em;
    display: flex;
    flex-direction: column;
    gap: 6px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

.nav-link:hover {
    background: #211b40;
    border-color: #ffd166;
    color: #ffd166;
    text-decoration: none;
}

.nav-link .label {
    font-size: 0.75em;
    color: #ffd166;
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.nav-link .date-str {
    font-weight: bold;
    color: #ffffff;
}

.nav-link.next {
    text-align: right;
}

.nav-link.prev {
    text-align: left;
}

.nav-spacer {
    flex: 1;
}

.back-link {
    display: inline-block;
    margin-top: 30px;
    color: #ffd166;
    font-size: 14px;
    font-weight: bold;
    transition: color 0.2s;
    text-decoration: underline;
}

.back-link:hover {
    color: #fff;
    text-decoration: none;
}

.event-footer {
    margin-top: 40px;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    padding: 20px 0;
    text-align: center;
    font-size: 12px;
    color: #b8b5c6;
}

/* --- Dodane style dla sekcji poradnika (z head) --- */
.guide-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-top: 20px; text-align: left; }
.guide-block { background: rgba(255, 255, 255, 0.02); border: 1px solid rgba(255, 255, 255, 0.05); padding: 20px; border-radius: 8px; }
.guide-block h3 { color: #ffd166; font-size: 16px; margin-top: 0; margin-bottom: 12px; text-transform: uppercase; letter-spacing: 0.5px; }
.guide-block p { font-size: 14px; line-height: 1.6; color: #dddddd; margin-bottom: 10px; }
.guide-block ul, .guide-block ol { padding-left: 20px; color: #dddddd; font-size: 14px; line-height: 1.6; }
.guide-block li { margin-bottom: 8px; }

/* Styl specjalny dla ostatniego bloku z poradnika */
.guide-block.guide-full-width {
    grid-column: 1 / -1; 
    background: rgba(251, 146, 60, 0.05); 
    border: 1px solid rgba(251, 146, 60, 0.15);
}

@media (max-width: 768px) { 
    .guide-grid { grid-template-columns: 1fr; } 
}

.city-card-title a {
    color: #ffd166;
    text-decoration: none;
}

.city-card-title a:hover {
    color: #fff;
    text-decoration: none;
}

.events-list{
    list-style:none;
    padding:0;
    margin:0;
}

.events-list li{
    list-style:none;
}

.back-links{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:32px;
}

.back-links .back-link{
    margin:0;
}

.event-rewards-regular {
    margin-top: 35px;
    margin-bottom: 45px;
}


/* =========================================================
   NAGŁÓWEK SEKCJI
========================================================= */

.event-rewards-regular > .section-title {
    margin-bottom: 28px;
}


/* =========================================================
   BLOK EVENTU
========================================================= */

.event-reward-block {
    width: 100%;
    box-sizing: border-box;

    margin: 0 auto 30px;
    padding: 26px 28px;

    border-radius: 14px;

    background: rgba(255,255,255,.035);
    border: 1px solid rgba(255,255,255,.10);

    text-align: left;
}

/* =========================================================
   NAGŁÓWEK EVENTU
========================================================= */

.event-reward-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 25px;

    padding-bottom: 20px;

    border-bottom: 1px solid rgba(255,255,255,.08);
}


.event-reward-header > div:first-child {
    flex: 1;
}


.event-reward-label {
    display: block;

    margin-bottom: 5px;

    font-size: 14px;
    opacity: .7;
}


.event-reward-header h3 {
    margin: 0 0 7px;

    font-size: 25px;
    line-height: 1.25;
}


.event-reward-dates {
    font-size: 15px;
    opacity: .75;
}


/* =========================================================
   LINK
========================================================= */

.event-reward-link {
    flex-shrink: 0;

    padding-top: 22px;

    color: inherit;

    font-size: 15px;
    font-weight: 600;

    text-decoration: none;

    white-space: nowrap;
}


.event-reward-link:hover {
    text-decoration: underline;
}


/* =========================================================
   OPIS
========================================================= */

.event-reward-description {
    max-width: 900px;

    margin: 20px 0 25px;

    font-size: 16px;
    line-height: 1.65;

    text-align: left;
}


/* =========================================================
   BOOSTERY
========================================================= */

.event-reward-boosters {
    margin-top: 25px;
}


.event-reward-boosters > h4 {
    margin: 0 0 18px;

    font-size: 19px;
}


.event-reward-booster {

    display: grid;

    grid-template-columns:
        180px
        minmax(0, 1fr);

    column-gap: 25px;

    margin-bottom: 25px;
    padding: 20px;

    border-radius: 12px;

    background: rgba(0,0,0,.16);
    border: 1px solid rgba(255,255,255,.07);
}


/* =========================================================
   ZDJĘCIE BOOSTERA
========================================================= */

.event-reward-booster-image {

    grid-column: 1;
    grid-row: 1 / span 2;

    width: 180px;

    margin: 0;
}


.event-reward-booster-image img {

    display: block;

    width: 100%;
    height: auto;

    border-radius: 9px;
}


/* =========================================================
   INFORMACJE O BOOSTERZE
========================================================= */

.event-reward-booster h5 {

    grid-column: 2;
    grid-row: 1;

    align-self: start;

    margin: 5px 0 0;

    font-size: 20px;
    line-height: 1.3;
}


.event-reward-booster-meta {

    grid-column: 2;
    grid-row: 2;

    align-self: start;

    margin: 0;

    font-size: 15px;
    opacity: .75;
}


/* =========================================================
   KARTY — OSOBNA SEKCJA POD BOOSTEREM
========================================================= */

.event-reward-card-list {

    grid-column: 1 / -1;
    grid-row: 3;

    display: grid;

    grid-template-columns:
        repeat(
            auto-fill,
            minmax(155px, 1fr)
        );

    gap: 14px;

    list-style: none;

    padding: 20px 0 0;
    margin: 5px 0 0;

    border-top: 1px solid rgba(255,255,255,.08);
}


/* =========================================================
   POJEDYNCZA KARTA
========================================================= */

.event-reward-card-list li {

    min-width: 0;

    padding: 12px;

    text-align: center;

    border-radius: 10px;

    background: rgba(255,255,255,.035);
    border: 1px solid rgba(255,255,255,.07);
}


.event-reward-card-image {

    margin-bottom: 10px;
}


.event-reward-card-image img {

    display: block;

    width: 100%;
    max-width: 180px;

    height: auto;

    margin: 0 auto;

    border-radius: 7px;
}


.event-reward-card-list li strong {

    display: block;

    margin-bottom: 3px;

    font-size: 14px;
}


.event-reward-card-list li span {

    display: block;

    font-size: 14px;

    line-height: 1.35;
}


.event-reward-card-list li small {

    display: block;

    margin-top: 5px;

    font-size: 12px;

    opacity: .65;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    .event-reward-block {
        padding: 20px 16px;
    }


    .event-reward-header {
        display: block;
    }


    .event-reward-link {

        display: inline-block;

        padding-top: 12px;
    }


    .event-reward-description {

        font-size: 15px;
    }


    .event-reward-booster {

        display: block;

        padding: 16px;
    }


    .event-reward-booster-image {

        width: 180px;

        margin: 0 auto 18px;
    }


    .event-reward-booster h5,
    .event-reward-booster-meta {

        text-align: center;
    }


    .event-reward-card-list {

        display: grid;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 10px;

        padding-top: 18px;
    }


    .event-reward-card-list li {

        padding: 9px;
    }

}

/* ==========================================================================
   EVENT PAGE
   ========================================================================== */

.event-page {
    padding-top: 28px;
    padding-bottom: 50px;
}


/* --------------------------------------------------------------------------
   BREADCRUMB
   -------------------------------------------------------------------------- */

.event-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;

    margin-bottom: 25px;

    font-size: 13px;
    color: rgba(255,255,255,.60);
}

.event-breadcrumb a {
    color: #ffd166;
    text-decoration: none;
}

.event-breadcrumb a:hover {
    text-decoration: underline;
}


/* --------------------------------------------------------------------------
   HERO
   -------------------------------------------------------------------------- */

.event-hero {
    display: grid;

    grid-template-columns:
        minmax(0, 1.1fr)
        minmax(280px, .9fr);

    gap: 35px;

    align-items: center;

    margin-bottom: 45px;

    padding: 30px;

    border-radius: 16px;

    background: rgba(255,255,255,.035);
    border: 1px solid rgba(255,255,255,.10);
}


.event-hero-content {
    min-width: 0;
}


.event-type-badge {
    display: inline-block;

    margin-bottom: 12px;

    padding: 6px 11px;

    border-radius: 7px;

    background: rgba(255,209,102,.10);

    color: #ffd166;

    font-size: 13px;
    font-weight: 600;
}


.event-main-title {
    margin: 0 0 12px;

    font-size:
        clamp(30px, 5vw, 48px);

    line-height: 1.08;
}


.event-dates {
    margin-bottom: 22px;

    font-size: 15px;

    color: rgba(255,255,255,.68);
}


.event-main-description {
    max-width: 760px;

    font-size: 17px;
    line-height: 1.7;

    text-align: left;
}


.event-hero-image {
    width: 100%;
}


.event-hero-image img {
    display: block;

    width: 100%;
    height: auto;

    border-radius: 12px;
}


/* --------------------------------------------------------------------------
   SECTION
   -------------------------------------------------------------------------- */

.event-content-section {
    margin-top: 35px;
}


.event-section-heading {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 10px;

    margin-bottom: 28px;
}


.event-section-heading span {
    font-size: 25px;
}


.event-section-heading h2 {
    margin: 0;

    font-size: 28px;
}


/* --------------------------------------------------------------------------
   KIT
   -------------------------------------------------------------------------- */

.event-kit-block {
    margin-bottom: 30px;

    padding: 26px;

    border-radius: 15px;

    background: rgba(255,255,255,.035);
    border: 1px solid rgba(255,255,255,.10);

    text-align: left;
}


.event-kit-header h3 {
    margin: 3px 0 5px;

    font-size: 24px;
}
/* --------------------------------------------------------------------------
   KIT
   -------------------------------------------------------------------------- */

.event-kit-header {
    display: grid;

    grid-template-columns: 180px minmax(0, 1fr);

    gap: 25px;

    align-items: start;
}


.event-kit-image {
    width: 180px;
    height: 250px;

    display: flex;

    align-items: flex-start;
    justify-content: center;
}


.event-kit-image img {
    display: block;

    width: auto;
    height: auto;

    max-width: 180px;
    max-height: 250px;

    border-radius: 9px;
}


.event-kit-info {
    min-width: 0;
}


.event-kit-info .event-product-description {
    margin-top: 14px;
}

.event-product-label {
    display: block;

    font-size: 12px;

    text-transform: uppercase;

    letter-spacing: .06em;

    color: rgba(255,255,255,.55);
}


.event-product-quantity {
    font-size: 13px;

    color: rgba(255,255,255,.65);
}


.event-product-description {
    margin-top: 14px;

    max-width: 900px;

    font-size: 15px;
    line-height: 1.65;

    color: rgba(255,255,255,.80);

    text-align: left;
}


/* --------------------------------------------------------------------------
   BOOSTER
   -------------------------------------------------------------------------- */

.event-booster-list {
    margin-top: 25px;
}


.event-booster-block {
    margin-top: 20px;

    padding: 20px;

    border-radius: 13px;

    background: rgba(0,0,0,.16);
    border: 1px solid rgba(255,255,255,.07);
}


.event-booster-main {
    display: grid;

    grid-template-columns:
        180px
        minmax(0,1fr);

    gap: 25px;

    align-items: start;
}


.event-booster-image {
    width: 180px;
}


.event-booster-image img {
    display: block;

    width: 100%;
    height: auto;

    border-radius: 9px;
}


.event-booster-info h4 {
    margin: 4px 0 8px;

    font-size: 21px;
}


.event-booster-meta {
    font-size: 14px;

    color: rgba(255,255,255,.65);
}


/* --------------------------------------------------------------------------
   CARDS
   -------------------------------------------------------------------------- */

.event-cards-section {
    margin-top: 25px;

    padding-top: 22px;

    border-top: 1px solid rgba(255,255,255,.08);
}


.event-cards-section h5 {
    margin: 0 0 18px;

    font-size: 18px;
}


.event-cards-grid {
    display: grid;

    grid-template-columns:
        repeat(
            auto-fill,
            minmax(150px, 1fr)
        );

    gap: 15px;
}


.event-card-item {
    padding: 12px;

    border-radius: 10px;

    background: rgba(255,255,255,.035);

    border: 1px solid rgba(255,255,255,.07);

    text-align: center;
}


.event-card-image {
    margin-bottom: 10px;
}


.event-card-image img {
    display: block;

    width: 100%;
    max-width: 190px;

    height: auto;

    margin: 0 auto;

    border-radius: 7px;
}


.event-card-number {
    font-size: 13px;
    font-weight: 700;
}


.event-card-name {
    margin-top: 4px;

    font-size: 14px;
    line-height: 1.35;
}


.event-card-meta {
    margin-top: 5px;

    font-size: 12px;

    color: rgba(255,255,255,.60);
}


/* --------------------------------------------------------------------------
   EMPTY
   -------------------------------------------------------------------------- */

.event-empty {
    padding: 25px;

    border-radius: 12px;

    background: rgba(255,255,255,.035);

    color: rgba(255,255,255,.65);

    text-align: center;
}


/* --------------------------------------------------------------------------
   MOBILE
   -------------------------------------------------------------------------- */

@media (max-width: 760px) {

    .event-hero {
        grid-template-columns: 1fr;

        padding: 20px;
    }


    .event-hero-image {
        order: -1;
    }


    .event-kit-block {
        padding: 18px;
    }


    .event-booster-block {
        padding: 16px;
    }


    .event-booster-main {
        grid-template-columns: 1fr;
    }


    .event-booster-image {
        width: 180px;

        margin: 0 auto;
    }


    .event-booster-info {
        text-align: center;
    }


    .event-product-description {
        text-align: left;
    }


    .event-cards-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 10px;
    }

}

		.shop-page { max-width:900px; margin:0 auto; padding:32px 16px 48px; }
        .shop-hero { text-align:center; margin-bottom:32px; }
        .shop-hero h1 { font-size:clamp(28px,5vw,44px); margin-bottom:8px; }
        .shop-city { color:rgba(255,255,255,.7); }
        .shop-section { margin-top:32px; padding-top:28px; border-top:1px solid rgba(255,255,255,.1); }
        .shop-section h2 { margin-bottom:20px; font-size:24px; }
        .shop-info-card,.shop-tournament-card { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); border-radius:12px; padding:20px; }
        .shop-description { color:rgba(255,255,255,.85); line-height:1.7; white-space:pre-line; }
        .shop-details { display:grid; gap:8px; margin-top:18px; }
        .shop-details div { color:rgba(255,255,255,.8); }
        .shop-details strong,.shop-dates strong { color:#ffd166; }
        .shop-socials,.shop-backlinks { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
        .shop-socials a,.shop-backlinks a { display:inline-flex; padding:9px 14px; border:1px solid rgba(255,255,255,.15); border-radius:7px; color:#ffd166; text-decoration:none; }
        .shop-socials a:hover,.shop-backlinks a:hover { border-color:#ffd166; text-decoration:none; }
        .shop-tournament-list { display:grid; gap:16px; }
        .shop-tournament-card h3 { margin-bottom:6px; font-size:20px; }
        .shop-schedule,.shop-muted { color:rgba(255,255,255,.65); }
        .shop-tournament-meta { display:flex; flex-wrap:wrap; gap:8px; color:rgba(255,255,255,.75); font-size:14px; }
        .shop-dates { margin-top:18px; padding-top:16px; border-top:1px solid rgba(255,255,255,.08); }
        .shop-dates strong { display:block; margin-bottom:10px; }
        .shop-date-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; }
        .shop-date-link { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:52px; padding:8px; border:1px solid #7055ff; border-radius:7px; background:#1b1632; color:#fb923c; text-decoration:none; font-weight:600; }
        .shop-date-link span { font-size:12px; opacity:.8; }
        .shop-date-link:hover { background:#7055ff; color:#fff; text-decoration:none; }
/* ==========================================================================
   SKLEP – INFORMACJE + MAPA
   ========================================================================== */

.shop-info-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 42%);
    gap: 24px;
    align-items: stretch;
}

.shop-info-content {
    min-width: 0;
}

.shop-map {
    min-width: 0;
    overflow: hidden;
    border-radius: 10px;
    background: rgba(255,255,255,.04);
}

.shop-map iframe {
    display: block;
    width: 100%;
    height: 260px;
    border: 0;
}

.shop-map-link {
    display: block;
    padding: 9px 12px;
    color: #ffd166;
    font-size: 13px;
    text-align: center;
    text-decoration: none;
    border-top: 1px solid rgba(255,255,255,.1);
}

.shop-map-link:hover {
    text-decoration: underline;
}

@media (max-width: 700px) {

    .shop-info-card {
        grid-template-columns: 1fr;
    }

    .shop-map iframe {
        height: 240px;
    }
}

/* ==========================================================================
   SHOP – HEADER
   ========================================================================== */

.site-header {
    width: 100%;
    box-sizing: border-box;
    padding: 22px 26px 20px;
    text-align: center;
    border-bottom: 1px solid rgba(255,255,255,.10);
}

.site-header .site-title {
    max-width: 1000px;
    margin: 0 auto;

    font-size: clamp(28px, 4vw, 38px);
    line-height: 1.15;
    font-weight: 700;
    letter-spacing: -0.02em;

    background: linear-gradient(
        90deg,
        #ffd166 0%,
        #ffb347 50%,
        #ffd166 100%
    );

    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.site-header > p {
    max-width: 800px;
    margin: 6px auto 0;

    color: rgba(255,255,255,.68);
    font-size: clamp(17px, 2.2vw, 22px);
    line-height: 1.35;
}


/* ==========================================================================
   SHOP – GŁÓWNY H1
   ========================================================================== */

.shop-hero {
    max-width: 900px;
    margin: 0 auto;
    padding: 16px 16px 14px;
    text-align: center;
}

.shop-hero h1 {
    margin: 0;
    font-size: clamp(30px, 5vw, 44px);
    line-height: 1.15;
    font-weight: 700;
}

.shop-city {
    margin: 8px 0 0;
    color: rgba(255,255,255,.72);
    font-size: clamp(18px, 2.5vw, 24px);
    line-height: 1.3;
}


/* ==========================================================================
   include/../navigation.php
   ========================================================================== */

.navigation-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.navigation-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 14px;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 7px;
    background: transparent;
    color: #ffd166;
    text-decoration: none;
    font-size: 15px;
    line-height: 1.2;
}

.navigation-link:hover {
    border-color: #ffd166;
    color: #ffd166;
    text-decoration: none;
}
/* ==========================================================================
   include/city-shop.php
   ========================================================================== */

.city-shop-name {
    color: #fb923c;
    text-decoration: none;
    font-weight: 700;
}

.city-shop-name:hover {
    color: #ffd166;
    text-decoration: underline;
}

/* V1 – wspólne style kart / kitów / boosterów. Do wklejenia do style.css. */
.product-header { text-align: center; padding: 24px 16px 12px; }
.product-header-inner { max-width: 900px; margin: 0 auto; }
.product-kicker { margin: 0 0 6px; font-size: .85rem; text-transform: uppercase; letter-spacing: .08em; opacity: .7; }
.product-header h1 { margin: 0 0 12px; }
.product-search-link { color: #fb923c; text-decoration: none; font-weight: 700; }
.product-search-link:hover { color: #ffd166; text-decoration: underline; }

.product-slider-side:hover { opacity: 1; }
.product-slider-side img { max-width: 120px; max-height: 170px; object-fit: contain; }
.product-slider-side-name { font-size: .85rem; text-align: center; }
.product-slider-side-label { font-size: 2rem; color: #fb923c; }
.product-slider-side-empty { visibility: hidden; }
.product-slider-placeholder { min-height: 280px; display: grid; place-items: center; opacity: .5; }

.product-details, .product-parents, .product-contains { max-width: 1000px; margin: 0 auto; padding: 28px 16px; }
.product-details-layout { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(280px,.9fr); gap: 28px; align-items: start; }
.product-details-images { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.product-details-images img { width: 100%; height: auto; display: block; object-fit: contain; border-radius: 8px; }
.product-details-data table { width: 100%; border-collapse: collapse; }
.product-details-data th, .product-details-data td { padding: 10px 12px; border-bottom: 1px solid rgba(255,255,255,.12); text-align: left; vertical-align: top; }
.product-details-data th { width: 38%; }
.product-description { margin-top: 24px; line-height: 1.7; }
.product-parent-list, .product-child-list { display: grid; gap: 10px; }
.product-parent-item { padding: 12px 0; }
.product-parent-item h3 { margin: 0 0 4px; }
.product-parent-item a, .product-child-link { color: #fb923c; text-decoration: none; font-weight: 700; }
.product-parent-item a:hover, .product-child-link:hover { color: #ffd166; text-decoration: underline; }
.product-parent-item p { margin: 0; opacity: .7; }
.product-child-link { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.product-muted { opacity: .65; }
.product-navigation { max-width: 1000px; margin: 0 auto; padding: 28px 16px 40px; }

@media (max-width: 700px) {
    .product-slider { grid-template-columns: 48px minmax(0,1fr) 48px; gap: 6px; padding-left: 8px; padding-right: 8px; }
    .product-slider-side { min-height: 0; padding: 4px; }
    .product-slider-side-name { display: none; }
    .product-slider-side-label { font-size: 2.2rem; }
    .product-details-layout { grid-template-columns: 1fr; }
    .product-details-images { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

/* ==========================================================
   PRODUCT SLIDER
   ========================================================== */

.product-slider {
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
    padding: 20px 56px 34px;
    overflow: hidden;

    perspective: 1200px;
}

.product-slider-track {
    display: grid;
    grid-template-columns: minmax(170px, 1fr) 300px minmax(170px, 1fr);

    align-items: center;
    justify-items: center;

    gap: 8px;

    min-height: 430px;

    perspective: 1200px;
}


/* ----------------------------------------------------------
   Wszystkie karty
   ---------------------------------------------------------- */

.product-slider-card {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 340px;

    overflow: hidden;

    text-decoration: none;
}

.product-slider-card img {
    display: block;

    width: auto;
    height: 100%;

    max-width: 100%;

    object-fit: contain;
}


/* ----------------------------------------------------------
   Aktualna karta
   ---------------------------------------------------------- */

.product-slider-card-current {
    width: 270px;
    height: 380px;

    position: relative;
    z-index: 5;

    transform: translateZ(30px);
}

.product-slider-card-current img {
    width: 100%;
    height: 100%;

    object-fit: contain;

    border-radius: 10px;
}


/* ----------------------------------------------------------
   Poprzednia karta
   ---------------------------------------------------------- */

.product-slider-card-prev {
    width: 205px;
    height: 305px;

    opacity: .72;

    transform:
        perspective(900px)
        rotateY(18deg)
        rotateZ(-2deg)
        scale(.92);

    transform-origin: right center;

    margin-right: -20px;

    transition:
        transform .3s ease,
        opacity .3s ease;
}

.product-slider-card-prev:hover {
    opacity: .95;

    transform:
        perspective(900px)
        rotateY(9deg)
        rotateZ(-1deg)
        scale(.96);
}


/* ----------------------------------------------------------
   Następna karta
   ---------------------------------------------------------- */

.product-slider-card-next {
    width: 205px;
    height: 305px;

    opacity: .72;

    transform:
        perspective(900px)
        rotateY(-18deg)
        rotateZ(2deg)
        scale(.92);

    transform-origin: left center;

    margin-left: -20px;

    transition:
        transform .3s ease,
        opacity .3s ease;
}

.product-slider-card-next:hover {
    opacity: .95;

    transform:
        perspective(900px)
        rotateY(-9deg)
        rotateZ(1deg)
        scale(.96);
}


/* ----------------------------------------------------------
   Brak karty
   ---------------------------------------------------------- */

.product-slider-card-empty {
	visibility: hidden;
}


/* ----------------------------------------------------------
   Strzałki
   ---------------------------------------------------------- */

.product-slider-arrow {
    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    width: 42px;
    height: 70px;

    border: 0;
    background: transparent;

    color: #fb923c;

    font-size: 3rem;
    line-height: 1;

    cursor: pointer;

    opacity: .8;

    z-index: 10;

    transition:
        opacity .2s ease,
        transform .2s ease;
}

.product-slider-arrow:hover {
    opacity: 1;
}

.product-slider-arrow-prev {
    left: 4px;
}

.product-slider-arrow-next {
    right: 4px;
}

.product-slider-arrow-prev:hover {
    transform:
        translateY(-50%)
        translateX(-3px);
}

.product-slider-arrow-next:hover {
    transform:
        translateY(-50%)
        translateX(3px);
}


/* ----------------------------------------------------------
   Kropki
   ---------------------------------------------------------- */

.product-slider-dots {
    display: flex;

    justify-content: center;
    align-items: center;

    gap: 10px;

    margin-top: 12px;
}

.product-slider-dot {
    width: 9px;
    height: 9px;

    border-radius: 50%;

    background: rgba(255,255,255,.45);
}

.product-slider-dot-active {
    background: #fb923c;

    transform: scale(1.15);
}


/* ----------------------------------------------------------
   Placeholder
   ---------------------------------------------------------- */

.product-slider-placeholder {
    display: grid;
    place-items: center;

    width: 100%;
    height: 100%;

    border: 1px solid rgba(255,255,255,.12);

    border-radius: 10px;

    opacity: .5;
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 700px) {
    .product-slider-card-empty {
        display: none;
    }
    .product-slider {
        padding: 12px 0 28px;

        overflow: hidden;

        perspective: 900px;
    }

    .product-slider-track {
        display: flex;

        justify-content: center;

        gap: 0;

        min-height: 360px;

        perspective: 900px;
    }


    /* ------------------------------------------------------
       Boczne podglądy
       ------------------------------------------------------ */

    .product-slider-card-prev,
    .product-slider-card-next {

        position: absolute;

        width: 145px;
        height: 220px;

        opacity: .35;

        pointer-events: none;
    }

    .product-slider-card-prev {

        left: -72px;

        margin-right: 0;

        transform:
            perspective(600px)
            rotateY(20deg)
            rotateZ(-2deg)
            scale(.9);

        transform-origin: right center;
    }

    .product-slider-card-next {

        right: -72px;

        margin-left: 0;

        transform:
            perspective(600px)
            rotateY(-20deg)
            rotateZ(2deg)
            scale(.9);

        transform-origin: left center;
    }


    /* ------------------------------------------------------
       Aktualna karta
       ------------------------------------------------------ */

    .product-slider-card-current {

        width: 245px;
        height: 345px;

        flex: 0 0 245px;

        transform: translateZ(20px);
    }


    /* ------------------------------------------------------
       Strzałki
       ------------------------------------------------------ */

    .product-slider-arrow {

        z-index: 10;

        width: 42px;
        height: 60px;

        font-size: 2.5rem;
    }

    .product-slider-arrow-prev {
        left: 2px;
    }

    .product-slider-arrow-next {
        right: 2px;
    }


    /* ------------------------------------------------------
       Kropki
       ------------------------------------------------------ */

    .product-slider-dots {
        margin-top: 4px;
    }
}

/* ==========================================================
   PRODUCT RELATIONS
   ========================================================== */

.product-parents,
.product-contains {
    max-width: 1000px;
    margin: 0 auto;
    padding: 28px 16px;
}

.product-parents h2,
.product-contains h2 {
    margin: 0 0 18px;
}

.product-parent-list {
    display: grid;
    gap: 12px;
}

.product-parent-item {
    padding: 16px 18px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 8px;
    background: rgba(255,255,255,.025);
}

.product-parent-item h3 {
    margin: 0 0 6px;
    font-size: 1rem;
}

.product-parent-item a {
    color: #fb923c;
    text-decoration: none;
}

.product-parent-item a:hover {
    color: #ffd166;
    text-decoration: underline;
}

.product-parent-item p {
    margin: 0;
    opacity: .65;
    font-size: .9rem;
}

.product-child-list {
    display: grid;
    gap: 0;
}

.product-child-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    padding: 13px 4px;

    color: #fb923c;
    text-decoration: none;

    border-bottom: 1px solid rgba(255,255,255,.10);
}

.product-child-link:first-child {
    border-top: 1px solid rgba(255,255,255,.10);
}

.product-child-link:hover {
    color: #ffd166;
}

.product-child-name {
    font-weight: 700;
}

.product-child-quantity {
    flex: 0 0 auto;
    opacity: .7;
    font-size: .9rem;
}

.product-muted {
    margin: 0;
    opacity: .6;
}

/*
 * PRODUCT PAGE — visual match with shop pages
 *
 * Shop reference uses:
 *   max-width: 900px
 *   section top border
 *   rgba(255,255,255,.04) background
 *   rgba(255,255,255,.1) border
 *   12px radius
 *
 * The product page keeps its existing slider/details markup,
 * but gives every major block the same visual language.
 */

/* ---------------------------------------------------------
   PAGE / HERO
   --------------------------------------------------------- */

.product-page {
    max-width: 900px;
    margin: 0 auto;
    padding: 32px 16px 48px;
}

.product-hero {
    text-align: center;
    margin-bottom: 32px;
    padding: 28px 20px;
    border-top: 1px solid rgba(255,255,255,.1);
    border-bottom: 1px solid rgba(255,255,255,.1);
    background: rgba(255,255,255,.02);
}

.product-hero h1 {
    margin: 0 0 12px;
    font-size: clamp(30px, 5vw, 44px);
    line-height: 1.15;
}

.product-search-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 14px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 7px;
    color: #ffd166;
    text-decoration: none;
}

.product-search-link:hover {
    border-color: #ffd166;
    text-decoration: none;
}

/* ---------------------------------------------------------
   REMOVE OLD PRODUCT KICKER / OLD HEADER LOOK
   --------------------------------------------------------- */

.product-header {
    display: none;
}

.product-kicker {
    display: none !important;
}

/* ---------------------------------------------------------
   ALL MAJOR PRODUCT SECTIONS
   --------------------------------------------------------- */

.product-page > .product-slider,
.product-page > .product-details,
.product-page > .product-parents {
    margin-top: 32px;
    padding: 28px 20px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 12px;
    background: rgba(255,255,255,.04);
    box-sizing: border-box;
}

/* Keep section headings visually consistent with shop pages. */
.product-page > .product-details h2,
.product-page > .product-parents h2 {
    margin: 0 0 20px;
    font-size: 24px;
}

/* ---------------------------------------------------------
   SLIDER
   --------------------------------------------------------- */

.product-page > .product-slider {
    margin-top: 0;
    background: rgba(255,255,255,.02);
}

.product-slider-track {
    min-height: 420px;
}

/* ---------------------------------------------------------
   DETAILS
   --------------------------------------------------------- */

.product-details-layout {
    gap: 28px;
}

.product-details-data table {
    width: 100%;
    border-collapse: collapse;
}

.product-details-data th,
.product-details-data td {
    border-bottom: 1px solid rgba(255,255,255,.08);
    padding: 12px 0;
}

.product-details-data th {
    text-align: left;
}

.product-description {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,.08);
    color: rgba(255,255,255,.85);
    line-height: 1.7;
}

/* ---------------------------------------------------------
   "JAK ZDOBYĆ"
   --------------------------------------------------------- */

.product-parents {
    margin-top: 32px;
}

.product-parent-list {
    display: grid;
    gap: 16px;
}

.product-parent-item {
    margin: 0;
    padding: 20px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 12px;
    background: rgba(255,255,255,.04);
}

.product-parent-item h3 {
    margin: 0 0 8px;
}

.product-parent-item h3 a {
    color: #fb923c;
    text-decoration: none;
}

.product-parent-item h3 a:hover {
    text-decoration: underline;
}

.product-parent-item p {
    margin: 0;
    color: rgba(255,255,255,.65);
}

/* ---------------------------------------------------------
   NAVIGATION
   --------------------------------------------------------- */

.product-navigation {
    max-width: 900px;
    margin: 0 auto;
    padding-left: 16px;
    padding-right: 16px;
}

/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 700px) {
    .product-page {
        padding: 24px 12px 40px;
    }

    .product-hero {
        padding: 24px 14px;
    }

    .product-page > .product-slider,
    .product-page > .product-details,
    .product-page > .product-parents {
        padding: 22px 16px;
        border-radius: 10px;
    }
}

.event-kit-image-link,
.event-booster-image-link {
    display: block;
}

.event-kit-image-link:hover img,
.event-booster-image-link:hover img {
    transform: scale(1.02);
}

.event-kit-image-link img,
.event-booster-image-link img {
    transition: transform .2s ease;
}
/* Klikalne zdjęcia i nazwy w sekcji "O co będziemy grać?" */

.event-reward-booster-image-link,
.event-reward-card-image-link {
    display: block;
}

.event-reward-booster-image-link img,
.event-reward-card-image-link img {
    transition: transform .2s ease;
}

.event-reward-booster-image-link:hover img,
.event-reward-card-image-link:hover img {
    transform: scale(1.02);
}

.event-reward-booster-image-link:focus-visible,
.event-reward-card-image-link:focus-visible,
.event-reward-card-link:focus-visible {
    outline: 2px solid #fb923c;
    outline-offset: 3px;
}

.event-reward-card-link {
    color: inherit;
    text-decoration: none;
    display: inline-flex;
    flex-direction: column;
    gap: 4px;
}

.event-reward-card-link:hover {
    text-decoration: none;
}

.event-reward-card-link strong,
.event-reward-booster-link {
    color: #fb923c;
}