/* MOPI - stili: moduli Contact Form 7 e sezione "Come associarsi" della pagina Perché associarsi. */

.wpcf7,
.mopi-adesione {
	--mopi-verde: #008d87;
	--mopi-verde-scuro: #00706b;
	--mopi-inchiostro: #1d2b36;
	--mopi-testo: #3b4148;
	--mopi-tenue: #6b7178;
	--mopi-bordo: #cdc6bb;
	--mopi-linea: #e4dfd7;
	--mopi-beige: #f2eeea;
	--mopi-errore: #b3261e;
}

/* ---------- Moduli Contact Form 7 ----------
   Il CSS personalizzato del tema ha regole diverse per ogni modulo (cf7-grid, cf7-studio-form,
   cf7-candidatura, cf7-smart-grid). Qui si uniforma solo l'aspetto: l'impaginazione di righe e
   colonne resta quella di ciascun modulo. Il prefisso .wpcf7 .wpcf7-form serve a prevalere. */

.wpcf7 .wpcf7-form label {
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 0;
	color: var(--mopi-verde);
}

.wpcf7 .wpcf7-form label em {
	margin-left: 2px;
	font-style: normal;
	color: inherit;
}

.wpcf7 .wpcf7-form label:empty,
.wpcf7 .wpcf7-form .info-tip:empty {
	display: none;
}

/* Modulo Contatti: l'etichetta contiene il campo. */
.wpcf7 .wpcf7-form > label {
	display: block;
	margin: 0 0 20px;
}

.wpcf7 .wpcf7-form label > .wpcf7-form-control-wrap {
	display: block;
	margin-top: 6px;
}

.wpcf7 .wpcf7-form :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="number"], input[type="date"], select, textarea).wpcf7-form-control {
	box-sizing: border-box;
	width: 100%;
	min-height: 48px;
	margin: 0;
	padding: 11px 14px 11px var(--mopi-pad, 14px);
	border: 1px solid var(--mopi-bordo);
	border-radius: 6px;
	background-color: #fff;
	font-family: inherit;
	font-size: 16px;
	line-height: 1.4;
	color: var(--mopi-inchiostro);
	box-shadow: none;
	transform: none;
	transition: border-color .15s, box-shadow .15s;
}

.wpcf7 .wpcf7-form textarea.wpcf7-form-control {
	min-height: 140px;
	max-height: 320px;
	resize: vertical;
}

.wpcf7 .wpcf7-form select.wpcf7-form-control {
	appearance: none;
	height: auto !important;
	padding-right: 40px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23008d87' stroke-width='2'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 12px 8px;
}

.wpcf7 .wpcf7-form .wpcf7-form-control::placeholder {
	color: #8a9097;
	font-style: normal;
	opacity: 1;
}

.wpcf7 .wpcf7-form .wpcf7-form-control:hover {
	border-color: #a9a196;
}

.wpcf7 .wpcf7-form .wpcf7-form-control:focus {
	outline: none;
	border-color: var(--mopi-verde);
	box-shadow: 0 0 0 3px rgba(0, 141, 135, .22);
	transform: none;
}

/* Testo d'aiuto sotto il campo. */
.wpcf7 .wpcf7-form .info-tip,
.wpcf7 .wpcf7-form .cf7-help {
	margin: 6px 0 0;
	font-size: 13px;
	line-height: 1.4;
	color: var(--mopi-tenue);
}

/* Caselle e scelte.
   È la casella nativa (tastiera e lettori di schermo funzionano come prima), ridisegnata:
   quadrato con bordo, verde pieno con spunta bianca quando è selezionata. */
.wpcf7 .wpcf7-form .wpcf7-list-item input:is([type="checkbox"], [type="radio"]) {
	-webkit-appearance: none;
	appearance: none;
	flex: none;
	box-sizing: border-box;
	width: 22px;
	height: 22px;
	margin: 0;
	border: 1.5px solid #9f978b;
	border-radius: 5px;
	background: #fff center / 14px 14px no-repeat;
	vertical-align: middle;
	cursor: pointer;
	transition: background-color .15s, border-color .15s;
}

