/* it-peptides.it — foglio di stile */
@font-face{font-family:"Archivo";src:url(/risorse/archivo.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"Plex";src:url(/risorse/plexsans.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Plex";src:url(/risorse/plexsans6.woff2) format("woff2");font-weight:600;font-display:swap}
:root{
 --carta:#ffffff;--fondo:#f4f7f8;--fondo2:#eaf1f3;
 --testo:#17252e;--testo2:#3f525d;--tenue:#677a85;--filo:#dce5e9;
 --petrolio:#0f5f74;--petrolio-scuro:#0a4757;--petrolio-chiaro:#e3f0f3;
 --cotto:#b9532d;--cotto-chiaro:#fbeee8;--oliva:#5d7a2e;--oliva-chiaro:#eef3e4;
 --raggio:14px;--raggio-p:8px;--ombra:0 1px 2px rgba(15,40,50,.06),0 6px 20px rgba(15,40,50,.06);
 --largo:1160px;--testo-max:46rem
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:84px}
body{margin:0;font:400 1.0625rem/1.68 "Plex",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--testo);background:var(--carta)}
img,svg{max-width:100%;height:auto}
a{color:var(--petrolio);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{color:var(--petrolio-scuro);text-decoration-thickness:2px}
h1,h2,h3,h4{font-family:"Archivo",system-ui,sans-serif;font-stretch:96%;line-height:1.18;color:var(--testo);letter-spacing:-.012em}
h1{font-size:clamp(2rem,1.3rem + 2.6vw,3.05rem);font-weight:760;margin:.2em 0 .45em}
h2{font-size:clamp(1.38rem,1.1rem + 1vw,1.85rem);font-weight:700;margin:2.2em 0 .6em}
h3{font-size:1.15rem;font-weight:680;margin:1.6em 0 .4em}
p,ul,ol,dl,table{margin:0 0 1.1em}
code{font:500 .92em/1 ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--fondo2);padding:.12em .38em;border-radius:5px;word-break:break-word}
.salta{position:absolute;left:-999px;top:8px;background:var(--petrolio);color:#fff;padding:.5em 1em;border-radius:6px;z-index:50}
.salta:focus{left:12px}
.contenitore{max-width:var(--largo);margin:0 auto;padding:0 22px}

/* testata */
.testata{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--filo)}
.testata__riga{max-width:var(--largo);margin:0 auto;padding:0 22px;height:66px;display:flex;align-items:center;gap:26px}
.marchio{font-family:"Archivo",sans-serif;font-weight:780;font-size:1.22rem;letter-spacing:-.02em;color:var(--testo);text-decoration:none;white-space:nowrap;display:flex;align-items:center;gap:9px}
.marchio__segno{width:26px;height:26px;flex:none}
.marchio .tld{color:var(--petrolio)}
.marchio:hover{color:var(--testo)}
.menu{flex:1}
.menu__voci{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:4px}
.menu__voci>li>a,.menu__voci>li>button{font:600 .95rem/1 "Plex",sans-serif;color:var(--testo2);text-decoration:none;background:none;border:0;padding:.7em .8em;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:.35em}
.menu__voci>li>a:hover,.menu__voci>li>button:hover,.menu__voci>li>button[aria-expanded=true]{background:var(--fondo);color:var(--testo)}
.menu__voci a[aria-current=page]{color:var(--petrolio)}
.freccia{width:10px;height:10px;transition:transform .15s}
button[aria-expanded=true] .freccia{transform:rotate(180deg)}
.ha-tendina{position:relative}
.tendina{position:absolute;left:-14px;top:calc(100% + 10px);width:min(860px,92vw);background:#fff;border:1px solid var(--filo);border-radius:var(--raggio);box-shadow:0 18px 48px rgba(15,40,50,.14);padding:22px 24px 18px;display:none}
.tendina.aperta{display:block}
.tendina__griglia{display:grid;grid-template-columns:repeat(3,1fr);gap:18px 26px}
.tendina h3{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--tenue);margin:0 0 .5em;font-weight:650}
.tendina ul{list-style:none;margin:0;padding:0}
.tendina li a{display:block;padding:.28em 0;text-decoration:none;color:var(--testo);font-weight:600;font-size:.95rem}
.tendina li a:hover{color:var(--petrolio)}
.tendina__piede{margin-top:16px;padding-top:14px;border-top:1px solid var(--filo);display:flex;justify-content:space-between;font-size:.92rem}
.testata__cta{font:600 .93rem/1 "Plex",sans-serif;background:var(--petrolio);color:#fff;text-decoration:none;padding:.78em 1.1em;border-radius:999px;white-space:nowrap}
.testata__cta:hover{background:var(--petrolio-scuro);color:#fff}
.apri-menu{display:none;margin-left:auto;font:600 .95rem/1 "Plex",sans-serif;background:var(--fondo);border:1px solid var(--filo);color:var(--testo);padding:.62em .9em;border-radius:10px;cursor:pointer;align-items:center;gap:.5em}
.apri-menu svg{width:18px;height:18px}
.pannello-mobile{border-top:1px solid var(--filo);background:#fff;padding:10px 22px 22px;max-height:calc(100vh - 66px);overflow:auto}
.pannello-mobile details{border-bottom:1px solid var(--filo)}
.pannello-mobile summary{font-weight:600;padding:.85em 0;cursor:pointer;list-style:none;display:flex;justify-content:space-between}
.pannello-mobile summary::after{content:"+";color:var(--tenue)}
.pannello-mobile details[open] summary::after{content:"–"}
.pannello-mobile ul{list-style:none;margin:0 0 .8em;padding:0 0 0 .4em}
.pannello-mobile li a{display:block;padding:.4em 0;text-decoration:none;color:var(--testo)}
.pannello-mobile .diretti a{display:block;padding:.85em 0;border-bottom:1px solid var(--filo);font-weight:600;text-decoration:none;color:var(--testo)}
.pannello-mobile .diretti a.cta{color:var(--petrolio)}

/* percorso e intestazioni */
.percorso{font-size:.88rem;color:var(--tenue);padding-top:18px}
.percorso ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4em}
.percorso li+li::before{content:"/";margin-right:.4em;color:#b5c3ca}
.percorso a{color:var(--tenue);text-decoration:none}
.percorso a:hover{color:var(--petrolio)}
.intestazione{padding:14px 0 30px;border-bottom:1px solid var(--filo);margin-bottom:8px}
.etichetta{display:inline-block;font:650 .76rem/1 "Plex",sans-serif;text-transform:uppercase;letter-spacing:.09em;color:var(--petrolio);background:var(--petrolio-chiaro);padding:.5em .75em;border-radius:999px}
.attacco{font-size:1.16rem;color:var(--testo2);max-width:var(--testo-max);margin:0}
.aggiornato{font-size:.87rem;color:var(--tenue);margin-top:14px}

/* corpo articolo */
.impaginato{padding:28px 0 56px}
.testo-lungo{max-width:var(--testo-max)}
.testo-lungo>h2:first-child{margin-top:.3em}
.testo-lungo h2 .n{font:600 .8rem/1 "Plex",sans-serif;color:var(--cotto);display:block;letter-spacing:.06em;margin-bottom:.55em}
.testo-lungo table{width:100%;border-collapse:collapse;font-size:.95rem;display:block;overflow-x:auto}
.testo-lungo thead th{background:var(--fondo);text-align:left;font-weight:600;color:var(--testo)}
.testo-lungo th,.testo-lungo td{padding:.66em .8em;border-bottom:1px solid var(--filo);vertical-align:top}
.testo-lungo tbody tr:hover{background:#fafcfc}
.nota{font-size:.88rem;color:var(--tenue)}
ul.spunte{list-style:none;padding:0}
ul.spunte li{position:relative;padding-left:1.8em;margin-bottom:.45em}
ul.spunte li::before{content:"";position:absolute;left:0;top:.42em;width:1.05em;height:1.05em;border-radius:4px;background:var(--oliva-chiaro) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%235d7a2e' stroke-width='2'/%3E%3C/svg%3E") center/80% no-repeat}
ol.tappe{list-style:none;padding:0;counter-reset:t}
ol.tappe li{counter-increment:t;position:relative;padding:0 0 .9em 2.6em;border-left:2px solid var(--filo);margin-left:.9em}
ol.tappe li::before{content:counter(t);position:absolute;left:-.95em;top:-.1em;width:1.8em;height:1.8em;border-radius:50%;background:#fff;border:2px solid var(--petrolio);color:var(--petrolio);font:700 .82rem/1.55em "Archivo",sans-serif;text-align:center}
ol.tappe li:last-child{border-left-color:transparent}
dl.elenco-studi{display:grid;grid-template-columns:max-content 1fr;gap:.5em 1.2em}
dl.elenco-studi dt{font-weight:600;color:var(--petrolio-scuro)}
dl.elenco-studi dd{margin:0}
.avviso{background:var(--cotto-chiaro);border-left:4px solid var(--cotto);border-radius:0 var(--raggio-p) var(--raggio-p) 0;padding:14px 18px;font-size:.95rem;margin:1.6em 0}
.avviso strong{color:#8a3a1d}
.fonti{font-size:.93rem}
.fonti li{margin-bottom:.35em}
.domande details{border:1px solid var(--filo);border-radius:var(--raggio-p);margin-bottom:10px;background:#fff}
.domande summary{cursor:pointer;padding:14px 18px;font-weight:600;list-style:none;position:relative;padding-right:44px}
.domande summary::-webkit-details-marker{display:none}
.domande summary::after{content:"";position:absolute;right:18px;top:50%;width:9px;height:9px;border-right:2px solid var(--tenue);border-bottom:2px solid var(--tenue);transform:translateY(-70%) rotate(45deg);transition:transform .15s}
.domande details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.domande details>div{padding:0 18px 14px;color:var(--testo2)}

/* scheda rapida in testata */
.intestazione--scheda{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:44px;align-items:start}
.riquadro{border:1px solid var(--filo);border-radius:var(--raggio);padding:18px 20px;background:#fff;box-shadow:var(--ombra)}
.riquadro h2,.riquadro h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--tenue);margin:0 0 .8em;font-weight:650}
.dati{margin:0;font-size:.92rem}
.dati div{display:grid;grid-template-columns:92px 1fr;gap:10px;padding:.45em 0;border-top:1px solid var(--filo)}
.dati div:first-child{border-top:0}
.dati dt{color:var(--tenue)}
.dati dd{margin:0;font-weight:600;color:var(--testo)}
.salti{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0;list-style:none}
.salti a{display:inline-block;font-size:.86rem;padding:.4em .8em;border:1px solid var(--filo);border-radius:999px;text-decoration:none;color:var(--testo2);background:#fff}
.salti a:hover{border-color:var(--petrolio);color:var(--petrolio)}
.riquadro--guida{background:var(--petrolio-chiaro);border:0;border-radius:var(--raggio);padding:22px 24px;margin:2.2em 0}
.riquadro--guida p{font-size:.93rem;margin:0 0 .8em}
.bottone{display:inline-flex;align-items:center;gap:.5em;font:600 .97rem/1.2 "Plex",sans-serif;padding:.85em 1.25em;border-radius:999px;text-decoration:none;background:var(--petrolio);color:#fff;border:2px solid var(--petrolio)}
.bottone:hover{background:var(--petrolio-scuro);border-color:var(--petrolio-scuro);color:#fff}
.bottone--vuoto{background:transparent;color:var(--petrolio)}
.bottone--vuoto:hover{background:var(--petrolio);color:#fff}
.bottone--cotto{background:var(--cotto);border-color:var(--cotto)}
.bottone--cotto:hover{background:#9a4323;border-color:#9a4323}

/* schede correlate */
.correlate{background:var(--fondo);padding:44px 0 52px}
.correlate h2{margin-top:0}
.carte{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:16px}
.carta{background:#fff;border:1px solid var(--filo);border-radius:var(--raggio);padding:18px 18px 16px;text-decoration:none;color:var(--testo);display:flex;flex-direction:column;gap:6px;transition:border-color .15s,box-shadow .15s}
.carta:hover{border-color:#b8ccd4;box-shadow:var(--ombra);color:var(--testo)}
.carta strong{font-family:"Archivo",sans-serif;font-size:1.08rem}
.carta span{font-size:.9rem;color:var(--tenue);line-height:1.45}

/* home */
.apertura{background:linear-gradient(180deg,var(--fondo) 0%,#fff 100%);border-bottom:1px solid var(--filo)}
.apertura__griglia{display:grid;grid-template-columns:1.25fr .9fr;gap:52px;align-items:center;padding:56px 0 60px}
.apertura h1{font-size:clamp(2.2rem,1.4rem + 3vw,3.5rem)}
.apertura .attacco{font-size:1.2rem}
.azioni{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.pannello-dati{background:#fff;border:1px solid var(--filo);border-radius:20px;box-shadow:var(--ombra);padding:24px 26px}
.pannello-dati h2{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--tenue);margin:0 0 14px}
.pannello-dati ul{list-style:none;margin:0;padding:0}
.pannello-dati li{display:flex;justify-content:space-between;gap:14px;padding:.62em 0;border-top:1px solid var(--filo);font-size:.96rem}
.pannello-dati li:first-child{border-top:0}
.pannello-dati b{font-family:"Archivo",sans-serif;color:var(--petrolio)}
.fascia{padding:58px 0}
.fascia--grigia{background:var(--fondo)}
.fascia h2{margin-top:0}
.fascia__testa{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px;flex-wrap:wrap}
.fascia__testa p{margin:0;color:var(--testo2);max-width:40rem}
.famiglie{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.famiglia{background:#fff;border:1px solid var(--filo);border-radius:var(--raggio);padding:22px}
.famiglia h3{margin:0 0 .35em}
.famiglia p{font-size:.93rem;color:var(--testo2);margin-bottom:.9em}
.famiglia ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.famiglia li a{display:inline-block;font-size:.9rem;font-weight:600;padding:.38em .75em;border-radius:999px;background:var(--petrolio-chiaro);color:var(--petrolio-scuro);text-decoration:none}
.famiglia li a:hover{background:var(--petrolio);color:#fff}
.tre-colonne{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.tre-colonne h3{margin-top:0}
.cifra{font-family:"Archivo",sans-serif;font-weight:800;font-size:2.3rem;color:var(--cotto);line-height:1}
.striscia-guida{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;background:var(--petrolio);color:#e8f3f6;border-radius:20px;padding:34px 38px}
.striscia-guida h2{color:#fff;margin:0 0 .3em}
.striscia-guida p{margin:0}
.striscia-guida .bottone{background:#fff;color:var(--petrolio-scuro);border-color:#fff}
.striscia-guida .bottone:hover{background:var(--cotto-chiaro);border-color:var(--cotto-chiaro)}
table.semplice{width:100%;border-collapse:collapse;font-size:.95rem}
table.semplice th,table.semplice td{text-align:left;padding:.65em .8em;border-bottom:1px solid var(--filo)}
table.semplice thead th{background:#fff;font-weight:600}

/* pagina acquisto */
.fase{border:1px solid var(--filo);border-radius:var(--raggio);padding:6px 24px 14px;margin:0 0 22px;background:#fff}
.fase h2{margin-top:.9em;display:flex;align-items:center;gap:.55em}
.fase h2 .bollino{font:700 .78rem/1 "Plex",sans-serif;background:var(--petrolio);color:#fff;border-radius:999px;padding:.45em .7em;letter-spacing:.04em}
.controlli{list-style:none;margin:0 0 .6em;padding:0}
.controlli li{display:grid;grid-template-columns:28px 1fr;gap:12px;padding:12px 0;border-top:1px dashed var(--filo)}
.controlli li:first-child{border-top:0}
.casella{width:22px;height:22px;border:2px solid var(--petrolio);border-radius:6px;margin-top:3px}
.controlli strong{display:block;margin-bottom:.15em}
.controlli p{margin:0;color:var(--testo2);font-size:.97rem}
.allarmi{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:1.4em}
.allarmi div{border-radius:var(--raggio-p);padding:14px 16px;font-size:.95rem}
.allarmi .si{background:var(--oliva-chiaro)}
.allarmi .no{background:var(--cotto-chiaro)}
.allarmi h3{margin:0 0 .4em;font-size:1rem}
.allarmi ul{margin:0;padding-left:1.1em}
.negozio{margin:46px 0;padding:30px 30px 28px;border-radius:20px;border:1px solid var(--filo);background:linear-gradient(135deg,#fff 0%,var(--fondo) 100%)}
.negozio+.negozio{margin-top:58px}
.negozio h2{margin:.35em 0 .5em}
.negozio .bottone{margin-top:8px}
.negozio--x10{background:linear-gradient(135deg,#fff 0%,var(--cotto-chiaro) 100%)}
.separatore{height:1px;background:var(--filo);margin:48px 0}

/* calcolatore */
.calcolatore{border:1px solid var(--filo);border-radius:var(--raggio);padding:22px;background:var(--fondo);margin:1.4em 0}
.calcolatore .campi{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.calcolatore label{font-size:.88rem;font-weight:600;color:var(--testo2);display:flex;flex-direction:column;gap:6px}
.calcolatore input{font:inherit;padding:.6em .7em;border:1px solid #c8d6dc;border-radius:8px;background:#fff;width:100%}
.esito{margin-top:16px;background:#fff;border-radius:10px;padding:14px 16px;font-size:1rem}
.esito b{color:var(--petrolio-scuro);font-family:"Archivo",sans-serif}

/* indice peptidi */
.gruppo{margin-bottom:38px}
.gruppo h2{margin-top:0}

/* piede */
.piede{background:#10252e;color:#b8c9d0;font-size:.93rem;padding:48px 0 30px}
.piede a{color:#e1edf1;text-decoration:none}
.piede a:hover{text-decoration:underline;color:#fff}
.piede__griglia{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px}
.piede .marchio{color:#fff;margin-bottom:12px}
.piede .marchio .tld{color:#7fc4d4}
.piede h2{font-size:.78rem;text-transform:uppercase;letter-spacing:.09em;color:#8aa3ad;margin:0 0 .9em}
.piede ul{list-style:none;margin:0;padding:0}
.piede li{margin:.38em 0}
.piede__fondo{border-top:1px solid #23404b;margin-top:34px;padding-top:18px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:.86rem;color:#8aa3ad}

/* adattamenti */
@media (max-width:1020px){
 .menu,.testata__cta{display:none}
 .apri-menu{display:inline-flex}
 .intestazione--scheda{grid-template-columns:1fr;gap:24px}
 .apertura__griglia{grid-template-columns:1fr;gap:30px;padding:40px 0}
 .famiglie,.tre-colonne{grid-template-columns:1fr 1fr}
 .piede__griglia{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
 body{font-size:1rem}
 .famiglie,.tre-colonne,.allarmi,.calcolatore .campi{grid-template-columns:1fr}
 .striscia-guida{grid-template-columns:1fr;padding:26px 22px}
 .negozio{padding:22px 20px}
 .fase{padding:4px 16px 10px}
 .piede__griglia{grid-template-columns:1fr}
 dl.elenco-studi{grid-template-columns:1fr}
 dl.elenco-studi dd{margin-bottom:.6em}
}
@media print{.testata,.piede,.correlate{display:none}}
/* pagine di testo: colonna unica centrata */
.pg-testo main .contenitore{max-width:924px}
.pg-testo .testo-lungo,.pg-testo .attacco{max-width:none}
.pg-testo .intestazione--scheda{grid-template-columns:minmax(0,1fr) 300px;gap:36px}
.pg-testo .correlate .contenitore{max-width:var(--largo)}
@media (max-width:1020px){.pg-testo .intestazione--scheda{grid-template-columns:1fr}}
.bollino{white-space:nowrap;flex-shrink:0}