@import url('https://fonts.googleapis.com/css2?family=Mulish:wght@400;500;600&family=Nunito+Sans:wght@400;600;700;800&display=swap');

/* ==========================================================================
	STILE FRONTEND PUBBLICO - TESSERA ASSOCIATIVA
	File: /public_html/iscriviti/stile.css
========================================================================== */

:root{
    --sfondo:#eef3f8;
    --bianco:#ffffff;
    --testo:#0f172a;
    --testo-secondario:#475569;
    --bordo:#dbe4ee;
    --ombra:0 18px 48px rgba(15,23,42,.08);
	
    --blu-scuro:#0b4d83;
    --blu:#135d9c;
    --blu-chiaro:#eaf4ff;
	
    --verde:#157347;
    --verde-bg:#e9f8ef;
	
    --rosso:#b42318;
    --rosso-bg:#fff1f0;
	
    --arancio:#b45309;
    --arancio-bg:#fff7e8;
	
    --grigio-bg:#f8fbff;
    --nero-soft:#1e293b;
	
    --raggio-xl:24px;
    --raggio-lg:18px;
    --raggio-md:14px;
    --raggio-sm:10px;
	
    --transizione:all .22s ease;
    --max-larghezza:1180px;
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
    scroll-padding-top:104px;
}

#modulo-iscrizione,
#anteprima-tessera,
#scelta-pagamento,
#istruzioni-bonifico,
#tessera-finale{
    scroll-margin-top:104px;
}

body{
    margin:0;
    padding:0;
    background:var(--sfondo);
    color:var(--testo);
    font-family:'Nunito Sans', Arial, Helvetica, sans-serif;
    font-size:16px;
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}

body.firma-cropper-aperto,
body.menu-sito-aperto{
    overflow:hidden;
    overscroll-behavior:none;
}

img{
    max-width:100%;
    height:auto;
    display:block;
}

a{
    color:var(--blu-scuro);
    text-decoration:none;
}

a:hover{
    text-decoration:none;
}

button,
input,
select,
textarea{
    font:inherit;
}

.pagina{
    min-height:100vh;
}

.contenitore{
    width:min(var(--max-larghezza), calc(100% - 32px));
    margin:0 auto;
}

/* ==========================================================================
	MENU SITO STICKY
========================================================================== */

.menu-sito{
    position:sticky;
    top:0;
    z-index:1100;
    background:#efefef;
    border-bottom:none;
    box-shadow:none;
}

.menu-sito-barra{
    width:min(1840px, calc(100% - 48px));
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:34px;
    min-height:86px;
}

.menu-sito-logo{
    flex:0 0 auto;
    min-width:0;
}

.menu-sito-logo a{
    display:inline-flex;
    align-items:center;
    color:#000000;
    font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size:16px;
    line-height:1.2;
    font-weight:600;
    letter-spacing:0;
    text-transform:uppercase;
}

.menu-sito-logo a:hover{
    color:#000000;
}

.menu-sito-toggle{
    display:none;
    position:relative;
    align-items:center;
    justify-content:flex-start;
    width:auto;
    min-width:58px;
    min-height:44px;
    height:44px;
    margin-left:auto;
    padding:0 0 0 18px;
    border:none;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    cursor:pointer;
    color:#0066cc;
    transition:none;
}

.menu-sito-toggle span:nth-child(1){
    top:17px;
}

.menu-sito-toggle span:nth-child(2){
    top:21px;
}

.menu-sito-toggle span:nth-child(3){
    top:25px;
}

body.menu-sito-aperto .menu-sito-toggle span:nth-child(1),
body.menu-sito-aperto .menu-sito-toggle span:nth-child(2),
body.menu-sito-aperto .menu-sito-toggle span:nth-child(3){
    transform:none;
    opacity:1;
}

.menu-sito-nav{
    margin-left:auto;
}

.menu-sito-lista{
    display:flex;
    align-items:center;
    gap:34px;
    list-style:none;
    margin:0;
    padding:0;
}

.menu-sito-item{
    position:relative;
    margin:0;
    padding:0;
}

.menu-sito-item > a,
.menu-sito-voce-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:auto;
    padding:0;
    border:none;
    background:transparent;
    color:#000000;
    font-family:"Mulish","Muli",Arial,sans-serif;
    font-size:15px;
    line-height:1;
    font-weight:400;
    letter-spacing:0;
    text-transform:none;
    cursor:pointer;
    transition:none;
    white-space:nowrap;
}

.menu-sito-item > a:hover,
.menu-sito-voce-toggle:hover,
.menu-sito-item > a:focus-visible,
.menu-sito-voce-toggle:focus-visible{
    color:#000000;
    outline:none;
}

.menu-sito-item-con-figli > .menu-sito-voce-toggle::after{
    content:none;
}

.menu-sito-sottomenu{
    position:absolute;
    top:100%;
    left:0;
    min-width:240px;
    list-style:none;
    margin:16px 0 0 0;
    padding:10px 0;
    background:#ffffff;
    border:1px solid #dddddd;
    border-radius:0;
    box-shadow:none;
    opacity:0;
    visibility:hidden;
    transform:translateY(8px);
    transition:all .18s ease;
}

.menu-sito-sottomenu li{
    margin:0;
    padding:0;
}

.menu-sito-sottomenu a{
    display:block;
    padding:10px 16px;
    color:#000000;
    font-family:"Mulish","Muli",Arial,sans-serif;
    font-size:14px;
    line-height:1.35;
    font-weight:400;
    text-transform:none;
    white-space:normal;
}

.menu-sito-sottomenu a:hover,
.menu-sito-sottomenu a:focus-visible{
    background:#f5f5f5;
    color:#000000;
    outline:none;
}

.menu-sito-item-iscriviti{
    margin-left:0;
}

.menu-sito-item-iscriviti > a{
    min-height:auto;
    padding:4px 8px;
    border-radius:0;
    background:#ff4d00;
    color:#ffffff;
    font-family:"Mulish","Muli",Arial,sans-serif;
    font-size:13px;
    line-height:1;
    font-weight:600;
    box-shadow:none;
}

.menu-sito-item-iscriviti > a:hover,
.menu-sito-item-iscriviti > a:focus-visible{
    background:#ff4d00;
    color:#ffffff;
    filter:none;
}

.hero-con-menu{
    padding-top:18px;
}

@media (min-width: 1025px){
    .menu-sito-item-con-figli:hover > .menu-sito-sottomenu,
    .menu-sito-item-con-figli:focus-within > .menu-sito-sottomenu{
        opacity:1;
        visibility:visible;
        transform:translateY(0);
	}
}

@media (max-width: 1024px){
    .menu-sito-barra{
        width:min(100%, calc(100% - 24px));
        min-height:64px;
        gap:12px;
	}
	
    .menu-sito-toggle{
        display:inline-flex;
	}
	
    .menu-sito-nav{
        position:fixed;
        top:64px;
        left:0;
        right:0;
        margin-left:0;
        padding:8px 20px 18px;
        background:#efefef;
        border-top:none;
        box-shadow:none;
        max-height:calc(100dvh - 64px);
        overflow:auto;
        opacity:0;
        visibility:hidden;
        transform:translateY(-6px);
        transition:all .18s ease;
	}
	
    .menu-sito-nav[data-aperto="true"]{
        opacity:1;
        visibility:visible;
        transform:translateY(0);
	}
	
    .menu-sito-lista{
        flex-direction:column;
        align-items:flex-start;
        gap:0;
	}
	
    .menu-sito-item{
        width:100%;
	}
	
    .menu-sito-item > a,
    .menu-sito-voce-toggle{
        width:100%;
        min-height:auto;
        justify-content:space-between;
        padding:12px 0;
        border-bottom:none;
        text-align:left;
        color:#000000;
        font-family:"Mulish","Muli",Arial,sans-serif;
        font-size:15px;
        line-height:1.3;
        font-weight:400;
	}
	
    .menu-sito-item-con-figli > .menu-sito-voce-toggle::after{
        content:'';
        width:7px;
        height:7px;
        margin-left:12px;
        border-right:1.5px solid currentColor;
        border-bottom:1.5px solid currentColor;
        transform:rotate(45deg) translateY(-1px);
	}
	
    .menu-sito-item-con-figli.aperto > .menu-sito-voce-toggle::after{
        transform:rotate(-135deg) translateY(-1px);
	}
	
    .menu-sito-sottomenu{
        position:static;
        min-width:0;
        margin:2px 0 10px;
        padding:0 0 0 14px;
        border:none;
        border-radius:0;
        background:transparent;
        box-shadow:none;
        opacity:1;
        visibility:visible;
        transform:none;
        display:none;
	}
	
    .menu-sito-item-con-figli.aperto > .menu-sito-sottomenu{
        display:block;
	}
	
    .menu-sito-sottomenu a{
        margin-bottom:8px;
        padding:6px 0;
        border:none;
        border-radius:0;
        background:transparent;
        color:#000000;
        font-family:"Mulish","Muli",Arial,sans-serif;
        font-size:14px;
        line-height:1.4;
        font-weight:400;
	}
	
    .menu-sito-sottomenu a:hover,
    .menu-sito-sottomenu a:focus-visible{
        background:transparent;
        color:#000000;
	}
	
    .menu-sito-item-iscriviti{
        margin-left:0;
        padding-top:4px;
	}
	
    .menu-sito-item-iscriviti > a{
        display:inline-flex;
        width:auto;
        min-height:auto;
        padding:4px 8px;
        margin-top:4px;
        justify-content:flex-start;
        border:none;
	}
	
    .hero-con-menu{
        padding-top:18px;
	}
}

