/*
Theme Name: VivabexPlus
Theme URI: https://vivabexplus.com
Author: VivabexPlus
Author URI: https://vivabexplus.com
Description: Thème premium pour VivabexPlus — Cabinet de courtage financier. Navy & Gold. Elementor Ready.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: Proprietary
License URI: https://vivabexplus.com
Text Domain: vivabexplus
Tags: finance, elementor, custom, one-page, landing
*/

/* ============================================================
   CSS CUSTOM PROPERTIES — Brand: Deep Navy + Warm Gold
   ============================================================ */
:root {
  --vvx-radius: 0.5rem;

  /* Palette */
  --vvx-bg:             #ffffff;
  --vvx-fg:             #1a1d2e;

  --vvx-card:           #ffffff;
  --vvx-card-fg:        #1a1d2e;

  --vvx-primary:        #1b2040;   /* deep navy */
  --vvx-primary-fg:     #f8f9fd;
  --vvx-primary-glow:   #3d4f8a;

  --vvx-secondary:      #f2f3f8;
  --vvx-secondary-fg:   #1b2040;

  --vvx-accent:         #c9a84c;   /* warm gold */
  --vvx-accent-fg:      #1a1d2e;

  --vvx-muted:          #f2f3f8;
  --vvx-muted-fg:       #717594;

  --vvx-border:         #e4e6f0;
  --vvx-input:          #e4e6f0;
  --vvx-destructive:    #dc3545;

  /* Gradients */
  --vvx-grad-hero:  linear-gradient(135deg, #141830 0%, #1f2a50 100%);
  --vvx-grad-gold:  linear-gradient(135deg, #d4a84b 0%, #b8882a 100%);
  --vvx-grad-overlay: linear-gradient(180deg, rgba(20,24,48,.55) 0%, rgba(20,24,48,.85) 100%);

  /* Shadows */
  --vvx-shadow-elegant: 0 20px 60px -20px rgba(27,32,64,.35);
  --vvx-shadow-gold:    0 10px 40px -10px rgba(201,168,76,.5);
  --vvx-shadow-card:    0 4px 24px -8px rgba(0,0,0,.12);

  /* Typography */
  --vvx-font-display: "Playfair Display", Georgia, serif;
  --vvx-font-sans:    "Inter", system-ui, -apple-system, sans-serif;

  /* Transition */
  --vvx-transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ============================================================
   RESET & BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; font-size: 16px; }

body {
  background-color: var(--vvx-bg);
  color: var(--vvx-fg);
  font-family: var(--vvx-font-sans);
  -webkit-font-smoothing: antialiased;
  line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--vvx-font-display);
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--vvx-primary);
}

img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }

/* ============================================================
   UTILITY CLASSES
   ============================================================ */
.vvx-container {
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: 1rem;
}
@media (min-width: 1024px) { .vvx-container { padding-inline: 2rem; } }

