/* .............................................................................
HELPERS et AUTRES STYLES
............................................................................. */

/* Drop shadow */
.hShadow {filter: drop-shadow(0 1rem 1.3rem rgb(0 0 0 / 35%));}
.hShadowLight {filter: drop-shadow(0 1rem 1.3rem rgb(0 0 0 / 15%));}


/* Uppercase / lowercase */
.tLower {text-transform: none;}
.tUpper {text-transform: uppercase;}


/* Content alignment */
.tCentered {text-align:center;}
.tLeft {text-align:left;}
.tRight {text-align:right;}


/* Colors */
.cOrange,
.onDark .cOrange {color: var(--color-orange); }
.cGreen,
.onDark .cGreen {color: var(--color-green); }


/* Sizes */
.tSmall {font-size: 0.9em; }
.tBig {font-size: 1.35002em; }


/* Width restrictions */
.tRestrict {max-width: 27.002em;}


/* Text columns */
.tCols2 {columns: 20em 2; column-gap: 10%; }
.tCols2 > * {break-inside: avoid;}
.tCols2 li {display: inline-block; }

.tCols3 {columns: 20em 3; column-gap: 8%; }
.tCols3 > * {break-inside: avoid;}
.tCols3 li {display: inline-block; }


/* Helpers */
.demoIcon .svgIcon {font-size: 3em; margin-top: 0;}
.demoLogos .svgIcon {font-size: 3em; margin-right: 0.5em; margin-top: 0;}
.noWrap {white-space: nowrap;}
.hideText {text-indent: 100%; white-space: nowrap; overflow: hidden; }
.screenReaderText {display:none;}
.softHide {display: none;} /* Difference between hide and softHide: hide has important, softHide doesn't */
.hidden {display: none !important; visibility: hidden;}
.visuallyHidden {border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}
.visuallyHidden.focusable:active,
.visuallyHidden.focusable:focus {clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto;}
.invisible {visibility: hidden;}
[hidden] {display: none;}