/* =========================================================
   Jean Marc Lange — jeanmarclange.com (WIDE Edizioni)
   Une double page = une page web, en plein écran, fond blanc,
   sans ombre ni pli. Navigation : liens précédent / suivant,
   flèches du clavier, glissement du doigt sur mobile.
   L'unité --u remplace le cqw de la maquette 1 : elle garde
   les proportions de la typographie quelle que soit la taille d'écran.
   ========================================================= */

@font-face { font-family: "Cormorant"; src: url(../fonts/cormorant-garamond-latin-400-normal.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Cormorant"; src: url(../fonts/cormorant-garamond-latin-400-italic.woff2) format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Cormorant"; src: url(../fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Cormorant"; src: url(../fonts/cormorant-garamond-latin-500-italic.woff2) format("woff2"); font-weight: 500; font-style: italic; font-display: swap; }

:root {
    --carta: #ffffff;
    --fondo: #ffffff;
    --encre: #1d1c1a;
    --seconda: #5a5650;    /* contraste ≈ 7:1 sur blanc */
    --sottile: #8d8780;    /* petits libellés en capitales uniquement */
    --serif: "Cormorant", "Cormorant Garamond", Garamond, "Times New Roman", serif;
    --sans: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
    margin: 0; background: var(--fondo); color: var(--encre);
    font: 500 1.15rem/1.6 var(--serif);
    font-kerning: normal; font-variant-ligatures: common-ligatures;
    -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-underline-offset: .2em; text-decoration-thickness: 1px; }
a:focus-visible { outline: 1px solid var(--encre); outline-offset: 3px; }
h1, h2 { font-weight: 400; margin: 0; }

/* Petits libellés : capitales espacées */
.num, .editore, .periodo, .testatina, .folio, figcaption .d, .copy {
    font: 400 .66rem/1.4 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--sottile);
}

/* =========================================================
   1. LECTURE VERTICALE (mobile, tablette portrait) — par défaut
   ========================================================= */
.spread { display: block; }
.pagina { position: relative; padding: 4.5rem 1.5rem; }
.spread + .spread { border-top: 1px solid #ece9e4; }
.testatina, .folio { display: none; }

.frontespizio { min-height: 70svh; display: flex; flex-direction: column; justify-content: center; text-align: center; }
.frontespizio h1 { font-size: clamp(2.6rem, 11vw, 4rem); line-height: 1; letter-spacing: .01em; margin: 2.5rem 0 1rem; }
.sottotitolo { font-style: italic; font-size: 1.6rem; margin: 0 0 2.5rem; color: var(--seconda); }

.capitolo { max-width: 34rem; margin: 0 auto; }
.capitolo h2 { font-style: italic; font-size: 2.2rem; line-height: 1.08; margin: .9rem 0 1.6rem; }
.capitolo p:not(.num) { margin: 0 0 1em; hyphens: auto; -webkit-hyphens: auto; }
.capitolo h2 + p::first-letter { font-size: 3.6em; float: left; line-height: .82; margin: .06em .08em 0 0; font-weight: 400; }

.tavola { margin: 0; }
.tavola img { margin: 0 auto; max-height: 82svh; width: auto; }
figcaption { margin-top: 1.1rem; text-align: center; display: flex; flex-direction: column; gap: .15rem; }
figcaption .t { font-style: italic; font-size: 1.15rem; }
figcaption .tr { font-size: .95rem; color: var(--seconda); }
figcaption .d { margin-top: .35rem; letter-spacing: .14em; }

.pagina--ritratto { padding: 0; }
.ritratto { margin: 0; }
.ritratto img { width: 100%; }

.sezione { text-align: center; padding: 3rem 0; }
.sezione h2 { font-style: italic; font-size: 3rem; margin-bottom: 1rem; }

.colophon { max-width: 30rem; margin: 0 auto; font-size: 1rem; color: var(--seconda); }
.colophon p:not(.num):not(.copy) { margin: 0 0 1em; }
.colophon .num { margin-bottom: 1.5rem; }
.copy { margin-top: 2.5rem; letter-spacing: .12em; text-transform: none; }
.copy a { text-decoration: none; }

.pagina--vuota { display: none; }
.spread--doppia { padding: 4rem 1.5rem; }


/* Sommaire, listes (chronologie, sources), note de légende */
.indice ol { list-style: none; margin: 1.6rem 0 0; padding: 0; }
.indice li a { display: grid; grid-template-columns: 2.6rem 1fr auto; align-items: baseline; gap: .6rem; padding: .42rem 0; text-decoration: none; border-bottom: 1px solid #efece7; }
.indice li a:hover .it { text-decoration: underline; }
.indice .iv { font-style: italic; color: var(--sottile); }
.indice .ip { font: 400 .66rem/1 var(--sans); letter-spacing: .14em; color: var(--sottile); font-variant-numeric: tabular-nums; }
.lista h2 { font-style: italic; }
.lista h2 + p::first-letter { float: none; font-size: inherit; line-height: inherit; margin: 0; }
.lista .intro { font-size: .95rem; color: var(--seconda); margin: -.6rem 0 1.2rem; }
.lista dl { display: grid; grid-template-columns: 5.2rem 1fr; gap: .5rem 1rem; margin: 0; font-size: 1rem; line-height: 1.45; }
.lista dt { font: 400 .66rem/1.9 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--sottile); }
.lista dd { margin: 0; }
.lista dd a { text-decoration-color: #c9c4bc; }
figcaption .n { font-size: .9rem; font-style: italic; color: var(--sottile); }
.sezione .sotto { max-width: 26rem; margin: 0 auto; font-style: italic; color: var(--seconda); }

/* =========================================================
   2. LIVRE OUVERT (écran large et horizontal)
   Unités cqw = % de la largeur de la double page :
   toute la typographie garde les proportions d'un livre imprimé.
   ========================================================= */
@media (min-width: 960px) and (min-aspect-ratio: 5/4) {
    :root { --u: min(1vw, 1.6svh); }   /* 1 % de la largeur d'une double page 8:5 inscrite dans l'écran */
    html, body { height: 100%; overflow: hidden; }

    .spread, .spread + .spread {
        width: 100vw; height: 100svh;
        display: grid; grid-template-columns: 1fr 1fr;
        position: relative; background: var(--carta); border: 0;
    }

    /* Marges de livre : petit fond, grand pied, marge extérieure > intérieure */
    .pagina { display: flex; flex-direction: column; min-height: 0; padding: calc(5 * var(--u)) calc(5.5 * var(--u)) calc(6 * var(--u)) calc(3.8 * var(--u)); }
    .pagina--sx { padding: calc(5 * var(--u)) calc(3.8 * var(--u)) calc(6 * var(--u)) calc(5.5 * var(--u)); }
    .pagina--vuota { display: block; }

    .testatina, .folio { display: block; position: absolute; margin: 0; font-size: max(9px, calc(.56 * var(--u))); letter-spacing: .26em; }
    .testatina { top: calc(2.4 * var(--u)); }
    .folio { bottom: calc(2.6 * var(--u)); letter-spacing: .1em; }
    .pagina--sx .testatina, .pagina--sx .folio { left: calc(5.5 * var(--u)); }
    .pagina--dx .testatina, .pagina--dx .folio { right: calc(5.5 * var(--u)); }

    .num, .editore, .periodo, figcaption .d, .copy { font-size: max(9px, calc(.6 * var(--u))); }

    /* Frontispice */
    .frontespizio { min-height: 0; height: 100%; justify-content: flex-start; text-align: left; padding-top: calc(7 * var(--u)); }
    .frontespizio h1 { font-size: calc(4.4 * var(--u)); margin: auto 0 calc(1.2 * var(--u)); line-height: .95; }
    .sottotitolo { font-size: calc(2 * var(--u)); margin: 0 0 calc(1.6 * var(--u)); }
    .frontespizio .periodo { margin: 0 0 calc(3 * var(--u)); }

    /* Page de texte : ouverture de chapitre abaissée, comme en imprimerie */
    .capitolo { max-width: calc(31 * var(--u)); margin: 0; padding-top: calc(8 * var(--u)); font-size: clamp(13px, calc(1.24 * var(--u)), 22px); line-height: 1.56; }
    .capitolo .num { font: italic 400 calc(1.7 * var(--u))/1 var(--serif); letter-spacing: 0; text-transform: none; color: var(--sottile); }
    .capitolo h2 { font-size: calc(2.9 * var(--u)); margin: calc(1.2 * var(--u)) 0 calc(2.4 * var(--u)); }
    .capitolo h2 + p::first-letter { font-size: 3.15em; line-height: .8; }
    .pagina--dx .capitolo { margin-left: auto; margin-right: calc(1 * var(--u)); }
    .pagina--sx .capitolo { margin-left: calc(1 * var(--u)); }

    /* Œuvre : entière, centrée dans la page, légende en pied */
    .tavola { flex: 1; min-height: 0; display: flex; flex-direction: column; }
    .cornice { flex: 1; min-height: 0; position: relative; }
    .tavola img { position: absolute; inset: 0; width: 100%; height: 100%; max-height: none; object-fit: contain; }
    figcaption { margin-top: calc(1.4 * var(--u)); gap: calc(.1 * var(--u)); }
    figcaption .t { font-size: max(13px, calc(.98 * var(--u))); }
    figcaption .tr { font-size: max(11px, calc(.8 * var(--u))); }
    figcaption .d { margin-top: calc(.3 * var(--u)); }

    /* Portrait : pleine page, à fond perdu */
    .pagina--ritratto { padding: 0; position: relative; overflow: hidden; }
    .ritratto, .ritratto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 38% center; }

    /* Intertitre de section */
    .sezione { margin: auto 0; padding: 0; }
    .sezione h2 { font-size: calc(4 * var(--u)); margin-bottom: calc(1.2 * var(--u)); }

    /* Colophon en pied de page, comme une page d'achevé d'imprimer */
    .colophon { margin: auto 0 0; max-width: calc(30 * var(--u)); font-size: max(12px, calc(.86 * var(--u))); line-height: 1.55; }
    .colophon .num { margin-bottom: calc(1.4 * var(--u)); }
    .copy { margin-top: calc(2 * var(--u)); }


    /* Sommaire et listes : texte plus petit, la page reste celle d'un livre */
    .indice { padding-top: calc(5 * var(--u)); }
    .indice ol { margin-top: calc(1.6 * var(--u)); }
    .indice li a { grid-template-columns: calc(3 * var(--u)) 1fr auto; padding: calc(.42 * var(--u)) 0; }
    .indice .ip { font-size: max(9px, calc(.6 * var(--u))); }
    .lista { padding-top: calc(5 * var(--u)); max-width: calc(34 * var(--u)); font-size: clamp(11px, calc(.92 * var(--u)), 17px); }
    .lista h2 { font-size: calc(2.4 * var(--u)); margin: 0 0 calc(1.6 * var(--u)); }
    .lista .intro { font-size: inherit; margin: calc(-.6 * var(--u)) 0 calc(1.2 * var(--u)); }
    .lista dl { grid-template-columns: calc(7.4 * var(--u)) 1fr; gap: calc(.45 * var(--u)) calc(1 * var(--u)); font-size: inherit; line-height: 1.42; }
    .lista dt { font-size: max(9px, calc(.56 * var(--u))); line-height: 2.1; }
    .pagina--dx .lista { margin-left: auto; margin-right: calc(1 * var(--u)); }
    .pagina--dx .lista:not(:has(h2)) { padding-top: calc(5 * var(--u) + 2.4 * var(--u) * 1.15 + 1.6 * var(--u)); }
    figcaption .n { font-size: max(11px, calc(.74 * var(--u))); }
    .sezione .sotto { font-size: calc(1.15 * var(--u)); max-width: calc(26 * var(--u)); margin: 0 auto; }

    /* Œuvre sur double page */
    .spread--doppia { display: flex; padding: calc(3.6 * var(--u)) calc(7 * var(--u)) calc(5.6 * var(--u)); }
}

@media print {
    body { background: #fff; padding: 0; }
    .spread { break-after: page; box-shadow: none; }
}

/* =========================================================
   3. NAVIGATION (une double page par page web)
   ========================================================= */
.sfoglia {
    display: flex; justify-content: center; align-items: center; gap: 2.2rem;
    padding: 2.5rem 1.5rem 3rem;
    font: 400 .68rem/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--sottile);
}
.sfoglia a { text-decoration: none; color: var(--encre); padding: .8rem .4rem; }
.sfoglia a:hover { color: var(--seconda); }
.sfoglia .off { visibility: hidden; }
.sfoglia .pos { letter-spacing: .14em; font-variant-numeric: tabular-nums; }

@media (min-width: 960px) and (min-aspect-ratio: 5/4) {
    .sfoglia {
        position: fixed; left: 50%; bottom: calc(1.6 * var(--u)); transform: translateX(-50%);
        padding: .15rem calc(1 * var(--u)); gap: calc(2.2 * var(--u)); font-size: max(9px, calc(.6 * var(--u)));
        background: var(--carta); z-index: 2;   /* reste lisible au-dessus d'une image à fond perdu */
    }
    .sfoglia a { padding: .6rem .5rem; }
    /* Bords gauche / droit de l'écran (7 %) : un clic tourne la page, comme on saisit le coin d'un livre */
    .zona { position: fixed; top: 0; bottom: 0; width: 7vw; z-index: 1; }
    .zona--prev { left: 0; cursor: w-resize; }
    .zona--next { right: 0; cursor: e-resize; }
}
@media not ((min-width: 960px) and (min-aspect-ratio: 5/4)) { .zona { display: none; } }

/* =========================================================
   4. ACCUEIL : une œuvre plein écran + un cartouche blanc
   ========================================================= */
.home { position: fixed; inset: 0; background: var(--carta); }
.home picture, .home img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; }
.cartiglio {
    position: absolute; right: clamp(1rem, 4vw, 4.5rem); bottom: clamp(1rem, 5vh, 4.5rem);   /* à droite : ne cache pas la signature */
    background: var(--carta); padding: clamp(1.4rem, 2.6vw, 2.6rem) clamp(1.6rem, 3vw, 3.2rem);
    max-width: calc(100vw - 2rem);
}
.cartiglio h1 { font-size: clamp(2rem, 3.6vw, 3.6rem); line-height: 1; letter-spacing: .01em; }
.cartiglio .sottotitolo { font-size: clamp(1.15rem, 1.6vw, 1.6rem); margin: .5rem 0 1.6rem; }
.entra {
    display: inline-block; text-decoration: none; padding: .35rem 0;
    font: 400 .7rem/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--encre);
    border-bottom: 1px solid currentColor;
}
.entra:hover { color: var(--seconda); }
.credito { margin: 1.4rem 0 0; font: italic 400 .85rem/1.3 var(--serif); color: var(--sottile); }
.cr-v { display: none; }
@media (orientation: portrait) {
    .cr-o { display: none; } .cr-v { display: inline; }
    /* Écran vertical (téléphone, tablette) : le texte en haut, l'œuvre entière sur toute la largeur,
       le titre de l'œuvre dessous (le cartouche « s'ouvre » pour que ses éléments se placent autour de l'image) */
    .home { position: static; display: flex; flex-direction: column; }
    .cartiglio { display: contents; }
    .cartiglio > * { margin-left: 1.5rem; margin-right: 1.5rem; }
    .cartiglio h1 { margin-top: 1.8rem; }
    .home .cartiglio .sottotitolo { margin: .5rem 1.5rem 1.1rem; }
    .entra { align-self: flex-start; }
    .home .cartiglio .lingue { margin: 1rem 1.5rem 1.6rem 1.05rem; }
    .home picture { order: 1; }
    .home picture, .home img { position: static; width: 100%; height: auto; object-fit: initial; }
    .credito { order: 2; margin-top: .8rem; margin-bottom: 2rem; }
}

/* Accueil, écran horizontal (ordinateur, tablette couchée) :
   l'œuvre à gauche (50 %), aplat blanc à droite (50 %) avec le texte noir aligné à gauche */
.premio { display: none; }
@media (orientation: landscape) {
    .home picture { left: 0; right: auto; width: 50%; }   /* l'œuvre à gauche (50 %), aplat blanc à droite (50 %) */
    .home img { position: absolute; inset: 0; width: 100%; height: 100%; }
    .cartiglio {
        left: calc(50vw + clamp(2rem, 6vw, 7rem)); right: auto; top: 0; bottom: 0;   /* texte dans l'aplat blanc, aligné à gauche, centré verticalement */
        display: flex; flex-direction: column; justify-content: center; align-items: flex-start; text-align: left;
        z-index: 1; background: none; padding: 0; max-width: calc(50vw - 2 * clamp(2rem, 6vw, 7rem)); color: var(--encre);
    }
    .premio {
        display: block; margin: 0 0 clamp(1rem, 2.2vh, 1.8rem);
        font: 400 clamp(.62rem, .8vw, .78rem)/1.4 var(--sans); letter-spacing: .3em; text-transform: uppercase; color: var(--seconda);
    }
    .cartiglio h1 { font-size: clamp(3rem, 7.4vw, 8.5rem); line-height: .92; letter-spacing: -.01em; font-weight: 400; }
    .cartiglio .sottotitolo { font-size: clamp(1.4rem, 2.6vw, 2.8rem); color: var(--seconda); margin: clamp(.6rem, 1.2vh, 1rem) 0 clamp(2rem, 5vh, 3.5rem); }
    .entra { color: var(--encre); font-size: clamp(.68rem, .82vw, .8rem); padding: .5rem 0; }
    .entra:hover { color: var(--seconda); }
    .credito { margin: clamp(1rem, 2.5vh, 1.8rem) 0 0; color: var(--seconda); }   /* simple texte, sous le choix de langue */
}

/* ---------- Sélecteur de langue ---------- */
.lingue { list-style: none; margin: 0; padding: 0; display: flex; gap: .2rem; }
.lingue a {
    display: block; padding: .5rem .45rem; text-decoration: none;
    font: 400 .64rem/1 var(--sans); letter-spacing: .18em; color: var(--sottile);
}
.lingue a:hover { color: var(--encre); }
.lingue a[aria-current] { color: var(--encre); text-decoration: underline; text-underline-offset: .35em; }

.sfoglia .lingue { margin-left: 1.2rem; padding-left: 1.2rem; border-left: 1px solid #e3dfd9; }
.sfoglia .lingue a { padding: .8rem .35rem; font-size: inherit; letter-spacing: .16em; }
@media (min-width: 960px) and (min-aspect-ratio: 5/4) { .sfoglia .lingue a { padding: .6rem .3rem; } }
.cartiglio .lingue { margin-top: 1.2rem; margin-left: -.45rem; }
@media (orientation: landscape) {
    .cartiglio .lingue { margin-top: clamp(1.4rem, 3vh, 2.2rem); margin-left: -.45rem; }
    .cartiglio .lingue a { color: var(--seconda); }
    .cartiglio .lingue a:hover, .cartiglio .lingue a[aria-current] { color: var(--encre); }
}
@media (max-width: 520px) { .sfoglia { gap: 1rem; flex-wrap: wrap; } .sfoglia .lingue { margin: .4rem 0 0; padding: 0; border: 0; width: 100%; justify-content: center; } }

/* Titre lisible par les moteurs et lecteurs d'écran, invisible à l'écran */
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Page 404 */
.introvabile { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 2rem; }
.introvabile h1 { font-style: italic; font-size: clamp(2.4rem, 6vw, 4.5rem); margin: 1rem 0 2rem; }

/* =========================================================
   5. NOUVELLES PAGES (octobre 2026) : accueil, catalogue, archives, signalement
   Capitales condensées d'après la couverture du catalogue « Chaleur & Obsession ».
   ========================================================= */
/* Titre de l'accueil : Antonio (SIL Open Font License, fonts/antonio-OFL.txt) */
@font-face { font-family: "Antonio"; src: url(../fonts/antonio-latin-200-normal.woff2) format("woff2"); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: "Antonio"; src: url(../fonts/antonio-latin-400-normal.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow Condensed"; src: url(../fonts/barlow-condensed-latin-600-normal.woff2) format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow Condensed"; src: url(../fonts/barlow-condensed-latin-800-normal.woff2) format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
:root {
    --cond: "Barlow Condensed", "DIN Condensed", "Arial Narrow", sans-serif;
    --ocra: #9a4a22;      /* terre cuite des tableaux, contraste ≈ 6,6:1 sur blanc */
    --filo: #e4e0da;
    --pad: clamp(1.2rem, 4vw, 3rem);
}
.mono { display: block; height: auto; }

/* ---------- 5.1 Accueil : porte d'entrée du livre — deux détails, une diagonale blanche, un carré blanc ---------- */
html:has(.copertina), body:has(.copertina) { height: auto !important; overflow: auto !important; }
.copertina {
    /* Écran horizontal : 4 détails, deux bandes blanches qui se croisent en C (sous le carré blanc).
       Diagonale D : du bord gauche à --yl au bord droit à --yr. Bande V : du haut à --xt au bas à --xb.
       --cx / --cy : croisement de D et V (à recalculer si l'on change ces quatre valeurs :
       cy = (yl + a·xt) / (1 − a·b), cx = xt + b·cy, avec a = (yr − yl)/100 et b = (xb − xt)/100). */
    --g: clamp(12px, 1.9vmin, 24px);      /* demi-épaisseur de la bande diagonale — bandes larges, assumées (V4) */
    --gv: calc(var(--g) * .56);           /* demi-épaisseur (horizontale) de la bande V : un peu plus fine que la diagonale
                                           (.86 = même épaisseur visuelle ; .56 ≈ deux tiers) */
    --yl: 66%; --yr: 38%; --xt: 53%; --xb: 47%;   /* V4 : diagonale douce, croisement proche du centre */
    --cx: 49.88%; --cy: 52.03%;
    position: relative; min-height: 100svh; overflow: hidden; background: #fff;
}
.cop-porta { position: relative; display: grid; place-items: center; min-height: 100svh; padding: 4rem 1rem; box-sizing: border-box; color: var(--encre); text-decoration: none; cursor: pointer; }
.cop-porta:focus { outline: none; }
.cop-img { position: absolute; inset: 0; }
.cop-img img { position: absolute; max-width: none; object-fit: cover; }
.cop-img--a { clip-path: polygon(0 0, calc(var(--xt) - var(--gv)) 0, calc(var(--cx) - var(--gv)) var(--cy), var(--cx) calc(var(--cy) - var(--g)), 0 calc(var(--yl) - var(--g))); }
.cop-img--c { clip-path: polygon(calc(var(--xt) + var(--gv)) 0, 100% 0, 100% calc(var(--yr) - var(--g)), var(--cx) calc(var(--cy) - var(--g)), calc(var(--cx) + var(--gv)) var(--cy)); }
.cop-img--d { clip-path: polygon(0 calc(var(--yl) + var(--g)), var(--cx) calc(var(--cy) + var(--g)), calc(var(--cx) - var(--gv)) var(--cy), calc(var(--xb) - var(--gv)) 100%, 0 100%); }
.cop-img--b { clip-path: polygon(var(--cx) calc(var(--cy) + var(--g)), 100% calc(var(--yr) + var(--g)), 100% 100%, calc(var(--xb) + var(--gv)) 100%, calc(var(--cx) + var(--gv)) var(--cy)); }
.cop-img--a img { left: 0; top: 0; width: 64%; height: 92%; object-position: 45% 55%; }
.cop-img--c img { right: 0; top: 0; width: 55%; height: 54%; object-position: 50% 30%; }
.cop-img--d img { left: 0; bottom: 0; width: 50%; height: 52%; object-position: 30% 60%; }
.cop-img--b img { right: 0; bottom: 0; width: 68%; height: 94%; object-position: 45% 45%; }
.cop-quadro {
    position: relative; z-index: 2; box-sizing: border-box; width: min(26rem, 84vw); transform: translateX(-6%);
    background: #fff; padding: clamp(1.6rem, 3.6vw, 2.6rem); transition: transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s;
}
.cop-porta:hover .cop-quadro { transform: translateX(-6%) translateY(-3px); box-shadow: 0 22px 50px -18px rgba(0,0,0,.45); }
.cop-porta:focus-visible .cop-quadro { outline: 2px solid var(--encre); outline-offset: 6px; }
/* Titre : une seule famille, deux graisses fines ; tailles exactes calculées par le script de la page */
.cop-titolo { --interlinea: .045; margin: 0; font-family: "Antonio", "Arial Narrow", sans-serif; font-weight: 200; text-transform: uppercase; color: var(--encre); transition: opacity .35s; }
.cop-titolo.attesa:not(.pronto) { opacity: 0; }
.cop-l { display: block; white-space: nowrap; overflow: visible; }
.cop-l > span { display: block; width: max-content; }
.cop-base { display: inline-block; width: 0; height: 0; vertical-align: baseline; }
.cop-l--g { font-weight: 200; font-size: clamp(3.4rem, 9vw, 6rem); line-height: .9; }       /* repli sans script */
.cop-l--p { font-weight: 400; font-size: clamp(.8rem, 1.4vw, 1rem); line-height: 1.6; letter-spacing: .3em; }
/* Tablette et téléphone : les deux bandes gardent l'épaisseur de la plus épaisse (la bande plus fine est réservée à l'ordinateur) */
@media (pointer: coarse), (max-width: 1024px) {
    .copertina { --gv: calc(var(--g) * .86); }
}
@media (orientation: portrait) {
    /* Écran vertical : deux détails, une seule diagonale */
    .copertina { --yl: 70%; --yr: 30%; }
    .cop-img--c, .cop-img--d { display: none; }
    .cop-img--a { clip-path: polygon(0 0, 100% 0, 100% calc(var(--yr) - var(--g)), 0 calc(var(--yl) - var(--g))); }
    .cop-img--b { clip-path: polygon(0 calc(var(--yl) + var(--g)), 100% calc(var(--yr) + var(--g)), 100% 100%, 0 100%); }
    .cop-img--a img { width: 100%; height: 72%; }
    .cop-img--b img { width: 100%; height: 72%; }
    .cop-quadro, .cop-porta:hover .cop-quadro { transform: none; }
}
@media (prefers-reduced-motion: reduce) { .cop-quadro, .cop-titolo { transition: none; } }

/* ---------- 5.2 Pages du site : barre du haut, pied ---------- */
html:has(body.sito), body.sito { height: auto !important; overflow: visible !important; }
body.sito { font-size: 1.15rem; }
.salta { position: absolute; left: -999px; top: 0; z-index: 30; background: var(--encre); color: #fff; padding: .6rem 1rem; }
.salta:focus { left: 0; }
.testata {
    position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 1rem 2rem;
    padding: .75rem var(--pad); background: rgba(255,255,255,.97); border-bottom: 1px solid var(--filo);
}
.marchio { display: flex; align-items: center; gap: .7rem; text-decoration: none; color: var(--encre); font: 800 1.2rem/1 var(--cond); letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.marchio .mono { width: 1.05rem; }
.voci { display: flex; gap: .2rem 1.5rem; margin-left: auto; font: 600 .86rem/1 var(--cond); letter-spacing: .13em; text-transform: uppercase; }
.voci a { text-decoration: none; padding: .55rem 0; border-bottom: 2px solid transparent; white-space: nowrap; }
.voci a:hover { border-bottom-color: var(--filo); }
.voci a[aria-current] { border-bottom-color: var(--encre); }
.voci .voce-segnala { color: var(--ocra); }
.testata .lingue { margin-right: -.45rem; }
@media (max-width: 900px) {
    .testata { flex-wrap: wrap; padding-bottom: 0; }
    .voci { order: 3; width: calc(100% + 2 * var(--pad)); margin: 0 calc(-1 * var(--pad)); padding: 0 var(--pad); overflow-x: auto; gap: 1.3rem; border-top: 1px solid var(--filo); scrollbar-width: none; }
    .voci a { padding: .8rem 0; }
    .testata .lingue { margin-left: auto; }
}
@media (max-width: 480px) {
    .voci { gap: .95rem; font-size: .8rem; letter-spacing: .07em; }
}
@media (max-width: 350px) {
    .voci { gap: .6rem; font-size: .76rem; letter-spacing: .03em; }
}

.piede { margin-top: 5rem; background: var(--encre); color: #fff; }
.piede-in { max-width: 72rem; margin: 0 auto; padding: 3rem var(--pad) 2.4rem; display: grid; grid-template-columns: auto 1fr; gap: 1rem 2rem; align-items: center; }
.marchio--piede { color: #fff; }
.piede-premio { margin: 0; font: 600 .78rem/1.4 var(--cond); letter-spacing: .14em; text-transform: uppercase; color: #bdb7ae; justify-self: end; }
.piede-voci { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .4rem 1.6rem; padding-top: 1.4rem; border-top: 1px solid #3a3835; font: 600 .82rem/1 var(--cond); letter-spacing: .13em; text-transform: uppercase; }
.piede-voci a { text-decoration: none; padding: .4rem 0; }
.piede-voci a:hover { text-decoration: underline; }
.piede-cr { grid-column: 1 / -1; margin: 0; font-size: .9rem; color: #bdb7ae; }
@media (max-width: 640px) { .piede-in { grid-template-columns: 1fr; } .piede-premio { justify-self: start; } }

/* En-tête de page */
.pag-testa { max-width: 72rem; margin: 0 auto; padding: clamp(2.6rem, 7vw, 5.5rem) var(--pad) clamp(1.6rem, 3vw, 2.4rem); }
.pag-testa--stretta { max-width: 50rem; }
.occhiello { margin: 0; font: 600 .8rem/1.4 var(--cond); letter-spacing: .2em; text-transform: uppercase; color: var(--seconda); }
.pag-titolo { margin: .3em 0 .3em; font: 800 clamp(3rem, 10vw, 7.6rem)/.86 var(--cond); text-transform: uppercase; letter-spacing: -.005em; overflow-wrap: anywhere; }
.pag-testa--stretta .pag-titolo { font-size: clamp(2.8rem, 8vw, 5.4rem); }
.pag-intro { margin: 0; max-width: 42rem; font-size: clamp(1.15rem, 1.6vw, 1.4rem); line-height: 1.5; color: var(--seconda); }
.bottone {
    display: inline-block; border: 0; cursor: pointer; text-decoration: none; background: var(--encre); color: #fff;
    padding: 1rem 1.5rem; font: 600 .95rem/1 var(--cond); letter-spacing: .14em; text-transform: uppercase; transition: background .2s;
}
.bottone:hover, .bottone:focus-visible { background: var(--ocra); outline: none; }
.bottone[disabled] { opacity: .6; cursor: progress; }
.bottone--grande { padding: 1.2rem 2rem; font-size: 1.05rem; }

/* ---------- 5.3 Catalogue ---------- */
.filtri { border-top: 1px solid var(--filo); border-bottom: 1px solid var(--filo); }
.filtri-in { max-width: 72rem; margin: 0 auto; padding: .9rem var(--pad); display: flex; flex-wrap: wrap; gap: .8rem 2rem; align-items: center; }
.filtri-gruppo { display: flex; flex-wrap: wrap; gap: .4rem; }
.filtri-gruppo a {
    text-decoration: none; padding: .55rem .8rem; border: 1px solid #d8d2c9; color: var(--encre);
    font: 600 .8rem/1 var(--cond); letter-spacing: .12em; text-transform: uppercase;
}
.filtri-gruppo a small { font-size: .9em; color: var(--sottile); letter-spacing: .05em; margin-left: .2em; }
.filtri-gruppo a:hover { border-color: var(--encre); }
.filtri-gruppo a[aria-current] { background: var(--encre); border-color: var(--encre); color: #fff; }
.filtri-gruppo a[aria-current] small { color: #c9c3ba; }
.filtri-anni { display: flex; flex-wrap: wrap; gap: .1rem .3rem; margin-left: auto; }
.filtri-anni a { text-decoration: none; padding: .35rem .35rem; font: 800 1.05rem/1 var(--cond); color: var(--seconda); }
.filtri-anni a:hover { color: var(--encre); text-decoration: underline; }

.catalogo { max-width: 72rem; margin: 0 auto; padding: 0 var(--pad); }
.cat-gruppo { display: grid; grid-template-columns: 10.5rem minmax(0, 1fr); gap: 2.5rem; padding: 2.6rem 0 clamp(3rem, 7vw, 6rem); border-top: 3px solid var(--encre); scroll-margin-top: 4.5rem; }
.cat-gruppo:first-child { border-top: 0; }
.cat-gruppo-h { position: sticky; top: 5.2rem; align-self: start; margin: 0; font: 800 clamp(2.3rem, 4vw, 3.6rem)/.88 var(--cond); text-transform: uppercase; hyphens: auto; overflow-wrap: anywhere; }
.cat-gruppo-h small { display: block; margin-top: .9rem; font: 600 .76rem/1.3 var(--cond); letter-spacing: .14em; color: var(--sottile); }
/* Notices en grille : images alignées sur une même ligne de base, œuvre entière (jamais recadrée) */
.cat-schede { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: clamp(2.4rem, 4vw, 3.6rem) clamp(1.4rem, 2.6vw, 2.4rem); align-items: start; }
.scheda { display: flex; flex-direction: column; min-width: 0; scroll-margin-top: 5rem; }
.scheda-img { height: clamp(12rem, 19vw, 16.5rem); display: flex; align-items: flex-end; justify-content: flex-start; min-width: 0; }
.scheda-img a { display: flex; align-items: flex-end; height: 100%; max-width: 100%; cursor: zoom-in; }
.scheda-img img { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; box-shadow: 0 1px 0 rgba(0,0,0,.04); transition: opacity .2s; }
.scheda-img a:hover img, .scheda-img a:focus-visible img { opacity: .86; }
.scheda-vuota { height: 72%; max-width: 100%; background: #f4f2ee; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .6rem; padding: .8rem; text-align: center; color: #a29c93; font: 600 .62rem/1.3 var(--cond); letter-spacing: .14em; text-transform: uppercase; }
.scheda-vuota .mono { width: 1.3rem; opacity: .35; flex: none; }
.scheda-testo { margin-top: 1rem; padding-top: .8rem; border-top: 1px solid var(--filo); }
.scheda-testo p { margin: 0; }
.scheda-anno { font: 800 1.2rem/1 var(--cond); letter-spacing: .01em; }
.scheda-t { margin: .35rem 0 .1rem; font: italic 500 1.28rem/1.15 var(--serif); overflow-wrap: anywhere; }
.scheda-tr { font-size: .98rem; color: var(--seconda); }
.scheda-testo .scheda-d { margin-top: .55rem; font: 600 .72rem/1.5 var(--cond); letter-spacing: .1em; text-transform: uppercase; color: var(--seconda); }
.scheda-testo .scheda-n, .scheda-testo .scheda-f { margin-top: .3rem; font-size: .94rem; line-height: 1.4; font-style: italic; color: var(--sottile); }
.scheda-testo .scheda-l { margin-top: .8rem; }
.scheda-l a { font: 600 .72rem/1 var(--cond); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: .2rem; }
.scheda-l a:hover { color: var(--ocra); }
.scheda:target .scheda-testo { border-top-color: var(--ocra); border-top-width: 3px; }
.vuoto { padding: 4rem 0; font-style: italic; color: var(--seconda); }
@media (max-width: 860px) {
    .cat-gruppo { grid-template-columns: 1fr; gap: 1.6rem; padding-top: 2rem; }
    .cat-gruppo-h { position: static; display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
    .cat-gruppo-h small { margin: 0; }
    .filtri-anni { margin-left: 0; }
}
@media (max-width: 560px) {
    .cat-schede { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.2rem 1rem; }
    .scheda-img { height: 9.5rem; }
    .scheda-vuota span { display: none; }
    .scheda-anno { font-size: 1.05rem; }
    .scheda-t { font-size: 1.08rem; }
    .scheda-testo .scheda-d { font-size: .64rem; letter-spacing: .07em; }
    .scheda-testo .scheda-n, .scheda-testo .scheda-f { font-size: .86rem; }
}

.invito { max-width: 72rem; margin: clamp(2rem, 6vw, 5rem) auto 0; padding: 0 var(--pad); }
.invito > * { max-width: 40rem; }
.invito h2 { margin: 0 0 .6rem; padding-top: 2.4rem; border-top: 3px solid var(--encre); font: 800 clamp(2rem, 4.4vw, 3.4rem)/.92 var(--cond); text-transform: uppercase; max-width: none; }
.invito p { color: var(--seconda); line-height: 1.5; }

/* Visionneuse */
.lb { border: 0; padding: 0; margin: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; background: rgba(255,255,255,.98); }
.lb::backdrop { background: rgba(255,255,255,.9); }
.lb figure { margin: 0; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3.5rem 1rem 1.2rem; box-sizing: border-box; }
.lb img { max-width: 100%; max-height: calc(100dvh - 8rem); width: auto; height: auto; object-fit: contain; cursor: zoom-out; }
.lb figcaption { display: block; text-align: center; margin-top: 1rem; font-size: 1rem; color: var(--seconda); max-width: 50rem; }
.lb-x { position: absolute; top: .6rem; right: .8rem; width: 2.8rem; height: 2.8rem; border: 0; background: none; font: 400 2.2rem/1 var(--sans); cursor: pointer; color: var(--encre); }

/* ---------- 5.4 Archives ---------- */
.indice-pag { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 2rem; }
.indice-pag a { text-decoration: none; padding: .55rem .8rem; border: 1px solid #d8d2c9; font: 600 .8rem/1 var(--cond); letter-spacing: .12em; text-transform: uppercase; }
.indice-pag a:hover { border-color: var(--encre); }
.indice-pag small { color: var(--sottile); }
.arch-sez { max-width: 72rem; margin: 0 auto; padding: 2.6rem var(--pad) 1rem; scroll-margin-top: 4rem; }
.arch-h { margin: 0 0 1.4rem; padding-top: 2.2rem; border-top: 3px solid var(--encre); font: 800 clamp(2.2rem, 5vw, 3.8rem)/.9 var(--cond); text-transform: uppercase; }
.arch-h small { font-size: .45em; color: var(--sottile); vertical-align: top; letter-spacing: .05em; }
.arch-nota { margin: -.4rem 0 1.2rem; font-size: .95rem; font-style: italic; color: var(--sottile); }
/* Biographie (texte long, en tête des archives) */
.bio-sez { display: grid; grid-template-columns: 13rem minmax(0, 42rem); gap: 1rem 3rem; padding: 1.8rem 0 1.2rem; border-top: 1px solid var(--filo); }
.bio-sez:first-child { border-top: 0; padding-top: .4rem; }
.bio-testa { position: sticky; top: 5rem; align-self: start; }
.bio-anni { margin: 0; font: 800 1.15rem/1 var(--cond); letter-spacing: .02em; color: var(--ocra); }
.bio-t { margin: .4rem 0 0; font: italic 500 1.55rem/1.15 var(--serif); }
.bio-testo p { margin: 0 0 1em; font-size: 1.14rem; line-height: 1.68; }
.bio-st { margin: 1.5em 0 .55em; font: 600 .84rem/1.3 var(--cond); letter-spacing: .14em; text-transform: uppercase; color: var(--seconda); }
.bio-fonte { margin-top: .6rem; }
@media (max-width: 760px) { .bio-sez { grid-template-columns: 1fr; gap: .7rem; } .bio-testa { position: static; } }
.arch-lista { margin: 0; }
.arch-lista > div { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: 1.4rem; padding: .85rem 0; border-top: 1px solid var(--filo); }
.arch-lista dt { font: 800 1.3rem/1.15 var(--cond); }
.arch-lista dd { margin: 0; line-height: 1.5; max-width: 46rem; }
.arch-lista ul { list-style: none; margin: 0; padding: 0; }
.arch-lista li + li { margin-top: .25rem; }
.arch-lista--crono dd { font-size: 1.12rem; }
.arch-foto { display: grid; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); gap: 1.6rem; }
.arch-foto figure { margin: 0; }
.arch-foto img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; filter: saturate(.92); }
.arch-foto figcaption { display: block; text-align: left; margin-top: .6rem; font-size: .98rem; font-style: italic; color: var(--seconda); }
.arch-fonti { max-width: 72rem; margin: 2rem auto 0; padding: 0 var(--pad); font-size: .95rem; color: var(--sottile); }
@media (max-width: 640px) { .arch-lista > div { grid-template-columns: 1fr; gap: .25rem; } }

/* ---------- 5.5 Formulaire « Signaler une œuvre » ---------- */
.modulo { max-width: 50rem; margin: 0 auto; padding: 0 var(--pad); }
.modulo fieldset { border: 0; margin: 0; padding: 2.2rem 0 1.2rem; border-top: 3px solid var(--encre); min-width: 0; }
/* légende flottante : posée sous le filet du fieldset et non sur celui-ci */
.mod-sez { float: left; width: 100%; display: flex; align-items: baseline; gap: .8rem; padding: 0; margin: 0 0 1.6rem; font: 800 clamp(1.8rem, 4vw, 2.6rem)/.95 var(--cond); text-transform: uppercase; }
.mod-sez span { font-size: .55em; color: var(--ocra); }
.mod-sez + * { clear: both; }
.campo { display: block; margin: 0 0 1.25rem; }
.etichetta, .sub { display: block; margin-bottom: .45rem; font: 600 .82rem/1.3 var(--cond); letter-spacing: .1em; text-transform: uppercase; color: var(--seconda); }
.sub { font-size: .74rem; }
.etichetta abbr, .aiuto abbr, .scelta abbr { color: var(--ocra); text-decoration: none; }
.modulo input:not([type=checkbox]):not([type=radio]):not([type=file]), .modulo select, .modulo textarea {
    display: block; width: 100%; box-sizing: border-box; margin: 0; padding: .7rem .8rem;
    font: 500 1.12rem/1.35 var(--serif); color: var(--encre); background: #fff;
    border: 1px solid #cdc6bc; border-radius: 0; -webkit-appearance: none; appearance: none;
}
.modulo select { background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231d1c1a' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right .9rem center; padding-right: 2.4rem; }
.modulo textarea { resize: vertical; min-height: 4.5rem; }
.modulo input:focus, .modulo select:focus, .modulo textarea:focus { outline: 2px solid var(--encre); outline-offset: 0; border-color: var(--encre); }
.modulo input[type=file] { display: block; width: 100%; padding: 1.2rem; border: 1px dashed #b9b1a6; background: #faf9f7; font: 600 .9rem var(--cond); letter-spacing: .05em; box-sizing: border-box; }
.modulo input[type=checkbox] { width: 1.15rem; height: 1.15rem; margin: .2rem 0 0; accent-color: var(--encre); flex: none; }
.aiuto { display: block; margin-top: .4rem; font-size: .95rem; line-height: 1.4; color: var(--sottile); }
.riga { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.2rem; }
.riga--dim { grid-template-columns: repeat(3, 1fr); }
.riga--dim label { display: block; }
.scelte { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; }
.scelta { display: inline-flex; align-items: flex-start; gap: .55rem; font-size: 1.05rem; cursor: pointer; }
.scelta--blocco { display: flex; margin: 0 0 1rem; line-height: 1.45; }
.nota-qualita { margin: 0 0 1.4rem; padding: .9rem 1rem; background: #f6f3ef; border-left: 3px solid var(--ocra); font-size: 1rem; line-height: 1.45; }
.elenco-file { list-style: none; margin: -.6rem 0 1.2rem; padding: 0; font: 600 .82rem/1.6 var(--cond); letter-spacing: .04em; color: var(--seconda); }
.elenco-file li::before { content: "▪ "; }
.elenco-file .bassa { color: var(--ocra); }
.elenco-file .err { color: #b00020; }
.trappola { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.invio { margin: 1rem 0 0; padding-top: 2rem; border-top: 3px solid var(--encre); }
.avanzamento { height: 4px; background: var(--filo); margin-top: 1rem; }
.avanzamento span { display: block; height: 100%; width: 0; background: var(--ocra); transition: width .2s; }
.avviso { margin: 1.4rem 0; padding: 1.1rem 1.3rem; line-height: 1.45; }
.avviso p { margin: 0 0 .5rem; } .avviso p:last-child { margin-bottom: 0; }
.avviso ul { margin: .3rem 0 .6rem; padding-left: 1.2rem; }
.avviso--err { background: #fbeeed; border-left: 3px solid #b00020; }
.avviso--ok { background: #f1f4ee; border-left: 3px solid #3d6b35; }
.avviso:focus { outline: none; }
.link-lungo { word-break: break-all; font-size: .95rem; }
@media (max-width: 640px) { .riga { grid-template-columns: 1fr; } .riga--dim { grid-template-columns: repeat(3, 1fr); gap: 0 .6rem; } }

/* Suivi du dossier */
.riepilogo { margin: 0 0 2rem; border-top: 3px solid var(--encre); }
.riepilogo > div { display: grid; grid-template-columns: 11rem 1fr; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--filo); }
.riepilogo dt { font: 600 .8rem/1.6 var(--cond); letter-spacing: .1em; text-transform: uppercase; color: var(--seconda); }
.riepilogo dd { margin: 0; }
.stato { font: 600 .82rem/1 var(--cond); letter-spacing: .1em; text-transform: uppercase; padding: .35rem .55rem; background: #eeebe6; }
.stato--pubblicato, .stato--validato { background: #e5ede2; }
.stato--da-integrare { background: #f6e9df; color: var(--ocra); }
.scambi .mod-sez { padding-top: 2rem; border-top: 3px solid var(--encre); }
.msg { margin: 0 0 1rem; padding: 1rem 1.2rem; background: #f6f4f1; max-width: 40rem; }
.msg--noi { background: #fff; border: 1px solid #d8d2c9; margin-left: auto; }
.msg p { margin: 0; } .msg-testa { font: 600 .78rem/1.4 var(--cond); letter-spacing: .1em; text-transform: uppercase; color: var(--seconda); margin-bottom: .5rem !important; }
.msg-file { font-size: .92rem; font-style: italic; color: var(--sottile); margin-top: .4rem !important; }
.mod-msg { margin-top: 2rem; }

/* ---------- 5.6 Livre : accès au catalogue, aux archives et au signalement ---------- */
.sfoglia a, .sfoglia .pos { white-space: nowrap; }
.sfoglia-sito { display: flex; gap: .2rem 1.2rem; margin-left: 1.2rem; padding-left: 1.2rem; border-left: 1px solid #e3dfd9; }
.sfoglia-sito a { color: var(--seconda); }
.sfoglia-sito a:hover { color: var(--encre); }
.sfoglia-sito .voce-segnala { color: var(--ocra); }
@media (min-width: 960px) and (min-aspect-ratio: 5/4) { .sfoglia { width: max-content; max-width: 96vw; } .sfoglia-sito { gap: calc(1 * var(--u)); } }
@media (max-width: 959px), (max-aspect-ratio: 5/4) {
    .sfoglia { flex-wrap: wrap; row-gap: .2rem; }
    .sfoglia-sito { order: 5; width: 100%; justify-content: center; gap: .2rem .9rem; margin: .3rem 0 0; padding: .3rem 0 0; border: 0; border-top: 1px solid #e3dfd9; letter-spacing: .16em; }
    .sfoglia .lingue { order: 6; margin-left: 0; padding-left: 0; border-left: 0; }
    .sfoglia-sito { flex-wrap: wrap; }
}
@media (max-width: 440px) { .sfoglia-sito { gap: .1rem .7rem; letter-spacing: .1em; } .sfoglia-sito a { padding-left: .15rem; padding-right: .15rem; } .sfoglia { padding-left: .8rem; padding-right: .8rem; } }
@media (max-width: 350px) { .sfoglia-sito { gap: .1rem .55rem; letter-spacing: .05em; } }

/* =========================================================
   6. ADMINISTRATION (/admin/)
   ========================================================= */
body.admin { font: 400 15px/1.5 var(--sans); background: #f5f4f2; color: var(--encre); height: auto !important; overflow: visible !important; }
html:has(body.admin) { height: auto !important; overflow: visible !important; }
.adm-testa { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 1.5rem; background: var(--encre); color: #fff; }
.adm-marchio { display: flex; align-items: center; gap: .6rem; color: #fff; text-decoration: none; font: 800 1.1rem/1 var(--cond); letter-spacing: .06em; text-transform: uppercase; }
.adm-marchio svg { width: 14px; height: auto; }
.adm-testa nav { display: flex; gap: 1.2rem; } .adm-testa nav a { color: #e9e6e1; }
.adm { max-width: 76rem; margin: 0 auto; padding: 1.5rem; }
.adm h1 { font: 800 2rem/1.05 var(--cond); text-transform: uppercase; margin: 0; }
.adm h1 small { font-size: .55em; color: #8d8780; }
.adm h2 { font: 800 1.15rem/1.2 var(--cond); text-transform: uppercase; letter-spacing: .04em; margin: 1.2rem 0 .6rem; }
.adm h2:first-child { margin-top: 0; }
.adm-box { background: #fff; padding: 1.3rem 1.4rem; margin: 0 0 1.2rem; border: 1px solid #e3dfd9; }
.adm-box--stretta { max-width: 30rem; margin: 3rem auto; }
.adm-titolo { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; margin: .5rem 0 1.2rem; }
.adm-rif { margin: 0 0 .3rem; color: #6b665f; font-size: 13px; }
.adm-ritorno { margin: 0 0 .5rem; } .adm-ritorno a { color: #5a5650; }
.adm-form { display: grid; gap: .8rem; }
.adm-form label { display: grid; gap: .3rem; font-weight: 600; font-size: 13px; }
.adm-form input:not([type=checkbox]):not([type=radio]), .adm-form textarea, .adm-form select, .adm-stato select, .adm-cerca input { font: inherit; font-weight: 400; padding: .55rem .65rem; border: 1px solid #c9c3ba; background: #fff; border-radius: 3px; width: 100%; box-sizing: border-box; }
.adm button, .adm-btn-sec { justify-self: start; font: 600 14px/1 var(--sans); padding: .7rem 1.1rem; border: 0; border-radius: 3px; background: var(--encre); color: #fff; cursor: pointer; text-decoration: none; display: inline-block; }
.adm button:hover { background: var(--ocra); }
.adm .adm-btn-sec { background: #e9e6e1; color: var(--encre); }
.adm .adm-btn-sec:hover, .adm .adm-btn-sec:focus-visible { background: #dcd6ce; color: var(--encre); }
.adm-form--ritira { margin-top: .6rem; }
.adm .adm-btn-danger { background: #b00020; }
.adm-check { display: flex !important; grid-auto-flow: column; align-items: center; gap: .5rem !important; font-weight: 400 !important; }
.adm-code { width: 100%; font: 12px/1.4 ui-monospace, Menlo, monospace; padding: .6rem; box-sizing: border-box; }
.adm-aide { color: #6b665f; font-size: 13px; font-weight: 400; }
.adm-err { color: #b00020; font-weight: 600; }
.adm-ok { background: #e8f0e5; border-left: 3px solid #3d6b35; padding: .7rem 1rem; margin: 0 0 1rem; }
.adm-nuovo { display: flex; align-items: center; gap: 1rem; background: #fff4e5; border-left: 3px solid var(--ocra); padding: .6rem 1rem; margin: 0 0 1rem; }
.adm-stato label { font-weight: 600; font-size: 13px; display: grid; gap: .3rem; }
.adm-colonne { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; align-items: start; }
.adm-colonne > .adm-box { margin: 0; }
.adm-dl { display: grid; grid-template-columns: 11rem 1fr; gap: .35rem 1rem; margin: 0; }
.adm-dl dt { color: #6b665f; font-size: 13px; }
.adm-dl dd { margin: 0; }
.adm-consensi { list-style: none; padding: 0; margin: 0; }
.adm-foto { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: 1rem; }
.adm-foto figure { margin: 0; }
.adm-foto img { width: 100%; height: 11rem; object-fit: contain; background: #f2f0ed; }
.adm-foto figcaption { display: block; text-align: left; margin-top: .4rem; font-size: 12px; line-height: 1.4; color: #5a5650; }
.adm-file { display: grid; place-items: center; height: 11rem; background: #f2f0ed; font: 800 1.4rem var(--cond); color: #8d8780; }
.adm-si { color: #3d6b35; font-weight: 600; } .adm-no { color: var(--ocra); font-weight: 600; }
.adm-msg { padding: .8rem 1rem; margin: 0 0 .8rem; background: #f6f4f1; border-left: 3px solid #c9c3ba; }
.adm-msg--atelier { background: #eef2f6; border-left-color: #3b5b7a; }
.adm-msg--nota { background: #fff8e6; border-left-color: #c9a227; }
.adm-msg p { margin: .2rem 0; } .adm-msg-t { font-size: 13px; color: #5a5650; }
.adm-pub .adm-riga { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.adm-scelta-foto { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .8rem; }
.adm-scelta-foto legend { font-weight: 600; font-size: 13px; margin-bottom: .4rem; }
.adm-scelta-foto label { display: grid !important; gap: .3rem; width: 9rem; font-weight: 400 !important; cursor: pointer; }
.adm-scelta-foto img { width: 9rem; height: 7rem; object-fit: contain; background: #f2f0ed; }
.adm-pericolo summary { cursor: pointer; color: #b00020; font-weight: 600; }
.adm-filtri { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1rem; }
.adm-filtri a { padding: .4rem .7rem; background: #fff; border: 1px solid #ddd8d0; text-decoration: none; border-radius: 3px; font-size: 13px; }
.adm-filtri a[aria-current] { background: var(--encre); color: #fff; border-color: var(--encre); }
.adm-cerca { display: flex; gap: .5rem; min-width: min(100%, 26rem); }
.adm-tab { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid #e3dfd9; }
.adm-tab th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: #6b665f; padding: .7rem .8rem; border-bottom: 2px solid #e3dfd9; }
.adm-tab td { padding: .75rem .8rem; border-bottom: 1px solid #eeebe7; vertical-align: top; }
.adm-tab td small { color: #6b665f; }
.adm-da-leggere td:first-child { box-shadow: inset 3px 0 0 var(--ocra); }
.adm-stato-et { font-size: 12px; padding: .2rem .45rem; background: #eeebe6; border-radius: 3px; white-space: nowrap; }
.adm-stato-et--nuovo { background: #fff0dc; } .adm-stato-et--pubblicato { background: #e3eedf; } .adm-stato-et--rifiutato, .adm-stato-et--archiviato { background: #ececec; color: #6b665f; }
.adm-pallino { color: var(--ocra); }
.adm-atl figcaption a { color: inherit; text-decoration: none; } .adm-atl figcaption a:hover strong { text-decoration: underline; }
.adm-atl img { cursor: pointer; }
.adm-atl-vista img { display: block; width: 100%; max-height: 70vh; object-fit: contain; background: #f2f0ed; margin: 0 0 1rem; }
.adm-stato-et--atl-attesa { background: #fff0dc; } .adm-stato-et--atl-pronta { background: #e6eef6; } .adm-stato-et--atl-libro { background: #e3eedf; } .adm-stato-et--atl-archivio { background: #ececec; color: #6b665f; }
.adm-testa nav { flex-wrap: wrap; justify-content: flex-end; }
/* navigation, listes et fiches des œuvres (octobre 2026) */
.adm-testa { position: sticky; top: 0; z-index: 5; }
.adm-testa nav a { text-decoration: none; padding: .35rem 0; border-bottom: 2px solid transparent; }
.adm-testa nav a:hover { border-bottom-color: #8d8780; }
.adm-testa nav a[aria-current] { color: #fff; border-bottom-color: var(--ocra); }
.adm-testa nav .adm-esterno { color: #b9b3ab; }
.adm-pannello { background: #fff; border: 1px solid #e3dfd9; padding: .9rem 1.1rem .3rem; margin: 0 0 1rem; }
.adm-pannello-riga { display: grid; grid-template-columns: 7rem 1fr; align-items: baseline; gap: .6rem; }
.adm-pannello-riga--doppia { grid-template-columns: 1fr 1fr; }
.adm-pannello-riga--doppia > div { display: grid; grid-template-columns: 7rem 1fr; align-items: baseline; gap: .6rem; }
.adm-pannello .adm-filtri { margin-bottom: .6rem; }
.adm-etichetta { font: 800 .8rem/1 var(--cond); text-transform: uppercase; letter-spacing: .08em; color: #8d8780; }
.adm-conteggio { margin: 0 0 .6rem; color: #6b665f; font-size: 13px; }
.adm-opere { grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr)); }
.adm-opera { background: #fff; border: 1px solid #e8e4de; padding: .6rem; transition: border-color .15s; }
.adm-opera:hover { border-color: #b9b3ab; }
.adm-opera img, .adm-opera .adm-file { height: 10rem; }
.adm-opera figcaption a { color: inherit; text-decoration: none; }
.adm-opera--atelier { background: #fdfaf4; }
.adm-fonte { color: #8d8780; }
.adm-mod { font-size: 11px; padding: .1rem .35rem; background: #e6eef6; color: #3b5b7a; border-radius: 3px; white-space: nowrap; }
.adm-tab--opere .adm-tab-img { width: 4.5rem; }
.adm-tab--opere img { width: 4rem; height: 4rem; object-fit: contain; background: #f2f0ed; display: block; }
.adm-tab--opere a { color: inherit; }
.adm-scheda { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 1.2rem; align-items: start; }
.adm-scheda > .adm-box { margin: 0; }
.adm-senza { display: grid; place-items: center; min-height: 12rem; background: #f2f0ed; color: #8d8780; margin: 0 0 1rem; }
.adm-orig { display: block; font-weight: 400; color: #8a5a00; }
.adm-liens { display: flex; flex-wrap: wrap; gap: 1rem; margin: 0; }
.adm-liens a { color: #3b5b7a; }
.adm-riga--3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; }
.adm-riga--4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem; }
.adm-gruppo { border: 0; border-top: 1px solid #e3dfd9; padding: .8rem 0 0; margin: .2rem 0 0; display: grid; gap: .8rem; }
.adm-gruppo legend { font-weight: 600; font-size: 13px; padding: 0 .4rem 0 0; }
.adm-dettagli summary { cursor: pointer; font-size: 13px; color: #5a5650; }
.adm-dettagli[open] summary { margin-bottom: .6rem; }
.adm-azioni { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: .4rem; }
.adm-foto-opera figure { background: #faf9f7; border: 1px solid #e8e4de; padding: .6rem; }
.adm-foto-opera figure.adm-scelta { border: 2px solid var(--ocra); background: #fffaf1; }
.adm-foto-opera form { margin: .4rem 0 0; }
.adm .adm-btn-mini { padding: .45rem .7rem; font-size: 12px; }
.adm-didascalia { display: flex; gap: .3rem; }
.adm-didascalia input { flex: 1; min-width: 0; font: inherit; font-size: 12px; padding: .35rem .45rem; border: 1px solid #d6d1c9; border-radius: 3px; }
.adm-foto-azioni { display: flex; flex-wrap: wrap; gap: .4rem; }
.adm-carica { display: flex; flex-wrap: wrap; align-items: end; gap: 1rem; margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid #e3dfd9; }
.adm-carica label { display: grid; gap: .3rem; font-weight: 600; font-size: 13px; }
@media (max-width: 800px) {
  .adm-scheda, .adm-pannello-riga, .adm-pannello-riga--doppia, .adm-pannello-riga--doppia > div, .adm-riga--3, .adm-riga--4 { grid-template-columns: 1fr; }
  .adm-pannello-riga { gap: .3rem; }
  .adm-testa { position: static; flex-direction: column; align-items: flex-start; gap: .5rem; padding: .8rem 1rem; }
  .adm-testa nav { justify-content: flex-start; gap: .2rem 1rem; }
}
@media (max-width: 800px) { .adm-colonne, .adm-pub .adm-riga { grid-template-columns: 1fr; } .adm-dl { grid-template-columns: 1fr; } .adm-tab thead { display: none; } .adm-tab td { display: block; border: 0; padding: .3rem .8rem; } .adm-tab tr { display: block; border-bottom: 1px solid #e3dfd9; padding: .5rem 0; } }

/* Œuvres en basse définition : masquées sur tablette et desktop, visibles sur mobile */
@media (min-width: 768px){ .tavola--solo-mobile{ display: none !important; } }
@media (max-width: 767px){ .tavola--solo-desk{ display: none !important; } }

/* =========================================================
   Palmarès du Prix de Rome — annexe du livre « Villa Médicis »
   ========================================================= */
.palmares h2 { margin: 0 0 .35em; }
.palmares .intro { margin: 0 0 1.1em; max-width: 34em; }
.pr-lista {
    columns: 2; column-gap: 2em; list-style: none; margin: 0; padding: 0;
    font: 500 .8rem/1.42 var(--serif);
}
.pr-lista li { break-inside: avoid; margin: 0 0 .12em; padding-left: 3.3em; text-indent: -3.3em; }
.pr-a {
    display: inline-block; width: 2.9em; text-indent: 0;
    font: 400 .62rem/1 var(--sans); letter-spacing: .08em; color: var(--sottile);
    vertical-align: .08em;
}
.pr-t { color: var(--encre); }
.pr-hl .pr-t { font-weight: 700; }
.pr-hl .pr-a { color: var(--encre); }
@media (min-width: 1100px) { .pr-lista { columns: 3; } }
.palmares .pr-periodo { margin: 0 0 1.1em; }
.palmares h2 + p::first-letter { float: none; font-size: inherit; line-height: inherit; margin: 0; font-weight: inherit; }

/* =========================================================
   Section de référence « Les lauréats du Prix de Rome »
   (pages hors format livre : pagine/laureati.php)
   ========================================================= */
.ref-body { background: var(--fondo); color: var(--encre); }
/* La page de référence défile normalement (elle n'est pas en mode livre à page fixe) */
html:has(body.ref-body), body.ref-body { height: auto !important; overflow: visible !important; }
.ref-testa, .ref-piede { max-width: 62rem; margin: 0 auto; padding: 1.4rem clamp(1rem,4vw,2rem); display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.ref-testa { border-bottom: 1px solid var(--filo); }
.ref-marchio { display: inline-flex; align-items: center; gap: .55rem; text-decoration: none; color: var(--encre); font: 400 .72rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; }
.ref-marchio .mono { width: 1.4rem; height: auto; }
.ref-testa nav { display: flex; gap: 1.2rem; font: 400 .66rem/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; }
.ref-testa nav a { color: var(--seconda); text-decoration: none; }
.ref-testa nav a:hover { color: var(--encre); }
.ref-main { max-width: 46rem; margin: 0 auto; padding: clamp(2.4rem,7vw,5rem) clamp(1rem,4vw,2rem) 3rem; }
.ref-wide { max-width: 62rem; }
.ref-kicker { font: 400 .66rem/1.4 var(--sans); letter-spacing: .26em; text-transform: uppercase; color: var(--sottile); margin: 0 0 1rem; }
.ref-main h1 { font: 400 clamp(2.1rem,6vw,3.4rem)/1.05 var(--serif); margin: 0 0 .5rem; }
.ref-sous { font: italic 400 1.15rem/1.4 var(--serif); color: var(--seconda); margin: 0 0 1.8rem; }
.ref-main p { font: 500 1.08rem/1.6 var(--serif); margin: 0 0 1.1em; }
.ref-voisins { display: flex; justify-content: space-between; gap: 1rem; margin: 2.2rem 0; padding: 1.1rem 0; border-top: 1px solid var(--filo); border-bottom: 1px solid var(--filo); font: 400 .7rem/1.5 var(--sans); letter-spacing: .04em; text-transform: uppercase; }
.ref-voisins a, .ref-voisins span { color: var(--seconda); text-decoration: none; }
.ref-voisins a:hover { color: var(--encre); text-decoration: underline; text-underline-offset: .25em; }
.ref-cartes { display: grid; gap: .8rem; margin: 2.4rem 0 1rem; }
.ref-carta { display: block; padding: 1.1rem 1.3rem; border: 1px solid var(--filo); text-decoration: none; color: var(--encre); transition: border-color .2s; }
.ref-carta:hover { border-color: var(--encre); }
.ref-carta .rc-t { font: 400 1.15rem/1.2 var(--serif); }
.ref-carta .rc-d { display: block; margin-top: .25rem; font: 400 .66rem/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--sottile); }
.ref-retour { font: 400 .68rem/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; }
.ref-retour a { color: var(--seconda); }
.ref-indice h2 { font: italic 400 1.6rem/1.2 var(--serif); margin: 2.4rem 0 1rem; }
.ref-lista { columns: 2; column-gap: 2em; list-style: none; margin: 0; padding: 0; font: 500 .82rem/1.5 var(--serif); }
.ref-lista li { break-inside: avoid; margin: 0 0 .12em; padding-left: 3.3em; text-indent: -3.3em; }
.ref-lista .pr-a { display: inline-block; width: 2.9em; text-indent: 0; font: 400 .62rem/1 var(--sans); letter-spacing: .08em; color: var(--sottile); vertical-align: .08em; }
.ref-lista a { color: var(--encre); text-decoration: none; }
.ref-lista a:hover { text-decoration: underline; text-underline-offset: .2em; }
.ref-lista .hl a { font-weight: 700; }
.ref-piede { border-top: 1px solid var(--filo); margin-top: 2rem; font: 400 .66rem/1.5 var(--sans); letter-spacing: .04em; color: var(--sottile); }
.ref-piede a { color: inherit; }
@media (min-width: 1100px) { .ref-lista { columns: 3; } }

/* =========================================================
   Villa Médicis — habillage « monographie d'architecture »
   (moderne, dynamique ; scoped .livre-archi — le livre du peintre ne change pas)
   Antonio (condensé, display) · Barlow Condensed (étiquettes) · Cormorant (texte)
   ========================================================= */
.livre-archi { --vc-disp: "Antonio", "Arial Narrow", sans-serif; --vc-cond: "Barlow Condensed", "Arial Narrow", sans-serif; }

/* Étiquettes : condensé, capitales espacées */
.livre-archi .testatina { font-family: var(--vc-cond); font-weight: 600; letter-spacing: .34em; }
.livre-archi .folio { font-family: var(--vc-cond); font-weight: 600; letter-spacing: .12em; }

/* Ouverture de chapitre : grand numéro condensé, titre en capitales condensées, texte à gauche */
.livre-archi .capitolo .num { font-family: var(--vc-disp); font-weight: 200; font-style: normal; font-size: clamp(4.5rem, 13vw, 7.5rem); line-height: .8; letter-spacing: 0; text-transform: none; color: var(--encre); margin: 0 0 .05em -.03em; }
.livre-archi .capitolo h2 { font-family: var(--vc-disp); font-weight: 400; font-style: normal; text-transform: uppercase; letter-spacing: .02em; line-height: 1; }
.livre-archi .capitolo p { text-align: left; }
.livre-archi .capitolo h2 + p::first-letter { font-size: inherit; float: none; margin: 0; font-weight: inherit; line-height: inherit; }

/* Légendes : condensé, capitales, alignées à gauche */
.livre-archi figcaption { text-align: left; align-items: flex-start; }
.livre-archi figcaption .tr { font-family: var(--vc-cond); font-weight: 600; font-style: normal; text-transform: uppercase; letter-spacing: .14em; font-size: .74rem; color: var(--seconda); }
.livre-archi figcaption .t { font-family: var(--vc-disp); font-style: normal; }

/* Frontispice (page de titre du livre) */
.livre-archi .frontespizio { text-align: left; align-items: flex-start; }
.livre-archi .frontespizio h1 { font-family: var(--vc-disp); font-weight: 200; text-transform: uppercase; letter-spacing: .01em; line-height: .9; }
.livre-archi .frontespizio .editore, .livre-archi .frontespizio .sottotitolo, .livre-archi .frontespizio .periodo { text-align: left; }
.livre-archi .frontespizio .sottotitolo { font-family: var(--vc-disp); font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: .04em; font-size: clamp(1.1rem, 2.4vw, 1.5rem); color: var(--seconda); }

/* Sommaire */
.livre-archi .indice .num { font-family: var(--vc-disp); font-style: normal; text-transform: uppercase; letter-spacing: .02em; }
.livre-archi .indice .iv { font-family: var(--vc-disp); font-style: normal; font-size: 1.5em; color: var(--encre); }
.livre-archi .indice .it { font-family: var(--vc-cond); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; }

/* Palmarès */
.livre-archi .palmares h2 { font-family: var(--vc-disp); font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: .03em; }

/* Colophon */
.livre-archi .colophon .num { font-family: var(--vc-cond); font-weight: 600; text-transform: uppercase; letter-spacing: .3em; }

/* Navigation du bas */
.livre-archi .sfoglia { font-family: var(--vc-cond); font-weight: 600; text-transform: uppercase; letter-spacing: .12em; }

/* Desktop : chapitre compact — tient dans la page, corrige le débordement */
@media (min-width: 768px) {
  /* corps lisible ; on récupère la hauteur sur le numéro, le titre et les marges */
  .livre-archi .capitolo { padding-top: calc(3.1 * var(--u)); font-size: clamp(14px, calc(1.2 * var(--u)), 17.5px); line-height: 1.5; }
  .livre-archi .capitolo .num { font-size: clamp(3rem, calc(5 * var(--u)), 5.2rem); margin-bottom: 0; }
  .livre-archi .capitolo h2 { font-size: calc(1.95 * var(--u)); margin: calc(.35 * var(--u)) 0 calc(.95 * var(--u)); }
  .livre-archi .capitolo p { max-width: 33em; margin: 0 0 .7em; }
}