/* Yhdistys-sivun teematyylit. Sivun Gutenberg-sisältö ei tarvitse omia style-lohkoja. */

/* Sivun alkuperäinen tyylilohko 1. */
.pk-yhdistys-hero {
            width: 100vw !important;
            max-width: 100vw !important;
            margin-left: calc(50% - 50vw) !important;
            margin-right: calc(50% - 50vw) !important;
        }
        .pk-yhdistys-hero .wp-block-cover__inner-container {
            width: 100% !important;
            max-width: none !important;
            margin: 0 !important;
            padding: 0 !important;
        }
        .pk-yhdistys-hero-content {
            width: 520px !important;
            max-width: 520px !important;
            margin: 0 !important;
            padding: 45px 0 45px 7% !important;
            text-align: left !important;
        }
        .pk-yhdistys-hero-content p,
        .pk-yhdistys-hero-content h1 {
            text-align: left !important;
        }
        .pk-yhdistys-eyebrow {
            margin: 0 0 12px !important;
            color: #fff !important;
            font-family: Arial, sans-serif;
            font-size: 12px !important;
            font-weight: 700;
            letter-spacing: .14em;
        }
        .pk-yhdistys-title {
            margin: 0 !important;
            color: #fff !important;
            font-family: Georgia, "Times New Roman", serif;
            font-size: clamp(42px, 4.5vw, 68px) !important;
            font-weight: 700;
            line-height: 1.02 !important;
            overflow-wrap: normal !important;
            word-break: normal !important;
            hyphens: none !important;
        }
        .pk-yhdistys-title span {
            color: #f5b72c !important;
        }
        .pk-yhdistys-gold-line {
            width: 55px !important;
            max-width: 55px !important;
            margin: 23px 0 !important;
            border: 0 !important;
            border-top: 3px solid #f5b72c !important;
        }
        .pk-yhdistys-lead {
            margin: 0 0 18px !important;
            color: #fff !important;
            font-family: Georgia, "Times New Roman", serif;
            font-size: 20px !important;
            line-height: 1.35 !important;
        }
        .pk-yhdistys-motto {
            margin: 0 !important;
            color: #f5b72c !important;
            font-family: Georgia, "Times New Roman", serif;
            font-size: 18px !important;
        }
        @media (max-width:700px) {
            .pk-yhdistys-hero-content {
                width: auto !important;
                max-width: 90% !important;
                padding: 38px 22px !important;
            }
            .pk-yhdistys-title {
                font-size: clamp(30px, 8vw, 38px) !important;
                letter-spacing: -.015em;
                white-space: nowrap;
            }
        }


/* Sivun alkuperäinen tyylilohko 2. */
.pk-about-section {
        width: 100vw !important;
        max-width: 100vw !important;
        margin: 0 calc(50% - 50vw) !important;
        padding: 0 !important;
        background: #f4f1e9 !important;
        color: #17191a !important;
    }

    .pk-about-columns {
        width: min(1380px, calc(100% - 96px)) !important;
        max-width: 1380px !important;
        margin: 0 auto !important;
        padding: 48px 0 !important;
        gap: 60px !important;
    }

    .pk-about-copy {
        padding: 10px 0 !important;
    }

    .pk-about-copy,
    .pk-about-copy p,
    .pk-about-copy h2 {
        text-align: left !important;
    }

    .pk-about-label {
        margin: 0 0 8px !important;
        color: #17191a !important;
        font-family: Arial, sans-serif;
        font-size: 12px !important;
        font-weight: 700;
        letter-spacing: .12em;
    }

    .pk-about-title {
        margin: 0 0 22px !important;
        color: #17191a !important;
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(34px, 3.2vw, 48px) !important;
        font-weight: 700;
        line-height: 1.05 !important;
    }

    .pk-about-copy > p:not(.pk-about-label) {
        max-width: 650px !important;
        margin: 0 0 17px !important;
        color: #17191a !important;
        font-size: 16px !important;
        line-height: 1.55 !important;
    }

    .pk-about-copy > p:last-child {
        margin-bottom: 0 !important;
    }

    .pk-about-image figure {
        margin: 0 !important;
        width: 100% !important;
    }

    .pk-about-image img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 3 / 2;
        object-fit: cover !important;
    }

    @media (max-width: 800px) {
        .pk-about-columns {
            width: calc(100% - 44px) !important;
            padding: 38px 0 !important;
            gap: 30px !important;
            flex-direction: column !important;
        }

        .pk-about-copy,
        .pk-about-image {
            flex-basis: 100% !important;
            width: 100% !important;
        }
    }


