*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:500 16px/1.5 var(--font-body);-webkit-font-smoothing:antialiased}
h1,h2{font-family:var(--font-display);font-weight:800;line-height:1;margin:0;text-transform:uppercase}
a{color:inherit}
section{padding:48px 18px;max-width:980px;margin:0 auto}
h2{font-size:clamp(28px,7vw,44px);margin-bottom:14px}
.lede{margin:0 0 18px}
.ph-note{background:#fff;border:2px dashed var(--melon);padding:8px 10px;font-size:13px;border-radius:8px}
.draft{background:none;outline:2px dashed var(--melon);outline-offset:3px;color:inherit}

/* buttons */
.btn{display:inline-block;background:var(--cta);color:var(--cta-ink);border:3px solid var(--shadow);border-radius:999px;padding:12px 20px;font:800 15px var(--font-accent);text-transform:uppercase;text-decoration:none;cursor:pointer;box-shadow:3px 3px 0 var(--shadow);transition:transform .12s,box-shadow .12s,background .12s;min-height:44px}
.btn:hover,.btn:focus-visible{background:var(--cta-hover);transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--shadow)}
.btn-small{padding:8px 12px;font-size:12px;min-height:40px;white-space:nowrap}
.btn-ghost{background:var(--floral);color:var(--ink)}.btn-ghost:hover{color:#fff}
.btn-dark{background:var(--shadow);color:#fff;border-color:var(--shadow)}
.btn[aria-disabled=true]{background:#d9d4c8;color:#555;box-shadow:none;pointer-events:none}

/* header */
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--floral);border-bottom:3px solid var(--shadow)}
.logo{text-decoration:none;margin-right:auto}
.logo-ph,.foot-logo{font:400 26px var(--font-display);-webkit-text-stroke:5px var(--shadow);paint-order:stroke fill;color:var(--carrot);letter-spacing:1px}
.logo-ph i,.foot-logo i{font-style:normal;color:var(--melon)}
.nav{display:none}
.nav a{font:700 14px var(--font-accent);text-transform:uppercase;text-decoration:none;margin:0 10px}
.nav a:hover{color:var(--sapphire)}
.menu summary{list-style:none;cursor:pointer;font:800 13px var(--font-accent);text-transform:uppercase;border:3px solid var(--shadow);border-radius:999px;padding:7px 12px}
.menu summary::-webkit-details-marker{display:none}
.menu{position:relative}
.menu div{position:absolute;right:0;top:46px;background:var(--floral);border:3px solid var(--shadow);border-radius:14px;display:grid;min-width:180px;box-shadow:4px 4px 0 var(--shadow)}
.menu div a{padding:12px 16px;text-decoration:none;font-weight:700}
@media(min-width:760px){.nav{display:block}.menu{display:none}}

/* hero */
.hero{position:relative;padding:0;max-width:none;background:var(--halftone),var(--bg);background-color:var(--floral);overflow:hidden}
.hero::after{content:"";position:absolute;inset:0;background:var(--grain);mix-blend-mode:multiply;opacity:.1;pointer-events:none}
.hero-in{position:relative;z-index:1;max-width:980px;margin:0 auto;padding:40px 18px 70px;text-align:center}
.squig{position:absolute;width:260px;fill:none;stroke:var(--sky);stroke-width:26;stroke-linecap:round;opacity:.55}
.s1{left:-60px;top:10px}.s2{right:-70px;top:60px;stroke:var(--mauve)}
.eyebrow{font:800 13px var(--font-accent);letter-spacing:.08em;text-transform:uppercase;margin:0 0 14px}
.hero h1{font-size:clamp(38px,11.5vw,100px);color:var(--carrot);-webkit-text-stroke:7px var(--shadow);paint-order:stroke fill;letter-spacing:1px;text-shadow:4px 5px 0 var(--shadow)}
.hero h1>span{display:block}.hero h1>span+span{color:var(--sky)}
.sub{font:400 22px var(--font-hand),cursive;margin:22px 0 0}
.band{position:relative;z-index:1;background:var(--carrot);padding:70px 18px 36px;margin-top:-40px;clip-path:polygon(0 18px,12% 0,26% 22px,40% 6px,55% 26px,70% 4px,85% 20px,100% 0,100% 100%,0 100%)}
.band::before{content:"";position:absolute;inset:0;background:var(--grain);mix-blend-mode:multiply;opacity:.12;pointer-events:none}
.band>*{position:relative;max-width:700px;margin-left:auto;margin-right:auto}
.band-title{font-size:20px!important;margin-bottom:12px;text-align:center}
.next,.list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.card{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;align-items:center;background:var(--floral);border:3px solid var(--shadow);border-radius:var(--radius-tag);padding:12px 14px}
.when{font:400 22px/1 var(--font-display);text-align:center;min-width:56px}
.when small{display:block;font:800 12px var(--font-accent);letter-spacing:.06em}
.what b{display:block;font:800 18px/1.1 var(--font-display);text-transform:uppercase}
.what span{font-size:14px;display:block;margin-top:4px}.what .tag{display:inline-block}
.card .btn{grid-column:1/-1;text-align:center}
.tag{display:inline-block;font:800 11px var(--font-accent);text-transform:uppercase;border:2px solid var(--shadow);border-radius:999px;padding:1px 8px;margin-right:6px;background:#fff}
.st-on_sale{background:#b8ecc9}.st-low{background:var(--carrot)}.st-sold_out{background:var(--shadow);color:#fff}.st-waitlist{background:var(--mauve)}.st-tba{background:var(--sky)}
.ed{background:#ffe1d4}
.hero-cta{display:flex;gap:12px;justify-content:center;margin-top:22px;flex-wrap:wrap}
@media(min-width:560px){.card{grid-template-columns:auto 1fr auto}.card .btn{grid-column:auto}}

/* perks */
.perks{max-width:none;background:var(--shadow);color:var(--floral);padding:14px 10px}
.perks ul{display:flex;flex-wrap:wrap;gap:8px 22px;justify-content:center;list-style:none;margin:0 auto;padding:0;font:800 14px var(--font-accent);text-transform:uppercase}
.perks li::before{content:"✺ ";color:var(--carrot)}

/* dates */
.filters{display:flex;gap:8px;overflow-x:auto;padding-bottom:10px;margin-bottom:8px}
.chip{flex:none;border:3px solid var(--shadow);background:#fff;border-radius:999px;padding:7px 14px;font:800 13px var(--font-accent);text-transform:uppercase;cursor:pointer}
.chip[aria-pressed=true]{background:var(--shadow);color:#fff}
.list .card{background:#fff}
.empty{padding:16px;border:3px dashed var(--shadow);border-radius:14px}

/* leaderboard */
.board{max-width:none;background:var(--shadow);color:var(--floral)}
.board>*{max-width:900px;margin-left:auto;margin-right:auto}
.rows{list-style:none;padding:0;display:grid;gap:12px}
.row{display:grid;grid-template-columns:28px 1fr auto;gap:4px 12px;align-items:center}
.rank{font:400 24px var(--font-display);color:var(--carrot)}
.name{font:800 18px var(--font-display);text-transform:uppercase}
.name em{font:800 11px var(--font-accent);font-style:normal;background:var(--melon);color:#fff;border-radius:999px;padding:2px 9px;margin-left:8px;vertical-align:middle}
.track{grid-column:2;height:16px;background:#2a2840;border-radius:99px;overflow:hidden}
.fill{height:100%;width:0;background:var(--gradient);border-radius:99px;transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.row .btn{grid-row:1/3;grid-column:3;padding:8px 12px;font-size:12px;background:var(--floral);color:var(--ink)}
.row .btn:hover{background:var(--carrot)}
.updated{font-size:13px;opacity:.7}
.board .ph-note{color:var(--ink)}

/* presale */
.presale{max-width:760px}
.reasons{list-style:none;padding:0;display:grid;gap:12px;margin:0 0 24px}
.reasons li{display:flex;gap:14px;align-items:flex-start}
.reasons b{flex:none;width:44px;height:44px;display:grid;place-items:center;background:var(--carrot);border:3px solid var(--shadow);border-radius:50%;font:400 22px var(--font-display)}
.signup{display:grid;gap:10px;background:#fff;border:3px solid var(--shadow);border-radius:var(--radius-tag);padding:18px}
.signup label,.contact label{font:800 13px var(--font-accent);text-transform:uppercase}
select,input,textarea{width:100%;font:500 16px var(--font-body);padding:12px;border:3px solid var(--shadow);border-radius:12px;background:var(--floral);margin-top:4px}
.free{margin:0;font-weight:700}.consent{margin:0;font-size:12px;opacity:.8}

/* photos */
.strip{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;text-decoration:none}
.ph{aspect-ratio:1;display:grid;place-items:center;text-align:center;padding:8px;background:repeating-linear-gradient(45deg,#f0e8d6 0 10px,#fbf4e4 10px 20px);border:3px dashed var(--shadow);border-radius:12px;font:800 12px var(--font-accent)}
@media(min-width:700px){.strip{grid-template-columns:repeat(4,1fr)}}
.more{display:inline-block;margin-top:14px;font:800 14px var(--font-accent);text-transform:uppercase}

/* contact */
.involved{max-width:640px}
.contact{display:grid;gap:12px}

/* footer */
footer{background:var(--carrot);border-top:3px solid var(--shadow);padding:30px 18px 90px;text-align:center}
.links a{margin:0 10px;font-weight:700}.small{font-size:13px}

/* sticky mobile CTA */
.sticky{position:fixed;left:14px;right:14px;bottom:14px;z-index:30;text-align:center;background:var(--cta);color:#fff;border:3px solid var(--shadow);border-radius:999px;padding:14px;font:800 17px var(--font-accent);text-transform:uppercase;text-decoration:none;box-shadow:4px 4px 0 var(--shadow)}
@media(min-width:760px){.sticky{display:none}footer{padding-bottom:30px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.logo-img{height:46px;width:auto;display:block}.foot-img{height:90px;width:auto;margin:0 auto 8px;display:block}
.page{max-width:760px}.page h1{font-size:clamp(34px,9vw,56px);margin-bottom:18px}.page h3{font:800 18px var(--font-display);text-transform:uppercase;margin:26px 0 6px}
.banner{background:#fff;border:2px dashed var(--melon);border-radius:8px;padding:8px 12px;font-size:13px;margin-bottom:18px}
.gal{margin-bottom:30px}.gal h3{margin-top:0}
details.q{border:3px solid var(--shadow);border-radius:14px;background:#fff;margin-bottom:10px;padding:0 14px}details.q summary{cursor:pointer;padding:14px 0;font:800 16px var(--font-accent);text-transform:uppercase}details.q p{margin:0 0 14px}

/* loader */
#loader{display:none}
html.loading #loader{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:var(--halftone),var(--floral);background-color:var(--floral);transition:opacity .35s,visibility .35s}
html.loading #loader.out{opacity:0;visibility:hidden}
html.loading{overflow:hidden}
#loader img{width:94px;height:auto;animation:bob .6s ease-in-out infinite alternate}
.lbar{width:min(260px,70vw);height:22px;border:4px solid var(--shadow);border-radius:99px;background:#fff;overflow:hidden;box-shadow:3px 3px 0 var(--shadow)}
#lfill{display:block;height:100%;width:0;background:var(--gradient);background-size:260px 100%}
#loader p{margin:0;font:800 14px var(--font-accent);text-transform:uppercase;letter-spacing:.05em}
#loader b{color:var(--melon);min-width:3ch;display:inline-block}
@keyframes bob{to{transform:translateY(-10px) rotate(-4deg)}}

/* word + letter micro-animations */
.w{display:inline-block;white-space:nowrap}
.ch{display:inline-block;transform-origin:50% 80%}
.pop .ch{opacity:0}
.go .pop .ch{animation:pop .55s cubic-bezier(.3,1.6,.5,1) both;animation-delay:calc(var(--i)*35ms + 80ms)}
@keyframes pop{0%{opacity:0;transform:translateY(.45em) scale(.6) rotate(-8deg)}100%{opacity:1;transform:none}}
.ch:hover{animation:wob .45s ease}
@keyframes wob{25%{transform:translateY(-.12em) rotate(-6deg) scale(1.08)}60%{transform:translateY(0) rotate(4deg)}100%{transform:none}}
.sub,.eyebrow{opacity:0}
.go .sub,.go .eyebrow,.no-js .sub,.no-js .eyebrow{opacity:1;animation:fade .6s ease both .7s}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.btn:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--shadow)}
@media(prefers-reduced-motion:reduce){.pop .ch{opacity:1!important;animation:none!important}.sub,.eyebrow{opacity:1!important;animation:none!important}.ch:hover{animation:none}}

/* ===== v2: city-first + day slider + stubs + jars ===== */
.band .cities{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 12px;max-width:none;justify-content:flex-start}
@media(min-width:700px){.band .cities{justify-content:center}}
.cities .chip{background:var(--floral)}
.cities .chip[aria-pressed=true]{background:var(--shadow);color:#fff;transform:translateY(-2px)}
.m-card{background:var(--floral);border:4px solid var(--shadow);border-radius:var(--radius-tag);padding:18px;text-align:center;box-shadow:6px 6px 0 var(--shadow);display:grid;gap:8px;justify-items:center;animation:slide .35s ease both}
@keyframes slide{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.m-label{font:800 12px var(--font-accent);text-transform:uppercase;letter-spacing:.08em}
.m-big{font:400 clamp(34px,10vw,56px)/1 var(--font-display);text-transform:uppercase}
.m-city{font:800 22px var(--font-display);text-transform:uppercase}
.m-meta{font-size:14px}.m-card .btn{width:100%;max-width:360px;text-align:center;font-size:18px;padding:14px 20px}
.m-more{font:800 13px var(--font-accent);text-transform:uppercase}
.m-card p{margin:0}
.link{background:none;border:0;padding:0;font:800 14px var(--font-body);text-decoration:underline;cursor:pointer}

/* day slider */
.day{max-width:760px}
.sky{--t:0;position:relative;height:280px;border:4px solid var(--shadow);border-radius:24px;overflow:hidden;background:linear-gradient(180deg,var(--carrot),var(--melon) 28%,var(--mauve) 52%,var(--sky) 76%,var(--sapphire));background-size:100% 400%;background-position:0 calc(var(--t)*100%);box-shadow:5px 5px 0 var(--shadow)}
.sun{position:absolute;width:62px;height:62px;border-radius:50%;background:var(--floral);border:4px solid var(--shadow);box-shadow:0 0 0 10px rgba(255,251,243,.35),0 0 0 22px rgba(255,251,243,.18);transform:translate(-50%,-50%)}
.daycard{position:absolute;left:12px;right:12px;bottom:12px;background:var(--floral);border:3px solid var(--shadow);border-radius:16px;padding:10px 14px;min-height:92px}
.daycard b{font:400 28px var(--font-display)}.daycard p{margin:2px 0 0}
.dial{display:flex;align-items:center;gap:10px;margin:18px 0 10px;font:800 14px var(--font-accent)}
.dial input{flex:1;padding:0;border:0;background:none;margin:0;accent-color:var(--melon);height:36px}

/* ticket stubs */
.stub{position:relative;display:grid;grid-template-columns:92px 1fr;gap:8px 14px;align-items:center;background:#fff;border:3px solid var(--shadow);border-radius:14px;padding:0 14px 12px 0;overflow:hidden;transition:transform .15s}
.stub:hover{transform:rotate(-.6deg) translateY(-2px)}
.stub .when{align-self:stretch;display:flex;flex-direction:column;justify-content:center;background:var(--carrot);border-right:3px dashed var(--shadow);padding:12px 8px;transition:transform .2s}
.stub:hover .when{transform:translateX(-3px)}
.adm{font:800 9px var(--font-accent);font-style:normal;text-transform:uppercase;letter-spacing:.1em;margin-top:6px;opacity:.7}
.stub .what{padding-top:12px}.stub .btn{grid-column:1/-1;margin-left:14px;text-align:center}
@media(min-width:560px){.stub{grid-template-columns:100px 1fr auto;padding:0 14px 0 0}.stub .btn{grid-column:auto;margin:0}.stub .what{padding:12px 0}}
#dates-lede{margin-bottom:14px}

/* jars */
.jars{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:22px 14px}
@media(min-width:700px){.jars{grid-template-columns:repeat(3,1fr)}}
.jarbox{display:grid;justify-items:center;gap:8px;text-align:center}
.jarwrap{position:relative;width:96px}
.jar{height:120px;border:4px solid var(--floral);border-top-width:8px;border-radius:6px 6px 28px 28px;background:#2a2840;position:relative;overflow:hidden}
.lvl{position:absolute;left:0;right:0;bottom:0;height:0;background:var(--gradient);transition:height 1.2s cubic-bezier(.2,.8,.2,1)}
.jname{font:800 18px var(--font-display);text-transform:uppercase}
.hot{font:800 11px var(--font-accent);font-style:normal;background:var(--melon);color:#fff;border-radius:999px;padding:2px 10px}
.jcount{font-size:13px;opacity:.8}
.jarbox .btn{padding:9px 14px;font-size:12px;background:var(--floral);color:var(--ink)}.jarbox .btn:hover{background:var(--carrot)}
.coin{position:absolute;left:calc(50% - 14px);top:-44px;width:28px;height:28px;border-radius:50%;background:var(--carrot);border:4px solid var(--floral);animation:drop .55s cubic-bezier(.5,0,1,.6) forwards;z-index:2}
@keyframes drop{to{transform:translateY(90px);opacity:.2}}
@media(prefers-reduced-motion:reduce){.coin{animation:none;display:none}.m-card{animation:none}.sky{background-position:0 calc(var(--t)*100%)}}

/* cinematic clips (progressive: only active once media/day-N.mp4 files exist and load) */
.clips{position:absolute;inset:0;z-index:0}
.clips video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s ease}
.clips video.on{opacity:1}
.sky.has-video{height:440px}.sky.has-video .sun{display:none}
.sky .daycard{z-index:2}
@media(min-width:760px){.sky.has-video{max-width:440px;height:600px;margin-left:auto;margin-right:auto}}
@media(prefers-reduced-motion:reduce){.clips video{transition:none}}

/* martini glasses + coffee bean */
.glass{width:100px;height:auto;display:block;overflow:visible}
.liq{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0);transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.jarwrap{width:100px}
.bean{position:absolute;left:calc(50% - 11px);top:-52px;width:22px;z-index:2;animation:beandrop .7s cubic-bezier(.5,0,1,.6) forwards}
.bean svg{display:block;width:100%}
@keyframes beandrop{0%{transform:translateY(0) rotate(0)}80%{transform:translateY(64px) rotate(210deg);opacity:1}100%{transform:translateY(74px) rotate(250deg) scale(.6);opacity:0}}
.glass.plop{animation:plop .45s ease}
@keyframes plop{30%{transform:rotate(-5deg) scale(1.04)}65%{transform:rotate(3deg)}100%{transform:none}}
@media(prefers-reduced-motion:reduce){.bean{animation:none;display:none}.glass.plop{animation:none}.liq{transition:none}}

/* about (bottom of home) */
.about{max-width:760px;padding-bottom:64px}
.about-copy{background:#fff;border:4px solid var(--shadow);border-radius:var(--radius-tag);padding:22px 20px;font-size:18px;line-height:1.6;box-shadow:6px 6px 0 var(--shadow);margin:0}
@media(min-width:760px){.about-copy{font-size:20px;padding:30px}}

/* hero tagline: bold, readable sticker instead of the hand font */
.sub{font:800 clamp(19px,5.4vw,28px)/1.25 var(--font-display);margin:24px auto 0;display:block;max-width:560px;background:var(--floral);border:4px solid var(--shadow);border-radius:var(--radius-tag);padding:12px 18px;box-shadow:5px 5px 0 var(--shadow);text-transform:none;letter-spacing:0}
.sub span{display:block}.sub .sub2{color:var(--melon);margin-top:4px}

/* AMOUR + AMBIENTE (brand book 2.3 / 3.3 palettes) */
.family{padding:56px 18px;max-width:1100px;margin:0 auto}
.family h2{margin:0 0 20px}
.fam-grid{display:grid;gap:20px}
@media(min-width:760px){.fam-grid{grid-template-columns:1fr 1fr}}
.fam{position:relative;overflow:hidden;border:3px solid var(--shadow);border-radius:22px;padding:26px 22px 28px;box-shadow:6px 6px 0 var(--shadow)}
.fam h3{font:400 clamp(44px,13vw,68px)/.95 "Bowlby One",var(--font-display);margin:4px 0 6px;letter-spacing:.01em}
.fam p{margin:0 0 12px;max-width:34ch;position:relative}
.fam-kicker{font:800 12px var(--font-accent);text-transform:uppercase;letter-spacing:.08em}
.fam-tag{font:400 22px var(--font-hand)}
.fam-soon{font-weight:700}
.fam-bands{position:absolute;right:-30px;top:-30px;width:150px;height:150px;transform:rotate(18deg)}
.fam-bands i{position:absolute;left:0;right:0;height:34px;border-radius:999px}
.fam-bands i:nth-child(1){top:0}.fam-bands i:nth-child(2){top:46px}.fam-bands i:nth-child(3){top:92px}
.fam-btn{position:relative;margin-top:6px}
.fam-amour{background:#FF5600;color:var(--shadow)}
.fam-amour h3{color:#FFFBF3;-webkit-text-stroke:3px var(--shadow);paint-order:stroke fill;text-shadow:4px 4px 0 #6600D7}
.fam-amour .fam-bands i:nth-child(1){background:#F10046}.fam-amour .fam-bands i:nth-child(2){background:#6600D7}.fam-amour .fam-bands i:nth-child(3){background:#FFFBF3}
.fam-amour .fam-btn{background:#6600D7;color:#fff}.fam-amour .fam-btn:hover,.fam-amour .fam-btn:focus-visible{background:#F10046}
.fam-ambiente{background:#00B29A;color:var(--shadow)}
.fam-ambiente h3{color:#FFC900;-webkit-text-stroke:3px var(--shadow);paint-order:stroke fill;text-shadow:4px 4px 0 #FF4D5B}
.fam-ambiente .fam-bands i:nth-child(1){background:#87CB00}.fam-ambiente .fam-bands i:nth-child(2){background:#FFC900}.fam-ambiente .fam-bands i:nth-child(3){background:#FF4D5B}
.fam-ambiente .fam-btn{background:#FFC900;color:var(--shadow)}.fam-ambiente .fam-btn:hover,.fam-ambiente .fam-btn:focus-visible{background:#FF4D5B;color:#fff}
.fam-bands{width:110px;height:110px;right:-34px;top:-34px;z-index:0}
.fam-bands i{height:24px}.fam-bands i:nth-child(2){top:34px}.fam-bands i:nth-child(3){top:68px}
.fam h3,.fam-kicker,.fam-tag{position:relative;z-index:1}
.fam-ambiente h3{font-size:clamp(34px,10.5vw,60px)}
