#resources{padding-block:12rem 9rem;background:var(--neutral-100);box-shadow:0 4px 64px 0 rgba(15,35,51,.09) inset;text-align:center;@media screen and (max-width:767px){padding-block-start: 8rem 4rem; } .resources-heading { font-size: clamp(1.8rem,1.0335rem+0.3902vw,2.2rem); line-height: 1.3; letter-spacing: 4.4px; text-transform: uppercase; text-align: center; strong{text-decoration:underline}}ul { list-style:none; display:flex; gap:2.2rem; margin-block:6.3rem 12.5rem; margin-inline:0; padding-inline:0; li { flex:1; padding:0; } } .card { display:flex; flex-direction:column; align-items:center; block-size:100%; gap:2.5rem; padding:1.5rem 1.3rem; border-radius:1.2rem; background-color:var(--white); @media screen and (max-width:767px) { gap:1.5rem; } &::before,&::after { content:none; } } .img-container { inline-size:100%; aspect-ratio:346/200; background:var(--primary-500); border-radius:0.5rem; img { block-size:100%; object-fit:cover; border-radius:inherit; } } .tag { display:flex; justify-content:center; align-items:center; padding:0.4rem 4.8rem; gap:1rem; border-radius:3rem; border:0.1rem solid var(--primary-500); color:var(--primary-500); font-size:1.4rem; font-weight:500; } .card-heading { margin:0; } .card a{ text-decoration:none; color:var(--winston-text-blue); margin:1rem auto; } a h3.card-heading{ margin:0 auto 1.5rem; line-height:1.2; } .card-copy { margin-block-start:auto; padding-bottom:2rem; } .cta { --color:var(--primary-800); --border-color:var(--primary-700); border-width:1px; font-weight:700; &:hover { --color:var(--neutral-50); --background:var(--primary-700); --border-color:var(--primary-700); } }}