/**
Theme Name: Kupla Social Child Theme
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kupla-social-child-theme
Template: astra
*/

/* HEADER */

/* Headerist채 pois sivupaddingit */
body header.site-header #ast-desktop-header .site-primary-header-wrap {
    padding:0;
}

body header.site-header nav.site-navigation ul.main-header-menu li.menu-item-object-page.current-menu-item > a.menu-link,
body header.site-header nav.site-navigation ul.main-header-menu .current-menu-ancestor > a.menu-link {
    color: #000;
}

/* Mobiiliheader */
body header.site-header #ast-mobile-header .ast-builder-grid-row {
    column-gap: 16px;
}

body header.site-header #ast-mobile-header .site-branding .site-logo-img {
    padding-right:0;
}

body header.site-header #ast-mobile-header .ast-button-wrap button.menu-toggle {
    padding: 12px 0 12px 12px;
}

body header.site-header #ast-mobile-header .ast-mobile-header-content {
    border-radius: 12px;
    border: 1px solid #000;
    box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.1);
}

body header.site-header #ast-mobile-header .ast-mobile-header-content ul.main-header-menu > li:last-of-type > a {
    border:0;
}

body header.site-header #ast-mobile-header .ast-mobile-header-content ul.main-header-menu > li button.ast-menu-toggle {
    color: #000;
    border:0;
    box-shadow:none;
}

body header.site-header #ast-mobile-header .ast-mobile-header-content ul.main-header-menu > li button.ast-menu-toggle .ast-icon svg {
    margin-left:2px;
}


/* BODY */

/* Ylikirjoitetaan Astran omat padding-tyylit */
body #content .ast-container,
body.ast-separate-container #content .ast-container  {
    padding-left: 24px;
    padding-right:24px;
}

body.ast-separate-container #content .ast-container #primary {
    padding:0;
}

@media (min-width: 1201px) {
    body.ast-separate-container #page .ast-article-post,
    body.ast-separate-container #page .ast-article-single,
    body.ast-separate-container #page .ast-author-box,
    body.ast-separate-container #page .ast-404-layout-1,
    body.ast-separate-container #page .no-results {
        padding: 2em;
    }
}

@media (max-width: 1200px) {
    body.ast-separate-container #page .ast-article-post,
    body.ast-separate-container #page .ast-article-single,
    body.ast-separate-container #page .ast-author-box,
    body.ast-separate-container #page .ast-404-layout-1,
    body.ast-separate-container #page .no-results {
        padding: 0;
    }
}


/* AALTOKUVIO, skaalaus mobiilissa */
body #content .aaltokuvio-container,
body .ast-custom-footer .aaltokuvio-container {
    overflow: hidden;
}

@media (max-width: 766px) {
    body #content .aaltokuvio-container svg#aaltokuvio,
    body .ast-custom-footer .aaltokuvio-container svg#aaltokuvio {
        width: 200vw;
        height: auto;
        display: block;
        position: relative;
        left: -50vw;
    }
}

/* AALTOVIIVA ENNEN OTSIKOITA */
body #content .wp-block-uagb-advanced-heading.otsikko-viivalla .uagb-heading-text {
    position:relative;
}

body #content .wp-block-uagb-advanced-heading.otsikko-viivalla .uagb-heading-text::before {
    content:"";
    background: url("https://kuplasocial.fi/wp-content/uploads/2025/05/kupla_aaltoviiva.svg");
    background-repeat: repeat-x;
    background-size: contain;
    background-position: right;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    right: calc(100% + 24px);
    width: 40vw;
    height: 16px;
}

/* Responsiivinen */

@media (max-width: 1360px) {
    body #page .wp-block-uagb-advanced-heading.otsikko-viivalla .uagb-heading-text::before {
        content:"";
        background: url("https://kuplasocial.fi/wp-content/uploads/2025/05/kupla_aaltoviiva_mobiili.svg");
        background-repeat: no-repeat;
        background-size: contain;
        background-position: right;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        position: absolute;
        top: 50%;
        right: calc(100% + 12px);
        width: 50vw;
        height: 16px;
    }
}

@media (min-width: 767px) and (max-width: 1360px) {
    body #page .wp-block-uagb-advanced-heading.otsikko-viivalla,
    body #page .seo-otsikko-sisennys {
        margin-left:48px;
        width: calc(100% - 48px);
    }
}

@media (max-width: 766px) {
    body #page .wp-block-uagb-advanced-heading.otsikko-viivalla,
    body #page .seo-otsikko-sisennys {
        margin-left:32px;
        width: calc(100% - 32px);
    }
}


/* PALVELUMME */

/* Palvelumme, aukaistavat osiot tyyliteltyn채 */
body #content .palvelumme-aukaistavat .wp-block-details {
    border-radius: 8px;
    transition: all .1s ease;
}

