/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 24 2026 | 22:57:28 */
/* ==========================================================
   TSR BLOG HUB / ARCHIVE
   Misma atmósfera que los artículos, adaptado a navegación
   ========================================================== */

:root{
  --tsr-wine:#751624;
  --tsr-wine-dark:#63111d;
  --tsr-ink:#222;
  --tsr-muted:#666;
  --tsr-line:rgba(0,0,0,.08);
  --tsr-soft:#f7f4f3;
  --tsr-card-shadow:0 14px 34px rgba(0,0,0,.06);
  --tsr-card-shadow-hover:0 18px 40px rgba(0,0,0,.10);
}


/* ==========================================================
   SHELL / BACKGROUND
   Idéntico al artículo
   ========================================================== */

.tsr-blog-shell{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.tsr-blog-shell > *{
  position:relative;
  z-index:1;
}

.tsr-blog-shell::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  background: radial-gradient(
    circle at 50% 40%,
    rgba(117,22,36,.05),
    rgba(117,22,36,0) 60%
  );
}

.tsr-blog-shell::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(circle at 20% 30%, rgba(117,22,36,.05) 0%, transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(117,22,36,.04) 0%, transparent 40%),
    url("https://typicalspanishrumba.com/wp-content/uploads/2026/03/typical-spanish-rumba-musica-bodas.webp");
  background-repeat:no-repeat,no-repeat,repeat;
  background-size:auto,auto,180px auto;
  background-position:0 0,0 0,0 0;
  opacity:.035;
  filter:grayscale(1) brightness(0);
}


/* ==========================================================
   HERO
   ========================================================== */

.tsr-blog-hero{
  max-width: 900px;
  margin: 0 auto 16px auto;
  text-align:center;
}

.tsr-blog-title{
  max-width: 860px;
  margin: 0 auto 14px auto !important;
  font-size: clamp(2.1rem, 4vw, 3.45rem);
  line-height: 1.08;
  font-weight: 500;
  letter-spacing: -.03em;
  color: var(--tsr-wine);
  text-wrap: balance;
}

.tsr-blog-intro{
  max-width: 760px;
  margin: 0 auto !important;
  font-size: clamp(1.05rem, 1.25vw, 1.18rem);
  line-height: 1.72;
  color: #4b4b4b;
}

.tsr-blog-intro p:last-child{
  margin-bottom:0;
}


/* ==========================================================
   SECCIONES
   ========================================================== */

.tsr-blog-section{
  max-width: 1200px;
  margin: 0 auto;
}

.tsr-blog-section-title{
  margin: 0 0 22px 0 !important;
  font-size: clamp(1.5rem, 1.9vw, 2rem);
  line-height: 1.25;
  font-weight: 500;
  color: var(--tsr-wine);
  letter-spacing: -0.01em;
  position:relative;
}

.tsr-blog-section-title::after{
  content:"";
  display:block;
  width:42px;
  height:2px;
  margin-top:10px;
  background:var(--tsr-wine);
  opacity:.55;
  border-radius:999px;
}


/* ==========================================================
   MINI CARDS (categorías / taxonomías manuales)
   ========================================================== */

.tsr-blog-mini-card{
  height:100%;
  padding: 26px 24px 24px 24px;
  border:1px solid rgba(117,22,36,.08);
  border-radius:20px;
  background:rgba(255,255,255,.82);
  backdrop-filter: blur(3px);
  box-shadow: 0 10px 24px rgba(0,0,0,.04);
  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;
}

.tsr-blog-mini-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 16px 32px rgba(0,0,0,.08);
  border-color: rgba(117,22,36,.16);
}

.tsr-blog-mini-card-title{
  margin: 0 0 10px 0 !important;
  font-size: 1.28rem;
  line-height: 1.25;
  color: var(--tsr-wine);
}

.tsr-blog-mini-card-text{
  margin-bottom: 18px !important;
  color:#4f4f4f;
  line-height:1.68;
}

.tsr-blog-mini-card-text p:last-child{
  margin-bottom:0;
}


/* ==========================================================
   LISTA DE TAXONOMÍAS / ENLACES
   ========================================================== */

.tsr-blog-tax-list{
  max-width: 920px;
  margin: 0 auto;
}

.tsr-blog-tax-list ul{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.tsr-blog-tax-list li{
  margin:0;
}

.tsr-blog-tax-list a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 16px;
  border-radius:999px;
  border:1px solid rgba(117,22,36,.12);
  background: rgba(255,255,255,.68);
  color: var(--tsr-wine-dark);
  text-decoration:none;
  line-height:1.2;
  transition:
    transform .22s ease,
    background .22s ease,
    border-color .22s ease,
    box-shadow .22s ease;
}

.tsr-blog-tax-list a:hover{
  transform: translateY(-2px);
  background: rgba(117,22,36,.06);
  border-color: rgba(117,22,36,.22);
  box-shadow: 0 8px 16px rgba(0,0,0,.05);
}


/* ==========================================================
   QUERY / LOOP
   ========================================================== */

.tsr-blog-query{
  max-width: 1200px;
  margin: 0 auto;
}

.tsr-blog-query .wp-block-post-template{
  gap: 28px;
}

.tsr-blog-query .wp-block-query-pagination{
  margin-top: 34px;
}


