/*
Theme Name: Solutionreach
Author: Tiller Digital
Version: 1.1.0
License: GNU General Public License v3 or later
*/



/* VARIABLES */

:root {
	--white: #FFFFFF;
	--black: #000000;
	--blue: #183166;
	--light-blue: #7383A3;
	--teal: #90D4D3;
	--teal-bg: #E9F6F6;
	/* --orange: #E56A54; */ /* OLD */
	--orange: #E36751; /* Brand guide */
	--light-orange: #E98373;
	--yellow: #E3B505;
	--cream: #F8F5F2;

	/* 2024 REFRESH COLORS */
	--light-blue-100: #EAF6F7;
	--light-blue-200: #D2ECEC;
	--light-blue-700: #4D9E9E;
	--blue-400: #465b85;
	
	--error: red;

	
	--banner-height: 0;
	--page-head-height: 140rem;
	--page-head-height-compressed: 92rem;
	--frame-width: 1160rem;
}

@media screen and (max-width: 960px) {
	:root {
		--page-head-height: 80rem;
		--page-head-height-compressed: 80rem;
		--frame-width: 480rem;
	}
}



/* REM SCALING */

:root {font-size: 1px;}

@media screen and (min-width: 1921px) {:root{font-size: 1.25px;}}

@media screen and (max-width: 1520px) {:root{font-size: 0.9583333px;}}
@media screen and (max-width: 1440px) {:root{font-size: 0.9166666px;}}
@media screen and (max-width: 1360px) {:root{font-size: 0.875px;}}
@media screen and (max-width: 1280px) {:root{font-size: 0.8333333px;}}
@media screen and (max-width: 1200px) {:root{font-size: 0.7966666px;}}
@media screen and (max-width: 1120px) {:root{font-size: 0.75px;}}
@media screen and (max-width: 960px) {:root{font-size: 1px;}}




/* TEXT */

html {
	scroll-behavior: auto;
	overflow-y: scroll;
	scroll-padding-top: 120px;
	text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-webkit-tap-highlight-color: transparent;
}

body {
	margin: 0;
	font-family: 'Noto Sans', sans-serif;
	font-size: 18rem;
	line-height: 1.5;
	color: var(--black);
	background: var(--white);
}

h1, h2, h3, h4, h5, h6 {
	margin: 1.15em 0 0 0;
	line-height: 1.25;
	font-weight: 700;
}

h1, .b-h1,
h2, .b-h2,
h3, .b-h3,
h5, .b-h5,
h6, .b-h6 {
	/* font-family: 'Lora', serif; */
	font-family: "Outfit", sans-serif;
	/* letter-spacing: 0.01em; */
	padding-bottom: 0.2em;
}

h1, .b-h1 {font-size: 48rem;}
h2, .b-h2 {font-size: 42rem;}
h3, .b-h3 {font-size: 36rem;}
h4, .b-h4 {font-size: 24rem;}
h5, .b-h5 {font-size: 24rem;}
h6, .b-h6 {font-size: 24rem;}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color: inherit;}

a.alt-black { color: var(--black); }
a.alt-black:hover { color: var(--orange); }

.b-text-large {font-size: 20rem;}
.b-text-small {font-size: 16rem;}

.b-eyebrow {
	color: var(--light-blue);
	font-family: 'Noto Sans', sans-serif;	
	font-size: 16rem;
	text-transform: uppercase;
	font-weight: 700;
}

.b-eyebrow + * {
	margin-top: 12rem;
}

.alt-font-lora,
.alt-font-outfit { 
	/* font-family: 'Lora', serif;  */
	font-family: "Outfit", sans-serif !important;
}

.b-huge-header {
	font-size: 160rem;
	color: var(--blue);
	font-family: 'Noto Sans', sans-serif;
}

.b-huge-header + h2 { margin: 0; }

.b-blue-text { color: var(--blue); }

