/* Direction « GALERIE » — éditoriale claire : papier, encre, bronze ; grande serif, beaucoup d'air, verre clair sur photo.
   Animations (3) : rideau qui découvre la photo d'accueil · apparition douce des blocs au défilement · compteurs. */
:root {
  --fond: #f6f4ef; --fond-2: #ece8df; --surface: #fff;
  --encre: #16161a; --encre-2: #59544c; --filet: rgba(22, 22, 26, .13);
  --marque: #a8773f; --marque-texte: #85582c; --bouton: #16161a; --sur-bouton: #f6f4ef;
  --verre-bg: rgba(255, 255, 255, .74); --verre-bord: rgba(255, 255, 255, .85); --verre-flou: 22px;
  --verre-doux-bg: rgba(255, 255, 255, .72);
  --ombre: 0 30px 70px -30px rgba(40, 32, 20, .35);
  --rayon: 2px; --rayon-grand: 3px;
  --police-titres: "Instrument Serif", "Times New Roman", serif;
  --police-texte: "Instrument Sans", system-ui, sans-serif;
  --st-libre: #1d6a3e; --st-reserve: #8a5800; --st-attente: #3a5675; --st-vendu: #a12d2d;
}
body { font-stretch: 100%; }
.pl-nom { font-size: 32px; letter-spacing: -.01em; }

/* Accueil : texte à gauche sur le papier, photo cadrée à droite, carte de verre à cheval */
.hero { display: grid; grid-template-columns: 5fr 7fr; gap: 0; min-height: 100svh; padding: 112px var(--gouttiere) 40px; max-width: 1520px; margin-inline: auto; align-items: center; }
.hero-texte { padding: 0 56px 0 22px; }
.entete-in { max-width: 1424px; }
.hero-titre { font-family: var(--police-titres); font-size: clamp(58px, 7.2vw, 112px); line-height: .94; letter-spacing: -.025em; margin: 22px 0 28px; }
.hero-titre em { font-style: normal; color: var(--marque-texte); }
.hero-accroche { font-size: 19px; line-height: 1.6; color: var(--encre-2); max-width: 430px; }
.hero-actions { display: flex; gap: 12px; margin-top: 36px; flex-wrap: wrap; }
.hero-visuel { position: relative; margin: 0; height: calc(100svh - 152px); min-height: 560px; }
.hero-img { width: 100%; height: 100%; object-fit: cover; object-position: 42% 45%; }
.hero-carte { position: absolute; left: -72px; bottom: 32px; padding: 22px 28px; border-radius: var(--rayon-grand); }
.hero-actions .bouton--verre { background: transparent; border-color: var(--filet); -webkit-backdrop-filter: none; backdrop-filter: none; }

/* Rideau : la photo se découvre de bas en haut au chargement */
[data-anim~="rideau"] .hero-img { clip-path: inset(100% 0 0 0); transition: clip-path 1.6s cubic-bezier(.7, 0, .2, 1) .15s; }
[data-anim~="rideau"].pret .hero-img { clip-path: inset(0 0 0 0); }

/* Apparitions douces */
.reveal-actif [data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity 1s ease, transform 1s cubic-bezier(.2, .8, .2, 1); }
.reveal-actif [data-reveal].est-visible { opacity: 1; transform: none; }
.reveal-actif .hero-texte[data-reveal] { transition-delay: .2s; }

/* Projet : éditorial, numéros en grande serif, cartes blanches à filet */
.projet .section-tete { max-width: 900px; }
.section-titre { font-size: clamp(38px, 5vw, 68px); line-height: 1.02; letter-spacing: -.02em; }
.atout { border: 1px solid var(--filet); background: var(--surface); }
.atout-n { font-size: 56px; color: var(--marque); }
.atout-n { color: var(--marque-texte); }

/* Lots : table sur fond blanc, filets fins */
.lots { background: var(--fond-2); }
.table-cadre { background: var(--surface); border: 1px solid var(--filet); }
.table-lots tr.groupe th { font-size: 26px; }
.onglets { background: var(--surface); }
.lots .verre-doux { background: var(--surface); }

/* Galerie : mosaïque à angles vifs */
.g-grille { grid-auto-rows: 150px; }

/* Situation */
.carte { background: var(--fond-2); }
.carte-motif { color: rgba(22, 22, 26, .16); }

/* Contact : photo plein cadre adoucie, cartes de verre clair */
.contact { padding: 140px 0; }
.contact-fond::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(246, 244, 239, .35), rgba(246, 244, 239, .05)); }
.contact-carte, .contact-appel { background: rgba(255, 255, 255, .8); }

.partenaires { background: var(--fond); }
.pied { background: var(--fond); }

@media (max-width: 1080px) {
  .hero { grid-template-columns: 1fr; padding-top: 104px; min-height: 0; }
  .hero-texte { padding: 0; margin-bottom: 36px; }
  .hero-visuel { height: 64svh; min-height: 420px; }
  .hero-carte { left: 16px; right: 16px; bottom: 16px; }
}
@media (max-width: 560px) {
  .hero { padding: 92px 16px 24px; }
  .hero-titre { font-size: 58px; margin: 16px 0 18px; }
  .hero-accroche { font-size: 17px; }
  .hero-actions { margin-top: 26px; }
  .hero-actions .bouton { flex: 1; padding: 0 14px; }
  .hero-visuel { height: 72svh; min-height: 470px; margin-inline: -16px; }
  .hero-carte { left: 12px; right: 12px; bottom: 12px; padding: 18px; }
  .contact { padding: 72px 0; }
}
