/* =========================================================
   SHELAN BEAUTY – LUXURY EDITORIAL PORTFOLIO
   Exakt aus dem Elementor HTML Widget übertragen
========================================================= */

html body .sblp-instance,
html body .sblp-instance *,
html body .sblp-instance *::before,
html body .sblp-instance *::after,
html body .slp-lightbox,
html body .slp-lightbox *,
html body .slp-lightbox *::before,
html body .slp-lightbox *::after {
    box-sizing: border-box !important;
}

html body .sblp-instance button,
html body .slp-lightbox button {
    appearance: none !important;
    -webkit-appearance: none !important;
    border: 0 !important;
    outline: 0 !important;
    margin: 0 !important;
    font: inherit !important;
    text-transform: none !important;
    box-shadow: none !important;
}

html body .sblp-instance.slp-section {
    --slp-ivory: #FFF8F1;
    --slp-dark: #292522;
    --slp-text: #5B544F;
    --slp-champagne: #C9A17A;
    --slp-blush: #EADBD4;
    --slp-white: #FFFFFF;

    position: relative !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 115px 0 105px !important;
    overflow: hidden !important;
    background:
        radial-gradient(circle at 7% 10%, rgba(234, 219, 212, 0.46), transparent 26%),
        radial-gradient(circle at 96% 90%, rgba(201, 161, 122, 0.10), transparent 28%),
        #FFF8F1 !important;
    color: #292522 !important;
    font-family: 'Manrope', sans-serif !important;
}

html body .sblp-instance .slp-background-word {
    position: absolute !important;
    z-index: 0 !important;
    top: 25px !important;
    left: 50% !important;
    width: 100% !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
    text-align: center !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: clamp(130px, 15vw, 270px) !important;
    font-weight: 500 !important;
    line-height: 0.8 !important;
    letter-spacing: -0.07em !important;
    color: rgba(41, 37, 34, 0.026) !important;
    pointer-events: none !important;
    user-select: none !important;
}

html body .sblp-instance .slp-decoration {
    position: absolute !important;
    z-index: 0 !important;
    border-radius: 50% !important;
    pointer-events: none !important;
}

html body .sblp-instance .slp-decoration-left {
    width: 430px !important;
    height: 430px !important;
    left: -300px !important;
    top: 240px !important;
    border: 1px solid rgba(201, 161, 122, 0.15) !important;
}

html body .sblp-instance .slp-decoration-right {
    width: 500px !important;
    height: 500px !important;
    right: -340px !important;
    bottom: 120px !important;
    background: rgba(234, 219, 212, 0.24) !important;
}

html body .sblp-instance .slp-container {
    position: relative !important;
    z-index: 2 !important;
    width: calc(100% - 60px) !important;
    max-width: 1350px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

html body .sblp-instance .slp-header {
    width: 100% !important;
    margin: 0 0 58px !important;
    padding: 0 !important;
}

html body .sblp-instance .slp-kicker {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 0 0 22px !important;
    padding: 0 !important;
    font-family: 'Manrope', sans-serif !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.25em !important;
    color: #5B544F !important;
}

html body .sblp-instance .slp-kicker-line {
    display: block !important;
    width: 48px !important;
    height: 1px !important;
    flex-shrink: 0 !important;
    background: #C9A17A !important;
}

html body .sblp-instance .slp-header-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr) !important;
    align-items: end !important;
    gap: 70px !important;
}

html body .sblp-instance .slp-header h2 {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: clamp(62px, 6.2vw, 96px) !important;
    font-weight: 400 !important;
    font-style: normal !important;
    line-height: 0.86 !important;
    letter-spacing: -0.058em !important;
    text-transform: none !important;
    color: #292522 !important;
}

html body .sblp-instance .slp-header h2 em {
    display: block !important;
    margin-top: 9px !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: inherit !important;
    font-weight: 400 !important;
    font-style: italic !important;
    line-height: inherit !important;
    color: #C9A17A !important;
}

html body .sblp-instance .slp-header-copy {
    padding-bottom: 8px !important;
}

