.elementor-19088 .elementor-element.elementor-element-3d043d8{width:100%;max-width:100%;}/* Credibled blog: No skeletons here (Halloween MyCheck post), with the hidden pumpkin promo code,
   the flashlight myths and the scattered webs, spiders and ghosts
   Page Settings > Advanced > Custom CSS, after credibled-core.css.
   Scoped to .hw. Buttons and inline links use the core cb-btn and cb-inline-link classes. */

.hw {
  --hw-indigo: #250C77;
  --hw-deep: #190A5A;
  --hw-orange: #EE642B;
  --hw-cream: #EEEEE0;
  --hw-ink: #1E1838;
  --hw-muted: #5E5873;
  --hw-line: rgba(37, 12, 119, 0.14);
  color: var(--hw-ink);
  line-height: 1.65;
}
.hw *,
.hw *::before,
.hw *::after { box-sizing: border-box; }
.hw { overflow-x: hidden; overflow-x: clip; }

/* Hero */
.hw .hw-hero {
  position: relative;
  overflow: hidden;
  padding: 72px max(20px, calc((100% - 1080px) / 2)) 64px;
  background:
    radial-gradient(circle at 82% 18%, rgba(238, 100, 43, 0.20), transparent 42%),
    linear-gradient(160deg, var(--hw-indigo) 0%, var(--hw-deep) 100%);
  color: var(--hw-cream);
  isolation: isolate;
}
.hw .hw-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    radial-gradient(1.6px 1.6px at 8% 22%, rgba(238, 238, 224, 0.8) 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 22% 68%, rgba(238, 238, 224, 0.6) 50%, transparent 51%),
    radial-gradient(1.4px 1.4px at 38% 14%, rgba(238, 238, 224, 0.7) 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 51% 82%, rgba(238, 238, 224, 0.5) 50%, transparent 51%),
    radial-gradient(1.6px 1.6px at 63% 30%, rgba(238, 238, 224, 0.7) 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 92% 62%, rgba(238, 238, 224, 0.6) 50%, transparent 51%),
    radial-gradient(1.4px 1.4px at 74% 88%, rgba(238, 238, 224, 0.5) 50%, transparent 51%);
}
.hw .hw-hero-grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
  gap: 40px;
  align-items: start;
}
.hw .hw-eyebrow {
  display: inline-block;
  margin-bottom: 16px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--hw-orange);
}
.hw .hw-h1 {
  margin: 0 0 20px;
  font-size: clamp(32px, 4.4vw, 52px);
  line-height: 1.08;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #fff;
}
.hw .hw-h1 span {
  display: block;
  margin-top: 6px;
  font-size: 0.72em;
  line-height: 1.15;
  font-weight: 700;
  color: var(--hw-orange);
}
.hw .hw-lede {
  max-width: 60ch;
  margin: 0;
  font-size: 19px;
  line-height: 1.6;
  color: rgba(238, 238, 224, 0.92);
}
.hw .hw-hero-side {
  justify-self: end;
  width: 100%;
  max-width: 360px;
}
.hw .hw-hero-art {
  display: block;
  width: 100%;
  height: auto;
}

/* Hero pumpkin: decoration plus a hint that a treat is hidden on the page */
.hw .hw-hero-pk { position: relative; margin-top: -38.5%; }
.hw .hw-hero-pk-img {
  display: block;
  width: 35.4%;
  height: auto;
  margin-left: 21.9%;
  transform-origin: 50% 90%;
  animation: hw-wiggle 5s ease-in-out infinite;
}
.hw .hw-hero-pk-hint {
  position: absolute;
  left: calc(57.3% + 12px);
  top: 34%;
  max-width: 170px;
  margin: 0;
  padding: 7px 12px;
  border-radius: 12px;
  background: rgba(238, 238, 224, 0.14);
  color: var(--hw-cream);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}

/* Hidden treat: a pumpkin in the myths section reveals the promo code.
   Default (phones, tablets, no script): it sits below the last myth.
   Desktop with the flashlight: it hides in the dark bottom-left margin (see the media query below). */
