/*
Theme Name: ER-Location
Theme URI: https://www.er-location.be/
Author: ER-Location / custom build
Description: Thème WordPress léger, mobile-first et orienté conversion/SEO local pour ER-Location.
Version: 1.0.6
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: er-location
License: GPL-2.0-or-later
*/

:root {
  --erl-coral: #ef6f6e;
  --erl-coral-dark: #d95f60;
  --erl-ink: #4b4d50;
  --erl-ink-dark: #2f3134;
  --erl-text: #26282b;
  --erl-muted: #666a70;
  --erl-bg: #ffffff;
  --erl-soft: #f6f5f4;
  --erl-border: #e4e2e0;
  --erl-radius: 18px;
  --erl-shadow: 0 12px 35px rgba(47, 49, 52, .10);
  --erl-container: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--erl-text);
  background: var(--erl-bg);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.6;
  font-size: 16px;
}
img { max-width: 100%; height: auto; }
a { color: var(--erl-coral-dark); }
a:hover { color: var(--erl-coral); }
button, input, textarea, select { font: inherit; }
button, .erl-btn { cursor: pointer; }

.erl-skip-link {
  position: absolute; left: -9999px; top: auto;
}
.erl-skip-link:focus {
  left: 1rem; top: 1rem; z-index: 9999;
  background: #fff; color: #000; padding: .75rem 1rem; border-radius: 8px;
}