html body .sblp-instance .slp-header-copy p {
    max-width: 440px !important;
    margin: 0 !important;
    padding: 0 !important;
    font-family: 'Manrope', sans-serif !important;
    font-size: 14px !important;
    font-weight: 300 !important;
    line-height: 1.85 !important;
    letter-spacing: -0.01em !important;
    color: #5B544F !important;
}

html body .sblp-instance .slp-header-meta {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 11px !important;
    margin-top: 27px !important;
}

html body .sblp-instance .slp-header-meta span {
    font-family: 'Manrope', sans-serif !important;
    font-size: 8px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0.2em !important;
    color: #292522 !important;
}

html body .sblp-instance .slp-header-meta i {
    display: block !important;
    width: 3px !important;
    height: 3px !important;
    border-radius: 50% !important;
    background: #C9A17A !important;
}

html body .sblp-instance .slp-gallery {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 10px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

html body .sblp-instance .slp-gallery-item {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    cursor: pointer !important;
    background: #EADBD4 !important;
    color: #292522 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-align: left !important;
    transform-origin: center center !important;
}

html body .sblp-instance .slp-image-wrap {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 4 / 5 !important;
    overflow: hidden !important;
    background: #EADBD4 !important;
}

html body .sblp-instance .slp-gallery-item img {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    object-fit: cover !important;
    transform: scale(1.015) !important;
    filter: saturate(0.97) contrast(1.01) !important;
    transition:
        transform 1.1s cubic-bezier(.16,.78,.2,1),
        filter 0.55s ease !important;
}

html body .sblp-instance .slp-gallery-item:hover img {
    transform: scale(1.075) !important;
    filter: saturate(1.03) contrast(1.035) !important;
}

html body .sblp-instance .slp-image-shade {
    position: absolute !important;
    z-index: 2 !important;
    inset: 0 !important;
    display: block !important;
    background:
        linear-gradient(
            180deg,
            rgba(41, 37, 34, 0.04) 0%,
            rgba(41, 37, 34, 0.00) 48%,
            rgba(41, 37, 34, 0.34) 100%
        ) !important;
    opacity: 0.58 !important;
    transition: opacity 0.45s ease !important;
}

html body .sblp-instance .slp-gallery-item:hover .slp-image-shade {
    opacity: 0.85 !important;
}

html body .sblp-instance .slp-image-number {
    position: absolute !important;
    z-index: 4 !important;
    top: 16px !important;
    right: 16px !important;
    display: block !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    color: rgba(255, 248, 241, 0.9) !important;
    opacity: 0 !important;
    transform: translateY(-7px) !important;
    transition:
        opacity 0.4s ease,
        transform 0.45s cubic-bezier(.2,.7,.2,1) !important;
}

html body .sblp-instance .slp-gallery-item:hover .slp-image-number {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

html body .sblp-instance .slp-image-open {
    position: absolute !important;
    z-index: 5 !important;
    left: 17px !important;
    bottom: 17px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: #FFF8F1 !important;
    opacity: 0 !important;
    transform: translateY(10px) !important;
    transition:
        opacity 0.4s ease,
        transform 0.45s cubic-bezier(.2,.7,.2,1) !important;
}

html body .sblp-instance .slp-gallery-item:hover .slp-image-open {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

html body .sblp-instance .slp-open-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 34px !important;
    height: 34px !important;
    border: 1px solid rgba(255, 248, 241, 0.55) !important;
    border-radius: 50% !important;
    font-family: 'Manrope', sans-serif !important;
    font-size: 14px !important;
    color: #FFF8F1 !important;
    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}

html body .sblp-instance .slp-open-text {
    font-family: 'Manrope', sans-serif !important;
    font-size: 7px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0.19em !important;
    color: #FFF8F1 !important;
}

html body .sblp-instance .slp-bottom {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 25px !important;
    margin-top: 55px !important;
}

html body .sblp-instance .slp-bottom-line {
    display: block !important;
    width: 85px !important;
    height: 1px !important;
    background: rgba(201, 161, 122, 0.45) !important;
}

html body .sblp-instance .slp-bottom-script {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 24px !important;
    font-weight: 400 !important;
    font-style: italic !important;
    line-height: 1 !important;
    color: #C9A17A !important;
}

html body .sblp-instance .slp-no-images {
    padding: 50px !important;
    border: 1px solid rgba(201, 161, 122, 0.28) !important;
    background: rgba(255,255,255,0.38) !important;
    text-align: center !important;
    font-family: 'Manrope', sans-serif !important;
    color: #5B544F !important;
}

/* Entrance */
html body .sblp-instance.slp-js-ready .slp-reveal {
    opacity: 0 !important;
    transform: translateY(35px) !important;
}

html body .sblp-instance.slp-js-ready .slp-reveal-item {
    opacity: 0 !important;
    transform: translateY(38px) scale(0.985) !important;
}

html body .sblp-instance .slp-reveal.slp-visible {
    opacity: 1 !important;
    transform: translateY(0) !important;
    transition:
        opacity 1s cubic-bezier(.18,.74,.2,1),
        transform 1s cubic-bezier(.18,.74,.2,1) !important;
}

html body .sblp-instance .slp-reveal-item.slp-visible {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
    transition:
        opacity 0.85s cubic-bezier(.18,.74,.2,1) var(--slp-delay, 0ms),
        transform 0.95s cubic-bezier(.18,.74,.2,1) var(--slp-delay, 0ms) !important;
}

/* LIGHTBOX */
html body .slp-lightbox {
    --slp-dark: #292522;
    --slp-ivory: #FFF8F1;
    --slp-champagne: #C9A17A;

    position: fixed !important;
    z-index: 999999999 !important;
    inset: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100vw !important;
    height: 100dvh !important;
    padding: 0 !important;
    background: rgba(25, 22, 20, 0.96) !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition:
        opacity 0.45s ease,
        visibility 0.45s ease !important;
}

html body .slp-lightbox.slp-lightbox-open {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

html body .slp-lightbox .slp-lightbox-backdrop {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    background:
        radial-gradient(circle at 50% 45%, rgba(201, 161, 122, 0.08), transparent 42%),
        rgba(25, 22, 20, 0.97) !important;
}

html body .slp-lightbox .slp-lightbox-top {
    position: absolute !important;
    z-index: 20 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 82px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 38px !important;
    border-bottom: 1px solid rgba(255, 248, 241, 0.08) !important;
}

html body .slp-lightbox .slp-lightbox-brand {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
}

html body .slp-lightbox .slp-lightbox-brand-small,
html body .slp-lightbox .slp-lightbox-brand-category {
    font-family: 'Manrope', sans-serif !important;
    font-size: 8px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0.22em !important;
    color: #FFF8F1 !important;
}

html body .slp-lightbox .slp-lightbox-brand-category {
    color: #C9A17A !important;
}

html body .slp-lightbox .slp-lightbox-brand-separator {
    width: 35px !important;
    height: 1px !important;
    background: rgba(255, 248, 241, 0.25) !important;
}

html body .slp-lightbox .slp-lightbox-close {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 10px 0 !important;
    cursor: pointer !important;
    background: transparent !important;
    color: #FFF8F1 !important;
}

html body .slp-lightbox .slp-close-text {
    font-family: 'Manrope', sans-serif !important;
    font-size: 8px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0.2em !important;
    color: #FFF8F1 !important;
}

html body .slp-lightbox .slp-close-icon {
    position: relative !important;
    display: block !important;
    width: 34px !important;
    height: 34px !important;
    border: 1px solid rgba(255, 248, 241, 0.25) !important;
    border-radius: 50% !important;
    transition:
        border-color 0.3s ease,
        transform 0.35s ease !important;
}

html body .slp-lightbox .slp-lightbox-close:hover .slp-close-icon {
    transform: rotate(90deg) !important;
    border-color: #C9A17A !important;
}

html body .slp-lightbox .slp-close-icon i {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    display: block !important;
    width: 12px !important;
    height: 1px !important;
    background: #FFF8F1 !important;
}

html body .slp-lightbox .slp-close-icon i:first-child {
    transform: translate(-50%, -50%) rotate(45deg) !important;
}

html body .slp-lightbox .slp-close-icon i:last-child {
    transform: translate(-50%, -50%) rotate(-45deg) !important;
}

html body .slp-lightbox .slp-lightbox-stage {
    position: relative !important;
    z-index: 5 !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 110px 115px 45px !important;
}

html body .slp-lightbox .slp-lightbox-image-wrap {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    max-width: min(1050px, 78vw) !important;
    max-height: calc(100dvh - 145px) !important;
}

html body .slp-lightbox .slp-lightbox-image-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

html body .slp-lightbox .slp-lightbox-image {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: calc(100dvh - 205px) !important;
    object-fit: contain !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: 0 35px 100px rgba(0, 0, 0, 0.36) !important;
    opacity: 1 !important;
    transform: scale(1) !important;
    transition:
        opacity 0.25s ease,
        transform 0.35s cubic-bezier(.2,.7,.2,1) !important;
}

html body .slp-lightbox .slp-lightbox-image.slp-image-changing {
    opacity: 0 !important;
    transform: scale(0.985) !important;
}

html body .slp-lightbox .slp-lightbox-caption {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 25px !important;
    padding-top: 15px !important;
}

html body .slp-lightbox .slp-lightbox-counter {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

html body .slp-lightbox .slp-current-number {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    color: #C9A17A !important;
}

html body .slp-lightbox .slp-total-number {
    font-family: 'Manrope', sans-serif !important;
    font-size: 8px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    letter-spacing: 0.16em !important;
    color: rgba(255, 248, 241, 0.55) !important;
}

html body .slp-lightbox .slp-counter-line {
    display: block !important;
    width: 28px !important;
    height: 1px !important;
    background: rgba(255, 248, 241, 0.24) !important;
}

html body .slp-lightbox .slp-lightbox-title {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 19px !important;
    font-weight: 400 !important;
    font-style: italic !important;
    line-height: 1 !important;
    color: rgba(255, 248, 241, 0.76) !important;
}

html body .slp-lightbox .slp-lightbox-nav {
    position: absolute !important;
    z-index: 15 !important;
    top: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 58px !important;
    height: 58px !important;
    padding: 0 !important;
    transform: translateY(-50%) !important;
    border: 1px solid rgba(255, 248, 241, 0.18) !important;
    border-radius: 50% !important;
    background: rgba(255, 248, 241, 0.03) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    cursor: pointer !important;
    color: #FFF8F1 !important;
    transition:
        background-color 0.3s ease,
        border-color 0.3s ease,
        transform 0.35s cubic-bezier(.2,.7,.2,1) !important;
}

html body .slp-lightbox .slp-lightbox-nav:hover {
    background: #C9A17A !important;
    border-color: #C9A17A !important;
}

html body .slp-lightbox .slp-lightbox-prev {
    left: 36px !important;
}

html body .slp-lightbox .slp-lightbox-prev:hover {
    transform: translateY(-50%) translateX(-4px) !important;
}

html body .slp-lightbox .slp-lightbox-next {
    right: 36px !important;
}

html body .slp-lightbox .slp-lightbox-next:hover {
    transform: translateY(-50%) translateX(4px) !important;
}

html body .slp-lightbox .slp-lightbox-nav span {
    font-family: 'Manrope', sans-serif !important;
    font-size: 19px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
    color: inherit !important;
}

@media (max-width: 1100px) {
    html body .sblp-instance.slp-section {
        padding: 90px 0 !important;
    }

    html body .sblp-instance .slp-header-grid {
        grid-template-columns: minmax(0, 1.1fr) minmax(280px, 0.9fr) !important;
        gap: 45px !important;
    }

    html body .sblp-instance .slp-gallery {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    html body .slp-lightbox .slp-lightbox-stage {
        padding: 105px 85px 40px !important;
    }

    html body .slp-lightbox .slp-lightbox-prev {
        left: 18px !important;
    }

    html body .slp-lightbox .slp-lightbox-next {
        right: 18px !important;
    }
}

@media (max-width: 767px) {
    html body .sblp-instance.slp-section {
        padding: 70px 0 !important;
    }

    html body .sblp-instance .slp-container {
        width: calc(100% - 32px) !important;
    }

    html body .sblp-instance .slp-header {
        margin-bottom: 37px !important;
    }

    html body .sblp-instance .slp-kicker {
        gap: 10px !important;
        margin-bottom: 18px !important;
        font-size: 8px !important;
        letter-spacing: 0.19em !important;
    }

    html body .sblp-instance .slp-kicker-line {
        width: 32px !important;
    }

    html body .sblp-instance .slp-header-grid {
        grid-template-columns: 1fr !important;
        gap: 25px !important;
    }

    html body .sblp-instance .slp-header h2 {
        font-size: clamp(49px, 15vw, 67px) !important;
        line-height: 0.89 !important;
    }

    html body .sblp-instance .slp-header-copy p {
        font-size: 13px !important;
        line-height: 1.8 !important;
    }

    html body .sblp-instance .slp-header-meta {
        margin-top: 20px !important;
    }

    html body .sblp-instance .slp-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 6px !important;
    }

    html body .sblp-instance .slp-image-number {
        top: 10px !important;
        right: 10px !important;
        font-size: 17px !important;
        opacity: 1 !important;
        transform: none !important;
    }

    html body .sblp-instance .slp-image-open {
        left: 10px !important;
        bottom: 10px !important;
        opacity: 1 !important;
        transform: none !important;
    }

    html body .sblp-instance .slp-open-icon {
        width: 30px !important;
        height: 30px !important;
        background: rgba(41, 37, 34, 0.14) !important;
    }

    html body .sblp-instance .slp-open-text {
        display: none !important;
    }

    html body .sblp-instance .slp-bottom {
        gap: 15px !important;
        margin-top: 36px !important;
    }

    html body .sblp-instance .slp-bottom-line {
        width: 40px !important;
    }

    html body .sblp-instance .slp-bottom-script {
        font-size: 20px !important;
    }

    html body .slp-lightbox .slp-lightbox-top {
        height: 67px !important;
        padding: 0 16px !important;
    }

    html body .slp-lightbox .slp-lightbox-brand-separator,
    html body .slp-lightbox .slp-lightbox-brand-category,
    html body .slp-lightbox .slp-close-text {
        display: none !important;
    }

    html body .slp-lightbox .slp-lightbox-stage {
        padding: 82px 14px 85px !important;
    }

    html body .slp-lightbox .slp-lightbox-image-wrap {
        max-width: 100% !important;
    }

    html body .slp-lightbox .slp-lightbox-image {
        max-height: calc(100dvh - 205px) !important;
    }

    html body .slp-lightbox .slp-lightbox-nav {
        top: auto !important;
        bottom: 18px !important;
        width: 48px !important;
        height: 48px !important;
        transform: none !important;
    }

    html body .slp-lightbox .slp-lightbox-prev {
        left: calc(50% - 59px) !important;
    }

    html body .slp-lightbox .slp-lightbox-next {
        right: calc(50% - 59px) !important;
    }

    html body .slp-lightbox .slp-lightbox-prev:hover,
    html body .slp-lightbox .slp-lightbox-next:hover {
        transform: none !important;
    }
}

@media (max-width: 390px) {
    html body .sblp-instance .slp-gallery {
        gap: 4px !important;
    }

    html body .sblp-instance .slp-header h2 {
        font-size: 48px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body .sblp-instance *,
    html body .sblp-instance *::before,
    html body .sblp-instance *::after,
    html body .slp-lightbox *,
    html body .slp-lightbox *::before,
    html body .slp-lightbox *::after {
        animation: none !important;
        transition: none !important;
    }

    html body .sblp-instance.slp-js-ready .slp-reveal,
    html body .sblp-instance.slp-js-ready .slp-reveal-item {
        opacity: 1 !important;
        transform: none !important;
    }
}