/* VitaSan Labs - pagina prodotto (farmaceutico) */
.pp-top{padding-block:28px clamp(48px,5vw,88px);background:linear-gradient(180deg,var(--bg2),#fff 70%)}
.pp-top .crumb{font-size:14px;color:var(--muted);margin-bottom:28px}
.pp-top .crumb a{text-decoration:none;color:var(--fg2)}
.pp-top .crumb a:hover{color:var(--navy);text-decoration:underline}
.pp-top .crumb b{color:var(--navy)}
.pp-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:clamp(28px,4vw,72px);align-items:start}

/* struttura 2D / 3D */
.pp-struct{margin:0;position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px 28px 20px;box-shadow:0 1px 2px rgba(11,48,72,.04)}
.pp-view{display:none;aspect-ratio:9/7;align-items:center;justify-content:center;position:relative}
.pp-view.on{display:flex}
.pp-view svg{width:100%;height:100%}
.pp-view canvas{width:100%;height:100%;cursor:grab;touch-action:none}
.pp-view canvas:active{cursor:grabbing}
.pp-view .hint{position:absolute;left:0;bottom:0}
.pp-switch{position:absolute;top:18px;right:18px;display:flex;background:var(--bg2);border:1px solid var(--line);border-radius:999px;padding:3px}
.pp-switch button{border:0;background:transparent;padding:6px 14px;border-radius:999px;font-weight:700;font-size:13px;color:var(--fg2)}
.pp-switch button.on{background:var(--navy);color:#fff}
.pp-struct figcaption{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);font-size:15px;color:var(--fg2);text-align:center}

/* dati */
.pp-info h1{font-size:clamp(40px,4.4vw,72px);max-width:none;margin-top:14px;line-height:1.02}
.pp-story{margin:18px 0 0;max-width:68ch;font-size:clamp(17px,1.15vw,19px);line-height:1.65;color:var(--fg2)}
.mbnote{margin:14px 0 0;font-size:13px;line-height:1.55;color:var(--muted)}
.mbnote.wide{max-width:90ch;margin-top:16px}
.pp-kv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px;margin:32px 0 0}
.pp-kv div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px;padding:12px 0;border-bottom:1px solid var(--line);align-items:baseline}
.pp-kv dt{font-size:14px;color:var(--muted)}
.pp-kv dd{margin:0;font-size:16px;color:var(--fg);overflow-wrap:anywhere}
.pp-kv dd .mono{font-size:15.5px;color:var(--navy);font-weight:700}
.pp-kv dd .altn{font-size:14px;color:var(--muted)}
.pp-kv div.wide{grid-column:1/-1}
.vals{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 10px}
.vals li+li::before{content:'\00B7';margin-right:10px;color:var(--muted)}
.vals li.x{display:none}
.vals.open li.x{display:block}
.vals .more{border:0;background:none;padding:0;font:inherit;font-size:14.5px;font-weight:700;color:var(--navy);text-decoration:underline;cursor:pointer}
[data-copy]{cursor:copy;border-bottom:1px dashed var(--line2)}
[data-copy]:hover{border-bottom-color:var(--navy)}