@media screen and (max-width: 960px) {
	html {scroll-padding-top: 80px;}
	body {font-size: 16rem;}

	h1, .b-h1 {font-size: 32rem;}
	h2, .b-h2 {font-size: 26rem;}
	h3, .b-h3 {font-size: 22rem;}
	h4, .b-h4 {font-size: 20rem;}
	h5, .b-h5 {font-size: 18rem;}
	h6, .b-h6 {font-size: 16rem;}

	.b-text-large {font-size: 18rem;}
	.b-text-small {font-size: 14rem;}

	.b-eyebrow {font-size: 14rem;}

	.b-page h1 br,
	.b-page h2 br,
	.b-page h3 br,
	.b-page h4 br,
	.b-page h5 br,
	.b-page h6 br {display: none;}
}



/* BASIC TAGS */

p {
	margin: 1em 0;
}

ul, ol {
	margin: 1em 0;
	padding: 0 0 0 1em;
}

.content ul.alt-black > li::before {
	background-color: var(--black);
}

ul ul {margin: 0;}
.content ul,
.POST ul {
	list-style-type: none;
}
.content ul li,
.content ol li,
.POST ul li,
.POST ol li {
  font-size: 18rem;
  letter-spacing: 0;
  line-height: 32rem;
	position: relative;
}
.content ul > li::before, 
.POST ul > li::before {
	content: ""; 
	background-color: var(--orange);
  	display: inline-block; 
	border-radius: 50%;
	width: 9rem;
	height: 9rem;
  	margin-left: -1em;
	margin-right: calc(1em - 9rem);
	position: absolute;
	top: calc(11rem);
}
.content ul ul > li::before, 
.POST ul ul > li::before {
	content: "";
	position: absolute;
	display: inline-block;  
  	margin-left: -1em;
	margin-right: calc(1em - 9rem);
	top: calc(13rem);
	left: 0;
	width: 8rem; 
	height: 8rem; 
	background-color: var(--blue);
	transform: rotate(45deg);
	border-radius: 0;
}

.content ol,
.POST ol { 
	list-style: none; 
	counter-reset: li
}
.content ol li::before,
.POST ol li::before{
	content: counter(li) ". ";
  	color: var(--orange);
 	display: inline-block;
	font-weight: 700;
	width: 1em;
  	margin-left: -1em;
	margin-right: calc(0.5em);
}

.content ol li,
.POST ol li {counter-increment: li;}

ul.alt-bold > li:not(:last-of-type) {
	margin-bottom: 10rem;
}

ul.alt-bold > li {
	font-size: 24rem;
	font-weight: 700;
}

@media screen and (max-width: 960px) {
	ul.alt-bold > li:not(:last-of-type) { margin-bottom: 5rem; }
	ul.alt-bold > li { font-size: 18rem; }
}

/* tertiary bullet points */ 

/* circle */ 

ul li > ul li > ul.outline-bullet li {
	position: relative;
	list-style: none;
}

ul li > ul li > ul.outline-bullet li::before {
	content: "";
	position: absolute;
	left: -23rem;
	top: 6rem;
	width: 6rem;
	height: 6rem;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border: 2px solid var(--orange);
	background: none;
	transform: none;
	margin: 0;
}

/* outline square */ 

ul li > ul li > ul.outline-square li {
	position: relative;
	list-style: none;
}


ul li > ul li > ul.outline-square li::before {
	content: "";
	position: absolute;
	left: -23rem;
	top: 8rem;
	width: 6rem;
	height: 6rem;
	border: 2px solid var(--orange);
	background: none;
	transform: none;
	margin: 0;
}


/* checkmark */ 

ul li > ul li > ul.checkmark-bullet li {
	position: relative;
	list-style: none;
}

ul li > ul.checkmark-bullet li::before {
	content: "";
	width: 15rem;
	height: 15rem;
	position: absolute;
	left: -25rem;
	top: 5rem;
	background-size: 15rem 15rem;
	background: no-repeat url('data:image/svg+xml,<svg width="12.6424666px" height="10.1448731px" viewBox="0 0 12.6424666 10.1448731" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <g id="UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="Pricing-v2" transform="translate(-991.734646, -1731.313781)" stroke="%23183166" stroke-width="2"> <g id="What’s-included%3F" transform="translate(358.666667, 695.000000)"> <g id="Table" transform="translate(0.000000, 112.000000)"> <g id="Pro" transform="translate(549.389831, 4.000000)"> <polyline id="Path-2" points="84.4067797 925.128362 88.0460885 929 95.5932203 921"></polyline> </g> </g> </g> </g> </g></svg>');
	transform: none;
	margin: 0;
}

