/* COR Home Loader — intro state styles.
   The image layer + frame window are created inline by the JS. */

/* Header: visible with the full-screen image (raised above the image layer and
   frame overlay). While over the image it is forced WHITE; when the frame comes
   in the class is removed and colours transition back to the header's own. */
.cor-hl-header.cor-hl-header--raised {
    position: relative;
    z-index: 99992;
}
.cor-hl-header,
.cor-hl-header a,
.cor-hl-header span,
.cor-hl-header p,
.cor-hl-header h1, .cor-hl-header h2, .cor-hl-header h3, .cor-hl-header h4,
.cor-hl-header .elementor-icon,
.cor-hl-header .elementor-item {
    transition: color 700ms ease, fill 700ms ease !important;
}
.cor-hl-header svg { transition: fill 700ms ease, color 700ms ease !important; }
.cor-hl-header img { transition: filter 700ms ease !important; filter: brightness(1) invert(0); }

.cor-hl-header--onimage,
.cor-hl-header--onimage a,
.cor-hl-header--onimage span,
.cor-hl-header--onimage p,
.cor-hl-header--onimage h1, .cor-hl-header--onimage h2, .cor-hl-header--onimage h3, .cor-hl-header--onimage h4,
.cor-hl-header--onimage .elementor-icon,
.cor-hl-header--onimage .elementor-item {
    color: #fff !important;
}
.cor-hl-header--onimage svg { fill: #fff !important; color: #fff !important; }
/* Dark logo image → white while over the photo. */
.cor-hl-header--onimage img { filter: brightness(0) invert(1); }

/* Hero heading: starts 40px left at 0% opacity, slides/fades into place after
   the frame settles. Doubled class = beats Elementor's own widget transition rules. */
.cor-hl-text.cor-hl-text {
    opacity: 0;
    transform: translateX(-40px);
    transition: none !important;
}
.cor-hl-text.cor-hl-text--in {
    opacity: 1;
    transform: none;
    transition: transform 900ms cubic-bezier(.22, 1, .36, 1), opacity 700ms ease !important;
}
