@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=Inter:wght@400;500;600&display=swap');

/* ── Scroll offset — set to your sticky header height if needed ── */
:root { --amq-scroll-offset: 80px; }

/* ── Scoped variables ─────────────────────────────────────────── */
.amq-wrap {
  --amq-navy:      #122142;
  --amq-navy-soft: #2a3a63;
  --amq-gold:      #1e5fa8;
  --amq-gold-dark: #122142;
  --amq-gold-soft: #e8eef8;
  --amq-sand:      #f0f4fb;
  --amq-card:      #ffffff;
  --amq-text:      #1c2540;
  --amq-muted:     #7a7e8c;
  --amq-line:      #ece7df;
  --amq-ok:        #2f9e6f;
  --amq-shadow-sm: 0 2px 10px rgba(18,33,66,0.06);
  --amq-shadow:    0 10px 40px rgba(18,33,66,0.10);
  --amq-radius:    18px;
  --amq-radius-sm: 14px;
  --amq-ease:      0.38s cubic-bezier(0.22, 1, 0.36, 1);
}

/* ── Reset — neutralise les styles du thème WordPress ─────────── */
.amq-wrap, .amq-wrap * { box-sizing: border-box; }
.amq-wrap * {
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  color: inherit;
  text-decoration: none;
  text-transform: none;
  letter-spacing: normal;
}
.amq-wrap h1, .amq-wrap h2, .amq-wrap h3,
.amq-wrap p, .amq-wrap ul, .amq-wrap li,
.amq-wrap a, .amq-wrap button, .amq-wrap input,
.amq-wrap textarea, .amq-wrap select, .amq-wrap img {
  margin: 0; padding: 0; border: 0; outline: 0;
  vertical-align: baseline;
  background: transparent; list-style: none;
}
.amq-wrap button { cursor: pointer; }
.amq-wrap img { max-width: none; height: auto; display: block; }

/* ── Base ─────────────────────────────────────────────────────── */
.amq-wrap {
  width: 100%;
  font-family: 'Inter', -apple-system, sans-serif;
  color: var(--amq-text);
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
}
.amq-wrap h1, .amq-wrap h2, .amq-wrap h3,
.amq-wrap .q-title, .amq-wrap .btn, .amq-wrap .opt-label {
  font-family: 'Poppins', sans-serif;
}
.amq-wrap .amq-top, .amq-wrap .amq-card { max-width: 1300px; margin-left: auto; margin-right: auto; }

/* ── Progress bar ─────────────────────────────────────────────── */
.amq-wrap .amq-top { width: 100%; margin-bottom: 32px; }
.amq-wrap .progress-wrap { display: none; }
.amq-wrap .progress-wrap.show { display: block; }
.amq-wrap .progress-meta {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 0.78rem; font-weight: 600; letter-spacing: 0.05em;
  text-transform: uppercase; color: var(--amq-muted); margin-bottom: 10px;
}
.amq-wrap .progress-track { width: 100%; height: 5px; background: var(--amq-line); border-radius: 99px; overflow: hidden; }
.amq-wrap .progress-fill {
  height: 100%; width: 0%;
  background: linear-gradient(90deg, var(--amq-gold), var(--amq-gold-dark));
  border-radius: 99px; transition: width var(--amq-ease);
}

/* ── Card ─────────────────────────────────────────────────────── */
.amq-wrap .amq-card { width: 100%; }

