/* ================================================================
   XAAYA — landing.css
================================================================ */

/* ── Hero ────────────────────────────────────────────────────── */
.hero {
  min-height: 100vh;
  display: flex; flex-direction: column; justify-content: center;
  position: relative; overflow: hidden;
}
/* Orbes de fond — NO GRID */
.hero-orb {
  position: absolute; border-radius: 50%; filter: blur(80px); pointer-events: none;
}
.hero-orb-1 { width:520px;height:520px;top:-180px;right:-80px;opacity:.18;animation:float 9s ease-in-out infinite; }
.hero-orb-2 { width:380px;height:380px;bottom:-100px;left:-80px;opacity:.14;animation:float 11s ease-in-out infinite reverse; }
[data-theme="light"] .hero-orb-1 { background:radial-gradient(circle,#0468A5,transparent 70%); }
[data-theme="light"] .hero-orb-2 { background:radial-gradient(circle,#12B76A,transparent 70%); }
[data-theme="dark"]  .hero-orb-1 { background:radial-gradient(circle,#C9A84C,transparent 70%); }
[data-theme="dark"]  .hero-orb-2 { background:radial-gradient(circle,#3EC870,transparent 70%); }

.hero-inner { position:relative;z-index:2;padding:88px 0 64px; }
.hero-tag {
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 15px; background:var(--bg-card);
  border:1px solid var(--border-light); border-radius:var(--r-pill);
  font-size:12.5px; color:var(--text-secondary); margin-bottom:26px;
}
.hero-tag-dot { width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 7px var(--green);animation:pulse 2s ease infinite; }
.hero-tag strong { color:var(--primary); }
.hero-title { max-width:780px; margin-bottom:20px; }
.hero-title em { font-style:normal; color:var(--primary); }
.hero-desc { font-size:17px; font-weight:300; color:var(--text-muted); max-width:520px; line-height:1.72; margin-bottom:36px; }
.hero-actions { display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:52px; }
.hero-trust  { display:flex;align-items:center;gap:18px;flex-wrap:wrap; }
.trust-item  { display:flex;align-items:center;gap:7px;font-size:13px;color:var(--text-muted); }
.trust-ico   { color:var(--green); }

/* Float cards */
.hero-float { position:absolute;right:0;top:50%;transform:translateY(-50%);width:360px;display:flex;flex-direction:column;gap:12px;pointer-events:none; }
.f-card     { background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--r-lg);padding:15px 18px;display:flex;align-items:center;gap:12px;box-shadow:var(--shadow-md); }
.f-card-ico { width:42px;height:42px;border-radius:10px;background:var(--primary-dim);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--primary); }
.f-card-t   { font-weight:500;font-size:13.5px;color:var(--text-primary); }
.f-card-s   { font-size:12px;color:var(--text-muted);margin-top:2px; }
.f-card-p   { font-family:var(--font-display);font-size:15px;font-weight:700;color:var(--primary);flex-shrink:0;margin-left:auto; }

/* ── Stats ───────────────────────────────────────────────────── */
.stats-bar  { background:var(--bg-surface);border-top:1px solid var(--border-divider);border-bottom:1px solid var(--border-divider);padding:36px 0; }
.stats-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border-divider); }
.stat-cell  { padding:22px 28px;text-align:center;background:var(--bg-surface); }
.stat-num   { font-family:var(--font-display);font-size:36px;font-weight:800;color:var(--primary);letter-spacing:-1px;line-height:1; }
.stat-lbl   { font-size:13px;color:var(--text-muted);margin-top:5px; }

/* ── Sections ────────────────────────────────────────────────── */
.section    { padding:88px 0; }
.section-tag{ display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--primary);margin-bottom:14px; }
.section-tag::before{ content:'';display:inline-block;width:18px;height:2px;background:var(--primary);border-radius:1px; }
.sec-title  { max-width:660px;margin-bottom:12px; }
.sec-desc   { font-size:15.5px;color:var(--text-muted);max-width:500px;margin-bottom:44px; }
.sec-bg     { background:var(--bg-surface);border-top:1px solid var(--border-divider);border-bottom:1px solid var(--border-divider); }

/* ── Feature cards ───────────────────────────────────────────── */
.features-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:14px; }
.feat-card {
  background:var(--bg-card);border:1px solid var(--border-divider);
  border-radius:var(--r-lg);padding:26px;
  transition:all var(--ease);
}
.feat-card:hover { border-color:var(--border-light);transform:translateY(-3px);box-shadow:var(--shadow-md); }
.feat-ico   { width:44px;height:44px;border-radius:12px;background:var(--primary-dim);display:flex;align-items:center;justify-content:center;color:var(--primary);margin-bottom:15px; }
.feat-card h4 { font-size:15.5px;margin-bottom:9px;color:var(--text-primary); }
.feat-card p  { font-size:13.5px;color:var(--text-muted);line-height:1.65; }
.feat-foot { display:flex;align-items:center;justify-content:space-between;margin-top:18px;padding-top:14px;border-top:1px solid var(--border-divider); }
.feat-tag  { font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--primary);background:var(--primary-dim);padding:3px 8px;border-radius:var(--r-pill); }

/* ── How it works ─────────────────────────────────────────────── */
.hiw-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:28px;position:relative; }
.hiw-grid::before { content:'';position:absolute;top:26px;left:calc(12.5% + 18px);right:calc(12.5% + 18px);height:1px;background:linear-gradient(90deg,var(--primary),var(--border-divider)); }
.hiw-step { display:flex;flex-direction:column;align-items:center;text-align:center;gap:13px; }
.hiw-num  { width:52px;height:52px;border-radius:50%;border:1.5px solid var(--border-medium);background:var(--bg-card);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:17px;font-weight:700;color:var(--primary);position:relative;z-index:1; }
.hiw-step h5 { font-size:14px;color:var(--text-primary); }
.hiw-step p  { font-size:13px;color:var(--text-muted);line-height:1.6; }

