/*
Theme Name: My Custom Theme
Author: Your Name
Description: A basic WordPress theme
Version: 1.0
*/

@font-face {
  font-family: 'Bromos';
  src: url('./fonts/BromosRegular.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'MyriadPro';
  src: url('./fonts/MyriadPro-Regular.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'RamoDeMagnolia';
  src: url('./fonts/Ramo-deMagnolia.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

body {
  font-family: 'Roboto Mono', 'MyriadPro', monospace;
  color: #FA4554;
}

h1, h2 {
  font-family: 'Bromos', serif;
}

.bromos {
  font-family: 'Bromos', serif;
}
 
.signature {
  font-family: 'RamoDeMagnolia', cursive;
}

/* Dancing image animations */
@keyframes solta-sway {
  0%   { transform: rotate(-3deg) translateY(0); }
  25%  { transform: rotate(0deg) translateY(-10px); }
  50%  { transform: rotate(3deg) translateY(0); }
  75%  { transform: rotate(0deg) translateY(-6px); }
  100% { transform: rotate(-3deg) translateY(0); }
}

@keyframes solta-groove {
  0%, 100% { transform: translateY(0) rotate(-2deg) scale(1); }
  30%       { transform: translateY(-14px) rotate(2deg) scale(1.04); }
  55%       { transform: translateY(-5px) rotate(-1deg) scale(0.98); }
  78%       { transform: translateY(-10px) rotate(1.5deg) scale(1.02); }
}

.img-dance-hero {
  animation: solta-sway 3.5s ease-in-out infinite;
  transform-origin: center bottom;
  will-change: transform;
}

.img-dance-logo {
  animation: solta-groove 2.8s ease-in-out infinite;
  animation-delay: 0.4s;
  transform-origin: center bottom;
  will-change: transform;
}

/* H1 4-on-the-floor kick pump — 4 beats at 120 BPM (2s cycle) */
@keyframes solta-4otf {
  0%   { transform: scaleY(1)    scaleX(1); }
  6%   { transform: scaleY(0.97) scaleX(1.02); }
  14%  { transform: scaleY(1.02) scaleX(0.99); }
  22%  { transform: scaleY(1.00) scaleX(1.00); }
  25%  { transform: scaleY(1)    scaleX(1); }
  31%  { transform: scaleY(0.97) scaleX(1.02); }
  39%  { transform: scaleY(1.02) scaleX(0.99); }
  47%  { transform: scaleY(1.00) scaleX(1.00); }
  50%  { transform: scaleY(1)    scaleX(1); }
  56%  { transform: scaleY(0.97) scaleX(1.02); }
  64%  { transform: scaleY(1.02) scaleX(0.99); }
  72%  { transform: scaleY(1.00) scaleX(1.00); }
  75%  { transform: scaleY(1)    scaleX(1); }
  81%  { transform: scaleY(0.97) scaleX(1.02); }
  89%  { transform: scaleY(1.02) scaleX(0.99); }
  97%  { transform: scaleY(1.00) scaleX(1.00); }
  100% { transform: scaleY(1)    scaleX(1); }
}

.h1-dance {
  display: inline-block;
  animation: solta-4otf 2s 1.5s linear infinite;
  transform-origin: center bottom;
  will-change: transform;
}