@media (max-width: 640px){
    .menu-sito{
        box-shadow:none;
	}
	
    .menu-sito-barra{
        width:calc(100% - 20px);
        min-height:56px;
        gap:10px;
	}
	
    .menu-sito-logo a{
        font-size:14px;
        line-height:1.2;
	}
	
	.menu-sito-toggle{
		min-width:54px;
		min-height:44px;
		height:44px;
		padding-left:17px;
	}
	
	.menu-sito-toggle::after{
		font-size:15px;
	}
	
	.menu-sito-toggle span{
		width:11px;
	}
	
	.menu-sito-toggle span:nth-child(1){
		top:17px;
	}
	
	.menu-sito-toggle span:nth-child(2){
		top:21px;
	}
	
	.menu-sito-toggle span:nth-child(3){
		top:25px;
	}
	
    .menu-sito-nav{
        top:56px;
        max-height:calc(100dvh - 56px);
        padding:6px 14px 16px;
        background:#efefef;
	}
	
    .menu-sito-item > a,
    .menu-sito-voce-toggle{
        padding:11px 0;
        font-size:14px;
	}
	
    .menu-sito-sottomenu{
        padding-left:12px;
	}
	
    .menu-sito-sottomenu a{
        padding:5px 0;
        font-size:13px;
        line-height:1.4;
	}
	
    .hero-con-menu{
        padding-top:18px;
	}
}

/* ==========================================================================
	HERO
========================================================================== */

.hero{
    position:relative;
    padding:28px 0 18px;
    background:
	radial-gradient(circle at 14% 0%, rgba(247,244,28,.18), transparent 22%),
	radial-gradient(circle at top right, rgba(255,255,255,.18), transparent 34%),
	linear-gradient(135deg, #082f52 0%, #0b4d83 45%, #1671b8 100%);
}

.hero-box{
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.14);
    border-radius:28px;
    padding:28px 28px;
    box-shadow:0 18px 44px rgba(0,0,0,.16);
    backdrop-filter:blur(7px);
    -webkit-backdrop-filter:blur(7px);
}

.hero-mini{
    margin:0 0 12px 0;
    font-size:13px;
    font-weight:800;
    letter-spacing:.13em;
    text-transform:uppercase;
    color:#d7ecff;
}

.hero h1{
    margin:0 0 14px 0;
    color:#ffffff;
    font-size:clamp(32px, 4vw, 48px);
    line-height:1.06;
}

.hero-associazione{
    margin:0 0 20px 0;
    color:#dff0ff;
    font-size:18px;
    line-height:1.35;
    font-weight:700;
}

.hero-testo{
    color:#f8fbff;
    font-size:16px;
    line-height:1.78;
    max-width:900px;
}

.hero-iscrizione-impatto{
    overflow:hidden;
    isolation:isolate;
}

.hero-box-impatto{
    position:relative;
    overflow:hidden;
    isolation:isolate;
    padding:34px 34px 28px;
    border-radius:30px;
    background:
	linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.04)),
	linear-gradient(135deg, rgba(10,61,104,.16), rgba(11,77,131,.04));
    border:1px solid rgba(255,255,255,.16);
    box-shadow:0 24px 62px rgba(3,18,31,.22);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}

.hero-box-impatto::before{
    content:"";
    position:absolute;
    top:-24%;
    left:-10%;
    width:44%;
    height:62%;
    background:radial-gradient(circle, rgba(255,255,255,.22) 0%, rgba(255,255,255,.10) 38%, rgba(255,255,255,0) 74%);
    opacity:.78;
    pointer-events:none;
    animation:heroBoxGlow 10s ease-in-out infinite;
}

.hero-box-impatto::after{
    content:"";
    position:absolute;
    right:-12%;
    bottom:-38%;
    width:46%;
    height:78%;
    background:radial-gradient(circle, rgba(247,244,28,.16) 0%, rgba(247,244,28,.08) 36%, rgba(247,244,28,0) 72%);
    opacity:.90;
    pointer-events:none;
    animation:heroBoxGlow 12s ease-in-out infinite reverse;
}

.hero-box-impatto-compatta{
    padding-right:30px;
}

.hero-layout{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0, 1.16fr) minmax(190px, .74fr);
    gap:18px;
    align-items:center;
}

.hero-layout-compatto{
    grid-template-columns:minmax(0, 1.18fr) minmax(190px, .72fr);
    gap:16px;
}

.hero-colonna-testi{
    position:relative;
    z-index:2;
    max-width:620px;
}

.hero-box-impatto .hero-mini{
    display:block;
    width:max-content;
    margin:0 0 14px 0;
    padding:0 0 8px 0;
    border-radius:0;
    background:none;
    border:0;
    border-bottom:2px solid rgba(247,244,28,.72);
    box-shadow:none;
    color:#fff2a5;
}

.hero-box-impatto h1{
    margin-bottom:12px;
    text-shadow:0 10px 30px rgba(0,0,0,.18);
}

.hero-box-impatto .hero-associazione{
    margin-bottom:12px;
    color:#f5fbff;
}

.hero-sottotitolo{
    margin:0 0 10px 0;
    color:#ffffff;
    font-size:clamp(18px, 2vw, 22px);
    line-height:1.32;
    font-weight:800;
    max-width:680px;
}

.hero-frase-impatto{
    margin:0 0 14px 0;
    max-width:620px;
    color:rgba(255,255,255,.86);
    font-size:16px;
    line-height:1.58;
}

.hero-quote-inline{
    display:grid;
    gap:10px;
    margin:0 0 18px 0;
}

.hero-quote-inline-label{
    display:block;
    color:#fff2a5;
    font-size:12px;
    font-weight:800;
    letter-spacing:.14em;
    text-transform:uppercase;
}

.hero-quote-inline-lista{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.hero-quote-inline-item{
    display:flex;
    flex-direction:column;
    gap:4px;
    min-width:164px;
    padding:12px 14px;
    border-radius:18px;
    background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.08));
    border:1px solid rgba(255,255,255,.16);
    box-shadow:0 14px 30px rgba(3,18,31,.12);
}

.hero-quote-inline-item-evidenza{
    background:
	radial-gradient(circle at top right, rgba(247,244,28,.16), rgba(247,244,28,0) 44%),
	linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.08));
    border-color:rgba(247,244,28,.48);
    box-shadow:
	0 18px 34px rgba(3,18,31,.16),
	0 0 0 1px rgba(247,244,28,.18) inset;
}

.hero-quote-inline-nome{
    color:#fdfefe;
    font-size:14px;
    line-height:1.3;
    font-weight:800;
}

.hero-quote-inline-valore{
    color:#ffffff;
    font-size:28px;
    line-height:1;
    font-weight:800;
    letter-spacing:-.03em;
}

.hero-colonna-brand{
    position:relative;
    z-index:2;
    display:flex;
    justify-content:center;
    align-items:center;
    min-width:0;
    padding-right:0;
}

.hero-brand-logo-box{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:min(100%, 340px);
    aspect-ratio:1 / 1;
    margin:0 auto;
    isolation:isolate;
}

.hero-brand-logo-box::before{
    content:"";
    position:absolute;
    inset:4%;
    z-index:1;
    border-radius:999px;
    background:
	radial-gradient(circle at center,
	rgba(255,255,230,.99) 0%,
	rgba(255,252,185,.98) 14%,
	rgba(255,246,90,.92) 30%,
	rgba(247,244,28,.62) 50%,
	rgba(247,244,28,.28) 70%,
	rgba(247,244,28,.10) 82%,
	rgba(247,244,28,0) 92%);
    box-shadow:
	0 0 68px rgba(247,244,28,.62),
	0 0 138px rgba(247,244,28,.42),
	0 0 220px rgba(247,244,28,.24);
    filter:blur(14px);
    opacity:.24;
    transform:translate3d(0, 0, 0) scale(.82);
    transform-origin:center center;
    will-change:transform, opacity;
    pointer-events:none;
    animation:heroLogoPulse 4.6s cubic-bezier(.37,0,.23,1) infinite;
}

.hero-brand-logo-box::after,
.hero-brand-logo-glow{
    display:none;
}

.hero-brand-logo{
    position:relative;
    z-index:2;
    width:100%;
    max-width:292px;
    object-fit:contain;
    transform-origin:center center;
    transform:translate3d(0, 0, 0) rotate(-2deg) scale(1.04);
    filter:drop-shadow(0 22px 38px rgba(0,0,0,.22));
    -webkit-mask-image:none;
    mask-image:none;
    animation:none;
}

.hero-pagamenti{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px 12px;
    padding-top:4px;
}

.hero-pagamenti-label{
    display:inline;
    padding:0;
    border-radius:0;
    background:none;
    border:0;
    color:#fff2a5;
    font-size:12px;
    font-weight:800;
    letter-spacing:.14em;
    text-transform:uppercase;
}

.hero-pagamenti-lista{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:0;
}

.hero-pagamento-pill{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0;
    border-radius:0;
    background:none;
    border:0;
    color:rgba(255,255,255,.9);
    font-size:15px;
    font-weight:700;
    box-shadow:none;
}

