.article-banner{grid:var(--article-banner-grid);column-gap:var(--article-banner-column-gap);align-items:var(--article-banner-horizontal-alignement, center);box-sizing:content-box;justify-items:center;margin-inline-start:auto;margin-inline-end:auto;padding-block-start:var(--article-banner-padding-block-start, 0);display:grid;position:relative}.article-banner-container{position:relative}.article-banner-container:before{content:"";width:calc((100vw - var(--scrollbar-width, 0px)));pointer-events:none;background-color:rgb(var(--article-banner-background));position:absolute;height:100%;top:0}.article-banner__image{z-index:1;width:100%}.article-banner__image>img{width:100%}.article-banner__content{gap:1.5rem;padding:var(--article-banner-content-padding-block-start) var(--article-banner-content-padding-inline) var(--article-banner-content-padding-block-end);justify-items:var(--article-banner-vertical-alignement, center);text-align:var(--article-banner-vertical-alignement, center);z-index:2;display:grid}.article-banner__content h1{margin:0 0 5px;color:rgb(var(--text-color))}.article-banner__content>.badge{--badge-background: var(--article-banner-badge-background);padding:.25rem .75rem;display:inline-block}.article__meta{justify-content:var(--article-banner-meta-vertical-alignment, center);row-gap:.5rem;column-gap:1rem;flex-wrap:wrap;display:flex;color:rgb(var(--text-color))}.article__meta .text-with-icon{gap:.5rem;margin:0;display:flex;align-items:center;color:rgb(var(--text-color))}.article__meta .article-comment-count,.article__meta .article-author{color:rgb(var(--text-color));text-decoration:none;display:flex;align-items:center;gap:0 .3rem;cursor:pointer;font-size:inherit;line-height:1}.article__meta .tag{font-size:inherit;font-weight:400;border-radius:2px;color:rgb(var(--text-color));text-decoration:none;font-family:var(--font-heading-family);font-weight:600;line-height:1;display:flex;align-self:center}.article-banner__image .aspect-ratio{position:relative;max-width:100%}.article-banner__image .aspect-ratio:before{padding-bottom:calc(100% / (var(--aspect-ratio)));content:"";display:block}.tooltip{position:relative;display:inline-block}.tooltip .tooltiptext{visibility:hidden;width:130px;background-color:#555;color:#fff;text-align:center;padding:5px 3px;border-radius:6px;position:absolute;z-index:1;bottom:125%;left:50%;margin-left:-75px;opacity:0;transition:opacity .3s}.tooltip .tooltiptext:after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:#555 transparent transparent transparent}.tooltip:hover .tooltiptext{visibility:visible;opacity:1}@media screen and (min-width: 1150px){.article-banner__content{grid-area:var(--article-banner-grid-area, content)}.article-banner__image{grid-area:var(--article-banner-grid-area, image);position:relative}.article-banner__image:before{content:"";background:rgb(var(--article-banner-image-overlay));border-radius:inherit;z-index:1;pointer-events:none;transition:background .2s ease-in-out;position:absolute;top:0;bottom:0;left:0;right:0}.article__meta{column-gap:1.5rem}.article__meta .text-with-icon,.article__meta .article-comment-count{gap:0 .3rem}}@media screen and (max-width: 768px){.article-banner__content h1{padding:0 1.5rem}}
/*# sourceMappingURL=/cdn/shop/t/6/assets/component-blogpost-banner.css.map */
