/*
Theme Name: David Callari
Theme URI: https://www.davidcallari.it/
Description: Blocksy Child theme
Author: Luca Scarpellini
Author URI: https://www.lucascarpellini.it/
Template: blocksy
Version: 1.0.0
Text Domain: blocksy
License: GNU General Public License v3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Update URI: false
*/


/* ----- Variabili ----- */
:root {
	--gradient-v: linear-gradient(180deg, #178292 0%, #911484 50%, #D4A237 100%);
	--gradient2-v: linear-gradient(180deg, #91148B 20%, #D4A237 80%);
	--gradient-o: linear-gradient(90deg, #178292 0%, #911484 50%, #D4A237 100%);
	--arrow-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 12'%3E%3Cpath d='M0.21967 0.21967C0.512563 -0.0732233 0.987324 -0.0732233 1.28022 0.21967L6.28022 5.21967C6.57311 5.51256 6.57311 5.98732 6.28022 6.28022L1.28022 11.2802C0.987324 11.5731 0.512563 11.5731 0.21967 11.2802C-0.0732233 10.9873 -0.0732233 10.5126 0.21967 10.2197L4.6894 5.74994L0.21967 1.28022C-0.0732233 0.987324 -0.0732233 0.512563 0.21967 0.21967Z'/%3E%3C/svg%3E");
}


/* ----- Layout ----- */
.ct-footer {
    background-size: cover!important;
    background-position: center center!important;
}

[data-column*=copyright] {
    padding-right: 60px;
}

#offcanvas .ct-panel-inner {
    max-width: 360px!important;
}

.rifletti-x img {
    transform: scalex(-1)!important;
}

ul.wp-block-list, ol.wp-block-list {
    padding-inline-start: 15px!important;
    margin-block-end: 0px!important;
}


/* ----- Breadcrumb RankMath ----- */
.rank-math-breadcrumb {
	text-transform: uppercase!important;
	color: var(--theme-palette-color-8)!important;
	font-size: 14px!important;
	font-weight: 100!important;
}

.rank-math-breadcrumb a {
	color: var(--theme-palette-color-8)!important;
	text-decoration: none!important;
	transition: color .2s ease!important;
}

.rank-math-breadcrumb a:hover,
.rank-math-breadcrumb a:focus-visible {
	color: var(--theme-palette-color-2)!important;
}


/* ----- Elementi ----- */
hr.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
    width: 90%;
    max-width: 320px;
    height: 2px!important;
    border: none;
    background: var(--gradient-o);
    opacity: 1;
    margin: 10px auto;
}

.wp-block-separator:not(.is-style-dots) {
    width: 100%;
    height: 1px!important;
    border: none;
    background: var(--gradient-o);
    opacity: 1;
}

hr.wp-block-separator.line-black {
    background: var(--theme-palette-color-3);
}

.wp-block-post-content .wp-block-separator {
    margin-top: 60px;
    margin-bottom: 60px;
}

.skill-bar {
    background: var(--gradient-o);
}

.wp-block-post-time-to-read::before,
.entry-meta .meta-read-time::before {
    content: "Tempo di lettura:\00a0";
}


/* ----- Tipografia ----- */
.text-gradient-v {
  display: block!important;
  background: var(--gradient-v)!important;
  -webkit-background-clip: text!important;
  background-clip: text!important;
  color: transparent!important;
  -webkit-text-fill-color: transparent!important;
}

.text-gradient2-v {
  display: block!important;
  background: var(--gradient2-v)!important;
  -webkit-background-clip: text!important;
  background-clip: text!important;
  color: transparent!important;
  -webkit-text-fill-color: transparent!important;
}

.text-gradient-o {
  display: block!important;
  background: var(--gradient-o)!important;
  -webkit-background-clip: text!important;
  background-clip: text!important;
  color: transparent!important;
  -webkit-text-fill-color: transparent!important;
}

#footer a:hover {
    color: var(--theme-palette-color-2);
}


/* ----- Articoli ----- */
.card-content.type-post .ct-media-container, .single-post .wp-block-post-featured-image {
    background-color: #ffffff;
}

