/* =====================================================================
   sex-treffen-anzeigen.de — habillage « BÉTON CHAUD & CUIVRE »
   Gabarit annoncesastro (aa-), base skin-6 / compo-3 / fiche-1.
   Palette (depuis le favicon #8d6e63, cacao) :
     cuivre patiné  #8f563f  (accent : boutons, liens, cartouches)   sur crème 5,3:1 / blanc 5,9:1
     cuivre clair   #c98d6d  (reflets métalliques, filets)
     béton chaud    #e9e2da / #ddd4cb (dalles, panneaux)             + grain feTurbulence
     crème          #f7f3ee (fond de page), surface #fffcf9
     encre          #2a2220 ; muet #6b5d57 (5,7:1 sur crème)
     pied sombre    #342b27, texte #e7ddd5, titres cuivre clair #d9a381 (6,2:1)
   Formes signature : ARCHE (vignettes, photo de fiche, pop-up, pied de page), PÉTALE (cartes
   6px/28px), PILULE (boutons, chips, nav), MÉDAILLON (compteurs, logo, porte 18+), CŒUR SVG en fond.
   ⚠️ Le gabarit résout --aa-primaire sur :root (rose #c2185b) : redéfini ici sur body.
   ===================================================================== */

/* ---------- variables du gabarit, rescopées sur body ---------- */
html:not(#_) body.aa {
  --aa-accent: #8d6e63;
  --aa-primaire: #8f563f;
  --aa-primaire-txt: #fff;
  --aa-secondaire: #5c4034;
  --aa-secondaire-txt: #fff;
  --aa-fond: #f7f3ee;
  --aa-surface: #fffcf9;
  --aa-texte: #2a2220;
  --aa-muet: #6b5d57;
  --aa-bord: #ddd2c8;
  --aa-rayon: 16px; --aa-rayon-s: 12px;
  --aa-ombre: 0 14px 34px -20px rgba(143, 86, 63, .45), 0 1px 2px rgba(60, 40, 30, .06);
  --aa-tete: #e9e2da; --aa-tete-txt: #2a2220;
  --aa-pied: #342b27; --aa-pied-txt: #e7ddd5;
  --st-cuivre: #8f563f; --st-cuivre-2: #a2664b; --st-cuivre-clair: #c98d6d; --st-cuivre-pale: #f1e2d8;
  --st-beton: #e9e2da; --st-beton-2: #ddd4cb; --st-beton-3: #f2ede7;
  --st-metal: linear-gradient(90deg, #8f563f 0%, #d4a184 45%, #8f563f 100%);
  --st-grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .36 0 0 0 0 .27 0 0 0 0 .22 0 0 0 .14 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  --st-coeur: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%238f563f' fill-opacity='.09' d='M12 21.2S3.2 15.8 1.6 10.4C.4 6.4 3.1 3 6.6 3c2.2 0 4 1.2 5.4 3 1.4-1.8 3.2-3 5.4-3 3.5 0 6.2 3.4 5 7.4C20.8 15.8 12 21.2 12 21.2z'/></svg>");
  --st-petale: 6px 28px 6px 28px;
  color-scheme: light;
}
html:not(#_) body.aa { background: var(--aa-fond); color: var(--aa-texte); }
html:not(#_) a { color: var(--st-cuivre); }
html:not(#_) .aa-h1 { color: var(--aa-texte); font-weight: 700; letter-spacing: -.012em; }
/* cartouche cuivre sous chaque titre de section */
html:not(#_) .aa-h2 { position: relative; padding-bottom: .55rem; color: var(--aa-texte); }
html:not(#_) .aa-h2::after { content: ""; display: block; width: 52px; height: 3px; margin-top: .5rem; border-radius: 3px; background: var(--st-metal); }
html:not(#_) .aa-bloc__tete { align-items: flex-end; }
html:not(#_) .aa-intro { color: var(--aa-muet); }

/* ---------- boutons : pilules cuivre ---------- */
html:not(#_) .aa-btn { border-radius: 999px; letter-spacing: .01em; }
html:not(#_) .aa-btn--primaire { background: linear-gradient(135deg, var(--st-cuivre-2), var(--st-cuivre) 60%, #7d4a35); color: #fff; box-shadow: 0 10px 22px -12px rgba(143, 86, 63, .8), inset 0 1px 0 rgba(255, 255, 255, .22); }
html:not(#_) .aa-btn--primaire:hover { filter: brightness(1.05); box-shadow: 0 14px 28px -12px rgba(143, 86, 63, .9), inset 0 1px 0 rgba(255, 255, 255, .25); }
html:not(#_) .aa-btn--secondaire { background: var(--aa-surface); color: var(--aa-secondaire); border: 2px solid var(--st-cuivre-clair); box-shadow: 0 8px 18px -14px rgba(143, 86, 63, .6); }
html:not(#_) .aa-btn--secondaire:hover { background: var(--st-cuivre-pale); border-color: var(--st-cuivre); color: var(--st-cuivre); }
html:not(#_) .aa-ligne__lire { background: var(--aa-surface); color: var(--st-cuivre); border: 2px solid var(--st-cuivre-clair); box-shadow: none; }
html:not(#_) .aa-ligne__lire:hover { background: var(--st-cuivre); color: #fff; border-color: var(--st-cuivre); }

/* ---------- en-tête : dalle de béton pleine largeur, filet cuivre ---------- */
html:not(#_) .aa-header { background: var(--st-beton) var(--st-grain); border-bottom: 0; padding: 0; box-shadow: 0 1px 0 var(--st-cuivre-clair), 0 8px 24px -18px rgba(60, 40, 30, .35); }
html:not(#_) .aa-header__in { background: none; backdrop-filter: none; border-radius: 0; box-shadow: none; padding: .55rem var(--aa-gout); min-height: 66px; }
html:not(#_) .aa-logo { font-style: normal; font-weight: 700; font-size: 1.3rem; letter-spacing: -.01em; color: var(--aa-texte); gap: .65rem; }
html:not(#_) .aa-logo__mark { width: 16px; height: 16px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #d9a381, var(--st-cuivre) 62%); box-shadow: 0 0 0 3px var(--st-beton), 0 0 0 4.5px var(--st-cuivre-clair); }
html:not(#_) .aa-nav a { border-radius: 999px; color: var(--aa-texte); font-weight: 600; }
html:not(#_) .aa-nav a:hover, html:not(#_) .aa-nav a.is-actif { background: var(--aa-surface); color: var(--st-cuivre); box-shadow: inset 0 0 0 1px var(--st-cuivre-clair); }
html:not(#_) .aa-nav__cta a { background: linear-gradient(135deg, var(--st-cuivre-2), var(--st-cuivre)); color: #fff !important; box-shadow: 0 8px 18px -10px rgba(143, 86, 63, .8); }
html:not(#_) .aa-burger { color: var(--aa-texte); }
@media (max-width: 800px) {
  html:not(#_) .aa-nav { background: var(--st-beton-3) var(--st-grain); border: 0; border-top: 3px solid var(--st-cuivre-clair); border-radius: 0 0 28px 28px; box-shadow: 0 24px 40px -20px rgba(60, 40, 30, .45); padding: .8rem var(--aa-gout) 1.1rem; }
  html:not(#_) .aa-nav a { padding: .8rem 1rem; }
  html:not(#_) .aa-nav a:hover, html:not(#_) .aa-nav a.is-actif { background: var(--aa-surface); }
}

/* ---------- héros : panneau béton, cœur en fond, formulaire pétale ---------- */
html:not(#_) .aa-hero { background: var(--st-coeur) right -40px bottom -60px / 300px no-repeat, linear-gradient(180deg, var(--st-beton-3), var(--aa-fond)); border: 0; border-bottom: 1px solid var(--st-beton-2); margin-top: -1.2rem; padding: 2.4rem 0 2.2rem; }
html:not(#_) .aa-hero__chiffres { display: inline-block; color: var(--st-cuivre); background: var(--aa-surface); border: 1px solid var(--st-cuivre-clair); border-radius: 999px; padding: .3rem .9rem; font-size: .9rem; }
html:not(#_) .aa-hero__form { background: var(--st-metal) top / 100% 4px no-repeat, var(--aa-surface); border: 0; border-radius: var(--st-petale); padding: 1.5rem 1.4rem 1.3rem; box-shadow: 0 24px 50px -28px rgba(143, 86, 63, .55), 0 2px 6px rgba(60, 40, 30, .05); }
html:not(#_) .aa-hero__form-h { color: var(--aa-texte); font-size: 1.25rem; }
html:not(#_) .aa-hero__form-p { color: var(--aa-muet); }

/* ---------- chips & champs ---------- */
html:not(#_) .aa-chips li, html:not(#_) .aa-chip { background: var(--st-beton-3); border: 1px solid var(--st-beton-2); color: var(--aa-texte); border-radius: 999px; }
html:not(#_) .aa-chip:has(input:checked) { background: var(--st-cuivre-pale); border-color: var(--st-cuivre); color: var(--st-cuivre); }
html:not(#_) .aa-chip input { accent-color: var(--st-cuivre); }
html:not(#_) select, html:not(#_) input[type="text"], html:not(#_) input[type="email"], html:not(#_) input[type="tel"], html:not(#_) input[type="number"], html:not(#_) textarea { background: #fff; border: 1.5px solid var(--st-beton-2); border-radius: 12px; color: var(--aa-texte); }
html:not(#_) select:focus, html:not(#_) input:focus, html:not(#_) textarea:focus { outline: 2px solid var(--st-cuivre); border-color: var(--st-cuivre); }
html:not(#_) .aa-form__lbl { color: var(--aa-texte); }
html:not(#_) .aa-form__aide, html:not(#_) .aa-form__sep { color: var(--aa-muet); }

/* ---------- moteur (filtres) : dalle béton ---------- */
html:not(#_) .aa-filtres { background: var(--st-beton) var(--st-grain); border: 0; border-radius: var(--st-petale); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6), 0 12px 30px -22px rgba(60, 40, 30, .5); padding: 1.1rem 1.2rem; }
html:not(#_) .aa-filtres__champ { color: var(--aa-texte); }

/* ---------- catégories : cartouches à médaillon ---------- */
html:not(#_) .aa-liens li { background: var(--aa-surface); border: 1px solid var(--st-beton-2); border-radius: 999px; padding: .4rem .5rem .4rem .95rem; align-items: center; box-shadow: 0 6px 16px -14px rgba(143, 86, 63, .6); transition: border-color .15s ease, transform .15s ease; }
html:not(#_) .aa-liens li:hover { border-color: var(--st-cuivre-clair); transform: translateY(-1px); }
html:not(#_) .aa-liens a { color: var(--aa-texte); font-weight: 600; }
html:not(#_) .aa-liens a:hover { color: var(--st-cuivre); text-decoration: none; }
html:not(#_) .aa-liens__nb { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; padding: 0 .45rem; border-radius: 999px; background: var(--st-beton); color: var(--aa-secondaire); font-size: .78rem; font-weight: 700; }
html:not(#_) .aa-compo-3 .aa-liens--cats li { padding: .65rem .6rem .65rem 1.1rem; border-radius: 4px 999px 999px 4px; border-left: 4px solid var(--st-cuivre); }
html:not(#_) .aa-compo-3 .aa-liens--cats .aa-liens__nb { background: linear-gradient(135deg, var(--st-cuivre-2), var(--st-cuivre)); color: #fff; box-shadow: 0 0 0 2px var(--aa-surface), 0 0 0 3px var(--st-cuivre-clair); }

/* ---------- lignes d'annonce : dalles, vignette en ARCHE cerclée de cuivre ---------- */
html:not(#_) .aa-liste { gap: .9rem; }
html:not(#_) .aa-ligne { background: var(--aa-surface); border: 1px solid var(--st-beton-2); border-left: 5px solid var(--st-cuivre); border-radius: 6px 22px 22px 6px; padding: .8rem .85rem .8rem .9rem; box-shadow: 0 14px 30px -22px rgba(143, 86, 63, .55); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
html:not(#_) .aa-ligne:hover { transform: translateY(-2px); border-color: var(--st-cuivre-clair); border-left-color: var(--st-cuivre); box-shadow: 0 22px 40px -22px rgba(143, 86, 63, .65); }
html:not(#_) .aa-ligne__img { border-radius: 48px 48px 12px 12px; background: var(--st-beton); box-shadow: 0 0 0 2px var(--aa-surface), 0 0 0 3.5px var(--st-cuivre-clair); }
html:not(#_) .aa-ligne__nb { background: rgba(42, 34, 32, .78); left: 50%; transform: translateX(-50%); bottom: .3rem; }
html:not(#_) .aa-ligne__cat { background: var(--st-cuivre-pale); color: var(--st-cuivre); border-radius: 999px; padding: .2rem .65rem; font-size: .66rem; }
html:not(#_) .aa-ligne__new { background: linear-gradient(135deg, var(--st-cuivre-2), var(--st-cuivre)); color: #fff; }
html:not(#_) .aa-ligne__date { color: var(--aa-muet); }
html:not(#_) .aa-ligne__titre { font-family: var(--aa-police-titre); font-size: 1.15rem; font-weight: 700; color: var(--aa-texte); }
html:not(#_) .aa-ligne__titre a { color: var(--aa-texte); }
html:not(#_) .aa-ligne__titre a:hover { color: var(--st-cuivre); }
html:not(#_) .aa-ligne__meta { color: var(--aa-muet); }
html:not(#_) .aa-ligne__meta a { color: var(--st-cuivre); }
html:not(#_) .aa-ligne__extrait { color: var(--aa-texte); opacity: .82; }
@media (min-width: 720px) {
  html:not(#_) .aa-ligne { padding: .9rem 1.1rem .9rem 1rem; border-radius: 6px 26px 26px 6px; }
  html:not(#_) .aa-ligne__img { border-radius: 60px 60px 14px 14px; }
}
html:not(#_) .aa-ligne--brute { border-left-width: 5px; border-left-style: dashed; }

/* ---------- panneaux latéraux : béton, pétale ---------- */
html:not(#_) .aa-side { background: var(--st-beton-3) var(--st-grain); border: 1px solid var(--st-beton-2); border-radius: var(--st-petale); box-shadow: none; padding: 1.05rem 1.2rem 1rem; }
html:not(#_) .aa-side__h { color: var(--st-cuivre); font-style: normal; font-weight: 700; letter-spacing: .02em; font-size: 1.05rem; }
html:not(#_) .aa-side__liste li { border-top: 1px solid var(--st-beton-2); }
html:not(#_) .aa-side__liste a { color: var(--aa-texte); }
html:not(#_) .aa-side__liste a:hover, html:not(#_) .aa-side__liste li.is-actif a { color: var(--st-cuivre); }
html:not(#_) .aa-side__nb { color: var(--aa-muet); }
html:not(#_) .aa-side__aide { color: var(--aa-muet); }

/* ---------- pagination, fil d'Ariane ---------- */
html:not(#_) .aa-pagination a, html:not(#_) .aa-pagination span { border: 1px solid var(--st-beton-2); border-radius: 999px; background: var(--aa-surface); color: var(--aa-texte); box-shadow: none; }
html:not(#_) .aa-pagination .is-actif { background: var(--st-cuivre); color: #fff; border-color: var(--st-cuivre); }
html:not(#_) .aa-crumbs ol { color: var(--aa-muet); }

/* ---------- CTA « inserieren » : carte centrée, avec de l'air ---------- */
html:not(#_) .aa-bloc--deposer .aa-deposer-cta { max-width: 560px; margin: .5rem auto 0; padding: 2.2rem 1.6rem; text-align: center; background: var(--st-coeur) right -30px bottom -40px / 200px no-repeat, var(--st-beton-3); border: 1px solid var(--st-beton-2); border-radius: 36px 36px 36px 8px; box-shadow: 0 18px 40px -26px rgba(143, 86, 63, .6); }
html:not(#_) .aa-bloc--deposer .aa-deposer-cta .aa-btn { min-height: 50px; padding-inline: 1.8em; }

/* ---------- fiche d'annonce ---------- */
html:not(#_) .aa-fiche__cat { color: var(--st-cuivre); }
html:not(#_) .aa-fiche__titre { color: var(--aa-texte); }
html:not(#_) .aa-fiche__sous { color: var(--aa-muet); }
html:not(#_) .aa-fiche__sous a { color: var(--st-cuivre); }
html:not(#_) .aa-fiche__photo { border-radius: 150px 150px 22px 22px; box-shadow: 0 0 0 3px var(--aa-surface), 0 0 0 5px var(--st-cuivre-clair), 0 26px 50px -28px rgba(143, 86, 63, .7); background: var(--st-beton); }
html:not(#_) .aa-fiche__photo--vide { border-radius: 22px; border: 1px dashed var(--st-cuivre-clair); }
html:not(#_) .aa-fiche__photo .aa-fiche__new { top: auto; bottom: .7rem; right: 50%; transform: translateX(50%); }
html:not(#_) .aa-fiche__new { background: linear-gradient(135deg, var(--st-cuivre-2), var(--st-cuivre)); color: #fff; }
html:not(#_) .aa-fiche__miniatures img { border-radius: 30px 30px 8px 8px; border-color: var(--st-beton-2); }
html:not(#_) .aa-fiche__miniatures img:hover { border-color: var(--st-cuivre); }
html:not(#_) .aa-fiche__meta { color: var(--aa-muet); }
html:not(#_) .aa-fiche__infos { background: var(--st-beton-3) var(--st-grain); border: 1px solid var(--st-beton-2); border-radius: var(--st-petale); box-shadow: none; }
html:not(#_) .aa-fiche__infos dt { color: var(--aa-muet); }
html:not(#_) .aa-fiche__infos dd, html:not(#_) .aa-fiche__infos a { color: var(--st-cuivre); font-weight: 600; }
html:not(#_) .aa-fiche__cta--haut { background: var(--st-metal) top / 100% 4px no-repeat, var(--aa-surface); border: 1px solid var(--st-beton-2); border-radius: var(--st-petale); padding: 1.15rem 1rem 1rem; box-shadow: 0 22px 44px -26px rgba(143, 86, 63, .6); }
html:not(#_) .aa-fiche__plage { background: var(--st-cuivre-pale); color: var(--st-cuivre); border-radius: 999px; padding: .45rem 1rem; }
html:not(#_) .aa-fiche__phy { background: var(--aa-surface); border: 1px solid var(--st-beton-2); border-left: 3px solid var(--st-cuivre-clair); border-radius: 4px 14px 14px 4px; }
html:not(#_) .aa-fiche__physique dt { color: var(--aa-muet); }
html:not(#_) .aa-fiche__physique dd { color: var(--aa-texte); }
html:not(#_) .aa-repondre { background: var(--st-beton-3) var(--st-grain); border: 1px solid var(--st-beton-2); border-radius: var(--st-petale); box-shadow: none; padding: 1.4rem 1.3rem 1.3rem; }
html:not(#_) .aa-repondre__intro { color: var(--aa-muet); }
html:not(#_) .aa-repondre input, html:not(#_) .aa-repondre textarea { background: #fff; }
html:not(#_) .aa-fiche__signaler, html:not(#_) .aa-retour { color: var(--aa-muet); }
html:not(#_) .aa-fiche__signaler a, html:not(#_) .aa-retour a { color: var(--st-cuivre); }
/* barre basse mobile : couleurs seulement, jamais la position */
html:not(#_) .aa-fiche__barre { background: rgba(233, 226, 218, .94); border: 1px solid var(--st-cuivre-clair); border-radius: 999px; box-shadow: 0 -10px 30px -16px rgba(60, 40, 30, .5); }

/* ---------- dépôt : dalles béton, légendes en pilule cuivre ---------- */
html:not(#_) .aa-depot__bloc { background: var(--st-beton-3) var(--st-grain); border: 1px solid var(--st-beton-2); border-radius: var(--st-petale); box-shadow: none; padding: 1.1rem 1.2rem 1.3rem; }
html:not(#_) .aa-depot__bloc legend { background: linear-gradient(135deg, var(--st-cuivre-2), var(--st-cuivre)); color: #fff; border-radius: 999px; padding: .25rem .95rem; font-size: .95rem; font-weight: 700; letter-spacing: .01em; }
html:not(#_) .aa-depot__bloc input, html:not(#_) .aa-depot__bloc select, html:not(#_) .aa-depot__bloc textarea { background: #fff; }
html:not(#_) .aa-depot__apercu img { border-radius: 24px 24px 8px 8px; }
html:not(#_) .aa-regles { color: var(--aa-muet); }
html:not(#_) .aa-form__check { color: var(--aa-texte); }
html:not(#_) .aa-form__check input { accent-color: var(--st-cuivre); }
html:not(#_) .aa-vide { background: var(--st-beton-3); border: 1px dashed var(--st-cuivre-clair); color: var(--aa-muet); border-radius: var(--st-petale); box-shadow: none; }

/* ---------- pied de page : béton sombre en arche, titres cuivre ---------- */
html:not(#_) .aa-footer { background: var(--aa-pied) var(--st-grain); color: var(--aa-pied-txt); border-radius: 44px 44px 0 0; margin-top: 3.5rem; padding: 2.6rem var(--aa-gout) 1rem; box-shadow: inset 0 4px 0 var(--st-cuivre-clair); }
html:not(#_) .aa-footer__grid, html:not(#_) .aa-footer__bas { background: none; border-radius: 0; box-shadow: none; padding: 0 var(--aa-gout); }
html:not(#_) .aa-footer a { color: var(--aa-pied-txt); }
html:not(#_) .aa-footer a:hover { color: #fff; }
html:not(#_) .aa-footer__h, html:not(#_) .aa-footer__brand { color: #d9a381; font-style: normal; }
html:not(#_) .aa-footer__h { text-transform: uppercase; letter-spacing: .1em; font-size: .78rem; }
html:not(#_) .aa-footer__brand { font-size: 1.25rem; }
html:not(#_) .aa-footer__brand::before { content: ""; display: inline-block; width: 12px; height: 12px; margin-right: .5rem; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #d9a381, var(--st-cuivre) 62%); box-shadow: 0 0 0 2px var(--aa-pied), 0 0 0 3.5px #d9a381; vertical-align: 0; }
html:not(#_) .aa-footer__fictif, html:not(#_) .aa-footer__membres { color: #cfc3ba; opacity: 1; }
html:not(#_) .aa-footer__bas { margin-top: 1.8rem; padding-top: 1rem; border-top: 1px solid rgba(217, 163, 129, .3); color: #cfc3ba; opacity: 1; }

/* ---------- porte 18+ et pop-up : arche, médaillon ---------- */
html:not(#_) .aa-gate { background: rgba(52, 43, 39, .86); }
html:not(#_) .aa-popup { background: rgba(42, 34, 32, .8); }
html:not(#_) .aa-gate__box, html:not(#_) .aa-popup__box { background: var(--st-metal) top / 100% 5px no-repeat, var(--aa-surface); border-radius: 34px 34px 20px 20px; color: var(--aa-texte); }
html:not(#_) .aa-gate__mark { width: 78px; height: 78px; line-height: 78px; background: radial-gradient(circle at 35% 30%, #d9a381, var(--st-cuivre) 62%); color: #fff; box-shadow: 0 0 0 4px var(--aa-surface), 0 0 0 6px var(--st-cuivre-clair); }
html:not(#_) .aa-popup__pour { color: var(--st-cuivre); }
html:not(#_) .aa-popup__texte { color: var(--aa-muet); }
html:not(#_) .aa-popup__fermer { color: var(--aa-muet); }
html:not(#_) .aa-spin { border-color: var(--st-beton-2); border-top-color: var(--st-cuivre); }

/* ---------- 404, pages statiques ---------- */
html:not(#_) .aa-statique .aa-intro { color: var(--aa-muet); }
html:not(#_) :focus-visible { outline-color: var(--st-cuivre); }

@media (prefers-reduced-motion: reduce) {
  html:not(#_) .aa-ligne, html:not(#_) .aa-liens li { transition: none; }
}