/* Polices chargées en priorité avec preload dans le HTML */

/* ── VARIABLES ─────────────────────────────────────────────── */
:root {
  --bronze:   #8B5E3C;
  --bronze-d: #7A5234;
  --bronze-l: #C8B89A;
  --cream:    #FAF8F5;
  --cream-2:  #F2EDE4;
  --warm:     #EDE5D8;
  --text:     #1A1005;
  --text-2:   #5C4A35;
  --muted:    #9B8B78;
  --border:   #E2D8CC;
  --white:    #FFFFFF;
  --dark:     #1A1005;
  --dark-2:   #2D1E0F;
  --radius:   10px;
  --radius-lg:18px;
  --shadow:   0 4px 20px rgba(139,94,60,0.1);
  --shadow-lg:0 20px 60px rgba(139,94,60,0.15);
}

/* ── RESET ──────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; -webkit-text-size-adjust:100%; }
body { font-family:'DM Sans','Inter','Segoe UI',system-ui,-apple-system,sans-serif; background:var(--cream); color:var(--text); overflow-x:hidden; line-height:1.6; }
h1,h2,h3,h4 { font-family:'Syne','Outfit','Nunito Sans',sans-serif; line-height:1.15; color:var(--text); font-weight:700; letter-spacing:-0.02em; }
a { text-decoration:none; color:inherit; }
img { max-width:100%; display:block; }
ul { list-style:none; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }
input,textarea,select { font-family:'DM Sans',sans-serif; }

/* ── LAYOUT ─────────────────────────────────────────────────── */
.container { max-width:1200px; margin:0 auto; padding:0 24px; }
.section    { padding:80px 0; }
.section-sm { padding:56px 0; }

/* ── BUTTONS ────────────────────────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:12px 24px; border-radius:50px;
  font-family:'Syne',sans-serif; font-size:0.875rem; font-weight:700;
  transition:all 0.25s; cursor:pointer; white-space:nowrap;
  -webkit-tap-highlight-color:transparent;
}
.btn-primary { background:var(--bronze); color:var(--white); box-shadow:0 4px 14px rgba(139,94,60,0.3); }
.btn-primary:hover  { background:var(--bronze-d); transform:translateY(-1px); }
.btn-primary:active { transform:scale(0.97); }
.btn-outline { background:transparent; color:var(--text); border:1.5px solid var(--border); }
.btn-outline:hover   { border-color:var(--bronze); color:var(--bronze); }
.btn-dark   { background:var(--dark); color:var(--white); }
.btn-dark:hover { background:var(--dark-2); transform:translateY(-1px); }
.btn-whatsapp { background:#25D366; color:#fff; }
.btn-whatsapp:hover { background:#1ebe5d; transform:translateY(-1px); }
.btn svg { width:16px; height:16px; flex-shrink:0; fill:currentColor; }

/* ── BADGE ──────────────────────────────────────────────────── */
.badge {
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 14px; border-radius:50px;
  font-family:'Syne',sans-serif; font-size:0.72rem; font-weight:700;
  letter-spacing:0.08em; text-transform:uppercase;
}
.badge-bronze { background:rgba(139,94,60,0.1); color:var(--bronze); }
.badge-dark   { background:var(--dark); color:var(--cream); }
.badge-warm   { background:var(--warm); color:var(--text-2); }

/* ── SECTION HEADER ─────────────────────────────────────────── */
.sh { text-align:center; margin-bottom:56px; }
.sh .badge { margin-bottom:14px; }
.sh h2 { font-size:clamp(1.8rem,3.5vw,2.8rem); font-weight:700; margin-bottom:14px; letter-spacing:-0.02em; }
.sh p  { font-size:1rem; color:var(--text-2); max-width:520px; margin:0 auto; line-height:1.75; }

