:root {
    --gp-color-royal-gold: #F5BD02;
    --gp-color-royal-purple: #56215E;
    --gp-color-dark-royal-purple: #3B1243;
    --gp-color-average-green: #44A046;
    --gp-color-medium-aquamarine: #68C4A8;
    --gp-color-attractive-black: #222222;
    --gp-color-arabic-grey: #888888;
    --gp-color-pale-silver: #EAEAEA;
    --gp-color-beautiful-white: #F7F7F7;
    --gp-color-full-white: #FFFFFF;
    --gp-color-line: #EAEAEA;
    --gp-space-xs: clamp(0.75rem, 0.68rem + 0.3vw, 0.95rem);
    --gp-space-sm: clamp(1rem, 0.9rem + 0.5vw, 1.35rem);
    --gp-space-md: clamp(1.5rem, 1.2rem + 1vw, 2.25rem);
    --gp-space-lg: clamp(2rem, 1.5rem + 2vw, 3.5rem);
    --gp-space-xl: clamp(3rem, 2rem + 3vw, 5rem);
    --gp-type-font-body: "Segoe UI", Helvetica, Arial, sans-serif;
    --gp-type-font-display: Georgia, "Times New Roman", serif;
    --gp-type-font-size-sm: clamp(0.875rem, 0.84rem + 0.2vw, 0.95rem);
    --gp-type-font-size-md: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
    --gp-type-font-size-lg: clamp(1.25rem, 1.05rem + 0.8vw, 1.75rem);
    --gp-type-font-size-xl: clamp(2.4rem, 1.5rem + 3vw, 4.6rem);
    --gp-type-line-height: 1.6;
    --gp-type-heading-height: 1.08;
    --gp-layout-content-width: 760px;
    --gp-layout-wide-width: 1240px;
    --gp-layout-header-height: 80px;
    --gp-layout-radius-sm: 12px;
    --gp-layout-radius-md: 18px;
    --gp-layout-radius-pill: 999px;
    --gp-layout-shadow-soft: 0 18px 50px rgba(26, 33, 28, 0.12);
    --gp-breakpoint-desktop-wide: 1536px;
    --gp-breakpoint-notebook: 1280px;
    --gp-breakpoint-tablet-landscape: 1024px;
    --gp-breakpoint-tablet: 880px;
    --gp-breakpoint-mobile-landscape: 767px;
    --gp-breakpoint-mobile: 576px;
}

html {
    scroll-behavior: smooth;
    min-height: 100%;
}

body {
    margin: 0;
    min-height: 100vh;
    background:
        radial-gradient(circle at top, rgba(245, 189, 2, 0.12), transparent 28%),
        linear-gradient(180deg, var(--gp-color-full-white) 0%, var(--gp-color-beautiful-white) 100%);
    color: var(--gp-color-attractive-black);
    font-family: var(--gp-type-font-body);
    font-size: var(--gp-type-body, var(--gp-type-font-size-md));
    line-height: var(--gp-type-line-height);
}

html,
body,
#page.site {
    height: auto;
    overflow-y: auto;
}

[id] {
    scroll-margin-top: calc(var(--gp-layout-header-height, 80px) + 1rem);
}

#page.site {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.site-main {
    flex: 1 0 auto;
}

.gp-builder-canvas,
.gp-layout-canvas {
    background: var(--gp-color-beautiful-white);
}

body.gp-preview-canvas .gp-site-header,
body.gp-preview-canvas .gp-site-footer {
    display: none !important;
}

body.gp-preview-title-hidden .entry-header,
body.gp-preview-title-hidden .page-header {
    display: none !important;
}

.site-main > .gp-container,
.entry-content,
.wp-site-blocks {
    box-sizing: border-box;
}

a {
    color: var(--gp-color-royal-purple);
    text-decoration-thickness: 1px;
    text-underline-offset: 0.18em;
}

a:hover,
a:focus {
    color: var(--gp-color-dark-royal-purple);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    color: var(--gp-color-attractive-black);
    font-family: var(--gp-type-font-display);
    line-height: var(--gp-type-heading-height);
}

h1 { font-size: var(--gp-type-h1, var(--gp-type-font-size-xl)); }
h2 { font-size: var(--gp-type-h2, var(--gp-type-font-size-xl)); }
h3 { font-size: var(--gp-type-h3, var(--gp-type-font-size-lg)); }
h4 { font-size: var(--gp-type-h4, var(--gp-type-font-size-lg)); }
h5 { font-size: var(--gp-type-h5, var(--gp-type-font-size-md)); }
h6 { font-size: var(--gp-type-h6, var(--gp-type-font-size-sm)); }

p {
    margin: 0;
}

img {
    display: block;
    height: auto;
    max-width: 100%;
}

figure {
    margin: 0;
}

iframe {
    max-width: 100%;
}

.gp-container {
    width: min(calc(100% - 2rem), var(--gp-layout-wide-width));
    margin-inline: auto;
}

body.customize-preview-active .gp-container {
    outline: 1px dashed rgba(245, 189, 2, 0.35);
    outline-offset: 0;
}

.gp-content-width {
    width: min(100%, var(--gp-layout-content-width));
    margin-inline: auto;
}

.gp-wide-width {
    width: min(100%, var(--gp-layout-wide-width));
    margin-inline: auto;
}

.gp-stack > * + * {
    margin-top: var(--gp-space, var(--gp-space-md));
}

.gp-stack-sm > * + * {
    margin-top: var(--gp-space-half, var(--gp-space-sm));
}

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.alignwide {
    width: min(calc(100% - 2rem), var(--gp-layout-wide-width));
    margin-inline: auto;
}

.alignfull {
    width: 100%;
    max-width: 100%;
}
