/**
 * Negri Firman — High contrast (rebuild)
 *
 * Rules of thumb:
 * 1. Page canvas = black, text = white
 * 2. Elementor structure stays TRANSPARENT (opaque black on .elementor-element
 *    breaks Contatti circle overlaps and paints over media)
 * 3. Never force opacity:1 on decorative elements (e.g. .workflow__number)
 * 4. Reveal Elementor/GSAP “invisible” content without touching intentional hides
 */

html.nf-a11y-contrast {
  color-scheme: dark;
}

/* -------------------------------------------------------------------------- */
/* Canvas                                                                     */
/* -------------------------------------------------------------------------- */
html.nf-a11y-contrast body,
html.nf-a11y-contrast #smooth-wrapper,
html.nf-a11y-contrast #smooth-content,
html.nf-a11y-contrast .footer__area-5,
html.nf-a11y-contrast .nf-legal-footer,
html.nf-a11y-contrast .brand__area,
html.nf-a11y-contrast .client__area,
html.nf-a11y-contrast .portfolio__area,
html.nf-a11y-contrast .blog__area,
html.nf-a11y-contrast .service__area-7,
html.nf-a11y-contrast .workflow__area,
html.nf-a11y-contrast .about__area,
html.nf-a11y-contrast .team__area,
html.nf-a11y-contrast .testimonial__area,
html.nf-a11y-contrast .counter__area,
html.nf-a11y-contrast .faq__area {
  background-color: #000 !important;
  color: #fff !important;
}

/* Structure: transparent so overlaps/media stay visible over black canvas */
html.nf-a11y-contrast #smooth-content :is(
  .e-con,
  .e-con-inner,
  .elementor-element,
  .elementor-section,
  .elementor-column,
  .elementor-widget-wrap,
  .elementor-container,
  .elementor-widget-container
) {
  background-color: transparent !important;
  color: #fff !important;
}

/* Kill light Elementor CSS-variable fills without painting opaque slabs */
html.nf-a11y-contrast #smooth-content .e-con,
html.nf-a11y-contrast #smooth-content .elementor-element {
  --background-color: transparent !important;
  --e-con-bg: transparent !important;
}

/* -------------------------------------------------------------------------- */
/* Typography & links                                                         */
/* -------------------------------------------------------------------------- */
html.nf-a11y-contrast :is(
  h1, h2, h3, h4, h5, h6,
  p, li, label, td, th, figcaption,
  .elementor-heading-title,
  .elementor-button-text,
  .menu-text,
  .sec-title,
  .sec-sub-title,
  .sec-title-3,
  .service__title-7,
  .service__title-7 span,
  .workflow__title,
  .portfolio__title-5,
  .hero10__content,
  .nf-clients-title-line
) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html.nf-a11y-contrast #smooth-content :is(p, span, li, a) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html.nf-a11y-contrast a:not(.nf-a11y a):not(.nf-a11y__statement),
html.nf-a11y-contrast button:not(.nf-a11y button):not(.nf-a11y__action):not(.nf-a11y__close):not(.nf-a11y__toggle):not(.scroll-top):not(#scroll_top) {
  color: #fff !important;
}

html.nf-a11y-contrast .elementor-heading-title {
  -webkit-text-stroke-color: #fff !important;
}

html.nf-a11y-contrast .nf-skip-link {
  background: #fff !important;
  color: #000 !important;
}

html.nf-a11y-contrast :is(.modal__close-2, .search__close, .offcanvas__close) {
  color: #fff !important;
  border-color: #fff !important;
  background: transparent !important;
  opacity: 1 !important;
}

/* -------------------------------------------------------------------------- */
/* Buttons & forms                                                            */
/* -------------------------------------------------------------------------- */
html.nf-a11y-contrast :is(
  .elementor-button,
  a.elementor-button,
  .wc-btn-primary,
  .wc-btn-black,
  .wc-btn-light,
  .wc-btn-secondary,
  .wc-btn-pink
) {
  background-color: #000 !important;
  background-image: none !important;
  color: #fff !important;
  border: 1px solid #fff !important;
  box-shadow: none !important;
}

