@import"https://fonts.googleapis.com/css2?family=Manrope:wght@500;700&display=swap";*{box-sizing:border-box;margin:0}:root{--very-dark-blue-color: hsl(217, 19%, 35%);--dark-blue-color: hsl(214, 17%, 51%);--grayish-blue-color: hsl(212, 23%, 69%);--light-blue-color: hsl(210, 46%, 95%);--white-color: white;--article-shadow-color: hsla(214, 17%, 51%, .1);--menu-shadow-color: hsla(214, 17%, 51%, .2);--small-spacing: .5rem;--large-spacing: 1rem;--main-size: 10rem;--main-font-size: 1rem}body{font-family:Manrope,sans-serif;background-color:var(--light-blue-color)}.container{min-height:100vh;display:flex;align-items:center;justify-content:center}.article-card{display:flex;flex-direction:column;max-width:calc(var(--main-size) * 2.34375)}@media(min-width:39rem){.article-card{max-width:calc(var(--main-size) * 3.75)}}@media(min-width:59.375rem){.article-card{max-width:calc(var(--main-size) * 4.84375);flex-direction:row}}.article-img-box{max-width:100%;max-height:calc(var(--main-size) * 1.5625);border-radius:calc(var(--small-spacing) + .25rem) calc(var(--small-spacing) + .25rem) 0 0;overflow:hidden}@media(min-width:39rem){.article-img-box{max-height:calc(var(--main-size) * 2.1875)}}@media(min-width:59.375rem){.article-img-box{max-width:calc(var(--main-size) * 2);border-radius:calc(var(--small-spacing) + .25rem) 0 0 calc(var(--small-spacing) + .25rem)}}.article-img{display:block;max-width:100%;height:100%;object-fit:cover;object-position:left}.article-body{flex:1;padding-block:calc(var(--large-spacing) * 2.5) 0;padding-inline:calc(var(--large-spacing) * 2.5);background-color:var(--white-color);border-radius:0 0 calc(var(--small-spacing) + .25rem) calc(var(--small-spacing) + .25rem)}@media(min-width:59.375rem){.article-body{padding-block-end:calc(var(--large-spacing) * 2.5);border-radius:0 calc(var(--small-spacing) + .25rem) calc(var(--small-spacing) + .25rem) 0;box-shadow:0 calc(var(--small-spacing) + .125rem) calc(var(--small-spacing) + .125rem) var(--article-shadow-color)}}.article-header{color:var(--very-dark-blue-color);font-size:calc(var(--main-font-size) + .15rem)}@media(min-width:59.375rem){.article-header{font-size:calc(var(--main-font-size) + .25rem)}}.article-description{font-size:calc(var(--main-font-size) - .0625rem);color:var(--dark-blue-color);line-height:1.5;margin-block:calc(var(--small-spacing) * 2)}@media(min-width:59.375rem){.article-description{font-size:calc(var(--main-font-size) - .1875rem)}}.article-author{display:flex;align-items:center;gap:calc(var(--small-spacing) * 2);margin-block-start:calc(var(--large-spacing) * 1.5);padding-block:calc(var(--small-spacing) * 2);position:relative}@media(min-width:59.375rem){.article-author{padding-block:0}}.author-avatar-box{width:2.8125rem;height:2.8125rem;border-radius:50%;overflow:hidden}.author-avatar{max-width:100%}.author-name{color:var(--very-dark-blue-color);font-size:calc(var(--main-font-size) - .1875rem)}.article-date{color:var(--grayish-blue-color);font-size:calc(var(--main-font-size) - .1875rem)}.share-btn{width:2.1875rem;height:2.1875rem;border-radius:50%;border:none;margin-inline-start:auto;background-color:var(--light-blue-color);cursor:pointer;position:relative;z-index:2}@media(prefers-reduced-motion:no-preference){.share-btn{transition:background-color .3s ease}}@media(prefers-reduced-motion:reduce){.share-btn{transition:none}}.share-btn:hover,.share-btn--active{background-color:var(--dark-blue-color)}.share-btn:hover .share-icon,.share-btn.share-btn--active .share-icon{filter:brightness(0) invert(1)}.share-links-menu{position:absolute;width:calc(100% + (var(--main-size) / 2));height:100%;bottom:0;padding-block:calc(var(--small-spacing) * 2);padding-inline-start:calc(var(--large-spacing) * 2.5);left:calc(var(--large-spacing) * -2.5);display:flex;align-items:center;justify-content:flex-start;gap:.9375rem;border-radius:0 0 calc(var(--small-spacing) + .25rem) calc(var(--small-spacing) + .25rem);background-color:var(--very-dark-blue-color);color:var(--dark-blue-color)}@media(min-width:59.375rem){.share-links-menu{height:auto;width:calc(var(--main-size) * 1.7);bottom:calc(var(--large-spacing) * 4.1);left:59.2%;border-radius:calc(var(--small-spacing) + .25rem);box-shadow:0 calc(var(--small-spacing) + .125rem) calc(var(--small-spacing) + .125rem) var(--menu-shadow-color)}}.share-links-menu:before{content:"";position:absolute;border-width:calc(var(--small-spacing) + .25rem);border-style:solid;border-color:var(--very-dark-blue-color) transparent transparent;bottom:calc(var(--large-spacing) * -1.5);left:50%;transform:translate(-50%);display:none}@media(min-width:59.375rem){.share-links-menu:before{display:block}}.share-text{text-transform:uppercase;letter-spacing:.375rem;margin-block-end:calc(var(--small-spacing) / 2)}