/* circle checkmark bullet */ 

ul li > ul li > ul.circle-checkmark-bullet li {
	position: relative;
	list-style: none;
}

ul li > ul li > ul.circle-checkmark-bullet li::before {
	content: "";
	width: 21rem;
	height: 22rem;
	position: absolute;
	top: 2rem;
	left: -30rem;
	background-size: 12rem 12rem;
	background-image: url(./assets/icons/checkmark-pricing.svg);
	background-color: var(--orange);
	border-radius: 50%;
	background-repeat: no-repeat;
	background-position: 5rem 5rem;
	transform: none;
	margin: 0;
}



ul.alt-large-blue-circle-checkmark {
	list-style: none;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 20rem;
}

ul.alt-large-blue-circle-checkmark > li {
	display: flex;
	align-items: center;
	gap: 20rem;
	line-height: 1.4;
}

ul.alt-large-blue-circle-checkmark > li::before {
	content: "";
	display: block;
	width: 40rem;
	height: 40rem;
	flex: 0 0 40rem;
	position: static;
	margin-left: 0;
	margin-right: 0;	
	background: url('./assets/icons/icon-circle_checkmark-blue.svg') center / 40rem 40rem no-repeat;
}


/* BLUE CIRCLE CHECKMARK BULLET */
ul.alt-blue-circle-checkmark {
	list-style-type: none;
	padding-left: 30rem;
}

ul.alt-blue-circle-checkmark > li{
	position: relative;
}

ul.alt-blue-circle-checkmark > li::before {
	content: "";
	position: absolute;
	margin: 0;
	width: 16rem;
	height: 16rem;
	inset: 8.5rem auto auto -30rem;
	background: url('./assets/icons/icon-circle_checkmark-blue-small.svg') center / 16rem 16rem no-repeat;
}

ul.alt-blue-circle-checkmark.alt-spaced { margin-top: 32rem; margin-bottom: 32rem; }
ul.alt-blue-circle-checkmark.alt-spaced > li:not(:last-child) { margin-bottom: 24rem; }

@media screen and (max-width: 960px) {
	ul.alt-blue-circle-checkmark.alt-spaced > li:not(:last-child) { margin-bottom: 12rem; }
	ul.alt-blue-circle-checkmark.alt-spaced { margin-top: 18rem; margin-bottom: 18rem; }
}




strong, b {
	font-weight: 700;
}

em, i {
	font-style: italic;
}

img, svg {
	display: block;
	max-width: 100%;
	height: auto;
	border: none;
}

span.arrow {white-space: nowrap;}
span.arrow svg {display: inline;}

figure {
	max-width: 100%;
	margin: 40rem 0;
}

figcaption {
	margin-top: 10rem;
	font-size: 10rem;
}



hr {
	margin: 40rem 0;
	padding: 0;
	background: none;
	border: none;
	border-bottom: 1px solid #ccc;
}

table {
	margin: 40rem 0;
	width: 100%;
	border-spacing: 0;
	border-collapse: collapse;
}

table td {
	padding: 5rem;
	border: 1px solid #ccc;
	border-width: 1px 0;
}

iframe {
	width: 100%;
	border: none;
	overflow: auto;
}

nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

article,
aside,
footer,
header,
main,
section {
	display: block;
}



/* LINKS */

a {
	color: var(--orange);
	background-color: transparent;
	text-decoration: none;
	transition: color 0.25s;
}

a:hover {color: inherit;}
a svg {fill: currentColor;}

a.alt-arrow { font-weight: 600; }
a.alt-arrow::after {
	content: "";
	display: inline-block;
	margin: 0rem 0 -3rem 10rem;
	width: 20rem;
	height: 18rem;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='18' fill='none'%3E%3Cpath stroke='%23E36751' stroke-linecap='round' stroke-width='2.5' d='M1.25 9H17.5m-6.25-7.5 6.616 6.616a1.25 1.25 0 0 1 0 1.768L11.25 16.5'/%3E%3C/svg%3E") center / contain no-repeat;
	background-color: currentColor;
}

