/* Portada de pcfsite.com (prototipo «PCFUTBOL Web»), sobre ds.css + foro.css */
.portal{display:flex;flex-direction:column;gap:52px;padding:22px 0 20px}
.kick{font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--color-accent-700)}
.acento{color:var(--color-accent-700)!important}
.sechead{display:flex;align-items:baseline;gap:12px;margin:0 0 12px;border-bottom:1px solid var(--color-divider);padding-bottom:8px}
.sechead h2{margin:0;font-size:26px;text-transform:uppercase;letter-spacing:.02em}
.sechead .num-s{font-size:12px;letter-spacing:.1em;font-weight:600;color:var(--color-accent-700)}
.sechead .more{margin-left:auto;font-size:13px}
.row:hover{background:color-mix(in srgb,var(--color-text) 4%,transparent)}
.cell{display:flex;flex-direction:column;gap:8px;padding:20px;border-right:1px solid var(--color-divider);border-bottom:1px solid var(--color-divider);text-decoration:none;color:inherit;transition:background .15s}
.cell:hover{background:color-mix(in srgb,var(--color-accent) 7%,transparent)}
.cell .ic{width:40px;height:40px;border:1px solid var(--color-divider);display:grid;place-items:center;color:var(--color-accent-700)}
.cell .ct{font-family:var(--font-heading);font-weight:600;font-size:22px;text-transform:uppercase;line-height:1}
.cell .cd{font-size:13.5px;opacity:.75;line-height:1.4}
.cell .cm{margin-top:auto;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--color-accent-700)}
/* cabecera */
.p-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.p-hero-txt{padding:clamp(24px,3.5vw,48px);display:flex;flex-direction:column;justify-content:center;gap:16px}
.p-hero h1{font-size:clamp(40px,5.5vw,72px);text-transform:uppercase;line-height:.95;margin:0}
.p-hero p{margin:0;max-width:50ch;font-size:16px;color:color-mix(in srgb,var(--color-text) 80%,transparent)}
.p-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.p-cifras{display:flex;gap:26px;flex-wrap:wrap;margin-top:14px;padding-top:14px;border-top:1px solid var(--color-divider)}
.p-cifras b{display:block;font-size:28px;line-height:1;font-weight:600}
.p-cifras span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.65}
.p-mosaico{border-left:1px solid var(--color-divider);display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,1fr);min-height:330px}
.p-mosaico a{display:grid;place-items:center;border-bottom:1px solid var(--color-divider);border-right:1px solid var(--color-divider);transition:filter .15s}
.p-mosaico a:nth-child(2n){border-right:0}.p-mosaico a:nth-last-child(-n+2){border-bottom:0}
.p-mosaico a:hover{filter:brightness(1.12)}
.p-mosaico img{max-width:80%;max-height:66%;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(0,0,0,.45))}
/* rejillas (la última columna y fila sin doble borde) */
.p-grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-right:0!important;border-bottom:0!important}
.p-grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-right:0!important;border-bottom:0!important}
.p-dl .cell{flex-direction:row;align-items:center;gap:12px;padding:14px 18px}
.p-dl .cell .ic{width:34px;height:34px;flex:none}
.p-dl .cell .ct{font-size:18px;text-transform:none}
/* noticias y actividad */
.p-two{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:40px}
.p-n0{display:grid;grid-template-columns:200px minmax(0,1fr);border-bottom:1px solid var(--color-divider)}
.p-n0.sin-img{grid-template-columns:1fr}
.p-n0-img{border-right:1px solid var(--color-divider);min-height:160px;display:block;overflow:hidden}
.p-n0-img img{width:100%;height:100%;object-fit:cover;display:block}
.p-n0>div{padding:18px 20px;display:flex;flex-direction:column;gap:6px}
.p-n0 .tlink{font-size:26px}.p-n0 p{margin:0;font-size:14px;opacity:.8}
.p-n0:last-child{border-bottom:0}
.p-n0 + .p-n0 .tlink{font-size:21px}
.p-nrow{display:grid;grid-template-columns:110px minmax(0,1fr);gap:14px;padding:12px 20px;border-bottom:1px solid color-mix(in srgb,var(--color-text) 8%,transparent);align-items:baseline;font-size:13px}
.p-nrow .tlink{font-size:18px}
.p-act{display:flex;gap:12px;padding:12px 16px;border-bottom:1px solid color-mix(in srgb,var(--color-text) 8%,transparent);text-decoration:none;color:inherit;align-items:center}
.p-act-t{min-width:0}.p-act-t b{display:block;font-weight:500;font-size:14.5px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p-act-t .faint{font-size:12.5px}
.p-act-pie{padding:12px 16px;display:flex;gap:16px;font-size:13px;opacity:.8;flex-wrap:wrap;border-top:1px solid color-mix(in srgb,var(--color-text) 8%,transparent)}
.p-act-lista .p-act:last-child{border-bottom:0}
/* escritorio: «Actividad» mide lo mismo que «Noticias». contain:size hace que la caja no empuje la fila
   (manda Noticias) y la lista rellena lo que haya, cortando con un degradado lo que no cabe */
@media (min-width:901px){
  .p-two>#actividad{display:flex;flex-direction:column}
  .p-two>#actividad>.p-act-caja{flex:1 1 0;min-height:0;contain:size;display:flex;flex-direction:column}
  .p-two .p-act-lista{flex:1;min-height:0;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 36px),transparent)}
}
#actividad:only-child{max-width:none}
/* juegos */
.p-game{padding:0;gap:0}
.p-game .p-cov{position:relative;aspect-ratio:16/9;border-bottom:1px solid var(--color-divider);display:grid;place-items:center}
.p-game .p-cov img{max-width:80%;max-height:64%;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(0,0,0,.45))}
.p-game .p-cov .tag{position:absolute;top:10px;left:10px}
.p-game .p-cov .plat{position:absolute;right:10px;bottom:10px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;background:var(--color-bg);padding:3px 8px;border:1px solid var(--color-divider)}
.p-game .p-gb{padding:16px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.p-game .p-gn{font-family:var(--font-heading);font-weight:600;font-size:23px;line-height:1}
.p-game .p-gb .btn{align-self:flex-start;margin-top:auto;font-size:13px;padding:5px 12px}
.p-nota{font-size:12.5px;margin:8px 0 0}
@media (max-width:900px){
  .p-hero,.p-two{grid-template-columns:minmax(0,1fr)}
  .sechead h2{font-size:22px}
  .portal{gap:40px;padding-top:18px}
  .p-mosaico{border-left:0;border-top:1px solid var(--color-divider);min-height:260px}
  .p-grid4,.p-grid3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .p-n0{grid-template-columns:1fr}.p-n0-img{display:none}
}
@media (max-width:560px){.p-grid4,.p-grid3{grid-template-columns:1fr}}
.p-foto{border-left:1px solid var(--color-divider);position:relative;min-height:330px;overflow:hidden}
.p-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:900px){.p-foto{border-left:0;border-top:1px solid var(--color-divider);min-height:240px}}
/* página legal */
.legal{display:flex;flex-direction:column;gap:26px;padding:22px 0 20px;max-width:900px}
.legal-h h1{font-size:clamp(30px,4vw,46px);text-transform:uppercase;line-height:1;margin:6px 0 10px}
.legal-h p{font-size:14px;margin:0}
.legal-s{padding:22px 26px}
.legal-s h2{font-size:24px;text-transform:uppercase;margin:0 0 12px}
.legal-s h3{font-size:17px;text-transform:uppercase;letter-spacing:.02em;margin:18px 0 6px;color:var(--color-accent-700)}
.legal-s p,.legal-s li{font-size:14.5px;line-height:1.6}
.legal-s ul{padding-left:20px;margin:6px 0 10px}
.legal-s li{margin:4px 0}
.legal-tabla{overflow-x:auto;margin:10px 0}
.legal-s code{font-size:13px}
/* Historia (9-oct-2026): 10 juegos en dos filas de 5 */
.p-hist{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-right:0!important;border-bottom:0!important}
.p-hist-j{display:flex;flex-direction:column;gap:6px;padding:16px;border-right:1px solid var(--color-divider);border-bottom:1px solid var(--color-divider);text-decoration:none;color:inherit;transition:background .15s}
.p-hist-j:hover{background:color-mix(in srgb,var(--color-accent) 7%,transparent)}
.p-hist-y{font-size:12px;letter-spacing:.1em;font-weight:600;color:var(--color-accent-700);margin-top:6px}
.p-hist-n{font-family:var(--font-heading);font-weight:600;font-size:20px;text-transform:uppercase;line-height:1}
.p-hist-r{font-size:13px;opacity:.75;line-height:1.35}
.h-portada{display:block;aspect-ratio:3/4;border:1px solid var(--color-divider);overflow:hidden;background:var(--color-surface)}
.h-portada img{width:100%;height:100%;object-fit:cover;display:block}
.h-sin{display:flex;flex-direction:column;justify-content:flex-end;padding:12px;background:linear-gradient(160deg,color-mix(in srgb,var(--color-accent) 22%,var(--color-surface)),var(--color-surface))}
.h-sin-a{font-family:var(--font-heading);font-weight:600;font-size:42px;line-height:1;color:var(--color-accent-700)}
.h-sin-n{font-size:12px;text-transform:uppercase;letter-spacing:.06em;opacity:.7;margin-top:2px}
@media (max-width:1000px){.p-hist{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:600px){.p-hist{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Páginas de historia */
.historia section{margin-top:28px}
.h-etapa{margin:-4px 0 14px;opacity:.75;max-width:72ch;font-size:14.5px}
.h-cab{display:grid;grid-template-columns:240px minmax(0,1fr);gap:0;margin-bottom:26px}
.h-cab-p{padding:22px;border-right:1px solid var(--color-divider)}
.h-cab-t{padding:22px 26px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.h-cab-t h1{margin:2px 0 0;font-size:clamp(30px,4vw,46px);line-height:1;text-transform:uppercase}
.h-ed{margin:0;font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--color-accent-700);font-weight:600}
.h-res{margin:4px 0 6px;font-size:16px;opacity:.85}
.h-ficha{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:0;margin:6px 0 12px;border:1px solid var(--color-divider);width:100%}
.h-ficha div{padding:10px 12px;border-right:1px solid var(--color-divider)}
.h-ficha dt{font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.65}
.h-ficha dd{margin:3px 0 0;font-size:14.5px;font-weight:500}
.h-cuerpo{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:36px;align-items:start}
.h-texto p{font-size:16.5px;line-height:1.65;margin:0 0 16px;max-width:68ch}
.h-nov{padding:18px 20px}
.h-nov h2{font-size:16px;text-transform:uppercase;letter-spacing:.06em;margin:0 0 10px}
.h-nov ul{margin:0;padding-left:18px;display:grid;gap:7px;font-size:14px;line-height:1.4}
.h-nav{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center;margin:34px 0 10px;padding-top:16px;border-top:1px solid var(--color-divider)}
.h-nav-a{display:flex;flex-direction:column;text-decoration:none;color:inherit}
.h-nav-a b{font-family:var(--font-heading);font-size:20px;text-transform:uppercase}
.h-nav-a:hover b{color:var(--color-accent)}
.h-nav-s{text-align:right;align-items:flex-end}
@media (max-width:820px){.h-cab{grid-template-columns:1fr}.h-cab-p{border-right:0;border-bottom:1px solid var(--color-divider);max-width:220px}.h-cuerpo{grid-template-columns:1fr}}
.h-todo{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;font-family:var(--font-heading);font-weight:600;font-size:22px;text-transform:uppercase;color:var(--color-accent-700);background:color-mix(in srgb,var(--color-accent) 8%,var(--color-surface))}
.h-todo-f{font-size:34px}
.p-hist-todo:hover .h-todo{background:color-mix(in srgb,var(--color-accent) 16%,var(--color-surface))}
/* Carátulas: casi en blanco y negro hasta pasar el ratón; entonces, su color original (solo con ratón) */
@media (hover:hover){
  .p-hist-j .h-portada img{filter:grayscale(.85) contrast(1.08) brightness(1.03);transition:filter .35s ease}
  .p-hist-j:hover .h-portada img,.p-hist-j:focus-visible .h-portada img{filter:none}
}
@media (prefers-reduced-motion:reduce){.p-hist-j .h-portada img{transition:none}}
