:root{
        --alk-teal: #2f7f87;
        --alk-teal-dark: #235f65;
        --alk-gold: #f9d030;
        --alk-ink: #0b0f12;
        --alk-muted: rgba(11,15,18,.7);
        --alk-card: rgba(255,255,255,.90);
        --alk-border: rgba(11,15,18,.08);
        --alk-danger: #b42318;
    }

    .hero{ padding: 5.5rem 1rem 3.5rem; }

    .hero-wrap{
        border-radius: 22px;
        overflow: hidden;
        border: 1px solid var(--alk-border);
        background:
            radial-gradient(1200px 500px at 18% 0%, rgba(47,127,135,.13), transparent 60%),
            radial-gradient(900px 420px at 82% 20%, rgba(249,208,48,.15), transparent 55%),
            linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.80));
        box-shadow: 0 22px 70px rgba(0,0,0,.09);
    }

    .hero-left{ padding: 3.75rem 2.25rem; }

    .hero-kicker{
        display: inline-flex;
        gap: .55rem;
        align-items: center;
        font-weight: 900;
        font-size: .95rem;
        color: var(--alk-teal-dark);
        background: rgba(47,127,135,.10);
        border: 1px solid rgba(47,127,135,.18);
        padding: .42rem .8rem;
        border-radius: 999px;
        margin-bottom: 1.05rem;
    }

    .hero h1{
        letter-spacing: -0.03em;
        font-weight: 950;
        color: var(--alk-ink);
        margin-bottom: .7rem;
        line-height: 1.04;
    }

    .hero .lead{
        color: var(--alk-ink);
        opacity: .95;
        font-size: 1.18rem;
        margin-bottom: .85rem;
        font-weight: 800;
        letter-spacing: -0.01em;
    }

    .hero p{ color: var(--alk-muted); margin-bottom: 1.05rem; }

    .pain-box{
        margin-top: 1.15rem;
        background: rgba(180,35,24,.06);
        border: 1px solid rgba(180,35,24,.14);
        border-radius: 18px;
        padding: 1.1rem 1.1rem;
    }
    .pain-box .t{
        display:flex;
        gap:.55rem;
        align-items:center;
        font-weight: 950;
        color: rgba(180,35,24,.92);
        margin-bottom: .55rem;
        letter-spacing:-0.01em;
    }
    .pain-box ul{
        margin:0;
        padding-left: 1.1rem;
        color: rgba(11,15,18,.80);
    }
    .pain-box li{ margin: .28rem 0; }

    .hero-bullets{
        margin: 1.15rem 0 0;
        padding-left: 0;
        list-style: none;
        display: grid;
        gap: .7rem;
    }

    .hero-bullets li{
        display:flex;
        gap:.72rem;
        align-items:flex-start;
        color: rgba(11,15,18,.86);
    }
    .hero-bullets li i{
        color: var(--alk-teal-dark);
        margin-top: .18rem;
        font-size: 1.05rem;
        width: 22px;
        text-align:center;
        flex: 0 0 auto;
    }

    .hero-actions{
        display:flex;
        flex-wrap:wrap;
        gap:.75rem;
        margin-top: 1.55rem;
        align-items:center;
    }

    .btn-alk-primary{
        background: var(--alk-teal);
        color: #fff;
        border: none;
        padding: .9rem 1.15rem;
        border-radius: 12px;
        font-weight: 950;
        letter-spacing:-0.01em;
        box-shadow: 0 18px 38px rgba(47,127,135,.22);
    }
    .btn-alk-primary:hover{ background: var(--alk-teal-dark); color:#fff; }

    .btn-alk-ghost{
        background: transparent;
        border: 1px solid rgba(11,15,18,.18);
        color: rgba(11,15,18,.90);
        padding: .9rem 1.15rem;
        border-radius: 12px;
        font-weight: 900;
    }

    .micro{
        font-size: .92rem;
        color: rgba(11,15,18,.62);
        margin-top: .85rem;
    }

    .urgency{
        margin-top: .85rem;
        display:flex;
        gap:.6rem;
        align-items:flex-start;
        color: rgba(11,15,18,.75);
        font-size:.93rem;
    }
    .urgency i{
        color: rgba(180,35,24,.92);
        margin-top: .15rem;
        width: 22px;
        text-align:center;
    }
    .urgency strong{ color: rgba(180,35,24,.92); }

    .hero-right{
        position: relative;
        min-height: 460px;
        background-size: cover;
        background-position: center;
        background-image:
            linear-gradient(90deg, rgba(255,255,255,.86) 0%, rgba(255,255,255,.30) 36%, rgba(0,0,0,.32) 100%),
            url('/assets/sfondi-login/3.png'); /* <- immagine promo Fatturazione */
    }
    .hero-right::after{
        content:"";
        position:absolute;
        inset:0;
        background:
            radial-gradient(620px 310px at 70% 40%, rgba(47,127,135,.26), transparent 62%),
            radial-gradient(520px 260px at 65% 66%, rgba(249,208,48,.19), transparent 58%);
        pointer-events:none;
        mix-blend-mode: screen;
        opacity: .9;
    }

    .hero-badge{
        position:absolute;
        right:18px;
        bottom:18px;
        background: rgba(11,15,18,.68);
        color: rgba(255,255,255,.92);
        border: 1px solid rgba(255,255,255,.18);
        border-radius: 14px;
        padding: .95rem 1.05rem;
        backdrop-filter: blur(8px);
        max-width: 420px;
    }
    .hero-badge strong{ display:block; font-weight: 950; }
    .hero-badge span{ display:block; opacity:.88; font-size: .92rem; }

    .section{ padding: 1.25rem 0 2.5rem; }

    .feature{ padding: 1.25rem 1rem; text-align: left; }

    .cardx{
        height:100%;
        background: var(--alk-card);
        border: 1px solid var(--alk-border);
        border-radius: 18px;
        padding: 1.25rem 1.25rem;
        box-shadow: 0 14px 34px rgba(0,0,0,.06);
    }

    .icon{
        width: 44px;
        height: 44px;
        border-radius: 14px;
        display: inline-flex;
        align-items:center;
        justify-content:center;
        background: rgba(47,127,135,.10);
        border: 1px solid rgba(47,127,135,.18);
        margin-bottom: .9rem;
        color: var(--alk-teal-dark);
        font-size: 1.05rem;
    }

    .cardx h3{
        font-weight: 950;
        margin-bottom: .55rem;
        font-size: 1.08rem;
        color: var(--alk-ink);
        letter-spacing: -0.01em;
    }
    .cardx p{ color: var(--alk-muted); margin-bottom:0; }

    .split{
        padding: 1.25rem 0 2.25rem;
    }
    .split .box{
        border-radius: 18px;
        border: 1px solid var(--alk-border);
        background: rgba(255,255,255,.88);
        padding: 1.25rem 1.25rem;
        box-shadow: 0 14px 34px rgba(0,0,0,.05);
        height: 100%;
    }
    .split .h{
        font-weight: 950;
        letter-spacing:-0.02em;
        margin-bottom: .55rem;
    }
    .split .box ul{
        margin:0;
        padding-left: 1.2rem;
        color: rgba(11,15,18,.78);
    }
    .split .box li{ margin: .28rem 0; }

    .cta{
        background-color: var(--alk-gold);
        color:#000;
        padding: 3.25rem 1rem;
        text-align:center;
        margin-top: 1rem;
    }
    .cta h2{
        font-weight: 990;
        margin-bottom: .85rem;
        letter-spacing:-0.02em;
    }
    .cta p{
        margin: 0 auto 1.25rem;
        max-width: 1040px;
        opacity:.94;
        font-weight: 800;
    }

    .form-section{
        padding: 3.25rem 1rem 4.25rem;
        max-width: 860px;
        margin: 0 auto;
    }
    .form-card{
        background:#fff;
        border: 1px solid var(--alk-border);
        border-radius: 18px;
        padding: 1.55rem 1.55rem;
        box-shadow: 0 22px 56px rgba(0,0,0,.07);
    }
    .form-h{
        font-weight: 990;
        letter-spacing:-0.02em;
        margin-bottom: .25rem;
        color: var(--alk-ink);
    }
    .form-sub{
        color: var(--alk-muted);
        margin-bottom: 1.25rem;
        font-weight: 700;
    }

    @media (max-width: 991px){
        .hero-left{ padding: 2.25rem 1.25rem; }
        .hero-right{ min-height: 320px; }
        .feature{ text-align:center; }
        .cardx, .split .box{ text-align:left; }
    }