/* Vivai Isgrò Salvatore — il catalogo (/catalogo) e le pagine delle piante (/catalogo/<pianta>)
   2 e 3 Step, 05/11/2026. Le pagine le scrive Sito Web Codice/Strumenti/genera-catalogo.py dalla serie «Piante».
   Si carica dopo style.css, solo in queste pagine. Coi pezzi della home e le sue classi (sezione, destinazioni,
   fornitura-foto, piante, pianta, pianta-foto, pianta-dati, pillola, passo-numero, qualita, richiesta, btn, link-forte):
   nessuna classe nuova, le varianti stanno negli attributi data-* (data-cat-testa, data-cat-filtri, data-cat-vetrina,
   data-cat-disponibilita, data-cat-fine, data-cat-scheda, data-cat-galleria, data-cat-altre). Tutti col prefisso data-cat-:
   style.css ha i suoi (data-vetrina della home, data-galleria della coltivazione…) e non si devono toccare. La nicchia ad
   arco, il piedistallo di travertino e il filetto d'oro sono quelli del salto di livello; il movimento è quello del 5-bis. */

@keyframes vetrina-sale { from { opacity: 0; translate: 0 28px; } }
@keyframes vetrina-appare { from { opacity: 0; } }
@keyframes vetrina-entra { from { opacity: 0; translate: 0 16px; } }

/* ── la testata segna «Catalogo» anche nelle pagine delle piante ── */
.menu-voci a[aria-current="true"] { color: var(--verde); }
@media (min-width: 1024px) { .menu-voci a[aria-current="true"]::after { transform: scaleX(1); } }
.piede-link a[aria-current="true"] { color: var(--verde); font-weight: 700; }

/* ── le briciole: la forma dei numeri del kit, il filetto d'oro ── */
:is([data-cat-testa], [data-cat-scheda]) .numero { flex-wrap: wrap; gap: .35em .65em; }
:is([data-cat-testa], [data-cat-scheda]) .numero a { color: inherit; text-decoration: none; transition: color .2s ease; touch-action: manipulation; }
:is([data-cat-testa], [data-cat-scheda]) .numero [aria-current] { color: var(--verde); }
:is([data-cat-testa], [data-cat-scheda]) .numero a:active { color: var(--verde); }
@media (hover: hover) and (pointer: fine) { :is([data-cat-testa], [data-cat-scheda]) .numero a:hover { color: var(--verde); } }

/* ═══════════════════ /catalogo ═══════════════════ */