/* Sivun alkuperäinen tyylilohko 3. */
.pk-activities-section {
    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 calc(50% - 50vw) !important;
    padding: 0 !important;
    background: #10191d !important;
    color: #ffffff !important;
}

.pk-activities-inner {
    width: min(1380px, calc(100% - 96px)) !important;
    max-width: 1380px !important;
    margin: 0 auto !important;
    padding: 48px 0 46px !important;
}

.pk-activities-label {
    margin: 0 0 8px !important;
    color: #F5B72C !important;
    font-family: Arial, sans-serif;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .14em;
    text-align: left !important;
}

.pk-activities-title {
    max-width: 900px !important;
    margin: 0 0 40px !important;
    color: #ffffff !important;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(30px,3vw,44px) !important;
    line-height: 1.08 !important;
    text-align: left !important;
}

.pk-activities-grid {
    width: 100% !important;
    margin: 0 !important;
    gap: 0 !important;
}

.pk-activity-card {
    padding: 5px 32px 8px !important;
    border-right: 1px solid rgba(255,255,255,.20);
    text-align: center !important;
}

.pk-activity-card:first-child {
    padding-left: 10px !important;
}

.pk-activity-card:last-child {
    padding-right: 10px !important;
    border-right: 0;
}

.pk-activity-svg {
    width: 58px;
    height: 58px;
    margin: 0 auto 18px !important;
}

.pk-activity-svg svg {
    display: block;
    width: 58px;
    height: 58px;
}

.pk-activity-heading {
    min-height: 36px;
    margin: 0 0 10px !important;
    color: #ffffff !important;
    font-family: Arial, sans-serif;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    text-align: center !important;
}

.pk-activity-text {
    max-width: 270px !important;
    margin: 0 auto !important;
    color: #e4e4e1 !important;
    font-family: Arial, sans-serif;
    font-size: 14px !important;
    line-height: 1.5 !important;
    text-align: center !important;
}

@media (max-width:900px) {
    .pk-activities-grid {
        flex-wrap: wrap !important;
    }

    .pk-activity-card {
        flex-basis: 50% !important;
        box-sizing: border-box;
        padding: 30px !important;
        border-bottom: 1px solid rgba(255,255,255,.16);
    }

    .pk-activity-card:nth-child(2) {
        border-right: 0;
    }
}

@media (max-width:600px) {
    .pk-activities-inner {
        width: calc(100% - 44px) !important;
        padding: 38px 0 !important;
    }

    .pk-activities-title {
        margin-bottom: 18px !important;
    }

    .pk-activity-card {
        flex-basis: 100% !important;
        padding: 28px 10px !important;
        border-right: 0;
    }

    .pk-activity-card:last-child {
        border-bottom: 0;
    }
}


