/*
GPRO CSS: Crystal Header
Description: Frosted-glass treatment for a Divi Theme Builder header. Solid background at rest; translucent blur when the header section is sticky.
Classes: .gpro-crystal-header
Version: 1.0
Order: 20
*/

/* Add .gpro-crystal-header to the header layout (Theme Builder header area). */

/* NORMAL state: solid background on the header wrapper only */
.gpro-crystal-header.et-l--header {
    background-color: rgba(var(--color-bg-rgb), 1) !important;
}

/* Keep inner header building blocks transparent so they don't override */
.gpro-crystal-header.et-l--header .et_pb_section,
.gpro-crystal-header.et-l--header .et_pb_row,
.gpro-crystal-header.et-l--header .et_pb_column,
.gpro-crystal-header.et-l--header .et_pb_module,
.gpro-crystal-header.et-l--header .et_pb_section:before,
.gpro-crystal-header.et-l--header .et_pb_section:after,
.gpro-crystal-header.et-l--header .et_pb_row:before,
.gpro-crystal-header.et-l--header .et_pb_row:after {
    background:       transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

/* STICKY state: glass */
.gpro-crystal-header.et-l--header .et_pb_section.et_pb_sticky,
.gpro-crystal-header.et-l--header .et_pb_row.et_pb_sticky,
.gpro-crystal-header.et-l--header .et_pb_sticky,
.gpro-crystal-header.et-l--header.et_pb_sticky {
    background-color:        rgba(var(--color-bg-rgb), 0.75) !important;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter:         blur(12px);
}
