/* Tema Lola: CSS compilato da wordpress/strumenti/compila_css.py. Non modificare a mano: modifica le parti e ricompila. */
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: "Switzer", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
    monospace;
    --color-white: #fff;
    --spacing: 0.25rem;
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --tracking-normal: 0em;
    --leading-tight: 1.25;
    --leading-snug: 1.375;
    --leading-relaxed: 1.625;
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --blur-md: 12px;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-prugna: #3B1730;
    --color-buganvillea: #B3245E;
    --color-rosa: #EDBFBE;
    --color-cipria: #FBEFEE;
    --color-ionio: #0F5C6B;
    --color-oro: #B8924A;
    --font-display: "Boska", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'Noto Sans', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji');
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring:where(:not(iframe)) {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol, ul, menu {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type='button'], [type='reset'], [type='submit']), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden='until-found'])) {
    display: none !important;
  }
}
@layer utilities {
  .pointer-events-auto {
    pointer-events: auto;
  }
  .pointer-events-none {
    pointer-events: none;
  }
  .visible {
    visibility: visible;
  }
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .sticky {
    position: sticky;
  }
  .inset-0 {
    inset: 0px;
  }
  .inset-x-0 {
    inset-inline: 0px;
  }
  .-top-2 {
    top: calc(var(--spacing) * -2);
  }
  .top-0 {
    top: 0px;
  }
  .top-0\.5 {
    top: calc(var(--spacing) * 0.5);
  }
  .top-1\/2 {
    top: calc(1 / 2 * 100%);
  }
  .top-3 {
    top: calc(var(--spacing) * 3);
  }
  .top-4 {
    top: calc(var(--spacing) * 4);
  }
  .top-\[68px\] {
    top: 68px;
  }
  .-right-2 {
    right: calc(var(--spacing) * -2);
  }
  .right-0\.5 {
    right: calc(var(--spacing) * 0.5);
  }
  .right-4 {
    right: calc(var(--spacing) * 4);
  }
  .bottom-0 {
    bottom: 0px;
  }
  .bottom-5 {
    bottom: calc(var(--spacing) * 5);
  }
  .left-1\/2 {
    left: calc(1 / 2 * 100%);
  }
  .left-3 {
    left: calc(var(--spacing) * 3);
  }
  .left-4 {
    left: calc(var(--spacing) * 4);
  }
  .z-10 {
    z-index: 10;
  }
  .z-30 {
    z-index: 30;
  }
  .z-40 {
    z-index: 40;
  }
  .z-\[90\] {
    z-index: 90;
  }
  .col-span-2 {
    grid-column: span 2 / span 2;
  }
  .col-span-4 {
    grid-column: span 4 / span 4;
  }
  .col-span-6 {
    grid-column: span 6 / span 6;
  }
  .float-left {
    float: left;
  }
  .clear-both {
    clear: both;
  }
  .m-0 {
    margin: 0px;
  }
  .-mx-5 {
    margin-inline: calc(var(--spacing) * -5);
  }
  .mx-auto {
    margin-inline: auto;
  }
  .-mt-\[78px\] {
    margin-top: calc(78px * -1);
  }
  .mt-0\.5 {
    margin-top: calc(var(--spacing) * 0.5);
  }
  .mt-1 {
    margin-top: var(--spacing);
  }
  .mt-1\.5 {
    margin-top: calc(var(--spacing) * 1.5);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-2\.5 {
    margin-top: calc(var(--spacing) * 2.5);
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .mt-3\.5 {
    margin-top: calc(var(--spacing) * 3.5);
  }
  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .mt-5 {
    margin-top: calc(var(--spacing) * 5);
  }
  .mt-6 {
    margin-top: calc(var(--spacing) * 6);
  }
  .mt-7 {
    margin-top: calc(var(--spacing) * 7);
  }
  .mt-8 {
    margin-top: calc(var(--spacing) * 8);
  }
  .mt-9 {
    margin-top: calc(var(--spacing) * 9);
  }
  .mt-10 {
    margin-top: calc(var(--spacing) * 10);
  }
  .mt-12 {
    margin-top: calc(var(--spacing) * 12);
  }
  .mt-14 {
    margin-top: calc(var(--spacing) * 14);
  }
  .mt-20 {
    margin-top: calc(var(--spacing) * 20);
  }
  .mt-24 {
    margin-top: calc(var(--spacing) * 24);
  }
  .mt-\[34\%\] {
    margin-top: 34%;
  }
  .mt-auto {
    margin-top: auto;
  }
  .-mr-2 {
    margin-right: calc(var(--spacing) * -2);
  }
  .mr-2 {
    margin-right: calc(var(--spacing) * 2);
  }
  .mr-auto {
    margin-right: auto;
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .mb-8 {
    margin-bottom: calc(var(--spacing) * 8);
  }
  .-ml-2 {
    margin-left: calc(var(--spacing) * -2);
  }
  .-ml-\[14\%\] {
    margin-left: calc(14% * -1);
  }
  .ml-1 {
    margin-left: var(--spacing);
  }
  .ml-auto {
    margin-left: auto;
  }
  .block {
    display: block;
  }
  .contents {
    display: contents;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline-block {
    display: inline-block;
  }
  .inline-flex {
    display: inline-flex;
  }
  .aspect-\[4\/3\] {
    aspect-ratio: 4/3;
  }
  .aspect-\[4\/5\] {
    aspect-ratio: 4/5;
  }
  .aspect-\[16\/9\] {
    aspect-ratio: 16/9;
  }
  .aspect-square {
    aspect-ratio: 1 / 1;
  }
  .h-1\.5 {
    height: calc(var(--spacing) * 1.5);
  }
  .h-2 {
    height: calc(var(--spacing) * 2);
  }
  .h-2\.5 {
    height: calc(var(--spacing) * 2.5);
  }
  .h-8 {
    height: calc(var(--spacing) * 8);
  }
  .h-9 {
    height: calc(var(--spacing) * 9);
  }
  .h-10 {
    height: calc(var(--spacing) * 10);
  }
  .h-11 {
    height: calc(var(--spacing) * 11);
  }
  .h-12 {
    height: calc(var(--spacing) * 12);
  }
  .h-16 {
    height: calc(var(--spacing) * 16);
  }
  .h-20 {
    height: calc(var(--spacing) * 20);
  }
  .h-24 {
    height: calc(var(--spacing) * 24);
  }
  .h-\[18px\] {
    height: 18px;
  }
  .h-\[22px\] {
    height: 22px;
  }
  .h-\[56px\] {
    height: 56px;
  }
  .h-\[68px\] {
    height: 68px;
  }
  .h-auto {
    height: auto;
  }
  .h-full {
    height: 100%;
  }
  .max-h-\[560px\] {
    max-height: 560px;
  }
  .max-h-full {
    max-height: 100%;
  }
  .max-h-none {
    max-height: none;
  }
  .min-h-0 {
    min-height: 0px;
  }
  .min-h-\[60vh\] {
    min-height: 60vh;
  }
  .w-2 {
    width: calc(var(--spacing) * 2);
  }
  .w-2\.5 {
    width: calc(var(--spacing) * 2.5);
  }
  .w-8 {
    width: calc(var(--spacing) * 8);
  }
  .w-9 {
    width: calc(var(--spacing) * 9);
  }
  .w-10 {
    width: calc(var(--spacing) * 10);
  }
  .w-11 {
    width: calc(var(--spacing) * 11);
  }
  .w-12 {
    width: calc(var(--spacing) * 12);
  }
  .w-16 {
    width: calc(var(--spacing) * 16);
  }
  .w-20 {
    width: calc(var(--spacing) * 20);
  }
  .w-24 {
    width: calc(var(--spacing) * 24);
  }
  .w-\[18px\] {
    width: 18px;
  }
  .w-\[46\%\] {
    width: 46%;
  }
  .w-\[62\%\] {
    width: 62%;
  }
  .w-\[68px\] {
    width: 68px;
  }
  .w-\[76vw\] {
    width: 76vw;
  }
  .w-\[78px\] {
    width: 78px;
  }
  .w-\[240px\] {
    width: 240px;
  }
  .w-auto {
    width: auto;
  }
  .w-full {
    width: 100%;
  }
  .max-w-\[9ch\] {
    max-width: 9ch;
  }
  .max-w-\[14ch\] {
    max-width: 14ch;
  }
  .max-w-\[15ch\] {
    max-width: 15ch;
  }
  .max-w-\[16ch\] {
    max-width: 16ch;
  }
  .max-w-\[17ch\] {
    max-width: 17ch;
  }
  .max-w-\[18ch\] {
    max-width: 18ch;
  }
  .max-w-\[20ch\] {
    max-width: 20ch;
  }
  .max-w-\[26ch\] {
    max-width: 26ch;
  }
  .max-w-\[34ch\] {
    max-width: 34ch;
  }
  .max-w-\[36ch\] {
    max-width: 36ch;
  }
  .max-w-\[40ch\] {
    max-width: 40ch;
  }
  .max-w-\[42vw\] {
    max-width: 42vw;
  }
  .max-w-\[44ch\] {
    max-width: 44ch;
  }
  .max-w-\[46ch\] {
    max-width: 46ch;
  }
  .max-w-\[48ch\] {
    max-width: 48ch;
  }
  .max-w-\[52ch\] {
    max-width: 52ch;
  }
  .max-w-\[56ch\] {
    max-width: 56ch;
  }
  .max-w-\[58ch\] {
    max-width: 58ch;
  }
  .max-w-\[60ch\] {
    max-width: 60ch;
  }
  .max-w-\[64ch\] {
    max-width: 64ch;
  }
  .max-w-\[72ch\] {
    max-width: 72ch;
  }
  .max-w-\[280px\] {
    max-width: 280px;
  }
  .max-w-\[340px\] {
    max-width: 340px;
  }
  .max-w-\[420px\] {
    max-width: 420px;
  }
  .max-w-\[440px\] {
    max-width: 440px;
  }
  .max-w-\[460px\] {
    max-width: 460px;
  }
  .max-w-\[480px\] {
    max-width: 480px;
  }
  .max-w-\[520px\] {
    max-width: 520px;
  }
  .max-w-\[680px\] {
    max-width: 680px;
  }
  .max-w-\[760px\] {
    max-width: 760px;
  }
  .max-w-\[1000px\] {
    max-width: 1000px;
  }
  .max-w-full {
    max-width: 100%;
  }
  .max-w-none {
    max-width: none;
  }
  .min-w-0 {
    min-width: 0px;
  }
  .min-w-\[18px\] {
    min-width: 18px;
  }
  .min-w-\[22px\] {
    min-width: 22px;
  }
  .min-w-\[520px\] {
    min-width: 520px;
  }
  .min-w-\[640px\] {
    min-width: 640px;
  }
  .flex-1 {
    flex: 1;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .-translate-x-1\/2 {
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-y-1\/2 {
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .rotate-180 {
    rotate: 180deg;
  }
  .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .resize {
    resize: both;
  }
  .snap-x {
    scroll-snap-type: x var(--tw-scroll-snap-strictness);
  }
  .snap-start {
    scroll-snap-align: start;
  }
  .list-disc {
    list-style-type: disc;
  }
  .list-none {
    list-style-type: none;
  }
  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .grid-cols-\[1fr_auto_1fr\] {
    grid-template-columns: 1fr auto 1fr;
  }
  .grid-cols-\[7\.5rem_1fr\] {
    grid-template-columns: 7.5rem 1fr;
  }
  .grid-cols-\[minmax\(0\,9\.5rem\)_1fr\] {
    grid-template-columns: minmax(0,9.5rem) 1fr;
  }
  .flex-col {
    flex-direction: column;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .content-center {
    align-content: center;
  }
  .content-start {
    align-content: flex-start;
  }
  .items-baseline {
    align-items: baseline;
  }
  .items-center {
    align-items: center;
  }
  .items-end {
    align-items: flex-end;
  }
  .items-start {
    align-items: flex-start;
  }
  .justify-between {
    justify-content: space-between;
  }
  .justify-center {
    justify-content: center;
  }
  .justify-end {
    justify-content: flex-end;
  }
  .justify-items-center {
    justify-items: center;
  }
  .justify-items-start {
    justify-items: start;
  }
  .gap-1 {
    gap: var(--spacing);
  }
  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5);
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .gap-2\.5 {
    gap: calc(var(--spacing) * 2.5);
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .gap-5 {
    gap: calc(var(--spacing) * 5);
  }
  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }
  .gap-8 {
    gap: calc(var(--spacing) * 8);
  }
  .gap-10 {
    gap: calc(var(--spacing) * 10);
  }
  .gap-12 {
    gap: calc(var(--spacing) * 12);
  }
  .gap-14 {
    gap: calc(var(--spacing) * 14);
  }
  :where(.space-y-1\.5 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-2 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-2\.5 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-3 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-4 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-5 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-11 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 11) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 11) * calc(1 - var(--tw-space-y-reverse)));
  }
  .gap-x-2 {
    column-gap: calc(var(--spacing) * 2);
  }
  .gap-x-4 {
    column-gap: calc(var(--spacing) * 4);
  }
  .gap-x-5 {
    column-gap: calc(var(--spacing) * 5);
  }
  .gap-x-6 {
    column-gap: calc(var(--spacing) * 6);
  }
  .gap-x-8 {
    column-gap: calc(var(--spacing) * 8);
  }
  .gap-x-16 {
    column-gap: calc(var(--spacing) * 16);
  }
  .gap-y-1 {
    row-gap: var(--spacing);
  }
  .gap-y-2 {
    row-gap: calc(var(--spacing) * 2);
  }
  .gap-y-3 {
    row-gap: calc(var(--spacing) * 3);
  }
  .gap-y-4 {
    row-gap: calc(var(--spacing) * 4);
  }
  .gap-y-5 {
    row-gap: calc(var(--spacing) * 5);
  }
  .gap-y-10 {
    row-gap: calc(var(--spacing) * 10);
  }
  .gap-y-14 {
    row-gap: calc(var(--spacing) * 14);
  }
  :where(.divide-y > :not(:last-child)) {
    --tw-divide-y-reverse: 0;
    border-bottom-style: var(--tw-border-style);
    border-top-style: var(--tw-border-style);
    border-top-width: calc(1px * var(--tw-divide-y-reverse));
    border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  }
  :where(.divide-prugna\/10 > :not(:last-child)) {
    border-color: color-mix(in srgb, #3B1730 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 10%, transparent);
    }
  }
  :where(.divide-prugna\/15 > :not(:last-child)) {
    border-color: color-mix(in srgb, #3B1730 15%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 15%, transparent);
    }
  }
  :where(.divide-prugna\/25 > :not(:last-child)) {
    border-color: color-mix(in srgb, #3B1730 25%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 25%, transparent);
    }
  }
  .self-end {
    align-self: flex-end;
  }
  .self-start {
    align-self: flex-start;
  }
  .justify-self-center {
    justify-self: center;
  }
  .justify-self-end {
    justify-self: flex-end;
  }
  .truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .overflow-auto {
    overflow: auto;
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .overflow-x-auto {
    overflow-x: auto;
  }
  .overflow-y-auto {
    overflow-y: auto;
  }
  .rounded-\[12px\] {
    border-radius: 12px;
  }
  .rounded-\[14px\] {
    border-radius: 14px;
  }
  .rounded-\[20px\] {
    border-radius: 20px;
  }
  .rounded-\[22px\] {
    border-radius: 22px;
  }
  .rounded-\[28px\] {
    border-radius: 28px;
  }
  .rounded-\[32px\] {
    border-radius: 32px;
  }
  .rounded-\[40px\] {
    border-radius: 40px;
  }
  .rounded-full {
    border-radius: calc(infinity * 1px);
  }
  .rounded-t-full {
    border-top-left-radius: calc(infinity * 1px);
    border-top-right-radius: calc(infinity * 1px);
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-2 {
    border-style: var(--tw-border-style);
    border-width: 2px;
  }
  .border-\[6px\] {
    border-style: var(--tw-border-style);
    border-width: 6px;
  }
  .border-y {
    border-block-style: var(--tw-border-style);
    border-block-width: 1px;
  }
  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .border-accento {
    border-color: var(--accento);
  }
  .border-prugna\/10 {
    border-color: color-mix(in srgb, #3B1730 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 10%, transparent);
    }
  }
  .border-prugna\/12 {
    border-color: color-mix(in srgb, #3B1730 12%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 12%, transparent);
    }
  }
  .border-prugna\/15 {
    border-color: color-mix(in srgb, #3B1730 15%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 15%, transparent);
    }
  }
  .border-prugna\/18 {
    border-color: color-mix(in srgb, #3B1730 18%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 18%, transparent);
    }
  }
  .border-prugna\/20 {
    border-color: color-mix(in srgb, #3B1730 20%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 20%, transparent);
    }
  }
  .border-prugna\/25 {
    border-color: color-mix(in srgb, #3B1730 25%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 25%, transparent);
    }
  }
  .border-prugna\/28 {
    border-color: color-mix(in srgb, #3B1730 28%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 28%, transparent);
    }
  }
  .border-prugna\/30 {
    border-color: color-mix(in srgb, #3B1730 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 30%, transparent);
    }
  }
  .border-rosa {
    border-color: var(--color-rosa);
  }
  .border-transparent {
    border-color: transparent;
  }
  .border-white {
    border-color: var(--color-white);
  }
  .bg-\[\#2F8F5B\] {
    background-color: #2F8F5B;
  }
  .bg-accento {
    background-color: var(--accento);
  }
  .bg-cipria {
    background-color: var(--color-cipria);
  }
  .bg-cipria\/40 {
    background-color: color-mix(in srgb, #FBEFEE 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-cipria) 40%, transparent);
    }
  }
  .bg-cipria\/50 {
    background-color: color-mix(in srgb, #FBEFEE 50%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-cipria) 50%, transparent);
    }
  }
  .bg-ionio {
    background-color: var(--color-ionio);
  }
  .bg-prugna {
    background-color: var(--color-prugna);
  }
  .bg-prugna\/40 {
    background-color: color-mix(in srgb, #3B1730 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-prugna) 40%, transparent);
    }
  }
  .bg-rosa {
    background-color: var(--color-rosa);
  }
  .bg-tenue {
    background-color: var(--tenue);
  }
  .bg-white {
    background-color: var(--color-white);
  }
  .bg-white\/90 {
    background-color: color-mix(in srgb, #fff 90%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-white) 90%, transparent);
    }
  }
  .bg-white\/95 {
    background-color: color-mix(in srgb, #fff 95%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-white) 95%, transparent);
    }
  }
  .object-contain {
    object-fit: contain;
  }
  .object-cover {
    object-fit: cover;
  }
  .p-0 {
    padding: 0px;
  }
  .p-0\.5 {
    padding: calc(var(--spacing) * 0.5);
  }
  .p-2 {
    padding: calc(var(--spacing) * 2);
  }
  .p-4 {
    padding: calc(var(--spacing) * 4);
  }
  .p-5 {
    padding: calc(var(--spacing) * 5);
  }
  .p-6 {
    padding: calc(var(--spacing) * 6);
  }
  .p-7 {
    padding: calc(var(--spacing) * 7);
  }
  .px-1 {
    padding-inline: var(--spacing);
  }
  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }
  .px-2\.5 {
    padding-inline: calc(var(--spacing) * 2.5);
  }
  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }
  .px-3\.5 {
    padding-inline: calc(var(--spacing) * 3.5);
  }
  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }
  .px-5 {
    padding-inline: calc(var(--spacing) * 5);
  }
  .px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }
  .px-14 {
    padding-inline: calc(var(--spacing) * 14);
  }
  .py-0\.5 {
    padding-block: calc(var(--spacing) * 0.5);
  }
  .py-1 {
    padding-block: var(--spacing);
  }
  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5);
  }
  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }
  .py-2\.5 {
    padding-block: calc(var(--spacing) * 2.5);
  }
  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }
  .py-3\.5 {
    padding-block: calc(var(--spacing) * 3.5);
  }
  .py-4 {
    padding-block: calc(var(--spacing) * 4);
  }
  .py-5 {
    padding-block: calc(var(--spacing) * 5);
  }
  .py-6 {
    padding-block: calc(var(--spacing) * 6);
  }
  .py-10 {
    padding-block: calc(var(--spacing) * 10);
  }
  .py-16 {
    padding-block: calc(var(--spacing) * 16);
  }
  .py-20 {
    padding-block: calc(var(--spacing) * 20);
  }
  .py-24 {
    padding-block: calc(var(--spacing) * 24);
  }
  .py-\[18px\] {
    padding-block: 18px;
  }
  .pt-0\.5 {
    padding-top: calc(var(--spacing) * 0.5);
  }
  .pt-2 {
    padding-top: calc(var(--spacing) * 2);
  }
  .pt-3 {
    padding-top: calc(var(--spacing) * 3);
  }
  .pt-5 {
    padding-top: calc(var(--spacing) * 5);
  }
  .pt-6 {
    padding-top: calc(var(--spacing) * 6);
  }
  .pt-7 {
    padding-top: calc(var(--spacing) * 7);
  }
  .pt-8 {
    padding-top: calc(var(--spacing) * 8);
  }
  .pt-10 {
    padding-top: calc(var(--spacing) * 10);
  }
  .pt-12 {
    padding-top: calc(var(--spacing) * 12);
  }
  .pt-\[100px\] {
    padding-top: 100px;
  }
  .pr-3 {
    padding-right: calc(var(--spacing) * 3);
  }
  .pr-4 {
    padding-right: calc(var(--spacing) * 4);
  }
  .pb-2 {
    padding-bottom: calc(var(--spacing) * 2);
  }
  .pb-4 {
    padding-bottom: calc(var(--spacing) * 4);
  }
  .pb-6 {
    padding-bottom: calc(var(--spacing) * 6);
  }
  .pb-8 {
    padding-bottom: calc(var(--spacing) * 8);
  }
  .pb-9 {
    padding-bottom: calc(var(--spacing) * 9);
  }
  .pb-10 {
    padding-bottom: calc(var(--spacing) * 10);
  }
  .pb-12 {
    padding-bottom: calc(var(--spacing) * 12);
  }
  .pb-14 {
    padding-bottom: calc(var(--spacing) * 14);
  }
  .pb-20 {
    padding-bottom: calc(var(--spacing) * 20);
  }
  .pb-24 {
    padding-bottom: calc(var(--spacing) * 24);
  }
  .pl-4 {
    padding-left: calc(var(--spacing) * 4);
  }
  .pl-5 {
    padding-left: calc(var(--spacing) * 5);
  }
  .text-center {
    text-align: center;
  }
  .text-left {
    text-align: left;
  }
  .text-right {
    text-align: right;
  }
  .font-sans {
    font-family: var(--font-sans);
  }
  .text-\[1\.2rem\] {
    font-size: 1.2rem;
  }
  .text-\[1\.05rem\] {
    font-size: 1.05rem;
  }
  .text-\[1\.6rem\] {
    font-size: 1.6rem;
  }
  .text-\[1\.7rem\] {
    font-size: 1.7rem;
  }
  .text-\[1\.9rem\] {
    font-size: 1.9rem;
  }
  .text-\[1\.25rem\] {
    font-size: 1.25rem;
  }
  .text-\[1\.65rem\] {
    font-size: 1.65rem;
  }
  .text-\[1\.75rem\] {
    font-size: 1.75rem;
  }
  .text-\[2\.2rem\] {
    font-size: 2.2rem;
  }
  .text-\[2\.3rem\] {
    font-size: 2.3rem;
  }
  .text-\[2\.4rem\] {
    font-size: 2.4rem;
  }
  .text-\[2rem\] {
    font-size: 2rem;
  }
  .text-\[11px\] {
    font-size: 11px;
  }
  .text-\[12px\] {
    font-size: 12px;
  }
  .text-\[13px\] {
    font-size: 13px;
  }
  .text-\[14px\] {
    font-size: 14px;
  }
  .text-\[15px\] {
    font-size: 15px;
  }
  .text-\[16px\] {
    font-size: 16px;
  }
  .text-\[17px\] {
    font-size: 17px;
  }
  .text-\[18px\] {
    font-size: 18px;
  }
  .text-\[22px\] {
    font-size: 22px;
  }
  .text-\[clamp\(1\.1rem\,1\.8vw\,1\.7rem\)\] {
    font-size: clamp(1.1rem, 1.8vw, 1.7rem);
  }
  .text-\[clamp\(1\.5rem\,2\.3vw\,2\.2rem\)\] {
    font-size: clamp(1.5rem, 2.3vw, 2.2rem);
  }
  .text-\[clamp\(1\.5rem\,2\.4vw\,2\.1rem\)\] {
    font-size: clamp(1.5rem, 2.4vw, 2.1rem);
  }
  .text-\[clamp\(1\.6rem\,2\.4vw\,2\.1rem\)\] {
    font-size: clamp(1.6rem, 2.4vw, 2.1rem);
  }
  .text-\[clamp\(1\.7rem\,2\.7vw\,2\.5rem\)\] {
    font-size: clamp(1.7rem, 2.7vw, 2.5rem);
  }
  .text-\[clamp\(1\.7rem\,3vw\,2\.8rem\)\] {
    font-size: clamp(1.7rem, 3vw, 2.8rem);
  }
  .text-\[clamp\(1\.9rem\,3\.2vw\,2\.9rem\)\] {
    font-size: clamp(1.9rem, 3.2vw, 2.9rem);
  }
  .text-\[clamp\(2\.1rem\,6vw\,2\.7rem\)\] {
    font-size: clamp(2.1rem, 6vw, 2.7rem);
  }
  .text-\[clamp\(2\.2rem\,4\.4vw\,3\.6rem\)\] {
    font-size: clamp(2.2rem, 4.4vw, 3.6rem);
  }
  .text-\[clamp\(2\.2rem\,4vw\,3\.2rem\)\] {
    font-size: clamp(2.2rem, 4vw, 3.2rem);
  }
  .text-\[clamp\(2\.4rem\,4\.4vw\,4rem\)\] {
    font-size: clamp(2.4rem, 4.4vw, 4rem);
  }
  .text-\[clamp\(2\.4rem\,5vw\,4\.5rem\)\] {
    font-size: clamp(2.4rem, 5vw, 4.5rem);
  }
  .text-\[clamp\(2\.4rem\,7vw\,3\.1rem\)\] {
    font-size: clamp(2.4rem, 7vw, 3.1rem);
  }
  .text-\[clamp\(2\.5rem\,4\.4vw\,4\.1rem\)\] {
    font-size: clamp(2.5rem, 4.4vw, 4.1rem);
  }
  .text-\[clamp\(2\.5rem\,5\.6vw\,5\.2rem\)\] {
    font-size: clamp(2.5rem, 5.6vw, 5.2rem);
  }
  .text-\[clamp\(2\.6rem\,6vw\,3\.7rem\)\] {
    font-size: clamp(2.6rem, 6vw, 3.7rem);
  }
  .text-\[clamp\(2\.6rem\,6vw\,5\.5rem\)\] {
    font-size: clamp(2.6rem, 6vw, 5.5rem);
  }
  .text-\[clamp\(2\.7rem\,6vw\,5\.2rem\)\] {
    font-size: clamp(2.7rem, 6vw, 5.2rem);
  }
  .text-\[clamp\(2\.8rem\,6\.4vw\,6rem\)\] {
    font-size: clamp(2.8rem, 6.4vw, 6rem);
  }
  .text-\[clamp\(2rem\,4vw\,3\.5rem\)\] {
    font-size: clamp(2rem, 4vw, 3.5rem);
  }
  .leading-\[1\.12\] {
    --tw-leading: 1.12;
    line-height: 1.12;
  }
  .leading-\[1\.45\] {
    --tw-leading: 1.45;
    line-height: 1.45;
  }
  .leading-none {
    --tw-leading: 1;
    line-height: 1;
  }
  .leading-relaxed {
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
  }
  .leading-snug {
    --tw-leading: var(--leading-snug);
    line-height: var(--leading-snug);
  }
  .leading-tight {
    --tw-leading: var(--leading-tight);
    line-height: var(--leading-tight);
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .font-normal {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .tracking-normal {
    --tw-tracking: var(--tracking-normal);
    letter-spacing: var(--tracking-normal);
  }
  .break-words {
    overflow-wrap: break-word;
  }
  .whitespace-nowrap {
    white-space: nowrap;
  }
  .text-accento {
    color: var(--accento);
  }
  .text-prugna {
    color: var(--color-prugna);
  }
  .text-prugna\/60 {
    color: color-mix(in srgb, #3B1730 60%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-prugna) 60%, transparent);
    }
  }
  .text-prugna\/65 {
    color: color-mix(in srgb, #3B1730 65%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-prugna) 65%, transparent);
    }
  }
  .text-prugna\/70 {
    color: color-mix(in srgb, #3B1730 70%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-prugna) 70%, transparent);
    }
  }
  .text-prugna\/75 {
    color: color-mix(in srgb, #3B1730 75%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-prugna) 75%, transparent);
    }
  }
  .text-prugna\/80 {
    color: color-mix(in srgb, #3B1730 80%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-prugna) 80%, transparent);
    }
  }
  .text-prugna\/85 {
    color: color-mix(in srgb, #3B1730 85%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-prugna) 85%, transparent);
    }
  }
  .text-rosa {
    color: var(--color-rosa);
  }
  .text-white {
    color: var(--color-white);
  }
  .text-white\/55 {
    color: color-mix(in srgb, #fff 55%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-white) 55%, transparent);
    }
  }
  .text-white\/65 {
    color: color-mix(in srgb, #fff 65%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-white) 65%, transparent);
    }
  }
  .text-white\/70 {
    color: color-mix(in srgb, #fff 70%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-white) 70%, transparent);
    }
  }
  .text-white\/75 {
    color: color-mix(in srgb, #fff 75%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-white) 75%, transparent);
    }
  }
  .text-white\/80 {
    color: color-mix(in srgb, #fff 80%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-white) 80%, transparent);
    }
  }
  .text-white\/85 {
    color: color-mix(in srgb, #fff 85%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-white) 85%, transparent);
    }
  }
  .text-white\/90 {
    color: color-mix(in srgb, #fff 90%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-white) 90%, transparent);
    }
  }
  .italic {
    font-style: italic;
  }
  .underline {
    text-decoration-line: underline;
  }
  .underline-offset-4 {
    text-underline-offset: 4px;
  }
  .accent-\[var\(--accento\)\] {
    accent-color: var(--accento);
  }
  .shadow-\[0_12px_40px_-12px_rgba\(59\,23\,48\,\.6\)\] {
    --tw-shadow: 0 12px 40px -12px var(--tw-shadow-color, rgba(59,23,48,.6));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .backdrop-blur {
    --tw-backdrop-blur: blur(8px);
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
  }
  .backdrop-blur-md {
    --tw-backdrop-blur: blur(var(--blur-md));
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
  }
  .transition-colors {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-transform {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .duration-500 {
    --tw-duration: 500ms;
    transition-duration: 500ms;
  }
  .duration-700 {
    --tw-duration: 700ms;
    transition-duration: 700ms;
  }
  .ease-out {
    --tw-ease: var(--ease-out);
    transition-timing-function: var(--ease-out);
  }
  @media (hover: hover) {
    .group-hover\:translate-x-1\.5:is(:where(.group):hover *) {
      --tw-translate-x: calc(var(--spacing) * 1.5);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .group-hover\:scale-\[1\.04\]:is(:where(.group):hover *) {
      scale: 1.04;
    }
    .group-hover\:text-accento:is(:where(.group):hover *) {
      color: var(--accento);
    }
  }
  .peer-checked\:border-accento:is(:where(.peer):checked ~ *) {
    border-color: var(--accento);
  }
  .peer-checked\:border-prugna:is(:where(.peer):checked ~ *) {
    border-color: var(--color-prugna);
  }
  .peer-checked\:bg-prugna:is(:where(.peer):checked ~ *) {
    background-color: var(--color-prugna);
  }
  .peer-checked\:text-white:is(:where(.peer):checked ~ *) {
    color: var(--color-white);
  }
  .peer-focus-visible\:outline:is(:where(.peer):focus-visible ~ *) {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }
  .peer-focus-visible\:outline-2:is(:where(.peer):focus-visible ~ *) {
    outline-style: var(--tw-outline-style);
    outline-width: 2px;
  }
  .peer-focus-visible\:outline-offset-2:is(:where(.peer):focus-visible ~ *) {
    outline-offset: 2px;
  }
  .peer-focus-visible\:outline-accento:is(:where(.peer):focus-visible ~ *) {
    outline-color: var(--accento);
  }
  .empty\:hidden:empty {
    display: none;
  }
  @media (hover: hover) {
    .hover\:border-prugna:hover {
      border-color: var(--color-prugna);
    }
    .hover\:bg-rosa:hover {
      background-color: var(--color-rosa);
    }
    .hover\:bg-white\/15:hover {
      background-color: color-mix(in srgb, #fff 15%, transparent);
    }
    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-white\/15:hover {
        background-color: color-mix(in oklab, var(--color-white) 15%, transparent);
      }
    }
    .hover\:text-accento:hover {
      color: var(--accento);
    }
    .hover\:text-rosa:hover {
      color: var(--color-rosa);
    }
  }
  .focus\:not-sr-only:focus {
    position: static;
    width: auto;
    height: auto;
    padding: 0;
    margin: 0;
    overflow: visible;
    clip-path: none;
    white-space: normal;
  }
  .focus\:fixed:focus {
    position: fixed;
  }
  .focus\:top-4:focus {
    top: calc(var(--spacing) * 4);
  }
  .focus\:left-4:focus {
    left: calc(var(--spacing) * 4);
  }
  .focus\:z-\[100\]:focus {
    z-index: 100;
  }
  .focus\:rounded-full:focus {
    border-radius: calc(infinity * 1px);
  }
  .focus\:bg-prugna:focus {
    background-color: var(--color-prugna);
  }
  .focus\:px-5:focus {
    padding-inline: calc(var(--spacing) * 5);
  }
  .focus\:py-3:focus {
    padding-block: calc(var(--spacing) * 3);
  }
  .focus\:text-white:focus {
    color: var(--color-white);
  }
  @media (width >= 40rem) {
    .sm\:col-span-2 {
      grid-column: span 2 / span 2;
    }
    .sm\:col-span-3 {
      grid-column: span 3 / span 3;
    }
    .sm\:col-span-6 {
      grid-column: span 6 / span 6;
    }
    .sm\:block {
      display: block;
    }
    .sm\:h-28 {
      height: calc(var(--spacing) * 28);
    }
    .sm\:w-28 {
      width: calc(var(--spacing) * 28);
    }
    .sm\:w-\[44vw\] {
      width: 44vw;
    }
    .sm\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .sm\:grid-cols-6 {
      grid-template-columns: repeat(6, minmax(0, 1fr));
    }
    .sm\:grid-cols-\[14rem_1fr\] {
      grid-template-columns: 14rem 1fr;
    }
    .sm\:gap-3 {
      gap: calc(var(--spacing) * 3);
    }
    .sm\:p-7 {
      padding: calc(var(--spacing) * 7);
    }
    .sm\:p-9 {
      padding: calc(var(--spacing) * 9);
    }
    .sm\:px-10 {
      padding-inline: calc(var(--spacing) * 10);
    }
    .sm\:pt-14 {
      padding-top: calc(var(--spacing) * 14);
    }
    .sm\:pb-10 {
      padding-bottom: calc(var(--spacing) * 10);
    }
    .sm\:pb-20 {
      padding-bottom: calc(var(--spacing) * 20);
    }
  }
  @media (width >= 48rem) {
    .md\:-mx-10 {
      margin-inline: calc(var(--spacing) * -10);
    }
    .md\:flex {
      display: flex;
    }
    .md\:inline-flex {
      display: inline-flex;
    }
    .md\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .md\:grid-cols-\[1fr_auto_1fr\] {
      grid-template-columns: 1fr auto 1fr;
    }
    .md\:gap-6 {
      gap: calc(var(--spacing) * 6);
    }
    .md\:gap-7 {
      gap: calc(var(--spacing) * 7);
    }
    .md\:gap-x-6 {
      column-gap: calc(var(--spacing) * 6);
    }
    .md\:p-10 {
      padding: calc(var(--spacing) * 10);
    }
    .md\:px-10 {
      padding-inline: calc(var(--spacing) * 10);
    }
  }
  @media (width >= 64rem) {
    .lg\:sticky {
      position: sticky;
    }
    .lg\:top-\[92px\] {
      top: 92px;
    }
    .lg\:order-2 {
      order: 2;
    }
    .lg\:col-span-2 {
      grid-column: span 2 / span 2;
    }
    .lg\:row-span-2 {
      grid-row: span 2 / span 2;
    }
    .lg\:mt-12 {
      margin-top: calc(var(--spacing) * 12);
    }
    .lg\:mt-28 {
      margin-top: calc(var(--spacing) * 28);
    }
    .lg\:mr-0 {
      margin-right: 0px;
    }
    .lg\:ml-auto {
      margin-left: auto;
    }
    .lg\:block {
      display: block;
    }
    .lg\:flex {
      display: flex;
    }
    .lg\:grid {
      display: grid;
    }
    .lg\:hidden {
      display: none;
    }
    .lg\:aspect-auto {
      aspect-ratio: auto;
    }
    .lg\:h-\[44vh\] {
      height: 44vh;
    }
    .lg\:min-h-screen {
      min-height: 100vh;
    }
    .lg\:w-\[30vw\] {
      width: 30vw;
    }
    .lg\:grid-cols-1 {
      grid-template-columns: repeat(1, minmax(0, 1fr));
    }
    .lg\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .lg\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .lg\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .lg\:grid-cols-\[1\.1fr_1fr\] {
      grid-template-columns: 1.1fr 1fr;
    }
    .lg\:grid-cols-\[1\.05fr_1fr\] {
      grid-template-columns: 1.05fr 1fr;
    }
    .lg\:grid-cols-\[1\.5fr_1fr\] {
      grid-template-columns: 1.5fr 1fr;
    }
    .lg\:grid-cols-\[1\.6fr_1fr\] {
      grid-template-columns: 1.6fr 1fr;
    }
    .lg\:grid-cols-\[1\.15fr_1fr\] {
      grid-template-columns: 1.15fr 1fr;
    }
    .lg\:grid-cols-\[1\.25fr_1fr_0\.8fr\] {
      grid-template-columns: 1.25fr 1fr 0.8fr;
    }
    .lg\:grid-cols-\[1fr_1\.6fr\] {
      grid-template-columns: 1fr 1.6fr;
    }
    .lg\:grid-cols-\[1fr_1\.15fr\] {
      grid-template-columns: 1fr 1.15fr;
    }
    .lg\:grid-cols-\[minmax\(0\,1\.14fr\)_minmax\(0\,0\.86fr\)\] {
      grid-template-columns: minmax(0,1.14fr) minmax(0,0.86fr);
    }
    .lg\:grid-cols-\[minmax\(0\,1\.18fr\)_minmax\(0\,0\.82fr\)\] {
      grid-template-columns: minmax(0,1.18fr) minmax(0,0.82fr);
    }
    .lg\:items-center {
      align-items: center;
    }
    .lg\:items-end {
      align-items: flex-end;
    }
    .lg\:gap-14 {
      gap: calc(var(--spacing) * 14);
    }
    .lg\:gap-16 {
      gap: calc(var(--spacing) * 16);
    }
    .lg\:gap-20 {
      gap: calc(var(--spacing) * 20);
    }
    .lg\:gap-24 {
      gap: calc(var(--spacing) * 24);
    }
    .lg\:gap-x-6 {
      column-gap: calc(var(--spacing) * 6);
    }
    .lg\:border-r {
      border-right-style: var(--tw-border-style);
      border-right-width: 1px;
    }
    .lg\:border-prugna\/10 {
      border-color: color-mix(in srgb, #3B1730 10%, transparent);
    }
    @supports (color: color-mix(in lab, red, red)) {
      .lg\:border-prugna\/10 {
        border-color: color-mix(in oklab, var(--color-prugna) 10%, transparent);
      }
    }
    .lg\:p-7 {
      padding: calc(var(--spacing) * 7);
    }
    .lg\:p-8 {
      padding: calc(var(--spacing) * 8);
    }
    .lg\:p-11 {
      padding: calc(var(--spacing) * 11);
    }
    .lg\:p-12 {
      padding: calc(var(--spacing) * 12);
    }
    .lg\:px-14 {
      padding-inline: calc(var(--spacing) * 14);
    }
    .lg\:py-0 {
      padding-block: 0px;
    }
    .lg\:py-24 {
      padding-block: calc(var(--spacing) * 24);
    }
    .lg\:py-28 {
      padding-block: calc(var(--spacing) * 28);
    }
    .lg\:pt-10 {
      padding-top: calc(var(--spacing) * 10);
    }
    .lg\:pt-12 {
      padding-top: calc(var(--spacing) * 12);
    }
    .lg\:pt-14 {
      padding-top: calc(var(--spacing) * 14);
    }
    .lg\:pb-2 {
      padding-bottom: calc(var(--spacing) * 2);
    }
    .lg\:pb-28 {
      padding-bottom: calc(var(--spacing) * 28);
    }
    .lg\:pb-32 {
      padding-bottom: calc(var(--spacing) * 32);
    }
    .lg\:text-\[18px\] {
      font-size: 18px;
    }
  }
  .\[\&_td\:first-child\]\:pl-4 td:first-child {
    padding-left: calc(var(--spacing) * 4);
  }
  .\[\&_td\:last-child\]\:pr-4 td:last-child {
    padding-right: calc(var(--spacing) * 4);
  }
}
@layer base {
  body {
    background-color: var(--color-white);
    font-family: var(--font-sans);
    color: var(--color-prugna);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  ::selection {
    background-color: var(--color-rosa);
    color: var(--color-prugna);
  }
}
@layer components {
  .contenitore {
    margin-inline: auto;
    width: 100%;
    max-width: 1360px;
    padding-inline: calc(var(--spacing) * 5);
    @media (width >= 48rem) {
      padding-inline: calc(var(--spacing) * 10);
    }
  }
  .titolo {
    font-family: var(--font-display);
    --tw-leading: 1.02;
    line-height: 1.02;
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    --tw-tracking: -0.02em;
    letter-spacing: -0.02em;
    text-wrap: balance;
  }
  .btn {
    display: inline-flex;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing) * 2);
    border-radius: calc(infinity * 1px);
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 3.5);
    font-size: 15px;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: 200ms;
    transition-duration: 200ms;
  }
  .btn-pieno {
    background-color: var(--accento);
    color: var(--color-white);
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-prugna);
      }
    }
  }
  .btn-scuro {
    background-color: var(--color-prugna);
    color: var(--color-white);
    &:hover {
      @media (hover: hover) {
        background-color: var(--accento);
      }
    }
  }
  .btn-linea {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: color-mix(in srgb, #3B1730 25%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 25%, transparent);
    }
    color: var(--color-prugna);
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-prugna);
      }
    }
  }
  .btn-chiaro {
    background-color: var(--color-white);
    color: var(--color-prugna);
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-cipria);
      }
    }
  }
  .link {
    text-decoration-line: underline;
    text-decoration-color: color-mix(in srgb, #3B1730 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      text-decoration-color: color-mix(in oklab, var(--color-prugna) 30%, transparent);
    }
    text-underline-offset: 4px;
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    &:hover {
      @media (hover: hover) {
        text-decoration-color: var(--accento);
      }
    }
  }
  .chip {
    cursor: pointer;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: color-mix(in srgb, #3B1730 20%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 20%, transparent);
    }
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-prugna);
      }
    }
  }
  .campo {
    width: 100%;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: color-mix(in srgb, #3B1730 25%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-prugna) 25%, transparent);
    }
    background-color: var(--color-white);
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 3);
    font-size: 15px;
    &::placeholder {
      color: color-mix(in srgb, #3B1730 40%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, var(--color-prugna) 40%, transparent);
      }
    }
  }
  .icona-btn {
    position: relative;
    display: inline-flex;
    height: calc(var(--spacing) * 11);
    width: calc(var(--spacing) * 11);
    cursor: pointer;
    align-items: center;
    justify-content: center;
    border-radius: calc(infinity * 1px);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-cipria);
      }
    }
  }
  .prosa p + p {
    margin-top: calc(var(--spacing) * 4);
  }
  .prosa a {
    text-decoration-line: underline;
    text-decoration-color: color-mix(in srgb, #3B1730 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      text-decoration-color: color-mix(in oklab, var(--color-prugna) 30%, transparent);
    }
    text-underline-offset: 4px;
    &:hover {
      @media (hover: hover) {
        text-decoration-color: var(--accento);
      }
    }
  }
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-x {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-y {
  syntax: "*";
  inherits: false;
}
@property --tw-scroll-snap-strictness {
  syntax: "*";
  inherits: false;
  initial-value: proximity;
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-divide-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-scroll-snap-strictness: proximity;
      --tw-space-y-reverse: 0;
      --tw-divide-y-reverse: 0;
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
      --tw-duration: initial;
      --tw-ease: initial;
      --tw-outline-style: solid;
    }
  }
}


