body{
    color: var(--color7);
    background-color: var(--col-bianco);
    font-family: var(--font-principale);
}

.button,
a{
  color: var(--col-bianco);  
}

#header.pos_fixed {
    background-color: var(--color1);
    -webkit-box-shadow: 0px 8px 35px -18px rgba(66, 68, 90, 0.42);
    -moz-box-shadow: 0px 8px 35px -18px rgba(66, 68, 90, 0.42);
    box-shadow: 0px 8px 35px -18px rgba(66, 68, 90, 0.42);
    height: 70px;
}

.button{
    color: #FFF;
    transition: 1s;
    text-transform: uppercase;
    font-family: 'Jost', sans-serif;
    font-size: 0.9rem;
    letter-spacing: 0.15em;
    border-radius: 0;
    font-weight: 400;
    height: 75px;
    display: inline-block;
}

#header > *{
    color: var(--col-bianco); 
}

a:hover{
    color: var(--col-principale);
}

header li, footer li, a.menulingua {
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-family: var(--font-family-6);
    font-family: var(--font-family-2);
}

.anteprimacamera .blocco_dati p{
    color: var(--color7);
    text-transform: none;
    font-size: 0.8rem;
    padding-left: 10px;
    padding-right: 10px;
}

#bottone_menu_header.bottone-fix, 
#bottone_menu_footer.bottone-fix {
    display: flex;
    align-items: flex-start;
}

#bottone_menu_header .buttonmenu .icon-bar{background: var(--color1);}

#bottone_menu_header.bottone-fix, 
#bottone_menu_footer.bottone-fix {
    flex-direction: column!important;
    align-items: flex-start!important;
}

button.multilingue a{
    text-transform: uppercase;
    color: var(--color1);
    font-family: var(--font-family-6);
    letter-spacing: 0.15em;
}


.pos_fixed button.multilingue a{
    text-transform: uppercase;
    color: var(--color2);
    font-family: var(--font-family-6);
}

h1 {
    font-size: 3rem;
    font-family: var(--font-family-1);
    color: var(--color3);
    margin-bottom: 0px;
    line-height: 0.9em;
}

h2 {
    font-size: 17px;
    line-height: 1.1em;
    font-family: var(--font-family-1);
    color: var(--color7);
    margin-bottom: 0;
    letter-spacing: 0.03em;
    margin-top: 25px;
}

h3 {
    word-wrap: break-word;
    white-space: -moz-pre-wrap;
    white-space: pre-wrap;
    font-size: 2rem;
    font-family: var(--font-family-2);
    color: var(--color2);
    line-height: 1em;
    font-weight: 300;
}

h5 {
    word-wrap: break-word;
    white-space: -moz-pre-wrap;
    white-space: pre-wrap;
    font-size: 2.2rem;
    font-family: var(--font-family-4);
    color: var(--color6);
    line-height: 1em;
}

p{
    font-family: var(--font-family-6);
    color: var(--color7);
    line-height: 1.8em;
    font-size: 1.2rem;
    text-align: justify !important;
}

.sez-bckg{
    background-color: #f0dfb5;
    width: 100%;
    height: 165px;
}

.sez-home-introcamere h2{
    font-weight: 300;
    word-wrap: break-word;
    white-space: pre-wrap;
    font-size: 2rem;
    font-family: var(--font-family-4);
    color: var(--color6);
    line-height: 1.2em;
}


.sez-home-camere .blocco_foto_camera img {
    max-width: unset;
    height: 500px;
}

.sez-home-camere .blocco_dati {
    flex-flow: column wrap!important;
    align-items: center!important;
    justify-content: space-between!important;
    flex-direction: column!important;
}


.menu-selezione-hover .navbar-elem-menu {
    display: flex;
    flex-direction: column;
    align-content: flex-start;
    align-items: flex-start;
}

.menu-selezione-hover .navbar-elem-menu {
    display: flex;
    flex-direction: column;
    align-content: flex-start;
    align-items: flex-start;
}

.menu-selezione-hover .navbar-elem-menu li {
    margin-bottom: 20px;
    opacity: 0.5;
}

.menu-selezione-hover .navbar-elem-menu > li a {
    color: #484848;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    flex-wrap: nowrap;
}

.menu-selezione-hover .navbar-elem-menu li a h5{
    
}

.menu-selezione-hover .navbar-elem-menu li a p{
    display: none
}

.menu-selezione-hover .navbar-elem-menu li.sel {
    opacity: 1;
}

.menu-selezione-hover .navbar-elem-menu li.sel p{
    display: block
}

.buttonmenu label p {
    background-color: transparent;
    color: var(--color6);
}

#bottone_menu_header .label {
    text-transform: uppercase;
    background-color: transparent;
    color: var(--color6);
}

.bottone_aprimenu button.buttonmenu,
.bottone_aprimenu span.buttonmenu {
    margin-bottom: 5px;
}

#sezfooter1 .logosito{
    display: block;
    margin-bottom: 20px;
}

#sezfooter1 .label {
    text-align: justify;
    font-family: var(--font-family-1);
}

span.prefix {
    display: none;
}


/*STILE PERSONALIZZATO*/
#experience .col-sm-12.col-md-6.area.sfondobckg.bckg_responsive.fisso {
    padding: 5%;
    border-right: 3px solid #FFF;
}

#experience .col-sm-12.col-md-3.area.sfondobckg.bckg_responsive.fisso {
    padding: 3%;
    border-right: 3px solid #fff;
}

.btn-chiudiFR i.zmdi.zmdi-close {
    color: var(--color2);
    font-size: 40px;
    font-weight: 300;
}

.contenitore-fr .button.button--standard, .contenitore-fr button.button.button--standard:hover {
    background: var(--color1);
}

.menu-aperto .navbar-nav-menu li.nav-item .nav-link {
    padding: 5px 5px !important;
    font-family: var(--font-family-2);
    font-size: 1.4rem;
    margin-bottom: 15px;
    letter-spacing: 0.4em;
    text-align: center;
    text-transform: math-auto;
    background-color: transparent;
    font-weight: 400;
    color: var(--color1);
    line-height: 1.5em;
    text-transform: uppercase;
    transition: .5s;
}

.menu-aperto .navbar-nav-menu li.nav-item .nav-link:hover {
    letter-spacing: 0.5em;
    transition: .5s;
}

/*INIZIO MENU*/
/* MENU APERTO
#menu_header.menu-aperto {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
}

MENU CHIUSO fade-out cinematografico con CHIUSURA LENTA
#menu_header {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition:
    opacity 1.4s cubic-bezier(0.25, 0.1, 0.25, 1),
    visibility 0s linear 1.4s !important;
}
fine MENU */

#sezione3 .primo span img {
    width: 18px;
    height: auto;
    transform: none;
}

#sezione3 .primo p {
    text-align: left !important;
}

#sezione3 .primo span {padding: 0;margin: 0;}

#sezione3 .primo h3 {
    text-align: left;
}

#sezione3 .primo .button.button {
    float: left;
}

#menu_header.grndm .areamenu{
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-color: #1e333dad;
  border-radius: 5px;
  -moz-box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 1);
  backdrop-filter: grayscale(1) contrast(0.8);
}

.navbar-menu.menumobile.bottone-fix {
    position: fixed;
    overflow: hidden;
    transition: 0.3s ease;
    padding: 20px 20px;
    z-index: 15;
    background-color: #000000a1 !important;
    backdrop-filter: blur(6px);
}

.navbar-menu.menumobile.bottone-fix {
    background-color: trasparent !important;
}

#bottone_menu_header img {
    width: 48px;
    height: 48px;
    filter: brightness(10);
}

.pos_fixed #bottone_menu_header img {
    width: 48px;
    height: 48px;
    filter: none;
}

#header .sezheader{
  display: flex;
  flex-flow: row wrap;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  align-content: center;
  justify-content: space-between;
}

footer .logosito img {
    max-height: 40px;
    width: auto;
    filter: brightness(12.5);
    margin-top: 25px;
}

header .logosito img {
  max-height: 200px;
  height: 200px;
}


#foto-home .item {
    margin-right: 15px;
}

#header.pos_fixed .button.button--standard.button--size-l.button--text-thin.btn-apriFR, #header.pos_fixed button.button.button--standard.button--size-l.button--text-thin.btn-apriFR
 {

    background: #405666 !important;

}

#slideshow-interno h1 {
    color: #ffffff96;
    font-family: var(--font-family-2);
    font-weight: 300;
    font-size: 1.5rem;
    text-transform: uppercase;
    line-height: 3rem;
    letter-spacing: 0.3em;
}

#slideshow-interno h1 strong {
    color: var(--color1);
    font-family: var(--font-family-1);
    font-weight: 300;
    font-size: 3.5rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}


.col-sm-12.col-md-6.area.camere-sx-1 {
    overflow: visible;
    z-index: 10;
}

.index-camere .elemento_sing.el-camera {
    margin-top: 25px;
}

#camere-1 .index-camere h3 {text-align: left !important;color: var(--color1);font-family: var(--font-family-1);margin: 0 !important;margin-bottom: 20px;padding: 0 !important;float: left !important;}

#camere-1 .index-camere p {
    margin: 0 !important;
    width: 100%;
    font-size: 1.1rem;
    margin-top: 20px !important;
}

#camere-1 .index-camere a.button p {
    margin: 0 !important;
    width: 100%;
    margin-top: 0px !important;
    text-transform: uppercase;
    font-family: var(--font-family-2);
    font-size: 0.9rem;
    letter-spacing: 0.2em;
    border-radius: 0;
    font-weight: 400;
}

.index-camere .blocco_dati {
    display: flex;
    align-items: flex-start !important;
}

.index-camere .testo_camera img {
    width: 15px !important;
    height: auto;
    display: flex !important;
    align-items: center;
    flex-direction: row;
    filter: invert(1);
}

.recensioni h5 {
    color: var(--color1);
    font-size: 1.1rem;
    font-family: var(--font-family-1);
}

.recensioni h5 {
    float:right;
    width: 100%;
    text-align: right;
    margin-right: 50px;
}

.recensioni h6 {
    float:right;
    color: var(--color1);
    font-family: var(--font-family-2);
    width: 100%;
    text-align: right;
    margin-right: 20px;
    margin-right: 20px;
    margin-right: 20p;
    margin-right: 20;
    margin-right: 2;
    margin-right: 50px;
}

.recensioni .item {
    backdrop-filter: blur(4px);
    height: 300px;
    width: calc(100% - 30px);
    background: #00000061;
    border-radius: 5px;
    margin-left: 15px;
}

.recensioni p {
    color: var(--color1);
    padding: 9%;
    padding-top: 0;
    padding-bottom: 30px;
    font-family: var(--font-family-1);
    font-size: 1rem;
}

.recensioni h4 {
    padding: 80px;
    padding-top: 30px;
    padding-bottom: 0;
    color: var(--color1);
    font-family: var(--font-family-2);
    font-size: 1.8rem;
    font-weight: 300;
}

.recensioni-titolo h4 {
    position: absolute;
    color: var(--color1);
    margin-top: 5%;
    text-align: center;
    width: 100%;
    font-family: var(--font-family-2);
    font-size: 2rem;
    font-weight: 200;
}

.recensioni-titolo h4 strong {
    font-family: var(--font-family-1);
    font-size: 3rem;
}


.voti h4 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    font-size: 1.5rem;
    font-family: var(--font-family-2);
}

.voti .col-sm-12 {
    width: 33%;
    padding: 50px;
}

.row.voti {
    width: 98%;
    margin-left: 1% !important;
    border-radius: 4px;
    position: absolute;
    bottom: 30px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
    justify-content: space-around;
}


.row.voti .col-md-12 {
    width: auto;
}

.voti h4 strong {
    margin-left: 10px;
    font-weight: 800;
}

.testo_camera span {
    display: inline-flex;
}

.testo_camera img {
    width: 10px!important;
    height: auto;
    display: flex !important;
    align-items: center;
    flex-direction: row;
}


.owl-theme .owl-dots .owl-dot span {
    -webkit-backface-visibility: visible;
    background-color: #00000091;
    border-radius: 30px;
    display: block;
    height: 5px !important;
    margin: 2px 2px !important;
    transition: opacity .2s;
    width: 5px !important;
}

section#video-home {
    padding: 0;
}

#video-home .cbck_107 {
    z-index: 1;
}

#slideshow h3 {
    color: var(--color1);
    color: #ffffff;
    text-transform: initial;
    font-weight: 300;
    font-size: 3rem;
    line-height:4rem;
}

#slideshow h3 strong {
    color: var(--color1);
    color: #ffffff;
    text-transform: uppercase;
    font-family:var(--font-family-1);
    font-weight: 400;
    font-size: 4.5rem;
    letter-spacing: -0.05em;
}

section#sez-camere {
    padding-right: 0;
    padding-left: 0;
    padding-bottom: 200px !important;
}

#sez-camere .area {
    transform: scale(1.5);
}

h3.titolo_camera {
    display: none !important;
}

.blocco_foto_camera img.img-fluid {
    filter: brightness(0.8);
}

#sez-camere .item {
    margin-right: 10px;
    margin-left: 10px;
}

.row.testo-sezione-2 {
    position: absolute;
    overflow: visible;
    z-index: 10;
    margin-top: 200px;
    margin-left: 40px !important;
}

.sezione-2-1 {
    z-index: 10 !important;
    overflow: visible;
}

.sezione-2-2 {
    z-index: 9;
}

.testo-sezione-2 h3 {
    font-size: 5rem;
    color: var(--color1);
    font-family: var(--font-family-1);
    text-transform: uppercase;
    letter-spacing: -0.05em;
}

.primo {
    padding: 70px !important;
}

.primo p {
    margin-bottom: 30px;
    margin-top: 30px;
}

.primo h1 {
    margin-bottom: 0;
    font-family: var(--font-family-2);
    font-size: 2.5rem;
    line-height: 1.4em;
    font-weight: 200;
}

.primo h1 strong {
    font-size: 4rem;
    font-weight: 300;
    color:  var(--color2);
    font-family: var(--font-family-1);
}


