/* __DESIGN_SITE__ */
/* socle filtres (ajouté par design_site.py) */
html:not(#_) .ds-hide{ display: none !important; }
html:not(#_) body[data-ds-filtres="aucun"] .filters{ display: none !important; }
html:not(#_) body[data-ds-filtres="sans-genre"] .filters .filter-btn[data-filter="type"]{ display: none !important; }
html:not(#_) body[data-ds-filtres="sans-age"] .filters .filter-btn[data-filter="age"]{ display: none !important; }
html:not(#_) body[data-ds-filtres="ligne"] .filters{ display: flex !important; flex-wrap: nowrap !important; overflow-x: auto; gap: 8px; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
html:not(#_) body[data-ds-filtres="ligne"] .filters::-webkit-scrollbar{ display: none; }
html:not(#_) body[data-ds-filtres="ligne"] .filters .filter-btn{ flex: 0 0 auto; white-space: nowrap; }
html:not(#_) .filters select.ds-fsel{ appearance: none; -webkit-appearance: none; font: inherit; cursor: pointer; padding-right: 2.1em; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='currentColor' stroke-width='2'/></svg>"); background-repeat: no-repeat; background-position: right .7em center; background-size: 12px 8px; }
html:not(#_) .filters .ds-fgroup{ display: contents; }
/* Next : barre React (div.shadow-sm > div.scrollbar-hide > .form-group > select ×2 + bouton Recherche) */
html:not(#_) body[data-ds-filtres="aucun"] div.rounded-lg.shadow-sm:has(> div.scrollbar-hide > div.form-group > select){ display: none !important; }
html:not(#_) body[data-ds-filtres="sans-genre"] div.scrollbar-hide > div.form-group:first-child:has(> select){ display: none !important; }
html:not(#_) body[data-ds-filtres="sans-tri"] div.scrollbar-hide > div.form-group:nth-child(2):has(> select){ display: none !important; }
html:not(#_) body[data-ds-filtres="sans-recherche"] div.scrollbar-hide > div.relative.flex-shrink-0:has(> button){ display: none !important; }
/* Next `chips` : pastilles d'âge construites par design_filtres.js (le select natif est caché) */
html:not(#_) .ds-fnext{ display: flex; gap: 8px; flex-wrap: nowrap; }
html:not(#_) .ds-fnext .ds-fchip{ flex: 0 0 auto; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--secondary-color, #999); background: transparent; color: inherit; font: inherit; font-size: .85rem; cursor: pointer; white-space: nowrap; }
html:not(#_) .ds-fnext .ds-fchip.active{ background: var(--secondary-color, #18181b); color: #fff; border-color: transparent; }

/* socle menu mobile Astro (ajouté par design_site.py) */
/* 19/09 : la croix du tiroir (label x injecte dans .sidebar-inner) n'etait cachee QUE sous 768 px -> visible en haut
   de la sidebar desktop (3 agents du lot 22 l'ont masquee a la main). Cachee hors tiroir, toutes largeurs. */
html:not(#_) .ds-menu-close{ display: none; }
@media (max-width: 768px) {
  html:not(#_) .ds-burger{ display: flex; flex-direction: column; justify-content: center; gap: 4px; width: 40px; height: 34px; padding: 0 9px; margin-right: 8px; cursor: pointer; border-radius: 8px; color: inherit; flex-shrink: 0; }
  html:not(#_) .ds-burger span{ display: block; height: 2px; border-radius: 2px; background: currentColor; transition: transform .2s, opacity .2s; }
  html:not(#_) body:has(#ds-menu:checked) .ds-burger span:nth-child(1){ transform: translateY(6px) rotate(45deg); }
  html:not(#_) body:has(#ds-menu:checked) .ds-burger span:nth-child(2){ opacity: 0; }
  html:not(#_) body:has(#ds-menu:checked) .ds-burger span:nth-child(3){ transform: translateY(-6px) rotate(-45deg); }
  html:not(#_) .ds-menu-overlay{ display: none; position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 1290; }
  html:not(#_) body:has(#ds-menu:checked) .ds-menu-overlay{ display: block; }
  html:not(#_) .ds-menu-close{ display: none; }
  html:not(#_) body:has(#ds-menu:checked) aside.sidebar{ display: block !important; position: fixed !important; top: 0 !important; left: 0; bottom: 0; height: auto !important; width: min(86vw, 340px) !important; max-width: none; margin: 0 !important; padding: 12px; padding-top: calc(12px + env(safe-area-inset-top, 0px)); z-index: 1300; overflow-y: auto !important; max-height: 100vh; max-height: 100dvh; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; border-radius: 0; box-shadow: 8px 0 30px rgba(0,0,0,.35); }
  html:not(#_) body:has(#ds-menu:checked) .ds-menu-close{ display: flex; align-items: center; justify-content: center; position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; border-radius: 50%; font-size: 26px; line-height: 1; cursor: pointer; z-index: 2; }
  html:not(#_) body:has(#ds-menu:checked) aside.sidebar .sidebar-inner{ height: auto; min-height: 100%; }
  html:not(#_) body:has(#ds-menu:checked){ overflow: hidden; }
}
@media (prefers-reduced-motion: reduce) { html:not(#_) .ds-burger span{ transition: none; } }

/* polyamour-rencontre.ch — registre « mobile suspendu » (13/11/2026)
   Iris (favicon #6d4bc4, foncé #563a9f pour tout ce qui porte du texte) sur crème et lin, encre aubergine.
   Formes signature : le FIL (logo suspendu, CTA suspendu, cartes qui oscillent depuis leur attache),
   la PASTILLE ronde reliée par un trait (liens de la sidebar, filtres, pagination, badges),
   les ANNEAUX ENTRELACÉS (titres, footer en blocs arrondis qui se chevauchent, bouton de retour). */

html:not(#_):root{
  --pa-iris: #6d4bc4; --pa-iris-d: #563a9f; --pa-iris-l: #e6ddf7; --pa-iris-t: rgba(109, 75, 196, .1);
  --pa-creme: #fffcf7; --pa-ivoire: #fbf6ee; --pa-lin: #f3ebdf; --pa-lin-d: #e4d8c5;
  --pa-encre: #251e35; --pa-encre-m: #5b5269; --pa-fil: #8c80a2;
  --bg: #fbf6ee; --bg-alt: #f3ebdf; --bg-card: #fffcf7; --text: #251e35; --text-muted: #5b5269; --border: #e4d8c5;
  --pa-serif: Charter, "Bitstream Charter", "Sitka Text", Cambria, Georgia, serif;
  --pa-mobile: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='60' viewBox='0 0 140 60'><path d='M70 0v12M24 12h92M24 12v16M70 12v23M116 12v12' fill='none' stroke='%238c80a2' stroke-width='1.2' stroke-linecap='round'/><circle cx='24' cy='35' r='7' fill='%236d4bc4'/><circle cx='70' cy='45' r='10' fill='none' stroke='%236d4bc4' stroke-width='2.4'/><circle cx='116' cy='29' r='5' fill='%23251e35'/></svg>");
  --pa-anneaux: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='16' viewBox='0 0 28 16'><circle cx='10' cy='8' r='6' fill='none' stroke='%236d4bc4' stroke-width='2'/><circle cx='18' cy='8' r='6' fill='none' stroke='%23251e35' stroke-width='2'/><path d='M14 3.53A6 6 0 0 1 16 8' fill='none' stroke='%236d4bc4' stroke-width='2'/></svg>");
  --pa-perles: radial-gradient(circle, #6d4bc4 0 1.8px, transparent 2.3px);
}
html:not(#_) body, html:not(#_) [style*="--secondary"]{ --secondary: #563a9f !important; }
html:not(#_) body{ background: var(--pa-ivoire); color: var(--pa-encre); }

/* ---------------------------------------------------------------- sidebar desktop : le logo pend à son fil */
html:not(#_) .sidebar-inner{
  background: radial-gradient(90% 40% at 50% 0%, var(--pa-iris-t), transparent 70%), var(--pa-creme);
  border: 1px solid var(--pa-lin-d); border-radius: 28px; padding: 0 14px 16px;
  box-shadow: 0 16px 36px rgba(86, 58, 159, .1), 0 2px 6px rgba(37, 30, 53, .05);
}
html:not(#_) .sb-logo{ flex-direction: column; justify-content: flex-start; gap: 12px; padding: 40px 6px 20px; text-align: center; }
html:not(#_) .sb-logo-dot{
  position: relative; overflow: visible; width: 50px; height: 50px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #8a6ad8, var(--pa-iris-d) 70%);
  box-shadow: 0 0 0 5px var(--pa-creme), 0 0 0 6.5px var(--pa-iris-l), 0 10px 20px rgba(86, 58, 159, .28);
  transform-origin: 50% -40px; animation: pa-balance 7s ease-in-out infinite;
}
html:not(#_) .sb-logo-dot::before{ content: ""; position: absolute; left: 50%; bottom: calc(100% + 5px); width: 1.5px; height: 40px; margin-left: -.75px; background: var(--pa-fil); }
html:not(#_) .sb-logo-dot svg{ color: #fff; }
html:not(#_) .sb-logo-text{ font-family: var(--pa-serif); font-weight: 600; font-size: 1.08rem; line-height: 1.25; color: var(--pa-encre); white-space: normal; }
@keyframes pa-balance { 0%, 100% { transform: rotate(-4deg); } 50% { transform: rotate(4deg); } }

/* liens : pastilles rondes enfilées sur un même trait */
html:not(#_) .sb-nav{ position: relative; gap: 6px; padding-bottom: 6px; }
html:not(#_) .sb-nav::before{ content: ""; position: absolute; left: 24px; top: 22px; bottom: 28px; width: 1.5px; background: var(--pa-lin-d); }
html:not(#_) .sb-link{ position: relative; color: var(--pa-encre-m); font-size: .88rem; padding: 5px 12px 5px 8px; border-radius: 999px; min-height: 42px; }
html:not(#_) .sb-link .sb-ico{
  position: relative; z-index: 1; width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0;
  background: var(--pa-creme); color: var(--pa-iris-d); box-shadow: inset 0 0 0 1.5px var(--pa-lin-d);
}
html:not(#_) .sb-link:hover{ background: var(--pa-lin); color: var(--pa-encre); }
html:not(#_) .sb-link:hover .sb-ico{ box-shadow: inset 0 0 0 1.5px var(--pa-iris); }
html:not(#_) .sb-link.active{ background: transparent; color: var(--pa-iris-d); font-weight: 700; }
html:not(#_) .sb-link.active .sb-ico{ background: var(--pa-iris-d); color: #fff; box-shadow: 0 0 0 3px var(--pa-creme), 0 0 0 4.5px var(--pa-iris-l), 0 4px 10px rgba(86, 58, 159, .3); }
html:not(#_) .sb-section{ border-top: 0; background: linear-gradient(90deg, transparent, var(--pa-lin-d), transparent) top / 100% 1px no-repeat; padding-top: 12px; }
html:not(#_) .sb-section-title{ color: var(--pa-encre-m); letter-spacing: .1em; font-size: .72rem; }
html:not(#_) .sb-section-title::before{ content: ""; flex: 0 0 28px; width: 28px; height: 16px; background: var(--pa-anneaux) center / contain no-repeat; }
html:not(#_) .sb-map-quick-link{ color: var(--pa-iris-d); border-radius: 999px; }
html:not(#_) .sb-map-quick-link:hover{ background: var(--pa-lin); }
html:not(#_) .sb-silo-region, html:not(#_) .sb-top-item{ color: #463e55; border-radius: 999px; }
html:not(#_) .sb-silo-region:hover, html:not(#_) .sb-top-item:hover, html:not(#_) .sb-silo-ville:hover{ background: var(--pa-lin); color: var(--pa-iris-d); }
html:not(#_) .sb-silo-ville{ color: var(--pa-encre-m); border-radius: 999px; }
html:not(#_) .sb-silo-villes{ border-left: 1.5px solid var(--pa-lin-d); margin-left: 16px; padding-left: 6px; }
html:not(#_) .sb-silo-more{ color: var(--pa-iris-d); }
html:not(#_) .sb-top-item .sb-ico{ color: var(--pa-iris); }

/* ---------------------------------------------------------------- barre haute mobile : ivoire, fil de perles dessous */
@media (max-width: 768px) {
  html:not(#_) .mobile-guest-top{
    background: var(--pa-perles) left 7px bottom 1px / 16px 6px repeat-x, linear-gradient(var(--pa-iris-l), var(--pa-iris-l)) left 0 bottom 3px / 100% 1px no-repeat, var(--pa-creme);
    color: var(--pa-encre); box-shadow: 0 8px 22px rgba(86, 58, 159, .14); padding-bottom: 8px;
  }
  html:not(#_) .mobile-guest-head{ border-bottom: 1px solid var(--pa-lin-d); }
  html:not(#_) .mobile-guest-brand{ color: var(--pa-encre) !important; font-family: var(--pa-serif); font-weight: 600; }
  html:not(#_) .mobile-guest-login{ color: var(--pa-iris-d) !important; font-weight: 700; }
  html:not(#_) .mobile-guest-cta-offer, html:not(#_) .mobile-guest-timer-label{ color: var(--pa-encre-m); }
  html:not(#_) .mobile-guest-cta-kw{ color: var(--pa-encre); font-family: var(--pa-serif); font-weight: 600; }
  html:not(#_) #mobileGuestTimer{ color: var(--pa-iris-d); }
  html:not(#_) .mobile-guest-cta-btn{
    background: linear-gradient(180deg, #7454c9, var(--pa-iris-d)); color: #fff !important; border-radius: 999px;
    min-height: 44px; display: flex; align-items: center; justify-content: center; box-sizing: border-box; font-size: .92rem;
    box-shadow: 0 8px 18px rgba(86, 58, 159, .3);
  }
  html:not(#_) body.has-mobile-guest-top{ padding-top: calc(146px + env(safe-area-inset-top, 0px)); }
  html:not(#_) .ds-burger{ color: var(--pa-encre); background: var(--pa-lin); border-radius: 50%; width: 38px; height: 38px; padding: 0 10px; box-sizing: border-box; box-shadow: inset 0 0 0 1.5px var(--pa-lin-d); }
  html:not(#_) .ds-menu-overlay{ background: rgba(37, 30, 53, .5); }
  html:not(#_) body:has(#ds-menu:checked) aside.sidebar{ background: var(--pa-lin); }
  html:not(#_) .ds-menu-close{ background: var(--pa-iris-d); color: #fff; box-shadow: 0 0 0 3px var(--pa-creme), 0 0 0 4.5px var(--pa-iris-l); }
  html:not(#_) aside.sidebar .sidebar-inner{ box-sizing: border-box; }
  html:not(#_) aside.sidebar .sb-logo{ padding-top: 34px; }
  html:not(#_) aside.sidebar .sb-link, html:not(#_) aside.sidebar .sb-silo-region, html:not(#_) aside.sidebar .sb-top-item{ min-height: 42px; font-size: .94rem; }
  html:not(#_) aside.sidebar .sb-silo-ville{ padding: 8px 10px; font-size: .88rem; }
}

/* ---------------------------------------------------------------- barre basse mobile : perles sur le fil */
html:not(#_) .bottom-bar{ background: var(--pa-perles) left 8px top 2px / 16px 6px repeat-x, linear-gradient(var(--pa-iris-l), var(--pa-iris-l)) left 0 top 4px / 100% 1px no-repeat, var(--pa-creme); border-top: 0; padding-top: 10px; box-shadow: 0 -8px 20px rgba(86, 58, 159, .1); }
html:not(#_) .btab{ color: var(--pa-encre-m); }
html:not(#_) .btab.active, html:not(#_) .btab:hover{ color: var(--pa-iris-d); }
html:not(#_) .btab.active .btab-ico{ background: var(--pa-iris-l); border-radius: 50%; box-shadow: 0 0 0 4px var(--pa-iris-l); }

/* ---------------------------------------------------------------- footer : lin, médaillon centré, colonnes en anneaux qui se chevauchent */
html:not(#_) .footer-v3{ background: var(--pa-lin); color: var(--pa-encre); margin-top: 3.5rem; border-top: 1px solid var(--pa-lin-d); }
html:not(#_) .footer-v3 .footer-inner{ max-width: 1180px; margin: 0 auto; padding: 0 1.25rem; box-sizing: border-box; }
html:not(#_) .footer-v3 .footer-top{
  flex-direction: column; justify-content: center; text-align: center; gap: 1rem; border-bottom: 0;
  padding: 92px 1rem 1.5rem; background: var(--pa-mobile) center 18px / 140px 60px no-repeat;
}
html:not(#_) .footer-v3 .footer-brand h3{ color: var(--pa-encre); font-family: var(--pa-serif); font-weight: 600; font-size: 1.55rem; }
html:not(#_) .footer-v3 .footer-brand p, html:not(#_) .footer-v3 .footer-newsletter p{ color: var(--pa-encre-m); }
html:not(#_) .footer-v3 .footer-newsletter .btn{ border-radius: 999px; min-height: 44px; padding: 10px 28px; display: inline-flex; align-items: center; background: var(--pa-iris-d); color: #fff; box-shadow: 0 8px 18px rgba(86, 58, 159, .28); }
html:not(#_) .footer-v3 .footer-grid{ display: flex; flex-wrap: wrap; justify-content: center; gap: 22px 0; padding: 1.5rem 12px 2.5rem; }
html:not(#_) .footer-v3 .footer-col{
  flex: 1 1 190px; max-width: 260px; min-height: 200px; margin: 0 -10px; box-sizing: border-box;
  display: flex; flex-direction: column; justify-content: center; text-align: center;
  padding: 30px 34px; border-radius: 100px; border: 2px solid var(--pa-iris); background: transparent;
}
html:not(#_) .footer-v3 .footer-col:nth-child(even){ border-color: var(--pa-encre); transform: translateY(14px); }
html:not(#_) .footer-v3 .footer-col:nth-child(4){ flex-basis: 250px; max-width: 300px; }
html:not(#_) .footer-v3 .footer-col h4{ color: var(--pa-encre); font-family: var(--pa-serif); font-size: 1rem; font-weight: 600; text-transform: none; letter-spacing: 0; }
html:not(#_) .footer-v3 .footer-col ul{ padding: 0; margin: 0; }
html:not(#_) .footer-v3 .footer-col a, html:not(#_) .footer-v3 .footer-col p{ color: #463e55; font-size: .86rem; text-decoration: none; }
html:not(#_) .footer-v3 .footer-col a:hover{ color: var(--pa-iris-d); text-decoration: underline; text-underline-offset: 3px; }
html:not(#_) .footer-v3 .footer-bottom{ border-top: 1px solid var(--pa-lin-d); color: var(--pa-encre-m); background: var(--pa-anneaux) center 10px / 28px 16px no-repeat; padding: 2.1rem 0 1.4rem; }
html:not(#_) .footer-v3 .footer-bottom p{ color: var(--pa-encre-m); }
@media (max-width: 640px) {
  html:not(#_) .footer-v3 .footer-grid{ flex-direction: column; align-items: stretch; gap: 0; padding: 1rem 0 2rem; }
  html:not(#_) .footer-v3 .footer-col{ flex-basis: auto; max-width: none; min-height: 0; margin: -12px 0 0; padding: 30px 28px; border-radius: 60px; }
  html:not(#_) .footer-v3 .footer-col:nth-child(4){ flex-basis: auto; max-width: none; }
  html:not(#_) .footer-v3 .footer-col:first-child{ margin-top: 0; }
  html:not(#_) .footer-v3 .footer-col:nth-child(even){ transform: none; margin-left: 18px; margin-right: -2px; }
  html:not(#_) .footer-v3 .footer-col:nth-child(odd){ margin-right: 18px; }
}

/* ---------------------------------------------------------------- pages : ivoire, cartes crème, titres posés */
html:not(#_) .section{ background: var(--pa-creme); border: 1px solid var(--pa-lin-d); border-radius: 28px; box-shadow: 0 14px 34px rgba(86, 58, 159, .07); }
html:not(#_) .section > h2, html:not(#_) .section-header h2, html:not(#_) .info-duo-title, html:not(#_) .map-section-head h2{ font-family: var(--pa-serif); font-weight: 600; color: var(--pa-encre); }
html:not(#_) .section > h2, html:not(#_) .section-header h2{ display: flex; align-items: center; gap: 12px; }
html:not(#_) .section > h2::before, html:not(#_) .section-header h2::before{ content: ""; flex: 0 0 28px; height: 16px; background: var(--pa-anneaux) center / contain no-repeat; }
html:not(#_) .page-header{ position: relative; padding-top: 96px; background: var(--pa-mobile) center 22px / 140px 60px no-repeat; }
html:not(#_) .page-header h1, html:not(#_) .magazine-header h1{ font-family: var(--pa-serif); font-weight: 600; color: var(--pa-encre); letter-spacing: -.01em; }
html:not(#_) .page-header p, html:not(#_) .magazine-header p{ color: var(--pa-encre-m); }
html:not(#_) .seo-text p, html:not(#_) .seo-content p, html:not(#_) .region-main > p{ color: #463e55 !important; }
html:not(#_) .section a:not(.btn):not(.link-tag):not(.pill):not(.pagination-link){ color: var(--pa-iris-d); }

/* accueil : recherche et badges de confiance en pastilles sur un fil */
html:not(#_) .search-input{ border-radius: 999px; border-color: var(--pa-lin-d); background: var(--pa-creme); color: var(--pa-encre); }
html:not(#_) .search-input::placeholder{ color: #6c6380; }
html:not(#_) .search-input:focus{ border-color: var(--pa-iris); }
html:not(#_) .search-submit{ border-radius: 999px; }
html:not(#_) .trust-badges{ gap: 1.5rem; padding: 1.5rem 0; background: linear-gradient(var(--pa-lin-d), var(--pa-lin-d)) center / min(420px, 80%) 1.5px no-repeat; }
html:not(#_) .trust-badges .badge{ background: var(--pa-creme); border: 1.5px solid var(--pa-lin-d); border-radius: 999px; padding: .5rem 1.1rem .5rem .6rem; color: var(--pa-encre); font-weight: 600; box-shadow: 0 6px 14px rgba(86, 58, 159, .08); }
html:not(#_) .trust-badges .badge-icon{ width: 34px; height: 34px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 1rem; background: var(--pa-iris-l); }

/* pages région : en-tête ivoire suspendu, liste de villes en pastilles */
html:not(#_) .region-hero{ background: var(--pa-mobile) right 6% top 18px / 140px 60px no-repeat, radial-gradient(60% 120% at 10% 0%, var(--pa-iris-t), transparent 70%), var(--pa-lin); color: var(--pa-encre); border-bottom: 1px solid var(--pa-lin-d); }
html:not(#_) .region-hero h1{ font-family: var(--pa-serif); font-weight: 600; color: var(--pa-encre); }
html:not(#_) .region-hero .breadcrumb, html:not(#_) .region-hero .breadcrumb a, html:not(#_) .region-hero .breadcrumb span{ color: var(--pa-encre-m) !important; }
html:not(#_) .region-hero .breadcrumb strong{ color: var(--pa-encre) !important; }
html:not(#_) .region-stats span:not([style]){ background: var(--pa-creme); color: var(--pa-iris-d); border-radius: 999px; padding: .25rem .8rem; font-weight: 600; box-shadow: inset 0 0 0 1.5px var(--pa-iris-l); }
html:not(#_) .region-sidebar{ background: var(--pa-creme); border: 1px solid var(--pa-lin-d); border-radius: 26px; box-shadow: 0 10px 26px rgba(86, 58, 159, .07); }
html:not(#_) .region-sidebar h3{ font-family: var(--pa-serif); font-weight: 600; color: var(--pa-encre); }
html:not(#_) .ville-list a{ display: inline-block; color: #463e55; padding: 6px 12px; border-radius: 999px; background: var(--pa-ivoire); border: 1px solid var(--pa-lin-d); }
html:not(#_) .ville-list a:hover{ color: var(--pa-iris-d); border-color: var(--pa-iris); }
html:not(#_) .magazine-header{ border-bottom: 1px solid var(--pa-lin-d); }
html:not(#_) .region-tag{ background: var(--pa-iris-d); color: #fff; border-radius: 999px; }

/* boutons */
html:not(#_) .btn-primary{ background: var(--pa-iris-d); color: #fff; border-radius: 999px; box-shadow: 0 8px 18px rgba(86, 58, 159, .25); }
html:not(#_) .btn-primary:hover{ filter: none; background: #48307f; }
html:not(#_) .btn-outline{ border-radius: 999px; border-color: var(--pa-iris-d); color: var(--pa-iris-d); }

/* cartes profil : suspendues par le haut, photo en médaillon arrondi, âge en pastille */
html:not(#_) .profile-grid{ gap: 20px; }
html:not(#_) .profile-card{ background: var(--pa-creme); border: 1px solid var(--pa-lin-d); border-radius: 26px; padding: 8px 8px 0; box-shadow: 0 10px 24px rgba(86, 58, 159, .08); transform-origin: 50% 0; }
html:not(#_) .profile-card:hover{ transform: translateY(-2px) rotate(-.7deg); box-shadow: 0 18px 34px rgba(86, 58, 159, .16); }
html:not(#_) .profile-photo{ border-radius: 20px; background: var(--pa-lin); }
html:not(#_) .profile-photo img{ transition: transform .5s ease; }
html:not(#_) .profile-card:hover .profile-photo.blurred img{ transform: scale(1.11); }
html:not(#_) .profile-age{ top: auto; right: auto; bottom: 10px; left: 10px; background: var(--pa-creme); color: var(--pa-encre); font-weight: 700; border-radius: 999px; padding: .3rem .7rem; box-shadow: 0 0 0 2px var(--pa-iris-l), 0 4px 10px rgba(37, 30, 53, .2); }
html:not(#_) .profile-lock{ background: var(--pa-iris-d); width: 28px; height: 28px; box-shadow: 0 0 0 2.5px rgba(255, 252, 247, .85); }
html:not(#_) .profile-info{ padding: .8rem .55rem .55rem; }
html:not(#_) .profile-title{ color: var(--pa-iris-d); font-weight: 700; }
html:not(#_) .profile-name{ font-family: var(--pa-serif); font-weight: 600; color: var(--pa-encre); }
html:not(#_) .profile-ville{ color: var(--pa-encre-m); }
html:not(#_) .profile-bio{ color: #463e55; }
html:not(#_) .profile-footer{ border-top: 0; background: var(--pa-perles) left 4px top 0 / 12px 6px repeat-x; padding: .85rem .55rem .8rem; }
html:not(#_) .profile-cta{ background: transparent; border: 1.5px solid var(--pa-iris-d); color: var(--pa-iris-d); border-radius: 999px; font-weight: 700; transition: background .2s, color .2s; }
html:not(#_) .profile-card:hover .profile-cta{ background: var(--pa-iris-d); color: #fff; }

/* filtres et pagination : pastilles enfilées sur un trait */
html:not(#_) .filters{ background: linear-gradient(var(--pa-lin-d), var(--pa-lin-d)) center / 100% 1.5px no-repeat; }
html:not(#_) .filters .filter-btn{ background-color: var(--pa-creme); border: 1.5px solid var(--pa-lin-d); color: var(--pa-encre); border-radius: 999px; min-height: 40px; padding: 6px 18px; }
html:not(#_) .filters .filter-btn:hover, html:not(#_) .filters .filter-btn.active{ background-color: var(--pa-iris-d); border-color: var(--pa-iris-d); color: #fff; box-shadow: 0 0 0 3px var(--pa-creme), 0 0 0 4.5px var(--pa-iris-l); }
html:not(#_) .filters select.ds-fsel{ background-color: var(--pa-creme); color: var(--pa-encre); padding-left: 18px; }
html:not(#_) .pagination{ background: linear-gradient(var(--pa-lin-d), var(--pa-lin-d)) center / 100% 1.5px no-repeat; }
html:not(#_) .pagination-link{ background: var(--pa-creme); border: 1.5px solid var(--pa-lin-d); color: var(--pa-encre) !important; }
html:not(#_) .pagination-link:hover{ background: var(--pa-lin); border-color: var(--pa-iris); color: var(--pa-iris-d) !important; }
html:not(#_) .pagination-current{ background: var(--pa-iris-d); box-shadow: 0 0 0 3px var(--pa-creme), 0 0 0 4.5px var(--pa-iris-l); }
html:not(#_) .pagination-ellipsis{ color: var(--pa-encre-m); background: var(--pa-ivoire); }

/* liens de villes : pastilles avec un petit anneau */
html:not(#_) .link-tag{ background: var(--pa-creme); border: 1px solid var(--pa-lin-d); border-radius: 999px; color: var(--pa-encre); }
html:not(#_) .link-tag::before{ content: ""; flex: 0 0 12px; width: 12px; height: 12px; border-radius: 50%; box-shadow: inset 0 0 0 2px var(--pa-iris); }
html:not(#_) .link-tag:hover{ border-color: var(--pa-iris); color: var(--pa-iris-d); }
html:not(#_) .ville-pills .pill, html:not(#_) .rcs-chip{ background: var(--pa-creme); border: 1px solid var(--pa-lin-d); color: var(--pa-encre); border-radius: 999px; }
html:not(#_) .ville-pills .pill:hover, html:not(#_) .rcs-chip:hover{ border-color: var(--pa-iris); color: var(--pa-iris-d); }
html:not(#_) .breadcrumb, html:not(#_) .breadcrumb a{ color: var(--pa-encre-m); }
html:not(#_) .breadcrumb > span{ margin: 0 .5em; color: var(--pa-iris) !important; }
html:not(#_) .breadcrumb a{ text-decoration: underline; text-decoration-color: var(--pa-iris-l); text-underline-offset: 4px; }
html:not(#_) .breadcrumb a:hover{ color: var(--pa-iris-d) !important; }

/* CTA de milieu de page : carte de rencontre suspendue à son fil, centrée */
html:not(#_) .cta-section{
  position: relative; box-sizing: border-box; width: 100%; max-width: 780px; margin-left: auto; margin-right: auto; align-self: center;
  background: var(--pa-mobile) center 22px / 140px 60px no-repeat, radial-gradient(70% 80% at 50% 100%, rgba(109, 75, 196, .14), transparent 70%), var(--pa-creme);
  color: var(--pa-encre); border: 1px solid var(--pa-lin-d); border-radius: 34px; padding: 100px 28px 44px; box-shadow: 0 18px 40px rgba(86, 58, 159, .13);
}
html:not(#_) .cta-section h2{ color: var(--pa-encre); font-family: var(--pa-serif); font-weight: 600; }
html:not(#_) .cta-section p{ color: var(--pa-encre-m); }
html:not(#_) .cta-section a.btn.btn-primary{ min-height: 50px; padding: 13px 38px; font-size: 1.04rem; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(180deg, #7454c9, var(--pa-iris-d)); color: #fff; box-shadow: 0 12px 26px rgba(86, 58, 159, .34); transition: transform .2s ease, box-shadow .2s ease; }
html:not(#_) .cta-section a.btn.btn-primary:hover{ transform: translateY(-2px); box-shadow: 0 16px 30px rgba(86, 58, 159, .42); }

/* FAQ et carte : cartes crème, questions en pastilles allongées */
html:not(#_) .info-duo-col{ background: var(--pa-creme); border: 1px solid var(--pa-lin-d); border-radius: 24px; }
html:not(#_) .info-duo-title{ background: var(--pa-lin); border-bottom: 1px solid var(--pa-lin-d); }
html:not(#_) .info-duo-title svg{ color: var(--pa-iris-d); }
html:not(#_) .accordion{ padding: 10px; }
html:not(#_) .accordion-item{ border: 1.5px solid var(--pa-lin-d); border-radius: 22px; margin-bottom: 10px; background: var(--pa-creme); }
html:not(#_) .accordion-item:last-child{ border-bottom: 1.5px solid var(--pa-lin-d); margin-bottom: 0; }
html:not(#_) .accordion-item[open]{ border-color: var(--pa-iris); box-shadow: 0 6px 16px rgba(86, 58, 159, .1); }
html:not(#_) .accordion-header{ border-radius: 22px; color: var(--pa-encre); }
html:not(#_) .accordion-header:hover{ background: var(--pa-lin); }
html:not(#_) .accordion-header::after{ border-color: var(--pa-iris-d); }
html:not(#_) .accordion-body{ color: var(--pa-encre-m); }
html:not(#_) .accordion-badge, html:not(#_) .ville-map-badge{ background: var(--pa-iris-d); }
html:not(#_) .ville-map-card{ border-radius: 22px; border-color: var(--pa-lin-d); background: var(--pa-creme); }
html:not(#_) .ville-map-container{ background: var(--pa-lin); }
html:not(#_) .ville-map-header h3{ font-family: var(--pa-serif); font-weight: 600; color: var(--pa-encre); }

/* retour en haut : pastille cerclée d'un second anneau */
html:not(#_) .back-to-top{ background: var(--pa-iris-d); color: #fff; box-shadow: 0 0 0 3px var(--pa-creme), 0 0 0 4.5px var(--pa-iris), 0 10px 20px rgba(86, 58, 159, .3); }

/* pop-ups : couleurs, bordures, rayons seulement */
html:not(#_) .modal-content{ border-radius: 26px; }
html:not(#_) .modal-body h3, html:not(#_) .modal-name{ font-family: var(--pa-serif); color: var(--pa-encre); }
html:not(#_) .modal-body .modal-meta{ color: var(--pa-iris-d); }
html:not(#_) .modal-body .modal-tag{ background: var(--pa-lin); color: var(--pa-encre); border: 1px solid var(--pa-lin-d); }
html:not(#_) .modal-action-primary{ background: var(--pa-iris-d); color: #fff; border-radius: 999px; }
html:not(#_) .btn-cta-overlay{ background: var(--pa-iris-d); color: #fff; border-radius: 999px; }
html:not(#_) .popup-card{ border-radius: 28px; background: var(--pa-creme); border: 1px solid var(--pa-lin-d); }
html:not(#_) .popup-title{ font-family: var(--pa-serif); color: var(--pa-encre); }
html:not(#_) .popup-btn{ background: var(--pa-iris-d); color: #fff; border-radius: 999px; }
html:not(#_) .popup-close{ color: var(--pa-encre-m); }
html:not(#_) .age-gate-modal{ background: var(--pa-mobile) center 16px / 140px 60px no-repeat, var(--pa-creme); padding-top: 88px; border-radius: 30px; box-shadow: 0 26px 60px rgba(37, 30, 53, .35); }
html:not(#_) .age-gate-modal h2{ font-family: var(--pa-serif); font-weight: 600; color: var(--pa-encre); }
html:not(#_) .age-gate-lead{ color: var(--pa-encre); }
html:not(#_) .age-gate-body, html:not(#_) .age-gate-actions{ color: #463e55; }
html:not(#_) .age-gate-footnote{ color: var(--pa-encre-m); }
html:not(#_) .age-gate-link{ color: var(--pa-iris-d); }
html:not(#_) .age-gate-buttons .btn{ border-radius: 999px; }

@media (max-width: 640px) {
  html:not(#_) .cta-section{ padding: 92px 18px 36px; border-radius: 28px; }
  html:not(#_) .page-header{ padding-top: 88px; }
  html:not(#_) .trust-badges{ gap: .8rem; }
  html:not(#_) .profile-grid{ gap: 14px; }
  html:not(#_) .profile-card{ padding: 6px 6px 0; border-radius: 22px; }
  html:not(#_) .profile-photo{ border-radius: 17px; }
}

/* ---------------------------------------------------------------- recette Astro · villes-bas (copiée telle quelle) */
html:not(#_) body.design-v-villes-bas .container > section.section.ds-villes:first-child{ order: 6; }
html:not(#_) body.design-v-villes-bas div.container.ds-c{ display: flex; flex-direction: column; }
html:not(#_) body.design-v-villes-bas div.container.ds-c > *{ order: 6; }  /* :where() : sinon le :has() gonfle la spécificité au-dessus des règles ciblées (v0, 18/09) */
html:not(#_) body.design-v-villes-bas div.container > .page-header{ order: 0; }  /* pages ville d'un site régional : le H1 reste en tête */
html:not(#_) body.design-v-villes-bas div.container > section.section.ds-profils{ order: 1; }
html:not(#_) body.design-v-villes-bas div.container > .ds-bloc{ order: 2; }
html:not(#_) body.design-v-villes-bas div.container > section.cta-section{ order: 3; }
html:not(#_) body.design-v-villes-bas div.container > section.section.ds-faq{ order: 4; }
html:not(#_) body.design-v-villes-bas div.region-layout{ display: flex; flex-direction: column; }
html:not(#_) body.design-v-villes-bas div.region-layout > aside.region-sidebar{ order: 2; position: static; width: auto; max-width: none; }
html:not(#_) body.design-v-villes-bas div.region-layout > aside.region-sidebar ul.ville-list{ display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------------------------------------------------------------- mouvement réduit */
@media (prefers-reduced-motion: reduce) {
  html:not(#_) .sb-logo-dot{ animation: none; transform: none; }
  html:not(#_) .profile-card, html:not(#_) .profile-photo img, html:not(#_) .profile-cta, html:not(#_) .cta-section a.btn.btn-primary{ transition: none !important; }
  html:not(#_) .profile-card:hover{ transform: none; }
  html:not(#_) .profile-card:hover .profile-photo.blurred img{ transform: scale(1.06); }
  html:not(#_) .cta-section a.btn.btn-primary:hover{ transform: none; }
}

@media (prefers-reduced-motion: reduce){html:not(#_) .sidebar-inner{animation:none !important;transition:none !important;}}
html:not(#_) .sidebar-inner{scrollbar-width:thin;scrollbar-color:rgba(128,128,128,.45) transparent;}
/* __END_DESIGN_SITE__ */