/* =========================================
 * UNIT FITNESS — PAGES (pages.css)
 * Limpio + sin duplicados
 * Incluye: Page hero, grids, listas, horarios, tarifas
 * + FIX real: CrossFit/HYROX/Muscle/Haltero con el MISMO look
 * ========================================= */

/* =========================
 * PAGE HERO (usa --ph)
 * ========================= */
.uf-pagehero{
  position:relative;
  padding:84px 0 48px;
  overflow:hidden;

  /* default (por si no se pasa nada) */
  --ph: none;

  /* overlay (mismo estilo en TODAS) */
  --ph-overlay-top:  rgba(11,13,16,.28);
  --ph-overlay-mid:  rgba(11,13,16,.68);
  --ph-overlay-bot:  rgba(11,13,16,.96);
}

/* base hero */
.uf-pagehero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      180deg,
      var(--ph-overlay-top) 0%,
      var(--ph-overlay-mid) 55%,
      var(--ph-overlay-bot) 100%
    ),
    var(--ph) center/cover no-repeat;

  transform:scale(1.02);
  filter:none !important;
}

.uf-pagehero::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(60% 60% at 18% 18%, rgba(245,196,0,.12), transparent 55%);
  pointer-events:none;
  opacity:.90;
}

.uf-pagehero-inner{
  position:relative;
  z-index:2;
  max-width:74ch;
}

/* =========================
 * FALLBACKS por clase (si NO pasas --ph en inline)
 * ========================= */
.uf-pagehero.uf-hero-crossfit{ --ph: url("../img/crossfit/crossfit-hero.jpg"); }
.uf-pagehero.uf-hero-hyrox{    --ph: url("../img/hyrox/hyrox-hero.jpg"); }
.uf-pagehero.uf-hero-muscle{   --ph: url("../img/muscle-area-hero.jpg"); }
.uf-pagehero.uf-hero-haltero{  --ph: url("../img/halterofilia-hero.jpg"); }

/* Si tu hero de Hyrox tiene otro nombre de archivo */
.uf-pagehero.uf-hero-hyrox.is-alt{ --ph: url("../img/hyrox/hyrox.jpg"); }

/* =========================================================
 * FIX DEFINITIVO: CrossFit hero usando --ph (NO otras vars)
 * ========================================================= */
.uf-pagehero.uf-hero-crossfit::before{
  background:
    linear-gradient(
      180deg,
      rgba(11,13,16,.28) 0%,
      rgba(11,13,16,.68) 55%,
      rgba(11,13,16,.96) 100%
    ),
    var(--ph) center 18% / cover no-repeat !important;
  transform: scale(1.02);
  filter: none !important;
}

.uf-pagehero.uf-hero-crossfit::after{
  background: radial-gradient(60% 60% at 18% 18%, rgba(245,196,0,.12), transparent 55%);
  opacity: 1 !important;
}

.uf-pagehero.uf-hero-crossfit .uf-pagehero-inner{
  position: relative;
  z-index: 2;
}

/* =========================================================
 * FIX REAL: Muscle Area + Halterofilia usan .uf-hero-generic
 * (NO .uf-pagehero). En tu HTML:
 * <section class="uf-hero uf-hero-generic" style="--uf-hero-img:url(...)">
 *
 * Esto ajusta SOLO esas dos imágenes (detectadas por el filename),
 * sin tocar otros héroes.
 * ========================================================= */

/* Base defensiva (sin romper lo existente) */
.uf-hero.uf-hero-generic{
  position: relative;
  overflow: hidden;
}

/* Asegura contenido por encima */
.uf-hero.uf-hero-generic .uf-hero-inner{
  position: relative;
  z-index: 2;
}

/* ---- MUSCLE AREA (usa muscle-area-hero.jpg) ---- */
.uf-hero.uf-hero-generic[style*="muscle-area-hero.jpg"]{
  filter: none !important;
  opacity: 1 !important;
}

/* Si hay una capa extra que oscurece (normalmente ::after), la anulamos */
.uf-hero.uf-hero-generic[style*="muscle-area-hero.jpg"]::after{
  background: none !important;
  opacity: 0 !important;
}

