/* annoncesex.be — registre « framboise et crème, pilules »
   Base : skin-6 (contraste) + composition 2, entièrement réhabillée.
   Palette : accent framboise #b23a48 (favicon) · neutre crème #f8efe6 / lin #fdf8f2 · encre lie-de-vin #2b1b20.
   Formes signature : pilules (boutons, nav, thèmes, régions, identité), photos en arche, médaillons cerclés,
   cœurs en filigrane (hero, CTA de fiche, carte d'inscription). Ombres douces teintées framboise. */

html:not(#_) body.sa {
  --sa-accent: #b23a48; --sa-accent-txt: #fff;
  --sa-fond: #f8efe6; --sa-fond2: #f3e3d8; --sa-surface: #fffaf5;
  --sa-texte: #2b1b20; --sa-muet: #6b5156; --sa-bord: #ead6cb;
  --sa-secondaire: #4a1d28; --sa-secondaire-txt: #fff;
  --sa-rayon: 26px; --sa-rayon-s: 999px;
  --sa-police: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --sa-police-titre: Georgia, "Iowan Old Style", "Palatino Linotype", "Book Antiqua", serif;
  --sa-ombre: 0 2px 4px rgba(120, 30, 45, .05), 0 18px 36px -18px rgba(150, 40, 60, .35);
  --sa-tete: #fffaf5; --sa-tete-txt: #2b1b20;
  --sa-pied: #3d1822; --sa-pied-txt: #f3e3d8; --sa-like: #b23a48;
  --fb-rose: #f6dde0; --fb-rose2: #fbeceb;
  --fb-coeur: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23b23a48' fill-opacity='.09' d='M12 21s-8-5.3-8-11a4.5 4.5 0 0 1 8-2.8A4.5 4.5 0 0 1 20 10c0 5.7-8 11-8 11z'/%3E%3C/svg%3E");
  background: var(--sa-fond);
}
html:not(#_) body.sa h1, html:not(#_) body.sa h2, html:not(#_) body.sa h3 { text-transform: none; letter-spacing: -.01em; font-weight: 700; font-family: var(--sa-police-titre); color: var(--sa-texte); }
html:not(#_) body.sa .sa-h1 { font-size: clamp(1.6rem, 1.1rem + 1.8vw, 2.4rem); }
html:not(#_) body.sa .sa-h2 { font-size: clamp(1.25rem, 1.05rem + .8vw, 1.65rem); }

/* ---------- en-tête : bandeau lin, pilules ---------- */
html:not(#_) body.sa .sa-header { background: var(--sa-tete); border-bottom: 0; box-shadow: 0 10px 30px -22px rgba(150, 40, 60, .45); }
html:not(#_) body.sa .sa-logo { font-family: var(--sa-police-titre); text-transform: none; font-style: italic; font-weight: 700; font-size: 1.45rem; letter-spacing: -.01em; color: var(--sa-texte); }
html:not(#_) body.sa .sa-logo__mark { width: auto; height: 32px; padding: 0 .75rem; border-radius: 999px; background: var(--sa-accent); color: #fff; font-family: var(--sa-police); font-style: normal; font-size: .78rem; letter-spacing: .08em; box-shadow: 0 6px 14px -6px rgba(178, 58, 72, .7); }
html:not(#_) body.sa .sa-burger { border: 1.5px solid var(--sa-bord); border-radius: 999px; background: #fff; color: var(--sa-accent); }
html:not(#_) body.sa .sa-nav li a { text-transform: none; letter-spacing: 0; font-size: .95rem; border-top-color: var(--sa-bord); color: var(--sa-texte); }
@media (min-width: 900px) {
  /* deux étages : logo centré, puis une pilule de navigation */
  html:not(#_) body.sa .sa-header__in { flex-wrap: wrap; justify-content: center; row-gap: .35rem; padding-block: .7rem .8rem; }
  html:not(#_) body.sa .sa-logo { flex: none; max-width: none; font-size: 1.6rem; }
  html:not(#_) body.sa .sa-nav { flex: 0 1 auto; justify-content: center; flex-wrap: wrap; row-gap: .4rem; background: var(--fb-rose2); border: 1px solid #efd3d0; border-radius: 999px; padding: .3rem .35rem .3rem .6rem; }
  html:not(#_) body.sa .sa-nav ul { flex-wrap: wrap; justify-content: center; gap: .1rem; }
  html:not(#_) body.sa .sa-nav li a { border-radius: 999px; border: 0; font-size: .88rem; padding: .45rem .7rem; }
  html:not(#_) body.sa .sa-nav li a:hover, html:not(#_) body.sa .sa-nav li a.is-actif { background: var(--fb-rose); color: #8e2534; }
  html:not(#_) body.sa .sa-header__actions .sa-btn { white-space: nowrap; }
}

/* ---------- boutons : tous en pilule ---------- */
html:not(#_) body.sa .sa-btn { border-radius: 999px; border-width: 2px; text-transform: none; letter-spacing: 0; font-family: var(--sa-police); font-weight: 700; font-size: .95rem; }
html:not(#_) body.sa .sa-btn--lg { font-size: 1.05rem; }
html:not(#_) body.sa .sa-btn:hover { box-shadow: 0 0 0 4px rgba(178, 58, 72, .16); }
html:not(#_) body.sa .sa-btn--accent { background: var(--sa-accent); border-color: var(--sa-accent); color: #fff; box-shadow: 0 10px 22px -12px rgba(178, 58, 72, .8); }
html:not(#_) body.sa .sa-btn--accent:hover { background: #9c2f3d; border-color: #9c2f3d; }
html:not(#_) body.sa .sa-btn--ghost { border-color: #d9b8b0; color: var(--sa-texte); background: #fff; }
html:not(#_) body.sa .sa-btn--ghost:hover { background: var(--fb-rose2); color: #8e2534; border-color: var(--sa-accent); }
html:not(#_) body.sa .sa-btn--carte { background: var(--fb-rose); border: 0; color: #8e2534; font-size: .85rem; min-height: 36px; }
html:not(#_) body.sa .sa-btn--carte:hover { background: var(--sa-accent); color: #fff; }
html:not(#_) body.sa .sa-btn--like { border-radius: 999px; border: 1.5px solid #e2b9b9; color: #8e2534; background: #fff; }
html:not(#_) body.sa .sa-badge { border-radius: 999px; background: var(--sa-accent); color: #fff; font-family: var(--sa-police); }

/* ---------- hero : panneau crème, photo en pilule, cœurs en filigrane ---------- */
html:not(#_) body.sa .sa-hero { border-bottom: 0; padding: clamp(1rem, 3vw, 2rem) 0 .6rem; }
html:not(#_) body.sa .sa-hero__in { background: linear-gradient(135deg, #fffaf5 0%, var(--fb-rose2) 60%, var(--fb-rose) 100%); background-image: var(--fb-coeur), linear-gradient(135deg, #fffaf5 0%, var(--fb-rose2) 60%, var(--fb-rose) 100%); background-size: 46px 46px, auto; border-radius: 36px; padding: clamp(1.2rem, 3vw, 2.4rem); box-shadow: var(--sa-ombre); max-width: calc(var(--sa-max) - 2 * var(--sa-gout)); }
@media (max-width: 899px) { html:not(#_) body.sa .sa-hero__in { width: calc(100% - 2 * var(--sa-gout)); border-radius: 28px; } }
html:not(#_) body.sa .sa-hero__h1 { font-size: clamp(2rem, 1.3rem + 3vw, 3.4rem); line-height: 1.05; text-transform: none; color: var(--sa-texte); }
html:not(#_) body.sa .sa-hero__sous { color: var(--sa-muet); font-style: italic; font-family: var(--sa-police-titre); }
html:not(#_) body.sa .sa-hero__etapes li { font-size: 1rem; }
html:not(#_) body.sa .sa-hero__etapes li::before { border: 0; border-radius: 999px; width: 2.4em; background: var(--sa-accent); color: #fff; box-shadow: 0 6px 12px -6px rgba(178, 58, 72, .7); }
@media (min-width: 1000px) {
  html:not(#_) body.sa .sa-hero--form .sa-hero__in { grid-template-columns: 190px minmax(0, 1.15fr) minmax(0, .85fr); gap: 2rem; }
  html:not(#_) body.sa .sa-hero--form .sa-hero__in::before { content: ""; display: block; align-self: stretch; min-height: 300px; border-radius: 999px; background: var(--sa-hero) center / cover; border: 6px solid #fff; box-shadow: 0 18px 34px -18px rgba(150, 40, 60, .6); }
}
html:not(#_) body.sa .sa-hero__form { border: 0; border-radius: 28px; background: #fff; box-shadow: 0 22px 40px -24px rgba(150, 40, 60, .55); padding: 1.4rem 1.4rem 1.5rem; }
html:not(#_) body.sa .sa-hero__form-h { font-size: 1.3rem; }

/* ---------- thèmes : nuage de pilules ---------- */
html:not(#_) body.sa .sa-tags, html:not(#_) body.sa .sa-side, html:not(#_) body.sa .sa-similaires, html:not(#_) body.sa .sa-recherche { border: 0; border-radius: var(--sa-rayon); background: var(--sa-surface); box-shadow: var(--sa-ombre); }
html:not(#_) body.sa .sa-tags--bloc { max-width: calc(var(--sa-max) - 2 * var(--sa-gout)); margin: 1.4rem auto 0; width: calc(100% - 2 * var(--sa-gout)); text-align: center; padding: 1.4rem 1.4rem 1.2rem; }
html:not(#_) body.sa .sa-tags__liste { justify-content: center; gap: .45rem; align-items: center; }
html:not(#_) body.sa .sa-tags__liste a { font-family: var(--sa-police); text-transform: none; font-size: .9rem; font-weight: 600; border-radius: 999px; padding: .38rem .55rem .38rem .9rem; background: var(--fb-rose2); border: 1px solid #efd3d0; color: var(--sa-texte); }
html:not(#_) body.sa .sa-tags__liste li[data-poids="4"] a, html:not(#_) body.sa .sa-tags__liste li[data-poids="5"] a { font-size: 1rem; font-weight: 700; background: var(--fb-rose); }
html:not(#_) body.sa .sa-tags__liste a:hover { border-color: var(--sa-accent); color: #8e2534; }
@media (max-width: 639px) { html:not(#_) body.sa .sa-tags__liste { gap: .35rem; } html:not(#_) body.sa .sa-tags__liste a, html:not(#_) body.sa .sa-tags__liste li[data-poids] a { font-size: .8rem; padding: .3rem .4rem .3rem .7rem; } }

/* ---------- cartes : photo en arche, corps lin ---------- */
html:not(#_) body.sa .sa-grille { gap: 1.1rem; border: 0; }
html:not(#_) body.sa .sa-carte { outline: 0; border: 0; border-radius: 26px; background: #fff; box-shadow: var(--sa-ombre); transition: transform .2s ease, box-shadow .2s ease; }
html:not(#_) body.sa .sa-carte:hover { transform: translateY(-3px); box-shadow: 0 2px 4px rgba(120, 30, 45, .05), 0 24px 40px -18px rgba(150, 40, 60, .45); }
html:not(#_) body.sa .sa-carte__img { margin: .55rem .55rem 0; border: 0; border-radius: 999px 999px 20px 20px; aspect-ratio: 4 / 5; }
html:not(#_) body.sa .sa-carte__img img { transition: transform .5s ease; }
html:not(#_) body.sa .sa-carte:hover .sa-carte__img img { transform: scale(1.05); }
html:not(#_) body.sa .sa-carte__new { top: auto; bottom: .6rem; left: 50%; transform: translateX(-50%); border-radius: 999px; background: #fff; color: #8e2534; font-size: .68rem; box-shadow: 0 4px 10px -4px rgba(0, 0, 0, .3); }
html:not(#_) body.sa .sa-carte__corps { padding: .75rem .9rem .9rem; }
html:not(#_) body.sa .sa-carte__titre { font-family: var(--sa-police-titre); text-transform: none; font-weight: 700; font-size: 1.02rem; line-height: 1.25; }
html:not(#_) body.sa .sa-carte__pseudo { color: #8e2534; }
html:not(#_) body.sa .sa-carte__ville, html:not(#_) body.sa .sa-carte__metas { font-family: var(--sa-police); font-size: .82rem; color: var(--sa-muet); }
html:not(#_) body.sa .sa-carte__pied { border-top: 1px dashed var(--sa-bord); padding-top: .55rem; }

/* ---------- régions : bandeau rosé arrondi, pastilles en pilule ---------- */
html:not(#_) body.sa .sa-regions { background: transparent; border: 0; padding: 1rem 0 1.4rem; }
html:not(#_) body.sa .sa-regions > .sa-wrap { background: var(--fb-rose2); border-radius: 36px; padding: 1.6rem clamp(1rem, 3vw, 2rem); max-width: calc(var(--sa-max) - 2 * var(--sa-gout)); width: calc(100% - 2 * var(--sa-gout)); }
html:not(#_) body.sa .sa-pastille { border: 1px solid #efd3d0; border-radius: 999px; background: #fff; text-transform: none; letter-spacing: 0; font-size: .9rem; padding: .4rem .5rem .4rem 1rem; }
html:not(#_) body.sa .sa-pastille:hover { border-color: var(--sa-accent); color: #8e2534; }

/* ---------- arrivées : médaillons ---------- */
html:not(#_) body.sa .sa-membres__avatar { border-radius: 50%; border: 3px solid #fff; box-shadow: 0 0 0 2px var(--sa-accent), 0 10px 18px -10px rgba(150, 40, 60, .6); }
html:not(#_) body.sa .sa-membres__nom a { color: var(--sa-texte); }

/* ---------- inscription : carte centrée avec de l'air ---------- */
html:not(#_) body.sa .sa-inscrire { background: transparent; color: var(--sa-texte); padding: 1.5rem 0 2.2rem; }
html:not(#_) body.sa .sa-inscrire__in { max-width: 900px; width: calc(100% - 2 * var(--sa-gout)); background: #fff var(--fb-coeur) right 1.2rem top 1rem / 90px no-repeat; border-radius: 34px; padding: clamp(1.3rem, 3vw, 2.2rem); box-shadow: 0 26px 50px -28px rgba(150, 40, 60, .6); border: 1px solid #f0dcd6; }
html:not(#_) body.sa .sa-inscrire__h { color: var(--sa-texte); }
html:not(#_) body.sa .sa-inscrire p { color: var(--sa-muet); }

/* ---------- formulaires ---------- */
html:not(#_) body.sa .sa-form input[type="text"], html:not(#_) body.sa .sa-form input[type="email"], html:not(#_) body.sa .sa-form input[type="tel"], html:not(#_) body.sa .sa-form input[type="number"], html:not(#_) body.sa .sa-form input[type="search"], html:not(#_) body.sa .sa-form select { border: 1.5px solid #e2c8bf; border-radius: 999px; background: #fffdfb; padding-inline: 1.1rem; }
html:not(#_) body.sa .sa-form textarea { border: 1.5px solid #e2c8bf; border-radius: 20px; background: #fffdfb; }
html:not(#_) body.sa .sa-depot__bloc { border: 0; border-radius: var(--sa-rayon); background: #fff; box-shadow: var(--sa-ombre); }
html:not(#_) body.sa .sa-depot__bloc legend { background: var(--sa-accent); color: #fff; border-radius: 999px; padding: .25rem .9rem; font-size: .9rem; }
html:not(#_) body.sa .sa-depot__dispo th, html:not(#_) body.sa .sa-depot__dispo td { border-color: var(--sa-bord); }
html:not(#_) body.sa .sa-chip { border-radius: 999px; border: 1px solid #efd3d0; background: var(--fb-rose2); text-transform: none; font-size: .86rem; }
html:not(#_) body.sa .sa-pagination li a, html:not(#_) body.sa .sa-pagination li span { border-radius: 999px; border: 1px solid var(--sa-bord); }
html:not(#_) body.sa .sa-pagination li.is-actif span { background: var(--sa-accent); border-color: var(--sa-accent); }

/* ---------- fiche : carte lin, bandeau photo arrondi, identité en pilules ---------- */
html:not(#_) body.sa .sa-fiche { border: 0; border-radius: 32px; background: #fff; box-shadow: var(--sa-ombre); }
html:not(#_) body.sa .sa-fiche__photo { border: 0; border-radius: 26px; box-shadow: 0 16px 30px -18px rgba(150, 40, 60, .55); }
html:not(#_) body.sa .sa-fiche__titre { font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.3rem); line-height: 1.12; text-transform: none; }
html:not(#_) body.sa .sa-fiche__sur { color: var(--sa-muet); }
html:not(#_) body.sa .sa-fiche--2 .sa-fiche__id > div { border: 1px solid #efd3d0; border-radius: 999px; background: var(--fb-rose2); }
html:not(#_) body.sa .sa-fiche__id dt { font-family: var(--sa-police); text-transform: none; font-size: .8rem; color: var(--sa-muet); }
html:not(#_) body.sa .sa-fiche__id dd { color: var(--sa-texte); font-weight: 600; }
html:not(#_) body.sa .sa-dispo { background: var(--sa-fond); border: 0; border-radius: 22px; }
html:not(#_) body.sa .sa-dispo--frise .sa-dispo__nom { font-size: .74rem; overflow-wrap: anywhere; }
html:not(#_) body.sa .sa-dispo--frise .sa-dispo__creneaux li { border-radius: 999px; background: #ecd9d0; }
html:not(#_) body.sa .sa-dispo--frise .sa-dispo__creneaux li.is-on { background: var(--sa-accent); }
@media (max-width: 639px) { html:not(#_) body.sa .sa-dispo--frise .sa-dispo__jours { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: .7rem; } html:not(#_) body.sa .sa-dispo--frise .sa-dispo__nom { overflow-wrap: normal; font-size: .68rem; line-height: 1.2; } }
html:not(#_) body.sa .sa-dispo__jour.is-aujourdhui .sa-dispo__nom { color: #8e2534; }
html:not(#_) body.sa .sa-cta { border: 1px solid #efd3d0; border-radius: 28px; background: var(--fb-rose2) var(--fb-coeur) left 1rem top .8rem / 64px no-repeat; padding: 1.4rem 1.3rem; }
html:not(#_) body.sa .sa-cta .sa-btn { width: 100%; max-width: 440px; }
html:not(#_) body.sa .sa-cta__q { font-family: var(--sa-police-titre); font-size: 1.2rem; }
html:not(#_) body.sa .sa-commentaires { border-top: 1px dashed var(--sa-bord); }
html:not(#_) body.sa .sa-similaires__img { border-radius: 999px 999px 14px 14px; }
html:not(#_) body.sa .sa-fiche__barre { background: #fffaf5; border-top: 0; border-radius: 22px 22px 0 0; box-shadow: 0 -10px 24px -12px rgba(150, 40, 60, .45); }

/* ---------- pied de page : lie-de-vin, colonnes ---------- */
html:not(#_) body.sa .sa-liens { background: var(--sa-pied); color: var(--sa-pied-txt); border-top: 0; border-radius: 40px 40px 0 0; padding: 2.2rem 0 1.4rem; margin-top: 1.5rem; }
@media (min-width: 768px) { html:not(#_) body.sa .sa-liens__grid { grid-template-columns: 1.6fr 1fr 1fr 1fr !important; gap: 1.6rem; } }
html:not(#_) body.sa .sa-liens__col { display: block; border-bottom: 0; padding-bottom: 0; }
html:not(#_) body.sa .sa-liens__marque { color: #fff; font-family: var(--sa-police-titre); font-style: italic; text-transform: none; font-size: 1.5rem; }
html:not(#_) body.sa .sa-liens__h { color: #f6c9cf; font-family: var(--sa-police); font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; }
html:not(#_) body.sa .sa-liens ul { display: block; }
html:not(#_) body.sa .sa-liens a { color: var(--sa-pied-txt); }
html:not(#_) body.sa .sa-liens a:hover { color: #fff; }
html:not(#_) body.sa .sa-liens .sa-btn--ghost { color: #fff; background: transparent; border-color: rgba(255, 220, 225, .45); }
html:not(#_) body.sa .sa-footer__tail { background: var(--sa-pied); color: #e9cfd3; font-family: var(--sa-police); border-top: 1px solid rgba(255, 220, 225, .14); }
html:not(#_) body.sa .sa-footer__legal a, html:not(#_) body.sa .sa-footer__haut a { color: #f3e3d8; }
html:not(#_) body.sa .sa-barre-mobile { border-top: 0; border-radius: 22px 22px 0 0; background: var(--sa-accent); color: #fff; }

/* ---------- modales ---------- */
html:not(#_) body.sa .sa-consent__box, html:not(#_) body.sa .sa-popup__box { border: 0; border-radius: 30px; box-shadow: 0 30px 70px -20px rgba(60, 10, 20, .6); background: #fffaf5; }
html:not(#_) body.sa .sa-popup__titre { text-transform: none; }