body #content .palvelumme-aukaistavat .wp-block-details:hover {
    -webkit-box-shadow:inset 0px 0px 0px 0.8px #000;
    -moz-box-shadow:inset 0px 0px 0px 0.8px #000;
    box-shadow:inset 0px 0px 0px 0.8px #000;
}

body #content .palvelumme-aukaistavat .wp-block-details summary {
    list-style-type: none;
    display:flex;
    justify-content: space-between;
}

/* Plus-symboli */
body #content .palvelumme-aukaistavat .wp-block-details summary::after {
    content: "+";
    font-weight: 300;
    line-height:1;
    align-self: center;
    transition: all .1s ease;
}

/* Plus-symboli hoverissa */
body #content .palvelumme-aukaistavat .wp-block-details:hover summary::after,
body #content .palvelumme-aukaistavat .wp-block-details:focus summary::after {
    content: "+";
    transform: scale(1.5) !important;
}

/* Palvelumme, aukaistavien osioiden sis채inen v채listys */
body #content .palvelumme-aukaistavat .wp-block-details > * {
    padding: 0 20px;
}

@media (max-width: 766px) {
    body #content .palvelumme-aukaistavat .wp-block-details > * {
        padding: 0 16px;
    }
}

body #content .palvelumme-aukaistavat .wp-block-details > *:last-child {
    margin-bottom: 32px;
}

/* Palvelumme-osion responsiivisuus */
@media (min-width: 1360px) {
    body #content .palvelumme-aukaistavat .wp-block-details summary {
        padding: 40px 20px;
        font-size: 26px;
    }
    body #content .palvelumme-aukaistavat .wp-block-details summary::after {
        content: "+";
        font-size: 38px;
    }
}

@media (min-width: 1200px) and (max-width: 1360px) {
    body #content .palvelumme-aukaistavat .wp-block-details summary {
        padding: 40px 16px;
        font-size: 24px;
}

    body #content .palvelumme-aukaistavat .wp-block-details summary::after {
        content: "+";
        font-size: 36px;
    }
}

@media (min-width: 977px) and (max-width: 1199px) {
    body #content .palvelumme-aukaistavat {
        flex-wrap: wrap;
    }
    
    body #content .palvelumme-aukaistavat > .wp-block-uagb-container {
        flex: 0 0 calc(50% - 16px);
    }
    
    body #content .palvelumme-aukaistavat .wp-block-details summary {
        padding: 40px 16px;
        font-size: 24px;
}

    body #content .palvelumme-aukaistavat .wp-block-details summary::after {
        content: "+";
        font-size: 36px;
    }
}

@media (max-width: 976px) {
    body #content .palvelumme-aukaistavat .wp-block-details summary {
        padding: 32px 16px;
        font-size: 24px;
}

    body #content .palvelumme-aukaistavat .wp-block-details summary::after {
        content: "+";
        font-size: 36px;
    }
}


/* REFERENSSIT */

body #content .wp-block-uagb-post-carousel article {
    background-clip: padding-box !important;
    border-radius:16px;
    padding:0;
    box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.1);
}

body #content .wp-block-uagb-post-carousel .slick-slide > div {
    margin: 0 24px;
}

@media (max-width: 1360px) {
    body #content .wp-block-uagb-post-carousel .slick-slide > div {
        margin: 0 16px;
    }
}

body #content .wp-block-uagb-post-carousel article .uagb-post__image img {
    object-fit: cover;
    aspect-ratio: 16 / 9;
    object-position: 100% 40%;
    border-radius: 16px 16px 0 0;
}

body #content .wp-block-uagb-post-carousel.referenssit .uagb-post__image + .uagb-post__text {
    position:relative;
    top: -48px;
    margin: 0 16px;
}

body #content .wp-block-uagb-post-carousel.referenssit .uagb-post__taxonomy.highlighted {
    padding: 10px 8px;
    border-radius: 8px;
    margin-right: 8px;
}

body #content .wp-block-uagb-post-carousel.referenssit .uagb-post__taxonomy.highlighted a {
    font-family: 'citrus-gothic-solid',sans-serif;
    font-weight: 400;
}

/* Referenssikarusellin nuolipainikkeet */

body #content .wp-block-uagb-post-carousel button.slick-arrow {
    background-color: var(--ast-global-color-7);
    transition: all .1s ease;
}

body #content .wp-block-uagb-post-carousel button.slick-arrow:hover {
    background-color: var(--ast-global-color-2);
}

@media (max-width: 766px) {
    body #content .wp-block-uagb-post-carousel.referenssit button.slick-arrow.slick-next svg, 
    body #content .wp-block-uagb-post-carousel.referenssit button.slick-arrow.slick-prev svg{
        height: 28px;
        width: 28px;
    }
    body #content .wp-block-uagb-post-carousel.referenssit button.slick-arrow.slick-next, 
    body #content .wp-block-uagb-post-carousel.referenssit button.slick-arrow.slick-prev{
        bottom: -68px;
        top:auto;
    }
    body #content .wp-block-uagb-post-carousel.referenssit button.slick-arrow.slick-prev {
        left: 40%;
        right:auto;
        transform: translate(-50%, -50%);
    }
    body #content .wp-block-uagb-post-carousel.referenssit button.slick-arrow.slick-next {
        right: auto;
        left: 60%;
        transform: translate(-50%, -50%);
    }
}