/* Forzamos un overlay más luminoso + la imagen desde la variable real */
.uf-hero.uf-hero-generic[style*="muscle-area-hero.jpg"]::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    linear-gradient(180deg,
      rgba(11,13,16,.14) 0%,
      rgba(11,13,16,.40) 55%,
      rgba(11,13,16,.68) 100%
    ),
    var(--uf-hero-img) center 30% / cover no-repeat !important;
  transform: scale(1.02) !important;
  filter: none !important;
  opacity: 1 !important;
}

/* ---- HALTEROFILIA (usa halterofilia-hero.jpg) ---- */
.uf-hero.uf-hero-generic[style*="halterofilia-hero.jpg"]{
  filter: none !important;
  opacity: 1 !important;
}

.uf-hero.uf-hero-generic[style*="halterofilia-hero.jpg"]::after{
  background: none !important;
  opacity: 0 !important;
}

.uf-hero.uf-hero-generic[style*="halterofilia-hero.jpg"]::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    linear-gradient(180deg,
      rgba(11,13,16,.14) 0%,
      rgba(11,13,16,.40) 55%,
      rgba(11,13,16,.68) 100%
    ),
    var(--uf-hero-img) center 30% / cover no-repeat !important;
  transform: scale(1.02) !important;
  filter: none !important;
  opacity: 1 !important;
}

/* =========================
 * Utilities
 * ========================= */
.uf-pad{ padding:18px; }
.uf-h2{ margin:0 0 10px; font-size:24px; }
.uf-h3{ margin:0 0 8px;  font-size:18px; }
.uf-p{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}
.uf-page{ min-height:60vh; }
.uf-hero-mini{ padding:54px 0 26px; }

/* =========================
 * Grids
 * ========================= */
.uf-grid-3{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
}
@media (max-width: 900px){
  .uf-grid-3{ grid-template-columns:1fr; }
}

/* =========================
 * Split blocks (media + text)
 * ========================= */
.uf-split{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
}
.uf-split-media{
  min-height:320px;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}
@media (max-width:900px){
  .uf-split{ grid-template-columns:1fr; }
  .uf-split-media{ min-height:220px; }
}

/* =========================
 * Lists (premium, sin viñetas)
 * ========================= */
.uf-list{
  margin:12px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:10px;
}
.uf-list li{
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  color: rgba(244,246,248,.90);
}

/* ===========================
 * Unit Fitness — Horarios
 * =========================== */
.uf-schedule{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
  margin-top:18px;
}
@media (max-width: 900px){
  .uf-schedule{ grid-template-columns:1fr; }
}
.uf-schedule-day{ overflow:hidden; }
.uf-schedule-head{
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.02);
}
.uf-schedule-title{
  font-weight:950;
  letter-spacing:.01em;
}
.uf-schedule-list{ padding:10px 10px 14px; }
.uf-schedule-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.02);
  margin-top:10px;
}
.uf-schedule-time{
  font-weight:900;
  color:rgba(244,246,248,.92);
}
.uf-schedule-tag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.03);
  font-weight:900;
  color:rgba(244,246,248,.92);
}
.uf-schedule-tag::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:99px;
  background:var(--brand);
  box-shadow:0 0 0 6px rgba(245,196,0,.14);
  margin-right:8px;
}

/* ===========================
 * TARIFAS — Página (layout final)
 * Solo afecta a /tarifas/ (body.page-tarifas)
 * =========================== */
body.page-tarifas .uf-pricing-page{
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}

body.page-tarifas .uf-pricing-page .uf-wide{
  width: 100%;
  max-width: 1400px;
  margin: 0 auto !important;

  padding-left: clamp(16px, 4vw, 64px);
  padding-right: clamp(16px, 4vw, 64px);

  display: grid;
  gap: clamp(16px, 2.2vw, 28px);
  align-items: start;

  grid-template-columns: repeat(auto-fit, minmax(520px, 1fr));
  justify-items: stretch;
}

body.page-tarifas .uf-pricing-page .uf-pricing-block,
body.page-tarifas .uf-pricing-page .uf-pricing-card{
  width: 100%;
  max-width: none !important;
}

body.page-tarifas .uf-pricing-page .uf-pricing-desc{ min-width: 0; }
body.page-tarifas .uf-pricing-page .uf-pricing-row{ overflow: visible; }

