@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

:root {
    --nfm-ink: #0c1821;
    --nfm-navy: #1b2a41;
    --nfm-charcoal: #324a5f;
    --nfm-cobalt: #14248a;
    --nfm-cobalt-soft: #2436a0;
    --nfm-grape: #4d5382;
    --nfm-peri: #998fc7;
    --nfm-peri-light: #d4c2fc;
    --nfm-ice: #ccc9dc;
    --nfm-logo-ice: #c5d4ea;
    --nfm-mist: #f3f2f8;
    --nfm-text: #e8eaf4;
    --nfm-text-muted: #9aa3b8;
    --nfm-text-dark: #1b2a41;
    --nfm-line: rgba(204,201,220,0.14);
    --nfm-glass: rgba(255,255,255,0.05);
    --nfm-radius: 12px;
    --nfm-radius-sm: 8px;
    --nfm-shadow: 0 20px 48px rgba(12,24,33,0.35);
    --nfm-teal: #14248a;
    --nfm-teal-dark: #0f1c6e;
    --nfm-teal-light: #ccc9dc;
    --nfm-indigo: #14248a;
    --nfm-accent: #998fc7;
}

html { scroll-behavior: smooth; }

body {
    font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
    color: var(--nfm-text-dark);
    background: var(--nfm-ink);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.hero-title, .nfm-heading,
.banner__main__title, .section__title__main, .offer__title {
    font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
    letter-spacing: -0.01em;
    font-weight: 700;
    line-height: 1.28;
}

/* ── Buttons ── */
.ht_btn,
.ht_btn--netformedia,
.nfm-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--nfm-cobalt) !important;
    border: 0 !important;
    color: #fff !important;
    font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    letter-spacing: 0.01em;
    text-transform: none !important;
    border-radius: var(--nfm-radius-sm) !important;
    padding: 13px 24px !important;
    box-shadow: 0 8px 22px rgba(20, 36, 138, 0.28);
    transition: transform 0.2s, box-shadow 0.2s, background 0.2s !important;
}
.ht_btn::before,
.ht_btn--netformedia::before,
.nfm-btn::before {
    display: none !important;
}
.ht_btn:hover,
.ht_btn--netformedia:hover,
.nfm-btn:hover {
    transform: translateY(-1px);
    background: var(--nfm-cobalt-soft) !important;
    color: #fff !important;
    box-shadow: 0 12px 28px rgba(20, 36, 138, 0.36);
}
.nfm-btn--ghost {
    background: transparent !important;
    color: var(--nfm-ice) !important;
    border: 1px solid rgba(204,201,220,0.35) !important;
    box-shadow: none !important;
}
.nfm-btn--ghost:hover { background: rgba(153,143,199,0.16) !important; color: #fff !important; }

/* ── Header ── */
.theme-main-menu {
    background: rgba(12,24,33,0.78) !important;
    border-bottom: 1px solid var(--nfm-line);
    backdrop-filter: blur(18px) saturate(1.15);
    -webkit-backdrop-filter: blur(18px) saturate(1.15);
}
.sticky-menu.theme-main-menu {
    background: rgba(243,242,248,0.96) !important;
    border-bottom: 1px solid rgba(27,42,65,0.08);
    box-shadow: 0 8px 30px rgba(12,24,33,0.08);
}

/* ── Footer ── */
.footer-area .footer__wrapper__one {
    background: radial-gradient(1100px 380px at 18% -8%, rgba(20,36,138,0.35), transparent 52%),
                linear-gradient(180deg, #0c1821 0%, #1b2a41 100%) !important;
}
.footer-area .devider__line { border-color: var(--nfm-line) !important; }

/* ── 3D tilt cards ── */
.nfm-scene { perspective: 1200px; }
.nfm-tilt {
    position: relative;
    transform-style: preserve-3d;
    transform: rotateX(0) rotateY(0) translateZ(0);
    transition: transform 0.18s ease-out, box-shadow 0.18s ease-out, border-color 0.18s;
    will-change: transform;
    overflow: hidden;
}
.nfm-tilt::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 0%), rgba(212,194,252,0.18), transparent 42%);
    opacity: 0;
    transition: opacity 0.2s;
}
.nfm-tilt:hover::after { opacity: 1; }