/* Sivun alkuperäinen tyylilohko 4. */
.pk-art-cover {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}
.pk-art-cover .wp-block-cover__inner-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.pk-art-content {
    width: 610px !important;
    max-width: 610px !important;
    margin: 0 !important;
    padding: 52px 0 52px 7% !important;
    text-align: left !important;
}
.pk-art-content p,
.pk-art-content h2 {
    text-align: left !important;
}
.pk-art-label {
    margin: 0 0 12px !important;
    color: #ffffff !important;
    font-family: Arial, sans-serif;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .14em;
}
.pk-art-title {
    margin: 0 !important;
    color: #ffffff !important;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(34px, 3.6vw, 52px) !important;
    font-weight: 700 !important;
    line-height: 1.06 !important;
}
.pk-art-title span {
    color: #F5B72C !important;
}
.pk-art-line {
    width: 55px !important;
    max-width: 55px !important;
    margin: 23px 0 !important;
    border: 0 !important;
    border-top: 3px solid #F5B72C !important;
}
.pk-art-text {
    max-width: 570px !important;
    margin: 0 !important;
    color: #ffffff !important;
    font-family: Arial, sans-serif;
    font-size: 16px !important;
    line-height: 1.55 !important;
}
@media (max-width:700px) {
    .pk-art-cover {
        min-height: 500px !important;
    }
    .pk-art-content {
        width: auto !important;
        max-width: 90% !important;
        padding: 40px 22px !important;
    }
    .pk-art-title {
        font-size: clamp(29px, 7.8vw, 36px) !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }
    .pk-art-title br {
        display: block;
    }
    .pk-art-text {
        font-size: 15px !important;
    }
}


/* Sivun alkuperäinen tyylilohko 5. */
.pk-pyro-section {
    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 calc(50% - 50vw) !important;
    padding: 0 !important;
    background: #f4f1e9 !important;
    color: #17191a !important;
}

.pk-pyro-columns {
    width: min(1380px, calc(100% - 96px)) !important;
    max-width: 1380px !important;
    margin: 0 auto !important;
    padding: 48px 0 !important;
    gap: 60px !important;
}

.pk-pyro-image figure {
    width: 100% !important;
    margin: 0 !important;
}

.pk-pyro-image img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 3 / 2;
    object-fit: cover !important;
}

.pk-pyro-copy {
    padding: 10px 0 !important;
}

.pk-pyro-copy,
.pk-pyro-copy p,
.pk-pyro-copy h2 {
    text-align: left !important;
}

.pk-pyro-label {
    margin: 0 0 8px !important;
    color: #17191a !important;
    font-family: Arial, sans-serif;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .12em;
}

.pk-pyro-title {
    margin: 0 0 22px !important;
    color: #17191a !important;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px, 3.5vw, 52px) !important;
    font-weight: 700 !important;
    line-height: 1.05 !important;
}

.pk-pyro-copy > p:not(.pk-pyro-label) {
    max-width: 620px !important;
    margin: 0 0 17px !important;
    color: #17191a !important;
    font-family: Arial, sans-serif;
    font-size: 16px !important;
    line-height: 1.55 !important;
}

.pk-pyro-buttons {
    margin-top: 27px !important;
    justify-content: flex-start !important;
}

.pk-pyro-button .wp-block-button__link {
    padding: 13px 22px !important;
    border: 2px solid #F5B72C !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #17191a !important;
    font-family: Arial, sans-serif;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: .06em;
    text-decoration: none !important;
}

.pk-pyro-button .wp-block-button__link:hover {
    background: #F5B72C !important;
    color: #10191d !important;
}

@media (max-width:800px) {
    .pk-pyro-columns {
        width: calc(100% - 44px) !important;
        padding: 38px 0 !important;
        gap: 30px !important;
        flex-direction: column !important;
    }

    .pk-pyro-image,
    .pk-pyro-copy {
        width: 100% !important;
        flex-basis: 100% !important;
    }

    .pk-pyro-title {
        font-size: 38px !important;
    }
}


/* Sivun alkuperäinen tyylilohko 6. */
.pk-facts-section {
    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 calc(50% - 50vw) !important;
    padding: 0 !important;
    background: #10191d !important;
    color: #ffffff !important;
}

.pk-facts-grid {
    width: min(1380px, calc(100% - 96px)) !important;
    max-width: 1380px !important;
    margin: 0 auto !important;
    padding: 40px 0 !important;
    gap: 0 !important;
}

.pk-fact {
    min-height: 90px;
    box-sizing: border-box;
    padding: 8px 30px !important;
    border-right: 1px solid rgba(255,255,255,.20);
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    text-align: center !important;
}