body.page-tarifas .uf-pricing-page .uf-pricing-notes{
  grid-column: 1 / -1;
}

@media (max-width: 640px){
  body.page-tarifas .uf-pricing-page .uf-wide{
    grid-template-columns: 1fr;
  }
}

/* =========================
 * CTA · ¿Qué es HYROX?
 * ========================= */
.uf-cta-hyrox-card{
  padding:22px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(900px 420px at 20% 0%, rgba(255,255,255,.06), transparent 60%),
    rgba(255,255,255,.03);
  box-shadow: 0 18px 55px rgba(0,0,0,.45);
}
/* =========================================================
 * UNIT FITNESS — TARIFAS (Premium real)
 * Página: /tarifas/  (body.page-id-17)
 * ========================================================= */
body.page-id-17 #content.site-main{
  width:100%;
  max-width:none;
}

/* Header (título grande + aire premium) */
body.page-id-17 .page-header{
  padding: clamp(22px, 4vw, 54px) 0 8px;
}
body.page-id-17 .page-header .entry-title{
  font-size: clamp(44px, 5vw, 74px);
  letter-spacing: -.02em;
  margin: 0;
}

/* Sección pricing: ancho + padding pro */
body.page-id-17 .uf-pricing-page{
  padding: 10px 0 70px;
}
body.page-id-17 .uf-pricing-page .uf-wide{
  width:100%;
  max-width:none !important;
  margin:0 !important;
  padding-left: clamp(16px, 3vw, 56px) !important;
  padding-right: clamp(16px, 3vw, 56px) !important;
}

/* Grid de bloques (Muscle / HYROX / Haltero / Packs / Completas) */
body.page-id-17 .uf-pricing-page .uf-wide{
  display:grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 22px;
  align-items:start;
}

/* Cada bloque ocupa 6 columnas (2 por fila en desktop) */
body.page-id-17 .uf-pricing-block{
  grid-column: span 6;
}

/* Notas al final a ancho completo */
body.page-id-17 .uf-pricing-notes{
  grid-column: 1 / -1;
  margin-top: 8px;
  padding: 16px 18px;
  border-radius: 18px;
  border: 1px solid rgba(212,175,55,.22);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  box-shadow: 0 18px 60px rgba(0,0,0,.35);
}
body.page-id-17 .uf-pricing-notes p{
  margin: 8px 0;
  color: rgba(255,255,255,.78);
  line-height: 1.6;
}

/* Título de cada bloque */
body.page-id-17 .uf-pricing-title{
  margin: 0 0 12px;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: .2px;
  color: rgba(255,255,255,.92);
}
body.page-id-17 .uf-pricing-title::after{
  content:"";
  display:block;
  width: 44px;
  height: 2px;
  margin-top: 10px;
  background: rgba(212,175,55,.9);
  border-radius: 2px;
  opacity: .95;
}