/* la testa corta: alla prima schermata si vedono i filtri e le prime schede */
.pagina-interna [data-cat-testa] { padding-top: calc(var(--testata-h) + clamp(18px, 2.6vw, 40px)); padding-bottom: clamp(18px, 2vw, 30px); }
[data-cat-testa] .destinazioni-griglia { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(28px, 4.5vw, 72px); align-items: center; }
[data-cat-testa] .numero { margin-bottom: 14px; }
[data-cat-testa] h1 { font-size: clamp(2.15rem, 1.05rem + 2.55vw, 3.5rem); font-weight: 600; line-height: 1.02; letter-spacing: -.018em; text-wrap: balance; }
@media (min-width: 1024px) { [data-cat-testa] h1 em { display: block; } }
[data-cat-testa] .destinazioni-testo > p:not(.numero) {
  margin-top: 14px; max-width: 44ch;
  font: 600 clamp(1rem, .93rem + .3vw, 1.17rem)/1.5 var(--f-testo); color: var(--nero); text-wrap: pretty;
}
[data-cat-testa] .fornitura-foto { isolation: isolate; width: 100%; max-width: 600px; margin-left: auto; }
[data-cat-testa] .fornitura-foto::before {
  content: ""; position: absolute; z-index: -1; inset: 18% -22px -20px 14%; border-radius: 28px;
  background: linear-gradient(160deg, var(--travertino) 0%, #EFE7DB 100%);
}
[data-cat-testa] .fornitura-cornice { aspect-ratio: 2.3 / 1; border-width: 8px; border-radius: 24px; }
[data-cat-testa] .fornitura-cornice img { object-position: 50% 30%; }
[data-cat-testa] .hero-ramo { top: -46px; right: -34px; left: auto; width: clamp(104px, 9.5vw, 148px); z-index: 3; transform: rotate(8deg); }

/* i filtri: una tavola bianca, l'etichetta coi caratteri dei numeri, la famiglia a pulsanti, forma e vaso a tendina */
.pagina-interna [data-cat-vetrina] { padding-top: 0; padding-bottom: clamp(48px, 5vw, 76px); }
[data-cat-filtri] {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "titolo titolo" "scelte esito";
  align-items: center; gap: 14px 28px;
  margin-bottom: clamp(30px, 3.2vw, 46px); padding: clamp(16px, 1.7vw, 22px) clamp(16px, 2.2vw, 30px);
  background: var(--bianco); border-radius: 22px; box-shadow: var(--ombra-tavola);
}
.pagina-interna [data-cat-filtri] h2 {
  grid-area: titolo; display: flex; align-items: center; gap: 14px; margin: 0;
  font: 800 12.5px/1.2 var(--f-testo); letter-spacing: .17em; text-transform: uppercase; color: var(--nero);
}
.pagina-interna [data-cat-filtri] h2::before { content: ""; flex: none; width: 26px; height: 1.5px; background: var(--oro); }
[data-cat-scelte] { grid-area: scelte; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; min-width: 0; }
[data-cat-famiglie] {
  display: inline-flex; gap: 4px; padding: 4px; border-radius: 13px;
  background: var(--avorio); box-shadow: inset 0 0 0 1px var(--linea);
}
[data-cat-famiglie] .btn {
  min-height: 42px; padding: 0 20px; border: 0; border-radius: 9px; background: transparent; box-shadow: none;
  font-size: 15px; font-weight: 700; color: var(--testo);
}
[data-cat-famiglie] .btn[aria-pressed="true"] { background: var(--verde); color: var(--bianco); box-shadow: 0 10px 18px -12px rgba(9, 64, 21, .75); }
@media (hover: hover) and (pointer: fine) {
  [data-cat-famiglie] .btn:not([aria-pressed="true"]):hover { background: var(--bianco); color: var(--verde); box-shadow: 0 0 0 1px var(--linea); }
}
[data-cat-filtri] .pillola { flex: none; }
[data-cat-filtri] .pillola::after { right: 15px; background-color: var(--verde); }
[data-cat-filtri] .pillola select {
  width: 100%; min-width: 0; min-height: 50px; padding: 0 44px 0 18px;
  border: 1px solid var(--linea-2); border-radius: 13px; background: var(--avorio); color: var(--nero);
  font: 600 16px/1 var(--f-testo);
}
[data-cat-filtri] .pillola:nth-child(2) select { width: 190px; }
[data-cat-filtri] .pillola:nth-child(3) select { width: 170px; }
[data-cat-filtri] .pillola select[data-cat-scelto] { border-color: var(--verde); background: rgba(11, 65, 22, .06); color: var(--verde); }
[data-cat-filtri] .pillola select:focus-visible { outline: 2px solid var(--verde); outline-offset: 2px; }
[data-cat-filtri] .pillola select option, [data-cat-filtri] .pillola select optgroup { color: var(--nero); background: var(--bianco); }
@media (hover: hover) and (pointer: fine) { [data-cat-filtri] .pillola select:hover { background: var(--bianco); border-color: var(--salvia); } }
[data-cat-esito] { grid-area: esito; display: flex; align-items: center; justify-content: flex-end; gap: 6px 20px; flex-wrap: wrap; }
[data-cat-conteggio] { font: 700 16px/1.3 var(--f-testo); color: var(--nero); white-space: nowrap; }
[data-cat-numero] { font-variant-numeric: tabular-nums; }
[data-cat-esito] .link-forte { padding: 4px 0; font-size: 14.5px; }

/* la griglia: 4 per riga da computer, 3 da tablet, 2 da telefono; la scheda che resterebbe sola si distende */
[data-cat-vetrina] .piante-fila { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(44px, 4.2vw, 64px) clamp(14px, 1.8vw, 26px); }
[data-cat-vetrina] .piante-fila[hidden], [data-cat-vetrina] .pianta[hidden], [data-cat-esito] [data-cat-azzera][hidden] { display: none !important; }
:is([data-cat-vetrina], [data-cat-altre]) .pianta { display: flex; flex-direction: column; align-items: center; min-width: 0; }
:is([data-cat-vetrina], [data-cat-altre]) .pianta-foto { width: 100%; max-width: 320px; height: clamp(236px, 20.5vw, 300px); }
:is([data-cat-vetrina], [data-cat-altre]) .pianta-foto > a { position: absolute; inset: 0; display: block; border-radius: 18px; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
:is([data-cat-vetrina], [data-cat-altre]) .pianta h3 { margin: 16px 0 3px; text-wrap: balance; }
:is([data-cat-vetrina], [data-cat-altre]) .pianta h3 a { color: inherit; text-decoration: none; text-decoration-thickness: 1px; text-underline-offset: 5px; transition: color .2s ease; touch-action: manipulation; }
:is([data-cat-vetrina], [data-cat-altre]) .pianta h3 a:active { color: var(--verde); }
@media (hover: hover) and (pointer: fine) {
  :is([data-cat-vetrina], [data-cat-altre]) .pianta:hover h3 a { color: var(--verde); }
  :is([data-cat-vetrina], [data-cat-altre]) .pianta h3 a:hover { text-decoration-line: underline; }
}
:is([data-cat-vetrina], [data-cat-altre]) .pianta > p { margin: 0 0 12px; font: italic 500 15px/1.35 var(--f-testo); color: var(--grigio); }
:is([data-cat-vetrina], [data-cat-altre]) .pianta-dati { margin-bottom: 20px; }
[data-cat-altre] .pianta-dati { margin-bottom: 0; }
[data-cat-vetrina] .pianta .btn {
  margin-top: auto; width: 100%; max-width: 290px; min-height: 46px; padding: 9px 16px;
  font-size: 14.5px; line-height: 1.25; white-space: normal; text-align: center;
}
/* qui la scheda ha il suo pulsante di WhatsApp: niente velo che rende cliccabile tutta la scheda (quello della 01 della home) */
.pagina-interna :is([data-cat-vetrina], [data-cat-altre]) .pianta h3 a::after { content: none; }
/* il tocco: la pianta scende appena sul piedistallo */
:is([data-cat-vetrina], [data-cat-altre]) .pianta-foto > a:active img { scale: .97; }

/* la brezza, mai in sincrono anche con tante schede */
@media (prefers-reduced-motion: no-preference) {
  [data-cat-vetrina] .pianta:nth-child(4n+1) .pianta-foto img { animation-name: brezza-lieve; animation-duration: 4.6s; animation-delay: -1.2s; }
  [data-cat-vetrina] .pianta:nth-child(4n+2) .pianta-foto img { animation-name: brezza-lieve-inversa; animation-duration: 5.2s; animation-delay: -3.1s; }
  [data-cat-vetrina] .pianta:nth-child(4n+3) .pianta-foto img { animation-name: brezza-lieve; animation-duration: 4.1s; animation-delay: -.5s; }
  [data-cat-vetrina] .pianta:nth-child(4n+4) .pianta-foto img { animation-name: brezza-lieve-inversa; animation-duration: 5.7s; animation-delay: -2.2s; }
  [data-cat-vetrina] .pianta:nth-child(3n+2) .pianta-foto img { animation-delay: -3.8s; }
  [data-cat-vetrina] .pianta:nth-child(5n+3) .pianta-foto img { animation-duration: 4.9s; }
}

/* le foto in cornice (Piante-scontornate/LEGGIMI.txt): la migliorata intera al posto della nicchia e del piedistallo */
:is([data-cat-vetrina], [data-cat-altre]) .pianta-foto::before, :is([data-cat-vetrina], [data-cat-altre]) .pianta-foto::after { transition: opacity .3s ease; }
:is([data-cat-vetrina], [data-cat-altre]) .pianta-foto[data-cat-cornice]::before,
:is([data-cat-vetrina], [data-cat-altre]) .pianta-foto[data-cat-cornice]::after { opacity: 0; }
:is([data-cat-vetrina], [data-cat-altre]) .pianta .pianta-foto img[data-cat-cornice] {
  left: 6%; right: auto; top: 0; bottom: 0; width: 88%; height: 100%; max-width: none;
  object-fit: cover; object-position: 50% 50%; border-radius: var(--raggio); background: var(--box);
  transform: none; filter: none; animation: none; box-shadow: var(--ombra-lunga);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  :is([data-cat-vetrina], [data-cat-altre]) .pianta:hover .pianta-foto img[data-cat-cornice] { translate: 0 -6px; scale: 1.02; }
}

/* le schede con più foto: i numeri del kit in una pillola di galleria, e la foto cambia al tocco */
[data-cat-vetrina] .pianta-foto img[data-cat-n] { transition: opacity .45s var(--ease-out), translate .28s ease, scale .28s ease; }
[data-cat-vetrina] .pianta-foto img[data-cat-n]:not([data-cat-attiva]) { opacity: 0; }
[data-cat-numeri] {
  position: absolute; top: 6px; right: 4px; z-index: 3; display: flex; align-items: center; gap: 2px;
  padding: 4px 5px 4px 10px; border-radius: 999px; background: rgba(254, 254, 254, .9);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  box-shadow: 0 10px 20px -12px rgba(40, 34, 20, .4), 0 0 0 1px rgba(160, 140, 110, .18);
}
[data-cat-vetrina] .pianta .pianta-foto [data-cat-numeri] > img {
  position: static; left: auto; bottom: auto; width: 15px; height: auto; max-width: none; margin-right: 4px; opacity: .75;
  transform: none; filter: none; animation: none; translate: none; scale: none;
}
[data-cat-numeri] .passo-numero {
  position: relative; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 50%;
  background: transparent; box-shadow: none; font: 700 11.5px/1 var(--f-testo); color: var(--grigio);
  cursor: pointer; touch-action: manipulation; user-select: none; -webkit-user-select: none;
  transition: background-color .2s ease, color .2s ease, transform .16s var(--ease-out);
}
[data-cat-numeri] .passo-numero::after { content: ""; position: absolute; inset: -9px -2px; }
[data-cat-numeri] .passo-numero[aria-pressed="true"] { background: var(--verde); color: var(--bianco); }
[data-cat-numeri] .passo-numero:active { transform: scale(.88); }
[data-cat-numeri] .passo-numero:focus-visible { outline-offset: 2px; border-radius: 50%; }
@media (hover: hover) and (pointer: fine) {
  [data-cat-numeri] .passo-numero:not([aria-pressed="true"]):hover { background: var(--avorio); color: var(--verde); }
}

/* le entrate: una scheda alla volta mentre si scende (--d lo mette catalogo.js, colonna per colonna);
   coi filtri, le schede già viste rientrano piano, dalla prima */
[data-cat-vetrina] .pianta.reveal { transition-delay: var(--d, 0s); }
@media (prefers-reduced-motion: no-preference) {
  [data-cat-vetrina] .pianta[data-cat-entra] { animation: vetrina-entra .42s var(--ease-out) var(--d, 0s) backwards; }
}
@media (prefers-reduced-motion: reduce) {
  [data-cat-vetrina] .pianta[data-cat-entra] { animation: vetrina-appare .3s ease backwards; }
}

/* niente piante coi filtri scelti */
[data-cat-vuoto] { display: grid; justify-items: center; gap: 14px; padding: clamp(36px, 5vw, 64px) 20px; text-align: center; background: var(--bianco); border-radius: 22px; box-shadow: var(--ombra-tavola); }
[data-cat-vuoto][hidden] { display: none; }
[data-cat-vuoto] p { font: 500 clamp(1.4rem, 1.15rem + .8vw, 1.9rem)/1.2 var(--f-titoli); color: var(--nero); text-wrap: balance; }

/* foto e disponibilità: la fascia di travertino della 04, le due tessere col simbolino nel sigillo */
@media (min-width: 1200px) { [data-cat-disponibilita] .qualita-riga { grid-template-columns: minmax(0, .7fr) minmax(0, 2fr); gap: 40px; } }
[data-cat-disponibilita] .qualita-voci li { flex: 1 1 0; }
[data-cat-disponibilita] .qualita-voci p { max-width: 40ch; font-size: 16.5px; line-height: 1.5; text-wrap: pretty; }
[data-cat-disponibilita] .qualita-marchio img { height: 24px; width: auto; }
[data-cat-disponibilita] .qualita-marchio img[src*="freccia"] { height: 18px; }

/* la fascia finale: forme e vasi a sinistra, coi simbolini della 02 nei medaglioni; le nuove varietà a destra */
.pagina-interna [data-cat-fine] .richiesta-riga {
  grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); align-items: start; gap: clamp(32px, 5vw, 84px);
  padding-block: clamp(44px, 4.6vw, 68px);
}
.pagina-interna [data-cat-fine] h2 { color: var(--bianco); font-size: clamp(2rem, 1.05rem + 2.15vw, 3.15rem); }
[data-cat-medaglioni] { display: flex; gap: 10px; margin: 18px 0 4px; }
[data-cat-medaglioni] img {
  width: 52px; height: 52px; padding: 11px; border-radius: 50%; object-fit: contain;
  background: var(--bianco); box-shadow: 0 0 0 4px rgba(254, 254, 254, .12);
}
[data-cat-colonne] { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 8px 36px; }
[data-cat-colonne] > div > p { margin-top: 18px; font-size: 16.5px; line-height: 1.5; color: rgba(254, 254, 254, .92); text-wrap: pretty; }
[data-cat-forme] .pianta-dati { display: grid; justify-items: stretch; gap: 0; margin-top: 10px; font-size: 16px; line-height: 1.4; color: var(--bianco); }
[data-cat-forme] .pianta-dati li { gap: 13px; padding: 9px 0; border-bottom: 1px solid rgba(188, 205, 188, .22); }
[data-cat-forme] .pianta-dati li:last-child { border-bottom: 0; }
[data-cat-forme] .pianta-dati img { width: 34px; height: 34px; padding: 7px; border-radius: 50%; background: var(--bianco); }
.pagina-interna [data-cat-fine] .richiesta-scelte { display: grid; justify-items: start; gap: 14px; max-width: 470px; }
.pagina-interna [data-cat-fine] .richiesta-scelte p { font-size: 17px; line-height: 1.55; color: rgba(254, 254, 254, .92); text-wrap: pretty; }
.pagina-interna [data-cat-fine] .richiesta-scelte .btn { margin-top: 10px; }
[data-cat-fine] .link-forte { color: var(--bianco); border-bottom-color: var(--salvia-chiaro); }
[data-cat-fine] .link-forte:active { color: var(--salvia-chiaro); }
@media (hover: hover) and (pointer: fine) { [data-cat-fine] .link-forte:hover { color: var(--salvia-chiaro); } }
.richiesta[data-cat-fine] > .ramo--kumquat { top: auto; bottom: -34px; right: calc(var(--bordo-pagina) - 74px); width: clamp(190px, 19vw, 290px); transform: rotate(14deg); }

/* ═══════════════════ la pagina della pianta ═══════════════════ */
.pagina-interna [data-cat-scheda] { padding-top: calc(var(--testata-h) + clamp(22px, 3.4vw, 52px)); padding-bottom: clamp(52px, 5.4vw, 84px); }
[data-cat-scheda] .destinazioni-griglia { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5.5vw, 96px); align-items: center; }

