/* ============================================================ CHRONOS SHARED BLOG STYLES Paste this link in every article : ============================================================ */ /* Related section wrapper */ #chronos-related-section { padding: 4rem clamp(1.25rem, 8vw, 10rem); border-top: 1px solid rgba(128,128,128,0.15); } .chronos-related-label { font-size: 0.62rem; letter-spacing: 0.22em; text-transform: uppercase; opacity: 0.4; margin-bottom: 2rem; } .chronos-related-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1px; background: rgba(128,128,128,0.12); } .chronos-related-card { padding: 1.5rem; text-decoration: none; transition: opacity 0.2s; background: inherit; } a.chronos-related-card:hover { opacity: 0.75; } .chronos-related-dead { cursor: default; } .chronos-related-tag { font-size: 0.6rem; letter-spacing: 0.18em; text-transform: uppercase; opacity: 0.5; margin-bottom: 0.5rem; } .chronos-related-card h4 { font-size: 1rem; font-weight: 400; line-height: 1.4; margin: 0; } .chronos-related-dead h4 { opacity: 0.35; } .chronos-coming-soon { font-size: 0.62rem; letter-spacing: 0.12em; text-transform: uppercase; opacity: 0.3; margin-top: 0.4rem; }