/* ── TOPBAR ─────────────────────────────────────────────────── */
.topbar { background:var(--dark); padding:9px 0; }
.topbar-inner { display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; }
.topbar p  { font-size:0.78rem; color:rgba(255,255,255,0.65); }
.topbar a  { font-size:0.78rem; color:var(--bronze-l); font-weight:600; }

/* ── NAVIGATION ─────────────────────────────────────────────── */
.nav {
  background:rgba(250,248,245,0.95); backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  position:sticky; top:0; z-index:100;
  border-bottom:1px solid var(--border);
  transition:box-shadow 0.3s;
}
.nav.scrolled { box-shadow:0 2px 20px rgba(139,94,60,0.12); }
.nav-inner {
  max-width:1200px; margin:0 auto; padding:0 24px;
  display:flex; align-items:center; justify-content:space-between;
  height:68px;
}
.nav-logo { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.nav-logo img { height:42px; width:auto; object-fit:contain; }
.nav-logo-fallback {
  display:flex; align-items:center; gap:8px;
  font-family:'Syne',sans-serif; font-weight:800; font-size:1.1rem; color:var(--text);
}
.nav-logo-fallback span { color:var(--bronze); }
.nav-links { display:flex; align-items:center; gap:2px; }
.nav-links a {
  padding:7px 13px; font-size:0.84rem; font-weight:500;
  color:var(--text-2); border-radius:8px; transition:all 0.2s;
}
.nav-links a:hover,.nav-links a.active { color:var(--bronze); background:rgba(139,94,60,0.06); }
/* Dropdown */
.nav-drop { position:relative; }
.nav-drop-btn {
  display:flex; align-items:center; gap:4px;
  padding:7px 13px; font-size:0.84rem; font-weight:500;
  color:var(--text-2); border-radius:8px; cursor:pointer; transition:all 0.2s;
}
.nav-drop-btn:hover,.nav-drop-btn.open { color:var(--bronze); background:rgba(139,94,60,0.06); }
.nav-drop-btn svg { width:13px; height:13px; stroke:currentColor; fill:none; transition:transform 0.2s; }
.nav-drop-btn.open svg { transform:rotate(180deg); }
.drop-panel {
  position:absolute; top:calc(100% + 6px); left:0;
  background:var(--white); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:8px; min-width:210px;
  box-shadow:var(--shadow-lg); opacity:0; visibility:hidden;
  transform:translateY(-8px); transition:all 0.2s; z-index:200;
}
.nav-drop:hover .drop-panel { opacity:1; visibility:visible; transform:translateY(0); }
.drop-panel a { display:block; padding:9px 14px; font-size:0.84rem; color:var(--text); border-radius:8px; transition:all 0.15s; }
.drop-panel a:hover { background:rgba(139,94,60,0.07); color:var(--bronze); }
.drop-label { padding:5px 14px 4px; font-size:0.68rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--muted); margin-top:6px; }
/* Mobile nav */
.nav-burger { display:none; flex-direction:column; gap:5px; padding:6px; -webkit-tap-highlight-color:transparent; }
.nav-burger span { display:block; width:22px; height:2px; background:var(--text); border-radius:2px; transition:all 0.3s; }
.nav-burger.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.nav-burger.open span:nth-child(2) { opacity:0; }
.nav-burger.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }
.nav-mobile {
  display:none; position:fixed; inset:0; top:68px;
  background:var(--cream); z-index:99;
  padding:24px; flex-direction:column; gap:4px;
  overflow-y:auto;
}
.nav-mobile.open { display:flex; }
.nav-mobile a {
  padding:14px 16px; font-family:'Syne',sans-serif; font-size:1rem; font-weight:700;
  color:var(--text); border-radius:var(--radius); border-bottom:1px solid var(--border);
  transition:all 0.2s;
}
.nav-mobile a:hover { color:var(--bronze); background:rgba(139,94,60,0.05); }
.nav-mobile .nav-mobile-cta { margin-top:16px; }

