/* ============ Font (ospitati sul sito, solo caratteri latini) ============ */
@font-face { font-family: "Bodoni Moda"; src: url(/assets/fonts/bodoni.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Bodoni Moda"; src: url(/assets/fonts/bodoni-italic.woff2) format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Literata"; src: url(/assets/fonts/literata.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Literata"; src: url(/assets/fonts/literata-italic.woff2) format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Literata"; src: url(/assets/fonts/literata-600.woff2) format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }

/* ============ Token ============ */
:root {
  --notte: #1F1120;      /* fondo: velluto prugna di notte */
  --velluto: #2C182D;    /* superfici */
  --piega: #45294A;      /* linee e bordi */
  --carta: #ECDDD5;      /* testo */
  --cipria: #BFA1A6;     /* testo secondario */
  --lume: #E3B866;       /* luce di candela: link e dettagli */
  --cera: #7A1730;       /* ceralacca: azioni */
  --cera-hi: #962039;
  --display: "Bodoni Moda", "Didot", "Bodoni 72", Georgia, serif;
  --text: "Literata", Georgia, "Times New Roman", serif;
  --measure: 38rem;
  --gutter: clamp(1.1rem, 4vw, 2.5rem);
  color-scheme: dark;
  box-sizing: border-box;
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
*, *::before, *::after { box-sizing: inherit; }
html { scroll-padding-top: env(safe-area-inset-top, 0px); -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--notte); color: var(--carta);
  font: 400 1.0625rem/1.7 var(--text);
  font-optical-sizing: auto;
  text-rendering: optimizeLegibility;
}
body.locked { overflow: hidden; }
img { max-width: 100%; height: auto; }
a { color: var(--lume); text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { color: #F3D39A; }
:focus-visible { outline: 2px solid var(--lume); outline-offset: 3px; }
.skip { position: absolute; left: -999px; top: .5rem; background: var(--lume); color: var(--notte); padding: .5rem 1rem; z-index: 100; }
.skip:focus { left: .5rem; }
h1, h2, h3 { font-family: var(--display); font-weight: 400; line-height: 1.1; margin: 0 0 .5em; }

/* ============ Header ============ */
.site-head {
  display: flex; align-items: baseline; gap: 1.5rem 2.5rem; flex-wrap: wrap;
  padding: 1.25rem var(--gutter); border-bottom: 1px solid var(--piega);
}
.brand { font: italic 400 1.6rem/1 var(--display); color: var(--lume); text-decoration: none; white-space: nowrap; }
.cat-nav { display: flex; gap: 1.4rem; overflow-x: auto; scrollbar-width: none; flex: 1; min-width: 0; }
.cat-nav::-webkit-scrollbar { display: none; }
.cat-nav a { color: var(--cipria); text-decoration: none; white-space: nowrap; font-size: .95rem; padding: .25rem 0; }
.cat-nav a:hover { color: var(--carta); }

main { display: block; }

/* ============ Hero: il lume di candela ============ */
.hero {
  position: relative; overflow: hidden;
  min-height: min(68vh, 40rem);
  display: grid; place-items: center;
  padding: 4rem var(--gutter);
  --x: 50%; --y: 45%;
}
.hero::before {
  content: ""; position: absolute; inset: -20%;
  background: radial-gradient(circle at var(--x) var(--y), rgba(227,184,102,.20) 0, rgba(122,23,48,.16) 22%, transparent 52%);
  pointer-events: none;
}
.hero-inner { position: relative; text-align: center; max-width: 60rem; }
.hero h1 {
  font-style: italic; font-weight: 400;
  font-size: clamp(3.4rem, 13vw, 10.5rem); line-height: .95; letter-spacing: -.02em;
  margin: 0 0 .35em;
  --hx: 50%; --hy: 50%;
  background: radial-gradient(circle at var(--hx) var(--hy), #F6DDA6 0, var(--carta) 22%, #A68A9E 55%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.hero-sub { max-width: 30rem; margin: 0 auto; color: var(--cipria); font-size: 1.15rem; line-height: 1.6; }
@media (prefers-reduced-motion: no-preference) {
  .hero.static::before { animation: flicker 6s ease-in-out infinite; }
}
@keyframes flicker { 0%,100% { opacity: 1; } 40% { opacity: .82; } 55% { opacity: .95; } 70% { opacity: .78; } }

/* ============ Sezioni ============ */
.section-title { font-size: 1.5rem; font-style: italic; color: var(--cipria); margin-bottom: 1.25rem; }
.index-cats, .two-col, .seo-text, .page-head, .crumbs, .related {
  max-width: 72rem; margin-inline: auto; padding-inline: var(--gutter);
}
.index-cats { padding-block: 1rem 3.5rem; }
.cat-index { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); column-gap: 3rem; }
.cat-index a {
  display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;
  padding: 1rem 0; border-bottom: 1px solid var(--piega); text-decoration: none; color: var(--carta);
}
.ci-name { font: 400 clamp(1.7rem, 4vw, 2.4rem)/1.1 var(--display); transition: color .2s; }
.ci-count { color: var(--cipria); font-size: .9rem; white-space: nowrap; }
.cat-index a:hover .ci-name { color: var(--lume); }

.two-col { display: grid; gap: 3.5rem; padding-block: 1rem 4rem; }
@media (min-width: 960px) { .two-col { grid-template-columns: minmax(0, 1fr) 20rem; } }

/* Elenco racconti */
.story-list { list-style: none; margin: 0; padding: 0; }
.story-list li { padding: 1.6rem 0; border-bottom: 1px solid var(--piega); }
.story-list li:first-child { padding-top: 0; }
.sl-cat { font-style: italic; font-size: .95rem; text-decoration: none; }
.story-list h3 { font-size: clamp(1.6rem, 3.4vw, 2.1rem); margin: .2em 0 .35em; }
.story-list h3 a { color: var(--carta); text-decoration: none; }
.story-list h3 a:hover { color: var(--lume); }
.story-list p { margin: 0; max-width: var(--measure); }
.story-list .sl-meta { color: var(--cipria); font-size: .88rem; margin-top: .6rem; }

.side { align-self: start; }
@media (min-width: 960px) { .side { position: sticky; top: 1.5rem; } }
.pop-list { margin: 0 0 2.5rem; padding-left: 1.4rem; color: var(--cipria); font-family: var(--display); }
.pop-list li { margin-bottom: 1rem; padding-left: .3rem; }
.pop-list a { display: block; font-family: var(--text); color: var(--carta); text-decoration: none; line-height: 1.35; }
.pop-list a:hover { color: var(--lume); }
.pop-list span { font: italic .85rem var(--text); }
.side-cats { list-style: none; padding: 0; margin: 0; }
.side-cats li { border-bottom: 1px solid var(--piega); }
.side-cats a { display: block; padding: .6rem 0; font: 1.25rem var(--display); color: var(--carta); text-decoration: none; }
.side-cats a:hover { color: var(--lume); }

.seo-text { padding-block: 1rem 4rem; }
.seo-text.prose { max-width: 72rem; }
.seo-text > * { max-width: var(--measure); }
.prose { max-width: var(--measure); }
.prose h2 { font-size: 1.7rem; margin-top: 1.5em; }
.prose p { margin: 0 0 1.15em; }
.seo-text p { color: var(--cipria); }

/* Testate pagine */
.crumbs { padding-top: 1.5rem; font-size: .9rem; color: var(--cipria); }
.crumbs a { color: var(--cipria); }
.page-head { padding-block: 1.25rem 2.5rem; }
.page-head h1 { font-size: clamp(2.4rem, 7vw, 4.8rem); font-style: italic; max-width: 16ch; }
.lede { max-width: var(--measure); font-size: 1.2rem; color: var(--cipria); margin: 0; }
.empty { color: var(--cipria); font-style: italic; }
.pager { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-top: 2rem; color: var(--cipria); font-size: .95rem; }

/* ============ Racconto ============ */
.progress { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 30; pointer-events: none; }
.progress span { display: block; height: 100%; width: 0; background: var(--lume); }
.story { max-width: calc(var(--measure) + 2 * var(--gutter)); margin: 0 auto; padding: 0 var(--gutter) 3rem; }
.story .crumbs { padding-inline: 0; }
.story-head { padding: 2rem 0 2.5rem; }
.story-head h1 { font-size: clamp(2.6rem, 8vw, 4.6rem); font-style: italic; letter-spacing: -.01em; }
.story-meta { color: var(--cipria); font-size: .92rem; margin: 0; }
.story-body { font-size: clamp(1.1rem, 2.2vw, 1.22rem); line-height: 1.85; }
.story-body > p:first-child::first-letter {
  float: left; font: 400 4.6em/.8 var(--display); color: var(--lume);
  padding: .08em .1em 0 0;
}
.mid-cta { margin: 2.2em 0; padding: .2em 0 .2em 1.2em; border-left: 2px solid var(--cera-hi); font-style: italic; color: var(--cipria); font-size: .95em; }
.mid-cta p { margin: 0; }
.fin { text-align: center; color: var(--lume); font: 1.6rem var(--display); margin: 2.5rem 0 0; }

/* Sigillo di ceralacca: la CTA principale */
.seal-cta {
  position: relative; text-align: center;
  margin: 4.5rem 0 1rem; padding: 3.2rem clamp(1.2rem, 4vw, 2.5rem) 2rem;
  background: radial-gradient(ellipse at 50% 0%, rgba(150,32,57,.35), transparent 70%), var(--velluto);
  border: 1px solid var(--piega); border-radius: 3px;
}
.side .seal-cta { margin-top: 3rem; }
.seal {
  position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%) rotate(-8deg);
  width: 4.4rem; height: 4.4rem; display: grid; place-items: center;
  border-radius: 47% 53% 51% 49% / 53% 47% 52% 48%;
  background: radial-gradient(circle at 38% 32%, #B03050, var(--cera) 55%, #4E0C1E);
  box-shadow: inset 0 0 0 5px rgba(0,0,0,.18), inset 0 0 0 7px rgba(227,184,102,.25), 0 6px 18px rgba(0,0,0,.45);
  font: italic 1.35rem/1 var(--display); color: var(--lume);
}
.seal-cta .seal-title { font: italic 400 clamp(1.5rem, 3.5vw, 2rem)/1.15 var(--display); color: var(--carta); margin: 0 auto .6em; }
.seal-cta p { color: var(--cipria); margin: 0 auto 1.4rem; max-width: 30rem; }
.seal-cta .seal-note { font-size: .8rem; margin: 1rem 0 0; }
.btn-seal {
  display: inline-block; cursor: pointer;
  font: 600 1rem/1.2 var(--text); color: #F7E8CB; text-decoration: none;
  background: var(--cera); border: 1px solid rgba(227,184,102,.45); border-radius: 2px;
  padding: .95rem 1.8rem;
  transition: background .2s;
}
.btn-seal:hover { background: var(--cera-hi); color: #fff; }
.btn-seal.small { padding: .6rem 1rem; font-size: .92rem; }

.related { padding-block: 2rem 4rem; }
.rel-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 2rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }
.rel-list h3 { font-size: 1.6rem; font-style: italic; }
.rel-list h3 a { color: var(--carta); text-decoration: none; }
.rel-list h3 a:hover { color: var(--lume); }
.rel-list p { color: var(--cipria); margin: 0; font-size: .98rem; }

.sticky-cta {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 25;
  display: flex; align-items: center; gap: .8rem;
  padding: .7rem var(--gutter) calc(.7rem + env(safe-area-inset-bottom, 0px));
  background: rgba(44,24,45,.97); border-top: 1px solid var(--piega);
  transform: translateY(0); transition: transform .35s ease;
}
.sticky-cta[hidden] { display: flex; transform: translateY(110%); visibility: hidden; }
.sticky-cta p { margin: 0; flex: 1; font: italic 1.05rem/1.3 var(--display); }
.sticky-close { background: none; border: 0; color: var(--cipria); font-size: 1.6rem; line-height: 1; cursor: pointer; padding: .2rem .4rem; }

/* ============ Footer ============ */
.site-foot { border-top: 1px solid var(--piega); background: var(--velluto); }
.foot-inner { max-width: 72rem; margin: 0 auto; padding: 3rem var(--gutter) 3.5rem; }
.foot-brand { font: italic 1.8rem/1 var(--display); color: var(--lume); margin: 0 0 .3rem; }
.foot-tag { color: var(--cipria); margin: 0 0 1.8rem; }
.foot-cats { display: flex; flex-wrap: wrap; gap: .5rem 1.6rem; margin-bottom: 2rem; }
.foot-cats a { color: var(--carta); font-size: .92rem; }
.foot-legal { font-size: .82rem; color: var(--cipria); max-width: 48rem; margin: 0; line-height: 1.6; }
.foot-legal a { color: var(--cipria); }

/* ============ Verifica età ============ */
.age-gate {
  position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 1.5rem;
  background: rgba(24,10,24,.9);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
}
.age-gate[hidden] { display: none; }
.age-box { max-width: 30rem; text-align: center; }
.age-brand { font: italic 1.5rem var(--display); color: var(--lume); margin: 0 0 1.5rem; }
.age-box h2 { font-size: clamp(1.9rem, 6vw, 2.6rem); font-style: italic; }
.age-box p { color: var(--cipria); }
.age-actions { display: flex; flex-direction: column; align-items: center; gap: 1rem; margin-top: 2rem; }
.age-no { color: var(--cipria); font-size: .95rem; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ============ Admin ============ */
.admin { font-size: 1rem; }
.adm-head { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding: 1rem var(--gutter); border-bottom: 1px solid var(--piega); }
.adm-head a { color: var(--lume); text-decoration: none; }
.adm-head nav { display: flex; gap: 1.2rem; }
.adm-main { max-width: 64rem; margin: 0 auto; padding: 2rem var(--gutter) 4rem; }
.adm-main h1 { font-size: 2.4rem; font-style: italic; }
.adm-main h2 { font-size: 1.5rem; margin-top: 2.5rem; display: flex; gap: 1rem; align-items: baseline; }
.adm-add { font: .9rem var(--text); }
.adm-flash { background: var(--velluto); border-left: 3px solid var(--lume); padding: .8rem 1rem; }
.adm-err { color: #F2A0AE; }
.adm-form { display: grid; gap: 1.1rem; }
.adm-form.narrow { max-width: 22rem; }
.adm-form label { display: grid; gap: .35rem; font-size: .9rem; color: var(--cipria); }
.adm-form small { color: var(--cipria); }
.adm-form input, .adm-form select, .adm-form textarea {
  font: 1rem/1.5 var(--text); color: var(--carta); background: var(--velluto);
  border: 1px solid var(--piega); border-radius: 2px; padding: .6rem .7rem; width: 100%;
}
.adm-form textarea { resize: vertical; }
.adm-form fieldset { border: 1px solid var(--piega); padding: 1rem; display: grid; gap: 1rem; }
.adm-form legend { color: var(--lume); padding: 0 .4rem; }
.adm-row { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); }
.adm-check { display: flex !important; align-items: center; gap: .5rem; }
.adm-check input { width: auto; }
.adm-hint { font-style: italic; color: var(--cipria); margin: 0; }
.adm-actions { display: flex; justify-content: space-between; gap: 1rem; }
.adm-del { background: none; border: 1px solid var(--piega); color: #F2A0AE; padding: .6rem 1rem; cursor: pointer; font: inherit; }
.adm-table { overflow-x: auto; }
.adm-table table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.adm-table th, .adm-table td { text-align: left; padding: .6rem .8rem .6rem 0; border-bottom: 1px solid var(--piega); white-space: nowrap; }
.adm-table th { color: var(--cipria); font-weight: 400; }

/* Testo SEO delle categorie */
.cat-seo { max-width: 72rem; margin: 0 auto; padding: 0 var(--gutter) 4.5rem; }
.cat-seo > * { max-width: var(--measure); }
.cat-seo h2 { font-size: clamp(1.6rem, 3.5vw, 2.1rem); font-style: italic; margin-top: 1.6em; }
.cat-seo h2:first-child { margin-top: 0; padding-top: 3rem; border-top: 1px solid var(--piega); max-width: none; }
.cat-seo h3 { font-size: 1.35rem; margin-top: 1.4em; }
.cat-seo p { color: var(--cipria); }
.cat-seo strong { color: var(--carta); font-weight: 600; }
.side-cats a { font-size: 1.1rem; }

/* Installer */
.inst-checks { list-style: none; padding: 0; margin: 0 0 1.5rem; }
.inst-checks li { padding: .35rem 0; }
.inst-checks .ok { color: #A9D8A0; }
.inst-checks .ko { color: #F2A0AE; }
.inst-next li { margin-bottom: .5rem; }
.adm-err p { margin: .3rem 0; }

/* Copertine */
.story-cover { margin: 0 0 2.5rem; }
.story-cover img, .sl-cover img, .rel-cover img {
  display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover;
  background: var(--velluto); border: 1px solid var(--piega); border-radius: 2px;
}
@media (max-width: 44rem) { .story-cover { margin-inline: calc(-1 * var(--gutter)); } .story-cover img { border-inline: 0; border-radius: 0; } }
.sl-cover { display: block; margin-bottom: 1rem; }
.sl-cover img { transition: filter .25s; }
.sl-cover:hover img { filter: brightness(1.12); }
@media (min-width: 700px) {
  .story-list .has-cover { display: grid; grid-template-columns: minmax(0, 1fr) 15rem; gap: 2rem; align-items: start; }
  .story-list .has-cover .sl-cover { order: 2; margin: .3rem 0 0; }
}
.rel-cover { display: block; margin-bottom: .9rem; }
.adm-cover { margin: 0 0 2rem; max-width: 30rem; }
.adm-cover img { width: 100%; height: auto; display: block; border: 1px solid var(--piega); }
.adm-cover figcaption { font-size: .85rem; color: var(--cipria); margin-top: .5rem; }


/* ============ Mobile ============ */
html { -webkit-tap-highlight-color: transparent; }
.seo-text, .cat-seo, .site-foot { content-visibility: auto; contain-intrinsic-size: auto 700px; }
@media (hover: none) { .sl-cover:hover img { filter: none; } }

@media (max-width: 700px) {
  /* Header: marchio + categorie a "pillole" scorrevoli, con sfumatura che invita a scorrere */
  .site-head { padding: .9rem 0 0; gap: .35rem; }
  .brand { padding-inline: var(--gutter); font-size: 1.45rem; }
  .cat-nav {
    flex-basis: 100%; gap: .5rem; padding: .45rem var(--gutter) .85rem;
    scroll-snap-type: x proximity; scroll-padding-inline: var(--gutter);
    -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent);
            mask-image: linear-gradient(90deg, #000 82%, transparent);
  }
  .cat-nav a {
    scroll-snap-align: start; display: inline-flex; align-items: center; min-height: 2.6rem;
    padding: 0 1rem; border: 1px solid var(--piega); border-radius: 999px;
    background: rgba(44,24,45,.7); color: var(--carta); font-size: .92rem;
  }
  .cat-nav a:last-child { margin-right: 3rem; }
  .cat-nav a:active { border-color: var(--lume); color: var(--lume); }

  /* Home: hero compatto, le categorie entrano nel primo schermo */
  .hero { min-height: 0; padding: 2.6rem var(--gutter) 2.2rem; }
  .hero h1 { font-size: clamp(3.1rem, 16.5vw, 5rem); margin-bottom: .3em; }
  .hero-sub { font-size: 1rem; line-height: 1.55; }
  .section-title { font-size: 1.3rem; margin-bottom: .8rem; }
  .index-cats { padding-block: .4rem 2.4rem; }
  .cat-index { column-gap: 0; }
  .cat-index a { padding: .75rem 0; min-height: 3rem; }
  .ci-name { font-size: 1.5rem; }
  .cat-index a:active .ci-name { color: var(--lume); }

  .two-col { gap: 2.6rem; padding-block: .4rem 3rem; }

  /* Elenchi: miniatura accanto al titolo invece che a tutta larghezza */
  .story-list li { padding: 1.15rem 0; }
  .story-list .has-cover { display: grid; grid-template-columns: minmax(0, 1fr) 7.5rem; column-gap: 1rem; align-items: start; }
  .story-list .has-cover .sl-cover { order: 2; margin: .3rem 0 0; }
  .story-list h3 { font-size: 1.32rem; margin: .1em 0 .3em; }
  .story-list h3 a:active { color: var(--lume); }
  .story-list p { font-size: .96rem; line-height: 1.55; }
  .story-list .sl-text > p:not(.sl-meta) { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .story-list .sl-meta { font-size: .8rem; margin-top: .45rem; }

  /* Pagine categoria */
  .crumbs { padding-top: 1rem; font-size: .85rem; }
  .crumbs a { display: inline-block; padding: .3rem 0; }
  .page-head { padding-block: .4rem 1.6rem; }
  .page-head h1 { font-size: clamp(2.2rem, 10.5vw, 3rem); }
  .lede { font-size: 1.02rem; line-height: 1.6; }
  .pager a { padding: .75rem .25rem; }

  /* Racconto: lettura comoda con una mano */
  .story-head { padding: 1rem 0 1.5rem; }
  .story-head h1 { font-size: clamp(2.3rem, 11vw, 3.2rem); }
  .story-meta { font-size: .85rem; }
  .story-cover { margin-bottom: 1.8rem; }
  .story-body { font-size: 1.1rem; line-height: 1.78; }
  .story-body > p:first-child::first-letter { font-size: 3.6em; padding-top: .1em; }
  .mid-cta { margin: 1.8em 0; }
  .fin { margin-top: 2rem; }

  /* CTA: pulsanti a tutta larghezza, facili da toccare */
  .seal-cta { margin-top: 3.4rem; padding: 2.8rem 1.1rem 1.6rem; }
  .seal-cta .btn-seal { display: block; width: 100%; }
  .btn-seal { min-height: 3rem; }
  .btn-seal:active { background: var(--cera-hi); }
  .sticky-cta { gap: .6rem; padding-left: 1rem; padding-right: .4rem; }
  .sticky-cta p { font-size: .98rem; }
  .sticky-cta .btn-seal.small { min-height: 2.75rem; display: inline-flex; align-items: center; white-space: nowrap; }
  .sticky-close { padding: .6rem .7rem; }

  /* Correlati: stessa lista compatta */
  .related { padding-block: 1rem 3rem; }
  .rel-list { gap: 1.3rem; }
  .rel-list li { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); column-gap: 1rem; align-items: start; }
  .rel-list li > * { grid-column: 2; }
  .rel-list .rel-cover { grid-column: 1; grid-row: 1 / span 2; margin: .25rem 0 0; }
  .rel-list h3 { font-size: 1.25rem; margin-bottom: .25em; }
  .rel-list p { font-size: .92rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

  /* Footer: link comodi da toccare */
  .foot-inner { padding: 2.2rem var(--gutter) calc(2.4rem + env(safe-area-inset-bottom, 0px)); }
  .foot-cats { flex-direction: column; gap: 0; }
  .foot-cats a { padding: .6rem 0; border-bottom: 1px solid var(--piega); text-decoration: none; }

  .age-actions .btn-seal { width: 100%; }
  .cat-seo h2:first-child { padding-top: 2.2rem; }
}

/* Titoli senza parole orfane, paragrafi con a capo più armoniosi */
h1, h2, h3, .seal-title, .sticky-cta p { text-wrap: balance; }
p { text-wrap: pretty; }
.brand { display: inline-block; padding-block: .35rem; }
.pop-list a { padding-block: .3rem; }

/* Pagine legali */
.legal h3 { font-size: 1.3rem; margin-top: 1.6em; }
.legal-updated { color: var(--cipria); font-size: .9rem; font-style: italic; }
.legal code { font-size: .88em; background: var(--velluto); padding: .1em .35em; border-radius: 2px; }
mark.todo { background: #F2A0AE; color: #2A0B14; padding: .05em .3em; border-radius: 2px; font-weight: 600; }
.table-wrap { overflow-x: auto; margin: 1rem 0 1.5rem; }
.cookie-table { border-collapse: collapse; width: 100%; min-width: 34rem; font-size: .9rem; line-height: 1.45; }
.cookie-table th, .cookie-table td { text-align: left; vertical-align: top; padding: .6rem .7rem .6rem 0; border-bottom: 1px solid var(--piega); }
.cookie-table th { color: var(--cipria); font-weight: 400; }
.foot-policy { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; margin-top: 1.2rem; font-size: .85rem; }
.foot-policy a, .link-btn { color: var(--cipria); }
.link-btn { background: none; border: 0; padding: 0; font: inherit; text-decoration: underline; text-underline-offset: .2em; cursor: pointer; }
@media (max-width: 700px) {
  .foot-policy { gap: 0 1.2rem; }
  .foot-policy a, .foot-policy .link-btn { padding: .55rem 0; }
}

/* Pagine legali: margini e tabella leggibile su telefono */
.prose.legal { max-width: 72rem; margin: 0 auto; padding: 0 var(--gutter) 4rem; }
.prose.legal > * { max-width: var(--measure); }
.prose.legal > .table-wrap { max-width: 52rem; }
@media (max-width: 700px) {
  .cookie-table { min-width: 0; }
  .cookie-table thead { display: none; }
  .cookie-table, .cookie-table tbody, .cookie-table tr, .cookie-table td { display: block; width: 100%; }
  .cookie-table tr { border: 1px solid var(--piega); border-radius: 3px; background: var(--velluto); padding: .6rem .9rem; margin-bottom: .8rem; }
  .cookie-table td { border: 0; padding: .25rem 0 .25rem 6.6rem; position: relative; }
  .cookie-table td::before { content: attr(data-label); position: absolute; left: 0; top: .35rem; width: 6rem; color: var(--cipria); font-size: .82rem; }
}

/* Modulo contatti */
.contact-wrap { max-width: 72rem; margin: 0 auto; padding: 0 var(--gutter) 4.5rem; }
.contact-form { max-width: 34rem; display: grid; gap: 1.2rem; }
.contact-form label { display: grid; gap: .4rem; font-size: .95rem; color: var(--carta); }
.contact-form .opt { color: var(--cipria); font-size: .85rem; }
.contact-form input[type=email], .contact-form select, .contact-form textarea {
  font: 1rem/1.5 var(--text); color: var(--carta); background: var(--velluto);
  border: 1px solid var(--piega); border-radius: 3px; padding: .75rem .85rem; width: 100%; min-height: 3rem;
}
.contact-form textarea { resize: vertical; min-height: 10rem; }
.contact-form :focus-visible { outline: 2px solid var(--lume); outline-offset: 1px; }
.contact-form .check { display: flex; gap: .7rem; align-items: flex-start; color: var(--cipria); }
.contact-form .check input { width: 1.3rem; height: 1.3rem; margin-top: .15rem; accent-color: var(--cera-hi); flex: none; }
.contact-form .btn-seal { justify-self: start; min-width: 10rem; }
.form-note, .form-page { font-size: .85rem; color: var(--cipria); margin: 0; }
.form-page span { word-break: break-all; color: var(--carta); }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-errors { max-width: 34rem; border-left: 3px solid #F2A0AE; background: var(--velluto); padding: .9rem 1.1rem; margin-bottom: 1.6rem; }
.form-errors p { margin: 0 0 .4rem; color: #F2A0AE; }
.form-errors ul { margin: 0; padding-left: 1.2rem; }
.form-ok { max-width: 34rem; border-left: 3px solid var(--lume); background: var(--velluto); padding: 1.1rem 1.3rem; }
.form-ok-title { font: italic 1.5rem var(--display); color: var(--lume); margin: 0 0 .4rem; }
.story-report { text-align: center; font-size: .85rem; margin: 1.6rem 0 0; }
.story-report a { color: var(--cipria); }
@media (max-width: 700px) { .contact-form .btn-seal { justify-self: stretch; } }
.adm-badge { font: 600 .8rem var(--text); background: var(--cera); color: #F7E8CB; padding: .15rem .55rem; border-radius: 999px; vertical-align: middle; }
.adm-unread td { color: var(--carta); font-weight: 600; }
.adm-msg { background: var(--velluto); border: 1px solid var(--piega); padding: 1.1rem 1.2rem; margin: 1rem 0 1.5rem; line-height: 1.65; white-space: normal; overflow-wrap: anywhere; }
.adm-actions form { display: inline-flex; gap: .6rem; flex-wrap: wrap; }
main > .page-head:first-child { padding-top: 2.2rem; }
@media (max-width: 700px) { main > .page-head:first-child { padding-top: 1.6rem; } }