.elementor-123 .elementor-element.elementor-element-8c7dd35{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}/* Start custom CSS for container, class: .elementor-element-8c7dd35 *//* ==================================================
   CVIZUEL – DESIGN SYSTEM GLOBAL
   ================================================== */

:root{
  --cvizuel-bg:#050005;
  --cvizuel-text:#f2f2f2;
  --cvizuel-muted:#b5b5b5;
  --cvizuel-accent:#ff2a7a;
  --cvizuel-accent-soft:#ff7ac8;
  --cvizuel-accent-light:#ff8fd4;
  --cvizuel-card-dark:rgba(15,0,10,0.85);
  --cvizuel-card-darker:rgba(5,0,5,0.92);
}


/* ==================================================
   HERO CVIZUEL
   ================================================== */

.cvizuel-hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--cvizuel-bg);
  overflow:hidden;
}

/* Fond cinématique */

.cvizuel-hero-bg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,0,90,0.25), transparent 40%),
    radial-gradient(circle at 80% 80%, rgba(255,140,200,0.18), transparent 45%);
  animation:cvizuelMist 20s ease-in-out infinite alternate;
  z-index:1;
}

@keyframes cvizuelMist{
  from{opacity:.6;}
  to{opacity:1;}
}

/* Contenu */

.cvizuel-hero-content{
  position:relative;
  z-index:2;
  max-width:900px;
  padding:40px 40px 20px;
  text-align:center;
}

.cvizuel-hero h1{
  font-size:clamp(2.4rem,5vw,4rem);
  font-weight:600;
  color:var(--cvizuel-text);
  margin-bottom:20px;
  line-height:1.2;
}

.cvizuel-hero h1 span{
  display:block;
  background:linear-gradient(90deg,var(--cvizuel-accent),var(--cvizuel-accent-light));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

.cvizuel-hero p{
  font-size:1.1rem;
  color:var(--cvizuel-muted);
  max-width:680px;
  margin:0 auto 40px;
  line-height:1.6;
}

.cvizuel-hero-actions{
  display:flex;
  gap:20px;
  justify-content:center;
  flex-wrap:wrap;
}


/* ==================================================
   BOUTONS CVIZUEL
   ================================================== */

.btn-primary,
.btn-secondary{
  padding:14px 34px;
  border-radius:50px;
  font-size:.95rem;
  font-weight:600;
  text-decoration:none;
  transition:all .25s ease;
}

.btn-primary{
  background:linear-gradient(135deg,var(--cvizuel-accent),var(--cvizuel-accent-soft));
  color:#120008;
  box-shadow:0 10px 30px rgba(255,0,90,.4);
}

.btn-primary:hover{
  transform:translateY(-2px);
  box-shadow:0 15px 40px rgba(255,0,90,.6);
}

.btn-secondary{
  background:transparent;
  color:var(--cvizuel-text);
  border:1px solid rgba(255,140,200,.4);
}

.btn-secondary:hover{
  background:rgba(255,140,200,.08);
}


/* ==================================================
   CARTES OFFRES CVIZUEL
   ================================================== */

.cvizuel-offers{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:30px;
  max-width:1200px;
  margin:0 auto;
  padding:80px 20px;
}

/* Carte */

.offer-card{
  position:relative;
  background:linear-gradient(
    145deg,
    var(--cvizuel-card-dark),
    var(--cvizuel-card-darker)
  );
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  border-radius:20px;
  padding:40px 30px;
  box-shadow:
    0 30px 80px rgba(0,0,0,.6),
    inset 0 0 40px rgba(255,0,90,.08);
  transition:transform .4s ease,box-shadow .4s ease;
}

.offer-card:hover{
  transform:translateY(-10px);
  box-shadow:
    0 40px 100px rgba(255,0,90,.35),
    inset 0 0 40px rgba(255,0,90,.1);
}

.offer-card h3{
  font-size:1.6rem;
  margin-bottom:8px;
  color:var(--cvizuel-text);
}

.offer-subtitle{
  font-size:.95rem;
  color:var(--cvizuel-muted);
  margin-bottom:25px;
}

.offer-card ul{
  list-style:none;
  padding:0;
  margin:0 0 30px;
}

.offer-card ul li{
  position:relative;
  padding-left:22px;
  margin-bottom:12px;
  font-size:.95rem;
  color:#d0d0d0;
}

.offer-card ul li::before{
  content:"•";
  position:absolute;
  left:0;
  color:var(--cvizuel-accent);
}

.offer-price{
  font-size:1.2rem;
  font-weight:600;
  margin-bottom:25px;
  background:linear-gradient(90deg,var(--cvizuel-accent),var(--cvizuel-accent-light));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* Carte mise en avant */

.offer-card.featured{
  border:1px solid rgba(255,140,200,.35);
  box-shadow:
    0 40px 120px rgba(255,0,90,.45),
    inset 0 0 50px rgba(255,0,90,.15);
}

.badge{
  position:absolute;
  top:-12px;
  right:20px;
  padding:6px 14px;
  border-radius:30px;
  font-size:.75rem;
  font-weight:600;
  background:linear-gradient(135deg,var(--cvizuel-accent),var(--cvizuel-accent-soft));
  color:#120008;
}


/* ==================================================
   OFFRES DANS HERO
   ================================================== */

.cvizuel-hero .cvizuel-offers{
  background:transparent;
  margin-top:40px;
  padding-top:60px;
  padding-bottom:40px;
}


/* ==================================================
   RESPONSIVE
   ================================================== */

@media(max-width:768px){

  .cvizuel-hero-content{
    padding:30px 20px 10px;
  }

  .cvizuel-offers{
    padding:60px 15px;
  }

  .cvizuel-hero .cvizuel-offers{
    padding-top:40px;
  }

}/* End custom CSS */