.hero-pagamento-pill:not(:last-child){
    margin-right:14px;
    padding-right:14px;
}

.hero-pagamento-pill:not(:last-child)::after{
    content:"•";
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
    color:rgba(247,244,28,.82);
    font-size:12px;
}

.hero-colonna-quote{
    position:relative;
}

.hero-quote-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(170px, 1fr));
    gap:16px;
}

.hero-quota-card{
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    min-height:150px;
    padding:22px 20px;
    border-radius:22px;
    background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.08));
    border:1px solid rgba(255,255,255,.22);
    box-shadow:0 20px 44px rgba(3,18,31,.18);
    transform:translate3d(0, 0, 0);
    animation:heroCardFloat 6s ease-in-out infinite;
}

.hero-quota-card:nth-child(2){
    animation-delay:.55s;
}

.hero-quota-card:nth-child(3){
    animation-delay:1.1s;
}

.hero-quota-card-evidenza{
    background:
	radial-gradient(circle at top right, rgba(247,244,28,.16), rgba(247,244,28,0) 48%),
	linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.08));
    border-color:rgba(247,244,28,.62);
    box-shadow:
	0 28px 58px rgba(3,18,31,.24),
	0 0 0 1px rgba(247,244,28,.22) inset;
    animation-name:heroCardFloatElevata;
}

.hero-quota-label{
    margin:0 0 16px 0;
    color:#fdfefe;
    font-size:15px;
    line-height:1.35;
    font-weight:800;
}

.hero-quota-importo{
    margin:0;
    color:#ffffff;
    font-size:clamp(34px, 5vw, 46px);
    line-height:1;
    font-weight:800;
    letter-spacing:-.03em;
}

.hero-quota-meta{
    margin:14px 0 0 0;
    color:rgba(255,255,255,.72);
    font-size:13px;
    line-height:1.35;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:700;
}

.hero-sfondo-brand{
    position:absolute;
    inset:0;
    z-index:1;
    overflow:hidden;
    pointer-events:none;
}

.hero-brand-glow{
    position:absolute;
    border-radius:999px;
    transform:translate3d(0, 0, 0);
    will-change:transform, opacity;
}

.hero-brand-glow-1{
    top:-130px;
    right:-90px;
    width:430px;
    height:430px;
    background:radial-gradient(circle, rgba(247,244,28,.24) 0%, rgba(247,244,28,.10) 38%, rgba(247,244,28,0) 72%);
    animation:heroGlow 8s ease-in-out infinite;
}

.hero-brand-glow-2{
    left:-120px;
    bottom:-170px;
    width:360px;
    height:360px;
    background:radial-gradient(circle, rgba(255,255,255,.18) 0%, rgba(255,255,255,.06) 34%, rgba(255,255,255,0) 72%);
    animation:heroGlow 9s ease-in-out infinite reverse;
}

.hero-brand-linea{
    position:absolute;
    border-radius:999px;
    opacity:.58;
    transform:rotate(-18deg);
    will-change:transform, opacity;
}

.hero-brand-linea-1{
    top:86px;
    right:226px;
    width:176px;
    height:10px;
    background:linear-gradient(90deg, rgba(247,244,28,.56), rgba(247,244,28,0));
    animation:heroLinea 7s ease-in-out infinite;
}

.hero-brand-linea-2{
    top:124px;
    right:182px;
    width:132px;
    height:8px;
    background:linear-gradient(90deg, rgba(247,244,28,.42), rgba(247,244,28,0));
    animation:heroLinea 8s ease-in-out infinite reverse;
}

.hero-brand-pixel{
    position:absolute;
    border-radius:8px;
    background:linear-gradient(135deg, #f7f41c 0%, #fff36a 100%);
    box-shadow:0 14px 30px rgba(5,18,32,.18);
    opacity:.84;
    transform:translate3d(0, 0, 0);
    will-change:transform;
    animation:heroPixelDrift 7.2s ease-in-out infinite;
}

.hero-brand-pixel-1{
    top:18px;
    right:188px;
    width:64px;
    height:64px;
}

.hero-brand-pixel-2{
    top:24px;
    right:110px;
    width:48px;
    height:48px;
    animation-delay:.4s;
}

.hero-brand-pixel-3{
    top:34px;
    right:52px;
    width:30px;
    height:30px;
    animation-delay:.9s;
}

.hero-brand-pixel-4{
    top:16px;
    right:12px;
    width:14px;
    height:14px;
    animation-delay:1.2s;
}

.hero-brand-pixel-5{
    top:92px;
    right:150px;
    width:56px;
    height:56px;
    animation-delay:.55s;
}

.hero-brand-pixel-6{
    top:104px;
    right:82px;
    width:38px;
    height:38px;
    animation-delay:1.15s;
}

.hero-brand-pixel-7{
    top:156px;
    right:124px;
    width:64px;
    height:64px;
    animation-delay:.8s;
}

.hero-brand-pixel-8{
    top:42px;
    right:0;
    width:12px;
    height:12px;
    animation-delay:1.45s;
}

.hero-brand-fiore{
    display:none;
}

@keyframes heroGlow{
    0%, 100%{
		transform:translate3d(0, 0, 0) scale(1);
		opacity:.78;
	}
    50%{
		transform:translate3d(0, -12px, 0) scale(1.06);
		opacity:1;
	}
}

@keyframes heroLinea{
    0%, 100%{
		transform:translate3d(0, 0, 0) rotate(-18deg);
		opacity:.42;
	}
    50%{
		transform:translate3d(12px, -6px, 0) rotate(-18deg);
		opacity:.82;
	}
}

@keyframes heroPixelDrift{
    0%, 100%{
		transform:translate3d(0, 0, 0) rotate(0deg);
	}
    50%{
		transform:translate3d(0, -12px, 0) rotate(4deg);
	}
}

@keyframes heroCardFloat{
    0%, 100%{
		transform:translate3d(0, 0, 0);
	}
    50%{
		transform:translate3d(0, -8px, 0);
	}
}

@keyframes heroCardFloatElevata{
    0%, 100%{
		transform:translate3d(0, -8px, 0);
	}
    50%{
		transform:translate3d(0, -16px, 0);
	}
}

@keyframes heroBoxGlow{
    0%, 100%{
		transform:translate3d(0, 0, 0) scale(1);
		opacity:.70;
	}
    50%{
		transform:translate3d(14px, -10px, 0) scale(1.08);
		opacity:1;
	}
}

@keyframes heroLogoFrameFloat{
    0%, 100%{
		transform:translate3d(0, 0, 0) rotate(-4deg) scale(1);
	}
    50%{
		transform:translate3d(0, -10px, 0) rotate(-1deg) scale(1.04);
	}
}

@keyframes heroLogoHalo{
    0%, 100%{
		transform:translate3d(0, 0, 0) scale(1);
		opacity:.82;
	}
    50%{
		transform:translate3d(0, -12px, 0) scale(1.12);
		opacity:1;
	}
}

@keyframes heroLogoPulse{
    0%, 100%{
		transform:translate3d(0, 0, 0) scale(.82);
		opacity:.08;
	}
    50%{
		transform:translate3d(0, 0, 0) scale(1.34);
		opacity:.58;
	}
}

@keyframes heroFiore{
    0%, 100%{
		transform:translate3d(0, 0, 0) rotate(0deg);
	}
    50%{
		transform:translate3d(0, -10px, 0) rotate(8deg);
	}
}

@media (max-width: 980px){
    .hero-layout{
		grid-template-columns:1fr;
		gap:24px;
	}
    
    .hero-layout-compatto{
		grid-template-columns:1fr;
		gap:0;
	}
    
    .hero-colonna-testi{
		max-width:none;
	}
    
    .hero-colonna-brand{
		position:absolute;
		top:6px;
		right:6px;
		z-index:1;
		width:148px;
		justify-content:flex-end;
		align-items:flex-start;
		pointer-events:none;
		opacity:.34;
	}
    
    .hero-brand-logo-box{
		width:148px;
		aspect-ratio:auto;
	}
    
	.hero-brand-logo-box::before{
		content:"";
		position:absolute;
		inset:8%;
		z-index:1;
		border-radius:999px;
		background:
		radial-gradient(circle at center,
		rgba(255,255,230,.99) 0%,
		rgba(255,252,185,.98) 14%,
		rgba(255,246,90,.92) 30%,
		rgba(247,244,28,.64) 50%,
		rgba(247,244,28,.30) 70%,
		rgba(247,244,28,.10) 82%,
		rgba(247,244,28,0) 92%);
		box-shadow:
		0 0 42px rgba(247,244,28,.58),
		0 0 86px rgba(247,244,28,.38),
		0 0 142px rgba(247,244,28,.22);
		filter:blur(10px);
		opacity:.24;
		transform:translate3d(0, 0, 0) scale(.82);
		transform-origin:center center;
		will-change:transform, opacity;
		pointer-events:none;
		animation:heroLogoPulse 4.6s cubic-bezier(.37,0,.23,1) infinite;
	}
	
	.hero-brand-logo-box::after,
	.hero-brand-logo-glow{
		display:none;
	}
    
    .hero-brand-logo{
		max-width:148px;
		transform:none;
		-webkit-mask-image:none;
		mask-image:none;
	}
}

@media (prefers-reduced-motion: reduce){
    .hero-iscrizione-impatto *,
    .hero-iscrizione-impatto *::before,
    .hero-iscrizione-impatto *::after{
		animation:none !important;
		transition:none !important;
		scroll-behavior:auto !important;
	}
}

/* ==========================================================================
	SEZIONI / SCHEDE
========================================================================== */

main.contenitore{
    padding:30px 0 48px;
}

.scheda{
    background:var(--bianco);
    border:1px solid var(--bordo);
    border-radius:var(--raggio-xl);
    box-shadow:var(--ombra);
    padding:32px;
    margin-bottom:28px;
}

.scheda-riepilogo{
    border-top:5px solid var(--blu-scuro);
}

.scheda-finale{
    border-top:5px solid var(--verde);
}

.scheda-intestazione{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px 20px;
    margin-bottom:26px;
}

.scheda-intestazione-verticale{
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    gap:10px;
}

.scheda-intestazione h2{
    margin:0;
    font-size:28px;
    line-height:1.15;
    color:var(--testo);
}

.scheda-intestazione p{
    margin:6px 0 0 0;
    color:var(--testo-secondario);
    font-size:16px;
    line-height:1.7;
    max-width:860px;
}

.scheda-intestazione-verticale p{
    margin:0;
    max-width:none;
}

/* ==========================================================================
	AVVISI
========================================================================== */

.avviso{
    border-radius:16px;
    padding:16px 18px;
    margin:10px 0 18px 0;
    border:1px solid transparent;
    font-weight:600;
    line-height:1.6;
    box-shadow:0 8px 24px rgba(15,23,42,.04);
}

.avviso-successo{
    background:var(--verde-bg);
    border-color:#b6e3c7;
    color:#0f5d35;
}

.avviso-errore{
    background:var(--rosso-bg);
    border-color:#f1c4bf;
    color:var(--rosso);
}

.avviso-warning{
    background:var(--arancio-bg);
    border-color:#f3d6a0;
    color:var(--arancio);
}

.avviso-info{
    background:#edf6ff;
    border-color:#cfe4fb;
    color:#0f4772;
}

/* ==========================================================================
	BADGE
========================================================================== */

.badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    padding:8px 14px;
    border-radius:999px;
    font-size:14px;
    font-weight:800;
    letter-spacing:.01em;
    white-space:nowrap;
}