.wpcf7 .wpcf7-form .wpcf7-list-item input[type="radio"] {
	border-radius: 50%;
}

.wpcf7 .wpcf7-form .wpcf7-list-item input:is([type="checkbox"], [type="radio"]):hover {
	border-color: var(--mopi-verde);
}

.wpcf7 .wpcf7-form .wpcf7-list-item input[type="checkbox"]:checked {
	border-color: var(--mopi-verde);
	background-color: var(--mopi-verde);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.wpcf7 .wpcf7-form .wpcf7-list-item input[type="radio"]:checked {
	border-color: var(--mopi-verde);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='4' fill='%23008d87'/%3E%3C/svg%3E");
}

.wpcf7 .wpcf7-form .wpcf7-not-valid .wpcf7-list-item input {
	border-color: var(--mopi-errore);
}

/* Consenso privacy: casella allineata alla prima riga del testo. */
.wpcf7 .wpcf7-form .wpcf7-acceptance label {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--mopi-testo);
	cursor: pointer;
}

.wpcf7 .wpcf7-form .wpcf7-acceptance .wpcf7-list-item-label,
.wpcf7 .wpcf7-form .wpcf7-acceptance .wpcf7-list-item-label * {
	color: var(--mopi-testo);
}

.wpcf7 .wpcf7-form .wpcf7-list-item-label a,
.wpcf7 .wpcf7-form .wpcf7-acceptance .wpcf7-list-item-label a {
	color: var(--mopi-verde);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Scelte fra più opzioni (candidature): opzioni affiancate da cliccare; quella scelta ha bordo e fondo verdi. */
.wpcf7 .wpcf7-form :is(.wpcf7-checkbox, .wpcf7-radio) {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 8px;
}

/* Il CSS personalizzato del tema impone 15px sotto ogni voce con !important. */
.wpcf7 .wpcf7-form :is(.wpcf7-checkbox, .wpcf7-radio) .wpcf7-list-item {
	display: block;
	margin: 0 !important;
}

.wpcf7 .wpcf7-form :is(.wpcf7-checkbox, .wpcf7-radio) .wpcf7-list-item label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	box-sizing: border-box;
	min-height: 46px;
	margin: 0;
	padding: 0 16px 0 12px;
	border: 1px solid var(--mopi-bordo);
	border-radius: 6px;
	background: #fff;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--mopi-testo);
	cursor: pointer;
	transition: border-color .15s, background-color .15s;
}

.wpcf7 .wpcf7-form :is(.wpcf7-checkbox, .wpcf7-radio) .wpcf7-list-item label:hover {
	border-color: var(--mopi-verde);
}

.wpcf7 .wpcf7-form :is(.wpcf7-checkbox, .wpcf7-radio) .wpcf7-list-item label:has(input:checked) {
	border-color: var(--mopi-verde);
	background: #e8f4f3;
	color: var(--mopi-inchiostro);
}

/* Il colore va sul testo e non sull'etichetta: il tema forza tutte le label in verde con !important. */
.wpcf7 .wpcf7-form :is(.wpcf7-checkbox, .wpcf7-radio) .wpcf7-list-item-label {
	color: var(--mopi-testo);
}

.wpcf7 .wpcf7-form :is(.wpcf7-checkbox, .wpcf7-radio) .wpcf7-list-item label:has(input:checked) .wpcf7-list-item-label {
	color: var(--mopi-inchiostro);
}

/* Pulsante di invio: uno solo per tutti i moduli. */
.wpcf7 .wpcf7-form .wpcf7-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: auto;
	min-width: 180px;
	min-height: 48px;
	margin-top: 4px;
	padding: 0 32px;
	border: 0;
	border-radius: 6px;
	background: var(--mopi-verde);
	box-shadow: none;
	font-family: inherit;
	font-size: 16px;
	font-weight: 500;
	color: #fff;
	cursor: pointer;
	transform: none;
}

