/* ============================================================
   GLOBAL LINK RESET — remove default browser underline site-wide
============================================================ */
a {
    text-decoration: none;
}
a:hover,
a:focus,
a:active {
    text-decoration: none;
}

:root {
        --ns-white: #ffffff;
        --ns-off: #f6f8fb;
        --ns-glass-bg: rgba(255, 255, 255, 0.10);
        --ns-glass-border: rgba(255, 255, 255, 0.22);
        --ns-glass-bg-light: rgba(255, 255, 255, 0.65);
        --ns-glass-border-light: rgba(27, 54, 93, 0.12);
        --ns-shadow-navy: 0 20px 45px rgba(27, 54, 93, 0.14);
        --ns-ease: cubic-bezier(0.22, 1, 0.36, 1);
    }

    /* ============================================================
       UNIFIED SCROLL REVEAL ANIMATION SYSTEM
       Applies ultra-smooth fade-up/in transitions to all reveal elements
    ============================================================ */
    :root {
        --ns-ease-reveal: cubic-bezier(0.16, 1, 0.3, 1);
    }

    [data-reveal],
    .ns-reveal,
    .home-reveal,
    .about-reveal,
    .pf-reveal,
    .svc-reveal,
    .blog-reveal,
    .team-reveal,
    .contact-reveal,
    .svd-reveal,
    .art-reveal,
    .reveal-on-scroll {
        opacity: 0;
        transform: translateY(42px);
        transition: opacity 0.85s var(--ns-ease-reveal), transform 0.85s var(--ns-ease-reveal);
        transition-delay: var(--reveal-delay, 0s);
        will-change: opacity, transform;
    }

    [data-reveal="left"],
    .ns-reveal-left {
        opacity: 0;
        transform: translateX(-45px);
        transition: opacity 0.85s var(--ns-ease-reveal), transform 0.85s var(--ns-ease-reveal);
        transition-delay: var(--reveal-delay, 0s);
        will-change: opacity, transform;
    }

    [data-reveal="right"],
    .ns-reveal-right {
        opacity: 0;
        transform: translateX(45px);
        transition: opacity 0.85s var(--ns-ease-reveal), transform 0.85s var(--ns-ease-reveal);
        transition-delay: var(--reveal-delay, 0s);
        will-change: opacity, transform;
    }

    [data-reveal="scale"],
    [data-reveal="zoom"],
    .ns-reveal-scale {
        opacity: 0;
        transform: scale(0.90);
        transition: opacity 0.85s var(--ns-ease-reveal), transform 0.85s var(--ns-ease-reveal);
        transition-delay: var(--reveal-delay, 0s);
        will-change: opacity, transform;
    }

    [data-reveal="fade"],
    .ns-reveal-fade {
        opacity: 0;
        transform: none;
        transition: opacity 0.85s var(--ns-ease-reveal);
        transition-delay: var(--reveal-delay, 0s);
        will-change: opacity;
    }

    /* Active In-View State */
    [data-reveal].is-inview,
    .ns-reveal.is-inview,
    .home-reveal.is-inview,
    .about-reveal.is-inview,
    .pf-reveal.is-inview,
    .svc-reveal.is-inview,
    .blog-reveal.is-inview,
    .team-reveal.is-inview,
    .contact-reveal.is-inview,
    .svd-reveal.is-inview,
    .art-reveal.is-inview,
    .reveal-on-scroll.is-inview,
    [data-reveal="left"].is-inview,
    [data-reveal="right"].is-inview,
    [data-reveal="scale"].is-inview,
    [data-reveal="zoom"].is-inview,
    [data-reveal="fade"].is-inview,
    .ns-reveal-left.is-inview,
    .ns-reveal-right.is-inview,
    .ns-reveal-scale.is-inview,
    .ns-reveal-fade.is-inview {
        opacity: 1;
        transform: translate(0, 0) scale(1);
    }

    .ns-delay-1 { --reveal-delay: 0.1s; }
    .ns-delay-2 { --reveal-delay: 0.2s; }
    .ns-delay-3 { --reveal-delay: 0.3s; }
    .ns-delay-4 { --reveal-delay: 0.4s; }
    .ns-delay-5 { --reveal-delay: 0.5s; }

    @media (prefers-reduced-motion: reduce) {
        [data-reveal],
        .ns-reveal,
        .home-reveal,
        .about-reveal,
        .pf-reveal,
        .svc-reveal,
        .blog-reveal,
        .team-reveal,
        .contact-reveal,
        .svd-reveal,
        .art-reveal,
        .reveal-on-scroll,
        .ns-reveal-left,
        .ns-reveal-right,
        .ns-reveal-scale,
        .ns-reveal-fade {
            opacity: 1 !important;
            transform: none !important;
            transition: none !important;
        }
    }

    /* ============================================================
       FAQ ACCORDION — used on every page's FAQ section
    ============================================================ */
    .home-faq { background: var(--ns-white); }
    .home-faq-kicker { color: var(--ns-orange, #f58220); font-weight: 700; font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; }
    .home-faq-title { font-size: clamp(1.7rem, 3vw, 2.3rem); font-weight: 800; color: var(--ns-navy, #1b365d); }
    .home-faq-sub { color: #6b7480; font-size: 0.98rem; }
    .home-faq-item { border: 1px solid rgba(27,54,93,0.1); border-radius: 14px !important; overflow: hidden; margin-bottom: 0.9rem; }
    .home-faq-button {
        font-weight: 700; color: var(--ns-navy, #1b365d); font-size: 0.98rem; padding: 1.1rem 1.4rem;
        background: #fff; box-shadow: none !important;
    }
    .home-faq-button:not(.collapsed) { color: var(--ns-orange, #f58220); background: #fff8f2; }
    .home-faq-button::after { filter: none; }
    .home-faq-body { color: #4a5361; font-size: 0.92rem; line-height: 1.7; padding: 0 1.4rem 1.3rem; }

    /* ============================================================
       MAP / LOCATION CARD — used on home, about, contact
    ============================================================ */
    .home-map-section { position: relative; }
    .home-map-stage { position: relative; min-height: 560px; }
    .home-map-iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(0.15) contrast(1.05); }
    .home-map-card-shell { position: absolute; inset: 0; display: flex; align-items: center; pointer-events: none; }
    .home-map-card-align { display: flex; align-items: center; height: 100%; pointer-events: none; }
    .home-map-card {
        position: relative; pointer-events: auto; max-width: 480px; background: var(--ns-glass-bg-light);
        border: 1px solid var(--ns-glass-border-light); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
        border-radius: 20px; padding: 2.2rem; box-shadow: 0 24px 55px rgba(15,25,40,0.22); overflow: hidden;
    }
    .home-map-card-accent { position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--ns-orange, #f58220); }
    .home-map-card-kicker { color: var(--ns-orange, #f58220); font-weight: 700; font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; }
    .home-map-card-title { font-size: clamp(1.25rem, 2.2vw, 1.55rem); font-weight: 800; color: var(--ns-navy, #1b365d); line-height: 1.3; margin-bottom: 0.9rem; }
    .home-map-card-text { font-size: 0.9rem; line-height: 1.65; color: #4a5361; }
    .home-map-card-meta { font-size: 0.84rem; color: #5c6673; display: flex; flex-direction: column; gap: 0.45rem; }
    .home-map-card-meta i { color: var(--ns-orange, #f58220); }
    .home-map-card-cta {
        display: inline-flex; align-items: center; gap: 0.4rem; color: #fff; background: var(--ns-navy, #1b365d);
        font-weight: 700; font-size: 0.86rem; padding: 0.65rem 1.3rem; border-radius: 8px; text-decoration: none;
        transition: background 0.3s var(--ns-ease), transform 0.3s var(--ns-ease);
    }
    .home-map-card-cta:hover { background: var(--ns-orange, #f58220); transform: translateY(-3px); color: #fff; }

    @media (max-width: 767.98px) {
        .home-map-stage { min-height: 620px; }
        .home-map-card { max-width: 100%; margin: 1.2rem; padding: 1.6rem; }
    }

    /* ============================================================
       GENERIC GLASS COUNTER CARD — reusable "creative counters" look
    ============================================================ */
    .ns-counter-band { position: relative; overflow: hidden; background: linear-gradient(135deg, var(--ns-navy, #1b365d) 0%, #0d1e34 100%); }
    .ns-counter-band-bg {
        position: absolute; inset: 0; pointer-events: none;
        background-image: radial-gradient(rgba(255,255,255,0.09) 1px, transparent 1px);
        background-size: 26px 26px; opacity: 0.6;
    }
    .ns-counter-kicker { color: var(--ns-orange, #f58220); font-weight: 700; font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; }
    .ns-counter-title { color: #fff; font-size: clamp(1.5rem, 2.6vw, 2rem); font-weight: 800; }
    .ns-counter-card {
        position: relative; z-index: 1; text-align: center; background: var(--ns-glass-bg); border: 1px solid var(--ns-glass-border);
        backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius: 16px; padding: 1.8rem 1.1rem;
        transition: transform 0.35s var(--ns-ease), background 0.35s var(--ns-ease);
    }
    .ns-counter-card:hover { transform: translateY(-6px); background: rgba(245,130,32,0.16); }
    .ns-counter-icon {
        display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%;
        background: rgba(245,130,32,0.22); color: var(--ns-orange, #f58220); font-size: 1.25rem; margin-bottom: 0.85rem;
    }
    .ns-counter-num {
        font-size: clamp(1.7rem, 3vw, 2.1rem); font-weight: 800; line-height: 1;
        background: linear-gradient(90deg, #ffffff 0%, #ffd9b0 100%); -webkit-background-clip: text; background-clip: text; color: transparent;
    }
    .ns-counter-label { color: rgba(255,255,255,0.78); font-size: 0.84rem; font-weight: 600; margin-top: 0.4rem; }

    /* ============================================================
       MID-PAGE CONTACT BANNER — used on services & team pages
    ============================================================ */
    .ns-contact-banner {
        position: relative; overflow: hidden; border-radius: 20px; padding: clamp(1.75rem, 3.5vw, 2.75rem);
        background: linear-gradient(120deg, var(--ns-orange, #f58220) 0%, #c9600f 100%); box-shadow: 0 18px 40px rgba(245,130,32,0.22);
    }
    .ns-contact-banner-bg {
        position: absolute; inset: 0; opacity: 0.5; pointer-events: none;
        background-image: radial-gradient(rgba(255,255,255,0.16) 1.5px, transparent 1.5px); background-size: 20px 20px;
    }
    .ns-contact-kicker { color: rgba(255,255,255,0.85); font-weight: 700; font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; }
    .ns-contact-title { color: #fff; font-size: clamp(1.25rem, 2.2vw, 1.6rem); font-weight: 800; }
    .ns-contact-text { color: rgba(255,255,255,0.9); font-size: 0.95rem; line-height: 1.6; max-width: 50ch; }
    .ns-contact-btn {
        display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 0.88rem;
        padding: 0.7rem 1.3rem; border-radius: 8px; text-decoration: none; transition: transform 0.3s var(--ns-ease), box-shadow 0.3s var(--ns-ease);
    }
    .ns-contact-btn--primary { background: var(--ns-navy, #1b365d); color: #fff; }
    .ns-contact-btn--primary:hover { transform: translateY(-3px); box-shadow: 0 14px 26px rgba(27,54,93,0.35); color: #fff; }
    .ns-contact-btn--ghost { background: rgba(255,255,255,0.16); border: 1px solid rgba(255,255,255,0.4); color: #fff; }
    .ns-contact-btn--ghost:hover { background: #fff; color: var(--ns-orange, #f58220); transform: translateY(-3px); }