.nfm-glass {
    background: linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.02));
    border: 1px solid rgba(204,201,220,0.12);
    border-radius: var(--nfm-radius);
    box-shadow: var(--nfm-shadow), inset 0 1px 0 rgba(255,255,255,0.08);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}
.nfm-glass-light {
    background: #fff;
    border: 1px solid rgba(27,42,65,0.07);
    border-radius: var(--nfm-radius);
    box-shadow: 0 16px 40px rgba(12,24,33,0.07);
}

.nfm-icon {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(145deg, rgba(20,36,138,0.18), rgba(153,143,199,0.12));
    color: var(--nfm-cobalt);
    font-size: 1.35rem;
    transform: translateZ(28px);
}
.nfm-dark .nfm-icon { color: var(--nfm-peri-light); }

/* ── Hero ── */
.hero-section {
    position: relative;
    overflow: hidden;
    background: var(--nfm-ink);
    min-height: calc(100dvh - var(--nfm-nav-h, 76px));
    display: flex;
    flex-direction: column;
    justify-content: center;
    isolation: isolate;
}
.hero-scene {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}
.hero-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(40px);
    opacity: 0.7;
    animation: nfm-float 12s ease-in-out infinite;
}
.hero-orb--a {
    width: 42vw; height: 42vw; max-width: 520px; max-height: 520px;
    top: -12%; left: -8%;
    background: radial-gradient(circle, rgba(20,36,138,0.55), transparent 68%);
}
.hero-orb--b {
    width: 36vw; height: 36vw; max-width: 440px; max-height: 440px;
    top: 10%; right: -10%;
    background: radial-gradient(circle, rgba(153,143,199,0.4), transparent 68%);
    animation-delay: -4s;
}
.hero-orb--c {
    width: 28vw; height: 28vw; max-width: 320px; max-height: 320px;
    bottom: 8%; left: 35%;
    background: radial-gradient(circle, rgba(27,42,65,0.7), transparent 68%);
    animation-delay: -7s;
}
.hero-grid-3d {
    position: absolute;
    left: -15%;
    right: -15%;
    bottom: -18%;
    height: 58%;
    background-image:
        linear-gradient(rgba(153,143,199,0.18) 1px, transparent 1px),
        linear-gradient(90deg, rgba(153,143,199,0.18) 1px, transparent 1px);
    background-size: 72px 72px;
    transform: perspective(720px) rotateX(64deg);
    transform-origin: center bottom;
    mask-image: linear-gradient(to top, rgba(0,0,0,0.85), transparent 78%);
    -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,0.85), transparent 78%);
}
.hero-spotlight {
    position: absolute;
    inset: 0;
    background: radial-gradient(600px circle at var(--sx, 50%) var(--sy, 30%), rgba(153,143,199,0.16), transparent 42%);
    transition: background 0.08s linear;
}
.hero-noise {
    position: absolute;
    inset: 0;
    opacity: 0.04;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.hero-divider {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 1px;
    z-index: 3;
    background: linear-gradient(90deg, transparent, #998fc7 22%, #ccc9dc 50%, #14248a 78%, transparent);
}
.hero-inner { position: relative; z-index: 2; width: 100%; }
.hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--nfm-ice);
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 22px;
}
.hero-title {
    color: #fff;
    font-size: clamp(2.05rem, 4.6vw, 3.45rem);
    line-height: 1.22;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin-bottom: 22px;
}
.hero-title span { color: var(--nfm-logo-ice); }
.hero-lead {
    color: var(--nfm-ice);
    font-size: 1.08rem;
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto 28px;
}
.hero-chips { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 36px; }
.hero-chip {
    color: var(--nfm-ice);
    border: 1px solid rgba(204,201,220,0.28);
    background: rgba(255,255,255,0.05);
    padding: 8px 14px;
    border-radius: var(--nfm-radius-sm);
    font-size: 0.88rem;
    backdrop-filter: blur(8px);
}

@keyframes nfm-float {
    0%, 100% { transform: translate3d(0,0,0) scale(1); }
    50% { transform: translate3d(18px, -22px, 0) scale(1.06); }
}

