/*
Theme Name: Rock del Canal
Description: Tema para rockdelcanal.com — portada tipo blog con entradas grandes (imagen, título y texto), y botón solo cuando hay más que leer.
Version: 1.0.0
Author: Salvatore
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: rockdelcanal
*/

:root{
  --rojo:#e3101a; --rojo-osc:#b80c14; --azul:#2a2f88; --tinta:#16161f; --gris:#6a6873; --linea:#e4e1da;
  --fondo:#ffffff; --fondo-2:#f6f4ef; --max:1120px;
  --display:"Montserrat","Arial Black","Helvetica Neue",Arial,sans-serif;
  --texto:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--tinta);font:17px/1.6 var(--texto);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--azul)}
a:hover{color:var(--rojo)}
.contenedor{max-width:var(--max);margin:0 auto;padding:0 20px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
.saltar:focus{position:fixed;top:8px;left:8px;z-index:100;background:#fff;padding:10px 14px;width:auto;height:auto;clip:auto}

/* ---------- Encabezado ---------- */
.cabecera{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--linea)}
.admin-bar .cabecera{top:32px}
@media (max-width:782px){.admin-bar .cabecera{top:46px}}
.cabecera .contenedor{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:76px}
.logo img{height:52px;width:auto}
.logo .texto{font:900 26px/1 var(--display);text-transform:uppercase;color:var(--rojo);text-decoration:none}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:4px;align-items:center}
.nav a{display:block;padding:10px 14px;border-radius:10px;text-decoration:none;color:var(--tinta);font:700 14px/1 var(--display);text-transform:uppercase;letter-spacing:.04em}
.nav a:hover,.nav .current-menu-item>a{color:var(--rojo)}
.nav .boton-app>a{background:var(--azul);color:#fff}
.nav .boton-app>a:hover{background:var(--rojo);color:#fff}
.menu-toggle{display:none;border:0;background:none;width:44px;height:44px;border-radius:10px;cursor:pointer;color:var(--tinta)}
.menu-toggle svg{width:26px;height:26px}
@media (max-width:820px){
  .menu-toggle{display:grid;place-items:center}
  .nav{position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--linea);display:none;padding:8px 12px 16px}
  .nav.abierto{display:block}
  .nav ul{flex-direction:column;align-items:stretch}
  .nav a{padding:14px 12px;font-size:15px}
  .logo img{height:42px}
}

/* ---------- Portada ---------- */
.lema{background:var(--fondo-2);border-bottom:1px solid var(--linea)}
.lema .contenedor{padding-top:28px;padding-bottom:28px;text-align:center}
.lema p{margin:0;font:800 clamp(18px,3vw,24px)/1.3 var(--display);text-transform:uppercase;letter-spacing:.02em}
.lema p span{color:var(--azul)}
.entradas{padding-top:20px;padding-bottom:40px}
.entrada{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding:44px 0;border-bottom:1px solid var(--linea)}
.entrada:last-child{border-bottom:0}
.entrada:nth-child(even) .entrada-img{order:2}
.entrada.sin-img{grid-template-columns:1fr;max-width:760px;margin:0 auto}
.entrada-img a,.entrada-img>div{display:block;overflow:hidden;border-radius:6px;box-shadow:0 2px 6px rgba(0,0,0,.08),0 18px 40px rgba(0,0,0,.12)}
.entrada-img img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform .5s}
.entrada-img a:hover img{transform:scale(1.03)}
.entrada .meta{font:700 12.5px/1 var(--display);text-transform:uppercase;letter-spacing:.1em;color:var(--gris);margin-bottom:12px}
.entrada .meta a{color:var(--rojo);text-decoration:none}
.entrada h2{margin:0;font:900 clamp(28px,4.2vw,46px)/1.02 var(--display);text-transform:uppercase;letter-spacing:-.01em}
.entrada h2 a{color:var(--tinta);text-decoration:none}
.entrada h2 a:hover{color:var(--rojo)}
.entrada .subtitulo{margin:10px 0 0;font:800 clamp(17px,2vw,21px)/1.25 var(--display);color:var(--azul);text-transform:uppercase}
.entrada .texto{margin-top:18px;color:#3b3944}
.entrada .texto p{margin:0 0 12px}
.entrada .texto>*:last-child{margin-bottom:0}
.boton{display:inline-flex;align-items:center;gap:8px;margin-top:22px;background:var(--rojo);color:#fff!important;text-decoration:none;font:800 14px/1 var(--display);text-transform:uppercase;letter-spacing:.06em;padding:15px 24px;border-radius:999px;transition:background .2s}
.boton:hover{background:var(--azul)}
.boton svg{width:16px;height:16px}
@media (max-width:820px){
  .entrada{grid-template-columns:1fr;gap:22px;padding:30px 0}
  .entrada:nth-child(even) .entrada-img{order:0}
}

.paginacion{display:flex;justify-content:center;gap:8px;padding:10px 0 50px;flex-wrap:wrap}
.paginacion .page-numbers{display:grid;place-items:center;min-width:44px;height:44px;padding:0 12px;border:1px solid var(--linea);border-radius:999px;text-decoration:none;color:var(--tinta);font-weight:700}
.paginacion .current{background:var(--tinta);color:#fff;border-color:var(--tinta)}

/* ---------- Entrada completa y páginas ---------- */
.articulo{max-width:780px;margin:0 auto;padding:44px 20px 60px}
.articulo .meta{font:700 12.5px/1 var(--display);text-transform:uppercase;letter-spacing:.1em;color:var(--gris)}
.articulo h1{margin:12px 0 0;font:900 clamp(32px,6vw,54px)/1.02 var(--display);text-transform:uppercase;letter-spacing:-.01em}
.articulo .subtitulo{margin:12px 0 0;font:800 clamp(18px,2.4vw,23px)/1.25 var(--display);color:var(--azul);text-transform:uppercase}
.articulo .destacada{margin:30px 0;border-radius:6px;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.12)}
.contenido{font-size:18px;line-height:1.7}
.contenido h2,.contenido h3{font-family:var(--display);text-transform:uppercase;line-height:1.15;margin:1.6em 0 .5em}
.contenido img{border-radius:6px}
.contenido blockquote{margin:1.5em 0;padding:4px 0 4px 20px;border-left:4px solid var(--rojo);font-size:1.1em;color:#3b3944}
.contenido .wp-block-embed,.contenido iframe{max-width:100%}
.volver-inicio{display:inline-block;margin-top:36px;font:800 13px/1 var(--display);text-transform:uppercase;letter-spacing:.08em;text-decoration:none}

/* ---------- Pie ---------- */
.pie{background:var(--fondo-2);color:var(--gris);padding:44px 0 36px;margin-top:20px;border-top:1px solid var(--linea)}
.pie .contenedor{display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}
.pie .logo-pie img{height:64px;width:auto}
.redes{display:flex;gap:12px}
.redes a{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--tinta);color:#fff;transition:background .2s}
.redes a:hover{background:var(--rojo)}
.redes svg{width:22px;height:22px}
.pie small{font-size:13px;color:var(--gris)}
.pie small a{color:var(--azul)}

.vacio{text-align:center;padding:80px 20px;color:var(--gris)}
.vacio h1{font:900 34px/1.1 var(--display);text-transform:uppercase;color:var(--tinta)}