/* ── Listing cards ────────────────────────────────────────────── */
.listings-row { display:grid;grid-template-columns:repeat(3,1fr);gap:18px; }
.lcard {
  background:var(--bg-card);border:1px solid var(--border-divider);
  border-radius:var(--r-lg);overflow:hidden;cursor:pointer;
  transition:all var(--ease);
}
.lcard:hover { border-color:var(--border-light);transform:translateY(-4px);box-shadow:var(--shadow-lg); }
.lcard-thumb { height:190px;background:var(--bg-raised);position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--text-hint); }
.lcard-thumb::after { content:'';position:absolute;bottom:0;left:0;right:0;height:55px;background:linear-gradient(transparent,var(--bg-card)); }
.lcard-badges  { position:absolute;top:10px;left:10px;display:flex;gap:5px;z-index:1; }
.lcard-timer   { position:absolute;top:10px;right:10px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-sm);padding:3px 9px;font-size:11px;color:#fff;display:flex;align-items:center;gap:5px;z-index:1; }
.lcard-fav     { position:absolute;bottom:11px;right:11px;width:32px;height:32px;border-radius:var(--r-sm);background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;z-index:2;transition:var(--ease-s); }
.lcard-fav:hover { background:var(--red-dim);color:var(--red); }
.lcard-fav.is-fav { background:var(--red-dim);color:var(--red); }
.lcard-body    { padding:14px 16px; }
.lcard-price   { font-family:var(--font-display);font-size:19px;font-weight:700;color:var(--primary);margin-bottom:5px; }
.lcard-price small { font-family:var(--font-body);font-size:12px;color:var(--text-muted);font-weight:400; }
.lcard-title   { font-size:14px;font-weight:500;color:var(--text-primary);margin-bottom:5px; }
.lcard-loc     { display:flex;align-items:center;gap:5px;font-size:12px;color:var(--text-muted);margin-bottom:10px; }
.lcard-tags    { display:flex;gap:5px;flex-wrap:wrap; }
.lcard-tag     { padding:2px 7px;font-size:11px;background:var(--bg-raised);border:1px solid var(--border-faint);border-radius:var(--r-pill);color:var(--text-muted); }
.lcard-foot    { display:flex;align-items:center;justify-content:space-between;padding:9px 16px 12px;border-top:1px solid var(--border-divider); }
.lcard-author  { display:flex;align-items:center;gap:7px;font-size:12px;color:var(--text-muted); }
.lcard-av      { width:22px;height:22px;border-radius:5px;background:var(--primary-dim);display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:var(--primary); }
/* Timer bar */
.timer-bar-bg   { height:3px;background:var(--bg-raised);border-radius:var(--r-pill);margin-top:4px; }
.timer-bar-fill { height:3px;border-radius:var(--r-pill);background:var(--primary);transition:width .3s; }