.badge-verde{
    background:var(--verde-bg);
    color:#0f6b3d;
    border:1px solid #bde3ca;
}

.badge-rosso{
    background:var(--rosso-bg);
    color:var(--rosso);
    border:1px solid #efc3be;
}

.badge-arancio{
    background:var(--arancio-bg);
    color:var(--arancio);
    border:1px solid #f0d7a7;
}

.badge-blu{
    background:#edf6ff;
    color:#0f4f83;
    border:1px solid #cde2f7;
}

/* ==========================================================================
	RIEPILOGO
========================================================================== */

.riepilogo-griglia{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:16px;
}

.riepilogo-item{
    background:var(--grigio-bg);
    border:1px solid var(--bordo);
    border-radius:18px;
    padding:16px;
    min-height:96px;
}

.riepilogo-etichetta{
    display:block;
    margin:0 0 8px 0;
    color:var(--testo-secondario);
    font-size:14px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.riepilogo-item strong{
    display:block;
    color:var(--testo);
    font-size:19px;
    line-height:1.32;
    word-break:break-word;
}

.codice-accesso{
    font-family:"Courier New", monospace;
    font-size:15px !important;
}

/* ==========================================================================
	MODULO
========================================================================== */

.modulo{
    display:block;
}

.griglia-campi{
    display:grid;
    grid-template-columns:repeat(12, minmax(0, 1fr));
    column-gap:18px;
    row-gap:12px;
    align-items:start;
}

.intestazione-sezione-modulo{
    grid-column:1 / -1;
    padding-top:6px;
    margin-top:0;
}

.griglia-campi > .intestazione-sezione-modulo:not(:first-child){
    margin-top:8px;
    padding-top:18px;
    border-top:1px solid #e6edf5;
}

.intestazione-sezione-modulo h3{
    margin:0 0 8px 0;
    font-size:20px;
    line-height:1.24;
    color:var(--testo);
}

.intestazione-sezione-modulo p{
    margin:0;
    color:var(--testo-secondario);
    font-size:15px;
    line-height:1.68;
    max-width:760px;
}

.campo{
    display:flex;
    flex-direction:column;
    gap:8px;
    grid-column:span 6;
    min-width:0;
    scroll-margin-top:104px;
}

.checkbox-campo{
    margin-top:18px;
    background:#f8fbff;
    border:1px solid var(--bordo);
    border-radius:20px;
    padding:10px;
    scroll-margin-top:104px;
}

.campo label{
    color:var(--nero-soft);
    font-size:15px;
    line-height:1.35;
    font-weight:800;
}

.campo input[type="text"],
.campo input[type="email"],
.campo input[type="date"],
.campo select{
    width:100%;
    min-height:56px;
    padding:15px 16px;
    border:1px solid #c7d3df;
    border-radius:15px;
    background:#ffffff;
    color:var(--testo);
    outline:none;
    transition:var(--transizione);
    box-sizing:border-box;
    font-size:15px;
    line-height:1.4;
}

.data-nascita-griglia{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:8px;
    align-items:start;
    min-width:0;
}

.data-nascita-griglia select{
    width:100%;
    min-width:0;
    padding-left:12px;
    padding-right:34px;
    font-size:15px;
}

.campo input[type="file"]{
    width:100%;
    min-height:76px;
    padding:14px 15px;
    border:2px dashed #bfd2e6;
    border-radius:16px;
    background:linear-gradient(180deg, #fbfdff 0%, #f4f9ff 100%);
    color:var(--testo);
    outline:none;
    transition:var(--transizione);
    cursor:pointer;
    box-sizing:border-box;
    font-size:15px;
    line-height:1.45;
}

.campo input[type="file"]:hover{
    border-color:#7eabd3;
    background:linear-gradient(180deg, #fafdff 0%, #eef6ff 100%);
}

.campo input[type="file"]:focus{
    border-color:#6eaee3;
    box-shadow:0 0 0 4px rgba(17,93,156,.11);
}

.campo input[type="file"]::file-selector-button{
    margin-right:12px;
    padding:10px 14px;
    border:none;
    border-radius:12px;
    background:linear-gradient(180deg, #1567aa 0%, #0b4d83 100%);
    color:#ffffff;
    font-weight:800;
    cursor:pointer;
    transition:var(--transizione);
}

.campo input[type="file"]::file-selector-button:hover{
    filter:brightness(1.03);
}

.campo input:focus,
.campo select:focus{
    border-color:#6eaee3;
    box-shadow:0 0 0 4px rgba(17,93,156,.11);
}

.campo-con-errore label{
    color:#8d251c;
}

.campo-con-errore input[type="text"],
.campo-con-errore input[type="email"],
.campo-con-errore input[type="date"],
.campo-con-errore input[type="file"],
.campo-con-errore select,
.campo-con-errore .firma-upload-box{
    border-color:#e09a92;
    box-shadow:0 0 0 4px rgba(185,28,28,.08);
    background:#fffdfd;
}

.campo-con-errore #foto-viso-nome-file,
.campo-con-errore #foto-firma-nome-file{
    color:#8d251c !important;
}

.campo-con-errore .nota-campo,
.campo-con-errore .firma-upload-help{
    color:#8d251c;
}

.nota-campo{
    margin-top:4px;
    color:var(--testo-secondario);
    font-size:14px;
    line-height:1.65;
}

.firma-upload-box{
    display:block;
    margin-top:6px;
    padding:18px 18px;
    min-height:88px;
    border:2px dashed #bfd2e6;
    border-radius:16px;
    background:linear-gradient(180deg, #fbfdff 0%, #f4f9ff 100%);
}

.firma-upload-contenuto{
    display:flex;
    flex-direction:column;
    gap:10px;
    min-width:0;
    flex:1 1 auto;
}

.controllo-upload-guidato{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:14px;
    margin-top:2px;
}

.firma-upload-box .controllo-upload-guidato{
    align-items:center;
    gap:14px;
    margin-top:0;
}

.controllo-upload-guidato .bottone{
    min-width:170px;
}

.firma-upload-box .controllo-upload-guidato .bottone{
    width:144px;
    flex:0 0 144px;
    min-width:144px;
    min-height:46px;
    padding:10px 16px;
    border:none;
    border-radius:12px;
    background:linear-gradient(180deg, #1567aa 0%, #0b4d83 100%);
    color:#ffffff;
    font-size:14px;
    line-height:1.2;
    font-weight:800;
    letter-spacing:0;
    box-shadow:none;
}

.firma-upload-box .controllo-upload-guidato .bottone:hover{
    background:linear-gradient(180deg, #1567aa 0%, #0b4d83 100%);
    filter:brightness(1.03);
}

.firma-upload-box .controllo-upload-guidato .bottone:focus{
    box-shadow:0 0 0 4px rgba(17,93,156,.11);
}

#foto-viso-nome-file,
#foto-firma-nome-file{
    display:block;
    flex:1 1 auto;
    min-width:0;
    color:var(--testo);
    font-size:15px;
    font-weight:600;
    line-height:1.5;
    word-break:break-word;
}

.firma-upload-help{
    margin:0;
    color:var(--testo-secondario);
    font-size:14px;
    line-height:1.65;
}

.finestra-guida-firma .finestra-crop-firma__box{
    width:min(920px, calc(100vw - 24px));
    height:auto;
    max-height:min(92dvh, 860px);
    display:block;
    overflow:auto;
    padding:30px;
    border-radius:30px;
}

.finestra-guida-firma .guida-firma-step{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.finestra-guida-firma .guida-firma-step[hidden]{
    display:none !important;
}

.finestra-guida-firma .guida-firma-step > p{
    display:inline-flex;
    align-items:center;
    width:fit-content;
    min-height:34px;
    padding:6px 12px;
    border-radius:999px;
    background:#f2f6fb;
    color:#48607a;
    font-size:13px;
    line-height:1.2;
    font-weight:800;
    letter-spacing:.05em;
    text-transform:uppercase;
}

.finestra-guida-firma .guida-firma-step > p strong{
    color:inherit;
    font-weight:800;
}

.finestra-guida-firma .guida-firma-step h3{
    margin:0;
    color:var(--testo);
    font-size:clamp(28px, 3vw, 36px);
    line-height:1.12;
    font-weight:800;
    letter-spacing:-.02em;
}

.finestra-guida-firma .guida-firma-step p{
    margin:0;
}

.finestra-guida-firma .guida-firma-step .firma-cropper-azioni{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:6px;
}

.finestra-guida-firma .guida-firma-step .firma-cropper-azioni .bottone{
    flex:1 1 220px;
    min-height:50px;
    padding:12px 14px;
    font-size:14px;
    line-height:1.25;
}

.guida-firma-box-secondario{
    margin-top:18px;
    padding:24px;
    border:1px solid #dce7f1;
    border-radius:22px;
    background:linear-gradient(180deg, #fcfdff 0%, #f5f9fd 100%);
    box-shadow:0 10px 24px rgba(15,23,42,.04);
}

.guida-firma-box-secondario > strong{
    display:block;
    margin-bottom:12px;
    color:#132336;
    font-size:18px;
    line-height:1.4;
    font-weight:800;
}

.guida-firma-box-secondario p{
    margin:0;
    color:#526274;
    font-size:15px;
    line-height:1.72;
    font-weight:600;
}

.guida-firma-box-secondario p strong{
    display:inline;
    margin:0;
    color:#132336;
    font-size:inherit;
    line-height:inherit;
    font-weight:800;
}

.guida-firma-box-secondario + .guida-firma-box-secondario{
    margin-top:16px;
}

.guida-firma-icona-smartphone-wrap{
    margin:18px 0 16px;
    display:flex;
    justify-content:center;
}

.guida-firma-icona-smartphone{
    display:block;
    width:min(350px, 100%);
    height:auto;
    border-radius:22px;
    border:1px solid #d8e6f3;
    background:#ffffff;
    box-shadow:0 14px 30px rgba(15,23,42,.08);
}

.guida-firma-link-box{
    margin-top:18px;
    padding:22px 24px;
    border:1px dashed #b8cde2;
    border-radius:22px;
    background:#ffffff;
}

.guida-firma-link{
    display:block;
    padding:15px 16px;
    border-radius:16px;
    background:#f8fbff;
    border:1px solid #d8e6f3;
    word-break:break-all;
    color:#0f4f83;
    font-size:15px;
    font-weight:700;
    line-height:1.65;
    text-decoration:none;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}

.guida-firma-link:hover{
    text-decoration:underline;
}

.guida-firma-qr-wrap{
    margin-top:20px;
    display:flex;
    justify-content:center;
}

.guida-firma-qr-box{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:min(290px, 100%);
    min-height:290px;
    padding:18px;
    border:1px solid #d9e7f4;
    border-radius:24px;
    background:#ffffff;
    box-shadow:0 14px 30px rgba(15,23,42,.06);
}

.guida-firma-qr-box img{
    display:block;
    max-width:100%;
    height:auto;
}

.guida-firma-istruzioni{
    margin:20px 0 0;
    padding:20px 22px;
    border:1px solid #dce7f1;
    border-radius:22px;
    background:linear-gradient(180deg, #fbfdff 0%, #f5f9fd 100%);
}

.guida-firma-istruzioni strong{
    display:block;
    margin-bottom:10px;
    color:#132336;
    font-size:18px;
    line-height:1.4;
    font-weight:800;
}

.guida-firma-istruzioni p{
    margin:0;
    color:#526274;
    font-size:15px;
    line-height:1.72;
    font-weight:600;
}

.attesa-firma-pc{
    margin-top:20px;
    padding:28px 24px;
    border:1px solid #d7e6f3;
    border-radius:24px;
    background:linear-gradient(180deg, #fafdff 0%, #edf6ff 100%);
    text-align:center;
    box-shadow:0 14px 30px rgba(15,23,42,.05);
}

.attesa-firma-pc strong{
    display:block;
    margin-bottom:0;
    color:#132336;
    font-size:20px;
    line-height:1.32;
    font-weight:800;
}

.attesa-firma-pc-countdown{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:18px;
    padding:12px 18px;
    border-radius:999px;
    background:#ffffff;
    border:1px solid #cfe0ef;
    color:#0b4d83;
    font-size:17px;
    font-weight:800;
    box-shadow:0 6px 16px rgba(11,77,131,.08);
}

.guida-firma-timeout .firma-cropper-azioni{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:18px;
}

.guida-firma-timeout .firma-cropper-azioni .bottone{
    flex:1 1 220px;
}

.firma-guida-aperta{
    overflow:hidden;
}

.analisi-file{
    display:flex;
    align-items:center;
    gap:10px;
    margin-top:10px;
    padding:12px 14px;
    border:1px solid #cfe0f2;
    border-radius:14px;
    background:linear-gradient(180deg, #f7fbff 0%, #edf6ff 100%);
    color:#0f4772;
    font-size:14px;
    font-weight:700;
    line-height:1.45;
}

.analisi-file[hidden]{
    display:none !important;
}

.analisi-file-spinner{
    width:18px;
    height:18px;
    border-radius:50%;
    border:3px solid rgba(11,77,131,.18);
    border-top-color:#0b4d83;
    animation:rotazione-loader-foto .8s linear infinite;
    flex:0 0 auto;
}

.errore-campo{
    display:block;
    margin-top:4px;
    color:var(--rosso);
    font-size:14px;
    font-weight:700;
    line-height:1.45;
    min-height:20px;
}

#campo-foto_viso .errore-campo-evidente,
#campo-foto_firma .errore-campo-evidente{
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin-top:10px;
    padding:12px 14px;
    border:2px solid #111111;
    border-radius:14px;
    background:#fff34d;
    color:#111111;
    font-size:13px;
    font-weight:800;
    line-height:1.45;
    min-height:0;
    box-shadow:0 10px 22px rgba(255, 221, 0, .28);
    animation:richiamo-errore-foto .95s ease-in-out infinite alternate;
}

#campo-foto_viso .errore-campo-evidente::before,
#campo-foto_firma .errore-campo-evidente::before{
    content:'!';
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:20px;
    height:20px;
    border-radius:999px;
    background:#111111;
    color:#fff34d;
    font-size:13px;
    font-weight:900;
    line-height:1;
    flex:0 0 20px;
    margin-top:1px;
}

.firma-preview-crop{
    margin-top:14px;
    padding:16px 18px;
    border:1px solid #dbe4ee;
    border-radius:18px;
    background:#ffffff;
    box-shadow:0 10px 24px rgba(15,23,42,.05);
}

@keyframes rotazione-loader-foto{
    from{
        transform:rotate(0deg);
	}
    to{
        transform:rotate(360deg);
	}
}

@keyframes richiamo-errore-foto{
    from{
        transform:scale(1);
        box-shadow:0 10px 22px rgba(255, 221, 0, .24);
	}
    to{
        transform:scale(1.012);
        box-shadow:0 14px 28px rgba(255, 221, 0, .40);
	}
}

.firma-preview-crop strong{
    display:block;
    margin-bottom:6px;
    color:#0f172a;
}

.firma-preview-crop span{
    display:block;
    color:var(--testo-secondario);
    line-height:1.55;
    font-size:14px;
}

.firma-preview-crop img{
    display:block;
    max-width:100%;
    max-height:140px;
    margin:14px auto 0;
    border-radius:12px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
}

#foto-viso-preview{
    background:linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

#foto-viso-preview img{
    width:100%;
    max-width:260px;
    max-height:260px;
    object-fit:contain;
    aspect-ratio:1 / 1;
}

#firma-preview-crop img,
#firma-preview-crop-img{
    max-height:140px;
    width:auto;
    object-fit:contain;
}

.firma-preview-crop-azioni{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-start;
    gap:10px;
    margin-top:14px;
}

#firma-remota-scatta,
#firma-remota-galleria{
    min-width:190px;
    flex:0 0 auto;
}

#firma-remota-nome-file{
    display:block;
    flex:1 1 100%;
    min-width:0;
    margin-top:2px;
    color:#4a5f76;
    font-size:15px;
    line-height:1.6;
    font-weight:700;
    word-break:break-word;
}

#firma-remota-preview{
    margin-top:16px;
    padding:18px 20px;
    border:1px solid #dbe7f3;
    border-radius:20px;
    background:linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
    box-shadow:0 12px 28px rgba(15,23,42,.05);
}

#firma-remota-preview strong{
    display:block;
    margin-bottom:8px;
    font-size:16px;
    color:#132336;
}

#firma-remota-preview span{
    display:block;
    color:#526274;
    font-size:14px;
    line-height:1.65;
}

#firma-remota-preview img,
#firma-remota-preview-img{
    max-height:220px;
    width:auto;
    margin:16px auto 0;
    object-fit:contain;
    border-radius:14px;
    border:1px solid #dfe8f1;
    background:linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

#firma-remota-esito{
    margin-top:16px;
}