.vvx-bg-hero    { background-image: var(--vvx-grad-hero); }
.vvx-bg-gold    { background-image: var(--vvx-grad-gold); }
.vvx-text-gold  {
  background-image: var(--vvx-grad-gold);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.vvx-shadow-elegant { box-shadow: var(--vvx-shadow-elegant); }
.vvx-shadow-gold    { box-shadow: var(--vvx-shadow-gold); }
.vvx-shadow-card    { box-shadow: var(--vvx-shadow-card); }
.vvx-transition     { transition: var(--vvx-transition); }

.vvx-label {
  display: inline-block;
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .3em;
  color: var(--vvx-accent);
}

.vvx-section-title {
  margin-top: .75rem;
  font-family: var(--vvx-font-display);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  color: var(--vvx-primary);
}

/* Btn gold */
.vvx-btn-gold {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  border-radius: 9999px;
  background-image: var(--vvx-grad-gold);
  padding: .875rem 1.75rem;
  font-size: .875rem;
  font-weight: 600;
  color: var(--vvx-primary);
  box-shadow: var(--vvx-shadow-gold);
  transition: var(--vvx-transition);
  border: none;
}
.vvx-btn-gold:hover { transform: scale(1.05); }

/* Btn outline */
.vvx-btn-outline {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  border-radius: 9999px;
  border: 1.5px solid rgba(248,249,253,.3);
  background: rgba(248,249,253,.05);
  padding: .875rem 1.75rem;
  font-size: .875rem;
  font-weight: 600;
  color: var(--vvx-primary-fg);
  transition: var(--vvx-transition);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.vvx-btn-outline:hover { background: rgba(248,249,253,.15); }

/* ============================================================
   HEADER
   ============================================================ */
#vvx-header {
  position: sticky;
  top: 0;
  z-index: 100;
  width: 100%;
  border-bottom: 1px solid var(--vvx-border);
  background: rgba(255,255,255,.85);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

.vvx-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 80px;
}

.vvx-logo-wrap {
  display: flex;
  align-items: center;
  gap: .75rem;
  text-decoration: none;
}
.vvx-logo-wrap img { height: 48px; width: 48px; object-fit: contain; }
.vvx-logo-name  { font-family: var(--vvx-font-display); font-size: 1.125rem; font-weight: 700; color: var(--vvx-primary); line-height: 1; }
.vvx-logo-sub   { font-size: .625rem; text-transform: uppercase; letter-spacing: .18em; color: var(--vvx-muted-fg); }

/* Desktop nav */
.vvx-nav { display: none; align-items: center; gap: 2rem; }
@media (min-width: 1024px) { .vvx-nav { display: flex; } }
.vvx-nav a {
  font-size: .875rem;
  font-weight: 500;
  color: rgba(27,32,64,.8);
  transition: var(--vvx-transition);
}
.vvx-nav a:hover,
.vvx-nav a.current-menu-item,
.vvx-nav a.current_page_item { color: var(--vvx-accent); font-weight: 600; }

/* CTA tel header */
.vvx-header-cta { display: none; }
@media (min-width: 1024px) { .vvx-header-cta { display: inline-flex; } }

/* Hamburger */
.vvx-hamburger {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: .5rem;
  border-radius: .375rem;
  color: var(--vvx-primary);
}
@media (min-width: 1024px) { .vvx-hamburger { display: none; } }
.vvx-hamburger svg { width: 24px; height: 24px; }

/* Mobile nav */
.vvx-mobile-nav {
  display: none;
  border-top: 1px solid var(--vvx-border);
  background: var(--vvx-bg);
  padding: 1rem;
}
.vvx-mobile-nav.is-open { display: block; }
.vvx-mobile-nav a {
  display: block;
  padding: .75rem 1rem;
  border-radius: .375rem;
  font-size: .875rem;
  font-weight: 500;
  color: rgba(27,32,64,.8);
  transition: var(--vvx-transition);
}
.vvx-mobile-nav a:hover { background: var(--vvx-secondary); color: var(--vvx-accent); }
.vvx-mobile-nav .vvx-btn-gold { margin-top: .5rem; width: 100%; justify-content: center; }

/* ============================================================
   FOOTER
   ============================================================ */
#vvx-footer {
  background-image: var(--vvx-grad-hero);
  color: var(--vvx-primary-fg);
}
.vvx-footer-grid {
  display: grid;
  gap: 2.5rem;
  padding: 4rem 0;
}
@media (min-width: 768px)  { .vvx-footer-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .vvx-footer-grid { grid-template-columns: repeat(4, 1fr); } }

.vvx-footer-brand p { margin-top: 1rem; font-size: .875rem; color: rgba(248,249,253,.75); }
.vvx-footer-socials { display: flex; gap: .75rem; margin-top: 1.25rem; }
.vvx-footer-socials a {
  border: 1px solid rgba(248,249,253,.2);
  border-radius: 9999px;
  padding: .5rem;
  transition: var(--vvx-transition);
}
.vvx-footer-socials a:hover { border-color: var(--vvx-accent); color: var(--vvx-accent); }
.vvx-footer-socials svg { width: 16px; height: 16px; }

.vvx-footer-col h4 { font-family: var(--vvx-font-display); font-size: 1.125rem; font-weight: 600; margin-bottom: 1rem; }
.vvx-footer-col ul { display: flex; flex-direction: column; gap: .5rem; }
.vvx-footer-col ul a { font-size: .875rem; color: rgba(248,249,253,.75); transition: var(--vvx-transition); }
.vvx-footer-col ul a:hover { color: var(--vvx-accent); }