.card-content.type-post .entry-title a {
  display: block;
  background: var(--gradient-v);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

@property --hover-mix { syntax: '<percentage>'; inherits: true; initial-value: 0%; }

.entry-button {
  --hover-fill: color-mix(in srgb, var(--theme-palette-color-1) var(--hover-mix, 0%), transparent);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px!important;
  color: transparent;
  background:
    linear-gradient(var(--hover-fill), var(--hover-fill)),
    var(--gradient-v);
  background-origin: content-box;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: --hover-mix .2s ease;
}

.entry-button svg {
  flex: none;
  width: 7px;
  height: 12px;
  background:
    linear-gradient(var(--hover-fill), var(--hover-fill)),
    var(--gradient-v);
  -webkit-mask: var(--arrow-mask) center / contain no-repeat;
  mask: var(--arrow-mask) center / contain no-repeat;
}
.entry-button:hover,
.entry-button:focus-visible {
  --hover-mix: 100%;
}

@media (prefers-reduced-motion: reduce) {
  .entry-button { transition: none; }
}

/* Ripiego per i browser senza color-mix(): testo e freccia a tinta unita */
@supports not (color: color-mix(in srgb, red 50%, transparent)) {
  .entry-button {
    background: none;
    color: var(--theme-palette-color-1);
    -webkit-text-fill-color: currentColor;
  }

  .entry-button svg {
    background: none;
    -webkit-mask: none;
    mask: none;
  }
}


/* ----- Bottoni con bordo gradiente ----- */
@property --btn-fill {
	syntax: "<color>";
	inherits: false;
	initial-value: #ffffff;
}

.ct-header-cta[data-id="button"] .ct-button,
.wp-block-button .wp-block-button__link,
.gspb_button_wrapper > .gspb-buttonbox,
.wpcf7 .wpcf7-submit,
.ml-form-embedContainer:not(#_):not(#_) button[type] {
	--btn-fill: var(--theme-palette-color-8);
	--btn-text: var(--theme-palette-color-4);
	color: var(--btn-text) !important;
	border: 1.5px solid transparent !important;
	border-radius: 50px !important;
	background-color: transparent !important;
	background-image: linear-gradient(var(--btn-fill), var(--btn-fill)), var(--gradient-v) !important;
	background-origin: border-box !important;
	background-clip: padding-box, border-box !important;
	transition: --btn-fill 0.3s ease, color 0.3s ease, box-shadow 0.3s ease !important;
}

.ct-header-cta[data-id="button"] .ct-button:hover,
.ct-header-cta[data-id="button"] .ct-button:focus-visible,
.wp-block-button .wp-block-button__link:hover,
.wp-block-button .wp-block-button__link:focus-visible,
.gspb_button_wrapper > .gspb-buttonbox:hover,
.gspb_button_wrapper > .gspb-buttonbox:focus-visible,
.wpcf7 .wpcf7-submit:not(:disabled):hover,
.wpcf7 .wpcf7-submit:not(:disabled):focus-visible,
.ml-form-embedContainer:not(#_):not(#_) button[type]:not(:disabled):hover,
.ml-form-embedContainer:not(#_):not(#_) button[type]:not(:disabled):focus-visible {
	--btn-fill: #f3f3f3;
	box-shadow: 0 2px 4px 0 rgba(40, 40, 42, 0.20) !important;
}

.wpcf7 .wpcf7-submit:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* MailerLite: spinner di invio nel colore del testo del bottone */
.ml-form-embedContainer .ml-form-embedSubmitLoad::after {
	border-color: var(--btn-text) var(--btn-text) var(--btn-text) transparent;
}

/* MailerLite: font bottone*/
.ml-form-embedContainer:not(#_):not(#_) button[type] {
	font-family: inherit !important;
	font-size: var(--theme-button-font-size, 14px) !important;
	font-weight: var(--theme-button-font-weight, 700) !important;
	line-height: var(--theme-button-line-height, 20px) !important;
	padding: var(--theme-button-padding, 10px) !important;
	min-height: var(--theme-button-min-height, auto);
}

.ml-form-formContent.horozintalForm .ml-form-horizontalRow .ml-button-horizontal {
    width: auto!important;
    float: left!important;
}


/* ----- Bottoni social ----- */
.ct-social-box .ct-icon-container {
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.ct-social-box .ct-icon-container:hover {
  transform: scale(1.25);
}


/* ----- Bottone WhatsApp flottante ----- */
.ls-float-btn {
    position: fixed;
    right: clamp(14px, 3vw, 35px);
    bottom: clamp(14px, 3vw, 35px);
    z-index: 200;
    width: 70px;
    height: 70px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background-color: transparent;
    transition: transform .2s ease, filter .2s ease;
}

@media (max-width: 689.98px){
.ls-float-btn{
	width: 64px;
    height: 64px;
}
}

.ls-float-btn:hover {
	transform: translateY(-3px) scale(1.05);
	filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.25));
}

.ls-float-btn img {
	width: 100%;
	height: 100%;
	pointer-events: none;
}


/* ----- Form contatto generico ----- */
.cf7-ct {
	display: grid;
	gap: 20px;
}

.cf7-ct-consent-group {
	display: grid;
	gap: 10px;
}

.cf7-ct label {
	margin: 0;
}

.cf7-ct-label {
	display: block;
	margin-bottom: 0.35em;
	color: var(--theme-palette-color-8);
}

.cf7-ct-consent .wpcf7-list-item-label {
	font-size: 12px;
	font-weight: 400;
	color: var(--theme-palette-color-8);
}

.cf7-ct-consent a {
	color: inherit;
	text-decoration: underline;
}

.cf7-ct-consent a:hover,
.cf7-ct-consent a:focus-visible {
	color: var(--theme-palette-color-2);
}

.cf7-ct-consent .wpcf7-list-item label {
	display: flex!important;
	align-items: flex-start;
	gap: 6px;
}

.cf7-ct-consent .wpcf7-list-item-label {
	line-height: 1.5;
}

.cf7-ct-consent .wpcf7-list-item input[type="checkbox"] {
	flex-shrink: 0;
	margin: 1px 0 0;
}

.cf7-ct .cf7-ct-input:focus, .cf7-ct .cf7-ct-textarea:focus {
	outline: 1px solid var(--theme-palette-color-2);
	outline-offset: -1px;
}

/* Nasconde il messaggio di successo (box verde) di CF7 */
.wpcf7 form.sent .wpcf7-response-output {
  display: none !important;
}


/* ----- Form newsletter ----- */
.cf7-nl {
	display: grid;
	gap: 20px;
	width: 100%;
	max-width: 620px;
	margin-inline: auto;
}

.cf7-nl label {
	margin: 0;
}

/* Campi affiancati, impilati su mobile */
.cf7-nl-fields {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}

@media (max-width: 689.98px) {
	.cf7-nl-fields {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Bordo gradiente */
.cf7-nl .cf7-nl-input {
	--field-fill: var(--theme-form-field-background-initial-color);
	width: 100%;
	border: 1px solid transparent !important;
	background-color: transparent !important;
	background-image: linear-gradient(var(--field-fill), var(--field-fill)), var(--gradient-o) !important;
	background-origin: border-box !important;
	background-clip: padding-box, border-box !important;
}

.cf7-nl .cf7-nl-input:focus {
	outline: 1px solid var(--theme-palette-color-2);
	outline-offset: -1px;
}

/* Accettazione centrata */
.cf7-nl-consent {
	text-align: center;
}

.cf7-nl-consent .wpcf7-list-item {
	margin: 0;
}

.cf7-nl-consent .wpcf7-list-item label {
	display: flex!important;
	align-items: flex-start;
	gap: 6px;
	text-align: left;
}

.cf7-nl-consent .wpcf7-list-item-label {
	font-size: 12px;
	font-weight: 400;
	line-height: 1.5;
}

.cf7-nl-consent .wpcf7-list-item input[type="checkbox"] {
	flex-shrink: 0;
	margin: 1px 0 0;
}

.cf7-nl-consent a {
	color: inherit;
	text-decoration: underline;
}

.cf7-nl-consent a:hover,
.cf7-nl-consent a:focus-visible {
	color: var(--theme-palette-color-2);
}

/* Bottone centrato */
.cf7-nl-actions {
	text-align: center;
}

.wpcf7 .wpcf7-submit {
    float: inherit!important;
}

.cf7-nl-actions .wpcf7-spinner {
	position: absolute;
}

.wpcf7:has(.cf7-nl) .wpcf7-response-output {
	max-width: 620px;
	margin-inline: auto;
	text-align: center;
}


/* ----- FAQ Rank Math ----- */

#rank-math-faq {
	--faq-line: #c5cbcc;            /* linee di separazione */
	--faq-line-width: 1px;
	--faq-q-size: 1.125rem;         /* domanda: 18px */
	--faq-q-weight: 600;            /* domanda: semibold */
	--faq-q-lh: 1.33;
	--faq-a-size: 1rem;             /* risposta: 16px */
	--faq-a-lh: 1.5;
	--faq-pad: 1.125rem;            /* 18px sopra e sotto la domanda e sotto la risposta */
	--faq-pad-open: .75rem;         /* 12px tra domanda aperta e risposta */
	--faq-speed: .3s;
	--faq-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 8'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Linea sotto ogni voce, nessuna linea sopra la prima */
#rank-math-faq .rank-math-list-item {
	margin: 0;
	border-bottom: var(--faq-line-width) solid var(--faq-line);
}

/* Domanda: stesso carattere del testo, non quello dei titoli del tema */
#rank-math-faq .rank-math-question {
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-size: var(--faq-q-size);
	font-weight: var(--faq-q-weight);
	line-height: var(--faq-q-lh);
	letter-spacing: normal;
	text-transform: none;
}

#rank-math-faq .rank-math-answer {
	font-size: var(--faq-a-size);
	line-height: var(--faq-a-lh);
}

