/* =========================================================================
   Le Livre de Cave -- refonte 2026
   Maison de vins anciens et rares : une mise en page editoriale, sobre,
   beaucoup d'air. Titres en Cormorant Garamond (esprit des etiquettes
   anciennes), texte en Inter, or du site en accent.
   Charge APRES main.css et responsive.css, qui restent pour l'administration
   et pour le HTML saisi dans l'admin (encadres .box de la presentation).
   ========================================================================= */

:root {
  --ink: #1d1b18;
  --line-strong: #cfc6b5;
  --ok: #55704a;
  --warn: #a4553a;
  --ink-soft: #57524a;
  --ink-mute: #8a8478;
  --paper: #faf8f4;
  --sand: #f2ede4;
  --line: #e4ddd0;
  --gold: #b49a6c;
  --gold-deep: #8c7349;
  --serif: 'Cormorant Garamond', Georgia, 'Times New Roman', 'Songti SC', 'Noto Serif SC', serif;
  --sans: 'Inter', -apple-system, 'Helvetica Neue', Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  --wrap: 1200px;
  --header-h: 84px;
}

body.site {
  padding-top: 0;
  background: var(--paper);
  color: var(--ink-soft);
  font-family: var(--sans);
  font-size: 16px;
  font-weight: 300;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
body.site h1, body.site h2, body.site h3, body.site h4 {
  font-family: var(--serif);
  color: var(--ink);
  font-weight: 500;
  letter-spacing: 0;
}
body.site a { color: var(--gold-deep); transition: color .2s ease; }
body.site a:hover, body.site a:focus { color: var(--ink); text-decoration: none; }
body.site img { max-width: 100%; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 32px; }

.eyebrow {
  display: inline-block;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--gold-deep);
}