#firma-remota-loader{
    margin-top:12px;
}

.finestra-crop-firma{
    position:fixed;
    inset:0;
    z-index:9999;
    background:rgba(15,23,42,.72);
    backdrop-filter:blur(3px);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:8px;
}

.finestra-crop-firma[hidden]{
    display:none !important;
}

.finestra-crop-firma__box{
    width:min(1120px, calc(100vw - 20px));
    height:min(96dvh, 760px);
    max-height:calc(100dvh - 20px);
    overflow:hidden;
    display:grid;
    grid-template-rows:auto auto minmax(0,1fr) auto;
    gap:12px;
    background:#ffffff;
    border-radius:28px;
    padding:18px;
    box-shadow:0 28px 72px rgba(0,0,0,.26);
    border:1px solid rgba(255,255,255,.28);
}

.finestra-crop-firma__box h3{
    margin:0;
    color:#0f172a;
    font-size:26px;
    line-height:1.12;
    letter-spacing:-.01em;
}

.finestra-crop-firma__box p{
    margin:0;
    color:#475569;
    line-height:1.6;
    font-size:15px;
}

.firma-cropper-note{
    margin-top:0;
    padding:16px 18px;
    border-radius:18px;
    font-size:15px;
    line-height:1.72;
    font-weight:700;
}