/* la galleria: le foto in una riga che scorre (col dito, o dalle miniature), dentro la cornice col passe-partout */
[data-cat-galleria] { position: relative; width: 100%; max-width: 540px; justify-self: center; min-width: 0; }
/* da computer la galleria e le miniature stanno nella prima schermata */
@media (min-width: 1024px) { [data-cat-galleria] { max-width: min(520px, calc((100svh - var(--testata-h) - 200px) * .75)); } }
[data-cat-scorre] {
  position: relative; display: flex; overflow-x: auto; overflow-y: hidden; aspect-ratio: 3 / 4;
  scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain; scrollbar-width: none;
  border: 8px solid var(--bianco); border-radius: 26px; box-shadow: var(--ombra-lunga);
  background: radial-gradient(90% 60% at 50% 12%, #FFFFFF 0%, rgba(255, 255, 255, 0) 70%), linear-gradient(175deg, #FBF7F1 0%, var(--travertino) 100%);
}
@media (prefers-reduced-motion: reduce) { [data-cat-scorre] { scroll-behavior: auto; } }
[data-cat-scorre]::-webkit-scrollbar { display: none; }
[data-cat-scorre]:focus-visible { outline: 2px solid var(--verde); outline-offset: 4px; }
[data-cat-scorre] > figure { position: relative; flex: 0 0 100%; height: auto; margin: 0; scroll-snap-align: start; scroll-snap-stop: always; }
/* la pianta sul piedistallo, in grande: la nicchia, il travertino col filo d'oro */
[data-cat-scorre] > .pianta-foto { width: 100%; max-width: none; height: auto; }
[data-cat-scorre] > .pianta-foto::after { left: 15%; right: 15%; top: 6%; bottom: 13%; border-radius: 999px 999px 18px 18px; }
[data-cat-scorre] > .pianta-foto::before { left: 9%; right: 9%; bottom: 6.5%; height: 8.5%; }
[data-cat-scorre] > .pianta-foto img { bottom: 10.8%; height: 79%; max-width: 86%; }
/* la foto intera: tutta la cornice */
[data-cat-scorre] > figure[data-cat-cornice] img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* le miniature: la foto scelta ha il filo verde */
[data-cat-miniature] { display: flex; justify-content: center; gap: 10px; margin-top: 16px; padding: 4px; overflow-x: auto; scrollbar-width: none; }
[data-cat-miniature]::-webkit-scrollbar { display: none; }
[data-cat-miniature] button {
  position: relative; flex: none; width: 64px; aspect-ratio: 3 / 4; padding: 0; overflow: hidden;
  border: 0; border-radius: 12px; cursor: pointer; opacity: .7; touch-action: manipulation;
  background: linear-gradient(175deg, #FBF7F1 0%, var(--travertino) 100%);
  box-shadow: 0 0 0 1px rgba(160, 140, 110, .24);
  transition: opacity .2s ease, box-shadow .2s ease, transform .16s var(--ease-out);
}
[data-cat-miniature] button img { width: 100%; height: 100%; object-fit: cover; }
[data-cat-miniature] button[data-cat-tipo="pianta"] img { object-fit: contain; padding: 6px 4px 3px; }
[data-cat-miniature] button[aria-pressed="true"] { opacity: 1; box-shadow: 0 0 0 2px var(--verde), 0 12px 20px -14px rgba(40, 34, 20, .5); }
[data-cat-miniature] button:active { transform: scale(.94); }
[data-cat-miniature] button:focus-visible { outline: 2px solid var(--verde); outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) { [data-cat-miniature] button:not([aria-pressed="true"]):hover { opacity: 1; } }

/* il nome, il nome latino, la scheda tecnica su una tavola bianca, il pulsante */
[data-cat-scheda] .numero { margin-bottom: 18px; }
[data-cat-scheda] h1 { font-size: clamp(2.3rem, 1.1rem + 2.7vw, 3.75rem); font-weight: 600; line-height: 1.02; letter-spacing: -.018em; text-wrap: balance; }
[data-cat-scheda] .destinazioni-testo > h1 + p { margin-top: 10px; font: italic 500 clamp(1.08rem, 1rem + .3vw, 1.25rem)/1.4 var(--f-testo); color: var(--grigio); }
[data-cat-scheda] dl { max-width: 470px; margin: 26px 0 28px; padding: 4px clamp(16px, 2vw, 26px); background: var(--bianco); border-radius: 22px; box-shadow: var(--ombra-tavola); }
[data-cat-scheda] dl > div { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 11px 0; border-bottom: 1px solid var(--linea); }
[data-cat-scheda] dl > div:last-child { border-bottom: 0; }
[data-cat-scheda] dt { display: flex; align-items: center; gap: 14px; font-size: 15.5px; line-height: 1.3; color: var(--grigio); }
[data-cat-scheda] dt img {
  flex: none; width: 40px; height: 40px; padding: 9px; border-radius: 50%; object-fit: contain;
  background: var(--avorio); box-shadow: inset 0 0 0 1px var(--salvia-chiaro);
}
[data-cat-scheda] dd { margin: 0; font: 800 17px/1.3 var(--f-testo); color: var(--nero); text-align: right; }
[data-cat-scheda] .btn-verde { min-height: 56px; padding: 0 30px; font-size: 16.5px; }
[data-cat-scheda] .destinazioni-testo > p[data-cat-nota] { margin-top: 12px; font-size: 14.5px; line-height: 1.5; color: var(--grigio); }
[data-cat-scheda] .destinazioni-testo > p[data-cat-ingrosso] {
  display: flex; align-items: center; gap: 14px; max-width: 470px; margin-top: 26px; padding-top: 20px;
  border-top: 1px solid var(--linea); font: 700 15.5px/1.4 var(--f-testo); color: var(--nero);
}
[data-cat-scheda] [data-cat-ingrosso] img {
  flex: none; width: 46px; height: 46px; padding: 10px; border-radius: 50%; object-fit: contain;
  background: var(--bianco); box-shadow: inset 0 0 0 1px var(--salvia-chiaro), 0 10px 20px -14px rgba(40, 34, 20, .35);
}
[data-cat-scheda] .destinazioni-testo > .link-forte { margin-top: 20px; font-size: 15.5px; }

/* altre piante del catalogo: le schede della 01 della home, senza pulsante */
.pagina-interna [data-cat-altre] { padding-top: clamp(30px, 3.4vw, 52px); padding-bottom: clamp(52px, 5.4vw, 84px); }
.pagina-interna [data-cat-altre] .sezione-testa { margin-bottom: clamp(24px, 2.8vw, 38px); }
@media (min-width: 768px) { [data-cat-altre] .piante-fila { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(14px, 1.8vw, 26px); } }
[data-cat-torna-riga] { display: flex; justify-content: center; margin-top: clamp(32px, 3.6vw, 52px); }

/* la prima schermata entra come la testa delle altre pagine: briciole, titolo, riga, poi i filtri; la galleria sale */
@media (prefers-reduced-motion: no-preference) {
  :is([data-cat-testa], [data-cat-scheda]) .destinazioni-testo > * { animation: vetrina-sale .9s var(--ease-out) backwards; }
  :is([data-cat-testa], [data-cat-scheda]) .destinazioni-testo > :nth-child(1) { animation-delay: .06s; }
  :is([data-cat-testa], [data-cat-scheda]) .destinazioni-testo > :nth-child(2) { animation-delay: .14s; }
  :is([data-cat-testa], [data-cat-scheda]) .destinazioni-testo > :nth-child(3) { animation-delay: .24s; }
  [data-cat-scheda] .destinazioni-testo > :nth-child(4) { animation-delay: .32s; }
  [data-cat-scheda] .destinazioni-testo > :nth-child(n+5) { animation-delay: .4s; }
  [data-cat-testa] .fornitura-foto { animation: vetrina-sale 1s var(--ease-out) .12s backwards; }
  [data-cat-testa] .hero-ramo { transform-origin: 100% 0; animation: vetrina-appare .9s var(--ease-out) .5s backwards, brezza-inversa 5.4s var(--ease-in-out) 1.4s infinite alternate; }
  [data-cat-filtri] { animation: vetrina-sale .9s var(--ease-out) .3s backwards; }
  [data-cat-galleria] { animation: vetrina-sale 1s var(--ease-out) .04s backwards; }
}
@media (prefers-reduced-motion: reduce) {
  :is([data-cat-testa], [data-cat-scheda]) .destinazioni-testo > *, [data-cat-testa] .fornitura-foto, [data-cat-filtri], [data-cat-galleria] { animation: vetrina-appare .6s ease backwards; }
}

/* ═══════════════════ computer piccolo e tablet ═══════════════════ */
@media (max-width: 1199px) {
  [data-cat-vetrina] .piante-fila { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  [data-cat-filtri] { grid-template-areas: "titolo esito" "scelte scelte"; }
  .pagina-interna [data-cat-fine] .richiesta-riga { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  [data-cat-scheda] .destinazioni-griglia { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); }
}
@media (max-width: 1023px) {
  [data-cat-testa] .destinazioni-griglia { grid-template-columns: minmax(0, 1fr); }
  [data-cat-testa] .fornitura-foto { display: none; }
  [data-cat-scheda] .destinazioni-griglia { grid-template-columns: minmax(0, 1fr); gap: 34px; }
  [data-cat-galleria] { max-width: 520px; }
}

/* ═══════════════════ telefono ═══════════════════ */
@media (max-width: 767px) {
  .pagina-interna [data-cat-testa] { padding-top: calc(var(--testata-h) + 18px); padding-bottom: 16px; }
  [data-cat-testa] .numero { margin-bottom: 10px; }
  [data-cat-testa] h1 { font-size: min(2.3rem, 8.6vw); }
  [data-cat-testa] .destinazioni-testo > p:not(.numero) { margin-top: 10px; font-size: 15.5px; }

  [data-cat-filtri] {
    grid-template-columns: minmax(0, 1fr); grid-template-areas: "titolo" "scelte" "esito"; gap: 12px;
    margin-bottom: 26px; padding: 14px; border-radius: 18px;
  }
  .pagina-interna [data-cat-filtri] h2 { font-size: 11.5px; letter-spacing: .15em; gap: 10px; }
  .pagina-interna [data-cat-filtri] h2::before { width: 18px; }
  [data-cat-scelte] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  [data-cat-famiglie] { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  [data-cat-famiglie] .btn { min-height: 44px; padding: 0 8px; }
  [data-cat-filtri] .pillola { flex: none; width: 100%; }
  [data-cat-filtri] .pillola:nth-child(2) select, [data-cat-filtri] .pillola:nth-child(3) select { width: 100%; }
  [data-cat-filtri] .pillola select { min-height: 46px; padding: 0 34px 0 12px; font-size: 16px; }
  [data-cat-filtri] .pillola::after { right: 12px; }
  [data-cat-esito] { justify-content: space-between; }
  [data-cat-conteggio] { font-size: 15px; }

  [data-cat-vetrina] .piante-fila {
    grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-flow: row; grid-auto-columns: auto;
    overflow: visible; margin-inline: -8px; padding: 0; scroll-snap-type: none; gap: 36px 10px;
  }
  [data-cat-vetrina] .pianta-foto { height: 212px; }
  :is([data-cat-vetrina], [data-cat-altre]) .pianta h3 { margin-top: 12px; font-size: 1.4rem; }
  :is([data-cat-vetrina], [data-cat-altre]) .pianta > p { margin-bottom: 10px; font-size: 13.5px; }
  [data-cat-vetrina] .pianta-dati { margin-bottom: 14px; font-size: 13.5px; }
  :is([data-cat-vetrina], [data-cat-altre]) .pianta-dati img { width: 18px; height: 18px; }
  [data-cat-vetrina] .pianta .btn { min-height: 44px; padding: 8px 6px; font-size: 12px; font-weight: 650; letter-spacing: -.01em; white-space: nowrap; gap: .45em; }
  [data-cat-vetrina] .pianta .btn .freccia { display: none; }
  [data-cat-numeri] { top: 4px; right: 0; padding: 3px 3px 3px 8px; }
  [data-cat-numeri] .passo-numero { width: 23px; height: 23px; font-size: 11px; }

  [data-cat-disponibilita] .qualita-voci p { font-size: 15.5px; max-width: none; }
  [data-cat-disponibilita] .qualita-voci li, [data-cat-disponibilita] .qualita-voci li:last-child { gap: 14px; padding: 14px 16px 14px 12px; }
  [data-cat-disponibilita] .qualita-marchio { width: 50px; height: 50px; }
  [data-cat-disponibilita] .qualita-marchio img { height: 20px; }

  .pagina-interna [data-cat-fine] .richiesta-riga { padding-block: 38px 42px; }
  [data-cat-colonne] { grid-template-columns: minmax(0, 1fr); }
  [data-cat-colonne] > div > p, [data-cat-forme] .pianta-dati { font-size: 15.5px; }
  [data-cat-medaglioni] img { width: 46px; height: 46px; padding: 10px; }
  .pagina-interna [data-cat-fine] .richiesta-scelte p { font-size: 16px; }
  .richiesta[data-cat-fine] > .ramo--kumquat { top: -18px; bottom: auto; right: -40px; width: 150px; transform: rotate(-10deg); }
  .pagina-interna [data-cat-fine] h2 { position: relative; z-index: 3; max-width: 78%; }

  .pagina-interna [data-cat-scheda] { padding-top: calc(var(--testata-h) + 16px); padding-bottom: 46px; }
  [data-cat-scheda] .destinazioni-griglia { gap: 26px; }
  [data-cat-scorre] { border-width: 6px; border-radius: 22px; }
  [data-cat-miniature] { justify-content: flex-start; gap: 8px; margin-top: 12px; }
  [data-cat-miniature] button { width: 56px; border-radius: 10px; }
  [data-cat-scheda] .numero { margin-bottom: 12px; }
  [data-cat-scheda] h1 { font-size: min(2.4rem, 9vw); }
  [data-cat-scheda] dl { margin: 20px 0 22px; padding: 2px 16px; border-radius: 18px; }
  [data-cat-scheda] dt { font-size: 14.5px; gap: 12px; }
  [data-cat-scheda] dt img { width: 36px; height: 36px; padding: 8px; }
  [data-cat-scheda] dd { font-size: 16px; }
  [data-cat-scheda] .btn-verde { width: 100%; min-height: 54px; padding: 0 18px; font-size: 16px; }
  [data-cat-scheda] .destinazioni-testo > p[data-cat-ingrosso] { margin-top: 20px; padding-top: 16px; font-size: 15px; }

  /* altre piante: la riga che scorre della 01 della home (le schede al 47%, col dito) */
  [data-cat-altre] .pianta-foto { height: 220px; }
}
@media (max-width: 369px) {
  [data-cat-vetrina] .pianta .btn { white-space: normal; }
  [data-cat-famiglie] .btn { font-size: 14px; }
}

/* ═══════════════════ la scheda che resterebbe sola nell'ultima riga ═══════════════════
   si distende su tutta la riga: la foto a sinistra; nome, forma, vaso e pulsante a destra (mai un elemento solo in una
   riga, 09 § 0-bis-3). catalogo.js segna l'ultima scheda visibile con data-cat-ultima-2/3/4, coi filtri anche. */
@media (max-width: 767px) {
  [data-cat-vetrina] .pianta[data-cat-ultima-2] { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: 1fr auto auto auto auto 1fr; column-gap: 14px; justify-items: start; align-items: center; text-align: left; }
  [data-cat-vetrina] .pianta[data-cat-ultima-2] > .pianta-foto { grid-column: 1; grid-row: 1 / -1; }
  [data-cat-vetrina] .pianta[data-cat-ultima-2] > :not(.pianta-foto) { grid-column: 2; }
  [data-cat-vetrina] .pianta[data-cat-ultima-2] > h3 { grid-row: 2; margin-top: 0; }
  [data-cat-vetrina] .pianta[data-cat-ultima-2] > p { grid-row: 3; }
  [data-cat-vetrina] .pianta[data-cat-ultima-2] > .pianta-dati { grid-row: 4; }
  [data-cat-vetrina] .pianta[data-cat-ultima-2] > .btn { grid-row: 5; margin-top: 0; width: 100%; }
}
@media (min-width: 768px) and (max-width: 1199px) {
  [data-cat-vetrina] .pianta[data-cat-ultima-3] { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr); grid-template-rows: 1fr auto auto auto auto 1fr; column-gap: clamp(14px, 3vw, 40px); justify-items: start; align-items: center; text-align: left; }
  [data-cat-vetrina] .pianta[data-cat-ultima-3] > .pianta-foto { grid-column: 1; grid-row: 1 / -1; }
  [data-cat-vetrina] .pianta[data-cat-ultima-3] > :not(.pianta-foto) { grid-column: 2; }
  [data-cat-vetrina] .pianta[data-cat-ultima-3] > h3 { grid-row: 2; margin-top: 0; }
  [data-cat-vetrina] .pianta[data-cat-ultima-3] > p { grid-row: 3; }
  [data-cat-vetrina] .pianta[data-cat-ultima-3] > .pianta-dati { grid-row: 4; }
  [data-cat-vetrina] .pianta[data-cat-ultima-3] > .btn { grid-row: 5; margin-top: 0; }
}
@media (min-width: 1200px) {
  [data-cat-vetrina] .pianta[data-cat-ultima-4] { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr); grid-template-rows: 1fr auto auto auto auto 1fr; column-gap: clamp(14px, 3vw, 40px); justify-items: start; align-items: center; text-align: left; }
  [data-cat-vetrina] .pianta[data-cat-ultima-4] > .pianta-foto { grid-column: 1; grid-row: 1 / -1; }
  [data-cat-vetrina] .pianta[data-cat-ultima-4] > :not(.pianta-foto) { grid-column: 2; }
  [data-cat-vetrina] .pianta[data-cat-ultima-4] > h3 { grid-row: 2; margin-top: 0; }
  [data-cat-vetrina] .pianta[data-cat-ultima-4] > p { grid-row: 3; }
  [data-cat-vetrina] .pianta[data-cat-ultima-4] > .pianta-dati { grid-row: 4; }
  [data-cat-vetrina] .pianta[data-cat-ultima-4] > .btn { grid-row: 5; margin-top: 0; }
}