/* ==========================================================
   CARD DE POSTS
   Compatible con GenerateBlocks
   ========================================================== */

.tsr-blog-card{
  position:relative;
  display:flex;
  flex-direction:column;
  height:100%;
  overflow:hidden;
  border-radius:22px;
  background: rgba(255,255,255,.88);
  border:1px solid rgba(117,22,36,.08);
  box-shadow: var(--tsr-card-shadow);
  backdrop-filter: blur(3px);
  transition:
    transform .30s ease,
    box-shadow .30s ease,
    border-color .30s ease;
}

.tsr-blog-card:hover{
  transform: translateY(-6px);
  box-shadow: var(--tsr-card-shadow-hover);
  border-color: rgba(117,22,36,.16);
}

.tsr-blog-card-media{
  position:relative;
  overflow:hidden;
  aspect-ratio: 16 / 10;
  background:#eee;
}

.tsr-blog-card-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition: transform .55s ease;
}

.tsr-blog-card:hover .tsr-blog-card-media img{
  transform: scale(1.04);
}

.tsr-blog-card-body{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  padding: 22px 22px 22px 22px;
}

.tsr-blog-card-meta{
  margin-bottom: 10px;
  font-size: .84rem;
  line-height:1.3;
  letter-spacing:.04em;
  text-transform:uppercase;
  color: var(--tsr-muted);
}

.tsr-blog-card-title{
  margin: 0 0 12px 0 !important;
  font-size: clamp(1.16rem, 1.35vw, 1.34rem);
  line-height: 1.28;
  font-weight: 500;
  letter-spacing: -.01em;
}

.tsr-blog-card-title a{
  color: var(--tsr-wine);
  text-decoration:none;
}

.tsr-blog-card-title a:hover{
  text-decoration: underline;
  text-underline-offset: .14em;
}

.tsr-blog-card-excerpt{
  margin-bottom: 20px !important;
  color:#4d4d4d;
  line-height:1.68;
  flex:1 1 auto;
}

.tsr-blog-card-excerpt p:last-child{
  margin-bottom:0;
}


/* ==========================================================
   BOTONES DEL BLOG
   ========================================================== */

.tsr-blog-card-button,
.tsr-blog-mini-card-button,
.tsr-blog-shell .wp-block-button.is-style-fill .wp-block-button__link,
.tsr-blog-shell .gb-button,
.tsr-blog-shell .gb-button-wrapper a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height: 48px;
  padding: 13px 22px;
  border:0;
  border-radius:999px;
  background: linear-gradient(180deg, #8a1a2b 0%, #6f1220 100%);
  color:#fff !important;
  text-decoration:none !important;
  font-weight:500;
  line-height:1.15;
  box-shadow: 0 10px 22px rgba(0,0,0,.14);
  transition:
    transform .24s ease,
    box-shadow .24s ease,
    filter .24s ease;
}

.tsr-blog-card-button:hover,
.tsr-blog-mini-card-button:hover,
.tsr-blog-shell .wp-block-button.is-style-fill .wp-block-button__link:hover,
.tsr-blog-shell .gb-button:hover,
.tsr-blog-shell .gb-button-wrapper a:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(0,0,0,.16);
  filter: brightness(1.02);
}


/* ==========================================================
   PAGINACIÓN
   ========================================================== */

.tsr-blog-pagination,
.tsr-blog-shell .wp-block-query-pagination{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:10px;
}

.tsr-blog-shell .wp-block-query-pagination a,
.tsr-blog-shell .wp-block-query-pagination span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  min-height:44px;
  padding: 8px 14px;
  border-radius:999px;
  text-decoration:none;
  border:1px solid rgba(117,22,36,.12);
  background: rgba(255,255,255,.72);
  color: var(--tsr-wine-dark);
}

.tsr-blog-shell .wp-block-query-pagination a:hover{
  background: rgba(117,22,36,.06);
  border-color: rgba(117,22,36,.22);
}

.tsr-blog-shell .wp-block-query-pagination .current{
  background: linear-gradient(180deg, #8a1a2b 0%, #6f1220 100%);
  color:#fff;
  border-color:transparent;
  box-shadow: 0 10px 22px rgba(0,0,0,.12);
}


/* ==========================================================
   ENLACES GENERALES DEL BLOG
   ========================================================== */

.tsr-blog-shell a:not(.wp-block-button__link):not(.gb-button):not(.tsr-blog-card-button):not(.tsr-blog-mini-card-button){
  text-decoration-thickness: 1px;
  text-underline-offset: .13em;
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width: 920px){

  .tsr-blog-title{
    font-size: clamp(1.95rem, 7vw, 2.9rem);
    line-height:1.1;
  }

  .tsr-blog-intro{
    font-size: 1.02rem;
    line-height:1.66;
  }

  .tsr-blog-query .wp-block-post-template{
    gap: 22px;
  }

  .tsr-blog-card-body{
    padding: 20px;
  }
}

@media (max-width: 640px){

  .tsr-blog-shell{
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .tsr-blog-mini-card{
    padding: 22px 18px;
    border-radius:18px;
  }

  .tsr-blog-card{
    border-radius:18px;
  }

  .tsr-blog-card-body{
    padding:18px;
  }

  .tsr-blog-card-title{
    font-size:1.12rem;
  }
}





