/* Sonder after dark. All changes are scoped to the optional Halloween mode. */
@font-face {
  font-family: 'Sonder After Dark';
  src: url('/fonts/instrument-serif-italic.woff2') format('woff2');
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

.shw-trigger {
  --shw-glow: #c997ff;
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  gap: 9px;
  min-height: 44px;
  padding: 11px 15px;
  border: 1px solid #c597ea80;
  border-radius: 10px;
  background: linear-gradient(180deg, #462755 0%, #2c1637 65%, #21122b 100%);
  color: #f4e6ff;
  box-shadow: inset 0 1px 0 #ecd5ff45, inset 0 -2px 0 #160b1e, 0 3px 0 #13091e, 0 7px 16px #08030c33;
  font: 600 12px/1.25 var(--svs-body, Arial, sans-serif);
  letter-spacing: -.01em;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.shw-trigger::after {
  content: '';
  position: absolute;
  pointer-events: none;
  inset: 3px;
  border: 1px solid #d9b6f512;
  border-radius: 7px;
}
.shw-trigger:hover {
  border-color: #e6c9ff;
  box-shadow: inset 0 1px 0 #ecd5ff60, inset 0 -2px 0 #160b1e, 0 4px 0 #13091e, 0 7px 22px #ae6ce03d;
  transform: translateY(-2px) rotate(-1deg);
}
.shw-trigger:active { transform: translateY(2px); box-shadow: inset 0 1px 0 #ecd5ff45, 0 1px 0 #13091e; }
.shw-trigger:focus-visible { outline: 2px solid #d6a4ff; outline-offset: 5px; }
.shw-eyes {
  display: inline-block;
  position: relative;
  flex: none;
  width: 24px;
  height: 15px;
  filter: drop-shadow(0 0 4px #b4ed9b35);
}
.shw-eyes::before, .shw-eyes::after {
  content: '';
  position: absolute;
  top: 3px;
  width: 9px;
  height: 10px;
  background: radial-gradient(ellipse at 57% 55%, #13091f 0 27%, transparent 30%), #eee1ff;
  border-radius: 55% 55% 48% 48%;
  transform: rotate(-12deg);
  transition: background-color .25s, transform .25s;
}
.shw-eyes::before { left: 1px; }
.shw-eyes::after { right: 1px; transform: rotate(12deg); }
.shw-trigger:hover .shw-eyes::before, .shw-trigger:hover .shw-eyes::after { background-color: #d6fa96; transform: translateY(-1px); }
.shw-trigger-mobile { display: none; }

/* The warning has its own atmosphere before the page changes. */
.shw-dialog {
  width: min(580px, calc(100vw - 36px));
  max-height: calc(100svh - 36px);
  overflow: auto;
  margin: auto;
  padding: 0;
  border: 1px solid #b69bcc52;
  border-radius: 25px;
  background: #160f21;
  color: #fff0dc;
  box-shadow: 0 35px 120px #000a, 0 0 90px #8a47b329;
  color-scheme: dark;
}
.shw-dialog::backdrop { background: #09070edb; backdrop-filter: blur(9px); }
.shw-card { position: relative; padding: 54px 44px 40px; overflow: hidden; text-align: center; background: radial-gradient(ellipse at 50% 0%, #643c663b, transparent 62%); }
.shw-card::before { content: ''; display: block; margin: 0 auto 28px; width: 64px; height: 30px; background: radial-gradient(ellipse at 29% 50%, #0e0914 0 6%, transparent 7%), radial-gradient(ellipse at 71% 50%, #0e0914 0 6%, transparent 7%), radial-gradient(ellipse at 25% 50%, #e1fbb4 0 18%, transparent 20%), radial-gradient(ellipse at 75% 50%, #e1fbb4 0 18%, transparent 20%); filter: drop-shadow(0 0 12px #ccff8970); }
.shw-card:has(> .shw-eyes)::before { display: none; }
.shw-card > .shw-eyes { display: block; width: 58px; height: 28px; margin: 0 auto 27px; filter: drop-shadow(0 0 12px #ccff8970); }
.shw-card > .shw-eyes::before, .shw-card > .shw-eyes::after { width: 22px; height: 22px; background-color: #e1fbb4; }
.shw-kicker { margin: 0 0 14px; color: #c6eda1; font: 400 10px/1.6 var(--svs-mono, monospace); letter-spacing: .17em; text-transform: uppercase; }
.shw-title, body.sonder-vibe-site .shw-dialog .shw-title { margin: 0; color: #fff0dc; font: 750 clamp(38px, 6vw, 62px)/1.08 var(--svs-body, Arial, sans-serif) !important; letter-spacing: -.035em; }
.shw-copy { max-width: 370px; margin: 22px auto 27px; color: #c7b7ce; font: 400 16px/1.65 var(--svs-body, Arial, sans-serif); }
.shw-footnote { margin: 23px auto 0; color: #ac99b6; font: 400 11px/1.6 var(--svs-body, Arial, sans-serif); }
.shw-sound-choice { display: flex; justify-content: center; align-items: center; gap: 10px; margin: 0 0 26px; color: #e5d4ed; font: 400 13px/1.5 var(--svs-body, Arial, sans-serif); cursor: pointer; }
.shw-sound-choice input { width: 18px; height: 18px; margin: 0; accent-color: #c9ee9d; }
.shw-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.shw-confirm, .shw-cancel {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 13px 23px;
  border-radius: 999px;
  border: 1px solid #bf98d14d;
  font: 600 14px/1.4 var(--svs-body, Arial, sans-serif);
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s, background .2s, box-shadow .2s;
}
.shw-confirm { background: #ffb16d; border-color: #ffb16d; color: #231122; box-shadow: inset 0 1px 0 #ffedc290, 0 5px 30px #ff822724; }
.shw-confirm:hover { background: #ffc998; transform: translateY(-2px); box-shadow: 0 7px 35px #ff82273d; }
.shw-cancel { background: transparent; color: #e5d4ed; }
.shw-cancel:hover { background: #ffffff0b; }
.shw-dialog :focus-visible { outline: 2px solid #d8fba5; outline-offset: 5px; }

/* A slow iris into the greeting, never a flash or strobe. */
.shw-reveal {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  border: 0;
  z-index: 20000;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 18px;
  overflow: hidden;
  padding: 24px;
  text-align: center;
  color: #ffe8cf;
  background: #0b0810;
  isolation: isolate;
  transition: opacity .5s ease;
}
.shw-reveal:not([open]) { display: none; }
.shw-reveal::backdrop { background: #0b0810; }
.shw-reveal[data-phase='leaving'] { opacity: 0; }
.shw-reveal-close { position: absolute; top: 42px; right: 43px; z-index: 2; min-width: 44px; min-height: 44px; padding: 10px 15px; border: 1px solid #d6b9e34d; border-radius: 999px; background: #261a32; color: #e5d4ed; font: 500 12px/1.3 var(--svs-body,Arial,sans-serif); cursor: pointer; }
.shw-reveal-close:hover { background: #3a2948; }
.shw-reveal-close:focus-visible { outline: 2px solid #d2f59b; outline-offset: 4px; }
.shw-reveal-title em { color: #ffb16d; font: inherit; }
.shw-reveal::before { content: ''; position: absolute; inset: -30%; z-index: -1; background: radial-gradient(ellipse at 50% 50%, #75417078 0, #38224574 22%, #0c081100 57%); transform: scale(.65); animation: shw-portal 1.8s cubic-bezier(.2,.75,.3,1) both; }
.shw-reveal::after { content: ''; position: absolute; inset: 25px; border: 1px solid #d6b9e326; border-radius: 2px; pointer-events: none; }
.shw-reveal-label { font: 400 11px/1.5 var(--svs-mono, monospace); text-transform: uppercase; letter-spacing: .22em; color: #c6eda1; }
.shw-reveal-title { max-width: 1080px; font: italic 400 clamp(76px, 13vw, 190px)/.88 'Sonder After Dark', Georgia, serif; letter-spacing: -.035em; text-wrap: balance; text-shadow: 0 0 55px #fd994f25; }
.shw-reveal[data-phase='opening'] .shw-reveal-title { opacity: 0; transform: translateY(20px); }
.shw-reveal[data-phase='greeting'] .shw-reveal-title { animation: shw-greeting .85s cubic-bezier(.16,.8,.3,1) both; }
@keyframes shw-portal { from { transform: scale(.65); opacity: .25; } to { transform: scale(1.15); opacity: 1; } }
@keyframes shw-greeting { from { opacity: 0; transform: translateY(25px) scale(.97); filter: blur(8px); } to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); } }

/* The season follows the visitor through the public site. */
html[data-sonder-halloween='on'] { background: #100b17; color-scheme: dark; --sv-peach: #100b17; --sv-ink: #f1e7db; --sv-purple: #2d1b3b; --sv-yellow: #ffb16d; --sv-green: #1c2b25; }
/* Keep the existing smooth curtain, tinted for the after-dark palette. */
html[data-sonder-halloween='on'] .sonder-page-transition,
html[data-sonder-halloween='on'].sonder-transition-arriving::after { filter: invert(1) hue-rotate(110deg) saturate(.7); }
html[data-sonder-halloween='on'] body.sonder-vibe-site {
  --svs-peach: #100b17;
  --svs-paper: #1a1224;
  --svs-ink: #f1e7db;
  --svs-purple: #2d1b3b;
  --svs-lime: #ffb16d;
  --svs-green: #1c2b25;
  --svs-blue: #18232f;
  --svs-muted: #d1c2d9;
  --svs-line: #cba4de3d;
  --svs-display: var(--svs-body, Arial, sans-serif);
  --cream-2: #1a1224;
  --surface-2: #261a31;
  --panel-2: #261a31;
  --bg-2: #261a31;
  --accent-wash: #302038;
  --line-2: #cba4de26;
  background: #100b17;
  color: #f1e7db;
}
html[data-sonder-halloween='on'] body.sonder-vibe-site ::selection { background: #e1f9b1; color: #180d22; }
html[data-sonder-halloween='on'] body.sonder-vibe-site :is(h1,h2,h3) { font-family: var(--svs-body, Arial, sans-serif) !important; font-style: normal; font-weight: 750; letter-spacing: -.035em; }
html[data-sonder-halloween='on'] body.sonder-vibe-site :is(h1,h2,h3) em { font-family: inherit !important; font-style: normal; font-weight: inherit; letter-spacing: inherit; }
html[data-sonder-halloween='on'] body.sonder-vibe-site :is(a,button,input,select,textarea,label,.sv-hero-enquiry-note) { font-family: var(--svs-body, Arial, sans-serif) !important; font-style: normal; }
html[data-sonder-halloween='on'] .sv-cinematic .sv-hero-enquiry-note { font-size: 14px !important; font-weight: 500; line-height: 1.55; }
html[data-sonder-halloween='on'] :is(a,button,input,summary,select,textarea):focus-visible { outline-color: #d2f59b !important; }
html[data-sonder-halloween='on'] body.sonder-vibe-site .svs-header,
html[data-sonder-halloween='on'] body.sonder-film-home .svs-header:not(.is-solid):not(.is-menu-open) { background: #110b18ed; color: #efe1f4; border-bottom-color: #cba4de30; }
html[data-sonder-halloween='on'] .svs-header .svs-logo-dark,
html[data-sonder-halloween='on'] .svs-footer .svs-logo-dark { display: none !important; }
html[data-sonder-halloween='on'] .svs-header .svs-logo-light,
html[data-sonder-halloween='on'] .svs-footer .svs-logo-light { display: block !important; }
/* A vampire grin and a fine cobweb haunt the original wordmark. */
html[data-sonder-halloween='on'] .svs-header .svs-brand { position: relative; isolation: isolate; }
html[data-sonder-halloween='on'] .svs-header .svs-brand > img { filter: drop-shadow(0 0 10px #f99b5538); }
html[data-sonder-halloween='on'] .svs-header .svs-brand::before { content: ''; position: absolute; z-index: 1; top: -2px; right: -3px; width: 26px; height: 26px; pointer-events: none; opacity: .8; background: repeating-radial-gradient(circle at 100% 0, transparent 0 6px, #dbc4ed70 6.5px 7px, transparent 7.5px 12px), linear-gradient(135deg, transparent 48%, #dbc4ed80 49% 51%, transparent 52%), linear-gradient(155deg, transparent 48%, #dbc4ed60 49% 51%, transparent 52%); clip-path: polygon(0 0,100% 0,100% 100%); }
html[data-sonder-halloween='on'] .svs-header .svs-brand::after { content: ''; position: absolute; z-index: 2; top: 50%; left: 19%; width: 9%; height: 0; margin-top: 6.5%; padding-top: 4%; pointer-events: none; background: #fff1dd; clip-path: polygon(0 0,100% 0,84% 100%,70% 0,30% 0,15% 100%); filter: drop-shadow(0 2px 4px #f99b5566); }
html[data-sonder-halloween='on'] .svs-footer-wordmark img { filter: brightness(0) invert(1) drop-shadow(0 0 24px #d496ff22); }
html[data-sonder-halloween='on'] .svs-dropdown-panel,
html[data-sonder-halloween='on'] .svs-mobile-panel { background: #1b1225; color: #f1e7db; box-shadow: 0 20px 50px #0006; border-color: #a77abe55; }
html[data-sonder-halloween='on'] .svs-dropdown-panel a:hover,
html[data-sonder-halloween='on'] .svs-mobile-panel a:hover { color: #ddf8ae; }
html[data-sonder-halloween='on'] .shw-trigger { color: #edfacb; border-color: #b8d98e80; background: linear-gradient(180deg, #354333, #1b261b); box-shadow: inset 0 1px 0 #efffc233, 0 3px 0 #080e09, 0 0 22px #a5de7120; }
html[data-sonder-halloween='on'] .shw-trigger .shw-eyes::before,
html[data-sonder-halloween='on'] .shw-trigger .shw-eyes::after { background-color: #deffa6; }

/* Hero: the supplied film sits underneath a moonlit, smoky layer. */
html[data-sonder-halloween='on'] body.sonder-film-home .sv-cinematic { --film-ink: #100b17; color: #fff1df; background: #100b17; }
html[data-sonder-halloween='on'] body.sonder-film-home .sv-cinematic .sv-hero-shade { background: linear-gradient(90deg, #0d0714ed 0%, #160c21b8 37%, #180b243d 75%, #100b174a), linear-gradient(0deg, #100b17 0%, #100b1710 42%, #140b216b 100%); }
html[data-sonder-halloween='on'] .sv-cinematic .sv-hero-copy { z-index: 2; }
html[data-sonder-halloween='on'] body.sonder-film-home .sv-cinematic h1 { color: #fff0dd; font-size: clamp(64px, 7.4vw, 118px); line-height: 1.01; letter-spacing: -.045em; text-shadow: 0 4px 36px #08040b80; }
html[data-sonder-halloween='on'] .sv-cinematic h1 em { color: #ffb16d; font-style: normal; }
html[data-sonder-halloween='on'] .sv-cinematic .sv-hero-eyebrow { color: #def4b7; font-family: var(--svs-mono); font-size: 10px; letter-spacing: .13em; text-transform: uppercase; }
html[data-sonder-halloween='on'] .sv-cinematic .sv-hero-eyebrow > span { background: #def4b7; }
html[data-sonder-halloween='on'] .sv-cinematic .sv-hero-description { color: #e4d4e5; }
html[data-sonder-halloween='on'] .sv-cinematic .sv-hero-enquiry-note { color: #c7b4d0 !important; }
html[data-sonder-halloween='on'] .sv-cinematic .sv-hero-foot { position: relative; z-index: 2; color: #e1d0e9; border-color: #bd91cd40; }
.shw-hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% center; pointer-events: none; filter: saturate(.8) contrast(1.06); }
.shw-scene { position: absolute; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; isolation: isolate; }
.shw-moon { position: absolute; top: 16%; right: 15%; width: clamp(90px, 13vw, 195px); aspect-ratio: 1; border-radius: 50%; opacity: .86; background: radial-gradient(ellipse at 38% 27%, #4d354435 0 8%, transparent 9%), radial-gradient(ellipse at 65% 66%, #5c384039 0 15%, transparent 16%), radial-gradient(ellipse at 24% 64%, #8c5d4722 0 10%, transparent 11%), radial-gradient(ellipse at 35% 35%, #fff9dc 0, #e7d2a6 53%, #bca286 92%); box-shadow: 0 0 40px #efd9b03b, 0 0 120px #dcc9ff24, inset -15px -4px 25px #4b2b4b80; transform: rotate(-18deg); }
.shw-moon::after { content: ''; position: absolute; inset: -14%; border: 1px solid #e9dbcc0c; border-radius: 50%; box-shadow: 0 0 0 35px #d9b3ed04; }
.shw-fog { position: absolute; left: -15%; right: -15%; bottom: -9%; height: 55%; background: radial-gradient(ellipse at 20% 55%, #b795d018, transparent 46%), radial-gradient(ellipse at 73% 75%, #d4e2bc10, transparent 48%); filter: blur(25px); animation: shw-fog 20s ease-in-out infinite alternate; }
.shw-fog::before { content: ''; position: absolute; inset: -30% 0; background: radial-gradient(ellipse at 80% 50%, #d1bdd612, transparent 40%); transform: rotate(-12deg); }
.shw-bat { position: absolute; top: 33%; right: 29%; width: 56px; height: 27px; background: #0c0713; clip-path: polygon(0 5%, 12% 21%, 24% 25%, 33% 46%, 41% 43%, 43% 10%, 50% 28%, 57% 10%, 59% 43%, 67% 46%, 76% 25%, 88% 21%, 100% 5%, 91% 63%, 75% 65%, 65% 83%, 54% 72%, 50% 100%, 46% 72%, 35% 83%, 25% 65%, 9% 63%); transform: rotate(-16deg); animation: shw-bat 7s ease-in-out infinite; opacity: .9; }
.shw-bat:nth-of-type(2), .shw-bat:nth-child(4) { top: 23%; right: 10%; width: 38px; height: 19px; animation-duration: 8.5s; animation-delay: -2s; transform: rotate(12deg); }
.shw-bat:nth-of-type(3), .shw-bat:nth-child(5) { top: 40%; right: 14%; width: 30px; height: 16px; animation-duration: 6s; animation-delay: -4s; transform: rotate(-9deg); }
.shw-eyes-pair { position: absolute; bottom: 24%; right: 8%; width: 45px; height: 14px; opacity: .65; background: radial-gradient(ellipse at 23% 50%, #d7fa9d 0 14%, transparent 19%), radial-gradient(ellipse at 77% 50%, #d7fa9d 0 14%, transparent 19%); filter: drop-shadow(0 0 7px #acfd7f80); animation: shw-eyes 12s ease-in-out infinite; }
@keyframes shw-fog { from { transform: translateX(-5%); opacity: .6; } to { transform: translateX(5%); opacity: 1; } }
@keyframes shw-bat { 0%,100% { translate: 0 0; } 50% { translate: -12px -11px; } }
@keyframes shw-eyes { 0%,30%,40%,78%,100% { opacity: .65; } 34%,37%,82%,85% { opacity: .06; } }

/* Orange enamel replaces the familiar purple metal. */
html[data-sonder-halloween='on'] body.sonder-film-home a.sv-liquid-cta[data-liquid-cta],
html[data-sonder-halloween='on'] body.sonder-vibe-site :is(.svs-button,.sv-oval,.btn-glow,.sg-button:not(.sg-button-outline),.sc-button,.lw-btn-life,.am-btn-solid,.sl-button-primary,.btn-form.primary) { color: #221021; background: #ffb16d; border-color: #ffc38b; text-shadow: none; box-shadow: inset 0 1px 0 #fff0c970, 0 5px 24px #ff83291a; }
html[data-sonder-halloween='on'] body.sonder-film-home a.sv-liquid-cta[data-liquid-cta]::after { background: radial-gradient(ellipse at var(--liquid-x) var(--liquid-y), #ffeac98c, transparent 66%), linear-gradient(180deg, #ffc288, #ff9b52 65%, #e68a47); box-shadow: inset 0 1px 0 #fff3dc90, inset 0 -2px 3px #95471977; }
html[data-sonder-halloween='on'] body.sonder-film-home a.sv-liquid-cta[data-liquid-cta]::before { box-shadow: inset 0 1px 0 #fff3dc90; }
html[data-sonder-halloween='on'] body.sonder-film-home a.sv-liquid-cta[data-liquid-cta]:hover,
html[data-sonder-halloween='on'] body.sonder-vibe-site :is(.svs-button,.sv-oval,.btn-glow,.sc-button):hover { color: #221021; background: #d4ef9f; box-shadow: 0 5px 30px #ff9d4338; }
html[data-sonder-halloween='on'] .sv-cinematic .sv-hero-secondary { color: #f4e3d3; }
html[data-sonder-halloween='on'] .swb-work .swb-arrow { background: #2d1c39; border-color: #a778be80; color: #d8f6ae; }

/* Content remains legible and recognisable, with a haunted material palette. */
html[data-sonder-halloween='on'] body.sv-page :is(.sv-clients,.sv-products,.sv-ecosystem,.sv-stories,.sv-about,.sv-wild,.ls-home,.swh-work) { color: #f1e7db; background: #100b17; border-color: #cba4de3d; }
html[data-sonder-halloween='on'] body.sv-page :is(.sv-benefits,.sv-orbit-scene) { background: #1b1225; color: #f1e7db; border-color: #cba4de3d; }
html[data-sonder-halloween='on'] body.sv-page .sv-banner { color: #f9e9d7; }
html[data-sonder-halloween='on'] body.sv-page .sv-banner-shade { background: linear-gradient(0deg, #150b228c, #160c2273); }
html[data-sonder-halloween='on'] body.sv-page :is(.sv-product,.sv-service-card,.sv-story-card,.sv-ecosystem-card) { background: #1a1224; color: #f1e7db; border-color: #cba4de3d; }
html[data-sonder-halloween='on'] body.sv-page :is(.sv-client,.sv-client-list,.sv-benefit-item,.sv-product-grid,.ls-home-links a,.sv-service-link) { border-color: #cba4de3d; }
html[data-sonder-halloween='on'] .sv-client-logo { background: #f4e9df; padding: 12px; border-radius: 8px; }
html[data-sonder-halloween='on'] body.sv-page :is(.sv-kicker,.swh-eyebrow,.sv-product-hint,.sv-section-note,.sv-section-top > p,.sv-ecosystem-intro) { color: #c3b0cd; }
html[data-sonder-halloween='on'] .sv-client-scope { color: #bfaec9; }
html[data-sonder-halloween='on'] :is(.swh-heading h2 em,.swh-card h3,.sv-statement,.svs-footer .svs-kicker) { color: #efbb91; }
html[data-sonder-halloween='on'] .swh-meta p { color: #c3b0cd; }
html[data-sonder-halloween='on'] :is(.swh-bottom a,.ls-home-links a) { color: #ede1f0; }
html[data-sonder-halloween='on'] :is(.swh-bottom,.swh-arrow) { border-color: #bd91cd40; }
html[data-sonder-halloween='on'] .swh-all { color: #221021; background: #ffb16d; border-color: #ffb16d; }
html[data-sonder-halloween='on'] .swh-categories a:is(:first-child,:last-child),
html[data-sonder-halloween='on'] .swh-categories a:hover { background: #33203e; color: #f1e7db; }
html[data-sonder-halloween='on'] .swh-label { color: #f1e7db; background: #24152f; border-color: #b894ca70; }
html[data-sonder-halloween='on'] .swh-soon { color: #221021; background: #d3f0a4; }
html[data-sonder-halloween='on'] .swh-project:hover .swh-arrow { color: #221021; background: #d3f0a4; }
html[data-sonder-halloween='on'] .sv-ecosystem-link > span { background: #ffffff0a; }
html[data-sonder-halloween='on'] .sv-ecosystem-card:hover .sv-ecosystem-link > span { color: #221021; background: #d3f0a4; }
html[data-sonder-halloween='on'] .sv-big-marquee { color: #e7c5f7; border-color: #cba4de3d; }
/* The work archive has its own fixed palette; keep labels legible after dark. */
html[data-sonder-halloween='on'] .sw-hero h1 em { color: #efbb91; font-style: normal; }
html[data-sonder-halloween='on'] :is(.sw-caption > p,.sw-collection-meta,.sw-note,.sw-outbound) { color: #c3b0cd; }
html[data-sonder-halloween='on'] .sw-ticker { color: #e7c5f7; background: #25172f; border-color: #cba4de3d; }
html[data-sonder-halloween='on'] :is(.sw-art-stamp,.sw-art-nikki span) { color: #221021; background: #d3f0a4; border-color: #d3f0a4; }
html[data-sonder-halloween='on'] :is(.sw-jump,.sw-collection-heading,.sw-toolbar,.sw-search,.sw-filters button) { border-color: #b393c459; }
html[data-sonder-halloween='on'] .sw-filters button { color: #efe1f4; }
html[data-sonder-halloween='on'] .sw-filters button[aria-pressed='true'] { color: #221021; background: #ffb16d; border-color: #ffb16d; }
html[data-sonder-halloween='on'] .sw-filters button:hover { color: #221021; background: #d3f0a4; }
html[data-sonder-halloween='on'] .sw-empty button { color: #221021; background: #ffb16d; }
html[data-sonder-halloween='on'] :is(.swh-category,.swh-badge,.swc-tooltip) { color: #ebf8d4; background: #263326; border-color: #8baa7080; }
html[data-sonder-halloween='on'] :is(.swh-categories a,.swh-all,.swh-closing,.swh-card-info,.sv-benefit-item,.sv-benefit-item:last-child) { border-color: #bd91cd40; }
html[data-sonder-halloween='on'] .sc-curio-art { filter: hue-rotate(38deg) saturate(.65) brightness(.78) drop-shadow(0 0 24px #a169d83b); }
html[data-sonder-halloween='on'] .sc-curio-iris { background: radial-gradient(ellipse at 49% 49%, #120a19 0 24%, transparent 27%), radial-gradient(circle, #f0ffbc, #b9e36c 45%, #4c6d39 76%); box-shadow: inset 0 0 10px #19320d, 0 0 18px #d4ff8c70; border-color: #b3cf8a; }
html[data-sonder-halloween='on'] .sc-curio-note { color: #c3b0cd; }
html[data-sonder-halloween='on'] .sc-curio-spark { background: #ffb16d; }
html[data-sonder-halloween='on'] .sv-product-controls button[aria-pressed='true'] { background: #ffb16d; color: #221021; }
html[data-sonder-halloween='on'] body.sonder-vibe-site .svs-footer { background: radial-gradient(ellipse at 15% 0%, #55316155, transparent 55%), #1c1127; color: #f1e7db; border-color: #cba4de3d; }
html[data-sonder-halloween='on'] :is(.svs-footer-grid,.svs-footer-bottom,.svs-footer-hello,.svs-footer-locations,.se-footer-lab) { border-color: #cba4de3d; }
html[data-sonder-halloween='on'] .se-footer-mark { color: #221021; background: #d3f0a4; border-color: #d3f0a4; }
html[data-sonder-halloween='on'] .se-work-callout { background: #261734; color: #f1e7db; border-color: #a77abe55; }
html[data-sonder-halloween='on'] body.sonder-vibe-site :is(input,select,textarea) { color: #f1e7db; background-color: #1b1424; border-color: #a77abe66; }
html[data-sonder-halloween='on'] body.sonder-vibe-site :is(input,textarea)::placeholder { color: #b9a8c2; opacity: 1; }

/* Contact keeps the same form behaviour, with a complete dark reading palette. */
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact { --svs-muted: #d5c8dd; --faint: #d5c8dd; --mut: #d5c8dd; --accent: #ffbd86; --accent-ink: #231122; font-size: 17px; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .left { background: radial-gradient(ellipse at 10% 0%, #48274150, transparent 65%), #160f20; border-color: #81638f; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .right { background: #1b1425; border-color: #81638f; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .left h1 { font-size: clamp(36px, 4.4vw, 62px); line-height: 1.12; letter-spacing: -.035em; color: #fff2e5; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .question-title { font-size: clamp(26px, 2.8vw, 36px); line-height: 1.2; letter-spacing: -.025em; color: #fff2e5; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(.left p,.question-sub,.path-copy,.estimate-line,.bullets,.success p,.quick-success p) { color: #ded3e4; font-family: var(--svs-body); font-size: 16px; line-height: 1.65; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(.micro,.path-note,.hint,.muted,.progress-label,.estimate-kicker,.left-act small) { color: #d5c8dd; font-family: var(--svs-body); font-size: 13px; line-height: 1.6; letter-spacing: .01em; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .left-act { color: #fff2e5; background: #2a1b36; border-color: #81638f; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .left-act:hover { background: #372344; border-color: #d5a4f2; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(.left-act b,.path-title) { color: #fff2e5; font-family: var(--svs-body); font-size: 17px; font-weight: 700; line-height: 1.4; letter-spacing: -.01em; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .left-act.is-primary { border-left-color: #ffbd86; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .left-act.is-primary b { color: #ffce9d; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .field label { color: #f2e8f7; font: 650 15px/1.5 var(--svs-body); letter-spacing: 0; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .field label .muted { color: #c8b7d3; font-size: 13px; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),textarea,select) { color: #fff2e5; background-color: #120d1b; border-color: #9478a3; font: 400 16px/1.55 var(--svs-body); }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(input,textarea)::placeholder { color: #c9b9d3; opacity: 1; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(input,textarea,select):focus { border-color: #d6a4ff; outline: 2px solid #d6a4ff; outline-offset: 2px; box-shadow: 0 0 0 5px #a478c523; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .field select option { color: #fff2e5; background: #1b1425; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(.path-card,.choice,.chip,.estimate-box) { color: #f3e9f8; background: #22162d; border-color: #9478a3; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(.path-card,.choice,.chip):hover { color: #fff2e5; background: #352342; border-color: #d6a4ff; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(.choice,.chip).active { color: #25132b; background: #e6c7f7; border-color: #e6c7f7; box-shadow: inset 0 0 0 1px #e6c7f7; font-weight: 650; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(.choice,.chip).active :is(b,strong,span) { color: inherit; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .progress-track { background: #493354; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .progress-bar { background: linear-gradient(90deg,#c395ed,#ffbd86); }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .estimate-range { color: #ffce9d; font-family: var(--svs-body); font-weight: 750; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .error { color: #ffb9ac; font: 500 14px/1.6 var(--svs-body); }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(.success,.quick-success) { color: #f3e9f8; background: #192b24; border-color: #91b790; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(.success,.quick-success) :is(h3,a) { color: #d6f1b1; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(.muted,.hint,.micro,#quickFallback) a { color: #e1b7ff; text-decoration: underline; text-underline-offset: 3px; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .quick-wrap form > .muted { margin-top: 14px; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .controls { background: #1b1425; border-color: #81638f; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(.btn-form.primary,.btn-form.primary:hover) { color: #231122; background: #ffbd86; border-color: #ffbd86; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact :is(.btn-form.secondary,.controls .btn-form.secondary) { color: #f3e9f8; background: #2a1b36; border-color: #9478a3; }
html[data-sonder-halloween='on'] body.sonder-vibe-site.sp-contact .btn-form.secondary:hover { color: #fff2e5; background: #372344; border-color: #d6a4ff; }

.shw-toolbar { position: fixed; z-index: 110; left: 20px; bottom: 18px; display: flex; align-items: center; gap: 7px; max-width: calc(100vw - 40px); padding: 7px 8px 7px 15px; border: 1px solid #b393c459; border-radius: 999px; color: #e9ddf0; background: #170e22f2; box-shadow: 0 8px 28px #0005; backdrop-filter: blur(14px); }
.shw-mode-label { display: flex; align-items: center; gap: 8px; margin-right: 5px; font: 400 9px/1.4 var(--svs-mono, monospace); letter-spacing: .05em; text-transform: uppercase; }
.shw-mode-label::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #d5f6a4; box-shadow: 0 0 9px #d5f6a488; }
.shw-toolbar button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 36px; padding: 7px 11px; border: 1px solid #b393c430; border-radius: 999px; background: #2b1d37; color: #e9ddf0; font: 500 11px/1.4 var(--svs-body, Arial, sans-serif); cursor: pointer; }
.shw-toolbar button:hover { background: #42304f; color: #fff0db; }
.shw-toolbar svg { width: 15px; height: 15px; flex: none; }
.shw-toolbar button:focus-visible { outline: 2px solid #d2f59b; outline-offset: 3px; }
.shw-trigger[hidden], .shw-dialog[hidden], .shw-reveal[hidden], .shw-toolbar[hidden], .shw-scene[hidden], .shw-hero-video[hidden] { display: none !important; }

/* Fit the invitation into the existing header, including at tablet widths. */
@media (min-width: 861px) and (max-width: 1200px) {
  .svs-header:has(.shw-trigger) .svs-header-inner { grid-template-columns: 1fr auto 1.2fr; gap: 15px; padding-inline: 24px; }
  .svs-header:has(.shw-trigger) .svs-header-right { gap: 12px; font-size: 13px; min-width: max-content; }
  .svs-header:has(.shw-trigger) .svs-desktop-nav { gap: 15px; font-size: 13px; }
  .svs-header:has(.shw-trigger) .svs-brand { width: 166px; }
  .svs-header:has(.shw-trigger) .shw-trigger { padding-inline: 11px; font-size: 11px; gap: 6px; }
  .svs-header:has(.shw-trigger) .svs-header-right .svs-button { padding-inline: 16px; font-size: 13px; }
}
@media (max-width: 860px) {
  .svs-header-inner:has(> .shw-trigger-mobile) { grid-template-columns: minmax(0,1fr) auto auto; gap: 13px; padding-inline: 20px; }
  .shw-trigger-mobile { display: inline-flex; grid-column: 2; grid-row: 1; justify-self: end; font-size: 10px; padding: 9px 10px; gap: 7px; }
  .svs-header-inner:has(> .shw-trigger-mobile) .svs-brand { width: min(160px, 100%); }
  .svs-header-inner:has(> .shw-trigger-mobile) .svs-mobile-menu { grid-column: 3; }
  .svs-mobile-panel .shw-trigger { width: 100%; max-width: 235px; font-size: 13px; }
  html[data-sonder-halloween='on'] body.sonder-film-home .sv-cinematic h1 { font-size: clamp(60px, 9.2vw, 92px); line-height: 1.02; }
  .shw-moon { right: 11%; top: 19%; width: 130px; }
  .shw-bat { top: 25%; right: 45%; width: 45px; height: 23px; }
}
@media (max-width: 700px) {
  html[data-sonder-halloween='on'] body.sonder-film-home .sv-cinematic .sv-hero-shade { background: linear-gradient(180deg, #140b2145 0%, #140b2129 23%, #100b17b8 43%, #100b17f0 66%, #100b17 100%); }
  html[data-sonder-halloween='on'] body.sonder-film-home .sv-cinematic .sv-hero-copy { padding-top: clamp(165px, 26svh, 265px); }
  html[data-sonder-halloween='on'] body.sonder-film-home .sv-cinematic h1 { font-size: clamp(48px, 12.2vw, 80px); line-height: 1.04; letter-spacing: -.04em; }
  html[data-sonder-halloween='on'] .sv-cinematic .sv-hero-description { font-size: 16px; max-width: 340px; }
  .shw-hero-video { object-position: 65% center; }
  .shw-moon { top: 15%; right: 14%; width: 105px; }
  .shw-bat:nth-of-type(2), .shw-bat:nth-child(4) { top: 20%; right: 8%; }
  .shw-bat:nth-of-type(3), .shw-bat:nth-child(5) { top: 28%; right: 21%; }
  .shw-eyes-pair { bottom: 40%; right: 8%; opacity: .4; }
  .shw-toolbar { left: 10px; bottom: 12px; max-width: calc(100vw - 72px); padding: 5px 6px 5px 10px; gap: 4px; }
  .shw-mode-label { font-size: 8px; letter-spacing: 0; gap: 5px; margin-right: 2px; }
  .shw-toolbar button { min-height: 40px; padding-inline: 9px; font-size: 10px; }
  .shw-card { padding: 38px 24px 28px; }
  .shw-copy { font-size: 15px; }
  .shw-title { font-size: 42px !important; }
  .shw-reveal-title { font-size: clamp(70px, 18vw, 120px); }
  .shw-reveal::after { inset: 14px; }
  .shw-reveal-close { top: 26px; right: 26px; }
}
@media (max-width: 390px) {
  .svs-header-inner:has(> .shw-trigger-mobile) { padding-inline: 15px; gap: 10px; }
  .svs-header-inner:has(> .shw-trigger-mobile) .svs-brand { width: 112px; }
  .shw-trigger-mobile { padding-inline: 8px; gap: 5px; font-size: 9px; }
  .shw-trigger-mobile .shw-eyes { width: 21px; }
  .shw-toolbar { max-width: calc(100vw - 65px); }
  .shw-mode-label { max-width: 62px; }
  .shw-actions { flex-direction: column; }
  .shw-confirm,.shw-cancel { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  :is(.shw-trigger,.shw-reveal,.shw-reveal-title,.shw-scene,.shw-toolbar,.shw-dialog),
  :is(.shw-trigger,.shw-reveal,.shw-scene,.shw-dialog) *,
  :is(.shw-trigger,.shw-reveal,.shw-scene,.shw-dialog)::before,
  :is(.shw-trigger,.shw-reveal,.shw-scene,.shw-dialog)::after { animation: none !important; transition: none !important; }
  .shw-trigger:hover, .shw-trigger:active, .shw-confirm:hover { transform: none; }
  .shw-reveal[data-phase='greeting'] .shw-reveal-title { opacity: 1; transform: none; filter: none; }
}
body:is(.motion-paused,.reduced-motion,.svs-motion-paused) :is(.shw-bat,.shw-fog,.shw-eyes-pair,.shw-reveal-title),
body:is(.motion-paused,.reduced-motion,.svs-motion-paused) .shw-reveal::before,
html[data-motion='paused'] :is(.shw-bat,.shw-fog,.shw-eyes-pair,.shw-reveal-title) { animation: none !important; }
