/**
 * Pagina Contatti — strato CSS aggiuntivo, allineato allo screenshot di
 * riferimento fornito da Gianluca. Tutto ciò che è già coperto dal
 * design system (colori, card base, tipografia) vive in resources.css;
 * qui solo il layout specifico di questa pagina.
 */

/* ── Griglia di spaziatura ──────────────────────────────────────────────── */
.bv-contact-wrap { --bv-cs-section-gap: 88px; }
.bv-contact-wrap > section { margin-top: var(--bv-cs-section-gap); }
.bv-contact-wrap > section:first-child { margin-top: 0; }
@media (max-width: 700px) {
	.bv-contact-wrap { --bv-cs-section-gap: 56px; }
}

/* ── Titoli di sezione: piccola barra verde invece del testo pieno ──────── */
.bv-contact-wrap .bv-res-section-title,
.bv-contact-wrap .bv-res-goals__title { position: relative; padding-bottom: .85rem; margin-bottom: 2rem; }
.bv-contact-wrap .bv-res-section-title::after,
.bv-contact-wrap .bv-res-goals__title::after {
	content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
	width: 46px; height: 3px; border-radius: 2px; background: var(--bv-res-green, #2d6a4f);
}
/* Le due sezioni con titolo allineato a sinistra (Form, Prima di
   contattarci) spostano anche la barra a sinistra. */
.bv-contact-form-block__form .bv-res-section-title,
.bv-contact-before__intro-text .bv-res-section-title { text-align: left; }
.bv-contact-form-block__form .bv-res-section-title::after,
.bv-contact-before__intro-text .bv-res-section-title::after { left: 0; transform: none; }

/* ── Hero ────────────────────────────────────────────────────────────────── */
.bv-contact-hero__title-inner { position: relative; display: inline-block; }
.bv-contact-hero__sprig {
	position: absolute; top: -.35em; right: -1.9rem; width: 2.1rem; height: 2.1rem;
	background: var(--bv-res-green, #2d6a4f);
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'><path d='M4 14c3-6 7-9 15-11-1 7-3 12-9 14-3 1-5 0-6-3Z'/><path d='M4 14c2 1 4 3 5 6'/></svg>") center / contain no-repeat;
	mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'><path d='M4 14c3-6 7-9 15-11-1 7-3 12-9 14-3 1-5 0-6-3Z'/><path d='M4 14c2 1 4 3 5 6'/></svg>") center / contain no-repeat;
	transform: rotate(18deg);
}
.bv-contact-hero__cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem; }
.bv-contact-hero__cta-icon { display: inline-flex; margin-right: .5rem; vertical-align: -3px; }
.bv-contact-hero__cta-icon svg { width: 16px; height: 16px; }
.bv-contact-hero__note {
	display: inline-flex; align-items: center; gap: .5rem;
	font-size: .8125rem; color: var(--bv-res-text-muted, #6b7280);
}
.bv-contact-hero__note span:first-child { display: flex; color: var(--bv-res-green, #2d6a4f); }
.bv-contact-hero__note span svg { width: 15px; height: 15px; }

.bv-contact-hero__micropoints {
	list-style: none; margin: 1.5rem 0 0; padding: 0;
	display: flex; flex-direction: column; gap: .625rem;
}
.bv-contact-hero__micropoints li {
	display: flex; align-items: center; gap: .625rem;
	font-size: .875rem; font-weight: 600; color: var(--bv-res-text, #1a1a2e);
}
.bv-contact-hero__micropoint-icon {
	display: flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 22px; height: 22px; border-radius: 50%;
	background: var(--bv-res-green-light, #EDF6F0); color: var(--bv-res-green, #2d6a4f);
}
.bv-contact-hero__micropoint-icon svg { width: 12px; height: 12px; }

.bv-contact-hero__img-mobile { display: none; }
@media (max-width: 700px) {
	.bv-contact-hero__img-desktop { display: none; }
	.bv-contact-hero__img-mobile { display: block; width: 100%; height: auto; }
}

/* ── Card Servizi: cerchio icona centrato, testo centrato, freccia sotto ── */
.bv-contact-services { position: relative; overflow: hidden; }
.bv-contact-services__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.bv-contact-service-card {
	display: flex; flex-direction: column; align-items: center; text-align: center; gap: .5rem;
	background: #fff; border: 1px solid var(--bv-res-border, #e5e7eb); border-radius: 18px;
	padding: 2rem 1.5rem; text-decoration: none; color: inherit; position: relative; overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease;
}
.bv-contact-service-card::before {
	content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px;
	background: var(--bv-res-green, #2d6a4f);
	transform: scaleX(0); transform-origin: left; transition: transform .3s ease;
}
.bv-contact-service-card:hover::before { transform: scaleX(1); }
.bv-contact-service-card:hover { transform: translateY(-6px); box-shadow: 0 16px 32px rgba(0,0,0,.09); }
.bv-contact-service-card__icon {
	display: flex; align-items: center; justify-content: center;
	width: 60px; height: 60px; border-radius: 50%;
	background: var(--bv-res-green-light, #EDF6F0); color: var(--bv-res-green, #2d6a4f);
	margin-bottom: .5rem;
}
.bv-contact-service-card__icon svg { width: 26px; height: 26px; }
.bv-contact-service-card__title { font-size: .9375rem; color: var(--bv-res-text, #1a1a2e); }
.bv-contact-service-card__text { font-size: .8125rem; color: var(--bv-res-text-muted, #6b7280); line-height: 1.5; }
.bv-contact-service-card__arrow { display: flex; color: var(--bv-res-text-muted, #6b7280); margin-top: .25rem; }
.bv-contact-service-card__arrow svg { width: 15px; height: 15px; }
.bv-contact-service-card:hover .bv-contact-service-card__arrow { color: var(--bv-res-green, #2d6a4f); }

@media (max-width: 1024px) { .bv-contact-services__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .bv-contact-services__grid { grid-template-columns: 1fr; } }

/* ── Blocco Form: card unica, immagine a filo bordo (nessun padding) ────── */
.bv-contact-form-block__card {
	background: #fff; border-radius: 22px; box-shadow: 0 12px 30px rgba(0,0,0,.07);
	display: grid; grid-template-columns: 1.05fr .95fr; align-items: stretch; overflow: hidden;
}
.bv-contact-form-block__form { padding: 3rem; }
.bv-contact-form-block__media { min-height: 100%; }
.bv-contact-form-block__media img { display: block; width: 100%; height: 100%; object-fit: cover; }

.bv-contact-form-block__embed { margin-top: 1.25rem; }
.bv-contact-form-block__embed input[type="text"],
.bv-contact-form-block__embed input[type="email"],
.bv-contact-form-block__embed input[type="tel"],
.bv-contact-form-block__embed select,
.bv-contact-form-block__embed textarea {
	width: 100%; border: 1.5px solid var(--bv-res-border, #e5e7eb); border-radius: 12px;
	padding: 1rem 1.125rem; font-size: .9375rem; font-family: inherit;
	margin-bottom: 1.125rem; transition: border-color .2s;
}
.bv-contact-form-block__embed input:focus,
.bv-contact-form-block__embed select:focus,
.bv-contact-form-block__embed textarea:focus {
	outline: none; border-color: var(--bv-res-green, #2d6a4f);
}
.bv-contact-form-block__embed textarea { min-height: 150px; resize: vertical; }
.bv-contact-form-block__embed button,
.bv-contact-form-block__embed input[type="submit"] {
	background: var(--bv-res-green, #2d6a4f); color: #fff; border: none; border-radius: 999px;
	min-width: 220px; padding: 1rem 2rem; font-size: .9375rem; font-weight: 700; cursor: pointer;
	transition: filter .2s, transform .2s;
}
.bv-contact-form-block__embed button:hover,
.bv-contact-form-block__embed input[type="submit"]:hover { filter: brightness(.94); transform: scale(1.02); }

@media (max-width: 1024px) {
	.bv-contact-form-block__card { grid-template-columns: 1fr; }
	.bv-contact-form-block__media { order: -1; aspect-ratio: 16/9; }
	.bv-contact-form-block__form { padding: 1.75rem; }
}

/* ── Prima di contattarci ─────────────────────────────────────────────────
   Icona chat affiancata al titolo (non sopra), 4 mini-card in un'unica
   riga senza icona: solo titolo, testo e freccia. */
.bv-contact-before__card {
	background: var(--bv-res-green-light, #EDF6F0); border-radius: 24px;
	padding: 2.75rem; display: grid; grid-template-columns: .85fr 1.15fr; gap: 2.5rem; align-items: center;
}
.bv-contact-before__intro { display: flex; align-items: center; gap: 1rem; }
.bv-contact-before__intro-icon {
	display: flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 52px; height: 52px; border-radius: 50%; background: #fff; color: var(--bv-res-green, #2d6a4f);
}
.bv-contact-before__intro-icon svg { width: 24px; height: 24px; }
.bv-contact-before__intro-text .bv-res-section-title { margin: 0 0 .35rem; padding-bottom: 0; }
.bv-contact-before__intro-text .bv-res-section-title::after { display: none; }
.bv-contact-before__intro-text .bv-res-goals__subtitle { text-align: left; margin: 0; font-size: .875rem; }

.bv-contact-before__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.bv-contact-before__mini {
	background: #fff; border-radius: 14px; padding: 1.25rem; display: flex; flex-direction: column; gap: .375rem;
	text-decoration: none; color: inherit; position: relative;
	transition: transform .25s ease, box-shadow .25s ease;
}
.bv-contact-before__mini:hover { transform: translateY(-4px); box-shadow: 0 12px 24px rgba(0,0,0,.08); }
.bv-contact-before__mini-media { width: 100%; aspect-ratio: 16/9; overflow: hidden; border-radius: 10px; margin-bottom: .5rem; }
.bv-contact-before__mini-media img { width: 100%; height: 100%; object-fit: cover; }
.bv-contact-before__mini-title { font-size: .875rem; color: var(--bv-res-text, #1a1a2e); }
.bv-contact-before__mini-text { font-size: .75rem; color: var(--bv-res-text-muted, #6b7280); line-height: 1.4; }
.bv-contact-before__mini-arrow { display: flex; color: var(--bv-res-text-muted, #6b7280); margin-top: .25rem; }
.bv-contact-before__mini-arrow svg { width: 13px; height: 13px; }
.bv-contact-before__mini:hover .bv-contact-before__mini-arrow { color: var(--bv-res-green, #2d6a4f); }

@media (max-width: 1024px) {
	.bv-contact-before__card { grid-template-columns: 1fr; padding: 2rem; }
}
@media (max-width: 700px) {
	.bv-contact-before__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
	.bv-contact-before__grid { grid-template-columns: 1fr; }
}

/* ── FAQ: griglia a 2 colonne, senza barra di ricerca ────────────────────
   Sovrascrive localmente l'aspetto del blocco FAQ condiviso (usato anche
   da Risorse Gratuite), senza toccare resources.css. */
#bv-contact-faq .bv-res-faq__search-wrap { display: none; }
#bv-contact-faq .bv-res-faq__grid { grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 700px) {
	#bv-contact-faq .bv-res-faq__grid { grid-template-columns: 1fr; }
}

/* ── Blocco Fiducia: fascia menta, icone in cerchio bianco, foglie ──────── */
.bv-contact-trust {
	position: relative; overflow: hidden;
	background: var(--bv-res-green-light, #EDF6F0);
	border-radius: 24px; padding: 3rem;
}
.bv-contact-trust__inner { position: relative; z-index: 1; }
.bv-contact-trust__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.bv-contact-trust__item { display: flex; gap: 1rem; align-items: flex-start; }
.bv-contact-trust__icon {
	display: flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 52px; height: 52px; border-radius: 50%; background: #fff; color: var(--bv-res-green, #2d6a4f);
}
.bv-contact-trust__icon svg { width: 24px; height: 24px; }
.bv-contact-trust__item strong { display: block; font-size: .9375rem; margin-bottom: .375rem; }
.bv-contact-trust__item p { margin: 0; font-size: .8125rem; color: var(--bv-res-text-muted, #6b7280); line-height: 1.5; }

@media (max-width: 700px) {
	.bv-contact-trust__grid { grid-template-columns: 1fr; gap: 1.5rem; }
}

/* ── Cluster di foglie decorative (angoli di sezione) ────────────────────
   Un unico rametto SVG riusato in 4 varianti (posizione/rotazione),
   opacità bassa: richiamo botanico coerente col brand, senza appesantire
   la pagina con immagini aggiuntive da caricare. */
.bv-contact-leaf-cluster {
	position: absolute; width: 130px; height: 130px; pointer-events: none; z-index: 0;
	background-color: var(--bv-res-green, #2d6a4f); opacity: .16;
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='black' stroke-width='3'><path d='M50 95C30 80 20 60 25 35 45 30 65 25 80 10'/><path d='M25 35c8 5 14 13 16 24'/><path d='M45 55c10 2 18 8 22 17'/></svg>") center / contain no-repeat;
	mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='black' stroke-width='3'><path d='M50 95C30 80 20 60 25 35 45 30 65 25 80 10'/><path d='M25 35c8 5 14 13 16 24'/><path d='M45 55c10 2 18 8 22 17'/></svg>") center / contain no-repeat;
}
.bv-contact-leaf-cluster--left { left: -40px; top: 50%; transform: translateY(-50%) rotate(-25deg); }
.bv-contact-leaf-cluster--right { right: -40px; top: 45%; transform: translateY(-50%) rotate(155deg); }
.bv-contact-leaf-cluster--top-left { left: -30px; top: -30px; transform: rotate(-70deg); width: 110px; height: 110px; }
.bv-contact-leaf-cluster--top-right { right: -30px; top: -30px; transform: rotate(200deg); width: 110px; height: 110px; }

@media (max-width: 900px) {
	.bv-contact-leaf-cluster { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.bv-contact-service-card,
	.bv-contact-service-card::before,
	.bv-contact-before__mini { transition: none; }
}