/* richiesta d'offerta */
.pp-req{margin-top:36px;background:#fff;border:1px solid var(--line);border-top:3px solid var(--navy);border-radius:24px;padding:clamp(22px,2.4vw,36px);box-shadow:var(--shadow)}
.pp-req h2{font-size:clamp(26px,2.4vw,36px)}
.pp-req fieldset{border:0;margin:24px 0 0;padding:0}
.pp-req legend{font-weight:700;color:var(--navy);font-size:15px;margin-bottom:12px;padding:0}
.lvl{display:block;cursor:pointer;margin-top:10px}
.lvl input{position:absolute;opacity:0}
.lvl>span{display:block;border:1.5px solid var(--line);border-radius:16px;padding:16px 18px 16px 52px;position:relative;transition:border-color .2s,background .2s}
.lvl>span::before{content:'';position:absolute;left:18px;top:19px;width:18px;height:18px;border-radius:50%;border:2px solid var(--line2);background:#fff;transition:all .2s}
.lvl input:checked+span{border-color:var(--navy);background:var(--bg2)}
.lvl input:checked+span::before{border-color:var(--navy);box-shadow:inset 0 0 0 4px #fff;background:var(--navy)}
.lvl input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.lvl b{display:block;color:var(--navy);font-size:17px}
.lvl b em{font-style:normal;font-weight:400;color:var(--accent2);margin-left:6px}
.lvl small{display:block;margin-top:6px;font-size:14.5px;line-height:1.55;color:var(--fg2)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:9px 18px;font-weight:700;font-size:14px;color:var(--fg2)}
.chip:hover{border-color:var(--navy2)}
.chip.on{border-color:var(--navy);background:var(--navy);color:#fff}
.other{display:flex;gap:8px;margin-top:12px;max-width:320px}
.other[hidden]{display:none}
.other input,.other select{border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff;color:var(--fg)}
.other input{flex:1;min-width:0}
.acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.btn.big{min-height:52px;padding:0 26px;font-size:15px}
.pp-req .hint{margin:16px 0 0;font-size:13.5px;line-height:1.5}

/* farmacopea */
.pp-2col{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,4vw,72px);align-items:start}
.pp-2col .lead{margin-top:16px}
.phlist{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.phlist li{display:flex;align-items:center;gap:18px;padding:16px 0;border-bottom:1px solid var(--line)}
.phlist li>div{flex:1;min-width:0}
.phlist .sth{flex:none;width:168px;padding:6px;border:1px solid var(--line);border-radius:14px;background:#fff}
.phlist b{display:block;color:var(--navy);font-size:16.5px}
.phlist .mono{font-size:13px;color:var(--muted)}

/* confronto livelli */
.pp-h2{margin-top:clamp(48px,5vw,80px)}
.pp-cmp{margin-top:24px;overflow-x:auto;border:1px solid var(--line);border-radius:20px}
.pp-cmp table{width:100%;border-collapse:collapse;min-width:520px}
.pp-cmp th,.pp-cmp td{padding:16px 22px;border-bottom:1px solid var(--line);text-align:left;font-size:15.5px}
.pp-cmp thead th{background:var(--bg2);color:var(--navy);font-size:16px}
.pp-cmp thead th span{font-weight:400;color:var(--accent2);font-size:14px}
.pp-cmp tbody th{font-weight:400;color:var(--fg)}
.pp-cmp td{text-align:center;width:22%}
.pp-cmp thead th:not(:first-child){text-align:center}
.pp-cmp tr:last-child th,.pp-cmp tr:last-child td{border-bottom:0}
.pp-cmp .y{font-style:normal;color:var(--ok);font-weight:700;font-size:18px}
.pp-cmp .n{font-style:normal;color:var(--line2);font-size:22px}

/* famiglia */
.pp-fam{background:var(--bg2)}
.fgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:28px}
.fcard{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;text-decoration:none;color:var(--fg);transition:transform .2s,border-color .2s,box-shadow .2s}
.fcard:hover{transform:translateY(-2px);border-color:var(--navy2);box-shadow:0 12px 30px rgba(11,48,72,.08)}
.fcard b{color:var(--navy);font-size:16px;line-height:1.35}
.sth{display:block;aspect-ratio:7/5}
.sth img{display:block;width:100%;height:100%;object-fit:contain}
.fcard .sth{margin:-4px -4px 12px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.fcard .ids{display:grid;gap:3px;margin-top:4px}
.fcard .ids>span{display:flex;gap:8px;align-items:baseline}
.fcard .ids i{font-style:normal;font-size:12px;font-weight:700;letter-spacing:.03em;color:var(--muted);min-width:56px}
.fcard .mono{font-size:13.5px;color:var(--fg2)}
.ftag{align-self:flex-start;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--bg3);color:var(--navy2);margin-bottom:6px}
.ftag.t-ep{background:#E9F1FE;color:#1F5FCF}
.ftag.t-lab{background:#EFE9FD;color:#6D35D6}
.ftag.t-nit{background:#FCECE9;color:var(--accent2)}
.ftag.t-met{background:#E7F5EE;color:#1F7A4D}
.pp-fam .more{margin:28px 0 0}

/* domande */
.faq details{border-bottom:1px solid var(--line);padding:4px 0}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:18px 40px 18px 0;font-weight:700;color:var(--navy);font-size:17px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';position:absolute;right:6px;top:14px;font-size:24px;font-weight:400;color:var(--muted);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{margin:0 0 18px;color:var(--fg2);max-width:70ch}
.pp-custom{padding-top:0 !important}
.pp-custom .cta .acts{justify-self:end;margin-top:0}

@media (max-width:1100px){.pp-grid,.pp-2col{grid-template-columns:minmax(0,1fr)}.pp-struct{position:relative;top:auto}.fgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.pp-kv{grid-template-columns:minmax(0,1fr)}}
@media (max-width:880px){.pp-custom .cta .acts{justify-self:start}}
@media (max-width:640px){.fgrid{grid-template-columns:minmax(0,1fr)}.phlist li{display:grid;grid-template-columns:92px minmax(0,1fr);column-gap:16px;row-gap:10px;align-items:center}.phlist .sth{width:92px;padding:4px;grid-row:1/3}.phlist li>div{align-self:end}.phlist li .btn{grid-column:2;justify-self:start;align-self:start;margin:0}.phlist b{font-size:15.5px;line-height:1.35}.pp-kv div{grid-template-columns:120px minmax(0,1fr)}.acts .btn{flex:1 1 100%}.pp-struct{padding:18px}}

/* avviso con collegamento alla richiesta */
.toast.link{pointer-events:auto;display:flex;gap:14px;align-items:center;max-width:calc(100vw - 32px)}
.toast.link a{color:inherit;text-decoration:underline;white-space:nowrap}

/* pagina richiesta d'offerta */
.qbox{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,64px);align-items:start}
.qbox.empty{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.qh{font-size:28px;margin:0 0 18px;display:flex;align-items:baseline;gap:12px}
.qcount{font-size:15px;font-weight:400;color:var(--muted);font-family:inherit}
.qlist{border-top:1px solid var(--line)}
.qrow{display:grid;grid-template-columns:104px minmax(0,1fr) auto 40px;gap:18px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.qrow .sth{padding:5px;border:1px solid var(--line);border-radius:12px;background:#fff}
.qinfo{display:grid;gap:6px;min-width:0}
.qname{color:var(--navy);font-weight:700;font-size:16.5px;text-decoration:none;overflow-wrap:anywhere}
a.qname:hover{text-decoration:underline}
.qids{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:13.5px;color:var(--fg2)}
.qtag{font-size:12px;font-weight:700;padding:2px 9px;border-radius:999px;background:#E9F1FE;color:#1F5FCF}
.qctl{display:grid;gap:8px;justify-items:stretch;min-width:210px}
.qctl select,.qctl input{min-width:0;width:100%;box-sizing:border-box;border:1.5px solid var(--line);border-radius:12px;padding:9px 12px;background:#fff;color:var(--fg);font:inherit;font-size:14px}
.qother[hidden]{display:none}
.qother input{width:100%}
.qpacks{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--fg2)}
.qpacks input{width:80px;flex:none}
.qrm{width:40px;height:40px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.qrm:hover{border-color:var(--accent2);color:var(--accent2)}
.qempty{padding:28px 0;display:grid;gap:10px}
.qempty b{font-size:19px;color:var(--navy)}
.qempty p{margin:0;color:var(--fg2);max-width:52ch}
.qempty .acts{margin-top:8px}
#quoteForm{position:sticky;top:150px}
.qdone{grid-column:1/-1;padding:40px 0;display:grid;gap:8px}
.qdone b{font-size:24px;color:var(--navy)}
.qdone p{margin:0;color:var(--fg2);font-size:17px}
@media (max-width:1100px){.qbox,.qbox.empty{grid-template-columns:minmax(0,1fr)}#quoteForm{position:static}}
@media (max-width:640px){.qrow{grid-template-columns:72px minmax(0,1fr) 40px;gap:12px}.qctl{grid-column:1/-1;min-width:0;grid-template-columns:minmax(0,1fr)}.qrow .qrm{grid-row:1;grid-column:3}}

/* pagina famiglia */
.fam-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,72px);align-items:center}
.fam-head h1{font-size:clamp(40px,4.4vw,72px);margin-top:14px;line-height:1.02}
.fam-stats{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.fam-stats span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 14px;font-size:14px;color:var(--fg2)}
.fam-stats b{color:var(--navy);margin-right:4px}
.fam-fig{margin:0;background:#fff;border:1px solid var(--line);border-radius:24px;padding:22px;display:grid;gap:12px;text-decoration:none;color:var(--fg2);transition:border-color .2s,box-shadow .2s}
.fam-fig:hover{border-color:var(--navy2);box-shadow:0 12px 30px rgba(11,48,72,.08)}
.fam-fig .sth{aspect-ratio:7/5}
.fam-fig span.go{font-weight:700;color:var(--navy);font-size:15px}
.fam-top{padding-bottom:clamp(28px,3vw,44px)}
.fam-list{padding-top:clamp(28px,3vw,44px) !important}
.famtools{display:grid;gap:16px;margin-bottom:22px}
.famsearch{display:flex;align-items:center;gap:10px;max-width:560px;border:1.5px solid var(--line);border-radius:999px;padding:0 18px;background:#fff}
.famsearch input{flex:1;min-width:0;border:0;outline:0;padding:13px 0;font:inherit;font-size:15px;background:transparent;color:var(--fg)}
.famsearch:focus-within{border-color:var(--navy)}
.famchips{display:flex;flex-wrap:wrap;gap:8px}
.famchips .chip i{font-style:normal;font-weight:400;opacity:.7;margin-left:6px}
.famcount{font-size:14px;color:var(--muted)}
.fcard{position:relative}
.fcard b a{color:inherit;text-decoration:none}
.fcard b a::after{content:'';position:absolute;inset:0;border-radius:18px}
.fcard b a:hover{text-decoration:underline}
.fcard .fadd{position:relative;z-index:1;align-self:flex-start;margin-top:10px}
.fcard[hidden]{display:none}
.noimg{display:flex;align-items:center;justify-content:center;height:100%;font-size:13px;color:var(--muted);background:var(--bg2);border-radius:12px}
.fam-more{margin-top:26px}
.fam-more[hidden],#famNone[hidden]{display:none}
@media (max-width:1100px){.fam-head{grid-template-columns:minmax(0,1fr)}.fam-fig{max-width:520px}}

/* pagina settore: famiglie dalla A alla Z */
.sectabs{margin:-6px 0 26px}
.sectabs a.chip{text-decoration:none}
.findbox{background:#fff;border:1px solid var(--line);border-radius:24px;padding:clamp(22px,2.4vw,32px);display:grid;gap:12px;box-shadow:var(--shadow)}
.findbox label b{color:var(--navy);font-size:20px}
.findbox .famsearch{max-width:none}
.findbox .hint{margin:8px 0 0}
.findbox .btn{justify-self:start}
.azhead{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap}
.azhead h2{margin:0}
.azbar{position:sticky;top:138px;z-index:5;display:flex;flex-wrap:wrap;gap:4px;margin:18px 0 8px;padding:10px 0;background:#fff;border-bottom:1px solid var(--line)}
.azbar[hidden]{display:none}
.azbar a{min-width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;font-weight:700;font-size:14px;color:var(--navy);text-decoration:none}
.azbar a:hover{background:var(--bg2)}
.azgrp{padding-top:18px;scroll-margin-top:200px}
.azgrp[hidden]{display:none}
.azgrp h3{font-size:30px;color:var(--accent2);margin:0 0 10px;font-weight:400}
.azlist{list-style:none;margin:0;padding:0;columns:4 230px;column-gap:28px}
.azlist li{break-inside:avoid}
.azlist li[hidden]{display:none}
.azlist a{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--line);color:var(--fg);text-decoration:none;font-size:15.5px}
.azlist a:hover{color:var(--navy);border-bottom-color:var(--navy)}
.azlist a i{font-style:normal;color:var(--muted);font-size:13.5px}
.azlist a[data-ready]{font-weight:700;color:var(--navy)}
.azfoot{margin-top:30px}
#azNone[hidden]{display:none}
@media (max-width:880px){.azbar{top:0;position:relative}}
/* curiosità sotto la storia della molecola */
.pp-fact{margin:18px 0 0;max-width:68ch;padding:14px 18px 15px;background:var(--bg2);border-left:3px solid var(--accent);border-radius:0 14px 14px 0;font-size:16px;line-height:1.6;color:var(--fg2)}
.pp-fact b{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent2);margin-bottom:4px;font-weight:400}

/* confronto livelli sul telefono: le tre colonne stanno nello schermo, senza scorrere di lato */
@media (max-width:640px){.pp-cmp{overflow:hidden}.pp-cmp table{min-width:0;table-layout:fixed}.pp-cmp th,.pp-cmp td{padding:13px 8px;font-size:14.5px;line-height:1.4}.pp-cmp thead th:first-child,.pp-cmp tbody th{padding-left:16px}.pp-cmp td,.pp-cmp thead th:not(:first-child){width:84px}.pp-cmp thead th{font-size:14.5px;vertical-align:top}.pp-cmp thead th span{display:block;font-size:12.5px;line-height:1.3;margin-top:2px}}
/* card della famiglia sul telefono: struttura a sinistra, dati a destra (più corte da scorrere) */
@media (max-width:640px){.fgrid{gap:12px}.fcard{display:grid;grid-template-columns:104px minmax(0,1fr);column-gap:14px;row-gap:5px;padding:14px;align-items:start}.fcard .sth{grid-row:1/span 4;grid-column:1;margin:0;padding:4px;border:1px solid var(--line);border-radius:12px;align-self:center}.fcard>*:not(.sth){grid-column:2}.fcard .ftag{justify-self:start}.fcard .fadd{margin-top:6px;justify-self:start}.fcard .noimg{min-height:74px;padding:4px;font-size:11px;text-align:center}.fcard .ids i{min-width:52px}}

/* v2 - struttura un po' più piccola anche sotto i 1100 px */
@media (max-width:1100px){.pp-struct{max-width:620px}}
/* v3 - pagine generate: immagine della struttura come file, riquadro pieno quando manca */
.pp-view img{display:block;width:100%;height:auto;max-height:440px;object-fit:contain}
.pp-view .noimg.big{width:100%;aspect-ratio:7/5;height:auto}
/* v4 - prodotti senza immagine: logo tenue al centro, nessuna scritta (il testo resta per i lettori di schermo) */
.noimg{background:#fff url(noimg-logo.svg) center/58% auto no-repeat;font-size:0;color:transparent}
/* 28/10 - nomi IUPAC lunghi nel titolo */
.pp-info h1{overflow-wrap:anywhere}.pp-info h1.long{font-size:clamp(28px,2.6vw,42px);line-height:1.12}.pp-info h1.xlong{font-size:clamp(20px,1.7vw,28px);line-height:1.25}.fcard b,.fcard a,.pcard b,.pcard a{overflow-wrap:anywhere}
/* 28/10 - struttura non applicabile (polimeri, estratti, materiale biologico...): una riga di testo al posto del logo */
.noimg.na{background:var(--bg2);font-size:13px;color:var(--muted);text-align:center;padding:14px;line-height:1.4}.noimg.na b{font-weight:600;color:var(--ink,inherit)}.noimg.na.big{font-size:15px}.fcard .noimg.na{font-size:11px;padding:6px}
/* v6 - da desktop storia e curiosità a sinistra sotto la struttura: a destra subito nome, dati e richiesta d'offerta; da telefono dopo la richiesta */
@media (min-width:1101px){.pp-grid.has-side{grid-template-areas:"fig info" "side info";grid-template-rows:auto 1fr;row-gap:30px}.pp-grid.has-side>.pp-struct{grid-area:fig}.pp-grid.has-side>.pp-info{grid-area:info}.pp-grid.has-side>.pp-side{grid-area:side;align-self:start;max-width:620px}}
.pp-side .pp-famlab{margin-top:4px}.pp-side .pp-story{font-size:16.5px;line-height:1.65}
/* v5 - storia della famiglia nelle pagine di impurezze e marcati: prima si dice di quale famiglia si parla */
.pp-famlab{margin:20px 0 -8px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--slate)}
.pp-famlab a{color:var(--navy);text-decoration:none;border-bottom:1px solid var(--line2)}
.pp-famlab a:hover{border-color:var(--navy)}
/* v8 - sinonimi sotto il nome, come nei cataloghi dei produttori: due righe e "Mostra tutti" */
.pp-syn{margin:6px 0 24px;font-size:14px;line-height:1.6;color:var(--slate)}.pp-syn .syl{margin:0;text-align:left;hyphens:none;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.pp-syn .syl b{color:var(--navy);font-weight:700}.pp-syn.open .syl{display:block;-webkit-line-clamp:unset;overflow:visible}.pp-syn .synmore{background:none;border:0;padding:2px 0;margin-top:2px;font:inherit;font-size:14px;font-weight:700;color:var(--navy);text-decoration:underline;cursor:pointer}
/* v9 (26/10) - telefono e tablet in verticale (fino a 1100 px), tutte le pagine prodotto: nome in alto, poi struttura, dati (CAS ecc. e sinonimi),
   storia e curiosità, infine la richiesta d'offerta */
@media (max-width:1100px){.pp-grid{display:flex;flex-direction:column;align-items:stretch;gap:0}.pp-grid>.pp-info{display:contents}.pp-grid>.pp-info>.eyebrow{order:1}.pp-grid>.pp-info>h1{order:2}.pp-grid>.pp-struct{order:3;margin:24px 0 0}.pp-grid>.pp-info>.pp-kv{order:4;margin-top:26px}.pp-grid>.pp-info>.pp-syn{order:5;margin:18px 0 0}.pp-grid>.pp-info>.pp-story,.pp-grid>.pp-info>.pp-fact{order:6}.pp-grid>.pp-info>.pp-syn+.pp-story{margin-top:26px}.pp-grid>.pp-side{order:6;margin-top:26px}.pp-grid>.pp-side>.pp-famlab{margin-top:0}.pp-grid>.pp-side>.pp-story:first-child{margin-top:0}.pp-grid>.pp-info>.pp-req{order:7}}

/* 31/10 sera: rifinitura di misure */
.mbnote{font-size:14px}
.ftag{font-size:13px}
.pp-syn .syl{font-size:15px}
.pp-fact b,.vp-big span{font-size:13px}
.fcard .ids i{font-size:13px}
/* 31/10 sera: riquadro Richiedi un'offerta, stesso passo tra i blocchi (il prezzo era a 4 px dalle quantità) */
form.pp-req .vp-big{margin:20px 0 0}
form.pp-req .acts{margin-top:24px}
form.pp-req > .hint{margin-top:14px}
/* 31/10 sera: sotto la struttura farmaceutica una dicitura al posto di formula e peso */
figcaption.hcas{display:flex;justify-content:center;font-family:var(--body)}
figcaption.hcas span{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--navy)}
figcaption.hcas span::before{content:"";width:16px;height:16px;border-radius:50%;background:var(--c-pharma) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.2l2.6 2.6L12 5.4' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
/* 31/10 notte: la stessa dicitura sotto la struttura nelle schede alimentari, col colore della linea */
figcaption.hcas.food span::before{background-color:var(--c-food)}
figcaption.hcas.fine span::before{background-color:var(--c-fine)}
.pp-grid>.pp-side.ag-side{order:3}   /* sul telefono la frase subito sotto l'immagine */
/* 31/10 sera: scheda farmaceutica, la linea in evidenza sopra il nome */
.ppline{margin:0 0 10px}
.ppline span{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:var(--c-pharma);color:#fff;font-size:14px;font-weight:700;letter-spacing:.01em}
.ppline span::before{content:"";width:8px;height:8px;border-radius:50%;background:#fff;opacity:.85}

/* 31/10 notte: al telefono struttura più grande nelle schede piccole */
@media (max-width:640px){.fcard{grid-template-columns:132px minmax(0,1fr);column-gap:12px}.fcard .sth{padding:2px}.fcard .ids i{min-width:48px}}
