/*
 * Eufonica landing page 
 * SM@04-11-2025 start DEV
*/


body {
    margin: 0;
    font-family: var(--body-font), var(--fallback-font), sans-serif;
    font-size: 20px;
    font-style:normal;
    font-weight: 400;
    line-height: 125%;
    color: var(--white-default);
    /*background: linear-gradient(335deg, #D04234 15.61%, rgba(208, 66, 52, 0.00) 97.69%), #941E81;*/
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}


/* typografy */
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6{
	font-style: normal;
	line-height: 125%;     
}

h1,.h1{
	font-size: 64px;
	font-weight: 500;
}
h2,.h2{
	font-size: 56px;
	font-weight: 500;
}
h3,.h3{
	font-size: 48px;
	font-weight: 500;
}
h4,.h4{
	font-size: 40px;
	font-weight: 500;
}
h5,.h5{
	font-size: 32px;
	font-weight: 500;
}
h6,.h6{
	font-size: 24px;
	font-weight: 600;
}

.text-body-l-r{font-size: 20px;font-weight: 400;}
.text-body-l-m{font-size: 20px;font-weight: 500;}
.text-body-l-b{font-size: 20px;font-weight: 600;}

.text-body-m-q{font-size: 16px;font-weight: 300;}
.text-body-m-r{font-size: 16px;font-weight: 400;}
.text-body-m-m{font-size: 16px;font-weight: 500;}
.text-body-m-b{font-size: 16px;font-weight: 600;}

.text-body-s-r{font-size: 14px;font-weight: 400;}
.text-body-s-m{font-size: 14px;font-weight: 500;}
.text-body-s-b{font-size: 14px;font-weight: 600;}

.text-body-xs-r{font-size: 12px;font-weight: 400;}
.text-body-xs-m{font-size: 12px;font-weight: 500;}
.text-body-xs-b{font-size: 12px;font-weight: 600;}

/* text-color */
.text-black-default {color: var(--black-default) !important;}
.text-black-hover {color: var(--black-hover) !important;}
.text-black-pressed {color: var(--black-pressed) !important;}

.text-white-default {color: var(--white-default) !important;}
.text-white-hover {color: var(--white-hover) !important;}
.text-white-pressed {color: var(--white-pressed) !important;}

.text-burgundy-default {color: var(--burgundy-default) !important;}
.text-burgundy-hover {color: var(--burgundy-hover) !important;}
.text-burgundy-pressed {color: var(--burgundy-pressed) !important;}

.text-purple-default {color: var(--purple-default) !important;}
.text-purple-hover {color: var(--purple-hover) !important;}
.text-purple-pressed {color: var(--purple-pressed) !important;}

.text-orange-default {color: var(--orange-default) !important;}
.text-orange-hover {color: var(--orange-hover) !important;}
.text-orange-pressed {color: var(--orange-pressed) !important;}

.text-yellow-default {color: var(--yellow-default) !important;}
.text-yellow-hover {color: var(--yellow-hover) !important;}
.text-yellow-pressed {color: var(--yellow-pressed) !important;}

.text-disabled-default {color: var(--disabled-default) !important;}
.text-disabled-strong {color: var(--disabled-strong) !important;}

/* borders */
.border-purple-default {border-color: var(--purple-default) !important;}


/* backgrounds color */
.bg-orange-default {background-color:var(--orange-default) !important;}
.bg-orange-hover {background-color:var(--orange-hover) !important;}
.bg-orange-pressed {background-color:var(--orange-pressed) !important;}

.bg-black-default {background-color:var(--black-default) !important;}
.bg-black-hover {background-color:var(--black-hover) !important;}
.bg-black-pressed {background-color:var(--black-pressed) !important;}

.bg-purple-default {background-color:var(--purple-default) !important;}
.bg-purple-hover {background-color:var(--purple-hover) !important;}
.bg-purple-pressed {background-color:var(--purple-pressed) !important;}

.bg-yellow-default {background-color:var(--yellow-default) !important;}
.bg-yellow-hover {background-color:var(--yellow-hover) !important;}
.bg-yellow-pressed {background-color:var(--yellow-pressed) !important;}

.bg-burgundy-default {background-color:var(--burgundy-default) !important;}
.bg-burgundy-hover {background-color:var(--burgundy-hover) !important;}
.bg-burgundy-pressed {background-color:var(--burgundy-pressed) !important;}

.bg-white-default {background-color:var(--white-default) !important;}
.bg-white-hover {background-color:var(--white-hover) !important;}
.bg-white-pressed {background-color:var(--white-pressed) !important;}

