/* =============================================================================
   redess.it — INTESTAZIONE
   Un solo impianto con due stati:
     .kx-pieno        fondo rosso, su tutte le pagine
     .kx-sovrapposta  appoggiata sull'immagine, sulla home
   Scorrendo, la stessa intestazione si fissa in alto e si compatta (.kx-fissata),
   e rientra solo quando si scorre verso l'alto (.kx-mostrata).

   ⚠️ Questo foglio si accoda DOPO ftc-reset e ftc-responsive (vedi functions.php):
   e' per quello che qui dentro gli !important sono pochissimi.
   ========================================================================== */

/* --- l'intestazione del tema esce di scena ------------------------------- */
header#masthead,
.ftc-mobile-wrapper { display: none !important; }

/* --- le fondamenta ------------------------------------------------------- */
.kx, .kx *, .kx *::before, .kx *::after { box-sizing: border-box; }
.kx a { text-decoration: none; }
.kx ul { list-style: none; margin: 0; padding: 0; }
.kx img { max-width: 100%; height: auto; }
.kx button { font: inherit; }
/* ⚠️ Il riquadro interno dell'intestazione ricalca ESATTAMENTE il .container
   del tema, larghezza per larghezza: e' l'unico modo perche' logo e carrello
   stiano sulla stessa colonna del contenuto della pagina. Bootstrap del tema:
   fluido fino a 991 (misurato: a 800 il tema NON usa i 750 di Bootstrap), poi 970 / 1170. */
.kx-w { width: 100%; margin: 0 auto; padding: 0 15px; }
/* ⚠️⚠️ 3/9: qui il padding NON e' zero, ed e' misurato.
   Fra 992 e 1199 px il contenuto delle pagine si ferma a 15 px DENTRO il
   bordo del contenitore (a 1100: contenitore a 65, titoli di sezione a 80),
   mentre sopra i 1200 contenuto e contenitore coincidono. Con `padding: 0`
   l'intestazione restava sul bordo del contenitore e in quella fascia
   partiva 15 px piu' a sinistra di tutto il resto della pagina. */
@media ( min-width: 992px )  { .kx-w { width: 970px;  padding: 0 15px; } }
@media ( min-width: 1200px ) { .kx-w { width: 1170px; padding: 0; } }
body.kx-bloccato { overflow: hidden; }

.kx {
	/* ⚠️ Un rosso solo. Prima l'intestazione era #a3172a e la fascia del titolo
	   delle pagine (.ftc-breadcrumb del tema) #be1e2d: due rossi vicini ma
	   diversi, appiccicati, che si scontravano. Ora l'intestazione APPOGGIA
	   sulla fascia come sulla home appoggia sulla fotografia. */
	--rosso: #be1e2d;
	--scuro: #231f1c;
	--rosso-cupo: #9c1824;
	--marchio: #be1e2d;
	--crema: #fffbef;
	--crema-cupo: #f4ecdc;
	--inchiostro: #221e1a;
	position: relative;
	z-index: 9000;
	font-family: Roboto, system-ui, -apple-system, "Segoe UI", sans-serif;
}
.kx-pieno { background: var(--rosso); }

/* ⚠️ Il velo NON e' decorazione: e' cio' che tiene leggibile il testo bianco
   qualunque fotografia ci sia sotto. Calcolato: sotto lo 0,57 di opacita', su
   un'immagine chiara il menu scende a 2,5:1. Percio' resta a 0,58 fino a dove
   finisce la riga del menu (74%) e sfuma solo dopo. */
.kx-sovrapposta {
	position: absolute;
	top: 0; left: 0; right: 0;
	padding-bottom: 38px;
	/* ⚠️ Il velo parte a .58 e non a .76: sopra c'e' la barra dei servizi, che
	   e' scura PIENA (#231f1c). Con il velo altrettanto scuro le due cose si
	   confondevano e la barra «non si vedeva». .58 e' anche il minimo calcolato
	   per tenere il testo bianco a 4,5:1 su qualunque fotografia. */
	background: linear-gradient( 180deg,
		rgba( 18, 12, 9, .58 )  0%,
		rgba( 18, 12, 9, .58 ) 74%,
		rgba( 18, 12, 9, .24 ) 89%,
		rgba( 18, 12, 9, 0 )  100% );
}