.hw .hw-treat { position: relative; width: 76px; margin-top: 28px; }
.hw .hw-treat-btn {
  position: relative;
  display: block;
  width: 100%;
  list-style: none;
  cursor: pointer;
  border-radius: 50%;
}
.hw .hw-treat-btn::-webkit-details-marker { display: none; }
.hw .hw-treat-btn:focus-visible { outline: 3px solid var(--hw-orange); outline-offset: 6px; }
.hw .hw-treat-pumpkin {
  display: block;
  width: 100%;
  height: auto;
  transform-origin: 50% 90%;
  filter: grayscale(1) brightness(1.12) contrast(0.95);
  animation: hw-wiggle 5s ease-in-out infinite;
  transition: filter 0.25s ease;
}
/* Hover: the pumpkin hops, wobbles and glows, and an "Open me" tip appears */
.hw .hw-treat-btn:hover .hw-treat-pumpkin,
.hw .hw-treat-btn:focus-visible .hw-treat-pumpkin {
  filter: grayscale(1) brightness(1.4) contrast(0.95) drop-shadow(0 0 12px rgba(238, 238, 224, 0.65));
  animation: hw-hop 0.8s ease-in-out infinite;
}
.hw .hw-treat[open] .hw-treat-pumpkin { animation: none; }
.hw .hw-treat-tip {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 4px);
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(238, 238, 224, 0.16);
  color: var(--hw-cream);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  white-space: nowrap;
  opacity: 0;
  transform: translate(-50%, 6px);
  transition: opacity 0.2s ease, transform 0.2s ease;
  pointer-events: none;
}
.hw .hw-treat-btn:hover .hw-treat-tip,
.hw .hw-treat-btn:focus-visible .hw-treat-tip { opacity: 1; transform: translate(-50%, 0); }
.hw .hw-treat[open] .hw-treat-tip { display: none; }
@keyframes hw-hop {
  0%, 100% { transform: translateY(0) rotate(0) scale(1.1); }
  25% { transform: translateY(-9px) rotate(-7deg) scale(1.12); }
  50% { transform: translateY(0) rotate(0) scale(1.1); }
  75% { transform: translateY(-6px) rotate(6deg) scale(1.12); }
}
.hw .hw-treat-card {
  position: relative;
  width: min(340px, calc(100vw - 40px));
  margin-top: 12px;
  padding: 18px 20px;
  border: 2px dashed var(--hw-orange);
  border-radius: 16px;
  background: var(--hw-cream);
  color: var(--hw-ink);
  animation: hw-pop 0.25s ease-out;
}
.hw .hw-treat-title {
  margin: 0 0 4px;
  font-size: 19px;
  line-height: 1.3;
  font-weight: 800;
  color: var(--hw-indigo);
}
.hw .hw-treat-text {
  margin: 0 0 12px;
  font-size: 15px;
  line-height: 1.5;
}
.hw .hw-treat-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.hw .hw-treat-code {
  padding: 6px 12px;
  border: 2px dashed var(--hw-indigo);
  border-radius: 10px;
  background: #fff;
  color: var(--hw-indigo);
  font-family: inherit;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0.06em;
  user-select: all;
}
.hw .hw-treat-copy {
  padding: 9px 16px;
  border: 0;
  border-radius: 999px;
  background: var(--hw-orange);
  color: var(--hw-deep);
  font-family: inherit;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
  cursor: pointer;
}
.hw .hw-treat-copy[hidden] { display: none; }
.hw .hw-treat-copy:focus-visible { outline: 2px solid var(--hw-indigo); outline-offset: 3px; }
.hw .hw-treat-fine {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--hw-muted);
}
.hw .hw-treat-link {
  white-space: nowrap;
  color: var(--hw-indigo);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: var(--hw-orange);
  text-underline-offset: 3px;
}
@keyframes hw-wiggle {
  0%, 88%, 100% { transform: rotate(0); }
  91% { transform: rotate(-7deg); }
  94% { transform: rotate(6deg); }
  97% { transform: rotate(-3deg); }
}
@keyframes hw-pop {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: none; }
}

