/* Vero INCI — articolo: come leggere davvero l’INCI di una crema viso
   Scope locale: zero side effects fuori da questa pagina */

body.vi-page-guide-inci-viso{
  --inci-accent: var(--g-accent, #0f766e);
  --inci-bg-soft: linear-gradient(180deg, rgba(255,255,255,.92), rgba(247,250,252,.94));
  --inci-border-soft: rgba(148,163,184,.24);
  --inci-shadow-soft: 0 16px 36px rgba(2,6,23,.06);
}

/* meta sotto H1 */
body.vi-page-guide-inci-viso .guide-updated{
  margin: .55rem 0 .8rem;
  font-size: .93rem;
  color: rgba(2,6,23,.68);
}

body.vi-page-guide-inci-viso .guide-updated a{
  font-weight: 700;
}

/* hero leggermente più editoriale */
body.vi-page-guide-inci-viso .guide-hero{
  padding-bottom: 1.2rem;
}

body.vi-page-guide-inci-viso .guide-hero .page-title{
  max-width: 14ch;
}

body.vi-page-guide-inci-viso .guide-hero .page-subtitle{
  max-width: 70ch;
}

/* banner iniziale */
body.vi-page-guide-inci-viso .guide-banner{
  margin-top: 1.15rem;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid var(--inci-border-soft);
  box-shadow: var(--inci-shadow-soft);
  background: #fff;
}

body.vi-page-guide-inci-viso .guide-banner img{
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1200 / 630;
  object-fit: cover;
}

/* grid a 4 card iniziale */
body.vi-page-guide-inci-viso .inci-grid-4{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1080px){
  body.vi-page-guide-inci-viso .inci-grid-4{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px){
  body.vi-page-guide-inci-viso .inci-grid-4{
    grid-template-columns: 1fr;
  }
}

/* lista ordinata più leggibile */
body.vi-page-guide-inci-viso .inci-ordered{
  margin: .75rem 0 0;
  padding-left: 1.15rem;
}

body.vi-page-guide-inci-viso .inci-ordered li{
  margin: 0 0 .95rem;
  line-height: 1.72;
  color: rgba(2,6,23,.82);
}

body.vi-page-guide-inci-viso .inci-ordered li::marker{
  font-weight: 800;
  color: var(--inci-accent);
}

/* sidebox destra */
body.vi-page-guide-inci-viso .inci-sidebox{
  border: 1px solid var(--inci-border-soft);
  background: var(--inci-bg-soft);
  border-radius: 22px;
  padding: 1rem 1rem .95rem;
  box-shadow: var(--inci-shadow-soft);
}

body.vi-page-guide-inci-viso .inci-sidebox h3{
  margin: 0 0 .45rem;
  font-size: 1.02rem;
  letter-spacing: -.01em;
}

body.vi-page-guide-inci-viso .inci-sidebox p{
  margin: 0 0 .7rem;
  color: rgba(2,6,23,.78);
}

body.vi-page-guide-inci-viso .inci-sidebox-accent{
  background:
    radial-gradient(circle at top right, rgba(15,118,110,.12), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(240,253,250,.96));
  border-color: rgba(15,118,110,.18);
}

/* checklist riutilizzabile */
body.vi-page-guide-inci-viso .vi-checklist{
  list-style: none;
  margin: .7rem 0 0;
  padding: 0;
}

body.vi-page-guide-inci-viso .vi-checklist li{
  position: relative;
  margin: 0 0 .72rem;
  padding-left: 1.45rem;
  color: rgba(2,6,23,.82);
  line-height: 1.65;
}

body.vi-page-guide-inci-viso .vi-checklist li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 900;
  color: var(--inci-accent);
}

/* blocco claim */
body.vi-page-guide-inci-viso .claim-stack{
  display: grid;
  gap: .85rem;
}

body.vi-page-guide-inci-viso .claim-card{
  border: 1px solid var(--inci-border-soft);
  background: rgba(255,255,255,.94);
  border-radius: 18px;
  padding: .9rem .95rem .85rem;
  box-shadow: 0 10px 24px rgba(2,6,23,.04);
}

body.vi-page-guide-inci-viso .claim-card h3{
  margin: 0 0 .35rem;
  font-size: 1rem;
  letter-spacing: -.01em;
}

body.vi-page-guide-inci-viso .claim-card p{
  margin: 0;
  color: rgba(2,6,23,.76);
}

/* sezione intro / callout un po' più ariosa */
body.vi-page-guide-inci-viso #intro .vi-callout + .vi-callout{
  margin-top: .85rem;
}

