header {
    margin-top: 0 !important;
    margin-block-start: 0 !important;
}

footer {
    margin-top: 0 !important;
    margin-block-start: 0 !important;
}

.shadow-pro {
    text-shadow: 2px 2px 10px rgba(0,0,0,0.8);
}

.shadow-pro-white {
    text-shadow: 2px 2px 2px rgba(255,255,255,0.8);
	  -webkit-text-stroke: 0.5px rgba(255,255,255);
}

.shadow-neon {
    text-shadow: 0 0 10px rgba(0,0,0,0.9);
}

.brush-effect {
    -webkit-mask-image: url('https://letsrockyoga.com/wp-content/uploads/2026/04/chalkpaint_mask.svg');
    -webkit-mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    
    mask-image: url('https://letsrockyoga.com/wp-content/uploads/2026/04/chalkpaint_mask.svg');
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    mask-position: center;
}

/* ===== CAJAS DE CONCEPTOS CLAVE (mejorada) ===== */
.lry-keybox {
  background: linear-gradient(135deg, #121212 0%, #1a1a1a 100%);
  color: #f2f2f2;
  border: 1px solid rgba(212, 175, 55, 0.25);
  border-left: 4px solid rgba(212, 175, 55, 0.7);
  border-radius: 12px;
  padding: 1.5rem 1.8rem;
  margin: 2.5rem 0;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4),
              0 2px 8px rgba(212, 175, 55, 0.08); /* efecto dorado sutil */
}

/* Título dentro de la caja destacado */
.lry-keybox h3,
.lry-keybox h4 {
  color: #f3d37a; /* dorado suave */
  margin-top: 0;
  font-size: 1.25rem;
}

/* Enlaces legibles dentro */
.lry-keybox a {
  color: #f3d37a;
  text-decoration: underline;
  transition: color 0.2s;
}
.lry-keybox a:hover {
  color: #fff;
}

/* Resetea márgenes en primer y último elemento */
.lry-keybox > :first-child { margin-top: 0; }
.lry-keybox > :last-child { margin-bottom: 0; }

/* ===== CITA ESTILO ROCKSTAR ===== */

/* Contenedor de la cita */
.lry-quote {
  position: relative;
  text-align: center; /* Centrado para impacto */
  margin: 3.5rem auto; /* Buen margen vertical para separar del texto */
  max-width: 850px; /* Evita que se estire demasiado en pantallas gigantes */
  border: none !important; /* Quita la línea lateral aburrida que traen muchos temas */
  padding: 0 1rem;
  margin-top: 15% !important;
  margin-bottom: 15% !important;
}

/* El texto de la frase */
.lry-quote p {
  color: #D4AF37 ; /* Dorado Let's Rock Yoga */
  /* CLAMP: Magia responsive. 
     Mínimo 1.8rem (móvil), Ideal 5vw, Máximo 2.8rem (PC) */
  font-size: clamp(1.8rem, 5vw, 2.0rem); 
  font-weight: 400; 
  font-style: italic; /* Cursiva para dinamismo */
  line-height: 1.2; /* Interlineado apretado, tipo titular */
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}

/* El autor de la cita (opcional) */
.lry-quote cite {
  display: block;
  color: #a0a0a0; /* Gris medio para no competir con el dorado */
  font-size: 0.9rem;
  font-style: normal;
  font-family: sans-serif;
  text-transform: uppercase; /* Mayúsculas tipo "sello" */
  letter-spacing: 2px; /* Espaciado entre letras elegante */
  font-weight: 400;
}

/* Decoración: Comilla gigante sutil detrás */
.lry-quote::before {
  content: "“";
  display: block;
  font-family: serif;
  font-size: 8rem;
  line-height: 0;
  color: rgba(212, 175, 55, 0.35); /* Dorado muy transparente de fondo */
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}