/* ── PAGE HERO ──────────────────────────────────────────────── */
.page-hero { background:var(--dark); padding:100px 0 64px; position:relative; overflow:hidden; }
.page-hero::after { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 80% 50%,rgba(139,94,60,0.18),transparent 60%); pointer-events:none; }
.page-hero-inner { position:relative; z-index:1; }
.breadcrumb { display:flex; align-items:center; gap:8px; margin-bottom:20px; font-size:0.78rem; color:rgba(255,255,255,0.35); flex-wrap:wrap; }
.breadcrumb a { color:var(--bronze-l); transition:color 0.2s; }
.breadcrumb a:hover { color:var(--bronze); }
.breadcrumb span { color:rgba(255,255,255,0.2); }
.page-hero h1 { font-size:clamp(2rem,4vw,3.2rem); font-weight:700; color:var(--white); margin-bottom:14px; letter-spacing:-0.02em; }
.page-hero p { font-size:1rem; color:rgba(255,255,255,0.55); max-width:540px; line-height:1.75; }
.page-hero .badge { margin-bottom:16px; }

/* ── CARDS ──────────────────────────────────────────────────── */
.card { background:var(--white); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; transition:all 0.3s; }
.card:hover { box-shadow:var(--shadow-lg); transform:translateY(-3px); border-color:rgba(139,94,60,0.25); }

/* ── FOOTER ─────────────────────────────────────────────────── */
.footer { background:var(--dark-2); padding:56px 0 28px; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px; margin-bottom:40px; }
.footer-logo img { height:40px; width:auto; object-fit:contain; margin-bottom:14px; filter:brightness(0) invert(1); opacity:0.9; }
.footer-logo-fallback { font-family:'Syne',sans-serif; font-weight:800; font-size:1.1rem; color:var(--white); margin-bottom:14px; }
.footer-logo-fallback span { color:var(--bronze-l); }
.footer-brand p { font-size:0.85rem; color:rgba(255,255,255,0.4); line-height:1.7; max-width:260px; }
.footer-col h4 { font-family:'Syne',sans-serif; font-size:0.75rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.35); margin-bottom:14px; }
.footer-col a,.footer-col p { display:block; font-size:0.84rem; color:rgba(255,255,255,0.5); margin-bottom:9px; transition:color 0.2s; }
.footer-col a:hover { color:var(--bronze-l); }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; padding-top:24px; border-top:1px solid rgba(255,255,255,0.07); flex-wrap:wrap; gap:12px; }
.footer-bottom p { font-size:0.78rem; color:rgba(255,255,255,0.25); }
.footer-bottom a { font-size:0.78rem; color:rgba(255,255,255,0.25); transition:color 0.2s; }
.footer-bottom a:hover { color:var(--bronze-l); }

/* ── WA FLOAT ───────────────────────────────────────────────── */
.wa-float {
  position:fixed; bottom:24px; right:24px; z-index:50;
  width:52px; height:52px; background:#25D366; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 20px rgba(37,211,102,0.4);
  transition:all 0.3s; -webkit-tap-highlight-color:transparent;
}
.wa-float:hover,.wa-float:active { transform:scale(1.08); }
.wa-float svg { width:26px; height:26px; fill:white; }