/* Card contenedora */
body.page-id-17 .uf-pricing-card{
  border-radius: 26px;
  border: 1px solid rgba(212,175,55,.22);
  background:
    radial-gradient(60% 60% at 18% 18%, rgba(212,175,55,.08), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  box-shadow: 0 26px 90px rgba(0,0,0,.55);
  overflow:hidden;
}

/* Filas */
body.page-id-17 .uf-pricing-row{
  display:flex;
  gap: 16px;
  align-items:center;
  padding: 16px 18px;
  border-top: 1px solid rgba(255,255,255,.07);
}
body.page-id-17 .uf-pricing-row:first-child{
  border-top: 0;
}

/* Columna precio */
body.page-id-17 .uf-pricing-price{
  min-width: 118px;
  padding: 12px 12px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
  text-align:left;
}

/* € grande */
body.page-id-17 .uf-pricing-eur{
  font-size: 26px;
  font-weight: 950;
  letter-spacing: -.02em;
  color: rgba(212,175,55,.95);
  line-height: 1.05;
}

/* MES / TRIMESTRE / etc */
body.page-id-17 .uf-pricing-per{
  margin-top: 4px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(255,255,255,.68);
}

/* Descripción */
body.page-id-17 .uf-pricing-desc{
  flex:1;
  min-width: 0;
}
body.page-id-17 .uf-pricing-rowtitle{
  font-weight: 900;
  color: rgba(255,255,255,.92);
  margin-bottom: 4px;
}
body.page-id-17 .uf-pricing-sub{
  color: rgba(255,255,255,.72);
  line-height: 1.45;
}

/* Hover pro */
@media (hover:hover){
  body.page-id-17 .uf-pricing-row{
    transition: background .25s ease, transform .25s ease;
  }
  body.page-id-17 .uf-pricing-row:hover{
    background: rgba(255,255,255,.03);
    transform: translateY(-1px);
  }
}

/* Responsive */
@media (max-width: 1100px){
  body.page-id-17 .uf-pricing-block{ grid-column: span 12; }
}
@media (max-width: 640px){
  body.page-id-17 .page-header{ padding-top: 18px; }
  body.page-id-17 .uf-pricing-row{
    align-items:flex-start;
    flex-direction: column;
  }
  body.page-id-17 .uf-pricing-price{
    width: 100%;
  }
}
/* =========================================================
 * TARIFAS — ULTRA PREMIUM (v2)
 * Solo /tarifas/ (page-id-17)
 * ========================================================= */

/* Fondo sutil con “lux glow” */
body.page-id-17 #content.site-main{
  position: relative;
}
body.page-id-17 #content.site-main::before{
  content:"";
  position:absolute;
  inset:-40px 0 auto 0;
  height: 420px;
  background:
    radial-gradient(55% 70% at 18% 22%, rgba(212,175,55,.18), transparent 60%),
    radial-gradient(40% 60% at 78% 18%, rgba(255,255,255,.06), transparent 62%),
    linear-gradient(180deg, rgba(0,0,0,.0), rgba(0,0,0,.0));
  pointer-events:none;
  z-index:0;
}
body.page-id-17 #content.site-main > *{
  position: relative;
  z-index: 1;
}

/* Header más “hero” */
body.page-id-17 .page-header{
  padding: clamp(24px, 4vw, 66px) 0 12px;
}
body.page-id-17 .page-header .entry-title{
  font-size: clamp(48px, 5.2vw, 82px);
  line-height: 1.04;
  letter-spacing: -.03em;
  text-shadow: 0 26px 90px rgba(0,0,0,.55);
}

/* Card contenedora: más profundidad + borde fino */
body.page-id-17 .uf-pricing-card{
  border-radius: 28px;
  border: 1px solid rgba(212,175,55,.26);
  background:
    radial-gradient(90% 70% at 12% 8%, rgba(212,175,55,.12), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.018));
  box-shadow:
    0 34px 120px rgba(0,0,0,.62),
    inset 0 1px 0 rgba(255,255,255,.07);
}

/* Filas: separadores más finos */
body.page-id-17 .uf-pricing-row{
  border-top: 1px solid rgba(255,255,255,.06);
  padding: 18px 18px;
}

/* Precio: estilo “chip” premium */
body.page-id-17 .uf-pricing-price{
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,.12));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 16px 50px rgba(0,0,0,.35);
}

/* Euro más “lux” */
body.page-id-17 .uf-pricing-eur{
  font-size: 28px;
  letter-spacing: -.03em;
  text-shadow: 0 18px 55px rgba(212,175,55,.12);
}

/* Bloques: “lift” en hover */
@media (hover:hover){
  body.page-id-17 .uf-pricing-block{
    transition: transform .35s ease, filter .35s ease;
  }
  body.page-id-17 .uf-pricing-block:hover{
    transform: translateY(-6px);
    filter: saturate(1.02);
  }
}

/* ====== DESTACADO AUTOMÁTICO (sin tocar HTML)
   Hace “featured” al 2º bloque (Tarifas HYROX).
   Si quieres otro, te digo cómo cambiarlo en 1 número.
====== */
body.page-id-17 .uf-pricing-block:nth-of-type(2) .uf-pricing-card{
  border: 1px solid rgba(212,175,55,.44);
  box-shadow:
    0 46px 150px rgba(0,0,0,.74),
    0 0 0 1px rgba(212,175,55,.12) inset;
}
body.page-id-17 .uf-pricing-block:nth-of-type(2) .uf-pricing-title{
  position: relative;
  padding-right: 120px;
}
body.page-id-17 .uf-pricing-block:nth-of-type(2) .uf-pricing-title::before{
  content:"Más popular";
  position:absolute;
  right:0;
  top:2px;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(212,175,55,.45);
  background: rgba(212,175,55,.10);
  color: rgba(255,255,255,.92);
}

