/* ==================================================
   CONFIGURAZIONE GLOBALE
   ================================================== */
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,700,300); 						/*		Robo Condensed 		*/
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed);									/*		Roboto Condensed	*/
@import url(http://fonts.googleapis.com/css?family=PT+Sans+Narrow);										/*		PT Sans Narrow		*/
@import url(http://fonts.googleapis.com/css?family=Abel);												/*		Abel				*/
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,400,300);				/*		Open Sans			*/
@import url(http://fonts.googleapis.com/css?family=Scada:400italic,700italic,400,700);					/*		Scada				*/
@import url(http://fonts.googleapis.com/css?family=Signika:400,300,600,700);							/*		Signika				*/
@import url(http://fonts.googleapis.com/css?family=PT+Sans+Narrow:400,700);								/*		PT Sans Narrow		*/
@import url(http://fonts.googleapis.com/css?family=Ubuntu+Condensed);									/*		Ubuntu Condensed	*/
@import url(https://fonts.googleapis.com/css?family=Muli);												/*		Muli				*/
@import url(https://fonts.googleapis.com/css?family=Droid+Sans);										/*		Droid Sans			*/
@import url(https://fonts.googleapis.com/css?family=Questrial);											/*		Questrial			*/
@import url(https://fonts.googleapis.com/css?family=Carrois+Gothic);									/*		Carrois Gothic		*/
@import url(https://fonts.googleapis.com/css?family=Raleway:wght@300);									/*		Raleway		*/
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400;500&display=swap');			/*		EB Garamond		*/
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Infant:wght@400;500&display=swap');		/*		Cormorant Infant		*/

:root {
    --color-background:#343338;
    --color-text-primary:rgba(255,255,255,0.95);
    --color-menu:rgba(255,255,255,0.90);
	--color-welcome:rgba(255,255,255,0.90);
    --color-overlay-title: rgba(204, 153, 102, 0.3);								/* --color-overlay-title:rgba(0,0,0,0.3); */
    --font-menu:"Cormorant Garamond";
    --font-subtitle:"Cormorant Garamond";
    --font-section_title:"Cormorant Garamond";
    --font-ENTER:"Cormorant Garamond";
    --font-bio:"Cormorant Infant";
    --font-welcome:"Cormorant Infant";
    --font-description:"Cormorant Infant";
    --font-footer:"Cormorant Infant";
    --logo-min-width:180px;
    --logo-responsive-width:40vw;
    --logo-max-width:360px;
    --testo-update: "Last update: 9 August 2026";									/*	DATA UPDATE*/
}

.update::after {
    content: var(--testo-update);
}

html,body {
    margin:0;
    width:100%;
    min-height:100%;
}
body {
    background-image:url("images/background.jpg");
    background-repeat:no-repeat;
    background-position:center top;
    background-size:100% auto;
    background-color:var(--color-background);
}
header {
    text-align:center;
}

.logo {
    padding-top:10px;
}
.logo img {
    width:clamp(
        var(--logo-min-width),
        var(--logo-responsive-width),
        var(--logo-max-width)
    );
    height:auto;
}
.banner {
    margin-top:10px;
    width:100%;
    background:var(--color-overlay-title);
    padding:6px 0;
}

.ENTER { 
    font-family:var(--font-ENTER);
	color: #b78762;
	padding: 0px 0;
    letter-spacing:0.0em;
	margin-top: 30px;
	width: 100%;
	font-size: clamp(12px, 1.4vw, 16px);
}

.ENTER a { 
	display:inline-block;
	color: #b78762;
	padding: 5px 10px;
	border: 1px solid #b78762;
	border-radius: 60px;
	text-decoration: none;
	transition: opacity 0.3s ease;
} 

.ENTER a:hover {
	color: #ffffff;
	opacity: 0.65;
	text-decoration: none;
}

.menu {
    margin-top:22px;
}
.menu a {
    color:var(--color-menu);
    font-family:var(--font-menu);
    font-size:clamp(10px,0.9vw,15px);
    font-weight:300;
    letter-spacing:0.30em;
    text-decoration:none;
    margin:0 2px;
}
.menu a:hover {
    opacity:0.65;
}
.subtitle {
    color:var(--color-text-primary);
    font-family:var(--font-subtitle);
    font-size: clamp(10px, 1.5625vw, 30px);
    font-weight:300;
    letter-spacing:0.4em;
    text-transform:uppercase;
}
.bio {
    padding-top:0px;
    font-size:clamp(9px,1vw,18px);
    text-align:center;
}
.bio img {
    font-family:var(--font-bio);
    width:auto;
    max-width:100%;
    height:auto;
    display:block;
    margin:0 auto;
}
.welcome {
    color:var(--color-text-primary);
    font-family:var(--font-welcome);
    font-size:clamp(8px,1vw,16px);
    font-weight:300;
    letter-spacing:0.1em;
    max-width:900px;
    width: 100%;
    margin: 0 auto;      					/* centra il blocco */
    text-align: center;  					/* centra il testo */
    text-transform:uppercase;
}
.welcome a {
    color:var(--color-welcome);
    text-decoration:none;
}
.welcome a:hover {
    opacity:0.65;
}
.description {
    color:var(--color-text-primary);
    font-family:var(--font-description);
    font-size:clamp(10px,1vw,14px);
    font-weight:300;
    letter-spacing:0.1em;
    max-width:900px;
    width:90%;
    margin:0 auto;
    text-align:justify;
    text-transform:uppercase;
}
.section_title {
    color:var(--color-text-primary);
    font-family:var(--font-section_title);
    font-size:clamp(10px,1vw,20px);
    font-weight:300;
    letter-spacing:0.1em;
    text-transform:uppercase;
}
.footer {
    color:var(--color-text-primary);
    font-family:var(--font-footer);
    font-size:clamp(6px,1vw,12px);
    font-weight:300;
    letter-spacing:0.1em;
    text-transform:uppercase;
	content: var(--testo-update);
}

/* ==================================================
   SLIDESHOW
   ================================================== */
.slideshow-container {
    width:min(955px,90vw);
    aspect-ratio:955 / 655;
    margin:40px auto 0 auto;
    position:relative;
    overflow:hidden;
}
.slide {
    position:absolute;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:0;
    transition:opacity 2s ease-in-out;
}
.slide.active {
    opacity:1;
}

/* ==================================================
   FRECCE NAVIGAZIONE
   ================================================== */
.arrow {
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    color:white;
    font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-size:40px;
    font-weight:lighter;
    line-height:1;
    cursor:pointer;
    z-index:10;
    opacity:0.3;
    user-select:none;
}
.arrow:hover {
    opacity:1;
}
.arrow.left {
    left:50px;
}
.arrow.right {
    right:50px;
}