/* =========================
   RESET GENERALE
========================= */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}


html{
    scroll-behavior:smooth;
}

:root{
    --font-primary:'Cormorant Garamond', serif;
    --font-secondary:'Cormorant Garamond', serif;
    --color-text:#1b1b1b;
    --color-text-soft:#555;
    --color-muted:#666;
    --color-accent:#8b6b3e;
    --color-accent-strong:#b08b57;
    --color-title:#1d1d1d;
    --page-title-size:58px;
    --section-title-size:42px;
    --section-subtitle-size:24px;
    --body-size:17px;
    --body-size-small:15px;
    --label-size:12px;
    --section-spacing:72px;
    --section-spacing-small:56px;
    --block-spacing:32px;
    --heading-spacing:22px;
    --text-spacing:18px;
}

body{

    font-family:var(--font-primary);

    background:#f8f5ef;

    color:var(--color-text);

    line-height:1.65;

}

body,
button,
input,
textarea,
select,
h1,
h2,
h3,
h4,
h5,
h6,
p,
span,
a,
li {
    font-family:var(--font-primary);
}


img{

    max-width:100%;

    display:block;

}


a{

    text-decoration:none;

    color:inherit;

}


ul{

    list-style:none;

}


/* =========================
   CONTAINER
========================= */


.container{

    width:88%;

    max-width:1000px;

    margin:0 auto;
}



/* =========================
   TITOLI
========================= */


h1,
h2,
h3{

    font-family:var(--font-primary);

    font-weight:500;

    line-height:1.1;

    color:var(--color-title);

}

p{
    font-size:var(--body-size);
    color:var(--color-text-soft);
    line-height:1.75;
}



/* =========================
   BUTTON
========================= */


.btn{

    display:inline-block;

    padding:14px 32px;

    font-size:14px;

    letter-spacing:1px;

    transition:.3s ease;

}


.btn-primary{

    background:#8b6b3e;

    color:white;

}


.btn-primary:hover{

    background:#6f522e;

}



.btn-secondary{

    border:1px solid #8b6b3e;

    color:#8b6b3e;

}


.btn-secondary:hover{

    background:#8b6b3e;

    color:white;

}

.btn-books{

    border-radius:2px;

    box-shadow:0 18px 40px rgba(139,107,62,.18);

    padding:16px 42px;

    letter-spacing:1.4px;

    text-transform:uppercase;

    font-weight:700;

    transition:transform .3s ease, box-shadow .3s ease, background .3s ease;

}

.btn-books:hover{

    transform:translateY(-2px);

    box-shadow:0 22px 45px rgba(139,107,62,.24);

}

.books-button{

    margin-top:28px;

    text-align:center;

}

.books-button .btn span{

    display:inline-block;

    transition:transform .3s ease;

}

.books-button .btn:hover span{

    transform:translateX(4px);

}

/* =========================
   SEZIONI
========================= */


section{

    padding:var(--section-spacing) 0;
    
}

/* =========================
   ANIMATIONS
========================= */

.hidden {

    opacity: 0;
    
    transform: translateY(40px);

    transition:
        opacity .4s ease,
        transform .4s ease;
}

.show {
    
    opacity: 1;
    
    transform: translateY(0);
}

img{

transition:.5s ease;

}


.gallery-item img:hover,
.book-card img:hover{

transform:scale(1.05);

}body{

opacity:1;

transition:opacity .5s ease;

}

/* =========================
   SECTION TITLES
========================= */

.section-title{

    text-align:center;

    margin-bottom:var(--block-spacing);

}

.section-title span,
.page-subtitle,
.section-label,
.section-subtitle,
.gallery-label,
.contact-page-label{

    display:block;

    color:var(--color-accent);

    font-size:var(--label-size);

    letter-spacing:4px;

    text-transform:uppercase;

    margin-bottom:12px;

}

.section-title h2{

    font-size:var(--section-title-size);

    margin-bottom:14px;

}

.section-title p{

    max-width:700px;

    margin:auto;

    color:var(--color-muted);

    font-size:var(--body-size);

    line-height:1.8;

}

/* =====================================
   SECTION TITLES
===================================== */

.section-title{

    text-align:center;

    margin-bottom:var(--block-spacing);

}

.section-title span{

    display:inline-block;

    color:var(--color-accent);

    font-size:var(--label-size);

    letter-spacing:4px;

    text-transform:uppercase;

    margin-bottom:12px;

}

.section-title h2{

    font-family:'Cormorant Garamond', serif;

    font-size:56px;

    font-weight:600;

    color:#1f1f1f;

    margin-bottom:14px;

}

.section-title p{

    max-width:700px;

    margin:auto;

    color:#666;

    line-height:1.8;

    font-size:17px;

}