/*
 Theme Name:   Sorikko LP
 Theme URI:    https://bricksbuilder.io/
 Description:  Sorikko / Bricks
 Author:       Kamil Mark   
 Author URI:   https://kamilmark.com
 Template:     bricks
 Version:      1.1
 Text Domain:  sorikko
*/

/* BASE VARS + RESPO */
:root {
    --vw: calc(100vw-20px);
    --sp00: 0.33rem;
    --sp0: 0.66rem;
    --sp1: 1rem;
    --sp2: 1.5rem;
    --sp3: 2.1rem;
    --sp4: 3rem;
    --sp5: 4rem;
    --sp6: 6rem;
    --sp7: 8.5rem;
    --sp8: 12rem;
    --sp9: 17rem;
    --sp10: 24rem;
    --t-h1: 7.2rem;
    --t-h2: 4.8rem;
    --t-h3: 3.2rem;
	--t-h4: 2rem;
    --t-l: 1.8rem;
    --t-m: 1.4rem;
    --t-s: 1.2rem;
    --st1: 1px;
    --colgap: 2rem;
    --container: 124rem;
    --pagemargin: calc((var(--vw) - var(--container)) / 2 - 1px);
    --negpagemargin: calc(1px - ((var(--vw) - var(--container)) / 2 ));
    --colbase: calc((var(--container) - (11 * var(--colgap))) / 12);
    --col1: var(--colbase);
    --col2: calc(2 * var(--colbase) + var(--colgap));
    --col3: calc(3 * var(--colbase) + 2 * var(--colgap));
    --col4: calc(4 * var(--colbase) + 3 * var(--colgap));
    --col5: calc(5 * var(--colbase) + 4 * var(--colgap));
    --col6: calc(6 * var(--colbase) + 5 * var(--colgap));
    --col7: calc(7 * var(--colbase) + 6 * var(--colgap));
    --col8: calc(8 * var(--colbase) + 7 * var(--colgap));
    --col9: calc(9 * var(--colbase) + 8 * var(--colgap));
    --col10: calc(10 * var(--colbase) + 9 * var(--colgap));
    --col11: calc(11 * var(--colbase) + 10 * var(--colgap));
    --f-head: 'Inter Tight', Helvetica, Arial, sans-serif;
    --f-body: 'Space Grotesk', Helvetica, Arial, sans-serif;
    --radius: .4rem;
    --glassglow: radial-gradient(circle farthest-side at bottom right, rgba(255, 77, 153, 0.25) 0%, rgba(178, 202, 255, 0.1) 60%);
    --glassglowdark: radial-gradient(circle farthest-side at bottom right, rgba(121, 35, 71, 0.68) 0%, rgba(43, 49, 61, 0.7) 60%);
    --glassglow0: radial-gradient(circle farthest-side at bottom right, rgba(255, 77, 153, 0) 0%, rgba(178, 202, 255, 0) 50%);
    --glassblur: blur(1rem);
    --glassborder: 1px solid var(--c-glassb);
    --glassborder2: 1px solid rgba(219, 232, 255, 0.5);
    --fancytrans: all .5s cubic-bezier(0.76, 0, 0.24, 1);
}

body {
    position: relative;
    font-family: var(--f-body);
    background: var(--c-dark) !important;
}

@media screen and (max-width: 1280px) {
    :root {
        --t-h1: 5.2rem;
        --t-h2: 4.2rem;
        --t-h3: 3rem;
        --t-l: 1.6rem;
        --sp8: 10rem;
        --sp9: 14rem;
        --sp10: 18rem;
        --container: calc(100vw - 10rem);
    }

}

@media screen and (max-width: 991px) {

    :root {
        --vw: 100vw;
    }

}

@media screen and (max-width: 767px) {

    :root {
        --t-h1: 3.6rem;
        --t-h2: 2.4rem;
        --t-h3: 1.8rem;
        --t-l: 1.5rem;
        --t-m: 13px;
        --t-s: 11px;
        --sp7: 6rem;
        --sp8: 7rem;
        --sp9: 9rem;
        --sp10: 12rem;
        --container: calc(100vw - 4rem);

    }

    .desktopbr {
        display: none;
    }
}

@media screen and (max-width: 479px) {

    :root {
        --colgap: 1.2rem;
    }

}

/* FIXES */
b,
strong {
    font-weight: 600;
}

:where(.brx-draggable.brx-empty),
:where(.brx-draggable:empty) {
    min-width: 0 !important;
    min-height: 0 !important;
}

:where(p) {
    margin: 0 0 .8em;
}

:where(p):last-child {
    margin: 0;
}

:is(h1,h2,h3,h4,h5,h6,.inter) {
	font-family: var(--f-head);
}

.brxe-section, .brxe-container { position: relative; }

:where(.brxe-form) .options-wrapper li {
  float: left;
  margin-right: 1rem;
  margin-top: .6rem;
}

.options-wrapper li {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
}

/* Global */ 

.header {
    backdrop-filter: blur(0);
    transition: var(--fancytrans) !important;
    background: transparent;
    border-top: 1px solid transparent;
    border-left: 1px solid transparent;
    border-radius: 10rem;
}

header.scrolling .header {
	padding: .6rem 1.7rem .6rem .8rem;
	background: var(--c-glass);
	width: 110rem;
    gap: var(--sp2);
    backdrop-filter: blur(5rem);
    border-top: var(--glassborder);
    border-left: var(--glassborder);
    align-items: center;
}

.header .bricks-site-logo {
    transition: var(--fancytrans);
}

header.scrolling .header .bricks-site-logo {
	width: 11rem;
}


header.scrolling #agent {
  transform: translateX(-75%);
  opacity: 0;
}

header.scrolling #birdy {
  transform: translateX(75%);
  opacity: 0;
}

svg.logo g {
  transition: all .3s ease;
  transform: translateX(0) translateY(0);
}

header.scrolling .logo {
  margin-bottom: -29%;
}

header.scrolling #circle {
  transform: translateX(-55%);
  transition-delay: 180ms;
}


@media screen and (max-width: 1280px) {
    header.scrolling .header {
        width: var(--container);
    }
}

.brx-popup-backdrop {
    backdrop-filter: blur(1rem);
}