/* Sections and type */
.hw .hw-sec {
  position: relative;
  isolation: isolate;
  padding: 56px max(20px, calc((100% - 760px) / 2)) 0;
}
.hw .hw-intro { padding-top: 40px; }
.hw .hw-close { padding-bottom: 72px; }
.hw .hw-h2 {
  margin: 0 0 16px;
  font-size: clamp(26px, 3vw, 34px);
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--hw-indigo);
}
.hw .hw-h3 {
  margin: 0 0 10px;
  font-size: 21px;
  line-height: 1.3;
  font-weight: 700;
  color: var(--hw-indigo);
}
.hw .hw-p {
  margin: 0 0 16px;
  font-size: 17px;
  line-height: 1.7;
}
.hw .hw-note { color: var(--hw-muted); font-size: 15px; }
.hw .hw-list {
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}
.hw .hw-list li {
  position: relative;
  margin: 0 0 8px;
  padding-left: 28px;
  font-size: 17px;
  line-height: 1.6;
}
.hw .hw-list li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 0.55em;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--hw-orange);
}
.hw .hw-costumes {
  margin-top: 24px;
  padding: 4px 0 4px 20px;
  border-left: 4px solid var(--hw-orange);
}

/* Monster jump links */
.hw .hw-monsters {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-top: 28px;
  padding: 20px;
  border-radius: 16px;
  background: var(--hw-cream);
}
.hw .hw-monsters-title {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--hw-indigo);
}
.hw .hw-monsters-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.hw .hw-monsters-list li { margin: 0; }
.hw .hw-monster {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  background: #fff;
  color: var(--hw-indigo);
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.hw .hw-monster:hover,
.hw .hw-monster:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(37, 12, 119, 0.12);
}
.hw .hw-monster .hw-ico {
  flex: none;
  width: 30px;
  height: 30px;
  color: var(--hw-orange);
}
.hw .hw-monster span {
  display: flex;
  flex-direction: column;
  font-size: 15px;
  line-height: 1.3;
  font-weight: 600;
}
.hw .hw-monster b {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--hw-muted);
}

/* Myths: the haunted house, with a flashlight */
.hw .hw-myths-sec {
  overflow: hidden;
  margin-top: 56px;
  padding-top: 64px;
  padding-bottom: 64px;
  background:
    radial-gradient(ellipse 60% 22% at 50% 0%, rgba(123, 108, 181, 0.22), transparent 70%),
    #090420;
  color: var(--hw-cream);
}
.hw .hw-myths-sec .hw-h2 { color: #fff; }
.hw .hw-myths-sec .hw-p { color: rgba(238, 238, 224, 0.88); }
.hw .hw-torch-bar {
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0 4px;
  padding: 10px 12px 10px 16px;
  border: 1px solid rgba(238, 238, 224, 0.16);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.04);
}
.hw .hw-torch-hint {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-size: 15px;
  line-height: 1.4;
  font-weight: 600;
  color: var(--hw-cream);
}
.hw .hw-torch-ico { flex: none; width: 22px; height: 22px; color: var(--hw-orange); }
.hw .hw-torch-toggle {
  flex: none;
  padding: 8px 14px;
  border: 1px solid rgba(238, 238, 224, 0.4);
  border-radius: 999px;
  background: transparent;
  color: var(--hw-cream);
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  cursor: pointer;
}
.hw .hw-torch-toggle:hover { background: rgba(238, 238, 224, 0.1); }
.hw .hw-torch-toggle:focus-visible { outline: 2px solid var(--hw-orange); outline-offset: 3px; }

.hw .hw-haunt {
  --x: 50%;
  --y: 160px;
  --beam: circle 260px;
  position: relative;
}
.hw .hw-veil { display: none; }
/* The veil darkens the side margins only. Its mask leaves a clear window over the 760px myth column,
   so the myths are always readable. The beam (--x, --y) lights up whatever is lurking at the sides. */