.vvx-footer-contact li { display: flex; align-items: flex-start; gap: .5rem; font-size: .875rem; color: rgba(248,249,253,.85); }
.vvx-footer-contact li + li { margin-top: .75rem; }
.vvx-footer-contact svg { width: 16px; height: 16px; color: var(--vvx-accent); flex-shrink: 0; margin-top: 2px; }
.vvx-footer-contact a:hover { color: var(--vvx-accent); }

.vvx-footer-bottom {
  border-top: 1px solid rgba(248,249,253,.15);
  padding: 1.5rem 0;
  text-align: center;
  font-size: .75rem;
  color: rgba(248,249,253,.6);
}

/* ============================================================
   SECTION: HERO (front-page)
   ============================================================ */
.vvx-hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.vvx-hero-bg {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.vvx-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(27,32,64,.95), rgba(27,32,64,.75), rgba(27,32,64,.3));
}
@media (min-width: 1024px) {
  .vvx-hero-overlay { background: linear-gradient(to right, rgba(27,32,64,.85), rgba(27,32,64,.55), transparent); }
}
.vvx-hero-content {
  position: relative;
  display: grid;
  align-items: center;
  min-height: 640px;
  padding: 6rem 0;
}
.vvx-hero-inner { max-width: 42rem; color: var(--vvx-primary-fg); }
.vvx-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  border: 1px solid rgba(201,168,76,.4);
  background: rgba(201,168,76,.1);
  border-radius: 9999px;
  padding: .375rem 1rem;
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--vvx-accent);
}
.vvx-hero-badge svg { width: 14px; height: 14px; }
.vvx-hero-h1 {
  margin-top: 1.5rem;
  font-family: var(--vvx-font-display);
  font-size: clamp(2.25rem, 5vw, 4.5rem);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--vvx-primary-fg);
}
.vvx-hero-p {
  margin-top: 1.5rem;
  max-width: 36rem;
  font-size: 1.125rem;
  color: rgba(248,249,253,.85);
}
.vvx-hero-ctas { margin-top: 2.5rem; display: flex; flex-wrap: wrap; gap: 1rem; }

/* ============================================================
   SECTION: INTRO / ABOUT
   ============================================================ */
.vvx-section { padding: 6rem 0; }
.vvx-section-alt { background: rgba(242,243,248,.5); }

.vvx-grid-2 { display: grid; gap: 3rem; align-items: center; }
@media (min-width: 1024px) { .vvx-grid-2 { grid-template-columns: 1fr 1fr; } }

.vvx-img-wrap { position: relative; }
.vvx-img-glow {
  position: absolute;
  inset: -1rem;
  border-radius: 1rem;
  background-image: var(--vvx-grad-gold);
  opacity: .2;
  filter: blur(2rem);
}
.vvx-img-wrap img { position: relative; border-radius: 1rem; box-shadow: var(--vvx-shadow-elegant); }

/* Services key list */
.vvx-services-label { margin-top: 1rem; font-weight: 600; color: var(--vvx-primary); }
.vvx-services-list { margin-top: .75rem; display: flex; flex-direction: column; gap: .5rem; }
.vvx-services-list li { display: flex; align-items: center; gap: .75rem; font-size: .875rem; color: rgba(27,32,64,.8); }
.vvx-services-list svg { width: 20px; height: 20px; flex-shrink: 0; color: var(--vvx-accent); }

/* ============================================================
   SECTION: WHY US / CARDS GRID
   ============================================================ */
.vvx-center { text-align: center; }
.vvx-center .vvx-section-title { max-width: 48rem; margin-inline: auto; }