.primo h3 {
    margin-bottom: 0px;
    font-family: var(--font-family-2);
    font-size: 2rem;
    line-height: 1.4em;
    font-weight: 200;
    color: var(--color3);
}

.primo h3 strong {
    font-size: 3rem;
    font-weight: 300;
    color:  var(--color2);
    font-family: var(--font-family-1);
}


.camere-sx-1 .primo h3 {
    margin-bottom: 30px;
    font-family: var(--font-family-2);
    font-size: 2rem;
    line-height: 1.4em;
    font-weight: 200;
    color: var(--color1);
}

.camere-sx-1 .primo h3 strong {
    font-size: 2.4rem;
    font-weight: 300;
    color:  var(--color1);
    font-family: var(--font-family-4);
}




#titolo-camere h3 {
    margin-bottom: 30px;
    font-family: var(--font-family-2);
    font-size: 2rem;
    line-height: 1.4em;
    font-weight: 200;
    color: var(--color3);
    text-align: center;
}

#titolo-camere h3 strong {
    font-size: 3rem;
    font-weight: 300;
    color:  var(--color2);
    font-family: var(--font-family-1);
}

#titolo-camere p {
    margin-bottom: 30px;
    padding-left: 10%;
    padding-right: 10%;
}

section#titolo-camere {
    padding: 80px;
    padding-top: 120px;
}

#experience .col-sm-12.col-md-4.area {
    width: calc(33.3% - 20px);
    margin-right: 10px;
    margin-left: 10px;
    padding: 50px;
}

#experience h3 {
    margin-bottom: 30px;
    font-family: var(--font-family-2);
    font-size: 1.7rem;
    line-height: 1.4em;
    font-weight: 200;
    color: var(--color1);
    text-align:center !important;
}

#experience h3 strong {
    font-size: 3rem;
    font-weight: 300;
    color:  var(--color1);
    font-family: var(--font-family-1);
}

#experience p {
    color:  var(--color1);

}

.col-sm-12.cont_sing {
    padding: 0px !important;
}

header#header {
    height: 70px;
}

#header.pos_fixed .button.button--standard.button--size-l.button--text-thin.btn-apriFR, #header.pos_fixed button.button.button--standard.button--size-l.button--text-thin.btn-apriFR {
    height: 100px;
}

#header .button.button--standard.button--size-l.button--text-thin.btn-apriFR,
#header button.button.button--standard.button--size-l.button--text-thin.btn-apriFR {
    height: 100px;
    border-right: none;
    border-left: none;
}

#header .button.button--standard.button--size-l.button--text-thin.btn-apriFR:hover, #header button.button.button--standard.button--size-l.button--text-thin.btn-apriFR:hover {
    height: 100px;
    width: 100%;
    background: #ccae62;
    border-left: none;
    border-right: none;
}

#slideshow .row.centrale.ao_center {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgb(0 0 0 / 34%);
    backdrop-filter: saturate(0.8);
    opacity: 1;
    z-index: 1;
    -webkit-transition: background-color 3s;
    transition: background-color 3s;
    mix-blend-mode: multiply;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition-delay: 1s;
    transition-delay: 1s;
}

#slideshow .col-sm-12.col-md-12.area {
    /* z-index: inherit; */
}

#slideshow .col-sm-12.col-md-12.colonnaarea {
    z-index: inherit;
}

#camere-1 p {
    margin-left: 15%;
    margin-right: 15%;
    color: var(--color1);
    text-align: left;
    float: left;
    width: 60%;
}

#sez-1 p {
    width: 55%;
    margin-bottom: 35px;
}

#sez-camere h4 {
    font-family: var(--font-family-1);
    font-size: 5rem;
    color: var(--color1);
}

#sez-camere h3 {
    font-family: var(--font-family-1);
    font-size: 1.5rem;
    color: var(--color1);
    padding: 31px;
    margin-top: -100px;
}

#camere-1 h3 {
    text-align: left;
    margin-left: 15%;
    margin-right: 15%;
    margin-bottom: 25px;
}

#camere-1 h3 strong {
    font-size: 5rem;
    font-weight: 400;
}


#camere-1 h2 {
    text-align: left;
    margin-left: 15%;
    margin-right: 15%;
    margin-bottom: 25px;
    font-size: 3rem;
    font-family: var(--font-family-1);
    color: var(--color1);
    line-height: 1em;
}

#camere-1 h2 strong {
    font-size: 5rem;
    font-weight: 400;
}

#slideshow h2 {
    color: #fff;
    font-size: 1.8rem;
    line-height:3rem;
    text-transform: uppercase;
    font-family: var(--font-family-2);
    font-weight: 600;
}

#slideshow h2 strong {
    color: #fff;
    font-size: 4rem;
    font-weight: 400;
    font-family: var(--font-family-1);
    -webkit-transition: -webkit-filter 2s;
    transition: -webkit-filter 2s;
    transition: filter 2s;
    transition: filter 2s, -webkit-filter 2s;
    line-height: 1.2;
    text-transform: uppercase;
}


section#slideshow {
    overflow: hidden;
}

#bottone_menu_header p {
    font-family: var(--font-family-1);
    color: var(--color1);
    display: none;
}

#sez-1 h1 strong {
    font-weight: 400;
    font-size: 5rem;
    color: var(--color2);
    text-transform: uppercase;
    font-family: var(--font-family-1);
}

section#camere-1 {
    margin-bottom: 1px;
}

#camere-1 a.linkinterno {
    float: left;
    margin-left: 15%;
    margin-top: 30px;
    margin-right: 15%;
}

#servizi h3 {
    color: var(--color3);
    margin-bottom: 25px;
}

#servizi h3 strong {
    font-size: 4rem;
    font-weight: 400;
    color: var(--color2);
}

p strong {
    font-weight: 600;
}

#sez-8 p {
    margin-left: 15%;
    margin-right: 15%;
    color: var(--color1);
    width:60%;
    float:right;
    text-align: right !important;
}

#sez-8 h3 {
    margin-left: 15%;
    margin-right: 15%;
    margin-bottom: 25px;
}

#sez-8 h3 strong {
    font-size: 5rem;
    font-weight: 400;
}

.galleriapres img.img-responsive {
    padding: 8px;
}

section#foto-home {
    padding-top: 130px;
    padding-bottom: 100px;
}

#foto-home h3 {
    text-align: center;
    margin-bottom: 0;
    margin-top: 60px;
    font-size: 2rem;
    color: var(--color2);
}

#foto-home h3 strong {
    font-weight: 400;
    font-size: 2.5rem;
}


.owl-theme .owl-dots .owl-dot {
    background: none !important;
    margin-top: 5px !important;
    margin-bottom: 30px !important;
}

#servizi .button.button--winona.button--size-l,
#servizi button.button.button--winona.button--size-l {
    margin-top: 35px;
}

.aneprimacamera a.button {
    margin-top: 35px;
}

.anteprimacamera a.button {
    margin-top: 20px;
    padding: 0;
    border: none;
    padding-top: 0;
    border-bottom: 1px solid var(--color2);
    height: auto;
    margin-left: 5px;
}

.index-camere .anteprimacamera a.button {
    margin-top: 20px;
    padding: 10px;
    border: none;
    border: 1px solid var(--color1);
    height: auto;
    margin-left: 5px;
}

.anteprimacamera a.button p {
    font-weight: 300;
    font-size: 0.7rem;
    font-family: var(--font-family-5);
    text-transform: uppercase;
    letter-spacing: 0;
    line-height: 2;
    padding: 5px;
}

.anteprimacamera a.button p:hover {
    color: var(--color2);
}

#sez-1 h3 {
    color: var(--color2);
    font-size: 1.5rem;
    width: 55%;
    margin-top: 0;
    line-height: 2rem;
    margin-bottom: 30px;
    font-family: var(--font-family-6);
}

.chiudi_menumobile {
    cursor: pointer;
    background: transparent;
}

div#headermenumobile\ bottone-fix {
    position: absolute;
    top: 5%;
    right: 5%;
    background: none;
    padding: 12px;
    padding-left: 15px;
    padding-right: 15px;
    z-index: 9;
}

#menu_header .navbar-nav-menu > li {
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    width: 100%;
    margin-bottom: 5px;
    justify-content: center;
}

.pos_fixed #bottone_menu_header .buttonmenu .icon-bar {
    background: #405666;
}

.pos_fixed #bottone_menu_header p {
    color: var(--color2);
    line-height: 1;
}

header.pos_fixed .logosito img {
    filter: none;
    width: auto;
    height: auto;
    width: 350px;
}

a.logosito.logodesktop.centrale {
    top: 20px !important;
    left: calc(50% - 200px) !important;
}

.pos_fixed a.logosito.logodesktop.centrale {
    top: 15px !important;
    left: calc(50% - 175px) !important;
    position: absolute;
    width: auto !important;
}

.button.button--winona.button--size-l.button--text-thick.button--round-s.btn-apriFR,
button.button.button--winona.button--size-l.button--text-thick.button--round-s.btn-apriFR {
    width: 70%;
    min-width: 225px;
    float: right;
    height: 75px;
}

button.ancorabtn-apriFR{
    background: #aaa69d;
    border: none;
}

.colheader.ch4 {
    width: 4.33333333%;
}

#footer p {
    color: var(--color1);
    font-family: 'Playfair Display', serif;
}

#sezfooter3 .label a {
    color: var(--color1);
    font-family: 'Italiana';
    font-size: 1.3rem;
}

.navbar-menu.menumobile.bottone-fix.left.menu-aperto, .navbar-menu.menumobile.bottone-fix.left {
    transition: 1s;
}

.prencanc_fr.component_fr span {
    font-family: var(--font-family-5);
    letter-spacing: .2rem;
}

.prencanc_fr.component_fr {
    margin-top: 15px !important;
}

#frHeader div.fastreservation.apertura-full {
    background-color: rgb(255 255 255) !important;
    font-family: var(
    --font-family-2);
    color: var(
    --color2) !important;
    z-index: 10;
}

#frHeader div.fastreservation .contenitore-fr {
    padding-left: 5%;
    padding-right: 5%;
}

.fastreservation .labelfastr {
    margin-top: 10px;
    margin-bottom: 10px;
    color: var(--color2);
    letter-spacing: 0.1em;
    font-family: var(--font-family-1);
    font-weight: 300;
    font-size: 0.9rem;
}

#frHeader div.fastreservation.apertura-full .btn-chiudiFR, #frHeader div.fastreservation.apertura-standard .btn-chiudiFR {
    right: 50px;
}

#slideshow h1 {
    color: #fff;
    font-weight: 100;
    line-height: 1.2em;
    font-family: var(--font-family-2);
}

#slideshow h1 strong {
    font-size: 5rem;
    font-family: var(--font-family-1);
}

#slideshow h1 strong {
    line-height: 1;
}

#sez-1 h2 {
    font-size: 2.5rem;
    text-transform: inherit;
    color: var(--color7);
}

.anteprimacamera {
    position: relative;
    float: left;
    padding: 0px !important;
    width: -webkit-fill-available;
}

.anteprimacamera.visuale_sovrapposti .blocco_dati {
    background: #0000004a;
    left: 0 !important;
    right: 0 !important;
    padding: 50px !important;
    min-height: max-content;
}

#servizi p {
    margin-right: 45px;
}

#dotazioni h3, #dotazioni p {
    color: var(--color2);
}

section#dotazioni {
    padding-top: 80px;
    padding-bottom: 80px;
}

#foto-home div#galleria-103, #foto-home div#galleria-317, #foto-home div#galleria-285, #foto-home div#galleria-253 {
    margin-top: 60px;
    margin-bottom: 60px;
}

#testo-intro h2 {
    color: var(--color3);
    margin-bottom: 25px;
    font-size:2.5rem
}

#testo-intro h2 strong {
    font-size: 4rem;
    font-weight: 400;
    color: var(--color2);
}

#testo-intro-2 h2 {
    color: var(--color3);
    margin-bottom: 25px;
    font-size:2rem;
    margin-left: 30px;
    margin-right: 30px;
}

#testo-intro-2 h2 strong {
    font-size: 3rem;
    font-weight: 400;
    color: var(--color2);
}

#testo-intro-2 p {
    margin-left: 30px;
    margin-right: 30px;
}

#testo-intro-2 #mappa1 p {
    margin: 0;
}

.titolo-anteprima h3 {
    color: var(--color2);
    text-align: center;
    margin-bottom: 30px;
}

.testo-anteprima p {
    padding-top: 30px;
    padding-bottom: 30px;
    padding-left: 10px;
    padding-right: 10px;
    text-align: center;
}

.col-sm-12.col-md-6.ant-camera {
    margin-top: 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-bottom: none;
}


.bottone-anteprima  a {
    background: #000;
    text-align: center;
    width: 200px;
}

section#listacamere {
    height: auto;
}

.bottone-anteprima a {
    background-color: var(--color2_hover);
    color: #FFF;
    transition: 1s;
    text-transform: uppercase;
    font-family: 'EB Garamond';
    font-size: 1rem;
    letter-spacing: 0.05em;
}

.bottone-anteprima {
    width: fit-content;
    background-color: var(--color3);
    padding: 20px 20px;
    border-radius: 0;
}

.bottone-anteprima p {
    color: var(--color1);
    font-size: 1rem;
    font-weight: 300;
    font-family: var(--font-family-5);
}

.menumobile.bottone-fix .navbar-nav-menu ul.sottomenu li {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.sottomenu {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 1s ease, opacity 1s ease;
}
  
/* Quando attivo, mostra con animazione */
.apri-sottomenu.sottomenu-attivo .sottomenu {
    max-height: 500px; /* Imposta un valore abbastanza grande per contenere i contenuti */
    opacity: 1;
}

.index-camere #camere-1 button {    
    float: left;
    margin-left: 0%;
    margin-top: 0px;
    margin-right: 0%;
}

#sezfooter3 span.label {
    display: none;
}

span.elemsocial {
    color: var(--color1);
    float: left;
}

#sezfooter3 span.elem.selezunder a {
    margin-left: 5px;
    margin-right: 5px;
}

