.card{display:flex;flex-direction:column;margin:1.5rem;max-width:512px;background-color:#fff;border-radius:.6rem;box-shadow:0 5px 20px #00000010}.card img{width:100%;border-top-right-radius:.6rem;border-top-left-radius:.6rem;aspect-ratio:165/101;object-fit:cover;object-position:0 -16px}.card .card-article{display:flex;flex-direction:column;margin:0;padding:1.75rem 1.9rem 1.3rem;position:relative}.card .card-article .article-title{font-size:1.03rem;line-height:1.45;color:var(--very-dark-grayish-blue);margin:0;margin-top:.5rem}.card .card-article .article-pagraph{width:98%;line-height:1.55;letter-spacing:.1px;color:var(--grayish-blue)}.card .card-article .article-footer{display:flex}.card .card-article .article-footer img{width:40px;height:40px;border-radius:50%;object-position:0}.card .article-footer{margin-top:1.2rem;display:flex;align-items:center;gap:1rem;justify-content:space-between}.card .article-footer div{display:flex;flex-direction:column;justify-content:center}.card .article-footer div .footer-name{margin:0 0 2px;font-weight:700;color:var(--very-dark-grayish-blue);letter-spacing:.1px}.card .article-footer div .footer-date{margin:0;color:var(--grayish-blue);letter-spacing:.1px}.card .card-article .article-footer .card-shared{margin-left:auto;cursor:pointer;border-radius:50%;z-index:10}.card .card-article .article-footer .card-shared-activate{background-color:var(--grayish-blue);margin-left:auto;cursor:pointer;border-radius:50%;z-index:10}.card .card-article .article-footer .footer-icon__shared{background-color:var(--light-grayish-blue);box-sizing:border-box;width:32px;height:32px;padding:.5rem;object-fit:contain;border-radius:50%;z-index:10}.card .article-footer .card-toltip{box-sizing:border-box;padding:1rem 1rem 1rem 1.9rem;color:var(--grayish-blue);width:100%;bottom:0;left:0;position:absolute;background-color:var(--very-dark-grayish-blue);display:flex;flex-direction:row;border-bottom-left-radius:.6rem;border-bottom-right-radius:.6rem;justify-content:flex-start;align-items:center}.card .article-footer p{letter-spacing:5px}.card .article-footer .card-shared-activate img{border-radius:0;padding:.63rem;box-sizing:border-box;object-fit:contain}@media (width > 612px){.card{flex-direction:row;margin:0;max-width:730px;margin-left:2rem;margin-right:2rem}.card img{max-width:285px;border-radius:0;border-top-left-radius:.6rem;border-bottom-left-radius:.6rem;object-position:0;aspect-ratio:1.02}.card .card-article{padding:0;margin:2.08rem 2.5rem 1rem}.card .card-article .article-title{margin:0;font-size:1.25rem;letter-spacing:.2px;line-height:1.4}.card .card-article .article-pagraph{margin-top:12px;line-height:1.55}.card .article-footer{margin-top:6px}.card .article-footer .card-toltip{box-sizing:border-box;width:auto;padding:.4rem 2.2rem;color:var(--grayish-blue);left:auto;right:0;transform:translate(calc(50% - 16px)) translateY(-135%);position:absolute;background-color:var(--very-dark-grayish-blue);display:flex;flex-direction:row;border-radius:.6rem;justify-content:center;align-items:center;gap:1.1rem}.card .article-footer .card-shared-activate p{padding-left:0;text-align:end}.card .article-footer .card-shared-activate img{width:20px;padding-left:0;padding-right:0}.card .article-footer .card-shared-activate .toaltip-arrow{border:14px solid var(--very-dark-grayish-blue);border-left:14px solid transparent;border-right:14px solid transparent;border-bottom:14px solid transparent;position:absolute;bottom:-26px}}:root{--very-dark-grayish-blue: #48556a;--desaturated-dark-blue: #6d7f97;--grayish-blue: #9eafc2;--light-grayish-blue: hsl(210, 46%, 95%) }a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{font-size:.8125rem;font-family:Manrope,sans-serif;margin:0;display:flex;justify-content:center;place-items:center;min-width:320px;min-height:100vh;background-color:var(--light-grayish-blue)}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}