/* Il pulsante eredita il font dell'h3 e azzera gli stili dei pulsanti del tema */
#rank-math-faq .rank-math-toggle,
#rank-math-faq .rank-math-toggle:hover,
#rank-math-faq .rank-math-toggle:focus,
#rank-math-faq .rank-math-toggle:active {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	width: 100%;
	margin: 0;
	padding: var(--faq-pad) 0;
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	color: inherit;
	font: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	text-align: left;
	cursor: pointer;
	transition: padding-bottom var(--faq-speed) ease;
}

/* Domanda aperta: spazio ridotto verso la risposta */
#rank-math-faq .is-open .rank-math-toggle {
	padding-bottom: var(--faq-pad-open);
}

#rank-math-faq .rank-math-toggle:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 4px;
}

/* Chevron a tratto 2px con terminali arrotondati, colore del testo */
#rank-math-faq .rank-math-toggle::after {
	content: "";
	flex: none;
	width: 14px;
	height: 8px;
	background-color: currentColor;
	-webkit-mask: var(--faq-icon) center / contain no-repeat;
	mask: var(--faq-icon) center / contain no-repeat;
	transition: transform var(--faq-speed) ease;
}
#rank-math-faq .rank-math-toggle[aria-expanded="true"]::after {
	transform: rotate(180deg);
}