.bottone_aprimenu button.buttonmenu .icon-bar,
.bottone_aprimenu span.buttonmenu .icon-bar {
    height: 2px !important;
}

section#foto-home.galleria {
    padding-top: 50px;
    padding-bottom: 100px;
}

div#galleria-204 {
    padding: 0;
}
#blocco1 div#galleria-204 figure {
    padding: 0 !important;
}

div#galleria-226, div#galleria-349 {
    padding: 0;
}
.spa #blocco1 div#galleria-226 figure, div#galleria-349 figure {
    padding: 0 !important;
}

div#galleria-229 {
    padding: 0;
}
.spa #blocco2 div#galleria-229 figure {
    padding: 0 !important;
}

div#galleria-208 {
    padding: 0;
}
#blocco2 div#galleria-208 figure {
    padding: 0 !important;
}


#blocco1 .galleriapres img.img-responsive {
    padding: 0;
}

#blocco1 p {
    margin-left: 50px;
    margin-right: 50px;
}

#blocco1 h3 {
    margin-left: 50px;
    margin-right: 50px;
    margin-bottom: 25px;
    color: var(--color2);
}

#blocco2 div#galleria-208 {
    padding: 0;
}

#blocco2 .galleriapres img.img-responsive {
    padding: 0;
}

#blocco2 p {
    margin-left: 50px;
    margin-right: 50px;
}

#blocco2 h3 {
    margin-left: 50px;
    margin-right: 50px;
    margin-bottom: 25px;
    color: var(--color2);
}

#sez-1 .spa h3 {font-size: 3rem;font-family: var(--font-family-1);color: var(--color4);margin-bottom: 0px;line-height: 0.9em;margin-bottom: 20px;}

#sez-1 .spa h3 strong {
    font-weight: 400;
    font-size: 4rem;
    color: var(--color2);
    text-transform: none;
}

#blocco2 .button.button--winona.button--size-l.button--text-thick.button--round-s 
#blocco2 button.button.button--winona.button--size-l.button--text-thick.button--round-s {
    margin-left: 50px;
    margin-top: 30px;
}

.galleria header .logosito img {
    display: none;
}

.galleria header.pos_fixed .logosito img {
    display: inline-block;
}

.spa section#foto-home {padding: 50px;}

.sottomenu {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.4s ease, opacity 0.4s ease;
  }
  
  .sottomenu.aperto {
    opacity: 1;
    /* max-height viene impostato dinamicamente via JS */
  }
  
  .material-symbols-rounded {
    color: #fff;
    font-size: 3rem !important;
}

li.nav-item.liv1.azioneher.prenotazioni a {
    background-color: var(--color1);
    padding: 18px 30px !important;
    border-radius: 0px;
    color: var(
    --color2) !important;
    font-weight: 600;
    border-radius: 4px;
}

.datepicker-dropdown .datepicker-picker {
    font-family: var(--font-family-6);
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}


.datepicker-title {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

div.fastreservation .area_input_notti .chiudi, div.fastreservation .area_input_persone .chiudi, div.fastreservation .area_input_listino .chiudi {
    font-family: var(--font-family-5);
    letter-spacing: .2rem;
    background-color: #cca951 !important;
}

header.pos_absolute .logosito img {
    display: block;
    width: 400px;
    filter: invert(1) brightness(10);
    height: auto;
}

#home header.pos_absolute .logosito img {
    /* display: block; */
    /* width: auto; */
}

#servizi-2 p {
    color: var(--color1);
    margin-left: 30px;
    margin-right: 30px;
}

#servizi-2 h3 {
    margin-left: 30px;
    margin-right: 30px;
}

.menu-aperto .navbar-nav-menu li.nav-item .sottomenu .nav-link {
    font-size: 1rem;
    color: var(--color1);
}

.menu-aperto .navbar-nav-menu li.nav-item .sottomenu .nav-link {
    padding-top: 0;
    margin-top: 0;
    padding-bottom: 0;
    margin-bottom: 0;
}

.menumobile.bottone-fix .navbar-nav-menu ul.sottomenu.aperto {
    margin-bottom: 15px;
}

i.zmdi.zmdi-close {
    font-size: 30px;
    color: var(--color1);
}

#servizi-3 h3 {
    text-align: left;
    margin-left: 10%;
    margin-right: 10%;
    margin-bottom: 25px;
    color: var(--color3);
    width: 67%;
}

#servizi-3 h3 strong {
    font-size: 5rem;
    font-weight: 400;
    color:var(--color2);
}

#servizi-3 p {
    margin-left: 10%;
    color: var(--color2);
    font-family: var(--font-family-2);
    text-align: left;
    float: left;
    width: 60%;
}

#servizi-3 .button,
#servizi-3 button.button {
    margin-left: 10%;
    margin-top: 40px;
}

#frHeader div.fastreservation .btn-chiudiFR {

color: var(--color4) !important;
}

div#bottone_menu_header {
    margin-left: 15px;
}

#servizi .button.button--ujarak.button--size-l.button--text-thick.button--round-s.button--border-thin,
#servizi button.button.button--ujarak.button--size-l.button--text-thick.button--round-s.button--border-thin {
    margin-top: 30px;
}

#foto-home div#owlcarousel-89 {
    padding:50px;
}

#servizi .button.button--ujarak.button--size-l.button--text-thin.button--round-s,
#servizi button.button.button--ujarak.button--size-l.button--text-thin.button--round-s {
    margin-top: 30px;
}

#blocco2 .button.button--ujarak.button--size-l.button--text-thick.button--round-s,
#blocco2 button.button.button--ujarak.button--size-l.button--text-thick.button--round-s {
    margin-left: 50px;
    margin-top: 30px;
}

#servizi-2 .col-sm-12.col-md-6.area.sfondobckg.bckg_responsive.fisso {
    border-right: 1px solid #fff;
}

#servizi .button.button--ujarak.button--size-l.button--text-thick.button--round-s,
#servizi button.button.button--ujarak.button--size-l.button--text-thick.button--round-s {
    margin-top: 30px;
}

.contenitore-fr .button.button--standard,
.contenitore-fr button.button.button--standard {
    background: var(--color2);
}

.anteprimacamera a.button:hover {
    border: 1px solid #ccae62;
    background: none;
}

#menulingueheader span.material-symbols-rounded {
    font-size: 1.2rem !important;
    color: #fff;
    display: none;
}

#header.pos_fixed span.material-symbols-rounded {
    font-size: 1.2rem !important;
    color: #000000;
    display: none;
}

#testo-intro-2 div[class^="cbck_"],
#testo-intro-2 div[class^="acbck_"]{
  position: absolute;
  top: 0;
  width: inherit;
  height: 100%;
}

#sez-1 h1 {
    font-family: var(--font-family-6);
    font-weight: 200;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.galleria #foto-home h3 {
    padding-bottom: 100px;
}

#dotazioni .col-sm-12 p {
    display: flex;
    flex-direction: row;
    text-align: center;
    flex-wrap: wrap;
    margin-top: 50px;
}

#dotazioni .col-sm-12 strong {width: 20%;margin-bottom: 20px;font-weight: 200;}

#dotazioni span.material-symbols-rounded {
    font-size: 2.2rem !important;
}

.datepicker-header .datepicker-controls {background: #a9a69e !important;}

.datepicker-controls .button {
    background: #a9a69e !important;
    color: #fff !important;
    letter-spacing: 0 !important;
}

.datepicker-cell {
    height: 40px !important;
}

.datepicker-cell:not(.disabled):hover {
    background: #a9a69e !important;
}

.checkin .datepicker.datepicker-dropdown.active {
    top: calc(50vh - 150px) !important;
}

.checkout .datepicker.datepicker-dropdown.active {
    top: calc(50vh - 50px) !important;
}

div.fastreservation .area_input_persone {
    margin-top: 60px !important;
    border-radius: 10px !important;
}

div.fastreservation .area_input_persone .cont_input_persone {
    display: flex !important;
    flex-direction: column !important;
}

.cont_input_persone input, .cont_input_persone select {
    min-width: 100% !important;
    width: 100% !important;
}

#frHeader div.fastreservation.apertura-full.animate__fadeOut{
	z-index: -1;
}
section#tipologie {
    padding-bottom: 50px;
}

section#mappa-home {
    margin-left: 0px;
    margin-right: 0px;
    padding-left: 0;
    padding-right: 0;
    padding-top: 0;
    padding-bottom: 0;
    height: 250px;
    background-color: #d1ccc0;
    margin-top: 0 !important;
}

#mappa-home .leaflet-popup-content p img, .leaflet-popup-content p img {
    height: 80px;
    width: auto;
    min-height: 80px !important;
    max-width: fit-content !important;
}

#mappa-home .leaflet-popup-content p {
    margin: 0;
}

#sez44 {
    padding: 100px;
}

#sez44 h3 {
    color:var(--color2);
    font-size:2rem;
    padding-left: 40px;
    padding-right: 40px;
}

#sez44 p {
    padding-left: 40px;
    padding-right:40px
}

#sez44 .col-sm-12.col-md-3 {
    border-right: 1px solid #00000075;
}

#sez44 h3 strong {
    font-size: 3rem;
    font-weight: 300;
}

#mappa-home #div#mappa1, #mappa-home  div#map-canvas1 {
    height: 400px !important;
}

.pos_fixed a.menulingua span {
    color: var(--color2);
    font-family: var(--font-family-2);
}

.pos_fixed a.menulingua {
    color: var(--color2);
}

.navbar-nav-menu {
    align-items: flex-start !important;
    align-content: flex-start !important;
}

button.multilingue span {
    color: var(--color1);
    font-family: var(--font-family-2);
}

.pos_fixed button.multilingue span {
    color: var(--color2);
    font-family: var(--font-family-2);
}

#home section#mappa-home {
    min-height: auto !important;
    height: 400px;
}

/* Stile Faq */
#faq h3 strong {
    word-wrap: break-word;
    white-space: -moz-pre-wrap;
    white-space: pre-wrap;
    font-size: 3rem;
    font-family: var(--font-family-5);
    line-height: 1em;
    color: var(--color2);
    font-weight: 300;
}

.faq-container {
    margin-top: 3em;
}

.faq-item {
    padding: 0.1em 0.1em!important;
}

.faq-item .faq-question{
    font-size: 1.2em;
    line-height: 1.1em;
    font-family: var(--font-family-5);
    letter-spacing: 0.03em;
    color: var(--color2);
    font-weight: 500;
    border-radius: 8px;
    padding: 1.2em 1.2em!important;
    margin-bottom: 0.5em;
    background-color: #ffffffa3;
}

.faq-item .faq-answer{
    font-family: var(--font-family-6);
    border-radius: 8px;
    color: var(--color1);
    background: var(--color2);
    font-size: 1.1em;
    letter-spacing: 0.05em;
    text-align: left;
}

.faq-item .faq-answer > * {
    padding: 1.5em;
    line-height: 1.5em !important;
}

#foto-home .owl-dots {
    padding-top: 40px;
}

.contenitore-logo-menu{
    width: 100%;
}

img.logo-sito-menu {
    filter: invert(1) brightness(5);
    width: 140px;
    height: auto;
    margin-bottom: 25px;
}

.datepicker-title .s_c_picker {
    background: var(--color2);
}

.datepicker-grid .datepicker-cell.selected, .datepicker-grid .datepicker-cell.selected:hover {
    background: var(--color2);
}

div.fastreservation .area_input_notti .chiudi, div.fastreservation .area_input_persone .chiudi, div.fastreservation .area_input_listino .chiudi {
    background: var(--color2) !important;
}

div.fastreservation.stile-custom input.datepicker {
    width: 100% !important;
}

/* blocca scroll quando menu è aperto */
html:has(#menu_header.menu-aperto){
  overflow: hidden !important;
  height: 100% !important;
}

/* menu overlay fisso */
#menu_header {
  position: fixed;
  z-index: 9999;
}

.menumobile.bottone-fix.down .navbar-nav-menu, .menumobile.bottone-fix.up .navbar-nav-menu {
    flex-flow: column;
    text-align: -webkit-center;
}

/*barre fr*/
.btn-apriFR::before,
.btn-apriFR::after {
  content: "";
  position: absolute;
  top: 10%;          /* distanza dall’alto */
  bottom: 10%;       /* distanza dal basso */
  width: 1px;
  background-color: #fff;
}

.btn-apriFR::before {
  left: 0;
}

.btn-apriFR::after {
  right: 0;
}

#header .btn-apriFR:hover::before,
#header .btn-apriFR:hover::after {
  display: none;
}


#header.pos_fixed .btn-apriFR::before,
#header.pos_fixed .btn-apriFR::after,
#header .btn-apriFR:hover::before,
#header .btn-apriFR:hover::after {
  opacity: 0;
}


div[class^="cbck_"], div[class^="acbck_"] {
  z-index: 4;
}

p {font-size: 1rem !important;}

#footer {
    background: #B85C38;
}

#footer span.elem, #footer span.elem {
    font-family: 'Jost', sans-serif;
    font-size: 1rem;
}

/*mabi*/


html { font-size: 17px; }        /* mobile — era 16px */
@media (min-width: 480px) { html { font-size: 17px; } }
@media (min-width: 768px) { html { font-size: 18px; } }
@media (min-width: 1024px) { html { font-size: 18px; } }
@media (min-width: 1440px) { html { font-size: 19px; } }


    :root {
      --cream: #FAF7F2;
      --warm-white: #F5F0E8;
      --sand: #E8DCC8;
      --terracotta: #B85C38;
      --terracotta-dark: #8B3D22;
      --lake: #2A5470;
      --lake-light: #4A7A9B;
      --lake-pale: #C5D9E8;
      --gold: #C9A84C;
      --text-dark: #2C2419;
      --text-mid: #5C4A35;
      --text-light: #8A7060;
      --radius: 4px;
      --nav-h: 64px;
    }


#slideshow {
  position: relative;
  height: 100svh !important;
  display: flex;
  align-items: flex-end;
  background-size: cover;
  background-position: center;
}

#slideshow {
  min-height: 100svh !important;
}

