@charset "utf-8";



.prose-hero { --hero-pad-x: 50px; }



.prose-hero { position: relative; width: 100%; max-width: 1448px; margin: 0px auto; border-radius: 16px; overflow: hidden; min-height: 530px; display: flex; align-items: center; padding: 62px var(--hero-pad-x); box-sizing: border-box; background-image: linear-gradient(to right, rgba(10, 10, 10, 0.82) 0%, rgba(10, 10, 10, 0.55) 38%, rgba(10, 10, 10, 0) 68%), url(Faites_assembler_votre_future_montre.jpg); background-size: cover, cover; background-position: center center, center center; background-repeat: no-repeat, no-repeat; }



.prose-hero__content { position: relative; z-index: 2; max-width: 960px; color: rgb(255, 255, 255); }



.prose-hero__rating { display: flex; align-items: center; gap: 8px; margin-bottom: 20px; }



.prose-hero__stars { display: inline-flex; gap: 2px; }



.prose-hero__stars span { width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; background: rgb(0, 182, 122); border-radius: 2px; }



.prose-hero__stars span.half { background: linear-gradient(90deg, rgb(0, 182, 122) 50%, rgb(220, 220, 230) 50%); }



.prose-hero__stars svg { width: 13px; height: 13px; fill: rgb(255, 255, 255); }



.prose-hero__rating-text { font-size: 14px; font-weight: 600; color: rgb(255, 255, 255); opacity: 0.95; }



.prose-hero__heading { font-family: inherit; font-weight: 900; font-size: clamp(2.2rem, 4.3vw, 52px); line-height: 1.08; margin: 0px; color: rgb(255, 255, 255); text-transform: uppercase; }



.prose-hero__heading span { white-space: nowrap; }



.prose-hero__h--mobile { display: none; }



.prose-hero__h--desktop { display: inline; }



.prose-hero__tag { display: inline-block; margin-top: 18px; color: rgb(18, 18, 18); font-family: inherit; font-weight: 700; font-size: clamp(1rem, 1.5vw, 1.35rem); line-height: 1.2; padding: 9px 18px; border-radius: 3px; white-space: nowrap; transform: rotate(-2.6deg); transform-origin: left center; }



.prose-hero__desc { margin-top: 26px; max-width: 540px; font-family: inherit; font-weight: 400; font-size: clamp(1rem, 1.1vw, 1.15rem); line-height: 1.45; color: rgb(255, 255, 255); }



.prose-hero__buttons { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 26px; }



.prose-hero__btn { display: inline-block; font-family: inherit; font-size: 15px; font-weight: 700; letter-spacing: 0.02em; padding: 14px 28px; text-decoration: none; border-radius: 0px; transition: opacity 0.2s, background 0.2s, color 0.2s; cursor: pointer; }



.prose-hero__btn--primary { background: rgb(255, 255, 255); color: rgb(18, 18, 18); border: 2px solid rgb(255, 255, 255); }



.prose-hero__btn--primary:hover { opacity: 0.85; }



.prose-hero__btn--secondary { background: transparent; color: rgb(255, 255, 255); border: 2px solid rgb(255, 255, 255); }



.prose-hero__btn--secondary:hover { background: rgb(255, 255, 255); color: rgb(18, 18, 18); }



@media (max-width: 749px) {

  .prose-hero { --hero-pad-x: 24px; min-height: 0px; align-items: stretch; padding: 52vw var(--hero-pad-x) 40px; border-radius: 12px; background-color: rgb(10, 10, 10); background-image: linear-gradient(rgba(10, 10, 10, 0) 0%, rgba(10, 10, 10, 0) 20%, rgba(10, 10, 10, 0.85) 31%, rgb(10, 10, 10) 42%), url(); background-size: cover, cover; background-position: center center, center top; background-repeat: no-repeat, no-repeat; }

  .prose-hero__content { max-width: none; width: 100%; }

  .prose-hero__heading { font-size: 8vw; line-height: 1.04; }

  .prose-hero__h--desktop { display: none; }

  .prose-hero__h--mobile { display: inline; }

  .prose-hero__tag { font-size: 3.9vw; padding: 7px 14px; margin-top: 14px; }

  .prose-hero__desc { max-width: none; text-align: center; margin-top: 34px; font-size: 4.2vw; }

  .prose-hero__buttons { flex-direction: column; align-items: stretch; gap: 12px; margin-top: 22px; }

  .prose-hero__btn { text-align: center; padding: 16px 20px; }

}