:root {
    /*Colors*/
    --c1: #f4968f;
    --c2: #f4c542;
    --c3: #8C6622;
    --c4: #7C9EB7;
    --cl: #fffdf9;
    --cd: #423E37;
    --tc: var(--cd);
    --tc_h: var(--cd);
    --border_c: var(--cd);
    --bg1: #fffdf9;
    --bg2: #fffaf1;
    --bg3: #f4c542;
    --bg4: var(--cd);
    --box_shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    --input_box_shadow: inset 0 0 0 1px var(--c1);
    --max_width: 1200px;
    --max_sidebar_width: 400px;
    --top_offset: 0px;

    /*Fonsts*/
    --heading_font:
        'Kellissa', sans-serif;
    --sub_heading_font:
        'Poppins', sans-serif;
    --body_font:
        'Poppins', sans-serif;
    --body: 17px;
    --h1: 5.6rem;
    --h2: 4rem;
    --h3: 1.8rem;
    --h4: 1.4rem;
    --h5: 1.1rem;
    --caption: 0.83rem;
    --small: 0.69rem;
    --heading_lh: 1.1em;
    --body_lh: 1.4em;

    /**/
    --menu_height: 100px;
    --padding: 10px 12px;
    --section_padding: clamp(30px, 8vw, 80px);
    --gap_min: clamp(15px, 2vw, 20px);
    --gap: clamp(20px, 4vw, 40px);
    --gap_xl: clamp(25px, 8vw, 80px);
    --radius: 20px;
    --radius_l: clamp(20px, 5vw, 40px);
    --radius_xl: clamp(25px, 8vw, 100px);
    --c_radius: 25px;
    --ci_radius: 25px;
    --bezier: cubic-bezier(0.25, 0.8, 0.35, 0.9);
    --fvh: 100vh;
    --fvh: 100svh;
    --full_menu_height: var(--menu_height);
    --top_spacing: calc(var(--full_menu_height) + var(--gap));

    /*Woocommerce*/
    --message: #232323;
    --error: #d42222;
    --success: #15bf86;
    --info: #1e73be;
    --message_bg: var(--bg1);
}

:root:has(#top-nav .boxed) {
    --full_menu_height: 149px;
}

@media only screen and (max-width: 1240px) {
    :root:has(#top-nav .boxed) {
        --full_menu_height: 139px;
    }
}

@media only screen and (max-width: 600px) {
    :root {
        --body: 15px;
        --h1: 3rem;
        --h2: 2.4rem;
        --h3: 2rem;
        --h4: 1.6rem;
        --h5: 1.2rem;
    }
}

.editor-styles-wrapper,
body {
    --wp--preset--spacing--20: var(--gap_min) !important;
    --wp--preset--spacing--30: var(--gap) !important;
    --wp--preset--spacing--40: var(--gap_xl) !important;
    --wp--preset--spacing--80: var(--section_padding) !important;
}

.wp-block-heading {
    margin-bottom: clamp(2px, 0.5em, 8px)
}

p {
    margin-bottom: 0.4em
}

.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3,
.editor-styles-wrapper h4,
.editor-styles-wrapper h5 {
    font-family: var(--heading_font);
    line-height: var(--heading_lh);
    font-weight: 600;
    margin: 0;
}

.editor-styles-wrapper h1 {
    font-size: var(--h1)
}

.editor-styles-wrapper h2 {
    font-size: var(--h2);
}

.editor-styles-wrapper h3 {
    font-size: var(--h3);
}

.editor-styles-wrapper h4 {
    font-size: var(--h4);
}

.editor-styles-wrapper h5 {
    font-size: var(--h5);
}

.editor-styles-wrapper:not(.post-type-page) h1,
.editor-styles-wrapper:not(.post-type-page) .is-root-container {
    max-width: 1000px;
    margin: 0 auto;
}

.editor-styles-wrapper:not(.post-type-page) h1 {
    font-size: var(--h2);
}

.editor-styles-wrapper :where(.h1, .h2, .h3, .h4, .h5, h1, h2, h3, h4, h5)+* {
    margin-top: 1em;
}


.editor-styles-wrapper p {
    margin: 0;
    line-height: var(--body_lh);
}

.editor-styles-wrapper *+p {
    margin-top: 0.8em;
}

.wp-block-media-text .wp-block-media-text__content {
    padding: clamp(20px, 10%, 80px);
}

.entry-content p {
    line-height: 1.8em;
    margin-top: 0.6em;
}

.entry-content p:last-child {
    margin-bottom: 0;
}

.is-style-container {
    max-width: var(--max_width);
    width: clamp(300px, 95%, var(--max_width));
    margin: 0 auto;
    position: relative;
    margin-top: var(--gap);
    margin-bottom: var(--gap);
}


.is-style-container:first-child {
    margin-top: 0;
}

:where(.post-type-project,
    .post-type-post) .editor-styles-wrapper :where(.editor-editor-canvas__post-title-wrapper, .is-root-container) {
    max-width: var(--max_width);
    width: clamp(300px, 98%, var(--max_width));
    margin: 0 auto;
}

.entry-content .wp-block-heading {
    margin-bottom: clamp(4px, 0.4em, 15px);
}

.entry-content .wp-block-heading:not(:has(+*)) {
    margin-bottom: 0;
}

.entry-content *+.wp-block-heading {
    margin-top: 1em;
}

.entry-content p {
    margin-bottom: 1em;
}

.entry-content ul {
    list-style: disc;
}

.entry-content ul,
.entry-content ol {
    margin-left: 1em;
}

.entry-content ul li,
.entry-content ol li {
    margin: 0.4em 0;
}


@media screen and (max-width: 780px) {
    .wp-block-columns.invert_col {
        flex-direction: column-reverse;
    }
}

