/* Chiara & Cristian (demo) · CSS del sito (fuori da ogni @layer: vince sul kit senza !important)
   Ricetta di partenza: nozze. Colori, carta e caratteri presi dall'invito:
   verde salvia della busta, rosa cipria del monogramma, oro della cornice, carta avorio. */

:root {
  --sw-c1: #b4604c;            /* salvia, un tono sotto la busta per leggibilità */
  --sw-c2: #d9777f;            /* rosa cipria */
  --sw-c3: #fdf6f1;            /* carta */
  --sw-c4: #4a3530;            /* inchiostro */
  --sw-c5: #2a1d19;            /* notte */
  --sw-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sw-script: "Allura", "Cormorant Garamond", cursive;
  --sposi-salvia: #e2a28c;
  --sposi-salvia-chiaro: #fbe9e1;
  --sposi-rosa: #c85f6a;
  --sposi-oro: #c9a24e;
  --sposi-mano: "Amatic SC", "Montserrat", sans-serif;
  --sposi-testata: 4.25rem;
  scroll-padding-top: var(--sposi-testata);
}

html, body { background: var(--sw-c3); }

/* ---------- Titoli: Cormorant al posto del Cinzel della ricetta, corsivo a mano in Allura ---------- */
[data-sw-recipe=nozze] .sw-chapter > h2 {
  font-family: var(--sw-serif);
  font-weight: 500;
  text-transform: none;
  letter-spacing: .01em;
  color: var(--sw-c4);
  font-size: clamp(2.3rem, 5vw, 3.4rem);
}
[data-sw-recipe=nozze] .sw-chapter > h2::after { background: var(--sposi-oro); }
[data-sw-recipe=nozze] .sw-chapter > h2 em {
  font-family: var(--sw-script);
  font-style: normal;
  font-weight: 400;
  font-size: 1.35em;
  color: var(--sposi-rosa);
}
[data-sw-recipe=nozze] .sw-lead { font-family: var(--sw-serif); }

.sposi-occhiello {
  font-family: var(--sposi-mano);
  font-weight: 700;
  font-size: clamp(1.25rem, 2.4vw, 1.5rem);
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--sw-c1);
  margin: 0 0 .25rem;
}

/* ---------- Testata ---------- */