/* trust finale */
body.vi-page-guide-inci-viso .guide-trust{
  margin-top: 1.15rem;
}

/* ritocchi FAQ */
body.vi-page-guide-inci-viso .faq details{
  background: rgba(255,255,255,.9);
}

body.vi-page-guide-inci-viso .faq summary{
  padding-right: 1.4rem;
}

/* card blocchi più vive */
body.vi-page-guide-inci-viso .guide-card{
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.95));
}

/* media block: distanza più bilanciata */
body.vi-page-guide-inci-viso .vi-media-block{
  margin-top: 1.4rem;
}

body.vi-page-guide-inci-viso .vi-media{
  align-items: start;
  gap: 1.15rem;
}

/* piccolo miglioramento leggibilità mobile */
@media (max-width: 640px){
  body.vi-page-guide-inci-viso .guide-hero{
    padding: 1rem .95rem 1rem;
  }

  body.vi-page-guide-inci-viso .guide-updated{
    font-size: .88rem;
  }

  body.vi-page-guide-inci-viso .inci-sidebox,
  body.vi-page-guide-inci-viso .claim-card{
    border-radius: 16px;
  }

  body.vi-page-guide-inci-viso .guide-banner{
    border-radius: 18px;
  }
}

/* override immagini reali articolo */
body.vi-page-guide-inci-viso .guide-banner img{
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  object-fit: contain;
}

body.vi-page-guide-inci-viso .article-visual{
  margin: 0;
  border: 1px solid rgba(148,163,184,.24);
  border-radius: 22px;
  overflow: hidden;
  background: rgba(255,255,255,.96);
  box-shadow: 0 16px 36px rgba(2,6,23,.06);
}

body.vi-page-guide-inci-viso .article-visual img{
  display: block;
  width: 100%;
  height: auto;
}

body.vi-page-guide-inci-viso .article-visual figcaption{
  margin: 0;
  padding: .7rem .9rem .85rem;
  font-size: .92rem;
  color: rgba(2,6,23,.68);
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.96));
}

@media (max-width: 640px){
  body.vi-page-guide-inci-viso .article-visual{
    border-radius: 18px;
  }
}

/* refine hero alignment articolo INCI */
body.vi-page-guide-inci-viso .guide-hero{
  text-align: center;
}

body.vi-page-guide-inci-viso .guide-hero-mark{
  margin-inline: auto;
}

body.vi-page-guide-inci-viso .guide-hero .page-title{
  max-width: 18ch;
  margin-inline: auto;
}

body.vi-page-guide-inci-viso .guide-updated{
  margin-left: auto;
  margin-right: auto;
  max-width: 60ch;
}

body.vi-page-guide-inci-viso .guide-hero .page-subtitle{
  max-width: 72ch;
  margin-left: auto;
  margin-right: auto;
}

body.vi-page-guide-inci-viso .guide-toc{
  justify-content: center;
}

@media (max-width: 640px){
  body.vi-page-guide-inci-viso .guide-hero .page-title{
    max-width: 16ch;
  }
}

/* Vero INCI — articolo INCI protezione solare
   Override locale dedicato
   Scope: solo body.vi-page-guide-inci-solare */

body.vi-page-guide-inci-solare{
  --ips-accent: #d97706;
  --ips-accent-2: #f59e0b;
  --ips-accent-soft: #fff4db;
  --ips-sea: #dff4f2;
  --ips-sand: #fff8ee;
  --ips-border: rgba(148,163,184,.24);
  --ips-shadow: 0 18px 40px rgba(2,6,23,.07);
  --ips-radius: 24px;
}

/* contenitore principale più arioso */
body.vi-page-guide-inci-solare .guide-page{
  gap: 1.15rem;
}

/* hero principale */
body.vi-page-guide-inci-solare .guide-hero{
  padding: 1.2rem 1.2rem 1rem;
  border: 1px solid rgba(217,119,6,.16);
  border-radius: 28px;
  background:
    radial-gradient(circle at top right, rgba(245,158,11,.10), transparent 32%),
    radial-gradient(circle at top left, rgba(16,185,129,.08), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,250,240,.96));
  box-shadow: var(--ips-shadow);
}