.hw .hw-myths-sec.is-dark .hw-veil {
  display: block;
  position: absolute;
  inset: 0 -100vw -20px;
  z-index: 3;
  pointer-events: none;
  background: radial-gradient(
    var(--beam) at calc(var(--x) + 100vw) var(--y),
    rgba(255, 214, 150, 0.10) 0%,
    rgba(255, 214, 150, 0.04) 50%,
    rgba(9, 4, 32, 0) 60%,
    rgba(9, 4, 32, 0.98) 100%
  );
  -webkit-mask-image: linear-gradient(to right, #000 calc(100vw - 56px), transparent calc(100vw - 20px), transparent calc(100% - 100vw + 20px), #000 calc(100% - 100vw + 56px));
  mask-image: linear-gradient(to right, #000 calc(100vw - 56px), transparent calc(100vw - 20px), transparent calc(100% - 100vw + 20px), #000 calc(100% - 100vw + 56px));
  transition: opacity 0.4s ease;
}
.hw .hw-myths-sec.is-dark.is-lit .hw-veil { opacity: 0; }

/* Myth cards: light and always readable, on the dark section */
.hw .hw-myth {
  margin: 20px 0 0;
  padding: 24px 24px 8px;
  border: 1px solid rgba(238, 238, 224, 0.2);
  border-radius: 18px;
  background: #fff;
  color: var(--hw-ink);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
  scroll-margin-top: 110px;
}
.hw .hw-myth-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
}
.hw .hw-myth-ico {
  flex: none;
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: var(--hw-indigo);
  color: var(--hw-cream);
}
.hw .hw-myth-ico .hw-ico { width: 30px; height: 30px; }
.hw .hw-myth .hw-h3 { margin: 0; color: var(--hw-indigo); }
.hw .hw-myth-num {
  display: block;
  margin-bottom: 2px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--hw-orange);
}
.hw .hw-myth-claim {
  margin: 0 0 12px;
  padding: 12px 16px;
  border-radius: 12px;
  background: #F6F6EF;
  font-size: 17px;
  line-height: 1.6;
  font-style: italic;
  color: #4A4560;
}
.hw .hw-myth-truth {
  margin: 0 0 16px;
  font-size: 17px;
  line-height: 1.7;
  color: var(--hw-ink);
}
.hw .hw-myths-sec .hw-myth .hw-p { color: var(--hw-ink); }
.hw .hw-label {
  display: inline-block;
  margin-right: 10px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.5;
  text-transform: uppercase;
  vertical-align: 2px;
}
.hw .hw-label--myth { background: rgba(37, 12, 119, 0.08); color: var(--hw-indigo); }
.hw .hw-label--truth { background: var(--hw-indigo); color: #fff; }

/* Comparison table */
.hw .hw-table-wrap {
  margin: 8px 0 12px;
  border: 1px solid var(--hw-line);
  border-radius: 16px;
  overflow: hidden;
}
.hw .hw-table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
  font-size: 15px;
  line-height: 1.5;
}
.hw .hw-table thead th {
  padding: 14px 16px;
  border: 0;
  background: var(--hw-indigo);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-align: left;
}
.hw .hw-table tbody th,
.hw .hw-table td {
  padding: 14px 16px;
  border: 0;
  border-top: 1px solid rgba(37, 12, 119, 0.1);
  text-align: left;
  vertical-align: top;
}
.hw .hw-table tbody th {
  width: 24%;
  background: rgba(238, 238, 224, 0.55);
  color: var(--hw-indigo);
  font-weight: 700;
}

/* Steps */
.hw .hw-steps {
  margin: 8px 0 16px;
  padding: 0;
  list-style: none;
  counter-reset: hwstep;
}
.hw .hw-steps li {
  position: relative;
  min-height: 40px;
  margin: 0;
  padding: 0 0 6px 56px;
  counter-increment: hwstep;
}
.hw .hw-steps li::before {
  content: counter(hwstep);
  position: absolute;
  left: 0;
  top: -3px;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--hw-orange);
  color: var(--hw-deep);
  font-size: 17px;
  font-weight: 800;
}
.hw .hw-steps li:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 18px;
  top: 40px;
  bottom: 0;
  border-left: 2px dashed rgba(238, 100, 43, 0.45);
}
.hw .hw-steps b { color: var(--hw-indigo); }

/* CTA band */
.hw .hw-cta {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin: 64px 0 0;
  padding: 24px 28px;
  border-radius: 18px;
  background: linear-gradient(135deg, var(--hw-indigo), var(--hw-deep));
  color: var(--hw-cream);
}
.hw .hw-cta-title {
  margin: 0 0 4px;
  font-size: 20px;
  line-height: 1.3;
  font-weight: 800;
  color: #fff;
}
.hw .hw-cta-text {
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
  color: rgba(238, 238, 224, 0.85);
}
.hw .hw-btn {
  flex: none;
  display: inline-block;
  text-decoration: none;
}