/* Le regole seguenti valgono solo se il JS è partito:
   senza JS le risposte restano tutte visibili */
#rank-math-faq.is-accordion .rank-math-answer {
	display: grid;
	grid-template-rows: 0fr;
	margin: 0;
	padding: 0;
	visibility: hidden;
	transition: grid-template-rows var(--faq-speed) ease, visibility var(--faq-speed);
}
#rank-math-faq.is-accordion .is-open > .rank-math-answer {
	grid-template-rows: 1fr;
	visibility: visible;
}
#rank-math-faq .rank-math-answer-inner {
	min-height: 0;
	overflow: hidden;
}
#rank-math-faq .rank-math-answer-inner > :first-child { margin-top: 0; }
#rank-math-faq .rank-math-answer-inner > :last-child  { margin-bottom: var(--faq-pad); }

@media (prefers-reduced-motion: reduce) {
	#rank-math-faq .rank-math-answer,
	#rank-math-faq .rank-math-toggle,
	#rank-math-faq .rank-math-toggle::after { transition: none; }
}

@media print {
	#rank-math-faq.is-accordion .rank-math-answer { grid-template-rows: 1fr; visibility: visible; }
	#rank-math-faq .rank-math-toggle::after { display: none; }
}


/* ----- Contrasto elevato (Windows) ----- */
/* Con i temi a contrasto le sfumature vengono rimosse:
   il testo torna al colore di sistema invece di restare trasparente */
