/**
 * UK Title Icons Block Styles
 * 
 * Styles for the UK Title Icons block with H1, H2, H3 titles and icon support
 */

.uk-title-icons {
    padding: 3.75rem 0;
    position: relative;
}

.uk-title-icons-content {
    position: relative;
}

.uk-title-icons h1,
.uk-title-icons h2,
.uk-title-icons h3 {
    position: relative;
    margin-bottom: 0;
}
.uk-title-icons h1{
	color: #002E92;
	/* Alternate Gothic ATF/Desktop/H1 - Child Pages */
	font-size: 86px;
	font-style: normal;
	font-weight: 900;
	line-height: 100%; /* 86px */
	text-transform: uppercase;
}
.uk-title-icons h2{
	color: #002E92;
	/* Alternate Gothic ATF/Desktop/H1 - Child Pages */
	font-size: 60px;
	font-style: normal;
	font-weight: 900;
	line-height: 100%; /* 86px */
	text-transform: uppercase;
}
.uk-title-icons h3{
	color: #002E92;

	/* Alternate Gothic ATF/Desktop/H1 - Child Pages */
	font-size: 40px;
	font-style: normal;
	font-weight: 900;
	line-height: 100%; /* 86px */
	text-transform: uppercase;
}
.uk-title-icons h5{
	color: #1B365D;
	text-align: center;
	font-family: "Usual", sans-serif;
	font-size: 28px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}
/* Icon positioning */
.uk-title-icons h1::before,
.uk-title-icons h2::before,
.uk-title-icons h3::before {
    position: absolute;
}

.uk-title-icons-has-animation h1::before,
.uk-title-icons-has-animation h2::before,
.uk-title-icons-has-animation h3::before {
    animation: iconBounceSlow 3.5s ease-in-out infinite;
}

/* Bounce animation for icons - similar to uk-list-item but slower */
/* Note: This animation works with the inline transform: translateY(-50%) for vertical centering */
@keyframes iconBounceSlow {
    0%, 100% {
        transform: translateY(calc(-50% + 0px));
    }
    50% {
        transform: translateY(calc(-50% - 5px));
    }
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .uk-title-icons {
        padding: 1.5rem 0;
    }
    
    .uk-title-icons h1,
    .uk-title-icons h2,
    .uk-title-icons h3 {
        margin-bottom: 0.75rem;
    }
}
@media (max-width: 480px) {
    .uk-title-icons h1,
    .uk-title-icons h2,
    .uk-title-icons h3 {
        font-size: 40px;
        text-align: left;
    }
}