/* FAQ */
.hw .hw-faq { border-top: 1px solid var(--hw-line); }
.hw .hw-faq-item { border-bottom: 1px solid var(--hw-line); }
.hw .hw-faq-q {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 18px 0;
  list-style: none;
  cursor: pointer;
  font-size: 18px;
  line-height: 1.4;
  font-weight: 700;
  color: var(--hw-indigo);
}
.hw .hw-faq-q::-webkit-details-marker { display: none; }
.hw .hw-faq-q::after {
  content: "+";
  flex: none;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--hw-cream);
  color: var(--hw-indigo);
  font-size: 20px;
  font-weight: 600;
  line-height: 1;
  transition: transform 0.2s ease, background-color 0.2s ease;
}
.hw .hw-faq-item[open] .hw-faq-q::after {
  transform: rotate(45deg);
  background: var(--hw-orange);
  color: var(--hw-deep);
}
.hw .hw-faq-q:focus-visible {
  outline: 2px solid var(--hw-orange);
  outline-offset: 4px;
  border-radius: 6px;
}
.hw .hw-faq-a { padding: 0 44px 6px 0; }

/* Closing */
.hw .hw-close-cta { position: relative; margin: 24px 0; }
.hw .hw-signoff {
  margin: 0 0 28px;
  font-size: 18px;
  line-height: 1.5;
  font-weight: 700;
  color: var(--hw-indigo);
}
.hw .hw-sources {
  margin: 0;
  padding-top: 16px;
  border-top: 1px solid var(--hw-line);
  font-size: 14px;
  line-height: 1.6;
  color: var(--hw-muted);
}

/* Halloween decorations (webs, spiders, ghosts) */
.hw .hw-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}
.hw .hw-deco {
  position: absolute;
  z-index: -1;
  display: block;
  height: auto;
  overflow: hidden;
  pointer-events: none;
}
.hw .hw-deco--hero-corner { left: -40px; top: -40px; width: 230px; color: var(--hw-cream); opacity: 0.16; }
.hw .hw-deco--hero-round { right: -150px; top: -150px; width: 400px; color: var(--hw-orange); opacity: 0.3; }
.hw .hw-deco--box-web { right: -48px; top: -48px; width: 150px; color: var(--hw-orange); opacity: 0.45; }
.hw .hw-deco--fall-spider {
  display: none;
  right: calc((100% - 760px) / 2 - 190px);
  top: 0;
  width: 110px;
  color: var(--hw-ink);
}
.hw .hw-deco--myth-web { right: -16px; top: -8px; width: 420px; color: var(--hw-cream); opacity: 0.14; transform: scaleX(-1); }
.hw .hw-deco--table-web { left: -12px; top: -6px; width: 300px; color: var(--hw-indigo); opacity: 0.12; }
.hw .hw-deco--faq-web { right: -12px; top: -12px; width: 320px; color: var(--hw-indigo); opacity: 0.1; transform: scaleX(-1); }
.hw .hw-deco--close-spider { right: 14%; top: -46px; width: 84px; }

.hw .hw-dangle { transform-origin: 50% 0; animation: hw-dangle 4.5s ease-in-out infinite; }
.hw .hw-float { animation: hw-float 7s ease-in-out infinite; }
.hw .hw-lurk--ghost-b.hw-float { animation-name: hw-float-flip; animation-delay: -3s; }
@keyframes hw-dangle {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(14px); }
}
@keyframes hw-float {
  0%, 100% { transform: translate(0, 0); }
  50% { transform: translate(8px, -14px); }
}
@keyframes hw-float-flip {
  0%, 100% { transform: scaleX(-1) translate(0, 0); }
  50% { transform: scaleX(-1) translate(8px, -14px); }
}