@media (forced-colors: active) {
	.text-gradient-v,
	.text-gradient2-v,
	.text-gradient-o,
	.card-content.type-post .entry-title a,
	.entry-button {
		-webkit-text-fill-color: currentColor !important;
	}
}


/* ----- Embedded Form MailerLite ----- */
.ml-form-embedContainer, .ml-form-embedWrapper.embedForm {
    width: 100%!important;
	max-width: none!important;
}

.ml-form-formContent.horozintalForm .ml-form-horizontalRow .ml-input-horizontal {
    width: 100%!important;
}

.ml-form-embedContainer .ml-input-horizontal > .horizontal-fields:last-child {
	padding-right: 0 !important;
}

@media (max-width: 999px) {
.ml-form-formContent.horozintalForm .ml-form-horizontalRow .horizontal-fields {
    padding-right: 0px;
    width: 100%!important;
    padding-bottom: 15px;
}
}

.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedContent h4, .ml-form-embedContainer .ml-form-embedWrapper .ml-form-successBody .ml-form-successContent h4 {
    font-size: 32px!important;
    font-weight: 800!important;
}

.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedContent h4, .ml-form-embedContainer .ml-form-embedWrapper .ml-form-successBody .ml-form-successContent h4, .ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedContent p, .ml-form-embedContainer .ml-form-embedWrapper .ml-form-successBody .ml-form-successContent p {
    color: var(--theme-palette-color-5)!important;
    font-family: var(--theme-font-family)!important;
    margin: 0!important;
}

.ml-form-embedContainer {
	position: relative !important;
    background-color: transparent!important;
    background: var(--gradient-o)!important;
    border-width: 0px!important;
    border-radius: 0px!important;
    margin: 40px 0px!important;
    padding: 20px!important;
}

.ml-form-embedContainer::after {
    content: "";
    display: block;
    position: absolute;
    right: -70px;
    bottom: -100px;
    width: 260px;
    height: 260px;
    background: url('/wp-content/uploads/2026/09/pittogramma-dc-bn.svg') no-repeat center / contain;
    pointer-events: none;
	z-index: 1;
}

.ml-form-embedContainer .ml-form-embedWrapper {
	background-color: transparent!important;
}

.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody {
    padding-top: 0!important;
}

.ml-form-embedContainer .ml-form-embedWrapper .ml-block-form .ml-field-group label {
    margin-bottom: 5px!important;
    color: var(--theme-palette-color-5)!important;
    font-family: var(--theme-font-family)!important;
    display: inline-block!important;
    font-size: 15px!important;
    font-weight: 600!important;
}

.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-horizontalRow input {
    border-radius: 0!important;
    border-width: 0px!important;
    font-family: var(--theme-form-font-family);
    font-size: var(--theme-form-font-size, 16px);
    font-weight: var(--theme-form-font-weight);
    font-style: var(--theme-form-font-style, inherit);
    line-height: var(--theme-form-line-height);
    letter-spacing: var(--theme-form-letter-spacing);
    text-transform: var(--theme-form-text-transform);
    -webkit-text-decoration: var(--theme-form-text-decoration);
    text-decoration: var(--theme-form-text-decoration);
}

/* Paragrafi completamente vuoti: <p></p> */
.ml-form-embedContainer p:empty {
  display: none;
}

/* Paragrafi con solo un <br>: <p><br></p> */
.ml-form-embedContainer p:has(> br:only-child) {
  display: none;
}

.ml-form-embedPermissions p, .ml-form-embedPermissions p a, .ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedPermissions .ml-form-embedPermissionsOptionsCheckbox .label-description {
	color: var(--theme-palette-color-5)!important;
	font-family: var(--theme-form-font-family)!important;
    font-weight: 400!important;
}

.ml-form-recaptcha {
    z-index: 2;
    position: relative;
    margin-bottom: 15px!important;
}