:root {
  --black:#080D12;
  --ink:#111318;
  --muted:#6b7078;
  --line:#e7e8eb;
  --white:#fff;
  --blue:#1761ff;
  --yellow:#ffbf14;
  --purple:#9b3df5;
  --pink:#ff2d55;
  --radius:18px;
  --shadow:0 10px 30px rgba(7,13,18,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Montserrat",sans-serif;background:#fff;color:var(--ink)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input{font:inherit}
.wrap{width:min(1180px,calc(100% - 40px));margin-inline:auto}

.site-header{background:var(--black);color:#fff;position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(255,255,255,.08)}
.header-inner{height:90px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:34px}
.brand img{width:205px}
.main-nav{display:flex;justify-content:center;gap:52px;font-size:.86rem;font-weight:700;text-transform:uppercase;letter-spacing:.02em}
.main-nav a{padding:34px 0 28px;position:relative}
.main-nav a::after{content:"";position:absolute;left:50%;bottom:18px;width:42px;height:3px;transform:translateX(-50%);transition:.25s;border-radius:3px}
.main-nav a:hover::after{width:54px}
.nav-actualidad::after{background:var(--blue)}.nav-deportes::after{background:var(--yellow)}.nav-geek::after{background:var(--purple)}.nav-pop::after{background:var(--pink)}
.menu-button{display:none;background:none;border:0;color:#fff;font-size:1.5rem}

.hero-shell{padding-top:34px}
.hero-card{min-height:520px;background:var(--black);border-radius:var(--radius);overflow:hidden;display:grid;grid-template-columns:42% 58%;position:relative;box-shadow:var(--shadow)}
.hero-copy{color:#fff;padding:64px 52px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.hero-copy h1{font-size:clamp(2.25rem,4vw,4rem);line-height:.98;margin:18px 0 22px;letter-spacing:-.045em}
.hero-copy p{color:#b5bac2;line-height:1.75;margin:0 0 30px;max-width:42ch}
.eyebrow{font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;display:inline-block;padding-bottom:7px;border-bottom:3px solid currentColor}
.actualidad{color:var(--blue)}.deportes{color:#e9a900}.geek{color:var(--purple)}.pop{color:var(--pink)}
.text-link{font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#fff}.text-link span{color:var(--blue);margin-left:8px}
.hero-media{background:
linear-gradient(180deg,rgba(8,13,18,0) 70%,rgba(8,13,18,.22)),
url('https://images.unsplash.com/photo-1497435334941-8c899ee9e8e9?auto=format&fit=crop&w=1600&q=85') center/cover no-repeat}
.hero-index{position:absolute;right:18px;bottom:0;background:rgba(8,13,18,.95);display:flex;gap:14px;padding:18px 22px;border-radius:14px 0 0 0}
.hero-index button{border:0;background:none;color:#8e949c;font-weight:800;padding:0 8px 8px;cursor:pointer;border-bottom:3px solid transparent}.hero-index .is-active{color:#fff;border-bottom-color:var(--blue)}

.section{padding:58px 0 8px}.light-section{background:#fff}
.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}
.section-heading h2{margin:0;font-size:1.45rem;text-transform:uppercase;letter-spacing:-.02em}.section-heading .dot{color:var(--pink)}
.section-heading>a{font-size:.78rem;font-weight:800;text-transform:uppercase}.section-heading>a span{color:var(--blue);font-size:1.2rem;margin-left:6px}
.news-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.news-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 4px 14px rgba(9,14,19,.04);transition:.2s}.news-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.thumb{aspect-ratio:1.35/1;background-size:cover;background-position:center}
.thumb-sport{background-image:url('https://images.unsplash.com/photo-1579952363873-27f3bade9f55?auto=format&fit=crop&w=900&q=85')}
.thumb-geek{background-image:url('https://images.unsplash.com/photo-1622979135225-d2ba269cf1ac?auto=format&fit=crop&w=900&q=85')}
.thumb-pop{background-image:url('https://images.unsplash.com/photo-1489599849927-2ee91cede3ba?auto=format&fit=crop&w=900&q=85')}
.thumb-actualidad{background-image:url('https://images.unsplash.com/photo-1517976547714-720226b864c1?auto=format&fit=crop&w=900&q=85')}
.thumb-actualidad-2{background-image:url('https://images.unsplash.com/photo-1518005020951-eccb494ad742?auto=format&fit=crop&w=900&q=85')}
.thumb-pop-2{background-image:url('https://images.unsplash.com/photo-1492684223066-81342ee5ff30?auto=format&fit=crop&w=900&q=85')}
.thumb-sport-2{background-image:url('https://images.unsplash.com/photo-1461896836934-ffe607ba8211?auto=format&fit=crop&w=900&q=85')}
.thumb-geek-2{background-image:url('https://images.unsplash.com/photo-1518770660439-4636190af475?auto=format&fit=crop&w=900&q=85')}
.card-body{padding:18px}.card-body h3{font-size:1rem;line-height:1.45;margin:14px 0 18px;letter-spacing:-.02em}.meta{font-size:.63rem;color:var(--muted);font-weight:600}.meta span{margin:0 6px}

.promo-block{
  margin-top:40px;
  background:var(--black);
  color:#fff;
  border-radius:16px;
  display:grid;
  grid-template-columns:auto minmax(280px,1fr) minmax(480px,.95fr);
  gap:24px;
  align-items:center;
  padding:30px 34px;
  position:relative;
  overflow:hidden;
}
.promo-icon{
  display:grid;
  place-items:center;
  width:62px;
  height:62px;
  border-radius:10px;
  background:var(--pink);
  font-size:1.55rem;
  font-weight:800;
}
.promo-copy h2{margin:0 0 7px;font-size:1.15rem}
.promo-copy p{margin:0;color:#b5bac2;line-height:1.5}
.promo-newsletter-form{
  display:grid;
  grid-template-columns:minmax(0,1fr) 190px;
  gap:12px;
  align-items:stretch;
}
.promo-newsletter-form input{
  width:100%;
  min-width:0;
  height:52px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:10px;
  padding:0 16px;
  background:#fff;
  color:var(--ink);
  outline:none;
}
.promo-newsletter-form input::placeholder{color:#9a9fa6}
.promo-newsletter-form input:focus{
  border-color:var(--pink);
  box-shadow:0 0 0 3px rgba(255,45,85,.18);
}
.newsletter-submit{
  display:flex !important;
  align-items:center;
  justify-content:center;
  width:100%;
  min-width:190px;
  height:52px;
  border:0 !important;
  border-radius:10px !important;
  background:var(--pink) !important;
  color:#fff !important;
  font-weight:800 !important;
  text-transform:uppercase;
  letter-spacing:.01em;
  padding:0 24px !important;
  cursor:pointer;
  transition:transform .2s,filter .2s;
  appearance:none;
  -webkit-appearance:none;
}
.newsletter-submit:hover{transform:translateY(-1px);filter:brightness(1.06)}
.promo-newsletter-form.is-success .newsletter-submit{background:#1e9b63 !important}

.categories-section{
  padding-bottom:88px;
}

.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.category-card{min-height:210px;border-radius:14px;overflow:hidden;position:relative;display:flex;align-items:flex-end;padding:24px;background-size:cover;background-position:center;color:#fff}.category-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,13,18,.08),rgba(8,13,18,.82))}.category-card strong{position:relative;z-index:1;text-transform:uppercase;font-size:1.1rem}.category-card span{position:absolute;left:24px;bottom:15px;width:28px;height:3px;z-index:1}.cat-actualidad{background-image:url('https://images.unsplash.com/photo-1518005020951-eccb494ad742?auto=format&fit=crop&w=900&q=85')}.cat-deportes{background-image:url('https://images.unsplash.com/photo-1546519638-68e109498ffc?auto=format&fit=crop&w=900&q=85')}.cat-geek{background-image:url('https://images.unsplash.com/photo-1598550476439-6847785fcea6?auto=format&fit=crop&w=900&q=85')}.cat-pop{background-image:url('https://images.unsplash.com/photo-1492684223066-81342ee5ff30?auto=format&fit=crop&w=900&q=85')}.cat-actualidad span{background:var(--blue)}.cat-deportes span{background:var(--yellow)}.cat-geek span{background:var(--purple)}.cat-pop span{background:var(--pink)}

.site-footer{background:var(--black);color:#fff;padding:38px 0 24px}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:48px}.footer-brand img{width:190px;margin-bottom:14px}.footer-brand p{max-width:45ch;color:#949aa2;font-size:.75rem;line-height:1.6}.site-footer h4{font-size:.72rem;text-transform:uppercase;margin:4px 0 14px}.site-footer a{display:block;color:#a4a9b0;font-size:.72rem;margin:9px 0}.copyright{text-align:center;color:#777e86;font-size:.68rem;margin-top:28px;padding-top:20px;border-top:1px solid rgba(255,255,255,.07)}

@media (max-width:900px){.main-nav{gap:22px}.hero-card{grid-template-columns:1fr}.hero-copy{padding:46px 36px}.hero-media{min-height:360px}.news-grid,.category-grid{grid-template-columns:repeat(2,1fr)}.promo-block{grid-template-columns:auto 1fr;padding:28px 30px}.promo-newsletter-form{grid-column:1/-1}.footer-grid{grid-template-columns:2fr 1fr 1fr}.footer-grid>div:last-child{grid-column:2}}
@media (max-width:680px){.wrap{width:min(100% - 26px,1180px)}.header-inner{height:74px;grid-template-columns:auto 1fr}.brand img{width:170px}.main-nav{display:none;position:absolute;top:74px;left:0;right:0;background:var(--black);padding:14px 20px 22px;flex-direction:column;align-items:center;gap:6px}.main-nav.is-open{display:flex}.main-nav a{padding:15px 0 14px}.main-nav a::after{bottom:8px;width:34px}.menu-button{display:block;justify-self:end}.hero-shell{padding-top:18px}.hero-card{min-height:0}.hero-copy{padding:38px 26px}.hero-media{min-height:280px}.hero-index{display:none}.section{padding-top:42px}.section-heading{align-items:flex-end;gap:16px}.section-heading h2{font-size:1.1rem}.section-heading>a{font-size:.65rem}.news-grid,.category-grid{grid-template-columns:1fr}.promo-block{grid-template-columns:auto 1fr;padding:24px}.promo-newsletter-form{grid-column:1/-1;grid-template-columns:1fr}.newsletter-submit{min-width:0;height:50px;padding:0 18px !important}.footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1/-1}.footer-grid>div:last-child{grid-column:auto}}

@media (max-width:680px){.categories-section{padding-bottom:58px}}

/* =========================================================
   PÁGINA DE NOTICIA — V2
========================================================= */

.article-page{
  background:#fff;
  color:var(--ink);
}

.article-main{
  overflow:hidden;
}

.article-reading-width{
  width:min(980px, calc(100% - 48px));
  margin-inline:auto;
}

.article-header{
  padding:84px 0 42px;
}

.article-category{
  display:inline-block;
  color:var(--blue);
  font-size:.82rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.055em;
  padding-bottom:7px;
  border-bottom:3px solid var(--blue);
}

.article-header h1{
  max-width:980px;
  margin:24px 0 24px;
  font-size:clamp(3.3rem, 6.8vw, 7rem);
  line-height:.94;
  letter-spacing:-.065em;
  font-weight:800;
}

.article-deck{
  max-width:850px;
  margin:0;
  color:#60656d;
  font-size:clamp(1.12rem, 1.7vw, 1.35rem);
  line-height:1.65;
  font-weight:500;
}

.article-meta{
  margin-top:34px;
  padding-top:22px;
  border-top:1px solid #e8eaed;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}

.article-byline{
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
  align-items:center;
  color:#7c8188;
  font-size:.76rem;
  text-transform:uppercase;
  font-weight:600;
}

.article-byline strong{
  color:#171a1f;
}

.article-byline span+span::before{
  content:"•";
  color:#b6bac0;
  margin-right:18px;
}

.article-share{
  display:flex;
  gap:8px;
}

.article-share button{
  width:40px;
  height:40px;
  border:1px solid #dfe3e7;
  border-radius:50%;
  background:#fff;
  color:#15181c;
  display:grid;
  place-items:center;
  font-family:inherit;
  font-weight:800;
  cursor:pointer;
  transition:.18s ease;
}

.article-share button:hover{
  color:var(--blue);
  border-color:var(--blue);
  transform:translateY(-2px);
}

.article-hero{
  margin:0;
}

.article-hero .wrap{
  width:min(980px, calc(100% - 48px));
  margin-inline:auto;
}

.article-hero-image{
  width:100%;
  aspect-ratio:16/8.5;
  min-height:460px;
  border-radius:22px;
  background:
    linear-gradient(
      180deg,
      rgba(8,13,18,0) 70%,
      rgba(8,13,18,.15)
    ),
    url('https://images.unsplash.com/photo-1497435334941-8c899ee9e8e9?auto=format&fit=crop&w=2000&q=88')
    center/cover no-repeat;
}

.article-hero figcaption{
  margin:10px 0 0 4px;
  color:#92979e;
  font-size:.72rem;
  line-height:1.5;
}

.article-content{
  width:min(780px, calc(100% - 40px));
  margin:62px auto 0;
  color:#24282d;
  font-size:1.07rem;
  line-height:1.95;
}

.article-content p{
  margin:0 0 30px;
}

.article-content .lead{
  color:#171a1f;
  font-size:1.28rem;
  line-height:1.72;
  font-weight:600;
}

.article-content h2{
  margin:58px 0 20px;
  font-size:clamp(1.8rem, 3.1vw, 2.55rem);
  line-height:1.08;
  letter-spacing:-.045em;
}

.article-content blockquote{
  margin:50px -70px;
  padding:38px 46px;
  border-left:5px solid var(--blue);
  border-radius:0 18px 18px 0;
  background:#f5f8fc;
  color:#111418;
  font-size:1.45rem;
  line-height:1.5;
  font-weight:700;
  letter-spacing:-.025em;
}

.article-highlight{
  margin:52px -50px;
  padding:36px 40px;
  border-radius:20px;
  background:#f7f8fa;
  border:1px solid #e6e9ed;
  border-top:4px solid var(--blue);
}

.article-highlight>span{
  display:block;
  margin-bottom:8px;
  color:var(--blue);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.09em;
}

.article-highlight strong{
  display:block;
  margin-bottom:18px;
  font-size:1.4rem;
  line-height:1.25;
}

.article-highlight ul{
  margin:0;
  padding-left:22px;
}

.article-highlight li{
  margin:10px 0;
}

.article-tags{
  margin-top:58px;
  padding-top:26px;
  border-top:1px solid #e7e9ec;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.article-tags span{
  padding:9px 14px;
  border:1px solid #dfe3e7;
  border-radius:999px;
  color:#656a72;
  font-size:.72rem;
  font-weight:700;
}

.related-section{
  margin-top:86px;
  padding:62px 0 76px;
  background:#f7f8fa;
}

.related-section .section-heading{
  margin-bottom:24px;
}

.related-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
}

.related-card{
  display:block;
}

.related-image{
  width:100%;
  aspect-ratio:1.45/1;
  margin-bottom:18px;
  border-radius:16px;
  background-size:cover;
  background-position:center;
}

.related-one{
  background-image:url('https://images.unsplash.com/photo-1592833159155-c62df1b65634?auto=format&fit=crop&w=1000&q=85');
}

.related-two{
  background-image:url('https://images.unsplash.com/photo-1597404294360-feeeda04612e?auto=format&fit=crop&w=1000&q=85');
}

.related-three{
  background-image:url('https://images.unsplash.com/photo-1489599849927-2ee91cede3ba?auto=format&fit=crop&w=1000&q=85');
}

.related-card .eyebrow{
  display:inline-block;
  margin:0 0 10px;
}

.related-card h3{
  margin:0;
  font-size:1.08rem;
  line-height:1.45;
  letter-spacing:-.025em;
}

.article-promo{
  margin-top:74px;
  margin-bottom:90px;
}

@media (max-width: 980px){
  .article-header{
    padding-top:62px;
  }

  .article-hero .wrap{
    width:min(980px, calc(100% - 32px));
    margin-inline:auto;
  }

  .article-content blockquote,
  .article-highlight{
    margin-left:0;
    margin-right:0;
  }
}

@media (max-width: 700px){
  .article-reading-width{
    width:min(100% - 30px, 980px);
  }

  .article-header{
    padding-top:42px;
    padding-bottom:28px;
  }

  .article-header h1{
    margin-top:18px;
    font-size:clamp(2.65rem, 13vw, 4.6rem);
    max-width:none;
  }

  .article-deck{
    font-size:1rem;
  }

  .article-meta{
    align-items:flex-start;
    flex-direction:column;
  }

  .article-byline{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }

  .article-byline span+span::before{
    display:none;
  }

  .article-hero .wrap{
    width:calc(100% - 30px);
    margin-inline:auto;
  }

  .article-hero-image{
    min-height:280px;
    aspect-ratio:16/10;
    border-radius:16px;
  }

  .article-hero figcaption{
    padding-inline:16px;
  }

  .article-content{
    width:min(100% - 32px, 780px);
    margin-top:42px;
    font-size:1rem;
  }

  .article-content .lead{
    font-size:1.1rem;
  }

  .article-content blockquote{
    padding:28px 24px;
    font-size:1.18rem;
  }

  .article-highlight{
    padding:28px 24px;
  }

  .related-section{
    margin-top:62px;
    padding:48px 0 58px;
  }

  .related-grid{
    grid-template-columns:1fr;
    gap:34px;
  }

  .article-promo{
    margin-top:52px;
    margin-bottom:56px;
  }
}

/* Home: 8 últimas noticias */
.news-grid{
  row-gap:22px;
}

.footer-logo-link{
    display:inline-block;
}

.footer-logo-link img{
    display:block;
}

.footer-logo-link:hover{
    opacity:.85;
}