body.vi-page-guide-inci-solare .guide-hero .page-title{
  max-width: 16ch;
  letter-spacing: -.03em;
}

body.vi-page-guide-inci-solare .guide-updated{
  color: rgba(2,6,23,.68);
}

body.vi-page-guide-inci-solare .guide-updated strong{
  color: #0f172a;
}

body.vi-page-guide-inci-solare .page-subtitle{
  max-width: 64ch;
}

/* toc */
body.vi-page-guide-inci-solare .guide-toc{
  gap: .55rem;
  justify-content: center;
  margin-top: .9rem;
}

body.vi-page-guide-inci-solare .guide-toc a{
  border-radius: 999px;
  border: 1px solid rgba(217,119,6,.18);
  background: rgba(255,255,255,.9);
  padding: .42rem .78rem;
  font-size: .88rem;
  box-shadow: 0 6px 14px rgba(2,6,23,.04);
}

/* hero image */
body.vi-page-guide-inci-solare .guide-banner{
  margin: 1rem 0 0;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(217,119,6,.14);
  box-shadow: 0 14px 28px rgba(2,6,23,.06);
}

body.vi-page-guide-inci-solare .guide-banner img{
  display: block;
  width: 100%;
  height: auto;
}

/* callout iniziali */
body.vi-page-guide-inci-solare .vi-callout{
  border-radius: 20px;
  box-shadow: 0 10px 22px rgba(2,6,23,.04);
}

body.vi-page-guide-inci-solare .vi-callout-ok{
  background: linear-gradient(180deg, rgba(240,253,250,.96), rgba(236,253,245,.92));
  border: 1px solid rgba(16,185,129,.16);
}

body.vi-page-guide-inci-solare .vi-callout-warn{
  background: linear-gradient(180deg, rgba(255,251,235,.98), rgba(255,247,237,.95));
  border: 1px solid rgba(245,158,11,.18);
}

/* blocchi principali */
body.vi-page-guide-inci-solare .guide-block,
body.vi-page-guide-inci-solare .vi-media-block,
body.vi-page-guide-inci-solare .guide-method,
body.vi-page-guide-inci-solare .faq,
body.vi-page-guide-inci-solare .guide-trust{
  border: 1px solid var(--ips-border);
  border-radius: var(--ips-radius);
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.95));
  box-shadow: 0 14px 30px rgba(2,6,23,.045);
  padding: 1rem 1rem 1.05rem;
}

/* titoletti sezione */
body.vi-page-guide-inci-solare .guide-kicker{
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: .72rem;
  color: rgba(2,6,23,.56);
}

/* card */
body.vi-page-guide-inci-solare .guide-grid{
  gap: .9rem;
}

body.vi-page-guide-inci-solare .guide-card{
  border-radius: 20px;
  border: 1px solid rgba(217,119,6,.12);
  background:
    radial-gradient(circle at top right, rgba(245,158,11,.07), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,251,235,.92));
  box-shadow: 0 10px 22px rgba(2,6,23,.04);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

body.vi-page-guide-inci-solare .guide-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 30px rgba(2,6,23,.07);
  border-color: rgba(217,119,6,.22);
}

/* media split */
body.vi-page-guide-inci-solare .vi-media{
  gap: 1rem;
  align-items: start;
}

body.vi-page-guide-inci-solare .vi-media__img{
  min-width: 0;
}

/* box laterale regola pratica */
body.vi-page-guide-inci-solare .inci-sidebox{
  border-radius: 22px;
  border: 1px solid rgba(16,185,129,.14);
  background:
    radial-gradient(circle at top right, rgba(16,185,129,.10), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(240,253,250,.94));
  box-shadow: 0 12px 24px rgba(2,6,23,.04);
  padding: 1rem 1rem .95rem;
}

body.vi-page-guide-inci-solare .inci-sidebox h3{
  margin-top: 0;
}

/* stack claim */
body.vi-page-guide-inci-solare .claim-stack{
  display: grid;
  gap: .75rem;
}

body.vi-page-guide-inci-solare .claim-card{
  border-radius: 18px;
  border: 1px solid rgba(217,119,6,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,248,235,.94));
  box-shadow: 0 10px 20px rgba(2,6,23,.04);
  padding: .9rem .95rem;
}

