/* ===== Accueil : on pousse les portes du domaine ===== */
.doors { position: relative; background: #2a241f; }
.doors__stage { position: relative; height: 100svh; overflow: hidden; }
.doors__inside { position: absolute; inset: 0; z-index: 1; overflow: hidden; background: #1b1510; }
.doors__inside img, .doors__inside video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.35); transform-origin: 50% 55%; }
.doors__warm { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(ellipse 30% 45% at 50% 56%, rgba(255, 196, 120, .55), rgba(255, 170, 90, .18) 55%, rgba(40, 24, 12, .35) 100%); mix-blend-mode: soft-light; }
.doors__inside::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20, 14, 10, .35), rgba(20, 14, 10, .12) 40%, rgba(20, 14, 10, .6)); }
.doors__scene {
  position: absolute; left: 50%; top: 50%; z-index: 2;
  width: max(100vw, calc(100svh * 1.7917)); aspect-ratio: 2752 / 1536;
  transform-origin: 50.47% 56.45%; will-change: transform;
}
.doors__scene > img.doors__base { position: absolute; inset: 0; width: 100%; height: 100%; }
.doors__hole { position: absolute; left: 35.03%; top: 16.93%; width: 30.89%; height: 79.04%; perspective: 1800px; perspective-origin: 50% 45%; }
.doors__glow { position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 40%, #ffe3b0 0%, #f2b86b 30%, #8a5626 70%, #3b2414 100%); }
.doors__leaf { position: absolute; top: 0; bottom: 0; background-size: 100% 100%; background-repeat: no-repeat; backface-visibility: hidden; will-change: transform; box-shadow: 0 0 0 .5px rgba(60, 44, 30, .25); }
.doors__leaf--l { left: 0; width: 50.36%; transform-origin: 0% 50%; background-image: url("/assets/img/portes/battant-l-2752.webp"); }
.doors__leaf--r { right: 0; width: 49.64%; transform-origin: 100% 50%; background-image: url("/assets/img/portes/battant-r-2752.webp"); }
@media (max-width: 900px) {
  .doors__leaf--l { background-image: url("/assets/img/portes/battant-l-1600.webp"); }
  .doors__leaf--r { background-image: url("/assets/img/portes/battant-r-1600.webp"); }
}
.doors__leaf::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 35%, rgba(255, 196, 120, .55), rgba(255, 170, 90, 0) 60%); mix-blend-mode: screen; animation: flicker 3.2s infinite steps(1, end); opacity: .55; }
.doors__leaf--r::before { animation-delay: -1.3s; }
.doors__leaf::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(30, 20, 12, .0), rgba(30, 20, 12, .6)); opacity: var(--sh, 0); }
.doors__leaf--r::after { background: linear-gradient(270deg, rgba(30, 20, 12, .0), rgba(30, 20, 12, .6)); }
.doors__seam { position: absolute; left: 50.36%; top: 2%; bottom: 2%; width: 2px; margin-left: -1px; background: linear-gradient(180deg, transparent, #ffd99c 18%, #ffe9c4 50%, #ffd99c 82%, transparent); box-shadow: 0 0 18px 4px rgba(255, 200, 120, .55), 0 0 60px 12px rgba(255, 180, 90, .25); opacity: .35; }
@keyframes flicker { 0% { opacity: .5; } 12% { opacity: .62; } 24% { opacity: .48; } 41% { opacity: .58; } 57% { opacity: .5; } 73% { opacity: .66; } 88% { opacity: .52; } }
.doors__bloom { position: absolute; inset: 0; z-index: 3; pointer-events: none; background: radial-gradient(ellipse at 50% 56%, rgba(255, 236, 205, .95), rgba(255, 210, 150, .55) 35%, rgba(255, 200, 140, 0) 70%); opacity: 0; mix-blend-mode: screen; }
.doors__shade { position: absolute; inset: 0; z-index: 3; pointer-events: none; background: linear-gradient(180deg, rgba(25, 18, 12, .5) 0%, rgba(25, 18, 12, 0) 24%, rgba(25, 18, 12, 0) 66%, rgba(25, 18, 12, .62) 100%), radial-gradient(ellipse at 50% 55%, rgba(0, 0, 0, 0) 40%, rgba(25, 18, 12, .5) 100%); }

.doors__ui { position: absolute; inset: 0; z-index: 4; pointer-events: none; color: var(--paper); }
.doors__top { position: absolute; left: 0; right: 0; top: calc(var(--header-h) + 2vh); text-align: center; }
.doors__top .eyebrow { color: var(--paper); text-shadow: 0 1px 12px rgba(0, 0, 0, .35); }
.doors__top .eyebrow::before { background: var(--paper); }
.doors__word { position: absolute; top: 50%; font-family: var(--f-serif); font-weight: 300; font-size: clamp(3.6rem, 8.6vw, 10.5rem); line-height: .86; letter-spacing: -.02em; text-shadow: 0 4px 40px rgba(20, 12, 6, .45), 0 1px 2px rgba(20, 12, 6, .3); white-space: nowrap; }
.doors__word em { font-style: italic; }
.doors__word--l { right: calc(50% + 17vw); transform: translateY(-50%); text-align: right; }
.doors__word--r { left: calc(50% + 17vw); transform: translateY(-50%); }
.doors__word .ch { display: inline-block; }
.doors__script { position: absolute; left: 50%; top: calc(50% + clamp(3rem, 7vw, 8rem)); transform: translateX(-50%); font-family: var(--f-script); font-size: clamp(2.4rem, 4.6vw, 5rem); color: var(--gold-2); text-shadow: 0 2px 26px rgba(20, 12, 6, .55); white-space: nowrap; display: none; }
.doors__cue { position: absolute; left: 50%; bottom: 4.5vh; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 14px; pointer-events: auto; }
.doors__cue span { font-size: .7rem; letter-spacing: .34em; text-transform: uppercase; font-weight: 500; text-shadow: 0 1px 10px rgba(0, 0, 0, .4); }
.doors__cue i { position: relative; width: 1px; height: 54px; background: rgba(247, 242, 234, .35); overflow: hidden; }
.doors__cue i::after { content: ""; position: absolute; left: 0; top: -40%; width: 1px; height: 40%; background: var(--paper); animation: cue 2.2s var(--ease-in-out) infinite; }
@keyframes cue { to { top: 110%; } }
.doors__credit { position: absolute; left: var(--gutter); bottom: 4.5vh; margin: 0; font-size: .58rem; letter-spacing: .22em; text-transform: uppercase; font-weight: 500; color: rgba(247, 242, 234, .72); text-shadow: 0 1px 8px rgba(0, 0, 0, .45); }
.doors__enter { pointer-events: auto; margin-top: 4px; font-size: .64rem; letter-spacing: .3em; text-transform: uppercase; color: var(--paper); border-bottom: 1px solid rgba(247, 242, 234, .5); padding-bottom: 4px; }

.doors__after { background: radial-gradient(ellipse 60% 50% at 50% 50%, rgba(20, 14, 10, .55), rgba(20, 14, 10, 0) 75%); position: absolute; inset: 0; z-index: 5; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: var(--paper); pointer-events: none; padding-inline: var(--gutter); opacity: 0; }
.doors__after .eyebrow { color: var(--gold-2); justify-content: center; }
.doors__after .eyebrow::before { display: none; }
.doors__after h1 { color: var(--paper); margin-top: 22px; font-size: clamp(3.4rem, 9vw, 10rem); line-height: .88; text-shadow: 0 6px 60px rgba(10, 6, 2, .45); }
.doors__after h1 em { color: var(--gold-2); }
.doors__after p { margin-top: 28px; max-width: 560px; font-family: var(--f-serif); font-size: clamp(1.2rem, 1.7vw, 1.6rem); line-height: 1.4; color: var(--sand); }
.doors__seal { position: absolute; right: var(--gutter); bottom: 5vh; color: var(--gold-2); }
.doors__seal .seal__core b { color: var(--paper); }
.doors__seal .seal__core span { color: var(--gold-2); }

@media (max-width: 900px) {
  .doors__word { font-size: clamp(3rem, 14vw, 5.4rem); top: auto; }
  .doors__word--l { right: auto; left: 50%; top: calc(var(--header-h) + 7vh); transform: translateX(-50%); text-align: center; }
  .doors__word--r { left: 50%; top: calc(var(--header-h) + 7vh + 1em); transform: translateX(-50%); text-align: center; }
  .doors__top { display: none; }
  .doors__credit { left: 50%; transform: translateX(-50%); bottom: 1.4vh; white-space: nowrap; font-size: .52rem; }
  .doors__cue { bottom: 6.5vh; }
  .doors__seal { display: none; }
}
html.no-anim .doors { height: auto; }
html.no-anim .doors__after { opacity: 1; }
html.no-anim .doors__scene, html.no-anim .doors__ui { display: none; }
html.no-anim .doors__inside img { transform: none; }

/* manifeste avec vignettes dans le texte */
.manif { font-family: var(--f-serif); font-weight: 300; font-size: clamp(2.1rem, 4.4vw, 4.9rem); line-height: 1.08; letter-spacing: -.015em; color: var(--ink); max-width: 1320px; }
.manif em { color: var(--caramel); }
.manif .inl { display: inline-block; vertical-align: middle; width: 1.9em; height: .92em; border-radius: 999px; overflow: hidden; margin: -.1em .12em 0; background: var(--sand); }
.manif .inl img { width: 100%; height: 100%; object-fit: cover; }
.manif .inl--arch { width: .8em; height: 1em; border-radius: 999px 999px 0 0; }

/* cartes empilées des espaces */
.spaces { position: relative; }
.space { position: sticky; top: 0; height: 100svh; display: grid; place-items: center; overflow: hidden; }
.space__card { position: relative; width: min(1380px, calc(100vw - 2 * var(--gutter))); height: min(80svh, 820px); display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); background: #FBF8F2; box-shadow: 0 50px 120px -60px rgba(42, 29, 22, .55); overflow: hidden; transform-origin: 50% 0; }
.space:nth-child(2) .space__card { background: var(--cacao); color: var(--paper); }
.space:nth-child(3) .space__card { background: #E6E6DA; }
.space:nth-child(4) .space__card { background: var(--night); color: var(--paper); }
.space__media { position: relative; overflow: hidden; }
.space__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.space__body { display: flex; flex-direction: column; justify-content: space-between; padding: clamp(28px, 4vw, 64px); }
.space__no { font-family: var(--f-serif); font-style: italic; font-size: clamp(3.4rem, 6vw, 6rem); line-height: .8; color: var(--caramel); }
.space:nth-child(2) .space__no, .space:nth-child(4) .space__no { color: var(--gold-2); }
.space__body h3 { font-size: clamp(2.2rem, 3.8vw, 4rem); line-height: .95; color: inherit; margin: 18px 0 18px; }
.space__body p { opacity: .82; margin-bottom: 26px; }
.space__facts { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 26px; }
.space__facts span { padding: 7px 14px; border: 1px solid currentColor; border-radius: 999px; font-size: .64rem; letter-spacing: .2em; text-transform: uppercase; opacity: .7; }
.space:nth-child(2) .link-u, .space:nth-child(4) .link-u { color: var(--paper); }
@media (max-width: 900px) {
  .space__card { grid-template-columns: 1fr; grid-template-rows: 46% 54%; height: 84svh; }
  .space__body { padding: 24px; }
  .space__body p { font-size: .92rem; margin-bottom: 14px; }
}

/* journée : ciel qui passe du jour à la nuit */
.day { position: relative; background: #F3E9DA; overflow: clip; }
.day__orbwrap { position: sticky; top: 0; height: 100vh; margin-bottom: -100vh; pointer-events: none; z-index: 1; }
.day__sky { position: absolute; inset: 0; z-index: 0; }
.day__stars { z-index: 0; }
.day__stars { position: absolute; inset: 0; z-index: 0; opacity: 0; background-image: radial-gradient(1px 1px at 20% 30%, #fff, transparent), radial-gradient(1px 1px at 70% 20%, #fff, transparent), radial-gradient(1.5px 1.5px at 40% 70%, #fff, transparent), radial-gradient(1px 1px at 85% 60%, #fff, transparent), radial-gradient(1px 1px at 10% 80%, #fff, transparent), radial-gradient(1.5px 1.5px at 55% 45%, #fff, transparent), radial-gradient(1px 1px at 30% 10%, #fff, transparent), radial-gradient(1px 1px at 92% 85%, #fff, transparent); background-size: 520px 520px; }
.day__orb { position: absolute; z-index: 0; left: 8vw; top: 30vh; width: clamp(90px, 10vw, 150px); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 40% 40%, #fff6dc, #f7cf83 60%, #e9a95b); box-shadow: 0 0 80px 20px rgba(247, 207, 131, .45); }
.day__in { position: relative; z-index: 2; }
.day__row { display: grid; grid-template-columns: 220px minmax(0, 1fr) minmax(0, 1fr); gap: clamp(20px, 4vw, 70px); align-items: center; padding: clamp(40px, 6vh, 80px) 0; border-top: 1px solid currentColor; border-color: rgba(42, 29, 22, .16); }
.day__h { font-family: var(--f-serif); font-weight: 300; font-size: clamp(3.6rem, 7vw, 7.4rem); line-height: .9; letter-spacing: -.03em; }
.day__h small { display: block; font-family: var(--f-sans); font-size: .66rem; letter-spacing: .28em; text-transform: uppercase; margin-top: 12px; opacity: .7; font-weight: 500; }
.day__row h3 { font-size: clamp(1.9rem, 3vw, 3.2rem); color: inherit; margin-bottom: 14px; }
.day__row p { margin: 0; opacity: .8; }
.day__row .ph { aspect-ratio: 4/3; border-radius: 4px; }
.day.is-night { color: var(--paper); }
.day.is-night .day__row { border-color: rgba(247, 242, 234, .16); }
.day.is-night h2, .day.is-night h3 { color: var(--paper); }
@media (max-width: 900px) { .day__row { grid-template-columns: 1fr; } .day__row .ph { max-width: 520px; } }

/* galerie : colonnes à vitesses différentes */
.cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 24px); }
.cols__c { display: flex; flex-direction: column; gap: clamp(12px, 1.6vw, 24px); }
.cols__c:nth-child(2) { margin-top: 18vh; }
.cols .ph { border-radius: 2px; }
.cols .ph:nth-child(odd) { aspect-ratio: 3/4; }
.cols .ph:nth-child(even) { aspect-ratio: 4/3; }
@media (max-width: 760px) { .cols { grid-template-columns: 1fr 1fr; } .cols__c:nth-child(3) { display: none; } .cols__c:nth-child(2) { margin-top: 10vh; } }

/* ===== Lot 4 : smartphone sans portes, contenus condensés ===== */
@media (max-width: 768px) {
  .doors__scene, .doors__ui, .doors__shade, .doors__bloom, .doors__warm { display: none !important; }
  .doors__stage { height: 86svh; }
  .doors__after { opacity: 1 !important; padding-top: calc(var(--header-h) + var(--band-h)); }
  .doors__inside img, .doors__inside video { transform: none !important; }
  /* les espaces : une rangée à faire glisser au lieu de quatre écrans empilés */
  .spaces { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 8px var(--gutter) 34px; scrollbar-width: none; }
  .spaces::-webkit-scrollbar { display: none; }
  .space { position: relative; top: auto; height: auto; flex: 0 0 84vw; scroll-snap-align: center; display: block; }
  .space__card { width: 100%; height: auto; grid-template-rows: auto auto; }
  .space__media { aspect-ratio: 4 / 3; }
  .space__body { padding: 20px; }
  .space__no { font-size: 2.6rem; }
  .space__body h3 { margin: 10px 0; font-size: 2rem; }
  /* la journée : sans les photos, pour réduire le défilement */
  .day__row { padding: 26px 0; gap: 8px; }
  .day__row .ph { display: none; }
  .day__h { font-size: 3rem; }
}

/* Correctifs mobile du 04/11 : galerie de l accueil en grille carrée (cette feuille est chargée après main.css) */
@media (max-width: 768px) {
  .cols { grid-template-columns: 1fr 1fr; gap: 10px; }
  .cols__c { display: contents; margin-top: 0 !important; transform: none !important; }
  .cols__c:nth-child(3) { display: none; }
  .cols .ph, .cols .ph:nth-child(odd), .cols .ph:nth-child(even) { aspect-ratio: 1 !important; width: 100% !important; margin: 0 !important; }
}