.sky-vsh-hero {
    --sky-vsh-overlay-start: rgba(4, 8, 8, 0.96);
    --sky-vsh-overlay-middle: rgba(11, 12, 10, 0.72);
    --sky-vsh-overlay-end: rgba(6, 8, 7, 0.14);
    --sky-vsh-overlay-stop: 67%;
    --sky-vsh-duration: 850ms;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    min-height: 82vh;
    padding: 80px 70px;
    overflow: hidden;
    isolation: isolate;
    background-color: #12110e;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    box-sizing: border-box;
}

.sky-vsh-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(
            90deg,
            var(--sky-vsh-overlay-start) 0%,
            var(--sky-vsh-overlay-middle) calc(var(--sky-vsh-overlay-stop) * .68),
            var(--sky-vsh-overlay-end) var(--sky-vsh-overlay-stop),
            rgba(0,0,0,.04) 100%
        ),
        linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.03) 52%, rgba(0,0,0,.36) 100%);
    pointer-events: none;
}

.sky-vsh-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: radial-gradient(circle at 72% 38%, rgba(232, 189, 114, .12), transparent 31%);
    pointer-events: none;
}

.sky-vsh-content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: 690px;
    text-align: left;
    box-sizing: border-box;
}

.sky-vsh-content.is-panel {
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 24px;
    box-shadow: 0 26px 70px rgba(0,0,0,.22);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.sky-vsh-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 22px;
    color: #e8bd72;
    font-size: 13px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: 2.4px;
    text-transform: uppercase;
}

.sky-vsh-eyebrow > span {
    display: block;
    width: 38px;
    height: 1px;
    flex: 0 0 auto;
    background: currentColor;
    opacity: .85;
}

.sky-vsh-heading {
    margin: 0;
    color: #fff;
    font-size: clamp(44px, 5.4vw, 78px);
    line-height: 1.02;
    font-weight: 700;
    letter-spacing: -.045em;
    text-wrap: balance;
}

.sky-vsh-description {
    max-width: 620px;
    margin-top: 24px;
    color: #f1e7d6;
    font-size: 19px;
    line-height: 1.55;
}

.sky-vsh-description > :first-child { margin-top: 0; }
.sky-vsh-description > :last-child { margin-bottom: 0; }

.sky-vsh-author {
    margin-top: 17px;
    color: #d9b273;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 600;
    letter-spacing: .03em;
}

.sky-vsh-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-top: 34px;
}

.sky-vsh-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 50px;
    padding: 16px 25px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 15px;
    line-height: 1;
    font-weight: 700;
    text-decoration: none !important;
    transition: transform .28s ease, background-color .28s ease, color .28s ease, border-color .28s ease, box-shadow .28s ease;
    box-sizing: border-box;
}

.sky-vsh-button svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    transition: transform .28s ease;
}

.sky-vsh-button:hover {
    transform: translateY(-2px);
}

.sky-vsh-button:hover svg {
    transform: translateX(3px);
}

.sky-vsh-button-primary {
    color: #17100a;
    background: #e8bd72;
    box-shadow: 0 12px 30px rgba(15, 9, 3, .28);
}

.sky-vsh-button-secondary {
    color: #fff;
    background: rgba(15, 17, 15, .18);
    border-color: rgba(255,255,255,.55);
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
}

.sky-vsh-scroll-hint {
    position: absolute;
    left: 70px;
    bottom: 28px;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(255,255,255,.7);
    font-size: 11px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.sky-vsh-scroll-line {
    position: relative;
    display: block;
    width: 34px;
    height: 1px;
    overflow: hidden;
    background: rgba(255,255,255,.26);
}

.sky-vsh-scroll-line::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #e8bd72;
    transform: translateX(-100%);
    animation: skyVshScrollLine 2.1s ease-in-out infinite;
}

@keyframes skyVshScrollLine {
    0% { transform: translateX(-100%); }
    50%, 100% { transform: translateX(100%); }
}

.sky-vsh-hero[data-reveal="yes"] .sky-vsh-content,
.sky-vsh-hero[data-reveal="yes"] .sky-vsh-scroll-hint {
    opacity: 0;
    transition: opacity var(--sky-vsh-duration) cubic-bezier(.22,1,.36,1), transform var(--sky-vsh-duration) cubic-bezier(.22,1,.36,1);
}

.sky-vsh-hero[data-reveal="yes"][data-direction="up"] .sky-vsh-content { transform: translate3d(0, 34px, 0); }
.sky-vsh-hero[data-reveal="yes"][data-direction="left"] .sky-vsh-content { transform: translate3d(34px, 0, 0); }
.sky-vsh-hero[data-reveal="yes"][data-direction="right"] .sky-vsh-content { transform: translate3d(-34px, 0, 0); }
.sky-vsh-hero[data-reveal="yes"][data-direction="none"] .sky-vsh-content { transform: none; }
.sky-vsh-hero[data-reveal="yes"] .sky-vsh-scroll-hint { transform: translateY(14px); transition-delay: 180ms; }

.sky-vsh-hero.is-visible .sky-vsh-content,
.sky-vsh-hero.is-visible .sky-vsh-scroll-hint,
.elementor-editor-active .sky-vsh-hero .sky-vsh-content,
.elementor-editor-active .sky-vsh-hero .sky-vsh-scroll-hint {
    opacity: 1 !important;
    transform: none !important;
}

@media (max-width: 1024px) {
    .sky-vsh-hero {
        min-height: 720px;
        padding: 70px 42px;
        background-attachment: scroll !important;
    }
    .sky-vsh-scroll-hint { left: 42px; }
    .sky-vsh-heading { font-size: clamp(46px, 7vw, 68px); }
}

@media (max-width: 767px) {
    .sky-vsh-hero {
        min-height: 690px;
        padding: 70px 24px 44px;
        justify-content: flex-end;
        background-position: 68% center;
    }

    .sky-vsh-hero::before {
        background:
            linear-gradient(180deg, rgba(4,8,8,.08) 0%, rgba(4,8,8,.38) 35%, rgba(4,8,8,.92) 72%, rgba(4,8,8,.98) 100%),
            linear-gradient(90deg, rgba(4,8,8,.22), rgba(4,8,8,.06));
    }

    .sky-vsh-content {
        width: 100%;
        max-width: none;
    }

    .sky-vsh-heading {
        font-size: clamp(39px, 11.8vw, 58px);
        line-height: 1.03;
    }

    .sky-vsh-description {
        margin-top: 18px;
        font-size: 17px;
        line-height: 1.5;
    }

    .sky-vsh-eyebrow {
        margin-bottom: 16px;
        font-size: 11px;
        letter-spacing: 1.8px;
    }

    .sky-vsh-actions {
        width: 100%;
        margin-top: 26px;
    }

    .sky-vsh-button {
        min-width: min(100%, 210px);
    }

    .sky-vsh-scroll-hint { display: none; }
}

@media (max-width: 460px) {
    .sky-vsh-actions {
        flex-direction: column;
        align-items: stretch;
    }
    .sky-vsh-button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .sky-vsh-hero *,
    .sky-vsh-hero *::before,
    .sky-vsh-hero *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
    .sky-vsh-hero .sky-vsh-content,
    .sky-vsh-hero .sky-vsh-scroll-hint {
        opacity: 1 !important;
        transform: none !important;
    }
}