body.vi-page-guide-inci-solare .claim-card h3{
  margin: 0 0 .35rem;
}

/* ordered list */
body.vi-page-guide-inci-solare .inci-ordered li{
  margin-bottom: .75rem;
}

/* checklist finale */
body.vi-page-guide-inci-solare #checklist{
  background:
    radial-gradient(circle at top right, rgba(245,158,11,.08), transparent 28%),
    linear-gradient(180deg, rgba(255,251,235,.98), rgba(255,247,237,.95));
}

body.vi-page-guide-inci-solare #checklist .vi-media{
  align-items: center;
}

body.vi-page-guide-inci-solare .article-visual{
  margin: 0;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(217,119,6,.14);
  background: rgba(255,255,255,.96);
  box-shadow: 0 14px 28px rgba(2,6,23,.06);
}

body.vi-page-guide-inci-solare .article-visual img{
  display: block;
  width: 100%;
  height: auto;
}

body.vi-page-guide-inci-solare .article-visual figcaption{
  padding: .72rem .9rem .82rem;
  font-size: .88rem;
  color: rgba(2,6,23,.66);
  background: rgba(255,255,255,.96);
}

/* faq */
body.vi-page-guide-inci-solare .faq details{
  border-radius: 16px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(148,163,184,.18);
  box-shadow: 0 6px 14px rgba(2,6,23,.03);
}

body.vi-page-guide-inci-solare .faq summary{
  font-weight: 700;
}

/* trust */
body.vi-page-guide-inci-solare .guide-trust{
  background:
    radial-gradient(circle at top left, rgba(16,185,129,.08), transparent 24%),
    linear-gradient(180deg, rgba(240,253,250,.98), rgba(248,250,252,.96));
}

/* chip correlati */
body.vi-page-guide-inci-solare .guide-chip{
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(217,119,6,.16);
  color: rgba(2,6,23,.78);
}

/* responsive */
@media (max-width: 900px){
  body.vi-page-guide-inci-solare .guide-hero .page-title{
    max-width: 18ch;
  }

  body.vi-page-guide-inci-solare .vi-media{
    gap: .9rem;
  }
}

@media (max-width: 640px){
  body.vi-page-guide-inci-solare .guide-hero,
  body.vi-page-guide-inci-solare .guide-block,
  body.vi-page-guide-inci-solare .vi-media-block,
  body.vi-page-guide-inci-solare .guide-method,
  body.vi-page-guide-inci-solare .faq,
  body.vi-page-guide-inci-solare .guide-trust{
    padding: .92rem;
    border-radius: 20px;
  }

  body.vi-page-guide-inci-solare .guide-toc{
    justify-content: flex-start;
  }

  body.vi-page-guide-inci-solare .guide-toc a{
    font-size: .84rem;
    padding: .38rem .68rem;
  }

  body.vi-page-guide-inci-solare .guide-hero .page-title{
    max-width: 14ch;
  }

  body.vi-page-guide-inci-solare .guide-banner,
  body.vi-page-guide-inci-solare .article-visual{
    border-radius: 18px;
  }
}

/* IPS — immagini meno invasive, layout split più editoriale */

body.vi-page-guide-inci-solare .ips-intro-split{
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(300px, .95fr);
  gap: 1rem;
  align-items: start;
  margin-bottom: 1rem;
}

body.vi-page-guide-inci-solare .ips-intro-split__content{
  min-width: 0;
}

body.vi-page-guide-inci-solare .ips-intro-split__media{
  min-width: 0;
}

body.vi-page-guide-inci-solare .ips-intro-split .guide-banner{
  margin: 0;
  max-width: 100%;
}

body.vi-page-guide-inci-solare .ips-intro-split .guide-banner img{
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

/* checklist più compatta */
body.vi-page-guide-inci-solare #checklist .vi-media{
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(260px, .92fr);
  gap: 1rem;
  align-items: start;
}

body.vi-page-guide-inci-solare #checklist .vi-media__text{
  min-width: 0;
}

body.vi-page-guide-inci-solare #checklist .vi-media__img{
  min-width: 0;
}

body.vi-page-guide-inci-solare #checklist .article-visual{
  max-width: 430px;
  margin-left: auto;
}

body.vi-page-guide-inci-solare #checklist .article-visual img{
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

