
/*
 * BeFire 
 * SM@11-03-2026 start DEV
*/

body {
    margin: 0;
    font-family: var(--font-rubik), sans-serif;
	font-style: normal;
	font-size: 18px;
	font-weight: 400 !important;
    line-height: 23px;
    color: var(--black-default);
    background-color:var(--light-default);
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

b, strong{
	font-weight: 700 !important;
}

/* typografy */
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6{
	font-style: normal;
	line-height: 100%;   
	font-family: var(--font-oswald), sans-serif;
	font-style: normal;
	font-weight: 700;
}

h1,.h1{
	font-size: 48px;
	font-weight: 600;
	text-transform:uppercase;
}
h2,.h2{
	font-size: 40px;
	font-weight: 500;
}
h3,.h3{
	font-size: 35px;
	line-height:40px;
	letter-spacing:0%;
	font-weight: 500;
}
h4,.h4{
	font-size: 24px;
	font-weight: 400;
}
h5,.h5{
	font-size: 18px;
	font-weight: 500;
	text-transform:uppercase;
}
h6,.h6{
	font-size: 14px;
	font-weight: 600;
}

a {
	color:var(--black-default);
	text-decoration:underline;
}
a:hover {
	color:var(--text-primary-1);
}
h2 span{
	/*testo orange*/
	color: var(--text-primary-1);
}
h3 span{
	/*testo orange*/
	color: var(--text-primary-1);
}

.border-primary{
	border-image: var(--gradient-yellow-orange3) 1 !important;
}
.border-primary-reverse{
	border-image: var(--gradient-reverse-yellow-orange3) 1 !important;
}

.border-verticale-primary{
	border-image: var(--gradient-vertical-yellow-orange3) 1 !important;	
}
.border-verticale-primary-reverse{
	border-image: var(--gradient-vertical-invert-yellow-orange3) 1 !important;	
}

.column-loghi{
	padding-top:20px;
}

.two-col-block h3{
	text-transform:none !important;
}
.two-col-block h3 span{
	color: var(--text-primary-1);
	font-weight:700;
}

/* color TEXT */
.text-primary{
	color:var(--text-primary-1) !important;
}
.text-secondary{
	color:var(--text-secondary-1) !important;
}
.text-wine-dark{
	color:var(--wine-dark);
}
.text-tertiary{
	color:var(--text-tertiary);
}
.text-white{
	color:var(--bs-white) !important;
}
.text-black{
	color:var(--bs-black);
}

/* color BACKGROUNDS */
.bg_newsletter{
	background-color:var(--text-primary-4);
	padding-top:61px;
	padding-bottom:61px;
}
.bg_white{
	background-color:var(--bs-white);
}

.bg_arancio{
	background-color:var(--text-primary-1);
}
.bg_arancio_gradient{
	background:var(--gradient-yellow-orange2);
}
.bg_red_default{
	background:var(--red-default);
}



/* header */
header {
	padding-top:0;
	padding-bottom:0px;
	position: relative;
    z-index: 9999;
}



/* HERO */

#hero a{
	text-decoration:none;
}
#hero p{
	padding-top:12px;
	color: var(--yellow-default);
	font-size:24px;
	font-weight:500;
	line-height: 30px;
	text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
}

#hero .img-hero{
	background-repeat:no-repeat;
	height:658px;
	background-size:cover;
}

.logo-payoff{
	font-style: normal;
	line-height: 120%;   
	font-family: var(--font-oswald), sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:40px;
	text-transform:none;
	color: var(--bs-white);
}

/* footer*/
footer{
	background-color:var(--text-primary-1);
	color: var(--bs-white);
}
footer a{
	color: var(--bs-white);
}
footer a:hover{
	color: var(--text-buttons);
}

/* assets */
.line-sep{
	border-bottom:1px solid #fff;
	width:54%;
	margin-left: 24%;
}
.counter {
    display: inline-block;
    font-variant-numeric: tabular-nums;
    min-width: 1ch;
}

/* buttons */