.firma-cropper-note-info{
    background:#eff6ff;
    border:1px solid #bfdbfe;
    color:#1d4ed8;
}

.firma-cropper-note-errore{
    background:#fff1f2;
    border:1px solid #fecdd3;
    color:#be123c;
}

.firma-cropper-area{
    position:relative;
    margin-top:0;
    min-height:0;
    height:100%;
    border-radius:20px;
    overflow:hidden;
    background:linear-gradient(180deg, #f8fbff 0%, #eef5fc 100%);
    border:1px solid #dbe4ee;
    display:flex;
    align-items:center;
    justify-content:center;
    overscroll-behavior:contain;
    user-select:none;
    -webkit-user-select:none;
    -webkit-touch-callout:none;
    -webkit-tap-highlight-color:transparent;
}

.firma-cropper-area,
.firma-cropper-area *{
    user-select:none;
    -webkit-user-select:none;
    -webkit-touch-callout:none;
    -webkit-tap-highlight-color:transparent;
}

.firma-cropper-area .cropper-container{
    touch-action:none !important;
}

.firma-cropper-area .cropper-dashed,
.firma-cropper-area .cropper-center{
    pointer-events:none !important;
}

.firma-cropper-area img{
    display:block;
    max-width:100%;
    max-height:100%;
    user-select:none;
    -webkit-user-select:none;
    -webkit-user-drag:none;
    -webkit-touch-callout:none;
}

.firma-cropper-area .cropper-view-box{
    outline:2px solid #1d4ed8;
    outline-color:#1d4ed8;
}

.firma-cropper-area .cropper-face{
    background:rgba(29, 78, 216, .10);
    opacity:1;
}

.firma-cropper-area .cropper-line{
    background:rgba(29, 78, 216, .20);
}

.firma-cropper-area .cropper-line.line-e,
.firma-cropper-area .cropper-line.line-w{
    width:14px !important;
}

.firma-cropper-area .cropper-line.line-n,
.firma-cropper-area .cropper-line.line-s{
    height:14px !important;
}

.firma-cropper-area .cropper-point{
    border-radius:999px;
    background:#1d4ed8 !important;
    border:3px solid #ffffff;
    opacity:1;
    box-shadow:0 4px 12px rgba(29, 78, 216, .24);
}

.firma-cropper-area .cropper-point.point-n,
.firma-cropper-area .cropper-point.point-s,
.firma-cropper-area .cropper-point.point-e,
.firma-cropper-area .cropper-point.point-w{
    width:18px !important;
    height:18px !important;
}

.firma-cropper-area .cropper-point.point-n,
.firma-cropper-area .cropper-point.point-s{
    margin-left:-9px;
}

.firma-cropper-area .cropper-point.point-e,
.firma-cropper-area .cropper-point.point-w{
    margin-top:-9px;
}

.firma-cropper-area .cropper-point.point-ne,
.firma-cropper-area .cropper-point.point-nw,
.firma-cropper-area .cropper-point.point-se,
.firma-cropper-area .cropper-point.point-sw{
    width:22px !important;
    height:22px !important;
}

.firma-cropper-area .cropper-point.point-se{
    right:-11px !important;
    bottom:-11px !important;
}

.firma-cropper-area .cropper-point.point-sw{
    left:-11px !important;
    bottom:-11px !important;
}

.firma-cropper-area .cropper-point.point-nw{
    left:-11px !important;
    top:-11px !important;
}

.firma-cropper-area .cropper-point.point-ne{
    right:-11px !important;
    top:-11px !important;
}

.firma-cropper-azioni{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:12px;
    margin-top:6px;
}

.firma-cropper-azioni .bottone{
    width:100%;
    min-height:50px;
    padding:12px 14px;
    font-size:14px;
    line-height:1.25;
}

@media (min-width: 641px){
    .finestra-guida-firma .guida-firma-step[data-guida-step="pc"] .firma-cropper-azioni,
    .finestra-guida-firma .guida-firma-step[data-guida-step="pc-webcam"] .firma-cropper-azioni{
        align-items:stretch;
	}
    
    .finestra-guida-firma .guida-firma-step[data-guida-step="pc"] .firma-cropper-azioni .bottone,
    .finestra-guida-firma .guida-firma-step[data-guida-step="pc-webcam"] .firma-cropper-azioni .bottone{
        flex:1 1 260px;
        min-height:58px;
        font-size:15px;
        line-height:1.2;
	}
    
    .finestra-guida-firma .guida-firma-step[data-guida-step="pc-webcam"]{
        gap:20px;
	}
    
    .finestra-guida-firma .guida-firma-step[data-guida-step="pc-webcam"] .firma-cropper-note{
        margin-bottom:0;
	}
    
    .finestra-guida-firma .guida-firma-step[data-guida-step="pc-webcam"] .firma-cropper-area{
        min-height:340px;
        padding:16px;
        border:1px solid #d7e6f3;
        background:linear-gradient(180deg, #f8fbff 0%, #edf5fd 100%);
        box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
	}
    
	#guida-viso-webcam-video{
		display:block;
		width:100%;
		max-width:100%;
		height:min(38dvh, 320px);
		min-height:260px;
		max-height:min(38dvh, 320px);
		object-fit:contain;
		border-radius:18px;
		border:1px solid #d7e3ef;
		background:#0f172a;
		box-shadow:0 18px 36px rgba(15,23,42,.12);
	}
    
    #guida-viso-webcam-canvas{
        display:none !important;
	}
    
    #guida-viso-webcam-stato{
        max-width:none;
	}
}

.checkbox-label{
    display:flex;
    align-items:flex-start;
    gap:14px;
    cursor:pointer;
}

.checkbox-label input[type="checkbox"]{
    width:22px;
    height:22px;
    margin-top:1px;
    accent-color:var(--blu-scuro);
    flex:0 0 auto;
}

.checkbox-label span{
    color:var(--testo);
    font-size:15px;
    line-height:1.72;
    font-weight:600;
}

.azioni-form{
    display:flex;
    flex-wrap:wrap;
    gap:16px;
    margin-top:28px;
}

.azioni-form .bottone{
    min-width:280px;
}

/* ==========================================================================
	BOTTONI
========================================================================== */

.bottone{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-height:52px;
    padding:13px 20px;
    border:none;
    border-radius:14px;
    font-weight:800;
    font-size:15px;
    letter-spacing:.01em;
    cursor:pointer;
    text-decoration:none;
    transition:var(--transizione);
    box-shadow:0 10px 24px rgba(15,23,42,.08);
}

.bottone:hover{
    transform:translateY(-1px);
}

.bottone:active{
    transform:translateY(0);
}

