:root{--paper:#f6ecd8;--paper2:#efe0c3;--ink:#2b2118;--ink2:#5a4636;--a:#c4502a;--a-d:#9e3b1c;--b:#e0a33a;--c:#4e5a2b;--c-l:#d9dcc0;
  --display:"Fraunces",Georgia,serif;--body:"Figtree",system-ui,sans-serif;--ease:cubic-bezier(.22,1,.36,1);--dial:-50deg}
[data-season="thanksgiving"]{--paper:#f4e6d4;--paper2:#ead2b6;--a:#9c2f3a;--a-d:#7a2029;--b:#d08a2e;--c:#6a4a2a;--c-l:#e6d3b9}
[data-season="christmas"]{--paper:#eef0e6;--paper2:#dde3d2;--a:#b5313a;--a-d:#8e222a;--b:#c9a34a;--c:#24503b;--c-l:#cfdccd}
*{box-sizing:border-box}
html{overflow-x:clip;scroll-behavior:smooth;scrollbar-color:var(--a) var(--paper)}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.05rem/1.6 var(--body);transition:background .5s var(--ease);overflow-x:clip}
::selection{background:var(--b);color:var(--ink)}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-underline-offset:.25em;text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--a);outline-offset:3px;border-radius:6px}
h1,h2,h3{font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 1;margin:0;text-wrap:balance;line-height:1}
p{margin:0 0 1em}
.defs{position:absolute}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:var(--paper);padding:10px 16px;border-radius:8px;z-index:50}.skip:focus{top:12px}

.top{display:flex;align-items:center;gap:2rem;padding:22px clamp(18px,5vw,64px);position:relative;z-index:5}
.logo{display:flex;align-items:center;gap:.6rem;text-decoration:none;font:700 1.05rem/1.05 var(--display);font-variation-settings:"SOFT" 100}
.logo-leaf{width:36px;height:36px;fill:var(--a);transition:transform .8s var(--ease),fill .5s}
.logo:hover .logo-leaf{transform:rotate(72deg)}
.top nav{margin-left:auto;display:flex;gap:1.6rem;font-weight:600;font-size:.95rem}
.top nav a{text-decoration:none;background:linear-gradient(var(--b),var(--b)) 0 100%/0 .35em no-repeat;transition:background-size .4s var(--ease)}
.top nav a:hover{background-size:100% .35em}
.nav-buy{padding:.5em 1.1em;border-radius:999px;background:var(--ink)!important;color:var(--paper)}

/* hero */
.hero{position:relative;overflow-x:clip;overflow-y:visible;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);grid-template-areas:"w p" "d p" "f f";gap:0 3rem;padding:2vh clamp(18px,5vw,64px) 0}
.lobe{position:absolute;right:-6vw;top:-90px;width:min(56vw,820px);z-index:0}
.lobe path{fill:var(--a);transition:fill .5s var(--ease)}
.hero-words{grid-area:w;position:relative;z-index:2;padding-top:3vh}
h1{font-size:clamp(2.6rem,6vw,5.2rem);font-weight:800;letter-spacing:-.025em;font-variation-settings:"SOFT" 100,"WONK" 1,"opsz" 144}
h1 .big{display:block;font-size:1.32em;font-weight:900;line-height:.95;margin-top:.05em}
.sw{color:var(--a);display:inline-block;font-style:italic;transition:color .5s}
.sw.pop{animation:pop .6s var(--ease)}
@keyframes pop{0%{transform:translateY(.25em) rotate(-4deg);opacity:0}100%{transform:none;opacity:1}}
.caption{font:italic 500 1.35rem/1.3 var(--display);color:var(--c);margin:1.2rem 0 .8rem;transition:color .5s}
.intro{max-width:34rem;color:var(--ink2)}
.act{display:flex;align-items:center;flex-wrap:wrap;gap:1rem 1.6rem;margin:1.6rem 0 .6rem}
.buy{display:inline-flex;align-items:center;gap:.9rem;padding:.95rem 1.1rem .95rem 1.5rem;border-radius:999px;background:var(--ink);color:var(--paper);text-decoration:none;font-weight:700;
  box-shadow:0 10px 18px -10px rgba(43,33,24,.7);transition:transform .35s var(--ease),box-shadow .35s}