/* More ghosts and webs around the post */
.hw .hw-ghost { overflow: visible; }
.hw .hw-flip { transform: scaleX(-1); }
.hw .hw-flip.hw-float { animation-name: hw-float-flip; }
.hw .hw-deco--hero-ghost { right: 4%; bottom: -26px; width: 120px; opacity: 0.92; animation-delay: -2s; }
.hw .hw-deco--intro-ghost { display: none; left: calc((100% - 760px) / 2 - 200px); top: 30px; width: 130px; opacity: 0.9; animation-delay: -4s; }
.hw .hw-deco--fall-web { right: -50px; top: 24px; width: 130px; color: var(--hw-orange); opacity: 0.16; transform: rotate(12deg); }
.hw .hw-deco--table-ghost { display: none; right: calc((100% - 760px) / 2 - 190px); top: 150px; width: 120px; opacity: 0.9; animation-delay: -1s; }
.hw .hw-deco--steps-web { right: -12px; top: -6px; width: 280px; color: var(--hw-indigo); opacity: 0.09; transform: scaleX(-1); }
.hw .hw-deco--cta-ghost { right: 44px; top: -40px; width: 92px; }
.hw .hw-deco--faq-ghost { display: none; left: calc((100% - 760px) / 2 - 200px); top: 42%; width: 130px; opacity: 0.9; animation-delay: -5s; }
.hw .hw-deco--close-web { right: -12px; bottom: -6px; width: 300px; color: var(--hw-indigo); opacity: 0.09; transform: rotate(180deg); }
.hw .hw-deco--close-ghost { display: none; left: calc((100% - 760px) / 2 - 190px); top: 40px; width: 120px; opacity: 0.9; animation-delay: -3s; }

/* Lurkers: hidden in the side margins of the myths, only seen in the flashlight beam.
   They sit inside .hw-haunt under the dark veil, and disappear when the lights are on.
   Offsets are from the 760px text column. */
.hw .hw-lurk {
  display: none;
  opacity: 0;
  color: var(--hw-cream);
  transition: opacity 0.4s ease;
}
.hw .hw-myths-sec.is-dark .hw-lurk { opacity: var(--hw-o, 0.8); }
.hw .hw-lurk {
  --hw-spider-body: #7A68D4;
  --hw-spider-line: #EEEEE0;
  --hw-thread: #A69FD0;
}
.hw .hw-lurk.hw-ghost,
.hw .hw-deco--hero-ghost { filter: drop-shadow(0 0 14px rgba(238, 238, 224, 0.35)); }
.hw .hw-myths-sec.is-dark.is-lit .hw-lurk { opacity: 0; }
.hw .hw-lurk--web-1 { --hw-o: 0.55; left: -270px; top: 2%; width: 230px; transform: rotate(-14deg); }
.hw .hw-lurk--web-2 { --hw-o: 0.5; right: -320px; top: 10%; width: 300px; transform: scaleX(-1); }
.hw .hw-lurk--spider-1 { --hw-o: 0.95; right: -160px; top: 22%; width: 84px; }
.hw .hw-lurk--ghost-a { --hw-o: 0.95; left: -210px; top: 32%; width: 150px; }
.hw .hw-lurk--spider-2 { --hw-o: 0.95; left: -150px; top: 45%; width: 70px; }
.hw .hw-lurk--web-3 { --hw-o: 0.5; left: -300px; top: 57%; width: 270px; transform: rotate(-90deg); }
.hw .hw-lurk--ghost-b { --hw-o: 0.95; right: -190px; top: 67%; width: 130px; transform: scaleX(-1); }
.hw .hw-lurk--web-4 { --hw-o: 0.55; right: -270px; top: 82%; width: 220px; transform: rotate(18deg); }
.hw .hw-lurk--spider-3 { --hw-o: 0.95; left: -130px; top: 90%; width: 72px; }

@media (min-width: 1100px) and (hover: hover) and (pointer: fine) {
  .hw .hw-lurk { display: block; }
  .hw .hw-torch-bar:not([hidden]) { display: flex; }
  .hw .hw-myths-sec.is-dark .hw-treat {
    position: absolute;
    left: max(-240px, calc(16px - (100vw - 760px) / 2));
    bottom: 24px;
    width: 104px;
    margin: 0;
  }
  .hw .hw-myths-sec.is-dark .hw-treat-card {
    position: absolute;
    left: 0;
    bottom: calc(100% + 12px);
    z-index: 4;
    width: 330px;
    margin: 0;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
  }
  .hw .hw-myths-sec.is-dark.is-lit .hw-treat { visibility: hidden; }
}
@media not all and (min-width: 1100px) and (hover: hover) and (pointer: fine) {
  .hw .hw-myths-sec.is-dark .hw-veil { display: none; }
}
@media (min-width: 1100px) {
  .hw .hw-deco--fall-spider,
  .hw .hw-deco--intro-ghost,
  .hw .hw-deco--table-ghost,
  .hw .hw-deco--faq-ghost,
  .hw .hw-deco--close-ghost { display: block; }
  .hw .hw-deco--fall-web {
    right: auto;
    left: calc((100% - 760px) / 2 - 260px);
    top: auto;
    bottom: 10px;
    width: 230px;
    opacity: 0.22;
  }
}