html.nf-a11y-contrast :is(
  .elementor-button .elementor-button-content-wrapper,
  .elementor-button .elementor-button-text,
  .elementor-button span
) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html.nf-a11y-contrast :is(input, textarea, select) {
  background-color: #000 !important;
  color: #fff !important;
  border: 1px solid #fff !important;
}

html.nf-a11y-contrast :is(input, textarea)::placeholder {
  color: #ccc !important;
  opacity: 1 !important;
}

/* -------------------------------------------------------------------------- */
/* Media                                                                      */
/* -------------------------------------------------------------------------- */
html.nf-a11y-contrast :is(img, video, iframe, picture, canvas) {
  opacity: 1 !important;
  visibility: visible !important;
}

html.nf-a11y-contrast .elementor-background-video-container {
  background-color: #121212 !important;
}

html.nf-a11y-contrast .elementor-background-video-container.nf-yt-poster-only {
  background-image: var(--nf-home-hero-poster) !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

/* Reveal Elementor/GSAP hidden content — opacity only (no transform reset:
 * transform:none on .title-anim breaks ScrollSmoother and overlaps the header). */
html.nf-a11y-contrast :is(
  .elementor-invisible,
  .fade_bottom,
  .fade_left,
  .fade_top,
  .fade_right
):not(.workflow__number) {
  opacity: 1 !important;
  visibility: visible !important;
}

/* -------------------------------------------------------------------------- */
/* Our Values — dots design, numbers stay hidden                              */
/* -------------------------------------------------------------------------- */
html.nf-a11y-contrast .workflow__number,
html.nf-a11y-contrast h5.workflow__number,
html.nf-a11y-contrast .workflow__area .workflow__number {
  opacity: 0 !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  visibility: visible !important;
  text-shadow: none !important;
}

html.nf-a11y-contrast .workflow__area .workflow__title,
html.nf-a11y-contrast .workflow__area .workflow__slide .workflow__title,
html.nf-a11y-contrast .workflow__area .swiper-slide .workflow__title,
html.nf-a11y-contrast .workflow__area .workflow__slide:hover .workflow__title,
html.nf-a11y-contrast .workflow__area .swiper-slide:hover .workflow__title,
html.nf-a11y-contrast .workflow__area .workflow__title:hover,
html.nf-a11y-contrast .workflow__area .sec-title,
html.nf-a11y-contrast .workflow__area .sec-sub-title,
html.nf-a11y-contrast .workflow__area h2,
html.nf-a11y-contrast .workflow__area h3,
html.nf-a11y-contrast .workflow__area h6 {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html.nf-a11y-contrast .workflow__area .workflow__slide::before,
html.nf-a11y-contrast .workflow__slide::before {
  background-color: #fff !important;
  background: #fff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html.nf-a11y-contrast .workflow__area .workflow__slide::after,
html.nf-a11y-contrast .workflow__slide::after {
  background-color: #fff !important;
  background: #fff !important;
  border-color: #000 !important;
  opacity: 1 !important;
  visibility: visible !important;
  animation: none !important;
  filter: none !important;
}

/* -------------------------------------------------------------------------- */
/* Expertise separators                                                       */
/* -------------------------------------------------------------------------- */
html.nf-a11y-contrast .service__area-7::before,
html.nf-a11y-contrast .service__area-7::after,
html.nf-a11y-contrast .service__items-7::before,
html.nf-a11y-contrast .service__items-7::after {
  background-color: #fff !important;
  opacity: 0.35 !important;
}

/* -------------------------------------------------------------------------- */
/* Icons & carousel arrows                                                    */
/* -------------------------------------------------------------------------- */
html.nf-a11y-contrast :is(
  .elementor-icon,
  .elementor-icon i,
  a.elementor-icon,
  .elementor-social-icon,
  .elementor-social-icon i,
  a.elementor-social-icon,
  .fa-arrow-right,
  .fa-arrow-left,
  .fa-arrow-down,
  .portfolio__button i,
  .portfolio__btn i
) {
  color: #fff !important;
  background-color: transparent !important;
  border-color: #fff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Torna-su: in alto contrasto resta leggibile (bg chiaro + freccia scura).
 * Senza questo, button/fa-arrow-up forzati a #fff su bg bianco = invisibile. */
html.nf-a11y-contrast .scroll-top,
html.nf-a11y-contrast #scroll_top.scroll-top,
html.nf-a11y-contrast button.scroll-top {
  background: #fff !important;
  background-color: #fff !important;
  color: #111 !important;
  border: 1px solid #fff !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
  visibility: visible !important;
  box-shadow: none !important;
}

html.nf-a11y-contrast .scroll-top i,
html.nf-a11y-contrast #scroll_top i,
html.nf-a11y-contrast .scroll-top .fa-arrow-up,
html.nf-a11y-contrast #scroll_top .fa-arrow-up,
html.nf-a11y-contrast button.scroll-top .fa-solid {
  color: #111 !important;
  -webkit-text-fill-color: #111 !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html.nf-a11y-contrast :is(
  .elementor-icon svg,
  .elementor-icon svg path,
  .elementor-social-icon svg,
  .elementor-social-icon svg path,
  .e-font-icon-svg,
  .e-font-icon-svg path
) {
  fill: #fff !important;
  color: #fff !important;
  stroke: #fff !important;
}

html.nf-a11y-contrast :is(
  .swiper-button-next img,
  .swiper-button-prev img,
  .hero_next img,
  .hero_prev img
) {
  filter: invert(1) brightness(1.2) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html.nf-a11y-contrast :is(
  .swiper-button-next,
  .swiper-button-prev,
  .hero_next,
  .hero_prev
) {
  opacity: 1 !important;
  visibility: visible !important;
}

/* -------------------------------------------------------------------------- */
/* Contatti — circle titles keep white ring (parents stay transparent)        */
/* -------------------------------------------------------------------------- */
html.nf-a11y-contrast :is(
  .elementor-page-6144,
  .elementor-page-4836
) :is(
  .elementor-element-d45f118,
  .elementor-element-102c7f1,
  .elementor-element-f713f4c,
  .elementor-element-6b2c889
) .elementor-heading-title {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border-color: #fff !important;
  background: transparent !important;
}

html.nf-a11y-contrast :is(
  .elementor-page-6144,
  .elementor-page-4836
) :is(
  .elementor-element-9aa7f39,
  .elementor-element-048a075,
  .elementor-element-6baf8e4,
  .elementor-element-acce033
),
html.nf-a11y-contrast :is(
  .elementor-page-6144,
  .elementor-page-4836
) :is(
  .elementor-element-9aa7f39,
  .elementor-element-048a075,
  .elementor-element-6baf8e4,
  .elementor-element-acce033
) :is(.e-con, .e-con-inner, .elementor-widget-container) {
  background-color: transparent !important;
  background-image: none !important;
  overflow: visible !important;
}

/* -------------------------------------------------------------------------- */
/* Accessibility widget chrome                                                */
/* -------------------------------------------------------------------------- */
html.nf-a11y-contrast .nf-a11y__panel {
  background: #1a1a1a !important;
  color: #fff !important;
  border-color: #fff !important;
}

html.nf-a11y-contrast .nf-a11y__toggle {
  background: #1a1a1a !important;
  color: #fff !important;
  border-color: #fff !important;
}

html.nf-a11y-contrast :is(
  .nf-a11y__action,
  .nf-a11y__close,
  .nf-a11y__statement,
  .nf-a11y__title
) {
  color: #fff !important;
  background: transparent !important;
  border-color: #fff !important;
}

html.nf-a11y-contrast .nf-a11y__action[aria-pressed="true"] {
  background: #fff !important;
  color: #111 !important;
  border-color: #fff !important;
}