/*
 * Cipria 1.0.0 — feuille du thème de « Yes Beauty » (magazine d'estetica e bellezza, en italien).
 * Univers : la cipria (poudre de teint) et le rouge à lèvres. Rose lampone plein pour l'en-tête et le pied (le rose
 * #FD4C90 du logo, assombri pour que le blanc reste lisible : contraste 6,3:1), UNE couleur d'accent (ce même rose,
 * #A8174F pour le texte), fonds pâles alternés blanc / cipria / latte, étiquettes neutres. Motifs : le « tratto »
 * (trace de rouge à lèvres) devant les surtitres et sous les intertitres d'article, l'« etichetta » de produit en
 * pointillés avec le pictogramme du pot ouvert, la photo du hero dans un passe-partout (filet blanc intérieur).
 * Aucun dégradé, aucune image arrondie, aucune arche.
 *
 * Polices auto-hébergées (dossier polices/), sous licence SIL Open Font License 1.1 :
 *   - Antic Didone, de Santiago Orozco (Typemade), pour les titres ;
 *   - Proza Libre, de Jasper de Waard (Bureau Roffa), pour le texte (400, 400 italique, 600, 700).
 */
@font-face { font-family: "Antic Didone"; font-style: normal; font-weight: 400; font-display: swap; src: url("../polices/antic-didone-400.woff2") format("woff2"); }
@font-face { font-family: "Proza Libre"; font-style: normal; font-weight: 400; font-display: swap; src: url("../polices/proza-libre-400.woff2") format("woff2"); }
@font-face { font-family: "Proza Libre"; font-style: italic; font-weight: 400; font-display: swap; src: url("../polices/proza-libre-400-italique.woff2") format("woff2"); }
@font-face { font-family: "Proza Libre"; font-style: normal; font-weight: 600; font-display: swap; src: url("../polices/proza-libre-600.woff2") format("woff2"); }
@font-face { font-family: "Proza Libre"; font-style: normal; font-weight: 700; font-display: swap; src: url("../polices/proza-libre-700.woff2") format("woff2"); }

:root {
    --cip-lampone: #B8195A;
    --cip-lampone-scuro: #96124A;
    --cip-rosa: #FD4C90;
    --cip-accento: #A8174F;
    --cip-cipria: #FBEFF1;
    --cip-cipria-2: #F6E1E6;
    --cip-latte: #F7F2EC;
    --cip-bianco: #FFFFFF;
    --cip-inchiostro: #2B2427;
    --cip-testo: #3A3236;
    --cip-grigio: #6B6064;
    --cip-linea: #EADCDF;
    --cip-titoli: "Antic Didone", "Didot", "Bodoni 72", Georgia, serif;
    --cip-lettura: "Proza Libre", "Segoe UI", Roboto, Arial, sans-serif;
    --cip-testa: 72px;
    --cip-largo: 1240px;
    --cip-gronda: clamp(16px, 4vw, 40px);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: calc(var(--cip-testa) + 24px); -webkit-text-size-adjust: 100%; }
