@layer components{.mini-banner{background-color:var(--background-color, var(--color-yellow-200));display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;padding:8px 0;border:0;text-align:center;transition:.25s filter}@media (min-width: 640px),print{.mini-banner{flex-direction:row;padding:24px;text-align:left}}.mini-banner__text{flex-grow:1;padding:0 40px;font-size:var(--font-size-md);font-weight:400;line-height:1.5}.mini-banner__text span{border-bottom:2px solid var(--color-link-decoration);transition:.1s border-bottom-color}.mini-banner__before{justify-content:flex-end}.mini-banner__after{transition:.25s transform}.mini-banner__before,.mini-banner__after{display:flex;flex-basis:48px;align-items:center}@media (min-width: 640px),print{.mini-banner__before,.mini-banner__after{flex-basis:80px}}.mini-banner:hover{filter:brightness(.98) saturate(1.1)}.mini-banner:hover .mini-banner__text span{border-bottom-color:#000}.mini-banner:hover .mini-banner__after{transform:translate(24px)}.mini-banner:focus{box-shadow:none}.mini-banner:focus .mini-banner__text span{border-bottom-color:var(--color-black)}.mini-banner:focus-visible{box-shadow:none;outline:2px solid var(--color-black)}.mini-banner--dark{--background-color: var(--color-black);color:var(--color-white)}.mini-banner--dark .icon{fill:var(--color-white)}.mini-banner--dark:focus-visible{background-color:var(--color-turquoise-700)}.mini-banner--dark:hover{background-color:var(--color-gray-800)}.mini-banner--dark:hover .mini-banner__text span{border-bottom-color:var(--color-white)}.mini-banner:not(:has(.mini-banner__before)) .mini-banner__text{padding-top:16px}@media (min-width: 640px),print{.mini-banner:not(:has(.mini-banner__before)) .mini-banner__text{padding-top:0}}}