.sposi-marchio {
  font-family: var(--sw-script);
  font-size: 1.9rem;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: var(--sw-c4);
  line-height: 1;
}
.sposi-marchio span { color: var(--sposi-rosa); }
[data-sw-recipe=nozze] .sposi-testata .sw-menu__item > a {
  font-family: var(--sposi-mano);
  font-weight: 700;
  font-size: 1.3rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.sw-drawer__nav a { font-family: var(--sw-serif); font-size: 1.6rem; }

/* ---------- Benvenuti ---------- */
.sposi-benvenuto { padding-block-start: clamp(3rem, 8vw, 6rem); }
.sposi-benvenuto__testo { text-align: center; align-items: center; }
.sposi-nomi {
  font-family: var(--sw-script);
  font-weight: 400;
  font-size: clamp(3.6rem, 9vw, 6.2rem);
  line-height: 1;
  color: var(--sposi-rosa);
  margin: 0;
  text-transform: none;
  letter-spacing: 0;
}
.sposi-nomi span { color: var(--sposi-oro); font-size: .7em; }
.sposi-cartellino { margin: 0; display: flex; justify-content: center; }
.sposi-cartellino img {
  width: min(78%, 20rem);
  height: auto;
  transform: rotate(-4deg);
  transform-origin: 50% 0;
  filter: drop-shadow(0 .6rem 1.2rem rgba(90, 50, 40, .18));
}
@media (prefers-reduced-motion: no-preference) {
  .sposi-cartellino.is-in img { animation: sposi-dondola 6s ease-in-out infinite; }
}
@keyframes sposi-dondola {
  0%, 100% { transform: rotate(-4deg); }
  50%      { transform: rotate(2deg); }
}
.sposi-conto { margin-top: .75rem; }
.sposi-conto .sw-countdown__num { font-family: var(--sw-serif); color: var(--sw-c1); }
.sposi-conto .sw-countdown__label { font-family: var(--sposi-mano); font-weight: 700; letter-spacing: .12em; font-size: 1.1rem; }

/* ---------- Fascia di fiori: la fodera della busta come separatore ---------- */
.sposi-fiori {
  height: clamp(5rem, 12vw, 8.5rem);
  background: url(../img/fodera.webp) center / min(100%, 70rem) auto repeat-x;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 18%, #000 82%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 18%, #000 82%, transparent);
  opacity: .9;
}

/* ---------- Sezioni salvia ---------- */
.sposi-salvia {
  --sw-bg: var(--sposi-salvia-chiaro);
  background: var(--sposi-salvia-chiaro);
  max-width: none;
  padding-inline: max(1.25rem, calc((100% - 68rem) / 2));
}

/* ---------- Programma ---------- */
.sposi-programma .sw-timeline__when {
  font-family: var(--sposi-mano);
  font-weight: 700;
  font-size: 1.6rem;
  letter-spacing: .08em;
  color: var(--sposi-rosa);
}
.sposi-programma .sw-timeline__title { font-family: var(--sw-serif); font-weight: 600; font-size: 1.5rem; }

/* ---------- Location ---------- */
.sposi-mappa { min-height: 22rem; border: 6px solid #fff; box-shadow: 0 .5rem 1.5rem rgba(90, 50, 40, .12); }

/* ---------- Alloggi ---------- */
.sposi-alloggi .sw-card { background: #fff; border-top: 3px solid var(--sposi-salvia); }
.sposi-alloggi .sw-card h3 { font-family: var(--sw-serif); font-weight: 600; font-size: 1.45rem; }

/* ---------- Modulo ---------- */
.sposi-modulo {
  max-width: 46rem;
  margin-inline: auto;
  background: #fff;
  border-top: 4px solid var(--sposi-rosa);
}

/* ---------- Regalo ---------- */
.sposi-regalo {
  max-width: 34rem;
  margin: 1.5rem auto 0;
  padding: clamp(1.25rem, 4vw, 2rem);
  background: #fff;
  border: 1px solid color-mix(in oklab, var(--sposi-oro) 45%, transparent);
  outline: 1px solid color-mix(in oklab, var(--sposi-oro) 30%, transparent);
  outline-offset: -8px;
  text-align: center;
}
.sposi-iban { font-size: .95rem; letter-spacing: .04em; word-break: break-all; }

/* ---------- Domande ---------- */
.sposi-domande { max-width: 44rem; margin-inline: auto; }
.sposi-domande .sw-accordion__head { font-family: var(--sw-serif); font-weight: 600; font-size: 1.3rem; }

/* ---------- Informativa ---------- */
.sposi-privacy { padding-block: 2rem 3rem; }
.sposi-privacy > * { max-width: 46rem; margin-inline: auto; }
.sposi-privacy h2.sw-h5 { text-align: left; padding-bottom: 0; font-size: 1.2rem; }
.sposi-privacy h2.sw-h5::after { display: none; }
.sposi-privacy .sw-prose { font-size: .9rem; max-width: 46rem; margin-inline: auto; }

/* ---------- Piè di pagina: salvia come la busta ---------- */
[data-sw-recipe=nozze] .sposi-piede {
  --sw-bg: #b4604c;
  --sw-surface: #bf6e5a;
  background: #b4604c;
}
.sposi-piede .sposi-marchio { color: #fff; font-size: 2.6rem; }
.sposi-piede .sposi-marchio span { color: #f7d6d6; }
@media (max-width: 480px) {
  .sposi-conto { font-size: .78rem; gap: .45rem; flex-wrap: nowrap; }
}