.bottone-primario{
    background:linear-gradient(180deg, #1567aa 0%, #0b4d83 100%);
    color:#ffffff;
}

.bottone-primario:hover{
    box-shadow:0 16px 30px rgba(11,77,131,.22);
}

.bottone-secondario{
    background:#eef4fa;
    color:#11385a;
    border:1px solid #d4e0ea;
}

.bottone-secondario:hover{
    background:#e8f0f8;
}

.bottone-disabilitato,
.bottone:disabled{
    background:#d7dee7;
    color:#6b7785;
    cursor:not-allowed;
    box-shadow:none;
    transform:none;
}

.box-nuova-iscrizione{
    margin-top:24px;
    padding:24px;
    border:1px solid #cfe0ef;
    border-radius:20px;
    background:linear-gradient(180deg, #f4faff 0%, #eaf4fd 100%);
    box-shadow:0 18px 44px rgba(11,77,131,.10);
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
}

.box-nuova-iscrizione-titolo{
    margin:0;
    font-size:24px;
    line-height:1.2;
    font-weight:800;
    color:#0f172a;
}

.box-nuova-iscrizione-testo{
    margin:0;
    font-size:16px;
    line-height:1.6;
    font-weight:700;
    color:#11385a;
}

.box-nuova-iscrizione-form{
    width:100%;
    max-width:420px;
    margin-top:12px;
}

.bottone-nuova-iscrizione{
    width:100%;
    min-height:60px;
    padding:16px 24px;
    font-size:16px;
    letter-spacing:.02em;
    box-shadow:0 18px 36px rgba(11,77,131,.24);
    animation:richiamo-nuova-iscrizione 1.8s ease-in-out infinite;
}

.bottone-nuova-iscrizione:hover{
    animation:none;
    transform:translateY(-2px);
    box-shadow:0 22px 42px rgba(11,77,131,.28);
}

.bottone-nuova-iscrizione:active{
    animation:none;
    transform:translateY(0);
}

@keyframes richiamo-nuova-iscrizione{
    0%, 100%{
        transform:translateY(0);
	}
    50%{
        transform:translateY(-4px);
	}
}

@media (prefers-reduced-motion: reduce){
    .bottone-nuova-iscrizione{
        animation:none;
	}
}

/* ==========================================================================
	ANTEPRIMA / TESSERA
========================================================================== */

.galleria-tessera{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:22px;
    align-items:start;
}

.carta-tessera{
    background:linear-gradient(180deg, #f7fbff 0%, #eef5fc 100%);
    border:1px solid #d7e3ef;
    border-radius:22px;
    padding:20px;
    overflow:hidden;
    box-shadow:0 16px 34px rgba(15,23,42,.07);
}

.carta-tessera h3{
    margin:0 0 16px 0;
    font-size:18px;
    font-weight:800;
    letter-spacing:.01em;
    color:#11385a;
}

.carta-tessera img{
    width:100%;
    aspect-ratio:1016 / 640;
    object-fit:contain;
    border-radius:18px;
    border:1px solid #cfdbe7;
    background:#ffffff;
    padding:10px;
    box-shadow:0 14px 30px rgba(15,23,42,.08);
}

.azioni-doppie{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:22px;
}

.azioni-prosegui-riepilogo{
    margin:22px 0 24px;
}

.accesso-admin-footer{
    display:flex;
    justify-content:flex-end;
    align-items:flex-end;
    padding:2px 0 18px;
}

.accesso-admin-footer-link{
    display:inline-flex;
    align-items:center;
    justify-content:flex-end;
    min-width:0;
    padding:0;
    border:none;
    border-radius:0;
    background:transparent;
    color:#7b8794;
    font-size:12px;
    line-height:1.2;
    font-weight:700;
    text-align:right;
    box-shadow:none;
    opacity:.82;
    transition:var(--transizione);
}

.accesso-admin-footer-link:hover{
    background:transparent;
    border-color:transparent;
    color:#536375;
    box-shadow:none;
    opacity:1;
    text-decoration:underline;
}

.accesso-admin-footer-link:focus-visible{
    outline:none;
    color:#536375;
    box-shadow:none;
    text-decoration:underline;
}

/* ==========================================================================
	PAGAMENTI
========================================================================== */

.griglia-pagamenti{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:20px;
    align-items:stretch;
}

.carta-pagamento{
    background:#f8fbff;
    border:1px solid var(--bordo);
    border-radius:20px;
    padding:22px;
    display:flex;
    flex-direction:column;
    gap:14px;
    min-height:100%;
    height:100%;
}

.carta-pagamento h3{
    margin:0;
    font-size:23px;
    color:var(--testo);
}

.carta-pagamento p{
    margin:0;
    color:var(--testo-secondario);
    font-size:16px;
    line-height:1.72;
}

.carta-pagamento form{
    margin-top:auto;
}

.carta-pagamento .bottone{
    width:100%;
}

.blocco-info-pagamento{
    display:flex;
    flex-direction:column;
    gap:6px;
    padding:14px 16px;
    border-radius:16px;
    background:#eef5ff;
    border:1px solid #d4e6fb;
    color:#0f4772;
}

.blocco-info-pagamento strong{
    font-size:16px;
}

.blocco-info-pagamento span{
    font-size:15px;
    line-height:1.6;
}

/* ==========================================================================
	BONIFICO
========================================================================== */

.box-bonifico{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
    background:#f8fbff;
    border:1px solid var(--bordo);
    border-radius:20px;
    padding:22px;
}

.riga-bonifico{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-items:flex-start;
    gap:8px 16px;
    padding:14px 0;
    border-bottom:1px dashed #d7e1ec;
}

.riga-bonifico:last-child{
    border-bottom:none;
    padding-bottom:0;
}

.riga-bonifico span{
    color:var(--testo-secondario);
    font-weight:700;
}

.riga-bonifico strong{
    color:var(--testo);
    text-align:right;
    max-width:68%;
    word-break:break-word;
}

.iban{
    font-family:"Courier New", monospace;
    letter-spacing:.04em;
}

/* ==========================================================================
	UTILITÀ
========================================================================== */

strong{
    font-weight:800;
}

/* ==========================================================================
	RESPONSIVE
========================================================================== */

@media (max-width: 1180px){
    .riepilogo-griglia{
        grid-template-columns:repeat(2, minmax(0, 1fr));
	}
	
    .griglia-pagamenti{
        grid-template-columns:repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 860px){
    .scheda{
        padding:22px;
        border-radius:20px;
	}
	
    .griglia-campi,
    .riepilogo-griglia,
    .galleria-tessera,
    .griglia-pagamenti{
        grid-template-columns:1fr;
	}
	
    .campo,
    .campo-largo,
    .campo-medio,
    .campo-breve,
    .intestazione-sezione-modulo,
    #campo-codice_fiscale,
    #campo-data_nascita,
    #campo-citta_nascita,
    #campo-email,
    #campo-email_conferma,
    #campo-indirizzo_residenza,
    #campo-cap_residenza,
    #campo-comune_residenza,
    #campo-provincia_residenza,
    #campo-quota_associativa,
    #campo-foto_viso,
    #campo-foto_firma{
        grid-column:1 / -1;
	}
	
    .riga-bonifico strong{
        max-width:100%;
        text-align:left;
	}
}

@media (max-width: 1100px){
    .data-nascita-griglia{
        grid-template-columns:1fr;
	}
}

@media (max-width: 640px){
    .contenitore{
        width:min(var(--max-larghezza), calc(100% - 20px));
	}
	
	.hero{
		padding:18px 0 14px;
	}
	
	.hero-box{
		padding:22px 18px;
		border-radius:22px;
	}
	
	.hero-box-impatto,
	.hero-box-impatto-compatta{
		padding:26px 18px 24px;
	}
	
	.hero-layout,
	.hero-layout-compatto{
		gap:0;
	}
	
	.hero-box-impatto .hero-mini{
		margin-bottom:12px;
		padding:0 0 6px 0;
		letter-spacing:.11em;
	}
	
	.hero h1{
		font-size:32px;
	}
	
	.hero-associazione{
		font-size:15px;
		margin-bottom:14px;
	}
	
	.hero-testo{
		font-size:15px;
		line-height:1.72;
	}
	
	.hero-sottotitolo{
		font-size:18px;
		line-height:1.38;
		margin-bottom:10px;
	}
	
	.hero-frase-impatto{
		font-size:14px;
		line-height:1.62;
		margin-bottom:16px;
	}
	
	.hero-quote-inline{
		gap:8px;
		margin-bottom:16px;
	}
	
	.hero-quote-inline-label{
		font-size:11px;
		letter-spacing:.12em;
	}
	
	.hero-quote-inline-lista{
		display:grid;
		grid-template-columns:1fr;
		gap:10px;
	}
	
	.hero-quote-inline-item{
		min-width:0;
		padding:12px 14px;
		border-radius:16px;
	}
	
	.hero-quote-inline-nome{
		font-size:13px;
	}
	
	.hero-quote-inline-valore{
		font-size:26px;
	}
	
	.hero-pagamenti{
		gap:8px 10px;
		align-items:flex-start;
	}
	
	.hero-pagamenti-label{
		width:auto;
		font-size:12px;
		letter-spacing:.11em;
	}
	
	.hero-pagamenti-lista{
		gap:0;
		row-gap:4px;
	}
	
	.hero-pagamento-pill{
		padding:0;
		font-size:13px;
		line-height:1.35;
	}
	
	.hero-pagamento-pill:not(:last-child){
		margin-right:10px;
		padding-right:10px;
	}
	
	.hero-colonna-brand{
		top:10px;
		right:10px;
		width:104px;
		opacity:.24;
	}
	
	.hero-brand-logo-box{
		width:104px;
	}
	
	.hero-brand-logo-glow{
		display:none;
	}
	
	.hero-brand-logo{
		max-width:104px;
	}
	
    main.contenitore{
        padding:20px 0 32px;
	}
	
    .scheda{
        padding:20px;
        margin-bottom:20px;
	}
	
	.scheda-intestazione h2{
		font-size:24px;
	}
	
	.scheda-intestazione-verticale{
		gap:8px;
	}
	
    .griglia-campi{
        column-gap:16px;
        row-gap:14px;
	}
	
    .intestazione-sezione-modulo{
        padding-top:2px;
	}
	
    .griglia-campi > .intestazione-sezione-modulo:not(:first-child){
        margin-top:4px;
        padding-top:12px;
	}
	
    .intestazione-sezione-modulo h3{
        font-size:18px;
	}
	
    .intestazione-sezione-modulo p{
        font-size:14px;
        line-height:1.6;
	}
	
	.campo input[type="text"],
	.campo input[type="email"],
	.campo input[type="date"],
	.campo input[type="file"],
	.campo select{
		min-height:52px;
		padding:14px 15px;
	}
	
	.data-nascita-griglia{
		grid-template-columns:1fr;
	}
	
	.azioni-form,
	.azioni-doppie,
	.firma-preview-crop-azioni,
	.controllo-upload-guidato{
		flex-direction:column;
	}
	
	.bottone{
		width:100%;
	}
	
	.firma-upload-box{
		padding:15px;
		min-height:0;
	}
	
	.firma-upload-box .controllo-upload-guidato{
		width:100%;
		align-items:stretch;
	}
	
	.firma-upload-box .controllo-upload-guidato .bottone{
		width:100%;
		flex:0 0 auto;
		min-height:52px;
		padding:12px 16px;
	}
	
	.controllo-upload-guidato .bottone{
		min-width:0;
	}
	
	#foto-viso-nome-file,
	#foto-firma-nome-file{
		width:100%;
	}
	
	.finestra-guida-firma .finestra-crop-firma__box{
		width:calc(100vw - 12px);
		max-height:calc(100dvh - 12px);
		padding:18px;
		border-radius:24px;
	}
	
	.guida-firma-step{
		gap:14px;
	}
	
	.guida-firma-step > p{
		min-height:32px;
		padding:6px 10px;
		font-size:12px;
	}
	
	.guida-firma-step h3{
		font-size:26px;
		line-height:1.16;
	}
	
	.guida-firma-box-secondario,
	.guida-firma-link-box,
	.guida-firma-istruzioni,
	.attesa-firma-pc{
		padding:16px;
		border-radius:20px;
	}
	
	.guida-firma-icona-smartphone{
		max-width:280px;
		border-radius:18px;
	}
	
	.guida-firma-qr-box{
		width:100%;
		min-height:220px;
		padding:14px;
		border-radius:20px;
	}
	
	.guida-firma-link{
		padding:12px 14px;
		font-size:14px;
		line-height:1.55;
	}
	
	.guida-firma-istruzioni strong{
		font-size:16px;
		margin-bottom:8px;
	}
	
	.guida-firma-istruzioni p{
		font-size:14px;
		line-height:1.65;
	}
	
	.attesa-firma-pc strong{
		font-size:17px;
	}
	
	.attesa-firma-pc-countdown{
		width:auto;
		max-width:100%;
		font-size:15px;
	}
	
	.guida-firma-timeout .firma-cropper-azioni .bottone,
	.finestra-guida-firma .guida-firma-step .firma-cropper-azioni .bottone{
		flex:1 1 100%;
	}
	
	#firma-remota-scatta,
	#firma-remota-galleria{
		width:100%;
	}
	
	#firma-remota-nome-file{
		width:100%;
		font-size:14px;
		line-height:1.55;
	}
	
	#firma-remota-preview{
		padding:16px;
		border-radius:18px;
	}
	
	#firma-remota-preview img,
	#firma-remota-preview-img{
		max-height:170px;
	}
	
    .checkbox-campo{
        padding:18px;
	}
	
    .checkbox-label{
        gap:12px;
	}
	
    .checkbox-label span{
        font-size:15px;
	}
	
    .carta-pagamento,
    .carta-tessera{
        padding:16px;
	}
	
    .riepilogo-item strong{
        font-size:17px;
	}
	
    .badge{
        width:100%;
        justify-content:center;
	}
	
    .analisi-file{
        padding:11px 12px;
        font-size:13px;
	}
	
    .accesso-admin-footer{
        display:none;
	}
	
    #campo-foto_viso .errore-campo-evidente,
    #campo-foto_firma .errore-campo-evidente{
        padding:11px 12px;
        font-size:13px;
        line-height:1.4;
	}
	
    #foto-viso-preview img{
        max-width:100%;
        max-height:220px;
	}
	
    .finestra-crop-firma{
        padding:6px;
	}
	
    .finestra-crop-firma__box{
        width:calc(100vw - 12px);
        height:min(88dvh, 88dvh);
        max-height:calc(100dvh - 12px);
        padding:12px;
        border-radius:18px;
        gap:8px;
	}
	
    .finestra-crop-firma__box h3{
        font-size:22px;
	}
	
    .finestra-crop-firma__box p{
        font-size:15px;
        line-height:1.55;
	}
	
    .firma-cropper-note{
        font-size:14px;
        line-height:1.55;
        padding:12px 13px;
	}
	
	.firma-cropper-area{
		min-height:0;
	}
	
	.firma-cropper-area .cropper-line.line-e,
	.firma-cropper-area .cropper-line.line-w{
		width:18px !important;
	}
	
	.firma-cropper-area .cropper-line.line-n,
	.firma-cropper-area .cropper-line.line-s{
		height:18px !important;
	}
	
	.firma-cropper-area .cropper-point.point-n,
	.firma-cropper-area .cropper-point.point-s,
	.firma-cropper-area .cropper-point.point-e,
	.firma-cropper-area .cropper-point.point-w{
		width:22px !important;
		height:22px !important;
	}
	
	.firma-cropper-area .cropper-point.point-n,
	.firma-cropper-area .cropper-point.point-s{
		margin-left:-11px;
	}
	
	.firma-cropper-area .cropper-point.point-e,
	.firma-cropper-area .cropper-point.point-w{
		margin-top:-11px;
	}
	
	.firma-cropper-area .cropper-point.point-ne,
	.firma-cropper-area .cropper-point.point-nw,
	.firma-cropper-area .cropper-point.point-se,
	.firma-cropper-area .cropper-point.point-sw{
		width:26px !important;
		height:26px !important;
	}
	
	.firma-cropper-area .cropper-point.point-se{
		right:-13px !important;
		bottom:-13px !important;
	}
	
	.firma-cropper-area .cropper-point.point-sw{
		left:-13px !important;
		bottom:-13px !important;
	}
	
	.firma-cropper-area .cropper-point.point-nw{
		left:-13px !important;
		top:-13px !important;
	}
	
	.firma-cropper-area .cropper-point.point-ne{
		right:-13px !important;
		top:-13px !important;
	}
	
    .firma-cropper-azioni{
        grid-template-columns:1fr;
        gap:8px;
	}
	
	.firma-cropper-azioni .bottone{
		min-height:44px;
		padding:10px 12px;
		font-size:13px;
		line-height:1.2;
	}
}

