.poem{
    position: absolute;
          /* adjust until text is on the paper */
    left: 50%;
    top: 300px;
    font-family: "Cormorant Garamond", Georgia, 'Times New Roman', Times, serif;
    transform: translateX(-50%);

    text-align: center;
    font-weight: 500;
    font-style: italic;
    font-size:24px;
    line-height:1.35;
    letter-spacing:0.01em;
    color:#3A2E20;
}
.poem p{
    margin: 0 0 0.35em;
}
.author{
    position:absolute;
    top:65%;
    left:15%;
    transform:translate(-50%, -50%);
    max-width: 300px;
    background:var(--parchment);
    border-radius:14px;
    border:1px solid rgba(198,162,76,0.35);
    box-shadow:0 15px 35px rgba(36,48,64,0.22);
    padding:24px 20px 28px;

    color:var(--ink);
    text-align:center;

}
.author h1{
    font-size:22px;
    margin:0 0 20px;
}
.une{
    margin: 5px;
    font-family:"Cormorant Garamond", Georgia, serif;
    font-size:17px;
    line-height:1.6;
    color:var(--ink);
}
.fotoja{
    width: 300px;
    height: 225px;
    border-radius:6px;
    box-shadow:0 8px 20px rgba(36,48,64,0.2);
}
.poemfull{
   position: relative;
    width: fit-content;
    margin: 10px auto 0;
    padding-top: 100px;

}
.scroll{
   display: block;
    width: 700px;
    bottom: 120px;
    height: 1200px;
}

/* ===== MOBILE / TABLET =====
   .poem is positioned in exact pixels on top of the scroll image, so on
   smaller screens we scale the whole .poemfull group (scroll + text)
   together with `zoom`. That keeps the poem perfectly aligned on the
   parchment at every size, instead of drifting off it.
   The author section then just drops into normal flow underneath, same
   order as in the HTML.
*/
@media(max-width:900px){
    .poemfull{
        zoom:0.62;
    }
}

@media(max-width:600px){
    .poemfull{
        zoom:0.46;
    }
    .author{
        position:static;
        top:auto;
        left:auto;
        transform:none;
        max-width:88%;
        width:88%;
        margin:20px auto 40px;
    }
}

@media(max-width:400px){
    .poemfull{
        zoom:0.35;
    }
    .poem{
        font-size: 24px;
    }
}