#slideshow::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(20,12,5,0.82) 0%,
    rgba(20,12,5,0.35) 50%,
    rgba(20,12,5,0.08) 100%
  );
  pointer-events: none;
}

#slideshow .area,
#slideshow .colonnaarea,
#slideshow .row {
  position: relative;
  z-index: 5;
  width: 100%;
}

#slideshow .ao_left {
  padding: 0 24px 85px;
  animation: fadeUp 1s 0.3s both;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}

#slideshow h3.hero-claim {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2rem, 7.5vw, 4rem);
  font-weight: 300;
  line-height: 1.12;
  color: #fff;
  letter-spacing: -0.01em;
  margin-bottom: 14px;
}

#slideshow h3.hero-claim em {
  font-style: italic;
  color: #C9A84C; /* --gold */
}

#slideshow h4 {
  font-family: 'Jost', sans-serif;
  font-size: 0.75rem;
  font-weight: 300;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.9);
  margin: 0;
}

@media (min-width: 768px) {
  #slideshow .ao_left {
    padding: 0 48px 72px;
    max-width: 725px;
  }
}


/* ══ TITOLO / NAME REVEAL ══ */
#titolo {
  background: #FAF7F2;
  border-bottom: 1px solid #E8DCC8;
}

#titolo .area,
#titolo .colonnaarea,
#titolo .row {
  width: 100%;
}

#titolo h1 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.7rem, 5.5vw, 3rem);
  font-weight: 300;
  line-height: 1.4;
  color: #2C2419;
  padding: 36px 24px 28px;
  margin: 0;
}

/* Il nome principale — bold Playfair */
#titolo h1 strong {
  font-weight: 600;
  display: block;
  line-height: 1.1;
  margin-bottom: 10px;
}

/* Il sottotitolo geografico dopo il <br> */

#titolo h1 {
  font-size: clamp(0.65rem, 1.8vw, 0.8rem);
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #8A7060;
  line-height: 1.8;
}

#titolo h1 strong {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.7rem, 5.5vw, 3rem);
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: #2C2419;
  display: block;
  line-height: 1.1;
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  #titolo {
    border-bottom: none;
  }
  #titolo h1 {
    padding: 44px 48px 32px;
    max-width: 960px;
    margin: 0 auto;
    display: block;
  }

  #header:not(.pos_fixed) .colheader.ch3 .elem.pers1 p {
        border: 1.5px solid rgba(255, 255, 255, 0.6);
  }
}


/* ══ VALUTAZIONI / RATING STRIP ══ */
#valutazioni {
  background: #2A5470;
}

#valutazioni .area,
#valutazioni .colonnaarea,
#valutazioni .row {
  width: 100%;
}

/* Il div che contiene tutti gli h3 */
#valutazioni .col-sm-12:last-child {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0;
  padding: 18px 24px;
}

#valutazioni h3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 20px;
  margin: 0;
  position: relative;
  font-weight: 300;
  text-align: center;
}

/* Separatore verticale tra gli h3 */
#valutazioni h3 + h3::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 36px;
  background: rgba(255,255,255,0.15);
}

/* Prima riga — il numero grande */
#valutazioni h3 br {
  display: block;
}

/* Trick stesso approccio del titolo:
   il numero è il testo prima del <br>,
   la label è dopo. Impostiamo h3 come label
   e upscaliamo la prima riga con ::first-line */

#valutazioni h3 {
  font-family: 'Jost', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #C5D9E8; /* --lake-pale */
  line-height: 2;
}

#valutazioni h3::first-line {
  font-family: 'Playfair Display', serif;
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: #ffffff;
  line-height: 1;
}

@media (min-width: 768px) {
  #valutazioni .col-sm-12:last-child {
    gap: 8px;
    padding: 20px 48px;
    max-width: 960px;
    margin: 0 auto;
  }

  #valutazioni h3 {
    padding: 8px 32px;
  }
}


/* ══════════════════════════════════════════════════════
   #sezione1 — L'APPARTAMENTO
   CSS-only · HTML generato dal CMS, non modificabile
══════════════════════════════════════════════════════ */

#sezione1 { background: #FAF7F2; }

/* Reset padding Bootstrap */
#sezione1 .col-sm-12,
#sezione1 .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}

/* Contenitore centrato */
#sezione1 .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}

@media (min-width: 768px) {
  #sezione1 .colonnaarea { padding: 0 48px; }
}

/* ─────────────────────────────────────────────
   ROW 1 — h2 + p  (eyebrow · titolo · intro)
───────────────────────────────────────────── */

#sezione1 .colonnaarea > .row:first-child {
  padding: 40px 0 28px;
}
@media (min-width: 768px) {
  #sezione1 .colonnaarea > .row:first-child { padding: 56px 0 32px; }
  .index-camere #sezione1 .colonnaarea > .row:first-child {
      padding: 56px 0 56px;
  }
}

/* h2: prima riga → eyebrow gold Jost, righe successive → titolo Playfair */
#sezione1 h2 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 300;
  line-height: 1.2;
  color: #2C2419;
  margin: 8px 0 16px;
  text-transform: none;
  letter-spacing: 0;
}

#sezione1 h2::first-line {
  font-family: 'Jost', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase !important;
  color: #C9A84C;
}

#sezione1 h2 em { font-style: italic; color: #B85C38; }

/* Paragrafo intro */
#sezione1 .colonnaarea > .row:first-child p {
  font-family: 'Jost', sans-serif;
  font-size: 0.92rem;
  font-weight: 300;
  line-height: 1.85;
  color: #5C4A35;
  text-align: left !important;
  margin: 0;
}

/* ─────────────────────────────────────────────
   ROW 2 — h4 × 6  (feature cards)
───────────────────────────────────────────── */

/* La colonna diventa una griglia di card */
#sezione1 .colonnaarea > .row:nth-child(2) .col-sm-12 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding: 0 0 56px;
}

@media (min-width: 768px) {
  #sezione1 .colonnaarea > .row:nth-child(2) .col-sm-12 {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    padding: 0 0 72px;
  }
}

/* Ogni h4 → card */
#sezione1 h4 {
  background: #F5F0E8;
  border: 1px solid #E8DCC8;
  border-radius: 8px;
  padding: 20px 16px;
  margin: 0;
  font-family: 'Jost', sans-serif;
  font-size: 1rem;
  font-weight: 300;
  color: #8A7060;
  line-height: 1.6;
  text-transform: none;
  word-wrap: break-word;
  white-space: normal;
  transition: border-color 0.25s, transform 0.25s;
}

#sezione1 h4:hover {
  border-color: #C9A84C;
  transform: translateY(-2px);
}

/* Prima riga h4 → nome servizio in Playfair bold */
#sezione1 h4::first-line {
  font-family: 'Playfair Display', serif;
  font-size: 1rem;
  font-weight: 600;
  color: #2C2419;
  letter-spacing: 0;
  text-transform: none;
}

/* ─────────────────────────────────────────────
   ROW 3 — p × 5  (dettagli pratici)
   Ora ogni voce è un <p> separato → list item
───────────────────────────────────────────── */

#sezione1 .colonnaarea > .row:nth-child(3) .col-sm-12 {
  border-top: 1px solid #E8DCC8;
  padding: 0 0 72px;
}

@media (min-width: 768px) {
  #sezione1 .colonnaarea > .row:nth-child(3) .col-sm-12 {
    padding: 0 0 96px;
  }
}

/* Ogni <p> → riga lista con separatore */
#sezione1 .colonnaarea > .row:nth-child(3) p {
  display: flex;
  align-items: baseline;
  gap: 12px;
  font-family: 'Jost', sans-serif;
  font-size: 0.85rem;
  font-weight: 300;
  line-height: 1.6;
  color: #5C4A35;
  text-align: left !important;
  padding: 14px 0;
  margin: 0;
  border-bottom: 1px solid #E8DCC8;
}

/* Label uppercase (Ospiti:, Check-in:, ecc.) */
#sezione1 .colonnaarea > .row:nth-child(3) p strong {
  font-family: 'Jost', sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #2C2419;
  white-space: nowrap;
}



/* ══════════════════════════════════════════════════════
   #sezione2 — GALLERIA FOTOGRAFICA
══════════════════════════════════════════════════════ */
 
#sezione2 .col-sm-12,
#sezione2 .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}
 
#sezione2 .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}
 
@media (min-width: 768px) {
  #sezione2 .colonnaarea { padding: 0 48px; }
}
 
#sezione2 .colonnaarea > .row:first-child {
  padding: 72px 0 40px;
}
 
@media (min-width: 768px) {
  #sezione2 .colonnaarea > .row:first-child { padding: 96px 0 40px; }
}
 
/* Prima riga → eyebrow gold, resto → titolo Playfair */
#sezione2 h2 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 300;
  line-height: 1.2;
  color: #ffffff;
  margin: 8px 0 0;
  text-transform: none;
  letter-spacing: 0;
}
 
#sezione2 h2::first-line {
  font-family: 'Jost', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase !important;
  color: #C9A84C;
}
 
#sezione2 h2 em { font-style: italic; color: #B85C38; }

section#sezione2, section#sezione3 {
    background: var(--text-dark);
    margin-top: -1px;
}

/* ══════════════════════════════════════════════════════
   #sezione3 — GALLERIA (stesso stile di #foto)
══════════════════════════════════════════════════════ */

#sezione3 .col-sm-12,
#sezione3 .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}

#sezione3 .colonnaarea {
  margin: 0 auto;
  padding: 0 24px;
}

@media (min-width: 768px) {
  #sezione3 .colonnaarea { padding: 0 48px; }
}

#sezione3 .galleriapres {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding: 0 0 72px;
  width: 100%;
}

@media (min-width: 768px) {
  #sezione3 .galleriapres {
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    padding: 0 0 96px;
  }
}

#sezione3 .galleriapres .col-sm-6,
#sezione3 .galleriapres .col-md-3 {
  width: 100% !important;
  padding: 0 !important;
}

#sezione3 .galleriapres .foto-gallery {
  display: block;
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  border: 1px solid rgba(255,255,255,0.1);
  transition: transform 0.25s, border-color 0.25s;
}

#sezione3 .galleriapres .foto-gallery:hover {
  transform: translateY(-2px);
  border-color: #C9A84C;
}

#sezione3 .galleriapres figure {
  margin: 0;
  width: 100%;
  height: 100%;
}

#sezione3 .galleriapres picture {
  display: block;
  width: 100%;
  height: 100%;
}

#sezione3 .galleriapres img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.6s ease;
}

#sezione3 .galleriapres .foto-gallery:hover img {
  transform: scale(1.06);
}

#sezione3 .galleriapres .mask-gallery {
  position: absolute;
  inset: 0;
  background: rgba(44, 36, 25, 0);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s ease;
}

#sezione3 .galleriapres .mask-gallery span {
  color: #fff;
  font-size: 1.6rem;
  opacity: 0;
  transform: scale(0.8);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

#sezione3 .galleriapres .foto-gallery:hover .mask-gallery {
  background: rgba(44, 36, 25, 0.45);
}

#sezione3 .galleriapres .foto-gallery:hover .mask-gallery span {
  opacity: 1;
  transform: scale(1);
}

 
/* ══════════════════════════════════════════════════════
   #sezione4 — RECENSIONI
══════════════════════════════════════════════════════ */
 
#sezione4 { background: #F5F0E8; }
 
#sezione4 .col-sm-12,
#sezione4 .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}
 
#sezione4 .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}
 
@media (min-width: 768px) {
  #sezione4 .colonnaarea { padding: 0 48px; }
}
 
/* ── ROW 1 — titolo ── */
 
#sezione4 .colonnaarea > .row:first-child {
  padding: 72px 0 40px;
}
 
@media (min-width: 768px) {
  #sezione4 .colonnaarea > .row:first-child { padding: 96px 0 40px; }
}
 
#sezione4 h2 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 300;
  line-height: 1.2;
  color: #2C2419;
  margin: 8px 0 0;
  text-transform: none;
  letter-spacing: 0;
}
 
/* "Cosa dicono gli ospiti" → eyebrow gold */
#sezione4 h2::first-line {
  font-family: 'Jost', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase !important;
  color: #a56141;
}
 
/* "4,97 su 5" in em → gold */
#sezione4 h2 em {
  font-style: italic;
  color: #a56141;
}
 
/* ── ROW 2 — griglia review card ── */
 
#sezione4 .colonnaarea > .row:nth-child(2) {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  padding: 0 0 72px;
}
 
@media (min-width: 768px) {
  #sezione4 .colonnaarea > .row:nth-child(2) {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    padding: 0 0 96px;
  }
}
 
/* Ogni col → review card */
#sezione4 .colonnaarea > .row:nth-child(2) .col-sm-12 {
  position: relative;
  background: #FAF7F2;
  border: 1px solid #E8DCC8;
  border-radius: 8px;
  padding: 28px 24px 24px !important;
  overflow: hidden;
}
 
/* Virgolettone decorativo */
#sezione4 .colonnaarea > .row:nth-child(2) .col-sm-12::before {
  content: '\201C';
  position: absolute;
  top: -8px;
  left: 12px;
  font-family: 'Playfair Display', serif;
  font-size: 6rem;
  color: #E8DCC8;
  line-height: 1;
  pointer-events: none;
}
 
/* Testo della recensione */
#sezione4 .colonnaarea > .row:nth-child(2) p {
  font-family: 'Jost', sans-serif;
  font-size: 0.88rem;
  font-weight: 300;
  line-height: 1.75;
  color: #5C4A35;
  text-align: left !important;
  margin: 0;
  position: relative;
  z-index: 1;
}
 
/* Prima riga (★★★★★) → gold */
#sezione4 .colonnaarea > .row:nth-child(2) p::first-line {
  color: #a56141;
  font-size: 0.8rem;
}
 
/* Autore */
#sezione4 .colonnaarea > .row:nth-child(2) p strong {
  display: block;
  margin-top: 16px;
  font-family: 'Jost', sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #8A7060;
}



/* ── PUNTEGGI (rating summary) — dentro #sezione4 ── */
 
