/*
Theme Name:     Pacifique Marketing
Theme URI:      https://pacifiquemarketing.ca/
Template:       kadence
Author:         Pacifique Marketing
Author URI:     https://pacifiquemarketing.ca/
Description:    Pacifique Marketing Child Theme
Version:        1.0.0
License:        GNU General Public License v3.0 (or later)
License URI:    https://www.gnu.org/licenses/gpl-3.0.html
*/

/* ----- Variables ----- */
:root {
    --swiper-navigation-button-size: 3em;
    --swiper-navigation-button-spacing: 16px;
}

/* ----- Header + Logo ----- */
.site-header-upper-inner-wrap.child-is-fixed
.site-main-header-wrap.item-is-stuck {
    box-shadow: 0 0 transparent, 0 0 transparent,
    0 0px 14px 0px rgb(0 0 0 / 15%);
}

.site-branding a.brand img.svg-logo-image {
    transition: all 500ms ease-in-out;
}

.site-main-header-wrap.item-is-stuck .site-branding a.brand img.svg-logo-image {
    width: 170px;
}

/* ----- Swiper ----- */
.swiper {
    display: grid;
}

.swiper-navigation {
    position: absolute;
    right: 0;
    bottom: -90px;
    display: flex;
    justify-content: flex-end;
    width: calc(100% + 2 * var(--swiper-navigation-button-size) + var(--swiper-navigation-button-spacing));
    z-index: 1;
    gap: 16px;
}

.swiper-navigation > div {
    width: var(--swiper-navigation-button-size);
    height: var(--swiper-navigation-button-size);
    display: grid;
    place-content: center;
    cursor: pointer;
}

.swiper-navigation > div:first-of-type {
    transform: rotate(180deg);
}