/* ==========================================
   PAGINE OPERE
========================================== */

.book-hero{

    padding:140px 0 90px;
    background:linear-gradient(135deg,#17130f 0%,#241b15 100%);
    text-align:center;
    color:#fff;

}

.book-label{

    display:inline-block;
    font-family:'Cormorant Garamond',serif;
    font-size:13px;
    font-weight:600;
    letter-spacing:3px;
    text-transform:uppercase;
    color:#c19a6b;
    margin-bottom:18px;

}

.book-hero h1{

    font-family:'Cormorant Garamond',serif;
    font-size:58px;
    font-weight:600;
    line-height:1.08;
    color:#f4e5b4;
    margin-bottom:20px;

}

.book-subtitle{

    max-width:720px;
    margin:auto;
    font-size:18px;
    line-height:1.75;
    color:rgba(255,255,255,.82);

}



/* ==========================================
   PRESENTAZIONE LIBRO
========================================== */

.book-showcase{

    padding:90px 0;
    background:#ffffff;
    position:relative;

}

.book-showcase::before{

    content:"";

    position:absolute;

    top:0;

    left:50%;

    transform:translateX(-50%);

    width:120px;

    height:2px;

    background:#c19a6b;

}

.book-showcase .container{

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:70px;

}

.book-cover{

    flex:0 0 290px;
    text-align:center;

}

.book-cover img{

    width:100%;
    max-width:280px;
    border-radius:8px;

    transform:perspective(1200px) rotateY(-7deg);

    box-shadow: 0 45px 70px rgba(0,0,0,.18), 12px 0 18px rgba(0,0,0,.12);

    transition:.45s ease;

}

.book-cover img:hover{

        transform: perspective(1200px) rotateY(-2deg) translateY(-12px) scale(1.02);

}

.book-info{

    flex:1;

}

.book-category{

    display:inline-block;
    margin-bottom:14px;
    color:#b08b57;
    font-family:'Cormorant Garamond',serif;
    font-size:13px;
    font-weight:600;
    letter-spacing:2px;
    text-transform:uppercase;

}

.book-info h2{

    font-family:'Cormorant Garamond',serif;
    font-size:44px;
    font-weight:600;
    color:#17130f;
    margin-bottom:22px;

}

.book-info p{

    font-size:16px;
    line-height:1.9;
    color:#555;
    margin-bottom:22px;

}

/* ==========================================
   INFORMAZIONI OPERA
========================================== */

.book-details{

    padding:70px 0;
    background:#f7f5f1;

}

.book-details .container{

    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:36px;

}

.detail-item{

    text-align:center;
    position:relative;

}

.detail-item:not(:last-child)::after{

    content:"";
    position:absolute;
    right:-20px;
    top:50%;
    transform:translateY(-50%);
    width:1px;
    height:55px;
    background:rgba(176,139,87,.25);

}

.detail-item span{

    display:block;
    margin-bottom:12px;
    font-family:'Cormorant Garamond',serif;
    text-transform:uppercase;
    letter-spacing:2px;
    font-size:12px;
    color:#b08b57;
    font-weight:600;

}

.detail-item h3{

    font-family:'Cormorant Garamond',serif;
    font-size:28px;
    font-weight:600;
    color:#17130f;
    line-height:1.5;

}



/* ==========================================
   RECENSIONI
========================================== */

.book-reviews{

    padding:100px 0;
    background:#ffffff;

}

.section-heading{

    text-align:center;
    max-width:750px;
    margin:0 auto 60px;

}

.section-heading span{

    display:inline-block;
    margin-bottom:14px;
    font-family:'Cormorant Garamond',serif;
    font-size:13px;
    font-weight:600;
    letter-spacing:3px;
    color:#b08b57;
    text-transform:uppercase;

}

.section-heading h2{

    font-family:'Cormorant Garamond',serif;
    font-size:48px;
    color:#17130f;
    margin-bottom:18px;

}

.section-heading h2::after{

    content:"";

    display:block;

    width:90px;

    height:2px;

    background:#c19a6b;

    margin:20px auto 0;

}

.review-card{

    max-width:820px;
    margin:32px auto;
    padding:40px;
    background:#f8f6f2;
    border-left:5px solid #c19a6b;
    border-radius:18px;
    box-shadow:0 12px 30px rgba(0,0,0,.05);
    transition:.35s ease;

}

.review-card:hover{

    transform:translateY(-6px);

}

.review-card p{

    font-size:16px;
    line-height:1.9;
    color:#4d4d4d;
    font-style:italic;
    margin-bottom:24px;
    position:relative;

}

.review-card p::before{

    content:"“";
    position:absolute;
    left:-16px;
    top:-24px;
    font-size:75px;
    font-family:'Cormorant Garamond',serif;
    color:#c19a6b;
    opacity:.25;

}

.review-card h4{

    font-family:'Cormorant Garamond',serif;
    font-size:24px;
    color:#17130f;
    font-weight:600;

}

.review-source{

    display:block;

    margin-top:15px;

    font-family:'Cormorant Garamond',serif;

    font-size:13px;

    letter-spacing:1px;

    color:#b08b57;

    text-transform:uppercase;

}

/* ==========================================
   CITAZIONE
========================================== */

.book-quote{

    padding:110px 0;
    background:linear-gradient(135deg,#17130f 0%,#241b15 100%);
    text-align:center;
    overflow:hidden;
    position:relative;

}

.book-quote::before{

    content:"“";
    position:absolute;
    top:-60px;
    left:50%;
    transform:translateX(-50%);
    font-family:'Cormorant Garamond',serif;
    font-size:220px;
    color:rgba(193,154,107,.08);
    line-height:1;

}

.book-quote blockquote{

    max-width:900px;
    margin:auto;
    font-family:'Cormorant Garamond',serif;
    font-size:34px;
    line-height:1.35;
    color:#f4e5b4;
    font-weight:500;
    position:relative;
    z-index:2;

}



/* ==========================================
   NAVIGAZIONE
========================================== */

.book-navigation{

    padding:70px 0;
    background:#ffffff;

}

.book-navigation .container{

    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:24px;

}

.nav-book{

    flex:1;
    padding:22px 28px;
    border:1px solid rgba(193,154,107,.35);
    border-radius:18px;
    text-decoration:none;
    color:#17130f;
    font-family:'Cormorant Garamond',serif;
    font-size:24px;
    font-weight:600;
    transition:.35s ease;
    background:#fff;

}

.nav-book:first-child{

    text-align:left;

}

.nav-book:last-child{

    text-align:right;

}

.nav-book:hover{

    background:#c19a6b;
    color:#ffffff;
    transform:translateY(-6px);
    box-shadow:0 20px 40px rgba(193,154,107,.25);

}



/* ==========================================
   ANIMAZIONI
========================================== */

.book-cover img,
.meta-card,
.review-card,
.nav-book{

    transition:all .35s ease;

}



/* ==========================================
   SELEZIONE TESTO
========================================== */

.book-showcase ::selection,
.book-reviews ::selection{

    background:#c19a6b;
    color:#ffffff;

}

/* ==========================================
   RESPONSIVE
========================================== */


/* ---------- TABLET ---------- */

@media (max-width:992px){

    .book-hero{

        padding:160px 0 100px;

    }

    .book-hero h1{

        font-size:58px;

    }

    .book-subtitle{

        font-size:18px;

    }

    .book-showcase{

        padding:90px 0;

    }

    .book-showcase .container{

        flex-direction:column;
        gap:60px;
        text-align:center;

    }

    .book-cover{

        flex:none;

    }

    .book-cover img{

        max-width:280px;

    }

    .book-info h2{

        font-size:44px;

    }

    .book-info p{

        font-size:17px;

    }

    .book-meta .container{

        grid-template-columns:repeat(2,1fr);

    }

    .section-heading h2{

        font-size:48px;

    }

    .review-card{

        padding:40px;

    }

    .review-card p{

        font-size:17px;

    }

    .book-quote{

        padding:120px 0;

    }

    .book-quote blockquote{

        font-size:44px;

    }

    .book-navigation .container{

        flex-direction:column;

    }

    .nav-book{

        width:100%;
        text-align:center !important;

    }

}



/* ---------- SMARTPHONE ---------- */

@media (max-width:768px){

    .book-hero{

        padding:140px 0 90px;

    }

    .book-label{

        font-size:12px;

        letter-spacing:2px;

    }

    .book-hero h1{

        font-size:44px;

    }

    .book-subtitle{

        font-size:17px;

        line-height:1.8;

    }

    .book-showcase{

        padding:80px 0;

    }

    .book-cover img{

        max-width:230px;

    }

    .book-info h2{

        font-size:36px;

    }

    .book-info p{

        font-size:16px;

        line-height:1.9;

    }

    .book-meta{

        padding:80px 0;

    }

    .book-meta .container{

        grid-template-columns:1fr;

    }

    .meta-card{

        padding:35px 25px;

    }

    .meta-card h3{

        font-size:28px;

    }

    .book-reviews{

        padding:90px 0;

    }

    .section-heading{

        margin-bottom:60px;

    }

    .section-heading h2{

        font-size:38px;

    }

    .review-card{

        padding:35px 28px;

    }

    .review-card p{

        font-size:16px;

        line-height:1.9;

    }

    .review-card p::before{

        font-size:70px;

        left:-12px;

        top:-25px;

    }

    .review-card h4{

        font-size:24px;

    }

    .book-quote{

        padding:90px 0;

    }

    .book-quote::before{

        font-size:180px;

    }

    .book-quote blockquote{

        font-size:30px;

    }

    .book-navigation{

        padding:70px 0;

    }

    .nav-book{

        font-size:22px;

        padding:24px;

    }

}



/* ---------- SMARTPHONE PICCOLI ---------- */

@media (max-width:480px){

    .book-hero h1{

        font-size:36px;

    }

    .book-subtitle{

        font-size:16px;

    }

    .book-info h2{

        font-size:32px;

    }

    .section-heading h2{

        font-size:32px;

    }

    .book-quote blockquote{

        font-size:28px;

        line-height:1.5;

    }

    .nav-book{

        font-size:20px;

    }

}

/* ==========================================
   FRAMMENTI DELL'OPERA
========================================== */

.book-fragments{

    padding:100px 0;

    background:#f7f3eb;

    position:relative;

    overflow:hidden;

}


/* elemento decorativo sullo sfondo */

.book-fragments::before{

    content:"❦";

    position:absolute;

    top:30px;

    left:50%;

    transform:translateX(-50%);

    font-size:90px;

    color:rgba(193,154,107,.10);

    font-family:'Cormorant Garamond',serif;

}



/* intestazione */

.book-fragments .section-heading{

    text-align:center;

    max-width:760px;

    margin:0 auto 65px;

}


.book-fragments .section-heading span{

    display:block;

    font-family:'Cormorant Garamond',serif;

    font-size:13px;

    letter-spacing:4px;

    color:#b08b57;

    margin-bottom:16px;

}


.book-fragments .section-heading h2{

    font-family:'Cormorant Garamond',serif;

    font-size:48px;

    font-weight:500;

    color:#17130f;

    margin-bottom:20px;

}


.book-fragments .section-heading p{

    font-family:'Cormorant Garamond',serif;

    font-size:15px;

    line-height:1.75;

    color:#555;

}



/* singolo frammento */

.fragment{

    max-width:720px;

    margin:0 auto;

    text-align:center;

    padding:42px 24px;

    position:relative;

}



.fragment:not(:last-child)::after{

    content:"";

    position:absolute;

    bottom:0;

    left:50%;

    transform:translateX(-50%);

    width:75px;

    height:1px;

    background:rgba(176,139,87,.35);

}



/* simbolo decorativo */

.fragment-symbol{

    font-family:'Cormorant Garamond',serif;

    font-size:32px;

    color:#c19a6b;

    margin-bottom:22px;

}



/* testo poesia */

.fragment blockquote{

    margin:0;

    font-family:'Cormorant Garamond',serif;

    font-size:28px;

    line-height:1.65;

    font-style:italic;

    font-weight:400;

    color:#211b16;

}



/* primo e ultimo frammento leggermente diversi */

.fragment:first-of-type blockquote{

    font-size:32px;

}


.fragment:last-of-type blockquote{

    font-size:30px;

}



/* effetto elegante al passaggio */

.fragment{

    transition:.5s ease;

}


.fragment:hover{

    transform:translateY(-8px);

}


.fragment:hover .fragment-symbol{

    transform:scale(1.15);

}


.fragment-symbol{

    transition:.4s ease;

}

/* ==========================================
VERSI SCELTI
========================================== */

.book-preview{

    max-width:950px;
    margin:70px auto 0;
    text-align:center;

}

.book-preview img{

    width:100%;
    display:block;

    border-radius:12px;

    border:1px solid rgba(0,0,0,.08);

    box-shadow:0 20px 50px rgba(0,0,0,.18);

    transition:.35s ease;

}

.book-preview img:hover{

    transform:scale(1.02);

    box-shadow:0 28px 70px rgba(0,0,0,.22);

}

/* ==========================================
IL SEGRETO DI BARHUME
========================================== */

/* Hero libro */

.book-grid{

    display:flex;
    align-items:center;
    justify-content:center;
    gap:80px;
    flex-wrap:wrap;

}

.book-cover{

    flex:0 0 340px;

}

.book-cover img{

    width:100%;
    display:block;

    border-radius:12px;

    box-shadow:0 25px 60px rgba(0,0,0,.18);

}

.book-info{

    flex:1;
    min-width:320px;
    max-width:650px;

}

.book-category{

    display:inline-block;

    letter-spacing:3px;

    text-transform:uppercase;

    font-size:13px;

    color:#8d6b32;

    font-weight:600;

    margin-bottom:18px;

}

.book-info h1{

    font-family:"Cormorant Garamond",serif;

    font-size:68px;

    font-weight:600;

    line-height:1.05;

    margin-bottom:15px;

    color:#8d6b32;

}

.book-info h1 span{

    display:block;

    font-size:82px;

    color:inherit;

}

.book-subtitle{

    font-size:22px;

    color:#555;

    font-style:italic;

    margin-bottom:28px;

}

.book-divider{

    width:90px;
    height:2px;

    background:#b89b5e;

    margin-bottom:30px;

}

.book-info p{

    font-size:18px;

    line-height:1.9;

    color:#555;

}

/* Sinossi */

.book-description{

    padding:120px 0;

}

.container-small{

    max-width:900px;

    margin:auto;

}

.book-description p{

    font-size:19px;

    line-height:2;

    color:#444;

    margin-bottom:28px;

    text-align:justify;

}

/* Responsive */

@media(max-width:900px){

    .book-grid{

        gap:50px;

        text-align:center;

    }

    .book-cover{

        flex:0 0 260px;

    }

    .book-info h1{

        font-size:52px;

    }

    .book-divider{

        margin:25px auto;

    }

}

/*==========================================
LETTURA CRITICA
==========================================*/

.book-review{

    padding:120px 0;

    background:#faf8f3;

}

.review-box{

    background:#fff;

    padding:60px;

    border-radius:14px;

    box-shadow:0 20px 50px rgba(0,0,0,.08);

}

.review-box p{

    font-size:18px;

    line-height:2;

    color:#444;

    text-align:justify;

    margin-bottom:25px;

}



/*==========================================
INFO EDITORIALI
==========================================*/

.book-details{

    padding:120px 0;

}

.details-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));

    gap:35px;

    margin-top:60px;

}