#sezione4 .punteggi {
  border-radius: 8px;
  margin: 0 0 72px;
  overflow: hidden;
}
 
@media (min-width: 768px) {
  #sezione4 .punteggi { margin: 0 0 96px; }
}
 
#sezione4 .punteggi .col-sm-12 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: rgba(255,255,255,0.08);
  padding: 0 !important;
}
 
@media (min-width: 768px) {
  #sezione4 .punteggi .col-sm-12 {
    grid-template-columns: repeat(3, 1fr);
  }
}
 
/* Ogni voce: p = label piccola Jost */
#sezione4 .punteggi p {
  background: #B85C38;
  margin: 0;
  padding: 20px 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  text-align: left !important;
  font-family: 'Jost', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #f6ddd3;
  line-height: 1;
}
 
/* strong = numero grande Playfair bianco */
#sezione4 .punteggi p strong {
  font-family: 'Playfair Display', serif;
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: #ffffff;
  line-height: 1;
}
 

/* ══════════════════════════════════════════════════════
   #sezione5 — POSIZIONE
══════════════════════════════════════════════════════ */
 
#sezione5 { background: #FAF7F2; }
 
#sezione5 .col-sm-12,
#sezione5 .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}
 
#sezione5 .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}
 
@media (min-width: 768px) {
  #sezione5 .colonnaarea { padding: 0 48px; }
}
 
#sezione5 .colonnaarea > .row:first-child {
  padding: 72px 0 40px;
}
 
@media (min-width: 768px) {
  #sezione5 .colonnaarea > .row:first-child { padding: 96px 0 40px; }
}
 
#sezione5 h2 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 300;
  line-height: 1.2;
  color: #2C2419;
  margin: 8px 0 16px;
  text-transform: none;
  letter-spacing: 0;
}
 
/* "Dove siamo" → eyebrow gold */
#sezione5 h2::first-line {
  font-family: 'Jost', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase !important;
  color: #C9A84C;
}
 
/* "borgo" in em → terracotta */
#sezione5 h2 em { font-style: italic; color: #B85C38; }
 
#sezione5 p {
  font-family: 'Jost', sans-serif;
  font-size: 0.92rem;
  font-weight: 300;
  line-height: 1.85;
  color: #5C4A35;
  text-align: left !important;
  margin: 0 0 72px;
}
 
@media (min-width: 768px) {
  #sezione5 p { margin: 0; }
}


/* ── DINTORNI — lista luoghi vicini ── */
 
#sezione5 .dintorni {
  border-top: 1px solid #E8DCC8;
  margin: 40px 0 0;
  padding: 0 0 72px !important;
}
 
@media (min-width: 768px) {
  #sezione5 .dintorni { padding: 0 0 96px !important; }
}
 
/* Ogni <p> → riga con nome a sx e distanza a dx */
#sezione5 .dintorni p {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: 'Jost', sans-serif;
  font-size: 0.85rem;
  font-weight: 300;
  color: #5C4A35;
  text-align: left !important;
  margin: 0;
  padding: 14px 0;
  border-bottom: 1px solid #E8DCC8;
  line-height: 1.4;
}
 
/* Distanza → destra, piccola, bold, grigio chiaro */
#sezione5 .dintorni p span {
  font-size: 0.72rem;
  font-weight: 700;
  color: #8A7060;
  white-space: nowrap;
  margin-left: 16px;
  flex-shrink: 0;
}


/* ══════════════════════════════════════════════════════
   #sezione6 — CONTATTI / HOST
══════════════════════════════════════════════════════ */
 
#sezione6 { background: #2C2419; }
 
#sezione6 .col-sm-12,
#sezione6 .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}
 
#sezione6 .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}
 
@media (min-width: 768px) {
  #sezione6 .colonnaarea { padding: 0 48px; }
}
 
/* ── ROW 1 — titolo + intro ── */
 
#sezione6 .colonnaarea > .row:first-child {
  padding: 72px 0 40px;
}
 
@media (min-width: 768px) {
  #sezione6 .colonnaarea > .row:first-child { padding: 96px 0 40px; }
}
 
#sezione6 h2 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 300;
  line-height: 1.2;
  color: #FAF7F2;
  margin: 8px 0 16px;
  text-transform: none;
  letter-spacing: 0;
}
 
/* "Prenota il tuo soggiorno" → eyebrow gold */
#sezione6 h2::first-line {
  font-family: 'Jost', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase !important;
  color: #C9A84C;
}
 
#sezione6 .colonnaarea > .row:first-child p {
  font-family: 'Jost', sans-serif;
  font-size: 0.92rem;
  font-weight: 300;
  line-height: 1.85;
  color: rgba(255,255,255,0.55);
  text-align: left !important;
  margin: 0;
}
 
/* ── SCHEDA HOST ── */
 
#sezione6 .scheda {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  padding: 28px 24px !important;
  margin: 0 0 72px;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: flex-start;
}
 
@media (min-width: 768px) {
  #sezione6 .scheda { margin: 0 0 96px; gap: 24px; }
}
 
/* Col 1: avatar circolare con bordo gold */
#sezione6 .scheda .cont_sing {
  width: 80px;
  flex-shrink: 0;
}
 
#sezione6 .scheda figure {
  margin: 0;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid #C9A84C;
}
 
#sezione6 .scheda figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}
 
/* Col 2: nome + bio — si allarga per riempire la riga accanto all'avatar */
#sezione6 .scheda > .col-sm-12:nth-child(2) {
  flex: 1;
  min-width: 0;
}
 
/* h3: "Rubina" → prima riga Playfair bianco grande, "⭐ Superhost" → Jost gold piccolo */
#sezione6 h3 {
  font-family: 'Jost', sans-serif;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #C9A84C;
  line-height: 2.2;
  margin-bottom: 14px;
  word-wrap: break-word;
  white-space: normal;
}
 
#sezione6 h3::first-line {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: #ffffff;
}
 
/* Bio in corsivo con bordo gold a sinistra */
#sezione6 .scheda > .col-sm-12:nth-child(2) p {
  font-family: 'Jost', sans-serif;
  font-size: 0.85rem;
  font-weight: 300;
  line-height: 1.7;
  color: rgba(255,255,255,0.55);
  font-style: italic;
  border-left: 2px solid #C9A84C;
  padding-left: 16px;
  text-align: left !important;
  margin: 0;
}
 
/* Col 3: stats — griglia 3 colonne, full width sotto */
#sezione6 .scheda > .col-sm-12:nth-child(3) {
  flex-basis: 100%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
 
#sezione6 .scheda > .col-sm-12:nth-child(3) p {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 14px 8px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 6px;
  text-align: center !important;
  margin: 0;
  font-family: 'Jost', sans-serif;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  line-height: 1;
}
 
/* Il <br> tra numero e label non serve con flex column */
#sezione6 .scheda > .col-sm-12:nth-child(3) p br { display: none; }
 
/* Numero grande in Playfair gold */
#sezione6 .scheda > .col-sm-12:nth-child(3) p strong {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-weight: 600;
  color: #C9A84C;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1;
}
 



/* ══════════════════════════════════════════════════════
   #titolo — NOME + INTRO SEO
══════════════════════════════════════════════════════ */
 
#titolo { background: #FAF7F2; }
 
#titolo .col-sm-12,
#titolo .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}
 
#titolo .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}
 
@media (min-width: 768px) {
  #titolo .colonnaarea { padding: 0 48px; }
}
 
#titolo .colonnaarea > .row {
  padding: 56px 0 64px;
}
 
@media (min-width: 768px) {
  #titolo .colonnaarea > .row { padding: 72px 0 80px; }
}
 
/* h1: base = linea geografica (Jost piccolo uppercase) */
#titolo h1 {
  font-family: 'Jost', sans-serif;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #8A7060;
  line-height: 1;
  margin: 0 0 24px;
}
 
/* strong = nome principale in Playfair Display grande */
#titolo h1 strong {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2rem, 6vw, 3.2rem);
  font-weight: 600;
  letter-spacing: -0.01em;
  text-transform: none;
  color: #2C2419;
  display: block;
  line-height: 1.1;
  margin-bottom: 10px;
}
 
/* Paragrafo intro SEO */
#titolo .col-sm-12:last-child p {
  font-family: 'Jost', sans-serif;
  font-size: 1rem;
  font-weight: 300;
  line-height: 1.9;
  color: #5C4A35;
  text-align: left !important;
  margin: 0;
}
 
#titolo .col-sm-12:last-child p strong {
  font-weight: 600;
  color: #2C2419;
}
 
#titolo .col-sm-12:last-child p em {
  font-style: italic;
  color: #B85C38;
}
 
/* ══════════════════════════════════════════════════════
   GLOBAL — aumento leggibilità paragrafi su desktop
   Tutte le sezioni: p da 0.92rem → 1rem
══════════════════════════════════════════════════════ */
 
@media (min-width: 768px) {
  #sezione1 .colonnaarea > .row:first-child p,
  #sezione2 .colonnaarea > .row:first-child p,
  #sezione4 .colonnaarea > .row:first-child p,
  #sezione5 .colonnaarea > .row:first-child p,
  #sezione6 .colonnaarea > .row:first-child p {
    font-size: 1rem;
    line-height: 1.9;
  }
 
  /* Liste dettagli e dintorni: da 0.85rem → 0.92rem */
  #sezione1 .colonnaarea > .row:nth-child(3) p,
  #sezione5 .dintorni p {
    font-size: 0.92rem;
  }
 
  /* Testo recensioni: da 0.88rem → 0.95rem */
  #sezione4 .colonnaarea > .row:nth-child(2) p {
    font-size: 0.95rem;
  }
}
 

/* ── FIX allineamento h1 / p in #titolo ── */
#titolo h1 {
  padding-left: 0;
  padding-right: 0;
}
 
@media (min-width: 768px) {
  #titolo h1 {
    padding-left: 0;
    padding-right: 0;
  }
}
 

/* ══════════════════════════════════════════════════════
   #foto — GALLERIA ANTEPRIMA
══════════════════════════════════════════════════════ */
 
#foto { background: #ffffff; }
 
#foto .col-sm-12,
#foto .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}
 
/* Contenitore centrato con max-width — non 100% */
#foto .colonnaarea {
  margin: 0 auto;
  padding: 0 24px;
}
 
@media (min-width: 768px) {
  #foto .colonnaarea { padding: 0 48px; }
}
 
/* Griglia foto */
#foto .galleriapres {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding: 56px 0 72px;
  width: 100%;
}
 
@media (min-width: 768px) {
  #foto .galleriapres {
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    padding: 72px 0 96px;
  }
}
 
/* Reset col Bootstrap dentro la griglia */
#foto .galleriapres .col-sm-6,
#foto .galleriapres .col-md-3 {
  width: 100% !important;
  padding: 0 !important;
}
 
/* Ogni link → contenitore quadrato */
#foto .galleriapres .foto-gallery {
  display: block;
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  border: 1px solid #E8DCC8;
  transition: transform 0.25s, border-color 0.25s;
}
 
#foto .galleriapres .foto-gallery:hover {
  transform: translateY(-2px);
  border-color: #C9A84C;
}
 
/* Figure e picture occupano tutto lo spazio */
#foto .galleriapres figure {
  margin: 0;
  width: 100%;
  height: 100%;
}
 
#foto .galleriapres picture {
  display: block;
  width: 100%;
  height: 100%;
}
 
/* Immagine quadrata con crop al centro */
#foto .galleriapres img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.6s ease;
}
 
#foto .galleriapres .foto-gallery:hover img {
  transform: scale(1.06);
}
 
/* Mask overlay con icona */
#foto .galleriapres .mask-gallery {
  position: absolute;
  inset: 0;
  background: rgba(44, 36, 25, 0);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s ease;
}
 
#foto .galleriapres .mask-gallery span {
  color: #fff;
  font-size: 1.6rem;
  opacity: 0;
  transform: scale(0.8);
  transition: opacity 0.3s ease, transform 0.3s ease;
}
 
#foto .galleriapres .foto-gallery:hover .mask-gallery {
  background: rgba(44, 36, 25, 0.45);
}
 
#foto .galleriapres .foto-gallery:hover .mask-gallery span {
  opacity: 1;
  transform: scale(1);
}



.ch1 {
    width: 75px !important;
    z-index: 9;
}

.ch2 {
    width: 70% !important;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    width: 100% !important;
    height: 70px;
    z-index: 5;
}

.ch3 {
    width: 20% !important;
    position: absolute;
    right: 80px;
    z-index: 8;
}

.ch4 {
    width: 70px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 6;
    height: 70px;
}



/* ══════════════════════════════════════════════════════
   HEADER — ch3 bottone prenota
══════════════════════════════════════════════════════ */
 
/* Contenitore span.pers1 */
#header .colheader.ch3 {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
 
#header .colheader.ch3 .elem.pers1 {
  display: inline-flex;
}
 
/* Il bottone — stesso stile dei btn-primary del sito */
#header .colheader.ch3 .elem.pers1 p {
  font-family: 'Jost', sans-serif;
  font-size: 0.75rem !important;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #ffffff;
  background: #B85C38;
  padding: 12px 24px;
  border-radius: 4px;
  margin: 0;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.25s, transform 0.2s;
  text-align: center !important;
  line-height: 1;
}
 
#header .colheader.ch3 .elem.pers1 p:hover {
  background: #B85C38;
  transform: translateY(-1px);
}
 
/* Header trasparente (non scrollato) → bordo bianco */
#header:not(.pos_fixed) .colheader.ch3 .elem.pers1 p {
  background: transparent;
  border-top: 1.5px solid rgba(255,255,255,0.6);
  color: #ffffff;
}
 
#header:not(.pos_fixed) .colheader.ch3 .elem.pers1 p:hover {
  background: #B85C38;
  border-color: #ffffff;
  transform: translateY(-1px);
}


 
/* ══════════════════════════════════════════════════════
   BOTTONI GLOBALI — colore #B85C38 + margine
══════════════════════════════════════════════════════ */
 
