/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Text Domain: blocksy
 */
:root {
    --dcl-min-screen-width: 320px;
    --dcl-max-screen-width: 1280px;
    --dcl-bg-body: hsla(0, 0%, 90%, 1);
    --dcl-bg-surface: hsla(0, 0%, 100%, 1);
    --dcl-text-body: hsla(0, 0%, 25%, 1);
    --dcl-text-title: #323434;
    --dcl-border-primary: hsla(0, 0%, 50%, 0.25);
    --dcl-shadow-primary: hsla(0, 0%, 0%, 0.15);
   --dcl-space-4xs: clamp(0.15rem, calc(0.14vw + 0.12rem), 0.23rem);
    --dcl-space-3xs: clamp(0.22rem, calc(0.21vw + 0.18rem), 0.35rem);
    --dcl-space-2xs: clamp(0.33rem, calc(0.31vw + 0.27rem), 0.52rem);
    --dcl-space-xs: clamp(0.5rem, calc(0.46vw + 0.41rem), 0.78rem);
    --dcl-space-s: clamp(0.75rem, calc(0.69vw + 0.61rem), 1.17rem);
    --dcl-space-m: clamp(1.13rem, calc(1.04vw + 0.92rem), 1.75rem);
    --dcl-space-l: clamp(1.69rem, calc(1.56vw + 1.38rem), 2.63rem);
    --dcl-space-xl: clamp(2.53rem, calc(2.34vw + 2.06rem), 3.94rem);
    --dcl-space-2xl: clamp(3.8rem, calc(3.52vw + 3.09rem), 5.91rem);
    --dcl-space-3xl: clamp(5.7rem, calc(5.27vw + 4.64rem), 8.86rem);
    --dcl-space-4xl: clamp(8.54rem, calc(7.91vw + 6.96rem), 13.29rem);
    --dcl-text-xs: clamp(0.69rem, calc(-0.02vw + 0.7rem), 0.68rem);
    --dcl-text-s: clamp(0.83rem, calc(0.03vw + 0.83rem), 0.85rem);
    --dcl-text-m: clamp(1rem, calc(0.1vw + 0.98rem), 1.06rem);
    --dcl-text-l: clamp(1.2rem, calc(0.21vw + 1.16rem), 1.33rem);
    --dcl-text-xl: clamp(1.44rem, calc(0.37vw + 1.37rem), 1.66rem);
    --dcl-text-2xl: clamp(1.73rem, calc(0.58vw + 1.61rem), 2.08rem);
    --dcl-text-3xl: clamp(2.07rem, calc(0.87vw + 1.9rem), 2.59rem);
    --dcl-text-4xl: clamp(2.49rem, calc(1.26vw + 2.24rem), 3.24rem);
    --dcl-text-5xl: clamp(2.99rem, calc(1.78vw + 2.63rem), 4.05rem);
    --dcl-hero-title-size: var(--dcl-text-4xl);
    --dcl-post-title-size: var(--dcl-text-2xl);
    --dcl-nav-link-size: var(--dcl-text-s);
    --dcl-header-space: var(--dcl-space-s);
    --dcl-btn-space: var(--dcl-space-xs) var(--dcl-space-s);
    --dcl-card-space: var(--dcl-space-s);
    --dcl-footer-space: var(--dcl-space-s) var(--dcl-space-m);
    --dcl-columns-1: repeat(1, minmax(0, 1fr));
    --dcl-columns-2: repeat(2, minmax(0, 1fr));
    --dcl-columns-3: repeat(3, minmax(0, 1fr));
    --dcl-columns-4: repeat(4, minmax(0, 1fr));
    --dcl-columns-5: repeat(5, minmax(0, 1fr));
    --dcl-columns-6: repeat(6, minmax(0, 1fr));
    --dcl-columns-7: repeat(7, minmax(0, 1fr));
    --dcl-columns-8: repeat(8, minmax(0, 1fr));
    --dcl-radius-xs: clamp(0.25rem, calc(0vw + 0.25rem), 0.25rem);
    --dcl-radius-s: clamp(0.38rem, calc(-0.21vw + 0.54rem), 0.5rem);
    --dcl-radius-m: clamp(0.63rem, calc(-0.21vw + 0.79rem), 0.75rem);
    --dcl-radius-l: clamp(1rem, calc(-0.42vw + 1.33rem), 1.25rem);
    --dcl-radius-xl: clamp(1.63rem, calc(-0.63vw + 2.13rem), 2rem);
    --dcl-radius-full: 999rem;
    --dcl-shadow-xs: 0 1px 2px var(--dcl-shadow-primary);
    --dcl-shadow-s: 0 1.5px 3px var(--dcl-shadow-primary);
    --dcl-shadow-m: 0 2px 6px var(--dcl-shadow-primary);
    --dcl-shadow-l: 0 3px 12px var(--dcl-shadow-primary);
    --dcl-shadow-xl: 0 6px 48px var(--dcl-shadow-primary);
    --global-kb-font-size-sm: clamp(0.8rem, calc(0vw + 0.8rem), 0.8rem);
    --global-kb-font-size-md: clamp(1rem, calc(0vw + 1rem), 1rem);
    --global-kb-font-size-lg: clamp(1.25rem, calc(0vw + 1.25rem), 1.25rem);
    --global-kb-font-size-xl: clamp(1.56rem, calc(0vw + 1.56rem), 1.56rem);
    --global-kb-font-size-xxl: clamp(1.95rem, calc(0vw + 1.95rem), 1.95rem);
    --global-kb-font-size-xxxl: clamp(2.44rem, calc(0vw + 2.44rem), 2.44rem);
    --global-kb-spacing-sm: clamp(0.75rem, calc(1.7vw + 0.41rem), 1.77rem);
    --global-kb-spacing-lg: clamp(1.33rem, calc(3.67vw + 0.6rem), 3.54rem);
    --global-kb-spacing-md: clamp(1rem, calc(2.5vw + 0.5rem), 2.5rem);
    --global-kb-spacing-xl: clamp(1.78rem, calc(5.37vw + 0.7rem), 5rem);
    --global-kb-spacing-xxl: clamp(2.37rem, calc(7.83vw + 0.8rem), 7.07rem);
    --global-kb-spacing-xxxl: clamp(3.16rem, calc(11.39vw + 0.88rem), 9.99rem);
}

