/*--------------------------------------------------------------
# SELECTION COLOR
--------------------------------------------------------------*/
::selection {
    background-color: var(--color-1);
    color: var(--color-white);
}

/*--------------------------------------------------------------
  # SCROLL OFFSET
--------------------------------------------------------------*/
[id] {
    scroll-margin-top: var(--gutter);
}

/*--------------------------------------------------------------
# BASE LAYOUT
    - checkout what-the-phuc.com for layout ideas
--------------------------------------------------------------*/
.body {
    display: flex;
    flex-direction: column;
    min-height: 100vh; 

    padding-left: var(--gutter-outer);
    padding-right: var(--gutter-outer);

    color: var(--color-3);
    hyphens: auto;

    overflow-x: hidden;
    hyphens: initial;
}


.header {
    background-color: var(--color-white);
    position: relative;
    z-index: 10000;
    margin-bottom: var(--gutter);
}

.main {
    flex-grow: 1;
}

.footer {
    background-color: var(--color-4);
    color: var(--color-white);
    padding-top: calc(var(--gutter-outer) * 2);
    padding-bottom: calc(var(--gutter) * 2);

    
    margin-left: calc(var(--gutter-outer) * -1);
    margin-right: calc(var(--gutter-outer) * -1);

    
    padding-left: calc(var(--gutter-outer) * 1);
    padding-right: calc(var(--gutter-outer) * 1);
}

/*--------------------------------------------------------------
# CONTENT WIDTH
--------------------------------------------------------------*/
:where(.alignfull) {
    margin-left: calc(-1 * var(--gutter-outer));
    margin-right: calc(-1 * var(--gutter-outer));

    padding-left: var(--gutter-outer);
    padding-right: var(--gutter-outer);
}

:where(.alignwide) {
    width: 100%;
    max-width: var(--max-width-2);

    margin-left: auto;
    margin-right: auto;
}



/*--------------------------------------------------------------
# LINK COLOR
--------------------------------------------------------------*/
a {
    color: inherit;
}

/*--------------------------------------------------------------
  # WIDGETS
--------------------------------------------------------------*/
.widgets {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

/* .widget>* {
    margin-top: 0;
    margin-bottom: 0;
}

.widget>*+* {
    margin-top: var(--gutter);
} */

.widgets {
    display: grid;
    gap: var(--vertical-rhythm);
}

.is-style-outline .wp-block-button__link{
	background-color: transparent !important;
}

.is-style-outline .wp-block-button__link:hover{
	background-color: var(--color-1)!important;
}

h2{
	font-size: var(--font-size-1) !important;
}