.button,
a.button,
button.button {
  background-color: #B85C38 !important;
  border-color: #B85C38 !important;
  color: #ffffff !important;
  margin: 8px 0;
  transition: background-color 0.25s ease, transform 0.2s ease !important;
  height: auto;
  padding: 20px 24px;
  border-radius: 4px;
  font-weight: 700;
  font-size: 0.75rem;
}
 
.button:hover,
a.button:hover,
button.button:hover {
  background-color: #8B3D22 !important;
  border-color: #8B3D22 !important;
  transform: translateY(-1px);
}

a.button {
    margin-top: 30px;
}



/* ══════════════════════════════════════════════════════
   HAMBURGER MENU — CSS puro, sostituisce il webp
══════════════════════════════════════════════════════ */

#bottone_menu_header .buttonmenu.icona-personalizzata img {
  display: none;
}

#bottone_menu_header .buttonmenu.icona-personalizzata {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  background: transparent;
  border: none;
  cursor: pointer;
  position: relative;
}

/* Linea top + centrale via box-shadow */
#bottone_menu_header .buttonmenu.icona-personalizzata::before {
  content: '';
  display: block;
  width: 32px;
  height: 2px;
  border-radius: 2px;
  background: #ffffff;
  box-shadow: 0 9px 0 #ffffff;
  position: absolute;
  left: 50%;
  top: 11px;
  transform: translateX(-50%);
  transition: transform 0.3s ease;
}

/* Linea bottom */
#bottone_menu_header .buttonmenu.icona-personalizzata::after {
  content: '';
  display: block;
  width: 32px;
  height: 2px;
  border-radius: 2px;
  background: #ffffff;
  position: absolute;
  left: 50%;
  top: 29px;
  transform: translateX(-50%);
  transition: transform 0.3s ease;
}

/* Header scrollato → linee nere */
#header.pos_fixed #bottone_menu_header .buttonmenu.icona-personalizzata::before {
  background: #000000;
  box-shadow: 0 9px 0 #000000;
}
#header.pos_fixed #bottone_menu_header .buttonmenu.icona-personalizzata::after {
  background: #000000;
}

/* Hover — stagger */
#bottone_menu_header .buttonmenu.icona-personalizzata:hover::before {
  transform: translateX(-50%) scaleX(0.7);
  transform-origin: left center;
}
#bottone_menu_header .buttonmenu.icona-personalizzata:hover::after {
  transform: translateX(-50%) scaleX(0.85);
  transform-origin: right center;
}

/* Link lingua alternativa */
#menulingueheader a.menulingua span {
  font-family: 'Jost', sans-serif;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #ffffff;
}
 
#header.pos_fixed #menulingueheader a.menulingua span {
  color: #000000;
}
 
/* Nascondi l'icona material symbols */
#menulingueheader span.material-symbols-rounded {
  display: none !important;
}
 
/* Fix parità it / en */
#menulingueheader button.multilingue > span:first-child,
#menulingueheader a.menulingua > span {
  font-family: 'Jost', sans-serif;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #ffffff;
}

#header.pos_fixed #menulingueheader button.multilingue > span:first-child,
#header.pos_fixed #menulingueheader a.menulingua > span {
  color: #000000;
}


/* ══════════════════════════════════════════════════════
   MENU APERTO — stile panel pulito (ispirazione OVS)
══════════════════════════════════════════════════════ */

/* Il panel menu — sfondo cream, full screen */
#menu_header.menu-aperto .areamenu {
  background: #FAF7F2 !important;
  backdrop-filter: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 80px 40px 40px;
  height: 100%;
  position: relative;
  z-index: 2;
}

/* Nascondi il video background — interferirebbe */
#menu_header.menu-aperto .areabck {
  opacity: 1;
}

/* Fix areabck — rimuove opacità residua del vecchio blocco video */
#menu_header.menu-aperto .areabck {
  opacity: 1 !important;
  background-size: cover !important;
  background-position: center center !important;
}

#menu_header.menu-aperto .areabck .sezab {
  display: none;
}

/* Logo nel menu */
#menu_header.menu-aperto .contenitore-logo-menu {
  margin-bottom: 48px;
}

#menu_header.menu-aperto .logo-sito-menu {
  filter: none !important;
  opacity: 0.6;
}

/* Lista voci */
#menu_header.menu-aperto .navbar-nav-menu {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
}

/* Ogni voce */
#menu_header.menu-aperto .navbar-nav-menu li.nav-item {
  width: 100%;
  border-bottom: 1px solid #E8DCC8;
}

#menu_header.menu-aperto .navbar-nav-menu li.nav-item:first-child {
  border-top: 1px solid #E8DCC8;
}

/* Link */
#menu_header.menu-aperto .navbar-nav-menu li.nav-item .nav-link {
  font-family: 'Playfair Display', serif !important;
  font-size: 1.6rem !important;
  font-weight: 300 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #2C2419 !important;
  text-align: left !important;
  padding: 18px 0 !important;
  display: block;
  width: 100%;
  transition: color 0.2s, padding-left 0.2s;
  line-height: 1.2 !important;
  background: transparent !important;
  margin: 0 !important;
}

#menu_header.menu-aperto .navbar-nav-menu li.nav-item .nav-link:hover {
  color: #B85C38 !important;
  padding-left: 8px !important;
  letter-spacing: 0 !important;
}

/* Voce prenotazioni — evidenziata */
#menu_header.menu-aperto .navbar-nav-menu li.nav-item.prenotazioni .nav-link {
  color: #B85C38 !important;
  font-weight: 600 !important;
}

/* Bottone chiudi */
#menu_header.menu-aperto .chiudi_menumobile {
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 10;
}

#menu_header.menu-aperto .chiudi_menumobile i.zmdi-close {
  font-size: 28px !important;
  color: #2C2419 !important;
}

#menu_header {
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 100% !important;
  width: 100% !important;
}

/* ══════════════════════════════════════════════════════
   MENU SPLIT — desktop/tablet (min 1024px)
══════════════════════════════════════════════════════ */

@media (min-width: 1024px) {

  /* Il menu diventa flex row — areamenu sinistra + ::after destra */
  #menu_header.menu-aperto {
    display: flex !important;
    flex-direction: row !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    position: fixed !important;
  }

  /* Pannello sinistro — voci menu */
  #menu_header.menu-aperto .areamenu {
    width: 50% !important;
    height: 100vh !important;
    overflow-y: auto;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 80px 64px !important;
    background: #FAF7F2 !important;
    position: relative;
    z-index: 2;
    flex-shrink: 0;
    align-items: flex-start;
  }
    /* Pannello destro — usa il background-image inline del CMS */
    #menu_header.menu-aperto .areabck {
    width: 50% !important;
    height: 100vh !important;
    position: relative !important;
    flex-shrink: 0;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    }

    /* Rimuovi il vecchio ::after con l'immagine hardcoded */
    #menu_header.menu-aperto::after {
    display: none !important;
    }

  /* Link menu più grandi su desktop */
  #menu_header.menu-aperto .navbar-nav-menu li.nav-item .nav-link {
    font-size: 2rem !important;
    padding: 14px 0 !important;
  }

  /* Bottoni CTA affiancati su desktop */
  .menu-cta-block {
    display: flex;
    flex-direction: row;
    gap: 16px;
    margin-top: 48px;
  }

}


/* ── Bottoni CTA + indirizzo ── */
.menu-cta-block {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 40px;
}
 
.menu-cta-buttons {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
 
@media (min-width: 1024px) {
  .menu-cta-buttons {
    flex-direction: row;
    gap: 16px;
  }
}
 
/* Bottone outlined — stesso font del prenota, bordo terracotta */
.menu-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 20px;
  background: transparent;
  border: 1.5px solid #B85C38;
  border-radius: 4px;
  font-family: 'Jost', sans-serif;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #B85C38 !important;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.25s, color 0.25s;
}
 
.menu-cta-btn:hover {
  background: #B85C38;
  color: #ffffff !important;
}
 
/* Indirizzo — solo testo, non bottone */
.menu-cta-address {
  font-family: 'Jost', sans-serif;
  font-size: 0.75rem;
  font-weight: 300;
  letter-spacing: 0.08em;
  color: #8A7060;
  margin-top: 4px;
  line-height: 1.6;
}

.menu-cta-btn .material-symbols-rounded {
  font-size: 1rem !important;
  color: inherit !important;
  line-height: 1;
  vertical-align: middle;
}


/* CTA bottoni — colonna mobile, riga desktop */
.menu-cta-block {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 40px;
}

@media (min-width: 1024px) {
  .menu-cta-block {
    flex-direction: row;
    align-items: center;
    gap: 16px;
  }
}


/* ══════════════════════════════════════════════════════
   SLIDESHOW INTERNO — h1 pagine interne
══════════════════════════════════════════════════════ */

#slideshow .ao_left h1 {
  font-family: 'Jost', sans-serif;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  line-height: 1;
  margin: 0 0 8px;
  padding: 0;
}

/* "Mabi Sweet Home" → titolo grande Playfair */
#slideshow .ao_left h1 strong {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2rem, 6vw, 3.8rem);
  font-weight: 300;
  letter-spacing: -0.01em;
  text-transform: none;
  color: #ffffff;
  display: block;
  line-height: 1.1;
  margin-bottom: 0;
}

/* "Anguillara Sabazia" → gold italic */
#slideshow .ao_left h1 em {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.2rem, 3vw, 1.8rem);
  font-weight: 300;
  color: #ffffff;
  display: block;
  line-height: 1.3;
  font-style: normal;
}


/* ══════════════════════════════════════════════════════
   #sezione-interna1 — DOVE DORMIRAI
══════════════════════════════════════════════════════ */
 
#sezione-interna1 { background: #FAF7F2; }
 
#sezione-interna1 .col-sm-12,
#sezione-interna1 .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}
 
#sezione-interna1 .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}
 
@media (min-width: 768px) {
  #sezione-interna1 .colonnaarea { padding: 0 48px; }
}
 
/* ── h2 eyebrow + titolo ── */
#sezione-interna1 .colonnaarea > .row:first-child {
  padding: 20px 0 20px;
}
 
@media (min-width: 768px) {
#sezione-interna1 .colonnaarea > .row:first-child {padding: 24px 0 24px;}
}
 

#sezione-interna1 .row.camera {
    border-top: 1.5px solid #a56141;
}

#sezione-interna1 h2 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 300;
  line-height: 1.2;
  color: #2C2419;
  margin: 8px 0 32px;
  text-transform: none;
  letter-spacing: 0;
}
 
#sezione-interna1 h2::first-line {
  font-family: 'Jost', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase !important;
  color: #C9A84C;
}
 
/* ── Immagine ── */
#sezione-interna1 .cont_sing {
  margin-bottom: 32px;
}
 
#sezione-interna1 .cont_sing figure {
  margin: 0;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #E8DCC8;
}
 
#sezione-interna1 .cont_sing img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  object-position: center;
  display: block;
}
 
@media (min-width: 768px) {
  #sezione-interna1 .cont_sing img { height: 560px; }
}
 
/* ── h3 titolo camera + p sottotitolo ── */
#sezione-interna1 h3 {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-weight: 600;
  color: #2C2419;
  margin: 0 0 8px;
  line-height: 1.2;
  text-transform: none;
  white-space: normal;
  word-wrap: break-word;
}
 
#sezione-interna1 .col-sm-12:last-child > p {
  font-family: 'Jost', sans-serif;
  font-size: 0.92rem;
  font-weight: 300;
  color: #8A7060;
  letter-spacing: 0.05em;
  margin: 0 0 32px;
  text-align: left !important;
  line-height: 1.5;
  border-bottom: 1px solid #E8DCC8;
  padding-bottom: 24px;
}
 
/* ── h4 → feature chips in griglia ── */
#sezione-interna1 .col-sm-12:last-child {
  display: block;
}
 
#sezione-interna1 .col-sm-12:last-child h4 {
  display: inline-flex;
  align-items: center;
  font-family: 'Jost', sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #5C4A35;
  background: #F5F0E8;
  border: 1px solid #E8DCC8;
  border-radius: 50px;
  padding: 8px 16px;
  margin: 0 8px 8px 0;
  line-height: 1;
  transition: border-color 0.2s, color 0.2s;
  white-space: nowrap;
}
 
#sezione-interna1 .col-sm-12:last-child h4:hover {
  border-color: #C9A84C;
  color: #2C2419;
}
 
/* Wrapper chips con flex wrap */
#sezione-interna1 .row.camera .col-sm-12:last-child {
  padding-bottom: 40px;
}
 
@media (min-width: 768px) {
  #sezione-interna1 .row.camera .col-sm-12:last-child { padding-bottom: 56px; }


    #sezione-interna1 .col-sm-12:last-child > p {
    font-size: 1rem;
    line-height: 1.9;
  }

}

/* ══════════════════════════════════════════════════════
   PAGINA INTERNA — sezione1 solo intro (no cards/lista)
══════════════════════════════════════════════════════ */

/* Padding bottom generoso visto che non ci sono card sotto */
.page-interna #sezione1 .colonnaarea > .row:first-child,
#sezione1:last-of-type .colonnaarea > .row:first-child {
  padding-bottom: 72px;
}

@media (min-width: 768px) {
  .page-interna #sezione1 .colonnaarea > .row:first-child,
  #sezione1:last-of-type .colonnaarea > .row:first-child {
    padding-bottom: 96px;
  }
}

/* Il p su questa pagina è più lungo — aumenta line-height */
#sezione1 .colonnaarea > .row:first-child p {
  font-size: 0.92rem;
  line-height: 1.9;
}

@media (min-width: 768px) {
  #sezione1 .colonnaarea > .row:first-child p {
    font-size: 1rem;
    line-height: 1.9;
  }
}

/* ══════════════════════════════════════════════════════
   #sezione-interna2 — IN EVIDENZA / SERVIZI
   Stessa logica di #sezione1 home (h2 + h4 cards)
══════════════════════════════════════════════════════ */
 
#sezione-interna2 {
  background: #FAF7F2;
}
 
#sezione-interna2 .col-sm-12,
#sezione-interna2 .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}
 
#sezione-interna2 .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}
 