.bg-gradient-brand{background: var(--gradient-brand) !important;}
.bg-home {
	background: linear-gradient(164deg, #941E81 0%, #D04234 100%);
}
.bg-body-article{
	background: var(--gradient-brand);
	padding-top:140px;
}
.bg-trasparent {background: rgba(245, 240, 215, 0.10);}



/* link */
a{
	color: var(--white-default);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 125%;
}
a:hover,
a:active{
	text-decoration:underline;
}
a:focus{
	border: 1px solid #FFF;
	background: #CCC;
	box-shadow: 0 0 0 2px #000;
}
a.disabled{
	color: var(--disabled-strong);
}

header {
	border-bottom: 0.5px solid var(--white-default);
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), rgba(148, 30, 129, 0.60);
	backdrop-filter: blur(16px);
	padding-top: 2px;
    padding-bottom: 2px;
}
main {
    margin: 0;
    font-size: 20px;
    font-style:normal;
    font-weight: 400;
    line-height: 125%;
    color: var(--white-default);
    
}
footer {
	padding-top:80px;
	padding-bottom:80px;
	background-color: var(--burgundy-default);
	border-top: 0.5px solid var(--white-default);
}

/* TOP MENU e DROPDOWN */
.nav-link.dropdown-toggle {
    position: relative;
    padding-right: 1.8em !important;
}
.nav-link.dropdown-toggle::after {
	display: none;
    content: "\F282";
    font-family: bootstrap-icons !important;
    font-size: 0.8em;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    transition: transform 0.3s ease;
    display: inline-block;
    border:none;
}
.nav-link.dropdown-toggle.show::after {
    transform: translateY(-50%) rotate(180deg);
}
.nav-link{
	color: var(--white-default);
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 125%;
}

/* TOP SUB MENU */
.dropdown-menu{
	background: var(--purple-default);
	border-radius:0;
	padding:0;
}

.dropdown-menu .dropdown-item{
	color: var(--white-default);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 150%;
	border-bottom: 0.5px solid var(--white-default);
	padding:16px 24px;
}
.dropdown-menu .dropdown-item:hover{
	color: var(--purple-default);
	
}


/* row brand*/
.container-brand{
	padding-top:60px;
	padding-bottom:60px;
}


/* -- footer -- */

footer h5{
	color: var(--white-default);
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: 125%;
}

footer a{
	color: var(--white-default);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 125%;
	margin-bottom:0;
	text-decoration:underline;
}

footer p{
	color: var(--white-default);
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 125%;
	margin-bottom:0;
	text-decoration:none;
}

#post-footer{
	background-color: var(--burgundy-default);
	border-top: 0.5px solid var(--white-default);
}
#post-footer .border-right {
	border-right: 0.5px solid var(--white-default);
	padding-top:16px;
	padding-bottom:16px;
}
#post-footer a{
	color: var(--white-default);
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 125%;
	margin-bottom:0;
	text-decoration:none;
}


/* BUTTONS */
.btn {
	padding: 8px 16px;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 125%;
	border-radius: 200px;
	text-decoration:none !important;
}
.btn.btn-xl{
	padding: 12px 24px !important;
	font-size: 16px !important;
}

.btn.btn-primary{
	color: var(--burgundy-default) !important;
	background-color: var(--white-default);
	border-color: var(--white-default);
}
.btn.btn-primary:hover{
	color: var(--burgundy-default) !important;
	background-color: var(--white-hover);
}
.btn.btn-primary:active{
	color: var(--burgundy-default) !important;
	background-color: var(--white-pressed);
}
.btn.btn-primary:focus{
	color: var(--burgundy-default) !important;
	background-color: var(--white-hover);
	box-shadow: 0 0 0 2px #000;
}
.btn.btn-primary.disabled{
	color: var(--disabled-strong) !important;
	background-color: var(--disabled-default);
}

.btn.btn-secondary{
	color: var(--white-default) !important;
	border: 1px solid var(--white-default);
	background-color:transparent;
}
.btn.btn-secondary:hover{
	color: var(--burgundy-default) !important;
	background-color: var(--white-default);
}
.btn.btn-secondary:active{
	color: var(--burgundy-default) !important;
	background-color: var(--white-pressed);
}
.btn.btn-secondary:focus{
	color: var(--burgundy-default) !important;
	border: 2px solid #fff;
	background-color: #bebebe;
	box-shadow: 0 0 0 2px #000;
}
.btn.btn-secondary.disabled{
	color: var(--disabled-strong) !important;
	background-color: var(--disabled-default);
}