/* ── Step transitions ─────────────────────────────────────────── */
.amq-wrap .step { display: none; }
.amq-wrap .step.active { display: block; }
@keyframes amq-slideRight { from { opacity:0; transform:translateX(36px); } to { opacity:1; transform:translateX(0); } }
@keyframes amq-slideLeft  { from { opacity:0; transform:translateX(-36px); } to { opacity:1; transform:translateX(0); } }
@keyframes amq-fadeUp     { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
.amq-wrap .step.active.dir-forward { animation: amq-slideRight 0.36s cubic-bezier(0.22,1,0.36,1) both; }
.amq-wrap .step.active.dir-back    { animation: amq-slideLeft  0.36s cubic-bezier(0.22,1,0.36,1) both; }
.amq-wrap .step.active.dir-none    { animation: amq-fadeUp     0.28s ease both; }

/* ── Step header ──────────────────────────────────────────────── */
.amq-wrap .step-lead { margin-bottom: 28px; text-align: center; }
.amq-wrap .step-lead h1 { font-size: 1.65rem; font-weight: 700; color: var(--amq-navy); letter-spacing: -0.02em; line-height: 1.22; margin-bottom: 6px; }
.amq-wrap .step-lead .lead-sub { color: var(--amq-muted); font-size: 0.96rem; line-height: 1.55; }
.amq-wrap .q-title { font-size: 1.5rem; font-weight: 600; color: var(--amq-navy); line-height: 1.25; letter-spacing: -0.01em; margin-bottom: 6px; text-align: center; }
.amq-wrap .q-sub   { color: var(--amq-muted); font-size: 0.93rem; margin-bottom: 26px; text-align: center; }

/* ── Options ──────────────────────────────────────────────────── */
.amq-wrap .options { display: flex; flex-direction: column; gap: 10px; max-width: 1300px; margin: 0 auto; }
.amq-wrap .options.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; max-width: 1300px; margin: 0 auto; }
.amq-wrap .options.grid4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; max-width: 1300px; margin: 0 auto; }
.amq-wrap .options.grid4 .opt { flex-direction: column; text-align: center; gap: 6px; padding: 20px 12px; }
.amq-wrap .options.grid4 .opt .opt-check { display: none; }