.wp-block-button.neon-button .wp-block-button__link,
.wp-block-navigation-item.neon-button a {
   
    /* Forma de pincelada: bordes irregulares con border-radius asimétrico */
    border-radius: 4px 8px 6px 10px / 8px 4px 10px 6px !important;
    
    /* Sombra difusa para dar sensación de borde "sucio" de pincel */
    box-shadow: 
        -3px 0px 6px 2px #b32424,
        3px 0px 6px 2px #b32424,
        0px 2px 4px rgba(0,0,0,0.5) !important;
    
    /* Sin máscara SVG */
    -webkit-mask-image: none !important;
    mask-image: none !important;
    
    color: #ffffff !important;
    font-family: 'Bebas Neue', sans-serif !important;
    font-weight: 400 !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.8);
    
    border: none !important;
    padding: 15px 40px !important;
    display: inline-block;
    transition: all 0.2s ease;
}

.wp-block-button.neon-button .wp-block-button__link:hover,
.wp-block-navigation-item.neon-button a:hover {
    transform: scale(1.05);
}

.wp-block-button.stroke-button .wp-block-button__link,
.wp-block-navigation-item.stroke-button a {
    /* ✅ La forma del brochazo escala sola al tamaño del botón */
    -webkit-mask-image: url('https://letsrockyoga.com/wp-content/uploads/2026/04/brush_stroke_mask.svg');
    -webkit-mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;

    mask-image: url('https://letsrockyoga.com/wp-content/uploads/2026/04/brush_stroke_mask.svg');
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    mask-position: center;

    border: none !important;
    box-shadow: none !important;

    /* ✅ Tipografía base — Gutenberg sobreescribe el font-size */
    font-family: 'Bebas Neue', sans-serif !important;
    font-weight: 400 !important;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.8);
    line-height: 1 !important;

    /* Padding horizontal fijo, vertical mínimo para que el brochazo no se infle */
    padding-left: 0.9em !important;
    padding-right: 0.9em !important;
    padding-top: 0.4em !important;
    padding-bottom: 0.4em !important;

    display: inline-block !important;
    transition: all 0.2s ease;
}

.wp-block-button.stroke-button .wp-block-button__link:hover,
.wp-block-navigation-item.stroke-button a:hover {
    opacity: 0.85;
    transform: scale(1.03);
}

.wp-block-navigation-item.nav-tag a {
    background-color: #8B3A2A !important;
    color: #ffffff !important;
    font-size: 0.80em !important;
    font-weight: 400 !important;
    letter-spacing: 1.5px;
    border-radius: 3px !important;
    border: none !important;

    display: inline-block;
    padding: 2px 10px !important;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.9);
    transition: all 0.2s ease;
}

.wp-block-navigation-item.nav-tag a:hover {
    background-color: #6e2d1f !important;
}

.hard-shadowed-text-white {
    font-weight: 500 !important;
    text-shadow: 
        -1px -1px 0 rgba(255,255,255,0.7),
         1px -1px 0 rgba(255,255,255,0.7),
        -1px  1px 0 rgba(255,255,255,0.7),
         1px  1px 0 rgba(255,255,255,0.7),
         2px 4px 6px rgba(0,0,0,0.3) !important;
}

/* 2. REGLA PARA MÓVILES (Pantallas menores a 768px) -> Borde blanco fino de 0.5px */
@media (max-width: 768px) {
    .hard-shadowed-text-white {
        text-shadow: 
            -0.5px -0.5px 0 rgba(255,255,255,0.6),
             0.5px -0.5px 0 rgba(255,255,255,0.6),
            -0.5px  0.5px 0 rgba(255,255,255,0.6),
             0.5px  0.5px 0 rgba(255,255,255,0.6),
             1px 2px 4px rgba(0,0,0,0.2) !important;
    }
}


/* ==========================================================================
   LET'S ROCK YOGA - Cabecera Editorial con Números de Fondo "Merriweather"
   ========================================================================== */

/* Estructura limpia para las columnas nativas de Gutenberg */
.wp-block-column.stylish-numbered-column {
    position: relative;
    padding: 55px 35px 40px 35px !important; /* Ajustado el padding superior para equilibrar el peso de Merriweather */
    border-radius: 12px;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Efecto hover premium de elevación */
.wp-block-column.stylish-numbered-column:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
}