body.cip { margin: 0; background: var(--cip-bianco); color: var(--cip-testo); font-family: var(--cip-lettura); font-size: 17px; line-height: 1.7; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, svg, video, iframe { max-width: 100%; }
img { height: auto; }
a { color: var(--cip-accento); }
a:hover { color: var(--cip-inchiostro); }
:focus-visible { outline: 3px solid var(--cip-rosa); outline-offset: 3px; }
[id] { scroll-margin-top: calc(var(--cip-testa) + 24px); }
.cip-nascosto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cip-evitement { position: absolute; left: -999px; top: 8px; z-index: 100; background: var(--cip-inchiostro); color: #fff; padding: 10px 18px; }
.cip-evitement:focus { left: 12px; color: #fff; }

.cip-largo { width: 100%; max-width: calc(var(--cip-largo) + 2 * var(--cip-gronda)); margin: 0 auto; padding: 0 var(--cip-gronda); }
.cip-largo--lettura { max-width: calc(760px + 2 * var(--cip-gronda)); }

/* ---------- tratto (trace de rouge à lèvres) ---------- */
.cip-tratto { display: inline-block; flex: none; width: 34px; height: 8px; color: var(--cip-rosa); vertical-align: middle; }
.cip-sopratitolo { display: flex; align-items: center; gap: 12px; margin: 0 0 10px; font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--cip-grigio); }
.cip-titolo { margin: 0; font-family: var(--cip-titoli); font-weight: 400; font-size: clamp(32px, 3.4vw, 46px); line-height: 1.1; color: var(--cip-inchiostro); letter-spacing: .005em; }
.cip-titolo--medio { font-size: clamp(28px, 2.6vw, 36px); }
.cip-tutto { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: var(--cip-accento); text-decoration: none; border-bottom: 2px solid var(--cip-rosa); padding-bottom: 2px; white-space: nowrap; }
.cip-tutto::after { content: "→"; }
.cip-tutto:hover { color: var(--cip-inchiostro); }

/* ---------- en-tête ---------- */
.cip-testa { position: sticky; top: 0; z-index: 50; background: var(--cip-lampone); color: #fff; }
.cip-testa__riga { display: flex; align-items: center; gap: 28px; height: var(--cip-testa); }
.cip-testa__marchio { display: block; flex: none; line-height: 0; }
.cip-testa__marchio img { width: auto; height: 30px; }
.cip-menu { margin-left: auto; }
.cip-menu__lista { display: flex; gap: 4px; margin: 0; padding: 0; list-style: none; }
.cip-menu__lista a { display: block; padding: 10px 12px; color: #fff; text-decoration: none; font-size: 15px; font-weight: 600; letter-spacing: .01em; position: relative; }
.cip-menu__lista a::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 4px; height: 2px; background: #fff; transform: scaleX(0); transform-origin: left; transition: transform .2s; }
.cip-menu__lista a:hover::after, .cip-menu__lista a[aria-current]::after { transform: scaleX(1); }
.cip-testa__lente, .cip-testa__menu { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .45); cursor: pointer; }
.cip-testa__lente:hover, .cip-testa__menu:hover { background: rgba(255, 255, 255, .12); }
.cip-testa__menu { display: none; }
.cip-testa__righe { display: grid; gap: 5px; width: 20px; }
.cip-testa__righe span { display: block; height: 2px; background: currentColor; }
.cip-cerca { background: var(--cip-lampone-scuro); padding: 16px 0; }
.cip-cerca__modulo { display: flex; gap: 8px; max-width: 760px; }
.cip-cerca__modulo input { flex: 1; min-width: 0; height: 48px; padding: 0 16px; border: 1px solid var(--cip-linea); background: #fff; font: inherit; font-size: 16px; color: var(--cip-inchiostro); border-radius: 0; }
.cip-cerca__modulo button { flex: none; height: 48px; padding: 0 22px; border: 0; background: var(--cip-inchiostro); color: #fff; font: inherit; font-weight: 600; cursor: pointer; border-radius: 0; }
.cip-cerca .cip-cerca__modulo input { border-color: transparent; }
.cip-cerca__modulo--breve { width: min(360px, 100%); }
.cip-cerca__modulo--breve button { background: var(--cip-lampone); }
.cip-cerca__modulo--pagina { margin-top: 22px; }

/* ---------- boutons ---------- */
.cip-bottone { display: inline-flex; align-items: center; height: 50px; padding: 0 26px; background: var(--cip-lampone); color: #fff; text-decoration: none; font-weight: 600; font-size: 16px; border: 2px solid var(--cip-lampone); white-space: nowrap; }
.cip-bottone:hover { background: var(--cip-lampone-scuro); border-color: var(--cip-lampone-scuro); color: #fff; }
.cip-bottone--filo { background: transparent; color: var(--cip-accento); }
.cip-bottone--filo:hover { background: var(--cip-lampone); color: #fff; }

/* ---------- sections et fonds ---------- */
.cip-sezione { padding: clamp(52px, 6vw, 84px) 0; }
.cip-sezione--stretta { padding: clamp(36px, 4vw, 52px) 0; }
.cip-fond--bianco { background: var(--cip-bianco); }
.cip-fond--cipria { background: var(--cip-cipria); }
.cip-fond--latte { background: var(--cip-latte); }
.cip-capo { margin-bottom: 34px; }
.cip-capo--riga { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }

/* ---------- ouverture ---------- */
.cip-apertura { background: var(--cip-cipria); display: flex; align-items: center; min-height: min(760px, calc(100vh - var(--cip-testa) - 92px)); padding: 44px 0; }
.cip-apertura__griglia { display: grid; grid-template-columns: 1.12fr 1fr; gap: clamp(32px, 4.5vw, 72px); align-items: center; }
.cip-apertura__titolo { margin: 0 0 22px; font-family: var(--cip-titoli); font-weight: 400; font-size: clamp(44px, 4.3vw, 62px); line-height: 1.04; color: var(--cip-inchiostro); letter-spacing: -.005em; }
.cip-apertura__titolo em { font-style: normal; color: var(--cip-accento); }
.cip-apertura__cappello { margin: 0 0 30px; font-size: 18.5px; line-height: 1.65; max-width: 560px; }
.cip-apertura__bottoni { display: flex; flex-wrap: nowrap; gap: 12px; margin: 0; }
.cip-apertura__immagine { margin: 0; position: relative; aspect-ratio: 6 / 5; max-height: calc(100vh - var(--cip-testa) - 180px); min-height: 360px; justify-self: stretch; }
.cip-apertura__immagine img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cip-apertura__immagine::after { content: ""; position: absolute; inset: 14px; border: 1px solid rgba(255, 255, 255, .85); pointer-events: none; }

/* ---------- cartes ---------- */
.cip-carte { display: flex; flex-direction: column; min-width: 0; }
.cip-carte__image { display: block; position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: var(--cip-cipria-2); }
.cip-carte__image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.cip-carte:hover .cip-carte__image img { transform: scale(1.03); }
.cip-carte__image--vuota { display: flex; align-items: center; justify-content: center; }
.cip-carte__image--vuota .cip-tratto { width: 72px; height: 18px; }
.cip-carte__corps { padding-top: 14px; }
.cip-etiq { margin: 0 0 6px; font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--cip-grigio); }
.cip-carte__titre { margin: 0; font-family: var(--cip-lettura); font-weight: 600; font-size: 18px; line-height: 1.38; color: var(--cip-inchiostro); }
.cip-carte__titre a { color: inherit; text-decoration: none; background-image: linear-gradient(var(--cip-rosa), var(--cip-rosa)); background-size: 0 2px; background-repeat: no-repeat; background-position: 0 100%; transition: background-size .25s; }
.cip-carte:hover .cip-carte__titre a, .cip-carte__titre a:focus { background-size: 100% 2px; }
.cip-carte__chapo { margin: 8px 0 0; font-size: 15.5px; line-height: 1.6; color: var(--cip-grigio); }
.cip-carte__date { margin: 8px 0 0; font-size: 13.5px; color: var(--cip-grigio); }
.cip-carte--grande .cip-carte__image { aspect-ratio: 4 / 3; }
.cip-carte--grande .cip-carte__titre { font-family: var(--cip-titoli); font-weight: 400; font-size: clamp(28px, 2.6vw, 36px); line-height: 1.15; }
.cip-carte--grande .cip-carte__chapo { font-size: 16.5px; }
.cip-carte--riga { flex-direction: row; gap: 18px; align-items: flex-start; }
.cip-carte--riga .cip-carte__image { flex: none; width: 120px; aspect-ratio: 1 / 1; }
.cip-carte--riga .cip-carte__corps { padding-top: 0; }
.cip-carte--riga .cip-carte__titre { font-size: 17px; }
.cip-carte--alta .cip-carte__image { aspect-ratio: 4 / 5; }

/* rangées */
.cip-fila { display: grid; gap: 32px 28px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cip-fila--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cip-fila--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 900px; }
.cip-fila--1 { grid-template-columns: minmax(0, 420px); }
.cip-griglia { display: grid; gap: 40px 28px; grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* ---------- sélection ---------- */
.cip-selezione { display: grid; grid-template-columns: 1.35fr 1fr; gap: 48px; align-items: start; }
.cip-selezione__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.cip-selezione__lista li { display: grid; grid-template-columns: 54px 1fr; gap: 10px; padding: 22px 0; border-top: 1px solid var(--cip-linea); }
.cip-selezione__lista li:first-child { border-top: 0; padding-top: 0; }
.cip-selezione__n { font-family: var(--cip-titoli); font-size: 40px; line-height: .9; color: var(--cip-accento); }

/* ---------- vetrina des rubriques ---------- */
.cip-vetrina { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 22px; }
.cip-vetrina__voce a { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: var(--cip-inchiostro); background: var(--cip-bianco); border: 1px solid var(--cip-linea); }
.cip-vetrina__foto { display: block; aspect-ratio: 4 / 5; overflow: hidden; }
.cip-vetrina__foto img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.cip-vetrina__voce a:hover .cip-vetrina__foto img { transform: scale(1.03); }
.cip-vetrina__num { margin: 16px 18px 0; font-size: 12px; font-weight: 600; letter-spacing: .14em; color: var(--cip-grigio); }
.cip-vetrina__nome { margin: 4px 18px 0; font-family: var(--cip-titoli); font-size: 27px; line-height: 1.12; }
.cip-vetrina__testo { margin: 6px 18px 0; font-size: 14.5px; line-height: 1.5; color: var(--cip-grigio); }
.cip-vetrina__nb { margin: auto 18px 0; padding: 12px 0 16px; font-size: 13.5px; font-weight: 600; color: var(--cip-accento); }
.cip-vetrina__voce a:hover .cip-vetrina__nome { color: var(--cip-accento); }

/* ---------- en bref ---------- */
.cip-breve { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(32px, 5vw, 80px); align-items: center; }
.cip-breve__testo p:not(.cip-sopratitolo) { font-size: 18px; margin: 18px 0 0; max-width: 560px; }
.cip-breve__etichetta { border: 1.5px dashed var(--cip-accento); padding: 26px 30px; background: var(--cip-bianco); }
.cip-breve__titoletto { margin: 0 0 8px; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--cip-inchiostro); }
.cip-breve__etichetta ul { margin: 0 0 20px; padding: 0; list-style: none; }
.cip-breve__etichetta ul:last-child { margin-bottom: 0; }
.cip-breve__etichetta li { position: relative; padding: 7px 0 7px 26px; border-bottom: 1px dotted var(--cip-linea); font-size: 15.5px; line-height: 1.5; }
.cip-breve__etichetta li:last-child { border-bottom: 0; }
.cip-breve__etichetta li::before { content: ""; position: absolute; left: 0; top: 15px; width: 14px; height: 4px; background: var(--cip-rosa); }
.cip-breve__no li::before { background: var(--cip-grigio); height: 2px; top: 16px; }

/* ---------- corps : diptyque ---------- */
.cip-dittico { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: start; }
.cip-dittico__immagine { display: block; aspect-ratio: 4 / 3; overflow: hidden; }
.cip-dittico__immagine img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cip-dittico__titolo { margin: 18px 0 8px; font-family: var(--cip-titoli); font-weight: 400; font-size: clamp(26px, 2.4vw, 34px); line-height: 1.15; }
.cip-dittico__titolo a { color: var(--cip-inchiostro); text-decoration: none; }
.cip-dittico__titolo a:hover { color: var(--cip-accento); }
.cip-dittico__cappello { margin: 0; color: var(--cip-grigio); }
.cip-dittico__altri { display: grid; gap: 26px; }

/* ---------- capelli + unghie ---------- */
.cip-coppia { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.cip-coppia--sola { grid-template-columns: minmax(0, 620px); }
.cip-coppia__testa { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-bottom: 14px; margin-bottom: 22px; border-bottom: 2px solid var(--cip-inchiostro); }
.cip-coppia__nome { margin: 0; font-family: var(--cip-titoli); font-weight: 400; font-size: 28px; color: var(--cip-inchiostro); }
.cip-coppia__carte { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.cip-coppia__carte--1 { grid-template-columns: minmax(0, 300px); }

/* ---------- centri e guide ---------- */
.cip-guide { display: grid; grid-template-columns: 1fr 1.4fr; gap: clamp(32px, 5vw, 72px); align-items: start; }
.cip-guide__intro { margin: 16px 0 22px; color: var(--cip-grigio); }
.cip-guide__liste { display: grid; gap: 28px; }

/* ---------- indice ---------- */
.cip-indice { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 48px; }
.cip-indice li { display: grid; grid-template-columns: 52px 1fr; gap: 8px; padding: 18px 0; border-top: 1px solid var(--cip-linea); }
.cip-indice__n { font-family: var(--cip-titoli); font-size: 30px; line-height: 1; color: var(--cip-accento); }
.cip-indice__titolo { display: block; font-weight: 600; font-size: 17px; line-height: 1.4; color: var(--cip-inchiostro); text-decoration: none; }
.cip-indice__titolo:hover { color: var(--cip-accento); }
.cip-indice__meta { display: block; margin-top: 4px; font-size: 13.5px; color: var(--cip-grigio); }

/* ---------- rédaction ---------- */
.cip-redazione { display: grid; grid-template-columns: 280px 1fr; gap: 40px; align-items: center; }
.cip-redazione__lista { display: grid; gap: 24px; }
.cip-autore { display: flex; gap: 22px; align-items: flex-start; }
.cip-autore__ritratto { flex: none; display: block; width: 96px; height: 96px; overflow: hidden; outline: 1px solid var(--cip-linea); outline-offset: 4px; }
.cip-autore__ritratto img, .cip-autore__ritratto img.avatar { display: block; width: 96px; height: 96px; max-width: none; object-fit: cover; }
.cip-autore__nome { margin: 0; font-family: var(--cip-titoli); font-size: 28px; line-height: 1.1; }
.cip-autore__nome a { color: var(--cip-inchiostro); text-decoration: none; }
.cip-autore__nb { margin: 4px 0 0; font-size: 13.5px; font-weight: 600; color: var(--cip-accento); }
.cip-autore__bio { margin: 8px 0 0; font-size: 15.5px; color: var(--cip-grigio); max-width: 640px; }

/* ---------- panneau SEO + FAQ ---------- */
.cip-pannello { display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(32px, 5vw, 64px); background: var(--cip-cipria); padding: clamp(28px, 4vw, 56px); }
.cip-pannello__testo p:not(.cip-sopratitolo) { font-size: 16px; margin: 16px 0 0; }
.cip-pannello__faq-titolo { margin: 0 0 12px; font-family: var(--cip-titoli); font-weight: 400; font-size: 28px; color: var(--cip-inchiostro); }
.cip-pannello__faq details { background: var(--cip-bianco); border-left: 3px solid var(--cip-rosa); margin-bottom: 10px; }
.cip-pannello__faq summary { cursor: pointer; padding: 16px 44px 16px 18px; font-weight: 600; font-size: 16px; color: var(--cip-inchiostro); list-style: none; position: relative; }
.cip-pannello__faq summary::-webkit-details-marker { display: none; }
.cip-pannello__faq summary::after { content: "+"; position: absolute; right: 18px; top: 12px; font-size: 22px; color: var(--cip-accento); }
.cip-pannello__faq details[open] summary::after { content: "–"; }
.cip-pannello__faq details p { margin: 0; padding: 0 18px 18px; font-size: 15.5px; }

/* ---------- fil d'Ariane, pagination, pastilles ---------- */
.cip-briciole { font-size: 13.5px; color: var(--cip-grigio); margin-bottom: 18px; }
.cip-briciole a { color: var(--cip-grigio); }
.cip-briciole a:hover { color: var(--cip-accento); }
.cip-pagine { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 48px; }
.cip-pagine .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 14px; border: 1px solid var(--cip-linea); color: var(--cip-inchiostro); text-decoration: none; font-weight: 600; }
.cip-pagine .page-numbers.current { background: var(--cip-lampone); border-color: var(--cip-lampone); color: #fff; }
.cip-pagine a.page-numbers:hover { border-color: var(--cip-lampone); color: var(--cip-accento); }
.cip-pillole { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; justify-content: center; }
.cip-pillole a { display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px; background: var(--cip-bianco); border: 1px solid var(--cip-linea); color: var(--cip-inchiostro); text-decoration: none; font-weight: 600; font-size: 15px; }
.cip-pillole a:hover, .cip-pillole a[aria-current] { border-color: var(--cip-lampone); color: var(--cip-accento); }
.cip-pillole__num { font-family: var(--cip-titoli); font-size: 18px; color: var(--cip-accento); }
.cip-pillole--perso { justify-content: flex-start; margin-top: 28px; }

/* ---------- rubrique ---------- */
.cip-rub-testa { background: var(--cip-cipria); padding: clamp(32px, 4vw, 56px) 0; }
.cip-rub-testa__griglia { display: grid; grid-template-columns: minmax(0, 560px) 1fr; gap: clamp(28px, 4vw, 64px); align-items: center; }
.cip-rub-testa--senza-foto .cip-rub-testa__griglia { grid-template-columns: 1fr; }
.cip-rub-testa__foto { margin: 0; position: relative; aspect-ratio: 4 / 3; }
.cip-rub-testa__foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cip-rub-testa__foto::after { content: ""; position: absolute; inset: 12px; border: 1px solid rgba(255, 255, 255, .85); pointer-events: none; }
.cip-rub-testa__num { display: flex; align-items: center; gap: 14px; margin: 0 0 8px; font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--cip-grigio); }
.cip-rub-testa__num span { color: var(--cip-accento); }
.cip-rub-testa__titolo { margin: 0; font-family: var(--cip-titoli); font-weight: 400; font-size: clamp(42px, 4.4vw, 62px); line-height: 1.05; color: var(--cip-inchiostro); }
.cip-rub-testa__titolo--medio { font-size: clamp(34px, 3.4vw, 48px); }
.cip-rub-testa__intro { margin: 16px 0 0; font-size: 18px; max-width: 620px; }
.cip-rub-testa__nb { margin: 14px 0 0; font-size: 14.5px; font-weight: 600; color: var(--cip-accento); }
.cip-rub-testa__chi { display: flex; gap: 28px; align-items: center; }
.cip-rub-testa__ritratto { flex: none; display: block; width: 120px; height: 120px; overflow: hidden; outline: 1px solid var(--cip-accento); outline-offset: 5px; }
.cip-rub-testa__ritratto img, .cip-rub-testa__ritratto img.avatar { display: block; width: 120px; height: 120px; max-width: none; object-fit: cover; }
.cip-perso { padding: clamp(56px, 8vw, 110px) 0; }

/* ---------- article ---------- */
.cip-articolo-testa { background: var(--cip-cipria); padding: clamp(32px, 4vw, 56px) 0 calc(clamp(32px, 4vw, 56px) + 120px); text-align: center; }
.cip-articolo--senza-immagine .cip-articolo-testa { padding-bottom: clamp(32px, 4vw, 56px); }
.cip-articolo-testa .cip-sopratitolo { justify-content: center; }
.cip-articolo-testa__titolo { margin: 0; font-family: var(--cip-titoli); font-weight: 400; font-size: clamp(36px, 4vw, 56px); line-height: 1.08; color: var(--cip-inchiostro); }
.cip-articolo-testa__cappello { margin: 18px auto 0; max-width: 680px; font-size: 18px; line-height: 1.65; }
.cip-firma { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px 14px; margin: 24px 0 0; font-size: 14.5px; color: var(--cip-grigio); }
.cip-firma__ritratto { flex: none; display: block; width: 40px; height: 40px; overflow: hidden; }
.cip-firma__ritratto img, .cip-firma__ritratto img.avatar { display: block; width: 40px; height: 40px; max-width: none; object-fit: cover; }
.cip-firma__chi a { color: var(--cip-inchiostro); font-weight: 600; text-decoration: none; }
.cip-firma time::before { content: "·"; margin-right: 14px; }
.cip-articolo__immagine { margin: -120px auto 0; max-width: calc(1040px + 2 * var(--cip-gronda)); }
.cip-articolo__immagine img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.cip-etichetta { display: flex; flex-wrap: wrap; margin: 32px 0 36px; border: 1.5px dashed var(--cip-accento); background: var(--cip-bianco); }
.cip-etichetta > div { flex: 1 1 150px; padding: 14px 18px; border-right: 1px dotted var(--cip-linea); }
.cip-etichetta > div:last-child { border-right: 0; }
.cip-etichetta dt { font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--cip-grigio); }
.cip-etichetta dd { margin: 3px 0 0; font-size: 15px; font-weight: 600; color: var(--cip-inchiostro); }
.cip-etichetta dd a { color: var(--cip-inchiostro); }
.cip-etichetta__pot dd { display: flex; align-items: center; gap: 10px; }
.cip-pot { position: relative; display: inline-block; width: 34px; height: 34px; color: var(--cip-accento); }
.cip-pot svg { display: block; width: 34px; height: 34px; }
.cip-pot__n { position: absolute; left: 0; right: 0; top: 17px; text-align: center; font-size: 9.5px; font-weight: 700; letter-spacing: -.02em; }
.cip-dasapere { margin: 44px 0 56px; padding: 22px 26px; background: var(--cip-cipria); border-left: 4px solid var(--cip-lampone); }
.cip-dasapere__titolo { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; font-weight: 700; color: var(--cip-inchiostro); }
.cip-dasapere p:last-child { margin: 0; font-size: 15.5px; }

/* ---------- texte des articles et des pages (contenu jamais modifié : seulement habillé) ---------- */
.cip-testo { font-size: 17.5px; line-height: 1.78; color: var(--cip-testo); overflow-wrap: break-word; }
.cip-testo > * { max-width: 100%; }
.cip-testo p { margin: 0 0 1.2em; }
.cip-testo h2 { margin: 1.9em 0 .7em; padding-bottom: 14px; font-family: var(--cip-titoli); font-weight: 400; font-size: clamp(28px, 2.6vw, 36px); line-height: 1.15; color: var(--cip-inchiostro); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 14'%3E%3Cpath d='M3 9.6C14 5.2 33 3 58.6 3.4c2.6 0 3.3 2.2.8 2.7C42 9 24 9.7 6.6 12.4 2.4 13 .4 10.7 3 9.6Z' fill='%23FD4C90'/%3E%3C/svg%3E") no-repeat 0 100% / 56px 12px; }
.cip-testo h3 { margin: 1.6em 0 .5em; font-family: var(--cip-lettura); font-weight: 700; font-size: 20px; line-height: 1.35; color: var(--cip-inchiostro); }
.cip-testo h4 { margin: 1.4em 0 .4em; font-weight: 700; font-size: 17.5px; color: var(--cip-inchiostro); }
.cip-testo a { color: var(--cip-accento); text-decoration-color: rgba(168, 23, 79, .4); text-underline-offset: 3px; }
.cip-testo a:hover { text-decoration-color: currentColor; }
.cip-testo ul, .cip-testo ol { margin: 0 0 1.3em; padding-left: 1.3em; }
.cip-testo li { margin-bottom: .45em; }
.cip-testo ul > li::marker { color: var(--cip-rosa); }
.cip-testo ol > li::marker { color: var(--cip-accento); font-weight: 700; }
.cip-testo img { height: auto; }
.cip-testo figure { margin: 1.6em 0; }
.cip-testo figcaption { font-size: 14px; color: var(--cip-grigio); margin-top: 8px; }
.cip-testo blockquote { margin: 1.6em 0; padding: 4px 0 4px 24px; border-left: 3px solid var(--cip-rosa); font-style: italic; color: var(--cip-inchiostro); }
.cip-testo table { width: 100%; border-collapse: collapse; margin: 1.6em 0; font-size: 15.5px; display: block; overflow-x: auto; }
.cip-testo th, .cip-testo td { padding: 10px 12px; border: 1px solid var(--cip-linea); text-align: left; vertical-align: top; }
.cip-testo th { background: var(--cip-cipria); color: var(--cip-inchiostro); }
.cip-testo hr { border: 0; border-top: 1px solid var(--cip-linea); margin: 2em 0; }
/* encadré d'ouverture des articles (styles en ligne d'origine, ramenés à la palette) */
.cip-testo > div[style*="border-left:4px solid"] { background: var(--cip-cipria) !important; border-left-color: var(--cip-lampone) !important; border-radius: 0 !important; }
/* sommaire Easy TOC */
.cip-testo #ez-toc-container { width: 100% !important; margin: 0 0 1.8em !important; padding: 18px 22px !important; background: var(--cip-latte) !important; border: 1.5px dashed var(--cip-accento) !important; border-radius: 0 !important; box-shadow: none !important; }
.cip-testo #ez-toc-container .ez-toc-title { font-family: var(--cip-lettura); font-weight: 700; color: var(--cip-inchiostro); }
.cip-testo #ez-toc-container a { color: var(--cip-inchiostro); text-decoration: none; }
.cip-testo #ez-toc-container a:hover { color: var(--cip-accento); }
/* encarts « da leggere » d'Intelly Related Posts (liens internes) */
.cip-testo div[style*="clear:both"] > a { background-color: var(--cip-latte) !important; border-left-color: var(--cip-lampone) !important; }
/* boîte d'auteur de Simple Author Box */
.cip-testo .saboxplugin-wrap { display: grid !important; grid-template-columns: 100px 1fr; gap: 6px 22px; margin-top: 2.4em; padding: 22px; border: 1px solid var(--cip-linea) !important; background: var(--cip-latte); border-radius: 0 !important; }
.cip-testo .saboxplugin-wrap .saboxplugin-tab { display: contents; }
.cip-testo .saboxplugin-wrap .saboxplugin-gravatar { grid-row: span 2; float: none !important; padding: 0 !important; width: 100px; height: 100px; overflow: hidden; }
.cip-testo .saboxplugin-wrap .saboxplugin-gravatar img { display: block; width: 100px !important; height: 100px !important; max-width: none !important; object-fit: cover; border-radius: 0 !important; }
.cip-testo .saboxplugin-wrap .saboxplugin-authorname { margin: 0 !important; font-family: var(--cip-titoli); font-size: 26px; }
.cip-testo .saboxplugin-wrap .saboxplugin-authorname a { color: var(--cip-inchiostro); text-decoration: none; }
.cip-testo .saboxplugin-wrap .saboxplugin-desc { margin: 0 !important; font-size: 15.5px; color: var(--cip-grigio); }
.cip-testo .saboxplugin-wrap .clearfix { display: none; }
.cip-testo--pagina h2 { font-size: clamp(24px, 2.2vw, 30px); }

/* ---------- page ---------- */
.cip-pagina__testa { background: var(--cip-cipria); padding: clamp(32px, 4vw, 56px) 0; }
.cip-pagina__titolo { margin: 0; font-family: var(--cip-titoli); font-weight: 400; font-size: clamp(38px, 4vw, 56px); line-height: 1.08; color: var(--cip-inchiostro); }
.cip-pagina__corpo { padding-top: 40px; padding-bottom: 64px; }

/* ---------- pied ---------- */
.cip-piede { background: var(--cip-lampone); color: #fff; padding: 56px 0 26px; font-size: 15px; }
.cip-piede__griglia { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 40px; }
.cip-piede__logo { display: inline-block; line-height: 0; margin-bottom: 18px; }
.cip-piede__logo img { width: auto; height: 34px; }
.cip-piede__marchio p { margin: 0 0 10px; max-width: 440px; color: rgba(255, 255, 255, .92); line-height: 1.6; }
.cip-piede__avviso { font-weight: 600; color: #fff !important; }
.cip-piede__titolo { margin: 0 0 12px; font-size: 12.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: rgba(255, 255, 255, .8); }
.cip-piede__col ul { margin: 0; padding: 0; list-style: none; }
.cip-piede__col li { margin-bottom: 8px; }
.cip-piede a { color: #fff; text-decoration: none; }
.cip-piede__col a:hover { text-decoration: underline; text-underline-offset: 4px; }
.cip-piede__basso { margin: 40px 0 0; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .3); font-size: 13.5px; color: rgba(255, 255, 255, .85); }

/* ---------- moyens écrans ---------- */
@media (max-width: 1180px) {
    .cip-menu__lista a { padding: 10px 8px; font-size: 14.5px; }
    .cip-menu__lista a::after { left: 8px; right: 8px; }
    .cip-testa__riga { gap: 18px; }
    .cip-vetrina { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .cip-fila { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cip-fila--1 { grid-template-columns: minmax(0, 420px); }
}
@media (max-width: 1020px) {
    .cip-testa__menu { display: inline-flex; }
    .cip-menu { position: absolute; left: 0; right: 0; top: var(--cip-testa); background: var(--cip-lampone-scuro); display: none; margin: 0; }
    .cip-menu.cip-aperto { display: block; }
    .cip-menu__lista { flex-direction: column; padding: 8px var(--cip-gronda) 16px; }
    .cip-menu__lista a { padding: 12px 0; font-size: 16px; }
    .cip-menu__lista a::after { left: 0; right: auto; width: 40px; }
    .cip-testa__lente { margin-left: auto; }
    .cip-apertura { min-height: 0; }
    .cip-apertura__griglia, .cip-selezione, .cip-dittico, .cip-guide, .cip-breve, .cip-pannello, .cip-redazione { grid-template-columns: 1fr; }
    .cip-coppia { grid-template-columns: 1fr; }
    .cip-griglia { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cip-rub-testa__griglia { grid-template-columns: 1fr; }
    .cip-rub-testa__foto { max-width: 640px; }
    .cip-piede__griglia { grid-template-columns: 1fr 1fr; }
    .cip-piede__marchio { grid-column: 1 / -1; }
}

/* ---------- mobile : ordre du hero surtitre, H1, chapô, IMAGE, boutons ---------- */
@media (max-width: 700px) {
    body.cip { font-size: 16.5px; }
    :root { --cip-testa: 64px; }
    .cip-testa__marchio img { height: 24px; }
    .cip-apertura { padding: 28px 0 36px; }
    .cip-apertura__griglia { display: flex; flex-direction: column; gap: 18px; align-items: stretch; }
    .cip-apertura__testo { display: contents; }
    .cip-apertura__sopra { order: 1; margin: 0; }
    .cip-apertura__titolo { order: 2; margin: 0; font-size: 40px; }
    .cip-apertura__cappello { order: 3; margin: 0; font-size: 17px; }
    .cip-apertura__immagine { order: 4; min-height: 0; max-height: none; }
    .cip-apertura__bottoni { order: 5; }
    .cip-bottone { height: 48px; padding: 0 18px; font-size: 15px; }
    .cip-vetrina { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
    .cip-vetrina__voce:last-child { grid-column: 1 / -1; }
    .cip-vetrina__voce:last-child .cip-vetrina__foto { aspect-ratio: 16 / 10; }
    .cip-vetrina__nome { font-size: 23px; margin: 4px 14px 0; }
    .cip-vetrina__num, .cip-vetrina__testo { margin-left: 14px; margin-right: 14px; }
    .cip-vetrina__nb { margin-left: 14px; margin-right: 14px; }
    .cip-fila, .cip-fila--2, .cip-fila--3, .cip-griglia { grid-template-columns: 1fr; }
    .cip-coppia__carte { grid-template-columns: 1fr 1fr; gap: 14px; }
    .cip-indice { grid-template-columns: 1fr; }
    .cip-carte--riga .cip-carte__image { width: 96px; }
    .cip-selezione__lista li { grid-template-columns: 40px 1fr; }
    .cip-selezione__n { font-size: 32px; }
    .cip-autore__ritratto, .cip-autore__ritratto img, .cip-autore__ritratto img.avatar { width: 80px; height: 80px; max-width: none; }
    .cip-rub-testa__chi { flex-direction: column; align-items: flex-start; gap: 18px; }
    .cip-rub-testa__ritratto, .cip-rub-testa__ritratto img, .cip-rub-testa__ritratto img.avatar { width: 96px; height: 96px; max-width: none; }
    .cip-firma__ritratto img, .cip-firma__ritratto img.avatar { max-width: none; }
    .cip-articolo-testa { padding-bottom: calc(32px + 60px); }
    .cip-articolo__immagine { margin-top: -60px; }
    .cip-etichetta > div { flex: 1 1 45%; border-bottom: 1px dotted var(--cip-linea); }
    .cip-testo { font-size: 17px; }
    .cip-testo .saboxplugin-wrap { grid-template-columns: 72px 1fr; }
    .cip-testo .saboxplugin-wrap .saboxplugin-gravatar, .cip-testo .saboxplugin-wrap .saboxplugin-gravatar img { width: 72px !important; height: 72px !important; max-width: none !important; }
    .cip-piede__griglia { grid-template-columns: 1fr; }
    .cip-cerca__modulo--breve { width: 100%; }
}