.dcl-container__inner {
    width: var(--theme-container-width-base);
}

.dcl-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--dcl-space-3xs);
    padding: var(--dcl-space-xs) var(--dcl-space-s);
    background: var(--dcl-primary);
    color: #fff;
    font-size: var(--dcl-text-m);
    font-weight: 600;
    border-radius: var(--dcl-radius-m);
    border: 1px solid var(--dcl-primary-d-1);
    box-shadow: var(--dcl-shadow-m);
    transition: all 0.25s ease-in-out;
    outline: 0;
    cursor: pointer;
}

.dcl-button__primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--theme-palette-color-8);
    /* Add a transparent border to match the size added by the outline button's border */
    border: var(--theme-button-border);
    border-color: transparent; /* Explicitly set border-color to transparent */
    background-color: var(--theme-button-background-initial-color);
    min-height: var(--theme-button-min-height);
    padding: var(--theme-button-padding);
    border-radius: var(--theme-button-border-radius, 3px);
    transition: all 0.12s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    --has-link-decoration: var(--false);
}

/* All other provided CSS remains the same */
.dcl-button__primary:hover {
    color: var(--theme-button-text-hover-color);
    border-color: var(--theme-button-border-hover-color);
    background-color: var(--theme-button-background-hover-color);
    transform: var(--theme-button-transform, translate3d(0, -3px, 0));
    /* border-width: 2px; If initial border-width is 1px, then uncomment this to make it 2px on hover */
    /* border-radius: var(--theme-button-border-radius, 3px); This is usually already set, no need to re-declare unless it changes on hover */
}

/* The .dcl-button__primary-outline and its hover states do not need changes */
.dcl-button__primary-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    --theme-button-text-initial-color: var(
        --theme-button-background-initial-color
    );
    border: var(--theme-button-border);
    border-style: solid;
    color: var(--theme-palette-color-8);
    border-color: var(--theme-button-background-initial-color);
    background-color: rgba(0, 0, 0, 0);
    min-height: var(--theme-button-min-height);
    padding: var(--theme-button-padding);
    border-radius: var(--theme-button-border-radius, 3px);
    transition: all 0.12s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    --has-link-decoration: var(--false);
}
.dcl-button__primary-outline-dark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    --theme-button-text-initial-color: var(--theme-palette-color-3);
    border-style: solid;
    color: var(--theme-palette-color-3);
    border-color: var(--theme-palette-color-3);
    background-color: rgba(0, 0, 0, 0);
    min-height: var(--theme-button-min-height);
    padding: var(--theme-button-padding);
    border-radius: var(--theme-button-border-radius, 3px);
    transition: all 0.12s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    --has-link-decoration: var(--false);
}