.wpcf7 .wpcf7-form .wpcf7-submit:hover {
	background: var(--mopi-verde-scuro);
	color: #fff;
	transform: none;
}

.wpcf7 .wpcf7-form .wpcf7-submit:focus-visible,
.wpcf7 .wpcf7-form .wpcf7-list-item input:focus-visible {
	outline: 3px solid rgba(0, 141, 135, .45);
	outline-offset: 2px;
}

/* Errori e messaggi dopo l'invio. */
.wpcf7 .wpcf7-form .wpcf7-not-valid,
.wpcf7 .wpcf7-form .wpcf7-form-control:user-invalid {
	border-color: var(--mopi-errore);
}

.wpcf7 .wpcf7-form .wpcf7-not-valid-tip {
	margin-top: 6px;
	font-size: 13px;
	color: var(--mopi-errore);
}

.wpcf7 .wpcf7-form .wpcf7-response-output {
	margin: 20px 0 0;
	padding: 12px 16px;
	border: 1px solid var(--mopi-bordo);
	border-radius: 6px;
	font-size: 15px;
}

.wpcf7 .wpcf7-form.invalid .wpcf7-response-output,
.wpcf7 .wpcf7-form.unaccepted .wpcf7-response-output {
	border-color: var(--mopi-errore);
	color: var(--mopi-errore);
}

.wpcf7 .wpcf7-form.sent .wpcf7-response-output {
	border-color: var(--mopi-verde);
	color: var(--mopi-verde-scuro);
}

@media (max-width: 600px) {
	.wpcf7 .wpcf7-form .wpcf7-submit {
		width: 100%;
	}
}


/* ---------- Icone nei campi ----------
   L'icona dice che dato inserire. Sta nel contenitore che Contact Form 7 crea attorno a ogni campo
   (.wpcf7-form-control-wrap, con data-name = nome del campo), quindi non serve toccare i moduli.
   I campi senza corrispondenza (menu a tendina, caselle) restano senza icona. */

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap {
	position: relative;
	display: block;
}

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap::before {
	content: var(--mopi-icona-on, none);
	position: absolute;
	top: 15px;
	left: 14px;
	z-index: 1;
	width: 18px;
	height: 18px;
	background-color: #8a9097;
	-webkit-mask: var(--mopi-icona) center / contain no-repeat;
	mask: var(--mopi-icona) center / contain no-repeat;
	pointer-events: none;
	transition: background-color .15s;
}

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap:focus-within::before {
	background-color: var(--mopi-verde);
}

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap:has(.wpcf7-not-valid)::before {
	background-color: var(--mopi-errore);
}

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap[data-name*="nome" i],
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap[data-name*="name" i] {
	--mopi-icona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4.4 3.6-7 8-7s8 2.6 8 7'/%3E%3C/svg%3E");
	--mopi-icona-on: "";
	--mopi-pad: 44px;
}

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap[data-name*="studio" i] {
	--mopi-icona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='1'/%3E%3Cpath d='M9 7.5h1M14 7.5h1M9 11.5h1M14 11.5h1M9 15.5h1M14 15.5h1M10 21v-3h4v3'/%3E%3C/svg%3E");
	--mopi-icona-on: "";
	--mopi-pad: 44px;
}

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap[data-name*="citta" i],
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap[data-name*="indirizzo" i],
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap[data-name*="sede" i] {
	--mopi-icona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-6.5-5.6-6.5-11a6.5 6.5 0 0 1 13 0c0 5.4-6.5 11-6.5 11z'/%3E%3Ccircle cx='12' cy='10' r='2.3'/%3E%3C/svg%3E");
	--mopi-icona-on: "";
	--mopi-pad: 44px;
}

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap[data-name*="piva" i],
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap[data-name*="codice" i] {
	--mopi-icona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Ccircle cx='8.5' cy='11' r='2'/%3E%3Cpath d='M5.5 16c.6-1.3 1.6-2 3-2s2.4.7 3 2M14 10h4.5M14 13.5h3'/%3E%3C/svg%3E");
	--mopi-icona-on: "";
	--mopi-pad: 44px;
}

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap[data-name*="subject" i],
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap[data-name*="oggetto" i] {
	--mopi-icona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h4L19 9l-4-4L4 16v4z'/%3E%3Cpath d='M13.5 6.5l4 4'/%3E%3C/svg%3E");
	--mopi-icona-on: "";
	--mopi-pad: 44px;
}

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap:has(> input[type="email"]) {
	--mopi-icona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3.5 7l8.5 6 8.5-6'/%3E%3C/svg%3E");
	--mopi-icona-on: "";
	--mopi-pad: 44px;
}

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap:has(> input[type="tel"]) {
	--mopi-icona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='2.5' width='10' height='19' rx='2'/%3E%3Cpath d='M11 18h2'/%3E%3C/svg%3E");
	--mopi-icona-on: "";
	--mopi-pad: 44px;
}

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap:has(> textarea) {
	--mopi-icona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v11H9.5L4 20.5V5z'/%3E%3C/svg%3E");
	--mopi-icona-on: "";
	--mopi-pad: 44px;
}

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap:has(> input[type="file"]) {
	--mopi-icona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11.5l-8 8a5 5 0 0 1-7-7l8.5-8.5a3.3 3.3 0 0 1 4.7 4.7L9.7 17a1.7 1.7 0 0 1-2.4-2.4L15 7'/%3E%3C/svg%3E");
	--mopi-icona-on: "";
	--mopi-pad: 44px;
}


