/* =========================================================
   ABBELLIMENTI SHARA
   Card con rilievo, foto e video incorniciati,
   slider più elegante e comparsa morbida degli elementi allo scorrimento.
   Per spegnere tutto: in functions.php togli la riga che carica "shara-abbellimenti".
   ========================================================= */

:root {
	--oro: #d9b151;
	--oro-chiaro: #e9cf8a;
	--crema: #f7f0de;
	--ombra-morbida: 0 6px 18px rgba(83, 54, 40, .10);
	--ombra-alta: 0 14px 30px rgba(83, 54, 40, .18);
	--raggio: 10px;
}

/* ---------- Titoli di sezione ---------- */
.dt-sc-title-with-icon { letter-spacing: .06em; }
.dt-sc-title-with-icon::before, .dt-sc-title-with-icon::after { height: 1px; border: 0; box-shadow: none; }
.dt-sc-title-with-icon::before { background: linear-gradient(to right, transparent, #c9ad74); }
.dt-sc-title-with-icon::after  { background: linear-gradient(to left, transparent, #c9ad74); }
.dt-sc-title-with-icon .fa {
	display: inline-flex; align-items: center; justify-content: center;
	width: 34px; height: 34px; border-radius: 50%; font-size: 15px;
	color: #fff; background: linear-gradient(135deg, var(--c-sand), var(--c-brown));
	box-shadow: 0 0 0 4px rgba(217, 177, 81, .25);
}

/* ---------- Card "La nostra missione" ---------- */
.dt-sc-ico-content.type3 {
	position: relative; overflow: hidden; padding-top: 28px;
	border-radius: var(--raggio); border-top: 3px solid var(--oro);
	background: linear-gradient(180deg, var(--crema), #efe5cc);
	box-shadow: var(--ombra-morbida);
	transition: transform .35s ease, box-shadow .35s ease;
}
.dt-sc-ico-content.type3:hover { transform: translateY(-6px); box-shadow: var(--ombra-alta); }
.dt-sc-ico-content.type3 .icon {
	background: linear-gradient(135deg, var(--c-sand), var(--c-brown));
	box-shadow: 0 0 0 6px rgba(217, 177, 81, .22), 0 6px 14px rgba(83, 54, 40, .25);
	transition: transform .35s ease, background .35s ease;
}
.dt-sc-ico-content.type3:hover .icon { transform: scale(1.08) rotate(-6deg); background: linear-gradient(135deg, var(--oro), #b8862f); }
.dt-sc-ico-content.type3 h4 { letter-spacing: .05em; }

/* ---------- Box con pulsante (Sostieni, Scarica modulo...) ---------- */
.dt-sc-callout-box {
	border-radius: var(--raggio); border-left: 4px solid var(--oro);
	background: linear-gradient(100deg, #fdf8ea, #f6ecd2);
	box-shadow: var(--ombra-morbida);
	transition: transform .35s ease, box-shadow .35s ease;
}
.dt-sc-callout-box:hover { transform: translateY(-3px); box-shadow: var(--ombra-alta); }
.dt-sc-callout-box .callout-icon {
	flex: 0 0 56px;
	background: linear-gradient(135deg, var(--c-brown), var(--c-sand));
	box-shadow: 0 0 0 5px rgba(217, 177, 81, .25);
}
.dt-sc-callout-box h4 { letter-spacing: .04em; }

/* ---------- Foto e video ---------- */
.entry-content .wpb_single_image img,
.entry-content img.size-large, .entry-content img.size-full {
	border-radius: 8px; box-shadow: var(--ombra-morbida);
	transition: transform .4s ease, box-shadow .4s ease;
}
.entry-content .wpb_single_image a:hover img,
.home .entry-content .wpb_single_image img:hover,
.home .entry-content img.size-large:hover { transform: scale(1.015); box-shadow: var(--ombra-alta); }
.entry-content .video-wrap {
	overflow: hidden; border-radius: 12px;
	box-shadow: 0 0 0 5px var(--crema), 0 0 0 6px rgba(201, 173, 116, .6), var(--ombra-alta);
}

/* ---------- Slider della home ---------- */
.shara-slider .slide::after {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: inherit; transform: scale(1); transition: transform 9s linear;
}
.shara-slider .slide.is-active::after { transform: scale(1.08); } /* zoom lento sulla foto */
.shara-slider .slide::before { background: linear-gradient(180deg, rgba(40, 34, 31, .15) 0%, rgba(40, 34, 31, .35) 55%, rgba(40, 34, 31, .7) 100%); }
.shara-slider .slide-layers .slide-text { letter-spacing: .12em; }
.shara-slider .slide.is-active .slide-layers > * { animation: shara-sale .9s ease both; }
.shara-slider .slide.is-active .slide-layers > :nth-child(2) { animation-delay: .25s; }
.shara-slider > button {
	width: 46px; height: 46px; border: 1px solid rgba(255, 255, 255, .5);
	background: rgba(40, 34, 31, .35); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
	transition: background .25s, border-color .25s;
}
.shara-slider > button:hover { background: var(--oro); border-color: var(--oro); color: var(--c-dark); }
/* linea dorata sotto lo slider */
.shara-slider { box-shadow: inset 0 -3px 0 var(--oro); }
.shara-slider .slide.is-active { z-index: 1; }
@keyframes shara-sale { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

/* ---------- Comparsa morbida allo scorrimento ---------- */
.shara-reveal .shara-anim { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; transition-delay: var(--ritardo, 0s); }
.shara-reveal .shara-anim.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	.shara-reveal .shara-anim { opacity: 1; transform: none; transition: none; }
	.shara-slider .slide::after, .shara-slider .slide.is-active .slide-layers > * { transition: none; animation: none; transform: none; }
	.dt-sc-ico-content.type3, .dt-sc-callout-box, .entry-content img { transition: none; }
}

@media (max-width: 767px) {
	.dt-sc-callout-box:hover, .dt-sc-ico-content.type3:hover { transform: none; }
}