.pk-fact:first-child {
    padding-left: 10px !important;
}

.pk-fact:last-child {
    padding-right: 10px !important;
    border-right: 0;
}

.pk-fact-value {
    margin: 0 0 8px !important;
    color: #F5B72C !important;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(24px,2.2vw,32px) !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    text-align: center !important;
}

.pk-fact-motto {
    font-size: clamp(20px,1.8vw,27px) !important;
    font-weight: 400 !important;
}

.pk-fact-label {
    margin: 0 !important;
    color: #e4e4e1 !important;
    font-family: Arial, sans-serif;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    letter-spacing: .10em;
    text-align: center !important;
}

@media (max-width:900px) {
    .pk-facts-grid {
        flex-wrap: wrap !important;
    }

    .pk-fact {
        flex-basis: 50% !important;
        padding: 28px 20px !important;
        border-bottom: 1px solid rgba(255,255,255,.16);
    }

    .pk-fact:nth-child(2) {
        border-right: 0;
    }
}

@media (max-width:600px) {
    .pk-facts-grid {
        width: calc(100% - 44px) !important;
        padding: 18px 0 !important;
    }

    .pk-fact {
        flex-basis: 100% !important;
        min-height: auto;
        padding: 25px 10px !important;
        border-right: 0;
    }

    .pk-fact:last-child {
        border-bottom: 0;
    }

    .pk-fact-value {
        font-size: 27px !important;
    }

    .pk-fact-motto {
        font-size: 23px !important;
    }
}


/* Sivun alkuperäinen tyylilohko 7. */
.pk-join-cover {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}
.pk-join-cover .wp-block-cover__background {
    background: rgba(5,10,12,.50) !important;
    opacity: 1 !important;
}
.pk-join-cover .wp-block-cover__inner-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.pk-join-content {
    width: 570px !important;
    max-width: 570px !important;
    margin: 0 !important;
    padding: 50px 0 50px 7% !important;
    text-align: left !important;
}
.pk-join-content p,
.pk-join-content h2 {
    text-align: left !important;
}
.pk-join-label {
    margin: 0 0 11px !important;
    color: #ffffff !important;
    font-family: Arial, sans-serif;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .14em;
}
.pk-join-title {
    margin: 0 !important;
    color: #ffffff !important;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px,4vw,56px) !important;
    font-weight: 700 !important;
    line-height: 1.04 !important;
}
.pk-join-title span {
    color: #F5B72C !important;
}
.pk-join-line {
    width: 55px !important;
    max-width: 55px !important;
    margin: 22px 0 !important;
    border: 0 !important;
    border-top: 3px solid #F5B72C !important;
}
.pk-join-text {
    max-width: 550px !important;
    margin: 0 !important;
    color: #ffffff !important;
    font-family: Arial, sans-serif;
    font-size: 16px !important;
    line-height: 1.55 !important;
}
.pk-join-buttons {
    margin-top: 27px !important;
    justify-content: flex-start !important;
}
.pk-join-button .wp-block-button__link {
    padding: 13px 23px !important;
    border: 2px solid #F5B72C !important;
    border-radius: 0 !important;
    background: #F5B72C !important;
    color: #10191d !important;
    font-family: Arial, sans-serif;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: .07em;
    text-decoration: none !important;
}
.pk-join-button .wp-block-button__link:hover {
    background: transparent !important;
    color: #ffffff !important;
}
@media (max-width:700px) {
    .pk-join-cover {
        min-height: 460px !important;
    }
    .pk-join-content {
        width: auto !important;
        max-width: 90% !important;
        padding: 40px 22px !important;
    }
    .pk-join-title {
        font-size: 40px !important;
    }
    .pk-join-text {
        font-size: 15px !important;
    }
}


/* Sivun alkuperäinen tyylilohko 8. */
/* =========================================================
   PYROTEKNIKKOJEN KILTA
   Yhdistys-sivun loppuviimeistely
   ========================================================= */


