/** Shopify CDN: Minification failed

Line 11:0 Unexpected "}"

**/
/* ARABIAN 971 — Scheda del Rituale Badou.
   Stava dentro la sezione come {% style %}, ma il file aveva passato i
   256 KB che Shopify concede a un singolo template. Qui ci sono solo
   classi: quello che dipende dalle impostazioni — font, palette,
   opacità dell'arabesco — resta nella sezione come custom property. */
} 15%, transparent);
  }

  .a971-rb {
    background: var(--a971-sabbia);
    color: var(--a971-oud);
    font-family: var(--a971-sans);
    padding: 4rem 0 5.6rem;
  }

  .a971-rb__grid {
    display: grid;
    grid-template-columns: minmax(0, 58fr) minmax(0, 42fr);
    gap: 5.6rem;
    align-items: start;
  }

  /* Gallery: vertical thumbs + large image */
  .a971-rb__gallery {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.2rem;
    position: sticky;
    top: 2.4rem;
  }
  /* IM8-style strip: the photo first, the thumbs scroll under it */
  .a971-rb__strip {
    order: 2;
    position: relative;
  }
  .a971-rb__thumbs {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    overflow-x: auto;
    padding-bottom: 0.4rem;
    scrollbar-width: none;
    scroll-behavior: smooth;
  }
  /* same trap as the recap badge: display: grid would keep it on screen */
  .a971-rb__strip-nav[hidden] { display: none; }
  .a971-rb__strip-nav {
    position: absolute;
    top: calc(50% - 0.2rem);
    transform: translateY(-50%);
    z-index: 2;
    width: 3.2rem;
    height: 3.2rem;
    display: grid;
    place-items: center;
    padding: 0;
    color: var(--a971-oud);
    background: color-mix(in srgb, var(--a971-crema) 92%, transparent);
    border: 1px solid color-mix(in srgb, var(--a971-oro) 45%, transparent);
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(59, 46, 31, 0.18);
    transition: border-color 0.2s ease, color 0.2s ease;
  }
  .a971-rb__strip-nav:hover { border-color: var(--a971-oro); color: var(--a971-oro); }
  .a971-rb__strip-nav:focus-visible { outline: 2px solid var(--a971-oro); outline-offset: 2px; }
  .a971-rb__strip-nav--sx { left: -0.6rem; }
  .a971-rb__strip-nav--dx { right: -0.6rem; }
  .a971-rb__thumbs::-webkit-scrollbar { display: none; }
  .a971-rb__thumb {
    flex: 0 0 8rem;
    padding: 0;
    border: 1px solid transparent;
    border-radius: var(--a971-radius-sm, 8px);
    background: none;
    cursor: pointer;
    overflow: hidden;
    transition: border-color 0.2s ease;
  }
  .a971-rb__thumb img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
    object-fit: cover;
  }
  .a971-rb__thumb.is-active,
  .a971-rb__thumb:hover { border-color: var(--a971-oro); }
  .a971-rb__thumb:focus-visible { outline: 2px solid var(--a971-oro); outline-offset: 2px; }
  .a971-rb__main { position: relative; }
  .a971-rb__main img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border-radius: var(--a971-radius, 10px);
  }
  .a971-rb__flag {
    position: absolute;
    top: 1.6rem;
    left: 1.6rem;
    z-index: 1;
    background: var(--a971-oro);
    color: #fff;
    border-radius: 999px;
    padding: 0.7rem 1.4rem;
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    box-shadow: 0 4px 14px color-mix(in srgb, var(--a971-oud) 25%, transparent);
  }

  /* Sticky purchase panel */
  .a971-rb__panel { min-width: 0; }
  .a971-rb__title {
    font-family: var(--a971-serif);
    font-weight: 400;
    font-size: clamp(3.4rem, 3.2vw, 4.6rem);
    line-height: 1.05;
    margin: 0 0 0.8rem;
  }
  .a971-rb__subtitle {
    font-size: 1.6rem;
    margin: 0 0 1.2rem;
    color: var(--a971-oro);
  }
  .a971-rb__rating {
    display: inline-flex;
    align-items: baseline;
    gap: 0.7rem;
    font-size: 1.35rem;
    color: inherit;
    text-decoration: none;
    margin-bottom: 1.4rem;
  }
  .a971-rb__rating-stars { color: var(--a971-oro); letter-spacing: 0.2em; font-size: 1.3rem; }
  .a971-rb__rating-text { font-family: var(--a971-num); font-weight: 500; }
  .a971-rb__rating:hover .a971-rb__rating-text { color: var(--a971-oro); }
  .a971-rb__pill {
    display: inline-block;
    border: 1px solid color-mix(in srgb, var(--a971-oro) 60%, transparent);
    border-radius: 999px;
    padding: 0.6rem 1.4rem;
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--a971-oro);
    margin: 0 0 1.2rem;
  }
  /* Customer-voiced persistence claim under the concentration pill */
  .a971-rb__proof {
    display: flex;
    align-items: baseline;
    gap: 0.8rem;
    font-family: var(--a971-serif);
    font-style: italic;
    font-size: 1.5rem;
    line-height: 1.5;
    margin: 0 0 1.6rem;
  }
  .a971-rb__proof svg {
    flex: none;
    align-self: center;
    color: var(--a971-oro);
  }
  .a971-rb__desc {
    font-size: 1.45rem;
    line-height: 1.65;
    opacity: 0.85;
    margin-bottom: 2.4rem;
    max-width: 44rem;
  }
  .a971-rb__desc p { margin: 0; }

  /* Configurator steps */
  .a971-rb__step {
    border: 0;
    padding: 0;
    margin: 0 0 2.4rem;
    /* fieldset defaults to min-width: min-content: without this the thumbnail
       strip inflates the step and the whole panel overflows its column */
    min-width: 0;
  }
  .a971-rb__step-head {
    display: block;
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--a971-oro);
    margin-bottom: 1.2rem;
    padding: 0;
  }
  /* 01 runs the full width of the page, above the gallery + panel grid:
     the editorial card needs the room the 50rem column cannot give it */
  .a971-rb__step--fascia {
    margin-bottom: 4.8rem;
  }
  .a971-rb__step--fascia > .a971-rb__step-head {
    font-size: 1.3rem;
    letter-spacing: 0.24em;
    margin-bottom: 1.8rem;
  }
  /* Badou: fixed card at the top of the configurator, wears the same
     selected look as a checked essence card */
  .a971-rb__badou {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.6rem 1.4rem;
    background: var(--a971-crema);
    border: 1px solid var(--a971-oro);
    border-radius: var(--a971-radius-sm, 8px);
    box-shadow: 0 0 0 1px var(--a971-oro), 0 8px 20px color-mix(in srgb, var(--a971-oud) 10%, transparent);
    padding: 1.4rem 1.6rem;
  }
  .a971-rb__badou-check {
    position: absolute;
    top: -0.7rem;
    right: -0.7rem;
    width: 2rem;
    height: 2rem;
    background: var(--a971-oro);
    color: #fff;
    border-radius: 50%;
    font-size: 1.1rem;
    line-height: 2rem;
    text-align: center;
  }
  .a971-rb__badou-icon { flex: none; color: var(--a971-oro); }
  .a971-rb__badou-img {
    flex: none;
    width: 4.8rem;
    height: 6rem;
    object-fit: cover;
    border-radius: 6px;
  }
  .a971-rb__badou-body {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
  }
  .a971-rb__badou-name {
    font-family: var(--a971-serif);
    font-size: 1.9rem;
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: 0.02em;
  }
  .a971-rb__badou-format { font-size: 1.2rem; opacity: 0.7; }
  /* Olfactory pyramid: editorial rows (phase label left, notes right),
     full-width inside the wrapping flex card */
  .a971-rb__badou-ingr {
    flex-basis: 100%;
    border-top: 1px solid color-mix(in srgb, var(--a971-oro) 30%, transparent);
    margin-top: 0.8rem;
    padding-top: 0.3rem;
  }
  .a971-rb__badou-ingr > span {
    display: grid;
    grid-template-columns: 6.2rem minmax(0, 1fr);
    align-items: baseline;
    gap: 1.4rem;
    padding: 0.75rem 0;
    font-size: 1.25rem;
    line-height: 1.5;
    opacity: 0.85;
  }
  .a971-rb__badou-ingr > span + span {
    border-top: 1px solid color-mix(in srgb, var(--a971-oud) 8%, transparent);
  }
  .a971-rb__badou-ingr em {
    font-style: normal;
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--a971-oro);
  }
  .a971-rb__badou-pill {
    margin-left: auto;
    align-self: center;
    border: 1px solid color-mix(in srgb, var(--a971-oro) 60%, transparent);
    border-radius: 999px;
    padding: 0.5rem 1.2rem;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--a971-oro);
    white-space: nowrap;
  }

  /* 01 — Perfume, A0: the packshot laid on the card, notes on one line,
     bare thumbnails underneath */
  .a971-rb__vet {
    background: var(--a971-crema);
    border: 1px solid color-mix(in srgb, var(--a971-oud) 12%, transparent);
    border-radius: 8px;
    padding: 1.6rem 1.6rem 1.2rem;
    min-width: 0;
  }
  .a971-rb__vet-top {
    display: flex;
    gap: 1.8rem;
    align-items: center;
    min-height: 14rem;
  }
  /* ── 01 — la scheda profumo, due facce ──
     Fronte: la scena nella sua colonna, il copy accanto. Retro: la scheda
     intera. Un profumo esaurito si apre e si legge: cambia cosa puoi farci,
     non cosa puoi vederne.

     La card è disegnata a 390px e vale solo lì: da 750px in su torna la
     vetrina di prima. Le miniature invece sono le stesse — un solo gruppo di
     radio, altrimenti il carrello riceverebbe due volte la stessa proprietà. */
  .a971-rb__pf {
    --pf-avorio: #FDFBF6;
    --pf-terra: #8C4A3C;      /* solo per l'esaurito: non è nella palette di marca */
    --pf-mini: 7.6rem;
    min-width: 0;
  }
  .a971-rb__pf-vet { display: none; }
  .a971-rb__vet-img {
    width: 10.5rem;
    height: auto;
    flex: none;
    mix-blend-mode: multiply;
    transition: opacity 0.2s ease, filter 0.2s ease;
  }
  /* sul desktop non c'è la targa sulla foto: la riga lo dice a parole */
  .a971-rb__vet-esa {
    display: none;
    margin: 0.8rem 0 0;
    font-family: var(--a971-sans);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--pf-terra);
  }
  .a971-rb__pf.is-esaurito .a971-rb__vet-esa { display: block; }
  .a971-rb__pf.is-esaurito .a971-rb__vet-img { filter: grayscale(1); opacity: 0.55; }

  .a971-rb__pf-facce {
    display: grid;            /* le due facce nella stessa cella: l'altezza non salta mai */
    transform-style: preserve-3d;
    transition: transform 0.4s cubic-bezier(0.4, 0.1, 0.25, 1);
  }
  .a971-rb__pf-facce > * { grid-area: 1 / 1; backface-visibility: hidden; }
  .a971-rb__pf.is-girata .a971-rb__pf-facce { transform: rotateY(180deg); }
  .a971-rb__pf-scena { perspective: 120rem; }

  /* Il bordo non è una linea sola: linea esterna oro-beige, riflesso interno
     avorio, ombra ambientale larga più una corta che riavvicina la card allo
     sfondo, e un fondo appena più chiaro della pagina. Insieme fanno il
     pannello, non la card e-commerce. */
  .a971-rb__pf-card {
    position: relative;
    display: flex;
    overflow: hidden;
    min-height: 44rem;
    background: linear-gradient(135deg, rgba(255, 253, 248, 0.98) 0%, rgba(250, 246, 237, 0.98) 100%);
    border: 1px solid rgba(181, 143, 74, 0.28);
    border-radius: 18px;
    box-shadow:
      0 18px 42px rgba(70, 48, 25, 0.08),
      0 4px 12px rgba(70, 48, 25, 0.04),
      inset 0 1px 0 rgba(255, 255, 255, 0.9);
  }
  /* Niente seconda linea interna: qui la foto arriva a filo del bordo, e una
     riga a 6px le passava sopra come un graffio invece di incorniciare. */
  .a971-rb__pf-retro { transform: rotateY(180deg); flex-direction: column; }
  /* la faccia ha tabindex -1 solo per ricevere il fuoco al giro: non è
     raggiungibile da tastiera, quindi l'anello qui sarebbe rumore */
  .a971-rb__pf-card:focus { outline: none; }

  /* ── fronte ── */
  .a971-rb__pf-foto {
    position: relative;
    flex: 0 0 44%;
    align-self: stretch;
    overflow: hidden;
    background: linear-gradient(168deg, #F8F1E8, #F1E5D8);
  }
  /* due strati sovrapposti: il nuovo entra solo quando è caricato e il vecchio
     esce sotto, così al cambio profumo non si vede mai il buco */
  .a971-rb__pf-foto img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    opacity: 0;
    transition: opacity 0.34s ease;
  }
  .a971-rb__pf-foto img.is-viva { opacity: 1; }
  .a971-rb__pf-foto::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(to right, transparent 62%, var(--a971-crema));
  }
  /* targa orizzontale, non fascia diagonale: stessa geometria di pill e badge */
  .a971-rb__pf-tag {
    display: none;
    position: absolute;
    left: 1.2rem;
    top: 1.2rem;
    z-index: 5;
    padding: 0.5rem 0.8rem 0.5rem 0.9rem;
    border-radius: 6px;
    background: var(--pf-terra);
    color: #fff;
    font-family: var(--a971-sans);
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.16em;
    text-transform: uppercase;
  }
  .a971-rb__pf.is-esaurito .a971-rb__pf-tag { display: block; }
  .a971-rb__pf.is-esaurito .a971-rb__pf-foto img { filter: grayscale(0.62); }

  .a971-rb__pf-testo {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 1.8rem 1.6rem;
  }
  .a971-rb__pf-eyebrow {
    font-family: var(--a971-sans);
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: 0.16em;
    /* recupera la spaziatura che il browser mette dopo l'ultima lettera:
       spazio morto che mandava l'occhiello a capo per un pixel */
    margin: 0 -0.16em 0 0;
    text-transform: uppercase;
    color: var(--a971-oro);
  }
  .a971-rb__pf-nome {
    font-family: var(--a971-serif);
    font-weight: 500;
    font-size: 4.4rem;
    line-height: 1.02;
    margin: 1.2rem 0 0;
  }
  /* balance: due righe equilibrate invece di una orfana */
  .a971-rb__pf-note {
    margin: 1.3rem 0 0;
    font-size: 1.2rem;
    line-height: 1.45;
    text-wrap: balance;
    color: color-mix(in srgb, var(--a971-oud) 78%, transparent);
  }
  .a971-rb__pf-filo {
    width: 4.4rem;
    height: 1px;
    margin-top: 1.6rem;
    background: color-mix(in srgb, var(--a971-oro) 55%, transparent);
  }
  .a971-rb__pf-formato {
    margin: 1.4rem 0 0;
    font-family: var(--a971-num);
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: 0.03em;
    color: color-mix(in srgb, var(--a971-oud) 58%, transparent);
  }

  /* micro-pill: descrivono, non sembrano pulsanti.
     minmax(0, 1fr) e non 1fr: con 1fr le colonne crescono col contenuto e la
     griglia esce dalla card */
  .a971-rb__pf-pills {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem;
    margin-top: 2.4rem;
  }
  .a971-rb__pf-pill {
    /* ancorate a sinistra: l'icona della riga sotto cade esattamente sotto
       quella della riga sopra, invece di spostarsi col testo */
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
    height: 3.1rem;
    padding: 0 0.6rem;
    border: 1px solid color-mix(in srgb, var(--a971-oro) 27%, transparent);
    border-radius: 11px;
    background: var(--pf-avorio);
    font-family: var(--a971-sans);
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--a971-oro) 55%, var(--a971-oud));
    white-space: nowrap;
  }
  .a971-rb__pf-pill svg,
  .a971-rb__pf-pill img {
    width: 1.5rem;
    height: 1.5rem;
    flex: 0 0 auto;
    color: var(--a971-oro);
  }
  /* le pill descrivono un profumo che ora non puoi scegliere: il loro posto
     lo prende l'unica cosa che resta da fare */
  .a971-rb__pf.is-esaurito .a971-rb__pf-pills { display: none; }

  .a971-rb__pf-avviso { display: none; margin-top: 2.2rem; }
  .a971-rb__pf.is-esaurito .a971-rb__pf-avviso { display: block; }
  .a971-rb__pf-avviso-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    min-height: 3.4rem;
    padding: 0 0.5rem;
    border: 1px solid color-mix(in srgb, var(--a971-oro) 50%, transparent);
    border-radius: 7px;
    background: var(--pf-avorio);
    font-family: var(--a971-sans);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    color: color-mix(in srgb, var(--a971-oro) 82%, var(--a971-oud));
  }
  .a971-rb__pf-avviso-cta span { white-space: nowrap; }
  .a971-rb__pf-avviso-cta svg { width: 1.2rem; height: 1.2rem; flex: 0 0 auto; }
  .a971-rb__pf-avviso-testo {
    margin: 0;
    font-size: 1.1rem;
    line-height: 1.4;
    color: var(--pf-terra);
  }

  .a971-rb__pf-link {
    align-self: flex-start;
    margin-top: 2.4rem;
    padding: 0.4rem 0;
    background: none;
    border: 0;
    cursor: pointer;
    font-family: var(--a971-sans);
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--a971-oro) 88%, var(--a971-oud));
  }

  /* ── retro ── */
  .a971-rb__pf-retro-corpo { display: flex; flex: 1 1 auto; min-height: 0; }
  /* la nicchia, il sigillo e la botanica sono già dentro il disegno: niente
     damasco né rombo sovrapposti */
  .a971-rb__pf-lato {
    position: relative;
    flex: 0 0 34%;
    align-self: stretch;
    overflow: hidden;
    background: linear-gradient(168deg, #F8F1E8, #F3E9DC);
  }
  /* il pannello è più stretto della colonna: center 42% tiene il sigillo in
     asse e lascia entrare la botanica in basso */
  .a971-rb__pf-lato-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 42%;
    display: block;
  }
  .a971-rb__pf-scheda {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    padding: 1.6rem 1.5rem 0.8rem;
  }
  .a971-rb__pf-retro-nome {
    margin: 0;
    font-family: var(--a971-serif);
    font-weight: 500;
    font-size: 2.5rem;
    line-height: 1.04;
  }
  .a971-rb__pf-desc {
    margin: 0.8rem 0 0;
    font-size: 1.1rem;
    line-height: 1.58;
    color: color-mix(in srgb, var(--a971-oud) 76%, transparent);
  }
  /* tabella uniforme: icona · etichetta · valore, righe separate da un filetto */
  .a971-rb__pf-righe { margin-top: 1.2rem; }
  .a971-rb__pf-righe div {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    min-height: 2.6rem;
    border-bottom: 1px solid color-mix(in srgb, var(--a971-oro) 15%, transparent);
  }
  .a971-rb__pf-righe div:last-child { border-bottom: 0; }
  .a971-rb__pf-righe svg,
  .a971-rb__pf-righe img { width: 1.6rem; height: 1.6rem; flex: 0 0 auto; color: var(--a971-oro); }
  .a971-rb__pf-righe span {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 1rem;
    color: color-mix(in srgb, var(--a971-oud) 66%, transparent);
  }
  .a971-rb__pf-righe b {
    flex: 0 0 auto;
    font-family: var(--a971-sans);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.25;
    text-align: right;
  }
  .a971-rb__pf-piramide {
    margin-top: 1.2rem;
    border-top: 1px solid color-mix(in srgb, var(--a971-oro) 22%, transparent);
  }
  .a971-rb__pf-piramide div {
    display: flex;
    align-items: center;
    min-height: 3rem;
    border-bottom: 1px solid color-mix(in srgb, var(--a971-oro) 15%, transparent);
  }
  .a971-rb__pf-piramide div:last-child { border-bottom: 0; }
  .a971-rb__pf-piramide b {
    flex: 0 0 4.6rem;
    align-self: stretch;
    display: flex;
    align-items: center;
    border-right: 1px solid color-mix(in srgb, var(--a971-oro) 22%, transparent);
    font-family: var(--a971-sans);
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: var(--a971-oro);
  }
  .a971-rb__pf-piramide i {
    font-style: normal;
    padding-left: 1rem;
    font-size: 1.1rem;
    line-height: 1.35;
    color: color-mix(in srgb, var(--a971-oud) 82%, transparent);
  }
  /* il piede prende tutta la larghezza della card, non solo la colonna destra */
  .a971-rb__pf-piede {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem 1.2rem;
    border-top: 1px solid color-mix(in srgb, var(--a971-oro) 18%, transparent);
  }
  .a971-rb__pf-torna {
    flex: 0 0 auto;
    min-height: 3.2rem;
    padding: 0 0.2rem;
    background: none;
    border: 0;
    cursor: pointer;
    font-family: var(--a971-sans);
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--a971-oud) 62%, transparent);
  }
  .a971-rb__pf-stato {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-family: var(--a971-sans);
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--a971-oro);
  }
  .a971-rb__pf-stato.is-esa { color: var(--pf-terra); }

  /* il cambio profumo: il testo entra come un blocco solo, non un elemento
     alla volta — altrimenti ogni figlio sfarfalla per conto suo */
  @keyframes a971RbPfEntra {
    from { opacity: 0; transform: translateY(0.7rem); }
    to { opacity: 1; transform: none; }
  }
  .a971-rb__pf.is-cambia .a971-rb__pf-testo,
  .a971-rb__pf.is-cambia .a971-rb__pf-scheda {
    animation: a971RbPfEntra 0.3s cubic-bezier(0.22, 0.61, 0.36, 1) both;
  }

  /* ── la striscia delle miniature ── */
  .a971-rb__pf-strip {
    display: flex;
    gap: 0.9rem;
    overflow-x: auto;
    padding: 0.6rem 0.2rem 0.4rem;
    margin-top: 1.6rem;
    scroll-snap-type: x proximity;
  }
  .a971-rb__pf-strip::-webkit-scrollbar { height: 3px; }
  .a971-rb__pf-strip::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--a971-oro) 40%, transparent);
    border-radius: 2px;
  }
  .a971-rb__pf-th {
    position: relative;
    flex: 0 0 auto;
    width: var(--pf-mini);
    min-height: 14rem;
    scroll-snap-align: center;
    padding: 0;
    background: none;
    border: 0;
    cursor: pointer;
    text-align: center;
    font: inherit;
    color: inherit;
    display: flex;
  }
  .a971-rb__pf-th input { position: absolute; opacity: 0; pointer-events: none; }
  .a971-rb__pf-th-c,
  .a971-rb__pf-th.is-esaurito {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem 0.7rem 0.9rem;
    background: var(--pf-avorio);
    border: 1px solid color-mix(in srgb, var(--a971-oro) 22%, transparent);
    border-radius: var(--a971-radius-sm);
    transition: border-color 0.18s, box-shadow 0.18s;
  }
  /* bordo oro = lo stai guardando. Spunta = l'hai scelto. Due cose diverse */
  .a971-rb__pf-th.is-vista .a971-rb__pf-th-c,
  .a971-rb__pf-th.is-vista.is-esaurito {
    border-color: var(--a971-oro);
    box-shadow: inset 0 0 0 1px var(--a971-oro);
  }
  .a971-rb__pf-th input:checked ~ .a971-rb__pf-th-c {
    border-color: var(--a971-oro);
    box-shadow: inset 0 0 0 1px var(--a971-oro), 0 0.6rem 1.6rem color-mix(in srgb, var(--a971-oud) 10%, transparent);
  }
  .a971-rb__pf-th input:focus-visible ~ .a971-rb__pf-th-c,
  .a971-rb__pf-th.is-esaurito:focus-visible {
    outline: 2px solid var(--a971-oro);
    outline-offset: 3px;
  }
  .a971-rb__pf-th-foto {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    height: 8.5rem;
    width: 100%;
  }
  .a971-rb__pf-th-foto img { height: 100%; width: auto; object-fit: contain; mix-blend-mode: multiply; }
  .a971-rb__pf-th-nome {
    margin-top: 0.9rem;
    font-family: var(--a971-serif);
    font-size: 1.3rem;
    line-height: 1.16;
    color: color-mix(in srgb, var(--a971-oud) 80%, transparent);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .a971-rb__pf-th input:checked ~ .a971-rb__pf-th-c .a971-rb__pf-th-nome { color: var(--a971-oud); }
  .a971-rb__pf-th-check {
    position: absolute;
    top: -0.7rem;
    right: -0.7rem;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 2.2rem;
    height: 2.2rem;
    background: var(--a971-oro);
    color: #fff;
    border-radius: 50%;
    border: 2px solid var(--a971-crema);
    opacity: 0;
    transform: scale(0.6);
    transition: opacity 0.18s ease, transform 0.18s ease;
  }
  .a971-rb__pf-th input:checked ~ .a971-rb__pf-th-check { opacity: 1; transform: none; }
  /* spenta ma viva: si clicca eccome */
  .a971-rb__pf-th.is-esaurito .a971-rb__pf-th-foto img { filter: grayscale(1); opacity: 0.52; }
  .a971-rb__pf-th.is-esaurito .a971-rb__pf-th-nome { color: color-mix(in srgb, var(--a971-oud) 52%, transparent); }
  /* margin-top auto: la targhetta si appoggia al bordo basso, che il nome
     stia su una riga o su due */
  @media (prefers-reduced-motion: reduce) {
    .a971-rb__pf-facce,
    .a971-rb__pf-foto img,
    .a971-rb__pf-th-check,
    .a971-rb__pf-th-c { transition: none; }
    .a971-rb__pf.is-cambia .a971-rb__pf-testo,
    .a971-rb__pf.is-cambia .a971-rb__pf-scheda { animation: none; }
  }

  .a971-rb__pf-th-esa {
    margin-top: auto;
    padding: 0.3rem 0.5rem 0.3rem 0.6rem;
    border-radius: 4px;
    background: color-mix(in srgb, var(--pf-terra) 11%, transparent);
    font-family: var(--a971-sans);
    font-size: 0.65rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--pf-terra);
  }

  /* La card a due facce vale a ogni larghezza, non solo sui telefoni: prima
     da 750px in su tornava la vecchia vetrina compatta e le miniature
     perdevano i nomi. La colonna destra su desktop è larga 438px, cioè
     quanto un telefono: la stessa presentazione ci sta senza riprogettarla.

     Fra 750 e 989px però la griglia diventa una colonna sola e il pannello
     prende tutta la pagina: lì la card va tenuta a freno, altrimenti si
     stira su settecento pixel e la foto del flacone diventa una fascia. */
  @media (min-width: 750px) and (max-width: 989px) {
    .a971-rb__pf { max-width: 52rem; margin-inline: auto; }
  }

  .a971-rb__vet-body { min-width: 0; }
  .a971-rb__vet-eyebrow {
    font-family: var(--a971-num);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--a971-oro);
    margin: 0;
  }
  .a971-rb__vet-nome {
    font-family: var(--a971-serif);
    font-weight: 500;
    font-size: 2.8rem;
    line-height: 1.05;
    margin: 0.7rem 0 0.5rem;
  }
  .a971-rb__vet-note {
    font-size: 1.3rem;
    opacity: 0.74;
    margin: 0;
  }
  .a971-rb__vet-formato {
    font-family: var(--a971-num);
    font-size: 1.1rem;
    letter-spacing: 0.09em;
    opacity: 0.55;
    margin: 0.8rem 0 0;
  }
  .a971-rb__vet-strip {
    display: flex;
    gap: 0.8rem;
    overflow-x: auto;
    padding: 1.4rem 0 0.6rem;
    margin-top: 1.2rem;
    border-top: 1px solid color-mix(in srgb, var(--a971-oud) 10%, transparent);
    scroll-snap-type: x proximity;
  }
  .a971-rb__vet-strip::-webkit-scrollbar { height: 4px; }
  .a971-rb__vet-strip::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--a971-oro) 40%, transparent);
    border-radius: 2px;
  }
  .a971-rb__vet-th { position: relative; flex: none; cursor: pointer; scroll-snap-align: start; }
  .a971-rb__vet-th input { position: absolute; opacity: 0; pointer-events: none; }
  .a971-rb__vet-th-c {
    display: grid;
    place-items: center;
    width: 5.4rem;
    height: 6.6rem;
    background: #fff;
    border: 1px solid color-mix(in srgb, var(--a971-oud) 12%, transparent);
    border-radius: 6px;
    transition: border-color 0.18s, box-shadow 0.18s;
  }
  .a971-rb__vet-th-c img { width: 4.2rem; height: auto; mix-blend-mode: multiply; }
  .a971-rb__vet-th input:checked + .a971-rb__vet-th-c {
    border-color: var(--a971-oro);
    box-shadow: 0 0 0 1px var(--a971-oro);
  }
  .a971-rb__vet-th input:focus-visible + .a971-rb__vet-th-c {
    outline: 2px solid var(--a971-oro);
    outline-offset: 3px;
  }

  /* 04 / 05 — tassel and pouch, B1 / C1: the chosen one large in a lit
     showcase, the whole range small underneath. Every drawing is rendered
     once and only the active one is shown: no SVG is rebuilt on click */
  .a971-rb__vet--ogg .a971-rb__vet-top { min-height: 0; }
  .a971-rb__ogg-palco {
    flex: none;
    display: grid;
    place-items: center;
    width: 11.8rem;
    min-height: 14.8rem;
    border-radius: 8px;
    background:
      radial-gradient(ellipse 110% 70% at 50% 12%, color-mix(in srgb, var(--a971-oro) 13%, transparent), transparent 65%),
      linear-gradient(180deg, #fff 0%, color-mix(in srgb, var(--a971-sabbia) 60%, #fff) 100%);
    border: 1px solid color-mix(in srgb, var(--a971-oud) 9%, transparent);
  }
  .a971-rb__vet--larga .a971-rb__ogg-palco { width: 18.6rem; }
  .a971-rb__ogg-grande { display: none; }
  .a971-rb__ogg-grande.is-on { display: block; line-height: 0; }
  .a971-rb__ogg-palco svg {
    max-width: 100%;
    height: auto;
    filter: drop-shadow(0 0.8rem 1.2rem color-mix(in srgb, var(--a971-oud) 20%, transparent));
  }
  .a971-rb__vet--ogg .a971-rb__vet-nome { font-size: 2.6rem; margin: 0.6rem 0 0.4rem; }
  .a971-rb__ogg-val {
    display: flex;
    align-items: baseline;
    gap: 0.8rem;
    margin: 0.9rem 0 0;
  }
  .a971-rb__ogg-prezzo {
    font-family: var(--a971-num);
    font-size: 1.2rem;
    letter-spacing: 0.04em;
    color: var(--a971-oro);
  }
  .a971-rb__ogg-sep { opacity: 0.3; }
  .a971-rb__ogg-val .a971-rb__vet-formato { margin: 0; }
  .a971-rb__vet-th--ogg .a971-rb__vet-th-c {
    width: 5.2rem;
    height: 6.2rem;
    background: var(--a971-crema);
  }
  .a971-rb__vet-th--ogg .a971-rb__vet-th-c svg { width: auto; height: auto; }


  /* ────────────────────────────────────────────────────────────────
     04 — la nappa
     Le misure rispondono alla larghezza della card, non a quella della
     finestra: la card cambia larghezza anche a finestra ferma, e con le
     media query si impaginerebbe per uno schermo che non ha.
     ──────────────────────────────────────────────────────────────── */
  .a971-rb__nap {
    container-type: inline-size;
    container-name: nap;
    --nap-mini: 8.4rem;
    --nap-h: 19rem;
  }

  /* linea esterna oro, riflesso sul filo alto, ombra ambientale, fondo
     appena più chiaro della pagina. Quattro strati, nessuno gridato. */
  .a971-rb__nap-card {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: linear-gradient(135deg, rgba(255, 253, 248, 0.99) 0%, rgba(250, 246, 237, 0.99) 100%);
    border: 1px solid rgba(181, 143, 74, 0.28);
    border-radius: 18px;
    box-shadow:
      0 18px 42px rgba(70, 48, 25, 0.075),
      0 4px 12px rgba(70, 48, 25, 0.035),
      inset 0 1px 0 rgba(255, 255, 255, 0.92);
  }

  .a971-rb__nap-hero {
    display: grid;
    grid-template-columns: 42% minmax(0, 1fr);
    column-gap: 1.2rem;
    row-gap: 0;
    padding: 2.2rem 1.6rem 0;
  }
  .a971-rb__nap-vis {
    position: relative;
    grid-column: 1;
    grid-row: 1;
    align-self: center;
    height: var(--nap-h);
    /* Il riquadro è basso — era lui a tenere alta tutta la card — ma la seta
       no: il taglio è ravvicinato e la scala la porta più grande di prima.
       La scala non occupa spazio, quindi non rialza niente. */
    transform: scale(1.2) translateX(-0.5rem);
  }
  .a971-rb__nap-quadro { display: block; height: 100%; }
  .a971-rb__nap-foto {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: 50% center;
    transition: opacity 0.18s ease, transform 0.18s ease;
    /* la foto porta già dentro ornamento e velatura: non se ne aggiunge
       un'altra, si scioglie solo il bordo perché il rettangolo non si veda */
    -webkit-mask-image:
      linear-gradient(to right, transparent 0, #000 11%, #000 89%, transparent 100%),
      linear-gradient(to bottom, transparent 0, #000 8%, #000 92%, transparent 100%);
    mask-image:
      linear-gradient(to right, transparent 0, #000 11%, #000 89%, transparent 100%),
      linear-gradient(to bottom, transparent 0, #000 8%, #000 92%, transparent 100%);
    -webkit-mask-composite: source-in;
    mask-composite: intersect;
  }
  .a971-rb__nap-foto.is-via { opacity: 0; transform: translateY(3px); transition-duration: 0.11s; }

  /* senza occhiello la colonna è più corta della foto: si allinea al centro,
     altrimenti il nome galleggia in alto mentre la nappa sta in mezzo */
  .a971-rb__nap-testo {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    align-self: center;
  }
  .a971-rb__nap-nome {
    margin: 0;
    font-family: var(--a971-serif);
    font-size: 3.2rem;
    font-weight: 500;
    line-height: 0.95;
    letter-spacing: -0.025em;
    color: #33271c;
  }
  .a971-rb__nap-divi {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    margin-top: 0.7rem;
    width: 9.6rem;
    color: var(--a971-oro);
  }
  .a971-rb__nap-divi i { flex: 1; height: 1px; }
  .a971-rb__nap-divi i:first-child { background: linear-gradient(to right, transparent, rgba(174, 138, 79, 0.7)); }
  .a971-rb__nap-divi i:last-child { background: linear-gradient(to left, transparent, rgba(174, 138, 79, 0.7)); }
  .a971-rb__nap-divi svg { display: block; width: 1.1rem; height: 1.1rem; flex: 0 0 auto; }

  /* due blocchi, non quattro righe di seguito: la scheda del materiale è più
     piccola e più scura, la frase resta la voce. Lo stacco fra i due è più
     largo dell'interlinea interna, altrimenti si leggono come un blocco solo.
     `balance` pareggia le righe: senza, la misura restava sola in fondo. */
  .a971-rb__nap-mat {
    margin: 1rem 0 0;
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.4;
    color: #4a3b2a;
    text-wrap: balance;
  }
  .a971-rb__nap-desc {
    margin: 0.9rem 0 0;
    font-size: 1.3rem;
    line-height: 1.5;
    color: #736859;
    text-wrap: balance;
  }

  .a971-rb__nap-val {
    grid-column: 1 / -1;
    grid-row: 2;
    margin: 1rem 0 0;
    padding-top: 0.9rem;
    border-top: 1px solid rgba(174, 138, 79, 0.24);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.8rem 1.6rem;
  }
  .a971-rb__nap-val-uno,
  .a971-rb__nap-val-due {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #ad8242;
  }
  /* il prezzo sta accanto alla parola «valore», non le urla sopra */
  .a971-rb__nap-val-uno b {
    font-family: var(--a971-num);
    font-size: 1.2rem;
    font-weight: 500;
    letter-spacing: 0;
    color: var(--a971-oud);
  }
  .a971-rb__nap-val-uno svg { display: block; width: 1.4rem; height: 1.4rem; flex: 0 0 auto; color: var(--a971-oro); }
  .a971-rb__nap-val-sep { width: 1px; height: 1.3rem; background: rgba(174, 138, 79, 0.34); }
  .a971-rb__nap-ok {
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background: var(--a971-oro);
    color: #fff;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
  }
  /* block, non inline: da inline il segno si appoggia alla riga di testo,
     che tiene il posto per la coda delle lettere, e casca sotto il centro */
  .a971-rb__nap-ok svg { display: block; width: 0.9rem; height: 0.9rem; }

  /* dentro una card non ci va una seconda card, ci va un ripiano */
  .a971-rb__nap-scelta {
    position: relative;
    z-index: 4;
    margin: 1.2rem 1.6rem;
    padding: 0.9rem 1.2rem 1rem;
    background: rgba(255, 253, 248, 0.36);
    border: 1px solid rgba(181, 143, 74, 0.18);
    border-radius: 13px;
  }
  .a971-rb__nap-lab {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--a971-oro);
  }
  .a971-rb__nap-strip-cont { position: relative; margin-top: 0.9rem; }
  /* si scorre: l'ultima card non finisce, sfuma */
  .a971-rb__nap-strip-cont::after {
    content: "";
    position: absolute;
    top: 0;
    right: -1.2rem;
    width: 3.4rem;
    height: 100%;
    pointer-events: none;
    transition: opacity 0.2s ease;
    background: linear-gradient(90deg, rgba(251, 247, 238, 0), rgba(251, 247, 238, 0.96));
  }
  .a971-rb__nap-strip-cont.is-fine::after { opacity: 0; }

  .a971-rb__nap-strip {
    display: flex;
    gap: 0.8rem;
    overflow-x: auto;
    scrollbar-width: none;
    scroll-snap-type: x mandatory;
    padding-bottom: 0.2rem;
  }
  .a971-rb__nap-strip::-webkit-scrollbar { display: none; }

  .a971-rb__nap-opt {
    position: relative;
    flex: 0 0 auto;
    width: var(--nap-mini);
    scroll-snap-align: start;
    cursor: pointer;
  }
  .a971-rb__nap-opt input { position: absolute; opacity: 0; pointer-events: none; }
  .a971-rb__nap-opt-c {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    padding: 0.7rem 0.7rem 0.8rem;
    background: rgba(255, 253, 248, 0.72);
    border: 1px solid rgba(118, 98, 72, 0.15);
    border-radius: 13px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
  }
  .a971-rb__nap-opt:hover .a971-rb__nap-opt-c { border-color: rgba(174, 138, 79, 0.5); }
  /* il bordo da scelta è oro ma sottile: è una variante, non una CTA.
     Il padding cala di mezzo pixel così la card non si allarga. */
  .a971-rb__nap-opt input:checked + .a971-rb__nap-opt-c {
    padding: 0.65rem 0.65rem 0.75rem;
    background: #fffaf0;
    border: 1.5px solid #b38a49;
    box-shadow: 0 8px 18px rgba(75, 50, 22, 0.07), inset 0 1px 0 rgba(255, 255, 255, 0.94);
  }
  .a971-rb__nap-opt input:focus-visible + .a971-rb__nap-opt-c {
    outline: 2px solid var(--a971-oro);
    outline-offset: 2px;
  }
  .a971-rb__nap-opt-foto {
    display: block;
    aspect-ratio: 78 / 86;
    border-radius: 8px;
    overflow: hidden;
  }
  .a971-rb__nap-opt-foto img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    -webkit-mask-image:
      linear-gradient(to right, transparent 0, #000 11%, #000 89%, transparent 100%),
      linear-gradient(to bottom, transparent 0, #000 8%, #000 92%, transparent 100%);
    mask-image:
      linear-gradient(to right, transparent 0, #000 11%, #000 89%, transparent 100%),
      linear-gradient(to bottom, transparent 0, #000 8%, #000 92%, transparent 100%);
    -webkit-mask-composite: source-in;
    mask-composite: intersect;
  }
  .a971-rb__nap-opt-pie { display: flex; align-items: center; gap: 0.45rem; min-width: 0; }
  .a971-rb__nap-opt-sw {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 50%;
    flex: 0 0 auto;
    background: var(--nap-sw, var(--a971-oro));
    box-shadow: 0 0 0 1px rgba(59, 46, 31, 0.14);
  }
  .a971-rb__nap-opt-nome {
    font-family: var(--a971-serif);
    font-size: 1.15rem;
    line-height: 1.15;
    color: var(--a971-oud);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .a971-rb__nap-opt-ok {
    position: absolute;
    top: 0.7rem;
    right: 0.7rem;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background: var(--a971-oro);
    color: #fff;
    display: grid;
    place-items: center;
    opacity: 0;
    transform: scale(0.78);
    transition: opacity 0.18s ease, transform 0.18s ease;
  }
  .a971-rb__nap-opt-ok svg { display: block; width: 1rem; height: 1rem; }
  .a971-rb__nap-opt input:checked ~ .a971-rb__nap-opt-c .a971-rb__nap-opt-ok,
  .a971-rb__nap-opt input:checked + .a971-rb__nap-opt-c .a971-rb__nap-opt-ok {
    opacity: 1;
    transform: none;
  }

  /* le frecce: compaiono solo dal lato dove c'è ancora una nappa da vedere */
  .a971-rb__nap-frec {
    position: absolute;
    top: 50%;
    z-index: 3;
    width: 2.6rem;
    height: 2.6rem;
    padding: 0;
    transform: translateY(-50%);
    display: grid;
    place-items: center;
    cursor: pointer;
    border: 1px solid rgba(174, 138, 79, 0.42);
    border-radius: 50%;
    background: rgba(253, 251, 246, 0.96);
    color: var(--a971-oro);
    box-shadow: 0 2px 9px rgba(70, 48, 25, 0.12);
  }
  .a971-rb__nap-frec[hidden] { display: none; }
  .a971-rb__nap-frec svg { display: block; width: 1.3rem; height: 1.3rem; }
  .a971-rb__nap-frec--sx { left: -0.7rem; }
  .a971-rb__nap-frec--dx { right: -0.7rem; }

  /* schermi molto stretti: la card si impila */
  @container nap (width < 332px) {
    .a971-rb__nap-hero { grid-template-columns: 1fr; column-gap: 0; padding: 1.4rem 1.4rem 0; }
    .a971-rb__nap-vis { height: 21rem; }
    .a971-rb__nap-testo { align-self: stretch; padding-top: 0.6rem; }
    .a971-rb__nap-nome { font-size: 3.4rem; }
    .a971-rb__nap-scelta { margin: 1.3rem 1.4rem 1.4rem; padding: 1.1rem; }
  }

  /* scrivania: due colonne larghe, sei nappe in fila, niente da scorrere */
  @container nap (width >= 620px) {
    .a971-rb__nap-hero {
      grid-template-columns: minmax(280px, 38%) minmax(0, 62%);
      column-gap: 3.4rem;
      padding: 3.6rem 4rem 0;
      min-height: 43rem;
      align-items: center;
      align-content: center;
    }
    .a971-rb__nap-vis { grid-row: 1 / 3; height: 100%; min-height: 37.2rem; transform: none; }
    .a971-rb__nap-foto { object-position: 47% center; }
    .a971-rb__nap-val { grid-column: 2; grid-row: 2; margin-top: 2.2rem; padding-top: 1.5rem; gap: 1.4rem; }
    .a971-rb__nap-nome { font-size: 5.4rem; }
    .a971-rb__nap-divi { width: 10.8rem; margin-top: 1.6rem; }
    .a971-rb__nap-divi svg { width: 1.3rem; height: 1.3rem; }
    .a971-rb__nap-mat { margin-top: 2rem; font-size: 1.5rem; }
    .a971-rb__nap-desc { margin-top: 0.7rem; font-size: 1.4rem; }
    .a971-rb__nap-val-uno, .a971-rb__nap-val-due { font-size: 1rem; letter-spacing: 0.16em; }
    .a971-rb__nap-val-uno b { font-size: 1.3rem; }
    .a971-rb__nap-scelta {
      margin: 2.6rem 4rem 3.4rem;
      padding: 1.6rem 1.8rem;
      background: rgba(255, 253, 248, 0.55);
      border-color: rgba(174, 138, 79, 0.2);
      border-radius: 14px;
    }
    .a971-rb__nap-strip-cont { margin-top: 1.1rem; }
    .a971-rb__nap-strip-cont::after, .a971-rb__nap-frec { display: none; }
    .a971-rb__nap-strip { gap: 1.2rem; justify-content: space-between; }
    .a971-rb__nap-opt { width: 11.8rem; }
    .a971-rb__nap-opt-foto { aspect-ratio: 78 / 100; }
    .a971-rb__nap-opt input:checked + .a971-rb__nap-opt-c { padding: 0.6rem 0.6rem 0.7rem; border-width: 2px; }
    .a971-rb__nap-opt-ok { width: 1.8rem; height: 1.8rem; }
    .a971-rb__nap-opt-ok svg { width: 1.1rem; height: 1.1rem; }
    .a971-rb__nap-opt-nome { font-size: 1.35rem; }
  }


  /* ────────────────────────────────────────────────────────────────
     05 — la pochette
     Due fotografie per due lavori diversi: nella hero la scena intera,
     incorniciata perché dentro c'è muro e travertino e sfumarla la farebbe
     sembrare una macchia; nelle miniature la pochette scontornata, perché
     lì serve riconoscerla in un colpo d'occhio e la stessa scena ripetuta
     sei volte fa solo rumore.
     ──────────────────────────────────────────────────────────────── */
  .a971-rb__poc {
    container-type: inline-size;
    container-name: poc;
    --poc-mini: 8rem;
  }

  .a971-rb__poc-card {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: linear-gradient(135deg, rgba(255, 253, 248, 0.99) 0%, rgba(250, 246, 237, 0.99) 100%);
    border: 1px solid rgba(181, 143, 74, 0.28);
    border-radius: 18px;
    box-shadow:
      0 18px 42px rgba(70, 48, 25, 0.075),
      0 4px 12px rgba(70, 48, 25, 0.035),
      inset 0 1px 0 rgba(255, 255, 255, 0.92);
  }

  .a971-rb__poc-hero {
    display: grid;
    grid-template-columns: 46% minmax(0, 1fr);
    column-gap: 1.4rem;
    padding: 1.8rem 1.6rem 0;
  }
  .a971-rb__poc-vis { grid-column: 1; grid-row: 1; align-self: start; }
  .a971-rb__poc-quadro {
    display: block;
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    aspect-ratio: 72 / 100;
    box-shadow: 0 6px 16px rgba(70, 48, 25, 0.1), inset 0 0 0 1px rgba(174, 138, 79, 0.35);
  }
  .a971-rb__poc-foto {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 52%;
    transition: opacity 0.18s ease, transform 0.18s ease;
  }
  .a971-rb__poc-foto.is-via { opacity: 0; transform: translateY(3px); transition-duration: 0.11s; }

  .a971-rb__poc-testo {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-top: 0.2rem;
  }
  .a971-rb__poc-nome {
    margin: 0.7rem 0 0;
    font-family: var(--a971-serif);
    font-size: 3.4rem;
    font-weight: 500;
    line-height: 0.95;
    letter-spacing: -0.025em;
    color: #33271c;
  }
  .a971-rb__poc-divi {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    margin-top: 1rem;
    width: 9.2rem;
    color: var(--a971-oro);
  }
  .a971-rb__poc-divi i { flex: 1; height: 1px; }
  .a971-rb__poc-divi i:first-child { background: linear-gradient(to right, transparent, rgba(174, 138, 79, 0.7)); }
  .a971-rb__poc-divi i:last-child { background: linear-gradient(to left, transparent, rgba(174, 138, 79, 0.7)); }
  .a971-rb__poc-divi svg { display: block; width: 1.1rem; height: 1.1rem; flex: 0 0 auto; }
  .a971-rb__poc-desc {
    margin: 1.1rem 0 0;
    font-size: 1.25rem;
    line-height: 1.55;
    color: #6e6355;
    text-wrap: balance;
  }

  .a971-rb__poc-val {
    grid-column: 1 / -1;
    grid-row: 2;
    margin: 1.2rem 0 0;
    padding: 1rem 1.2rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.8rem 1.4rem;
    border-radius: 11px;
    background: rgba(255, 253, 248, 0.5);
    border: 1px solid rgba(181, 143, 74, 0.2);
  }
  .a971-rb__poc-val-uno,
  .a971-rb__poc-val-due {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #ad8242;
  }
  .a971-rb__poc-val-uno b {
    font-family: var(--a971-num);
    font-size: 1.2rem;
    font-weight: 500;
    letter-spacing: 0;
    color: var(--a971-oud);
  }
  .a971-rb__poc-val-uno svg { display: block; width: 1.4rem; height: 1.4rem; flex: 0 0 auto; color: var(--a971-oro); }
  .a971-rb__poc-val-sep { width: 1px; height: 1.3rem; background: rgba(174, 138, 79, 0.34); }
  .a971-rb__poc-ok {
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background: var(--a971-oro);
    color: #fff;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
  }
  /* block, non inline: da inline il segno si appoggia alla riga di testo e
     casca sotto il centro del cerchio */
  .a971-rb__poc-ok svg { display: block; width: 0.9rem; height: 0.9rem; }

  .a971-rb__poc-scelta {
    position: relative;
    z-index: 4;
    margin: 1.3rem 1.6rem;
    padding: 1rem 1.2rem 1.1rem;
    background: rgba(255, 253, 248, 0.36);
    border: 1px solid rgba(181, 143, 74, 0.18);
    border-radius: 13px;
  }
  .a971-rb__poc-lab {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--a971-oro);
  }
  .a971-rb__poc-strip-cont { position: relative; margin-top: 0.9rem; }
  .a971-rb__poc-strip-cont::after {
    content: "";
    position: absolute;
    top: 0;
    right: -1.2rem;
    width: 3.4rem;
    height: 100%;
    pointer-events: none;
    transition: opacity 0.2s ease;
    background: linear-gradient(90deg, rgba(251, 247, 238, 0), rgba(251, 247, 238, 0.96));
  }
  .a971-rb__poc-strip-cont.is-fine::after { opacity: 0; }
  .a971-rb__poc-strip {
    display: flex;
    gap: 0.8rem;
    overflow-x: auto;
    scrollbar-width: none;
    scroll-snap-type: x mandatory;
    padding-bottom: 0.2rem;
  }
  .a971-rb__poc-strip::-webkit-scrollbar { display: none; }

  .a971-rb__poc-opt {
    position: relative;
    flex: 0 0 auto;
    width: var(--poc-mini);
    scroll-snap-align: start;
    cursor: pointer;
  }
  .a971-rb__poc-opt input { position: absolute; opacity: 0; pointer-events: none; }
  .a971-rb__poc-opt-c {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    padding: 0.6rem 0.6rem 0.8rem;
    background: rgba(255, 253, 248, 0.72);
    border: 1px solid rgba(118, 98, 72, 0.15);
    border-radius: 13px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
  }
  .a971-rb__poc-opt:hover .a971-rb__poc-opt-c { border-color: rgba(174, 138, 79, 0.5); }
  .a971-rb__poc-opt input:checked + .a971-rb__poc-opt-c {
    padding: 0.55rem 0.55rem 0.75rem;
    background: #fffaf0;
    border: 1.5px solid #b38a49;
    box-shadow: 0 8px 18px rgba(75, 50, 22, 0.07), inset 0 1px 0 rgba(255, 255, 255, 0.94);
  }
  .a971-rb__poc-opt input:focus-visible + .a971-rb__poc-opt-c {
    outline: 2px solid var(--a971-oro);
    outline-offset: 2px;
  }
  /* la miniatura è scontornata: `contain` e un fondo appena caldo, così la
     pochette si legge intera invece di essere ritagliata dal riquadro */
  .a971-rb__poc-opt-foto {
    display: block;
    aspect-ratio: 126 / 100;
    border-radius: 9px;
    overflow: hidden;
    background: rgba(249, 244, 233, 0.8);
  }
  .a971-rb__poc-opt-foto img { display: block; width: 100%; height: 100%; object-fit: contain; padding: 0.4rem; }
  .a971-rb__poc-opt-pie { display: flex; align-items: center; gap: 0.4rem; min-width: 0; padding: 0; }
  .a971-rb__poc-opt-sw {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 50%;
    flex: 0 0 auto;
    background: var(--poc-sw, var(--a971-oro));
    box-shadow: 0 0 0 1px rgba(59, 46, 31, 0.16);
  }
  .a971-rb__poc-opt-nome {
    font-family: var(--a971-serif);
    font-size: 0.95rem;
    line-height: 1.15;
    color: var(--a971-oud);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .a971-rb__poc-opt-ok {
    position: absolute;
    top: 0.7rem;
    right: 0.7rem;
    width: 1.7rem;
    height: 1.7rem;
    border-radius: 50%;
    background: var(--a971-oro);
    color: #fff;
    display: grid;
    place-items: center;
    opacity: 0;
    transform: scale(0.78);
    transition: opacity 0.18s ease, transform 0.18s ease;
  }
  .a971-rb__poc-opt-ok svg { display: block; width: 1rem; height: 1rem; }
  .a971-rb__poc-opt input:checked + .a971-rb__poc-opt-c .a971-rb__poc-opt-ok { opacity: 1; transform: none; }

  .a971-rb__poc-frec {
    position: absolute;
    top: 50%;
    z-index: 3;
    width: 2.6rem;
    height: 2.6rem;
    padding: 0;
    transform: translateY(-50%);
    display: grid;
    place-items: center;
    cursor: pointer;
    border: 1px solid rgba(174, 138, 79, 0.42);
    border-radius: 50%;
    background: rgba(253, 251, 246, 0.96);
    color: var(--a971-oro);
    box-shadow: 0 2px 9px rgba(70, 48, 25, 0.12);
  }
  .a971-rb__poc-frec[hidden] { display: none; }
  .a971-rb__poc-frec svg { display: block; width: 1.3rem; height: 1.3rem; }
  .a971-rb__poc-frec--sx { left: -0.7rem; }
  .a971-rb__poc-frec--dx { right: -0.7rem; }

  /* la firma artigianale */
  .a971-rb__poc-piede { margin: 0 1.6rem 1.6rem; padding-top: 1.4rem; border-top: 1px solid rgba(174, 138, 79, 0.2); }
  .a971-rb__poc-piede-testa { display: flex; align-items: center; gap: 1.2rem; }
  .a971-rb__poc-piede-ico { flex: 0 0 auto; width: 5.4rem; }
  .a971-rb__poc-piede-ico img { display: block; width: 100%; height: auto; }
  .a971-rb__poc-piede-testa p { margin: 0; font-size: 1.2rem; line-height: 1.55; color: #6e6355; text-wrap: pretty; }
  /* tre colonne, non una frase: in fila le tre voci chiedono 343 px e la
     card ne dà 322, quindi andavano a capo lasciando il punto in testa alla
     seconda riga — sembrava un elenco rotto */
  .a971-rb__poc-piede-pregi {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: start;
    margin: 1.5rem 0 0;
    padding-top: 1.3rem;
    border-top: 1px solid rgba(174, 138, 79, 0.16);
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #ad8242;
  }
  .a971-rb__poc-piede-pregi b { font-weight: 600; text-align: center; padding: 0 0.7rem; text-wrap: balance; }
  .a971-rb__poc-piede-pregi b + b { border-left: 1px solid rgba(174, 138, 79, 0.22); }

  /* schermi molto stretti */
  @container poc (width < 332px) {
    .a971-rb__poc-hero { grid-template-columns: 1fr; column-gap: 0; padding: 1.4rem 1.4rem 0; }
    .a971-rb__poc-vis { max-width: 19rem; margin: 0 auto; }
    .a971-rb__poc-testo { padding-top: 1.2rem; }
    .a971-rb__poc-nome { font-size: 3.2rem; }
    .a971-rb__poc-scelta { margin: 1.3rem 1.4rem; padding: 1.1rem; }
    .a971-rb__poc-piede { margin: 0 1.4rem 1.4rem; }
  }

  /* scrivania: sei in fila, niente da scorrere */
  @container poc (width >= 620px) {
    .a971-rb__poc-hero { grid-template-columns: minmax(260px, 36%) minmax(0, 64%); column-gap: 3.4rem; padding: 3.6rem 4rem 0; }
    .a971-rb__poc-vis { align-self: center; }
    .a971-rb__poc-quadro { aspect-ratio: 62 / 100; border-radius: 14px; }
    .a971-rb__poc-testo { align-self: center; padding-top: 0; }
    .a971-rb__poc-nome { margin-top: 1.1rem; font-size: 5rem; }
    .a971-rb__poc-divi { width: 10.8rem; margin-top: 1.5rem; }
    .a971-rb__poc-divi svg { width: 1.3rem; height: 1.3rem; }
    .a971-rb__poc-desc { margin-top: 1.7rem; font-size: 1.45rem; }
    .a971-rb__poc-val { grid-column: 2; grid-row: 2; margin-top: 1.8rem; padding: 1.4rem 1.8rem; gap: 1.8rem; }
    .a971-rb__poc-val-uno, .a971-rb__poc-val-due { font-size: 1rem; letter-spacing: 0.16em; }
    .a971-rb__poc-val-uno b { font-size: 1.4rem; }
    .a971-rb__poc-scelta {
      margin: 2.6rem 4rem 0;
      padding: 1.6rem 1.8rem;
      background: rgba(255, 253, 248, 0.55);
      border-color: rgba(174, 138, 79, 0.2);
      border-radius: 14px;
    }
    .a971-rb__poc-strip-cont { margin-top: 1.1rem; }
    .a971-rb__poc-strip-cont::after, .a971-rb__poc-frec { display: none; }
    .a971-rb__poc-strip { gap: 1.2rem; overflow: visible; }
    .a971-rb__poc-opt { flex: 1 1 0; width: auto; min-width: 0; }
    .a971-rb__poc-opt-nome { font-size: 1.3rem; }
    .a971-rb__poc-piede { margin: 2.2rem 4rem 3rem; padding-top: 1.8rem; }
    .a971-rb__poc-piede-testa { gap: 1.8rem; }
    .a971-rb__poc-piede-ico { width: 7.8rem; }
    .a971-rb__poc-piede-testa p { font-size: 1.35rem; }
    .a971-rb__poc-piede-pregi { margin-top: 1.8rem; padding-top: 1.6rem; font-size: 1rem; letter-spacing: 0.13em; }
    .a971-rb__poc-piede-pregi b { padding: 0 1.4rem; }
  }

  /* 02–03 — one library, two slots */
  .a971-rb__ess-titolo {
    font-family: var(--a971-serif);
    font-size: 2.6rem;
    font-weight: 400;
    line-height: 1.15;
    margin: 0.2rem 0 0;
  }
  .a971-rb__ess-sub {
    font-size: 1.35rem;
    line-height: 1.5;
    color: color-mix(in srgb, var(--a971-oud) 62%, transparent);
    margin: 0.5rem 0 0;
  }
  /* One fragrance at a time: the next card peeks, so the swipe is obvious
     without a second row of controls */
  .a971-rb__ess-slider {
    display: flex;
    gap: 1.2rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    margin-top: 1.6rem;
    /* overflow-x also clips vertically: leave room for the cartouche that
       sits half outside the card */
    padding: 1.4rem 0 0.4rem;
  }
  .a971-rb__ess-slider::-webkit-scrollbar { display: none; }
  /* Proposta A: una sola cornice, il tester a sinistra e il testo accanto.
     Niente teca dentro la card e niente lineetta col rombo — quelli erano
     della B, la verticale fedele al mockup. */
  .a971-rb__ess-card {
    position: relative;
    flex: 0 0 auto;
    width: min(88%, 34rem);
    scroll-snap-align: center;
    background: var(--a971-crema);
    border: 1px solid color-mix(in srgb, var(--a971-oro) 30%, transparent);
    border-radius: 16px;
    padding: 1.6rem;
    transition: border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
  }
  .a971-rb__ess-card.is-scelta {
    border-width: 1.5px;
    border-color: var(--a971-oro);
    background: linear-gradient(150deg, #FFFBF2, color-mix(in srgb, #F2E1BF 40%, var(--a971-crema)));
    box-shadow: 0 12px 26px color-mix(in srgb, var(--a971-oud) 10%, transparent);
  }
  .a971-rb__ess-corpo {
    display: grid;
    grid-template-columns: 10.4rem 1fr;
    column-gap: 1.6rem;
    align-items: center;
    margin-top: 1rem;
  }
  .a971-rb__ess-check {
    position: absolute;
    top: 1.2rem;
    right: 1.2rem;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 2.6rem;
    height: 2.6rem;
    background: var(--a971-oro);
    color: #fff;
    border-radius: 50%;
    opacity: 0;
    transform: scale(0.6);
    transition: opacity 0.2s ease, transform 0.2s ease;
  }
  .a971-rb__ess-card.is-scelta .a971-rb__ess-check { opacity: 1; transform: none; }
  /* la fragranza già presa dall'altro passaggio: una pill contornata, mai una
     seconda spunta. Non è più incisa sul filetto perché nella A il filetto
     interno non c'è */
  .a971-rb__ess-altra {
    position: absolute;
    top: 1.2rem;
    right: 1.2rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 2.7rem;
    padding: 0.5rem 0.9rem;
    border: 1px solid color-mix(in srgb, var(--a971-oro) 42%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--a971-crema) 88%, transparent);
    font-family: var(--a971-sans);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    white-space: nowrap;
    color: color-mix(in srgb, var(--a971-oro) 82%, var(--a971-oud));
  }
  /* scelta qui e presa anche di là: la spunta tiene il suo angolo, la pill si
     sposta, altrimenti si sovrappongono */
  .a971-rb__ess-card.is-scelta .a971-rb__ess-altra { right: auto; left: 1.2rem; }
  .a971-rb__ess-altra[hidden] { display: none; }
  .a971-rb__ess-altra i { font-style: normal; font-weight: 700; color: var(--a971-oro); }
  .a971-rb__ess-fam {
    display: block;
    font-family: var(--a971-sans);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--a971-oro) 82%, var(--a971-oud));
    min-height: 1.4rem;
  }
  .a971-rb__ess-foto {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    height: 12.8rem;
  }
  /* the arabesque watermark sits behind the bottle; its strength is a setting */
  .a971-rb__ess-arab {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 13.2rem;
    height: auto;
    max-width: none;
    opacity: var(--a971-ess-arab-op, 0.85);
    pointer-events: none;
  }
  .a971-rb__ess-flac {
    position: relative;
    z-index: 1;
    height: 12.6rem;
    width: auto;
    object-fit: contain;
    filter: drop-shadow(0 12px 14px color-mix(in srgb, var(--a971-oud) 16%, transparent));
  }
  .a971-rb__ess-vial {
    position: relative;
    z-index: 1;
    display: block;
    width: 5rem;
    height: 10rem;
    color: var(--a971-oro);
  }
  .a971-rb__ess-testo { min-width: 0; }
  .a971-rb__ess-name {
    display: block;
    font-family: var(--a971-serif);
    font-size: 2.5rem;
    font-weight: 400;
    line-height: 1.1;
  }
  .a971-rb__ess-notes {
    display: block;
    margin-top: 0.5rem;
    font-size: 1.4rem;
    line-height: 1.45;
    color: color-mix(in srgb, var(--a971-oud) 58%, transparent);
  }
  .a971-rb__ess-format {
    display: block;
    margin-top: 1rem;
    font-family: var(--a971-num);
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--a971-oud) 55%, transparent);
  }
  /* the choice is an explicit action, never a tap on a large card */
  .a971-rb__ess-cta {
    width: 100%;
    margin-top: 1.2rem;
    min-height: 4.6rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.8rem;
    background: transparent;
    border: 1.5px solid var(--a971-oro);
    border-radius: 8px;
    font-family: var(--a971-sans);
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--a971-oro) 88%, var(--a971-oud));
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  }
  .a971-rb__ess-cta:hover { background: color-mix(in srgb, var(--a971-oro) 10%, transparent); }
  .a971-rb__ess-cta:focus-visible { outline: 2px solid var(--a971-oro); outline-offset: 2px; }
  .a971-rb__ess-cta.is-fatta {
    background: var(--a971-oro);
    border-color: var(--a971-oro);
    color: #fff;
  }
  .a971-rb__ess-sotto {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
    margin-top: 1rem;
  }
  .a971-rb__ess-punti { display: flex; gap: 0.8rem; }
  .a971-rb__ess-punti i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--a971-oud) 18%, transparent);
    transition: background 0.2s ease, transform 0.2s ease;
  }
  .a971-rb__ess-punti i.is-on { background: var(--a971-oro); transform: scale(1.25); }
  .a971-rb__ess-hint {
    margin: 0;
    font-size: 1.2rem;
    color: color-mix(in srgb, var(--a971-oud) 50%, transparent);
  }


  /* Engraving trigger: opens the dialog */
  .a971-rb__inc-open {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.55rem;
    width: 100%;
    /* empty on purpose: a slot still to fill, not a filled card like the
       recap right below — same cream on both was reading as one block */
    background: transparent;
    border: 1px dashed color-mix(in srgb, var(--a971-oro) 65%, transparent);
    border-radius: var(--a971-radius-sm, 8px);
    padding: 2rem 1.6rem 1.7rem;
    font-family: var(--a971-sans);
    color: var(--a971-oud);
    text-align: center;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  }
  .a971-rb__inc-open[hidden] { display: none; }
  .a971-rb__inc-open:hover {
    background: var(--a971-crema);
    border-color: var(--a971-oro);
    box-shadow: 0 6px 16px color-mix(in srgb, var(--a971-oud) 8%, transparent);
  }
  .a971-rb__inc-open:focus-visible { outline: 2px solid var(--a971-oro); outline-offset: 2px; }
  /* the sample word, in the same hand as the real engraving */
  .a971-rb__inc-open-firma {
    display: inline-flex;
    align-items: center;
    gap: 1.4rem;
    font-family: 'A971 Incisione', 'Snell Roundhand', 'Apple Chancery', 'Segoe Script', cursive;
    font-size: 3.2rem;
    line-height: 1.2;
    color: var(--a971-oro);
  }
  .a971-rb__inc-open-firma::before,
  .a971-rb__inc-open-firma::after {
    content: '';
    width: 2.6rem;
    height: 1px;
    background: color-mix(in srgb, var(--a971-oro) 40%, transparent);
  }
  .a971-rb__inc-open-tit { font-size: 1.4rem; margin-top: 0.35rem; }
  .a971-rb__inc-open-tit span { color: var(--a971-oro); }
  .a971-rb__inc-open-hint { font-size: 1.15rem; opacity: 0.65; }

  /* Confirmed engraving card, replaces the trigger */
  .a971-rb__inc-set {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.6rem;
    background: var(--a971-crema);
    border: 1px solid var(--a971-oro);
    border-radius: var(--a971-radius-sm, 8px);
    padding: 1rem 1.6rem;
  }
  .a971-rb__inc-set[hidden] { display: none; }
  .a971-rb__inc-set-name {
    font-family: 'A971 Incisione', 'Snell Roundhand', 'Apple Chancery', 'Segoe Script', cursive;
    font-size: 2.6rem;
    line-height: 1.3;
    color: var(--a971-oro);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .a971-rb__inc-set-actions { display: inline-flex; gap: 1.6rem; flex: none; }
  .a971-rb__inc-set-actions button {
    background: none;
    border: 0;
    padding: 0;
    font-family: var(--a971-sans);
    font-size: 1.15rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--a971-oud);
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
  }
  .a971-rb__inc-set-actions button:hover { color: var(--a971-oro); }
  .a971-rb__inc-set-actions button:focus-visible { outline: 2px solid var(--a971-oro); outline-offset: 2px; }

  /* Engraving field (inside the dialog) */
  .a971-rb__inc-field {
    position: relative;
    display: flex;
    align-items: center;
    background: var(--a971-crema);
    border: 1px solid color-mix(in srgb, var(--a971-oud) 15%, transparent);
    border-radius: var(--a971-radius-sm, 8px);
    transition: border-color 0.2s ease;
  }
  .a971-rb__inc-field:focus-within { border-color: var(--a971-oro); }
  .a971-rb__inc-field input {
    flex: 1;
    min-width: 0;
    background: transparent;
    border: 0;
    padding: 1.4rem 6rem 1.4rem 1.6rem;
    font-family: var(--a971-sans);
    font-size: 1.5rem;
    color: var(--a971-oud);
  }
  .a971-rb__inc-field input:focus-visible { outline: none; }
  .a971-rb__inc-count {
    position: absolute;
    right: 1.4rem;
    font-family: var(--a971-num);
    font-size: 1.15rem;
    opacity: 0.55;
  }
  .a971-rb__inc-note {
    font-size: 1.2rem;
    opacity: 0.7;
    margin: 0.8rem 0 0;
  }

  /* Recap card under the configurator */
  .a971-rb__recap {
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
    /* the recap closes the configurator: it needs room above it */
    margin: 1.2rem 0 2.4rem;
  }
  /* Live engraving preview (lives inside the dialog) */
  .a971-rb__preview {
    position: relative;
    border-radius: var(--a971-radius-sm, 8px);
    overflow: hidden;
    margin: 2rem 0 1.8rem;
  }
  .a971-rb__preview img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 2 / 1;
    object-fit: cover;
    object-position: center 12%;
  }
  /* Engraving layers: the viewBox matches the 2:1 crop, so the name scales
     with the photo on every screen size */
  .a971-rb__preview-layer {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
  }
  /* font-size lives on the element: the JS auto-fit rescales it for long
     names, and a CSS rule would override the attribute */
  .a971-rb__preview-layer text {
    font-family: 'A971 Incisione', 'Snell Roundhand', 'Apple Chancery', 'Segoe Script', cursive;
    font-weight: 400;
    text-anchor: middle;
  }
  .a971-rb__preview-caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0.7rem 1rem;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.45));
    color: #F5EEE1;
    font-size: 0.95rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    text-align: center;
  }
  /* The recap reads as a distinct "document": gold frame, soft lift,
     ruled header — clearly a summary of the choices, not another step */
  .a971-rb__summary {
    background: var(--a971-crema);
    border: 1px solid color-mix(in srgb, var(--a971-oro) 38%, transparent);
    border-radius: 12px;
    padding: 1.8rem 2rem;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--a971-oud) 7%, transparent);
  }
  /* Gold hints inside the recap: what is still to be chosen */
  .a971-rb__sum-mancano {
    display: inline-block;
    margin-left: 0.8rem;
    font-family: var(--a971-num);
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: none;
    color: var(--a971-oro);
    border: 1px solid color-mix(in srgb, var(--a971-oro) 45%, transparent);
    border-radius: 999px;
    padding: 0.25rem 0.9rem;
    vertical-align: middle;
  }
  /* an explicit display beats the UA [hidden] rule: say it here */
  .a971-rb__sum-mancano[hidden] { display: none; }
  .a971-rb__sum-row.is-mancante .a971-rb__sum-name > span:first-child {
    color: var(--a971-oro);
  }
  .a971-rb__sum-row.is-mancante .a971-rb__sum-ic {
    opacity: 0.55;
  }
  .a971-rb__summary-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--a971-oro);
    margin: 0 0 1rem;
    padding-bottom: 1.2rem;
    border-bottom: 1px solid color-mix(in srgb, var(--a971-oro) 24%, transparent);
  }
  /* Progress of the required choices, above the CTA */
  .a971-rb__stato {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin: 1.6rem 0 0;
    font-family: var(--a971-num);
    font-size: 1.2rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--a971-oud) 55%, transparent);
  }
  .a971-rb__stato.is-completo { color: var(--a971-oro); }
  .a971-rb__sum-row {
    display: flex;
    align-items: center;
    gap: 1.3rem;
    padding: 0.95rem 0;
  }
  .a971-rb__sum-row + .a971-rb__sum-row {
    border-top: 1px solid color-mix(in srgb, var(--a971-oud) 7%, transparent);
  }
  .a971-rb__sum-ic {
    flex: 0 0 auto;
    width: 3.4rem;
    height: 3.4rem;
    border: 1px solid color-mix(in srgb, var(--a971-oro) 32%, transparent);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 250, 242, 0.7);
    color: var(--a971-oro);
  }
  .a971-rb__sum-ic svg { width: 1.9rem; height: 1.9rem; }
  .a971-rb__sum-name {
    flex: 1;
    min-width: 0;
    font-size: 1.3rem;
    line-height: 1.35;
  }
  .a971-rb__sum-name small {
    display: block;
    font-size: 1.05rem;
    color: color-mix(in srgb, var(--a971-oud) 55%, transparent);
    margin-top: 0.15rem;
  }
  .a971-rb__sum-cal {
    font-family: 'A971 Incisione', cursive;
    font-size: 1.7rem;
    color: var(--a971-oro);
    line-height: 1;
    margin-left: 0.3rem;
  }
  .a971-rb__sum-end {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.3rem;
  }
  .a971-rb__sum-val {
    font-family: var(--a971-num);
    font-size: 1.2rem;
    font-weight: 600;
    color: color-mix(in srgb, var(--a971-oud) 55%, transparent);
    white-space: nowrap;
  }
  /* Every row that owns a step is a shortcut to it */
  button.a971-rb__sum-row {
    width: 100%;
    background: none;
    border: 0;
    margin: 0;
    font: inherit;
    color: inherit;
    text-align: left;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
  }
  button.a971-rb__sum-row:focus-visible {
    outline: 2px solid var(--a971-oro);
    outline-offset: 2px;
    border-radius: 6px;
  }
  .a971-rb__sum-azione {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-family: var(--a971-num);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    white-space: nowrap;
    color: color-mix(in srgb, var(--a971-oud) 42%, transparent);
  }
  .a971-rb__sum-row.is-mancante .a971-rb__sum-azione { color: var(--a971-oro); }

  /* Price + CTA */
  /* Price stack: big figure first, then "Valore ..." vs the saving pill */
  .a971-rb__pricing {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
    border-top: 1px solid var(--a971-hairline);
    padding-top: 1.8rem;
  }
  .a971-rb__price {
    font-family: var(--a971-num);
    font-weight: 600;
    letter-spacing: -0.02em;
    font-size: clamp(4.4rem, 4vw, 5.6rem);
    line-height: 1;
  }
  .a971-rb__compare {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    font-family: var(--a971-num);
    font-size: 1.5rem;
  }
  .a971-rb__compare s { opacity: 0.55; }
  .a971-rb__compare-div { display: none; } /* editorial divider, mobile only */
  .a971-rb__stato-bar { display: none; }   /* thin progress bar, mobile only */
  .a971-rb__compare-pill {
    color: var(--a971-verde);
    font-weight: 600;
    font-size: 1.3rem;
    letter-spacing: 0.08em;
    background: color-mix(in srgb, var(--a971-oro) 14%, var(--a971-crema));
    border: 1px solid color-mix(in srgb, var(--a971-oro) 45%, transparent);
    border-radius: 999px;
    padding: 0.45rem 1.4rem;
  }
  .a971-rb__paynote {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    font-family: var(--a971-num);
    font-size: 1.3rem;
    opacity: 0.8;
    margin: 1rem 0 0;
  }
  .a971-rb__payicons { display: inline-flex; align-items: center; gap: 0.6rem; }
  .a971-rb__payicon { display: block; height: 2.2rem; width: auto; border-radius: 3px; }
  .a971-rb__cta {
    position: relative;
    width: 100%;
    min-height: 6rem;
    margin-top: 2rem;
    letter-spacing: 0.14em;
    border: 0;
    cursor: pointer;
    border-radius: var(--a971-radius, 10px);
  }
  .a971-rb__cta:disabled { opacity: 0.5; cursor: not-allowed; }
  /* AJAX add states driven by Dawn's product-form.js */
  .a971-rb__cta.loading > span { visibility: hidden; }
  .a971-rb__cta .loading__spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 1.8rem;
    height: 1.8rem;
  }
  .a971-rb__cta .loading__spinner .path { stroke: #fff; }
  .a971-rb__error {
    margin: 1.2rem 0 0;
    font-size: 1.25rem;
    color: #A03A2A;
  }
  .a971-rb__error[hidden] { display: none; }

  /* Missing-choice warning: the native bubble can't appear on the hidden
     radios, so the guard in JS blocks the submit and speaks here instead */
  .a971-rb__manca {
    margin: 0 0 1.2rem;
    padding: 1.2rem 1.5rem;
    font-size: 1.3rem;
    line-height: 1.55;
    color: #7A2E1D;
    background: color-mix(in srgb, #C4694E 10%, transparent);
    border: 1px solid color-mix(in srgb, #C4694E 42%, transparent);
    border-radius: var(--a971-radius-sm, 8px);
  }
  .a971-rb__manca[hidden] { display: none; }
  .a971-rb__step.is-manca {
    outline: 2px solid color-mix(in srgb, #C4694E 70%, transparent);
    outline-offset: 8px;
    border-radius: 4px;
  }

  .a971-rb__badges {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0;
    margin: 1.8rem 0 0;
    font-size: 1.15rem;
    opacity: 0.8;
  }
  .a971-rb__badges li { display: inline-flex; align-items: center; gap: 0.6rem; white-space: nowrap; }
  .a971-rb__badge-icon { display: inline-flex; color: var(--a971-oro); }

  /* Reassurance strip */
  .a971-rb__garanzie {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 2.4rem;
    border-top: 1px solid var(--a971-hairline);
    margin-top: 4.8rem;
    padding-top: 3.2rem;
  }
  .a971-rb__garanzia {
    display: flex;
    align-items: flex-start;
    gap: 1.2rem;
  }
  .a971-rb__garanzia-icon { display: inline-flex; color: var(--a971-oro); flex: none; margin-top: 0.2rem; }
  .a971-rb__garanzia-body { display: flex; flex-direction: column; gap: 0.3rem; }
  .a971-rb__garanzia-body strong { font-size: 1.25rem; letter-spacing: 0.04em; }
  .a971-rb__garanzia-body span { font-size: 1.2rem; opacity: 0.7; line-height: 1.5; }

  /* Mobile sheet: the closing step of the configurator. Three levels —
     price and state, CTA, progress across the full width — plus the promises */
  /* ── la barra in fondo ──
     Non è un secondo pannello del configuratore: prezzo e pulsante sono gli
     unici due elementi grandi, tutto il resto scende a micro-righe
     orizzontali. Era oltre 300 px di altezza, ora sta sotto i 160. */
  .a971-rb__stickybar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 20;
    background: color-mix(in srgb, var(--a971-crema) 88%, #fff);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid color-mix(in srgb, var(--a971-oro) 20%, transparent);
    border-bottom: 0;
    border-radius: 20px 20px 0 0;
    box-shadow: 0 -12px 36px color-mix(in srgb, var(--a971-oud) 10%, transparent);
    padding: 1.8rem 1.6rem calc(1.4rem + env(safe-area-inset-bottom));
  }
  .a971-rb__stickybar[hidden] { display: none; }
  /* One focal point at a time: while the menu drawer is open (Dawn marks
     the body with overflow-hidden-*) the sheet steps aside — it was
     covering the drawer's account row */
  body.overflow-hidden-tablet .a971-rb__stickybar,
  body.overflow-hidden-mobile .a971-rb__stickybar { display: none; }

  .a971-rb__stickybar-main {
    display: grid;
    /* 50% and not 53%: the three points of the extra 3% are exactly what
       made «Valore … Risparmi …» fall onto a second line */
    grid-template-columns: minmax(0, 1fr) 50%;
    align-items: center;
    column-gap: 1.2rem;
  }
  .a971-rb__stickybar-info { min-width: 0; }
  .a971-rb__stickybar-prezzo {
    display: block;
    font-family: var(--a971-serif);
    font-weight: 400;
    font-size: clamp(4rem, 11vw, 4.6rem);
    line-height: 0.95;
    letter-spacing: -0.035em;
    font-variant-numeric: lining-nums;
    color: var(--a971-oud);
  }
  /* attaccata al prezzo, non staccata: è la sua spiegazione */
  .a971-rb__stickybar-valore {
    display: block;
    margin-top: 0.5rem;
    font-size: 1.15rem;
    line-height: 1.3;
    /* it has to survive on one line inside half the bar: no tracking */
    letter-spacing: 0;
    color: color-mix(in srgb, var(--a971-oud) 62%, transparent);
  }
  .a971-rb__stickybar-valore s { text-decoration-thickness: 1px; }
  /* il separatore sta prima della voce che segue: andando a capo se lo porta
     dietro invece di lasciarlo appeso in fondo alla riga */
  .a971-rb__stickybar-valore b::before { content: ' · '; color: color-mix(in srgb, var(--a971-oud) 35%, transparent); }
  /* il risparmio in verde: è l'unico numero della pagina che dice quanto
     si tiene in tasca, e va distinto dall'oro che qui è il colore del marchio */
  .a971-rb__stickybar-valore b { font-weight: 500; color: var(--a971-verde); }

  .a971-rb__stickybar-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.8rem;
    min-height: 5.6rem;
    padding: 0 1.4rem;
    border-radius: 13px;
    background: var(--a971-oro);
    color: #fff;
    /* «Inizia il Rituale» è più lungo di «Continua»: un filo più piccolo
       gli lascia stare su una riga sola nella stessa colonna */
    font-size: 1.2rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none;
    position: relative;
    overflow: hidden;
  }
  .a971-rb__stickybar-btn:active { filter: brightness(0.95); }
  /* «Aggiungi l'incisione» non entra su una riga sola in mezza barra: se
     deve spezzarsi, che si spezzi in due righe pari invece di lasciare una
     parola orfana sotto */
  .a971-rb__stickybar-btn > span { text-wrap: balance; }
  .a971-rb__stickybar-freccia { flex: none; }

  /* stato e disponibilità su una riga: erano tre modi di dire la stessa cosa,
     incolonnati uno sotto l'altro */
  .a971-rb__stickybar-riga {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.2rem 0.8rem;
    margin: 1.8rem 0 0;
    font-size: 1.15rem;
    line-height: 1.4;
    letter-spacing: 0;
    color: color-mix(in srgb, var(--a971-oud) 65%, transparent);
  }
  .a971-rb__stickybar-stato::before {
    content: '· ';
    color: color-mix(in srgb, var(--a971-oud) 35%, transparent);
  }
  .a971-rb__stickybar-stato { color: var(--a971-oro); }
  .a971-rb__stickybar-stato.is-completo { color: var(--a971-oro); font-weight: 500; }
  .a971-rb__stickybar-stato:empty, .a971-rb__stickybar-stato:empty::before { display: none; }
  /* Il conteggio e lo stato non stanno mai insieme se dicono la stessa cosa
     («3 di 6 completate · 3 scelte mancanti»): la riga ne nasconde uno, e
     senza il conteggio davanti il puntino iniziale resterebbe appeso. */
  .a971-rb__stickybar-conta[hidden],
  .a971-rb__stickybar-stato[hidden] { display: none; }
  .a971-rb__stickybar-conta[hidden] + .a971-rb__stickybar-stato::before { content: none; }
  /* la disponibilità va a destra quando lo spazio c'è, sotto quando manca */
  .a971-rb__stickybar-scorta {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-left: auto;
    font-size: 1.1rem;
    color: color-mix(in srgb, var(--a971-oud) 62%, transparent);
  }
  .a971-rb__stickybar-scorta::before {
    content: '';
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 50%;
    background: var(--a971-oro);
    flex: none;
  }
  /* Vira solo il puntino, non la scritta: la riga resta leggibile come
     prima e il rosso fa il suo lavoro senza tingere una frase intera. */
  .a971-rb__stickybar-scorta.is-agli-sgoccioli::before {
    background: var(--a971-scorta-rossa);
  }

  /* l'avanzamento sul filo della barra, a tutta larghezza */
  .a971-rb__stickybar-bar {
    grid-column: 1 / -1;
    display: block;
    height: 3px;
    margin: 1.6rem -1.6rem 0;
    background: color-mix(in srgb, var(--a971-oro) 18%, transparent);
    overflow: hidden;
  }
  .a971-rb__stickybar-bar > span {
    position: relative;
    display: block;
    width: 0;
    height: 100%;
    overflow: hidden;
    background: var(--a971-oro);
    /* the fill settles instead of snapping: it is progress, not a loader */
    transition: width 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
  }
  /* a slow gleam runs along what is already earned */
  .a971-rb__stickybar-bar > span::after,
  .a971-rb__stato-bar > span::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
      transparent 0%,
      color-mix(in srgb, #fff 70%, transparent) 50%,
      transparent 100%);
    transform: translateX(-100%);
    animation: a971-rb-luce 3s ease-in-out infinite;
  }
  @keyframes a971-rb-luce {
    0% { transform: translateX(-100%); }
    55%, 100% { transform: translateX(100%); }
  }

  /* Lo stesso riflesso della barra attraversa il pulsante d'acquisto.
     Prima era legato a `.is-pronto`, cioè partiva solo a configurazione
     completa: il pulsante restava immobile proprio nel momento in cui lo si
     guarda per la prima volta. Adesso il riflesso lo accende la sezione,
     sempre, e la regola sta in rituale-badou.liquid accanto alle altre che
     dipendono dall'id — qui resta solo il contenitore. */
  .a971-rb__cta,
  .a971-rb__stickybar-btn {
    position: relative;
    overflow: hidden;
  }
  .a971-rb__stickybar-rass {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 0.6rem;
    margin: 1.2rem 0 0;
    padding: 1.1rem 0 0;
    border-top: 1px solid color-mix(in srgb, var(--a971-oud) 12%, transparent);
    list-style: none;
    font-size: 1.1rem;
    line-height: 1.4;
    color: color-mix(in srgb, var(--a971-oud) 55%, transparent);
  }
  .a971-rb__stickybar-rass li + li::before {
    content: '·';
    margin-right: 0.6rem;
  }
  @media (max-width: 379px) {
    .a971-rb__stickybar { padding-left: 1.4rem; padding-right: 1.4rem; }
    .a971-rb__stickybar-bar { margin-left: -1.4rem; margin-right: -1.4rem; }
    /* il prezzo non si rimpicciolisce più qui: ci pensa il clamp, che sotto
       i 380 px si appoggia comunque al suo minimo di 4rem */
    .a971-rb__stickybar-main { grid-template-columns: minmax(0, 1fr) 48%; column-gap: 1rem; }
    .a971-rb__stickybar-btn { font-size: 1.08rem; padding: 0 1rem; letter-spacing: 0.07em; }
    .a971-rb__stickybar-valore { font-size: 1.05rem; }
    .a971-rb__stickybar-riga { font-size: 1.05rem; }
    .a971-rb__stickybar-scorta { font-size: 1rem; }
    /* three promises on one line down to the narrowest phones */
    .a971-rb__stickybar-rass { font-size: 1rem; }
  }
  /* Sticky CTA / recap tap: halo on the step still to be made */
  .a971-rb__step.is-mira {
    outline: 2px solid color-mix(in srgb, var(--a971-oro) 60%, transparent);
    outline-offset: 8px;
    border-radius: 10px;
    animation: a971-rb-mira 1.4s ease forwards;
  }
  @keyframes a971-rb-mira {
    0%, 65% { outline-color: color-mix(in srgb, var(--a971-oro) 60%, transparent); }
    100% { outline-color: transparent; }
  }
  .a971-rb__mira-hint {
    margin: 0.7rem 0 0;
    font-size: 1.15rem;
    line-height: 1.4;
    color: var(--a971-oro);
  }

  /* Engraving dialog (Apple-style) */
  html.a971-rb-modal-open { overflow: hidden; }
  .a971-rb__modal {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: grid;
    place-items: center;
    padding: 2.4rem;
  }
  .a971-rb__modal[hidden] { display: none; }
  .a971-rb__modal-backdrop {
    position: absolute;
    inset: 0;
    background: color-mix(in srgb, #1D1509 62%, transparent);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    opacity: 0;
    transition: opacity 0.25s ease;
  }
  .a971-rb__modal-dialog {
    position: relative;
    width: min(62rem, 100%);
    max-height: calc(100dvh - 4.8rem);
    overflow: auto;
    background: var(--a971-crema);
    color: var(--a971-oud);
    border-radius: var(--a971-radius, 10px);
    padding: 3.2rem 3.2rem 2.8rem;
    box-shadow: 0 30px 80px rgba(20, 12, 4, 0.4);
    opacity: 0;
    transform: translateY(16px) scale(0.985);
    transition: opacity 0.3s ease, transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .a971-rb__modal.is-open .a971-rb__modal-backdrop { opacity: 1; }
  .a971-rb__modal.is-open .a971-rb__modal-dialog { opacity: 1; transform: none; }
  .a971-rb__modal-x {
    position: absolute;
    top: 1.4rem;
    right: 1.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.6rem;
    height: 3.6rem;
    background: none;
    border: 0;
    border-radius: 50%;
    color: var(--a971-oud);
    cursor: pointer;
  }
  .a971-rb__modal-x:hover { background: color-mix(in srgb, var(--a971-oud) 8%, transparent); }
  .a971-rb__modal-x:focus-visible { outline: 2px solid var(--a971-oro); outline-offset: 2px; }
  .a971-rb__modal-eyebrow { margin: 0 0 1rem; }
  .a971-rb__modal-title {
    font-family: var(--a971-serif);
    font-weight: 400;
    font-size: 2.8rem;
    line-height: 1.1;
    margin: 0 0 0.6rem;
  }
  .a971-rb__modal-text {
    font-size: 1.4rem;
    line-height: 1.6;
    opacity: 0.8;
    margin: 0;
    max-width: 46rem;
  }
  .a971-rb__modal-actions {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    margin-top: 2rem;
  }
  .a971-rb__modal-confirm {
    width: 100%;
    min-height: 5.4rem;
    border: 0;
    cursor: pointer;
    border-radius: var(--a971-radius, 10px);
    letter-spacing: 0.14em;
  }
  .a971-rb__modal-confirm:disabled { opacity: 0.45; cursor: not-allowed; }
  .a971-rb__modal-cancel {
    align-self: center;
    background: none;
    border: 0;
    padding: 0;
    font-family: var(--a971-sans);
    font-size: 1.2rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--a971-oud);
    opacity: 0.7;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
  }
  .a971-rb__modal-cancel:hover { opacity: 1; color: var(--a971-oro); }
  .a971-rb__modal-cancel:focus-visible { outline: 2px solid var(--a971-oro); outline-offset: 2px; }

  @media (min-width: 990px) {
    .a971-rb__panel {
      position: sticky;
      top: 2.4rem;
    }
    .a971-rb__stickybar { display: none; }
  }

  /* Five gestures — cards with dashed-circle icons */
  .a971-rb__gesti,
  .a971-rb__conf {
    margin-top: 7rem;
    text-align: center;
  }
  .a971-rb__gesti-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1.4rem;
    margin-top: 3.2rem;
  }
  .a971-rb__gesto {
    background: rgba(255, 250, 242, 0.7);
    border: 1px solid color-mix(in srgb, var(--a971-oro) 22%, transparent);
    border-radius: 12px;
    padding: 2.4rem 1.6rem 2.4rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.1rem;
  }
  .a971-rb__gesto-n {
    font-family: var(--a971-num);
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    color: color-mix(in srgb, var(--a971-oud) 45%, transparent);
  }
  .a971-rb__gesto-ic {
    width: 7rem;
    height: 7rem;
    border: 1px dashed color-mix(in srgb, var(--a971-oro) 55%, transparent);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--a971-oro);
  }
  .a971-rb__gesto-ic svg { width: 2.6rem; height: 2.6rem; }
  /* drawn illustrations (ill-*) fill the circle like the PNGs */
  .a971-rb__gesto-ic--img svg { width: 100%; height: 100%; }
  .a971-rb__gesto-ic--img { overflow: hidden; }
  .a971-rb__gesto-ic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    /* white-background illustrations melt into the card */
    mix-blend-mode: multiply;
    transform: scale(1.3);
  }
  /* mobile-carousel chrome, hidden on desktop */
  .a971-rb__gesti-nav,
  .a971-rb__gesti-piede,
  .a971-rb__gesto-count { display: none; }
  .a971-rb__gesto-name { margin: 0; font-family: var(--a971-serif); font-size: 2rem; font-weight: 500; line-height: 1.15; }
  .a971-rb__gesto-orn { color: var(--a971-oro); font-size: 1.05rem; line-height: 1; }
  .a971-rb__gesto-text {
    margin: 0;
    font-size: 1.18rem;
    line-height: 1.55;
    color: color-mix(in srgb, var(--a971-oud) 65%, transparent);
  }

  /* Comparison table — the Rituale column floats above as a golden card.
     Column widths live in custom properties so the decorative layer
     (absolute, %-based) always tracks the grid at every breakpoint. */
  .a971-rb__sect-title .a971-rb__conf-oro2 { display: block; font-style: normal; }
  .a971-rb__conf-intro {
    max-width: 52rem;
    margin: 1.8rem auto 0;
    font-size: 1.4rem;
    line-height: 1.65;
    color: color-mix(in srgb, var(--a971-oud) 65%, transparent);
  }
  .a971-rb__conf-tab {
    --c1: 46%;
    --c2: 30%;
    --c3: 24%;
    position: relative;
    max-width: 96rem;
    margin: 4.6rem auto 0;
    background: rgba(255, 250, 242, 0.7);
    border: 1px solid color-mix(in srgb, var(--a971-oud) 10%, transparent);
    border-radius: 12px;
    text-align: left;
  }
  /* the layer is an empty div: Dawn's div:empty would hide it, hence
     the higher-specificity selector with an explicit display */
  .a971-rb__conf-tab > .a971-rb__conf-card {
    display: block;
    position: absolute;
    left: var(--c1);
    width: var(--c2);
    top: -1.6rem;
    bottom: -1.6rem;
    background: linear-gradient(180deg, #FBF6E9, #F3EBD8);
    border: 1px solid color-mix(in srgb, var(--a971-oro) 55%, transparent);
    border-radius: 14px;
    box-shadow: 0 18px 40px color-mix(in srgb, var(--a971-oud) 14%, transparent);
    pointer-events: none;
  }
  .a971-rb__conf-badge {
    position: absolute;
    left: calc(var(--c1) + var(--c2) / 2);
    top: -2.8rem;
    transform: translateX(-50%);
    z-index: 1;
    background: var(--a971-oro);
    color: #fff;
    font-family: var(--a971-sans);
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    white-space: nowrap;
    padding: 0.7rem 1.6rem;
    border-radius: 6px;
    box-shadow: 0 6px 16px color-mix(in srgb, var(--a971-oud) 18%, transparent);
  }
  .a971-rb__conf-row {
    position: relative; /* paints above the card layer */
    display: grid;
    grid-template-columns: var(--c1) var(--c2) var(--c3);
    align-items: stretch;
  }
  /* separators per cell: neutral on the sides, gold-tinted inside the card */
  .a971-rb__conf-row + .a971-rb__conf-row .a971-rb__conf-feat,
  .a971-rb__conf-row + .a971-rb__conf-row .a971-rb__conf-alt {
    border-top: 1px solid color-mix(in srgb, var(--a971-oud) 7%, transparent);
  }
  .a971-rb__conf-row + .a971-rb__conf-row .a971-rb__conf-rit {
    border-top: 1px solid color-mix(in srgb, var(--a971-oro) 24%, transparent);
  }
  .a971-rb__conf-row > span {
    padding: 1.3rem 2rem;
    display: flex;
    align-items: center;
  }
  .a971-rb__conf-feat { gap: 1.4rem; }
  /* "breve" mobile variants: hidden on desktop, swapped in under 750px */
  .a971-rb__conf-breve { display: none; }
  .a971-rb__conf-lungo { display: flex; flex-direction: column; gap: 0.2rem; }
  .a971-rb__conf-nota { display: none; }
  .a971-rb__conf-ic { flex: 0 0 auto; color: var(--a971-oro); display: flex; }
  .a971-rb__conf-ic svg { width: 1.8rem; height: 1.8rem; }
  .a971-rb__conf-feat-txt {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    font-family: var(--a971-serif);
    font-size: 1.7rem;
    line-height: 1.25;
    color: var(--a971-oud);
    font-variant-numeric: lining-nums; /* Cormorant's old-style digits jump around */
  }
  .a971-rb__conf-feat-txt small,
  .a971-rb__conf-rit-txt small,
  .a971-rb__conf-alt-txt small {
    font-family: var(--a971-sans);
    font-size: 1.15rem;
    line-height: 1.4;
    color: color-mix(in srgb, var(--a971-oud) 52%, transparent);
  }
  .a971-rb__conf-rit {
    gap: 1.2rem;
    padding-left: 2.8rem;
  }
  .a971-rb__conf-check {
    flex: 0 0 auto;
    width: 2rem;
    height: 2rem;
    color: var(--a971-oro);
  }
  .a971-rb__conf-check svg { display: block; width: 100%; height: 100%; }
  .a971-rb__conf-rit-txt {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    font-family: var(--a971-serif);
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1.25;
    color: var(--a971-oud);
    font-variant-numeric: lining-nums;
  }
  .a971-rb__conf-alt {
    justify-content: center;
  }
  .a971-rb__conf-alt-txt {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    text-align: center;
    font-family: var(--a971-serif);
    font-size: 1.5rem;
    line-height: 1.3;
    color: color-mix(in srgb, var(--a971-oud) 45%, transparent);
    font-variant-numeric: lining-nums;
  }
  .a971-rb__conf-row--head .a971-rb__conf-feat {
    font-family: var(--a971-sans);
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--a971-oro);
  }
  .a971-rb__conf-row--head .a971-rb__conf-rit {
    flex-direction: column;
    justify-content: center;
    gap: 0.7rem;
    padding: 2rem 1rem 1.5rem;
    font-family: var(--a971-serif);
    font-size: 2.2rem;
    font-weight: 500;
    color: var(--a971-oud);
  }
  .a971-rb__conf-gem {
    width: 0.7rem;
    height: 0.7rem;
    background: var(--a971-oro);
    transform: rotate(45deg);
    opacity: 0.85;
  }
  .a971-rb__conf-row--head .a971-rb__conf-alt {
    font-family: var(--a971-sans);
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--a971-oud) 50%, transparent);
  }

  /* La carta recensione, quella delle schede profumo. Solo su telefono:
     sopra i 749px la colonna del testo e' stretta e la riga delle stelle in
     cima porta gia' allo stesso posto. */
  .a971-rb__qfoto { display: none; }
  @media (max-width: 749px) {
    .a971-rb__qfoto {
      display: block;
      /* Sotto non c'era niente e «01 — Scegli il profumo» ci si appoggiava
         sopra: sembrava la didascalia della carta invece del titolo del passo
         che comincia. Sotto piu' che sopra, perche' sotto comincia una parte
         nuova mentre sopra finisce solo un paragrafo. */
      margin: 2.8rem 0 3.4rem;
      border-radius: 14px;
      overflow: hidden;
      /* il file ha gia' il suo fondo avorio: il bordo serve a staccarlo dalla
         sabbia della pagina, che e' quasi lo stesso colore */
      border: 1px solid color-mix(in srgb, var(--a971-oro) 26%, transparent);
    }
    .a971-rb__qfoto img { display: block; width: 100%; height: auto; }
    .a971-rb__qfoto:focus-visible {
      outline: 2px solid var(--a971-oro);
      outline-offset: 2px;
    }
  }

  /* La versione a immagine della fascia, in due file. Sotto i 900px esce
     quello verticale (941x1672) e si ferma a 46rem: stirato su 68 come la
     carta HTML diventerebbe un poster sfocato, perche' quei 941px sono tutta
     la risoluzione che ha. Sopra i 900px entra l'orizzontale (1672x941), che
     di larghezza ne ha da vendere e puo' prendersi le stesse 68rem della
     carta HTML — il breakpoint qui deve restare uguale a quello del <source>
     nella sezione, altrimenti un file esce nella misura pensata per l'altro. */
  .a971-rb__valore-foto {
    max-width: 46rem;
    margin: 3.4rem auto 0;
  }
  .a971-rb__valore-foto img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 18px;
  }
  @media (min-width: 900px) {
    .a971-rb__valore-foto { max-width: 68rem; }
  }

  /* Value reveal card — dark climax after the table. The near-black is
     deliberately deeper than the palette so the card breaks the sand page. */
  .a971-rb__valore {
    max-width: 68rem;
    margin: 3.4rem auto 0;
    padding: 3.4rem 3rem 3rem;
    background: linear-gradient(145deg, #241B15, #17110D);
    border: 1px solid color-mix(in srgb, var(--a971-oro) 50%, transparent);
    border-radius: 18px;
    text-align: center;
    color: #F2E9D8;
  }
  .a971-rb__valore-eyebrow {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.9rem;
    font-size: 1.2rem;
    font-weight: 600;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: var(--a971-oro-chiaro);
  }
  .a971-rb__valore-titolo {
    margin: 1.6rem 0 0;
    font-family: var(--a971-serif);
    font-size: 3.3rem;
    line-height: 1.18;
    color: #F4EDE0;
  }
  .a971-rb__valore-titolo em { display: block; color: var(--a971-oro-chiaro); }
  .a971-rb__valore-orn {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    max-width: 24rem;
    margin: 2rem auto 0;
    font-size: 1.2rem;
    color: var(--a971-oro-chiaro);
  }
  .a971-rb__valore-orn::before,
  .a971-rb__valore-orn::after {
    content: '';
    flex: 1;
    height: 1px;
    background: color-mix(in srgb, var(--a971-oro) 55%, transparent);
  }
  .a971-rb__valore-prezzi {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-top: 2.6rem;
  }
  .a971-rb__valore-col {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 0 1.6rem;
  }
  .a971-rb__valore-col + .a971-rb__valore-col {
    border-left: 1px solid color-mix(in srgb, var(--a971-oro) 32%, transparent);
  }
  .a971-rb__valore-lab {
    font-size: 1.15rem;
    font-weight: 600;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: color-mix(in srgb, #F2E9D8 62%, transparent);
  }
  .a971-rb__valore-centro {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .a971-rb__valore-barrato {
    font-family: var(--a971-num);
    font-size: 2.6rem;
    font-weight: 500;
    color: color-mix(in srgb, #F2E9D8 55%, transparent);
    text-decoration-color: color-mix(in srgb, var(--a971-oro) 75%, transparent);
    text-decoration-thickness: 2px;
  }
  .a971-rb__valore-prezzo {
    font-family: var(--a971-num);
    font-size: 5.4rem;
    font-weight: 500;
    line-height: 1;
    color: color-mix(in srgb, var(--a971-oro-chiaro) 72%, #F4EDE0 28%);
  }
  .a971-rb__valore-risp-riga {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.6rem;
    margin: 2.8rem 0 0;
  }
  .a971-rb__valore-scintilla { color: var(--a971-oro-chiaro); font-size: 1.3rem; }
  .a971-rb__valore-risp {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    font-family: var(--a971-num);
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #2A2014;
    background: linear-gradient(120deg, #D9BC7F, var(--a971-oro-chiaro) 55%, #D9BC7F);
    border-radius: 999px;
    padding: 1rem 2.6rem;
  }
  .a971-rb__valore-risp svg { width: 1.7rem; height: 1.7rem; flex: 0 0 auto; }
  .a971-rb__valore-elementi {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    margin-top: 3rem;
    padding-top: 2.6rem;
    border-top: 1px solid color-mix(in srgb, var(--a971-oro) 25%, transparent);
  }
  .a971-rb__valore-el {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.1rem;
    padding: 0.4rem 0.8rem;
    border-left: 1px solid color-mix(in srgb, var(--a971-oro) 22%, transparent);
  }
  .a971-rb__valore-el:first-child { border-left: none; }
  .a971-rb__valore-el-ic { color: var(--a971-oro-chiaro); display: flex; }
  .a971-rb__valore-el-ic svg { width: 2.8rem; height: 2.8rem; }
  .a971-rb__valore-el-nome {
    font-size: 1.25rem;
    line-height: 1.35;
    color: color-mix(in srgb, #F2E9D8 80%, transparent);
  }

  /* Boutique row under the card */
  .a971-rb__bout {
    max-width: 68rem;
    margin: 1.6rem auto 0;
    display: flex;
    align-items: center;
    gap: 1.4rem;
    background: var(--a971-crema);
    border: 1px solid color-mix(in srgb, var(--a971-oud) 10%, transparent);
    border-radius: 14px;
    padding: 1.4rem 1.8rem;
    text-align: left;
    text-decoration: none;
    color: var(--a971-oud);
  }
  a.a971-rb__bout { transition: border-color 0.2s ease; }
  a.a971-rb__bout:hover { border-color: color-mix(in srgb, var(--a971-oro) 55%, transparent); }
  a.a971-rb__bout:focus-visible { outline: 2px solid var(--a971-oro); outline-offset: 3px; }
  .a971-rb__bout-ic { color: var(--a971-oro); display: flex; }
  .a971-rb__bout-ic svg { width: 2.6rem; height: 2.6rem; }
  .a971-rb__bout-testi { flex: 1; display: flex; flex-direction: column; gap: 0.2rem; }
  .a971-rb__bout-testi b { font-size: 1.45rem; font-weight: 600; }
  .a971-rb__bout-testi span { font-size: 1.3rem; color: color-mix(in srgb, var(--a971-oud) 60%, transparent); }
  .a971-rb__bout-freccia { color: var(--a971-oro); display: flex; }
  .a971-rb__bout-freccia svg { width: 1.8rem; height: 1.8rem; }

  /* Reviews + FAQ — shared section headers */
  .a971-rb__rec,
  .a971-rb__faq {
    margin-top: 7rem;
    scroll-margin-top: 10rem;
    text-align: center;
  }
  .a971-rb__sect-eyebrow { text-align: center; margin-bottom: 0; }
  /* Il «G» sta sulla riga dell'eyebrow, non sopra: e' una fonte, non un
     titolo. Alto quanto la maiuscola accanto, con l'unico spazio che gli
     serve per non toccare la R. */
  .a971-rb__rec-glogo {
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    margin-right: 0.5em;
    vertical-align: -0.42em;
  }
  .a971-rb__sect-title {
    font-family: var(--a971-serif);
    font-size: 3.4rem;
    font-weight: 400;
    line-height: 1.1;
    margin: 1rem 0 0;
    color: var(--a971-oud);
  }
  .a971-rb__sect-title em { font-style: italic; color: var(--a971-oro); }
  .a971-rb__sect-rule {
    display: block;
    width: 5.6rem;
    height: 2px;
    background: var(--a971-oro);
    margin: 1.6rem auto 0;
  }
  .a971-rb__stars { color: var(--a971-oro); letter-spacing: 0.15em; }

  .a971-rb__rec-sum {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.4rem;
    margin: 2.8rem 0 3.2rem;
    flex-wrap: wrap;
  }
  .a971-rb__rec-score { font-family: var(--a971-num); font-size: 4.6rem; font-weight: 700; line-height: 1; }
  .a971-rb__rec-meta { font-size: 1.3rem; color: color-mix(in srgb, var(--a971-oud) 60%, transparent); text-align: left; }
  .a971-rb__rec-meta .a971-rb__stars { display: block; font-size: 1.6rem; margin-bottom: 0.4rem; }
  .a971-rb__rec-bars { display: flex; flex-direction: column; gap: 0.45rem; min-width: 18rem; }
  .a971-rb__rec-bar { display: flex; align-items: center; gap: 0.8rem; font-size: 1.05rem; color: color-mix(in srgb, var(--a971-oud) 55%, transparent); }
  .a971-rb__rec-bar b { font-family: var(--a971-num); width: 1.2rem; text-align: right; font-weight: 600; }
  .a971-rb__rec-track { flex: 1; height: 4px; border-radius: 99px; background: color-mix(in srgb, var(--a971-oud) 10%, transparent); overflow: hidden; }
  .a971-rb__rec-track > .a971-rb__rec-fill {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--a971-oro-chiaro, #C9A96A), var(--a971-oro));
    border-radius: 99px;
  }

  /* Editorial pair: real boutique photos, asymmetric like a magazine spread.
     The cream frame comes from padding, not from a filter on the shots. */
  .a971-rb__rec-foto {
    display: grid;
    /* 1.45 and not 1.55: at this ratio the two side shots almost exactly fill
       the height the family shot and the quote set, so they barely need to be
       cropped to fill their boxes. */
    grid-template-columns: 1.45fr 1fr;
    gap: 1.6rem;
    margin: 2.8rem 0 1.6rem;
    text-align: left;
  }
  .a971-rb__rec-scatto {
    margin: 0;
    padding: 1rem;
    background: var(--a971-crema);
    border: 1px solid color-mix(in srgb, var(--a971-oro) 22%, transparent);
    border-radius: 14px;
    box-shadow: 0 6px 22px color-mix(in srgb, var(--a971-oud) 8%, transparent);
  }
  .a971-rb__rec-scatto img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 13 / 9;
    object-fit: cover;
    border-radius: 8px;
  }
  /* The family shot keeps its own proportions — it is the one photo where
     cropping would cut someone's head off. It sets the row height; everything
     else adapts to it. */
  .a971-rb__rec-principale {
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
  }
  /* aspect-ratio: auto beats the generic 13/9 above, so the file's own
     1500×1115 applies and nobody in the frame gets cut. */
  .a971-rb__rec-scatto--grande img { aspect-ratio: auto; }
  /* The two side shots split the height the left column dictates, so both
     columns end on the same line. They are already crops, so covering them a
     little tighter costs nothing. */
  .a971-rb__rec-colonna {
    display: grid;
    grid-auto-flow: row;
    grid-auto-rows: 1fr;
    gap: 1.6rem;
  }
  .a971-rb__rec-colonna .a971-rb__rec-scatto { display: flex; }
  .a971-rb__rec-colonna .a971-rb__rec-scatto img {
    height: 100%;
    aspect-ratio: auto;
  }
  /* Gli scatti in piu', su una riga a sé sotto al collage. Stessa griglia
     della riga sopra — 1.45fr e 1fr — così le due larghezze sulla pagina
     restano due e non quattro: il quarto scatto prende quella dello scatto
     grande, il quinto quella dei due laterali. La proporzione la eredita
     dalla regola generale, 13/9, la stessa dei file 1500×1038. */
  .a971-rb__rec-extra {
    display: grid;
    grid-template-columns: 1.45fr 1fr;
    gap: 1.6rem;
    margin-top: 1.6rem;
    /* Ogni scheda alta quanto la sua foto. Di suo la griglia le pareggia
       all'altezza della piu' alta, e sotto la seconda restavano 149px di
       crema vuota: una cornice piu' lunga della fotografia che contiene. */
    align-items: start;
  }
  .a971-rb__rec-cit {
    flex: 1;
    display: flex;
    flex-direction: column;
    margin: 0;
    position: relative;
    padding: 1.6rem 2rem 1.4rem 5.4rem;
    background: var(--a971-crema);
    border: 1px solid color-mix(in srgb, var(--a971-oro) 26%, transparent);
    border-radius: 14px;
    font-style: normal; /* Dawn styles blockquotes italic */
  }
  .a971-rb__rec-cit::before {
    content: '\201C';
    position: absolute;
    left: 1.6rem;
    top: 0.6rem;
    font-family: var(--a971-serif);
    font-size: 5.4rem;
    line-height: 1;
    color: var(--a971-oro);
  }
  .a971-rb__rec-cit-titolo {
    margin: 0;
    font-family: var(--a971-serif);
    font-weight: 600;
    font-size: 1.9rem;
    line-height: 1.3;
  }
  .a971-rb__rec-cit-testo {
    margin: 0.8rem 0 0;
    font-size: 1.35rem;
    line-height: 1.6;
    color: color-mix(in srgb, var(--a971-oud) 70%, transparent);
  }
  .a971-rb__rec-cit-piede {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 1.2rem;
    border-top: 1px solid color-mix(in srgb, var(--a971-oro) 24%, transparent);
    font-size: 1.25rem;
  }
  .a971-rb__rec-cit-piede strong {
    font-weight: 600;
  }
  .a971-rb__rec-cit-luogo {
    color: color-mix(in srgb, var(--a971-oud) 55%, transparent);
  }
  .a971-rb__rec-cit-ver {
    color: var(--a971-oro);
    font-weight: 500;
  }

  .a971-rb__rec-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.6rem;
    text-align: left;
  }
  .a971-rb__rec-card {
    background: rgba(255, 250, 242, 0.7);
    border: 1px solid color-mix(in srgb, var(--a971-oro) 25%, transparent);
    border-radius: 12px;
    padding: 2.2rem 2.2rem 1.8rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .a971-rb__rec-card .a971-rb__stars { font-size: 1.25rem; }
  .a971-rb__rec-title { font-family: var(--a971-serif); font-size: 1.9rem; font-weight: 500; line-height: 1.2; margin: 0; }
  .a971-rb__rec-text { font-size: 1.3rem; line-height: 1.6; color: color-mix(in srgb, var(--a971-oud) 75%, transparent); flex: 1; margin: 0; }
  .a971-rb__rec-who {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 1.2rem;
    border-top: 1px solid color-mix(in srgb, var(--a971-oud) 8%, transparent);
    font-size: 1.15rem;
  }
  .a971-rb__rec-who b { font-weight: 600; }
  .a971-rb__rec-who small { color: color-mix(in srgb, var(--a971-oud) 55%, transparent); font-size: 1.05rem; }
  .a971-rb__rec-verified { font-size: 1rem; color: var(--a971-oro); font-weight: 600; white-space: nowrap; }

  .a971-rb__faq-list { max-width: 76rem; margin: 3rem auto 0; text-align: left; }
  .a971-rb__faq-list details { border-bottom: 1px solid color-mix(in srgb, var(--a971-oud) 12%, transparent); }
  .a971-rb__faq-list summary {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 2rem;
    padding: 1.9rem 0;
    cursor: pointer;
    list-style: none;
    font-family: var(--a971-serif);
    font-size: 2rem;
    font-weight: 500;
    color: var(--a971-oud);
  }
  .a971-rb__faq-list summary::-webkit-details-marker { display: none; }
  .a971-rb__faq-list summary i {
    font-style: normal;
    color: var(--a971-oro);
    font-size: 2rem;
    font-weight: 300;
    line-height: 1;
    transition: transform 0.3s ease;
    flex: 0 0 auto;
  }
  .a971-rb__faq-list details[open] summary i { transform: rotate(45deg); }
  .a971-rb__faq-a {
    padding: 0 3rem 2rem 0;
    font-size: 1.35rem;
    line-height: 1.65;
    color: color-mix(in srgb, var(--a971-oud) 75%, transparent);
    max-width: 64rem;
  }
  @media (prefers-reduced-motion: reduce) {
    .a971-rb__faq-list summary i { transition: none; }
  }

  /* Availability strip above the CTA — crema band, hairlines, slow gold dot */
  .a971-rb__lowstock {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.6rem;
    margin: 1.8rem 0 1.4rem;
    padding: 1.4rem 1.6rem;
    border-top: 1px solid rgba(182, 138, 75, 0.28);
    border-bottom: 1px solid rgba(182, 138, 75, 0.28);
    background: rgba(255, 250, 242, 0.5);
  }
  .a971-rb__lowstock-left { display: inline-flex; align-items: center; gap: 1rem; }
  .a971-rb__lowstock-dot {
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--a971-oro);
    animation: a971-stock-pulse 2.4s ease-in-out infinite;
  }
  /* stesso rosso del puntino nella barra sticky: sono lo stesso dato */
  .a971-rb__lowstock-dot.is-agli-sgoccioli { background: var(--a971-scorta-rossa); }
  @keyframes a971-stock-pulse {
    0%, 100% { opacity: 0.45; transform: scale(0.9); }
    50% { opacity: 1; transform: scale(1); }
  }
  .a971-rb__lowstock-label {
    font-size: 1.1rem;
    font-weight: 500;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #8F6937;
  }
  .a971-rb__lowstock-msg {
    font-family: var(--a971-serif);
    font-size: 1.8rem;
    color: var(--a971-oud);
    text-align: right;
  }
  /* Quiet state outside the scarcity window: artisan reassurance */
  .a971-rb__lowstock--ok {
    background: transparent;
    border-top-color: color-mix(in srgb, var(--a971-oud) 10%, transparent);
    border-bottom-color: color-mix(in srgb, var(--a971-oud) 10%, transparent);
    padding: 1.1rem 0.2rem;
  }
  .a971-rb__lowstock-dot--ok {
    background: #6B8060;
    animation: none;
  }
  .a971-rb__lowstock-label--ok { color: color-mix(in srgb, var(--a971-oud) 70%, transparent); }
  .a971-rb__lowstock-msg--ok {
    font-family: var(--a971-sans);
    font-size: 1.3rem;
    color: color-mix(in srgb, var(--a971-oud) 65%, transparent);
  }
  .a971-rb__lowstock-msg b {
    font-family: var(--a971-num);
    font-size: 1.5rem;
    font-weight: 700;
  }
  @media (prefers-reduced-motion: reduce) {
    .a971-rb__lowstock-dot { animation: none; }
  }

  @media (max-width: 989px) {
    .a971-rb { padding: 2rem 0 4rem; }
    .a971-rb__grid { grid-template-columns: 1fr; gap: 3.2rem; }
    .a971-rb__gallery {
      position: static;
      grid-template-columns: minmax(0, 1fr);
      gap: 1rem;
    }
    .a971-rb__thumb { flex-basis: 6.4rem; }
    .a971-rb__garanzie {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 2rem;
      margin-top: 3.2rem;
      padding-top: 2.4rem;
    }
  }

  @media (max-width: 989px) and (min-width: 750px) {
    .a971-rb__gesti-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .a971-rb__conf-tab { --c1: 44%; --c2: 31%; --c3: 25%; }
  }
  /* Collapses at 989 and not at 749: side by side on a tablet the two small
     shots drop to 259px and would have to lose 17% of their width to fill the
     height. Stacked they stay full width. */
  @media (max-width: 989px) {
    .a971-rb__rec-foto { grid-template-columns: 1fr; gap: 1.2rem; }
    /* Sul telefono una per riga, a tutta larghezza, esattamente come gli
       altri tre scatti: affiancate erano larghe la meta' degli altri e
       stonavano in mezzo a una colonna di foto tutte a tutta pagina. */
    .a971-rb__rec-extra { grid-template-columns: 1fr; gap: 1.2rem; margin-top: 1.2rem; }
    /* One column: keep the order it had before the quote moved under the
       family shot — foto, foto, citazione. display:contents dissolves the
       left wrapper so all four become siblings the grid can reorder. */
    .a971-rb__rec-principale { display: contents; }
    .a971-rb__rec-cit { order: 2; }
    /* No height to share down here: back to their own proportions */
    .a971-rb__rec-colonna {
      order: 1;
      gap: 1.2rem;
      grid-auto-flow: column;
      grid-auto-columns: 1fr;
      grid-auto-rows: auto;
    }
    .a971-rb__rec-colonna .a971-rb__rec-scatto { display: block; }
    .a971-rb__rec-colonna .a971-rb__rec-scatto img { height: auto; aspect-ratio: 13 / 9; }
  }

  @media (max-width: 749px) {
    .a971-rb__rec-grid { grid-template-columns: 1fr; }
    /* On a phone side by side would leave them 170px wide, where you can no
       longer make out a face */
    .a971-rb__rec-colonna { grid-auto-flow: row; }
    /* The guarantee tiles repeat what benefits, recap and boutique row
       already say — on mobile they only stretch the page */
    .a971-rb__garanzie { display: none; }
    /* ——— Closing purchase block, mobile: editorial luxury hierarchy ——— */
    /* 1. price: serif like the titles, huge, no chrome */
    .a971-rb__recap { margin-bottom: 3rem; }
    .a971-rb__pricing { padding-top: 1.6rem; gap: 1.8rem; }
    .a971-rb__price {
      font-family: var(--a971-serif);
      font-variant-numeric: lining-nums;
      font-weight: 500;
      font-size: clamp(5.8rem, 17vw, 7.6rem);
      line-height: 0.95;
      letter-spacing: 0;
    }
    /* 2. value row: struck figure, thin gold divider, serif saving — no pill */
    .a971-rb__compare { justify-content: flex-start; gap: 1.4rem; font-size: 1.5rem; }
    .a971-rb__compare-val { color: color-mix(in srgb, var(--a971-oud) 55%, transparent); }
    .a971-rb__compare-div {
      display: block;
      width: 1px;
      height: 1.5rem;
      background: color-mix(in srgb, var(--a971-oro) 55%, transparent);
    }
    .a971-rb__compare-pill {
      background: none;
      border: 0;
      padding: 0;
      border-radius: 0;
      font-family: var(--a971-serif);
      font-variant-numeric: lining-nums;
      font-size: 1.6rem;
      font-weight: 600;
      letter-spacing: 0.01em;
      color: var(--a971-verde);
    }
    /* 3. instalments */
    .a971-rb__paynote { margin-top: 2rem; font-size: 1.5rem; }
    /* 4. availability: quiet two-column card */
    .a971-rb__lowstock {
      margin: 2.8rem 0 0;
      display: grid;
      grid-template-columns: 42% 1fr;
      align-items: center;
      gap: 0;
      background: var(--a971-crema);
      border: 1px solid color-mix(in srgb, var(--a971-oro) 28%, transparent);
      border-radius: 14px;
      padding: 2rem;
    }
    .a971-rb__lowstock-dot { width: 8px; height: 8px; }
    .a971-rb__lowstock-label { letter-spacing: 0.14em; }
    .a971-rb__lowstock-msg {
      font-size: 1.6rem;
      text-align: left;
      padding-left: 1.8rem;
      border-left: 1px solid color-mix(in srgb, var(--a971-oro) 30%, transparent);
    }
    .a971-rb__lowstock--ok { background: transparent; border: 0; border-radius: 0; padding: 1.1rem 0.2rem; display: flex; }
    .a971-rb__lowstock--ok .a971-rb__lowstock-msg { border-left: 0; padding-left: 0; }
    /* 5. progress: label + 2px bar */
    .a971-rb__stato { margin: 2.8rem 0 0; }
    .a971-rb__stato-bar {
      display: block;
      height: 2px;
      margin-top: 1rem;
      border-radius: 2px;
      background: color-mix(in srgb, var(--a971-oro) 22%, transparent);
      overflow: hidden;
    }
    .a971-rb__stato-bar span {
      position: relative;
      display: block;
      height: 100%;
      width: 0;
      overflow: hidden;
      background: var(--a971-oro);
      transition: width 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
    }
    /* 6. CTA */
    .a971-rb__cta {
      min-height: 5.8rem;
      margin-top: 2.2rem;
      border-radius: 12px;
      letter-spacing: 0.11em;
    }
    .a971-rb__cta:active { filter: brightness(0.95); }
    /* 7. reassurances: 2 + 1 grid */
    .a971-rb__badges {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1.2rem 1rem;
      margin-top: 2.4rem;
      padding-bottom: 0.8rem;
      font-size: 1.4rem;
      opacity: 0.85;
    }
    .a971-rb__badges li:last-child { grid-column: 1 / -1; }
    .a971-rb__badge-icon svg { width: 2rem; height: 2rem; }
  }
  @media (max-width: 369px) {
    .a971-rb__compare { font-size: 1.35rem; gap: 1rem; }
    .a971-rb__compare-pill { font-size: 1.45rem; }
    .a971-rb__badges { grid-template-columns: 1fr; gap: 1rem; }
    .a971-rb__lowstock { grid-template-columns: 1fr; gap: 1.2rem; padding: 1.8rem; }
    .a971-rb__lowstock-msg { border-left: 0; padding-left: 0; }
  }
  @media (max-width: 749px) {
    .a971-rb__sect-title { font-size: 2.6rem; }
    .a971-rb__rec, .a971-rb__faq, .a971-rb__gesti, .a971-rb__conf { margin-top: 5rem; }
    /* Gesti: swipe carousel with pill nav, counter and dots */
    .a971-rb__gesti-nav {
      display: flex;
      gap: 0.8rem;
      overflow-x: auto;
      scrollbar-width: none;
      margin-top: 2.8rem;
      padding-bottom: 0.4rem;
    }
    .a971-rb__gesti-nav::-webkit-scrollbar { display: none; }
    .a971-rb__gesti-pill {
      flex: 0 0 auto;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0.2rem;
      min-width: 7rem;
      padding: 1rem 1.4rem;
      background: transparent;
      border: 1px solid color-mix(in srgb, var(--a971-oud) 16%, transparent);
      border-radius: 12px;
      font-family: var(--a971-sans);
      font-size: 1.45rem;
      color: var(--a971-oud);
      cursor: pointer;
    }
    .a971-rb__gesti-pill-n {
      font-family: var(--a971-num);
      font-size: 1.05rem;
      font-weight: 600;
      letter-spacing: 0.18em;
      color: color-mix(in srgb, var(--a971-oud) 45%, transparent);
    }
    .a971-rb__gesti-pill.is-attivo { background: var(--a971-oro); border-color: var(--a971-oro); color: #fff; }
    .a971-rb__gesti-pill.is-attivo .a971-rb__gesti-pill-n { color: rgba(255, 255, 255, 0.75); }
    .a971-rb__gesti-grid {
      display: flex;
      gap: 1.2rem;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      scrollbar-width: none;
      margin-top: 1.6rem;
    }
    .a971-rb__gesti-grid::-webkit-scrollbar { display: none; }
    .a971-rb__gesto {
      flex: 0 0 100%;
      scroll-snap-align: center;
      padding: 3.2rem 2rem 2.6rem;
    }
    .a971-rb__gesto-count {
      display: inline-block;
      margin-top: 0.6rem;
      font-family: var(--a971-num);
      font-size: 1.15rem;
      font-weight: 600;
      color: color-mix(in srgb, var(--a971-oud) 55%, transparent);
      background: color-mix(in srgb, var(--a971-oud) 7%, transparent);
      border-radius: 999px;
      padding: 0.4rem 1.2rem;
    }
    .a971-rb__gesti-piede { display: block; margin-top: 1.8rem; }
    .a971-rb__gesti-hint {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0.8rem;
      margin: 0;
      font-family: var(--a971-serif);
      font-size: 1.5rem;
      color: color-mix(in srgb, var(--a971-oud) 72%, transparent);
    }
    .a971-rb__gesti-hint svg { width: 2rem; height: 2rem; flex: 0 0 auto; }
    .a971-rb__gesti-dots { display: flex; justify-content: center; gap: 0.7rem; margin-top: 1.2rem; }
    .a971-rb__gesti-dots span {
      width: 0.7rem;
      height: 0.7rem;
      border-radius: 50%;
      background: color-mix(in srgb, var(--a971-oud) 18%, transparent);
    }
    .a971-rb__gesti-dots span.is-attivo { background: var(--a971-oro); }

    /* Confronto: compact synthesis — the floating card becomes a light wash */
    .a971-rb__conf-tab { --c1: 41%; --c2: 34%; --c3: 25%; margin-top: 3.4rem; }
    .a971-rb__conf-tab > .a971-rb__conf-card { display: none; }
    .a971-rb__conf-badge { font-size: 0.9rem; letter-spacing: 0.16em; padding: 0.55rem 1.1rem; top: -1.4rem; }
    .a971-rb__conf-rit,
    .a971-rb__conf-row--head .a971-rb__conf-rit {
      background: color-mix(in srgb, var(--a971-oro) 7%, transparent);
      border-left: 1px solid color-mix(in srgb, var(--a971-oro) 25%, transparent);
      border-right: 1px solid color-mix(in srgb, var(--a971-oro) 25%, transparent);
    }
    .a971-rb__conf-row > span { padding: 1.2rem 1rem; }
    .a971-rb__conf-feat { gap: 0.7rem; }
    .a971-rb__conf-feat-txt { font-size: 1.6rem; }
    /* short variants replace text + sub; subs never show on mobile */
    .has-breve .a971-rb__conf-lungo { display: none; }
    .has-breve .a971-rb__conf-breve { display: block; }
    .a971-rb__conf-feat-txt small, .a971-rb__conf-rit-txt small, .a971-rb__conf-alt-txt small { display: none; }
    .a971-rb__conf-rit { padding-left: 1rem; gap: 0.8rem; }
    .a971-rb__conf-check { width: 1.6rem; height: 1.6rem; }
    .a971-rb__conf-rit-txt { font-family: var(--a971-sans); font-size: 1.4rem; font-weight: 600; }
    .a971-rb__conf-alt-txt { font-family: var(--a971-sans); font-size: 1.3rem; font-weight: 500; }
    .a971-rb__conf-row--head .a971-rb__conf-rit { font-size: 1.6rem; padding: 1.4rem 0.6rem 1rem; gap: 0.5rem; }
    .a971-rb__conf-row--head .a971-rb__conf-feat, .a971-rb__conf-row--head .a971-rb__conf-alt { font-size: 0.9rem; letter-spacing: 0.12em; }
    .a971-rb__conf-ic { display: none; }
    .a971-rb__conf-nota {
      display: block;
      margin: 1.4rem auto 0;
      font-size: 1.25rem;
      color: color-mix(in srgb, var(--a971-oud) 55%, transparent);
    }
    .a971-rb__valore { padding: 2.6rem 1.8rem 2.4rem; }
    .a971-rb__valore-titolo { font-size: 2.7rem; }
    .a971-rb__valore-col { padding: 0 1rem; }
    .a971-rb__valore-barrato { font-size: 2.2rem; }
    .a971-rb__valore-prezzo { font-size: 4.6rem; }
    .a971-rb__valore-scintilla { display: none; }
    .a971-rb__valore-risp { width: 100%; }
    .a971-rb__valore-elementi { grid-template-columns: repeat(3, 1fr); row-gap: 2rem; }
    .a971-rb__valore-el:nth-child(3n + 1) { border-left: none; }
    .a971-rb__vet-top { gap: 1.2rem; min-height: 0; }
    .a971-rb__vet-img { width: 8.4rem; }
    .a971-rb__vet-nome { font-size: 2.4rem; }
    .a971-rb__vet-note { font-size: 1.2rem; }
    .a971-rb__step--fascia { margin-bottom: 3.2rem; }
    .a971-rb__scena { max-width: 24rem; }
    .a971-rb__ogg-palco { width: 9.6rem; min-height: 12rem; }
    .a971-rb__vet--larga .a971-rb__ogg-palco { width: 14rem; }
    .a971-rb__vet--ogg .a971-rb__vet-nome { font-size: 2.2rem; }
    .a971-rb__garanzie { grid-template-columns: 1fr; }
    /* The dialog becomes a bottom sheet */
    .a971-rb__modal { padding: 0; place-items: end stretch; }
    .a971-rb__modal-dialog {
      width: 100%;
      max-height: 94dvh;
      border-radius: 14px 14px 0 0;
      padding: 2.4rem 2rem calc(2.8rem + env(safe-area-inset-bottom));
      transform: translateY(100%);
    }
    .a971-rb__modal.is-open .a971-rb__modal-dialog { transform: none; }
  }

  @media (prefers-reduced-motion: reduce) {
    .a971-rb__thumb,
    .a971-rb__ess-card,
    .a971-rb__ess-cta,
    .a971-rb__inc-field,
    .a971-rb__inc-open,
    .a971-rb__modal-backdrop,
    .a971-rb__stickybar-bar > span,
    .a971-rb__stato-bar span,
    .a971-rb__modal-dialog { transition: none; }
    /* the halo still marks the step, it just does not fade */
    .a971-rb__step.is-mira { animation: none; }
    /* and no gleam running along the progress or the buttons */
    .a971-rb__stickybar-bar > span::after,
    .a971-rb__stato-bar > span::after,
    .a971-rb__cta::after,
    .a971-rb__stickybar-btn::after { animation: none; opacity: 0; }
  }