/* Notas: más elegantes */
body.page-id-17 .uf-pricing-notes{
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.018));
  box-shadow: 0 22px 70px rgba(0,0,0,.42);
}

/* Mobile: menos “glow” arriba */
@media (max-width: 640px){
  body.page-id-17 #content.site-main::before{
    height: 280px;
    opacity: .9;
  }
}
/* =========================================================
 * BLOG / POSTS — Premium Magazine
 * ========================================================= */
.uf-blog-hero{ padding: 110px 0 22px; }
.uf-blog-h1{ margin: 0; font-size: clamp(34px, 4vw, 54px); letter-spacing: -0.02em; }
.uf-blog-lead{ margin: 10px 0 0; max-width: 78ch; opacity: .85; }

.uf-blog-wrap{ padding-bottom: 90px; }

.uf-blog-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 18px;
  margin-top: 18px;
}

@media (max-width: 1100px){ .uf-blog-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px){ .uf-blog-grid{ grid-template-columns: 1fr; } }

.uf-post-card{
  position: relative;
  overflow:hidden;
  border-radius: 26px;
  border: 1px solid rgba(212,175,55,.22);
  background: rgba(255,255,255,.04);
  box-shadow: 0 26px 70px rgba(0,0,0,.55);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.uf-post-card:hover{
  transform: translateY(-4px);
  border-color: rgba(212,175,55,.34);
  box-shadow: 0 34px 90px rgba(0,0,0,.65);
}

.uf-post-link{ position:absolute; inset:0; z-index:2; }

.uf-post-media{
  height: 220px;
  background-size: cover;
  background-position: center;
  border-bottom: 1px solid rgba(255,255,255,.10);
  filter: saturate(1.06) contrast(1.06);
}

.uf-post-body{ padding: 16px 16px 18px; position:relative; z-index:3; }
.uf-post-meta{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  margin-bottom: 10px;
}

.uf-post-chip{
  display:inline-flex; align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(212,175,55,.28);
  background: rgba(212,175,55,.10);
  font-weight: 800;
  font-size: 12px;
}
.uf-post-muted{ opacity:.75; font-size: 12px; }
.uf-post-dot{ opacity:.5; }

.uf-post-title{
  margin: 0 0 10px;
  font-size: 20px;
  line-height: 1.25;
  letter-spacing: -0.01em;
}

.uf-post-excerpt{
  margin: 0;
  opacity: .85;
  line-height: 1.6;
}

.uf-post-cta{ margin-top: 12px; }
.uf-post-more{ font-weight: 900; color: var(--brand); }

.uf-blog-pagination{ margin-top: 26px; }
.uf-blog-pagination ul{
  list-style:none; padding:0; margin:0;
  display:flex; gap:10px; flex-wrap:wrap; justify-content:center;
}
.uf-blog-pagination a, .uf-blog-pagination span{
  display:inline-flex; align-items:center; justify-content:center;
  min-width: 40px; height: 40px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  padding: 0 12px;
  font-weight: 900;
}
.uf-blog-pagination .current{
  border-color: rgba(212,175,55,.45);
  background: rgba(212,175,55,.14);
}

/* SINGLE POST */
.uf-post-hero{ position:relative; overflow:hidden; padding: 120px 0 34px; }
.uf-post-hero-bg{
  position:absolute; inset:0;
  background-size: cover; background-position: center;
  transform: scale(1.04);
}
.uf-post-hero-overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(11,13,16,.35) 0%, rgba(11,13,16,.82) 60%, rgba(11,13,16,.98) 100%),
    radial-gradient(60% 60% at 18% 18%, rgba(245,196,0,.18), transparent 55%);
}

.uf-post-hero-inner{ position:relative; z-index:2; }
.uf-post-h1{ margin: 10px 0 0; font-size: clamp(34px, 4.2vw, 62px); letter-spacing:-0.03em; }
.uf-post-lead{ margin: 12px 0 0; max-width: 80ch; opacity:.88; font-size: 18px; line-height:1.6; }
.uf-post-hero-ctas{ margin-top: 18px; display:flex; gap:12px; flex-wrap:wrap; }