a.arrow {
	display: inline-flex;
	align-items: center;
}
a.arrow::after {
	content: "";
	width: 24px;
	height: 12px;
	display: inline-block;
	background-image: url(/assets/images/ui-arrow-right.svg);
}



/* BUTTON */

.b-button {
	cursor: pointer;
	max-width: 100%;
	vertical-align: middle;
	display: inline-block;
	box-sizing: border-box;
	color: #fff;
	font-family: inherit;
	font-weight: 700;
	font-size: 16rem;
	line-height: 1.25;
	width: auto;
	padding: 15rem 25rem;
	background: var(--orange);
	border: none;
	border-radius: 25rem;
	/* min-width: 200rem; */
	min-width: 188rem;
	text-align: center;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	transition: opacity 0.25s, background 0.25s, color 0.25s, box-shadow 0.25s;
}

.b-button:hover {
	background: var(--light-orange);
	color: var(--white);
}

.b-button.alt-outline {background: transparent; box-shadow: inset 0 0 0 2rem var(--orange); color: var(--orange);}
.b-button.alt-outline:hover {background: var(--light-orange); color: var(--white); box-shadow: inset 0 0 0 2rem var(--light-orange);}

.b-button.alt-outline.alt-blue {background: transparent; box-shadow: inset 0 0 0 2rem var(--blue); color: var(--blue);}
.b-button.alt-outline.alt-blue:hover {background: var(--blue); color: var(--white); box-shadow: inset 0 0 0 2rem var(--blue);}


.b-button.alt-white {background: white; color: var(--black);}
.b-button.alt-white:hover {background: var(--orange); color: var(--white);}

.b-button.alt-outline.alt-white {background: transparent; box-shadow: inset 0 0 0 2rem white; color: white;}
.b-button.alt-outline.alt-white:hover {background: var(--light-orange); color: var(--white); box-shadow: inset 0 0 0 2rem var(--light-orange);}


.b-button.alt-arrow {
	background: transparent;
	box-shadow: none;
	display: inline-flex;
	gap: 16rem;
	align-items: center;
	justify-content: center;
	padding-inline: 0;
}

.b-button.alt-arrow .arrow {
	display: inline-block;
	width: 28rem;
	height: 15rem;
}

.b-button.alt-arrow:hover {
	color: var(--blue);
}


p:last-child .b-button {margin-top: 1em;}



/* TEXT INPUT & TEXTAREA */

.b-input,
.b-textarea,
.b-select {
	box-sizing: border-box;
	color: #000;
	font-family: inherit;
	font-size: 16rem;
	line-height: 32rem;
	height: 50rem;
	width: 100%;
	padding: 0 15rem;
	background: #fff;
	box-shadow: inset 0 0 0 1px #999999;
	border: none;
	border-radius: 5rem;
	transition: box-shadow 0.25s;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

.b-textarea {
	display: block;
	line-height: 1.5em;
	padding: 7.5rem 15rem;
	height: 160rem;
	resize: vertical;
}

.b-select {
	cursor: pointer;
	/* padding-right: 30rem; */
	background: #fff no-repeat right 1rem center url();
}
.select-container,
.search { position: relative; }
.select-container .icon,
.resources-search .icon {
	position: absolute;
	top: 0;
  bottom: 0;
  margin: auto 0;
	right: 15px;
	display: block;
	width: fit-content;
	height: fit-content;
	pointer-events: none;
}

.b-select::-ms-expand {
	display: none;
}



/* PAGE */

.b-page {
	border-right: 0 solid #fff; /* used when scroll is disabled */
	max-width: 100%;
	min-width: 320px;
	overflow: hidden;
}

.b-page-head {
	display: flex;
	flex-direction: column;
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	right: 0;
	height: var(--page-head-height);
	transition:  height 0.25s;
}

.b-page[data-scroll] .b-page-head {
	position: fixed;
	top: calc(var(--page-head-height-compressed) * -1);
	height: var(--page-head-height-compressed);
	transition: transform 0.25s;
}

.b-page[data-scroll="up"] .b-page-head {
	transform: translate(0, 100%);
}

.b-page-body {
	position: relative;
	z-index: 1;
}

#toggle-nav:checked ~ .b-page[data-scroll] .b-page-head {transform: translate(0, 100%);}




/* NAV & MODAL */

.b-nav,
.b-modal {
	display: flex !important;
	justify-content: center;
	align-items: center;
	pointer-events: none;
	overflow: hidden;
	position: fixed;
	z-index: 4;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	opacity: 0;
	visibility: hidden;
	transition: visibility 0s 0.25s, opacity 0.25s;
}

.b-nav-overlay,
.b-modal-overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: var(--black);
	opacity: 0.8;
}