/* Boutons -------------------------------------------------------------- */
.btn-line, .btn-solid {
  display: inline-block;
  padding: 14px 30px;
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  border: 1px solid currentColor;
  transition: background .25s ease, color .25s ease, border-color .25s ease;
}
.btn-solid { background: var(--gold); border-color: var(--gold); color: #fff !important; }
.btn-solid:hover { background: var(--ink); border-color: var(--ink); }
.btn-line { color: var(--ink) !important; }
.btn-line:hover { background: var(--ink); color: #fff !important; }
.btn-line.on-dark { color: #fff !important; }
.btn-line.on-dark:hover { background: #fff; color: var(--ink) !important; }

.link-arrow {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink) !important;
  border-bottom: 1px solid var(--gold);
  padding-bottom: 4px;
}
.link-arrow:after { content: ' \2192'; letter-spacing: 0; }

/* En-tete -------------------------------------------------------------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  height: var(--header-h);
  background: rgba(250, 248, 244, .94);
  -webkit-backdrop-filter: saturate(140%) blur(10px);
  backdrop-filter: saturate(140%) blur(10px);
  border-bottom: 1px solid var(--line);
}
.site-header .wrap {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.brand { display: flex; align-items: center; gap: 14px; flex-shrink: 0; white-space: nowrap; color: var(--ink) !important; }
.brand img { height: 52px; width: auto; }
.brand-name { display: block; font-family: var(--serif); font-size: 24px; font-weight: 500; line-height: 1.1; }
.brand-tag {
  display: block;
  margin-top: 4px;
  font-size: 9.5px;
  font-weight: 500;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--gold-deep);
}
.site-nav { display: flex; align-items: center; gap: 30px; }
.site-nav ul { display: flex; gap: 22px; margin: 0; padding: 0; list-style: none; }
.site-nav ul a {
  position: relative;
  display: block;
  padding: 6px 0;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--ink) !important;
}
.site-nav ul a:after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform .25s ease;
}
.site-nav ul a:hover:after, .site-nav ul li.active a:after { transform: scaleX(1); }
.site-nav .new-dot {
  display: inline-block;
  width: 6px; height: 6px;
  margin-left: 6px;
  border-radius: 50%;
  background: var(--gold);
  vertical-align: 2px;
}
.langs { display: flex; gap: 10px; padding-left: 26px; border-left: 1px solid var(--line); }
.langs a { white-space: nowrap; font-size: 11px; font-weight: 500; letter-spacing: .12em; color: var(--ink-mute) !important; }
.langs a.current, .langs a:hover { color: var(--ink) !important; }
.nav-toggle {
  display: none;
  width: 40px; height: 40px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}
.nav-toggle span { display: block; width: 24px; height: 1px; margin: 6px auto; background: var(--ink); transition: transform .25s ease, opacity .25s ease; }

/* Accueil : grande image ------------------------------------------------ */
.hero {
  position: relative;
  min-height: calc(100vh - var(--header-h));
  max-height: 860px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: var(--ink);
}
.hero-slides { position: absolute; inset: 0; }
.hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: scale(1.06);
  transition: opacity 1.8s ease, transform 9s linear;
}
.hero-slide.is-active { opacity: 1; transform: scale(1); }
.hero-slide img { width: 100%; height: 100%; object-fit: cover; }
.hero:after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(20,18,15,.15) 0%, rgba(20,18,15,.25) 45%, rgba(20,18,15,.78) 100%);
}
.hero-content { position: relative; z-index: 2; width: 100%; padding-bottom: 96px; color: #fff; }
.hero-content .eyebrow { color: #e3d3b4; }
.hero h1 {
  margin: 18px 0 22px;
  font-size: clamp(48px, 7vw, 96px);
  line-height: .98;
  font-weight: 400;
  color: #fff !important;
}
.hero p { max-width: 560px; margin: 0 0 36px; font-size: 17px; color: rgba(255,255,255,.86); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }
@media (prefers-reduced-motion: reduce) {
  .hero-slide { transition: opacity .6s ease; transform: none !important; }
}

/* Sections --------------------------------------------------------------- */
.section { padding: 120px 0; }
.section.alt { background: var(--sand); }
.section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 56px;
}
.section-head h2 { margin: 12px 0 0; font-size: clamp(34px, 4vw, 52px); line-height: 1.05; }

/* Les trois metiers */
.pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.pillar { display: block; color: inherit !important; }
.pillar-media { position: relative; overflow: hidden; aspect-ratio: 5 / 2; background: var(--line); }
.pillar-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.pillar:hover .pillar-media img { transform: scale(1.05); }
.pillar h3 { margin: 28px 0 12px; font-size: 30px; line-height: 1.15; }
.pillar p { margin: 0 0 20px; font-size: 15px; }

/* Cartes : actualites et degustations */
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px; }
.card { display: flex; flex-direction: column; color: inherit !important; }
.card-media { position: relative; overflow: hidden; aspect-ratio: 3 / 2; background: var(--line); }
.card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.card:hover .card-media img { transform: scale(1.05); }
.card-meta {
  margin: 22px 0 8px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.card h3 { margin: 0 0 10px; font-size: 26px; line-height: 1.2; transition: color .2s ease; }
.card:hover h3 { color: var(--gold-deep); }
.card p { margin: 0; font-size: 15px; }
.pill {
  position: absolute;
  left: 16px; top: 16px;
  padding: 6px 12px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  background: rgba(250,248,244,.94);
  color: var(--ink);
}
.pill.open { background: var(--gold); color: #fff; }

/* Bandeau contact */
.contact-band { background: var(--ink); color: rgba(255,255,255,.75); }
.contact-band .wrap { display: grid; grid-template-columns: 1.3fr 1fr; gap: 60px; align-items: center; }
.contact-band h2 { margin: 14px 0 0; font-size: clamp(36px, 4.4vw, 58px); line-height: 1.05; color: #fff !important; }
.contact-band .eyebrow { color: #e3d3b4; }
.contact-lines { font-size: 16px; line-height: 2; }
.contact-lines strong { display: block; margin-bottom: 6px; font-family: var(--serif); font-size: 24px; font-weight: 500; color: #fff; }
.contact-lines .btn-line { margin-top: 26px; }

/* Pied de page ----------------------------------------------------------- */
.site-footer { background: #15130f; color: rgba(255,255,255,.62); font-size: 14px; }
.site-footer .wrap { padding-top: 72px; padding-bottom: 28px; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 48px; padding-bottom: 56px; border-bottom: 1px solid rgba(255,255,255,.1); }
.site-footer .brand { color: #fff !important; }
.site-footer .brand-tag { color: #cbb68c; }
.site-footer p { margin: 22px 0 0; line-height: 1.9; }
.footer-title {
  margin: 4px 0 18px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: #cbb68c;
}
.footer-address { margin: 0; font-style: normal; line-height: 1.9; }
.footer-nav { margin: 0 0 22px; padding: 0; list-style: none; line-height: 2.2; }
.site-footer a { color: rgba(255,255,255,.78) !important; }
.site-footer a:hover { color: #fff !important; }
.footer-social { display: flex; gap: 18px; font-size: 18px; }
.footer-langs { margin-top: 26px; display: flex; gap: 14px; font-size: 12px; letter-spacing: .12em; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-top: 24px; font-size: 12px; color: rgba(255,255,255,.45); }
.footer-bottom a { color: rgba(255,255,255,.6) !important; }

/* =========================================================================
   Pages interieures
   ========================================================================= */

/* Titre de page : sur-titre, grand titre, chapeau */
.page-head { padding: 84px 0 52px; border-bottom: 1px solid var(--line); }
.page-head h1 { margin: 16px 0 0; font-size: clamp(42px, 5.4vw, 74px); line-height: 1.02; font-weight: 400; }
.page-head h1 .h1-vintage { font-style: italic; color: var(--gold-deep); }
.page-head .lead { max-width: 700px; margin: 24px 0 0; font-size: 18px; line-height: 1.7; color: var(--ink-soft); }
.page-head .meta { margin: 22px 0 0; font-size: 12px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-mute); }
.back-link {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--gold-deep) !important;
}
.back-link:before { content: '\2190\00a0\00a0'; letter-spacing: 0; }
.page-body { padding: 72px 0 120px; }
.page-body.tight { padding-top: 56px; }
.block + .block { margin-top: 96px; }
.block-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 36px; }
.block-head h2 { margin: 10px 0 0; font-size: clamp(30px, 3.4vw, 44px); line-height: 1.08; }
.block-head .count { font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-mute); white-space: nowrap; }

/* Texte saisi dans l'administration */
.prose { font-size: 17px; line-height: 1.85; color: var(--ink-soft); }
.prose.narrow { max-width: 760px; }
.prose.spaced { margin-bottom: 56px; }
.spaced-top { margin-top: 22px; }
.prose > :first-child { margin-top: 0; }
.prose p { margin: 0 0 1.15em; }
.prose h2 { margin: 1.8em 0 .6em; font-size: 30px; }
.prose h3 { margin: 1.6em 0 .6em; font-size: 26px; line-height: 1.25; }
.prose h4 { margin: 1.5em 0 .5em; font-size: 21px; }
.prose ul { margin: 0 0 1.3em; padding-left: 1.2em; }
.prose li { margin: .25em 0; }
.prose li::marker { color: var(--gold); }
.prose a { border-bottom: 1px solid rgba(180,154,108,.5); }
.prose img { height: auto !important; max-width: 100%; }
.prose strong { font-weight: 500; color: var(--ink); }
.prose .text-justify { text-align: left; }
/* Encadres de la presentation (.box d'AdminLTE) : trois colonnes sobres */
body.site .prose .row { margin-left: -20px; margin-right: -20px; }
body.site .prose .row > [class*="col-"] { padding-left: 20px; padding-right: 20px; }
body.site .prose .box {
  margin: 56px 0 0;
  padding: 30px 0 0;
  border: 0;
  border-top: 1px solid var(--gold);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.site .prose .box .box-header, body.site .prose .box .box-header .box-title-large { padding: 0; text-align: left !important; }
body.site .prose .box .box-header:before, body.site .prose .box .box-header:after { display: none; }
body.site .prose .box .box-title-large { margin: 0 0 16px; padding: 0; font-size: 30px; color: var(--ink); }
body.site .prose .box .box-title-large .fa { margin-right: 8px; font-size: 20px; color: var(--gold); vertical-align: 3px; }
body.site .prose .box .box-body { padding: 0; font-size: 15.5px; line-height: 1.8; }
body.site .prose .box h4 { margin: 1.4em 0 .4em; font-size: 19px; }
/* Portrait flottant de la presentation */
.prose div[style*="float:right"] { margin: 6px 0 24px 48px !important; }
.prose div[style*="float:right"] img { width: 260px; height: auto !important; }

/* Mise en page a deux colonnes */
.split { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 72px; align-items: start; }
.split.wide-aside { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.aside-card { padding: 34px 32px; background: var(--sand); }
.aside-card h3 { margin: 0 0 14px; font-size: 26px; }
.aside-card p { margin: 0 0 12px; }
.aside-card .btn-line, .aside-card .btn-solid { margin-top: 14px; }
.sticky-aside { position: sticky; top: calc(var(--header-h) + 32px); }
.facts { margin: 0; }
.facts div { display: flex; justify-content: space-between; gap: 18px; padding: 13px 0; border-bottom: 1px solid var(--line-strong); }
.facts div:first-child { border-top: 1px solid var(--line-strong); }
.facts dt { font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-mute); padding-top: 4px; white-space: nowrap; }
.facts dd { margin: 0; text-align: right; color: var(--ink); }
/* #map porte deja une hauteur dans main.css (id) : ces regles le visent par l'id */
body.site #map.map-frame { height: 320px; margin-top: 28px; background: var(--line); }

/* Formulaires */
.form-card { padding: 44px 44px 40px; background: #fff; border: 1px solid var(--line); }
.form-card h2 { margin: 0 0 8px; font-size: 32px; }
.form-card .form-intro { margin: 0 0 30px; color: var(--ink-mute); font-size: 15px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 26px; }
.field { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.field.full { grid-column: 1 / -1; }
.field label { margin: 0; font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-soft); }
.field input, .field textarea, .field select {
  width: 100%;
  padding: 13px 15px;
  border: 1px solid var(--line-strong);
  border-radius: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  box-shadow: none;
  transition: border-color .2s ease, background .2s ease;
  -webkit-appearance: none;
  appearance: none;
}
.field select {
  padding-right: 40px;
  background-image: linear-gradient(45deg, transparent 50%, var(--ink-soft) 50%), linear-gradient(135deg, var(--ink-soft) 50%, transparent 50%);
  background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%;
  background-size: 5px 5px;
  background-repeat: no-repeat;
}
.field textarea { min-height: 150px; resize: vertical; }
/* main.css descendait la liste des places de 10 px (ancienne mise en page) */
body.site #orga-tasting { margin-top: 0; }
.field input::placeholder, .field textarea::placeholder { color: #a9a294; }
.field input:focus, .field textarea:focus, .field select:focus { outline: none; border-color: var(--gold); background: #fff; }
.field input[readonly] { background: var(--sand); }
.field .hint { font-size: 13px; color: var(--ink-mute); }
.field.captcha { padding-top: 6px; }
.form-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 28px; margin-top: 32px; }
.form-actions .btn-solid { border: 0; cursor: pointer; }
.form-actions small { font-size: 13px; color: var(--ink-mute); }
.form-disclaimer { margin: 22px 0 0; padding-top: 18px; border-top: 1px solid var(--line); font-size: 14px; color: var(--ink-soft); }
/* Apres l'envoi, la page revient sur le formulaire (#form, #reservation) :
   sans cette marge, le bandeau de resultat restait cache sous l'en-tete fixe */
#form, #reservation { scroll-margin-top: calc(var(--header-h) + 24px); }
.notice { margin: 0 0 28px; padding: 16px 20px; border-left: 2px solid var(--warn); background: #fbf3ee; color: var(--ink); font-size: 15px; }
.notice.ok { border-color: var(--ok); background: #f1f4ec; }

/* Pastilles (regions, filtres) */
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  padding: 8px 15px;
  border: 1px solid var(--line-strong);
  font-size: 13px;
  font-weight: 400;
  white-space: nowrap;
  color: var(--ink) !important;
  transition: border-color .2s ease, background .2s ease;
}
.chip small { font-size: 11px; color: var(--ink-mute); }
.chip:hover { border-color: var(--gold); background: #fff; }

/* Collection : barre de recherche et de regions, qui suit le defilement */
.collection-bar {
  position: sticky;
  top: var(--header-h);
  z-index: 40;
  padding: 18px 0;
  background: rgba(250, 248, 244, .96);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line);
}
.collection-bar .wrap { display: flex; align-items: center; gap: 28px; }
.collection-bar .chips {
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  padding-bottom: 2px;
  /* Le bord droit s'efface : on devine qu'il y a d'autres regions */
  -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent);
  mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent);
  padding-right: 40px;
}
.collection-bar .chips::-webkit-scrollbar { display: none; }
.search { display: flex; flex: 0 0 360px; border: 1px solid var(--line-strong); background: #fff; }
.search input { flex: 1; min-width: 0; padding: 11px 14px; border: 0; background: transparent; font-family: var(--sans); font-size: 15px; color: var(--ink); }
.search input:focus { outline: none; }
.search button { padding: 0 16px; border: 0; background: transparent; color: var(--ink-soft); cursor: pointer; }
.search button:hover { color: var(--gold-deep); }
.search-state { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 20px; margin-bottom: 48px; font-size: 15px; }
.region { scroll-margin-top: calc(var(--header-h) + 100px); }

/* Tableaux de vins */
.wine-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.wine-table th {
  padding: 12px 14px;
  border-bottom: 1px solid var(--ink);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--ink-mute);
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
}
.wine-table th:after { content: ''; display: inline-block; width: 12px; margin-left: 4px; color: var(--gold-deep); }
.wine-table th.headerSortDown:after { content: '\2191'; }
.wine-table th.headerSortUp:after { content: '\2193'; }
.wine-table th:hover { color: var(--ink); }
.wine-table td { padding: 13px 14px; border-bottom: 1px solid var(--line); vertical-align: baseline; }
.wine-table tbody tr { cursor: pointer; transition: background .15s ease; }
.wine-table tbody tr:hover { background: var(--sand); }
.wine-table .c-name a { font-family: var(--serif); font-size: 20px; font-weight: 500; line-height: 1.25; color: var(--ink) !important; }
.wine-table tbody tr:hover .c-name a { color: var(--gold-deep) !important; }
.wine-table .c-vintage { font-family: var(--serif); font-size: 19px; color: var(--ink); white-space: nowrap; font-variant-numeric: lining-nums; }
.wine-table .c-vol, .wine-table .c-price { white-space: nowrap; font-variant-numeric: tabular-nums; }
.wine-table .c-price, .wine-table th.c-price { text-align: right; }
.wine-table td.c-price { color: var(--ink); font-weight: 400; }

/* Millesimes : un registre, une ligne par decennie */
.register { border-top: 1px solid var(--ink); }
.decade { display: grid; grid-template-columns: 120px 1fr; align-items: center; border-bottom: 1px solid var(--line); }
.decade-label { font-size: 11px; font-weight: 500; letter-spacing: .2em; color: var(--ink-mute); }
.years { display: grid; grid-template-columns: repeat(10, 1fr); }
.years .wide { grid-column: span 10; text-align: left; padding-left: 14px; }
.year {
  position: relative;
  padding: 14px 4px;
  border: 0;
  background: none;
  font-family: var(--serif);
  font-size: 19px;
  font-variant-numeric: lining-nums;
  line-height: 1;
  text-align: center;
  color: var(--ink-mute);
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.year.in-stock { color: var(--ink); font-weight: 600; }
.year.in-stock:after {
  content: '';
  position: absolute;
  left: 50%; bottom: 6px;
  width: 4px; height: 4px;
  margin-left: -2px;
  border-radius: 50%;
  background: var(--gold);
}
.year.wide.in-stock:after { position: static; display: inline-block; margin: 0 0 0 12px; vertical-align: middle; }
.year:hover { background: var(--sand); color: var(--ink); }
.year.active { background: var(--ink); color: #fff; }
.year.active:after { background: #fff; }
.year:focus-visible { outline: 1px solid var(--gold); outline-offset: -1px; }
.register-legend { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin: 0 0 18px; font-size: 13px; color: var(--ink-mute); }
.register-legend .dot { display: inline-block; width: 6px; height: 6px; margin-right: 8px; border-radius: 50%; background: var(--gold); vertical-align: 2px; }
.vintage-results { scroll-margin-top: calc(var(--header-h) + 24px); }
.vintage-results:not(:empty) { margin-top: 80px; }
.vintage-results .empty { padding: 40px; background: var(--sand); text-align: center; font-size: 17px; }
.loading { padding: 40px 0; text-align: center; color: var(--ink-mute); }

/* Fiche d'un vin */
.wine-sheet { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 80px; align-items: start; }
.wine-visual { display: flex; flex-direction: column; align-items: center; padding: 48px 40px 28px; background: var(--sand); }
.wine-visual img { max-height: 460px; width: auto !important; }
.wine-visual figcaption { margin-top: 18px; font-size: 12px; color: var(--ink-mute); text-align: center; }
.wine-price { margin: 34px 0 0; font-family: var(--serif); font-size: 42px; line-height: 1; color: var(--ink); }
.wine-price small { display: block; margin-bottom: 10px; font-family: var(--sans); font-size: 11px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-mute); }
.wine-enquire { margin-top: 44px; padding-top: 30px; border-top: 1px solid var(--line); }
.wine-enquire h3 { margin: 0 0 8px; font-size: 26px; }
.wine-enquire p { margin: 0 0 22px; }
.actions-row { display: flex; flex-wrap: wrap; gap: 12px; }

/* Actualites */
.news-year { display: flex; align-items: baseline; gap: 20px; margin: 0 0 32px; }
.news-year h2 { margin: 0; font-size: 40px; }
.news-year:after { content: ''; flex: 1; height: 1px; background: var(--line); }
.news-year-block + .news-year-block { margin-top: 88px; }
.cards.news-grid { row-gap: 56px; }
.article-hero { margin: 0 0 56px; }
.article-hero img { width: 100%; max-height: 620px; object-fit: cover; }
.article-foot { max-width: 760px; margin-top: 64px; padding-top: 28px; border-top: 1px solid var(--line); }

/* Degustations */
.tasting-sheet { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 72px; align-items: start; }
.tasting-sheet .tasting-image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.status { display: inline-block; padding: 6px 12px; font-size: 10px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; background: var(--line); color: var(--ink); }
.status.open { background: var(--gold); color: #fff; }
.tasting-booking { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 56px; align-items: start; }
.tasting-booking .calendar-card { padding: 30px 28px; background: #fff; border: 1px solid var(--line); }
.tasting-booking .calendar-card h3 { margin: 0 0 18px; font-size: 24px; }
.card-sub { margin: 6px 0 0; font-size: 13px; color: var(--ink-mute); }

/* Calendrier de reservation (jQuery UI) aux couleurs du site */
body.site #datepicker .ui-datepicker { width: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; font-family: var(--sans); font-size: 14px; }
body.site #datepicker .ui-datepicker-header { padding: 6px 0 14px; border: 0; border-radius: 0; background: transparent; color: var(--ink); font-family: var(--serif); font-size: 20px; font-weight: 500; }
body.site #datepicker .ui-datepicker-title { line-height: 1.6; }
body.site #datepicker .ui-datepicker-prev, body.site #datepicker .ui-datepicker-next { top: 8px; border: 0; background: none; cursor: pointer; }
body.site #datepicker .ui-datepicker th { padding: 6px 0; font-size: 10.5px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-mute); }
body.site #datepicker .ui-datepicker td { padding: 2px; }
body.site #datepicker .ui-datepicker td a, body.site #datepicker .ui-datepicker td span { padding: 9px 0; border: 0; border-radius: 0; background: var(--paper); color: var(--ink); text-align: center; font-weight: 400; }
body.site #datepicker .ui-datepicker td a:hover { background: var(--sand); }
body.site #datepicker .ui-datepicker td.ui-state-disabled { opacity: 1; }
body.site #datepicker .ui-datepicker td.ui-state-disabled span { background: transparent; color: #c4bdb0; }
body.site #datepicker .ui-datepicker .ui-datepicker-current-day a, body.site #datepicker .ui-datepicker td a.ui-state-active { background: var(--ink); color: #fff; }
body.site #datepicker .ui-datepicker td a.ui-state-highlight { box-shadow: inset 0 0 0 1px var(--gold); }

/* Partenaires */
.partner-group + .partner-group { margin-top: 72px; }
.partner-group h2 { display: flex; align-items: center; gap: 14px; margin: 0 0 26px; font-size: 32px; }
.partner-group h2 .fa, .partner-group h2 .fas { font-size: 18px; color: var(--gold); }
.partners { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 28px; }
.partner { padding: 20px 0; border-top: 1px solid var(--line); }
.partner h3 { margin: 0 0 6px; font-size: 21px; line-height: 1.25; }
.partner h3 a { color: var(--ink) !important; }
.partner h3 a:hover { color: var(--gold-deep) !important; }
.partner p { margin: 0; font-size: 14px; line-height: 1.6; }
body.site #map.partners-map { height: 440px; margin: 0 0 80px; background: var(--line); }

/* Page introuvable */
.not-found { padding: 120px 0 140px; text-align: center; }
.not-found .code { display: block; font-family: var(--serif); font-size: clamp(90px, 14vw, 180px); line-height: .9; color: var(--line-strong); }
.not-found h1 { margin: 18px 0 14px; font-size: clamp(32px, 4vw, 48px); }
.not-found p { max-width: 520px; margin: 0 auto 36px; }
.not-found .actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }

/* Pages interieures : petits ecrans */
@media (max-width: 1100px) {
  .split, .wine-sheet, .tasting-sheet, .tasting-booking { gap: 48px; }
  .split { grid-template-columns: minmax(0, 1fr) 320px; }
  .wine-sheet { grid-template-columns: 280px minmax(0, 1fr); }
  .partners { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .search { flex-basis: 280px; }
}
@media (max-width: 960px) {
  .page-head { padding: 56px 0 36px; }
  .page-head .lead { font-size: 17px; }
  .page-body { padding: 48px 0 88px; }
  .block + .block { margin-top: 72px; }
  .block-head { flex-direction: column; align-items: flex-start; gap: 10px; }
  .split, .split.wide-aside, .wine-sheet, .tasting-sheet, .tasting-booking { grid-template-columns: minmax(0, 1fr); }
  .sticky-aside { position: static; }
  .wine-visual img { max-height: 340px; }
  .prose div[style*="float:right"] { float: none !important; margin: 0 0 28px !important; }
  .prose div[style*="float:right"] img { width: 200px; }
  body.site .prose .box { margin-top: 40px; }
  .partners { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.site #map.partners-map { height: 320px; margin-bottom: 56px; }
  .collection-bar { position: static; padding: 16px 0 14px; }
  .collection-bar .wrap { flex-direction: column; align-items: stretch; gap: 14px; }
  .search { flex-basis: auto; }
  .region { scroll-margin-top: calc(var(--header-h) + 16px); }
  .decade { grid-template-columns: 1fr; padding-top: 12px; }
  .years { grid-template-columns: repeat(5, 1fr); }
  .years .wide { grid-column: span 5; }
}
@media (max-width: 720px) {
  .form-card { padding: 30px 22px; }
  .form-grid { grid-template-columns: 1fr; }
  .partners { grid-template-columns: 1fr; }
  /* Une ligne de tableau devient une fiche : nom et prix, puis le reste */
  .wine-table thead { display: none; }
  .wine-table, .wine-table tbody { display: block; }
  .wine-table tbody tr { display: flex; flex-wrap: wrap; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--line); }
  .wine-table td { padding: 0; border: 0; }
  .wine-table .c-name { order: 1; flex: 1 1 calc(100% - 100px); padding-right: 12px; }
  .wine-table .c-price { order: 2; flex: 0 0 100px; text-align: right; }
  .wine-table .c-vintage, .wine-table .c-app, .wine-table .c-color, .wine-table .c-vol { order: 3; margin-top: 6px; font-family: var(--sans); font-size: 13px; color: var(--ink-mute); }
  .wine-table .c-vintage { font-weight: 500; color: var(--ink); }
  .wine-table .c-app:before, .wine-table .c-color:before, .wine-table .c-vol:before { content: '\00b7'; margin: 0 7px; }
  .wine-table .c-color:empty { display: none; }
  .wine-table .c-name a { font-size: 19px; }
}

/* Avertissement d'age (a la premiere visite) */
/* Centree dans la zone visible : sur un telephone, les barres du navigateur
   mangent le bas de l'ecran et une marge fixe poussait le bouton dessous.
   Les marges automatiques centrent sans couper le haut si la fenetre deborde
   (la fenetre de Bootstrap defile alors). Bootstrap remet display:none en
   ligne a la fermeture, apres avoir retire .in. */
.legal-modal.in { display: flex !important; }
.legal-modal .modal-dialog { width: 100%; max-width: 460px; margin: auto; padding: 16px; }
.legal-modal .modal-content {
  padding: 44px 40px 40px;
  border: 0;
  border-radius: 0;
  background: var(--paper);
  box-shadow: 0 30px 80px rgba(20, 18, 15, .35);
  text-align: center;
}
.legal-mark { display: block; width: 132px; height: auto; margin: 0 auto; }
/* Chaque trait s'ecrit dans l'ordre de l'original : le jambage, le d, puis
   le, livre, de, cave (pathLength=1 : le pointille va de 1 a 0) */
.legal-ink path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: legal-draw .4s ease-in-out forwards; }
.legal-ink path:nth-child(1) { animation-delay: 0.2s; animation-duration: 0.6s; }
.legal-ink path:nth-child(2) { animation-delay: 0.8s; animation-duration: 0.5s; }
.legal-ink path:nth-child(3) { animation-delay: 1.4s; animation-duration: 0.45s; }
.legal-ink path:nth-child(4) { animation-delay: 2.0s; animation-duration: 0.2s; }
.legal-ink path:nth-child(5) { animation-delay: 2.45s; animation-duration: 0.35s; }
.legal-ink path:nth-child(6) { animation-delay: 2.85s; animation-duration: 0.3s; }
.legal-ink path:nth-child(7) { animation-delay: 3.2s; animation-duration: 0.45s; }
.legal-ink path:nth-child(8) { animation-delay: 3.8s; animation-duration: 0.45s; }
.legal-ink path:nth-child(9) { animation-delay: 4.35s; animation-duration: 0.35s; }
.legal-ink path:nth-child(10) { animation-delay: 4.8s; animation-duration: 0.4s; }
.legal-ink path:nth-child(11) { animation-delay: 5.2s; animation-duration: 0.15s; }
.legal-ink path:nth-child(12) { animation-delay: 5.45s; animation-duration: 0.35s; }
.legal-ink path:nth-child(13) { animation-delay: 5.85s; animation-duration: 0.45s; }
.legal-dot { opacity: 0; animation: legal-dot .2s 2.25s ease-out forwards; }
@keyframes legal-draw { to { stroke-dashoffset: 0; } }
@keyframes legal-dot { to { opacity: 1; } }
.legal-address { margin: 14px 0 0; font-size: 11px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; line-height: 1.9; color: var(--gold-deep); }
.legal-title { margin: 28px 0 12px; padding-top: 24px; border-top: 1px solid var(--line); font-size: 28px; }
.legal-text { margin: 0 0 28px; font-size: 15px; line-height: 1.75; }
.legal-modal .btn-solid { border: 0; cursor: pointer; min-width: 160px; }
@media (max-width: 480px), (max-height: 720px) {
  .legal-modal .modal-content { padding: 28px 24px 26px; }
  .legal-mark { width: 104px; }
  .legal-address { margin-top: 10px; font-size: 10px; line-height: 1.7; }
  .legal-title { margin: 18px 0 8px; padding-top: 16px; font-size: 24px; }
  .legal-text { margin-bottom: 20px; font-size: 14px; line-height: 1.6; }
}
.modal-backdrop.in { opacity: .6; }
@media (prefers-reduced-motion: reduce) {
  .legal-ink path { animation: none; stroke-dashoffset: 0; }
  .legal-dot { animation: none; opacity: 1; }
}

/* Bouton de retour en haut, plus discret */
body.site .scrollToTop img { width: 36px; opacity: .55; }

/* Petits ecrans ---------------------------------------------------------- */
@media (max-width: 1240px) {
  .site-nav ul { gap: 16px; }
  .site-nav ul a { letter-spacing: .08em; font-size: 11.5px; }
  .brand-tag { letter-spacing: .22em; }
}
@media (max-width: 1100px) {
  .nav-toggle { display: block; }
  .site-nav {
    position: fixed;
    top: var(--header-h); left: 0; right: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 22px;
    padding: 30px 32px 36px;
    background: var(--paper);
    border-bottom: 1px solid var(--line);
    transform: translateY(-8px);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, transform .25s ease, visibility .25s;
  }
  .site-header.open .site-nav { opacity: 1; visibility: visible; transform: none; }
  .site-header.open .nav-toggle span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .site-header.open .nav-toggle span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .site-nav ul { flex-direction: column; gap: 14px; }
  .site-nav ul a { font-size: 14px; letter-spacing: .12em; }
  .langs { padding-left: 0; border-left: 0; }
  .langs a { font-size: 13px; }
}
@media (max-width: 960px) {
  :root { --header-h: 72px; }
  .wrap { padding: 0 22px; }
  .site-nav { padding: 30px 22px 36px; }
  .brand img { height: 44px; }
  .brand-name { font-size: 21px; }
  .section { padding: 80px 0; }
  .section-head { flex-direction: column; align-items: flex-start; margin-bottom: 40px; }
  .pillars, .cards { grid-template-columns: 1fr; gap: 56px; }
  .contact-band .wrap { grid-template-columns: 1fr; gap: 30px; }
  .footer-grid { grid-template-columns: 1fr; gap: 36px; }
  .hero-content { padding-bottom: 64px; }
}
@media (min-width: 961px) and (max-width: 1180px) {
  .pillars, .cards { gap: 28px; }
}