/* Phase 27: One composited opacity layer per hero media surface.
 * Do not fade the image at the bottom or multiply CSS alpha across nested layers.
 * 0% transparency = full video; 100% = hidden video; settings are server supplied.
 */
.h2-hero.home07-hero{position:relative;isolation:isolate;overflow:hidden}
.h2-hero .home07-slide-media,
.h2-hero .hero27-fallback-media{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  overflow:hidden!important;pointer-events:none!important;z-index:0!important;
  opacity:var(--hero-media-opacity,.65)!important;background:transparent!important;
  mask:none!important;-webkit-mask:none!important;border-radius:0!important;
  filter:none!important;
}
.h2-hero .home07-slide-media::before,
.h2-hero .home07-slide-media::after,
.h2-hero .home07-fallback-poster::before,
.h2-hero .home07-fallback-poster::after{display:none!important;content:none!important}
.h2-hero .home07-slide-media picture,
.h2-hero .home07-slide-media picture img,
.h2-hero .home07-fallback-poster,
.h2-hero .home07-fallback-poster picture,
.h2-hero .home07-fallback-poster picture img{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  max-width:none!important;display:block!important;object-fit:cover!important;object-position:center;
  opacity:1!important;filter:none!important;border-radius:0!important;
  mask:none!important;-webkit-mask:none!important;
}
.h2-hero .home07-slide-media video,
.h2-hero .hero27-fallback-media video.hero-bg{
  position:absolute!important;inset:0!important;display:block;width:100%!important;height:100%!important;
  object-fit:cover!important;object-position:center;max-width:none!important;
  opacity:0!important;filter:none!important;border-radius:0!important;
  mask:none!important;-webkit-mask:none!important;z-index:1!important;
}
.h2-hero .home07-slide-media video.home07-video-ready,
.h2-hero .hero27-fallback-media video.hero-bg.home07-video-ready{opacity:1!important}
.h2-hero .hero27-fallback-media iframe.hero18-youtube,
.h2-hero .home07-slide-media iframe.hero18-youtube{opacity:1!important;z-index:2!important;filter:none!important}
.h2-hero .home07-slide-content,
.h2-hero .hero-content{position:relative!important;z-index:3!important}
/* Keep the text legible without hiding the background over most of the page. */
.h2-hero .home07-hero-copy,
.h2-hero .hero-copy{text-shadow:0 1px 10px color-mix(in srgb,var(--h2-hero-surface,#fbf8f4) 75%,transparent)}
/* Operable opacity preview in Branding & Appearance. */
.hero27-opacity-preview{position:relative;isolation:isolate;overflow:hidden;min-height:190px;
  border:1px solid var(--line,#dccfc1);border-radius:14px;margin:16px 0 12px;
  background:var(--panel,#fbf7f2);display:flex;align-items:center;padding:24px}
.hero27-opacity-preview-media{position:absolute;inset:0;opacity:var(--hero-media-opacity,.65);pointer-events:none}
.hero27-opacity-preview-media img{width:100%;height:100%;object-fit:cover;display:block}
.hero27-opacity-preview-copy{position:relative;z-index:1;display:grid;gap:7px;max-width:380px;color:var(--text,#26211e)}
.hero27-opacity-preview-copy small{font-size:10px;letter-spacing:.16em;font-weight:800}
.hero27-opacity-preview-copy strong{font-size:clamp(20px,2.4vw,29px);line-height:1.13}
.hero27-opacity-preview-copy span{font-size:12px;background:color-mix(in srgb,var(--panel,#fbf7f2) 77%,transparent);padding:6px;border-radius:5px}
@media(prefers-reduced-motion:reduce){.h2-hero video{display:none!important}.h2-hero .home07-slide-media video{transition:none!important}}

/* Native range control must not inherit the generic admin text-input box styling. */
.admin14-shell .appearance-editor #heroOpacity{display:block!important;width:100%!important;min-height:24px!important;height:28px!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;accent-color:var(--h26-accent,var(--accent,#943919))!important;cursor:pointer;box-shadow:none!important}
.admin14-shell .appearance-editor #heroOpacity:focus-visible{outline:2px solid var(--h26-accent,var(--accent,#943919))!important;outline-offset:3px!important}