.b-nav-content,
.b-modal-content {
	width: calc(100% - 80rem);
	max-width:  var(--frame-width);
	max-height: 100%;
	overflow: hidden;
	transform: translate(0, 80rem);
	transition: transform 0.25s;
}

#toggle-nav:checked ~ .b-nav,
.b-modal-open .b-modal {
	pointer-events: auto;
	opacity: 1;
	visibility: visible;
	transition: visibility 0s 0s, opacity 0.25s;
}

#toggle-nav:checked ~ .b-nav .b-nav-content,
.b-modal-open .b-modal .b-modal-content {
	transform: translate(0, 0);
}

/* nav */

.b-nav {top: var(--page-head-height); align-items: flex-start;}
.b-nav-overlay {background: var(--blue); opacity: 1;}
.b-nav-content {
	height: 100%;
	transform: translate(0, -80rem);
}

@media screen and (max-width: 960px) {
	.b-nav-content {width: 100%;}
	.b-modal-content {width: calc(100% - 40rem);}
}



/* SKIP LINKS */

.b-skip-links {
	z-index: 3;
	position: absolute;
	top: 0;
	left: 0;
	padding: 10rem;
}

.b-skip-links a {
	opacity: 0;
	transition: opacity 0.25s;
}

.b-skip-links a:focus {opacity: 1;}

@media screen and (max-width: 960px) {
	.b-skip-links {display: none;}
}



/* COLUMNS */

.b-columns {
	display: flex;
	flex-wrap: wrap;
	margin: -20rem;
}

.b-column {
	padding: 20rem;
	box-sizing: border-box;
	flex: 0 0 auto;
	align-items: stretch;
}

.b-column[data-width="1"] {width: 8.3333333%;}
.b-column[data-width="2"] {width: 16.666666%;}
.b-column[data-width="3"] {width: 25%;}
.b-column[data-width="4"] {width: 33.333333%;}
.b-column[data-width="5"] {width: 41.666666%;}
.b-column[data-width="6"] {width: 50%;}
.b-column[data-width="7"] {width: 58.333333%;}
.b-column[data-width="8"] {width: 66.666666%;}
.b-column[data-width="9"] {width: 75%;}
.b-column[data-width="10"] {width: 83.333333%;}
.b-column[data-width="11"] {width: 91.666666%;}
.b-column[data-width="12"] {width: 100%;}

.b-column[data-width="1/1"] {width: 100%;}
.b-column[data-width="1/2"] {width: 50%;}
.b-column[data-width="1/3"] {width: 33.333333%;}
.b-column[data-width="1/4"] {width: 25%;}
.b-column[data-width="1/5"] {width: 20%;}
.b-column[data-width="1/6"] {width: 16.666666%;}
.b-column[data-width="1/7"] {width: 14.285714%;}
.b-column[data-width="1/8"] {width: 12.5%;}
.b-column[data-width="1/9"] {width: 11.111111%;}
.b-column[data-width="1/10"] {width: 10.000%;}
.b-column[data-width="1/11"] {width: 9.0909090%;}
.b-column[data-width="1/12"] {width: 8.3333333%;}

/* alts */

.b-columns.alt-collapse {margin: 0;}
.b-columns.alt-collapse .b-column {padding: 0;}

.b-columns.alt-thin {margin: -10rem;}
.b-columns.alt-thin .b-column {padding:10rem;}

.b-columns.alt-bottom {margin-bottom: -40rem;}
.b-columns.alt-bottom .b-column {padding-bottom: 40rem;}

.b-columns.alt-center {justify-content: center;}
.b-columns.alt-middle {align-items: center;}