.btn.btn-tertiary{
	color: var(--white-default);
	border: 1px solid var(--white-default);
	background-color:transparent;
}
.btn.btn-tertiary:hover{
	color: var(--white-hover);
	background-color:transparent;
}
.btn.btn-tertiary:active{
	color: var(--white-pressed);
	background-color:transparent;
}
.btn.btn-tertiary:focus{
	color: var(--burgundy-default);
	border: 2px solid #fff;
	background-color: #bebebe;
	box-shadow: 0 0 0 2px #000;
	padding:0 !important;
}
.btn.btn-tertiary.disabled{
	color: var(--disabled-strong);
	background-color:transparent;            
}

/* form components */
.form-rounded{
	border-radius: 32px;
	border: 1px solid var(--white-default);
	background: rgba(245, 240, 215, 0.20);
	color: var(--white-default);
	margin-top:8px;
	font-size: 16px;
	font-style: normal;
	font-weight: 300;
	line-height: 125%;
	padding:16px !important;
}
.form-rounded option{
	background-color: var(--purple-default);
	color: var(--white-default);
	font-size: 16px;
	font-style: normal;
	font-weight: 300;
	line-height: 125%;
	border: 1px solid var(--white-default) !important;
}
.form-rounded option:hover{
	background: rgba(245, 240, 215, 0.20) !important;
	color: var(--white-default) !important;
}
.form-rounded:hover, 
.form-rounded:active,
{
	border-radius: 32px;
	border: 1px solid var(--white-default);
	background: rgba(245, 240, 215, 0.20);
	color: var(--white-default);
}
.form-rounded:focus{
	color: var(--burgundy-default);
	border: 2px solid #fff;
	background-color: #bebebe;
	box-shadow: 0 0 0 2px #000;
}

label{
	color: var(--white-default);
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 125%;
}

/* Placeholder per la maggior parte dei browser moderni (Webkit, Chrome, Safari) */
.form-control::-webkit-input-placeholder {
    color: var(--white-default) !important;
    opacity: 1 !important;
}
.form-control:-moz-placeholder {
    color: var(--white-default) !important;
    opacity: 1 !important;
}
.form-control::-moz-placeholder {
    color: var(--white-default) !important;
    opacity: 1 !important;
}
.form-control:-ms-input-placeholder {
    color: var(--white-default) !important;
}
.form-control::-ms-input-placeholder {
    color: var(--white-default) !important;
}
.form-check-input:checked {
    background-color: var(--burgundy-default);
    border-color: var(--burgundy-default);
}

.form-select.form-rounded {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
}

.invalid-feedback{
	color: var(--burgundy-default);
}


/* ARTICLE template */
.pt-article-row {
	padding-top:60px;
}
.bg-body-article{
	padding-bottom:125px;
}

#article-accordion.accordion{
	--bs-accordion-bg: transparent;
	--bs-accordion-border-color:none !important;
}
#article-accordion .accordion-item{
	margin-bottom:8px;
}
#article-accordion button:not(.collapsed){
	border-radius: 32px 32px 0 0 !important;
	background: transparent !important;
	color: var(--white-hover);
	border: 1px solid var(--white-default) !important;
}
#article-accordion button.collapsed{
	border-radius: 32px !important;
	background: rgba(245, 240, 215, 0.20) !important;
	padding:12px 24px !important;
	color: var(--white-hover);
	border: 1px solid var(--white-default) !important;
}
#article-accordion .accordion-collapse.collapse.show{
	border-radius: 0 0 32px 32px !important;
	background: rgba(245, 240, 215, 0.20) !important;
	border: 1px solid var(--white-default) !important;
}
#article-accordion .accordion-button::after {
    background-image: var(--accordion-btn-icon-white) !important;
}
#article-accordion .accordion-button:not(.collapsed)::after {
    background-image: var(--accordion-btn-icon-white) !important;
    transform: rotate(-180deg);
}
#article-accordion .accordion-button:focus {
    border: 1px solid #FFF;
	box-shadow: 0 0 0 2px #000;
}

/* sezione eventi */
.event-img-card{
	border-top-left-radius:24px;
	border-top-right-radius:24px;
}