.vvx-cards-grid { margin-top: 3.5rem; display: grid; gap: 1.5rem; }
@media (min-width: 768px)  { .vvx-cards-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .vvx-cards-grid-4 { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1024px) { .vvx-cards-grid-3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .vvx-cards-grid-2 { grid-template-columns: repeat(2, 1fr); } }

.vvx-card {
  border-radius: 1rem;
  border: 1px solid var(--vvx-border);
  background: var(--vvx-card);
  padding: 1.75rem;
  box-shadow: var(--vvx-shadow-card);
  transition: var(--vvx-transition);
}
.vvx-card:hover { transform: translateY(-4px); box-shadow: var(--vvx-shadow-elegant); }

.vvx-icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px; height: 56px;
  border-radius: .75rem;
  background-image: var(--vvx-grad-gold);
  color: var(--vvx-primary);
  box-shadow: var(--vvx-shadow-gold);
  transition: var(--vvx-transition);
}
.vvx-card:hover .vvx-icon-wrap { transform: scale(1.1); }
.vvx-icon-wrap svg { width: 28px; height: 28px; }

.vvx-card h3 { margin-top: 1.25rem; font-family: var(--vvx-font-display); font-size: 1.25rem; font-weight: 600; color: var(--vvx-primary); }
.vvx-card p  { margin-top: .5rem; font-size: .875rem; line-height: 1.6; color: var(--vvx-muted-fg); }

/* ============================================================
   SECTION: CTA STRIP
   ============================================================ */
.vvx-cta-strip {
  position: relative;
  overflow: hidden;
  background-image: var(--vvx-grad-hero);
  padding: 5rem 0;
  color: var(--vvx-primary-fg);
}
.vvx-cta-strip::after {
  content: "";
  position: absolute;
  right: -5rem;
  top: 50%;
  transform: translateY(-50%);
  width: 320px; height: 320px;
  border-radius: 50%;
  background: rgba(201,168,76,.2);
  filter: blur(3rem);
  pointer-events: none;
}
.vvx-cta-inner {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
  text-align: center;
}
@media (min-width: 1024px) {
  .vvx-cta-inner { flex-direction: row; justify-content: space-between; text-align: left; }
}
.vvx-cta-strip h2 { font-family: var(--vvx-font-display); font-size: clamp(1.75rem, 3vw, 2.25rem); font-weight: 700; color: var(--vvx-primary-fg); }
.vvx-cta-strip p  { margin-top: .75rem; color: rgba(248,249,253,.8); }
.vvx-cta-btns { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1rem; }

/* ============================================================
   SECTION: STATS
   ============================================================ */
.vvx-stats-grid { margin-top: 3rem; display: grid; gap: 1.5rem; }
@media (min-width: 640px)  { .vvx-stats-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .vvx-stats-grid { grid-template-columns: repeat(4, 1fr); } }

.vvx-stat-card {
  border-radius: 1rem;
  border: 1px solid var(--vvx-border);
  background: var(--vvx-card);
  padding: 2rem;
  text-align: center;
  box-shadow: var(--vvx-shadow-card);
}
.vvx-stat-num { font-family: var(--vvx-font-display); font-size: 3rem; font-weight: 700; }
.vvx-stat-lbl { margin-top: .5rem; font-size: .75rem; font-weight: 500; text-transform: uppercase; letter-spacing: .1em; color: var(--vvx-muted-fg); }

/* ============================================================
   SECTION: TESTIMONIALS
   ============================================================ */
.vvx-testimonial {
  border-radius: 1rem;
  border: 1px solid var(--vvx-border);
  background: var(--vvx-card);
  padding: 1.75rem;
  box-shadow: var(--vvx-shadow-card);
  transition: var(--vvx-transition);
}
.vvx-testimonial:hover { transform: translateY(-4px); box-shadow: var(--vvx-shadow-elegant); }
.vvx-testimonial svg.quote { width: 32px; height: 32px; color: var(--vvx-accent); }
.vvx-testimonial-text { margin-top: .75rem; font-size: .875rem; line-height: 1.7; color: rgba(27,32,64,.85); }
.vvx-testimonial-author { margin-top: 1.5rem; display: flex; align-items: center; gap: .75rem; }
.vvx-testimonial-author img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.vvx-author-name { font-weight: 600; color: var(--vvx-primary); font-size: .9rem; }
.vvx-author-role { font-size: .75rem; color: var(--vvx-muted-fg); }
.vvx-stars { margin-left: auto; display: flex; }
.vvx-stars svg { width: 16px; height: 16px; fill: var(--vvx-accent); color: var(--vvx-accent); }

/* ============================================================
   PAGE HERO BANNER (inner pages)
   ============================================================ */
