/*! Asset credits and retained license notices: THIRD-PARTY-NOTICES.txt (unlinked distribution record). */
/*
 * DreamGuild masked holographic study — original brand artwork and surface pattern.
 * Technique adapted from Christian Alder / HejChristian, "CSS Holographic Masks":
 * https://codepen.io/HejChristian/pen/YPzLbYX (March 2025, MIT).
 * Christian credits Robb Owen's foundational CSS blend-mode shader guide:
 * https://robbowen.digital/wrote-about/css-blend-mode-shaders/
 * See LICENSE-holographic-mask.txt for the retained MIT notice.
 * Changes: DreamGuild SVG alpha mask; original CSS foil ridges; brand-derived
 * light spectrum; scroll-position updates instead of background-attachment:fixed;
 * reduced-motion/static fallbacks. No imagery or texture assets from the Pen used.
 */
#style-h07{grid-column:1/-1}
.dg-holo-mask{background:radial-gradient(ellipse at 83% 50%,#313daf3d,transparent 50%),linear-gradient(130deg,#171020,#241632);color:#fffaf4;min-height:470px;--dg-holo-y:50%}
.dg-holo-mask .dg-preview-copy{max-width:55%;z-index:2}
.dg-holo-mask .dg-preview-heading{font-size:clamp(36px,4vw,56px);max-width:15ch!important}
.dg-holo-mask .dg-preview-heading span{color:#f4da40}
.dg-holo-emblem{position:absolute;width:310px;height:310px;right:7%;top:50%;transform:translateY(-50%);isolation:isolate;background:#292030;overflow:hidden;-webkit-mask:url(icon-mark.svg) center/contain no-repeat;mask:url(icon-mark.svg) center/contain no-repeat}
.dg-holo-emblem::before{content:'';position:absolute;inset:0;background:repeating-conic-gradient(from 18deg at 50% 50%,#171020 0deg,#5e516d 2deg,#231a32 4deg,#897b9d 5deg,#171020 8deg);opacity:.9}
.dg-holo-specular{position:absolute;inset:0;mix-blend-mode:color-dodge;background-image:linear-gradient(155deg,#090710 5%,#3b2169 19%,#746693 32%,#218e8b 43%,#b1a56e 49%,#403166 57%,#08060e 70%,#7241a8 85%,#090710);background-size:160% 320%;background-position:50% var(--dg-holo-y)}
.dg-holo-specular::after{content:'';position:absolute;inset:0;background:repeating-radial-gradient(ellipse at 50% 50%,#ffffff80 0 1px,#29233180 2px 3px);mix-blend-mode:multiply;opacity:.7}
.dg-holo-mask .dg-preview-body{max-width:36ch;color:#c5b3e3}
#style-h07 .dg-approval-details>p a{color:#5c068b}
@media(max-width:800px){.dg-holo-mask{min-height:610px;align-items:flex-end;padding:28px}.dg-holo-mask .dg-preview-copy{max-width:100%}.dg-holo-emblem{width:230px;height:230px;top:30px;right:calc(50% - 115px);transform:none}.dg-holo-mask .dg-preview-heading{font-size:38px}}
@supports not (mask-image:url(icon-mark.svg)){.dg-holo-emblem{background:transparent url(icon-mark.svg) center/contain no-repeat}.dg-holo-emblem::before,.dg-holo-specular{display:none}}
@media(prefers-reduced-motion:reduce){.dg-holo-mask{--dg-holo-y:50%!important}}
.dg-reduced-motion .dg-holo-mask{--dg-holo-y:50%!important}
@media(forced-colors:active){.dg-holo-mask{background:Canvas;color:CanvasText}.dg-holo-mask .dg-preview-heading span,.dg-holo-mask .dg-preview-body{color:CanvasText}.dg-holo-emblem{background:CanvasText}.dg-holo-emblem::before,.dg-holo-specular{display:none}}
