/* ─────────────────────────────────────────────────────────────
   Jemolio — accueil : haltes simples (média d'un côté, texte de
   l'autre), logo et filigrane de l'ouverture.
   ───────────────────────────────────────────────────────────── */

/* ── haltes ── */
.halte2{padding:clamp(72px,12vh,168px) 0}
.halte2+.halte2{border-top:1px solid var(--ligne)}
.halte2__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,104px);align-items:center}
.halte2--inv .halte2__media{order:2}
.cadre-media{aspect-ratio:4/3;overflow:hidden;background:var(--velours-2);outline:1px solid var(--ligne);outline-offset:-1px}
.cadre-media--portrait{aspect-ratio:3/4;max-width:420px}
.halte2--inv .cadre-media--portrait{margin-left:auto}
.cadre-media video,.cadre-media img{width:100%;height:100%;object-fit:cover;display:block}
.repere{display:flex;align-items:center;gap:16px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--fil-or);margin-bottom:clamp(20px,3vh,36px)}
.repere i{flex:1;height:1px;background:var(--ligne)}
.repere span:last-child{color:var(--kmeja-2)}
.repere .sceau{color:var(--fil-or)}
.titre2{font-size:clamp(36px,4.6vw,66px);line-height:1.02;font-variation-settings:"opsz" 96}
.titre2 em{font-style:italic;font-weight:300;color:var(--fil-or)}
.voix2{font-family:var(--display);font-style:italic;font-weight:300;font-size:clamp(18px,1.55vw,22px);line-height:1.5;color:var(--kmeja-2);max-width:44ch;margin-top:clamp(18px,2.4vh,28px)}
.lignee{list-style:none;padding:0;margin:clamp(18px,2.4vh,28px) 0 0;display:grid;gap:8px;font-size:15px;color:var(--kmeja-2)}
.lignee li{display:flex;gap:12px;align-items:baseline}
.lignee li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--fil-or);flex:none;transform:translateY(-2px)}
.lignee b{color:var(--kmeja);font-weight:500}
.lien{display:inline-flex;align-items:center;gap:12px;margin-top:clamp(24px,3.4vh,40px);font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--kmeja);border-bottom:1px solid var(--fil-or);padding-bottom:8px;transition:color var(--dur-micro),border-color var(--dur-micro)}
.lien span{transition:transform var(--dur-micro) var(--ease-reveal)}
.lien:hover,.lien:focus-visible{color:var(--or-clair);border-bottom-color:var(--or-clair)}
.lien:hover span{transform:translateX(4px)}

/* ── ouverture : logo et filigrane du motif d'olivier (rappel du packaging) ── */
.logo-hero{width:clamp(84px,8.5vw,128px);height:auto;margin-bottom:clamp(18px,3vh,34px)}
.filigrane{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.16;background-image:url("/assets/img/motif-olivier.webp");background-size:min(60vw,720px) auto;background-repeat:repeat;background-position:center;mask-image:radial-gradient(ellipse 72% 78% at 58% 42%,#000 35%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 72% 78% at 58% 42%,#000 35%,transparent 100%)}

/* ── mouvement réduit ── */
.reduce .filigrane{opacity:.06}

/* ── responsive ── */
@media (max-width:900px){
  .halte2__grid{grid-template-columns:1fr}
  .halte2--inv .halte2__media{order:0}
  .cadre-media--portrait{max-width:min(100%,360px);margin-left:0}
}