@charset "UTF-8";
/* ===== Reset ===== */
blockquote,body,dd,dl,figure,h1,h2,h3,h4,h5,h6,ol,p,ul{margin:0}*,::after,::before{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeLegibility}canvas,img,picture,svg,video{display:block;max-width:100%;height:auto}iframe{border:0}button,input,select,textarea{font:inherit}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;appearance:button}textarea{resize:vertical}a{color:inherit;text-decoration:none}ol,ul{padding:0}ol[role=list],ul[role=list]{list-style:none}table{border-collapse:collapse;border-spacing:0}[hidden]{display:none!important}/*!guillements*/q:before{content:open-quote}q:after{content:close-quote}*:lang(fr)>*{quotes:"\00AB\00A0" "\00A0\00BB"}*:lang(en)>*{quotes:"\201C" "\201D"}
/* ===== VARIABLES GLOBALES ===== */
:root{
    --sdv-gold:#c49847;
    --sdv-gold-dark:#c8930a;
    --sdv-ink:#ffffff;
    --sdv-muted:#ffffff;
    --sdv-border:rgba(255,255,255,.3);
    --sdv-bg:#ffffff;
    --sdv-bg-soft:#f9f9f9;
	--sdv-bg-dark:#000000;
	--sdv-txt-dark:#000000;
	--sdv-txt-light:#ffffff;
    --sdv-radius:14px;
    --sdv-shadow:0 4px 16px rgba(17,24,39,.06);
    --sdv-danger:#c0392b;
    --sdv-ok:#1a7f37;
  }