/* ── Testimonials ─────────────────────────────────────────────── */
.testi-grid  { display:grid;grid-template-columns:repeat(3,1fr);gap:14px; }
.testi-card  { background:var(--bg-card);border:1px solid var(--border-divider);border-radius:var(--r-lg);padding:26px; }
.testi-stars { color:var(--gold);font-size:14px;letter-spacing:2px;margin-bottom:13px; }
.testi-text  { font-size:14px;color:var(--text-secondary);line-height:1.72;font-style:italic;margin-bottom:18px; }
.testi-author{ display:flex;align-items:center;gap:11px; }
.testi-av    { width:38px;height:38px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:14px;font-weight:700;color:#fff; }
.testi-name  { font-size:13.5px;font-weight:500;color:var(--text-primary); }
.testi-role  { font-size:12px;color:var(--text-muted); }

/* ── CTA ─────────────────────────────────────────────────────── */
.cta-box {
  background:var(--bg-card);border:1px solid var(--border-light);
  border-radius:var(--r-2xl);padding:68px 72px;text-align:center;
  position:relative;overflow:hidden;
}
.cta-box::before { content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,var(--primary-dim) 0%,transparent 70%);pointer-events:none; }
.cta-box h2,.cta-box p { position:relative;z-index:1; }
.cta-box p { font-size:16px;color:var(--text-muted);margin:12px 0 32px; }
.cta-actions { position:relative;z-index:1;display:flex;gap:12px;justify-content:center;flex-wrap:wrap; }

/* ── Footer ──────────────────────────────────────────────────── */
.footer { background:var(--bg-surface);border-top:1px solid var(--border-divider);padding:56px 0 28px; }
.footer-grid { display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:44px;margin-bottom:44px; }
.footer-brand p { font-size:13.5px;color:var(--text-muted);line-height:1.7;margin:11px 0 18px; }
.footer-brand-name { display:flex;align-items:center;gap:9px;margin-bottom:2px; }
.footer-logo { height:30px;width:auto; }
.footer-name { font-family:var(--font-display);font-size:16px;font-weight:800;color:var(--text-primary); }
.footer-name span { color:var(--primary); }
.footer-socials { display:flex;gap:7px; }
.soc-btn { width:32px;height:32px;border-radius:var(--r-sm);background:var(--bg-raised);border:1px solid var(--border-faint);display:flex;align-items:center;justify-content:center;color:var(--text-muted);cursor:pointer;transition:var(--ease-s);text-decoration:none; }
.soc-btn:hover { color:var(--primary);border-color:var(--border-light); }
.footer-col h5 { font-size:13px;font-weight:600;color:var(--text-primary);margin-bottom:14px; }
.footer-links  { list-style:none;display:flex;flex-direction:column;gap:9px; }
.footer-links a { font-size:13.5px;color:var(--text-muted);text-decoration:none;transition:color var(--ease-s); }
.footer-links a:hover { color:var(--primary); }
.footer-bottom { display:flex;align-items:center;justify-content:space-between;padding-top:22px;border-top:1px solid var(--border-divider);font-size:13px;color:var(--text-muted);flex-wrap:wrap;gap:10px; }