.buy b{background:var(--b);color:var(--ink);padding:.3em .75em;border-radius:999px}
.buy:hover{transform:translateY(-3px) rotate(-1deg);box-shadow:0 16px 24px -12px rgba(43,33,24,.7)}
.peek{font-weight:600}
.small{font-size:.86rem;color:var(--ink2)}
.hero-pack{grid-area:p;position:relative;z-index:2;margin:3vh 0 0;align-self:start;transform:rotate(3deg);transition:transform .8s var(--ease)}
.hero-pack img{border-radius:18px;box-shadow:0 30px 50px -24px rgba(43,33,24,.55)}
.hero-pack:hover{transform:rotate(1deg) scale(1.01)}
.hero-pack figcaption{display:inline-block;margin-top:.9rem;font-size:.82rem;font-weight:600;color:var(--ink);background:var(--paper);padding:.35em .9em;border-radius:999px;transform:rotate(-3deg)}
.dial-wrap{grid-area:d;position:relative;z-index:2;display:flex;align-items:center;gap:1.4rem;margin:2.2rem 0 0}
.dial{position:relative;width:210px;height:210px;flex:0 0 auto}
.dial-face{position:absolute;inset:0}
.rim{fill:var(--paper2);stroke:var(--ink);stroke-width:2;transition:fill .5s}
.dial-txt{font:600 9.5px var(--body);letter-spacing:.24em;text-transform:uppercase;fill:var(--ink2)}
.pointer{transform-origin:100px 100px;transform:rotate(var(--dial));transition:transform .7s cubic-bezier(.34,1.56,.64,1)}
.pointer path{stroke:var(--a);stroke-width:6;stroke-linecap:round}.pointer circle{fill:var(--ink)}
.dial button{position:absolute;font:700 .78rem var(--body);border:2px solid var(--ink);background:var(--paper);color:var(--ink);border-radius:999px;padding:.35em .8em;cursor:pointer;transition:background .3s,color .3s,transform .3s var(--ease)}
.dial button:hover{transform:translateY(-2px)}
.dial button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.s-fall{left:-14px;top:22px}.s-thx{left:50%;top:-14px;transform:translateX(-50%)}.s-thx:hover{transform:translate(-50%,-2px)}.s-xmas{right:-18px;top:22px}
.status{max-width:16rem;font-size:.9rem;color:var(--a-d);font-weight:600;margin:0}
.facts{grid-area:f;position:relative;z-index:2;list-style:none;display:flex;flex-wrap:wrap;gap:.6rem 1rem;padding:0;margin:3.5rem 0 0}
.facts li{font:600 .9rem var(--body);padding:.5em 1em;border-radius:999px;background:var(--paper2);transition:background .5s}
.facts li:nth-child(2){transform:rotate(-2deg)}.facts li:nth-child(3){transform:rotate(1.5deg)}