.details-grid div{

    background:#fff;

    padding:35px;

    border-radius:12px;

    box-shadow:0 15px 35px rgba(0,0,0,.08);

    text-align:center;

}

.details-grid h3{

    margin-bottom:15px;

    font-family:"Cormorant Garamond",serif;

    font-size:28px;

}

.details-grid p{

    color:#666;

    line-height:1.8;

}

/* ==========================================
   IL CANTO DELL'AMORE
========================================== */


/* ==========================================
   HERO
========================================== */

.book-hero{

    background:#171717;

    color:#ffffff;

}

.book-hero h1{

    color:#8d6b32;

}

.book-subtitle{

    color:#d5d5d5;

}

.book-label{

    color:#b9975b;

}



/* ==========================================
   FRAMMENTI DELL'OPERA
========================================== */

.book-fragments{

    padding:120px 0;

    background:#f7f4ee;

}

.book-fragments .section-heading{

    max-width:850px;

    margin:0 auto 60px;

    text-align:center;

}

.book-fragments .section-heading span{

    display:block;

    margin-bottom:18px;

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

    font-size:11px;

    font-weight:600;

    letter-spacing:3px;

    color:#8d6b32;

}

.book-fragments .section-heading h2{

    margin-bottom:20px;

    font-family:"Cormorant Garamond", serif;

    font-size:52px;

    font-weight:600;

    color:#222;

}

