/* ==========================================================================
   Inline SVG icons — companions for the converted <svg class="fa-svg"> icons.
   Upload to public/css/svg-icons.css and add to your layout <head> AFTER style.css:
   <link rel="stylesheet" href="/css/svg-icons.css">
   (Remaining <i class="fas fa-*"> icons still use Font Awesome CDN as before.)
   ========================================================================== */
.fa-svg {
    width: 1.15em;
    height: 1.15em;
    fill: currentColor;
    vertical-align: -0.18em;
    flex: none;
}
.feature-icon .fa-svg {
    width: 24px;
    height: 24px;
}
.element .fa-svg {
    width: 30px;
    height: 30px;
}
.project-link .fa-svg {
    width: 18px;
    height: 18px;
}
.plan-features .fa-svg {
    width: 1em;
    height: 1em;
}
.faq-question .fa-svg,
.btn .fa-svg {
    width: 1em;
    height: 1em;
}

/* ---------- Thematic floating background chips (service page heroes) ---------- */
.float-chip {
    position: absolute;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .5rem .95rem;
    background: rgba(13, 21, 17, .72);
    border: 1px solid rgba(34, 197, 94, .3);
    border-radius: 999px;
    font-family: 'Space Grotesk', Inter, sans-serif;
    font-size: .8rem;
    letter-spacing: .02em;
    color: #d9f7e6;
    opacity: .92;
    animation: float 7s ease-in-out infinite;
    white-space: nowrap;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    z-index: 1;
    pointer-events: none;
}
.float-chip .fa-svg {
    width: 1em;
    height: 1em;
    color: #22c55e;
    flex: none;
}
.float-chip > i {
    color: #22c55e;
    font-size: .9em;
}
.fc-1 { top: 14%; left: 5%; animation-delay: 0s; }
.fc-2 { top: 24%; right: 6%; animation-delay: 1.4s; }
.fc-3 { top: 58%; left: 2%; animation-delay: 2.6s; }
.fc-4 { bottom: 16%; right: 10%; animation-delay: 3.8s; }
.fc-5 { top: 40%; left: 10%; animation-delay: 5s; }
.fc-6 { bottom: 30%; right: 38%; animation-delay: 6.2s; }
@media (max-width: 768px) {
    .float-chip { font-size: .66rem; padding: .35rem .65rem; opacity: .8; }
    .fc-5, .fc-6 { display: none; }
}