@media (min-width: 768px) {
  #sezione-interna2 .colonnaarea { padding: 0 48px; }
}
 
/* ── ROW 1 — h2 ── */
#sezione-interna2 .colonnaarea > .row:first-child {
  padding: 32px 0 20px;
}
 
@media (min-width: 768px) {
  #sezione-interna2 .colonnaarea > .row:first-child { padding: 40px 0 24px; }
}
 
#sezione-interna2 h2 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 300;
  line-height: 1.2;
  color: #2C2419;
  margin: 8px 0 0;
  text-transform: none;
  letter-spacing: 0;
}
 
#sezione-interna2 h2::first-line {
  font-family: 'Jost', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase !important;
  color: #C9A84C;
}
 
#sezione-interna2 h2 em { font-style: italic; color: #B85C38; }
 
/* ── ROW 2 — h4 cards ── */
#sezione-interna2 .colonnaarea > .row:nth-child(2) .col-sm-12 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  padding: 0 0 40px;
}
 
@media (min-width: 768px) {
  #sezione-interna2 .colonnaarea > .row:nth-child(2) .col-sm-12 {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    padding: 0 0 56px;
  }
}
 
#sezione-interna2 h4 {
  background: #F5F0E8;
  border: 1px solid #E8DCC8;
  border-radius: 8px;
  padding: 24px 20px;
  margin: 0;
  font-family: 'Jost', sans-serif;
  font-size: 0.92rem;
  font-weight: 300;
  color: #5C4A35;
  line-height: 1.75;
  text-transform: none;
  word-wrap: break-word;
  white-space: normal;
  transition: border-color 0.25s, transform 0.25s;
}
 
@media (min-width: 768px) {
  #sezione-interna2 h4 { font-size: 1rem; }
}
 
#sezione-interna2 h4:hover {
  border-color: #C9A84C;
  transform: translateY(-2px);
}
 
/* Prima riga h4 → nome in Playfair bold */
#sezione-interna2 h4::first-line {
  font-family: 'Playfair Display', serif;
  font-size: 1.05rem;
  font-weight: 600;
  color: #2C2419;
  letter-spacing: 0;
  text-transform: none;
}
 
/* Strong → nota extra (prezzo, disponibilità) */
#sezione-interna2 h4 strong {
  display: block;
  margin-top: 12px;
  font-family: 'Jost', sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #B85C38;
}


/* ══════════════════════════════════════════════════════
   #sezione-interna3 — TUTTI I SERVIZI
   Layout: h2 titolo, h3 gruppi, h4 chips
══════════════════════════════════════════════════════ */
 
#sezione-interna3 {
  background: #FAF7F2;
}
 
#sezione-interna3 .col-sm-12,
#sezione-interna3 .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}
 
#sezione-interna3 .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}
 
@media (min-width: 768px) {
  #sezione-interna3 .colonnaarea { padding: 0 48px; }
}
 
/* ── h2 titolo sezione ── */
#sezione-interna3 .colonnaarea > .row:first-child > .col-sm-12:first-child {
  padding: 40px 0 32px;
}
 
@media (min-width: 768px) {
  #sezione-interna3 .colonnaarea > .row:first-child > .col-sm-12:first-child {
    padding: 0;
  }
}

.row.servizi-camera {
    border-top: 1.5px solid #a56141;
}
 
#sezione-interna3 h2 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 300;
  line-height: 1.2;
  color: #2C2419;
  margin: 8px 0 0;
  text-transform: none;
  letter-spacing: 0;
}
 
#sezione-interna3 h2::first-line {
  font-family: 'Jost', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase !important;
  color: #C9A84C;
}
 
#sezione-interna3 h2 em { font-style: italic; color: #B85C38; }
 
/* ── Colonna che contiene h3 e h4 ── */
#sezione-interna3 .colonnaarea > .row:first-child > .col-sm-12:last-child {
  padding-bottom: 56px;
  border-top: 1px solid #E8DCC8;
}
 
@media (min-width: 768px) {
  #sezione-interna3 .colonnaarea > .row:first-child > .col-sm-12:last-child {
    padding-bottom: 72px;
  }
}
 
/* ── h3 → titolo gruppo (come amenity-group-title) ── */
#sezione-interna3 h3 {
  font-family: 'Jost', sans-serif;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #8A7060;
  margin: 36px 0 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid #E8DCC8;
  word-wrap: normal;
  white-space: normal;
  line-height: 1.4;
}
 
#sezione-interna3 h3:first-of-type {
  margin-top: 24px;
}
 
/* ── h4 → chip pill ── */
#sezione-interna3 h4 {
  display: inline-flex;
  align-items: center;
  font-family: 'Jost', sans-serif;
  font-size: 0.78rem;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: none;
  color: #5C4A35;
  background: #F5F0E8;
  border: 1px solid #E8DCC8;
  border-radius: 50px;
  padding: 7px 14px 7px 10px;
  margin: 0 8px 8px 0;
  line-height: 1;
  transition: border-color 0.2s, color 0.2s;
  white-space: nowrap;
  word-wrap: normal;
}
 
/* Pallino gold prima del testo */
#sezione-interna3 h4::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #C9A84C;
  margin-right: 8px;
  flex-shrink: 0;
}
 
#sezione-interna3 h4:hover {
  border-color: #C9A84C;
  color: #2C2419;
}
 


/* 
   #sezione-location1 — COME RAGGIUNGERCI*/

#slideshow .col-sm-12.col-md-12.area {
    z-index: 4;
}

 
#sezione-location1 {
  background: #FAF7F2;
  border-top: 1px solid #E8DCC8;
}
 
#sezione-location1 .col-sm-12,
#sezione-location1 .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}
 
#sezione-location1 .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}
 
@media (min-width: 768px) {
  #sezione-location1 .colonnaarea { padding: 0 48px; }
}
 
/* ── ROW 1 — h2 + p intro ── */
#sezione-location1 .colonnaarea > .row:first-child {
  padding: 56px 0 32px;
}
 
@media (min-width: 768px) {
  #sezione-location1 .colonnaarea > .row:first-child { padding: 72px 0 40px; }
}
 
#sezione-location1 h2 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 300;
  line-height: 1.2;
  color: #2C2419;
  margin: 8px 0 16px;
  text-transform: none;
  letter-spacing: 0;
}
 
#sezione-location1 h2::first-line {
  font-family: 'Jost', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase !important;
  color: #C9A84C;
}
 
#sezione-location1 h2 em { font-style: italic; color: #B85C38; }
 
#sezione-location1 .colonnaarea > .row:first-child p {
  font-family: 'Jost', sans-serif;
  font-size: 0.92rem;
  font-weight: 300;
  line-height: 1.9;
  color: #5C4A35;
  text-align: left !important;
  margin: 0;
}
 
@media (min-width: 768px) {
  #sezione-location1 .colonnaarea > .row:first-child p { font-size: 1rem; }
}
 
/* ── ROW 2 — lista info utili ── */
#sezione-location1 .indo-utili .col-sm-12 {
  border-top: 1px solid #E8DCC8;
  padding: 0 0 56px;
}
 
@media (min-width: 768px) {
  #sezione-location1 .indo-utili .col-sm-12 { padding: 0 0 72px; }
}
 
#sezione-location1 .indo-utili p {
  display: flex;
  align-items: baseline;
  gap: 12px;
  font-family: 'Jost', sans-serif;
  font-size: 0.92rem;
  font-weight: 300;
  line-height: 1.6;
  color: #5C4A35;
  text-align: left !important;
  padding: 14px 0;
  margin: 0;
  border-bottom: 1px solid #E8DCC8;
}
 
@media (min-width: 768px) {
  #sezione-location1 .indo-utili p { font-size: 1rem; }
}
 
#sezione-location1 .indo-utili p strong {
  font-family: 'Jost', sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #2C2419;
  white-space: nowrap;
  flex-shrink: 0;
}


/* ══════════════════════════════════════════════════════
   #sezione-location2 — CONTATTACI + MAPPA
   Sfondo scuro come #sezione6
══════════════════════════════════════════════════════ */
 
#sezione-location2 {
  background: #2C2419;
  border-top: 1px solid rgba(255,255,255,0.08);
}
 
#sezione-location2 .col-sm-12,
#sezione-location2 .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}
 
#sezione-location2 .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}
 
@media (min-width: 768px) {
  #sezione-location2 .colonnaarea { padding: 0 48px; }
}
 
/* ── ROW 1 — h2 + p intro ── */
#sezione-location2 .colonnaarea > .row:first-child {
  padding: 56px 0 32px;
}
 
@media (min-width: 768px) {
  #sezione-location2 .colonnaarea > .row:first-child { padding: 72px 0 40px; }
}
 
#sezione-location2 h2 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 300;
  line-height: 1.2;
  color: #FAF7F2;
  margin: 8px 0 16px;
  text-transform: none;
  letter-spacing: 0;
}
 
#sezione-location2 h2::first-line {
  font-family: 'Jost', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase !important;
  color: #C9A84C;
}
 
#sezione-location2 h2 em { font-style: italic; color: #C9A84C; }
 
#sezione-location2 .colonnaarea > .row:first-child p {
  font-family: 'Jost', sans-serif;
  font-size: 0.92rem;
  font-weight: 300;
  line-height: 1.9;
  color: rgba(255,255,255,0.55);
  text-align: left !important;
  margin: 0;
}
 
@media (min-width: 768px) {
  #sezione-location2 .colonnaarea > .row:first-child p { font-size: 1rem; }
}
 
/* ── ROW 2 — lista contatti ── */
#sezione-location2 .colonnaarea > .row:nth-child(2) .col-sm-12 {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding: 0 0 40px;
}
 
#sezione-location2 .colonnaarea > .row:nth-child(2) p {
  display: flex;
  align-items: baseline;
  gap: 12px;
  font-family: 'Jost', sans-serif;
  font-size: 0.92rem;
  font-weight: 300;
  line-height: 1.6;
  color: rgba(255,255,255,0.65);
  text-align: left !important;
  padding: 14px 0;
  margin: 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
 
@media (min-width: 768px) {
  #sezione-location2 .colonnaarea > .row:nth-child(2) p { font-size: 1rem; }
}
 
#sezione-location2 .colonnaarea > .row:nth-child(2) p strong {
  font-family: 'Jost', sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #FAF7F2;
  white-space: nowrap;
  flex-shrink: 0;
}
 
/* ── ROW 3 — mappa ── */
#sezione-location2 .colonnaarea > .row:nth-child(3) .col-sm-12 {
  padding: 0 0 72px;
}
 
@media (min-width: 768px) {
  #sezione-location2 .colonnaarea > .row:nth-child(3) .col-sm-12 { padding: 0 0 96px; }
}
 
#sezione-location2 .mappa-container {
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.06);
}
 
#sezione-location2 .leaflet-container {
  height: 360px !important;
  border-radius: 8px;
}
 
@media (min-width: 768px) {
  #sezione-location2 .leaflet-container { height: 460px !important; }
}


/* ══════════════════════════════════════════════════════
   FIX MOBILE — punteggi + scheda Rubina
══════════════════════════════════════════════════════ */
 
/* Punteggi: 3 colonne già da mobile (2 righe di 3)
   così "Qualità/prezzo" non trabocca */
#sezione4 .punteggi .col-sm-12 {
  grid-template-columns: repeat(3, 1fr);
}
 
/* Scheda Rubina: su mobile stack verticale completo */
#sezione6 .scheda {
  flex-direction: column;
  align-items: flex-start;
}
 
/* Avatar + nome su mobile affiancati in una riga */
#sezione6 .scheda-top {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
}
 
/* Il col nome prende tutto lo spazio disponibile */
#sezione6 .scheda > .col-sm-12:nth-child(2) {
  width: 100%;
  flex: none;
}
 
/* Stats: griglia 3 colonne — già corretto, ma proteggiamo
   i font-size dalle override del responsive.css */
#sezione6 .scheda > .col-sm-12:nth-child(3) p {
  font-size: 0.58rem !important;
}
 
#sezione6 .scheda > .col-sm-12:nth-child(3) p strong {
  font-size: 1.3rem !important;
}
 
/* Punteggi: proteggi i font-size dal responsive.css */
#sezione4 .punteggi p {
  font-size: 0.6rem !important;
}
 
#sezione4 .punteggi p strong {
  font-size: 1.5rem !important;
}
 
/* Ripristina tutti i p nelle sezioni mabi
   contro p{font-size:1.4rem} del responsive */
#titolo p,
#sezione1 .colonnaarea > .row:first-child p,
#sezione1 .colonnaarea > .row:nth-child(3) p,
#sezione4 .colonnaarea > .row:nth-child(2) p,
#sezione5 p,
#sezione5 .dintorni p,
#sezione6 .colonnaarea > .row:first-child p,
#sezione6 .scheda > .col-sm-12:nth-child(2) p,
#sezione-interna1 .col-sm-12:last-child > p,
#sezione-interna2 h4,
#sezione-contatti1 .colonnaarea > .row:first-child p,
#sezione-contatti1 .indo-utili p,
#sezione-contatti2 .dintorni p,
#sezione-contatti3 .colonnaarea > .row:first-child p,
#sezione-contatti3 .colonnaarea > .row:nth-child(2) p,
#sezione-location1 .colonnaarea > .row:first-child p,
#sezione-location1 .indo-utili p,
#sezione-location2 .colonnaarea > .row:first-child p,
#sezione-location2 .colonnaarea > .row:nth-child(2) p {
  font-size: 0.92rem !important;
  line-height: 1.9 !important;
}
 
@media (min-width: 768px) {
  /* Su desktop scheda torna a flex row */
  #sezione6 .scheda {
    flex-direction: row;
    align-items: flex-start;
  }
 
  #sezione6 .scheda > .col-sm-12:nth-child(2) {
    flex: 1;
    width: auto;
  }
}

/* ══════════════════════════════════════════════════════
   LANGUAGE SWITCHER — Opzione A (override sistema.css)
   IT · EN sempre affiancati — CSS puro, zero JS
══════════════════════════════════════════════════════ */
 
