:root {
--spectra-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
--spectra-shadow-md: 0 2px 8px rgba(0, 0, 0, 0.05);
--spectra-shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.06);
--spectra-radius-interactive: 8px;
--spectra-radius-badge: 6px;
--spectra-radius-input: 8px;
--spectra-radius-card: 12px;
--spectra-radius-image: 8px;
--spectra-btn-bg: var(--wp--preset--color--primary);
--spectra-btn-text: var(--wp--preset--color--background);
--spectra-btn-border-color: transparent;
--spectra-btn-border-width: 0;
--spectra-btn-border-style: none;
--spectra-btn-shadow: none;
--spectra-btn-secondary-bg: transparent;
--spectra-btn-secondary-text: var(--wp--preset--color--primary);
--spectra-btn-secondary-border-color: var(--wp--preset--color--primary);
--spectra-btn-secondary-border-width: 1.5px;
--spectra-btn-secondary-border-style: solid;
--spectra-card-bg: transparent;
--spectra-card-border-color: transparent;
--spectra-card-border-width: 0;
--spectra-card-border-style: none;
--spectra-card-shadow: none;
--spectra-space-xs: 0.5rem;
--spectra-space-sm: 1rem;
--spectra-space-md: 1.5rem;
--spectra-space-lg: 2.5rem;
--spectra-space-xl: 4rem;
--spectra-space-2xl: 6rem;
--spectra-text-xs: 0.75rem;
--spectra-text-sm: 0.875rem;
--spectra-text-md: 1rem;
--spectra-text-lg: 1.125rem;
--spectra-text-xl: 1.25rem;
--spectra-text-2xl: 1.5rem;
--spectra-text-3xl: 1.875rem;
--spectra-text-4xl: 2.25rem;
--spectra-text-5xl: 3rem;
--spectra-text-6xl: 3.75rem;
--spectra-text-7xl: 4.5rem;
--spectra-text-8xl: 6rem;
--spectra-text-9xl: 8rem;
--spectra-heading-1: 2.25rem;
--spectra-heading-2: 1.875rem;
--spectra-heading-3: 1.5rem;
--spectra-heading-4: 1.25rem;
--spectra-heading-5: 1.125rem;
--spectra-heading-6: 1rem;
--spectra-section-padding-y: 3.5rem;
--spectra-section-gap: 2rem;
--spectra-content-max-width: 1200px;
--spectra-card-padding: 2rem;
--spectra-card-gap: 1.25rem;
--spectra-input-bg: var(--wp--preset--color--background);
--spectra-input-text: var(--spectra-neutral-7);
--spectra-input-border-color: var(--wp--preset--color--outline);
--spectra-input-border-width: 1px;
--spectra-input-border-style: solid;
--spectra-input-placeholder: color-mix(in srgb, var(--spectra-neutral-7) 40%, transparent);
--spectra-input-focus-border: var(--wp--preset--color--primary);
--spectra-input-focus-shadow: 0 0 0 3px color-mix(in srgb, var(--wp--preset--color--primary) 15%, transparent);
--spectra-badge-bg: color-mix(in srgb, var(--wp--preset--color--primary) 10%, transparent);
--spectra-badge-text: var(--wp--preset--color--primary);
--spectra-badge-border-color: transparent;
--spectra-badge-border-width: 0;
--spectra-badge-font-size: 0.75rem;
--spectra-badge-font-weight: 600;
--spectra-badge-letter-spacing: 0.05em;
--spectra-badge-text-transform: uppercase;
--spectra-badge-padding-x: 0.75em;
--spectra-badge-padding-y: 0.25em;
--spectra-link-color: var(--wp--preset--color--primary);
--spectra-link-decoration: none;
--spectra-link-hover-color: var(--wp--preset--color--secondary);
--spectra-link-hover-decoration: underline;
--spectra-image-overlay: none;
--spectra-image-filter: none;
--spectra-image-border: none;
--spectra-btn-hover-bg: color-mix(in srgb, var(--spectra-btn-bg) 90%, #000);
--spectra-btn-hover-text: var(--spectra-btn-text);
--spectra-btn-hover-shadow: var(--spectra-shadow-sm);
--spectra-btn-hover-translate-y: -1px;
--spectra-card-hover-shadow: var(--spectra-shadow-md);
--spectra-card-hover-translate-y: -2px;
--spectra-dark-card-bg: color-mix(in srgb, var(--spectra-white) 8%, transparent);
--spectra-dark-card-border-color: color-mix(in srgb, var(--spectra-white) 10%, transparent);
--spectra-dark-card-shadow: none;
--spectra-dark-btn-bg: var(--spectra-white);
--spectra-dark-btn-text: var(--spectra-neutral-7);
--spectra-dark-btn-secondary-bg: transparent;
--spectra-dark-btn-secondary-text: var(--spectra-white);
--spectra-dark-btn-secondary-border-color: color-mix(in srgb, var(--spectra-white) 30%, transparent);
--spectra-body-line-height: 1.65;
--spectra-heading-line-height: 1.2;
--spectra-body-letter-spacing: 0;
--spectra-heading-letter-spacing: -0.02em;
--spectra-gradient-primary: linear-gradient(135deg, var(--wp--preset--color--primary), var(--wp--preset--color--secondary));
--spectra-gradient-accent: linear-gradient(135deg, var(--wp--preset--color--primary), color-mix(in srgb, var(--wp--preset--color--primary) 60%, var(--wp--preset--color--secondary, #8b5cf6)));
--spectra-gradient-surface: linear-gradient(180deg, var(--wp--preset--color--background), var(--wp--preset--color--surface));
--spectra-overlay-dark: rgba(0, 0, 0, 0.5);
--spectra-overlay-light: rgba(255, 255, 255, 0.7);
--spectra-overlay-brand: color-mix(in srgb, var(--wp--preset--color--primary) 80%, transparent);
--spectra-overlay-gradient: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.6) 100%);
--spectra-divider-color: var(--wp--preset--color--outline);
--spectra-divider-width: 1px;
--spectra-divider-style: solid;
--spectra-nav-bg: var(--wp--preset--color--background);
--spectra-nav-text: var(--spectra-neutral-7);
--spectra-nav-link-hover: var(--wp--preset--color--primary);
--spectra-nav-border-bottom: 1px solid color-mix(in srgb, var(--spectra-neutral-7) 5%, transparent);
--spectra-icon-size: 24px;
--spectra-icon-color: currentcolor;
--spectra-icon-container-bg: color-mix(in srgb, var(--wp--preset--color--primary) 10%, transparent);
--spectra-icon-container-radius: var(--spectra-radius-badge);
--spectra-icon-container-size: 48px;
--spectra-transition-fast: 100ms;
--spectra-transition-normal: 200ms;
--spectra-transition-slow: 350ms;
--spectra-ease-default: cubic-bezier(0.4, 0, 0.2, 1);
--spectra-ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
--spectra-ease-spring: cubic-bezier(0.22, 1, 0.36, 1);
--spectra-entrance-duration: 400ms;
--spectra-entrance-distance: 12px;
--spectra-entrance-stagger: 60ms;
--spectra-btn-press-scale: 0.97;
--spectra-focus-scale: 1.02;
--spectra-focus-ring-color: var(--wp--preset--color--primary);
--spectra-focus-ring-width: 2px;
--spectra-focus-ring-offset: 2px;
--spectra-focus-ring-style: solid;
} :where(.sg-card) {
border-width: var(--spectra-card-border-width);
border-style: var(--spectra-card-border-style);
border-color: var(--spectra-card-border-color);
border-radius: var(--spectra-radius-card);
box-shadow: var(--spectra-card-shadow);
overflow: hidden;
} .sg-card.sg-card {
transition:
box-shadow var(--spectra-transition-normal, 250ms) ease,
transform var(--spectra-transition-normal, 250ms) ease,
translate var(--spectra-transition-normal, 250ms) ease;
} .sg-card.spectra-background-color::before {
background: var(--spectra-card-bg) !important;
border-radius: inherit;
} .sg-card > .spectra-container-inner_wrap {
border-radius: inherit;
}  :where(.sg-card):hover {
box-shadow: var(--spectra-card-hover-shadow);
translate: 0 var(--spectra-card-hover-translate-y);
}   :where(.wp-block-spectra-buttons:not(.is-style-outline) .wp-element-button),
:where(
.wp-block-spectra-buttons:not(.is-style-outline) .wp-block-button__link
) {
background-color: var(--spectra-btn-bg);
color: var(--spectra-btn-text);
border-width: var(--spectra-btn-border-width);
border-style: var(--spectra-btn-border-style);
border-color: var(--spectra-btn-border-color);
border-radius: var(--spectra-radius-interactive);
box-shadow: var(--spectra-btn-shadow);
transition:
background-color var(--spectra-transition-normal, 250ms) ease,
box-shadow var(--spectra-transition-normal, 250ms) ease,
transform var(--spectra-transition-normal, 250ms) ease;
}
:where(
.wp-block-spectra-buttons:not(.is-style-outline) .wp-element-button:hover
),
:where(
.wp-block-spectra-buttons:not(.is-style-outline) .wp-block-button__link:hover
) {
background-color: var(--spectra-btn-hover-bg);
color: var(--spectra-btn-hover-text);
box-shadow: var(--spectra-btn-hover-shadow);
transform: translateY(var(--spectra-btn-hover-translate-y));
}
:where(.wp-block-spectra-buttons.is-style-outline .wp-element-button),
:where(.wp-block-spectra-buttons.is-style-outline .wp-block-button__link) {
background-color: var(--spectra-btn-secondary-bg);
color: var(--spectra-btn-secondary-text);
border-width: var(--spectra-btn-secondary-border-width);
border-style: var(--spectra-btn-secondary-border-style);
border-color: var(--spectra-btn-secondary-border-color);
border-radius: var(--spectra-radius-interactive);
transition:
background-color var(--spectra-transition-normal, 250ms) ease,
box-shadow var(--spectra-transition-normal, 250ms) ease,
transform var(--spectra-transition-normal, 250ms) ease;
}
.wp-block-spectra-buttons.is-style-outline .wp-element-button:hover,
.wp-block-spectra-buttons.is-style-outline .wp-block-button__link:hover {
transform: translateY(var(--spectra-btn-hover-translate-y));
} .wp-block-spectra-buttons :where(.wp-element-button, .wp-block-button__link) {
border-radius: var(--spectra-radius-interactive);
} .spectra-button__link {
transition:
background-color var(--spectra-transition-normal, 250ms) ease,
box-shadow var(--spectra-transition-normal, 250ms) ease,
transform var(--spectra-transition-normal, 250ms) ease;
}
.spectra-button__link:hover {
transform: translateY(var(--spectra-btn-hover-translate-y));
} .sg-btn-primary .wp-block-button__link,
.sg-btn-primary.wp-block-button__link {
background-color: var(--spectra-btn-bg);
color: var(--spectra-btn-text);
border-width: var(--spectra-btn-border-width);
border-style: var(--spectra-btn-border-style);
border-color: var(--spectra-btn-border-color);
border-radius: var(--spectra-radius-interactive);
box-shadow: var(--spectra-btn-shadow);
}
.sg-btn-secondary .wp-block-button__link,
.sg-btn-secondary.wp-block-button__link {
background-color: var(--spectra-btn-secondary-bg);
color: var(--spectra-btn-secondary-text);
border-width: var(--spectra-btn-secondary-border-width);
border-style: var(--spectra-btn-secondary-border-style);
border-color: var(--spectra-btn-secondary-border-color);
border-radius: var(--spectra-radius-interactive);
} .sg-section.sg-section {
padding-top: var(--spectra-section-padding-y);
padding-bottom: var(--spectra-section-padding-y);
}  .sg-text-gradient {
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
} .sg-badge.sg-badge {
display: inline-block;
width: fit-content;
border-width: var(--spectra-badge-border-width);
border-style: solid;
border-radius: var(--spectra-radius-badge);
font-size: var(--spectra-badge-font-size);
font-weight: var(--spectra-badge-font-weight);
letter-spacing: var(--spectra-badge-letter-spacing);
text-transform: var(--spectra-badge-text-transform);
padding: var(--spectra-badge-padding-y) var(--spectra-badge-padding-x);
line-height: 1.4;
} .sg-badge.sg-badge.flex,
.sg-badge.sg-badge.inline-flex {
display: inline-flex;
} :where(.sg-badge) {
background: var(--spectra-badge-bg);
color: var(--spectra-badge-text);
border-color: var(--spectra-badge-border-color);
} .sg-button-fit.wp-block-button,
.sg-button-fit > .wp-block-button,
.sg-button-fit.wp-block-spectra-buttons,
.sg-button-fit > .wp-block-spectra-buttons {
align-self: start;
width: fit-content;
}
.sg-button-fit .wp-block-button__link,
.sg-button-fit .wp-element-button,
.sg-button-fit .spectra-button__link,
.sg-button-fit .wp-block-spectra-button {
width: fit-content;
} .entry-content .wp-block-image.object-cover > img,
.entry-content .wp-block-image.object-contain > img,
.spectra-is-root-container .wp-block-image.object-cover > img,
.spectra-is-root-container .wp-block-image.object-contain > img {
width: 100%;
height: 100%;
display: block;
}
.entry-content .wp-block-image.object-cover > img,
.spectra-is-root-container .wp-block-image.object-cover > img {
object-fit: cover;
}
.entry-content .wp-block-image.object-contain > img,
.spectra-is-root-container .wp-block-image.object-contain > img {
object-fit: contain;
} :where(.sg-section-dark .sg-card) {
border-color: var(--spectra-dark-card-border-color);
box-shadow: var(--spectra-dark-card-shadow);
}
.sg-section-dark .sg-card.spectra-background-color::before {
background: var(--spectra-dark-card-bg) !important;
} :where(
.sg-section-dark
.wp-block-spectra-buttons:not(.is-style-outline)
.wp-element-button
),
:where(
.sg-section-dark
.wp-block-spectra-buttons:not(.is-style-outline)
.wp-block-button__link
) {
background-color: var(--spectra-dark-btn-bg);
color: var(--spectra-dark-btn-text);
} :where(
.sg-section-dark .wp-block-spectra-buttons.is-style-outline .wp-element-button
),
:where(
.sg-section-dark
.wp-block-spectra-buttons.is-style-outline
.wp-block-button__link
) {
background-color: var(--spectra-dark-btn-secondary-bg);
color: var(--spectra-dark-btn-secondary-text);
border-color: var(--spectra-dark-btn-secondary-border-color);
} .sg-section-dark a:not(.wp-element-button):not(.wp-block-button__link) {
color: var(--spectra-white);
} .sg-section-dark :where(h1, h2, h3, h4, h5, h6, p, li) {
color: var(--spectra-white);
} :where(.sg-section-dark .sg-badge) {
background: color-mix(in srgb, var(--spectra-white) 15%, transparent);
color: var(--spectra-white);
border-color: transparent;
}  .sg-overlay {
position: relative;
}
.sg-overlay::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
z-index: 0;
}
.sg-overlay-dark::after {
background: var(--spectra-overlay-dark);
}
.sg-overlay-light::after {
background: var(--spectra-overlay-light);
}
.sg-overlay-brand::after {
background: var(--spectra-overlay-brand);
}
.sg-overlay-gradient::after {
background: var(--spectra-overlay-gradient);
}
.sg-overlay > * {
position: relative;
z-index: 1;
} .wp-block-navigation {
--spectra-nav-link-color: var(--spectra-nav-text);
}
:where(.wp-block-navigation a) {
color: var(--spectra-nav-text);
transition: color var(--spectra-transition-normal, 250ms) ease;
}
:where(.wp-block-navigation a):hover {
color: var(--spectra-nav-link-hover);
} :where(.wp-block-spectra-list .spectra-list-icon svg) {
width: var(--spectra-icon-size);
height: var(--spectra-icon-size);
} :where(.sg-icon-contained) {
display: flex;
align-items: center;
justify-content: center;
aspect-ratio: 1 / 1;
border-radius: var(--spectra-icon-container-radius);
--spectra-icon-default-size: 50%;
} :where(.sg-icon-contained .spectra-list-icon) {
background: var(--spectra-icon-container-bg);
border-radius: var(--spectra-icon-container-radius);
width: var(--spectra-icon-container-size);
height: var(--spectra-icon-container-size);
display: flex;
align-items: center;
justify-content: center;
} .sg-accordion
.wp-block-spectra-accordion-child-header.wp-block-spectra-accordion-child-header {
justify-content: space-between;
}
.sg-accordion
.wp-block-spectra-accordion-child-header-content.wp-block-spectra-accordion-child-header-content {
flex: 1 1 auto;
} .sg-accordion
.wp-block-spectra-accordion-child-header-icon.wp-block-spectra-accordion-child-header-icon {
padding-right: 1.5rem;
} .sg-accordion
.wp-block-spectra-accordion-child-details.wp-block-spectra-accordion-child-details {
padding-top: 0;
} @media (prefers-reduced-motion: reduce) {
.sg-card,
.wp-element-button,
.wp-block-button__link,
.spectra-button__link,
.entry-content a,
.entry-content input,
.entry-content textarea,
.entry-content select,
.wp-block-navigation a {
transition-duration: 0ms !important;
animation-duration: 0ms !important;
}
.sg-card:hover,
.wp-element-button:hover,
.wp-block-button__link:hover,
.spectra-button__link:hover,
.wp-element-button:active,
.wp-block-button__link:active {
transform: none !important;
}
}