.vvx-page-hero {
  background-image: var(--vvx-grad-hero);
  color: var(--vvx-primary-fg);
  padding: 6rem 0;
}
.vvx-page-hero h1 {
  margin-top: .75rem;
  font-family: var(--vvx-font-display);
  font-size: clamp(2.25rem, 4vw, 3.75rem);
  font-weight: 700;
  color: var(--vvx-primary-fg);
  max-width: 48rem;
}
.vvx-page-hero p { margin-top: 1.5rem; max-width: 40rem; font-size: 1.125rem; color: rgba(248,249,253,.85); }

/* ============================================================
   PAGE: SERVICES
   ============================================================ */
.vvx-service-card {
  border-radius: 1rem;
  border: 1px solid var(--vvx-border);
  background: var(--vvx-card);
  overflow: hidden;
  box-shadow: var(--vvx-shadow-card);
  transition: var(--vvx-transition);
}
.vvx-service-card:hover { transform: translateY(-4px); box-shadow: var(--vvx-shadow-elegant); }
.vvx-service-img-wrap { position: relative; height: 224px; overflow: hidden; }
.vvx-service-img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: var(--vvx-transition); }
.vvx-service-card:hover .vvx-service-img-wrap img { transform: scale(1.05); }
.vvx-service-img-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(27,32,64,.8), rgba(27,32,64,.2), transparent);
}
.vvx-service-img-title {
  position: absolute;
  bottom: 1rem;
  left: 1.25rem;
  right: 1.25rem;
  font-family: var(--vvx-font-display);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--vvx-primary-fg);
}
.vvx-service-body { padding: 1.5rem; }
.vvx-service-features { margin-top: .75rem; display: flex; flex-direction: column; gap: .5rem; }
.vvx-service-features li { display: flex; align-items: flex-start; gap: .5rem; font-size: .875rem; color: rgba(27,32,64,.85); }
.vvx-service-features svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--vvx-accent); margin-top: 3px; }
.vvx-service-eligibility { margin-top: 1.25rem; border-radius: .5rem; background: rgba(242,243,248,.6); padding: 1rem; }
.vvx-service-eligibility h4 { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--vvx-primary); }
.vvx-service-eligibility p  { margin-top: .25rem; font-size: .875rem; color: var(--vvx-muted-fg); }
.vvx-service-link { margin-top: 1.25rem; display: inline-flex; align-items: center; gap: .5rem; font-size: .875rem; font-weight: 600; color: var(--vvx-accent); }
.vvx-service-link:hover { text-decoration: underline; }
.vvx-service-link svg { width: 16px; height: 16px; }

/* Steps */
.vvx-steps { margin-top: 2rem; display: flex; flex-direction: column; gap: 1.25rem; }
.vvx-step { display: flex; gap: 1rem; }
.vvx-step-num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px; height: 40px;
  flex-shrink: 0;
  border-radius: 50%;
  background-image: var(--vvx-grad-gold);
  font-family: var(--vvx-font-display);
  font-weight: 700;
  color: var(--vvx-primary);
  box-shadow: var(--vvx-shadow-gold);
}
.vvx-step h4 { font-family: var(--vvx-font-display); font-size: 1.125rem; font-weight: 600; color: var(--vvx-primary); }
.vvx-step p  { font-size: .875rem; color: var(--vvx-muted-fg); margin-top: .25rem; }

/* ============================================================
   PAGE: DEMANDE (Loan Simulator)
   ============================================================ */
.vvx-sim-card {
  border-radius: 1rem;
  border: 1px solid var(--vvx-border);
  background: var(--vvx-card);
  padding: 2rem;
  box-shadow: var(--vvx-shadow-card);
}
.vvx-sim-header { display: flex; align-items: center; gap: .75rem; }
.vvx-sim-header h2 { font-family: var(--vvx-font-display); font-size: 1.5rem; font-weight: 700; color: var(--vvx-primary); }

