/*
 * L’aube dans les vignes — habillage des pages conservées.
 * Charger ce fichier à la racine du site, après les feuilles et blocs <style>
 * existants, et ajouter vignes-legacy au body. Aucun changement de contenu,
 * de logique de formulaire, de géométrie des comparateurs ou d'état du dialog.
 * Le fichier de titre fourni est de graisse 700 (maquette Figma : 800).
 */
@font-face {
  font-family: "Bricolage Grotesque";
  src: url("assets/fonts/BricolageGrotesque-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Manrope";
  src: url("assets/fonts/manrope.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("assets/fonts/IBMPlexMono-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

body.vignes-legacy {
  --vignes-paper: #ddd8cd;
  --vignes-ink: #2b2d2f;
  --vignes-accent: #822941;
  --vignes-green: #3f4e34;
  --vignes-gold: #c29b68;
  --vignes-line: #aaa697;
  --paper: var(--vignes-paper);
  --white: var(--vignes-paper);
  --ink: var(--vignes-ink);
  --muted: var(--vignes-green);
  --accent: var(--vignes-accent);
  --line: var(--vignes-line);
  --light: #d1ccbf;
  --papier: var(--paper);
  --papier-2: var(--light);
  --carte: var(--white);
  --encre: var(--ink);
  --encre-2: var(--ink);
  --gris: var(--muted);
  --or: var(--vignes-gold);
  --or-fonce: var(--vignes-accent);
  --or-texte: var(--vignes-accent);
  --trait: var(--line);
  --serif: "Bricolage Grotesque", Arial, sans-serif;
  --sans: "Manrope", Arial, sans-serif;
  --mono: "IBM Plex Mono", monospace;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 1.0625rem;
  line-height: 1.75;
}

body.vignes-legacy::selection,
body.vignes-legacy ::selection {
  color: var(--paper);
  background: var(--accent);
}
body.vignes-legacy :is(h1, h2, h3, .brand-name, .marque span, .footer-wordmark) {
  font-family: var(--serif);
  font-weight: 700;
  letter-spacing: -.035em;
}
body.vignes-legacy :is(h1, h2, h3, h4) {
  overflow-wrap: anywhere;
}
body.vignes-legacy :is(.eyebrow, .sur-titre, .bp-eyebrow, .mono) {
  font-family: var(--mono);
  font-weight: 400;
  font-size: .8125rem;
  line-height: 1.6;
  letter-spacing: .05em;
}
body.vignes-legacy :is(.page-hero, .legal-main) h1,
body.vignes-legacy.gp-inner main h1 {
  font-size: clamp(2rem, 5.4vw, 4.5rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -.04em;
}
body.vignes-legacy :is(.contenu, .legal-main) h2,
body.vignes-legacy.gp-inner main h2 {
  font-size: clamp(1.625rem, 3.5vw, 2.75rem);
  font-weight: 700;
  line-height: 1.18;
}
body.vignes-legacy :is(.contenu, .legal-main) h3,
body.vignes-legacy.gp-inner main h3 {
  font-size: clamp(1.375rem, 2.6vw, 2rem);
  font-weight: 700;
  line-height: 1.25;
}
body.vignes-legacy :is(.page-hero, .legal-main) h1 em,
body.vignes-legacy .contenu :is(h2, h3) em {
  color: var(--accent);
  font-style: normal;
  font-weight: inherit;
}
body.vignes-legacy.gp-inner .page-hero .chapeau {
  color: var(--ink);
  font-size: clamp(1.0625rem, 1.8vw, 1.25rem);
  line-height: 1.75;
}
body.vignes-legacy :is(.contenu, .legal-main, .bp-main) :is(p, li, dd, a) {
  overflow-wrap: anywhere;
}
body.vignes-legacy main a:not(.btn):not(.button):not(.bp-button) {
  color: var(--accent);
  text-decoration-thickness: .08em;
  text-underline-offset: .2em;
}

/* En-tête : garder le mécanisme ouvert/fermé de la navigation existante. */
body.vignes-legacy :is(.site-header, .entete, .menu-mobile, .bp-campaign-header) {
  color: var(--ink);
  background: var(--paper);
  border-color: var(--line);
}
body.vignes-legacy .header-inner {
  height: auto;
  min-height: 88px;
  padding-block: 14px;
}
body.vignes-legacy .brand {
  min-width: 0;
  max-width: 100%;
  flex: 0 1 auto;
}
body.vignes-legacy .brand > span { min-width: 0; }
body.vignes-legacy :is(.brand-name, .marque span) {
  color: var(--ink);
  font-size: clamp(1.25rem, 2.4vw, 1.875rem);
  line-height: 1.15;
  overflow-wrap: anywhere;
}
body.vignes-legacy .brand-caption {
  color: var(--muted);
  font-size: .6875rem;
  line-height: 1.5;
  letter-spacing: .025em;
  overflow-wrap: anywhere;
}
body.vignes-legacy :is(.nav, nav.menu) { gap: 20px; }
body.vignes-legacy :is(.nav, nav.menu, .menu-mobile nav) a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: .9375rem;
  line-height: 1.5;
  color: var(--ink);
}
body.vignes-legacy :is(.nav, nav.menu) a[aria-current] {
  text-decoration-color: var(--accent);
}

/* Ne pas appliquer ces dimensions aux champs range des comparateurs. */
body.vignes-legacy :is(.btn, .button, .nav-cta, .bp-button) {
  max-width: 100%;
  min-width: 0;
  min-height: 48px;
  padding: 13px 21px;
  border: 1px solid var(--accent);
  border-radius: 999px;
  background: var(--accent);
  color: var(--paper);
  font-family: var(--sans);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.5;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
  text-decoration: none;
  box-shadow: none;
}
body.vignes-legacy main :is(.btn, .button, .bp-button),
body.vignes-legacy :is(.contact-dialog, .mobile-contact) .button,
body.vignes-legacy .nav .nav-cta {
  color: var(--paper);
  background: var(--accent);
  border-color: var(--accent);
}
body.vignes-legacy :is(.btn, .button, .nav-cta, .bp-button):hover {
  color: var(--paper);
  background: var(--ink);
  border-color: var(--ink);
}
body.vignes-legacy :is(.button.light, .btn-mail) {
  color: var(--paper);
  background: var(--vignes-green);
  border-color: var(--vignes-green);
}
body.vignes-legacy :is(.text-button, .bp-back, .legal-main .retour) {
  min-height: 44px;
  font-family: var(--sans);
  font-size: .9375rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
body.vignes-legacy :is(.menu-toggle, .close-dialog, .circle-link) {
  min-width: 44px;
  min-height: 44px;
  color: var(--ink);
  border-color: var(--vignes-green);
}
body.vignes-legacy :is(a, button, summary, input, select, textarea, video):focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 4px;
  box-shadow: 0 0 0 4px var(--paper);
}
body.vignes-legacy :is(.skip, .saut) {
  color: var(--paper);
  background: var(--ink);
  font-size: 1rem;
}

/* Lecture et formulaires : ni texte réduit pour tenir, ni overflow masqué. */
body.vignes-legacy :is(.form-demande, .deux-colonnes, .form-demande fieldset,
  .form-demande > div, .panel, .drawer-head-top, .copy-row) {
  min-width: 0;
}
body.vignes-legacy .form-demande { max-width: 700px; }
body.vignes-legacy .form-demande :is(input[type="text"], input[type="email"],
  input[type="tel"], select),
body.vignes-legacy :is(.form-demande, .contact-dialog) textarea {
  min-width: 0;
  max-width: 100%;
  width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid var(--vignes-green);
  border-radius: 6px;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 1rem;
  line-height: 1.65;
}
body.vignes-legacy :is(.form-demande, .contact-dialog) textarea {
  min-height: 150px;
  resize: vertical;
}
body.vignes-legacy :is(input, textarea)::placeholder {
  color: var(--muted);
  opacity: 1;
}
body.vignes-legacy .form-demande input[type="file"] {
  min-width: 0;
  max-width: 100%;
  width: 100%;
  min-height: 44px;
  color: var(--ink);
  font-size: .9375rem;
}
body.vignes-legacy .form-demande input[type="file"]::file-selector-button {
  min-height: 44px;
  max-width: 100%;
  margin: 0 12px 8px 0;
  padding: 9px 13px;
  border: 1px solid var(--vignes-green);
  border-radius: 6px;
  color: var(--ink);
  background: var(--paper);
  font: 600 .9375rem/1.5 var(--sans);
  cursor: pointer;
}
body.vignes-legacy :is(.form-demande, .contact-dialog) :is(input[type="checkbox"], input[type="radio"]) {
  accent-color: var(--accent);
  flex-shrink: 0;
}
body.vignes-legacy :is(.form-demande .choices label, .form-demande .consent,
  .contact-dialog .helper label) {
  min-height: 44px;
  min-width: 0;
  padding-block: 8px;
  font-size: .9375rem;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
body.vignes-legacy .form-demande .choices { gap: 8px 18px; }
body.vignes-legacy :is(.form-demande, .contact-dialog) [aria-invalid="true"] {
  border: 2px solid var(--accent);
}
body.vignes-legacy :is(.cas-rappel, .legal-main .preambule, .legal-main blockquote) {
  color: var(--ink);
  background: var(--light);
  border-left-color: var(--accent);
}
body.vignes-legacy :is(.hint, .form-alt, .recipient, .aide-cta, .reassurance,
  .simulation-note, .bp-help, .bp-small, .bp-before, .legal-main .sous-titre) {
  color: var(--muted);
  font-size: .9375rem;
  line-height: 1.7;
}
body.vignes-legacy :is(.status, .form-status) {
  color: var(--accent);
  font-size: .9375rem;
  line-height: 1.7;
}
body.vignes-legacy :is(.contenu, .legal-main) :is(figcaption, small, .meta, .fil, .etiquettes) {
  color: var(--muted);
  font-size: .9375rem;
  line-height: 1.65;
}
body.vignes-legacy :is(.contenu, .legal-main) :is(th, td) { border-color: var(--line); }
body.vignes-legacy :is(.contenu, .legal-main) th {
  color: var(--ink);
  background: var(--light);
}
body.vignes-legacy .contenu article {
  color: var(--ink);
  background: var(--paper);
  border-color: var(--line);
  border-radius: 8px;
}
body.vignes-legacy :is(.contenu, .legal-main) summary {
  min-height: 48px;
  font-size: 1rem;
  line-height: 1.65;
}
body.vignes-legacy .compare:focus-within {
  outline: 3px solid var(--accent);
  outline-offset: 4px;
}

/* Dialog : conserver display, [open], backdrop, focus et défilement natifs. */
body.vignes-legacy .contact-dialog {
  color: var(--ink);
  background: var(--paper);
  border-color: var(--line);
  font-size: 1rem;
}
body.vignes-legacy .contact-dialog .drawer-head {
  color: var(--ink);
  background: var(--paper);
}
body.vignes-legacy .contact-dialog .drawer-head h2 {
  font-size: clamp(1.875rem, 5vw, 2.875rem);
  line-height: 1.15;
}
body.vignes-legacy .contact-dialog .channel-tabs { border-radius: 12px; }
body.vignes-legacy .contact-dialog .channel {
  min-height: 48px;
  padding: 10px 12px;
  border-radius: 9px;
  font-size: .9375rem;
  line-height: 1.5;
}
body.vignes-legacy .contact-dialog .channel[aria-selected="true"] {
  color: var(--paper);
  background: var(--vignes-green);
}
body.vignes-legacy .contact-dialog :is(.panel label, .helper summary,
  .helper summary small, .helper .text-button, .copy-row .text-button,
  .copy-row > span, .phone-person, .phone-person span) {
  font-size: .9375rem;
  line-height: 1.65;
}
body.vignes-legacy .contact-dialog .helper .text-button,
body.vignes-legacy .contact-dialog .copy-row .text-button { min-height: 44px; }
body.vignes-legacy .contact-dialog .helper label {
  color: var(--ink);
  border-color: var(--vignes-green);
}
body.vignes-legacy .contact-dialog .helper label:has(input:checked) {
  color: var(--paper);
  background: var(--vignes-green);
}
body.vignes-legacy .contact-dialog .helper label:has(input:checked) input {
  accent-color: var(--paper);
}
body.vignes-legacy .contact-dialog .phone-number {
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(1.75rem, 6vw, 2.75rem);
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: anywhere;
}
body.vignes-legacy .contact-dialog .phone-panel > p:not(.phone-number):not(.status) {
  font-size: 1rem;
  line-height: 1.75;
}
body.vignes-legacy .copy-row { flex-wrap: wrap; }

/* Black Pixel garde son contenu et ses décorations de campagne. */
body.vignes-legacy :is(.bp-campaign-header .brand-name, .bp-campaign-header .bp-back) {
  color: var(--ink);
}
body.vignes-legacy .bp-campaign-header .brand-caption { color: var(--muted); }
body.vignes-legacy .bp-campaign-intro,
body.vignes-legacy .bp-offer {
  color: var(--paper);
  background-color: var(--ink);
  border-color: var(--vignes-green);
}
body.vignes-legacy .bp-campaign-intro h1 {
  color: var(--paper);
  font-family: var(--serif);
  font-size: clamp(2.25rem, 5vw, 4.5rem);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -.04em;
}
body.vignes-legacy :is(.bp-campaign-intro h1 span, .bp-offer .bp-discount,
  .bp-offer .bp-slot strong) {
  color: var(--vignes-gold);
  text-shadow: none;
}
body.vignes-legacy .bp-campaign-intro :is(.bp-eyebrow, .bp-lead, .bp-description, .bp-help) {
  color: var(--paper);
}
body.vignes-legacy .bp-campaign-intro :is(.bp-button, .bp-back) {
  color: var(--ink);
  background: var(--paper);
  border-color: var(--paper);
}
body.vignes-legacy .bp-campaign-intro .bp-button:hover {
  color: var(--ink);
  background: var(--vignes-gold);
  border-color: var(--vignes-gold);
}
body.vignes-legacy :is(.bp-lead, .bp-card h3, .bp-section-title h2, .bp-next h2, .bp-terms h2) {
  font-family: var(--serif);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.03em;
}
body.vignes-legacy .bp-lead { font-size: clamp(1.625rem, 3vw, 2.375rem); }
body.vignes-legacy :is(.bp-card h3, .bp-section-title h2, .bp-next h2) {
  font-size: clamp(1.625rem, 3.5vw, 2.75rem);
}
body.vignes-legacy .bp-card {
  background: var(--paper);
  border-color: var(--line);
  border-radius: 8px;
}
body.vignes-legacy :is(.bp-card .bp-price, .bp-option > p,
  .bp-next p:not(.bp-eyebrow):not(.bp-help), .bp-terms ul) {
  font-size: 1rem;
  line-height: 1.7;
}
body.vignes-legacy .bp-prices .bp-price strong { white-space: normal; }

/* Pied et barre de contact : état visible/caché inchangé. */
body.vignes-legacy :is(.footer, .bp-footer, .mobile-contact, .barre) {
  color: var(--ink);
  background: var(--paper);
  border-color: var(--line);
}
body.vignes-legacy :is(.footer-top, .footer-bottom, .footer-legal,
  .footer-links, .bp-footer, .footer .footer-bottom) {
  color: var(--ink);
  font-size: .875rem;
  line-height: 1.7;
}
body.vignes-legacy :is(.footer a, .bp-footer a) {
  min-height: 44px;
  color: var(--ink);
}
body.vignes-legacy .footer-wordmark {
  color: var(--ink);
  font-size: clamp(2rem, 9.5vw, 8rem);
  line-height: 1.1;
  overflow-wrap: anywhere;
}
body.vignes-legacy .mobile-contact :is(.button, .text-button) {
  min-height: 48px;
  font-size: .9375rem;
}

@media (max-width: 1100px) {
  body.vignes-legacy .nav { gap: 6px; }
}
@media (max-width: 600px) {
  body.vignes-legacy .header-inner { gap: 12px; }
  body.vignes-legacy .brand { gap: 9px; }
  body.vignes-legacy .brand-name { font-size: 1.375rem; }
  body.vignes-legacy .brand-caption { font-size: .625rem; }
  body.vignes-legacy .form-demande .deux-colonnes { grid-template-columns: minmax(0, 1fr); }
  body.vignes-legacy .form-demande .button { width: 100%; justify-content: center; }
  body.vignes-legacy .contact-dialog :is(.drawer-head, .drawer-body) { padding-inline: 20px; }
  body.vignes-legacy .contact-dialog .helper summary { flex-wrap: wrap; gap: 8px; }
  body.vignes-legacy :is(.contenu, .legal-main) table { max-width: 100%; }
  body.vignes-legacy .mobile-contact { flex-wrap: wrap; gap: 8px; }
  body.vignes-legacy .mobile-contact .button { max-width: none; }
}
@media (max-width: 360px) {
  body.vignes-legacy .brand-name { font-size: 1.1875rem; }
  body.vignes-legacy .brand-caption { font-size: .625rem; letter-spacing: 0; }
  body.vignes-legacy .header-inner { gap: 8px; }
  body.vignes-legacy :is(.btn, .button, .nav-cta, .bp-button) { padding-inline: 16px; }
  body.vignes-legacy .contact-dialog :is(.drawer-head, .drawer-body) { padding-inline: 16px; }
}

/* La copie locale emploie le logo d’origine et le nom vert sarment. */
body.vignes-legacy .brand-name{color:var(--vert, #3f4e34)}