body.vi-page-guide-inci-solare #checklist .vi-checklist{
  margin-bottom: 0;
}

/* blocchi con immagine meno alti */
body.vi-page-guide-inci-solare .guide-banner,
body.vi-page-guide-inci-solare .article-visual{
  box-shadow: 0 10px 22px rgba(2,6,23,.05);
}

/* responsive */
@media (max-width: 900px){
  body.vi-page-guide-inci-solare .ips-intro-split,
  body.vi-page-guide-inci-solare #checklist .vi-media{
    grid-template-columns: 1fr;
  }

  body.vi-page-guide-inci-solare #checklist .article-visual{
    max-width: 100%;
    margin-left: 0;
  }
}

@media (max-width: 640px){
  body.vi-page-guide-inci-solare .ips-intro-split{
    gap: .85rem;
  }

  body.vi-page-guide-inci-solare .ips-intro-split .guide-banner img,
  body.vi-page-guide-inci-solare #checklist .article-visual img{
    aspect-ratio: auto;
    object-fit: contain;
  }
}

/* IPS — link utili più curati + rifinitura hero */

body.vi-page-guide-inci-solare .ips-linkbar{
  display: grid;
  gap: .65rem;
  padding: .9rem 1rem;
}

body.vi-page-guide-inci-solare .ips-linkbar__label{
  display: inline-flex;
  align-items: center;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(2,6,23,.66);
}

body.vi-page-guide-inci-solare .ips-linkbar__items{
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}

body.vi-page-guide-inci-solare .ips-linkchip{
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: .56rem .82rem;
  border-radius: 999px;
  border: 1px solid rgba(16,185,129,.18);
  background: rgba(255,255,255,.96);
  color: #0f172a;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(2,6,23,.04);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}

body.vi-page-guide-inci-solare .ips-linkchip:hover{
  transform: translateY(-1px);
  border-color: rgba(16,185,129,.30);
  box-shadow: 0 12px 22px rgba(2,6,23,.07);
  background: rgba(240,253,250,.98);
}

body.vi-page-guide-inci-solare .ips-linkchip:focus-visible{
  outline: 2px solid rgba(16,185,129,.42);
  outline-offset: 2px;
}

/* hero media più pulita */
body.vi-page-guide-inci-solare .ips-intro-split{
  align-items: center;
}

body.vi-page-guide-inci-solare .ips-intro-split .guide-banner{
  max-width: 420px;
  margin-left: auto;
}

body.vi-page-guide-inci-solare .ips-intro-split .guide-banner img{
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

@media (max-width: 900px){
  body.vi-page-guide-inci-solare .ips-intro-split .guide-banner{
    max-width: 100%;
    margin-left: 0;
  }
}

@media (max-width: 640px){
  body.vi-page-guide-inci-solare .ips-linkbar{
    padding: .85rem .9rem;
  }

  body.vi-page-guide-inci-solare .ips-linkbar__items{
    gap: .45rem;
  }

  body.vi-page-guide-inci-solare .ips-linkchip{
    width: 100%;
    justify-content: center;
  }

  body.vi-page-guide-inci-solare .ips-intro-split .guide-banner img{
    aspect-ratio: auto;
    object-fit: contain;
  }
}

/* IPS — refine spacing per box intro/link utili/nota */

body.vi-page-guide-inci-solare .ips-intro-split__content{
  display: grid;
  gap: .9rem;
  align-content: start;
}

body.vi-page-guide-inci-solare .ips-linkbar{
  padding: 1rem 1.05rem 1.05rem;
  gap: .8rem;
}

body.vi-page-guide-inci-solare .ips-linkbar__label{
  margin: 0;
  line-height: 1.2;
}

body.vi-page-guide-inci-solare .ips-linkbar__items{
  gap: .65rem;
}

body.vi-page-guide-inci-solare .ips-linkchip{
  min-height: 40px;
  padding: .62rem .9rem;
  font-size: .96rem;
}

body.vi-page-guide-inci-solare .vi-callout-warn{
  padding: 1rem 1.05rem;
  line-height: 1.72;
  font-size: .99rem;
}

body.vi-page-guide-inci-solare .vi-callout-warn strong{
  display: inline-block;
  margin-right: .32rem;
}

body.vi-page-guide-inci-solare .vi-callout-warn p{
  margin: 0;
}

body.vi-page-guide-inci-solare .ips-intro-split__content .vi-callout{
  margin: 0;
}

@media (max-width: 640px){
  body.vi-page-guide-inci-solare .ips-intro-split__content{
    gap: .75rem;
  }

  body.vi-page-guide-inci-solare .ips-linkbar{
    padding: .92rem .95rem 1rem;
  }

  body.vi-page-guide-inci-solare .vi-callout-warn{
    padding: .92rem .95rem;
    line-height: 1.68;
  }
}

/* IPS — micro gap sopra hero a destra */
body.vi-page-guide-inci-solare .ips-intro-split__media{
  padding-top: 1.3rem;
}

@media (max-width: 900px){
  body.vi-page-guide-inci-solare .ips-intro-split__media{
    padding-top: 0;
  }
}

/* IPS — compact layout per sezione SPF/UVA */
body.vi-page-guide-inci-solare #spf-uva .vi-media{
  grid-template-columns: 1fr;
  gap: .9rem;
}

body.vi-page-guide-inci-solare #spf-uva .vi-media__img,
body.vi-page-guide-inci-solare #spf-uva .vi-media__text{
  min-width: 0;
  max-width: none;
}

