/* ------------------------------------------------------------------
   S&C HOMEPAGE HERO — slide 34 only. sandc.ae only (loaded by its own Code Snippet).
   Generated by the S&C Hero Lab on 2026-09-17 08:29 UTC.
   Edit through the lab, not by hand — hand edits are overwritten.
   ------------------------------------------------------------------ */

body.home .tfs-slider .slide-id-34 .background-image {
    background-image: url("https://sandc.ae/wp-content/uploads/hero-lab/archive/woman-playing-grand-piano-dubai-grand-hall-52504b5246ff-52504b5246ff-52504b5246ff.jpg") !important;
    background-color: #121413;
}

body.home .tfs-slider .slide-id-34 .background-image::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.26);
    pointer-events: none;
}

/* Soft scrim behind the headline and buttons — z-index -1 keeps it inside the
   content container's stacking context: above the photo, under the text. */
body.home .tfs-slider li.slide-id-34 .slide-content-container::before {
    content: "";
    position: absolute;
    top: -60px;
    right: 0;
    bottom: -60px;
    left: 0;
    z-index: -1;
    pointer-events: none;
    background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.59) 0%, rgba(0, 0, 0, 0) 72%);
}

/* Strapline. The words live in slide 34's own Caption field (real HTML, indexable);
   this only styles them. Switch it off here to hide it without editing the slide. */
body.home .tfs-slider li.slide-id-34 .slide-content .caption {
    display: block;
    box-sizing: border-box;
    margin: 28px auto 0;
    max-width: 900px;
    padding-top: 28px;
    background-image: linear-gradient(#d4b27a, #d4b27a);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: min(308px, 70%) 1.5px;
}

body.home .tfs-slider li.slide-id-34 .slide-content .caption .fusion-title-heading {
    color: #d4b27a !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    letter-spacing: 5px !important;
    word-spacing: 12px;
    line-height: 1.45 !important;
    text-transform: uppercase !important;
    text-align: center !important;
}

/* Photo is 2400/1350. Wider window than that -> width drives cover; taller -> height does. */
@media only screen and (max-width: 800px) and (min-aspect-ratio: 2400/1350) {
    body.home .tfs-slider .slide-id-34 .background-image {
        background-size: 100% auto !important;
    }
}

@media only screen and (max-width: 800px) and (max-aspect-ratio: 2400/1350) {
    body.home .tfs-slider .slide-id-34 .background-image {
        background-size: auto 100% !important;
    }
}

@media only screen and (max-width: 800px) {
    body.home .tfs-slider .slide-id-34 .background-image {
        background-position: 37% 99% !important;
        background-image: url("https://sandc.ae/wp-content/uploads/hero-lab/archive/woman-playing-grand-piano-dubai-grand-hall-52504b5246ff-52504b5246ff-52504b5246ff.jpg") !important;
        background-image: image-set(url("https://sandc.ae/wp-content/uploads/hero-lab/variants/woman-playing-grand-piano-dubai-grand-hall-52504b5246ff-52504b5246ff-52504b5246ff-1400.avif") type("image/avif"), url("https://sandc.ae/wp-content/uploads/hero-lab/variants/woman-playing-grand-piano-dubai-grand-hall-52504b5246ff-52504b5246ff-52504b5246ff-1400.webp") type("image/webp"), url("https://sandc.ae/wp-content/uploads/hero-lab/archive/woman-playing-grand-piano-dubai-grand-hall-52504b5246ff-52504b5246ff-52504b5246ff.jpg") type("image/jpeg")) !important;
    }

    /* Hero buttons on phones. */
    body.home .tfs-slider li.slide-id-34 .slide-content .buttons a.fusion-button {
        font-size: 11px !important;
        padding: 13px 16px !important;
        line-height: 1.2 !important;
        width: 100% !important;
    }
    body.home .tfs-slider li.slide-id-34 .slide-content .buttons .fusion-align-block {
        text-align: center !important;
    }
    body.home .tfs-slider li.slide-id-34 .slide-content .caption {
        max-width: 86vw;
        margin-top: 17px;
        padding-top: 17px;
        background-size: min(186px, 70%) 1.5px;
    }
    body.home .tfs-slider li.slide-id-34 .slide-content .caption .fusion-title-heading {
        font-size: 13px !important;
        letter-spacing: 1px !important;
        word-spacing: 0;
    }
}

@media only screen and (min-width: 801px) and (min-aspect-ratio: 2400/1350) {
    body.home .tfs-slider .slide-id-34 .background-image {
        background-size: 108% auto !important;
    }
}

@media only screen and (min-width: 801px) and (max-aspect-ratio: 2400/1350) {
    body.home .tfs-slider .slide-id-34 .background-image {
        background-size: auto 108% !important;
    }
}

@media only screen and (min-width: 801px) {
    body.home .tfs-slider .slide-id-34 .background-image {
        background-position: 100% 41% !important;
    }

    /* Whole hero block off her torso — headline, rule, tagline and buttons move as one.
       Shifting .heading alone left every sibling 0px to its left. */
    body.home .tfs-slider li.slide-id-34 .slide-content {
        transform: translateX(0px);
    }

    /* Buttons lower — padding, not margin: a margin here would collapse
       with the heading's 14px bottom margin. */
    body.home .tfs-slider li.slide-id-34 .slide-content .buttons {
        padding-top: 0px;
    }
}

/* Small desktop / narrow window: 801-1279px and landscape. Own crop, so the subject stays in frame. */
@media only screen and (min-width: 801px) and (max-width: 1279px) and (min-aspect-ratio: 2400/1350) {
    body.home .tfs-slider .slide-id-34 .background-image {
        background-size: 111% auto !important;
    }
}

@media only screen and (min-width: 801px) and (max-width: 1279px) and (min-aspect-ratio: 1/1) and (max-aspect-ratio: 2400/1350) {
    body.home .tfs-slider .slide-id-34 .background-image {
        background-size: auto 111% !important;
    }
}

@media only screen and (min-width: 801px) and (max-width: 1279px) and (min-aspect-ratio: 1/1) {
    body.home .tfs-slider .slide-id-34 .background-image {
        background-position: 73% 56% !important;
    }
}

/* Portrait tablets: taller than wide, so they need the portrait crop even though
   they are over 800px. Without this the desktop across/zoom crops the subject out. */
@media only screen and (min-width: 801px) and (max-aspect-ratio: 1/1) {
    body.home .tfs-slider .slide-id-34 .background-image {
        background-size: auto 100% !important;
        background-position: 37% 99% !important;
        background-image: url("https://sandc.ae/wp-content/uploads/hero-lab/archive/woman-playing-grand-piano-dubai-grand-hall-52504b5246ff-52504b5246ff-52504b5246ff.jpg") !important;
        background-image: image-set(url("https://sandc.ae/wp-content/uploads/hero-lab/variants/woman-playing-grand-piano-dubai-grand-hall-52504b5246ff-52504b5246ff-52504b5246ff-1400.avif") type("image/avif"), url("https://sandc.ae/wp-content/uploads/hero-lab/variants/woman-playing-grand-piano-dubai-grand-hall-52504b5246ff-52504b5246ff-52504b5246ff-1400.webp") type("image/webp"), url("https://sandc.ae/wp-content/uploads/hero-lab/archive/woman-playing-grand-piano-dubai-grand-hall-52504b5246ff-52504b5246ff-52504b5246ff.jpg") type("image/jpeg")) !important;
    }
}