/* ==========================================================================
   Footer — about / contact + 3 menu columns · bottom bar
   ========================================================================== */
.cc-footer { background: var(--cc-dark); color: #d6d6d6; font-size: 15px; }
.cc-footer__grid { display: grid; gap: 32px; grid-template-columns: minmax(0, 1fr); padding-block: 48px 40px; }
.cc-footer__title { margin-bottom: 18px; color: var(--cc-white); font-size: 1.2rem; font-weight: 600; }
.cc-footer__about p { margin-bottom: 20px; line-height: 1.7; }
.cc-footer a { color: #d6d6d6; }
.cc-footer a:hover { color: var(--cc-primary); }

.cc-footer__contact, .cc-footer__menu { list-style: none; margin: 0; padding: 0; }
.cc-footer__contact { display: grid; gap: 12px; }
.cc-footer__contact li { display: flex; gap: 10px; align-items: flex-start; color: var(--cc-white); }
.cc-footer__contact a { color: var(--cc-white); word-break: break-word; }
.cc-footer__contact .cc-icon { margin-top: 2px; color: var(--cc-primary); }

.cc-footer__menu { display: grid; gap: 12px; }
/* Hover underline: grows from left to right */
.cc-footer__menu a,
.cc-footer__contact a {
	padding-bottom: 2px;
	background: linear-gradient(currentColor, currentColor) left bottom / 0 1px no-repeat;
	transition: color var(--cc-ease), background-size .35s ease;
}
.cc-footer__menu a:hover,
.cc-footer__menu a:focus-visible,
.cc-footer__contact a:hover,
.cc-footer__contact a:focus-visible { background-size: 100% 1px; }

.cc-footer__bottom { background: var(--cc-light); color: var(--cc-dark); font-size: 16px; }
.cc-footer__bottom-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 24px; padding-block: 14px; text-align: center; }
.cc-footer__bottom p { margin: 0; }
.cc-footer__bottom .cc-payments { max-height: 36px; width: auto; padding: 4px 8px; background: var(--cc-white); border-radius: 4px; }

@media (min-width: 640px) {
	.cc-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cc-footer__about { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
	.cc-footer__grid { grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr)); gap: 40px; padding-block: 64px 48px; }
	.cc-footer__about { grid-column: auto; padding-right: 24px; }
	.cc-footer__bottom-inner { justify-content: space-between; text-align: left; }
}