/* ── Responsive ───────────────────────────────────────────────── */
@media(max-width:1100px){ .hero-float{display:none;} .features-grid{grid-template-columns:repeat(2,1fr);} .hiw-grid{grid-template-columns:repeat(2,1fr);} .hiw-grid::before{display:none;} .listings-row{grid-template-columns:repeat(2,1fr);} .footer-grid{grid-template-columns:1fr 1fr;} .stats-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:768px){ .section{padding:60px 0;} .features-grid,.testi-grid,.listings-row{grid-template-columns:1fr;} .cta-box{padding:44px 22px;} .footer-grid{grid-template-columns:1fr;gap:28px;} .footer-bottom{flex-direction:column;text-align:center;} }

/* ── LISTING CARDS (classes utilisées dans index.html) ──────── */
.listings-carousel { display:grid;grid-template-columns:repeat(3,1fr);gap:20px; }
.listing-card {
  background:var(--bg-card); border:1px solid var(--border-divider);
  border-radius:var(--r-lg); overflow:hidden; cursor:pointer;
  transition:all var(--ease); display:flex; flex-direction:column;
}
.listing-card:hover { border-color:var(--border-light); transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.listing-thumb {
  height:180px; background:var(--bg-raised); position:relative;
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.listing-thumb-emoji { font-size:52px; opacity:.25; }
.listing-thumb svg.thumb-icon { width:56px; height:56px; color:var(--text-hint); opacity:.3; }
.listing-badges { position:absolute; top:10px; left:10px; display:flex; gap:5px; z-index:1; }
.listing-timer {
  position:absolute; top:10px; right:10px;
  background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.1);
  border-radius:var(--r-sm); padding:3px 8px;
  font-size:11px; color:#fff; display:flex; align-items:center; gap:4px; z-index:1;
}
.listing-fav {
  position:absolute; bottom:10px; right:10px;
  width:32px; height:32px; border-radius:var(--r-sm);
  background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.1);
  display:flex; align-items:center; justify-content:center;
  color:#fff; cursor:pointer; z-index:2; transition:var(--ease-s);
  font-size:15px;
}
.listing-fav:hover,.listing-fav.is-fav { background:var(--red-dim); color:var(--red); }
.listing-body { padding:14px 16px; flex:1; }
.listing-price {
  font-family:var(--font-display); font-size:20px; font-weight:700;
  color:var(--primary); margin-bottom:5px;
}
[data-theme="dark"] .listing-price { color:var(--gold); }
.listing-price-unit { font-family:var(--font-body); font-size:12px; color:var(--text-muted); font-weight:400; }
.listing-title { font-size:14px; font-weight:500; color:var(--text-primary); margin-bottom:5px; line-height:1.4; }
.listing-loc   { display:flex; align-items:center; gap:5px; font-size:12px; color:var(--text-muted); margin-bottom:10px; }
.listing-amenities { display:flex; gap:5px; flex-wrap:wrap; margin-bottom:4px; }
.amenity-tag { padding:2px 8px; font-size:11px; background:var(--bg-raised); border:1px solid var(--border-faint); border-radius:var(--r-pill); color:var(--text-muted); }
.listing-footer { display:flex; align-items:center; justify-content:space-between; padding:9px 16px 12px; border-top:1px solid var(--border-divider); margin-top:auto; }
.listing-author { display:flex; align-items:center; gap:7px; font-size:12px; color:var(--text-muted); }
.listing-author-avatar {
  width:24px; height:24px; border-radius:6px;
  background:var(--primary-dim); display:flex; align-items:center;
  justify-content:center; font-size:9px; font-weight:700; color:var(--primary);
}
.listing-views { display:flex; align-items:center; gap:4px; font-size:12px; color:var(--text-hint); }
.timer-bar-bg   { height:3px; background:var(--bg-raised); border-radius:var(--r-pill); margin:0 16px 10px; }
.timer-bar-fill { height:3px; border-radius:var(--r-pill); background:var(--primary); }

