/* Moonlit, crooked storybook styling; content and controls stay upright. */
body{background:#100d1a;color:#f1e8d6;background-image:radial-gradient(ellipse at 8% 30%,#42265055,transparent 45%)}
:root{--orange:#d77b32}
.header{color:#f5ebd9}.header nav a{color:#d5c9db;font-size:12px}.header nav a:hover{color:#f5bd61}.moonbar{color:#d9bea3;border-bottom:1px solid #a38cac29}
.hero{isolation:isolate;min-height:700px;border-bottom:1px solid #e2b46b45}.hero>img:first-child{opacity:.42;filter:saturate(.65)}
.hero-jack-wash{background:radial-gradient(ellipse at 70% 35%,#755ba140,transparent 65%);backdrop-filter:none}
.hero .hero-jack{z-index:3;right:1%;bottom:0;width:min(50vw,690px);filter:drop-shadow(0 14px 28px #000b)}
.hero-shade{background:linear-gradient(90deg,#0e0b19f2 0%,#100c1acd 34%,transparent 67%),linear-gradient(0deg,#100d1a 0%,transparent 32%)}
.hero-copy{z-index:5}.hero h1{font-size:clamp(68px,7.6vw,108px);text-shadow:0 4px 22px #0009;transform:rotate(-2deg);transform-origin:left center}.hero h1 em{color:#f0d991}
.hero-copy>p:not(.kicker):not(.hero-note){max-width:490px}.hero .kicker{color:#d7bae5;letter-spacing:3px}.hero-note{color:#cdc0d1}
.spiral-scene{position:absolute;width:90%;height:auto;right:-10%;bottom:-2px;z-index:2;pointer-events:none}.postmark{z-index:6;right:3%;bottom:5%;background:#140e23b8;border-style:dashed;color:#efdaac}
.button{min-height:44px;box-shadow:4px 4px 0 #0005;border-radius:9px 2px 10px 3px;transition:transform .18s,box-shadow .18s}.button:hover:not(:disabled){transform:translateY(-3px);box-shadow:5px 7px 0 #0006}.button:focus-visible,a:focus-visible{outline:3px solid #eac979;outline-offset:5px}
.ticker{background:#21172e;color:#efd39a;border-block:1px solid #847096;position:relative}.ticker:after{content:'';display:block;height:7px;background:repeating-linear-gradient(110deg,#e7dfcf 0 12px,#17131f 12px 24px);position:absolute;bottom:0;width:100%;opacity:.65}
.intro h2,.promise h2{color:#f5eddb}.intro h2 em,.what-arrives h2 em{color:#c6a0d6}.kicker.dark{color:#eab571}.intro-copy>p:first-child,.promise>div>p:not(.kicker){color:#c4b9cd}.availability{color:#e6be87!important}
.products{gap:26px;padding-top:12px}.product-card{color:#eee5d6;background:linear-gradient(155deg,#30243e,#1c1627);border:1px solid #735679;border-radius:60px 8px 7px 7px;box-shadow:9px 12px 0 #05040966;padding-top:49px}.product-card:before{content:'';position:absolute;top:13px;left:22px;right:22px;height:5px;background:repeating-linear-gradient(110deg,#dfd6c2 0 10px,#161220 10px 19px);opacity:.5;border-radius:9px}
.product-card.letter-card{transform:rotate(-1deg);background:linear-gradient(155deg,#392a3d,#201829);color:#eee5d6}.product-card.bundle-card{border-color:#cc9654;background:radial-gradient(ellipse at top,#473048,#1a1222 70%)}.product-card>p:not(.kicker),.bundle-card>p:not(.kicker){color:#c9bdcf}.product-card li{border-color:#bdb0ce2b;font-size:12px}.product-card .kicker{font-size:10px}.product-icon{color:#ecc67a}.product-bottom strong{color:#f5d99e}.popular{top:-14px;right:18px;border-radius:3px;transform:rotate(2deg);font-size:8px}.product-card .button.dark{border-color:#b798bd;background:#45304e}
.conversation{background:radial-gradient(ellipse at 10% 45%,#543762,#251b35 65%);border-block:1px solid #ffffff14}.phone{transform:rotate(-4deg);border:8px solid #c9c0b3;background:linear-gradient(150deg,#221631,#09080f);box-shadow:12px 20px 0 #06040b66,0 0 80px #aa6ace20}.caller-moon{background:#eddfa5;box-shadow:0 0 40px #e5d78730;color:#30203f}.quote{border-style:dashed;border-color:#caa363;background:#130c2070}.fine{font-size:12px;color:#cab9d2}
.letter-stage{background:radial-gradient(ellipse at 60% 50%,#30213b,#100d1a 70%)}.letter-grid>.letter-card{background:repeating-linear-gradient(105deg,#f2e5cf 0 13px,#241929 13px 26px);padding:13px;border-radius:3px;box-shadow:17px 22px 0 #0005}.letter-inner{background:#f5ecd9;border:1px solid #b39c74}.what-arrives li>span{color:#c69ddb}
.how{background:linear-gradient(160deg,#292035,#171121);border-block:1px solid #604e703b}.steps article{border-top:2px dashed #826a93}.steps article>span{color:#e9c783}.promise-grid strong{color:#edc98b}.promise-grid p{color:#c4b9cd}.promise-art{border:1px solid #7c658a;background:#241b35 url('assets/spiral-hill.svg') 67% 100%/auto 100% no-repeat;border-radius:50% 48% 4px 4px;box-shadow:12px 15px 0 #08070d}.promise-art span,.promise-art i{display:none}
.last-call{background:radial-gradient(ellipse at bottom,#4a2b55,#110d1c 68%);border-top:8px solid transparent;border-image:repeating-linear-gradient(110deg,#d4c9b4 0 12px,#171020 12px 24px) 8}.last-call h2{transform:rotate(-2deg)}footer{background:#09070f}.legal{color:#b0a1b7}
dialog{color:#272033;border:2px solid #9f7faa;border-radius:18px 4px 18px 4px}dialog .dialog-head{position:sticky;top:0;background:#fff9ed;z-index:2;border-bottom:3px double #98789d}dialog .dialog-head button{min-width:44px;min-height:44px;color:#31213a}dialog .kicker.dark{color:#765185}dialog .button.dark{background:#3a244b}.form-intro{font-size:13px}dialog input,dialog textarea{font-size:16px}dialog::backdrop{background:#0b0717db}#form-message{color:#674077}
section[id]{scroll-margin-top:24px}
@media(max-width:800px){.header{height:auto;min-height:112px;flex-wrap:wrap;gap:12px;padding:16px 0}.header nav{display:flex;order:3;width:100%;justify-content:space-between;gap:12px;border-top:1px solid #9d80b033;padding-top:12px}.header nav a{font-size:11px;min-height:30px}.hero{height:870px;min-height:0}.hero .hero-jack{width:350px;max-width:87vw;top:12px;right:0;bottom:auto}.spiral-scene{width:900px;max-width:none;top:-25px;right:-190px;bottom:auto;opacity:.75}.hero-shade{background:linear-gradient(0deg,#100d1a 2%,#100d1af5 38%,#100d1a15 68%)}.hero-copy{padding-bottom:46px}.hero h1{font-size:64px}.hero-copy>p:not(.kicker):not(.hero-note){font-size:15px;max-width:470px}.hero-actions{gap:18px}.hero .kicker{font-size:9px;letter-spacing:2px}.hero-note{font-size:11px}.products{gap:30px}.product-card{padding-top:45px}.product-card.letter-card{transform:none}.promise-art{background-position:65% 100%}.phone{transform:rotate(-2deg)}.intro{padding-top:65px}dialog h2{font-size:36px}}
@media(max-width:420px){.hero{height:850px}.hero h1{font-size:59px}.hero-copy{padding-bottom:38px}.hero .hero-jack{right:0;width:320px;top:15px}.hero-actions{width:100%}.header .button{max-width:112px}.brand{font-size:17px}.choice{grid-template-columns:repeat(3,minmax(0,1fr))}.choice button{font-size:10px;padding:12px 4px}.promise h2{font-size:41px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}

/* Responsive content must determine height, including at enlarged text sizes. */
.hero{height:auto;min-height:700px}
.hero-copy{height:auto;min-height:700px;padding-block:90px}
.hero h1,.intro h2,.conversation h2,.what-arrives h2,.section-head h2,.promise h2,.last-call h2,dialog h2{line-height:1.08;transform:none;letter-spacing:-1.4px}
.hero h1{max-width:65%;font-size:clamp(64px,7.2vw,100px)}
.hero-actions{flex-wrap:wrap}
.products{grid-template-columns:repeat(3,minmax(0,1fr))}
.product-card{width:100%;min-width:0;margin:0;transform:none!important;padding:48px 28px 30px}
.product-card .kicker{min-height:34px;max-width:calc(100% - 45px);margin-bottom:16px}
.product-icon{position:absolute;top:43px;right:24px;float:none;margin:0;font-size:34px;line-height:1}
.product-card h3{font-size:36px;line-height:1.12;min-height:81px;margin-top:0}
.product-bottom{flex-direction:column;align-items:stretch;gap:18px}
.product-bottom .button{width:100%;min-height:48px}
.product-bottom small{font-size:9px;letter-spacing:.5px}
.popular{top:-15px;right:20px;max-width:calc(100% - 40px);transform:none;font-size:9px}
.phone{aspect-ratio:auto;padding-bottom:24px}
.letter-grid>.letter-card{min-width:0;transform:none}
.letter-inner{min-height:0;padding:36px 32px}
.letter-inner .signature{padding-right:0}
.wax{position:static;display:block;margin:24px 0 4px auto}
.dialog-head{gap:12px}.dialog-head>div{min-width:0}.dialog-head button{flex-shrink:0}
dialog h2{font-size:clamp(29px,5vw,44px)}
.town{padding-block:0 96px}.town-heading{max-width:680px;margin:0 auto 38px;text-align:center}
.town-heading h2{margin:0;font:500 clamp(40px,5vw,64px)/1.1 var(--serif);letter-spacing:-1px}
.town-heading h2 em{color:#cab0e3;font-weight:500}.town-heading>p:last-child{color:#c5b9cf;max-width:550px;margin:22px auto 0}
.town-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.town-card{position:relative;display:flex;flex-direction:column;min-width:0;padding:36px 28px 28px;border:1px solid #876d8c;border-radius:80px 80px 12px 12px;background:radial-gradient(ellipse at top,#513849,#201627 70%);overflow:hidden}
.town-card.zero{background:radial-gradient(ellipse at top,#384658,#171924 70%);border-color:#71869e}
.town-card.oogie{background:radial-gradient(ellipse at top,#424b33,#191e19 70%);border-color:#788461}
.town-number{font-size:8px;letter-spacing:1.4px;text-align:center;color:#e7cba8;margin:10px 0 22px}
.town-portrait{height:270px;display:flex;align-items:center;justify-content:center;margin:0 0 24px;background:radial-gradient(ellipse,#c3a1e32b,transparent 68%)}
.town-portrait img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 16px #0007)}
.town-card h3{margin:0;text-align:center;font:500 42px/1.15 var(--serif);color:#f7e9d0}
.town-card>p{color:#d1c4d7;margin:20px 0 28px;font-size:13px;line-height:1.8}
.town-question{display:flex;justify-content:space-between;gap:12px;align-items:center;text-align:left;margin-top:auto;padding:16px 0 4px;border:0;border-top:1px solid #cbb5d740;background:transparent;color:#f2d6a4;font-size:12px;min-height:48px}
.town-question:hover{color:#fff}.town-question:focus-visible{outline:3px solid #eac979;outline-offset:5px}.town-note{text-align:center;color:#bbacc6;font-size:11px;margin:24px 0 0}
@media(min-width:801px) and (max-width:1100px){.intro,.conversation-grid,.letter-grid,.promise{gap:40px}.products{gap:16px}.product-card{padding-inline:22px}.hero-copy>p:not(.kicker):not(.hero-note){max-width:48%}.hero h1{font-size:70px}.header{gap:18px}.header nav{gap:16px}.town-grid{gap:16px}.town-card{padding-inline:22px}}
@media(max-width:800px){.hero{height:auto;min-height:0}.hero-copy{min-height:0;padding-top:350px;padding-bottom:48px}.hero h1{max-width:100%;font-size:clamp(50px,9vw,68px)}.hero .hero-jack{top:0;width:340px;right:max(0px,calc((100% - 560px)/2))}.hero-shade{background:linear-gradient(0deg,#100d1a 0%,#100d1a 48%,#100d1a00 90%)}.products{grid-template-columns:1fr}.product-card{max-width:none}.product-card h3{min-height:0}.town-grid{grid-template-columns:1fr}.town-card{border-radius:36px 8px 8px;padding:26px}.town-number,.town-card h3{text-align:left}.town-number{margin:0 0 14px}.town-card>p{margin:14px 0 22px}.town{padding-bottom:65px}.letter-inner h3{font-size:38px}.promise-grid{gap:8px}.last-call h2{font-size:clamp(39px,8vw,60px)}}
@media(max-width:360px){.header .brand{font-size:15px}.header{gap:8px}.header .button{max-width:100px}.hero-copy{padding-top:325px}.hero .hero-jack{width:310px}.hero h1{font-size:49px}.letter-inner{padding:26px 20px}.product-card{padding-inline:24px}.dialog-head,dialog form{padding-inline:16px}}