body.vi-page-guide-inci-solare #spf-uva .vi-media__text{
  padding: 1rem 1.05rem;
  border: 1px solid rgba(217,119,6,.14);
  border-radius: 20px;
  background:
    radial-gradient(circle at top right, rgba(245,158,11,.06), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,251,235,.93));
  box-shadow: 0 10px 20px rgba(2,6,23,.04);
}

body.vi-page-guide-inci-solare #spf-uva .vi-media__text > p:first-child{
  margin-top: 0;
}

body.vi-page-guide-inci-solare #spf-uva .vi-checklist{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .42rem 1rem;
  margin: .8rem 0 .35rem;
}

body.vi-page-guide-inci-solare #spf-uva .vi-checklist li{
  margin: 0;
}

body.vi-page-guide-inci-solare #spf-uva .vi-media__text > p:last-child{
  margin-bottom: 0;
}

@media (max-width: 640px){
  body.vi-page-guide-inci-solare #spf-uva .vi-checklist{
    grid-template-columns: 1fr;
  }

  body.vi-page-guide-inci-solare #spf-uva .vi-media__text{
    padding: .92rem .95rem;
  }
}
/* IPS — compact layout per sezione SPF/UVA */
body.vi-page-guide-inci-solare #spf-uva .vi-media{
  grid-template-columns: 1fr;
  gap: .9rem;
}

body.vi-page-guide-inci-solare #spf-uva .vi-media__img,
body.vi-page-guide-inci-solare #spf-uva .vi-media__text{
  min-width: 0;
  max-width: none;
}

body.vi-page-guide-inci-solare #spf-uva .vi-media__text{
  padding: 1rem 1.05rem;
  border: 1px solid rgba(217,119,6,.14);
  border-radius: 20px;
  background:
    radial-gradient(circle at top right, rgba(245,158,11,.06), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,251,235,.93));
  box-shadow: 0 10px 20px rgba(2,6,23,.04);
}

body.vi-page-guide-inci-solare #spf-uva .vi-media__text > p:first-child{
  margin-top: 0;
}

body.vi-page-guide-inci-solare #spf-uva .vi-checklist{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .42rem 1rem;
  margin: .8rem 0 .35rem;
}

body.vi-page-guide-inci-solare #spf-uva .vi-checklist li{
  margin: 0;
}

body.vi-page-guide-inci-solare #spf-uva .vi-media__text > p:last-child{
  margin-bottom: 0;
}

@media (max-width: 640px){
  body.vi-page-guide-inci-solare #spf-uva .vi-checklist{
    grid-template-columns: 1fr;
  }

  body.vi-page-guide-inci-solare #spf-uva .vi-media__text{
    padding: .92rem .95rem;
 }
}

/* IPS — più spazio tra i box nella sezione SPF/UVA */
body.vi-page-guide-inci-solare #spf-uva .vi-media{
  gap: 1.25rem;
}

body.vi-page-guide-inci-solare #spf-uva .claim-stack{
  gap: .9rem;
}

/* IPS — stesso spazio sopra il box "Una lettura sensata" */
body.vi-page-guide-inci-solare #spf-uva .vi-media__text{
  margin-top: .9rem;
}