:root{
  --paper:#f2efe6;
  --grid:rgba(91,95,151,.14);
  --ink:#494c76;
  --ink-soft:#6b6f9c;
  --crimson:#a4295a;
  --crimson-soft:#c85e83;
  --cream:#faf6ec;
  --text:#2e2b26;
  --muted:#7a7364;
  --spotify:#1c7a5e;
  --apple:#b23a63;
  --youtube:#e05a42;
  --instagram:#c17a2e;
  --tiktok:#2f8fc4;
  --threads:#c9a92e;
  --email:#4a8f4a;
  --tape: rgba(255,255,255,.62);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:
    linear-gradient(var(--grid) 1px, transparent 1px) 0 0/28px 28px,
    linear-gradient(90deg, var(--grid) 1px, transparent 1px) 0 0/28px 28px,
    var(--paper);
  color:var(--text);
  font-family:'Special Elite', 'Courier New', monospace;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
img,svg{display:block; max-width:100%;}
section{position:relative; padding:5rem 1.5rem;}
h1,h2{font-weight:400; margin:0;}
.script{font-family:'Give You Glory', 'Caveat', cursive;}
.handwrite{font-family:'Caveat', cursive; font-weight:700;}

.reveal{opacity:0; transform:translateY(16px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in-view{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
  html{scroll-behavior:auto;}
}

a:focus-visible, button:focus-visible{
  outline:3px solid var(--crimson);
  outline-offset:3px;
  border-radius:4px;
}

/* ---------- HERO ---------- */
.hero{
  position:relative;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:6rem 1.5rem 4rem;
}
.lang-switch{
  position:fixed;
  top:1.5rem; right:1.5rem;
  z-index:10;
  display:flex; gap:.6rem;
  background:var(--tape);
  padding:.3rem .6rem;
  border-radius:6px;
  font-family:'Caveat', cursive;
  font-weight:700;
}
.lang-switch button{
  background:none; border:none; cursor:pointer;
  font-family:inherit; font-size:1.35rem;
  color:var(--crimson-soft);
  padding:.35rem .5rem;
}
.lang-switch button.active{
  color:var(--crimson);
  text-decoration:underline;
  text-underline-offset:4px;
}
.hero-doodle{
  position:absolute; top:1.2rem; left:1.2rem;
  width:120px; opacity:.55; color:var(--ink-soft);
  z-index:9;
}
.wordmark{
  display:flex; flex-direction:column; gap:.1rem;
  margin-bottom:2rem;
}
.wordmark img{
  width:clamp(220px, 45vw, 380px);
  height:auto;
  margin:0 auto;
}
.lang-big{
  display:flex; gap:2.2rem; justify-content:center;
  margin:1.6rem 0 2.4rem;
}
.lang-big button{
  background:none; border:none; cursor:pointer;
  font-family:'Give You Glory', 'Caveat', cursive;
  font-size:clamp(2.2rem, 6vw, 3.2rem);
  color:var(--crimson);
  line-height:1;
  padding:0;
}
.lang-big button.active{ color:var(--ink); }

.ticket{
  position:relative;
  padding:2.2rem 2.4rem 2.6rem;
  max-width:360px;
  margin:0 auto;
}
.ticket::after{
  content:"";
  position:absolute; inset:0; z-index:-1;
  background:var(--cream);
  box-shadow:0 10px 26px rgba(60,50,30,.12);
  clip-path:polygon(
    0% 12px,5% 0px,10% 15px,15% 3px,20% 18px,25% 3px,30% 15px,35% 0px,40% 12px,45% 3px,50% 18px,55% 3px,60% 15px,65% 0px,70% 12px,75% 3px,80% 18px,85% 3px,90% 15px,95% 0px,100% 12px,
    100% calc(100% - 12px),95% 100%,90% calc(100% - 15px),85% calc(100% - 3px),80% calc(100% - 18px),75% calc(100% - 3px),70% calc(100% - 15px),65% 100%,60% calc(100% - 12px),55% calc(100% - 3px),50% calc(100% - 18px),45% calc(100% - 3px),40% calc(100% - 15px),35% 100%,30% calc(100% - 12px),25% calc(100% - 3px),20% calc(100% - 18px),15% calc(100% - 3px),10% calc(100% - 15px),5% 100%,0% calc(100% - 12px)
  );
}
.ticket::before{
  content:"";
  position:absolute; top:-14px; left:50%; transform:translateX(-50%) rotate(-3deg);
  width:120px; height:32px; background:var(--tape);
  box-shadow:0 1px 3px rgba(0,0,0,.15);
  z-index:1;
}
.ticket p{ margin:.25rem 0; color:var(--crimson); font-size:1.05rem; }
.ticket .tag{
  margin-top:.7rem;
  text-decoration:underline;
  text-underline-offset:3px;
}

.scroll-cue{
  margin-top:2.6rem;
  font-family:'Caveat', cursive; font-size:1.4rem;
  color:var(--ink-soft);
  display:inline-flex; flex-direction:column; align-items:center; gap:.2rem;
}
.scroll-cue svg{width:18px; animation:bob 1.8s ease-in-out infinite;}
@keyframes bob{0%,100%{transform:translateY(0);}50%{transform:translateY(6px);}}

/* ---------- MENU ---------- */
.menu{padding-top:2rem; padding-bottom:2.5rem;}
.menu-tag{
  width:120px; margin:0 auto 2.6rem;
}
.menu-grid{
  max-width:980px; margin:0 auto;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:2.2rem 1.4rem;
}
.menu-primary{
  max-width:420px;
  grid-template-columns:repeat(2, 1fr);
}
.menu-divider{
  text-align:center;
  font-family:'Caveat', cursive;
  font-size:1.1rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
  max-width:220px;
  margin:3.4rem auto 1.8rem;
  padding-top:1.8rem;
  border-top:1px solid var(--grid);
}
.petal-card{
  display:flex; flex-direction:column; align-items:center; gap:.6rem;
  padding:1.2rem .6rem;
  transition:transform .25s ease;
}
.petal-card:hover{ transform:translateY(-6px) rotate(-1.5deg); }
.petal-card svg, .petal-card img{width:132px; height:132px; object-fit:contain;}
.photo{
  filter:drop-shadow(0 8px 12px rgba(60,50,30,.28));
}
.tilt-l{ transform:rotate(-4deg); }
.tilt-r{ transform:rotate(3deg); }
.petal-card span{
  font-family:'Give You Glory', 'Caveat', cursive;
  font-size:1.7rem;
  color:var(--ink);
}
.petal-card small{
  font-family:'Caveat', cursive; font-size:.95rem; color:var(--muted);
}

/* ---------- INFORMATION ---------- */
.information{ padding-top:1rem; }
.info-head{
  display:flex; align-items:center; justify-content:center; gap:1rem;
  margin-bottom:2.4rem;
}
.info-head svg.heart{width:64px; color:var(--crimson);}
.info-head h2{
  font-family:'Give You Glory', 'Caveat', cursive;
  font-size:2.6rem; color:var(--ink);
}
.paper-block{
  position:relative;
  max-width:1040px; margin:0 auto;
  padding:3rem 2.4rem 3.4rem;
}
.paper-block::before{
  content:"";
  position:absolute; inset:0; z-index:-1;
  background:var(--cream);
  box-shadow:0 10px 30px rgba(60,50,30,.10);
  clip-path:polygon(
    0% 18px,5% 0px,10% 24px,15% 6px,20% 30px,25% 6px,30% 24px,35% 0px,40% 18px,45% 6px,50% 30px,55% 6px,60% 24px,65% 0px,70% 18px,75% 6px,80% 30px,85% 6px,90% 24px,95% 0px,100% 18px,
    100% calc(100% - 18px),95% 100%,90% calc(100% - 24px),85% calc(100% - 6px),80% calc(100% - 30px),75% calc(100% - 6px),70% calc(100% - 24px),65% 100%,60% calc(100% - 18px),55% calc(100% - 6px),50% calc(100% - 30px),45% calc(100% - 6px),40% calc(100% - 24px),35% 100%,30% calc(100% - 18px),25% calc(100% - 6px),20% calc(100% - 30px),15% calc(100% - 6px),10% calc(100% - 24px),5% 100%,0% calc(100% - 18px)
  );
}
.cols{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:2.2rem;
  font-size:.92rem; line-height:1.7; color:var(--text);
}
.cols h3{
  font-family:'Give You Glory', 'Caveat', cursive; font-size:1.4rem; color:var(--ink);
  margin:0 0 .8rem;
}
.cols p{margin:0 0 1rem;}
blockquote{
  font-family:'Give You Glory', 'Caveat', cursive;
  font-size:1.5rem; color:var(--crimson);
  margin:0 0 1rem; line-height:1.3;
}
.fish-doodle{
  position:absolute; right:-0.5rem; bottom:-2.8rem;
  width:180px; color:var(--ink-soft); opacity:.9;
}
.clover{
  position:absolute; top:-2.2rem; right:3rem; width:100px;
}

/* ---------- LINKS ---------- */
.links{padding-top:1rem;}
.links-grid{
  max-width:920px; margin:0 auto;
  display:grid; grid-template-columns:1fr auto 1fr;
  align-items:center; gap:2.5rem;
}
.plat-col{display:flex; flex-direction:column; gap:1.1rem;}
.plat-col.right{align-items:flex-end;}
.platform{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:'Give You Glory', 'Caveat', cursive;
  font-size:1.9rem;
  transition:transform .2s ease, opacity .2s ease;
}
.platform:hover{ transform:translateY(-2px); opacity:.8; }
.platform svg{width:24px; height:24px; flex-shrink:0;}
.plat-col.right .platform{ flex-direction:row-reverse; }
.platform.spotify{color:var(--spotify);}
.platform.apple{color:var(--apple);}
.platform.youtube{color:var(--youtube);}
.platform.instagram{color:var(--instagram);}
.platform.tiktok{color:var(--tiktok);}
.platform.threads{color:var(--threads);}
.platform.email{
  color:var(--email); font-size:1.15rem; font-family:'Caveat', cursive; font-weight:700;
}
.badge{
  position:relative; width:150px; height:150px;
  display:flex; align-items:center; justify-content:center;
  margin:0 auto;
}
.badge img{width:100%; height:100%; object-fit:contain;}
.fish-row{
  display:flex; justify-content:space-between; max-width:920px; margin:3rem auto 0;
  opacity:.7; color:var(--ink-soft);
}
.fish-row svg, .fish-row img{width:170px;}
.fish-row svg.small{width:110px; align-self:flex-end; transform:scaleX(-1);}
.fish-row img.small{width:110px; align-self:flex-end; transform:scaleX(-1) rotate(-3deg);}

footer{
  text-align:center; padding:3rem 1.5rem 4rem;
  font-family:'Caveat', cursive; color:var(--muted); font-size:1.1rem;
}
footer .tictactoe{margin:0 auto 1rem; width:54px; opacity:.6;}

@media (max-width:760px){
  .menu-grid{grid-template-columns:repeat(2,1fr);}
  .cols{grid-template-columns:1fr;}
  .links-grid{grid-template-columns:1fr; text-align:center;}
  .plat-col, .plat-col.right{align-items:center;}
  .plat-col{order:1;}
  .plat-col.right{order:2;}
  .badge{order:3; margin:2rem auto 0;}
  .fish-doodle{position:static; margin:2rem auto 0;}
  .hero-doodle{width:80px;}
}