.vvx-loan-types { margin-top: 2rem; }
.vvx-loan-types label { display: block; margin-bottom: .5rem; font-size: .875rem; font-weight: 600; color: var(--vvx-primary); }
.vvx-loan-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem; }
@media (min-width: 480px) { .vvx-loan-grid { grid-template-columns: repeat(3, 1fr); } }
.vvx-loan-type-btn {
  border-radius: .5rem;
  border: 1px solid var(--vvx-border);
  background: var(--vvx-bg);
  padding: .625rem .75rem;
  font-size: .75rem;
  font-weight: 500;
  color: rgba(27,32,64,.7);
  transition: var(--vvx-transition);
  text-align: center;
}
.vvx-loan-type-btn:hover     { border-color: rgba(201,168,76,.6); }
.vvx-loan-type-btn.is-active { border-color: var(--vvx-accent); background: rgba(201,168,76,.15); color: var(--vvx-primary); box-shadow: var(--vvx-shadow-gold); }

.vvx-range-group { margin-top: 2rem; }
.vvx-range-header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: .5rem; }
.vvx-range-header label { font-size: .875rem; font-weight: 600; color: var(--vvx-primary); }
.vvx-range-val { font-family: var(--vvx-font-display); font-size: 1.5rem; font-weight: 700; }
.vvx-range-limits { display: flex; justify-content: space-between; margin-top: .25rem; font-size: .75rem; color: var(--vvx-muted-fg); }

input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 4px;
  border-radius: 2px;
  background: var(--vvx-border);
  outline: none;
}
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px; height: 20px;
  border-radius: 50%;
  background-image: var(--vvx-grad-gold);
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(201,168,76,.5);
}
input[type="range"]::-moz-range-thumb {
  width: 20px; height: 20px;
  border-radius: 50%;
  background-image: var(--vvx-grad-gold);
  cursor: pointer;
  border: none;
}

.vvx-sim-results { margin-top: 2rem; display: grid; gap: 1rem; }
@media (min-width: 480px) { .vvx-sim-results { grid-template-columns: repeat(3, 1fr); } }
.vvx-sim-result { border-radius: .75rem; border: 1px solid var(--vvx-border); padding: 1rem; background: rgba(242,243,248,.5); }
.vvx-sim-result.is-hl { border-color: var(--vvx-accent); background: rgba(201,168,76,.1); }
.vvx-sim-result-lbl { font-size: .75rem; font-weight: 500; text-transform: uppercase; letter-spacing: .05em; color: var(--vvx-muted-fg); }
.vvx-sim-result-val { margin-top: .25rem; font-family: var(--vvx-font-display); font-size: 1.25rem; font-weight: 700; color: var(--vvx-primary); }
.vvx-sim-result.is-hl .vvx-sim-result-val { background-image: var(--vvx-grad-gold); -webkit-background-clip: text; background-clip: text; color: transparent; }
.vvx-sim-note { margin-top: 1rem; font-size: .75rem; color: var(--vvx-muted-fg); }

/* ============================================================
   FORMS (contact + demande)
   ============================================================ */
.vvx-form-card {
  border-radius: 1rem;
  border: 1px solid var(--vvx-border);
  background: var(--vvx-card);
  padding: 2rem;
  box-shadow: var(--vvx-shadow-card);
}
.vvx-form-title { font-family: var(--vvx-font-display); font-size: 1.25rem; font-weight: 700; color: var(--vvx-primary); }
.vvx-form-sub   { margin-top: .25rem; font-size: .875rem; color: var(--vvx-muted-fg); }

.vvx-form-grid2 { display: grid; gap: 1.25rem; }
@media (min-width: 768px) { .vvx-form-grid2 { grid-template-columns: repeat(2, 1fr); } }

.vvx-field { display: flex; flex-direction: column; }
.vvx-field label { display: block; margin-bottom: .375rem; font-size: .875rem; font-weight: 500; color: var(--vvx-primary); }
.vvx-field input,
.vvx-field textarea,
.vvx-field select {
  width: 100%;
  border-radius: .5rem;
  border: 1px solid var(--vvx-input);
  background: var(--vvx-bg);
  padding: .75rem 1rem;
  font-size: .875rem;
  font-family: var(--vvx-font-sans);
  color: var(--vvx-fg);
  outline: none;
  transition: var(--vvx-transition);
}
.vvx-field input:focus,
.vvx-field textarea:focus,
.vvx-field select:focus {
  border-color: var(--vvx-accent);
  box-shadow: 0 0 0 3px rgba(201,168,76,.2);
}
.vvx-field-error { margin-top: .25rem; font-size: .75rem; color: var(--vvx-destructive); }