/* Referenssi-artikkelien artikkelikuva */
body.single #content .artikkelikuva.wp-block-post-featured-image img {
    aspect-ratio: 16 / 9;
    object-position: 100% 40%;
}

/* Referenssi-artikkelin aaltokuvio */
body #content .aaltokuvio-container,
body .ast-custom-footer .aaltokuvio-container {
    overflow: hidden;
}

@media (min-width: 767px) {
    body #content .aaltokuvio-container svg#aaltokuvio-referenssi {
        width: 1360px;
        height: auto;
        display: block;
        position: relative;
    }
}

@media (max-width: 766px) {
    body #content .aaltokuvio-container svg#aaltokuvio-referenssi {
        width: 200vw;
        height: auto;
        display: block;
        position: relative;
        left: -50vw;
    }
}

/* Referenssi-sivulla kategoriat */
body.single #content article .entry-header .ast-terms-link {
    display:flex;
    gap: 8px;
}

body.single #content article .entry-header .ast-terms-link a {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    font-family: 'citrus-gothic-solid',sans-serif;
    font-weight: 400;
    font-size: 0.8rem;
    color: rgba(0,0,0,0.52);
    background-color: var(--ast-global-color-1);
    border:0;
    padding: 10px 8px;
    border-radius: 8px;
    box-shadow: none;
}

/* Referenssi-sivulla sivutus */

body.single #content .content-area nav.post-navigation .nav-links {
    gap: 12px;
    padding:0;
}

body.single #content .content-area nav.post-navigation .nav-links a {
    margin:0;
    padding:0;
}

body.single #content .content-area nav.post-navigation .nav-links a .edellinen-artikkeli-osio,
body.single #content .content-area nav.post-navigation .nav-links a .seuraava-artikkeli-osio {
    font-weight: 400;
    margin-bottom: 8px;
    font-size: 14px;
}


/* HINNASTO */

body #content .hinta {
    display:flex;
    gap:8px;
    align-items: center;
}

body #content .hinta .uagb-heading-text {
    line-height: 1em;
}

/* MISC */

/* Somekuvakkeiden tyylittely */
body .wp-block-social-links.has-icon-color.has-icon-background-color .wp-social-link {
    border-radius:4px;
}

body .wp-block-social-links.has-icon-color.has-icon-background-color .wp-social-link a {
    padding: .2em;
}

/* Sisennetty container, pienemmän näytön tyylit korjattu */
@media (min-width: 977px) and (max-width: 1360px) {
    body #content .wp-block-uagb-container.sisennys {
        padding: 0 40px;
    }
}

/* Painikkeen kevyt animaatio */
body #page .wp-block-button .wp-block-button__link,
body #page .wp-block-uagb-buttons .wp-block-button__link,
body #page .fluentform button.ff-btn{
    transition: all .1s ease;
}


/* Entry title eri fontille */
body #content h1.wp-block-post-title {
    font-family: 'Darkmode-On',darkmode-on,sans-serif;
    font-weight: 700;
    margin-bottom: 12px;
}

/* Seo-otsikko */
body #page .wp-block-uagb-advanced-heading.seo-otsikko h2,
body #page .wp-block-uagb-advanced-heading.seo-otsikko h3 {
    font-family: 'Darkmode-On',darkmode-on,sans-serif;
    font-weight: 700;
}

/* Evästeet */

body .cky-btn {
    border: 0.8px solid;
}


/* INSTAGRAM */
body #content #sb_instagram,
body #content #sbi_images{
    padding-bottom:0 !important;
}

/* FOOTER */

/* Aaltokuvion väri footerissa */
body .ast-custom-footer #aaltokuvio .b {
    fill: var(--ast-global-color-1) !important;
}

body .ast-custom-footer a:not(.wp-block-button__link) {
    text-decoration: underline;
}

body .ast-custom-footer .sivukartta_valikko_container ul {
    list-style-type:none;
}

body .ast-custom-footer .sivukartta_valikko_container ul.menu {
    margin: 0 0 24px 12px;
}

body .ast-custom-footer .sivukartta_valikko_container ul li {
    line-height: 1.8em;
}


/* COPYRIGHT */

body .ast-custom-footer .tekijanoikeus {
    color: #00000085;
    font-size: 0.9rem;
}

body .ast-custom-footer .tekijanoikeus .tekijanoikeus-jakaja {
    font-size: 6px;
    margin: 0 8px;
    position: relative;
    top: -3px;
}