/* --------------------------------------------------------------------------
   EL NÚMERO DE FONDO: Rediseño Tipográfico Editorial (Merriweather)
   -------------------------------------------------------------------------- */
.wp-block-column.stylish-numbered-column::before {
    position: absolute;
    top: -5px;       /* Desplazado ligeramente hacia arriba porque Merriweather tiene rasgos ascendentes elegantes */
    right: 25px;     /* Margen de seguridad para que la serifa del número no se corte */
    font-size: 10rem; /* Al ser una fuente serif, tolera un tamaño imponente y majestuoso */
    font-weight: 900; /* Usamos el peso más alto (Ultra Bold) para máxima presencia */
    font-family: 'Merriweather', 'Georgia', serif; /* Tu nueva fuente principal con caídas tipográficas tradicionales */
    line-height: 1;
    z-index: -1;     /* Se mantiene como un sello translúcido detrás del texto */
    pointer-events: none;
}

/* --------------------------------------------------------------------------
   PROGRESIÓN CROMÁTICA CON CONTRASTE OPTIMIZADO (Verificado para image_f04c05.png)
   -------------------------------------------------------------------------- */

/* TARJETA 1: El Bloque Negro Radical */
.wp-block-column.stylish-numbered-column:nth-child(1) {
    background-color: #1a1a1a !important;
}
.wp-block-column.stylish-numbered-column:nth-child(1) h1,
.wp-block-column.stylish-numbered-column:nth-child(1) h2,
.wp-block-column.stylish-numbered-column:nth-child(1) h3,
.wp-block-column.stylish-numbered-column:nth-child(1) h4,
.wp-block-column.stylish-numbered-column:nth-child(1) p,
.wp-block-column.stylish-numbered-column:nth-child(1) strong {
    color: #ffffff !important;
}
.wp-block-column.stylish-numbered-column:nth-child(1)::before {
    color: rgba(255, 255, 255, 0.07) !important; /* Presencia sutil pero nítida sobre negro */
}

/* TARJETA 2: El Bloque Dorado / Ocre Metódico */
.wp-block-column.stylish-numbered-column:nth-child(2) {
    background-color: #c5a043 !important;
}
.wp-block-column.stylish-numbered-column:nth-child(2) h1,
.wp-block-column.stylish-numbered-column:nth-child(2) h2,
.wp-block-column.stylish-numbered-column:nth-child(2) h3,
.wp-block-column.stylish-numbered-column:nth-child(2) h4,
.wp-block-column.stylish-numbered-column:nth-child(2) p,
.wp-block-column.stylish-numbered-column:nth-child(2) strong {
    color: #1a1a1a !important;
}
.wp-block-column.stylish-numbered-column:nth-child(2)::before {
    color: rgba(0, 0, 0, 0.11) !important; /* El número oscuro resalta con fuerza sobre el ocre */
}

/* TARJETA 3: El Bloque Gris Piedra / Arena Neutro */
.wp-block-column.stylish-numbered-column:nth-child(3) {
    background-color: #b5b0a7 !important;
}
.wp-block-column.stylish-numbered-column:nth-child(3) h1,
.wp-block-column.stylish-numbered-column:nth-child(3) h2,
.wp-block-column.stylish-numbered-column:nth-child(3) h3,
.wp-block-column.stylish-numbered-column:nth-child(3) h4,
.wp-block-column.stylish-numbered-column:nth-child(3) p,
.wp-block-column.stylish-numbered-column:nth-child(3) strong {
    color: #1a1a1a !important;
}
.wp-block-column.stylish-numbered-column:nth-child(3)::before {
    color: rgba(0, 0, 0, 0.11) !important; /* Definición limpia y legible sobre el gris */
}

/* --------------------------------------------------------------------------
   LÓGICA DEL CONTADOR (Formato numérico simple 1, 2, 3)
   -------------------------------------------------------------------------- */
.wp-block-columns {
    counter-reset: lry-editorial-counter;
}
.wp-block-column.stylish-numbered-column::before {
    counter-increment: lry-editorial-counter;
    content: counter(lry-editorial-counter);
}