/* Styles spécifiques à la landing « achat groupé ». Complète styles.css (CSP self). */

/* ---- Hero ---- */
.gb-hero { position: relative; min-height: 86svh; display: flex; align-items: center; overflow: hidden; color: #fff; background: #0d0d10; }
.gb-hero-bg { position: absolute; inset: -10%; z-index: 0; background-image: url("assets/img/gen-hero.jpg"); background-size: cover; background-position: center; }
.gb-hero-overlay { position: absolute; inset: 0; z-index: 1; background:
  linear-gradient(180deg, rgba(10,10,13,.55) 0%, rgba(10,10,13,.45) 40%, rgba(10,10,13,.8) 100%),
  radial-gradient(120% 90% at 75% 15%, transparent 40%, rgba(227,6,19,.18) 100%); }
.gb-hero-inner { position: relative; z-index: 2; padding: clamp(90px,13vh,150px) 22px clamp(60px,9vh,110px); }
.gb-hero-inner h1 { font-size: clamp(2.1rem, 5.4vw, 3.8rem); font-weight: 800; letter-spacing: -0.025em; margin: 0 0 .35em; text-shadow: 0 4px 36px rgba(0,0,0,.4); max-width: 880px; }
.gb-hero-inner .accent { color: #ff4b58; }
.gb-badge { display: inline-block; font-size: .76rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #fff; background: var(--red); padding: 6px 14px; border-radius: 999px; margin: 0 0 1.1em; }
.gb-lead { max-width: 620px; font-size: clamp(1.05rem,1.7vw,1.25rem); color: rgba(255,255,255,.93); margin: 0 0 1.4em; }

/* ---- Compteur ---- */
.gb-counter { max-width: 460px; margin: 0 0 1.6em; }
.gb-count-line { font-size: 1.05rem; color: rgba(255,255,255,.92); margin-bottom: 8px; }
.gb-count-line strong { font-size: 1.7rem; color: #fff; }
.gb-progress { height: 10px; border-radius: 999px; background: rgba(255,255,255,.2); overflow: hidden; }
.gb-progress span { display: block; height: 100%; width: 0%; border-radius: 999px; background: linear-gradient(90deg, #ff4b58, var(--red)); transition: width .8s cubic-bezier(.22,1,.36,1); }
.gb-deadline { margin-top: 9px; font-size: .92rem; font-weight: 700; color: #ffd2d5; }

.gb-cta-row { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 14px; }
.gb-reassure { font-size: .92rem; color: rgba(255,255,255,.85); margin: 0; }

/* ---- FAQ ---- */
.gb-faq { max-width: 760px; margin: 0 auto; display: grid; gap: 12px; }
.gb-faq details { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 4px 18px; box-shadow: var(--shadow-sm); }
.gb-faq summary { cursor: pointer; font-weight: 700; padding: 14px 0; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.gb-faq summary::-webkit-details-marker { display: none; }
.gb-faq summary::after { content: "+"; color: var(--red); font-size: 1.4rem; font-weight: 400; transition: transform .2s; }
.gb-faq details[open] summary::after { transform: rotate(45deg); }
.gb-faq details p { color: var(--ink-2); margin: 0 0 14px; }
