
/* Shared styles for Museum of Fart */
@keyframes float { 0%{transform:translateY(0)} 50%{transform:translateY(-10px)} 100%{transform:translateY(0)} }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes stinkLines { 0%{ transform:scaleY(1); opacity:.5 } 50%{ transform:scaleY(1.5); opacity:.8 } 100%{ transform:scaleY(1); opacity:.5 } }
@keyframes pulse { 0%{transform:scale(1);opacity:1} 50%{transform:scale(1.2);opacity:.7} 100%{transform:scale(1);opacity:1} }

.fart-cloud { animation: float 3s ease-in-out infinite; filter: drop-shadow(0 0 5px rgba(0,0,0,.2)); }
.exhibit-card:hover { transform: scale(1.03); box-shadow: 0 10px 25px rgba(0,0,0,.1); }
.sound-button:hover .sound-wave { animation: pulse 1.5s infinite; }
.gallery-item { transition: all .3s ease; }
.gallery-item:hover { transform: scale(1.05) rotate(2deg); z-index: 10; }
.noise-bg { background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.05'/%3E%3C/svg%3E"); }
.stink-line { position:absolute; width:2px; background:linear-gradient(to bottom, transparent, rgba(139,69,19,.5), transparent); animation: stinkLines 2s ease-in-out infinite; animation-delay: calc(var(--delay) * .2s); }
.fart-button { transition: all .2s ease; }
.fart-button:active { transform: scale(.95) rotate(5deg); }
.timeline-item::before { content:''; position:absolute; left:-20px; top:0; width:40px; height:40px; border-radius:50%; background-color:#d97706; border:4px solid #92400e; }
.fartometer { height:30px; background: linear-gradient(to right, #10b981, #f59e0b, #ef4444); transition: width .5s ease; }

/* Cards & tiles */
.card { transition: transform .2s ease, box-shadow .2s ease; }
.card:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(0,0,0,.12); }
.tile { transition: transform .2s ease, box-shadow .2s ease; }
.tile:hover { transform: translateY(-4px) scale(1.02); box-shadow: 0 10px 22px rgba(0,0,0,.12); }

/* Utility */
.container-narrow { max-width: 56rem; }


/* Buy Me A Coffee floating button */
.bmc-float {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 1000;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: #FFDD00;
  color: #000;
  padding: .6rem 1rem;
  border-radius: 9999px;
  box-shadow: 0 10px 20px rgba(0,0,0,.15);
  font-weight: 800;
}
.bmc-float:hover { filter: brightness(1.05); transform: translateY(-2px); transition: transform .15s ease, filter .15s ease; }


/* small bullets for lists on history page */
.bullets-sm li { font-size: 0.95rem; line-height: 1.5; }

/* history page niceties */
.fact-box { background: #FFFBEB; border: 1px solid #FDE68A; }
.era-section { position: relative; }
.era-section .era-pin {
  position:absolute; left:-20px; top:0; width:40px; height:40px;
  border-radius:9999px; background:#d97706; border:4px solid #92400e;
}
.callout { border-left: 4px solid #d97706; padding-left: .75rem; }


/* Store styles */
.product-card { transition: transform .2s ease, box-shadow .2s ease; }
.product-card:hover { transform: translateY(-3px); box-shadow: 0 12px 24px rgba(0,0,0,.12); }
.badge { display:inline-block; border-radius: 9999px; padding: .15rem .6rem; font-size:.75rem; font-weight:700; }
.badge-amber { background:#FDE68A; color:#92400e; }
.price { font-size: 1.5rem; font-weight: 800; }


/* Smaller bullets on timeline page */
.timeline-page ul li { font-size: 0.95rem; line-height: 1.5; }
.timeline-page .bullets-sm li { font-size: 0.95rem; line-height: 1.5; }


/* Timeline-specific bullet sizing */
.timeline-page ul, .timeline-page ol { margin-left: 1.25rem; }
.timeline-page li { font-size: 0.9rem; line-height: 1.45; }
.timeline-page .bullets-sm li { font-size: 0.9rem; line-height: 1.45; }


/* Equal-height cards for exhibits grid */
.exhibits-grid .card-link { display:block; height:100%; }
.exhibits-grid .card { height:100%; display:flex; flex-direction:column; }
.exhibits-grid .card .card-top { flex:0 0 auto; }
.exhibits-grid .card .card-body { flex:1 1 auto; display:flex; flex-direction:column; }
.exhibits-grid .card .card-body .desc { flex:1 1 auto; }
.exhibits-grid .icon-tile { height: 12rem; } /* consistent icon area */


/* Equal-height tiles for gallery grid */
.gallery-grid .tile-link { display:block; height:100%; }
.gallery-grid .tile { height:100%; display:flex; flex-direction:column; }
.gallery-grid .tile .tile-img { flex:0 0 auto; height: 12rem; }
.gallery-grid .tile .tile-body { flex:1 1 auto; display:flex; flex-direction:column; }
.gallery-grid .tile .tile-caption { flex:1 1 auto; }


/* Emoji SVG img placeholders */
.img-emoji { display:block; width:100%; height:100%; object-fit:contain; }
.aspect-square img.img-emoji { width:100%; height:100%; }
.icon-tile img.img-emoji, .tile-img img.img-emoji { width:100%; height:100%; }
