/* Domaine des Trois Chênes — démonstration de site vitrine (ZataLabs, V7.4). */
:root { --bordeaux: #6d1f2f; --paille: #e8d5a9; --papier: #f7f0e3; --encre: #2d2320; --doux: #7a6a60; }
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }
body { margin: 0; background: #fffdf8; color: var(--encre); font: 400 19px/1.65 "EB Garamond", Georgia, serif; }
h1, h2 { font-family: "Cormorant SC", Georgia, serif; font-weight: 700; line-height: 1; margin: 0 0 .5em; letter-spacing: .02em; }
h2 { font-size: clamp(2.2rem, 5vw, 3.4rem); color: var(--bordeaux); }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--bordeaux); outline-offset: 3px; }
.bouton { display: inline-block; padding: .9rem 1.8rem; border: 1px solid currentColor; font: 500 1rem/1 "Cormorant SC", serif; letter-spacing: .15em; text-decoration: none; transition: background .3s, color .3s; }

/* Hero à couches (parallaxe) */
.hero { position: relative; height: min(88vh, 760px); overflow: hidden; color: #fffaf0; }
.couche { position: absolute; inset: 0; width: 100%; height: 100%; will-change: transform; }
.hero__texte { position: absolute; left: 0; right: 0; top: 16%; text-align: center; z-index: 5; text-shadow: 0 2px 20px rgba(60, 30, 20, .35); }
.hero__texte p { font-style: italic; font-size: 1.2rem; margin: 0 0 1rem; }
.hero h1 { font-size: clamp(3rem, 9vw, 6.5rem); }
.hero .bouton { margin-top: 1rem; background: rgba(109, 31, 47, .55); }
.hero .bouton:hover { background: #fffaf0; color: var(--bordeaux); }

.section { padding: clamp(4rem, 8vw, 6rem) clamp(1rem, 5vw, 4rem); }
.section--papier { background: var(--papier); }
.tete { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: 1.5rem; }
.tete h2 { margin: 0; }
.fleches { display: flex; gap: .5rem; }
.fleches button { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--bordeaux); background: none; color: var(--bordeaux); font-size: 1.2rem; cursor: pointer; }
.fleches button:hover { background: var(--bordeaux); color: #fff; }

/* Carrousel à défilement magnétique */
.carrousel { list-style: none; margin: 0; padding: 0 0 1.5rem; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 22%); gap: 1.5rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.cuvee { scroll-snap-align: start; display: flex; flex-direction: column; align-items: center; padding: 2rem 1.2rem 1.5rem; background: var(--papier); text-align: center; }
.cuvee svg { width: 70px; height: 230px; margin-bottom: 1.2rem; transition: transform .4s; }
.cuvee:hover svg { transform: translateY(-8px) rotate(-3deg); }
.cuvee h3 { margin: 0; font: 700 1.5rem/1.1 "Cormorant SC", serif; }
.cuvee .annee { color: var(--doux); font-style: italic; margin: .2rem 0 .8rem; }
.cuvee .notes { font-size: .95rem; margin: 0 0 1rem; flex: 1; }
.cuvee .prix { font: 700 1.3rem/1 "Cormorant SC", serif; color: var(--bordeaux); }

/* Séjour */
.sejour { display: grid; grid-template-columns: .9fr 1.1fr; gap: 3rem; align-items: start; }
@media (max-width: 900px) { .sejour { grid-template-columns: 1fr; } }
.gite { padding-left: 1.1rem; }
.recap { margin-top: 1.5rem; padding: 1.2rem 1.4rem; border-left: 3px solid var(--bordeaux); background: #fffdf8; }
.recap p { margin: 0; }
.recap strong { font-family: "Cormorant SC", serif; font-size: 1.5rem; color: var(--bordeaux); }
.calendriers { background: #fffdf8; padding: 1.4rem; position: relative; }
.calendriers__nav { display: flex; justify-content: space-between; position: absolute; left: 1rem; right: 1rem; top: 1.1rem; pointer-events: none; }
.calendriers__nav button { pointer-events: auto; width: 34px; height: 34px; border: 1px solid #d8c9b5; background: #fff; cursor: pointer; font-size: 1.2rem; }
.calendriers__nav button:disabled { opacity: .3; cursor: default; }
.mois-double { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
@media (max-width: 560px) { .mois-double { grid-template-columns: 1fr; } .mois-double .mois:last-child { display: none; } }
.mois h3 { margin: .3rem 0 .8rem; text-align: center; font: 700 1.2rem/1 "Cormorant SC", serif; text-transform: capitalize; }
.mois__grille { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; font-size: .9rem; }
.mois__grille .jsem { text-align: center; color: var(--doux); font-size: .75rem; padding-bottom: .3rem; }
.mois__grille button { aspect-ratio: 1; border: 0; background: none; font: 400 .95rem/1 "EB Garamond", serif; cursor: pointer; color: var(--encre); }
.mois__grille button:hover:not(:disabled) { background: var(--papier); }
.mois__grille button:disabled { color: #c9bdb0; cursor: default; }
.mois__grille button.pris { background: repeating-linear-gradient(45deg, #efe4d6, #efe4d6 3px, #fffdf8 3px, #fffdf8 6px); color: #b5a797; text-decoration: line-through; }
.mois__grille button.dans { background: #f1dfe2; }
.mois__grille button.bord { background: var(--bordeaux); color: #fff; }
.legende { margin: 1rem 0 0; font-size: .85rem; color: var(--doux); display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.legende span { display: inline-block; width: 14px; height: 14px; margin-left: .6rem; }
.legende .pris { background: repeating-linear-gradient(45deg, #efe4d6, #efe4d6 3px, #fffdf8 3px, #fffdf8 6px); border: 1px solid #d8c9b5; }
.legende .choix { background: var(--bordeaux); }
.pied { padding: 2rem 1rem; text-align: center; background: var(--encre); color: #cdbfb0; font-size: .95rem; }