.public-link-arrow{display:inline-flex;align-items:center;justify-content:center;flex:0 0 16px;width:16px;height:16px;margin-inline-start:.5em;vertical-align:-3px;color:inherit;pointer-events:none}
.public-link-arrow svg{display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.public-link-arrow--down svg{transform:rotate(90deg)}
.public-link-arrow--external svg{transform:rotate(-45deg)}
#main-content :is(.public-action,.public-news-read,.solution-explore),.public-header-cta{gap:10px}
#main-content :is(.public-action,.public-news-read,.solution-explore)>.public-link-arrow,.public-header-cta>.public-link-arrow{margin-inline-start:0}
#pg-news .side-menu-link>.public-link-arrow{margin-inline-start:auto;color:#f8962c}

/* template.css assigns a grey color to every element, including SVG paths.
   Inherit at every level so currentColor uses the link's text color. */
#main-content :is(a,button)>.public-link-arrow,
#main-content :is(a,button)>.public-link-arrow svg,
#main-content :is(a,button)>.public-link-arrow svg *,
.public-header-cta>.public-link-arrow,
.public-header-cta>.public-link-arrow svg,
.public-header-cta>.public-link-arrow svg *{color:inherit!important}
#main-content .public-link-arrow svg,.public-header-cta .public-link-arrow svg{stroke:currentColor!important;fill:none!important}

/* Blue action buttons keep white text and arrows over the legacy link hover. */
.public-action:is(:hover,:focus-visible){color:#fff!important}
#main-content :is(a,button).btn-primary{color:#fff!important}