/* Round-4c — footer review pass (Mike):
   1) Tagline sized up a notch so the brand slogan stands out more.
   2) Social icons row (YouTube + Instagram) in the "Get In Touch" column,
      inline SVG glyphs only — no icon font / external request.
   Loads after ugis-child (style.css) via the round4-*.css glob, so these
   rules win the cascade without needing !important. */

/* 1. Tagline — bumped up from the inherited 1.05rem body size. */
.ugis-footer-tagline {
	font-size: 1.2rem;
	font-weight: 600;
	line-height: 1.3;
}

/* 2. Social icons row */
.ugis-social-icons {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin-top: 0.25rem;
}
.ugis-social-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	border-radius: 50%;
	border: 1px solid var(--ugis-line);
	background: rgba(255, 255, 255, 0.03);
	color: var(--ugis-white);
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
.ugis-social-icon svg {
	width: 20px;
	height: 20px;
	fill: currentColor;
	display: block;
}
.ugis-social-icon:hover,
.ugis-social-icon:focus-visible {
	transform: translateY(-2px);
	border-color: transparent;
	color: #fff !important;
}
.ugis-social-icon--youtube:hover,
.ugis-social-icon--youtube:focus-visible {
	background: var(--ugis-red);
}
.ugis-social-icon--instagram:hover,
.ugis-social-icon--instagram:focus-visible {
	background: var(--ugis-gradient);
}

/* Light-background sections reuse the same footer classes elsewhere; keep the
   icon chips legible there too. */
.ugis-section--offwhite .ugis-social-icon,
.ugis-section--light .ugis-social-icon,
.ugis-section--yellow .ugis-social-icon {
	border-color: var(--ugis-light-line);
	color: var(--ugis-dark-text);
	background: rgba(0, 0, 0, 0.02);
}