/* Caselle e menu a tendina non hanno icona, anche se il nome del campo coincide (es. "privacy-studio"). */
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap:has(.wpcf7-acceptance, .wpcf7-checkbox, .wpcf7-radio, select) {
	--mopi-icona-on: none;
	--mopi-pad: 14px;
}

/* Allegato (candidature): al posto del controllo grezzo del browser. */
.wpcf7 .wpcf7-form input[type="file"].wpcf7-form-control {
	box-sizing: border-box;
	width: 100%;
	min-height: 48px;
	padding: 8px 14px 8px var(--mopi-pad, 14px);
	border: 1px dashed var(--mopi-bordo);
	border-radius: 6px;
	background: #fff;
	font-family: inherit;
	font-size: 15px;
	color: var(--mopi-tenue);
	cursor: pointer;
}

.wpcf7 .wpcf7-form input[type="file"].wpcf7-form-control:hover {
	border-color: var(--mopi-verde);
}

.wpcf7 .wpcf7-form input[type="file"]::file-selector-button {
	margin-right: 12px;
	padding: 7px 14px;
	border: 1px solid var(--mopi-verde);
	border-radius: 4px;
	background: #fff;
	font: inherit;
	color: var(--mopi-verde);
	cursor: pointer;
}

/* ---------- Come associarsi ---------- */

.mopi-adesione {
	font-family: Roboto, sans-serif;
}

/* Azzera i margini del tema sui paragrafi; le regole sotto, tutte con prefisso .mopi-adesione, rimettono gli spazi voluti. */
.mopi-adesione p {
	margin: 0;
	font-family: inherit;
}

/* I tre passi, a sinistra. */
.mopi-passi {
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
	counter-reset: passo;
}

.mopi-passi > li {
	position: relative;
	margin: 0;
	padding: 0 0 30px 56px;
	counter-increment: passo;
}

.mopi-passi > li:last-child {
	padding-bottom: 0;
}

.mopi-passi > li::before {
	content: counter(passo);
	position: absolute;
	top: -2px;
	left: 0;
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border: 1px solid var(--mopi-verde);
	border-radius: 50%;
	font-family: "Roboto Slab", serif;
	font-size: 17px;
	color: var(--mopi-verde);
}