/* inside: a diagonal trail */
.inside{position:relative;padding:14vh clamp(18px,5vw,64px) 8vh;max-width:1320px;margin:0 auto}
.trail{position:absolute;inset:18vh 0 0 0;width:100%;height:calc(100% - 18vh);z-index:0;pointer-events:none}
.trail path{fill:none;stroke:var(--b);stroke-width:7;stroke-linecap:round;stroke-dasharray:2 18;transition:stroke .5s}
.inside h2{position:relative;font-size:clamp(2.4rem,5.2vw,4.4rem);font-weight:850;letter-spacing:-.02em;max-width:12ch}
.inside h2 i{color:var(--a);font-weight:700}
.inside-lede{position:relative;font:italic 1.2rem var(--display);color:var(--c);margin-top:.8rem}
.stop{position:relative;z-index:1;display:grid;align-items:center;gap:2rem;margin-top:6vh}
.stop figure{margin:0;position:relative}
.stop figure::before{content:"";position:absolute;inset:-6% -5% -4% -7%;z-index:-1;border-radius:58% 42% 55% 45%/48% 56% 44% 52%;background:var(--c-l);transition:background .5s,border-radius 1.2s var(--ease)}
.stop:hover figure::before{border-radius:44% 56% 42% 58%/56% 44% 56% 44%}
.stop img{border-radius:14px;box-shadow:0 26px 44px -26px rgba(43,33,24,.6)}
.stop h3{font-size:clamp(1.8rem,3vw,2.6rem);font-weight:800;margin-bottom:.4em}
.stop-t p{max-width:26rem;color:var(--ink2)}
.stop-1{grid-template-columns:minmax(0,7fr) minmax(0,4fr);margin-right:8%}
.stop-1 figure{transform:rotate(-2.5deg)}
.stop-2{grid-template-columns:minmax(0,4fr) minmax(0,5fr);margin-left:24%;margin-top:-2vh}
.stop-2 .stop-t{order:-1;text-align:right}.stop-2 .stop-t p{margin-left:auto}
.stop-2 figure{transform:rotate(3deg)}
.stop-3{grid-template-columns:minmax(0,6fr) minmax(0,4fr);margin-left:4%;margin-right:14%}
.stop-3 figure{transform:rotate(-1.5deg)}
.bundle{position:relative;z-index:2;width:310px;aspect-ratio:1;margin:-7vh 4% 0 auto;border-radius:50%;background:var(--b);display:grid;place-content:center;padding:2.6rem;transform:rotate(8deg);transition:background .5s}
.bundle>p{font:italic 700 1.25rem var(--display);margin:0 0 .4rem}
.bundle ul{list-style:none;padding:0;margin:0;font-size:.92rem;line-height:1.5}
.bundle b{font:900 1.15rem var(--display);display:inline-block;min-width:1.6em}

/* ritual */
.ritual{position:relative;padding:8vh clamp(18px,5vw,64px) 16vh;max-width:1320px;margin:0 auto}
.ritual h2{font-size:clamp(2.2rem,4.6vw,3.8rem);font-weight:850;text-align:center}
.ritual-lede{text-align:center;color:var(--ink2);margin:.8rem auto 0;max-width:30rem}
.steps{list-style:none;padding:0;margin:4rem 0 0;display:flex;justify-content:space-between;gap:3rem}
.steps li{flex:1;max-width:22rem}
.steps li:nth-child(2){margin-top:5rem}.steps li:nth-child(3){margin-top:10rem}
.steps h3{font-size:1.25rem;font-weight:700}
.steps h3 span{display:block;font-size:3.6em;font-weight:900;color:var(--a);letter-spacing:-.03em;line-height:.9;margin-bottom:.15em;transition:color .5s}
.steps p{color:var(--ink2);margin-top:.6em}

/* seasons on a hill */
.seasons{position:relative;background:var(--c);color:var(--paper);padding:0 0 22vh;transition:background .5s}
.hill{position:absolute;bottom:100%;left:0;width:100%;height:160px}
.hill path{fill:var(--c);transition:fill .5s}
.seasons-in{max-width:1240px;margin:0 auto;padding:2vh clamp(18px,5vw,64px) 0}
.seasons h2{font-size:clamp(2.2rem,4.6vw,3.8rem);font-weight:850;max-width:14ch}
.seasons-in>p{opacity:.9;margin-top:.8rem}
.windows{display:flex;align-items:flex-end;gap:clamp(16px,3vw,40px);margin-top:3.5rem}
.win{position:relative;flex:1;padding:4.2rem 1.6rem 1.8rem;border-radius:999px 999px 18px 18px;background:var(--paper);color:var(--ink);text-align:center;transition:transform .5s var(--ease),background .5s}
.win:hover{transform:translateY(-8px)}
.w-fall{min-height:25rem}.w-thx{min-height:21rem}.w-xmas{min-height:23rem}
.win svg{width:54px;height:54px;fill:var(--a);margin:0 auto 1rem;display:block}
.w-thx svg{fill:var(--b)}.w-xmas svg{fill:var(--c)}
.win h3{font-size:1.7rem;font-weight:800}
.win p{font-size:.92rem;color:var(--ink2);margin:.5em 0}
.soon{font:italic 700 1.1rem var(--display)!important;color:var(--a-d)!important}
.win-buy{display:inline-block;margin:.4rem 0 .6rem;font-weight:700;color:var(--a-d)}
.win button{display:block;margin:1rem auto 0;font:600 .85rem var(--body);background:none;border:0;border-bottom:2px dotted var(--ink2);color:var(--ink);cursor:pointer;padding:.2em 0}
.win button[aria-pressed="true"]{border-bottom-style:solid;border-color:var(--a)}