/* --- la barra dei servizi ------------------------------------------------ */
/* La barra dei servizi e' scura piena in tutti e due gli stati: e' la striscia
   che separa il sito dal resto della finestra, e tenerla uguale ovunque fa
   leggere l'intestazione come un pezzo solo invece che come due grafiche. */
.kx-top { background: var(--scuro); border-bottom: 0; }
/* un filo di luce sotto la barra: sulla fotografia serve a dire dove finisce */
.kx-sovrapposta .kx-top { box-shadow: 0 1px 0 rgba( 255, 255, 255, .14 ); }
.kx-top .kx-w {
	min-height: 36px;
	display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
	font-size: 12.5px; line-height: 36px; color: rgba( 255, 255, 255, .78 );
}
.kx-top a { color: #fff; display: inline-block; padding: 5px 0; }
.kx-top a:hover { text-decoration: underline; }
.kx-top .dx { margin-left: auto; display: flex; align-items: center; gap: 16px; }

/* ⚠️ piu' specifica del contesto (.kx-top a vale 0,1,1): se restasse .kx-fuori
   perderebbe il proprio padding e il testo uscirebbe dalla pastiglia. */
.kx-top a.kx-fuori {
	display: inline-flex; align-items: center; gap: 7px;
	border: 1px solid rgba( 255, 255, 255, .4 ); border-radius: 999px;
	padding: 0 13px; height: 27px; line-height: 1; font-size: 12px;
}
.kx-top a.kx-fuori:hover { background: rgba( 255, 255, 255, .13 ); text-decoration: none; }
.kx-lingue { display: flex; align-items: center; gap: 6px; font-size: 12px; }
.kx-lingue a { opacity: .82; padding: 5px 7px; border-radius: 5px; }
.kx-lingue a:hover { opacity: 1; background: rgba( 255, 255, 255, .14 ); text-decoration: none; }
.kx-lingue a.qui { opacity: 1; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }

/* --- la riga principale -------------------------------------------------- */
.kx-main .kx-w { min-height: 92px; display: flex; align-items: center; gap: 12px; }
.kx-marchio {
	display: flex; align-items: center; gap: 10px; flex: 0 0 auto;
	padding: 0; background: none;
}
.kx-marchio img { height: 42px; width: auto; display: block; }
.kx-marchio b { font-size: 17px; font-weight: 700; letter-spacing: .17em; color: #fff; white-space: nowrap; }
.kx-sovrapposta .kx-marchio img,
.kx-sovrapposta .kx-marchio b { filter: drop-shadow( 0 2px 10px rgba( 0, 0, 0, .45 ) ); }

/* --- il menu ------------------------------------------------------------- */
.kx-nav { display: flex; align-items: center; }
.kx-nav > li { position: relative; }
.kx-nav > li > a {
	display: flex; align-items: center; gap: 5px;
	height: 38px; padding: 0 11px; border-radius: 8px;
	font-size: 14px; font-weight: 500; color: #fff; white-space: nowrap;
}
/* ⚠️⚠️ Prima la voce della pagina corrente e quella sotto il mouse avevano la
   STESSA pastiglia chiara: su «Chi siamo» sembravano due voci attive insieme.
   Ora la corrente e' una pastiglia PIENA con il testo rosso — l'inverso del
   resto della barra — e il passaggio del mouse non e' una pastiglia ma un filo. */
.kx-nav > li.qui > a { background: var(--crema); color: var(--marchio); font-weight: 700; }
.kx-nav > li.qui > a .kx-frec { opacity: .85; }
/* ⚠️ 3/9: il passaggio del mouse NON e' piu' una pastiglia piena (rossa sulla
   home, chiara sulle interne). Era un blocco di colore che compariva sotto il
   cursore e litigava con la pastiglia della pagina corrente: due riquadri
   accesi insieme. Ora e' un filo cremisi che si allarga dal centro, uguale
   nei due stati dell'intestazione. */
.kx .kx-nav > li > a { position: relative; }
.kx .kx-nav > li:not(.qui) > a::after {
	content: ""; position: absolute; left: 11px; right: 11px; bottom: 6px;
	height: 2px; background: var(--crema); border-radius: 2px;
	transform: scaleX( 0 ); transform-origin: center;
	transition: transform .18s ease;
}
.kx .kx-nav > li:not(.qui) > a:hover::after,
.kx .kx-nav > li:not(.qui) > a:focus-visible::after,
.kx .kx-nav > li:not(.qui):focus-within > a::after { transform: scaleX( 1 ); }
@media ( prefers-reduced-motion: reduce ) {
	.kx .kx-nav > li:not(.qui) > a::after { transition: none; }
}
.kx-frec { flex: 0 0 auto; opacity: .75; }
.kx-sub {
	position: absolute; top: calc( 100% + 8px ); left: 0; min-width: 262px;
	background: var(--crema); border-radius: 12px; padding: 8px;
	box-shadow: 0 12px 34px rgba( 20, 14, 10, .26 );
	opacity: 0; visibility: hidden; transform: translateY( -6px );
	transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.kx-nav > li:hover > .kx-sub,
.kx-nav > li.aperta > .kx-sub { opacity: 1; visibility: visible; transform: none; }
.kx-sub a { display: block; padding: 9px 12px; border-radius: 8px; font-size: 14px; color: #2a2724; }
.kx-sub a:hover { background: var(--crema-cupo); color: var(--marchio); }

/* --- ricerca, account, carrello ------------------------------------------ */
.kx-azioni { margin-left: auto; display: flex; align-items: center; gap: 9px; flex: 0 0 auto; }
.kx-cerca {
	display: flex; align-items: center; gap: 8px;
	height: 44px; width: 176px; padding: 0 6px 0 13px;
	border-radius: 22px; background: var(--crema);
}
.kx-sovrapposta .kx-cerca { background: rgba( 255, 255, 255, .18 ); border: 1px solid rgba( 255, 255, 255, .36 ); }
.kx-cerca input {
	flex: 1 1 auto; min-width: 0; align-self: stretch;
	border: 0; background: none; box-shadow: none; outline: none;
	font-size: 13.5px; color: var(--inchiostro);
}
.kx-cerca input::placeholder { color: #6f645b; opacity: 1; }
.kx-sovrapposta .kx-cerca input { color: #fff; }
.kx-sovrapposta .kx-cerca input::placeholder { color: rgba( 255, 255, 255, .8 ); }
.kx-cerca button {
	flex: 0 0 auto; width: 28px; height: 28px; padding: 0;
	border: 0; background: none; cursor: pointer; color: var(--rosso);
	display: flex; align-items: center; justify-content: center;
}
.kx-sovrapposta .kx-cerca button { color: #fff; }

/* ⚠️ niente !important qui: l'aveva, e accendeva sul desktop la lente che e'
   solo da telefono, perche' batteva il display:none della media query. */
.kx-t {
	position: relative; flex: 0 0 auto;
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; border-radius: 50%; padding: 0; cursor: pointer;
	background: rgba( 255, 255, 255, .14 );
	border: 1px solid rgba( 255, 255, 255, .36 ); color: #fff;
}
a.kx-t:hover, .kx-carr:hover .kx-t { background: rgba( 255, 255, 255, .26 ); }
.kx-p {
	position: absolute; top: -4px; right: -5px;
	min-width: 21px; height: 21px; border-radius: 11px; padding: 0 5px;
	background: var(--crema); color: var(--rosso); border: 2px solid var(--rosso);
	font-size: 11px; font-weight: 700; line-height: 17px; text-align: center;
}
.kx-sovrapposta .kx-p { background: var(--marchio); color: #fff; border-color: rgba( 255, 255, 255, .55 ); }
.kx-carr-guscio { display: inline-flex; }
.kx-carr { display: flex; align-items: center; gap: 11px; }

/* ⚠️ mirata sul contenitore del testo, non su «uno span qualsiasi dentro
   .kx-carr»: quella regola (0,1,1) batteva .kx-t (0,1,0) e mandava l'icona
   del carrello fuori dal cerchio. */
.kx-carr-testo b {
	display: block; font-size: 13px; font-weight: 600; line-height: 1.35;
	letter-spacing: .04em; text-transform: uppercase; color: #fff;
}
.kx-carr-testo i {
	display: block; font-style: normal; font-size: 15px; line-height: 1.35;
	color: rgba( 255, 255, 255, .88 );
}
.kx-carr-testo i .amount { color: inherit; }

/* --- ⚠️⚠️ i colori al passaggio del mouse ------------------------------------
   Il tema li dirotta da fuori: `ul li a:hover` li fa VERDI (#82b53f) e il foglio
   dinamico delle opzioni fa `a:hover { color:#be1e2d }`, cioe' rosso su rosso:
   il menu spariva sotto il mouse. Vanno dichiarati uno per uno e piu' specifici
   del selettore del tema, non lasciati ereditare. */
.kx .kx-nav > li:not(.qui) > a:hover,
.kx .kx-nav > li:not(.qui) > a:focus { color: #fff; }
.kx .kx-nav > li.qui > a,
.kx .kx-nav > li.qui > a:hover,
.kx .kx-nav > li.qui > a:focus { color: var(--marchio); }

/* ⚠️ Sulla home il fondo e' la fotografia: il rosso del marchio ci si legge e
   fa da segnale. Sulle pagine interne il fondo E' GIA' rosso, quindi li' resta
   il velo chiaro — lo stesso colore darebbe un bottone invisibile. */
/* (il velo e la pastiglia rossa al passaggio del mouse sono stati tolti:
   il segnale ora e' il filo dichiarato sopra) */
.kx .kx-top a:hover,
.kx .kx-top a:focus { color: #fff; }
.kx .kx-lingue a:hover { color: #fff; }
.kx .kx-top a.kx-fuori:hover { color: #fff; }
.kx .kx-carr:hover .kx-carr-testo b,
.kx .kx-carr:focus .kx-carr-testo b { color: #fff; }
.kx .kx-carr:hover .kx-carr-testo i { color: rgba( 255, 255, 255, .88 ); }
.kx .kx-sub a:hover,
.kx .kx-sub a:focus { color: var(--marchio); }
.kx .kx-pan-riga > a:hover,
.kx .kx-pan-sub a:hover,
.kx .kx-pan-giu a:hover { color: var(--marchio); }
.kx .kx-cerca input:hover { color: var(--inchiostro); }
.kx-sovrapposta .kx-cerca input:hover { color: #fff; }

/* --- il contorno del fuoco, che il tema spegne ovunque -------------------- */
.kx a:focus-visible,
.kx button:focus-visible,
.kx input:focus-visible { outline: 2px solid #fff; outline-offset: 2px; border-radius: 4px; }
.kx-sub a:focus-visible { outline-color: var(--marchio); }

/* --- la barra fissa: e' la stessa intestazione, compattata ---------------- */
.kx-fissata {
	position: fixed; top: 0; left: 0; right: 0; padding-bottom: 0;
	background: var(--rosso);
	box-shadow: 0 2px 18px rgba( 20, 14, 10, .28 );
	transform: translateY( -100% );
	transition: transform .22s ease;
}
.kx-fissata.kx-mostrata { transform: none; }
.kx-fissata .kx-top { display: none; }
.kx-fissata .kx-main .kx-w { min-height: 62px; }
.kx-fissata .kx-marchio { padding: 0; }
.kx-fissata .kx-marchio img { height: 32px; }
.kx-fissata .kx-marchio b { font-size: 14px; letter-spacing: .15em; }
.kx-fissata .kx-nav > li > a { height: 34px; font-size: 13.5px; }
.kx-fissata .kx-azioni > .kx-cerca { display: none; }
.kx-fissata .kx-t { width: 38px; height: 38px; }
.kx-fissata .kx-carr-testo { display: none; }
.kx-fissata .kx-p { background: var(--crema); color: var(--rosso); border-color: var(--rosso); }
@media ( prefers-reduced-motion: reduce ) {
	.kx-fissata, .kx-sub, .kx-pannello, .kx-velo, .kx-cassetto { transition: none; }
}

/* --- quel che sul desktop non esiste ------------------------------------- */
/* ⚠️ La ricerca non e' piu' un campo sempre aperto: e' una LENTE che fa
   scendere il campo. Recupera ~190px nella riga e toglie di mezzo un modulo
   che quasi nessuno usa dalla prima schermata. */
.kx-azioni > .kx-cerca { display: none; }
.kx-lente { display: inline-flex; }
.kx-cassetto {
	display: block;
	max-height: 0;
	overflow: hidden;
	transition: max-height .24s cubic-bezier( .2, .7, .3, 1 );
	background: var(--rosso);
}
.kx-sovrapposta .kx-cassetto { background: rgba( 18, 12, 9, .72 ); }
.kx-cassetto.aperto { max-height: 96px; }
.kx-cassetto .kx-cerca {
	display: flex;
	width: auto;
	max-width: 1170px;
	height: 52px;
	margin: 0 auto 18px;
	padding: 0 6px 0 18px;
	background: var(--crema);
}
.kx-cassetto .kx-cerca input { color: var(--inchiostro); font-size: 15px; }
.kx-cassetto .kx-cerca input::placeholder { color: #6f645b; }
.kx-cassetto .kx-cerca button { width: 44px; height: 44px; color: var(--rosso); }

.kx-ham { display: none; }
.kx-velo, .kx-pannello { display: none; }

/* ⚠️ L'attributo hidden da solo NON basta: .kx-pannello{display:flex} della
   media query (0,1,0) batte il display:none del foglio del browser. Serve una
   regola con l'attributo, che vale 0,2,0. */
.kx-pannello[hidden], .kx-velo[hidden] { display: none; }
.kx [hidden] { display: none; }

/* =========================================================================
   TELEFONO E TAVOLETTA  (sotto i 1200: sopra c'e' il contenitore da 1170,
   sotto il tema scende a 970 e le otto voci non ci stanno piu')
   ========================================================================= */
@media ( max-width: 1199px ) {
	.kx-top { display: none; }
	.kx-sovrapposta { padding-bottom: 14px; }
	.kx-main .kx-w { min-height: 62px; gap: 10px; }
	.kx-fissata { display: none; }

	.kx-ham {
		display: inline-flex; align-items: center; justify-content: center;
		width: 44px; height: 44px; margin-left: 0; padding: 0;
		border: 0; background: none; color: #fff; cursor: pointer; flex: 0 0 auto;
	}
	.kx-nav { display: none; }
	.kx-marchio { padding: 6px 11px 6px 6px; border-radius: 10px; }
	.kx-marchio img { height: 32px; }
	.kx-marchio b { font-size: 14px; letter-spacing: .14em; }

	.kx-azioni { gap: 4px; }
	.kx-carr-testo { display: none; }

	/* sotto le dita la lente deve restare un bersaglio vero */
	.kx-cerca { height: 52px; }
	.kx-cerca button { width: 44px; height: 44px; }

	/* il cassetto della ricerca */
	.kx-cassetto {
		display: block; max-height: 0; overflow: hidden;
		transition: max-height .22s ease; background: var(--rosso);
	}
	.kx-sovrapposta .kx-cassetto { background: rgba( 18, 12, 9, .62 ); border-radius: 0 0 14px 14px; }
	.kx-cassetto.aperto { max-height: 90px; }
	.kx-cassetto .kx-cerca {
		display: flex; width: auto; margin: 0 12px 12px;
		padding: 0 4px 0 16px; background: var(--crema);
	}
	.kx-cassetto .kx-cerca input { color: var(--inchiostro); }
	.kx-cassetto .kx-cerca input::placeholder { color: #6f645b; }
	.kx-cassetto .kx-cerca button { color: var(--rosso); }

	/* il menu a scomparsa */
	.kx-velo {
		display: block; position: fixed; inset: 0; z-index: 9600;
		background: rgba( 18, 12, 9, .5 );
		opacity: 0; transition: opacity .2s ease;
	}
	.kx-velo.aperto { opacity: 1; }
	.kx-pannello {
		display: flex; flex-direction: column;
		position: fixed; top: 0; left: 0; bottom: 0; z-index: 9700;
		width: min( 88vw, 380px ); background: var(--crema);
		transform: translateX( -100% ); transition: transform .24s ease;
		overflow-y: auto; -webkit-overflow-scrolling: touch;
	}
	.kx-pannello.aperto { transform: none; }
	.kx-pan-cima {
		display: flex; align-items: center; gap: 10px;
		padding: 14px 12px; border-bottom: 1px solid #ece4d6;
	}
	.kx-pan-cima img { height: 36px; width: auto; }
	.kx-pan-cima b { font-size: 16px; font-weight: 700; letter-spacing: .17em; color: var(--marchio); }
	.kx-chiudi {
		margin-left: auto; width: 44px; height: 44px; padding: 0;
		border: 0; background: none; color: #3a3430; cursor: pointer;
		display: flex; align-items: center; justify-content: center;
	}
	.kx-pan-voci { padding: 6px 0; }
	.kx-pan-voci > li { border-bottom: 1px solid #f2ead9; }
	.kx-pan-riga { display: flex; align-items: stretch; }
	.kx-pan-riga > a {
		flex: 1 1 auto; display: flex; align-items: center;
		min-height: 52px; padding: 0 16px;
		font-size: 16px; font-weight: 500; color: var(--inchiostro);
	}
	.kx-pan-riga > a.qui { color: var(--marchio); font-weight: 700; }
	.kx-apri {
		flex: 0 0 auto; width: 56px; padding: 0;
		border: 0; background: none; color: #6f645b; cursor: pointer;
		display: flex; align-items: center; justify-content: center;
	}
	.kx-apri svg { transition: transform .2s ease; }
	.kx-pan-voci > li.aperta .kx-apri svg { transform: rotate( 180deg ); }
	.kx-pan-sub { display: none; padding: 2px 0 10px; background: #faf3e4; }
	.kx-pan-voci > li.aperta .kx-pan-sub { display: block; }
	.kx-pan-sub a {
		display: flex; align-items: center; min-height: 46px;
		padding: 0 16px 0 30px; font-size: 14.5px; color: #4c443d;
	}
	.kx-pan-giu {
		margin-top: auto; padding: 16px;
		border-top: 1px solid #ece4d6; background: #faf3e4;
	}
	.kx-pan-giu a {
		display: flex; align-items: center; gap: 10px;
		min-height: 46px; font-size: 14.5px; color: var(--inchiostro);
	}
	.kx-pan-giu a.kx-fuori {
		display: inline-flex; height: 44px; padding: 0 16px;
		border: 1px solid #ddd2bd; border-radius: 999px;
		font-size: 14px; color: var(--inchiostro);
	}
	.kx-pan-lingue { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
	.kx-pan-lingue a {
		display: inline-flex; align-items: center; justify-content: center;
		min-width: 44px; min-height: 44px; padding: 0 10px;
		border: 1px solid #e3d9c7; border-radius: 9px;
		font-size: 13px; font-weight: 600; color: #4c443d;
	}
	.kx-pan-lingue a.qui { border-color: var(--marchio); color: var(--marchio); background: #fdeceb; }
	.kx a:focus-visible, .kx button:focus-visible { outline-color: var(--marchio); }
	.kx-main a:focus-visible, .kx-main button:focus-visible { outline-color: #fff; }
}

/* sulla tavoletta il menu resta a scomparsa (otto voci non ci stanno) ma la
   ricerca e il totale del carrello tornano in chiaro: lo spazio c'e'. */
@media ( min-width: 600px ) and ( max-width: 1199px ) {
	.kx-main .kx-w { min-height: 70px; }
	.kx-marchio img { height: 36px; }
	.kx-carr-testo { display: block; }
}

/* sotto i 420 il nome scritto non ci sta: resta il solo tondo */
@media ( max-width: 420px ) {
	.kx-marchio b { display: none; }
	.kx-marchio { padding: 6px; border-radius: 50%; }
}

/* =============================================================================
   LA FASCIA DEL TITOLO DI PAGINA (.ftc-breadcrumb del tema)
   Era rossa come l'intestazione: due bande rosse alte in totale 380 px prima di
   arrivare al contenuto. Diventa color sabbia, cosi' il rosso resta uno solo —
   quello dell'intestazione — e la pagina respira.
   ========================================================================== */
.ftc-breadcrumb { background-color: #f2e7d1; }
.ftc-breadcrumb .ftc-breadcrumb-title h1,
.ftc-breadcrumb h1.page-title {
	font-family: Roboto, system-ui, sans-serif;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
	color: #221e1a;
}
.ftc-breadcrumb .ftc-breadcrumbs-content,
.ftc-breadcrumb .ftc-breadcrumbs-content a {
	font-family: Roboto, system-ui, sans-serif;
	font-size: 14px;
	color: #6f655c;
}
.ftc-breadcrumb .ftc-breadcrumbs-content a:hover { color: #be1e2d; }
.ftc-breadcrumb .ftc-breadcrumbs-content .brn_arrow { color: #b8ab98; }
.ftc-breadcrumb .ftc-breadcrumbs-content span.current { color: #be1e2d; font-weight: 600; }