/*
Theme Name: FuturaImpresa
Theme URI:
Author: FuturaImpresa
Author URI:
Description: Tema child di FuturaImpresa, basato su Elementor Page Builder. Contiene le personalizzazioni di stile e di comportamento del sito.
Version: 1.0.1
Tested up to: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Template: invadex
Text Domain: futuraimpresa
Tags: accountant, advertising, agency, business, company, consulting, corporate, digital agency, digital marketing, finance, insurance, it company, management, seo, startup
Copyright (c) 2025 FuturaImpresa. All rights reserved.
This theme is licensed under the GPL-2.0+ license.
*/
/* ===================================================================
   Brand Futura Impresa — palette
   Primary (evidenza) #6AB256 · Secondary (box/elementi) #4466AA
   Testo #332C2A · Sfondo #EFEFE4
   =================================================================== */
:root{
    --fi-primary:#6AB256;
    --fi-secondary:#4466AA;
    --fi-text:#332C2A;
    --fi-bg:#EFEFE4;
}
body{ background-color:var(--fi-bg); }
::selection{ background:var(--fi-primary); color:#fff; }
a:hover{ color:var(--fi-primary); }

/* ===================================================================
   Header dock — single, always sticky, frosted on scroll
   =================================================================== */
.pxl-header-elementor-sticky{ display:none !important; }            /* no full-width takeover */
.pxl-header-elementor-main{
    position:fixed !important; top:18px !important; left:0; right:0; width:100%; z-index:999;
    transition:background-color .35s ease, backdrop-filter .35s ease, box-shadow .35s ease;
}
/* frost applies to the MENU BOX only (not the whole header), lightly
   translucent, and becomes fully opaque on hover */
.pxl-header-elementor-main.fi-stuck .elementor-element-52ee6d6{
    background-color:rgba(255,255,255,.82) !important;
    -webkit-backdrop-filter:blur(12px) saturate(120%);
    backdrop-filter:blur(12px) saturate(120%);
    box-shadow:0 10px 30px rgba(51,44,42,.10);
    transition:background-color .3s ease, backdrop-filter .3s ease;
}
.pxl-header-elementor-main.fi-stuck .elementor-element-52ee6d6:hover{
    background-color:rgba(255,255,255,1) !important;
}
/* logo lives inside the menu box, on the same row as the menu */
.pxl-header-elementor-main .elementor-element-b48823e > .elementor-element-populated > .elementor-widget-wrap,
.pxl-header-elementor-main .elementor-element-b48823e > .elementor-widget-wrap{
    display:flex !important; flex-direction:row !important; align-items:center;
    flex-wrap:nowrap; gap:32px;
}
.pxl-header-elementor-main .elementor-element-0051d35{
    width:auto !important; margin:0 !important; flex:0 0 auto;
}
/* remove info row above the menu + the panel-toggle button & its panel */
.pxl-header-elementor-main .elementor-element-9677a24{ display:none !important; }
.pxl-header-elementor-main .elementor-element-3725ac8{ display:none !important; }
.hidden-panel-popup{ display:none !important; }
/* bigger, bolder menu labels */
.pxl-header-elementor-main .pxl-menu-primary > li > a,
.pxl-header-elementor-main .pxl-menu-primary .menu-item > a{
    font-size:18px !important; font-weight:700 !important; letter-spacing:.2px;
}
/* header button: primary green */
.pxl-header-elementor-main .elementor-element-78d070a .btn,
.pxl-header-elementor-main .elementor-element-78d070a a.btn{
    background-color:#6AB256 !important; color:#fff !important;
}
.pxl-header-elementor-main .elementor-element-78d070a .btn i,
.pxl-header-elementor-main .elementor-element-78d070a a.btn i{ color:#fff !important; }

/* ===================================================================
   Home — services detached from hero (was margin-top:-373px)
   =================================================================== */
.elementor-element-41f2e18{ margin-top:0 !important; }
.elementor-element-ef79331 > .elementor-element-populated { padding-bottom: 80px !important; }

/* ===================================================================
   Home — first hero CTA recolor + controlled hover
   bg #332C2A · arrow circle primary · white arrow · hover -> secondary fade
   =================================================================== */
/* Applies to all content CTA buttons (.btn-icon-box). The header button uses
   .btn-icon-box2 and is intentionally excluded (stays primary green). */
a.btn.btn-icon-box{
    background-color:#332C2A !important; color:#fff !important;
    transition:background-color .4s ease !important;
}
a.btn.btn-icon-box .pxl--btn-icon,
a.btn.btn-icon-box:hover .pxl--btn-icon{
    background-color:#6AB256 !important; color:#fff !important;
    /* keep the theme's vertical centering, but freeze any hover movement */
    transform:translateY(-50%) !important; transition:none !important;
}
a.btn.btn-icon-box .pxl--btn-icon i,
a.btn.btn-icon-box .pxl--btn-icon i:before{ color:#fff !important; }
a.btn.btn-icon-box:hover{ background-color:#4466AA !important; }          /* secondary, fade */
/* kill the "nina" double-text slide animation: keep one static label */
a.btn.btn-icon-box .pxl--btn-text2{ display:none !important; }
a.btn.btn-icon-box .pxl--btn-mask,
a.btn.btn-icon-box .pxl--btn-text-container,
a.btn.btn-icon-box .pxl--btn-text1,
a.btn.btn-icon-box:hover .pxl--btn-mask,
a.btn.btn-icon-box:hover .pxl--btn-text-container,
a.btn.btn-icon-box:hover .pxl--btn-text1{
    transform:none !important; transition:none !important; opacity:1 !important; animation:none !important;
}

/* brand logo (SVG) sizing in the dock */
.pxl-header-elementor-main .elementor-element-0051d35 .pxl-logo img{
    height:42px !important; width:auto !important; max-width:none !important;
}

/* fixed dock: give inner pages (not the one-page home) room below the bar */
body:not(.home):not(.elementor-page-19772){ padding-top:96px; }

/* ===================================================================
   Hero — two columns (text left + larger, SVG illustration right)
   =================================================================== */
.elementor-element-bb1ed5e > .elementor-container{
    align-items:center !important;
    /* breathing room so content never sticks to the viewport edge on
       screens narrower than the boxed container */
    padding-left:clamp(24px, 5vw, 60px) !important;
    padding-right:clamp(24px, 5vw, 60px) !important;
}
/* every element in the left column shares the same left edge */
.elementor-element-63cfa74, .elementor-element-63cfa74 *{ text-align:left; }
.elementor-element-63cfa74 .elementor-widget{ margin-left:0 !important; }
.elementor-element-63cfa74 .btn-block-inline{ justify-content:flex-start !important; }
/* H1 heavier */
.elementor-element-e5f1183 .pxl-item--title,
.elementor-element-e5f1183 h1, .elementor-element-e5f1183 h2, .elementor-element-e5f1183 h3{
    font-weight:700 !important;
}
/* paragraph promoted to ~h3 size */
.elementor-element-14032f3,
.elementor-element-14032f3 p,
.elementor-element-14032f3 div{
    font-size:22px !important; line-height:1.55 !important;
}
/* larger illustration so the right side isn't empty */
.fi-hero-illustration {
    width:100%; height:auto; max-width:760px; margin-left:auto; display:block;
}
/* ===================================================================
   Unified content width — keep EVERY boxed section on the same edge
   -------------------------------------------------------------------
   The demo gave a few sections (services/about/managing) a custom
   content_width of 1840px while the rest use the kit default (1330px),
   which broke left/right alignment on wide screens. Force one width per
   breakpoint (with !important to beat the per-section overrides) so all
   sections line up, then widen it on large / 4K displays.
   The hero text+illustration live inside the boxed inner section
   bb1ed5e, so they follow this same width automatically.
   =================================================================== */
@media (min-width:768px){
    .elementor-section.elementor-section-boxed > .elementor-container{ max-width:1330px !important; }
}
/* very large screens (2K / ultrawide) */
@media (min-width:1921px){
    .elementor-section.elementor-section-boxed > .elementor-container{ max-width:1840px !important; }
    .elementor-element-e5f1183 .pxl-item--title{ font-size:80px !important; }
    .elementor-element-14032f3, .elementor-element-14032f3 p, .elementor-element-14032f3 div{ font-size:26px !important; }
    .fi-hero-illustration{ max-width:1200px; }
}
/* true 4K / very large displays: use much more of the canvas */
@media (min-width:2560px){
    .elementor-section.elementor-section-boxed > .elementor-container{ max-width:2200px !important; }
    .elementor-element-e5f1183 .pxl-item--title{ font-size:96px !important; }
    .elementor-element-14032f3, .elementor-element-14032f3 p, .elementor-element-14032f3 div{ font-size:30px !important; }
    .fi-hero-illustration{ max-width:1500px; }
}
@media (max-width:991px){
    .fi-hero-illustration{
        max-width:460px; margin:28px auto 0; display:block;
    }
}

/* ===================================================================
   Hero CTA — force left alignment (its widget container was centered)
   =================================================================== */
.elementor-element-63cfa74 .elementor-element-3528f2f,
.elementor-element-63cfa74 .elementor-element-3528f2f .elementor-widget-container,
.elementor-element-63cfa74 .elementor-element-3528f2f .pxl-button{
    text-align:left !important;
}
.elementor-element-63cfa74 .elementor-element-3528f2f a.btn{ margin-left:0 !important; margin-right:auto !important; }
/* the pxl_heading widget defaults to text-align:center, which pushed the hero
   title + overline ~145px right of the paragraph/button. Force left so every
   hero element shares the same left edge. */
.elementor-element-63cfa74 .pxl-heading,
.elementor-element-63cfa74 .pxl-heading .pxl-item--title,
.elementor-element-63cfa74 .pxl-heading .pxl-item--subtitle,
.elementor-element-63cfa74 .pxl-heading .pxl-item--sub-title{
    text-align:left !important;
}
.elementor-element-63cfa74 .pxl-heading .pxl-item--title{ margin-left:0 !important; }
/* the paragraph (pxl_text_editor) defaults to text-align:center, and its inner
   block is inline-block max-width:580 — on wide screens that centred it ~230px
   right of the title/button. Force left so it shares the same edge at every size. */
.elementor-element-63cfa74 .pxl-text-editor{ text-align:left !important; }

/* ===================================================================
   About — give the content breathing room from the container's left edge
   (it was sitting ~11px from the edge, looked glued to the container)
   =================================================================== */
.elementor-element-1007cf9 .elementor-element-aff3f56 > .elementor-widget-wrap,
.elementor-element-1007cf9 .elementor-element-aff3f56 > .elementor-element-populated{
    padding-left: clamp(24px, 3.5vw, 90px) !important;
}

/* ===================================================================
   Form section — narrower than the unified content width (cap 1500px).
   Higher specificity than the global boxed rule so it wins at all sizes.
   =================================================================== */
.elementor-section.elementor-section-boxed.elementor-element-2bc46b5 > .elementor-container{
    max-width: 1500px !important;
}

/* ===================================================================
   FormClups buttons — the theme rule
   `button:not(.btn){ background: var(--primary-color) }` (#FFCD4D yellow)
   hijacks the plugin's <button> elements (submit + custom dropdown),
   overriding the colours set in the FormClups editor. Restore them.
   =================================================================== */
.fc-scope .fc-submit,
.fc-scope button.fc-submit{
    background-color: var(--fc-submit-bg, #4466AA) !important;
    color: var(--fc-submit-text, #fff) !important;
}
.fc-scope .fc-submit:hover,
.fc-scope button.fc-submit:hover{
    background-color: var(--fc-submit-hover-bg, #6AB256) !important;
    color: var(--fc-submit-hover-text, #fff) !important;
}
.fc-scope .fc-submit.fc-btn-success{
    background-color: var(--fc-success-color, #28a745) !important;
}
/* the "Seleziona…" dropdown trigger is also a <button>: keep it the field bg */
.fc-scope .fc-dd-trigger,
.fc-scope button.fc-select{
    background-color: var(--fc-field-bg, #fff) !important;
    color: var(--fc-field-text, #333) !important;
}

/* ===================================================================
   Page preloader dots — were the theme yellow (#FFCD4D), make brand green
   =================================================================== */
.pxl-loader .pxl-loader-spinner > div,
.pxl-loader-bounce1,
.pxl-loader-bounce2,
#pxl-loadding .pxl-loader-spinner > div{
    background-color: var(--fi-primary, #6AB256) !important;
}

/* ===================================================================
   Mobile header — same pill style as desktop + brand logo
   =================================================================== */
.pxl-header-mobile-default,
.pxl-header-mobile-elementor {
    position:fixed !important; top:12px; left:12px; right:12px; z-index:1000;
    display:flex !important; align-items:center; justify-content:space-between;
    width:auto !important; max-width:none !important; box-sizing:border-box;
    margin:0 !important;
    padding:4px 20px !important;
    border-radius:50px !important;                 /* pill shape, like the desktop dock */
    background-color:rgba(255,255,255,1) !important; /* solid at top */
    -webkit-backdrop-filter:blur(13px) saturate(120%);
    backdrop-filter:blur(13px) saturate(120%);     /* frosted translucent + blur */
    box-shadow:0 8px 26px rgba(51,44,42,.12) !important;
    transition:transform .4s ease, background-color .35s ease, box-shadow .35s ease;
}
/* slightly more solid once scrolled */
.pxl-header-mobile-default.fi-stuck,
.pxl-header-mobile-elementor.fi-stuck { background-color:rgba(255,255,255,.82) !important; }
/* slides up out of view on scroll-down, slides back down on scroll-up */
.pxl-header-mobile-default.fi-hide,
.pxl-header-mobile-elementor.fi-hide { transform:translateY(-160%); }
/* hamburger lines clearly visible on the frosted pill */
.pxl-header-mobile-default .pxl-nav-mobile-button .pxl-icon-line,
.pxl-header-mobile-elementor .pxl-nav-mobile-button .pxl-icon-line { display:none !important; }
/* bigger logo */
.pxl-header-mobile-default .pxl-header-branding img,
.pxl-header-mobile-elementor .pxl-header-branding img {
    height:32px !important; width:auto !important; max-width:none !important;
}
/* the white wrapper bg behind the mobile bar should not be there */
header.pxl-header-show{ background-color:transparent !important; box-shadow:none !important; }
/* "Menu" label beside the hamburger (lines are absolutely-positioned, so place the label absolutely to their left) */
.pxl-header-mobile-default .pxl-nav-mobile-button,
.pxl-header-mobile-elementor .pxl-nav-mobile-button { position:relative; overflow:visible; margin-right:12px !important; width:auto !important; height:auto !important; display:flex; align-items:center; }
.pxl-header-mobile-default .pxl-nav-mobile-button::before,
.pxl-header-mobile-elementor .pxl-nav-mobile-button::before {
    content:"Menu"; position:static; transform:none; right:auto; top:auto; display:block;
    font-weight:700; font-size:16px; color:var(--fi-text); line-height:1; white-space:nowrap;
}

/* ===================================================================
   Remap theme's hardcoded yellow (#FFCD4D) accent -> brand
   =================================================================== */
.pxl-contact-form .wpcf7-contact-form-home-3 input.wpcf7-form-control:focus,
.pxl-contact-form .wpcf7-contact-form-home-3 textarea.wpcf7-form-control:focus,
.pxl-contact-form .wpcf7-contact-home-3 div > p input:active,
.pxl-contact-form .wpcf7-contact-coming-soon p .wpcf7-form-control-wrap input.wpcf7-not-valid{ border-color:var(--fi-primary) !important; }
.pxl-contact-form .wpcf7-contact-form-home-3 .btn-submit-home-3,
.pxl-contact-form .wpcf7-contact-form-home-3 + .wpcf7-response-output{ background-color:var(--fi-primary) !important; }
.pxl-contact-form .wpcf7-contact-form-home-3 .btn-submit-home-3 .btn-submit--arrow i,
.pxl-contact-form .wpcf7-contact-form-home-3 .btn-submit-home-3 .btn-submit--arrow svg{ color:#fff !important; }
.pxl-team-carousel2.pxl-team-layout1 .pxl-item--image .pxl-item--social a,
.pxl-team-grid1.pxl-team-layout1 .pxl-item--image .pxl-item--social a{ background-color:var(--fi-primary) !important; }
.pxl-team-carousel2.pxl-team-layout1 .pxl-item--title:hover{ color:var(--fi-primary) !important; }
/* testimonials yellow accent element -> primary */
.elementor-element-77989c7 .elementor-element-e46bb37,
.elementor-element-e46bb37,
.pxl-testimonial-carousel .swiper-pagination-bullet-active,
.pxl-el-divider,
[style*="ffcd4d"], [style*="FFCD4D"],
.elementor-widget-pxl_testimonial_carousel [style*="background-color: #FFCD4D"] { 
    background-color:var(--fi-primary) !important; 
    border-color:var(--fi-primary) !important; 
}

/* ===================================================================
   Scroll-to-top button
   =================================================================== */
.pxl-scroll-top { 
    background-color:var(--fi-secondary) !important; 
    border-color:var(--fi-secondary) !important; 
    color:#fff !important;
}
.pxl-scroll-top i,
.pxl-scroll-top svg,
.pxl-scroll-top::before { color:#fff !important; }
.pxl-scroll-progress-circle path{ stroke:var(--fi-primary) !important; }

/* ===================================================================
   Custom Cursor
   =================================================================== */
.pxl-cursor--follower { border-color: var(--fi-primary) !important; background-color: transparent !important; }


/* ===================================================================
   "Why choose us" (Our eye for perfections) — white icon, primary on hover
   =================================================================== */
.elementor-element-325a104 .pxl-icon-box4 .pxl-item--icon{
    background-color:var(--fi-secondary) !important;
    color:#fff !important; transition:background-color .3s ease !important;
}
.elementor-element-325a104 .pxl-icon-box4 .pxl-item--icon i,
.elementor-element-325a104 .pxl-icon-box4 .pxl-item--icon i:before,
.elementor-element-325a104 .pxl-icon-box4 .pxl-item--icon svg,
.elementor-element-325a104 .pxl-icon-box4 .pxl-item--icon svg path{ color:#fff !important; fill:#fff !important; }
.elementor-element-325a104 .pxl-icon-box4:hover .pxl-item--icon{ background-color:var(--fi-primary) !important; }

/* ===================================================================
   Services — keep hover accents on brand
   =================================================================== */
.pxl-service-style1 .pxl-post--inner:hover{ border-color:var(--fi-primary) !important; }
.pxl-service-style1 .pxl-item--readmore:hover,
.pxl-service-style1 .pxl-item--title a:hover{ color:var(--fi-primary) !important; }
.pxl-service-style1 .pxl-item--icon i,
.pxl-service-style1 .pxl-post--inner:hover .pxl-item--icon{ color:var(--fi-primary) !important; }

/* ===================================================================
   Kill the "nina" double-text animation on ALL CTA buttons (incl. about)
   =================================================================== */
.btn-text-nina .pxl--btn-text2{ display:none !important; }
.btn-text-nina .pxl--btn-mask,
.btn-text-nina .pxl--btn-text-container,
.btn-text-nina .pxl--btn-text1,
.btn-text-nina:hover .pxl--btn-mask,
.btn-text-nina:hover .pxl--btn-text-container,
.btn-text-nina:hover .pxl--btn-text1{
    transform:none !important; transition:none !important; opacity:1 !important; animation:none !important;
}

/* ===================================================================
   MOBILE refinements (<=991px)
   =================================================================== */
/* hero fits the viewport on phones */
@media (max-width:767px){
    /* collapse the over-tall box so content isn't centered with a big empty gap */
    .elementor-element-cdad5d4,
    .elementor-element-cdad5d4 > .elementor-container,
    .elementor-element-ef79331,
    .elementor-element-ef79331 > .elementor-element-populated,
    .elementor-element-ef79331 > .elementor-widget-wrap{
        min-height:0 !important; height:auto !important;
        padding-top:0 !important; padding-bottom:0 !important;
        justify-content:flex-start !important; align-content:flex-start !important;
    }
    .elementor-element-ef79331 > .elementor-widget-wrap{
        display:flex !important; flex-direction:column !important;
    }
    .elementor-element-63cfa74 { order: 1 !important; width:100% !important; }
    .elementor-element-169b4cc { order: 2 !important; width:100% !important; }
    
    .elementor-element-cdad5d4{ padding-top:70px !important; padding-bottom:20px !important; }
    .elementor-element-e5f1183 .pxl-item--title{ font-size:40px !important; line-height:1.1 !important; }
    .elementor-element-14032f3, .elementor-element-14032f3 p, .elementor-element-14032f3 div{ font-size:18px !important; line-height:1.5 !important; }
    .fi-hero-illustration{ max-height:35vh; width:auto; max-width:100% !important; margin:32px auto 0 !important; }
}

/* Remove Elementor background image from the hero globally */
.elementor-element-cdad5d4,
.elementor-element-cdad5d4 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    background-image: none !important;
}

/* ===================================================================
   Single Service Template Typography & Sidebar Buttons
   =================================================================== */
/* Text colors */
.single-service,
.single-service p,
.single-service span,
.single-service li,
.single-service h1, .single-service h2, .single-service h3, 
.single-service h4, .single-service h5, .single-service h6 {
    color: var(--fi-text) !important;
}

/* Sidebar service links (buttons) */
.single-service .pxl-service-link1 .pxl-service--item a {
    background-color: var(--fi-text) !important;
    border: 1px solid var(--fi-text) !important;
    border-radius: 50px !important;
}
/* Ensure the text inside the button contrasts (e.g. white) */
.single-service .pxl-service-link1 .pxl-service--item a .pxl-service--title,
.single-service .pxl-service-link1 .pxl-service--item a .pxl-service--icon i,
.single-service .pxl-service-link1 .pxl-service--item a .pxl-service--arrow i,
.single-service .pxl-service-link1 .pxl-service--item a * {
    color: #fff !important;
}
/* Hover and active effect to secondary color */
.single-service .pxl-service-link1 .pxl-service--item a:hover,
.single-service .pxl-service-link1 .pxl-service--item.active a {
    background-color: var(--fi-secondary) !important;
    border-color: var(--fi-secondary) !important;
}

/* Service sidebar "Contact" or highlight box SVG shapes & texts */
.pxl-contact-box1 .pxl-item--shape1 path {
    fill: var(--fi-primary) !important;
}
.pxl-contact-box1 .pxl-item--shape2 path {
    fill: var(--fi-secondary) !important;
}
.pxl-contact-box1 .pxl-item--title,
.pxl-contact-box1 .pxl-item--title a {
    color: #fff !important;
}
.pxl-contact-box1 .pxl-item--link {
    color: var(--fi-text) !important;
}
.pxl-contact-box1 .pxl-item--icon {
    background-color: var(--fi-primary) !important;
}
.pxl-contact-box1 .pxl-item--icon i {
    color: #fff !important;
}

/* ===================================================================
   Footer Styles
   =================================================================== */
#pxl-footer-elementor,
#pxl-footer-elementor .elementor-section,
#pxl-footer-elementor .elementor-column,
#pxl-footer-elementor .elementor-background-overlay {
    background-color: var(--fi-text) !important;
    background-image: none !important;
}

#pxl-footer-elementor,
#pxl-footer-elementor p,
#pxl-footer-elementor span,
#pxl-footer-elementor h1, #pxl-footer-elementor h2,
#pxl-footer-elementor h3, #pxl-footer-elementor h4,
#pxl-footer-elementor h5, #pxl-footer-elementor h6,
#pxl-footer-elementor a {
    color: #fff !important;
}

#pxl-footer-elementor a:hover {
    color: var(--fi-primary) !important;
}

/* Social icons primary color */
#pxl-footer-elementor .pxl-social-icons a i,
#pxl-footer-elementor .elementor-social-icon i,
#pxl-footer-elementor .pxl-social-icons a svg,
#pxl-footer-elementor a i.fab {
    color: var(--fi-primary) !important;
}

/* Hide specific social icons */
#pxl-footer-elementor a:has(.fa-twitter),
#pxl-footer-elementor a:has(.fa-x-twitter),
#pxl-footer-elementor a[href*="twitter"],
#pxl-footer-elementor a[href*="x.com"] {
    display: none !important;
}

/* Replace YouTube with LinkedIn visually */
#pxl-footer-elementor i.fa-youtube::before {
    content: "\f0e1" !important;
}

/* ===================================================================
   CONTATTACI page (4623)
   =================================================================== */
/* Page-title box: heading reads white on the blue panel */
body.page-id-4623 .pxl-page-title .pxl-item--title,
body.page-id-4623 .pxl-page-title .pxl-item--title * {
    color: #fff !important;
}

/* Contact section — studio card + form (form itself left to the plugin) */
body.page-id-4623 .elementor-element-26ef926,
body.page-id-4623 .elementor-element-26ef926 > .elementor-container,
body.page-id-4623 .elementor-element-65a43f2,
body.page-id-4623 .elementor-element-65a43f2 > .elementor-widget-wrap,
body.page-id-4623 .elementor-element-65a43f2 > .elementor-element-populated {
    background-color: transparent !important;
    background-image: none !important;
}
body.page-id-4623 .fi-contact {
    display: grid;
    grid-template-columns: minmax(280px, 380px) 1fr;
    gap: clamp(24px, 4vw, 56px);
    align-items: start;
    max-width: 1180px;
    margin: 0 auto;
}
body.page-id-4623 .fi-contact__card {
    position: sticky;
    top: 110px;
    background: var(--fi-text);
    color: #fff;
    border-radius: 24px;
    padding: clamp(28px, 3vw, 40px);
}
body.page-id-4623 .fi-contact__logo { height: 40px; width: auto; display: block; margin-bottom: 28px; }
body.page-id-4623 .fi-contact__eyebrow {
    margin: 0 0 10px; font-weight: 700; font-size: 13px;
    letter-spacing: .18em; text-transform: uppercase; color: var(--fi-primary);
}
body.page-id-4623 .fi-contact__title {
    margin: 0 0 14px; font-weight: 800; line-height: 1.15;
    font-size: clamp(24px, 2.4vw, 30px); color: #fff;
}
body.page-id-4623 .fi-contact__sign {
    margin: 0 0 26px; padding-bottom: 24px; font-size: 14px;
    color: rgba(255, 255, 255, .7); border-bottom: 1px solid rgba(255, 255, 255, .14);
}
body.page-id-4623 .fi-contact__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 18px; }
body.page-id-4623 .fi-contact__list li { display: flex; align-items: center; gap: 14px; font-size: 15px; color: rgba(255, 255, 255, .92); }
body.page-id-4623 .fi-contact__list a { color: inherit; text-decoration: none; transition: color .25s ease; }
body.page-id-4623 .fi-contact__list a:hover { color: var(--fi-primary); }
body.page-id-4623 .fi-contact__ic {
    flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%;
    background: rgba(106, 178, 86, .16);
    display: flex; align-items: center; justify-content: center;
}
body.page-id-4623 .fi-contact__ic svg { width: 18px; height: 18px; fill: none; stroke: var(--fi-primary); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
body.page-id-4623 .fi-contact__lead {
    margin: 0 0 22px; font-weight: 600; font-size: 17px; line-height: 1.5;
    color: var(--fi-text); max-width: 46ch;
}
@media (max-width: 860px) {
    body.page-id-4623 .fi-contact { grid-template-columns: 1fr; }
    body.page-id-4623 .fi-contact__card { position: static; }
}

/* FAQ boxes mirror the hero CTA: dark base, secondary on hover/active,
   green toggle icon, white text */
body.page-id-4623 .pxl-accordion1 .pxl-accordion--title {
    background-color: #332C2A !important;
    border-radius: 100px !important;
    transition: background-color .4s ease !important;
}
body.page-id-4623 .pxl-accordion1 .pxl-accordion--title .pxl-title--text,
body.page-id-4623 .pxl-accordion1 .pxl-accordion--title .pxl-title--number {
    color: #fff !important;
}
body.page-id-4623 .pxl-accordion1 .pxl-accordion--title:hover,
body.page-id-4623 .pxl-accordion1 .active .pxl-accordion--title,
body.page-id-4623 .pxl-accordion1 .pxl--item.active .pxl-accordion--title {
    background-color: var(--fi-secondary) !important;
}
/* toggle action = green circle with white glyph (like the CTA arrow) */
body.page-id-4623 .pxl-accordion1 .pxl-accordion--title .pxl-icon--action {
    background-color: var(--fi-primary) !important;
    color: #fff !important;
    border-radius: 50% !important;
}
body.page-id-4623 .pxl-accordion1 .pxl-accordion--title .pxl-icon--action i,
body.page-id-4623 .pxl-accordion1 .pxl-accordion--title .pxl-icon--action i:before,
body.page-id-4623 .pxl-accordion1 .pxl-accordion--title .pxl-icon--action svg,
body.page-id-4623 .pxl-accordion1 .pxl-accordion--title .pxl-icon--action svg path {
    color: #fff !important;
    fill: #fff !important;
}

/* White brand logo in the footer — the SVG was collapsing to 0 width */
#pxl-footer-elementor .pxl-logo {
    position: relative;
    z-index: 2;            /* keep the logo above the footer's decorative bg */
}
#pxl-footer-elementor .pxl-logo img {
    width: auto !important;
    height: 72px !important;
    max-height: none !important;
    max-width: 100% !important;
    display: block;
}
@media (max-width: 767px) {
    #pxl-footer-elementor .pxl-logo img { height: 60px !important; }
}

/* ===================================================================
   SINGLE BLOG POST — brand alignment
   Text -> #332C2A · boxes/breadcrumb -> secondary · hover/active -> primary
   =================================================================== */

/* 1. Every text in the article + meta uses the brand text color */
body.single-post .pxl---post > .pxl-item--title,
body.single-post .pxl---post > .pxl-item--title a,
body.single-post .pxl-item--content,
body.single-post .pxl-item--content p,
body.single-post .pxl-item--content li,
body.single-post .pxl-item--content span,
body.single-post .pxl-item--content blockquote,
body.single-post .pxl-item--content strong,
body.single-post .pxl-item--content h1,
body.single-post .pxl-item--content h2,
body.single-post .pxl-item--content h3,
body.single-post .pxl-item--content h4,
body.single-post .pxl-item--content h5,
body.single-post .pxl-item--content h6,
body.single-post .pxl-item--meta,
body.single-post .pxl-item--meta * {
    color: var(--fi-text) !important;
}
/* in-content links: text color, primary only on hover */
body.single-post .pxl-item--content a {
    color: var(--fi-text);
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color .25s ease;
}
body.single-post .pxl-item--content a:hover { color: var(--fi-primary); }

/* 1b. Page-title hero — drop the redundant blue title box; keep only the small
   category badge (its text is set to the category name via JS) */
body.single-post .elementor-widget-pxl_page_title .pxl-item--title,
body.single-post .pxl-page-title .pxl-item--title {
    display: none !important;
}

/* 1c. Article H1 — heavier weight, left aligned */
body.single-post .pxl---post > .pxl-item--title {
    text-align: left !important;
    font-weight: 800 !important;
}

/* 2. Breadcrumb under the cover image — bold, secondary, primary on hover/active */
body.single-post .fi-post-breadcrumb { margin: 22px 0 30px; }
body.single-post .fi-post-breadcrumb .seoclups-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
body.single-post .fi-post-breadcrumb .seoclups-breadcrumb a,
body.single-post .fi-post-breadcrumb .seoclups-breadcrumb span,
body.single-post .fi-post-breadcrumb .seoclups-breadcrumb .seoclups-breadcrumb-sep {
    font-weight: 700 !important;
    color: var(--fi-secondary) !important;
}
body.single-post .fi-post-breadcrumb .seoclups-breadcrumb a {
    text-decoration: none;
    transition: color .25s ease;
}
body.single-post .fi-post-breadcrumb .seoclups-breadcrumb a:hover,
body.single-post .fi-post-breadcrumb .seoclups-breadcrumb [aria-current="page"] {
    color: var(--fi-primary) !important;
}

/* 3. Sidebar — sticky offset below the fixed dock */
body.single-post .pxl-sidebar-sticky { position: sticky; top: 110px; }

/* 4. Author card */
body.single-post .fi-author-card {
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 12px 30px rgba(51, 44, 42, .08);
    overflow: hidden;
}
body.single-post .fi-author-card--inner { padding: 34px 24px; text-align: center; }
body.single-post .fi-author-card--avatar img {
    width: 96px; height: 96px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--fi-secondary);
}
body.single-post .fi-author-card--title {
    margin-top: 16px;
    font-size: 20px; font-weight: 700;
    color: var(--fi-text);
}
body.single-post .fi-author-card--desc {
    margin: 12px 0 0;
    font-size: 15px;
    line-height: 1.6;
    color: var(--fi-text);
    opacity: .9;
}
body.single-post .fi-author-card--social {
    display: flex; justify-content: center; gap: 12px;
    margin-top: 18px;
}
body.single-post .fi-author-card--social .fi-social {
    width: 44px; height: 44px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--fi-secondary);
    color: #fff;
    transition: background-color .3s ease, transform .3s ease;
}
body.single-post .fi-author-card--social .fi-social i { color: #fff; font-size: 17px; }
body.single-post .fi-author-card--social .fi-social:hover {
    background: var(--fi-primary);
    transform: translateY(-2px);
}

/* 5. Table of contents (Indice) */
body.single-post .fi-toc {
    margin-top: 24px;
    padding: 24px;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 12px 30px rgba(51, 44, 42, .08);
}
body.single-post .fi-toc[hidden] { display: none; }
body.single-post .fi-toc--title {
    font-size: 18px; font-weight: 700;
    color: var(--fi-text);
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 2px solid rgba(68, 102, 170, .18);
}
body.single-post .fi-toc--list {
    list-style: none; margin: 0; padding: 0;
    display: flex; flex-direction: column; gap: 2px;
}
body.single-post .fi-toc--link {
    display: block;
    padding: 9px 12px;
    border-left: 3px solid transparent;
    border-radius: 0 8px 8px 0;
    color: var(--fi-secondary);
    font-weight: 500;
    line-height: 1.4;
    text-decoration: none;
    transition: color .25s ease, background-color .25s ease, border-color .25s ease;
}
body.single-post .fi-toc--link:hover {
    color: var(--fi-primary);
    border-left-color: var(--fi-primary);
    background: rgba(106, 178, 86, .06);
}
body.single-post .fi-toc--link.is-active {
    color: var(--fi-primary);
    border-left-color: var(--fi-primary);
    background: rgba(106, 178, 86, .09);
    font-weight: 700;
}

/* On mobile the box sits inside the article, after the intro paragraph */
@media (max-width: 991px) {
    body.single-post .pxl-item--content .fi-toc { margin: 24px 0 30px; }
}

/* 6. Recent articles flow */
body.single-post .fi-recent-posts { padding: 56px 15px 84px; }
body.single-post .fi-recent-posts--title {
    margin: 0 0 36px;
    font-size: clamp(28px, 4vw, 40px);
    font-weight: 700;
    color: var(--fi-text);
}
body.single-post .fi-recent-posts .pxl-grid-item { margin-bottom: 30px; }
body.single-post .fi-recent-posts .pxl-post--title a { color: var(--fi-text); transition: color .25s ease; }
body.single-post .fi-recent-posts .pxl-post--title a:hover,
body.single-post .fi-recent-posts .pxl-post--button a:hover,
body.single-post .fi-recent-posts .pxl-post--button a:hover span,
body.single-post .fi-recent-posts .pxl-post--button a:hover i { color: var(--fi-primary); }

/* ============================================================
   Aggiunte FuturaImpresa (giugno 2026)
   ============================================================ */

/* Card contatti riusabile via [fi_contact_card] (es. accanto al form in home):
   stessi stili della card nella pagina contattaci. */
.fi-contact--card-only .fi-contact__card { background: var(--fi-text); color:#fff; border-radius:24px; padding:clamp(28px,3vw,40px); }
.fi-contact--card-only .fi-contact__logo { height:40px; width:auto; display:block; margin-bottom:28px; }
.fi-contact--card-only .fi-contact__eyebrow { margin:0 0 10px; font-weight:700; font-size:13px; letter-spacing:.18em; text-transform:uppercase; color:var(--fi-primary); }
.fi-contact--card-only .fi-contact__title { margin:0 0 14px; font-weight:800; line-height:1.15; font-size:clamp(24px,2.4vw,30px); color:#fff; }
.fi-contact--card-only .fi-contact__sign { margin:0 0 26px; padding-bottom:24px; font-size:14px; color:rgba(255,255,255,.7); border-bottom:1px solid rgba(255,255,255,.14); }
.fi-contact--card-only .fi-contact__list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:18px; }
.fi-contact--card-only .fi-contact__list li { display:flex; align-items:center; gap:14px; font-size:15px; color:rgba(255,255,255,.92); }
.fi-contact--card-only .fi-contact__list a { color:inherit; text-decoration:none; transition:color .25s ease; }
.fi-contact--card-only .fi-contact__list a:hover { color:var(--fi-primary); }
.fi-contact--card-only .fi-contact__ic { flex:0 0 40px; width:40px; height:40px; border-radius:50%; background:rgba(106,178,86,.16); display:flex; align-items:center; justify-content:center; }
.fi-contact--card-only .fi-contact__ic svg { width:18px; height:18px; fill:none; stroke:var(--fi-primary); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

/* CTA pagine servizio: testo bianco leggibile (l'effetto nina forzava il colore scuro) */
.single-service .pxl-button .btn,
.single-service .pxl-button .btn .pxl--btn-text { color:#fff !important; }

/* Box contatto servizio: numero di telefono su una sola riga */
.pxl-contact-box .pxl-item--group a { white-space:nowrap; }

/* FAQ pagina contatti: max 600px, centrata, testo allineato a sinistra */
body.page-id-4623 .elementor-widget-pxl_accordion { max-width:600px; margin-left:auto; margin-right:auto; }
body.page-id-4623 .elementor-widget-pxl_accordion .pxl-accordion,
body.page-id-4623 .elementor-widget-pxl_accordion .pxl-accordion__title,
body.page-id-4623 .elementor-widget-pxl_accordion .pxl-accordion__content { text-align:left; }

/* Articoli: titoli nel colore del testo (non più verdi) */
.pxl-blog-grid .pxl-post--title a { color: var(--fi-text); }
.pxl-blog-grid .pxl-post--title a:hover { color: var(--fi-primary); }

/* Articoli: box blu del tema con titolo bianco quando manca l'immagine in evidenza */
.fi-featured-fallback { border-radius: 20px; overflow: hidden; margin-bottom: 26px; }
.fi-featured-fallback__link {
    display: flex; align-items: center; justify-content: center;
    aspect-ratio: 583 / 300; padding: 28px;
    background: var(--fi-secondary); color: #fff;
    font-family: "DM Sans", sans-serif; font-weight: 700;
    font-size: clamp(20px, 2vw, 26px); line-height: 1.25; text-align: center;
}
.fi-featured-fallback__link:hover { color: #fff; }

/* Il lottie-player iniettato nella hero eredita le regole di .fi-hero-illustration */
lottie-player.fi-hero-illustration { display: block; }

/* Articoli: elenchi puntati — spunta allineata al primo rigo del <li> e spazio tra i punti */
body.single-post .pxl---post .pxl-item--content ul li {
    margin-bottom: 14px;
}
body.single-post .pxl---post .pxl-item--content ul li:before {
    top: 8px;
    transform: none;
}