/* ticket */
.ticket-zone{position:relative;z-index:3;margin-top:-14vh;padding:0 clamp(18px,5vw,64px)}
.ticket{max-width:1040px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);background:var(--paper);color:var(--ink);border-radius:20px;transform:rotate(-1deg);
  box-shadow:0 30px 50px -24px rgba(0,0,0,.45);
  -webkit-mask:radial-gradient(circle 16px at 60% 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 16px at 60% 100%,#0000 98%,#000) bottom/100% 51% no-repeat;
          mask:radial-gradient(circle 16px at 60% 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 16px at 60% 100%,#0000 98%,#000) bottom/100% 51% no-repeat}
.t-left{padding:3rem 2.6rem}
.t-left h2{font-size:clamp(1.9rem,3.4vw,2.8rem);font-weight:850}
.t-sub{margin:1rem 0;color:var(--ink2)}
.t-left ul{padding:0;list-style:none;margin:0}
.t-left li{padding-left:1.8rem;position:relative;margin:.4rem 0}
.t-left li::before{content:"";position:absolute;left:0;top:.45em;width:.9rem;height:.9rem;border-radius:50% 50% 50% 0;background:var(--a);transform:rotate(-45deg)}
.t-right{padding:3rem 2.4rem;background-image:radial-gradient(circle,var(--ink2) 1.4px,transparent 1.6px);background-size:2px 12px;background-repeat:repeat-y;background-position:0 0}
.price{font:900 4.4rem/1 var(--display);letter-spacing:-.03em;color:var(--a);margin:0 0 .3rem}
.price span{font:600 .9rem var(--body);color:var(--ink2);margin-left:.4rem;letter-spacing:0}
.t-right .buy{margin:1rem 0}

/* faq */
.faq{max-width:1180px;margin:0 auto;padding:16vh clamp(18px,5vw,64px) 10vh;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:3rem}
.faq h2{font-size:clamp(2.2rem,4.4vw,3.6rem);font-weight:850;position:sticky;top:2rem;align-self:start}
.qs details{padding:1.1rem 0 1.1rem 0}
.qs details+details{border-top:0}
.qs summary{cursor:pointer;list-style:none;display:flex;gap:.9rem;align-items:baseline;font:700 1.3rem var(--display)}
.qs summary::-webkit-details-marker{display:none}
.qs summary::before{content:"";flex:0 0 auto;width:.8em;height:.8em;background:var(--a);-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><path d="M20 2l4 8 8-3-2 9 8 2-7 6 3 7-9-2-2 9-3-7-3 7-2-9-9 2 3-7-7-6 8-2-2-9 8 3z"/></svg>') center/contain no-repeat;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><path d="M20 2l4 8 8-3-2 9 8 2-7 6 3 7-9-2-2 9-3-7-3 7-2-9-9 2 3-7-7-6 8-2-2-9 8 3z"/></svg>') center/contain no-repeat;transition:transform .5s var(--ease)}
.qs details[open] summary::before{transform:rotate(144deg)}
.qs summary:hover{color:var(--a-d)}
.qs details p{margin:.7rem 0 0 1.7rem;color:var(--ink2);max-width:60ch}

/* free */
.free{padding:2vh clamp(18px,5vw,64px) 14vh;display:flex;justify-content:flex-start}
.moon{position:relative;width:min(760px,100%);margin-left:6%;padding:clamp(48px,6vw,80px) clamp(28px,6vw,90px);background:var(--b);border-radius:62% 38% 54% 46%/48% 54% 46% 52%;transition:background .5s}
.moon h2{font-size:clamp(2rem,3.8vw,3rem);font-weight:850}
.moon>p{margin:1rem 0 1.4rem;max-width:34rem}
.moon form{display:grid;gap:.7rem;max-width:30rem}
.moon label{font-weight:600;font-size:.95rem}.moon label span{font-weight:400}
.moon input[type=email]{font:inherit;padding:.85rem 1.1rem;border:2px solid var(--ink);border-radius:999px;background:var(--paper);color:var(--ink)}
.check{display:flex;gap:.7rem;font-weight:400!important;font-size:.88rem!important}
.check input{width:1.2rem;height:1.2rem;accent-color:var(--a);flex:0 0 auto;margin-top:.15em}
.moon button{justify-self:start;font:700 1rem var(--body);padding:.9rem 1.4rem;border:0;border-radius:999px;background:var(--ink);color:var(--paper);cursor:pointer;transition:transform .3s var(--ease)}
.moon button:hover{transform:translateY(-2px) rotate(-1deg)}
.form-msg{font-weight:600;margin:.3rem 0 0}

.foot{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2.4rem;padding:2.4rem clamp(18px,5vw,64px) 3rem;font-size:.9rem;color:var(--ink2)}
.foot p{margin:0}

@media (max-width:900px){
  .top nav a:not(.nav-buy){display:none}
  .hero{grid-template-columns:1fr;grid-template-areas:"w" "p" "d" "f"}
  .lobe{width:120vw;right:-40vw;top:auto;bottom:30%}
  .hero-pack{margin-top:2.4rem}
  .hero-pack figcaption{text-align:left;margin-left:0;color:var(--ink)}
  .dial-wrap{flex-direction:column;align-items:flex-start;margin-top:3rem;padding-left:16px}
  .stop,.stop-1,.stop-2,.stop-3{grid-template-columns:1fr;margin:7vh 0 0}
  .stop-2 .stop-t{order:0;text-align:left}.stop-2 .stop-t p{margin-left:0}
  .bundle{margin:4vh auto 0;width:280px}
  .steps{flex-direction:column;gap:2rem}.steps li{margin:0!important}.steps li:nth-child(2){margin-left:15%!important}.steps li:nth-child(3){margin-left:30%!important}
  .windows{flex-direction:column;align-items:stretch}.win{min-height:0!important}
  .ticket{grid-template-columns:1fr;transform:none;-webkit-mask:none;mask:none}
  .t-right{background-image:none;border-top:2px dashed rgba(43,33,24,.3)}
  .faq{grid-template-columns:1fr}.faq h2{position:static}
  .qs details:nth-child(even){margin-left:0}
  .moon{margin-left:0;border-radius:42px 64px 48px 70px}
}

.win-extra{display:flex;flex-direction:column;gap:.3rem;margin:.2rem 0 0!important}
.win-extra a{font-size:.85rem;font-weight:600;color:var(--ink);text-decoration-style:dotted}
/* party night */
.party{position:relative;max-width:1180px;margin:0 auto;padding:16vh clamp(18px,5vw,64px) 10vh;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:3rem;align-items:center}
.party-fig{position:relative;margin:0;transform:rotate(-3deg)}
.party-fig::before{content:"";position:absolute;inset:6% -4% -5% 4%;border-radius:46% 54% 40% 60%/55% 42% 58% 45%;background:var(--c-l);z-index:-1}
.party-fig img{border-radius:14px;box-shadow:0 26px 40px -26px rgba(0,0,0,.45)}
.party-kick{font:italic 700 1.1rem var(--display);color:var(--a-d);margin-bottom:.4rem}
.party-t h2{font-size:clamp(2.1rem,4.2vw,3.4rem);font-weight:850;margin-bottom:1rem}
.party-t>p{color:var(--ink2);max-width:34rem}
.party-meta{font-weight:700;color:var(--ink)!important}
.party-disc{position:absolute;right:4%;bottom:2vh;width:190px;aspect-ratio:1;border-radius:50%;background:var(--b);color:var(--ink);text-decoration:none;display:grid;place-content:center;text-align:center;padding:1.4rem;transform:rotate(-9deg);transition:transform .5s var(--ease),background .5s}
.party-disc:hover{transform:rotate(-2deg) scale(1.04)}
.party-disc span{font:italic 700 1.05rem var(--display)}
.party-disc b{font:900 2.4rem/1 var(--display)}
.party-disc small{font-size:.78rem;line-height:1.3;margin-top:.3rem}
@media (max-width:860px){.party{grid-template-columns:1fr;padding-top:10vh;gap:2rem}.party-disc{position:relative;right:auto;bottom:auto;margin:0 auto}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.inside,.seasons,.ticket-zone,.free{overflow-x:clip}