/* ── ANIMATIONS ─────────────────────────────────────────────── */
@keyframes fadeUp { from { opacity:0; transform:translateY(28px); } to { opacity:1; transform:translateY(0); } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
.reveal { opacity:0; transform:translateY(24px); transition:opacity 0.6s ease,transform 0.6s ease; }
.reveal.visible { opacity:1; transform:none; }
.reveal-2 { transition-delay:0.1s; }
.reveal-3 { transition-delay:0.2s; }
.reveal-4 { transition-delay:0.3s; }
.fade-up   { animation:fadeUp 0.6s ease both; }
.fade-up-2 { animation:fadeUp 0.6s 0.12s ease both; }
.fade-up-3 { animation:fadeUp 0.6s 0.24s ease both; }
.fade-up-4 { animation:fadeUp 0.6s 0.36s ease both; }

/* ── DIVIDER ────────────────────────────────────────────────── */
.divider { height:1px; background:var(--border); }

/* ── FAQ ────────────────────────────────────────────────────── */
.faq-list { display:flex; flex-direction:column; gap:10px; max-width:760px; margin:0 auto; }
.faq-item { background:var(--white); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; transition:border-color 0.2s; }
.faq-item.open { border-color:var(--bronze); }
.faq-q { padding:17px 20px; font-family:'Syne',sans-serif; font-weight:700; font-size:0.92rem; color:var(--text); cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:12px; -webkit-tap-highlight-color:transparent; }
.faq-q-icon { width:24px; height:24px; border-radius:50%; border:1.5px solid var(--border); flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:1rem; color:var(--bronze); transition:all 0.2s; }
.faq-item.open .faq-q-icon { background:var(--bronze); border-color:var(--bronze); color:white; transform:rotate(45deg); }
.faq-a { display:none; padding:0 20px 17px; font-size:0.875rem; color:var(--text-2); line-height:1.75; }
.faq-item.open .faq-a { display:block; }

/* ── FILTERS ────────────────────────────────────────────────── */
.filters { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-bottom:36px; }
.filter-btn { padding:8px 18px; border-radius:50px; font-size:0.8rem; font-weight:600; border:1.5px solid var(--border); color:var(--muted); background:transparent; cursor:pointer; transition:all 0.2s; font-family:'Syne',sans-serif; -webkit-tap-highlight-color:transparent; }
.filter-btn:hover,.filter-btn.active { border-color:var(--bronze); color:var(--bronze); background:rgba(139,94,60,0.07); }

/* ── FORM ───────────────────────────────────────────────────── */
.field { margin-bottom:16px; }
.field label { display:block; font-size:0.78rem; font-weight:600; color:var(--text-2); margin-bottom:7px; letter-spacing:0.02em; font-family:'Syne',sans-serif; }
.field input,.field textarea,.field select { width:100%; padding:12px 15px; border:1.5px solid var(--border); border-radius:var(--radius); font-size:0.9rem; color:var(--text); background:var(--white); transition:border-color 0.2s; outline:none; -webkit-appearance:none; }
.field input:focus,.field textarea:focus { border-color:var(--bronze); box-shadow:0 0 0 3px rgba(139,94,60,0.1); }
.field textarea { resize:vertical; min-height:90px; }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }

/* ── ZONE CHIPS ─────────────────────────────────────────────── */
.zone-chips { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.zone-chip { padding:9px 18px; border:1.5px solid var(--border); border-radius:50px; font-size:0.82rem; font-weight:500; color:var(--text); transition:all 0.2s; -webkit-tap-highlight-color:transparent; }
.zone-chip:hover,.zone-chip.active { border-color:var(--bronze); color:var(--bronze); background:rgba(139,94,60,0.07); }
a.zone-chip { cursor:pointer; }

/* ── RESPONSIVE ─────────────────────────────────────────────── */
@media(max-width:900px) {
  .nav-links,.nav-drop,.nav-cta-desktop { display:none; }
  .nav-burger { display:flex; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:28px; }
  .field-row { grid-template-columns:1fr; }
}
@media(max-width:600px) {
  .container { padding:0 16px; }
  .section { padding:56px 0; }
  .section-sm { padding:40px 0; }
  .sh { margin-bottom:36px; }
  .footer-grid { grid-template-columns:1fr; gap:24px; }
  .btn { padding:12px 20px; font-size:0.84rem; }
  .page-hero { padding:80px 0 48px; }
  .wa-float { bottom:16px; right:16px; width:48px; height:48px; }
  .wa-float svg { width:22px; height:22px; }
}
@media(max-width:400px) {
  .container { padding:0 14px; }
  .filters { gap:6px; }
  .filter-btn { padding:7px 14px; font-size:0.75rem; }
}
