/* RanaSports: portada editorial visual, inspirada en portales deportivos argentinos sin copiar su diseño. */ #ultimas.portal-layout{display:block!important;max-width:1180px!important} #ultimas .main-feed{width:100%!important;max-width:none!important;min-width:0!important} #ultimas .sidebar{display:none!important} #newsGrid.editorial-grid{display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important} #newsGrid .news-card[hidden]{display:none!important} #newsGrid .news-card, #newsGrid .lead-story, #newsGrid .secondary-story{display:block!important;width:100%!important;max-width:none!important;min-height:0!important;margin:0!important;padding:0 0 28px!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important} #newsGrid .news-card+.news-card, #newsGrid .lead-story+.news-card, #newsGrid .secondary-story+.news-card{border-top:1px solid rgba(255,255,255,.12)!important;padding-top:28px!important} #newsGrid .meta, #newsGrid .news-excerpt, #newsGrid .read-more, #newsGrid .card-body>p, #newsGrid .card-body>.badge, #newsGrid .card-body>time{display:none!important} #newsGrid .card-visual, #newsGrid .news-image{display:block!important;width:100%!important;max-width:none!important;aspect-ratio:16/9!important;height:auto!important;min-height:0!important;margin:0!important;padding:0!important;border-radius:12px!important;overflow:hidden!important;background:#171d24!important;position:relative!important;inset:auto!important} #newsGrid .card-visual img, #newsGrid .news-image img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:50% 24%!important} #newsGrid .lead-story>.news-image{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;aspect-ratio:16/9!important;max-height:none!important;z-index:auto!important} #newsGrid .lead-story>.news-image:after{display:none!important} #newsGrid .card-body{display:block!important;width:100%!important;padding:14px 2px 0!important;margin:0!important;background:transparent!important;position:relative!important;inset:auto!important;transform:none!important} #newsGrid h3{margin:0!important;padding:0!important;max-width:none!important;font-size:clamp(1.25rem,2.2vw,1.9rem)!important;line-height:1.13!important;font-weight:850!important;letter-spacing:-.025em!important} #newsGrid h3 a{display:block!important;width:100%!important;color:#f5f7f9!important;text-decoration:none!important;transition:color .15s ease!important} #newsGrid h3 a:hover{color:#ff5a5f!important} #newsGrid h3 a:focus-visible{outline:2px solid #ff5a5f!important;outline-offset:5px!important;border-radius:3px!important} #ultimas .section-heading{margin-bottom:12px!important;padding-bottom:12px!important;border-bottom:2px solid rgba(255,255,255,.16)!important} #ultimas .category-tabs{margin-bottom:16px!important} #featuredNotice{margin:12px 0!important} #moreNewsTitle{margin-top:26px!important} /* En tema claro, los titulares que van sobre fondo claro deben ser oscuros. */ html[data-theme="light"] #newsGrid h3 a{color:#171b21!important} @media(max-width:699px){ #ultimas.portal-layout{width:100%!important;padding-left:12px!important;padding-right:12px!important} #newsGrid .news-card, #newsGrid .lead-story, #newsGrid .secondary-story{padding-bottom:22px!important} #newsGrid .news-card+.news-card, #newsGrid .lead-story+.news-card, #newsGrid .secondary-story+.news-card{padding-top:22px!important} #newsGrid .card-visual, #newsGrid .news-image{border-radius:9px!important} #newsGrid .card-body{padding:11px 0 0!important} #newsGrid h3{font-size:1.2rem!important;line-height:1.18!important} /* Todas las noticias con foto usan el mismo tratamiento visual que la destacada. */ #newsGrid .news-card:has(>.news-image){position:relative!important;aspect-ratio:16/9!important;min-height:235px!important;overflow:hidden!important;border-radius:9px!important;padding:0!important;margin:0 0 22px!important;background:#111820!important;border-top:0!important;box-shadow:none!important} #newsGrid .news-card:has(>.news-image)>.news-image{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;aspect-ratio:auto!important;max-height:none!important;border-radius:0!important;z-index:1!important} #newsGrid .news-card:has(>.news-image)>.news-image img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:50% 24%!important} #newsGrid .news-card:has(>.news-image)::after{content:"";display:block!important;position:absolute!important;inset:0!important;z-index:2!important;pointer-events:none!important;background:linear-gradient(180deg,rgba(5,8,12,0) 28%,rgba(5,8,12,.14) 47%,rgba(5,8,12,.94) 100%)!important} #newsGrid .news-card:has(>.news-image) .card-body{position:absolute!important;left:0!important;right:0!important;bottom:0!important;z-index:3!important;padding:72px 14px 14px!important;background:transparent!important} #newsGrid .news-card:has(>.news-image) h3{font-size:1.24rem!important;line-height:1.12!important;font-weight:900!important;letter-spacing:-.03em!important;text-shadow:0 2px 8px rgba(0,0,0,.72)!important} #newsGrid .news-card:has(>.news-image) h3 a, html[data-theme="light"] #newsGrid .news-card:has(>.news-image) h3 a{color:#fff!important} /* Las tarjetas sin imagen conservan el formato de texto normal. */ #newsGrid .news-card:not(:has(>.news-image)){padding-bottom:22px!important} } /* Escritorio: portada tipo portal deportivo. El diseño móvil de arriba queda intacto. */ @media(min-width:1050px){ #ultimas.portal-layout{max-width:1280px!important} #newsGrid.editorial-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important;align-items:stretch!important} /* Portada con una noticia principal y dos secundarias a la derecha. */ #newsGrid.single-featured{grid-template-rows:210px 210px auto!important} #newsGrid.single-featured .lead-story{grid-column:1 / span 2!important;grid-row:1 / span 2!important;height:434px!important;min-height:434px!important;position:relative!important;overflow:hidden!important;border-radius:12px!important;padding:0!important;border:0!important;background:#111820!important} #newsGrid.single-featured > .more-story:nth-of-type(2), #newsGrid.single-featured > .more-story:nth-of-type(3){grid-column:3!important;height:210px!important;min-height:210px!important;position:relative!important;overflow:hidden!important;border-radius:12px!important;padding:0!important;border:0!important;background:#111820!important} #newsGrid.single-featured > .more-story:nth-of-type(2){grid-row:1!important} #newsGrid.single-featured > .more-story:nth-of-type(3){grid-row:2!important} #newsGrid.single-featured .lead-story>.news-image, #newsGrid.single-featured > .more-story:nth-of-type(2)>.news-image, #newsGrid.single-featured > .more-story:nth-of-type(3)>.news-image{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-height:none!important;aspect-ratio:auto!important;border-radius:0!important;z-index:1!important} #newsGrid.single-featured .lead-story>.news-image img, #newsGrid.single-featured > .more-story:nth-of-type(2)>.news-image img, #newsGrid.single-featured > .more-story:nth-of-type(3)>.news-image img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:50% 24%!important} #newsGrid.single-featured .lead-story:after, #newsGrid.single-featured > .more-story:nth-of-type(2):after, #newsGrid.single-featured > .more-story:nth-of-type(3):after{content:"";display:block!important;position:absolute!important;inset:0!important;z-index:2!important;pointer-events:none!important;background:linear-gradient(180deg,rgba(5,8,12,0) 35%,rgba(5,8,12,.2) 52%,rgba(5,8,12,.94) 100%)!important} #newsGrid.single-featured .lead-story .card-body, #newsGrid.single-featured > .more-story:nth-of-type(2) .card-body, #newsGrid.single-featured > .more-story:nth-of-type(3) .card-body{position:absolute!important;left:0!important;right:0!important;bottom:0!important;z-index:3!important;padding:24px!important;background:transparent!important;color:#fff!important} #newsGrid.single-featured .more-story:nth-of-type(2) .card-body, #newsGrid.single-featured .more-story:nth-of-type(3) .card-body{padding:16px!important} #newsGrid.single-featured .lead-story h3{font-size:clamp(2rem,2.6vw,2.75rem)!important;line-height:1.02!important;letter-spacing:-.045em!important;text-shadow:0 2px 10px rgba(0,0,0,.5)!important} #newsGrid.single-featured > .more-story:nth-of-type(2) h3, #newsGrid.single-featured > .more-story:nth-of-type(3) h3{font-size:1.18rem!important;line-height:1.08!important;letter-spacing:-.025em!important;text-shadow:0 2px 8px rgba(0,0,0,.55)!important} #newsGrid.single-featured .lead-story h3 a, #newsGrid.single-featured .more-story:nth-of-type(2) h3 a, #newsGrid.single-featured .more-story:nth-of-type(3) h3 a, html[data-theme="light"] #newsGrid.single-featured .lead-story h3 a, html[data-theme="light"] #newsGrid.single-featured .more-story:nth-of-type(2) h3 a, html[data-theme="light"] #newsGrid.single-featured .more-story:nth-of-type(3) h3 a{color:#fff!important} /* Quita los separadores del modo lista en la portada de escritorio. */ #newsGrid.single-featured .lead-story+.news-card, #newsGrid.single-featured > .more-story:nth-of-type(2), #newsGrid.single-featured > .more-story:nth-of-type(3){border-top:0!important;padding-top:0!important} /* "Últimas noticias" arranca debajo del bloque principal. */ #newsGrid.single-featured #moreNewsTitle{grid-column:1 / -1!important;grid-row:3!important;margin:22px 0 2px!important} /* Últimas noticias: tres columnas independientes. Así una tarjeta sin foto no deja un hueco debajo. */ #newsGrid .latest-columns{grid-column:1 / -1!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important;width:100%!important;align-items:start!important} #newsGrid .latest-column{display:flex!important;flex-direction:column!important;gap:14px!important;min-width:0!important} #newsGrid .latest-columns .more-story{display:block!important;width:100%!important;min-height:0!important;margin:0!important;padding:0 0 16px!important;border-top:0!important;background:transparent!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important} #newsGrid .latest-columns .more-story .news-image{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;aspect-ratio:16/9!important;border-radius:10px!important} #newsGrid .latest-columns .more-story .card-body{position:relative!important;inset:auto!important;padding:11px 1px 0!important} #newsGrid .latest-columns .more-story h3{font-size:1.16rem!important;line-height:1.16!important} #newsGrid.no-featured{grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:auto!important} #newsGrid.no-featured #moreNewsTitle{grid-column:1 / -1!important;grid-row:auto!important;margin:0 0 4px!important} } /* v20260925-2158: todos los titulares dentro de la foto + clic completo */ #newsGrid .news-card:has(>.news-image){ position:relative!important; aspect-ratio:16/9!important; min-height:0!important; overflow:hidden!important; border-radius:10px!important; padding:0!important; margin:0!important; background:#111820!important; border:0!important; box-shadow:none!important; } #newsGrid .news-card:has(>.news-image)>.news-image{ position:absolute!important; inset:0!important; width:100%!important; height:100%!important; max-height:none!important; aspect-ratio:auto!important; border-radius:0!important; z-index:1!important; cursor:pointer!important; } #newsGrid .news-card:has(>.news-image)>.news-image img{ width:100%!important; height:100%!important; object-fit:cover!important; object-position:50% 24%!important; } #newsGrid .news-card:has(>.news-image)::after{ content:""; display:block!important; position:absolute!important; inset:0!important; z-index:2!important; pointer-events:none!important; background:linear-gradient(180deg,rgba(5,8,12,0) 28%,rgba(5,8,12,.16) 48%,rgba(5,8,12,.95) 100%)!important; } #newsGrid .news-card:has(>.news-image) .card-body{ position:absolute!important; left:0!important; right:0!important; bottom:0!important; z-index:3!important; padding:72px 14px 14px!important; margin:0!important; background:transparent!important; color:#fff!important; pointer-events:none!important; } #newsGrid .news-card:has(>.news-image) h3{ margin:0!important; color:#fff!important; text-shadow:0 2px 9px rgba(0,0,0,.78)!important; } #newsGrid .news-card:has(>.news-image) h3 a, html[data-theme="light"] #newsGrid .news-card:has(>.news-image) h3 a{ display:block!important; color:#fff!important; text-decoration:none!important; pointer-events:auto!important; cursor:pointer!important; } #newsGrid .news-card:has(>.news-image) h3 a:hover, html[data-theme="light"] #newsGrid .news-card:has(>.news-image) h3 a:hover{ color:#fff!important; text-decoration:underline!important; text-decoration-thickness:2px!important; text-underline-offset:3px!important; } @media(min-width:1050px){ #newsGrid .latest-columns .more-story{ aspect-ratio:16/9!important; overflow:hidden!important; border-radius:10px!important; padding:0!important; } #newsGrid .latest-columns .more-story .news-image{ position:absolute!important; inset:0!important; width:100%!important; height:100%!important; aspect-ratio:auto!important; border-radius:0!important; } #newsGrid .latest-columns .more-story .card-body{ position:absolute!important; left:0!important; right:0!important; bottom:0!important; z-index:3!important; padding:64px 14px 14px!important; background:transparent!important; } } /* v20260927-1825: separación visual entre noticias en portada móvil */ @media(max-width:1049px){ #newsGrid .news-card{margin-bottom:14px!important;} #newsGrid .news-card:last-child{margin-bottom:0!important;} } /* v20260927-1828: gap real entre tarjetas móviles; no depende de margin de cada card. */ @media(max-width:1049px){ #newsGrid.editorial-grid{display:flex!important;flex-direction:column!important;gap:14px!important;} #newsGrid.editorial-grid>.news-card{margin:0!important;} }