:root{
  --eco-green:#16a34a;
  --eco-green-dark:#052e16;
  --eco-lime:#84cc16;
  --eco-blue:#0f172a;
  --eco-soft:#f0fdf4;
  --eco-border:rgba(22,163,74,.18);
  --eco-shadow:0 18px 45px rgba(15,23,42,.12);
}

html{
  scroll-behavior:smooth;
}

body{
  background:
    radial-gradient(circle at top left, rgba(132,204,22,.12), transparent 32%),
    linear-gradient(180deg,#ffffff 0%,#f8fafc 45%,#f0fdf4 100%) !important;
  color:#0f172a;
}

a,button,input,select,textarea{
  transition:all .22s ease;
}

.eco-ux-hero,
.hero,
.section:first-of-type{
  position:relative;
}

.eco-ux-card,
.card,
.result-card,
.sim-card,
.rdv-card,
.slot-card,
form{
  border-radius:24px !important;
  box-shadow:var(--eco-shadow) !important;
  border:1px solid var(--eco-border) !important;
}

.eco-ux-glow{
  position:absolute;
  inset:auto 4% -80px auto;
  width:280px;
  height:280px;
  background:radial-gradient(circle, rgba(132,204,22,.28), transparent 68%);
  pointer-events:none;
  z-index:0;
}

.eco-ux-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 13px;
  border-radius:999px;
  background:#ecfccb;
  color:#365314;
  font-weight:800;
  font-size:13px;
  border:1px solid rgba(132,204,22,.35);
  margin-bottom:14px;
}

.eco-ux-trustbar{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:14px 0 0;
}

.eco-ux-trustbar span{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 12px;
  border-radius:999px;
  background:white;
  border:1px solid rgba(15,23,42,.08);
  color:#14532d;
  font-weight:700;
  font-size:13px;
  box-shadow:0 8px 20px rgba(15,23,42,.06);
}

.eco-ux-primary,
.cta,
.btn-main,
button[type="submit"],
input[type="submit"]{
  background:linear-gradient(135deg,#16a34a,#84cc16) !important;
  color:white !important;
  border:none !important;
  border-radius:16px !important;
  font-weight:900 !important;
  box-shadow:0 14px 30px rgba(22,163,74,.28) !important;
}

.eco-ux-primary:hover,
.cta:hover,
.btn-main:hover,
button[type="submit"]:hover,
input[type="submit"]:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 42px rgba(22,163,74,.35) !important;
  filter:saturate(1.08);
}

.eco-ux-secondary,
.btn-secondary{
  border-radius:16px !important;
  border:1px solid rgba(22,163,74,.22) !important;
  background:#fff !important;
  color:#14532d !important;
  font-weight:800 !important;
}

.eco-ux-result-focus{
  padding:22px;
  border-radius:24px;
  background:linear-gradient(180deg,#ffffff,#f0fdf4);
  border:1px solid rgba(22,163,74,.18);
  box-shadow:var(--eco-shadow);
  margin:18px 0;
}

.eco-ux-result-focus h2{
  margin:0 0 8px;
  font-size:clamp(24px,4vw,40px);
  line-height:1.05;
  color:#052e16;
}

.eco-ux-kpis{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin:18px 0;
}

.eco-ux-kpi{
  padding:15px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
}

.eco-ux-kpi strong{
  display:block;
  color:#052e16;
  font-size:20px;
}

.eco-ux-kpi span{
  color:#475569;
  font-size:13px;
}

.eco-ux-progress{
  position:sticky;
  top:0;
  z-index:50;
  height:6px;
  background:rgba(15,23,42,.08);
}

.eco-ux-progress span{
  display:block;
  width:0%;
  height:100%;
  background:linear-gradient(90deg,#16a34a,#84cc16);
  transition:width .2s ease;
}

.eco-ux-sticky-mobile{
  display:none;
}

.eco-ux-reveal{
  opacity:0;
  transform:translateY(18px);
}

.eco-ux-reveal.is-visible{
  opacity:1;
  transform:translateY(0);
  transition:opacity .55s ease, transform .55s ease;
}

input,select,textarea{
  border-radius:14px !important;
  border:1px solid rgba(15,23,42,.14) !important;
  padding:13px 14px !important;
}

input:focus,select:focus,textarea:focus{
  outline:none !important;
  border-color:#16a34a !important;
  box-shadow:0 0 0 4px rgba(22,163,74,.14) !important;
}

.eco-ux-slot-highlight{
  outline:3px solid rgba(132,204,22,.35);
  background:#f7fee7 !important;
}

@media(max-width:768px){
  body{
    padding-bottom:92px;
  }

  h1{
    font-size:clamp(30px,9vw,44px) !important;
    line-height:1.02 !important;
  }

  .eco-ux-kpis{
    grid-template-columns:1fr;
  }

  .eco-ux-sticky-mobile{
    position:fixed;
    left:12px;
    right:12px;
    bottom:12px;
    z-index:9999;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:58px;
    padding:14px 18px;
    border-radius:20px;
    background:linear-gradient(135deg,#16a34a,#84cc16);
    color:#fff !important;
    text-decoration:none !important;
    font-weight:950;
    box-shadow:0 20px 50px rgba(22,163,74,.42);
  }

  .eco-ux-trustbar{
    gap:7px;
  }

  .eco-ux-trustbar span{
    font-size:12px;
    padding:7px 10px;
  }

  .card,
  .result-card,
  .sim-card,
  .rdv-card,
  form{
    border-radius:20px !important;
  }
}