@media (max-width: 420px){
	.hero h1{
		font-size:28px;
	}
	
	.hero-box{
		padding:20px 14px;
	}
	
	.hero-box-impatto,
	.hero-box-impatto-compatta{
		padding:22px 14px 20px;
	}
	
	.hero-mini{
		font-size:12px;
	}
	
	.hero-box-impatto .hero-mini{
		padding:0 0 5px 0;
	}
	
	.hero-testo{
		font-size:14px;
		line-height:1.68;
	}
	
	.hero-sottotitolo{
		font-size:16px;
	}
	
	.hero-frase-impatto{
		font-size:13px;
		line-height:1.58;
	}
	
	.hero-quote-inline-item{
		padding:11px 12px;
	}
	
	.hero-quote-inline-nome{
		font-size:12px;
	}
	
	.hero-quote-inline-valore{
		font-size:24px;
	}
	
	.hero-pagamenti-label{
		font-size:12px;
	}
	
	.hero-pagamento-pill{
		font-size:14px;
		line-height:1.3;
	}
	
	.hero-colonna-brand{
		width:88px;
		top:8px;
		right:8px;
	}
	
	.hero-brand-logo-box{
		width:88px;
	}
	
	.hero-brand-logo{
		max-width:88px;
	}
	
	.scheda-intestazione h2{
		font-size:22px;
	}
	
	.carta-pagamento h3,
	.carta-tessera h3{
		font-size:20px;
	}
	
	.guida-firma-step h3{
		font-size:23px;
	}
	
	.finestra-guida-firma .guida-firma-step .firma-cropper-azioni{
		flex-direction:column;
	}
	
	.guida-firma-box-secondario,
	.guida-firma-link-box,
	.guida-firma-istruzioni,
	.attesa-firma-pc{
		padding:14px;
	}
	
	.guida-firma-icona-smartphone-wrap{
		margin:12px 0;
	}
	
	.guida-firma-icona-smartphone{
		width:100%;
		border-radius:16px;
	}
	
	.guida-firma-link{
		padding:10px 12px;
		font-size:13px;
	}
	
	.guida-firma-qr-box{
		min-height:200px;
		padding:12px;
		border-radius:18px;
	}
	
	.guida-firma-istruzioni strong{
		font-size:15px;
		margin-bottom:8px;
	}
	
	.guida-firma-istruzioni p{
		font-size:13px;
		line-height:1.6;
	}
	
	.attesa-firma-pc-countdown{
		width:100%;
		font-size:15px;
	}
}