/* badge-warning, badge-success aliases */
.badge-warning { background:var(--orange-dim); color:var(--orange); border:1px solid rgba(240,112,32,.22); }
.badge-success { background:var(--green-dim);  color:var(--green);  border:1px solid var(--green-border); }

/* ── HERO TRUST ──────────────────────────────────────────────── */
.hero-trust-item { display:flex; align-items:center; gap:7px; font-size:13px; color:var(--text-muted); }
.hero-trust-icon { display:flex; align-items:center; justify-content:center; color:var(--green); }
.hero-trust-icon svg { flex-shrink:0; }

/* ── TESTIMONIALS ────────────────────────────────────────────── */
.testimonials-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.testimonial-card {
  background:var(--bg-card); border:1px solid var(--border-divider);
  border-radius:var(--r-lg); padding:26px;
  transition:all var(--ease);
}
.testimonial-card:hover { border-color:var(--border-light); box-shadow:var(--shadow-md); transform:translateY(-2px); }
.testimonial-stars { color:var(--gold); font-size:14px; letter-spacing:2px; margin-bottom:13px; }
.testimonial-text  { font-size:14px; color:var(--text-secondary); line-height:1.72; font-style:italic; margin-bottom:18px; }
.testimonial-author { display:flex; align-items:center; gap:11px; }
.testimonial-avatar {
  width:40px; height:40px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-size:14px; font-weight:700; color:#fff; flex-shrink:0;
}
.testimonial-name { font-size:13.5px; font-weight:600; color:var(--text-primary); }
.testimonial-role { font-size:12px; color:var(--text-muted); }

/* ── ACCORDION (FAQ landing) ─────────────────────────────────── */
.accordion-item { border:1px solid var(--border-divider); border-radius:var(--r-md); overflow:hidden; background:var(--bg-card); margin-bottom:1px; }
.accordion-trigger {
  width:100%; padding:16px 20px; display:flex; align-items:center; justify-content:space-between;
  background:none; border:none; cursor:pointer; font-family:var(--font-body); font-size:14.5px;
  font-weight:500; color:var(--text-primary); text-align:left; gap:10px;
}
.accordion-trigger span { font-size:18px; color:var(--primary); transition:transform .3s; }
.accordion-item.open .accordion-trigger span { transform:rotate(45deg); }
.accordion-content { max-height:0; overflow:hidden; transition:max-height .35s ease; }
.accordion-content-inner { padding:0 20px 18px; color:var(--text-secondary); font-size:14px; line-height:1.75; }

/* ── HOW IT WORKS (section) ──────────────────────────────────── */
.section-title { max-width:660px; margin-bottom:12px; }
.section-desc  { font-size:15.5px; color:var(--text-muted); max-width:500px; margin-bottom:44px; }

