.ds-hero {
    position: relative;
    width: 100vw;
    max-width: 100vw;
    min-height: var(--ds-hero-h, 430px);
    margin-left: calc(50% - 50vw);
    overflow: hidden;
    background-color: var(--ds-hero-bg-color, transparent);
    background-image: var(--ds-hero-bg, none);
    background-size: cover;
    background-position: var(--ds-hero-bg-position, center center);
    background-repeat: no-repeat;
    isolation: isolate;
}

.ds-hero__overlay {
    position: absolute;
    inset: 0;
    z-index: 0;
    background: var(--ds-overlay, #08182f);
    opacity: var(--ds-overlay-opacity, .35);
}

.ds-hero__canvas {
    position: relative;
    z-index: 1;
    width: min(1400px, calc(100% - 64px));
    height: var(--ds-hero-h, 430px);
    margin: 0 auto;
}

.ds-hero__layer {
    position: absolute;
    left: var(--ds-left);
    top: var(--ds-top);
    transform:
        translate(var(--ds-tx), var(--ds-ty))
        translate(var(--ds-x), var(--ds-y));
    z-index: 2;
    max-width: calc(100% - 20px);
    box-sizing: border-box;
}

.ds-hero__logo img {
    display: block;
    width: var(--ds-logo-width, 190px);
    max-width: min(90vw, 100%);
    height: auto;
}

.ds-hero__heading h1 {
    margin: 0;
    color: var(--ds-heading-color, #fff);
    font-size: var(--ds-heading-size, 44px);
    line-height: 1.05;
    text-shadow: 0 2px 12px rgba(0,0,0,.35);
}

.ds-hero__text {
    width: min(var(--ds-text-width, 560px), calc(100vw - 64px));
}

.ds-hero__text p {
    margin: 0;
    color: var(--ds-text-color, #fff);
    font-size: var(--ds-text-size, 20px);
    line-height: 1.5;
    text-shadow: 0 1px 8px rgba(0,0,0,.3);
}

.ds-hero__buttons {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.ds-hero__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 20px;
    border: 2px solid transparent;
    border-radius: 6px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none !important;
    transition: transform .16s ease, opacity .16s ease;
}

.ds-hero__button:hover {
    transform: translateY(-1px);
    opacity: .94;
}

.ds-hero__button--primary {
    color: #fff !important;
    background: #0b67d1;
}

.ds-hero__button--secondary {
    color: #fff !important;
    border-color: rgba(255,255,255,.8);
    background: rgba(0,0,0,.2);
}

@media (max-width: 1024px) {
    .ds-hero {
        min-height: var(--ds-hero-h-tablet, 360px);
    }

    .ds-hero__canvas {
        width: min(100% - 40px, 1200px);
        height: var(--ds-hero-h-tablet, 360px);
    }
}

@media (max-width: 767px) {
    .ds-hero {
        min-height: var(--ds-hero-h-mobile, 300px);
    }

    .ds-hero__canvas {
        width: calc(100% - 30px);
        height: var(--ds-hero-h-mobile, 300px);
    }

    .ds-hero__heading h1 {
        font-size: clamp(28px, 9vw, var(--ds-heading-size, 44px));
        text-align: center;
    }

    .ds-hero__text p {
        font-size: clamp(15px, 4.5vw, var(--ds-text-size, 20px));
    }

    .ds-hero__buttons {
        justify-content: center;
    }

    .ds-hero__layer[class*="ds-mobile-"] {
        --ds-x: 0px !important;
        --ds-y: 0px !important;
    }

    .ds-mobile-top-left { --ds-left:0%; --ds-top:0%; --ds-tx:0%; --ds-ty:0%; }
    .ds-mobile-top-center { --ds-left:50%; --ds-top:0%; --ds-tx:-50%; --ds-ty:0%; }
    .ds-mobile-top-right { --ds-left:100%; --ds-top:0%; --ds-tx:-100%; --ds-ty:0%; }
    .ds-mobile-middle-left { --ds-left:0%; --ds-top:50%; --ds-tx:0%; --ds-ty:-50%; }
    .ds-mobile-middle-center { --ds-left:50%; --ds-top:50%; --ds-tx:-50%; --ds-ty:-50%; }
    .ds-mobile-middle-right { --ds-left:100%; --ds-top:50%; --ds-tx:-100%; --ds-ty:-50%; }
    .ds-mobile-bottom-left { --ds-left:0%; --ds-top:100%; --ds-tx:0%; --ds-ty:-100%; }
    .ds-mobile-bottom-center { --ds-left:50%; --ds-top:100%; --ds-tx:-50%; --ds-ty:-100%; }
    .ds-mobile-bottom-right { --ds-left:100%; --ds-top:100%; --ds-tx:-100%; --ds-ty:-100%; }

    .ds-mobile-top-center,
    .ds-mobile-middle-center,
    .ds-mobile-bottom-center {
        text-align: center;
    }
}


/* DS Universal 1.10.4+ native overlay integration */
.ds-page-header--ds-hero {
    position: relative;
    overflow: hidden;
}

.ds-page-header--ds-hero .ds-page-header__inner {
    position: relative;
    width: min(1400px, calc(100% - 64px));
    max-width: none;
    min-height: inherit;
    height: 100%;
    padding-top: 0;
    padding-bottom: 0;
}

.ds-page-header--ds-hero .ds-hero__canvas--integrated {
    position: relative;
    width: 100%;
    height: var(--ds-hero-h, 430px);
    min-height: inherit;
    margin: 0;
}

@media (max-width: 1024px) {
    .ds-page-header--ds-hero .ds-page-header__inner {
        width: min(100% - 40px, 1200px);
    }

    .ds-page-header--ds-hero .ds-hero__canvas--integrated {
        height: var(--ds-hero-h-tablet, 360px);
    }
}

@media (max-width: 767px) {
    .ds-page-header--ds-hero .ds-page-header__inner {
        width: calc(100% - 30px);
    }

    .ds-page-header--ds-hero .ds-hero__canvas--integrated {
        height: var(--ds-hero-h-mobile, 300px);
    }
}


/* DS Hero 0.5.3 unified responsive layer engine.
 * Same v0.5 anchor + X/Y offset model on every device.
 */
.ds-unified-layer{
    left:var(--d-left);
    top:var(--d-top);
    transform:
        translate(var(--d-tx),var(--d-ty))
        translate(var(--d-x),var(--d-y));
    width:var(--d-w);
    min-height:var(--d-h);
    max-width:none;
}
.ds-unified-layer--text{height:auto}
.ds-unified-text{
    width:100%;
    color:var(--ds-text-color,#fff);
    font-size:var(--d-font,24px);
    font-weight:var(--ds-text-weight,400);
    text-align:var(--ds-text-align,left);
    line-height:1.15;
    white-space:normal;
    overflow-wrap:normal;
    word-break:normal;
    text-shadow:0 1px 8px rgba(0,0,0,.3);
}
.ds-unified-image{
    display:block;
    width:100%;
    height:auto;
    max-width:none;
}
.ds-unified-shortcode{
    width:100%;
    overflow:visible;
}

@media(max-width:1024px) and (min-width:768px){
    .ds-unified-layer{
        left:var(--t-left);
        top:var(--t-top);
        transform:
            translate(var(--t-tx),var(--t-ty))
            translate(var(--t-x),var(--t-y));
        width:var(--t-w);
        min-height:var(--t-h);
    }
    .ds-unified-text{font-size:var(--t-font,24px)}
}

@media(max-width:767px){
    .ds-unified-layer{
        left:var(--m-left)!important;
        top:var(--m-top)!important;
        transform:
            translate(var(--m-tx),var(--m-ty))
            translate(var(--m-x),var(--m-y))!important;
        width:var(--m-w)!important;
        min-height:var(--m-h)!important;
        max-width:none!important;
        text-align:initial;
    }
    .ds-unified-text{
        font-size:var(--m-font,20px)!important;
        text-align:var(--ds-text-align,left)!important;
    }
}

/* DS Hero 0.6.0 seven-breakpoint responsive overrides */
@media (min-width:1601px){.ds-hero,.ds-hero__canvas,.ds-page-header--ds-hero .ds-hero__canvas--integrated{height:var(--ds-hero-h-lg,450px);min-height:var(--ds-hero-h-lg,450px)}}
@media (max-width:1600px) and (min-width:1361px){.ds-hero,.ds-hero__canvas,.ds-page-header--ds-hero .ds-hero__canvas--integrated{height:var(--ds-hero-h,450px);min-height:var(--ds-hero-h,450px)}}
@media (max-width:1360px) and (min-width:1101px){.ds-hero,.ds-hero__canvas,.ds-page-header--ds-hero .ds-hero__canvas--integrated{height:var(--ds-hero-h-laptop,450px);min-height:var(--ds-hero-h-laptop,450px)}}
@media (max-width:1100px) and (min-width:821px){.ds-hero,.ds-hero__canvas,.ds-page-header--ds-hero .ds-hero__canvas--integrated{height:var(--ds-hero-h-tl,500px);min-height:var(--ds-hero-h-tl,500px)}}
@media (max-width:820px) and (min-width:601px){.ds-hero,.ds-hero__canvas,.ds-page-header--ds-hero .ds-hero__canvas--integrated{height:var(--ds-hero-h-tp,500px);min-height:var(--ds-hero-h-tp,500px)}}
@media (max-width:600px) and (min-width:401px){.ds-hero,.ds-hero__canvas,.ds-page-header--ds-hero .ds-hero__canvas--integrated{height:var(--ds-hero-h-mobile,400px);min-height:var(--ds-hero-h-mobile,400px)}}
@media (max-width:400px){.ds-hero,.ds-hero__canvas,.ds-page-header--ds-hero .ds-hero__canvas--integrated{height:var(--ds-hero-h-sm,400px);min-height:var(--ds-hero-h-sm,400px)}}

@media (min-width:1601px){.ds-unified-layer{left:var(--lg-left);top:var(--lg-top);transform:translate(var(--lg-tx),var(--lg-ty)) translate(var(--lg-x),var(--lg-y));width:var(--lg-w);min-height:var(--lg-h)}.ds-unified-text{font-size:var(--lg-font,24px)}}
@media (max-width:1360px) and (min-width:1101px){.ds-unified-layer{left:var(--l-left);top:var(--l-top);transform:translate(var(--l-tx),var(--l-ty)) translate(var(--l-x),var(--l-y));width:var(--l-w);min-height:var(--l-h)}.ds-unified-text{font-size:var(--l-font,24px)}}
@media (max-width:1100px) and (min-width:821px){.ds-unified-layer{left:var(--tl-left);top:var(--tl-top);transform:translate(var(--tl-tx),var(--tl-ty)) translate(var(--tl-x),var(--tl-y));width:var(--tl-w);min-height:var(--tl-h)}.ds-unified-text{font-size:var(--tl-font,24px)}}
@media (max-width:820px) and (min-width:601px){.ds-unified-layer{left:var(--tp-left)!important;top:var(--tp-top)!important;transform:translate(var(--tp-tx),var(--tp-ty)) translate(var(--tp-x),var(--tp-y))!important;width:var(--tp-w)!important;min-height:var(--tp-h)!important}.ds-unified-text{font-size:var(--tp-font,22px)!important}}
@media (max-width:600px) and (min-width:401px){.ds-unified-layer{left:var(--m-left)!important;top:var(--m-top)!important;transform:translate(var(--m-tx),var(--m-ty)) translate(var(--m-x),var(--m-y))!important;width:var(--m-w)!important;min-height:var(--m-h)!important}.ds-unified-text{font-size:var(--m-font,20px)!important}}
@media (max-width:400px){.ds-unified-layer{left:var(--sm-left)!important;top:var(--sm-top)!important;transform:translate(var(--sm-tx),var(--sm-ty)) translate(var(--sm-x),var(--sm-y))!important;width:var(--sm-w)!important;min-height:var(--sm-h)!important}.ds-unified-text{font-size:var(--sm-font,18px)!important}}


/* DS Hero 0.6.1 standalone mode */
.ds-hero--standalone{
    position:relative;
    width:100%;
    height:var(--ds-hero-h,430px);
    min-height:var(--ds-hero-h,430px);
    overflow:hidden;
    background-color:var(--ds-standalone-bg-color,transparent);
    background-image:var(--ds-standalone-bg-image,none);
    background-position:var(--ds-standalone-bg-position,center center);
    background-size:cover;
    background-repeat:no-repeat;
    box-sizing:border-box;
}
.ds-hero--standalone .ds-hero__overlay{
    position:absolute;inset:0;z-index:0;
    background:var(--ds-overlay,#08182f);
    opacity:var(--ds-overlay-opacity,.35);
    pointer-events:none;
}
.ds-hero--standalone .ds-hero__standalone-inner{
    position:relative;z-index:1;width:100%;height:100%;
}
.ds-hero--standalone .ds-hero__canvas--integrated,
.ds-hero--standalone .ds-hero__canvas{
    width:100%;height:100%;min-height:0;
}
@media(max-width:1024px) and (min-width:768px){
    .ds-hero--standalone{height:var(--ds-hero-h-tablet,360px);min-height:var(--ds-hero-h-tablet,360px)}
}
@media(max-width:767px){
    .ds-hero--standalone{height:var(--ds-hero-h-mobile,300px);min-height:var(--ds-hero-h-mobile,300px)}
}


/* DS Hero 0.6.3 DS Universal legacy fallback placement */
.ds-hero-standalone-fallback-active .ds-hero--standalone{
    margin-top:0;
    margin-bottom:0;
}


/* DS Hero 0.6.4 legacy DS Universal integration */
.ds-hero-legacy-integrated-active .ds-page-header,
.ds-hero-legacy-integrated-active .ds-page-title-header{
    box-sizing:border-box;
    max-width:none;
}
.ds-hero-legacy-integrated-active .ds-hero--standalone{
    left:0;
    right:0;
    top:0;
    bottom:0;
    box-sizing:border-box;
}


/* DS Hero 0.6.5 true standalone full-width mode.
 * Applies ONLY when DS Universal is not providing/replacing a page header.
 * This lets DS Hero escape boxed theme content containers without touching
 * either modern or legacy DS Universal integration.
 */
.ds-hero--standalone[data-ds-replace-page-header="0"]{
    width:100vw;
    max-width:none;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    box-sizing:border-box;
}

/* Keep the actual Hero canvas tied to the full standalone wrapper. */
.ds-hero--standalone[data-ds-replace-page-header="0"] .ds-hero__standalone-inner,
.ds-hero--standalone[data-ds-replace-page-header="0"] .ds-hero__canvas--integrated{
    width:100%;
    max-width:none;
    box-sizing:border-box;
}

/* Avoid a boxed theme adding inherited horizontal padding to the Hero itself. */
.ds-hero--standalone[data-ds-replace-page-header="0"]{
    padding-left:0!important;
    padding-right:0!important;
}