@font-face{font-family:Fredoka;src:url('/assets/fonts/fredoka.woff2') format('woff2');font-weight:300 700;font-display:swap}
@font-face{font-family:Nunito;src:url('/assets/fonts/body.woff2') format('woff2');font-weight:400 800;font-display:swap}
@font-face{font-family:Caveat;src:url('/assets/fonts/hand.woff2') format('woff2');font-weight:400;font-display:swap}
:root{color-scheme:light;--ink:#465b50;--soft-ink:#686b60;--paper:#fcfaf6;--ease-settle:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{width:100%;height:100%;overflow:hidden;background:var(--paper)}
body{width:100%;height:100%;height:100svh;min-height:0;overflow:hidden;margin:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;background:var(--paper);color:var(--ink);font-family:Nunito,sans-serif;-webkit-font-smoothing:antialiased;isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23897961' filter='url(%23n)' opacity='.5' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.paper-wash{display:none}
.landing-wind{display:block;position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;visibility:hidden}
.landing-wind.is-ready{visibility:visible}
.landing-wind-flow{position:absolute;inset:0}
.landing-wind-video{display:block;width:100%;height:100%;object-fit:cover;opacity:.72;mix-blend-mode:multiply}
.landing-wind::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 48%,#fcfaf6eb 0%,#fcfaf6c7 24%,#fcfaf638 51%,transparent 74%)}
a{color:inherit}
a,button{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:2px solid #8a687d;outline-offset:5px;border-radius:5px}
.landing-header{display:flex;align-items:center;gap:24px;padding:25px clamp(24px,4vw,64px)}
.little-note{font:400 24px/1.2 Caveat,cursive;color:#706b60}
.little-note span{color:#a76465;padding-left:4px}
.landing-main{min-height:0;overflow:hidden;display:grid;place-items:center;padding:12px 24px 36px}
.welcome{width:min(100%,660px);text-align:center}
.logo-stage{position:relative;width:min(100%,560px);aspect-ratio:720/640;margin:0 auto -28px;isolation:isolate}
.finished-logo{position:absolute;width:100%;inset:0}
.logo-art{display:block;width:100%;height:auto;overflow:visible}
.logo-reveal{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;object-fit:fill}
.finished-logo{visibility:hidden}
.is-awaiting .logo-reveal,.is-playing .logo-reveal{opacity:1}
.is-finished .finished-logo{visibility:visible}
.is-finished .logo-reveal{opacity:0}
.is-settling .logo-reveal{transition:opacity 180ms linear;opacity:0}
.blink-heart{transform-box:view-box}
.yellow-hearts{transform-origin:297.5px 132px}
.green-hearts{transform-origin:382.5px 132px}
.is-finished .blink-heart{animation:heart-blink 5s cubic-bezier(.4,0,.2,1) 150ms infinite}
.is-finished .green-hearts{animation-delay:165ms}
/* Quick close, a readable shut-eye hold, then a softer reopening.
   Alternate a single blink and a little double blink every 2.5 seconds. */
@keyframes heart-blink{
  0%,8%,13%,58%,63%,65%,70%,100%{transform:translate(var(--look-x,0),var(--look-y,0)) scale(1,1)}
  9.4%,10.6%,59.4%,60.6%,66.4%,67.6%{transform:translate(var(--look-x,0),var(--look-y,0)) scale(1.03,.055)}
}
.finish-spark{position:absolute;opacity:0;pointer-events:none;color:#bb7784;line-height:1}
.spark-one{top:25%;left:4%;font-size:31px}
.spark-two{top:17%;right:6%;font-size:19px;color:#bd9b51}
.spark-three{bottom:16%;right:7%;font-size:26px;color:#79a69c}
.is-finished .finish-spark{animation:finish-spark 950ms var(--ease-settle) both}
.is-finished .spark-two{animation-delay:180ms}
.is-finished .spark-three{animation-delay:350ms}
@keyframes finish-spark{0%{opacity:0;transform:scale(.8) rotate(-10deg)}32%{opacity:.75}100%{opacity:0;transform:scale(1.15) rotate(12deg)}}
.welcome-copy{margin-top:-5px}
h1{margin:0;font:400 clamp(26px,2.5vw,35px)/1.19 Fredoka,sans-serif;letter-spacing:-.015em}
h1 span{color:#526b55}
.club-description{font-size:15px;line-height:1.6;color:var(--soft-ink);margin:18px 0 0}
.opening-date{display:inline-flex;align-items:center;gap:9px;margin:23px 0 0;border:1px solid #d9cbbb;background:#fffdf770;border-radius:30px;padding:9px 17px;font-size:12px;font-weight:700;letter-spacing:.045em}
.date-flower{color:#a97165;font-size:17px;line-height:1}
.landing-actions{width:min(100%,304px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:10px;margin:18px auto 0}
.landing-action{position:relative;width:100%;min-height:45px;display:grid;place-items:center;border:1px solid #b9c6b7;border-radius:999px;padding:10px 18px;text-align:center;text-decoration:none;font-size:12px;font-weight:750;white-space:nowrap;transition:transform .2s var(--ease-settle),box-shadow .2s,background .2s}
.landing-action .arrow-icon{position:absolute;right:15px;top:50%;width:16px;height:16px;transform:translateY(-50%)}
.arrow-icon svg{width:100%;height:100%}
.landing-action-primary{background:#536b5d;border-color:#536b5d;color:#fffdf8;box-shadow:0 8px 20px #536b5d1a}
.landing-action-secondary{background:#fffdf77d;color:#53695d}
.social-links svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.landing-footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:16px clamp(24px,4vw,64px) 23px;font-size:12px;color:#747269}
.post-note{font-size:12px}
.social-links{display:flex;align-items:center;gap:4px}
.social-links a{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;text-decoration:none}
.social-links .social-handle{gap:8px;margin-left:8px}
.social-links .social-handle .arrow-icon{position:relative;top:2px}
.is-page-hidden .little-note,.is-page-hidden .blink-heart{animation-play-state:paused}
@keyframes soft-arrive{from{opacity:0;transform:translateY(11px);filter:blur(3px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
.little-note{animation:note-write 2.2s steps(36,end) .2s both}
@keyframes note-write{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.welcome-copy h1{animation:soft-arrive .72s var(--ease-settle) .52s backwards}
.club-description{animation:soft-arrive .68s var(--ease-settle) .82s backwards}
.opening-date{animation:soft-arrive .66s var(--ease-settle) 1.08s backwards}
.landing-action-primary{animation:soft-arrive .62s var(--ease-settle) 1.34s backwards}
.landing-action-secondary{animation:soft-arrive .62s var(--ease-settle) 1.5s backwards}
.landing-footer{animation:soft-arrive .7s var(--ease-settle) 1.72s backwards}
@media(hover:hover){.social-links a:hover{color:#9a6166}.landing-action:hover{transform:translateY(-2px);box-shadow:0 10px 23px #536b5d1d}.landing-action-primary:hover{color:#fffdf8;background:#465e51}}
/* Desktop: size the logo from the height left after the copy, actions and
   footer, so it stays as large as the screen allows without scrolling. The
   reserve is the measured non-logo stack plus a little slack. */
@media(min-width:761px){
  :root{--landing-reserve:436px}
  .logo-stage{width:min(100%,560px,max(100px,calc((100svh - var(--landing-reserve)) * 1.125)))}
}
@media(min-width:761px) and (max-height:950px){
  :root{--landing-reserve:374px}
  .landing-header{padding-top:16px;padding-bottom:10px}
  .landing-main{padding-top:0;padding-bottom:10px}
}
@media(min-width:761px) and (max-height:650px){
  :root{--landing-reserve:349px}
  h1{font-size:29px}
  .club-description{margin-top:12px}
  .opening-date{margin-top:18px}
}
@media(max-width:760px){
  .landing-wind-video{opacity:.55;object-position:28% center}
  body{min-height:0;height:100svh;grid-template-rows:auto minmax(0,1fr) auto}
  .landing-header{justify-content:center;padding:clamp(8px,1.9svh,15px) 20px 0}
  .little-note{font-size:clamp(17px,5vw,20px);text-align:center}
  .landing-main{min-height:0;padding:0 15px;overflow:hidden}
  .welcome{max-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}
  .logo-stage{flex:0 1 auto;width:min(100%,44svh,420px);min-width:190px;margin-bottom:calc(-1 * clamp(12px,2.5svh,23px))}
  .welcome-copy{width:100%;margin-top:0}
  h1{font-size:clamp(23px,min(7.5vw,3.8svh),31px);line-height:1.14}
  .club-description{max-width:285px;margin:clamp(7px,1.4svh,13px) auto 0;font-size:clamp(11px,3.5vw,14px);line-height:1.45}
  .opening-date{margin-top:clamp(9px,1.6svh,16px);padding:7px 14px;font-size:10px}
  .landing-actions{width:min(calc(100% - 30px),330px);margin-top:clamp(9px,1.7svh,15px);gap:10px}
  .landing-action{min-height:42px;padding:8px 12px;font-size:11px}
  .landing-action span{right:12px}
  .landing-footer{position:relative;display:flex;align-items:center;justify-content:center;padding:3px 16px max(5px,env(safe-area-inset-bottom));min-height:47px}
  .post-note{display:none}
  .social-links{justify-content:center}
  .social-links .social-handle{font-size:11px;margin-left:3px}
}
@media(max-width:760px) and (max-height:650px){
  .landing-header{padding-top:6px}
  .logo-stage{width:min(100%,39svh,300px);min-width:175px;margin-bottom:-12px}
  .club-description{margin-top:6px;font-size:11px}
  .opening-date{margin-top:7px;min-height:30px;padding:4px 12px}
  .landing-actions{margin-top:7px}
  .landing-action{min-height:38px;padding-block:6px}
  .landing-footer{min-height:43px;padding-top:0}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .landing-wind{display:none}
  .finished-logo{visibility:visible!important}
  .logo-reveal{display:none!important}
}