.wp-lightbox-overlay .scrim {
    background-color: rgb(0 0 0 / 0.8) !important;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}

.pg_col-2 .pixll_group-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gap_xl);
    justify-items: stretch;
    align-items: center;
}

.pg_col-2 .pixll_group-content>.wp-block-image,
.pg_col-2 .pixll_group-content>.wp-block-image img {
    width: 100%;
}

@media screen and (max-width: 780px) {
    .pg_stack_om .pixll_group-content {
        grid-template-columns: 1fr !important;
    }

    .pg_col-2 .pixll_group-content {
        grid-template-columns: 1fr !important;
    }

    .pg_col-2.rev .pixll_group-content>:first-child {
        grid-row: 2/3;
    }
}

.col-2,
.col-3,
.col-4,
.col-auto {
    display: grid !important;
    gap: var(--gap);
}

:root {
    --col-2: repeat(2, 1fr);
    --col-3: repeat(3, 1fr);
    --col-4: repeat(4, 1fr);
}

.col-2 {
    grid-template-columns: var(--col-2);
    gap: clamp(30px, 10vw, 100px);
}

.col-3 {
    grid-template-columns: var(--col-3);
}

.col-4 {
    grid-template-columns: var(--col-4);
    gap: var(--gap_min);
}

.col-auto {
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}

@media only screen and (max-width: 1000px) {
    :root {
        --col-2: repeat(2, 1fr);
        --col-3: repeat(2, 1fr);
        --col-4: repeat(2, 1fr);
    }
}

@media only screen and (max-width: 600px) {
    :root {
        --col-2: 1fr;
        --col-3: 1fr;
        --col-4: 1fr;
    }
}

:where(.col-2,
    .col-3,
    .col-4)>* {
    margin: 0 !important;
}

.center {
    align-items: center;
    text-align: center;
}

.center>* {
    margin-left: auto;
    margin-right: auto;
}

.flex-auto {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    align-content: flex-start;
    justify-content: space-between;
    align-items: flex-start;
}

.flex-auto>* {
    max-width: 200px;
}


/*Custom to Project*/
.col-auto-flex {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--gap);
    margin-top: var(--gap_min);
}

.col-auto-flex>* {
    flex: 1 1 310px;
}

.is-style-style-1 {
    --max_width: 1000px;
}

.is-style-style-2 {
    --max_width: 600px;
}

.styled.wp-block-heading {
    position: relative;
    width: max-content;
    margin: 0 auto;
    overflow: unset;
}

.styled.wp-block-heading::before,
.styled.wp-block-heading::after {
    content: "";
    display: block;
    position: absolute;
    top: 40%;
    height: 1em;
    width: auto;
    aspect-ratio: 1;
    background-image: url(/wp-content/themes/pixll-theme/assets/img/card.svg?ver=1.0.0);
    background-repeat: no-repeat;
    background-size: contain;
}

.styled.wp-block-heading::before {
    left: 0;
    transform: translate(-150%, -50%);
    margin-right: 0.2em;
}

.styled.wp-block-heading::after {
    right: 0;
    transform: translate(150%, -50%);
    margin-left: 0.2em;
    background-image: url(/wp-content/themes/pixll-theme/assets/img/calendar.svg?ver=1.0.0);
}

.t-2.styled.wp-block-heading::before {
    background-image: url(/wp-content/themes/pixll-theme/assets/img/burger.svg?ver=1.0.0);
}

.t-2.styled.wp-block-heading::after {
    background-image: url(/wp-content/themes/pixll-theme/assets/img/drink.svg?ver=1.0.0);
}

.t-3.styled.wp-block-heading::before {
    background-image: url(/wp-content/themes/pixll-theme/assets/img/news.svg?ver=1.0.0);
}

.t-3.styled.wp-block-heading::after {
    background-image: url(/wp-content/themes/pixll-theme/assets/img/id.svg?ver=1.0.0);
}

.is-style-hero-section {
    min-height: clamp(200px, 40vh, 400px);
    background-color: var(--bg4);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    --tc: var(--cl);
    color: var(--tc);
    text-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    padding: var(--section_padding) var(--gap);
    border-radius: 0 0 var(--radius_xl) var(--radius_xl);
    position: relative;
}

.is-style-hero-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: #423E37;
    opacity: 0.5;
    border-radius: 0 0 var(--radius_xl) var(--radius_xl);
}

.is-style-hero-section>* {
    z-index: 1;
}

.is-style-hero-section.large {
    min-height: clamp(400px, 80vh, 720px);
    padding: var(--section_padding) var(--gap);
}



.advertise_section .wp-block-group {
    width: clamp(300px, 48vw, 680px);
}

@media screen and (max-width: 780px) {
    .advertise_section .wp-block-group {
        width: 100%;
        padding-bottom: 200px;
    }
}

.circle_pattern::before,
.circle_pattern::after {
    content: "";
    display: block;
    position: absolute;
    background-image: url(/wp-content/themes/pixll-theme/assets/img/circles.svg?ver=1.0.0);
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 1;
    height: clamp(100px, 50vw, 800px);
    width: auto;
    aspect-ratio: 1;
    pointer-events: none;
    top: 0;
    left: 0;
    transform: translate(-50%, -50%);
}

.circle_pattern::before {
    top: auto;
    left: auto;
    bottom: 0;
    right: 0;
    transform: translate(50%, 50%);
}

.circle_pattern {
    position: relative;
    overflow: hidden;
}

.circle_pattern>* {
    z-index: 2;
}


.wp-block-freeform p>img {
    width: 100%;
}

.wp-block-freeform p:has(img:nth-of-type(2)) {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--gap_min);
}