/* gay-hookups.us — habillage « tableau d'affichage de laverie »
   Registre : petites annonces punaisées sur liège clair, étiquettes à détacher, sarcelle sur kraft.
   Palette : accent sarcelle #0f6e7a (favicon) · sarcelle foncée #0b5560 (liens sur kraft) ·
             neutres chauds crème #f7f0e2 / papier #fffdf7 / kraft #e8d9bb / liège #d6bb8f · encre #1f2a2c.
   Formes signature : punaise ronde (pastille), médaillon de vignette cerclé, bord perforé
   « à détacher », bande de scotch kraft, cartouche-étiquette, cœur SVG en filigrane du CTA. */

body.aa.skin-3 {
  --aa-fond: #f7f0e2;
  --aa-surface: #fffdf7;
  --aa-texte: #1f2a2c;
  --aa-muet: #5b5247;
  --aa-bord: #e2d3b6;
  --aa-lien: #0b5d68;
  --aa-secondaire: #0b5560;
  --aa-rayon: 6px; --aa-rayon-s: 4px;
  --aa-ombre: 0 2px 3px rgba(80, 55, 25, .10), 0 14px 26px -16px rgba(15, 110, 122, .45);
  --gh-teal: #0f6e7a; --gh-teal-d: #0b5560; --gh-kraft: #e8d9bb; --gh-liege: #d6bb8f; --gh-papier: #fffdf7;
  --gh-pin: radial-gradient(circle at 35% 35%, #6fc3cd 0 18%, #0f6e7a 45%, #08434a 100%);
  --aa-police: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --aa-police-titre: "Arial Rounded MT Bold", "Trebuchet MS", "Segoe UI", sans-serif;
  background: var(--aa-fond);
}

/* --- en-tête : bandeau de liège, logo en étiquette punaisée ---------------- */
body.aa.skin-3 .aa-header {
  --aa-texte: #1f2a2c;
  background-color: var(--gh-liege);
  background-image:
    radial-gradient(circle at 30% 40%, rgba(110, 72, 32, .22) 1px, transparent 1.6px),
    radial-gradient(circle at 70% 60%, rgba(255, 245, 225, .35) 1px, transparent 1.6px),
    radial-gradient(circle at 50% 20%, rgba(90, 60, 25, .14) 1.4px, transparent 2px);
  background-size: 7px 7px, 11px 11px, 17px 17px;
  border-bottom: 0;
  box-shadow: inset 0 -6px 10px -8px rgba(60, 40, 15, .5);
  padding-bottom: .6rem;
}
body.aa.skin-3 .aa-logo {
  position: relative; align-self: center; margin: 1rem auto .8rem; padding: .55rem 1.6rem .5rem;
  background: var(--gh-papier); color: var(--aa-texte); border-radius: 3px;
  box-shadow: 0 1px 2px rgba(60, 40, 15, .25), 0 10px 18px -10px rgba(60, 40, 15, .55);
  transform: rotate(-1.2deg); font-family: var(--aa-police-titre); font-size: 1.45rem; letter-spacing: .1em;
}
body.aa.skin-3 .aa-logo::before {
  content: ""; position: absolute; top: -7px; left: 50%; width: 15px; height: 15px; margin-left: -7px;
  border-radius: 50%; background: var(--gh-pin); box-shadow: 1px 2px 2px rgba(0, 0, 0, .35);
}
body.aa.skin-3 .aa-logo__txt { color: var(--aa-texte); }
body.aa.skin-3 .aa-logo:hover { text-decoration: none; transform: rotate(0deg); }
body.aa.skin-3 .aa-burger { background: var(--gh-papier); border-radius: 50%; box-shadow: 0 4px 10px -4px rgba(60, 40, 15, .5); top: 1rem; }
body.aa.skin-3 .aa-burger span { background: var(--gh-teal-d); }
body.aa.skin-3 .aa-nav { border: 0; background: transparent; }
body.aa.skin-3 .aa-nav ul { gap: .45rem; padding: .1rem 0; }
body.aa.skin-3 .aa-nav a {
  display: block; background: var(--gh-papier); color: var(--aa-texte); border-radius: 999px;
  padding: .45rem 1rem; font-size: .8rem; font-weight: 700; letter-spacing: .07em;
  box-shadow: 0 3px 8px -5px rgba(60, 40, 15, .6);
}
body.aa.skin-3 .aa-nav a:hover, body.aa.skin-3 .aa-nav a.is-actif { background: var(--gh-teal-d); color: #fff; text-decoration: none; }
body.aa.skin-3 .aa-nav__cta a { background: var(--gh-teal); color: #fff; }
@media (max-width: 800px) {
  body.aa.skin-3 .aa-nav { background: transparent; }
  body.aa.skin-3 .aa-nav ul { display: grid; grid-template-columns: 1fr 1fr; padding: .4rem 0 .2rem; }
  body.aa.skin-3 .aa-nav a { padding: .7rem .8rem; }
}

/* --- titres -------------------------------------------------------------- */
body.aa.skin-3 .aa-h1 { font-family: var(--aa-police-titre); text-transform: none; letter-spacing: 0; border-bottom: 0; }
body.aa.skin-3 .aa-h2 {
  display: inline-block; background: var(--gh-kraft); color: var(--aa-texte); border: 0;
  padding: .35rem 1rem .3rem .8rem; border-radius: 3px 999px 999px 3px; font-size: .92rem; letter-spacing: .08em;
  box-shadow: inset 4px 0 0 var(--gh-teal);
}

/* --- hero : note crème + formulaire épinglé avec scotch ------------------- */
body.aa.skin-3 .aa-hero {
  background: linear-gradient(180deg, #fbf5ea, var(--aa-fond)); border: 0; margin-top: -1.5rem;
}
body.aa.skin-3 .aa-hero .aa-h1 { color: var(--aa-texte); }
body.aa.skin-3 .aa-hero__chiffres span {
  display: inline-block; background: var(--gh-teal-d); color: #fff; border-radius: 999px; padding: .3rem .9rem;
  font-size: .85rem;
}
body.aa.skin-3 .aa-hero__form {
  position: relative; background: var(--gh-papier); border: 0; border-radius: 4px;
  box-shadow: 0 2px 4px rgba(60, 40, 15, .12), 0 22px 36px -22px rgba(15, 110, 122, .6);
  transform: rotate(.6deg); padding-top: 1.6rem;
}
body.aa.skin-3 .aa-hero__form::before {
  content: ""; position: absolute; top: -11px; left: 50%; width: 110px; height: 24px; margin-left: -55px;
  background: rgba(214, 187, 143, .78); transform: rotate(-3deg);
  box-shadow: 0 1px 2px rgba(60, 40, 15, .2);
}
body.aa.skin-3 .aa-hero__form-h { color: var(--aa-texte); }
body.aa.skin-3 .aa-chip { border-radius: 999px; }

/* --- boutons : pilules sarcelle ------------------------------------------ */
body.aa.skin-3 .aa-btn { border-radius: 999px; letter-spacing: .05em; }
body.aa.skin-3 .aa-btn--primaire { background: var(--gh-teal); border-color: var(--gh-teal); color: #fff; box-shadow: 0 8px 16px -10px rgba(15, 110, 122, .9); }
body.aa.skin-3 .aa-btn--primaire:hover { background: var(--gh-teal-d); }
body.aa.skin-3 .aa-btn--secondaire { background: var(--gh-papier); color: var(--gh-teal-d); border: 2px solid var(--gh-teal); }

/* --- liste : fiches punaisées, légèrement décalées, bord à détacher -------- */
body.aa.skin-3 .aa-liste { gap: 1.1rem; border: 0; padding: .6rem 0 .4rem; }
body.aa.skin-3 .aa-ligne {
  background: var(--gh-papier); border: 0; border-radius: 3px;
  box-shadow: 0 1px 2px rgba(60, 40, 15, .12), 0 12px 20px -14px rgba(15, 110, 122, .5);
  padding: 1.05rem .9rem 1.2rem; transition: transform .2s ease, box-shadow .2s ease;
}
body.aa.skin-3 .aa-ligne:nth-child(odd) { transform: rotate(-.35deg); }
body.aa.skin-3 .aa-ligne:nth-child(even) { transform: rotate(.35deg); }
body.aa.skin-3 .aa-ligne::before {
  content: ""; position: absolute; top: -6px; left: 50%; width: 13px; height: 13px; margin-left: -6px; z-index: 2;
  border-radius: 50%; background: var(--gh-pin); box-shadow: 1px 2px 2px rgba(0, 0, 0, .3);
}
/* bord perforé « à détacher » en bas de chaque fiche */
body.aa.skin-3 .aa-ligne {
  background-image: radial-gradient(circle at 6px 4px, var(--aa-fond) 2.6px, transparent 3px);
  background-size: 14px 8px; background-repeat: repeat-x; background-position: 0 100%;
}
body.aa.skin-3 .aa-ligne:hover { background-color: #fff; transform: rotate(0deg) translateY(-2px); box-shadow: 0 2px 4px rgba(60, 40, 15, .12), 0 20px 30px -18px rgba(15, 110, 122, .65); }
body.aa.skin-3 .aa-ligne:last-child { border-bottom: 0; }
body.aa.skin-3 .aa-ligne__img {
  border: 3px solid #fff; box-shadow: 0 0 0 2px var(--gh-teal), 0 8px 14px -8px rgba(60, 40, 15, .6);
  overflow: hidden;
}
body.aa.skin-3 .aa-ligne__img img { transition: transform .35s ease; }
body.aa.skin-3 .aa-ligne:hover .aa-ligne__img img { transform: scale(1.06); }
body.aa.skin-3 .aa-ligne__cat {
  display: inline-block; background: var(--gh-kraft); color: var(--aa-texte); padding: .05rem .5rem;
  border-radius: 2px 999px 999px 2px;
}
body.aa.skin-3 .aa-ligne__new { background: var(--gh-teal-d); color: #fff; border-radius: 999px; padding-inline: .45rem; }
body.aa.skin-3 .aa-ligne__titre { font-family: var(--aa-police-titre); font-weight: 700; }
body.aa.skin-3 .aa-ligne__titre a { color: var(--aa-texte); }
body.aa.skin-3 .aa-ligne__meta, body.aa.skin-3 .aa-ligne__date { color: var(--aa-muet); }
body.aa.skin-3 .aa-ligne__extrait { color: #3d3730; }
body.aa.skin-3 .aa-ligne__lire { border-radius: 999px; }
@media (min-width: 720px) {
  body.aa.skin-3 .aa-ligne { padding: 1.1rem 1.1rem 1.3rem; }
  body.aa.skin-3 .aa-ligne:nth-child(odd) { margin-right: 1.4rem; }
  body.aa.skin-3 .aa-ligne:nth-child(even) { margin-left: 1.4rem; }
  body.aa.skin-3 .aa-ligne__corps, body.aa.skin-3 .aa-ligne__extrait,
  body.aa.skin-3 .aa-ligne__action { border-left: 1px dashed var(--aa-bord); }
}

/* --- encadrés latéraux / filtres / liens : fiches bristol ----------------- */
body.aa.skin-3 .aa-layout__side { border-top: 0; }
body.aa.skin-3 .aa-side__h { border-bottom: 2px dashed var(--gh-liege); }
body.aa.skin-3 .aa-filtres { background: var(--gh-papier); border: 0; border-radius: 4px; box-shadow: var(--aa-ombre); }
body.aa.skin-3 .aa-liens--cats li, body.aa.skin-3 .aa-compo-2 .aa-liens--cats li {
  background: var(--gh-papier); border: 1px dashed var(--gh-liege); border-radius: 999px;
}
body.aa.skin-3 .aa-pagination a, body.aa.skin-3 .aa-pagination span { border-radius: 999px; border-color: var(--gh-teal); }
body.aa.skin-3 .aa-crumbs a { color: var(--aa-lien); }

/* --- fiche d'annonce ------------------------------------------------------ */
body.aa.skin-3 .aa-fiche__cat a {
  display: inline-block; background: var(--gh-kraft); color: var(--aa-texte); padding: .15rem .7rem;
  border-radius: 2px 999px 999px 2px; box-shadow: inset 3px 0 0 var(--gh-teal);
}
body.aa.skin-3 .aa-fiche__titre { font-family: var(--aa-police-titre); }
/* photo en polaroid punaisé (les dimensions restent celles du gabarit) */
body.aa.skin-3 .aa-fiche__photo--scene {
  background: #fff !important; border: 0; padding: 10px 10px 30px !important; border-radius: 3px;
  box-shadow: 0 2px 4px rgba(60, 40, 15, .14), 0 20px 30px -20px rgba(15, 110, 122, .6);
  transform: rotate(1deg); overflow: visible;
}
body.aa.skin-3 .aa-fiche__photo--scene::before {
  content: ""; position: absolute; top: -7px; left: 50%; width: 16px; height: 16px; margin-left: -8px; z-index: 3;
  border-radius: 50%; background: var(--gh-pin); box-shadow: 1px 2px 2px rgba(0, 0, 0, .35);
}
body.aa.skin-3 .aa-fiche__new { background: var(--gh-teal-d); color: #fff; border-radius: 999px; }
body.aa.skin-3 .aa-fiche__infos {
  border: 0; border-radius: 3px; background-color: var(--gh-papier);
  box-shadow: var(--aa-ombre); border-top: 4px solid var(--gh-teal);
}
/* carte d'action : note scotchée, cœur en filigrane, boutons inchangés de place */
body.aa.skin-3 .aa-fiche__cta--haut {
  position: relative; background-color: var(--gh-papier); border: 0; border-radius: 4px; padding: 1.4rem 1.1rem 1.1rem;
  box-shadow: 0 2px 4px rgba(60, 40, 15, .12), 0 22px 34px -22px rgba(15, 110, 122, .7);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%230f6e7a' fill-opacity='.08' d='M12 21s-7.5-4.6-9.6-9.2C.9 8.4 3 4.5 6.7 4.5c2.1 0 3.6 1.2 4.3 2.5.7-1.3 2.2-2.5 4.3-2.5 3.7 0 5.8 3.9 4.3 7.3C19.5 16.4 12 21 12 21z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right -14px bottom -18px; background-size: 120px;
}
body.aa.skin-3 .aa-fiche__cta--haut::before {
  content: ""; position: absolute; top: -10px; left: 50%; width: 96px; height: 22px; margin-left: -48px;
  background: rgba(214, 187, 143, .8); transform: rotate(2deg); box-shadow: 0 1px 2px rgba(60, 40, 15, .2);
}
body.aa.skin-3 .aa-fiche__plage { background: var(--gh-kraft); color: var(--aa-texte); border-radius: 999px; }
body.aa.skin-3 .aa-fiche__phy { background: var(--gh-papier); border: 1px dashed var(--gh-liege); border-radius: 4px; }
body.aa.skin-3 .aa-repondre, body.aa.skin-3 .aa-depot__bloc {
  background: var(--gh-papier); border: 0; border-radius: 4px; box-shadow: var(--aa-ombre);
  border-top: 4px solid var(--gh-teal);
  background-image: radial-gradient(circle at 6px 4px, var(--aa-fond) 2.6px, transparent 3px);
  background-size: 14px 8px; background-repeat: repeat-x; background-position: 0 100%;
  padding-bottom: 1.4rem;
}
body.aa.skin-3 .aa-form input, body.aa.skin-3 .aa-form select, body.aa.skin-3 .aa-form textarea { border-radius: 4px; border-color: #b49d72; background-color: #fff; }
body.aa.skin-3 .aa-form input:focus, body.aa.skin-3 .aa-form select:focus, body.aa.skin-3 .aa-form textarea:focus { border-color: var(--gh-teal); outline: 2px solid rgba(15, 110, 122, .25); }
body.aa.skin-3 .aa-chip { border-color: #b49d72; }

/* --- porte d'âge / pop-up : note punaisée --------------------------------- */
body.aa.skin-3 .aa-gate__box, body.aa.skin-3 .aa-popup__box {
  background: var(--gh-papier); border: 0; border-radius: 6px; border-top: 5px solid var(--gh-teal);
  box-shadow: 0 30px 60px -24px rgba(8, 67, 74, .7);
}

/* --- pied de page : kraft ------------------------------------------------- */
body.aa.skin-3 .aa-footer {
  --aa-texte: #1f2a2c; --aa-muet: #4a4238; --aa-bord: #cdb98f; --aa-lien: #0a4f59;
  background: var(--gh-kraft); color: #1f2a2c; border-top: 0;
  background-image: radial-gradient(circle at 7px 0, var(--aa-fond) 5px, transparent 5.5px);
  background-size: 18px 10px; background-repeat: repeat-x; background-position: 0 0;
  padding-top: .8rem;
}
body.aa.skin-3 .aa-footer a { color: #0a4f59; }
body.aa.skin-3 .aa-footer__brand { color: #1f2a2c; }
body.aa.skin-3 .aa-footer__h { color: #1f2a2c; }

@media (max-width: 719px) {
  body.aa.skin-3 .aa-hero__form { transform: rotate(.3deg); }
  body.aa.skin-3 .aa-fiche__photo--scene { transform: rotate(.5deg); }
  body.aa.skin-3 .aa-ligne:nth-child(odd) { transform: rotate(-.2deg); }
  body.aa.skin-3 .aa-ligne:nth-child(even) { transform: rotate(.2deg); }
}
@media (prefers-reduced-motion: reduce) {
  body.aa.skin-3 .aa-ligne, body.aa.skin-3 .aa-ligne__img img { transition: none; }
}
