/* Dated match preview, scoped to its editorial callout. */
.article-body > .offer-callout:first-child{padding:28px;margin:8px 0 40px;background:#13263b;color:#fff;border:0;border-radius:16px;box-shadow:none}
.article-body > .offer-callout:first-child h2{color:#fff;font-size:24px;line-height:1.3;margin:0 0 28px;letter-spacing:-.02em}
.article-body > .offer-callout:first-child .offer-grid{display:grid;grid-template-columns:minmax(0,1fr) 120px minmax(0,1fr);align-items:center;gap:12px;margin:0 0 28px;text-align:center}
.article-body > .offer-callout:first-child .offer-grid p{margin:0;min-width:0}
.article-body > .offer-callout:first-child .offer-grid a{display:block;color:#fff;font-size:20px;font-weight:700;text-decoration:none;line-height:1.3}
.article-body > .offer-callout:first-child .offer-grid a::before{content:"";display:block;width:64px;height:72px;margin:0 auto 12px;background:center/contain no-repeat url('/assets/teams/barcelona-crest.png')}
.article-body > .offer-callout:first-child .offer-grid p:last-child a::before{background-image:url('/assets/teams/real-madrid-crest.png')}
.article-body > .offer-callout:first-child span{display:block;color:#c4d3e2;font-size:14px;line-height:1.5;margin-top:6px}
.article-body > .offer-callout:first-child .offer-grid strong{display:block;color:#d6f85a;font-size:36px;font-weight:750;line-height:1.1;font-variant-numeric:tabular-nums}
.article-body > .offer-callout:first-child ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;padding:20px 0;margin:0;border-block:1px solid #385069;gap:20px}
.article-body > .offer-callout:first-child li{margin:0;padding:0;font-size:15px;line-height:1.5}
.article-body > .offer-callout:first-child > p:not(.note){display:flex;gap:12px 24px;flex-wrap:wrap;margin:20px 0}
.article-body > .offer-callout:first-child > p a{color:#d6f85a;font-weight:600;text-underline-offset:4px}
.article-body > .offer-callout:first-child a:hover{text-decoration:underline}
.article-body > .offer-callout:first-child a:focus-visible{outline:2px solid #d6f85a;outline-offset:5px;border-radius:2px}
.article-body > .offer-callout:first-child .note{padding:0;margin:0;background:none;border:0;color:#c4d3e2;font-size:13px;line-height:1.6}
@media(max-width:600px){.article-body > .offer-callout:first-child{padding:20px 16px;margin-bottom:32px}.article-body > .offer-callout:first-child h2{font-size:21px;margin-bottom:24px}.article-body > .offer-callout:first-child .offer-grid{grid-template-columns:minmax(0,1fr) 84px minmax(0,1fr);gap:6px}.article-body > .offer-callout:first-child .offer-grid a{font-size:16px}.article-body > .offer-callout:first-child .offer-grid a::before{width:48px;height:56px}.article-body > .offer-callout:first-child .offer-grid strong{font-size:28px}.article-body > .offer-callout:first-child ul{grid-template-columns:1fr;gap:14px}.article-body > .offer-callout:first-child li span{margin-top:2px}}