/* ── FEATURES (extra grid) ───────────────────────────────────── */
.mini-features { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
.mini-feat { background:var(--bg-card); border:1px solid var(--border-divider); border-radius:var(--r-lg); padding:20px 16px; text-align:center; }
.mini-feat-ico { width:40px; height:40px; border-radius:10px; background:var(--primary-dim); display:flex; align-items:center; justify-content:center; color:var(--primary); margin:0 auto 12px; }
.mini-feat h5 { font-size:13.5px; font-weight:600; color:var(--text-primary); margin-bottom:5px; }
.mini-feat p  { font-size:12px; color:var(--text-muted); line-height:1.55; }

@media(max-width:1100px) { .listings-carousel{grid-template-columns:repeat(2,1fr);} .testimonials-grid{grid-template-columns:repeat(2,1fr);} .mini-features{grid-template-columns:repeat(3,1fr);} }
@media(max-width:768px)  { .listings-carousel,.testimonials-grid{grid-template-columns:1fr;} .mini-features{grid-template-columns:repeat(2,1fr);} }

/* ── HERO trust items (classes utilisées dans index.html) ─────── */
.hero-trust { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.hero-trust-item { display:flex; align-items:center; gap:7px; font-size:13px; color:var(--text-muted); }
.hero-trust-icon { display:flex; align-items:center; color:var(--green); }

/* ── FLOAT CARDS ──────────────────────────────────────────────── */
.hero-float { position:absolute; right:0; top:50%; transform:translateY(-50%); width:320px; display:flex; flex-direction:column; gap:12px; pointer-events:none; z-index:2; padding-right:24px; }
.float-card { background:var(--bg-card); border:1px solid var(--border-light); border-radius:var(--r-lg); padding:14px 16px; display:flex; align-items:center; gap:12px; box-shadow:var(--shadow-md); animation:float 7s ease-in-out infinite; }
.float-card-mid { animation-delay:-2.5s; }
.float-card-bot { animation-delay:-5s; }
.float-card-icon { width:40px; height:40px; border-radius:10px; background:var(--primary-dim); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--primary); }
.float-card-info { flex:1; min-width:0; }
.float-card-title { font-weight:500; font-size:13px; color:var(--text-primary); }
.float-card-sub { font-size:11.5px; color:var(--text-muted); margin-top:2px; }
.float-card-price { font-family:var(--font-display); font-size:14px; font-weight:700; color:var(--primary); flex-shrink:0; margin-left:auto; }

/* ── STATS SECTION ────────────────────────────────────────────── */
.stats-section { padding:44px 0; background:var(--bg-surface); border-top:1px solid var(--border-divider); border-bottom:1px solid var(--border-divider); }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border-divider); }
.stat-item { padding:22px 28px; text-align:center; background:var(--bg-surface); }
.stat-num { font-family:var(--font-display); font-size:36px; font-weight:800; color:var(--primary); letter-spacing:-1px; line-height:1; }
.stat-lbl { font-size:13px; color:var(--text-muted); margin-top:5px; }
.stat-sub { font-size:11.5px; color:var(--text-hint); margin-top:3px; }

/* ── SECTION wrapper ──────────────────────────────────────────── */
.section { padding:80px 0; }
.section-tag { display:inline-flex; align-items:center; gap:7px; font-size:11.5px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--primary); margin-bottom:14px; }
.section-tag::before { content:''; display:inline-block; width:18px; height:2px; background:var(--primary); border-radius:1px; }

@media(max-width:1100px) { .hero-float { display:none; } .stats-grid { grid-template-columns:repeat(2,1fr); } }
@media(max-width:768px)  { .stats-grid { grid-template-columns:1fr 1fr; } .section { padding:56px 0; } }

