:root{--fondo:#f6f7f2;--tinta:#13201a;--suave:#56645c;--verde:#1f7a4d;--cesped:#2e9a5f;--lima:#d7f25c;--papel:#fbf6ea}
*{box-sizing:border-box}
body{margin:0;background:var(--fondo);color:var(--tinta);font-family:'Barlow',system-ui,sans-serif;font-size:18px;line-height:1.55}
a{color:var(--verde)}
.cabecera{position:sticky;top:0;z-index:5;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 24px;padding:10px clamp(16px,4vw,48px);background:var(--verde);color:#fff}
.logo{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:30px;letter-spacing:.06em;color:#fff;text-decoration:none}
.cabecera nav{display:flex;gap:4px;flex-wrap:wrap}
.cabecera nav a{color:#fff;text-decoration:none;font-weight:600;padding:10px 14px;border-radius:6px}
.cabecera nav a:hover{background:rgba(255,255,255,.14)}

.portada{position:relative;overflow:hidden;background:var(--cesped);color:#fff;padding:clamp(56px,10vw,120px) clamp(16px,4vw,48px)}
.campo{position:absolute;inset:0;background:
  repeating-linear-gradient(90deg,rgba(255,255,255,.06) 0 80px,transparent 80px 160px);}
.campo::before{content:"";position:absolute;right:-120px;top:50%;width:340px;height:340px;border:4px solid rgba(255,255,255,.5);border-radius:50%;transform:translateY(-50%)}
.campo::after{content:"";position:absolute;right:50px;top:0;bottom:0;border-left:4px solid rgba(255,255,255,.5)}
.portada-texto{position:relative;max-width:1104px;margin:0 auto}
.antetitulo{margin:0;font-family:'Barlow Condensed',sans-serif;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--lima)}
.portada h1{margin:0;font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:clamp(80px,17vw,200px);line-height:.85;letter-spacing:.02em;text-transform:uppercase}
.lema{max-width:30ch;font-size:clamp(20px,2.4vw,26px);margin:14px 0 0}

.bloque{max-width:1200px;margin:0 auto;padding:clamp(40px,6vw,72px) clamp(16px,4vw,48px)}
.bloque-papel{max-width:none;background:var(--papel)}
.bloque.bloque-papel > *{max-width:1104px;margin-left:auto;margin-right:auto}
.bloque h2{font-family:'Barlow Condensed',sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(36px,5vw,56px);margin:0 0 20px;letter-spacing:.02em}

.partidos{display:grid;gap:14px}
.partido{all:unset;cursor:pointer;display:grid;grid-template-columns:auto 1fr auto;gap:8px 20px;align-items:center;background:#fff;border-radius:10px;padding:16px 20px;box-shadow:0 1px 0 #dfe5dc,0 8px 20px rgba(19,32,26,.06)}
.partido:hover,.partido:focus-visible{box-shadow:0 0 0 3px var(--verde)}
.partido .fecha{font-family:'Barlow Condensed',sans-serif;font-weight:600;color:var(--suave);font-size:17px;min-width:84px}
.partido .equipos{font-weight:600}
.partido .competicion{display:block;font-weight:400;color:var(--suave);font-size:15px}
.marcador{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:30px;background:var(--tinta);color:var(--lima);padding:2px 14px;border-radius:6px;white-space:nowrap}
@media (max-width:560px){.partido{grid-template-columns:1fr auto}.partido .fecha{grid-column:1/-1}}

.libros{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:24px}
@media (max-width:560px){.campo::before,.campo::after{opacity:.35}.libro .tapa strong{font-size:21px}}
.libro{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:12px}
.libro .tapa{aspect-ratio:3/4;border-radius:4px 12px 12px 4px;padding:22px 18px;display:flex;flex-direction:column;justify-content:space-between;color:#fff;box-shadow:inset 8px 0 0 rgba(0,0,0,.18),0 12px 26px rgba(19,32,26,.18);font-family:'Source Serif 4',serif;transition:transform .15s}
.libro:hover .tapa,.libro:focus-visible .tapa{transform:translateY(-4px) rotate(-1deg)}
.libro:focus-visible{outline:3px solid var(--verde);outline-offset:4px}
.libro .tapa strong{font-size:26px;line-height:1.15}
.libro .tapa span{font-size:15px;opacity:.85}
.libro p{margin:0;color:var(--suave);font-size:16px}

.mas{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.cosa{background:#fff;border-radius:10px;padding:18px 20px;box-shadow:0 8px 20px rgba(19,32,26,.06)}
.cosa img{width:100%;border-radius:6px;margin-bottom:10px}
.cosa strong{display:block;font-size:20px}

.vacio{padding:28px;border:3px dashed #cfd8cf;border-radius:12px;color:var(--suave);text-align:center;grid-column:1/-1}

dialog{border:0;border-radius:14px;padding:0;width:min(92vw,760px);max-height:88vh}
dialog::backdrop{background:rgba(10,20,15,.75)}
.lectura{padding:clamp(24px,5vw,48px);font-family:'Source Serif 4',serif;font-size:19px;line-height:1.7}
.lectura h3{font-family:'Barlow Condensed',sans-serif;font-size:36px;text-transform:uppercase;margin:0 0 6px;line-height:1.05}
.lectura .meta{font-family:'Barlow',sans-serif;color:var(--suave);font-size:16px;margin:0 0 20px}
.lectura h4{font-family:'Barlow Condensed',sans-serif;font-size:24px;margin:28px 0 6px}
.lectura p{white-space:pre-line;margin:0 0 14px}
dialog .cerrar{position:sticky;top:10px;float:right;margin:10px;width:44px;height:44px;border-radius:50%;border:0;background:var(--fondo);font-size:28px;cursor:pointer}

.pie-web{text-align:center;padding:40px 16px;color:var(--suave);font-size:15px}