.btn {
	font-size: 15px !important;
	line-height: 100%;
	letter-spacing:0%;   
	font-family: var(--font-rubik), sans-serif !important;
	font-style: normal;
	font-weight: 600;
	text-transform:uppercase;
	border-radius:50px;
	padding:11px 42px;
	color:var(--text-buttons);
	transition: transform 0.3s ease-in-out !important;
}

.btn-primary {
	background: var(--Gradient-dark, linear-gradient(90deg, #F39311 0%, #D84922 68.27%, #BA3B00 96.63%));
	color:var(--text-buttons);
	border-color:transparent;
}
.btn-primary:hover {
	background: var(--Burnt, #BA3B00);
	color:var(--text-buttons);
	border-color:transparent;
}
.btn-primary:active {
    opacity: 0.7;
}

.btn-secondary {
	border: 1.5px solid var(--Gradient-dark, #F39311);
	background: #FFF;
	color:var(--text-secondary-1);
}
.btn-secondary:hover {
	border: 1.5px solid var(--Gradient-dark, #F39311);
	background: var(--Red, #E33B2E);
	color:var(--text-buttons);
}
.btn-secondary:active {
    opacity: 0.7;
}



/* FORM CONTROLS */

.form-newsletter{
	padding:9px 27px;
	border-radius:52px;
}

.form-befire{
	background:var(--bs-white);
	border-radius:4px;
	padding:9px 24px;
	color:var(--text-input) !important;
	font-size:18px;
	line-height:30px;
	font-weight:400;
}
button.btn.btn-primary.btn-befire{
	padding:17px 79px !important;
}

/* Selettore standard placeholder per tutti gli input e textarea */
input::placeholder,
textarea::placeholder {
    color: var(--text-input) !important;
    opacity: 1; /* Fondamentale per Firefox */
}
/* Chrome, Firefox, Opera, Safari 10.1+ */
::placeholder {
    color: var(--text-input);
    opacity: 1;
}
/* Internet Explorer 10-11 */
:-ms-input-placeholder {
    color: var(--text-input) !important;
}
/* Microsoft Edge */
::-ms-input-placeholder {
    color: var(--text-input) !important;
}

.privacy_block{
	height:190px;
	overflow-y:auto;
	font-size:14px;
	padding:15px;
	border: 1px solid var(--black-default);
}

/* checkbox e radio Personalizzato */
.form-check-input:checked {
    background-color: var(--black-default);
    border-color: var(--black-default);
}

/* Switch Personalizzato */
.form-check.form-switch {
    padding-left: 2.5em;
    margin-bottom: 0;
}
.form-check.form-switch .form-check-input {
    height: 1.25em !important;
    width: 2.5em !important;
    background-image: none !important;
    background-color: #e0e0e0 !important;
    border: none !important;
    position: relative;
    cursor: pointer;
}
.form-check.form-switch .form-check-input::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 1em;
    height: 1em;
    background-color: var(--black-default) !important;
    border-radius: 50%;
    transition: transform 0.2s ease-in-out;
}
.form-check.form-switch .form-check-input:checked::after {
    transform: translateX(1.25em);
    background-color: #fff !important;
}
.form-check.form-switch .form-check-input:checked {
    background-color: var(--black-default) !important;
}


/* TOP MENU */
.top-bar {
    padding: 19px 0;
    border-bottom:1px solid var(--black-default);
}
.area-riservata {
    font-family: var(--font-oswald), sans-serif;
	font-style: normal;
	font-weight: 700;
	text-transform:uppercase;
	letter-spacing:5%;
	text-decoration:none;
	font-size:12px;
}
.social-container-footer {
    display: flex;
    align-items: center;
    gap: 10px;
}

.social-container {
    margin-left: 130px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.social-container-footer span,
.social-container span{
	font-family: var(--font-oswald), sans-serif;
	font-style: normal;
	font-weight: 700;
	letter-spacing:5%;
	font-size:12px;
}
social-container-footer img,
.social-container img {
    height: 26px;
    cursor: pointer;
}
.lang-bar a{
	font-family: var(--font-oswald), sans-serif;
	font-style: normal;
	font-weight: 700;
	letter-spacing:5%;
	font-size:12px;
	text-transform:uppercase;
}

/******** main menu ******************/

.hero-wrapper, .hero-wrapper-two {
    min-height: 92vh;
}
.hero-wrapper-short{
	min-height: 28vh;
	overflow: visible !important;
}
.object-fit-cover {
    object-fit: cover;
}
.object-fit-cover-2 {
    object-fit: cover;
    height: 100%;
}
/* Stili base di reset e layout */
.menu-list, .dropdown-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.menu-item {
  position: relative;
  display: inline-block;
}

.menu-link, 
.menu-toggle {
  	display: flex;
  	align-items: center;
  	gap: 16px; /* Spazio tra testo e chevron */
 	border: none;
  	font-family: inherit;
  	cursor: pointer;
  	padding: 10px 15px;
  	transition: opacity 0.2s ease;
  	font-weight: 600;
	letter-spacing:0%;
	line-height:100%;
	font-size:14px;
	text-transform:uppercase;
	color: #f5f5f5;
	background-color: transparent;
	text-decoration:none;
}

/* --- STATO HOVER --- */
/* Su hover, il testo va in trasparenza */
.menu-link:hover, 
.menu-toggle:hover,
.menu-link.active {
  color: var(--text-tertiary-1);
}

/* Gestione Chevron */
.chevron {
  transition: transform 0.3s ease;
}

/* --- STATO CLICK (Aperto) --- */
/* Quando il js aggiunge la classe .is-open al list-item */
.menu-item.is-open .chevron {
  transform: rotate(90deg); /* Da destra a basso */
}

.menu-item.is-open .menu-toggle {
  color: var(--text-tertiary-1);
}

/* Gestione Dropdown */
/* Gestione Dropdown */
.dropdown-list {
	padding-top:15px;
	padding-bottom:15px;
  	position: absolute;
  	top: 100%;
  	left: 0;
  	min-width: 200px;
	background: linear-gradient(90deg, #F39311 0%, #D84922 68.27%, #BA3B00 96.63%);
  	box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  	margin-top: 14px;
  	/* Logica di comparsa/scomparsa */
  	visibility: hidden;
  	opacity: 0.7;
  	transform: translateY(-10px);
  	transition: all 0.3s ease;
  	pointer-events: none;
  	border-top-right-radius:20px;
  	border-bottom-right-radius:20px;
  	border-bottom-left-radius:20px;
	z-index: 1000;
}

/* Mostra il dropdown quando è aperto */
.menu-item.is-open .dropdown-list {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Stile base link sottomenù */
.dropdown-list a {
  display: block;
  padding: 10px 15px;
  color: #f5f5f5 !important;
  text-decoration: none;
}

.dropdown-list a:hover {
  /*background-color: #f5f5f5;*/
}


.hp-payoff{
	font-weight: 600;
	font-size: 70px;
	line-height: 75px;
	letter-spacing: 0%;
    margin-bottom: 60px !important;
}

.hp-payoff-date{
	font-weight: 600;
	word-wrap: break-word;
	font-size: 45px;
	line-height: 50px;
	letter-spacing: 2%;
	text-transform:none !important;
	font-family: var(--font-oswald), sans-serif;
}

.hp-payoff-location{
	font-size: 25px;
	font-family: var(--font-rubik), sans-serif;
	font-weight: 400; 
	line-height: 35px;
	letter-spacing: 0.50px; 
	word-wrap: break-word;
}

.video-payoff-abstract{
	font-size: 18px;
	font-family: var(--font-rubik), sans-serif;
	font-weight: 400; 
	line-height: 23px;
	letter-spacing: 0.50px; 
	word-wrap: break-word;
}

/* Background arancione per il menu */
.custom-orange-bg {
    background: linear-gradient(90deg, #F39311 0%, #D84922 68.27%, #BA3B00 96.63%);
    border-radius: 50px;
    padding-top:14px;
    padding-bottom:14px;
}

.swiper{
	position:absolute;
	bottom:-5%;
	left:50%;
}



@media (max-width:576px){
    .fireobserver-content{
        padding:35px 25px;
    }
    .logo{
        max-width:220px;
    }
    .fireobserver-content p{
        font-size:18px;
    }
}

/* Su mobile, l'overlay del menu potrebbe necessitare di fix se espanso sopra il video */
@media (max-width: 991px) {
    .custom-orange-bg {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }
}


/* 1. Il container principale diventa la griglia di sovrapposizione */
.network-section {
    display: grid;
    grid-template-columns: 1fr;
    background-color: #ffffff; /* Essenziale per evitare buchi visivi durante lo scroll */
    position: relative;
}

/* Forziamo entrambi i layer ad occupare lo stesso spazio volumetrico */
.network-bg-layer,
.network-content-layer {
    grid-area: 1 / 1 / -1 / -1;
}

/* 2. Gestione dello sfondo e blocco interazioni */
.network-bg-layer {
    z-index: 1; /* Livello inferiore */
    pointer-events: none; /* Impedisce allo sfondo di intercettare i click destinati all'accordion */
}

/* Questo div entra nello schermo e si blocca in cima, occupando tutta la finestra */
.sticky-bg {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
    /*background-image: url('/media/befire/images/2027/Modalita_Isolamento.svg');*/
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain; 
}

/* 3. Gestione del layer dei contenuti (che scorre e definisce l'altezza) */
.network-content-layer {
    z-index: 2; /* Livello superiore */
    padding-top: 150px; /* Offset di ingresso */
    padding-bottom: 150px; /* Offset di uscita prima che la sezione successiva spinga */
}

/* 4. Il testo si ferma con lo scarto dell'header */
.sticky-text {
    position: -webkit-sticky;
    position: sticky;
    top: 150px; /* Allineato all'altezza dell'header Be Fire */
    height: max-content;
}


.parallax-section-tiket {
    background-repeat: no-repeat;
    background-position-x: 10%;
    background-position-y: 100%;
    background-size: 50%;
}
.sticky-column-tiket {
    position: -webkit-sticky;
    position: sticky;
    top: 70px;
    height: max-content;
    z-index: 2;
}

.custom-befire-accordion {
    display: flex;
    flex-direction: column;
    gap: 102px; /* Gestisce la spaziatura tra i blocchi arancioni */
    margin-top: 150px; /* Offset iniziale opzionale */
}

.custom-befire-accordion .accordion-item {
    background: linear-gradient(135deg, #f28a25 0%, #d44d18 100%);
    border: none;
    border-radius: 12px !important;
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
    overflow: hidden;
}

.custom-befire-accordion .accordion-button {
    background: transparent;
    color: #ffffff;
    font-size: 1.4rem;
    font-family: 'Oswald', sans-serif;
    padding: 24px 30px;
    box-shadow: none !important;
}

.custom-befire-accordion .accordion-button:not(.collapsed) {
    background: transparent;
    color: #ffffff;
    box-shadow: none;
}

.custom-befire-accordion .accordion-button::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/%3E%3Cpath d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z'/%3E%3C/svg%3E") !important;
    transition: transform 0.3s ease;
}

.custom-befire-accordion .accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/%3E%3Cpath d='M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E") !important;
    transform: none;
}

.custom-befire-accordion .accordion-body {
    padding: 0 10px 24px 10px;
    color: #ffffff;
}

.custom-befire-accordion .contact-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.custom-befire-accordion .contact-list li,
.custom-befire-accordion .contact-list li a {
    /*margin-bottom: 8px;*/
    font-size: .8rem;
    color: #ffffff;
}
.custom-befire-accordion .contact-list li a:hover{
	color: var(--text-primary-1);
}


/* Stili di base per l'immagine: comportamento su mobile (stacked) */
.split-image-wrapper {
    width: 100%;
    height: 300px; /* Altezza fissa o minima per mobile, regolala in base al design */
    position: relative;
}

.split-image {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Evita la distorsione dell'immagine */
    object-position: center;
}

/* Comportamento su Desktop: Bleed a destra e 50% della viewport */
@media (min-width: 768px) { /* Allineato al breakpoint 'md' di Bootstrap */
    .split-image-wrapper {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: 50vw; /* Esattamente metà della larghezza del browser */
        height: 100%;
    }
}


/* accordion Exhibit*/

#accordionExhibit .accordion-button,
#accordionExhibit .accordion-button:not(.collapsed) {
    border: none;
    box-shadow: none;
}

#accordionExhibit .accordion-button:focus {
    border-color: transparent;
    box-shadow: none;
    outline: none;
}

#accordionExhibit .accordion-button:not(.collapsed) {
    background-color: transparent;
    color: inherit;
}

#accordionExhibit .accordion-item{
	margin-bottom:15px;
	background-color:#fff;
	border-radius:30px;
	border:1px solid #fff;
}
#accordionExhibit .accordion-header{
	background-color:#fff;
	border-radius:30px;
	border:1px solid #fff;
}
#accordionExhibit .accordion-button{
	background-color:#fff;
	border-radius:30px;
	border:1px solid #fff;
	font-family: var(--font-rubik), sans-serif !important;
	font-weight: 600;
	font-size: 20px;
	line-height: 25px;
	letter-spacing: 2%;
}

#accordionExhibit .accordion-button::after {
    width: 30px;
    height: 30px;
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: center;
    transition: transform .25s ease;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30' fill='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='14.7764' x2='29.5527' y2='14.7764' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23F39311'/%3E%3Cstop offset='0.682692' stop-color='%23D84922'/%3E%3Cstop offset='0.966346' stop-color='%23BA3B00'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23g)' d='M14.7764 22.1645C15.195 22.1645 15.5462 22.0227 15.8299 21.739C16.1126 21.4563 16.254 21.1056 16.254 20.6869V16.254H20.7238C21.1425 16.254 21.4873 16.1121 21.7582 15.8284C22.0291 15.5457 22.1645 15.195 22.1645 14.7764C22.1645 14.3577 22.0227 14.0065 21.739 13.7228C21.4563 13.4401 21.1056 13.2987 20.6869 13.2987H16.254V8.82887C16.254 8.41021 16.1126 8.06543 15.8299 7.79453C15.5462 7.52363 15.195 7.38818 14.7764 7.38818C14.3577 7.38818 14.007 7.52954 13.7243 7.81226C13.4406 8.09597 13.2987 8.44715 13.2987 8.86581V13.2987H8.82887C8.41021 13.2987 8.06543 13.4401 7.79453 13.7228C7.52363 14.0065 7.38818 14.3577 7.38818 14.7764C7.38818 15.195 7.52954 15.5457 7.81226 15.8284C8.09597 16.1121 8.44715 16.254 8.86581 16.254H13.2987V20.7238C13.2987 21.1425 13.4406 21.4873 13.7243 21.7582C14.007 22.0291 14.3577 22.1645 14.7764 22.1645ZM14.7764 29.5527C12.7323 29.5527 10.8114 29.1646 9.01358 28.3883C7.21579 27.6131 5.65196 26.5605 4.32208 25.2306C2.99221 23.9008 1.93964 22.3369 1.16438 20.5391C0.388126 18.7413 0 16.8204 0 14.7764C0 12.7323 0.388126 10.8114 1.16438 9.01358C1.93964 7.21579 2.99221 5.65196 4.32208 4.32208C5.65196 2.99221 7.21579 1.93915 9.01358 1.1629C10.8114 0.387633 12.7323 0 14.7764 0C16.8204 0 18.7413 0.387633 20.5391 1.1629C22.3369 1.93915 23.9008 2.99221 25.2306 4.32208C26.5605 5.65196 27.6131 7.21579 28.3883 9.01358C29.1646 10.8114 29.5527 12.7323 29.5527 14.7764C29.5527 16.8204 29.1646 18.7413 28.3883 20.5391C27.6131 22.3369 26.5605 23.9008 25.2306 25.2306C23.9008 26.5605 22.3369 27.6131 20.5391 28.3883C18.7413 29.1646 16.8204 29.5527 14.7764 29.5527Z'/%3E%3C/svg%3E");
}

.accordion-button:not(.collapsed)::after {
    transform: rotate(-45deg);
}

/* card */
.card .card-text span{
	color: var(--text-primary-1);
}
