.section-eventss {
	padding-bottom:120px;
}
.bg-event-card{
	background: rgba(245, 240, 215, 0.10);
}
.bg-event-container{
	background-color:var(--gradient-brand);
	background-image:url('/media/eufonica/2026/homepage/maskeventi_page.png');
	background-position:top left;
	background-repeat:no-repeat;
}
.section-eventss .bg-column-1{
	padding:120px 0 60px;
}
.section-eventss .bg-column-2{
	padding:130px 0 50px;
}
.section-eventss .bn-image {
    filter: grayscale(100%);
    border-top-left-radius: 24px;
    border-top-left-radius: 24px;
    border-top-right-radius: 24px;
    border-top-right-radius: 24px;
    border-bottom-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom-right-radius: 0px;
}
.section-eventss .bn-image:hover {
    filter: grayscale(0%); 
    transition: filter 0.3s ease;
}
.section-eventss .card{
	border-radius:24px;
	background: rgba(245, 240, 215, 0.10);
	border: 0.5px solid var(--white-default);
}
.section-eventss .card-footer{
	border-top:0;
}
.section-eventss .card-body a{
	text-decoration:none !important;
}
.section-eventss .card-body a:hover{
	text-decoration:underline !important;
}
.section-eventss .badge.cat.typ{
	border-radius:30px;
	padding:4px 12px;
	font-size:14px;
	font-weight:500;
	margin-bottom:16px;
	border: 1px solid var(--white-default);
	margin-right:8px;
}
.section-eventss .datelist{
	border-radius:30px;
	padding:4px 12px;
	font-size:14px;
	font-weight:500;
	border: 1px solid var(--white-default);
	margin-right:8px;
	background-color:transparent;
}
.popover-header{
	color: var(--white-default) !important;
	background: var(--orange-default) !important;
}
.popover-body,
.popover-arrow{
	border-color: var(--white-default) !important;
}
.divisore-data{
	margin-top:80px;
	margin-bottom:40px;
}




/* sezione news */
.sector-news{
	background: linear-gradient(164deg, #941E81 0%, #D04234 100%);
}
.sector-news .container{
	padding-bottom:120px;
}
.sector-news .b-bottom{
	border-bottom: 0.5px solid var(--white-default);
}
.sector-news .bg-column-1{
	padding:120px 0 60px;
}
.sector-news .bg-column-2{
	padding:130px 0 50px;
}
.sector-news .card{
	border-radius:24px;
	background: rgba(245, 240, 215, 0.10);
	border: 0.5px solid var(--white-default) !important;
	color: var(--white-default);
}
.sector-news .owl-next{
	float:right;
}
.sector-news .owl-nav{
	margin-top:32px;
}
.sector-news .owl-dots {
    text-align: center; 
    margin-top: -35px; 
}
.sector-news .owl-dot span{
    width: 12px;
    height: 12px;
    display: inline-block; 
    border: 2px solid var(--white-default);
    border-radius: 50%;
    margin: 0 4px;
    transition: all 0.3s ease;
    background: transparent;
}
.sector-news .owl-dot.active span{
    background: var(--white-default);
    border: none;
    width: 12px;
    height: 12px;
}



/* photogallery*/
.sector-gallery .card{
	border-radius:24px;
	background: rgba(245, 240, 215, 0.10);
	border: 0.5px solid var(--white-default) !important;
	color: var(--white-default);
	border-radius: 8px;
}
.sector-gallery .card .bn-image{
	border-radius: 8px 8px 0 0 !important;
}


/* newsletter */
.privacy_block {
	overflow-y:auto;
	height:200px;
	font-size:14px;
	border: 0.5px solid var(--white-default);
}

/* alert */
.alert.alert-danger{
	background-color:var(--purple-default);
	color: var(--white-default);
	border-radius: 32px !important;
	border: 0.5px solid var(--white-default);
}
.alert.alert-danger h4.alert-heading{
	color: var(--white-hover);
}
.alert.alert-success{
	background-color:var(--purple-hover);
	color: var(--white-default);
	border-radius: 32px !important;
	border: 0.5px solid var(--white-default);
}
.alert.alert-success h4.alert-heading{
	color: var(--white-hover);
}
.alert .alert-link{
	color: var(--white-hover);
}

/* ar menu */
.menu-ar {
	display:flex;
	flex-direction: column !important;
}
.btn-menu-ar {
	width:100%;
	padding:12px 24px;
	color:var(--white-default);
	font-size:20px;
	font-style: normal;
	font-weight: 500;
	line-height: 125%;
	border-bottom: 0.5px solid var(--white-default);
	text-decoration:none;
}
		
/* ar cards */
.area-reserved .card{
	border-radius:24px;
	background: rgba(245, 240, 215, 0.10);
	border: 0.5px solid var(--white-default) !important;
	color: var(--white-default);
}

/* HERO homepage */
.section-hero .pt-hero-logo{
	/*padding-top:248px;*/
}
.section-hero {
	height:1020px;
	background-image:url('/media/eufonica/2026/homepage/Hero-eufonica.png');
	background-repeat:no-repeat;
	background-position:top left;
	background-size:cover;
	display: flex;
	width: 100%;
	padding: 248px 120px 120px 120px;
	flex-direction: column;
	align-items: flex-start;
	gap: 120px;
}
.section-hero .col-2-padding-top{
	/*padding-top:288px;*/
}
.section-hero .cta-container{
	padding-top:40px;
}
.section-hero .loghi-container{
	padding-top:120px;
}