.book-fragments .section-heading p{

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

    font-size:16px;

    line-height:1.8;

    color:#666;

}

.book-preview{

    max-width:1100px;

    margin:0 auto;

    text-align:center;

}

.book-preview a{

    display:block;

}

.book-preview img{

    width:100%;

    max-width:1100px;

    height:auto;

    display:block;

    margin:0 auto;

    box-shadow:0 25px 55px rgba(0,0,0,.18);

    transition:transform .4s ease,
                box-shadow .4s ease;

}

.book-preview img:hover{

    transform:translateY(-4px);

    box-shadow:0 30px 65px rgba(0,0,0,.22);

}

/* ==========================================
   IL CANTO DELL'AMORE
   TESTO INTORNO ALLA COPERTINA
========================================== */

.canto-amore-showcase .container{

    display:block;

}


/* COPERTINA */

.canto-amore-showcase .book-cover{

    float:left;

    width:330px;

    margin:0 65px 30px 0;

    text-align:center;

}

.canto-amore-showcase .book-cover img{

    width:100%;

    max-width:330px;

    display:block;

    margin:0;

}


/* TESTO */

.canto-amore-showcase .book-info{

    max-width:none;

}

.canto-amore-showcase .book-info h2{

    margin-top:0;

}


/* PULIZIA DEL FLOAT */

