:root { --bf-bg: #020202; --bf-surface: #0a0a0a; --bf-text: #e5e7eb; --bf-muted: #9ca3af; --bf-border: rgba(255, 255, 255, .08); --bf-accent: #FF7E55; --bf-accent-hover: #ff946f; }

.bf-footer { background: #F9F9FF; padding: 72px 20px 28px; }
.bf-footer a { text-decoration: none; font-size: 14px; transition: color .2s ease; }
.bf-footer a:hover,
.bf-footer a:focus-visible { color: var(--accent); }

.bf-footer-grid { display: grid; margin-inline: auto; grid-template-columns: 1.4fr 1fr 1fr 1fr;  grid-column-gap: 1rem; grid-row-gap: 1rem; grid-auto-columns: 1fr; grid-auto-flow: row; place-content: stretch space-between; place-items: start;  }
.bf-footer-brand .bf-logo svg{ color: var(--primary); max-width: 180px; height: auto; }
.bf-footer-brand .bf-desc { font-size: 14px; line-height: 1.7; color: var(--bf-muted); margin: 16px 0 24px; max-width: 420px; }
.bf-social { display: flex; gap: 14px; margin-bottom: 20px; }
.bf-trust span { font-size: 12px; color: var(--bf-muted); margin-bottom: 20px; display: block; }
.bf-footer-brand hr{ border-color: #dcdcdc20; }

.bf-footer-links .subtitle { color: #6d56ef; letter-spacing: 2px; text-transform: uppercase; font-size: 14px; font-weight: 300; line-height: 1.3em; }
.bf-footer-links .subtitle.small { letter-spacing: 2px; text-transform: uppercase; font-size: 14px; }
.bf-footer-links .footer-list { grid-column-gap: 16px; grid-row-gap: 12px; grid-template-rows: auto auto; grid-template-columns: 1fr; grid-auto-columns: 1fr; padding-bottom: 24px; display: grid; }
.footer-list .footer-items { grid-column-gap: 4px; grid-row-gap: 4px; flex-flow: column; grid-template-rows: auto auto; grid-template-columns: 1fr; grid-auto-columns: 1fr; display: flex; }
.footer-list .footer-items ul { margin: 0; }


.bf-footer-bottom {}
.bf-footer-bottom .container { padding-top: 16px;  border-top: 1px solid var(--bf-border); display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 13px; color: var(--bf-muted); }

@media (max-width: 900px) {
	.bf-footer-grid { grid-template-columns: 1fr 1fr; }
}

@media screen and (max-width:767px) {
	.bf-footer-grid { grid-template-rows: auto; justify-items: start; }
}

@media screen and (max-width:479px) {
	.bf-footer-grid { grid-template-columns: 1fr; grid-row-gap: 30px; grid-template-rows: auto; grid-template-columns: auto; }
}