/* rencontre-coquine-suisse.ch — registre « cabine de photomaton »
   Rideau plissé framboise en tête (ourlet festonné), bande de quatre vues sur le volet photo de l'accueil,
   annonces en bandes photo (tirage blanc à languette, perforations), créneaux en pellicule, jetons de cabine.
   Palette : accent #d1495b (favicon) — rideau #a8324a, bouton #b8394f ; neutre chaud poudre #fbefe9 / ivoire #fffaf6 ;
   encre #2b1a20. Formes : rideau plissé + feston, tirage photomaton incliné, jeton (logo, badge), pellicule perforée,
   arche (thèmes), cœur (CTA, sticker). Aucun texte ajouté. */

body.sa.skin-3 {
  --rc-rideau: #a8324a; --rc-pli: #942a40; --rc-btn: #b8394f; --rc-poudre: #fbefe9; --rc-ivoire: #fffaf6; --rc-encre: #2b1a20;
  --rc-rose: #fbe1da;
  --sa-fond: var(--rc-poudre); --sa-fond2: #f5ded6; --sa-surface: var(--rc-ivoire);
  --sa-texte: var(--rc-encre); --sa-muet: #6b525a; --sa-bord: #ecd3cb; --sa-like: var(--rc-btn);
  --sa-rayon: 18px; --sa-rayon-s: 10px;
  --sa-ombre: 0 2px 4px rgba(122, 32, 52, .05), 0 16px 32px -18px rgba(168, 50, 74, .45);
  --sa-police-titre: Futura, "Century Gothic", "Avenir Next", "Trebuchet MS", sans-serif;
  --sa-tete: var(--rc-rideau); --sa-tete-txt: #fff; --sa-pied: var(--rc-encre); --sa-pied-txt: #f2dfe0;
  background: var(--rc-poudre);
}
:where(body.sa.skin-3) a { color: var(--rc-rideau); }