/* Filo che unisce i numeri. */
.mopi-passi > li:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 40px;
	bottom: 6px;
	left: 18px;
	width: 1px;
	background: var(--mopi-linea);
}

.mopi-adesione .mopi-passi h3 {
	margin: 0 0 6px;
	font-family: "Roboto Slab", serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.35;
	color: var(--mopi-inchiostro);
}

.mopi-adesione .mopi-passi p {
	font-size: 15px;
	line-height: 1.65;
	color: var(--mopi-testo);
}

.mopi-adesione .mopi-passi p + p {
	margin-top: 10px;
}

.mopi-passi a {
	color: var(--mopi-verde);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.mopi-adesione .mopi-iban {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 12px;
	padding: 12px 16px;
	border-radius: 6px;
	background: var(--mopi-beige);
}

.mopi-iban-etichetta {
	font-size: 13px;
	color: var(--mopi-tenue);
}

/* Un tocco seleziona tutto il codice. I gruppi da 4 sono solo spazio visivo: copiato resta senza spazi. */
.mopi-iban-codice {
	font-size: 16px;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	letter-spacing: .03em;
	color: var(--mopi-inchiostro);
	user-select: all;
}

.mopi-iban-codice > span {
	display: inline-block;
	margin-right: .4em;
}

.mopi-iban-codice > span:last-child {
	margin-right: 0;
}

/* Le due quote, a destra. */
.mopi-quote {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 20px;
}

.mopi-quota {
	display: flex;
	flex-direction: column;
	padding: 30px 28px 28px;
	border: 1px solid var(--mopi-linea);
	border-radius: 4px;
	background: #fff;
}

.mopi-adesione .mopi-quota h3 {
	margin: 0;
	font-family: "Roboto Slab", serif;
	font-size: 22px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--mopi-verde);
}

.mopi-adesione .mopi-quota-per {
	margin-top: 4px;
	font-size: 15px;
	color: var(--mopi-tenue);
}

/* Il prezzo è l'informazione che si cerca: lo si legge per primo. */
.mopi-adesione .mopi-quota-prezzo {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin-top: 26px;
}

.mopi-cifra {
	font-family: "Roboto Slab", serif;
	font-size: 52px;
	font-weight: 300;
	line-height: 1;
	letter-spacing: -.01em;
	color: var(--mopi-inchiostro);
	font-variant-numeric: lining-nums;
}

.mopi-periodo {
	font-size: 15px;
	color: var(--mopi-tenue);
}

.mopi-adesione .mopi-quota-alt {
	margin-top: 10px;
	font-size: 15px;
	color: var(--mopi-testo);
}

.mopi-adesione .mopi-quota-ingresso {
	margin-top: 22px;
	padding-top: 16px;
	border-top: 1px solid var(--mopi-linea);
	font-size: 14px;
	line-height: 1.5;
	color: var(--mopi-tenue);
}

/* Il pulsante sta in fondo alla card, allineato fra le due anche se i testi hanno lunghezze diverse. */
.mopi-quota-azione {
	margin-top: auto;
	padding-top: 24px;
}

.mopi-quota-azione p {
	margin: 0;
}

.mopi-quota-azione .paoc-popup-btn {
	box-sizing: border-box;
	display: block;
	width: 100%;
	padding: 14px 20px;
	border-radius: 6px;
}

.mopi-adesione .mopi-quote-nota {
	grid-column: 1 / -1;
	padding: 16px 20px;
	border-radius: 4px;
	background: var(--mopi-beige);
	font-size: 15px;
	line-height: 1.6;
	color: var(--mopi-testo);
}

.mopi-quote-nota strong {
	color: var(--mopi-inchiostro);
}

@media (max-width: 600px) {
	.mopi-quota {
		padding: 26px 22px 24px;
	}

	.mopi-cifra {
		font-size: 46px;
	}
}