/* ── STATS v2 — grands chiffres accentués ─────────────────────── */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  background: var(--border-divider);
}
.stat-item {
  padding: 36px 28px;
  text-align: center;
  background: var(--bg-surface);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  transition: background var(--ease);
}
.stat-item:hover { background: var(--bg-card); }
.stat-ico {
  width: 44px; height: 44px; border-radius: 12px;
  background: var(--primary-dim); display: flex;
  align-items: center; justify-content: center;
  color: var(--primary); margin-bottom: 10px;
}
.stat-number {
  font-family: var(--font-display);
  font-size: clamp(40px, 5vw, 60px);
  font-weight: 900;
  color: var(--primary);
  letter-spacing: -2px;
  line-height: 1;
  background: linear-gradient(135deg, var(--primary), var(--primary-h));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
[data-theme="dark"] .stat-number {
  background: linear-gradient(135deg, #C9A84C, #E0BE65);
  -webkit-background-clip: text;
  background-clip: text;
}
.stat-number[style*="green"] {
  background: linear-gradient(135deg, var(--green), #0ea55b);
  -webkit-background-clip: text;
  background-clip: text;
}
.stat-label {
  font-size: 13.5px; font-weight: 600; color: var(--text-primary); margin-top: 6px;
}
.stat-detail {
  font-size: 12px; color: var(--text-hint); margin-top: 2px;
}

/* ── FEATURES v2 — cartes aérées avec bordures animées ─────────── */
.features-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.feat-card {
  background: var(--bg-card);
  border: 1px solid var(--border-divider);
  border-radius: var(--r-xl);
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
  transition: all 0.25s ease;
}
.feat-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: var(--r-xl);
  background: linear-gradient(135deg, var(--primary-dim), transparent 60%);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.feat-card:hover {
  border-color: var(--primary);
  transform: translateY(-4px);
  box-shadow: 0 8px 32px rgba(4,104,165,.12);
}
[data-theme="dark"] .feat-card:hover {
  border-color: var(--gold);
  box-shadow: 0 8px 32px rgba(201,168,76,.12);
}
.feat-card:hover::before { opacity: 1; }
.feat-ico {
  width: 48px; height: 48px; border-radius: 14px;
  background: var(--primary-dim);
  border: 1px solid var(--border-light);
  display: flex; align-items: center; justify-content: center;
  color: var(--primary);
  margin-bottom: 16px;
  position: relative; z-index: 1;
  transition: all 0.25s ease;
}
.feat-card:hover .feat-ico {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
[data-theme="dark"] .feat-card:hover .feat-ico {
  background: var(--gold);
  color: #000;
  border-color: var(--gold);
}
.feat-card h4 {
  font-size: 15px; font-weight: 700;
  color: var(--text-primary); margin-bottom: 9px;
  position: relative; z-index: 1;
}
.feat-card p {
  font-size: 13.5px; color: var(--text-muted);
  line-height: 1.68;
  position: relative; z-index: 1;
}
.feat-foot {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 18px; padding-top: 14px;
  border-top: 1px solid var(--border-divider);
  position: relative; z-index: 1;
}
.feat-tag {
  font-size: 10px; font-weight: 700; letter-spacing: 1px;
  text-transform: uppercase; color: var(--primary);
  background: var(--primary-dim); padding: 3px 9px;
  border-radius: var(--r-pill);
}

/* ── HIW GRID v2 — horizontal 4 colonnes ────────────────────────── */
.hiw-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  position: relative;
}
.hiw-grid::before {
  content: '';
  position: absolute;
  top: 26px;
  left: calc(12.5% + 18px);
  right: calc(12.5% + 18px);
  height: 1.5px;
  background: linear-gradient(90deg, var(--primary) 0%, var(--border-divider) 100%);
  z-index: 0;
}
.hiw-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 12px;
  padding: 0 16px;
}
.hiw-num {
  width: 52px; height: 52px; border-radius: 50%;
  border: 2px solid var(--primary);
  background: var(--bg-card);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-size: 18px; font-weight: 800;
  color: var(--primary);
  position: relative; z-index: 1;
  box-shadow: 0 0 0 6px var(--bg-base);
  transition: all 0.25s ease;
}
.hiw-step:hover .hiw-num {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 4px 16px rgba(4,104,165,.25);
}
.hiw-step h5 {
  font-size: 14.5px; font-weight: 700; color: var(--text-primary);
}
.hiw-step p {
  font-size: 13px; color: var(--text-muted); line-height: 1.62;
}
.hiw-section-label {
  font-size: 13.5px; color: var(--text-muted); font-weight: 500;
  margin-bottom: 32px; display: flex; align-items: center; gap: 8px;
}
.hiw-section-label strong { color: var(--text-primary); }
.hiw-section-label::before {
  content: ''; display: inline-block; width: 12px; height: 12px;
  border-radius: 50%; background: var(--primary); flex-shrink: 0;
}

/* ── MINI FEATURES v2 ─────────────────────────────────────────── */
.mini-features {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  margin-top: 28px;
}
.mini-feat {
  background: var(--bg-card);
  border: 1px solid var(--border-divider);
  border-radius: var(--r-lg);
  padding: 18px 14px;
  text-align: center;
  transition: all 0.2s ease;
}
.mini-feat:hover {
  border-color: var(--border-light);
  transform: translateY(-2px);
  box-shadow: var(--shadow-sm);
}
.mini-feat-ico {
  width: 38px; height: 38px; border-radius: 10px;
  background: var(--primary-dim);
  display: flex; align-items: center; justify-content: center;
  color: var(--primary); margin: 0 auto 10px;
}
.mini-feat h5 { font-size: 12.5px; font-weight: 600; color: var(--text-primary); margin-bottom: 4px; }
.mini-feat p  { font-size: 11.5px; color: var(--text-muted); line-height: 1.5; }

@media(max-width:1100px) {
  .features-grid { grid-template-columns: repeat(2,1fr); }
  .hiw-grid { grid-template-columns: repeat(2,1fr); gap: 28px; }
  .hiw-grid::before { display: none; }
  .mini-features { grid-template-columns: repeat(3,1fr); }
  .stats-grid { grid-template-columns: repeat(2,1fr); }
}
@media(max-width:640px) {
  .features-grid { grid-template-columns: 1fr; }
  .mini-features { grid-template-columns: repeat(2,1fr); }
  .stat-number { font-size: 40px; }
  .hiw-grid { grid-template-columns: 1fr; }
}


/* ── Forum section ─────────────────────────────────────────── */
.forum-q { animation: fadeIn .3s ease; }
@keyframes fadeIn { from { opacity:0; transform:translateY(-8px); } to { opacity:1; transform:none; } }

@media(max-width:768px) {
  .accordion-trigger { font-size: 13.5px; padding: 14px 16px; }
  /* Forum grid */
  section#forum .container > div > div:first-child + div { margin-top: 24px; }
}
@media(max-width:640px) {
  section#forum .container > div > div { grid-column: 1/-1 !important; }
  section#forum .container > div { grid-template-columns: 1fr !important; }
}


/* ═══════════════════════════════════════════════════
   FAQ Accordion — v9 final
═══════════════════════════════════════════════════ */
.accordion-item {
  background: var(--bg-card);
  border: 1px solid var(--border-divider);
  border-radius: var(--r-lg);
  overflow: hidden;
  margin-bottom: 8px;
  transition: border-color .2s, box-shadow .2s;
}
.accordion-item:hover {
  border-color: var(--border-light);
}
.accordion-item.open {
  border-color: var(--primary);
  box-shadow: 0 4px 20px rgba(4,104,165,.08);
}
[data-theme="dark"] .accordion-item.open {
  box-shadow: 0 4px 20px rgba(201,168,76,.08);
}
.accordion-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 22px;
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--font-body);
  font-size: 14.5px;
  font-weight: 500;
  color: var(--text-primary);
  text-align: left;
  line-height: 1.4;
  transition: color .15s;
}
.accordion-trigger:hover               { color: var(--primary); }
.accordion-item.open .accordion-trigger { color: var(--primary); font-weight: 600; }
.acc-icon {
  flex-shrink: 0;
  color: var(--primary);
  transition: transform .32s cubic-bezier(.34,1.56,.64,1);
  display: flex;
  align-items: center;
}
.accordion-item.open .acc-icon { transform: rotate(45deg); }

/* The actual content area — controlled by JS */
.accordion-content {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height .38s cubic-bezier(.4,0,.2,1), opacity .26s ease;
}
.accordion-content-inner {
  padding: 0 22px 22px;
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.8;
  border-top: 1px solid var(--border-faint);
  padding-top: 16px;
}
@media(max-width:640px) {
  .accordion-trigger { font-size: 13.5px; padding: 15px 16px; }
  .accordion-content-inner { padding: 12px 16px 18px; }
}