.dcl-button__primary-outline:hover {
    color: var(--theme-button-text-hover-color);
    border-color: var(--theme-button-background-hover-color);
    background-color: var(--theme-button-background-hover-color);
}

.dcl-button__primary-outline-light {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-style: solid;
    color: var(--theme-palette-color-1);
    border-color: var(--theme-palette-color-5);
    background-color: rgba(0, 0, 0, 0);
    min-height: var(--theme-button-min-height);
    padding: var(--theme-button-padding);
    border-radius: var(--theme-button-border-radius, 3px);
    transition: all 0.12s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    --has-link-decoration: var(--false);
}


.dcl-button__primary-outline:hover {
    color: var(--theme-button-text-hover-color);
    border-color: var(--theme-button-background-hover-color);
    background-color: var(--theme-button-background-hover-color);
}

.dcl-button__primary-outline-dark:hover {
    color: var(--theme-button-text-hover-color);
    border-color: var(--theme-button-background-hover-color);
    background-color: var(--theme-button-background-hover-color);
}

.dcl-btn__outline-light {
	display: inline-flex;
    align-items: center;
    justify-content: center;
    border-style: solid;
    color: var(--theme-palette-color-1);
    border-color: var(--theme-palette-color-5);
    background-color: rgba(0, 0, 0, 0);
    min-height: var(--theme-button-min-height);
    padding: var(--theme-button-padding);
    border-radius: var(--theme-button-border-radius, 3px);
    transition: all 0.12s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    --has-link-decoration: var(--false);
}

.dcl-btn__outline-light:hover{
	color: var(--theme-button-text-hover-color);
    border-color: var(--theme-button-border-hover-color);
    background-color: var(--theme-button-background-hover-color);
    transform: var(--theme-button-transform, translate3d(0, -3px, 0));
}


.dcl-btn.no-bg {
    color: var(--dcl-dark-80);
    background: transparent;
    box-shadow: none;
    border-color: transparent;
}
.dcl-btn.no-bg:hover {
    color: var(--dcl-dark);
}

.dcl-link {
    color: var(--dcl-primary);
    font-size: var(--dcl-text-m);
    font-weight: 600;
    letter-spacing: 0.05rem;
    box-shadow: 0 2px 0 var(--dcl-primary-20);
    -webkit-text-decoration: none;
    text-decoration: none;
    transition: all 0.15s ease-in-out;
}
.dcl-link:hover {
    box-shadow: 0 2px 0 var(--dcl-primary-40);
}
.dcl-link:focus {
    background: var(--dcl-primary-10);
}
.dcl-link.secondary {
    color: var(--dcl-secondary);
    border-color: var(--dcl-secondary-20);
}
.dcl-link.tertiary {
    color: var(--dcl-tertiary);
    border-color: var(--dcl-tertiary-20);
}

.dcl-card {
    display: grid;
    gap: var(--dcl-space-xs);
    padding: var(--dcl-space-m);
    font-size: var(--dcl-text-m);
    color: var(--dcl-text-body);
    background: var(--dcl-bg-surface);
    line-height: 1.3;
    border-radius: var(--dcl-radius-m);
    box-shadow: var(--dcl-shadow-m);
}
	
.dcl-card.secondary {
    background: var(--dcl-secondary);
    color: #fff;
}
	
.dcl-card.primary {
    background: var(--dcl-primary);
    color: #fff;
}
	
html.cf-theme-dark {
    color-scheme: dark;
}
	
H1 {
    font-size: var(--dcl-text-4xl);
    line-height: 1.1;
}
H2 {
    font-size: var(--dcl-text-3xl);
    line-height: 1.2;
}
H3 {
    font-size: var(--dcl-text-2xl);
    line-height: 1.3;
}
H4 {
    font-size: var(--dcl-text-xl);
    line-height: 1.3;
}
H5 {
    font-size: var(--dcl-text-l);
    line-height: 1.3;
}
H6 {
    font-size: var(--dcl-text-m);
    line-height: 1.4;
}

.dcl-display-none {
    display: none;
}
@media (prefers-reduced-motion: reduce) {
    *,
    ::before,
    ::after {
        animation-delay: -1ms !important;
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        background-attachment: initial !important;
        scroll-behavior: auto !important;
        transition-duration: 0s !important;
        transition-delay: 0s !important;
    }
}