/* ==========================================================================
   NOIR-MINIMAL — Swiss / Brutalist / Ultra-minimal theme
   Font: Space Grotesk | Palette: #fff #fafafa #111 #777 #000 #e00
   ========================================================================== */

/* --- Reset & Base --- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{font-family:'Space Grotesk',sans-serif;background:#fff;color:#111;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:#111;text-decoration:none;transition:border-color .15s}
a:hover{border-bottom:2px solid #e00}
ul,ol{list-style:none}
button,input,select,textarea{font:inherit;color:inherit;border:none;background:none}

/* --- Layout --- */
.wrap{max-width:960px;margin:0 auto;padding:0 24px}

/* --- Header --- */
.site-header{border-bottom:1px solid #111;padding:18px 0}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between}
.site-logo{font-size:1.15rem;font-weight:700;letter-spacing:-.02em}
.site-logo a{border:none}
.site-nav{display:flex;gap:24px;align-items:center}
.site-nav a{font-size:.85rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;border-bottom:2px solid transparent}
.site-nav a:hover{border-bottom-color:#e00}

/* Search (header) */
.search-box{position:relative}
.search-box input{width:160px;padding:5px 8px;font-size:.8rem;border:1px solid #ddd;transition:border-color .15s}
.search-box input:focus{outline:none;border-color:#111}
.search-dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #111;display:none;z-index:100;max-height:280px;overflow-y:auto}
.search-dropdown.open{display:block}
.search-dropdown a{display:block;padding:8px 10px;font-size:.8rem;border-bottom:1px solid #eee}
.search-dropdown a:hover{background:#fafafa;border-bottom-color:#eee}

/* --- Main --- */
.site-main{min-height:60vh;padding:40px 0}

/* --- Breadcrumb --- */
.breadcrumb{font-size:.78rem;color:#777;margin-bottom:32px;letter-spacing:.01em}
.breadcrumb a{color:#777}
.breadcrumb a:hover{color:#111;border-bottom-color:#e00}

/* --- Section --- */
.section{margin-bottom:48px}
.section h2{font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:20px;padding-bottom:8px;border-bottom:1px solid #111}
.section--intro p{font-size:.92rem;color:#444;line-height:1.7;max-width:680px}
.section--intro a{border-bottom:1px solid #e00}

/* --- Hero (index) --- */
.hero{margin-bottom:48px}
.hero h1{font-size:2rem;font-weight:700;letter-spacing:-.03em;line-height:1.15;margin-bottom:8px}
.hero p{font-size:.92rem;color:#777;max-width:520px}

/* --- Annonces List (index: vertical list, no cards) --- */
.annonces-list{width:100%}
.annonces-list__row{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid #eee;transition:background .1s}
.annonces-list__row:hover{background:#fafafa}
.annonces-list__row a{display:flex;align-items:center;gap:16px;width:100%;border:none}
.annonces-list__thumb{width:56px;height:56px;object-fit:cover;flex-shrink:0;filter:grayscale(30%)}
.annonces-list__info{flex:1;min-width:0}
.annonces-list__name{font-size:.92rem;font-weight:600}
.annonces-list__city{font-size:.78rem;color:#777}
.annonces-list__age{font-size:.78rem;color:#777;flex-shrink:0}

/* --- Grid fallback (render_annonces_grid) --- */
.annonces-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:2px}
.annonces-grid .card{position:relative;overflow:hidden;aspect-ratio:3/4;background:#fafafa}
.annonces-grid .card img{width:100%;height:100%;object-fit:cover;filter:grayscale(20%);transition:filter .2s}
.annonces-grid .card:hover img{filter:grayscale(0)}
.annonces-grid .card__overlay{position:absolute;bottom:0;left:0;right:0;padding:10px 12px;background:linear-gradient(transparent,rgba(0,0,0,.7));color:#fff}
.annonces-grid .card__overlay .name{font-size:.85rem;font-weight:600}
.annonces-grid .card__overlay .city{font-size:.72rem;opacity:.85}
.annonces-grid .card a{border:none}

/* --- Pagination --- */
.pagination{display:flex;gap:4px;margin-top:32px;font-size:.82rem}
.pagination a,.pagination span{padding:6px 12px;border:1px solid #ddd}
.pagination a:hover{background:#111;color:#fff;border-color:#111}
.pagination .current{background:#111;color:#fff;border-color:#111}

/* --- Text list (regions / depts / villes) --- */
.text-list{display:flex;flex-direction:column}
.text-list__item{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #eee;font-size:.88rem}
.text-list__item a{flex:1;border:none}
.text-list__item a:hover{border-bottom:2px solid #e00}
.text-list__count{color:#777;font-size:.78rem;flex-shrink:0;min-width:36px;text-align:right}

/* --- Annonce detail --- */
.annonce-detail{margin-bottom:48px}
.annonce-detail h1{font-size:1.8rem;font-weight:700;letter-spacing:-.03em;margin-bottom:4px}
.annonce-detail__location{font-size:.85rem;color:#777;margin-bottom:28px}

.annonce-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:4px;margin-bottom:32px}
.annonce-gallery img{width:100%;aspect-ratio:3/4;object-fit:cover}

.annonce-cta{margin-bottom:36px}
.btn-cta{display:inline-block;padding:14px 36px;background:#111;color:#fff;font-size:.88rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;border:none;transition:background .15s}
.btn-cta:hover{background:#e00;border:none}

.annonce-body{display:grid;grid-template-columns:2fr 1fr;gap:48px}
@media(max-width:700px){.annonce-body{grid-template-columns:1fr}}

.annonce-section{margin-bottom:28px}
.annonce-section h2{font-size:.88rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px}
.annonce-section p{font-size:.9rem;line-height:1.7;color:#333}
.annonce-section ul{font-size:.88rem;color:#333}
.annonce-section li{padding:4px 0;border-bottom:1px solid #f0f0f0}

.annonce-sidebar-box{background:#fafafa;padding:20px;margin-bottom:20px}
.annonce-sidebar-box h3{font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-bottom:12px}
.info-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #eee;font-size:.84rem}
.info-row__label{color:#777}

.practices-list{display:flex;flex-wrap:wrap;gap:6px}
.practices-list li{font-size:.78rem;padding:4px 10px;border:1px solid #ddd}

/* --- Search page --- */
.search-form{display:flex;gap:0;margin-bottom:32px;max-width:500px}
.search-form__input{flex:1;padding:10px 14px;border:1px solid #111;font-size:.9rem}
.search-form__input:focus{outline:none}
.search-form__btn{padding:10px 20px;background:#111;color:#fff;font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;cursor:pointer}
.search-form__btn:hover{background:#e00}
.subtitle{font-size:.88rem;color:#777;margin-bottom:24px}

/* --- Blog --- */
.blog-cats{display:flex;gap:16px;margin-bottom:32px;font-size:.82rem;flex-wrap:wrap}
.blog-cats a{text-transform:uppercase;letter-spacing:.04em;padding-bottom:2px;border-bottom:2px solid transparent}
.blog-cats a:hover,.blog-cats a.active{border-bottom-color:#111}

.blog-list{display:flex;flex-direction:column}
.blog-entry{display:flex;gap:24px;padding:24px 0;border-bottom:1px solid #eee}
.blog-entry__img{width:180px;height:120px;object-fit:cover;flex-shrink:0;filter:grayscale(30%)}
.blog-entry__body{flex:1;min-width:0}
.blog-entry__cat{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:#777;margin-bottom:4px;display:inline-block}
.blog-entry__body h2{font-size:1.05rem;font-weight:600;margin-bottom:6px;line-height:1.3}
.blog-entry__body h2 a{border:none}
.blog-entry__body h2 a:hover{border-bottom:2px solid #e00}
.blog-entry__date{font-size:.72rem;color:#999;margin-bottom:6px;display:block}
.blog-entry__body p{font-size:.85rem;color:#555;line-height:1.55}
.blog-entry__more{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;margin-top:8px;display:inline-block;border-bottom:1px solid #111}
.blog-entry__more:hover{border-bottom-color:#e00}

@media(max-width:600px){
    .blog-entry{flex-direction:column;gap:12px}
    .blog-entry__img{width:100%;height:200px}
}

/* --- Article detail --- */
.article-detail{max-width:680px}
.article-detail header{margin-bottom:32px}
.article-detail h1{font-size:1.8rem;font-weight:700;letter-spacing:-.02em;line-height:1.2;margin-bottom:8px}
.article-meta{font-size:.78rem;color:#777;display:flex;gap:16px}
.article-hero{width:100%;margin-bottom:32px}
.article-content{font-size:.94rem;line-height:1.8;color:#222}
.article-content h2{font-size:1.15rem;font-weight:700;margin:32px 0 12px}
.article-content h3{font-size:1rem;font-weight:600;margin:24px 0 8px}
.article-content p{margin-bottom:16px}
.article-content a{border-bottom:1px solid #e00}
.article-content ul,.article-content ol{margin:0 0 16px 20px}
.article-content li{margin-bottom:4px}
.article-content blockquote{border-left:3px solid #111;padding-left:16px;margin:20px 0;color:#555;font-style:italic}
.article-content img{margin:20px 0}

/* Blog grid (related articles) */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.blog-grid article{border-bottom:none}
.blog-grid img{width:100%;aspect-ratio:3/2;object-fit:cover;margin-bottom:10px;filter:grayscale(30%)}
.blog-grid h3{font-size:.88rem;font-weight:600;margin-bottom:4px}
.blog-grid h3 a{border:none}
.blog-grid h3 a:hover{border-bottom:2px solid #e00}
.blog-grid time{font-size:.72rem;color:#999}
@media(max-width:600px){.blog-grid{grid-template-columns:1fr}}

/* --- Footer --- */
.site-footer{border-top:1px solid #111;padding:18px 0;font-size:.78rem;color:#777;text-align:center}

/* --- Utilities --- */
.empty{color:#777;font-size:.88rem;padding:40px 0}
h1{font-size:1.6rem;font-weight:700;letter-spacing:-.02em;margin-bottom:20px}

/* --- Responsive --- */
@media(max-width:600px){
    .wrap{padding:0 16px}
    .hero h1{font-size:1.4rem}
    .annonce-gallery{grid-template-columns:1fr}
    .annonces-grid{grid-template-columns:repeat(2,1fr)}
    .site-nav{gap:14px}
    .search-box input{width:120px}
}

/* ── Filter bar ─────────────────────────────────────────────────────────── */
.filter-bar {
    margin: 1.5rem 0 2rem;
    padding: 1rem 1.25rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.filter-bar__group {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}
.filter-bar__group + .filter-bar__group {
    padding-top: 0.75rem;
    border-top: 1px solid var(--color-border);
}
.filter-bar__label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-muted);
    white-space: nowrap;
    min-width: 8.5rem;
    flex-shrink: 0;
}
.filter-bar__options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}
.tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    background: #fff;
    color: #111;
    border: 1.5px solid #111;
    border-radius: 0;
    font-size: 0.8rem;
    font-weight: 600;
    text-decoration: none;
    transition: background .15s, color .15s;
}
.tag:hover {
    background: #111;
    color: #fff;
}
.tag__count {
    font-size: 0.75rem;
    opacity: 0.6;
}
.tag--active {
    background: var(--color-accent) !important;
    color: var(--color-white, #fff) !important;
    border-color: var(--color-accent) !important;
    font-weight: 600;
}
.tag--active .tag__count {
    color: rgba(255,255,255,0.75) !important;
}
@media (max-width: 600px) {
  .filter-bar { padding: .75rem; }
  .filter-bar__group { flex-direction: column; align-items: flex-start; gap: 0.4rem; }
  .filter-bar__label { min-width: unset; }
}

/* ── Comments ─────────────────────────────────────────────────────────── */
.card__comments {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 6px;
    font-size: .8rem;
    color: var(--color-text-muted, #888);
}
.card__stars { color: var(--color-accent, #e91e8c); letter-spacing: 1px; }
.card__comments-count { color: inherit; }

.annonce__rating-summary {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--color-surface, rgba(255,255,255,.08));
    border-radius: 20px;
    padding: 4px 12px;
    margin-top: 8px;
    font-size: .9rem;
}
.annonce__rating-stars { color: var(--color-accent, #e91e8c); letter-spacing: 1px; }
.annonce__rating-score { font-weight: 700; }
.annonce__rating-count { color: var(--color-text-muted, #aaa); text-decoration: none; font-size: .85rem; }
.annonce__rating-count:hover { text-decoration: underline; }

.annonce__comments { margin-top: 32px; }
.annonce__comments-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
}
.annonce__comments-badge {
    background: var(--color-accent, #e91e8c);
    color: #fff;
    border-radius: 20px;
    padding: 2px 9px;
    font-size: .8rem;
    font-weight: 700;
}
.comments-list { display: flex; flex-direction: column; gap: 16px; }
.comment-item {
    background: var(--color-surface, rgba(255,255,255,.05));
    border-radius: 8px;
    padding: 14px 16px;
}
.comment-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}
.comment-author { font-weight: 700; font-size: .95rem; }
.comment-rating { color: var(--color-accent, #e91e8c); letter-spacing: 1px; }
.comment-date { color: var(--color-text-muted, #888); font-size: .8rem; margin-left: auto; }
.comment-text { margin: 0; font-size: .9rem; line-height: 1.6; }