.b-columns.alt-flickity {overflow: hidden; justify-content: flex-start; flex-wrap: nowrap;}
.b-columns.alt-flickity.flickity-enabled {overflow: visible; display: block; margin-top: 0; margin-bottom: 0;}
.b-columns.alt-flickity.flickity-enabled .b-column {display: block; padding-top: 0; padding-bottom: 0;}
.b-columns.alt-flickity.flickity-enabled.alt-middle .b-column {display: flex; flex-direction: column; justify-content: center;}

@media screen and (min-width: 961px) {
	.b-columns.alt-tight {margin: -10rem;}
	.b-columns.alt-tight .b-column {padding: 10rem;}

	.b-columns.alt-loose {margin: -30rem;}
	.b-columns.alt-loose .b-column {padding: 30rem;}
}

@media screen and (max-width: 960px) {
	.b-columns {margin: -10rem;}
	.b-columns .b-column {padding: 10rem;}
	.b-column[data-width] {width: 100%;}

	.b-columns.alt-bottom {margin-bottom: -30rem;}
	.b-columns.alt-bottom .b-column {padding-bottom: 30rem;}
}



/* SPACER */

.b-spacer {
	display: block;
	clear: both;
}

.b-spacer[data-height="small"] {height: 40rem;}
.b-spacer[data-height="medium"] {height: 60rem;}
.b-spacer[data-height="large"] {height: 120rem;}

@media screen and (max-width: 960px) {
	.b-spacer[data-height="small"],
	.b-spacer[data-height="medium"] {height: 40rem;}
	.b-spacer[data-height="large"] {height: 60rem;}
}



/* UTILITY */

.b-scrollbar {
	width: 100px;
	height: 100px;
	overflow: scroll;
	position: absolute;
	top: -9999px;
}

.b-disabled {
	opacity: 0.25 !important;
	pointer-events: none !important;
}

.b-hidden {
	display: none !important;
}

.b-box {
	background: #eee;
	min-height: 20rem;
}

.b-img {
	width: 100%;
}

[data-resize] .b-img {width: 100%; height: 100%;}
@media screen and (max-width: 960px) {
	.b-img-offset { margin: 0 !important; }
}
/* [data-resize] .b-img .b-img-overlay {background-size: cover !important;} */

.b-img-fallback {
	background: rgba(123,123,123,0.25);
}

.b-icon {
	width: 100rem;
	height: 100rem;
}

@media screen and (max-width: 960px) {
	.b-mobile-hidden {display: none !important;}
}



/* MARGIN OVERWRITES */

h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
	margin-top: 0 !important;
}

p:first-child,
ul:first-child,
ol:first-child,
blockquote:first-child,
hr:first-child,
table:first-child {
	margin-top: 0 !important;
}

p:last-child,
ul:last-child,
ol:last-child,
blockquote:last-child,
hr:last-child,
table:last-child {
	margin-bottom: 0 !important;
}



/* WORDPRESS */

body#tinymce {
	padding: 10rem;
}

.aligncenter {
	margin: 40rem auto;
}

.alignleft {
	float: left;
	margin: 0 20rem 20rem 0;
}

.alignright {
	float: right;
	margin: 0 0 20rem 20rem;
}

.alignnone{
	margin: 40rem auto 40rem 0;
}

@media screen and (max-width: 960px) {
	.aligncenter,
	.alignleft,
	.alignright {float: none; margin: 40rem auto;}
}

/* Custom globals */

.b-pill {
  font-size: 14rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 16rem;
	color: #ffffff;
	background-color: var(--blue);
	border-radius: 5px;
	width: fit-content;
	padding: 10rem 15rem;
}


.alt-no-pfa {
	background-color: var(--blue);
}

span.alt-arrow {
	display: inline-flex;
	gap: 12rem;
}

span.alt-arrow span {
	display: inherit;
	align-items: center;
}

span.alt-arrow span:last-child {
	position: relative;
	transform: translate(-50%, 0);
	opacity: 0;
	transition: transform 0.2s, opacity 0.2s;
}

span.alt-arrow:hover span:last-child {
	position: relative;
	transform: translate(0, 0);
	opacity: 1;
}