/* Tablet */
@media (max-width: 860px) {
  .hw .hw-hero-grid { grid-template-columns: 1fr; gap: 24px; }
  .hw .hw-hero-side { justify-self: start; max-width: 240px; }
}

/* Phone */
@media (max-width: 720px) {
  .hw .hw-table-wrap { border: 0; border-radius: 0; overflow: visible; }
  .hw .hw-table,
  .hw .hw-table tbody,
  .hw .hw-table tr,
  .hw .hw-table tbody th,
  .hw .hw-table td { display: block; width: 100%; }
  .hw .hw-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .hw .hw-table tr {
    margin-bottom: 12px;
    border: 1px solid var(--hw-line);
    border-radius: 14px;
    overflow: hidden;
  }
  .hw .hw-table tbody th { border-top: 0; background: var(--hw-indigo); color: #fff; }
  .hw .hw-table td::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 4px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--hw-muted);
  }
}

@media (max-width: 600px) {
  .hw .hw-hero { padding: 48px 20px 40px; }
  .hw .hw-deco--hero-corner { width: 150px; }
  .hw .hw-deco--hero-round { right: -110px; top: -110px; width: 240px; }
  .hw .hw-deco--box-web { width: 110px; right: -36px; top: -36px; }
  .hw .hw-deco--myth-web { width: 230px; }
  .hw .hw-deco--table-web { width: 170px; opacity: 0.08; }
  .hw .hw-deco--faq-web { width: 180px; opacity: 0.08; }
  .hw .hw-deco--close-spider { right: 0; top: -40px; width: 66px; }
  .hw .hw-deco--hero-ghost { right: 8px; bottom: -18px; width: 86px; }
  .hw .hw-deco--steps-web { width: 160px; opacity: 0.08; }
  .hw .hw-deco--cta-ghost { right: 20px; top: -32px; width: 74px; }
  .hw .hw-deco--close-web { width: 170px; opacity: 0.08; }
  .hw .hw-hero-art { display: none; }
  .hw .hw-hero-pk { display: flex; align-items: center; gap: 12px; margin-top: 4px; }
  .hw .hw-hero-pk-img { width: 72px; margin-left: 0; }
  .hw .hw-hero-pk-hint { position: static; max-width: none; }
  .hw .hw-lede { font-size: 17px; }
  .hw .hw-sec { padding-top: 44px; }
  .hw .hw-p,
  .hw .hw-list li,
  .hw .hw-myth-claim,
  .hw .hw-myth-truth { font-size: 16px; }
  .hw .hw-monsters { padding: 16px; }
  .hw .hw-monsters-list { grid-template-columns: 1fr; }
  .hw .hw-myth { padding: 20px 18px 6px; }
  .hw .hw-myths-sec { padding-top: 48px; padding-bottom: 48px; }

  .hw .hw-cta { flex-direction: column; align-items: flex-start; padding: 22px 20px; }
  .hw .hw-faq-q { font-size: 17px; }
  .hw .hw-faq-a { padding-right: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .hw .hw-monster,
  .hw .hw-faq-q::after,
  .hw .hw-treat-pumpkin { transition: none; }
  .hw .hw-hero-pk-img,
  .hw .hw-treat-pumpkin,
  .hw .hw-treat-card,
  .hw .hw-dangle,
  .hw .hw-float,
  .hw .hw-treat-btn:hover .hw-treat-pumpkin,
  .hw .hw-treat-btn:focus-visible .hw-treat-pumpkin { animation: none; }
  .hw .hw-treat-tip { transition: none; }
}

@media print {
  .hw .hw-veil,
  .hw .hw-torch-bar { display: none; }
}