:root {
  --qst-header: 0px;
  --qst-surface: #ffffff;
  --qst-text-muted: #334155;
  --qst-shadow: 0 32px 64px rgba(15,23,42,.16);
  --qst-radius: 26px;
  --qst-hero-from: rgba(59,130,246,.85);
  --qst-hero-to: rgba(14,165,233,.78);
}
.questionnaire-page{
  background:#f8fafc;
  color:#0f172a;
}

.questionnaire{
  background:#f8fafc;
  color:#0f172a;
}


/* ===== HERO ===== */
.questionnaire-hero {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: clamp(280px, 45vh, 420px);
  padding: clamp(48px, 8vh, 80px) 4vw;
  overflow: hidden;
  isolation: isolate;
}

.questionnaire-hero__bg {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(15,23,42,.22), rgba(15,23,42,.48)),
    linear-gradient(135deg, var(--qst-hero-from), var(--qst-hero-to)),
    url("https://images.unsplash.com/photo-1521295121783-8a321d551ad2?q=80&w=2400&auto=format&fit=crop") center/cover no-repeat;
  filter: saturate(112%);
  z-index: -1;
  transform: translate3d(0,0,0);
  transition: transform .35s ease-out;
}

.questionnaire-hero__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.12) 2px, transparent 2px, transparent 12px);
  opacity: .22;
}

.questionnaire-hero__inner {
  display: grid;
  gap: .75rem;
  max-width: 780px;
  justify-items: center;
}

.questionnaire-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .5rem 1.1rem;
  border-radius: 999px;
  font-weight: 800;
  letter-spacing: .02em;
  background: rgba(255,255,255,.78);
  color: #0f172a;
  border: 1px solid rgba(15,23,42,.12);
  box-shadow: 0 14px 32px rgba(15,23,42,.14);
}

.questionnaire-hero__title {
  margin: 0;
  font-size: clamp(1.9rem, 3.8vw, 2.9rem);
  font-weight: 900;
  letter-spacing: .02em;
  line-height: 1.1;
  color: #fdfcff;
  text-shadow: 0 26px 56px rgba(15,23,42,.30);
}

.questionnaire-hero__subtitle {
  margin: 0;
  font-size: clamp(1rem, 1.8vw, 1.2rem);
  max-width: 640px;
  color: rgba(248,250,255,.94);
}

/* Bouton scroll supprimé — héro compact, le formulaire est visible directement */

/* ===== CARD / IFRAME ===== */
.questionnaire .l-content {
  padding-top: clamp(24px, 3vw, 40px);
}

.questionnaire.main-wrap .l-content,
.questionnaire .l-content,
.questionnaire .l-wrapper,
.questionnaire .l-wrapper.in-post,
.questionnaire .l-post-content,
.questionnaire .pos-relative,
.questionnaire .js-post-content {
  max-width: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
}

.questionnaire-wrapper {
  width: 100%;
  max-width: min(1200px, 96vw);
  margin: clamp(40px, 6vw, 72px) auto clamp(64px, 6vw, 100px);
  display: grid;
  gap: 1.5rem;
  padding: 0 clamp(12px, 1.5vw, 24px);
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .6s ease, transform .6s ease;
}

.questionnaire.is-ready .questionnaire-wrapper { opacity: 1; transform: translateY(0); }

.questionnaire-frame {
  background: var(--qst-surface);
  border-radius: var(--qst-radius);
  padding: clamp(12px, 1.5vw, 20px);
  box-shadow: var(--qst-shadow);
  border: 1px solid rgba(15,23,42,.08);
}

.questionnaire-note {
  margin: 0;
  font-size: 1.07rem;
  color: var(--qst-text-muted);
  text-align: center;
  font-style: italic;
}

/* Appear animation */
.questionnaire-hero,
.questionnaire-wrapper { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; }
.questionnaire.is-ready .questionnaire-hero { opacity: 1; transform: translateY(0); }

/* ===== Responsive ===== */
@media (max-width: 1024px) {
  .questionnaire-wrapper { margin: clamp(32px, 8vw, 56px) auto 60px; padding: 0 clamp(16px,4vw,28px); }
}

.questionnaire-frame iframe {
  display: block;
  width: 100%;
  border: 0;
  border-radius: calc(var(--qst-radius) - 8px);
}

@media (max-width: 768px) {
  .questionnaire-hero { min-height: clamp(220px, 38vh, 320px); padding: calc(var(--qst-header) + 56px) 6vw 48px; }
  .questionnaire-frame { padding: 16px; border-radius: 20px; }
  .questionnaire-frame iframe { border-radius: 14px; }
}