/* ══════════════════════════════════════════════════════════════
   Baby Vibe's™  |  footer.css
   Footer layout · road animation · cars · social · security
   ══════════════════════════════════════════════════════════════ */

/* ── Footer Base ───────────────────────────────────────────── */
.bv-footer { position: relative; background: #0d1628; overflow: hidden; }
.bv-footer::before { display: none; }

/* ── Glow Orbs ─────────────────────────────────────────────── */
.f-orb { position: absolute; border-radius: 50%; filter: blur(80px); pointer-events: none; z-index: 0; }
.f-orb-1 { width: 340px; height: 340px; background: var(--bv-rose); opacity: .045; top: 80px; left: -80px; }
.f-orb-2 { width: 280px; height: 280px; background: #4a9eff; opacity: .04; bottom: 40px; right: -60px; }
.bv-footer .container-xl { position: relative; z-index: 1; }

/* ── Text ──────────────────────────────────────────────────── */
.f-tagline { color: rgba(255,255,255,.45); font-size: .83rem; line-height: 1.75; margin-bottom: 0; }
.f-brand-name { font-size: 1.6rem; font-weight: 900; color: #fff; margin-bottom: .75rem; }

/* ── Column Title ──────────────────────────────────────────── */
.f-title { font-size: .7rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase; color: var(--bv-rose); position: relative; padding-bottom: .6rem; }
.f-title::after { content: ''; position: absolute; bottom: 0; left: 0; width: 28px; height: 2px; background: var(--bv-rose); border-radius: 2px; }

/* ── Footer Links ──────────────────────────────────────────── */
.f-links { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .45rem; }
.f-links li a { display: flex; align-items: center; gap: .55rem; color: rgba(255,255,255,.45); font-size: .83rem; text-decoration: none; transition: color .2s, gap .2s; }
.f-links li a:hover { color: var(--bv-rose); gap: .8rem; }
.f-links li a i { font-size: .75rem; width: 14px; flex-shrink: 0; color: rgba(255,255,255,.25); transition: color .2s; }
.f-links li a:hover i { color: var(--bv-rose); }
.f-links li a.active, .f-links li a.active i { color: #f43f5e !important; }

/* ── Social Buttons ────────────────────────────────────────── */
.fsoc { width: 36px; height: 36px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; font-size: .85rem; text-decoration: none; transition: transform .25s; border: 1px solid rgba(255,255,255,.1); color: #fff; }
.fsoc:hover { transform: translateY(-3px); }
.sb-fb  { background: #1877f2; }
.sb-ig  { background: linear-gradient(135deg,#f58529,#dd2a7b,#8134af); }
.sb-yt  { background: #ff0000; }
.sb-wa  { background: #25d366; }
.sb-map { background: #9c8d05; }

/* ── Highlight Badges ──────────────────────────────────────── */
.f-highlight-row { display: flex; gap: .5rem; flex-wrap: wrap; }
.f-hl-badge { display: inline-flex; align-items: center; gap: .4rem; background: rgba(224,90,122,.1); border: 1px solid rgba(224,90,122,.22); color: var(--bv-rose); font-size: .73rem; font-weight: 700; padding: .32rem .7rem; border-radius: 50px; transition: background .25s, transform .2s; }
.f-hl-badge:hover { background: rgba(224,90,122,.2); transform: translateY(-2px); }
.f-hl-badge i { font-size: .82rem; }

/* ── Divider & Bottom ──────────────────────────────────────── */
.f-divider { height: 1px; background: linear-gradient(90deg,transparent,rgba(224,90,122,.35),rgba(74,158,255,.2),transparent); margin: 1.5rem 0 .75rem; }
.footer-bottom { border-top: none; }
.fcopy { color: rgba(255,255,255,.3); font-size: .78rem; }
.f-policy-links a { color: rgba(255,255,255,.3); font-size: .73rem; text-decoration: none; transition: color .2s; }
.f-policy-links a:hover { color: var(--bv-rose); }

/* ══════════════════════════════════════════════════════════════
   ANIMATED ROAD STRIP
   ══════════════════════════════════════════════════════════════ */
.f-road-anim { position: relative; height: 70px; overflow: hidden; background: #080f1e; border-bottom: 2px solid rgba(255,255,255,.05); }
.f-road-anim::before { content: ''; position: absolute; top: 50%; left: 0; right: 0; height: 2px; background: repeating-linear-gradient(90deg,rgba(255,255,255,.18) 0px,rgba(255,255,255,.18) 24px,transparent 24px,transparent 52px); transform: translateY(-50%); animation: roadMove 1s linear infinite; }
.f-road-anim::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px; background: rgba(224,90,122,.25); }
@keyframes roadMove { from { background-position: 0 0; } to { background-position: 52px 0; } }

.f-car { position: absolute; top: 50%; transform: translateY(-58%); animation: carDrive linear infinite; }
.f-car-1 { animation-duration: 14s; animation-delay:   0s; }
.f-car-2 { animation-duration: 18s; animation-delay:  -5s; }
.f-car-3 { animation-duration: 11s; animation-delay:  -8s; }
.f-car-4 { animation-duration: 16s; animation-delay: -11s; }
.f-car-5 { animation-duration:  9s; animation-delay:  -3s; }
.f-car-6 { animation-duration: 13s; animation-delay:  -6s; }
.f-car-7 { animation-duration: 15s; animation-delay:  -9s; }
@keyframes carDrive { 0% { left: -160px; } 100% { left: calc(100% + 200px); } }

/* ══════════════════════════════════════════════════════════════
   SECURITY / PRINT
   ══════════════════════════════════════════════════════════════ */
* { -webkit-user-select: none !important; -moz-user-select: none !important; -ms-user-select: none !important; user-select: none !important; -webkit-touch-callout: none !important; }
img { pointer-events: none !important; -webkit-user-drag: none !important; -khtml-user-drag: none !important; -moz-user-drag: none !important; user-drag: none !important; }
@media print { body { display: none !important; } }

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width: 768px) {
    .f-road-anim { height: 52px; }
    .f-car-3, .f-car-5, .f-car-7 { display: none; }
}