html{font-size:100%}
body{font-family: 'Space Grotesk', sans-serif, Arial, Helvetica, sans-serif;color:var(--sdv-ink);background:#000;padding-bottom:90px; /* laisse la place à la barre collante en bas */}
a{ color:inherit }

.sdv-layout{width:100%;margin:0 auto;display:grid;grid-template-columns:250px 1fr;gap:1rem;align-items:start;padding:0}
@media (max-width:900px){
   .sdv-layout{ grid-template-columns:1fr;padding:0}
}

/* ---------- Barre latérale ---------- */
.sdv-sidebar{position:sticky;top:0}
@media (max-width:900px){.sdv-sidebar{position:static}}

.sdv-sidebar-image{width:100%;max-width:100%;height:auto;margin-bottom:1rem}
.sdv-title{font-size:22px;line-height:1.25;margin:0 auto 1rem auto;text-align:center}
.sdv-title span{color: var(--sdv-gold)}
.sdv-intro{ margin:0 0 1rem;color:var(--sdv-muted);font-size:1rem;line-height:1.5}

.sdv-steps{ display:flex;align-items:center;gap:6px;margin-bottom:18px }
.sdv-step{width:28px;height:28px;border-radius:50%;border:2px solid var(--sdv-border);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--sdv-txt-dark);background:#fff;flex:none}
.sdv-step.is-active{ border-color:var(--sdv-gold);background:var(--sdv-gold);color:#111 }
.sdv-step.is-done{ border-color:var(--sdv-txt-light);color:var(--sdv-txt-dark) }
.sdv-step-line{ flex:1;height:2px;background:var(--sdv-border) }
.sdv-step-line.is-done{ background:var(--sdv-gold) }
.sdv-step-labels{ display:flex;justify-content:space-between;font-size:11px;color:var(--sdv-muted);margin:-12px 0 18px }

.sdv-note{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--sdv-border);border-radius:12px;padding:12px 14px;font-size:1rem;color:var(--sdv-muted);background:var(--sdv-bg-dark);margin-bottom:12px;line-height:1.4}
.sdv-note b{color:var(--sdv-ink)}
.sdv-note .svg-inline--fa{color: var(--sdv-gold)}

.sdv-ceremony{border:1px solid var(--sdv-border);border-radius:12px;padding:12px 14px;font-size:1rem;color:var(--sdv-muted);background:var(--sdv-bg-dark);margin-bottom:12px;line-height:1.4}
.sdv-ceremony h3{color:var(--sdv-gold)}

.sdv-link{margin:.825rem 0;position: relative}
.sdv-link a{display: block; border:1px solid var(--sdv-gold);border-radius:12px;padding:1rem;font-size:.9rem;color:var(--sdv-muted);background:var(--sdv-bg-dark);line-height:1.4;text-align: center;transition:background .15s ease}
.sdv-link a:hover{background:#765b2b}
.fa-mask{width:35px;height:35px;border-radius: 50%;background: var(--sdv-gold);display: flex;align-items: center;justify-content: center;position: absolute;right:-10px;top:-10px;z-index: 1;}
.fa-mask .svg-inline--fa{font-size:1.125rem;line-height:1;color:#fff;transform:rotate(10deg)}

.sdv-signature{width: 100%; padding: 0 2rem; margin-top:20px;font-size:12px; color:var(--sdv-muted); text-align: center}
.sdv-signature-logo{width:100px;height:auto;margin: 0 auto;margin-bottom:.325rem}

/* ---------- Zone principale ---------- */

.sdv-grid{ display:grid;grid-template-columns:repeat(auto-fill, minmax(200px,1fr));gap:1rem;align-items:start;}
@media (max-width: 768px) {
	.sdv-sidebar-image{display:none}
	.sdv-grid {grid-template-columns:1fr}
	.sdv-signature{margin-bottom:20px}
	.fa-mask{right:0px;top:-10px;}
}

.sdv-card{position:relative;border:1px solid var(--sdv-border);border-radius:var(--sdv-radius);background:#000;overflow:hidden;display:flex;flex-direction:column;transition:border-color .15s ease,background .15s ease}
.sdv-card.is-selected{ border-color:var(--sdv-gold)}
.sdv-card-photo{ height:150px;background-size:cover;background-position:center;background-color:var(--sdv-bg-soft) }
.sdv-card-ribbon{
  position:absolute;top:10px;left:10px;background:var(--sdv-gold);color:#111;
  font-size:11px;font-weight:700;padding:4px 9px;border-radius:999px;
  display:none;align-items:center;gap:4px;
}
.sdv-card.is-selected .sdv-card-ribbon{ display:inline-flex }
.sdv-card-body{ padding:2rem 1rem 1rem 1rem;display:flex;flex-direction:column;gap:4px;flex:1;position:relative}
.sdv-card-logo{ width:40px;height:40px;background:transparent;margin-bottom:2px;background-size:cover;background-position:center;position:absolute;top:0; left: 50%;
transform: translate(-50%, -50%);z-index: 2;
z-index: 1;}
.sdv-card-name{color: var(--sdv-gold);font-size:1.325rem;font-weight:700;margin: 0;padding:0;line-height:1;letter-spacing:-.030rem}
.sdv-card-company{font-size:1rem;font-weight:normal;margin:0;padding:0;line-height:1; letter-spacing:-.030rem}
.sdv-card-stand{display:inline;color:var(--sdv-txt-dark);background:var(--sdv-gold);padding:2px 10px; text-align: center; border-radius: 10px}
.sdv-card-desc{ margin:4px 0 6px;font-size:1rem;color:var(--sdv-muted);line-height:1.4;flex:1;letter-spacing:-.015rem}
.sdv-card-links{ display:flex;flex-wrap:wrap;gap:4px 12px;margin:.525rem 0}
.sdv-card-more, .sdv-card-website{ font-size:11.5px;font-weight:700;letter-spacing:.02em;text-decoration:none }
.sdv-card-more{ color:var(--sdv-ink) }
.sdv-card-website{ color:var(--sdv-muted) }
.sdv-card-more:hover, .sdv-card-website:hover{ text-decoration:underline }

@media (max-width: 768px) {
	.sdv-card-photo{height:300px}
}
@media (min-width: 1024px){
	.sdv-card:hover{background:rgba(255,255,255,.1)}
	.sdv-card-name{min-height:50px}
	.sdv-card-desc{min-height:200px}
}

.sdv-vote-btn{display:flex;align-items:center;gap:8px;width:100%;border:1px solid var(--sdv-border);border-radius:10px;background:var(--sdv-bg-dark);padding:9px 10px;font-size:12.5px;font-weight:600;color:var(--sdv-ink);cursor:pointer;transition:border-color .15s ease, background .15s ease}
.sdv-vote-btn:hover{ border-color:var(--sdv-gold-dark) }
.sdv-card.is-selected .sdv-vote-btn{ border-color:var(--sdv-gold);background:var(--sdv-bg-dark)}
.sdv-radio{ width:15px;height:15px;border-radius:50%;border:2px solid var(--sdv-border);flex:none;position:relative }
.sdv-card.is-selected .sdv-radio{ border-color:var(--sdv-gold) }
.sdv-card.is-selected .sdv-radio::after{content:'';position:absolute;inset:2px;border-radius:50%;background:var(--sdv-gold)}

/* ---------- Barre collante de validation ---------- */
.sdv-stickybar{
  position:fixed;left:0;right:0;bottom:0;z-index:40;
  background:var(--sdv-gold);border-top:1px solid var(--sdv-gold-dark);
  padding:12px 18px;display:none;align-items:center;gap:14px;justify-content:space-between;
  box-shadow:0 -4px 16px rgba(0,0,0,.08);
}
.sdv-stickybar.is-visible{ display:flex }
.sdv-stickybar-choice{ display:flex;align-items:center;gap:10px;font-size:13px;min-width:0 }
.sdv-stickybar-thumb{ width:34px;height:34px;border-radius:8px;background-size:cover;background-position:center;flex:none;background-color:rgba(0,0,0,.08) }
.sdv-stickybar-text{ overflow:hidden;text-overflow:ellipsis;white-space:nowrap }
.sdv-btn-validate{
  background:#111;color:#fff;border:0;border-radius:10px;padding:11px 18px;
  font-weight:700;font-size:13.5px;cursor:pointer;white-space:nowrap;flex:none;
}
.sdv-btn-validate:hover{ background:#000 }

/* ---------- Fenêtre de confirmation (étape 3) ---------- */
.sdv-overlay{
  /* align-items:flex-start (et non "center") : la page étant dans un
     iframe redimensionné à la hauteur du contenu, "centrer" se ferait
     par rapport à la hauteur TOTALE de la page, pas par rapport à ce
     que l'utilisateur voit réellement à l'écran. On ancre donc la
     fenêtre près du haut, et le JS (voir index.php, scrollModalIntoView)
     remonte la vraie page avant de l'afficher : combinés, les deux font
     que la fenêtre tombe toujours dans le champ de vision, y compris
     sur mobile après avoir scrollé jusqu'à la barre collante. */
  position:fixed;inset:0;background:rgba(17,24,39,.55);z-index:60;
  display:none;align-items:flex-start;justify-content:center;padding:16px;
  overflow-y:auto;
}
.sdv-overlay.is-visible{ display:flex }
.sdv-modal{background:#fff;border-radius:16px;max-width:420px;width:100%;margin-top:48px;padding:22px;box-shadow:0 20px 50px rgba(0,0,0,.25);color: var(--sdv-txt-dark)}
.sdv-modal h2{ font-size:17px;margin:0 0 4px }
.sdv-modal-recap{ display:flex;align-items:center;gap:10px;margin:14px 0;padding:10px;border:1px solid var(--sdv-border);border-radius:10px }
.sdv-modal-recap-thumb{ width:40px;height:40px;border-radius:8px;background-size:cover;background-position:center;flex:none;background-color:var(--sdv-bg-soft) }
.sdv-modal-p{ font-size:13px;color:var(--sdv-txt-dark);line-height:1.5;margin:0 0 18px }
.sdv-modal-actions{ display:flex;gap:10px;align-items:center;justify-content:space-between }
.sdv-link-back{ font-size:13px;color:var(--sdv-txt-dark);text-decoration:underline;background:none;border:0;cursor:pointer;padding:0 }
.sdv-msg{ font-size:13.5px;border-radius:10px;padding:10px 12px;margin-bottom:12px;display:none }
.sdv-msg.is-visible{ display:block }
.sdv-msg.is-error{ background:#fdecea;color:var(--sdv-danger) }
.sdv-msg.is-ok{ background:#eaf7ee;color:var(--sdv-ok) }
.sdv-success{ text-align:center;padding:10px 0 }
.sdv-success-icon{ font-size:38px;margin-bottom:6px }

.sdv-closed{
  max-width:1180px;margin:60px auto;padding:0 18px;text-align:center;color:var(--sdv-muted);
}
.sr-only{ position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0 }