/* ---------- boutons : jetons pilule ---------- */
.sa.skin-3 .sa-btn { border-radius: 999px; }
.sa.skin-3 .sa-btn--accent { background: var(--rc-btn); border-color: var(--rc-btn); color: #fff; box-shadow: 0 10px 20px -12px rgba(168, 50, 74, .8); }
.sa.skin-3 .sa-btn--accent:hover { background: var(--rc-rideau); box-shadow: 0 0 0 4px rgba(209, 73, 91, .22), 0 10px 20px -12px rgba(168, 50, 74, .8); }
.sa.skin-3 .sa-btn--ghost { border-color: #e2b9b0; color: var(--rc-encre); }
.sa.skin-3 .sa-btn--carte { background: var(--rc-rose); color: var(--rc-rideau); border: 1.5px dashed rgba(168, 50, 74, .35); padding-inline: .9rem; min-height: 36px; }
.sa.skin-3 .sa-btn--like { color: var(--rc-btn); border-color: rgba(184, 57, 79, .45); }
.sa.skin-3 .sa-barre-mobile { background: var(--rc-btn); }

/* ---------- en-tête : rideau plissé + ourlet festonné ---------- */
.sa.skin-3 .sa-header {
  --sa-texte: #fff; --sa-bord: rgba(255, 255, 255, .28);
  background: linear-gradient(180deg, rgba(0, 0, 0, .14), transparent 30%),
    repeating-linear-gradient(90deg, #a8324a 0 9px, #bb435b 9px 16px, #b03a52 16px 21px, #962b41 21px 30px);
  color: #fff; border-bottom: 0;
}
.sa.skin-3 .sa-header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -12px; height: 13px; pointer-events: none;
  background: radial-gradient(circle at 12px 0, var(--rc-pli) 11px, transparent 11.5px) 0 0 / 24px 13px repeat-x;
  filter: drop-shadow(0 3px 2px rgba(90, 20, 36, .25));
}
.sa.skin-3 .sa-logo { color: #fff; letter-spacing: .14em; }
.sa.skin-3 .sa-logo__mark {
  width: 36px; height: 36px; border-radius: 50%; background: var(--rc-ivoire); color: var(--rc-rideau);
  outline: 1.5px dashed var(--rc-rideau); outline-offset: -5px; font-size: .68rem; box-shadow: 0 3px 8px rgba(60, 10, 24, .35);
}
.sa.skin-3 .sa-nav li a { color: #fff; border-top-color: rgba(255, 255, 255, .2); }
.sa.skin-3 .sa-nav li a:hover, .sa.skin-3 .sa-nav li a.is-actif { color: #ffe3dc; }
.sa.skin-3 .sa-header .sa-btn--ghost { color: #fff; border-color: rgba(255, 255, 255, .65); background: rgba(60, 10, 24, .12); }
.sa.skin-3 .sa-header .sa-btn--ghost:hover { color: #fff; border-color: #fff; }
.sa.skin-3 .sa-header .sa-btn--accent { background: var(--rc-ivoire); border-color: var(--rc-ivoire); color: var(--rc-rideau); box-shadow: 0 6px 14px -6px rgba(40, 6, 16, .6); }
.sa.skin-3 .sa-nav-toggle:checked ~ .sa-header__in .sa-nav { background: rgba(50, 8, 20, .28); border-radius: 18px; padding: .4rem .9rem 1rem; margin-bottom: 1rem; }
.sa.skin-3 .sa-crumbs { margin-top: .9rem; }
@media (min-width: 900px) {
  .sa.skin-3 .sa-nav li a { border-bottom-color: transparent; }
  /* nav sur une seule rangée (la 7e entrée passait à la ligne à 1280 px) */
  .sa.skin-3 .sa-nav li a { letter-spacing: .03em; padding-inline: .42rem; }
  .sa.skin-3 .sa-nav li a:hover, .sa.skin-3 .sa-nav li a.is-actif { background: none; border-bottom-color: #ffd5cc; color: #fff; }
}

/* ---------- accueil : volet photo = bande de quatre vues devant un rideau poudre ---------- */
@media (min-width: 900px) {
  .sa.skin-3.sa-page-home .sa-split {
    background: linear-gradient(180deg, rgba(122, 32, 52, .16), transparent 18%, transparent 82%, rgba(122, 32, 52, .12)),
      repeating-linear-gradient(90deg, #f3d6cd 0 18px, #f9e7e1 18px 30px, #eecbc1 30px 46px);
    overflow: hidden;
  }
  .sa.skin-3.sa-page-home .sa-split::before {
    content: ""; position: absolute; top: 9vh; left: 50%; height: 80vh; width: calc((80vh - 68px) / 4 + 20px);
    padding: 10px 10px 34px; border-radius: 4px; transform: translateX(-50%) rotate(-3deg);
    background:
      linear-gradient(to bottom, transparent calc(25% - 4px), var(--rc-ivoire) calc(25% - 4px), var(--rc-ivoire) calc(25% + 4px), transparent calc(25% + 4px),
        transparent calc(50% - 4px), var(--rc-ivoire) calc(50% - 4px), var(--rc-ivoire) calc(50% + 4px), transparent calc(50% + 4px),
        transparent calc(75% - 4px), var(--rc-ivoire) calc(75% - 4px), var(--rc-ivoire) calc(75% + 4px), transparent calc(75% + 4px)),
      linear-gradient(to bottom, transparent 25%, rgba(209, 73, 91, .2) 25% 50%, transparent 50% 75%, rgba(43, 26, 32, .22) 75%),
      var(--sa-hero, none) center top / auto 25% repeat-y,
      linear-gradient(var(--rc-ivoire), var(--rc-ivoire));
    background-origin: content-box, content-box, content-box, border-box;
    background-clip: content-box, content-box, content-box, border-box;
    box-shadow: 0 34px 50px -26px rgba(90, 20, 36, .6), 0 2px 0 rgba(255, 255, 255, .6) inset;
  }
  .sa.skin-3.sa-page-home .sa-split::after {
    content: ""; position: absolute; top: calc(9vh + 80vh - 58px); left: calc(50% + (80vh - 68px) / 8 - 8px);
    width: 54px; height: 54px; border-radius: 50%; background: var(--rc-btn) center / 26px no-repeat
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 21s-7.5-4.6-9.6-9.3C.9 8.3 3 4.5 6.6 4.5c2.1 0 3.6 1.2 4.4 2.6.8-1.4 2.3-2.6 4.4-2.6 3.6 0 5.7 3.8 4.2 7.2C19.5 16.4 12 21 12 21z'/%3E%3C/svg%3E");
    transform: rotate(12deg); box-shadow: 0 0 0 4px var(--rc-ivoire), 0 10px 18px -8px rgba(90, 20, 36, .6);
  }
}

/* ---------- accès gratuit : ticket de cabine centré ---------- */
.sa.skin-3 .sa-inscrire { background: none; color: var(--rc-encre); padding: 1.6rem 0; }
.sa.skin-3 .sa-inscrire__in {
  --sa-texte: var(--rc-encre); --sa-muet: #6b525a; --sa-bord: #e8c9c0;
  max-width: 760px; background: var(--rc-ivoire) no-repeat right 1.1rem top 1rem / 46px
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23d1495b' fill-opacity='.16' d='M12 21s-7.5-4.6-9.6-9.3C.9 8.3 3 4.5 6.6 4.5c2.1 0 3.6 1.2 4.4 2.6.8-1.4 2.3-2.6 4.4-2.6 3.6 0 5.7 3.8 4.2 7.2C19.5 16.4 12 21 12 21z'/%3E%3C/svg%3E");
  color: var(--rc-encre); border-radius: 26px; padding: 1.5rem 1.6rem; box-shadow: var(--sa-ombre);
  border: 2px dashed rgba(168, 50, 74, .25); margin-inline: auto;
}
.sa.skin-3 .sa-inscrire__h { color: var(--rc-rideau); }
.sa.skin-3 .sa-inscrire .sa-form__lbl, .sa.skin-3 .sa-inscrire .sa-form__check { color: var(--rc-encre); }
.sa.skin-3 .sa-inscrire .sa-btn--accent { background: var(--rc-btn); border-color: var(--rc-btn); color: #fff; }
@media (max-width: 899px) { .sa.skin-3 .sa-inscrire__in { width: calc(100% - 2 * var(--sa-gout)); padding: 1.2rem 1.1rem; background-position: right .9rem bottom .9rem; } }

/* ---------- thèmes : arche poudre ---------- */
.sa.skin-3 .sa-tags {
  background: linear-gradient(180deg, #f6dcd4, var(--sa-fond2)); border: 0; box-shadow: var(--sa-ombre);
  border-radius: 180px 180px 24px 24px / 70px 70px 24px 24px; padding: 1.6rem 1.4rem 1.3rem;
}
.sa.skin-3 .sa-tags--side { border-radius: 120px 120px 20px 20px / 50px 50px 20px 20px; }
.sa.skin-3 .sa-tags__h { font-family: var(--sa-police-titre); letter-spacing: .04em; }
.sa.skin-3 .sa-tags__liste li[data-poids="5"] a { color: var(--rc-rideau); }
.sa.skin-3 .sa-tags__liste .sa-badge { background: var(--rc-ivoire); color: var(--rc-rideau); border-radius: 999px; white-space: nowrap; flex-shrink: 0; }

/* ---------- liste : bandes photo ---------- */
.sa.skin-3 .sa-dernieres__h { letter-spacing: .02em; }
.sa.skin-3 .sa-dernieres__h::after { content: ""; display: block; width: 64px; height: 6px; margin-top: .55rem; border-radius: 999px;
  background: repeating-linear-gradient(90deg, var(--rc-btn) 0 10px, transparent 10px 14px); }
.sa.skin-3 .sa-grille { gap: 1.1rem; }
.sa.skin-3 .sa-carte {
  background: var(--rc-ivoire); border: 0; border-radius: 20px; padding: .9rem 1rem; gap: 1.2rem;
  box-shadow: var(--sa-ombre); transition: transform .2s ease, box-shadow .2s ease;
}
.sa.skin-3 .sa-carte:hover { transform: translateY(-2px); box-shadow: 0 2px 4px rgba(122, 32, 52, .06), 0 22px 38px -18px rgba(168, 50, 74, .55); }
.sa.skin-3 .sa-carte__img {
  flex: 0 0 104px; width: 104px; background: #fff; padding: 5px 5px 16px; border-radius: 4px; overflow: hidden;
  box-shadow: 0 8px 16px -8px rgba(90, 20, 36, .45); transform: rotate(-2deg); transition: transform .25s ease;
}
.sa.skin-3 .sa-carte:nth-child(even) .sa-carte__img { transform: rotate(1.6deg); }
.sa.skin-3 .sa-carte__img img { border-radius: 2px; transition: transform .35s ease; }
/* tirage à hauteur de photo, jamais étiré sur la hauteur de la carte (vu en planche mobile : 117 × 388 px) */
.sa.skin-3 .sa-carte__img { align-self: flex-start; height: auto; }
.sa.skin-3 .sa-carte__img img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; }
@media (max-width: 639px) { .sa.skin-3 .sa-carte__img { flex-basis: 96px; width: 96px; } }
.sa.skin-3 .sa-carte:hover .sa-carte__img { transform: rotate(0deg) scale(1.03); }
.sa.skin-3 .sa-carte:hover .sa-carte__img img { transform: scale(1.06); }
@media (min-width: 640px) {
  .sa.skin-3 .sa-carte { padding-left: 1.7rem; }
  .sa.skin-3 .sa-carte::before { content: ""; position: absolute; left: .55rem; top: 14px; bottom: 14px; width: 7px;
    background: radial-gradient(circle, #e9c7be 2.6px, transparent 3px) center top / 7px 13px repeat-y; }
  .sa.skin-3 .sa-carte__img { flex-basis: 132px; width: 132px; padding: 6px 6px 20px; }
}
.sa.skin-3 .sa-carte__new {
  top: .5rem; left: .5rem; background: var(--rc-btn); color: #fff; border-radius: 999px; font-size: .62rem;
  box-shadow: 0 0 0 2px #fff; transform: rotate(-6deg);
}
.sa.skin-3 .sa-carte__pseudo { color: var(--rc-rideau); }
.sa.skin-3 .sa-carte__titre { font-family: var(--sa-police-titre); }
.sa.skin-3 .sa-carte__titre a:hover { color: var(--rc-rideau); }
.sa.skin-3 .sa-carte__ville { color: var(--sa-muet); }

/* ---------- elles viennent d'arriver : tirages de cabine ---------- */
.sa.skin-3 .sa-membres__avatar { border-radius: 3px; aspect-ratio: 4 / 5; background: #fff; border: 0; padding: 3px 3px 9px;
  box-shadow: 0 6px 12px -6px rgba(90, 20, 36, .5); transform: rotate(-2deg); }
.sa.skin-3 .sa-membres__liste li:nth-child(even) .sa-membres__avatar { transform: rotate(2deg); }
.sa.skin-3 .sa-membres__avatar img { border-radius: 2px; }
.sa.skin-3 .sa-membres__nom a { color: var(--rc-encre); }

/* ---------- fiche d'annonce ---------- */
.sa.skin-3 .sa-crumbs { color: var(--sa-muet); }
.sa.skin-3 .sa-fiche { background: var(--rc-ivoire); border-radius: 26px; padding: 1.4rem; box-shadow: var(--sa-ombre); }
.sa.skin-3 .sa-fiche__photo {
  background: #fff; padding: 9px 9px 30px; border-radius: 4px; transform: rotate(2deg);
  box-shadow: 0 20px 34px -18px rgba(90, 20, 36, .6); transition: transform .25s ease;
}
.sa.skin-3 .sa-fiche__photo:hover { transform: rotate(0deg) scale(1.02); }
.sa.skin-3 .sa-fiche__photo img { border-radius: 2px; }
.sa.skin-3 .sa-fiche__sur { display: inline-block; background: var(--rc-rose); color: var(--rc-rideau); font-weight: 700; padding: .2rem .8rem; border-radius: 999px; }
.sa.skin-3 .sa-fiche__titre { font-family: var(--sa-police-titre); }
.sa.skin-3 .sa-fiche__id { background: var(--rc-poudre); border: 2px dashed rgba(168, 50, 74, .22); border-radius: 18px; padding: .3rem 1rem; }
.sa.skin-3 .sa-fiche__id dt { text-transform: uppercase; letter-spacing: .08em; font-size: .72rem; color: var(--sa-muet); }
.sa.skin-3 .sa-fiche__id > div { border-top-color: var(--sa-bord); }
.sa.skin-3 .sa-fiche__id dd .sa-ico { color: var(--rc-btn); }
.sa.skin-3 .sa-chip { background: var(--rc-rose); border: 1.5px dashed rgba(168, 50, 74, .3); }
.sa.skin-3 .sa-h2 .sa-ico, .sa.skin-3 .sa-h3 .sa-ico { color: var(--rc-btn); }

/* bureau : la photo court sur deux rangées, les créneaux suivent le titre sans trou (vu en planche : ~270 px vides) */
@media (min-width: 1100px) {
  .sa.skin-3 .sa-fiche {
    grid-template-columns: minmax(0, 1fr) 320px; grid-template-rows: none; grid-auto-rows: auto; align-content: start;
    grid-template-areas: "tete media" "dispo media" "texte id" "tags id" "com cta";
  }
  .sa.skin-3 .sa-fiche__media, .sa.skin-3 .sa-fiche__id, .sa.skin-3 .sa-fiche .sa-cta, .sa.skin-3 .sa-fiche .sa-dispo { align-self: start; }
}

/* créneaux : pellicule perforée */
.sa.skin-3 .sa-dispo {
  --sa-texte: #fff6f2; --sa-muet: #e6c9cf;
  color: #fff6f2; border-radius: 14px; padding: 1.5rem 1rem 1.6rem;
  background: radial-gradient(circle, var(--rc-poudre) 2.6px, transparent 3.1px) left 4px top 5px / 16px 10px repeat-x,
    radial-gradient(circle, var(--rc-poudre) 2.6px, transparent 3.1px) left 4px bottom 5px / 16px 10px repeat-x,
    var(--rc-encre);
  box-shadow: 0 16px 30px -18px rgba(43, 26, 32, .7);
}
.sa.skin-3 .sa-dispo__h { color: #fff6f2; }
.sa.skin-3 .sa-dispo__jour.is-aujourdhui .sa-dispo__nom { color: #ffb4c0; }
.sa.skin-3 .sa-dispo--frise .sa-dispo__creneaux li { background: rgba(255, 255, 255, .13); height: 13px; border-radius: 999px; }
.sa.skin-3 .sa-dispo--frise .sa-dispo__creneaux li.is-on { background: #ef6f82; box-shadow: 0 0 8px rgba(239, 111, 130, .55); }

/* appel à répondre : carte centrée au cœur */
.sa.skin-3 .sa-cta {
  text-align: center; border: 0; border-radius: 26px; padding: 1.7rem 1.3rem 1.4rem; box-shadow: var(--sa-ombre);
  background: var(--rc-ivoire) no-repeat center top 1rem / 34px
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23d1495b' d='M12 21s-7.5-4.6-9.6-9.3C.9 8.3 3 4.5 6.6 4.5c2.1 0 3.6 1.2 4.4 2.6.8-1.4 2.3-2.6 4.4-2.6 3.6 0 5.7 3.8 4.2 7.2C19.5 16.4 12 21 12 21z'/%3E%3C/svg%3E");
  outline: 2px dashed rgba(168, 50, 74, .25); outline-offset: -9px;
}
.sa.skin-3 .sa-cta__q { padding-top: 2.1rem; color: var(--rc-encre); font-family: var(--sa-police-titre); }
.sa.skin-3 .sa-cta .sa-btn { width: 100%; }
.sa.skin-3 .sa-fiche__barre { background: var(--rc-ivoire); border-top: 0; box-shadow: 0 -8px 20px -8px rgba(90, 20, 36, .35); }
.sa.skin-3 .sa-commentaires { border-top: 2px dashed var(--sa-bord); }

/* colonne latérale */
.sa.skin-3 .sa-similaires, .sa.skin-3 .sa-side { background: var(--rc-ivoire); border: 0; border-radius: 22px; box-shadow: var(--sa-ombre); }
.sa.skin-3 .sa-similaires__img { background: #fff; padding: 3px 3px 9px; border-radius: 3px; box-shadow: 0 6px 12px -6px rgba(90, 20, 36, .45); transform: rotate(-2deg); height: auto; aspect-ratio: 4 / 5; }
.sa.skin-3 .sa-similaires__titre a { color: var(--rc-encre); }

/* ---------- formulaires et dépôt ---------- */
.sa.skin-3 .sa-form input[type="text"], .sa.skin-3 .sa-form input[type="email"], .sa.skin-3 .sa-form input[type="tel"],
.sa.skin-3 .sa-form input[type="number"], .sa.skin-3 .sa-form input[type="search"], .sa.skin-3 .sa-form select, .sa.skin-3 .sa-form textarea {
  background: #fff; border: 1.5px solid #e6c4bb; border-radius: 12px;
}
.sa.skin-3 .sa-form input:focus, .sa.skin-3 .sa-form select:focus, .sa.skin-3 .sa-form textarea:focus { outline: 3px solid rgba(209, 73, 91, .35); border-color: var(--rc-btn); }
.sa.skin-3 .sa-depot__bloc { background: var(--rc-ivoire); border: 0; border-radius: 22px; box-shadow: var(--sa-ombre); padding: 1.3rem 1.3rem 1.4rem; margin-top: .6rem; }
.sa.skin-3 .sa-depot__bloc legend { background: var(--rc-rideau); color: #fff; border-radius: 999px; padding: .25rem 1rem; font-family: var(--sa-police-titre); letter-spacing: .04em; box-shadow: 0 6px 12px -6px rgba(90, 20, 36, .6); }
.sa.skin-3 .sa-depot__dispo th, .sa.skin-3 .sa-depot__dispo td { border-color: var(--sa-bord); }
.sa.skin-3 .sa-depot__dispo thead th { background: var(--rc-rose); color: var(--rc-encre); }
.sa.skin-3 .sa-recherche { background: var(--rc-ivoire); border: 0; border-radius: 22px; box-shadow: var(--sa-ombre); }
.sa.skin-3 .sa-pagination li a, .sa.skin-3 .sa-pagination li span { border-radius: 999px; }
.sa.skin-3 .sa-pagination li.is-actif span { background: var(--rc-btn); border-color: var(--rc-btn); }

/* ---------- modales : liseré de rideau ---------- */
.sa.skin-3 .sa-popup__box, .sa.skin-3 .sa-consent__box {
  border-radius: 26px; background: repeating-linear-gradient(90deg, #a8324a 0 9px, #bb435b 9px 16px, #962b41 16px 25px) top / 100% 12px no-repeat, var(--rc-ivoire);
}

/* ---------- pied : rideau encre festonné ---------- */
.sa.skin-3 .sa-footer .sa-liens, .sa.skin-3 .sa-footer .sa-footer__tail { --sa-texte: #fbeae6; --sa-muet: #d9bfc5; --sa-bord: rgba(255, 255, 255, .16); background: var(--rc-encre); }
.sa.skin-3 .sa-footer .sa-liens { position: relative; margin-top: 1.6rem; }
.sa.skin-3 .sa-footer .sa-liens::before {
  content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 13px; pointer-events: none;
  background: radial-gradient(circle at 12px 13px, var(--rc-encre) 11px, transparent 11.5px) 0 0 / 24px 13px repeat-x;
}
.sa.skin-3 .sa-liens__marque { color: #fff; letter-spacing: .12em; text-transform: uppercase; }
.sa.skin-3 .sa-liens__h { color: #ffc9d1; }
.sa.skin-3 .sa-liens .sa-btn--ghost { color: #fff; border-color: rgba(255, 255, 255, .4); }

@media (prefers-reduced-motion: reduce) {
  .sa.skin-3 .sa-carte, .sa.skin-3 .sa-carte__img, .sa.skin-3 .sa-carte__img img, .sa.skin-3 .sa-fiche__photo { transition: none; }
}