/* Override flex-flow: column del sistema.css */
#header nav.navmenu-lingue,
#menulingueheader.navmenu-lingue {
  flex-flow: row nowrap !important;
  align-items: center !important;
  gap: 0 !important;
  float: none !important;
  position: relative;
  display: flex;
}
 
/* Bottone IT — nessun bordo, nessun padding */
#header nav.navmenu-lingue button.multilingue {
  padding: 0 !important;
  background: none !important;
  border: none !important;
  cursor: default !important;
  display: flex !important;
  align-items: center !important;
}
 
/* Nascondi freccia ::after del sistema */
#header nav.navmenu-lingue button.multilingue::after {
  display: none !important;
}
 
/* "it" → Playfair italic gold */
#header nav.navmenu-lingue button.multilingue > span:first-child {
  font-family: 'Playfair Display', serif !important;
  font-style: italic !important;
  font-size: 0.9rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.04em !important;
  text-transform: lowercase !important;
  color: #C9A84C !important;
  line-height: 1;
}
 
/* Nascondi icona material */
#header nav.navmenu-lingue button.multilingue > span.material-symbols-rounded {
  display: none !important;
}
 
/* Override ul: sempre visibile, inline, no absolute, no height:0 */
#header nav.navmenu-lingue ul,
#header nav.navmenu-lingue ul.sottolingue-attivo {
  position: static !important;
  height: auto !important;
  overflow: visible !important;
  display: flex !important;
  align-items: center !important;
  flex-direction: row !important;
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  z-index: auto !important;
}
 
/* Dot · tra IT e EN */
#header nav.navmenu-lingue ul::before {
  content: '·';
  font-family: 'Jost', sans-serif;
  font-size: 0.7rem;
  font-weight: 300;
  margin: 0 7px;
  line-height: 1;
  color: rgba(255,255,255,0.3);
}
 
/* "en" → Jost ghost */
#header nav.navmenu-lingue ul li a.menulingua,
#header nav.navmenu-lingue ul li a.menulingua span {
  font-family: 'Jost', sans-serif !important;
  font-style: normal !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.35) !important;
  transition: color 0.2s !important;
  padding: 0 !important;
  line-height: 1;
}

#header.pos_absolute nav.navmenu-lingue button.multilingue > span:first-child {
    color: #fff !important;
}

#header.pos_absolute nav.navmenu-lingue ul li a.menulingua span {
    color: #fff !important;
}
 
#header nav.navmenu-lingue ul li a.menulingua:hover,
#header nav.navmenu-lingue ul li a.menulingua:hover span {
  color: rgba(255,255,255,0.8) !important;
}
 
/* ── Header scrollato (.pos_fixed) ── */
#header.pos_fixed nav.navmenu-lingue ul::before {
  color: rgba(44,36,25,0.25) !important;
}
 
#header.pos_fixed nav.navmenu-lingue button.multilingue > span:first-child {
  color: #a56141 !important;
}
 
#header.pos_fixed nav.navmenu-lingue ul li a.menulingua,
#header.pos_fixed nav.navmenu-lingue ul li a.menulingua span {
  color: rgba(44,36,25,0.3) !important;
}
 
#header.pos_fixed nav.navmenu-lingue ul li a.menulingua:hover,
#header.pos_fixed nav.navmenu-lingue ul li a.menulingua:hover span {
  color: #B85C38 !important;
}


#sezione1 h2 strong,
#sezione2 h2 strong,
#sezione4 h2 strong,
#sezione5 h2 strong,
#sezione6 h2 strong,
#sezione-interna1 h2 strong,
#sezione-interna2 h2 strong,
#sezione-interna3 h2 strong,
#sezione-contatti1 h2 strong,
#sezione-contatti2 h2 strong,
#sezione-contatti3 h2 strong,
#sezione-location1 h2 strong,
#sezione-location2 h2 strong {
  font-family: 'Jost', sans-serif !important;
  font-size: 0.6rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.25em !important;
  text-transform: uppercase !important;
  color: #C9A84C !important;
  margin-bottom: 6px;
  line-height: 2;
}


/* ============================================================
   MABI SWEET HOME — Form di contatto
   ============================================================ */

/* ----- Sezione wrapper ------------------------------------- */

#invia-richiesta {
  background: #FAF7F2;
}

#invia-richiesta .col-sm-12,
#invia-richiesta .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}

#invia-richiesta .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}

@media (min-width: 768px) {
  #invia-richiesta .colonnaarea { padding: 0 48px; }
}

/* ----- Titolo: h3 eyebrow + strong Playfair ----------------- */

.titoloform h3 {
  font-family: 'Jost', sans-serif;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #C9A84C;
  line-height: 2;
  margin: 56px 0 0;
  word-wrap: break-word;
  white-space: normal;
}

/* Il <br> tra eyebrow e strong aggiunge una riga vuota — lo nascondiamo */
.titoloform h3 br {
  display: none;
}

/* "Contattaci" → titolo grande Playfair */
.titoloform h3 strong {
  font-family: 'Playfair Display', serif !important;
  font-size: clamp(1.9rem, 5.5vw, 3rem) !important;
  font-weight: 300 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #2C2419 !important;
  display: block;
  line-height: 1.2;
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .titoloform h3 { margin: 72px 0 0; }
}

/* ----- Sottotitolo ----------------------------------------- */

.titoloform p {
  font-family: 'Jost', sans-serif !important;
  font-size: 0.92rem !important;
  font-weight: 300 !important;
  color: #8A7060 !important;
  line-height: 1.8 !important;
  text-align: left !important;
  margin: 12px 0 32px !important;
}

@media (min-width: 768px) {
  .titoloform p {
    font-size: 1rem !important;
    margin: 12px 0 40px !important;
  }
}

/* ----- Layout griglia del form ----------------------------- */

form.formrichiesta {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0 0 56px;
}

@media (min-width: 768px) {
  form.formrichiesta {
    grid-template-columns: 1fr 1fr;
    padding: 0 0 72px;
  }

  form.formrichiesta .input-group.controls[data-idinput="9"],
  form.formrichiesta .row.controls,
  form.formrichiesta .row.azioneinvio {
    grid-column: 1 / -1;
  }
}

/* ----- Spazio extra tra ospiti/tipo e textarea ------------- */

form.formrichiesta .input-group.controls[data-idinput="7"],
form.formrichiesta .input-group.controls[data-idinput="8"] {
  margin-bottom: 1.2rem;
}

/* ----- Singolo campo wrapper ------------------------------- */

.input-group.controls {
  display: flex;
  flex-direction: column;
  padding: 0;
  margin: 0;
  border: none;
  background: transparent;
}

/* ----- Label nascosta (accessibilità) ---------------------- */

label.hidelabel {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ----- Label visibile (select: ospiti, tipo richiesta) ----- */

.input-group.controls label:not(.hidelabel) {
  font-family: 'Jost', sans-serif;
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #2C2419;
  margin-bottom: 0.4rem;
}

/* ----- Input, select, textarea ----------------------------- */

.formrichiesta .form-control {
  font-family: 'Jost', sans-serif;
  font-size: 0.92rem;
  font-weight: 300;
  color: #2C2419;
  background: #FFFDF9;
  border: 1px solid #E8DCC8;
  border-radius: 2px;
  padding: 0.65rem 0.85rem;
  height: auto;
  line-height: 1.5;
  box-shadow: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  width: 100%;
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
}

.formrichiesta .form-control:focus {
  border-color: #C9A84C;
  box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.12);
  outline: none;
  background: #FFFDF9;
}

/* Placeholder più scuro per leggibilità */
.formrichiesta .form-control::placeholder {
  color: #9a8c7e;
  font-weight: 300;
}

/* ----- Freccia custom per i select (scoped al form) -------- */

form.formrichiesta select.form-control {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23C9A84C' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.85rem center;
  padding-right: 2.5rem;
  cursor: pointer;
}

/* ----- Textarea (scoped al form) --------------------------- */

form.formrichiesta textarea.form-control {
  min-height: 110px;
  resize: vertical;
  line-height: 1.6;
}

/* ----- Riga privacy ---------------------------------------- */

.row.controls {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  background: #F3EDE3;
  border-left: 2px solid #C9A84C;
  padding: 0.9rem 1rem;
  margin: 0;
  width: 100%;
  box-sizing: border-box;
}

.checkformm {
  display: flex;
  align-items: flex-start;
  padding-top: 2px;
  flex-shrink: 0;
}

.checkformm input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: #C9A84C;
  cursor: pointer;
  margin: 0;
}

.testo-infodatiform label {
  font-family: 'Jost', sans-serif;
  font-size: 0.8rem;
  font-weight: 300;
  color: #6a5c4a;
  line-height: 1.5;
  cursor: pointer;
}

.testo-infodatiform a {
  color: #C9A84C;
  text-decoration: underline;
}

/* ----- Riga captcha + invio -------------------------------- */

.row.azioneinvio {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0;
  margin: 0;
  width: 100%;
}

.infocaptcha {
  font-family: 'Jost', sans-serif;
  font-size: 0.78rem;
  font-weight: 300;
  color: #8a7c6a;
  margin: 0;
}

#captchaText {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

#captchaText img {
  height: 30px;
}

#captchaInput {
  font-family: 'Jost', sans-serif;
  font-size: 0.92rem;
  font-weight: 400;
  color: #2C2419;
  background: #FFFDF9;
  border: 1px solid #E8DCC8;
  border-radius: 2px;
  padding: 0.6rem 0.85rem;
  width: 120px;
  box-shadow: none;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}

#captchaInput:focus {
  border-color: #C9A84C;
  box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.12);
}

/* ----- Bottone invio --------------------------------------- */
/* Nota: il bottone ha anche classe .button → servono !important
   per vincere sulla regola globale .button { background: #B85C38 !important } */

input.btn-invioform {
  font-family: 'Jost', sans-serif !important;
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: #FAF7F2 !important;
  background: #2C2419 !important;
  border: none !important;
  padding: 0.9rem 2.2rem !important;
  border-radius: 1px !important;
  cursor: pointer;
  transition: background 0.2s !important;
  -webkit-appearance: none;
  appearance: none;
  height: auto !important;
}

input.btn-invioform:not([disabled]):hover {
  background: #B85C38 !important;
}

input.btn-invioform[disabled] {
  opacity: 0.45 !important;
  cursor: not-allowed;
}

/* ----- Desktop: font-size body standard -------------------- */

@media (min-width: 1024px) {
  .formrichiesta .form-control {
    font-size: 1rem;
  }
}


/* ============================================================
   MABI SWEET HOME — FAQ Accordion
   Nessun selettore basato su ID univoci
   ============================================================ */

/* ----- Sezione wrapper ------------------------------------- */

#faq {
  background: #FAF7F2;
}

#faq .col-sm-12,
#faq .col-md-12 {
  padding-left: 0;
  padding-right: 0;
}

#faq .colonnaarea {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}

@media (min-width: 768px) {
  #faq .colonnaarea { padding: 0 48px; }
}

/* ----- Titolo h3 ------------------------------------------- */

#faq h3 {
  font-family: 'Jost', sans-serif;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #C9A84C;
  margin: 56px 0 0;
  line-height: 1;
  word-wrap: normal;
  white-space: normal;
}

/* "FAQ" → titolo grande Playfair */
#faq h3 strong {
  font-family: 'Playfair Display', serif !important;
  font-size: clamp(1.9rem, 5.5vw, 3rem) !important;
  font-weight: 300 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #2C2419 !important;
  display: block;
  line-height: 1.2;
  margin-top: 4px;
}

@media (min-width: 768px) {
  #faq h3 { margin: 72px 0 0; }
}

/* ----- Container ------------------------------------------- */

#faq .faq-container {
  margin: 32px 0 56px;
  border-top: 1px solid #E8DCC8;
}

@media (min-width: 768px) {
  #faq .faq-container { margin: 40px 0 72px; }
}

/* ----- Item ------------------------------------------------ */

#faq .faq-item {
  padding: 0 !important;
  border-bottom: 1px solid #E8DCC8;
}

/* ----- Question button ------------------------------------- */

#faq .faq-item .faq-question {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 18px 0 !important;
  margin: 0 !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 0.92rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
  color: #2C2419 !important;
  text-align: left !important;
  cursor: pointer;
  transition: color 0.2s;
  line-height: 1.4 !important;
}

#faq .faq-item .faq-question:hover {
  color: #B85C38 !important;
}

/* Indicatore + via ::after */
#faq .faq-item .faq-question::after {
  content: '+';
  font-family: 'Jost', sans-serif;
  font-size: 1.4rem;
  font-weight: 300;
  color: #C9A84C;
  line-height: 1;
  flex-shrink: 0;
  margin-left: 16px;
  transition: color 0.2s;
}

/* Aperta → indicatore − terracotta */
#faq .faq-item .faq-question[aria-expanded="true"]::after {
  content: '−';
  color: #B85C38;
}

/* Domanda aperta → testo terracotta */
#faq .faq-item .faq-question[aria-expanded="true"] {
  color: #B85C38 !important;
}

@media (min-width: 768px) {
  #faq .faq-item .faq-question {
    font-size: 1rem !important;
    padding: 22px 0 !important;
  }
}

/* ----- Risposta -------------------------------------------- */

#faq .faq-item .faq-answer {
  background: transparent !important;
  border-radius: 0 !important;
  overflow: hidden;
}

#faq .faq-item .faq-answer p {
  font-family: 'Jost', sans-serif !important;
  font-size: 0.92rem !important;
  font-weight: 400 !important;
  line-height: 1.85 !important;
  color: #5C4A35 !important;
  text-align: left !important;
  padding: 0 0 20px !important;
  margin: 0 !important;
}

@media (min-width: 768px) {
  #faq .faq-item .faq-answer p {
    font-size: 1rem !important;
    padding: 0 0 24px !important;
  }
}

#privacy p strong, #privacy h2 {
    font-family: 'Playfair Display', serif;
    font-size: 1.4rem;
    line-height: 3;
    font-weight: 500;
}

#privacy p {
    font-family: 'Jost', sans-serif;
    font-weight: 400;
}