.canto-amore-showcase .container::after{

    content:"";

    display:table;

    clear:both;

}

/* ==========================================
   COPERTINA CIRCONDATA DAL TESTO
   PAGINA: il-ritorno.html
========================================== */


.il-ritorno-cover{

    float:left;

    width:280px;

    margin:0 45px 25px 0;

}



.book-introduction .book-info{

    max-width:100%;

}



.book-introduction .book-info::after{

    content:"";

    display:block;

    clear:both;

}

/* ==========================================
   COPERTINA CIRCONDATA DAL TESTO
   PAGINA: quando-cade-la-maschera.html
========================================== */


.quando-maschera-cover{

    float:left;

    width:280px;

    margin:0 45px 25px 0;

}



.book-introduction .book-info{

    max-width:100%;

}



.book-introduction .book-info::after{

    content:"";

    display:block;

    clear:both;

}

/* ==========================================
   COPERTINA CIRCONDATA DAL TESTO
   PAGINA: aquila-magica.html
========================================== */


.aquila-magica-cover{

    float:left;

    width:280px;

    margin:0 45px 25px 0;

}



.book-introduction .book-info{

    max-width:100%;

}



.book-introduction .book-info::after{

    content:"";

    display:block;

    clear:both;

}

/* ==========================================
   COPERTINA CIRCONDATA DAL TESTO
   PAGINA: il-segreto-di-barhume-arabo.html
========================================== */


.barhume-arabo-cover{

    float:left;

    width:280px;

    margin:0 45px 25px 0;

}



.book-introduction .book-info{

    max-width:100%;

}



.book-introduction .book-info::after{

    content:"";

    display:block;

    clear:both;

}