.amq-wrap .opt {
  display: flex; align-items: center; gap: 16px; width: 100%;
  text-align: left; padding: 17px 20px;
  border: 1.5px solid var(--amq-line); border-radius: var(--amq-radius-sm);
  background: var(--amq-card); cursor: pointer;
  transition: border-color var(--amq-ease), background var(--amq-ease), transform var(--amq-ease), box-shadow var(--amq-ease);
  font-family: inherit; color: var(--amq-text); position: relative;
}
.amq-wrap .opt:hover { border-color: var(--amq-gold); background: #f0f4fb; transform: translateY(-2px); box-shadow: var(--amq-shadow-sm); }
@keyframes amq-selectRing {
  0%   { box-shadow: 0 0 0 3px rgba(18,33,66,0.15); }
  55%  { box-shadow: 0 0 0 8px rgba(18,33,66,0.18); }
  100% { box-shadow: 0 0 0 3px rgba(18,33,66,0.12); }
}
.amq-wrap .opt.selected {
  border-color: var(--amq-gold); background: linear-gradient(135deg,#f0f4fb,var(--amq-gold-soft));
  box-shadow: 0 0 0 3px rgba(18,33,66,0.12); animation: amq-selectRing .42s ease-out;
}
.amq-wrap .opt .opt-ic { flex-shrink:0; width:46px; height:46px; border-radius:50%; background:var(--amq-sand); display:flex; align-items:center; justify-content:center; font-size:1.4rem; transition:var(--amq-ease); }
.amq-wrap .opt.selected .opt-ic { background:#fff; }
.amq-wrap .opt .opt-text { flex:1; }
.amq-wrap .opt .opt-label { display:block; font-size:1rem; font-weight:600; color:var(--amq-navy); }
.amq-wrap .opt .opt-hint  { display:block; font-size:0.82rem; color:var(--amq-muted); margin-top:2px; }
.amq-wrap .opt .opt-check { flex-shrink:0; width:22px; height:22px; border-radius:50%; border:2px solid var(--amq-line); display:flex; align-items:center; justify-content:center; transition:var(--amq-ease); }
.amq-wrap .opt.selected .opt-check { border-color:var(--amq-gold-dark); background:var(--amq-gold-dark); }
.amq-wrap .opt .opt-check::after { content:'✓'; color:#fff; font-size:0.75rem; font-weight:700; opacity:0; transition:var(--amq-ease); }
.amq-wrap .opt.selected .opt-check::after { opacity:1; }

.amq-wrap .options[data-multi] .opt .opt-check { border-radius:6px; }
.amq-wrap .options.grid2-rich { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.amq-wrap .opt.no-ic { padding: 16px 20px; }
.amq-wrap .opt.no-ic .opt-text { padding-left:2px; }
.amq-wrap .options.grid2 .opt { flex-direction:column; text-align:center; gap:8px; padding:20px 12px; }
.amq-wrap .options.grid2 .opt .opt-check { display:none; }
.amq-wrap .options.grid2 .opt .opt-label { font-size:0.94rem; }

/* ── Visual cards ─────────────────────────────────────────────── */
.amq-wrap .options.visual {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 280px));
  gap: 14px; max-width: 1300px; margin: 0 auto; justify-content: center;
}
.amq-wrap .options.visual .opt { flex-direction:column; align-items:stretch; padding:0; gap:0; overflow:hidden; }
.amq-wrap .options.visual .opt .opt-img { width:100%; aspect-ratio:4/3; object-fit:cover; background:var(--amq-sand); display:block; transition:transform var(--amq-ease); }
.amq-wrap .options.visual .opt:hover .opt-img { transform:scale(1.04); }
.amq-wrap .options.visual .opt.selected .opt-img { transform:none; }
.amq-wrap .options.visual .opt .opt-cap { display:flex; flex-direction:column; align-items:center; gap:2px; padding:14px 12px 16px; }
.amq-wrap .options.visual .opt .opt-cap .opt-label { font-size:1rem; font-weight:600; color:var(--amq-navy); font-family:'Poppins',sans-serif; }
.amq-wrap .options.visual .opt .opt-cap .opt-hint { font-size:0.8rem; color:var(--amq-muted); text-align:center; }
.amq-wrap .options.visual[data-multi] .opt.selected::after {
  content:'✓'; position:absolute; top:8px; right:8px;
  width:26px; height:26px; background:var(--amq-gold-dark); color:#fff;
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:0.72rem; font-weight:800; font-family:'Poppins',sans-serif;
  box-shadow:0 2px 6px rgba(0,0,0,0.18);
}

/* ── Budget slider ────────────────────────────────────────────── */
.amq-wrap .budget-step { padding: 8px 0 6px; max-width: 700px; margin: 0 auto; }
.amq-wrap .budget-display { font-size: 1.6rem; font-weight: 700; color: var(--amq-navy); font-family: 'Poppins', sans-serif; margin-bottom: 28px; text-align: center; }
.amq-wrap .range-wrap { position: relative; padding: 12px 0 32px; }
.amq-wrap .range-track { position: absolute; top: 50%; transform: translateY(-50%); width: 100%; height: 6px; background: var(--amq-line); border-radius: 99px; }
.amq-wrap .range-fill { position: absolute; height: 6px; background: linear-gradient(90deg,var(--amq-gold),var(--amq-gold-dark)); border-radius: 99px; pointer-events: none; top: 50%; transform: translateY(-50%); }
.amq-wrap .range-input { position: absolute; width: 100%; pointer-events: none; -webkit-appearance: none; background: transparent; height: 6px; top: 50%; transform: translateY(-50%); outline: none; }
.amq-wrap .range-input::-webkit-slider-thumb { -webkit-appearance: none; pointer-events: all; cursor: pointer; width: 24px; height: 24px; border-radius: 50%; background: #fff; border: 3px solid var(--amq-gold-dark); box-shadow: 0 2px 8px rgba(18,33,66,0.18); transition: transform .15s ease, box-shadow .15s ease; }
.amq-wrap .range-input::-webkit-slider-thumb:hover { transform: scale(1.15); box-shadow: 0 4px 14px rgba(18,33,66,0.24); }
.amq-wrap .range-input::-moz-range-thumb { pointer-events: all; cursor: pointer; width: 24px; height: 24px; border-radius: 50%; background: #fff; border: 3px solid var(--amq-gold-dark); box-shadow: 0 2px 8px rgba(18,33,66,0.18); }
.amq-wrap .range-labels { display: flex; justify-content: space-between; margin-top: 34px; font-size: 0.78rem; color: var(--amq-muted); font-weight: 500; }

/* ── Buttons ──────────────────────────────────────────────────── */
.amq-wrap .continue-row { margin-top: 28px; text-align: center; }
.amq-wrap .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 36px; border: none; border-radius: 99px; font-size: 1rem; font-weight: 600; cursor: pointer; transition: var(--amq-ease); font-family: 'Poppins', sans-serif; text-decoration: none; }
.amq-wrap .btn-primary { background: var(--amq-navy); color: #fff; }
.amq-wrap .btn-primary:hover { background: var(--amq-navy-soft); transform: translateY(-2px); box-shadow: 0 10px 26px rgba(18,33,66,0.25); }
.amq-wrap .btn-gold { background: linear-gradient(135deg, var(--amq-gold), var(--amq-gold-dark)); color: #fff; box-shadow: 0 6px 18px rgba(18,33,66,0.2); }
.amq-wrap .btn-gold:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(18,33,66,0.3); }
.amq-wrap .btn-ghost { background: transparent; color: var(--amq-muted); border: 1.5px solid var(--amq-line); }
.amq-wrap .btn-ghost:hover { border-color: var(--amq-gold); color: var(--amq-navy); }

/* ── Back nav ─────────────────────────────────────────────────── */
.amq-wrap .nav-row { display: flex; align-items: center; margin-top: 28px; }
.amq-wrap .back-link { display: inline-flex; align-items: center; gap: 6px; background: none; border: none; color: var(--amq-muted); font-size: 0.9rem; font-weight: 500; cursor: pointer; font-family: 'Inter', sans-serif; padding: 8px 2px; transition: var(--amq-ease); }
.amq-wrap .back-link:hover { color: var(--amq-navy); }

/* ── Results ──────────────────────────────────────────────────── */
.amq-wrap .result-head { margin-bottom: 8px; text-align: center; }
.amq-wrap .result-head .badge-pill { display: inline-block; background: var(--amq-gold-soft); color: var(--amq-gold-dark); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 6px 14px; border-radius: 99px; margin-bottom: 14px; }
.amq-wrap .result-head h2 { font-size: 1.7rem; font-weight: 700; color: var(--amq-navy); letter-spacing: -0.02em; margin-bottom: 6px; }
.amq-wrap .result-head .result-sub { color: var(--amq-muted); font-size: 0.94rem; line-height: 1.55; margin: 0 auto 24px; }
.amq-wrap .results-grid { display: flex; flex-direction: column; gap: 14px; max-width: 700px; margin: 50px auto 0; }

@keyframes amq-cardReveal { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
@keyframes amq-fadeInDown { from { opacity:0; transform:translateY(-16px); } to { opacity:1; transform:translateY(0); } }
@keyframes amq-fadeInUp   { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
@keyframes amq-chipPop    { 0% { opacity:0; transform:scale(0.7); } 70% { transform:scale(1.08); } 100% { opacity:1; transform:scale(1); } }

.amq-wrap .result-head              { animation: amq-fadeInDown .5s cubic-bezier(0.22,1,0.36,1) both; }
.amq-wrap .result-head .badge-pill  { animation: amq-fadeInDown .45s cubic-bezier(0.22,1,0.36,1) .05s both; }
.amq-wrap .result-head h2           { animation: amq-fadeInDown .45s cubic-bezier(0.22,1,0.36,1) .1s both; }
.amq-wrap .result-head .result-sub  { animation: amq-fadeInDown .45s cubic-bezier(0.22,1,0.36,1) .15s both; }
.amq-wrap .summary-chips .chip      { animation: amq-chipPop .35s cubic-bezier(0.22,1,0.36,1) both; }
.amq-wrap .result-item              { animation: amq-cardReveal .5s cubic-bezier(0.22,1,0.36,1) both; }
.amq-wrap .result-footer            { animation: amq-fadeInUp .45s cubic-bezier(0.22,1,0.36,1) 600ms both; }

.amq-wrap .result-item { display: flex; align-items: center; gap: 20px; padding: 18px; border: 1.5px solid var(--amq-line); border-radius: var(--amq-radius-sm); text-decoration: none; color: inherit; transition: var(--amq-ease); background: var(--amq-card); position: relative; }
.amq-wrap .result-item.top { border-color: var(--amq-gold); background: linear-gradient(135deg,#f0f4fb,#fff); box-shadow: var(--amq-shadow-sm); }
.amq-wrap .result-item:hover { border-color: var(--amq-gold); box-shadow: var(--amq-shadow); transform: translateY(-3px); }
.amq-wrap .result-item .rank { position: absolute; top: -10px; left: 18px; background: var(--amq-navy); color: #fff; font-size: 0.66rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 4px 12px; border-radius: 99px; font-family: 'Poppins', sans-serif; }
.amq-wrap .result-item img { width: 88px; height: 88px; object-fit: contain; border-radius: 12px; background: var(--amq-sand); flex-shrink: 0; }
.amq-wrap .result-item .info { flex: 1; min-width: 0; }
.amq-wrap .result-item .info .badge-best { display: inline-block; background: var(--amq-gold-soft); color: var(--amq-gold-dark); font-size: 0.64rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; padding: 3px 9px; border-radius: 99px; margin-bottom: 5px; font-family: 'Poppins', sans-serif; }
.amq-wrap .result-item .info .name-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 3px; }
.amq-wrap .result-item .info h3 { font-size: 1.06rem !important; font-weight: 600 !important; color: var(--amq-navy) !important; }
.amq-wrap .match-badge { display: inline-block; font-size: 0.68rem; font-weight: 700; font-family: 'Poppins', sans-serif; padding: 2px 8px; border-radius: 99px; letter-spacing: 0.02em; white-space: nowrap; flex-shrink: 0; }
.amq-wrap .match-badge.high { background: rgba(47,158,111,0.11); color: var(--amq-ok); }
.amq-wrap .match-badge.mid  { background: var(--amq-gold-soft); color: var(--amq-gold-dark); }
.amq-wrap .match-badge.low  { background: #f0f0f0; color: var(--amq-muted); }
.amq-wrap .result-item .info .desc     { font-size: 0.82rem; color: var(--amq-muted); line-height: 1.45; }
.amq-wrap .result-item .info .why-text { font-size: 0.76rem; font-weight: 600; color: var(--amq-ok); margin-top: 5px; }
.amq-wrap .result-item .info .price    { font-size: 1.1rem; font-weight: 700; color: var(--amq-gold-dark); margin-top: 7px; font-family: 'Poppins', sans-serif; }
.amq-wrap .result-item .info .price small { font-size: 0.7rem; font-weight: 400; color: var(--amq-muted); }
.amq-wrap .result-item .info .price small.from { font-size: 0.72rem; font-weight: 600; color: var(--amq-muted); text-transform: uppercase; letter-spacing: .03em; }
.amq-wrap .go { flex-shrink: 0; color: var(--amq-gold-dark); font-size: 1.3rem; transition: var(--amq-ease); }
.amq-wrap .result-item:hover .go { transform: translateX(4px); }
.amq-wrap .go-cta { display: inline-flex; align-items: center; gap: 5px; background: linear-gradient(135deg,var(--amq-gold),var(--amq-gold-dark)); color: #fff; font-size: 0.78rem; font-weight: 700; font-family: 'Poppins', sans-serif; padding: 10px 16px; border-radius: 99px; white-space: nowrap; flex-shrink: 0; box-shadow: 0 4px 12px rgba(18,33,66,0.18); transition: var(--amq-ease); }
.amq-wrap .result-item:hover .go-cta { transform: translateX(2px); box-shadow: 0 6px 18px rgba(18,33,66,0.28); }
.amq-wrap .result-footer { margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--amq-line); display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; }
.amq-wrap .result-footer p { color: var(--amq-muted); font-size: 0.88rem; }
.amq-wrap .result-footer .footer-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.amq-wrap .summary-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 22px; justify-content: center; }
.amq-wrap .summary-chips .chip { background: var(--amq-sand); color: var(--amq-navy); font-size: 0.76rem; font-weight: 500; padding: 5px 13px; border-radius: 99px; }

/* Matelas dimensions (real catalogue, ~9 options): 3 columns read better than 4 */
.amq-wrap .options.grid4[data-question="taille"] { grid-template-columns: repeat(3, 1fr); max-width: 980px; }

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 600px) {
  .amq-wrap .options.grid4 { grid-template-columns: 1fr 1fr; }
  .amq-wrap .options.grid4[data-question="taille"] { grid-template-columns: 1fr 1fr; }
  .amq-wrap .options.grid4 .opt:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .amq-wrap .options.grid2-rich { grid-template-columns: 1fr; }
  .amq-wrap .q-title { font-size: 1.22rem; }
  .amq-wrap .step-lead h1 { font-size: 1.3rem; }
  .amq-wrap .opt { padding: 14px 16px; gap: 12px; }
  .amq-wrap .opt .opt-ic { width: 40px; height: 40px; font-size: 1.2rem; }
  .amq-wrap .options.visual { grid-template-columns: 1fr 1fr; }
  .amq-wrap .result-item { flex-direction: column; text-align: center; gap: 12px; }
  .amq-wrap .result-item .info .name-row { justify-content: center; }
  .amq-wrap .result-item img { width: 100px; height: 100px; }
  .amq-wrap .go { display: none; }
  .amq-wrap .go-cta { align-self: center; }
  .amq-wrap .result-item .rank { left: 50%; transform: translateX(-50%); }
  .amq-wrap .btn { width: 100%; }
  .amq-wrap .result-footer .footer-btns { flex-direction: column; width: 100%; }
}

/* v1.1.3 — product suggested slightly above the visitor's budget */
.amq-wrap .result-item .price small.near-budget { color: #b26a00 !important; font-weight: 600; }