.contentDirections{margin:70px 0;padding:45px 0;border-top:1px solid currentColor}.contentDirectionsLabel{font-size:12px;letter-spacing:.12em;text-transform:uppercase;opacity:.65}.contentDirections h2{font-size:clamp(28px,3.5vw,46px);line-height:1.15;letter-spacing:-.035em;margin:18px 0}.contentDirectionsIntro{max-width:850px;font-size:18px;line-height:1.7;opacity:.8}.contentDirectionsGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:35px}.contentDirections h3{font-size:20px;line-height:1.35;margin:0 0 14px}.contentDirectionsGrid p,.contentDirectionsProof p,.contentDirections details p{font-size:15px;line-height:1.75;opacity:.78;margin:0;max-width:850px}.contentDirectionsProof{margin-top:32px;padding-top:28px;border-top:1px solid color-mix(in srgb,currentColor 18%,transparent)}.contentDirectionsProof nav{display:flex;flex-wrap:wrap;gap:14px 28px;margin-top:20px}.contentDirections a{color:inherit;text-underline-offset:5px}.contentDirections a:hover{text-decoration:underline}.contentDirections details{margin-top:28px}.contentDirections summary{cursor:pointer;font-size:16px;padding:10px 0}.contentDirections details p{padding-top:10px}.contentDirections a:focus-visible,.contentDirections summary:focus-visible{outline:2px solid currentColor;outline-offset:5px}.contentDirections article{scroll-margin-top:100px}@media(max-width:760px){.contentDirections{margin:40px 0;padding:28px 0}.contentDirectionsGrid{grid-template-columns:1fr;gap:25px}.contentDirectionsIntro{font-size:16px}}

.contentDirectionsCredits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:22px}.contentDirectionsCredits a{display:flex;flex-direction:column;gap:10px;text-decoration:none}.contentDirectionsCredits strong{font-size:16px}.contentDirectionsCredits span{font-size:14px;line-height:1.6;opacity:.72}.contentDirectionsCredits a:hover strong{text-decoration:underline}@media(max-width:760px){.contentDirectionsCredits{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px}}

/* The services hero already supplies the section divider. */
.servicesHero + .contentDirections{border-top:0;margin-top:0;padding-top:44px}

/* Each direction keeps its offer and proof together. */
.contentDirections .contentDirectionsGrid{gap:18px;margin-top:26px}
.contentDirections .contentDirectionsGrid article{display:flex;flex-direction:column;min-width:0;margin:0;padding:24px;border:1px solid color-mix(in srgb,currentColor 15%,transparent);border-radius:18px;background:color-mix(in srgb,currentColor 3%,transparent)}
.contentDirections .contentDirectionsGrid h3{font-size:20px;margin:0 0 12px}
.contentDirections .contentDirectionsGrid p{font-size:15px;line-height:1.6;margin:0 0 22px}
.contentDirections .directionCases{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-bottom:22px}
.contentDirections .directionCases a{display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid color-mix(in srgb,currentColor 15%,transparent);border-radius:9px;font-size:12px;line-height:1.4;text-decoration:none;transition:background .2s,border-color .2s}
.contentDirections .directionCases a span{opacity:.5}
.contentDirections .directionActions{display:flex;flex-wrap:wrap;gap:12px 22px;padding-top:16px;border-top:1px solid color-mix(in srgb,currentColor 12%,transparent)}
.contentDirections .directionActions a{font-size:13px;font-weight:650;text-decoration:none}
@media(hover:hover){.contentDirections .directionCases a:hover{background:color-mix(in srgb,#dda15e 12%,transparent);border-color:#dda15e80}.contentDirections .directionActions a:hover{text-decoration:underline}}
@media(max-width:760px){.contentDirections .contentDirectionsGrid{gap:14px;margin-top:22px}.contentDirections .contentDirectionsGrid article{padding:22px}.contentDirections .contentDirectionsGrid p{margin-bottom:18px}.contentDirections .directionCases{padding-bottom:18px}.contentDirections .contentDirectionsIntro{line-height:1.6}.contentDirections h2{font-size:30px}}
@media(prefers-reduced-motion:reduce){.contentDirections .directionCases a{transition:none}}

.contentDirections{scroll-margin-top:110px}

/* Keep the author directions close to the service list, without a second divider. */
body[data-page-mode="author"] .authorServicesSection{padding-bottom:32px}
body[data-page-mode="author"] .contentDirections{border-top:0;margin-top:0;padding-top:24px}
@media(max-width:760px){body[data-page-mode="author"] .authorServicesSection{padding-bottom:20px}body[data-page-mode="author"] .contentDirections{padding-top:16px}}