.uf-post-content{ padding: 26px 0 90px; }
.uf-post-article{ padding: 22px; border-radius: 26px; }
.uf-post-prose{ max-width: 82ch; }
.uf-post-prose p{ line-height:1.8; opacity:.92; }
.uf-post-prose h2{ margin-top: 22px; }

.uf-post-bottom-cta{
  margin-top: 16px;
  padding: 18px;
  border-radius: 22px;
  display:flex;
  gap: 14px;
  align-items:center;
  justify-content: space-between;
}
@media (max-width: 700px){
  .uf-post-bottom-cta{ flex-direction: column; align-items:flex-start; }
}
/* =========================================
   BLOG (SINGLE POST) — look ULTRA PREMIUM
   ========================================= */

/* ancho + aire */
body.single-post .site-main{
  padding-top: 18px;
}
body.single-post .site-main article{
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 clamp(16px, 3vw, 48px);
}

/* HERO header (título + meta) */
body.single-post .entry-header{
  position: relative;
  border-radius: 28px;
  overflow: hidden;
  border: 1px solid rgba(212,175,55,.22);
  background: rgba(12,14,18,.55);
  box-shadow: 0 26px 90px rgba(0,0,0,.65);
  padding: clamp(22px, 3vw, 40px);
  margin-bottom: 18px;
}

/* Imagen destacada dentro del hero (que no “reviente” ni se deforme) */
body.single-post .post-thumbnail{
  margin: 0 0 18px 0 !important;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
}
body.single-post .post-thumbnail img.wp-post-image{
  width: 100% !important;
  height: clamp(260px, 32vw, 520px) !important;
  object-fit: cover !important;
  object-position: 50% 38% !important;
  display: block !important;
}

/* Meta (categoría/fecha/tiempo) como “píldoras” */
body.single-post .entry-meta,
body.single-post .entry-meta a{
  color: rgba(255,255,255,.78) !important;
  text-decoration: none !important;
  font-size: 13px;
}
body.single-post .entry-meta{
  display: inline-flex;
  gap: 10px;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
  margin: 6px 0 14px 0;
}

/* Título */
body.single-post .entry-title{
  margin: 0 0 10px 0;
  font-weight: 950;
  letter-spacing: -0.02em;
  font-size: clamp(28px, 3.2vw, 46px);
  line-height: 1.05;
}

/* excerpt (si existe) */
body.single-post .entry-content > p:first-child{
  color: rgba(255,255,255,.86);
  font-size: 16px;
  line-height: 1.7;
  max-width: 78ch;
}

/* contenido en “card” premium */
body.single-post .entry-content{
  margin-top: 18px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  box-shadow: 0 26px 90px rgba(0,0,0,.55);
  padding: clamp(18px, 2.6vw, 34px);
}

/* tipografía dentro del post */
body.single-post .entry-content h2{
  margin: 26px 0 10px;
  font-size: clamp(20px, 2.2vw, 30px);
  letter-spacing: -0.01em;
  font-weight: 900;
}
body.single-post .entry-content p,
body.single-post .entry-content li{
  color: rgba(255,255,255,.86);
  line-height: 1.75;
  font-size: 16px;
}
body.single-post .entry-content a{
  color: var(--brand);
  text-decoration: none;
  border-bottom: 1px solid rgba(245,196,0,.35);
}
body.single-post .entry-content a:hover{
  border-bottom-color: rgba(245,196,0,.7);
}

/* imágenes dentro del contenido */
body.single-post .entry-content img{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 18px 70px rgba(0,0,0,.45);
}

/* “botones” tipo premium (por si tienes links CTA dentro del post) */
body.single-post .entry-content .wp-block-button__link,
body.single-post .entry-content a.uf-btn{
  border-radius: 999px !important;
  font-weight: 900 !important;
}

/* móvil */
@media (max-width: 640px){
  body.single-post .entry-header{ padding: 18px; border-radius: 22px; }
  body.single-post .entry-content{ padding: 18px; border-radius: 22px; }
}