/*
 Theme Name: Osiris
 Description: Osiris theme
 Author: Caleb
 Template: hello-elementor
 Version: 2.0.0
*/

/* Theme variables */
:root{
    /* Font Family */
    --theme-font-family: "Montserrat";

    /* H1 */
    --theme-font-size-h1: 58px;
    --theme-font-weight-h1: 800;
    --theme-line-height-h1: 58px;
    --theme-letter-spacing-h1: 0px;

    /* H2 */
    --theme-font-size-h2: 44px;
    --theme-font-weight-h2: 700;
    --theme-line-height-h2: 44px;
    --theme-letter-spacing-h2: -1.32px;
    --theme-text-transform-h2: uppercase;

    /* H3 */
    --theme-font-size-h3: 32px;
    --theme-font-weight-h3: 700;
    --theme-line-height-h3: 32px;
    --theme-letter-spacing-h3: -0.65px;
    --theme-text-transform-h3: uppercase;

    /* H4 */
    --theme-font-size-h4: 24px;
    --theme-font-weight-h4: 500;
    --theme-line-height-h4: 27.84px;

    /* H5 */
    --theme-font-size-h5: 20px;
    --theme-font-weight-h5: 500;
    --theme-line-height-h5: 26px;

    /* H6 */
    --theme-font-size-h6: 16px;
    --theme-font-weight-h6: 500;
    --theme-line-height-h6: 20.8px;

    /* Body */
    --theme-font-family-body: "Montserrat";
    --theme-font-size-body: 18px;
    --theme-font-weight-body: 400;
    --theme-line-height-body: 25.2px;
    --theme-letter-spacing-body: -0.36px;

    /* Body (sm) */
    --theme-font-family-body-sm: "Montserrat";
    --theme-font-size-body-sm: 14px;
    --theme-font-weight-body-sm: 400;
    --theme-line-height-body-sm: 19.6px;
    --theme-letter-spacing-body-sm: -0.28px;

    /* Highlight text */
    --theme-font-size-highlight-text: 20px;
    --theme-font-weight-highlight-text: 600;
    --theme-line-height-highlight-text: 30px;

    /* Highlight text-1 */
    --theme-font-size-highlight-text-1: 24px;
    --theme-font-weight-highlight-text-1: 600;
    --theme-line-height-highlight-text-1: 31.2px;

    /* Action */
    --theme-font-size-action: 14px;
    --theme-font-weight-action: 600;
    --theme-line-height-action: 15.4px;
    --theme-letter-spacing-action: -0.28px;
    --theme-text-transform-action: uppercase;

    /* Action (sm) */
    --theme-font-size-action-sm: 14px;
    --theme-font-weight-action-sm: 400;
    --theme-line-height-action-sm: 19.6px;
    --theme-letter-spacing-action-sm: -0.28px;

    /* Information */
    --theme-font-size-information: 14px;
    --theme-font-weight-information: 400;
    --theme-line-height-information: 16.8px;

    /* Overline      */
    --theme-font-size-overline: 24px;
    --theme-font-weight-overline: 400;
    --theme-line-height-overline: 31.2px;
    --theme-letter-spacing-overline: 6px;

    /* Date */
    --theme-font-size-date: 16px;
    --theme-font-weight-date: 400;
    --theme-line-height-date: 20.8px;
    --theme-letter-spacing-date: 6px;
}
/* Mobile */
@media only screen and (max-width:767px) {
    :root{
        /* H1 */
        --theme-font-size-h1: 40px;
        --theme-line-height-h1: 40px;

        /* H2 */
        --theme-font-size-h2: 36px;
        --theme-line-height-h2: 36px;
        --theme-font-weight-h2: 500;
        --theme-letter-spacing-h2: -0.72px;

        /* H4 */
        --theme-font-size-h4: 20px;
        --theme-line-height-h4: 24px;
        --theme-font-weight-h4: 500;
        --theme-letter-spacing-h4: -1%;

        /* H5 */
        --theme-font-size-h5: 20px;
        --theme-line-height-h5: 130%;
        --theme-font-weight-h5: 500;
        --theme-letter-spacing-h5: 0%;

        /* H6 */
        --theme-font-size-h6: 14px;
        --theme-line-height-h6: 100%;
        --theme-font-weight-h6: 500;
        --theme-letter-spacing-h6: 0%;

        /* Body */
        --theme-font-size-body: 16px;
        --theme-line-height-body: 140%;
        --theme-font-weight-body: normal;
        --theme-letter-spacing-body: -2%;

        /* Date */
        --theme-font-size-date: 14px;
        --theme-line-height-date: 130%;
        --theme-letter-spacing-date: 7.8px;

        /* Action */
        --theme-font-size-action: 16px;
        --theme-line-height-action: 100%;
        --theme-font-weight-action: 500;
        --theme-letter-spacing-action: -1%;
    }
}

