.congress-countdown {
    /* Wymiary i RWD */
    /*Overall site section's padding in countdown-section.css*/
    aspect-ratio: 2.5 / 1;
    min-height: 200px;
    
    /* Wygląd i tło */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 24px;
    box-sizing: border-box;

    border: 2px solid white;
    border-top: 2px solid white;
    border-bottom: 2px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
    
    
    /* Układ wewnętrzny */
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: clamp(20px, 4vw, 60px) clamp(30px, 8vw, 120px);
    
    /* Zmienne projektowe (Fluid Typography) */
    
}

.congress-countdown__content {
    display: flex;
    flex-direction: column;
    align-items: left; 
    justify-content: center; /* DODANO: Centruje zawartość w pionie (oś główna dla column) */
    width: 100%; 
    height: 100%; /* DODANO: Pozwala kontenerowi zająć całą dostępną wysokość, co ułatwia centrowanie */
    z-index: 1;
}

/* DODANO: Fix ukrywający puste paragrafy narzucane np. przez WordPressa */
.congress-countdown p:empty {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.congress-countdown__title {
    font-family: var(--font-primary);
    font-size: var(--cd-title);
    font-weight: 500;
    color: var(--h1-text-color);
    margin-bottom: clamp(10px, 2vw, 20px);
    text-align: left; /* Dodatkowe zabezpieczenie bezpieczeństwa wizualnego na wypadek przełamania wiersza (wrapping) */
}

.congress-countdown__timer {
    display: flex;
    align-items: flex-start;
    /* align-self: center; <-- TĘ LINIĘ USUŃ. Dziedziczymy centrowanie z .congress-countdown__content */
    gap: var(--cd-gap);
}

.congress-countdown__time-box {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.congress-countdown__value {
    position: relative;
    font-family: var(--font-primary);
    font-size: var(--cd-number);
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1;
    letter-spacing: -0.02em;
}

/* Wdrożenie separatorów czasu za pomocą CSS CSSOM (Wysoka wydajność renderowania) */
.congress-countdown__time-box:not(:last-of-type) .congress-countdown__value::after {
    content: ':';
    position: absolute;
    top: 48%; /* Optyczne wyśrodkowanie dwukropka względem cyfr */
    right: calc(var(--cd-gap) * -0.5); /* Automatyczne pozycjonowanie w połowie przerwy */
    transform: translate(50%, -50%);
    font-family: var(--font-primary);
    font-size: calc(var(--cd-number) * 0.8);
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1;
}

.congress-countdown__label {
    font-family: var(--font-primary);
    font-size: var(--cd-label);
    color: #FFFFFF;
    margin-top: clamp(8px, 1.5vw, 16px);
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0.1em;
}
/* ==========================================================================
   Tablet Version (max-width: 1191px)
   ========================================================================== */
@media (max-width: 1191px) {
    .congress-countdown {
        /* 1. TWARDA BLOKADA ROZPYCHANIA EKRANU */
        box-sizing: border-box;
        max-width: 100%;
        overflow: hidden; /* Ucina wszystko, co próbuje rozciągnąć layout w poziomie */
        
        /* 2. ZAMIENIAMY SZTYWNE ASPECT-RATIO NA ELASTYCZNĄ WYSOKOŚĆ */
        aspect-ratio: auto;
        min-height: 240px;
        
        /* 3. TŁO: Przypinamy kwiatka na sztywno do prawej krawędzi */
        background-position: right center !important;
        background-size: cover !important;
        
        /* 4. SKALOWANIE FLUID TYPOGRAPHY */
        --cd-gap: clamp(12px, 3vw, 24px);
        --cd-number: clamp(32px, 5vw, 48px); 
        --cd-label: clamp(10px, 1.2vw, 12px);
        --cd-title: clamp(14px, 2vw, 18px);
        
        /* 5. PADDING: Bezpieczna przestrzeń na kwiatka po prawej (35%) */
        padding: clamp(20px, 4vw, 40px) 35% clamp(20px, 4vw, 40px) clamp(20px, 4vw, 30px);
    }

    .congress-countdown__content {
        align-items: flex-start;
        text-align: left;
        width: 100%;
        position: relative;
        z-index: 2;
    }

    .congress-countdown__timer {
        max-width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap; /* Zabezpieczenie: jeśli tekstowi braknie miejsca, zawiń go, zamiast psuć stronę */
    }
    
.congress-countdown__time-box:not(:last-of-type) .congress-countdown__value::after {
        font-size: calc(var(--cd-number) * 0.7);
        right: calc((var(--cd-gap) / 2) * -1); 
        transform: translate(50%, -50%);
    }
}

/* ==========================================================================
   Strict Mobile Version (max-width: 768px)
   ========================================================================== */
@media (max-width: 768px) {
    .congress-countdown {
        justify-content: center !important;
        align-items: center !important;
        min-height: 280px; 
padding: clamp(20px, 4vw, 40px);
        background-position: right center !important; 




    }

    .congress-countdown__content {
        text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.4);
align-items: center;
        text-align: center;
        max-width: 100%;
    }

    .congress-countdown__timer {
        --cd-gap: 16px;
        --cd-number: 32px; 
        
        /* Resetting timer layout to center specifically on mobile */
        justify-content: center; 
    }
}