/* ===== componenti del tema (dal prototipo) ===== */
/* Stili che Tailwind non copre: vista privati/rivenditori, stati dei componenti, hero, stampa. */

:root {
  --accento: #B3245E;
  --tenue: #FBEFEE;
}

/* Il sito è unico. Cambia solo ciò che dipende dall'account:
   .solo-pubblico  chi non ha un account o ha un account privato
   .solo-pro       chi ha un account rivenditore o rappresentante
   .solo-ospite    chi non ha effettuato l'accesso
   .solo-connesso  chi ha effettuato l'accesso */
html:not([data-conto="rivenditore"]):not([data-conto="rappresentante"]) .solo-pro,
html[data-conto="rivenditore"] .solo-pubblico,
html[data-conto="rappresentante"] .solo-pubblico,
html[data-conto] .solo-ospite,
html:not([data-conto]) .solo-connesso {
  display: none !important;
}

:focus-visible {
  outline: 2px solid var(--accento);
  outline-offset: 3px;
}

.barra { background: #3B1730; }

.chip[aria-pressed="true"] {
  background: #3B1730;
  border-color: #3B1730;
  color: #fff;
}

/* Dialog: menu e carrello */
dialog { border: 0; }
dialog::backdrop { background: rgba(59, 23, 48, .45); }
dialog.carrello { margin-left: auto; }

/* Fisarmoniche */
summary::-webkit-details-marker { display: none; }
.fisarmonica-segno { transition: transform .3s ease; }
.fisarmonica[open] .fisarmonica-segno { transform: rotate(45deg); }

/* ---------- Scheda prodotto ----------
   Una tessera colorata con la foto del gioiello: il bianco della foto di prodotto prende la tinta
   della tessera (mix-blend-mode), le foto indossate la riempiono per intero. */
.scheda-tessera {
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  background: var(--tinta, #F1ECEE);
  isolation: isolate;
}
/* la tinta è anche qui: durante le animazioni questo elemento ha una trasformazione propria
   e la foto deve trovare il colore con cui fondersi al suo interno */
.scheda-foto {
  position: relative;
  display: block;
  aspect-ratio: 4 / 5;
  background: var(--tinta, #F1ECEE);
}
.scheda-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity .45s ease, transform 1.2s cubic-bezier(.19, 1, .22, 1);
}
.scheda-img.attiva { opacity: 1; }
.scheda-img.fondo { object-fit: contain; mix-blend-mode: multiply; }
.scheda-img.scena { object-fit: cover; transform: scale(1.06); }
.scheda-img.scena.attiva { transform: scale(1); }
.scheda:hover .scheda-img.fondo.attiva { transform: scale(1.05); }
.scheda.esaurita .scheda-img { filter: saturate(.5); }
.scheda.esaurita .scheda-img.attiva { opacity: .5; }

/* quando si passa su un'altra versione della serie, la tessera ne mostra la foto */
.scheda-tessera.in-anteprima .scheda-img:not(.scheda-anteprima) { opacity: 0; }

/* indicatore delle foto: una lineetta per foto, si scorre muovendo il puntatore sulla tessera */
.scheda-segmenti {
  position: absolute;
  left: 14px;
  bottom: 16px;
  z-index: 2;
  display: flex;
  gap: 4px;
  width: 34%;
  max-width: 96px;
  opacity: 0;
  transition: opacity .3s ease;
}
.scheda-segmenti span { flex: 1; height: 2px; border-radius: 2px; background: rgba(59, 23, 48, .22); transition: background-color .25s ease; }
.scheda-segmenti span.attivo { background: #3B1730; }

/* aggiunta rapida: un cerchio con il più, che si allarga con la scritta */
.scheda-aggiungi {
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 3;
  display: flex;
  align-items: center;
  height: 44px;
  min-width: 44px;
  padding: 0 13px;
  color: #3B1730;
  background: #fff;
  border-radius: 999px;
  box-shadow: 0 8px 22px -10px rgba(59, 23, 48, .45);
  cursor: pointer;
  overflow: hidden;
  transition: opacity .3s ease, transform .45s cubic-bezier(.19, 1, .22, 1), background-color .25s ease, color .25s ease;
}
.scheda-aggiungi span {
  max-width: 0;
  margin-left: 0;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
  opacity: 0;
  transition: max-width .5s cubic-bezier(.19, 1, .22, 1), margin-left .5s cubic-bezier(.19, 1, .22, 1), opacity .3s ease;
}
.scheda-aggiungi.fatto { color: #fff; background: var(--accento); }
@media (hover: hover) {
  .scheda-aggiungi { opacity: 0; transform: translateY(10px); }
  .scheda:hover .scheda-aggiungi,
  .scheda-aggiungi:focus-visible { opacity: 1; transform: none; }
  .scheda-aggiungi:hover,
  .scheda-aggiungi:focus-visible { color: #fff; background: #3B1730; }
  .scheda-aggiungi:hover span,
  .scheda-aggiungi:focus-visible span { max-width: 120px; margin-left: 8px; opacity: 1; }
  .scheda-aggiungi.fatto:hover { background: var(--accento); }
  .scheda:hover .scheda-segmenti { opacity: 1; }
}

/* su schermi stretti, con due schede per riga, il prezzo va sotto il nome */
@media (max-width: 639px) {
  .scheda:not(.scheda-grande) .scheda-testo { flex-direction: column; gap: .3rem; }
  .scheda:not(.scheda-grande) .scheda-testo .text-right { text-align: left; }
  .griglia-elenco[data-densita="ampia"] .scheda .scheda-testo { flex-direction: row; gap: .75rem; }
}

/* altre versioni della serie */
.scheda-versione {
  display: block;
  width: 26px;
  height: 26px;
  overflow: hidden;
  border: 1px solid rgba(59, 23, 48, .18);
  border-radius: 50%;
  transition: border-color .2s ease, transform .3s cubic-bezier(.19, 1, .22, 1);
}
.scheda-versione img { width: 100%; height: 100%; object-fit: cover; }
.scheda-versione:hover, .scheda-versione:focus-visible { border-color: #3B1730; transform: scale(1.15); }

/* scheda in evidenza nel mosaico della home: occupa due colonne e due righe */
.scheda-grande { grid-column: span 2; }
@media (min-width: 1024px) {
  .scheda-grande { grid-row: span 2; display: flex; flex-direction: column; }
  .scheda-grande .scheda-tessera { flex: 1; }
  .scheda-grande .scheda-foto { height: 100%; aspect-ratio: auto; }
}
.tessera-invito { transition: background-color .3s ease; }
.tessera-invito:hover { background: var(--accento); }

/* griglia degli elenchi: due dimensioni delle anteprime */
.griglia-elenco { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem 1rem; }
.griglia-elenco[data-densita="ampia"] { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) {
  .griglia-elenco { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3.25rem 1.5rem; }
  .griglia-elenco[data-densita="ampia"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .griglia-elenco[data-densita="ampia"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .griglia-elenco[data-densita="fitta"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.densita {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 32px;
  color: rgba(59, 23, 48, .45);
  border-radius: 999px;
  cursor: pointer;
  transition: color .2s ease, background-color .2s ease;
}
.densita:hover { color: #3B1730; }
.densita[aria-pressed="true"] { color: #fff; background: #3B1730; }

/* Hero: campagna a tutto schermo. Le foto sono sovrapposte; quella attiva sta sopra e le altre restano nascoste
   finché home.js non le fa entrare con una tendina. Titolo e didascalia stanno in basso, sopra un velo prugna. */
.hero-scena {
  position: relative;
  height: calc(100svh - 108px);
  min-height: 600px;
  max-height: 1000px;
  overflow: hidden;
  color: #fff;
  background: #3B1730;
}
.hero-slide { position: absolute; inset: 0; overflow: hidden; }
.hero-slide + .hero-slide { visibility: hidden; }
.hero-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--fuoco, 50% 50%);
  transform-origin: 50% 50%;
  will-change: transform;
}
@media (max-width: 767px) { .hero-img { object-position: var(--fuoco-m, 50% 50%); } }
.hero-velo {
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: none;
  background:
    linear-gradient(to top, rgba(59, 23, 48, .78) 0%, rgba(59, 23, 48, .32) 38%, rgba(59, 23, 48, 0) 62%),
    linear-gradient(to right, rgba(59, 23, 48, .35), rgba(59, 23, 48, 0) 55%);
}
.hero-contenuto {
  position: absolute;
  inset: auto 0 0 0;
  z-index: 6;
  display: grid;
  gap: 28px;
  align-items: end;
  padding-bottom: 40px;
}
@media (min-width: 1024px) {
  .hero-contenuto { grid-template-columns: 1fr 380px; gap: 48px; padding-bottom: 56px; }
}
.hero-titolo { font-size: clamp(2.9rem, 8.4vw, 8.6rem); line-height: .9; letter-spacing: -.01em; max-width: 9ch; }

/* scheda di vetro con barre, comandi e didascalia della foto */
.hero-scheda {
  padding: 18px 20px 20px;
  background: rgba(59, 23, 48, .28);
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 22px;
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
  backdrop-filter: blur(14px) saturate(1.2);
}
.hero-barre { display: flex; flex: 1; gap: 6px; }
.hero-barra { position: relative; flex: 1; height: 20px; cursor: pointer; }
.hero-barra::before, .hero-barra span {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 2px;
  margin-top: -1px;
  border-radius: 2px;
}
.hero-barra::before { background: rgba(255, 255, 255, .3); }
.hero-barra span { background: #fff; transform: scaleX(0); transform-origin: left; }
.hero-barra[aria-current="true"] span { transform: scaleX(1); }
.hero-barra:focus-visible { outline: 2px solid #fff; outline-offset: 2px; border-radius: 4px; }
.hero-tasto {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 50%;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease;
}
.hero-tasto:hover { color: #3B1730; background: #fff; }
.hero-tasto:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.hero-icona-play { display: none; }
.hero-tasto[aria-pressed="true"] .hero-icona-play { display: block; }
.hero-tasto[aria-pressed="true"] .hero-icona-pausa { display: none; }
.hero-didascalia .riga { overflow: hidden; }
.hero-didascalia .riga > * { display: inline-block; }
.hero-link { padding-bottom: 2px; font-size: 15px; font-weight: 500; border-bottom: 1px solid rgba(255, 255, 255, .6); transition: border-color .2s ease; }
.hero-link:hover { border-color: #fff; }
@media (max-width: 767px) {
  .hero-scena { height: calc(100svh - 104px); min-height: 560px; }
  /* su telefono le foto stanno nella parte alta e sfumano nel prugna, così il gioiello resta sopra il testo */
  .hero-slide { bottom: 30%; }
  .hero-velo { background: linear-gradient(to top, #3B1730 0%, #3B1730 30%, rgba(59, 23, 48, .55) 46%, rgba(59, 23, 48, 0) 66%); }
  .hero-contenuto { gap: 22px; padding-bottom: 24px; }
  .hero-scheda { padding: 14px 16px 16px; }
  .hero-didascalia .riga:nth-child(2) { display: none; }
}

/* Collezioni */
.collezioni-binario { scrollbar-width: none; }
.collezioni-binario::-webkit-scrollbar { display: none; }
@media (min-width: 1024px) {
  .collezioni-scena { min-height: calc(100svh - 68px); }
  .collezioni.fissa .collezioni-binario { overflow: visible; }
}

/* Galleria prodotto */
.miniatura[aria-current="true"] {
  outline: 2px solid var(--accento);
  outline-offset: 2px;
}
.galleria-foto { transition: transform .25s ease-out; }

.quantita { appearance: textfield; -moz-appearance: textfield; }
.quantita::-webkit-outer-spin-button,
.quantita::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

button:disabled { opacity: .45; cursor: not-allowed; }

.solo-stampa { display: none; }

/* Spazio per la barra d'acquisto fissa nella scheda prodotto */
.con-barra footer { padding-bottom: 72px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Scheda prodotto stampabile: una pagina con foto, descrizione e dati tecnici */
@media print {
  @page { margin: 14mm; }
  [data-nostampa], dialog { display: none !important; }
  body { font-size: 10.5pt; }
  .contenitore { display: block !important; max-width: none !important; padding: 0 !important; }
  .galleria { display: block !important; float: left; width: 62mm; margin: 0 8mm 4mm 0 !important; padding: 0 !important; overflow: visible !important; }
  .galleria-voce:not(.galleria-prima) { display: none !important; }
  .galleria-voce { aspect-ratio: 1 / 1 !important; }
  .acquisto-colonna { position: static !important; }
  .scheda { overflow: hidden; }
  .scheda h1 { font-size: 26pt !important; margin-top: 0 !important; }
  .scheda-tecnica { clear: both; margin-top: 6mm !important; background: none !important; }
  .scheda-tecnica .contenitore { padding: 0 !important; }
  .scheda-tecnica h2 { font-size: 15pt !important; }
  .solo-stampa { display: block; margin-top: 6mm; font-size: 9pt; color: #555; }
  a { text-decoration: none !important; }
}

/* ---------- Pagine di acquisto ---------- */

/* Campo con etichetta flottante: l'etichetta fa da segnaposto e sale quando il campo ha un valore */
.campo-f { position: relative; }
.campo-f input,
.campo-f select {
  width: 100%;
  height: 56px;
  padding: 22px 14px 6px;
  font-size: 16px;
  color: #3B1730;
  background: #fff;
  border: 1px solid rgba(59, 23, 48, .28);
  border-radius: 12px;
  appearance: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.campo-f select {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%233B1730' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}
.campo-f label {
  position: absolute;
  left: 15px;
  top: 17px;
  max-width: calc(100% - 30px);
  overflow: hidden;
  font-size: 16px;
  line-height: 22px;
  color: rgba(59, 23, 48, .7);
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
  transform-origin: left top;
  transition: transform .16s ease;
}
.campo-f input:focus + label,
.campo-f input:not(:placeholder-shown) + label,
.campo-f select:valid + label,
.campo-f select:focus + label {
  transform: translateY(-11px) scale(.78);
}
.campo-f input:focus,
.campo-f select:focus {
  outline: none;
  border-color: var(--accento);
  box-shadow: 0 0 0 1px var(--accento);
}
.campo-f [aria-invalid="true"] {
  border-color: #B42318;
  box-shadow: 0 0 0 1px #B42318;
}
.errore {
  margin-top: 6px;
  font-size: 13px;
  color: #B42318;
}

/* Elenco di scelte con pannello che si apre sotto quella selezionata */
.pagamento:has(> label input:checked) > label { background: var(--tenue); }
.pagamento:not(:has(> label input:checked)) > .pagamento-pannello { display: none; }
.pagamento-pannello { background: #FCFAFA; }

.cassa-mobile[open] .fisarmonica-segno { transform: rotate(180deg); }

.rotella {
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255, 255, 255, .4);
  border-top-color: #fff;
  border-radius: 50%;
  animation: giro .7s linear infinite;
}
@keyframes giro { to { transform: rotate(360deg); } }

.pagamento:has(> label input:disabled) > label { cursor: not-allowed; opacity: .5; }

/* ---------- Area clienti: scheda di accesso ---------- */

/* l'arco con la foto sopra la scheda cambia con la vista e con il tipo di account */
.porta {
  width: 124px;
  height: 156px;
  overflow: hidden;
  background: var(--tenue);
  border: 6px solid #fff;
  border-radius: 999px 999px 20px 20px;
  box-shadow: 0 22px 40px -24px rgba(59, 23, 48, .5);
}
.porta img { width: 100%; height: 100%; object-fit: cover; }
.scheda-accesso { box-shadow: 0 50px 90px -60px rgba(59, 23, 48, .45); }
[data-vista] h1:focus { outline: none; }

/* scelta del tipo di account: tre segmenti con una pillola che scorre sotto quello scelto */
.segmenti {
  position: relative;
  display: flex;
  padding: 4px;
  background: var(--tenue);
  border-radius: 999px;
}
.segmenti label {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  padding: 10px 8px;
  font-size: 14px;
  font-weight: 500;
  text-align: center;
  white-space: nowrap;
  border-radius: 999px;
  cursor: pointer;
  transition: color .3s ease;
}
.segmenti label:has(input:checked) { color: #fff; }
.segmenti label:has(input:focus-visible) { outline: 2px solid var(--accento); outline-offset: 2px; }
.segmenti-pillola {
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 0;
  width: 0;
  background: #3B1730;
  border-radius: 999px;
  transition: transform .45s cubic-bezier(.22, .8, .24, 1), width .45s cubic-bezier(.22, .8, .24, 1);
}
.segmenti:not(.pronto) .segmenti-pillola { transition: none; }
@media (max-width: 380px) { .segmenti label { padding: 9px 4px; font-size: 13px; } }

/* due passi per rivenditori e rappresentanti: referente, poi attività */
.avanzamento { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; font-size: 13px; color: rgba(59, 23, 48, .55); }
.avanzamento span {
  position: relative;
  display: block;
  height: 3px;
  margin-bottom: 8px;
  overflow: hidden;
  background: rgba(59, 23, 48, .12);
  border-radius: 3px;
}
.avanzamento span::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--accento);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .5s cubic-bezier(.22, .8, .24, 1);
}
.avanzamento .fatto span::after { transform: scaleX(1); }
.avanzamento [aria-current="step"] { font-weight: 500; color: #3B1730; }

/* password con il pulsante Mostra */
.campo-pw input { padding-right: 92px; }
.mostra-pw {
  position: absolute;
  top: 8px;
  right: 8px;
  height: 40px;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 500;
  color: rgba(59, 23, 48, .75);
  border-radius: 999px;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}
.mostra-pw:hover { color: #3B1730; background: var(--tenue); }


/* ---------- Intestazione ---------- */

/* Messaggi della barra in alto: stanno uno sopra l'altro e GSAP li alterna in dissolvenza */
.notizie li { grid-area: 1 / 1; opacity: 0; visibility: hidden; }
.notizie li.attiva { opacity: 1; visibility: visible; }

/* Icona del menu: due linee che diventano una croce */
.hamburger { position: relative; display: block; width: 26px; height: 10px; }
.hamburger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 1.5px;
  background: currentColor;
  border-radius: 2px;
  transition: width .35s cubic-bezier(.19, 1, .22, 1);
}
.hamburger span:first-child { top: 0; }
.hamburger span:last-child { bottom: 0; width: 62%; }
.apri-menu:hover .hamburger span:last-child { width: 100%; }
.apri-menu { transition: background-color .2s ease; }
.apri-menu:hover { background: #FBEFEE; }
[data-menu-croce] span:last-child { width: 100%; }

/* Menu a tutto schermo: si apre come un cerchio che parte dal pulsante (GSAP) */
dialog.menu::backdrop { background: transparent; }
.menu-voce {
  position: relative;
  display: block;
  overflow: hidden;
  padding-bottom: .1em;
  line-height: 1.04;
  transition: opacity .35s ease;
}
.menu-voce > span { display: block; white-space: nowrap; transition: transform .7s cubic-bezier(.19, 1, .22, 1); }
.menu-voce::after {
  content: attr(data-testo);
  position: absolute;
  left: 0;
  top: 0;
  font-style: italic;
  color: var(--accento);
  white-space: nowrap;
  transform: translateY(110%);
  transition: transform .7s cubic-bezier(.19, 1, .22, 1);
}
@media (hover: hover) {
  .menu-voce:hover > span, .menu-voce:focus-visible > span { transform: translateY(-110%); }
  .menu-voce:hover::after, .menu-voce:focus-visible::after { transform: translateY(0); }
  .menu-voci:hover .menu-voce:not(:hover) { opacity: .38; }
}

/* Link con la linea che si disegna al passaggio */
.link-linea { position: relative; display: inline-block; }
.link-linea::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .5s cubic-bezier(.19, 1, .22, 1);
}
.link-linea:hover::after,
.link-linea:focus-visible::after { transform: scaleX(1); transform-origin: left; }

/* ---------- Rivenditori (home) ----------
   Una scheda prodotto con l'interruttore Privato / Rivenditore mostra cosa cambia: prezzo, pagamento, spedizione. */

.b2b-passi { display: grid; gap: 22px; }
.b2b-passi li { display: grid; grid-template-columns: 36px 1fr; gap: 16px; align-items: start; }
.b2b-numero {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  font-family: var(--font-display);
  font-size: 18px;
  color: #0F5C6B;
  background: #fff;
  border-radius: 50%;
}
.b2b-linea { color: #fff; border: 1px solid rgba(255, 255, 255, .45); }
.b2b-linea:hover { border-color: #fff; }

.b2b-scheda {
  padding: 26px;
  color: #3B1730;
  background: #fff;
  border-radius: 28px;
  box-shadow: 0 50px 80px -50px rgba(0, 0, 0, .55);
}
@media (min-width: 640px) { .b2b-scheda { padding: 34px; } }
.b2b-scheda .segmenti label { flex: 1 1 0; }
.b2b-foto {
  display: block;
  flex-shrink: 0;
  width: 72px;
  height: 72px;
  overflow: hidden;
  isolation: isolate;
  background: var(--tinta, #F1ECEE);
  border-radius: 50%;
}
.b2b-foto img { width: 100%; height: 100%; padding: 8px; object-fit: contain; mix-blend-mode: multiply; }
.b2b-riga { display: grid; grid-template-columns: 7.5rem 1fr; gap: 12px; padding-block: 14px; border-top: 1px solid rgba(59, 23, 48, .12); }
.b2b-riga dt { font-size: 14px; color: rgba(59, 23, 48, .6); }
.b2b-riga dd { min-height: 3.1em; }
.b2b-velato { font-size: 22px; font-weight: 500; filter: blur(7px); user-select: none; }
.b2b-lucchetto { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: rgba(59, 23, 48, .7); }
@media (max-width: 420px) { .b2b-riga { grid-template-columns: 1fr; gap: 4px; } }

/* ---------- Lola Swap (home) ----------
   Palco prugna a tutto schermo con il buono perlato che si inclina seguendo il puntatore. */

/* a tutto schermo, da bordo a bordo */
.swap-palco {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 100vh;
  min-height: 100svh;
  padding-block: 88px;
  overflow: hidden;
  color: #fff;
  background: #3B1730;
}
@media (min-width: 1024px) { .swap-palco { padding-block: 72px; } }
.swap-cifra {
  position: absolute;
  right: -3%;
  bottom: -14%;
  font-family: var(--font-display);
  font-size: clamp(13rem, 34vw, 31rem);
  line-height: .8;
  color: transparent;
  -webkit-text-stroke: 1px rgba(237, 191, 190, .2);
  pointer-events: none;
  user-select: none;
}

.swap-passi { position: relative; display: grid; gap: 22px; }
.swap-binario { position: absolute; top: 18px; bottom: 18px; left: 18px; width: 1px; background: rgba(255, 255, 255, .18); }
.swap-binario span { position: absolute; inset: 0; background: #EDBFBE; }
.swap-passo { position: relative; display: grid; grid-template-columns: 37px 1fr; gap: 18px; align-items: start; }
.swap-numero {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 37px;
  height: 37px;
  font-family: var(--font-display);
  font-size: 18px;
  color: #EDBFBE;
  background: #3B1730;
  border: 1px solid rgba(237, 191, 190, .45);
  border-radius: 50%;
  transition: color .4s ease, background-color .4s ease, border-color .4s ease;
}
.swap-passo.attivo .swap-numero { color: #3B1730; background: #EDBFBE; border-color: #EDBFBE; }
.swap-termini { color: #fff; border: 1px solid rgba(255, 255, 255, .35); }
.swap-termini:hover { border-color: #fff; }

.swap-scena { max-width: 470px; perspective: 1200px; }
.swap-buono {
  position: relative;
  display: flex;
  flex-direction: column;
  aspect-ratio: 1.586;
  padding: 26px 26px 16px;
  overflow: hidden;
  color: #3B1730;
  background: linear-gradient(140deg, #fff 0%, #FBEFEE 42%, #EDBFBE 100%);
  border-radius: 26px;
  box-shadow: 0 50px 80px -40px rgba(0, 0, 0, .75), inset 0 0 0 1px rgba(255, 255, 255, .5);
  transform-style: preserve-3d;
  will-change: transform;
}
/* riflesso perlato: un punto di luce e una banda iridescente che seguono il puntatore */
.swap-riflesso {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .8;
  background:
    radial-gradient(circle at var(--x, 22%) var(--y, 12%), rgba(255, 255, 255, .95), rgba(255, 255, 255, 0) 42%),
    linear-gradient(115deg, rgba(228, 240, 241, 0) 32%, rgba(228, 240, 241, .75) 45%, rgba(184, 146, 74, .22) 52%, rgba(237, 191, 190, .55) 60%, rgba(228, 240, 241, 0) 72%);
  background-size: 100% 100%, 260% 260%;
  background-position: 0 0, var(--bx, 30%) 50%;
}
.swap-gioiello {
  display: block;
  flex-shrink: 0;
  width: 84px;
  height: 84px;
  overflow: hidden;
  isolation: isolate;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 12px 26px -14px rgba(59, 23, 48, .55);
}
.swap-gioiello img, .swap-scelta img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.swap-gioiello img { padding: 7px; }
.swap-scelta img { border-radius: 50%; }
@media (max-width: 420px) {
  .swap-buono { padding: 20px 20px 12px; }
  .swap-gioiello { width: 62px; height: 62px; }
}

.swap-scelta {
  display: block;
  width: 56px;
  height: 56px;
  padding: 4px;
  overflow: hidden;
  isolation: isolate;
  background: #fff;
  border-radius: 50%;
  cursor: pointer;
  transition: box-shadow .25s ease, transform .25s ease;
}
.swap-scelta:hover { transform: translateY(-3px); }
.swap-scelta:has(input:checked) { box-shadow: 0 0 0 3px #3B1730, 0 0 0 5px #EDBFBE; }
.swap-scelta:has(input:focus-visible) { outline: 2px solid #EDBFBE; outline-offset: 7px; }
@media (max-width: 420px) { .swap-scelta { width: 48px; height: 48px; } }

/* ---------- Piè di pagina ----------
   Struttura: newsletter su fondo prugna, poi su fondo cipria vantaggi, logo tra due linee, social quadrati,
   due colonne di link con un divisorio, metodi di pagamento e dati societari. */

.pie-largo { max-width: 1200px; margin-inline: auto; padding-inline: 16px; }
@media (min-width: 640px) { .pie-largo { padding-inline: 24px; } }

.pie-newsletter { padding-block: 52px; color: #FFF8F7; background: #3B1730; }
.pie-titolo-grande {
  font-size: clamp(30px, 4.4vw, 40px);
  font-weight: 300;
  line-height: 1.1;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.pie-campo {
  width: 100%;
  height: 52px;
  padding: 0 15px;
  font-size: 16px;
  color: #FFF8F7;
  background: transparent;
  border: 1px solid rgba(255, 248, 247, .8);
  border-radius: 0;
  appearance: none;
  transition: border-color .2s ease, background-color .2s ease;
}
.pie-campo::placeholder { color: rgba(255, 248, 247, .85); opacity: 1; }
.pie-campo:focus { outline: none; border-color: #EDBFBE; background: rgba(255, 255, 255, .05); }
.pie-campo[aria-invalid="true"] { border-color: #F3A3A3; }
.pie-scelta {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23FFF8F7' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 15px center;
}
.pie-scelta:invalid { color: rgba(255, 248, 247, .85); }
.pie-scelta option { color: #3B1730; }
.pie-spunta {
  width: 15px;
  height: 15px;
  margin-top: 1px;
  flex-shrink: 0;
  border: 1px solid rgba(255, 248, 247, .8);
  appearance: none;
  cursor: pointer;
  transition: background-color .2s ease, box-shadow .2s ease;
}
.pie-spunta:checked { background: #EDBFBE; box-shadow: inset 0 0 0 2px #3B1730; }
.pie-spunta:focus-visible { outline: 2px solid #EDBFBE; outline-offset: 2px; }
.pie-spunta[aria-invalid="true"] { border-color: #F3A3A3; }
.pie-iscriviti {
  padding: 14px 28px 15px;
  font-size: 14px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #3B1730;
  background: #EDBFBE;
  border: 1px solid #EDBFBE;
  cursor: pointer;
  transition: color .25s ease, background-color .25s ease, border-color .25s ease;
}
.pie-iscriviti:hover { color: #FFF8F7; background: transparent; border-color: #FFF8F7; }
.pie-iscriviti:focus-visible { outline: 2px solid #EDBFBE; outline-offset: 3px; }

.pie-chiaro { color: #3B1730; background: #FBEFEE; }

.pie-vantaggi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding-top: 45px; padding-bottom: 30px; text-align: center; }
.pie-icona { display: block; width: 40px; height: 40px; margin: 0 auto 20px; }
.pie-vantaggio-testo { display: block; font-size: 14px; line-height: 1.15; letter-spacing: .07em; text-transform: uppercase; }
@media (max-width: 767px) {
  .pie-icona { width: 30px; height: 30px; margin-bottom: 10px; }
  .pie-vantaggio-testo { font-size: 11px; }
}

.pie-logo { display: flex; align-items: center; padding-block: 50px; }
.pie-linea { flex: 1; height: 1px; background: #3B1730; }
.pie-linea-sx { transform-origin: right; }
.pie-linea-dx { transform-origin: left; }
.pie-logo-segno { display: block; width: 132px; margin-inline: 6%; color: #3B1730; }
.pie-marchio .lettera { transform-box: fill-box; }

/* social: quadrati con il bordo che si ritira mentre il fondo si riempie */
.pie-social { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px; padding-inline: 16px; }
.pie-quadro {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  color: #3B1730;
  transition: color .25s ease, background-color .25s ease;
}
.pie-bordo-a, .pie-bordo-b { position: absolute; inset: 0; pointer-events: none; }
.pie-bordo-a::before, .pie-bordo-a::after, .pie-bordo-b::before, .pie-bordo-b::after {
  content: "";
  position: absolute;
  background: #3B1730;
  transition: transform .5s cubic-bezier(.45, 0, .14, 1.03);
}
.pie-bordo-a::before { top: 0; left: 0; right: 0; height: 1px; transform: scaleX(.95); transform-origin: left top; }
.pie-bordo-a::after { top: 0; bottom: 0; left: 0; width: 1px; transform-origin: left bottom; }
.pie-bordo-b::before { bottom: 0; left: 0; right: 0; height: 1px; transform: scaleX(.95); transform-origin: right bottom; }
.pie-bordo-b::after { top: 0; bottom: 0; right: 0; width: 1px; transform-origin: right top; }
.pie-quadro svg { position: relative; }
@media (hover: hover) {
  .pie-quadro:hover { color: #fff; background: #3B1730; transition-delay: .2s; }
  .pie-quadro:hover .pie-bordo-a::before { transform: scaleX(0); transform-origin: right top; }
  .pie-quadro:hover .pie-bordo-a::after { transform: scaleY(0); transform-origin: left top; }
  .pie-quadro:hover .pie-bordo-b::before { transform: scaleX(0); transform-origin: left bottom; }
  .pie-quadro:hover .pie-bordo-b::after { transform: scaleY(0); transform-origin: right bottom; }
}
.pie-quadro:focus-visible { outline: 2px solid var(--accento); outline-offset: 3px; }

/* due colonne centrate con un divisorio verticale */
.pie-nav { display: flex; max-width: 800px; margin-inline: auto; padding: 50px 8px; }
.pie-colonna { flex: 1 1 50%; padding-inline: 10px; text-align: center; }
.pie-colonna + .pie-colonna { border-left: 1px solid #3B1730; }
.pie-colonna li { padding-block: 5px; }
.pie-titolo { font-size: 14px; font-weight: 400; letter-spacing: .08em; text-transform: uppercase; }
.pie-link { font-size: 14px; line-height: 1.4; }
.pie-link span { position: relative; }
.pie-link span::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 100%;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right bottom;
  transition: transform .35s cubic-bezier(.45, 0, .14, 1.03);
}
.pie-link:hover span::after, .pie-link:focus-visible span::after { transform: scaleX(1); transform-origin: left bottom; }

.pie-blocco { padding-top: 10px; padding-bottom: 40px; }
.pie-pagamenti { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; color: #3B1730; }
.pie-pagamenti svg { display: block; width: 64px; height: 40px; }
.pie-badge {
  display: flex;
  align-items: center;
  height: 40px;
  padding-inline: 12px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .06em;
  text-transform: uppercase;
  background: #fff;
  border: 1px solid rgba(59, 23, 48, .18);
  border-radius: 5px;
}

.pie-fondo { padding: 24px 0 30px; font-size: 13px; line-height: 1.55; letter-spacing: .04em; border-top: 1px solid rgba(59, 23, 48, .7); }

/* Area di testo con etichetta flottante (modulo contatti) */
.campo-f textarea {
  display: block;
  width: 100%;
  min-height: 150px;
  padding: 26px 14px 10px;
  font-size: 16px;
  color: #3B1730;
  background: #fff;
  border: 1px solid rgba(59, 23, 48, .28);
  border-radius: 12px;
  resize: vertical;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.campo-f textarea:focus + label,
.campo-f textarea:not(:placeholder-shown) + label { transform: translateY(-11px) scale(.78); }
.campo-f textarea:focus {
  outline: none;
  border-color: var(--accento);
  box-shadow: 0 0 0 1px var(--accento);
}

/* ---------- Pannello di gestione (anteprima) ---------- */
.campo-g {
  display: block;
  width: 100%;
  height: 46px;
  padding: 0 12px;
  font-size: 15px;
  color: #3B1730;
  background: #fff;
  border: 1px solid rgba(59, 23, 48, .28);
  border-radius: 10px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.campo-g:focus {
  outline: none;
  border-color: var(--accento);
  box-shadow: 0 0 0 1px var(--accento);
}


/* ---------- Elenchi: storie, filtri, tessere editoriali ---------- */

/* miniature tonde o quadrate con la stessa logica delle schede: foto di prodotto fusa con la tinta, foto indossata a tutta area */
.storia-foto, .versione-tessera, .insieme-tessera, .visto-tessera {
  display: block;
  overflow: hidden;
  background: var(--tinta, #F1ECEE);
  isolation: isolate;
}
.storia-foto img, .versione-tessera img, .insieme-tessera img, .visto-tessera img { width: 100%; height: 100%; object-fit: cover; }
.fondo > img { object-fit: contain; mix-blend-mode: multiply; }

.storie {
  display: flex;
  gap: 1.1rem;
  margin: 2.25rem -1.25rem 0;
  padding: .4rem 1.25rem .6rem;
  overflow-x: auto;
  scrollbar-width: none;
}
.storie::-webkit-scrollbar { display: none; }
.storia { display: flex; flex-direction: column; align-items: center; width: 104px; text-align: center; cursor: pointer; }
.storia-foto {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  outline: 1.5px solid rgba(59, 23, 48, .16);
  outline-offset: 3px;
  transition: outline-color .25s ease, transform .5s cubic-bezier(.19, 1, .22, 1);
}
.storia-foto img { border-radius: 50%; }
.storia:hover .storia-foto { transform: scale(1.06); }
.storia[aria-pressed="true"] .storia-foto { outline: 2.5px solid var(--accento); }
.storia-nome { margin-top: .8rem; font-size: 14px; font-weight: 500; line-height: 1.2; }
.storia-n { margin-top: 2px; font-size: 12px; color: rgba(59, 23, 48, .6); }

.chip-n {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1;
  background: rgba(59, 23, 48, .08);
  border-radius: 999px;
}
.chip[aria-pressed="true"] .chip-n { background: rgba(255, 255, 255, .22); }
.chip-n.chip-attivi { color: #fff; background: var(--accento); }

/* filtri scelti */
.scelto {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .4rem .5rem .4rem .9rem;
  font-size: 14px;
  background: var(--tenue);
  border-radius: 999px;
  cursor: pointer;
  transition: background-color .2s ease;
}
.scelto > span[aria-hidden] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  font-size: 15px;
  line-height: 1;
  background: #fff;
  border-radius: 50%;
}
.scelto:hover { background: #EDBFBE; }

dialog.filtri { margin-right: auto; }

/* intervallo di prezzo: due cursori sulla stessa pista */
.prezzo-doppio { position: relative; height: 28px; }
.prezzo-pista { position: absolute; left: 0; right: 0; top: 12px; height: 4px; background: rgba(59, 23, 48, .12); border-radius: 4px; }
.prezzo-tratto { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: var(--accento); border-radius: 4px; }
.prezzo-doppio input[type="range"] {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 28px;
  margin: 0;
  background: none;
  appearance: none;
  -webkit-appearance: none;
  pointer-events: none;
}
.prezzo-doppio input[type="range"]::-webkit-slider-thumb {
  width: 24px;
  height: 24px;
  background: #fff;
  border: 2px solid var(--accento);
  border-radius: 50%;
  box-shadow: 0 2px 8px -2px rgba(59, 23, 48, .4);
  cursor: grab;
  pointer-events: auto;
  -webkit-appearance: none;
}
.prezzo-doppio input[type="range"]::-moz-range-thumb {
  width: 20px;
  height: 20px;
  background: #fff;
  border: 2px solid var(--accento);
  border-radius: 50%;
  cursor: grab;
  pointer-events: auto;
}
.prezzo-doppio input[type="range"]::-moz-range-track { background: none; }
.prezzo-doppio input[type="range"]:focus-visible { outline: none; }
.prezzo-doppio input[type="range"]:focus-visible::-webkit-slider-thumb { outline: 2px solid var(--accento); outline-offset: 3px; }

/* tessera editoriale tra le schede: occupa due colonne e l'altezza della riga */
.racconto {
  position: relative;
  grid-column: span 2;
  display: block;
  min-height: 340px;
  overflow: hidden;
  color: #fff;
  border-radius: 22px;
  isolation: isolate;
}
.racconto-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.3s cubic-bezier(.19, 1, .22, 1); }
.racconto:hover .racconto-img { transform: scale(1.05); }
.racconto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(59, 23, 48, .92) 0%, rgba(59, 23, 48, .6) 36%, rgba(59, 23, 48, 0) 74%); }
.racconto-testo { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; padding: 1.5rem; }
@media (min-width: 1024px) { .racconto-testo { padding: 2rem; } }
@media (max-width: 767px) { .griglia-elenco[data-densita="ampia"] .racconto { grid-column: span 1; } }

/* ---------- Scheda prodotto: galleria, versioni, set, visti di recente ---------- */

/* su mobile un carosello che scorre in orizzontale, su desktop una griglia di tessere */
.galleria {
  display: flex;
  gap: 10px;
  margin: 0 -1.25rem;
  padding: 0 1.25rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.galleria::-webkit-scrollbar { display: none; }
.galleria-voce {
  position: relative;
  flex: 0 0 86%;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: var(--tinta, #F1ECEE);
  border-radius: 22px;
  scroll-snap-align: center;
  cursor: zoom-in;
  isolation: isolate;
}
.galleria-voce:only-child { flex-basis: 100%; }
.galleria-img { position: absolute; inset: 0; width: 100%; height: 100%; transition: transform 1.2s cubic-bezier(.19, 1, .22, 1); }
.galleria-voce.fondo .galleria-img { object-fit: contain; mix-blend-mode: multiply; }
.galleria-voce.scena .galleria-img { object-fit: cover; }
.galleria-voce:hover .galleria-img { transform: scale(1.04); }
.galleria-punti { display: flex; justify-content: center; gap: 6px; margin-top: 14px; }
.galleria-punti span { width: 6px; height: 6px; background: rgba(59, 23, 48, .2); border-radius: 6px; transition: width .3s ease, background-color .3s ease; }
.galleria-punti span.attivo { width: 20px; background: #3B1730; }
@media (min-width: 1024px) {
  .galleria { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; overflow: visible; }
  .galleria-voce { flex: none; }
  .galleria-prima { grid-column: span 2; aspect-ratio: 1 / .92; }
  .galleria-larga { grid-column: span 2; aspect-ratio: 16 / 10; }
  .galleria-punti { display: none; }
}

/* foto a tutto schermo */
dialog.visore::backdrop { background: #fff; }
.visore-img { cursor: zoom-in; transition: transform .4s cubic-bezier(.19, 1, .22, 1); }
.visore-img.ingrandita { transform: scale(2.3); cursor: zoom-out; }

.versione-tessera { width: 78px; height: 78px; border: 1.5px solid transparent; border-radius: 16px; transition: border-color .2s ease, transform .4s cubic-bezier(.19, 1, .22, 1); }
.versione:hover .versione-tessera { transform: translateY(-3px); }
.versione[aria-current="true"] .versione-tessera { border-color: var(--accento); }

[data-compra].fatto { background: #3B1730; }

.insieme-tessera { flex: none; width: 96px; height: 96px; border-radius: 18px; }
.insieme-casella { flex: none; width: 20px; height: 20px; accent-color: var(--accento); cursor: pointer; }

.visti { scrollbar-width: none; }
.visti::-webkit-scrollbar { display: none; }
.visto { flex: 0 0 150px; }
.visto-tessera { aspect-ratio: 4 / 5; border-radius: 18px; transition: transform .5s cubic-bezier(.19, 1, .22, 1); }
.visto a:hover .visto-tessera { transform: translateY(-4px); }


/* ===== WordPress, WooCommerce e Contact Form 7 ===== */
/* WordPress, WooCommerce e Contact Form 7 con l'aspetto del tema.
   Molte regole hanno selettori lunghi perché devono avere la precedenza su quelle di WooCommerce. */

/* ---------- WordPress ---------- */

.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.screen-reader-text:focus {
  z-index: 100000;
  width: auto;
  height: auto;
  padding: 12px 20px;
  clip: auto;
  color: #fff;
  background: #3B1730;
  border-radius: 999px;
}
/* la barra in alto prende il prugna scelto nel Personalizza */
.barra { background: var(--color-prugna); }
.notizie li { text-wrap: balance; }
/* sul telefono un messaggio lungo va su due righe: la barra si alza un poco invece di toccare i bordi */
@media (max-width: 767px) {
  .barra > .contenitore { height: auto; min-height: 40px; padding-block: 7px; }
  .notizie li { line-height: 1.35; }
}

.admin-bar .testata { top: 32px; }
.admin-bar .barra-filtri { top: 100px; }
@media (max-width: 782px) {
  .admin-bar .testata { top: 46px; }
  .admin-bar .barra-filtri { top: 114px; }
}
@media (max-width: 600px) {
  .admin-bar .testata { top: 0; }
  .admin-bar .barra-filtri { top: 68px; }
}
#wpadminbar img { display: inline; }

.testata .logo img, .testata .custom-logo { width: auto; height: 44px; max-width: 160px; object-fit: contain; }
.pie-logo-segno img { width: 100%; height: auto; max-height: 48px; object-fit: contain; }

.prosa h2 { margin-top: 2rem; font-family: var(--font-display); font-size: 1.9rem; line-height: 1.1; }
.prosa h3 { margin-top: 1.6rem; font-size: 1.2rem; font-weight: 500; }
.prosa ul { margin-top: 1rem; padding-left: 1.25rem; list-style: disc; }
.prosa ol { margin-top: 1rem; padding-left: 1.25rem; list-style: decimal; }
.prosa li + li { margin-top: .4rem; }
.prosa blockquote { margin: 1.5rem 0; padding-left: 1.25rem; border-left: 2px solid var(--accento); font-family: var(--font-display); font-size: 1.4rem; }
.prosa img { height: auto; border-radius: 18px; }
.prosa .alignleft { float: left; margin: .4rem 1.5rem 1rem 0; }
.prosa .alignright { float: right; margin: .4rem 0 1rem 1.5rem; }
.prosa .aligncenter { display: block; margin-inline: auto; }
.prosa .wp-caption-text, .prosa figcaption { margin-top: .5rem; font-size: 14px; color: rgba(59, 23, 48, .65); }
.prosa table { width: 100%; margin-top: 1.5rem; border-collapse: collapse; font-size: 15px; }
.prosa th, .prosa td { padding: .7rem .5rem; text-align: left; border-bottom: 1px solid rgba(59, 23, 48, .12); }

.nav-links, .woocommerce nav.woocommerce-pagination ul { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; border: 0; }
.nav-links .page-numbers,
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  display: inline-flex;
  min-width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  font-size: 15px;
  border: 1px solid rgba(59, 23, 48, .2);
  border-radius: 999px;
}
.woocommerce nav.woocommerce-pagination ul li { border: 0; }
.nav-links .page-numbers.current, .woocommerce nav.woocommerce-pagination ul li span.current { color: #fff; background: #3B1730; border-color: #3B1730; }

/* ---------- avvisi ---------- */

.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error,
.woocommerce-page .woocommerce-message,
.woocommerce-page .woocommerce-info,
.woocommerce-page .woocommerce-error {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  margin: 0 0 24px;
  padding: 16px 20px;
  font-size: 15px;
  color: #3B1730;
  background: #FBEFEE;
  border: 0;
  border-radius: 18px;
  list-style: none;
}
.woocommerce .woocommerce-error, .woocommerce-page .woocommerce-error { background: #FDECEC; color: #8A1C1C; }
.woocommerce .woocommerce-message::before,
.woocommerce .woocommerce-info::before,
.woocommerce .woocommerce-error::before { display: none; }
.woocommerce .woocommerce-message .button,
.woocommerce .woocommerce-info .button { order: 2; margin-left: auto; }
.woocommerce .woocommerce-error li { width: 100%; }

/* ---------- pulsanti ---------- */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-page a.button,
.woocommerce-page button.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 24px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.2;
  color: #3B1730;
  background: #fff;
  border: 1px solid rgba(59, 23, 48, .25);
  border-radius: 999px;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover { color: #3B1730; background: #FBEFEE; border-color: #3B1730; }
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #place_order,
.woocommerce .checkout-button,
.woocommerce .single_add_to_cart_button,
.woocommerce button.btn-pieno {
  color: #fff;
  background: var(--accento);
  border-color: var(--accento);
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce #place_order:hover,
.woocommerce .checkout-button:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce button.btn-pieno:hover { color: #fff; background: #3B1730; border-color: #3B1730; }
.woocommerce button.btn-scuro { color: #fff; background: #3B1730; border-color: #3B1730; }
.woocommerce button.btn-scuro:hover { color: #fff; background: var(--accento); border-color: var(--accento); }
.woocommerce button.button:disabled,
.woocommerce button.button.disabled,
.woocommerce a.button.disabled { opacity: .45; }
.woocommerce .btn.w-full, .woocommerce button.w-full { width: 100%; }

/* ---------- campi dei moduli di WooCommerce (dati dell'account, indirizzi) ---------- */

.woocommerce form .form-row { margin: 0 0 14px; padding: 0; }
.woocommerce form .form-row label { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 500; line-height: 1.4; }
.woocommerce form .form-row .required { color: var(--accento); text-decoration: none; border: 0; }
.woocommerce form .form-row .optional { font-weight: 400; color: rgba(59, 23, 48, .55); }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection--single {
  width: 100%;
  min-height: 52px;
  padding: 12px 14px;
  font-size: 16px;
  color: #3B1730;
  background: #fff;
  border: 1px solid rgba(59, 23, 48, .28);
  border-radius: 12px;
  box-shadow: none;
}
.woocommerce .select2-container .select2-selection--single .select2-selection__rendered { padding: 0; line-height: 26px; color: #3B1730; }
.woocommerce .select2-container .select2-selection--single .select2-selection__arrow { top: 12px; right: 10px; }
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
  outline: none;
  border-color: var(--accento);
  box-shadow: 0 0 0 1px var(--accento);
}
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select { border-color: #B42318; }
.woocommerce form .form-row .woocommerce-input-wrapper { display: block; }
.woocommerce form .form-row-first, .woocommerce form .form-row-last { width: 100%; }
@media (min-width: 640px) {
  .woocommerce form .form-row-first, .woocommerce form .form-row-last { float: left; width: calc(50% - 6px); }
  .woocommerce form .form-row-last { margin-left: 12px; }
  .woocommerce form .form-row-wide { clear: both; }
}
.woocommerce form .clear { clear: both; }
.woocommerce fieldset { margin: 28px 0 0; padding: 0; border: 0; }
.woocommerce fieldset legend { margin-bottom: 14px; font-family: var(--font-display); font-size: 1.6rem; }

/* etichette flottanti anche quando tra campo ed etichetta WooCommerce inserisce il misuratore della password */
.campo-f input:focus ~ label,
.campo-f input:not(:placeholder-shown) ~ label,
.campo-f select:valid ~ label,
.campo-f select:focus ~ label { transform: translateY(-11px) scale(.78); }
.campo-f.woocommerce-invalid input,
.campo-f.woocommerce-invalid select { border-color: #B42318; box-shadow: 0 0 0 1px #B42318; }
.checkout-inline-error-message { margin-top: 6px; font-size: 13px; color: #B42318; }
.woocommerce-password-strength { margin-top: 8px; padding: 6px 12px; font-size: 13px; font-weight: 500; text-align: left; border-radius: 10px; background: #F7E6E8; color: #8A1C1C; }
.woocommerce-password-strength.good { background: #FBF0DA; color: #7A5300; }
.woocommerce-password-strength.strong { background: #E3F2EA; color: #1F6B45; }
.woocommerce-password-hint { display: block; margin-top: 6px; font-size: 12px; line-height: 1.4; color: rgba(59, 23, 48, .65); }

/* caricamento di WooCommerce sopra carrello e riepilogo */
.blockUI.blockOverlay { position: relative; background: rgba(255, 255, 255, .6) !important; opacity: 1 !important; }
.blockUI.blockOverlay::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 26px;
  height: 26px;
  margin: -13px 0 0 -13px;
  border: 2px solid rgba(59, 23, 48, .2);
  border-top-color: #3B1730;
  border-radius: 50%;
  animation: giro .7s linear infinite;
}

/* ---------- accesso, registrazione, recupero della password ---------- */

.lola-avvisi-scheda .woocommerce-error,
.lola-avvisi-scheda .woocommerce-message,
.lola-avvisi-scheda .woocommerce-info { margin: 0; padding: 12px 16px; font-size: 14px; border-radius: 14px; }
.lola-avvisi-scheda .woocommerce-error li + li { margin-top: 4px; }
.lola-tipo-conto { margin: 0; padding: 0; border: 0; }
.lola-campi-pro[hidden] { display: none; }

/* ---------- area clienti ---------- */

.lola-conto-attivita { margin-top: 32px; padding: 24px; background: var(--tenue); border-radius: 22px; }
.lola-conto-attivita legend { float: left; width: 100%; margin-bottom: 12px; font-family: var(--font-display); font-size: 1.6rem; }
.lola-conto-fissi { clear: both; display: grid; gap: 2px; margin-bottom: 18px; font-size: 15px; }
.lola-conto-fissi span:first-child { font-weight: 500; }
.lola-conto-fissi small { margin-top: 6px; font-size: 13px; color: rgba(59, 23, 48, .65); }
.woocommerce-MyAccount-content .woocommerce-EditAccountForm,
.woocommerce-MyAccount-content .woocommerce-address-fields,
.woocommerce-MyAccount-content > form { max-width: 760px; }
.woocommerce-MyAccount-content .woocommerce-Addresses { display: grid; gap: 24px; }
@media (min-width: 768px) { .woocommerce-MyAccount-content .woocommerce-Addresses { grid-template-columns: 1fr 1fr; } }
.woocommerce-MyAccount-content .woocommerce-Address { padding: 28px; border: 1px solid rgba(59, 23, 48, .15); border-radius: 28px; }
.woocommerce-MyAccount-content .woocommerce-Address-title { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.woocommerce-MyAccount-content .woocommerce-Address-title h2 { font-family: var(--font-display); font-size: 1.75rem; }
.woocommerce-MyAccount-content .woocommerce-Address-title a { font-size: 14px; text-decoration: underline; text-underline-offset: 4px; }
.woocommerce-MyAccount-content .woocommerce-Address address { margin-top: 12px; font-style: normal; line-height: 1.6; }
.woocommerce-MyAccount-content > p:first-child { font-size: 16px; color: rgba(59, 23, 48, .8); }
.woocommerce-MyAccount-content mark { padding: 0; font-weight: 500; color: inherit; background: none; }
.woocommerce-MyAccount-content .woocommerce-order-details,
.woocommerce-MyAccount-content .woocommerce-customer-details { margin-top: 32px; }
.woocommerce-order-details__title,
.woocommerce-column__title { margin-bottom: 14px; font-family: var(--font-display); font-size: 1.75rem; }
.woocommerce-customer-details .woocommerce-columns--addresses { display: grid; gap: 24px; }
@media (min-width: 768px) { .woocommerce-customer-details .woocommerce-columns--addresses { grid-template-columns: 1fr 1fr; } }
.woocommerce-customer-details address { padding: 24px; font-style: normal; line-height: 1.6; border: 1px solid rgba(59, 23, 48, .15); border-radius: 22px; }
.woocommerce-customer-details--email, .woocommerce-customer-details--phone { margin-top: 6px; }
.woocommerce-OrderUpdates { margin: 16px 0 0; padding: 0; list-style: none; }
.woocommerce-OrderUpdate { padding: 16px 20px; background: var(--tenue); border-radius: 18px; }
.woocommerce-OrderUpdate + .woocommerce-OrderUpdate { margin-top: 10px; }
.woocommerce-OrderUpdate-meta { font-size: 13px; color: rgba(59, 23, 48, .6); }
.order-again { margin-top: 24px; }

/* ---------- tabelle: dettaglio dell'ordine ---------- */

.woocommerce table.shop_table {
  width: 100%;
  margin: 0 0 24px;
  text-align: left;
  border: 1px solid rgba(59, 23, 48, .12);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 22px;
  overflow: hidden;
}
.woocommerce table.shop_table th { padding: 14px 16px; font-size: 13px; font-weight: 500; color: rgba(59, 23, 48, .6); }
.woocommerce table.shop_table td { padding: 16px; border-top: 1px solid rgba(59, 23, 48, .1); }
.woocommerce table.shop_table tfoot th { color: #3B1730; font-size: 15px; border-top: 1px solid rgba(59, 23, 48, .1); }
.woocommerce table.shop_table td.product-name a { font-weight: 500; }
.woocommerce table.shop_table .wc-item-meta { margin: 4px 0 0; padding: 0; list-style: none; font-size: 13px; color: rgba(59, 23, 48, .65); }
.woocommerce table.shop_table .wc-item-meta p { display: inline; }

/* ---------- carrello ---------- */

.quantita-passi .quantity { display: flex; }
.quantita-passi .qty {
  width: 2.25rem;
  height: 40px;
  padding: 0;
  font-weight: 500;
  text-align: center;
  color: #3B1730;
  background: transparent;
  border: 0;
  appearance: textfield;
  -moz-appearance: textfield;
}
.quantita-passi .qty::-webkit-outer-spin-button, .quantita-passi .qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.quantita-passi .qty:focus { outline: none; }
.quantita-passi:focus-within { border-color: #3B1730; }
.quantita-passi.singolo { padding: 0 14px; }
.quantita-passi button:hover { color: var(--accento); }
.woocommerce-cart-form .product-thumbnail img { display: block; }
.cart_totals .coupon .campo-f { min-width: 0; }

/* ---------- cassa ---------- */

.cassa .spedizione { border-color: rgba(59, 23, 48, .25); }
.cassa .spedizione.sola,
.cassa .spedizione:has(input:checked) { border-color: var(--accento); background: var(--tenue); }
.cassa .pagamenti { margin-top: 12px; padding: 0; list-style: none; }
.cassa .pagamento-icone img { display: inline-block; max-height: 22px; width: auto; margin-left: 4px; vertical-align: middle; }
.cassa .payment_box p { margin: 0; }
.cassa .payment_box p + p { margin-top: 8px; }
.cassa .payment_box fieldset { margin: 0; }
.lola-rate legend { margin: 0; font-family: inherit; font-size: 14px; color: rgba(59, 23, 48, .8); }
.lola-rate-scelte { display: grid; gap: 10px; margin-top: 12px; }
.lola-rate-scelte label { display: flex; align-items: center; gap: 12px; cursor: pointer; color: #3B1730; }
.lola-rate-scelte input { width: 18px; height: 18px; accent-color: var(--accento); }
.cassa .woocommerce-NoticeGroup { margin-bottom: 8px; }
.cassa .woocommerce-terms-and-conditions-wrapper { margin-bottom: 16px; font-size: 13px; color: rgba(59, 23, 48, .7); }
.cassa .woocommerce-privacy-policy-text p { margin: 0 0 12px; }
.cassa .woocommerce-terms-and-conditions-wrapper .form-row { margin: 0; }
.cassa .woocommerce-form__label-for-checkbox { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; color: #3B1730; }
.cassa .woocommerce-form__label-for-checkbox input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--accento); }
.cassa .woocommerce-terms-and-conditions { max-height: 220px; margin-bottom: 12px; padding: 16px; overflow: auto; background: var(--tenue); border-radius: 14px; }
.woocommerce .cassa #place_order { width: 100%; padding: 18px 24px; font-size: 17px; }
#place_order.loading, #place_order:disabled { opacity: .7; pointer-events: none; }
.lola-istruzioni h2, .lola-istruzioni h3 { margin: 16px 0 8px; font-family: inherit; font-size: 15px; font-weight: 500; }
.lola-istruzioni ul { margin: 0; padding: 0; list-style: none; }
.lola-istruzioni .wc-bacs-bank-details li { margin-top: 4px; }
.lola-istruzioni .wc-bacs-bank-details strong { font-weight: 500; }

/* briciole: WooCommerce azzera margini e colori, qui tornano quelli del tema (stesso contenitore delle pagine) */
.woocommerce .woocommerce-breadcrumb.contenitore { max-width: 1360px; margin: 0 auto; padding: 20px 20px 0; font-size: 13px; color: rgba(59, 23, 48, .6); }
.woocommerce .woocommerce-breadcrumb.contenitore a { color: inherit; }
.woocommerce .woocommerce-breadcrumb.contenitore a:hover { color: var(--accento); }
@media (min-width: 768px) { .woocommerce .woocommerce-breadcrumb.contenitore { padding-inline: 40px; } }

/* ---------- scheda prodotto: modulo d'acquisto di WooCommerce ---------- */

/* WooCommerce mette la colonna "summary" a destra al 48%: nella scheda Lola la disposizione è della griglia del tema */
.woocommerce div.product div.summary.acquisto-colonna { float: none; width: auto; margin: 0; }
.woocommerce div.product .product_title { margin: 16px 0 0; padding: 0; clear: none; }
.woocommerce div.product form.cart { margin: 0; }

.lola-acquisto form.cart { display: flex; flex-wrap: wrap; align-items: stretch; gap: 12px; margin: 0; }
.lola-acquisto form.cart .quantity { display: flex; }
.lola-acquisto form.cart .quantity .qty { width: 96px; height: 54px; font-size: 16px; font-weight: 500; }
.lola-acquisto form.cart .single_add_to_cart_button { flex: 1 1 220px; min-height: 54px; font-size: 16px; }
.lola-acquisto form.cart .single_add_to_cart_button.loading { opacity: .7; pointer-events: none; }
.lola-acquisto .single_add_to_cart_button.lola-compra { min-width: 230px; justify-content: space-between; gap: 16px; padding-inline: 28px; white-space: nowrap; }
.lola-acquisto form.cart .single_add_to_cart_button.fatto { background: var(--accento); border-color: var(--accento); }
/* quantità con i pulsanti − e + aggiunti da prodotto.js */
.lola-acquisto form.cart .quantity.lola-passi { align-items: center; height: 54px; padding: 0 5px; border: 1px solid rgba(59, 23, 48, .25); border-radius: 999px; }
.lola-acquisto form.cart .quantity.lola-passi .qty { width: 40px; height: 50px; padding: 0; border: 0; background: transparent; appearance: textfield; -moz-appearance: textfield; }
.lola-passi .qty::-webkit-outer-spin-button, .lola-passi .qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.lola-passo { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 999px; cursor: pointer; transition: background-color .2s ease; }
.lola-passo:hover { background: var(--color-cipria, #FBEFEE); }
.lola-passo:focus-visible { outline: 2px solid var(--accento); outline-offset: 2px; }
.lola-acquisto .variations { width: 100%; margin-bottom: 12px; }
.lola-acquisto .variations th, .lola-acquisto .variations td { display: block; padding: 0 0 8px; text-align: left; }
.lola-acquisto .variations select { width: 100%; min-height: 48px; padding: 0 14px; border: 1px solid rgba(59, 23, 48, .28); border-radius: 12px; }
.lola-acquisto .reset_variations { font-size: 14px; }
.lola-acquisto .woocommerce-variation-price { margin-bottom: 10px; font-size: 1.3rem; font-weight: 500; }
.lola-acquisto .stock { margin-bottom: 8px; font-size: 14px; }
.lola-acquisto .product_meta { display: none; }
.prezzo-scheda del, .scheda-prezzo del { margin-right: 6px; font-size: .7em; font-weight: 400; color: rgba(59, 23, 48, .45); }
.prezzo-scheda ins, .scheda-prezzo ins { text-decoration: none; }
.woocommerce-price-suffix { font-size: .55em; font-weight: 400; color: rgba(59, 23, 48, .6); }
.scheda-prezzo .woocommerce-price-suffix { display: block; font-size: 12px; }

/* pulsante di aggiunta rapida nelle schede: stato di WooCommerce durante l'aggiunta */
.scheda-aggiungi.loading { opacity: .7; pointer-events: none; }
.scheda-aggiungi.added { color: #fff; background: var(--accento); }
.scheda-tessera .added_to_cart { display: none; }

/* ---------- Contact Form 7 ---------- */

.wpcf7 form { margin: 0; }
.wpcf7 .wpcf7-form-control-wrap { display: block; }
.lola-modulo-griglia { display: grid; gap: 12px; }
@media (min-width: 640px) { .lola-modulo-griglia { grid-template-columns: 1fr 1fr; } }
.lola-contatto .wpcf7 input[type="text"],
.lola-contatto .wpcf7 input[type="email"],
.lola-contatto .wpcf7 input[type="tel"],
.lola-contatto .wpcf7 select,
.lola-contatto .wpcf7 textarea {
  width: 100%;
  min-height: 52px;
  padding: 12px 14px;
  font-size: 16px;
  color: #3B1730;
  background: #fff;
  border: 1px solid rgba(59, 23, 48, .28);
  border-radius: 12px;
}
.lola-contatto .wpcf7 select, .lola-contatto .wpcf7 textarea { margin-top: 12px; }
.lola-contatto .wpcf7 textarea { min-height: 160px; }
.lola-contatto .wpcf7 input:focus, .lola-contatto .wpcf7 select:focus, .lola-contatto .wpcf7 textarea:focus { outline: none; border-color: var(--accento); box-shadow: 0 0 0 1px var(--accento); }
.lola-contatto .wpcf7 .wpcf7-acceptance { display: block; margin-top: 18px; font-size: 14px; }
.lola-contatto .wpcf7 .wpcf7-acceptance input { width: 18px; height: 18px; margin-right: 10px; accent-color: var(--accento); vertical-align: -3px; }
.lola-contatto .wpcf7 input[type="submit"] { width: 100%; margin-top: 22px; padding: 16px; font-size: 15px; font-weight: 500; color: #fff; background: var(--accento); border-radius: 999px; cursor: pointer; }
.lola-contatto .wpcf7 input[type="submit"]:hover { background: #3B1730; }
.wpcf7 .wpcf7-not-valid-tip { margin-top: 6px; font-size: 13px; color: #B42318; }
.wpcf7 form .wpcf7-response-output { margin: 18px 0 0; padding: 12px 16px; font-size: 14px; border: 0; border-radius: 14px; background: rgba(255, 255, 255, .7); }
.wpcf7 .wpcf7-spinner { margin: 12px auto 0; display: block; }

/* newsletter nel piè di pagina */
.pie-modulo-griglia { display: grid; gap: 12px; }
@media (min-width: 768px) { .pie-modulo-griglia { grid-template-columns: 1fr 1fr 190px; } }
.pie-modulo .wpcf7-acceptance { display: block; margin-top: 16px; font-size: 12.5px; line-height: 1.4; letter-spacing: .02em; }
.pie-modulo .wpcf7-acceptance input { width: 15px; height: 15px; margin: 0 10px 0 0; vertical-align: -2px; border: 1px solid rgba(255, 248, 247, .8); appearance: none; cursor: pointer; }
.pie-modulo .wpcf7-acceptance input:checked { background: #EDBFBE; box-shadow: inset 0 0 0 2px #3B1730; }
.pie-modulo .wpcf7-acceptance a { font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.pie-modulo .pie-invio { margin-top: 24px; text-align: center; }
.pie-modulo .wpcf7 form .wpcf7-response-output { color: #3B1730; text-align: center; }
.pie-modulo .wpcf7-not-valid-tip { color: #F3A3A3; }

/* ---------- commenti degli articoli ---------- */

.comment-list { list-style: none; padding: 0; }
.comment-list .comment { padding: 20px 0; border-top: 1px solid rgba(59, 23, 48, .12); }
.comment-respond input[type="text"], .comment-respond input[type="email"], .comment-respond textarea {
  width: 100%; padding: 12px 14px; border: 1px solid rgba(59, 23, 48, .28); border-radius: 12px;
}
.comment-respond .submit { margin-top: 12px; padding: 14px 24px; color: #fff; background: #3B1730; border-radius: 999px; cursor: pointer; }

/* ---------- stampa ---------- */

@media print {
  .admin-bar .testata, #wpadminbar { display: none !important; }
}