/* Anything that reads Elementor globals must live under the kit scope */
:where(body[class*="elementor-kit-"]) {
    /* Colors */
    --theme-color-primary: var(--e-global-color-primary);
    --theme-color-secondary: var(--e-global-color-secondary);
    --theme-color-text: var(--e-global-color-primary);
    --theme-color-accent: var(--e-global-color-accent);
  
    /* Custom mapped to Elementor hashed tokens */
    --theme-color-highlight-accent: var(--e-global-color-dc407a7);
    --theme-color-star: var(--e-global-color-055ba55);
    --theme-color-background: var(--e-global-color-440f3e9);
    --theme-color-tertiary: var(--e-global-color-f5bdfa3);
    --theme-color-text-accent: var(--e-global-color-a183202);
    --theme-color-in-stock: var(--e-global-color-a4b48de);
  }

/* ==================================  
 * Margins
 * ================================== */
/* Margin control */
p:last-child{
	margin-bottom:0px;
}
h1, h2, h3, h4, h5, h6, p{
    margin:0px !important;
}

/* ==================================  
 * Images: Aspect Ratios
 * ================================== */
img.fourThree{
	aspect-ratio: 4/3;
	object-fit: cover;
}

/* Swiper.js */
.swiper-container{
    overflow: hidden;
}

/* Swiper Buttons */
.nav-buttons {
    display: flex;
    align-items: center;
    column-gap: 20px;
    position: relative;
    min-width: 120px;
    min-height: 48px;
    justify-content: flex-end;
}

.swiper-button-next {
    right: 0 !important;
}

.swiper-button-prev {
    left: 0 !important;
}

.swiper-button-next:after,
.swiper-button-prev:after {
    content: "" !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: white !important;
    width: 100% !important;
    max-width: 15px !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.swiper-button-next:after {
    background-image: url("/wp-content/uploads/2025/10/Right-arrow-0.svg") !important;
}

.swiper-button-prev:after {
    background-image: url("/wp-content/uploads/2025/10/Left-arrow-0.svg") !important;
}

.swiper-button-next,
.swiper-button-prev {
    margin: 0 !important; 
    position: relative !important;
    border-radius: 3.33px !important;
    background-color: var(--e-global-color-primary) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease !important;
    width: 40px !important;
    aspect-ratio: 1 / 1 !important;
}
.swiper-button-next:hover,
.swiper-button-prev:hover {
    filter: brightness(1.2) !important;
}


/* Pagination styling */
.swiper-pagination {
    display: block !important; /* Hidden by default on desktop */
    position: relative !important;
    bottom: 10px !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    text-align: center !important;
    width: 100% !important;
    line-height: 0 !important;
    margin-top: 20px !important;
}

/* Force the correct bullet size with high specificity and !important */
.swiper-container .swiper-pagination-bullet,
.swiper-pagination .swiper-pagination-bullet {
    width: 8px !important;
    height: 8px !important;
    display: inline-block !important;
    border-radius: 50% !important;
    background: var(--e-global-color-primary) !important;
    opacity: 0.5 !important;
    margin: 0 4px !important;
    transition: all 0.3s !important;
}

/* Active bullet styling with high specificity */
.swiper-container .swiper-pagination-bullet-active,
.swiper-pagination .swiper-pagination-bullet-active {
    opacity: 1 !important;
    width: 24px !important;
    height: 8px !important;
    border-radius: 4px !important;
    background: #D1B28C !important;
}

.page-header {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 16px;
    padding: 0px !important;
    max-width: 1280px;
    justify-self: center;
    width: 100%;
}