/* Essai accueil : styles propres à cette page. */
.offer__item .offer__price{margin-top:.65rem;color:var(--navy);font-size:1rem;line-height:1.5}
.offer__price strong{font-size:1.3rem;font-weight:600;white-space:nowrap}
.offer__price span{display:block;font-size:.9rem;color:var(--ink-soft)}
.offer__note{max-width:65ch;margin:1.75rem 0 0;color:var(--ink-soft);font-size:.95rem;line-height:1.6}
.hero__inner{padding-block:clamp(3rem,6vh,5rem)}
.hero__title{font-size:clamp(2rem,3.3vw,3rem);line-height:1.12;max-width:21ch}
.hero__title em{color:var(--navy);text-shadow:none}
.hero .lede{margin-bottom:1.6rem;color:var(--navy)}
.hero__actions{margin-bottom:1.8rem}
.hero__experience{max-width:52ch;margin:0;line-height:1.6;color:var(--navy);font-size:1rem}
.hero__experience strong{display:block;margin-bottom:.35rem}
.hero .eyebrow{font-size:.75rem;letter-spacing:.1em}
/* Le contenu essentiel ne dépend pas de l'animation d'entrée. */
.hero .reveal,.is-ready .hero .reveal,
.hero .hero__media img,.is-ready .hero .hero__media img,
#contact .watch{opacity:1;transform:none;animation:none;transition:none}
@media (max-width:760px),(max-aspect-ratio:4/5){
  .hero{display:flex;flex-direction:column;align-items:stretch;padding-bottom:0}
  .hero__inner{order:0;padding-block:2.5rem 1rem}
  .hero__title{font-size:clamp(1.9rem,6.4vw,2.6rem);max-width:21ch;margin-bottom:1.3rem}
  .hero .eyebrow{font-size:.66rem;letter-spacing:.06em;margin-bottom:1.4rem}
  .hero .lede{font-size:1.05rem;line-height:1.5}
  .hero__actions{gap:.65rem;margin-bottom:1.5rem}
  .hero__actions .btn{padding:.85rem 1.1rem}
  .hero__experience{font-size:.95rem}
  .hero__media{order:1;width:min(100%,380px);height:320px;max-height:none;aspect-ratio:auto;align-self:center;margin:0;z-index:0}
  /* Fondu sur les quatre côtés, comme sur ordinateur, et photo un peu
     assombrie : sinon le halo du studio tranche sur le fond du hero. */
  .hero__media img{
    object-position:52% 18%;
    filter:brightness(.85);
    -webkit-mask-image:
      linear-gradient(to right,transparent 0,#000 20%,#000 80%,transparent 100%),
      linear-gradient(to bottom,transparent 0,#000 12%,#000 78%,transparent 100%);
    mask-image:
      linear-gradient(to right,transparent 0,#000 20%,#000 80%,transparent 100%),
      linear-gradient(to bottom,transparent 0,#000 12%,#000 78%,transparent 100%);
    -webkit-mask-composite:source-in;
    mask-composite:intersect;
  }
}
