/* Additive ornaments only: no site colours, spacing or component styles change. */
.hw-decor { position: absolute; top: 0; left: 0; width: 100%; height: 0; z-index: 101; pointer-events: none !important; user-select: none; }
.hw-decor[hidden] { display: none !important; }
.hw-ornament { position: absolute; display: block; pointer-events: none !important; object-fit: contain; -webkit-user-drag: none; }
.hw-web { opacity: .32; }
.hw-spider { opacity: .85; transform-origin: 50% 0; animation: hw-sway 9s ease-in-out infinite; }
.hw-leaf { opacity: .68; }
.hw-pumpkins { opacity: .95; }
.hw-ghost { opacity: .78; animation: hw-float 7s ease-in-out infinite; }
@keyframes hw-sway { 0%,100% { transform: rotate(-1deg); } 50% { transform: rotate(1deg); } }
@keyframes hw-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
@media (max-width: 600px) { .hw-web { opacity: .24; } .hw-leaf { opacity: .55; } }
@media (prefers-reduced-motion: reduce) { .hw-ornament { animation: none !important; } }

.hw-event-banner { position: relative; display: grid; grid-template-columns: 1.1fr 1fr; overflow: hidden; margin-bottom: 24px; min-height: 300px; border: 1px solid #614164; border-radius: 24px; background: radial-gradient(ellipse at 12% 100%, #4c2833 0, transparent 54%), linear-gradient(120deg, #241929, #100f23 65%); box-shadow: 0 18px 50px #07061240; isolation: isolate; }
.hw-event-banner-copy { position: relative; z-index: 2; padding: 34px 0 34px 36px; }
.hw-event-banner-eyebrow { display: flex; align-items: center; gap: 8px; color: #ffc59b; font-size: 13px; font-weight: 700; letter-spacing: .04em; }
.hw-event-banner-eyebrow > span { margin-left: 6px; padding: 4px 10px; border: 1px solid #ffffff26; border-radius: 20px; color: #ddd4e8; font-size: 11px; font-weight: 500; letter-spacing: 0; }
.hw-event-banner h2 { margin: 16px 0 14px; color: #fff7ef; font-size: clamp(28px, 3.2vw, 42px); font-weight: 800; line-height: 1.08; letter-spacing: -.04em; }
.hw-event-banner h2 em { color: #ffb57c; font-style: normal; }
.hw-event-banner-copy > p { max-width: 390px; margin: 0 0 22px; color: #d8cddd; font-size: 14px; line-height: 1.65; }
.hw-event-banner-link { display: inline-flex; align-items: center; gap: 22px; padding: 12px 19px; border-radius: 12px; background: #ffc191; color: #251523 !important; font-weight: 750; font-size: 14px; text-decoration: none !important; transition: background .15s; }
.hw-event-banner-link:hover { background: #ffdabf; }
.hw-event-banner-link:focus-visible { outline: 3px solid #fff4e9; outline-offset: 4px; }
.hw-event-banner-command { display: inline-block; margin-left: 15px; color: #bcaec9; font-size: 12px; white-space: nowrap; }
.hw-event-banner-command strong { color: #eee4fa; }
.hw-event-banner-art { position: relative; min-width: 0; background: #101020; }
.hw-event-banner-art::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, #181324, transparent 30%), linear-gradient(0deg, #111020b3, transparent 35%); }
.hw-event-banner-art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hw-event-weapon { position: absolute; inset: 0; }
.hw-event-weapon[hidden] { display: none; }
.hw-event-banner-controls { position: absolute; top: 14px; right: 18px; z-index: 3; display: flex; gap: 5px; }
.hw-event-banner-controls button { border: 1px solid #ffffff30; border-radius: 8px; padding: 5px 10px; background: #100d25c9; color: #d6c9e9; font-size: 11px; }
.hw-event-banner-controls button[aria-pressed="true"] { background: #62427f; color: #fff; border-color: #b795d6; }
.hw-event-banner-controls button:focus-visible { outline: 2px solid #ffc191; outline-offset: 3px; }
.hw-event-banner-reward { position: absolute; bottom: 22px; right: 26px; z-index: 1; display: grid; gap: 3px; text-align: right; }
.hw-event-banner-reward strong { color: #f8f0ff; font-size: 17px; }
.hw-event-banner-reward span { color: #c7b8e5; font-size: 12px; }
@media (max-width: 700px) {
  .hw-event-banner { grid-template-columns: 1fr; border-radius: 20px; }
  .hw-event-banner-copy { padding: 26px 24px 16px; }
  .hw-event-banner h2 { font-size: 34px; }
  .hw-event-banner-copy > p { max-width: none; }
  .hw-event-banner-art { height: 240px; }
  .hw-event-banner-art::after { background: linear-gradient(180deg, #191324, transparent 35%), linear-gradient(0deg, #111020b3, transparent 35%); }
  .hw-event-banner-command { margin-left: 10px; font-size: 11px; }
  .hw-event-banner-reward { bottom: 18px; right: 22px; }
}
@media (prefers-reduced-motion: reduce) { .hw-event-banner-link { transition: none; } }