/* badge.css — styles de la page */
.b-hero { padding: 100px 0 120px; text-align: center; position: relative; overflow: hidden; }
.b-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(50% 60% at 50% 30%, rgba(176,137,79,.22), transparent 70%); }
.b-hero .wrap { position: relative; }
    .b-hero h1 { max-width: 14ch; margin-inline: auto; }
.b-hero .lead { margin: 24px auto 40px; }
.compare { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line); background: var(--paper); }
.compare > div { padding: 48px 40px; }
.compare > div + div { border-left: 1px solid var(--line); background: var(--ink); color: var(--ivory); }
.compare h3 { margin: 12px 0 24px; }
.compare ul { list-style: none; margin: 0; padding: 0; }
.compare li { padding: 12px 0; border-top: 1px solid var(--line); font-size: .92rem; color: var(--muted); }
.compare > div + div li { border-color: var(--line-dark); color: #d8cfc1; }
.compare > div + div li::before { content: "✦"; color: var(--brass-2); margin-right: 12px; font-size: .7rem; }
@media (max-width: 800px) { .compare { grid-template-columns: 1fr; } .compare > div + div { border-left: 0; } .compare > div { padding: 36px 24px; } }
.preview { display: grid; gap: 0; border: 1px solid var(--line); background: var(--paper); margin-top: 16px; }
.preview .v-row { cursor: default; }
