/*
 Theme Name: Wilson Reed Theme
 Theme URI: https://paramountdigital.co.uk/
 Description: Wilson Reed Theme - Wilson Reed WordPress Theme built upon GeneratePress.
 Author: Paramount Digital
 Template: generatepress
 Version: 0.0.1
 Text Domain: wilson-reed-theme
*/


/* ----------------------------------------
   Breakpoints (use these literal values in every @media rule)
   --xl: 1290px  small desktop
   --lg: 991px   tablet landscape
   --md: 768px   tablet portrait
   --sm: 576px   mobile
---------------------------------------- */






/* ----------------------------------------
   Box Sizing Reset
---------------------------------------- */
html {
    box-sizing: border-box;
    background: var(--white, #FFFFFF);
    overflow-x: clip;
}
*, *:before, *:after {
    box-sizing: border-box;
    min-height: 0;
    min-width: 0;
}

body {
    background-color: var(--white, #FFFFFF);
    overflow-x: clip;
}


.separate-containers .inside-article {
    padding: 0;
}

/*Variables*/
:root {
    --dark-purple: #1E1344;
    --purple: #9491E2;
    --violet: #E8D9F1;
    --white: #FFFFFF;
    --gold: #ECC576;
    --green: #52CB7D;


}

#page.container {
    padding-left: 0;
    padding-right: 0;
}

#page .container,
header .container {
    max-width: 1320px;
}

#page .grid-container,
.site-header .grid-container {
    max-width: 1320px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
   
}

.inside-header {
    padding-left: 0;
    padding-right: 0;
}


.inside-article {
    padding: 0;
    margin: 0;
}

.site-main > * {
    margin-bottom: 0;
}

.separate-containers .site-main {
    margin: 0;
}


#page.grid-container {
    display: block;
}

.site-content {
    display: block;
    width: 100%;
}

.content-area {
    display: block;
    width: 100%;
}

.entry-content {
    margin: 0;
}

/* ----------------------------------------
   Buttons
---------------------------------------- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    gap: 8px;
    transition: opacity 0.2s ease;
}

.btn:hover {
    opacity: 0.85;
    text-decoration: none;
    color: var(--white, #FFFFFF);
}



.btn--green {
    background: var(--green, #52CB7D);
    color: var(--white, #FFFFFF);
}

.btn--dark-purple {
    background: var(--dark-purple, #1E1344);
    color: var(--white, #FFFFFF);
}


@media (max-width: 1290px) {
    .grid-container {
        padding-left: 32px;
        padding-right: 32px;
    }
}

@media (max-width: 991px) {
    .grid-container {
        padding-left: 24px;
        padding-right: 24px;
    }
}

@media (max-width: 767px) {
    .grid-container {
        padding-left: 20px;
        padding-right: 20px;
    }
}
