/* Global Resources directory, grouped under one clear Helpful Links heading. */
.web-support-page .resources-directory { max-width: 1400px; padding: clamp(52px, 7vw, 96px) clamp(20px, 4vw, 68px) 110px; }
.resources-directory-intro { max-width: 850px; margin-bottom: 36px; }
.resources-directory-eyebrow { color: #9b3d72; font: 800 12px/1.3 Montserrat,Arial,sans-serif; letter-spacing: .16em; text-transform: uppercase; }
.web-support-page .resources-directory h2 { margin: 15px 0 20px; color: #293550; font: 800 clamp(34px, 4vw, 58px)/1.08 Montserrat,Arial,sans-serif; letter-spacing: -.055em; text-wrap: balance; }
.resources-directory-intro p { max-width: 72ch; margin: 0; color: #465266; font-size: clamp(17px, 1.45vw, 20px); line-height: 1.7; }
.resources-directory-jump { display: flex; flex-wrap: wrap; gap: 9px; margin: 0 0 clamp(54px, 7vw, 90px); padding: 0; }
.resources-directory-jump button { display: inline-block; padding: 10px 14px; border: 1px solid #d8cad5; border-radius: 50px; background: #f8f1f6; color: #51334e; font: 750 12px/1.35 Montserrat,Arial,sans-serif; text-decoration: none; cursor: pointer; }
.resources-directory-jump button:hover,.resources-directory-jump button:focus-visible { background: #5b3a62; color: #fff; outline: 2px solid #a4517f; outline-offset: 2px; }
.resources-directory-section { display: grid; grid-template-columns: minmax(240px,.58fr) minmax(0,1fr); gap: clamp(24px, 4vw, 70px); margin: 0 0 36px; padding: 39px 0 46px; border-top: 1px solid #cfcad5; scroll-margin-top: 105px; }
.resources-directory-section-heading > span { color: #a34476; font: 800 11px/1.3 Montserrat,Arial,sans-serif; letter-spacing: .15em; }
.web-support-page .resources-directory-section h3 { margin: 16px 0 14px; color: #293550; font: 800 clamp(23px, 2.4vw, 34px)/1.18 Montserrat,Arial,sans-serif; letter-spacing: -.04em; text-wrap: balance; }
.resources-directory-section-heading p { max-width: 45ch; margin: 0; color: #536070; font-size: 15px; line-height: 1.7; }
.resources-directory-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; align-content: start; }
.web-support-page a.resources-directory-card { display: flex; justify-content: space-between; gap: 16px; min-height: 136px; padding: 22px 21px; border: 1px solid #e5d9e2; border-top: 4px solid #a64b81; border-radius: 18px 3px 18px 3px; background: #fbf5fa; color: #293550; text-decoration: none; box-shadow: 0 8px 23px #2b2d450a; transition: transform .18s ease,box-shadow .18s ease,background .18s ease; }
.web-support-page a.resources-directory-card:nth-child(4n+2) { border-top-color: #7e67aa; background: #f7f3fc; }
.web-support-page a.resources-directory-card:nth-child(4n+3) { border-top-color: #c97948; background: #fcf4ed; }
.web-support-page a.resources-directory-card:nth-child(4n+4) { border-top-color: #447b79; background: #eff6f5; }
.web-support-page a.resources-directory-card:hover,.web-support-page a.resources-directory-card:focus-visible { transform: translateY(-3px); background: #fff; box-shadow: 0 16px 28px #2b2d4522; outline: 2px solid #865481; outline-offset: 2px; }
.resources-directory-card-copy { display: flex; flex-direction: column; gap: 9px; }
.resources-directory-card strong { display: block; font: 750 clamp(16px, 1.35vw, 19px)/1.3 Montserrat,Arial,sans-serif; }
.resources-directory-card small { display: block; color: #4d5768; font-size: 13px; line-height: 1.52; }
.resources-directory-card-arrow { flex: 0 0 auto; color: #984777; font-size: 22px; font-weight: 750; }
.resources-directory-contact { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-top: 16px; padding: clamp(28px, 4vw, 50px); background: linear-gradient(115deg,#293550,#493e66 63%,#784269); border-radius: 25px 3px 25px 3px; color: #fffaf5; scroll-margin-top: 100px; }
.resources-directory-contact span { color: #f3c2dc; font: 800 11px/1.3 Montserrat,Arial,sans-serif; letter-spacing: .13em; text-transform: uppercase; }
.web-support-page .resources-directory-contact h3 { margin: 10px 0 12px; color: #fffaf5; font: 800 clamp(24px, 2.6vw, 36px)/1.15 Montserrat,Arial,sans-serif; }
.resources-directory-contact p { max-width: 56ch; margin: 0; color: #f4eefa; font-size: 16px; line-height: 1.65; }
.resources-directory-contact > a { flex: 0 0 auto; display: inline-flex; gap: 19px; align-items: center; padding: 15px 20px; background: #fffaf5; border-radius: 5px; color: #293550; font: 800 13px/1.3 Montserrat,Arial,sans-serif; text-decoration: none; }
.resources-directory-contact > a:hover,.resources-directory-contact > a:focus-visible { background: #f8d9e9; outline: 2px solid #fff; outline-offset: 2px; }

/* The two magazine sections keep their source guides inside the long-form story. */
.editorial-reader.web-edition #article-content .magazine-section--resources { padding-top: clamp(44px, 6vw, 80px); padding-bottom: clamp(44px, 6vw, 80px); }
.magazine-resource-group { margin-top: 32px; }
.magazine-resource-group > span { color: #a14d7d; font: 800 11px/1.4 Montserrat,Arial,sans-serif; letter-spacing: .15em; }
.magazine-resource-group h3 { margin: 8px 0 17px; color: #293550; font: 800 clamp(20px,2vw,28px)/1.2 Montserrat,Arial,sans-serif; }
.magazine-resource-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; }
.editorial-reader.web-edition #article-content .magazine-resource-grid .chapter-resource-card { min-height: 0; }

@media (max-width: 920px) { .resources-directory-section { grid-template-columns: 1fr; gap: 23px; } .resources-directory-section-heading p { max-width: 75ch; } }
@media (max-width: 680px) { .resources-directory-grid,.magazine-resource-grid { grid-template-columns: 1fr; } .resources-directory-section { padding: 31px 0 36px; } .resources-directory-contact { align-items: start; flex-direction: column; } .resources-directory-contact > a { flex: none; } }
@media (prefers-reduced-motion: reduce) { .web-support-page a.resources-directory-card { transition: none; } }