.erl-container { width: min(100% - 2rem, var(--erl-container)); margin-inline: auto; }
.erl-section { padding: 5rem 0; }
.erl-section--soft { background: var(--erl-soft); }
.erl-section__head { max-width: 760px; margin-bottom: 2rem; }
.erl-eyebrow {
  display: inline-block; margin-bottom: .5rem; color: var(--erl-coral-dark);
  font-size: .82rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
.erl-section h2 { margin: 0 0 .75rem; font-size: clamp(2rem, 4vw, 3.1rem); line-height: 1.1; color: var(--erl-ink-dark); }
.erl-section p.lead { font-size: 1.1rem; color: var(--erl-muted); max-width: 70ch; }

/* Header */
.erl-site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(75,77,80,.97); backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(255,255,255,.10);
}
.erl-header-inner { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.erl-brand { display: inline-flex; align-items: center; text-decoration: none; }
.erl-brand img { width: auto; max-width: 220px; max-height: 58px; display: block; }
.erl-brand-fallback { color: #fff; font-size: 1.2rem; font-weight: 800; letter-spacing: -.02em; }
.erl-nav { display: flex; align-items: center; gap: .35rem; }
.erl-nav-list { display:flex; align-items:center; gap:.35rem; margin:0; padding:0; list-style:none; }
.erl-nav a {
  color: #fff; text-decoration: none; padding: .55rem .7rem; border-radius: 8px;
  font-size: .95rem; font-weight: 600;
}
.erl-nav a:hover, .erl-nav a:focus { background: rgba(255,255,255,.10); color: #fff; }
.erl-header-cta { background: var(--erl-coral); color: #fff !important; padding-inline: 1rem !important; }
.erl-header-cta:hover { background: var(--erl-coral-dark) !important; }
.erl-menu-toggle {
  display:none; border:1px solid rgba(255,255,255,.25); background: transparent; color:#fff;
  padding:.55rem .7rem; border-radius:9px;
}

/* Hero */
.erl-hero {
  position: relative; overflow: hidden; color:#fff;
  background:
    radial-gradient(circle at 78% 22%, rgba(239,111,110,.28), transparent 32%),
    linear-gradient(115deg, #3f4246, #575a5e);
}
.erl-hero::after {
  content:""; position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(90deg, rgba(28,29,31,.70), rgba(28,29,31,.25) 62%, rgba(28,29,31,.48));
}
.erl-hero.has-image { background-position: center; background-size: cover; }
.erl-hero-inner { position:relative; z-index:1; min-height: 620px; display:flex; align-items:center; padding: 6rem 0; }
.erl-hero-copy { width:min(100%, 760px); }
.erl-hero h1 { margin:0 0 1rem; font-size: clamp(2.5rem, 6vw, 5rem); line-height: .98; letter-spacing:-.04em; }
.erl-hero h1 span { color: var(--erl-coral); }
.erl-hero p { max-width: 62ch; font-size:1.15rem; color:rgba(255,255,255,.90); }
.erl-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.6rem; }
.erl-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  border:0; border-radius:999px; padding:.85rem 1.25rem; text-decoration:none; font-weight:800;
}
.erl-btn--primary { background:var(--erl-coral); color:#fff; }
.erl-btn--primary:hover { background:var(--erl-coral-dark); color:#fff; }
.erl-btn--ghost { border:1px solid rgba(255,255,255,.55); color:#fff; background:rgba(255,255,255,.06); }
.erl-btn--ghost:hover { color:#fff; background:rgba(255,255,255,.12); }

/* Trust */
.erl-trust { margin-top: -2.7rem; position:relative; z-index:3; }
.erl-trust-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--erl-border); border-radius:var(--erl-radius); overflow:hidden; box-shadow:var(--erl-shadow); }
.erl-trust-item { background:#fff; padding:1.25rem; display:flex; gap:.8rem; align-items:flex-start; }
.erl-trust-icon { width:42px; height:42px; border-radius:12px; display:grid; place-items:center; flex:none; background:rgba(239,111,110,.12); color:var(--erl-coral-dark); font-size:1.1rem; font-weight:900; }
.erl-trust-item strong { display:block; color:var(--erl-ink-dark); }
.erl-trust-item span { display:block; font-size:.88rem; color:var(--erl-muted); }

/* Cards */
.erl-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; }
.erl-card { background:#fff; border:1px solid var(--erl-border); border-radius:var(--erl-radius); overflow:hidden; box-shadow:0 6px 22px rgba(47,49,52,.06); }
.erl-card-media { aspect-ratio: 4/3; background:#ecebea; display:grid; place-items:center; overflow:hidden; }
.erl-card-media img { width:100%; height:100%; object-fit:cover; }
.erl-placeholder { color:#8a8d91; font-weight:700; padding:1rem; text-align:center; }
.erl-card-body { padding:1.25rem; }
.erl-card h3 { margin:0 0 .45rem; font-size:1.25rem; color:var(--erl-ink-dark); }
.erl-card-meta { display:grid; gap:.2rem; color:var(--erl-muted); font-size:.92rem; }
.erl-card-price { margin-top:.85rem; font-weight:900; color:var(--erl-coral-dark); font-size:1.15rem; }
.erl-card .erl-btn { margin-top:1rem; padding:.65rem 1rem; }

/* Split / safety */
.erl-split { display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
.erl-panel { border-radius:var(--erl-radius); padding:2rem; background:var(--erl-ink-dark); color:#fff; overflow:hidden; }
.erl-panel h3 { font-size:1.7rem; margin:0 0 .7rem; }
.erl-panel p { color:rgba(255,255,255,.86); }
.erl-checklist { list-style:none; padding:0; margin:1.25rem 0 0; display:grid; gap:.6rem; }
.erl-checklist li { position:relative; padding-left:1.65rem; }
.erl-checklist li::before { content:'✓'; position:absolute; left:0; color:var(--erl-coral); font-weight:900; }
.erl-panel--light { background:var(--erl-soft); color:var(--erl-text); }
.erl-panel--light p { color:var(--erl-muted); }

/* FAQ */
.erl-faq { display:grid; gap:.75rem; }
.erl-faq details { border:1px solid var(--erl-border); border-radius:14px; background:#fff; padding:0 1rem; }
.erl-faq summary { cursor:pointer; list-style:none; padding:1rem 0; font-weight:800; color:var(--erl-ink-dark); }
.erl-faq summary::-webkit-details-marker { display:none; }
.erl-faq .erl-faq-answer { padding:0 0 1rem; color:var(--erl-muted); }

/* Form */
.erl-form-wrap { display:grid; grid-template-columns: .9fr 1.1fr; gap:1.25rem; align-items:start; }
.erl-form { background:#fff; border:1px solid var(--erl-border); border-radius:var(--erl-radius); padding:1.35rem; box-shadow:var(--erl-shadow); }
.erl-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.erl-field { display:grid; gap:.4rem; }
.erl-field--full { grid-column:1/-1; }
.erl-field label { font-size:.9rem; font-weight:800; color:var(--erl-ink-dark); }
.erl-field input, .erl-field textarea, .erl-field select {
  width:100%; border:1px solid #d7d5d3; border-radius:11px; padding:.78rem .85rem; background:#fff; color:var(--erl-text);
}
.erl-field textarea { min-height:140px; resize:vertical; }
.erl-field input:focus, .erl-field textarea:focus, .erl-field select:focus { outline:3px solid rgba(239,111,110,.18); border-color:var(--erl-coral); }
.erl-hp { position:absolute !important; left:-9999px !important; opacity:0 !important; height:0 !important; width:0 !important; overflow:hidden !important; }
.erl-notice { border-radius:12px; padding:.9rem 1rem; margin-bottom:1rem; }
.erl-notice--success { background:#eaf7ef; color:#1b663a; }
.erl-notice--error { background:#fff0f0; color:#9a3333; }

/* Footer */
.erl-footer { background:var(--erl-ink-dark); color:rgba(255,255,255,.84); padding:3rem 0 1.2rem; }
.erl-footer-grid { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:2rem; }
.erl-footer h3 { margin:0 0 .6rem; color:#fff; font-size:1rem; }
.erl-footer a { color:#fff; text-decoration:none; }
.erl-footer a:hover { color:var(--erl-coral); }
.erl-footer-links { display:grid; gap:.35rem; }
.erl-footer-bottom { border-top:1px solid rgba(255,255,255,.12); margin-top:2rem; padding-top:1rem; font-size:.86rem; display:flex; gap:1rem; justify-content:space-between; flex-wrap:wrap; }

.erl-prose { max-width: 820px; }
.erl-prose h1 { font-size:clamp(2.2rem,4vw,3.4rem); color:var(--erl-ink-dark); line-height:1.05; }
.erl-prose h2 { margin-top:2.25rem; color:var(--erl-ink-dark); }
.erl-prose h3 { color:var(--erl-ink-dark); }
.erl-prose table { width:100%; border-collapse:collapse; }
.erl-prose th, .erl-prose td { border:1px solid var(--erl-border); padding:.7rem; text-align:left; }

.erl-center { text-align:center; }
.erl-mt-2 { margin-top:2rem; }

@media (max-width: 980px) {
  .erl-menu-toggle { display:inline-flex; }
  .erl-nav { display:none; position:absolute; left:1rem; right:1rem; top:70px; flex-direction:column; align-items:stretch; padding:.7rem; background:var(--erl-ink); border:1px solid rgba(255,255,255,.12); border-radius:14px; box-shadow:var(--erl-shadow); }
  .erl-nav.is-open { display:flex; }
  .erl-nav a { width:100%; }
  .erl-trust-grid, .erl-grid { grid-template-columns:repeat(2,1fr); }
  .erl-form-wrap, .erl-split, .erl-footer-grid { grid-template-columns:1fr; }
}
@media (max-width: 680px) {
  .erl-container { width:min(100% - 1.2rem, var(--erl-container)); }
  .erl-hero-inner { min-height:540px; padding:5rem 0; }
  .erl-hero h1 { font-size:clamp(2.3rem, 13vw, 3.6rem); }
  .erl-section { padding:3.7rem 0; }
  .erl-trust { margin-top:-1.5rem; }
  .erl-trust-grid, .erl-grid, .erl-form-grid { grid-template-columns:1fr; }
  .erl-brand img { max-width:190px; }
  .erl-header-cta { display:none !important; }
}

/* Catalogue: one clear gallery + server-side category navigation */
.erl-catalog-controls {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.25rem;
  margin: 1.5rem 0 2rem;
  padding: 0 0 .9rem;
  border-bottom: 1px solid var(--erl-border);
}
.erl-catalog-controls__title { flex: 0 0 auto; }
.erl-catalog-controls__title h3 {
  margin: .15rem 0 0;
  font-size: clamp(1.25rem, 2.2vw, 1.7rem);
  line-height: 1.15;
  color: var(--erl-ink-dark);
}
.erl-catalog-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: .2rem .9rem;
}
.erl-catalog-filter {
  appearance: none;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--erl-muted);
  padding: .55rem .1rem .5rem;
  font-weight: 800;
  font-size: .92rem;
  line-height: 1.2;
  text-decoration: none;
  transition: color .18s ease, border-color .18s ease;
}
.erl-catalog-filter:hover,
.erl-catalog-filter:focus-visible {
  color: var(--erl-coral-dark);
  border-bottom-color: rgba(239,111,110,.45);
}
.erl-catalog-filter.is-active {
  color: var(--erl-ink-dark);
  border-bottom-color: var(--erl-coral);
}
.erl-catalog-filter span {
  display: inline-block;
  margin-left: .3rem;
  color: var(--erl-muted);
  font-size: .78em;
  font-weight: 700;
}
.erl-catalog-filter.is-active span { color: var(--erl-coral-dark); }

.erl-catalogue-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.15rem;
  scroll-margin-top: 110px;
}
.erl-catalogue-grid .erl-location-card[hidden] { display: none !important; }
.erl-location-card.is-featured { border-color: rgba(239,111,110,.45); box-shadow: 0 10px 30px rgba(239,111,110,.10); }
.erl-location-card.is-featured .erl-card-media { position: relative; }
.erl-catalog-no-results {
  margin-top: 1rem;
  padding: 1rem 1.15rem;
  border: 1px dashed var(--erl-border);
  border-radius: 14px;
  color: var(--erl-muted);
  background: var(--erl-soft);
}
.erl-catalog-no-results[hidden] { display: none; }
.erl-card-categories { display:flex; flex-wrap:wrap; gap:.35rem; margin-bottom:.55rem; }
.erl-category-chip { display:inline-flex; padding:.25rem .45rem; border-radius:7px; background:rgba(239,111,110,.08); color:var(--erl-coral-dark); font-size:.74rem; font-weight:800; }

/* Keep CTA buttons visually consistent with the brand instead of oversized pills. */
.erl-btn { border-radius: 10px; }
.erl-card .erl-btn { width: 100%; margin-top: 1rem; padding: .72rem 1rem; }
.erl-btn--primary { box-shadow: none; }

@media (max-width: 980px) {
  .erl-catalog-controls { align-items: flex-start; flex-direction: column; gap: .8rem; }
  .erl-catalog-filters { justify-content: flex-start; }
  .erl-catalogue-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .erl-catalog-controls { margin-top: 1rem; padding-bottom: .7rem; }
  .erl-catalog-filters {
    width: 100%;
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-x: auto;
    gap: .9rem;
    padding: .15rem .1rem .3rem;
    scrollbar-width: thin;
  }
  .erl-catalog-filter { flex: 0 0 auto; }
  .erl-catalogue-grid { grid-template-columns: 1fr; }
}