/* ---------------------------------------------------------
   1. YHTENÄINEN SISÄLTÖLINJA KANSI-OSIOILLE

   Vastaa muun sivun:
   max-width: 1380px
   desktop-sivumarginaali: 48px
   --------------------------------------------------------- */

.pk-yhdistys-hero-content,
.pk-art-content,
.pk-join-content {
    box-sizing: border-box !important;

    width: min(1380px, calc(100% - 96px)) !important;
    max-width: 1380px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* Säilytetään osioiden nykyinen pystysuuntainen rytmi */

.pk-yhdistys-hero-content {
    padding-top: 45px !important;
    padding-bottom: 45px !important;
}

.pk-art-content {
    padding-top: 52px !important;
    padding-bottom: 52px !important;
}

.pk-join-content {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}


/* Tekstisisältö ei kuitenkaan leviä koko 1380 px alueelle */

.pk-yhdistys-hero-content > * {
    max-width: 520px;
}

.pk-art-content > * {
    max-width: 610px;
}

.pk-join-content > * {
    max-width: 570px;
}


/* ---------------------------------------------------------
   2. TABLETTI – 2 × 2 RUUDUKOT
   --------------------------------------------------------- */

@media (max-width: 900px) {

    /* Toimintamme */

    .pk-activity-card {
        flex-basis: 50% !important;
        box-sizing: border-box !important;
    }

    .pk-activity-card:nth-child(even) {
        border-right: 0 !important;
    }

    /* Faktat */

    .pk-fact {
        flex-basis: 50% !important;
        box-sizing: border-box !important;
    }

    .pk-fact:nth-child(even) {
        border-right: 0 !important;
    }


    /* Vaaleat kaksipalstaiset osiot vaihtuvat
       samalla breakpointilla pystysuuntaisiksi */

    .pk-about-columns,
    .pk-pyro-columns {
        width: calc(100% - 64px) !important;
        padding: 42px 0 !important;
        gap: 32px !important;
        flex-direction: column !important;
    }

    .pk-about-copy,
    .pk-about-image,
    .pk-pyro-image,
    .pk-pyro-copy {
        width: 100% !important;
        flex-basis: 100% !important;
    }
}


/* ---------------------------------------------------------
   3. MOBIILI
   --------------------------------------------------------- */

@media (max-width: 600px) {

    /* Kaikille pääsisällöille sama 22 px sivumarginaali */

    .pk-yhdistys-hero-content,
    .pk-art-content,
    .pk-join-content,
    .pk-about-columns,
    .pk-pyro-columns,
    .pk-activities-inner,
    .pk-facts-grid {
        width: calc(100% - 44px) !important;
        max-width: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }


    /* Hero */

    .pk-yhdistys-hero-content {
        padding: 38px 0 !important;
    }

    .pk-yhdistys-title {
        font-size: clamp(30px, 8vw, 38px) !important;
    }


    /* Ilotulitus on taidetta */

    .pk-art-cover {
        min-height: 500px !important;
    }

    .pk-art-content {
        padding: 40px 0 !important;
    }

    .pk-art-title {
        font-size: clamp(29px, 7.8vw, 36px) !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }

    .pk-art-title br {
        display: block !important;
    }


    /* Liity mukaan */

    .pk-join-cover {
        min-height: 460px !important;
    }

    .pk-join-content {
        padding: 40px 0 !important;
    }

    .pk-join-title {
        font-size: 38px !important;
    }


    /* Vaaleat sisältöosiot */

    .pk-about-columns,
    .pk-pyro-columns {
        padding: 38px 0 !important;
        gap: 28px !important;
    }


    /* Toimintamme */

    .pk-activity-card {
        flex-basis: 100% !important;
        border-right: 0 !important;
    }


    /* Faktat */

    .pk-fact {
        flex-basis: 100% !important;
        border-right: 0 !important;
    }


    /* Painikkeet helpommin käytettäviksi kosketusnäytöllä */

    .pk-pyro-button .wp-block-button__link,
    .pk-join-button .wp-block-button__link {
        min-height: 46px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}