.vvx-form-success {
  display: flex;
  align-items: center;
  gap: .75rem;
  border: 1px solid rgba(201,168,76,.3);
  background: rgba(201,168,76,.1);
  border-radius: .5rem;
  padding: 1rem;
  font-size: .875rem;
  color: var(--vvx-primary);
  margin-bottom: 1.5rem;
}
.vvx-form-success svg { width: 20px; height: 20px; color: var(--vvx-accent); flex-shrink: 0; }

/* ============================================================
   PAGE: CONTACT — Info cards
   ============================================================ */
.vvx-contact-info-card {
  border-radius: 1rem;
  border: 1px solid var(--vvx-border);
  background: var(--vvx-card);
  padding: 1.5rem;
  box-shadow: var(--vvx-shadow-card);
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}
.vvx-contact-info-card h3 { font-family: var(--vvx-font-display); font-size: 1.125rem; font-weight: 600; color: var(--vvx-primary); }
.vvx-contact-info-card a,
.vvx-contact-info-card p { font-size: .875rem; color: var(--vvx-muted-fg); }
.vvx-contact-info-card a:hover { color: var(--vvx-accent); }

/* ============================================================
   PAGE: ABOUT — Mini stats
   ============================================================ */
.vvx-mini-stats { margin-top: 2rem; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.vvx-mini-stat { border-radius: .75rem; border: 1px solid var(--vvx-border); background: var(--vvx-card); padding: 1.25rem; text-align: center; }
.vvx-mini-stat-num { font-family: var(--vvx-font-display); font-size: 1.875rem; font-weight: 700; }
.vvx-mini-stat-lbl { margin-top: .25rem; font-size: .75rem; text-transform: uppercase; letter-spacing: .1em; color: var(--vvx-muted-fg); }

/* ============================================================
   PAGE: DEMANDE — Contact sidebar
   ============================================================ */
.vvx-demande-grid { display: grid; gap: 2.5rem; }
@media (min-width: 1024px) { .vvx-demande-grid { grid-template-columns: 3fr 2fr; } }
.vvx-contact-grid { display: grid; gap: 2.5rem; }
@media (min-width: 1024px) { .vvx-contact-grid { grid-template-columns: 2fr 3fr; } }

/* ============================================================
   ABOUT CTA
   ============================================================ */
.vvx-about-cta { max-width: 56rem; margin-inline: auto; text-align: center; padding: 6rem 0; }
.vvx-about-cta svg { width: 48px; height: 48px; color: var(--vvx-accent); margin-inline: auto; }
.vvx-about-cta h2 { margin-top: 1rem; font-family: var(--vvx-font-display); font-size: clamp(1.75rem,3vw,2.5rem); font-weight: 700; color: var(--vvx-primary); }
.vvx-about-cta p { margin-top: 1rem; color: var(--vvx-muted-fg); }

/* ============================================================
   ELEMENTOR COMPATIBILITY
   ============================================================ */
.elementor-section .elementor-container { max-width: 1280px; }
.elementor-page .vvx-hero,
.elementor-page .vvx-page-hero { margin-top: 0; }
body.elementor-editor-active #vvx-header { position: relative; }

/* ============================================================
   WORDPRESS CORE CLASSES
   ============================================================ */
.alignnone  { margin: 0; }
.aligncenter { display: block; margin: 1rem auto; }
.alignleft  { float: left; margin: 0 1.5rem 1rem 0; }
.alignright { float: right; margin: 0 0 1rem 1.5rem; }
.wp-caption { max-width: 100%; }
.screen-reader-text { clip: rect(1px,1px,1px,1px); position: absolute; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 767px) {
  .vvx-section, .vvx-page-hero { padding: 4rem 0; }
  .vvx-hero-content { min-height: 520px; padding: 4rem 0; }
  .vvx-cta-strip { padding: 3.5rem 0; }
  .vvx-sim-card { padding: 1.5rem; }
  .vvx-form-card { padding: 1.5rem; }
}