/* ── Sections ── */
.nfm-dark {
    background:
        radial-gradient(900px 300px at 80% 0%, rgba(20,36,138,0.28), transparent 50%),
        linear-gradient(180deg, #0c1821 0%, #1b2a41 100%);
    color: var(--nfm-text);
}
.nfm-light { background: var(--nfm-mist); }
.nfm-section { position: relative; padding: 100px 0; }
@media (max-width: 991px) { .nfm-section { padding: 72px 0; } }

.nfm-kicker {
    color: var(--nfm-cobalt);
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 10px;
}
.nfm-dark .nfm-kicker,
.nfm-contact .nfm-kicker { color: var(--nfm-peri-light); }
.nfm-heading {
    font-size: clamp(1.65rem, 2.4vw, 2.2rem);
    font-weight: 700;
    line-height: 1.28;
    letter-spacing: -0.015em;
    color: var(--nfm-text-dark);
    margin-bottom: 12px;
}
.nfm-dark .nfm-heading,
.nfm-contact .nfm-heading { color: #fff; }
.nfm-sub {
    color: var(--nfm-charcoal);
    max-width: 640px;
    margin: 0 auto;
    line-height: 1.7;
}
.nfm-dark .nfm-sub,
.nfm-contact .nfm-sub { color: var(--nfm-ice); }

.nfm-link { color: var(--nfm-cobalt); font-weight: 700; }
.nfm-dark .nfm-link { color: var(--nfm-peri-light); }

/* Home service cards override */
.nfm-service.single__offer__box {
    height: 100%;
    padding: 28px 24px !important;
    border-radius: var(--nfm-radius) !important;
    border: 1px solid rgba(27,42,65,0.07) !important;
    background: #fff !important;
    box-shadow: 0 10px 34px rgba(12,24,33,0.06);
}
.nfm-service.single__offer__box:hover {
    box-shadow: 0 22px 50px rgba(12,24,33,0.12);
}
.nfm-service .offer__title a { color: var(--nfm-text-dark) !important; }
.partner-sticker {
    width: 68px;
    height: 68px;
    border-radius: 10px;
    background: linear-gradient(145deg, #d4c2fc, #ccc9dc);
    color: #14248a;
    font-size: 0.58rem;
    font-weight: 800;
    line-height: 1.15;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 18px rgba(20,36,138,0.16);
    transform: translateZ(24px);
}

.nfm-solution {
    height: 100%;
    display: flex;
    flex-direction: column;
    border-radius: var(--nfm-radius);
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(27,42,65,0.07);
    box-shadow: 0 14px 40px rgba(12,24,33,0.07);
}
.nfm-solution__top {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
    background: linear-gradient(135deg, #0c1821, #1b2a41);
    color: #fff;
}
.nfm-solution__top.is-featured {
    background: linear-gradient(135deg, #14248a, #4d5382);
}
.nfm-solution__logo {
    width: 46px; height: 46px;
    border-radius: 10px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}
.nfm-solution__logo.is-dark { background: #414f93; }
.nfm-solution__body { padding: 22px 22px 24px; flex: 1; background: #fff; }

.nfm-frame {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 14px 36px rgba(12,24,33,0.12);
    transform: none !important;
    perspective: none;
    border: 1px solid rgba(27,42,65,0.08);
}
.nfm-frame iframe,
.nfm-frame img {
    display: block;
    width: 100%;
    transform: none !important;
}
.nfm-dark .nfm-frame { border-color: rgba(204,201,220,0.12); }

.nfm-contact {
    background:
        radial-gradient(800px 280px at 50% 0%, rgba(20,36,138,0.35), transparent 55%),
        #0c1821;
}

/* ── Inner pages: same system as homepage ── */
body { background: var(--nfm-mist); }

.hero-section--page {
    min-height: 0;
    padding: 128px 0 72px;
    justify-content: center;
}
@media (max-width: 991px) {
    .hero-section--page { padding: 112px 0 56px; }
}
.hero-section--page .hero-title {
    font-size: clamp(1.85rem, 4vw, 3rem);
}
.hero-section--page .hero-lead {
    margin-left: 0;
    margin-right: 0;
}
.hero-section--page .hero-lead.is-center {
    margin-left: auto;
    margin-right: auto;
}

.section__sub__title {
    color: var(--nfm-cobalt) !important;
    font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    margin-bottom: 10px !important;
}
.nfm-dark .section__sub__title,
.nfm-contact .section__sub__title,
.contact-area .section__sub__title,
.hero-section .section__sub__title {
    color: var(--nfm-peri-light) !important;
}
.section__title__main {
    color: var(--nfm-text-dark) !important;
    font-size: clamp(1.65rem, 2.4vw, 2.2rem) !important;
    line-height: 1.28 !important;
}
.nfm-dark .section__title__main,
.nfm-contact .section__title__main,
.contact-area .section__title__main {
    color: #fff !important;
}
.banner__description,
.hero-section .banner__description {
    color: var(--nfm-ice) !important;
    font-size: 1.08rem;
    line-height: 1.7;
}
.banner__main__title { color: #fff !important; }
.banner__main__title span { color: var(--nfm-logo-ice) !important; }

.ht_btn.nfm-btn--ghost {
    background: transparent !important;
    color: var(--nfm-ice) !important;
    border: 1px solid rgba(204,201,220,0.35) !important;
    box-shadow: none !important;
}
.ht_btn.nfm-btn--ghost:hover {
    background: rgba(153,143,199,0.16) !important;
    color: #fff !important;
}
.ht_btn.nfm-btn--outline {
    background: transparent !important;
    color: var(--nfm-cobalt) !important;
    border: 1px solid var(--nfm-cobalt) !important;
    box-shadow: none !important;
}
.ht_btn.nfm-btn--outline:hover {
    background: var(--nfm-cobalt) !important;
    color: #fff !important;
}
.ht_btn.nfm-btn--on-dark {
    background: #fff !important;
    color: var(--nfm-cobalt) !important;
    box-shadow: none !important;
}
.ht_btn.nfm-btn--on-dark:hover {
    background: var(--nfm-mist) !important;
    color: var(--nfm-cobalt) !important;
}

.contact-area,
section.contact-area {
    background:
        radial-gradient(800px 280px at 50% 0%, rgba(20,36,138,0.35), transparent 55%),
        #0c1821 !important;
}
.contact-form-wrapper {
    background: #fff !important;
    border: 1px solid rgba(27,42,65,0.07) !important;
    border-radius: var(--nfm-radius) !important;
    box-shadow: 0 16px 40px rgba(12,24,33,0.07) !important;
}

.single__offer__box {
    height: 100%;
    padding: 28px 24px !important;
    border-radius: var(--nfm-radius) !important;
    border: 1px solid rgba(27,42,65,0.07) !important;
    background: #fff !important;
    box-shadow: 0 10px 34px rgba(12,24,33,0.06);
}
.single__offer__box:hover {
    box-shadow: 0 22px 50px rgba(12,24,33,0.12) !important;
}

.offer__section,
.feature__section,
.choose__section {
    background-image: none !important;
    background-color: var(--nfm-mist) !important;
}

.nfm-card {
    background: #fff;
    border: 1px solid rgba(27,42,65,0.07);
    border-radius: var(--nfm-radius);
    box-shadow: 0 16px 40px rgba(12,24,33,0.07);
}
.nfm-legal {
    background: var(--nfm-mist);
    min-height: 60vh;
}
.nfm-legal a { color: var(--nfm-cobalt); }
.nfm-legal h2, .nfm-legal h3, .nfm-legal h4, .nfm-legal h5 {
    color: var(--nfm-text-dark);
}

.compare-table { width: 100%; border-collapse: separate; border-spacing: 0; overflow: hidden; border-radius: 12px; }
.compare-table th, .compare-table td { padding: 14px 16px; border-bottom: 1px solid rgba(27,42,65,0.08); vertical-align: top; }
.compare-table thead th { background: #0c1821; color: #fff; font-weight: 600; }
.compare-table tbody tr:last-child td { border-bottom: none; }
.compare-table tbody td:last-child { background: var(--nfm-mist); font-weight: 500; color: var(--nfm-text-dark); }

.stand-card {
    height: 100%;
    background: #fff;
    border: 1px solid rgba(27,42,65,0.07);
    border-radius: var(--nfm-radius);
    padding: 24px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 10px 34px rgba(12,24,33,0.06);
}
.stand-card.featured {
    border-color: var(--nfm-cobalt);
    box-shadow: 0 8px 28px rgba(20,36,138,0.15);
}

.badge-brand, .badge-brand-outline, .badge-indigo {
    border-radius: 8px !important;
}

.text-primary { color: var(--nfm-cobalt) !important; }

#particles-js-container { display: none !important; }

@media (prefers-reduced-motion: reduce) {
    .hero-orb, .nfm-tilt, .nfm-frame { animation: none !important; transform: none !important; }
}