/*
  Responsive production 1920.
  La référence desktop pleine largeur est 1920 × 1080. Aucun ancien cap intermédiaire.
*/

/* -------------------------------------------------------------------------- */
/* Laptop / desktop intermédiaire — 1200 à 1599 px                             */
/* -------------------------------------------------------------------------- */
@media (min-width: 1200px) and (max-width: 1599px) {
  .hero__content {
    inset-inline-start: clamp(58px, 5vw, 80px);
    inset-block-start: clamp(170px, 14vw, 220px);
    inline-size: clamp(520px, 45vw, 620px);
  }

  .hero__actions { inset-block-start: clamp(420px, 35vw, 472px); }

  .intro-split__statement {
    inset-inline-start: 38%;
    inline-size: 32%;
  }

  .intro-split__copy {
    inline-size: 21%;
  }

  .signatures__list {
    padding-block-start: 24px;
  }

  .signature-item {
    padding-inline: 14px;
  }

  .signature-item__text {
    font-size: 11px;
  }

  .collection-card__content {
    padding-inline: 14px;
  }

  .collection-card__title {
    font-size: clamp(20px, 1.8vw, 24px);
  }

  .collection-card__text {
    font-size: 11px;
  }

  .invitation__content {
    inset-inline-start: 52%;
    inline-size: 24%;
  }

  .invitation__event-box {
    inline-size: 19%;
  }
}


/* -------------------------------------------------------------------------- */
/* Tablette paysage — 768 à 1199 px                                             */
/* -------------------------------------------------------------------------- */
@media (min-width: 768px) and (max-width: 1199px) {
  body { overflow-x: hidden; }

  .page-shell {
    inline-size: 100%;
    max-inline-size: none;
  }

  .site-header {
    block-size: 120px;
  }

  .brand {
    inset-inline-start: 32px;
    inset-block-start: 26px;
    inline-size: 280px;
  }

  .brand__mark {
    flex-basis: 58px;
    inline-size: 58px;
    block-size: 70px;
  }

  .brand__text {
    inline-size: 190px;
    font-size: 26px;
  }

  .site-header__actions {
    inset-inline-end: 32px;
    inset-block-start: 32px;
    inline-size: 230px;
    block-size: 48px;
  }

  .hero {
    min-block-size: clamp(680px, 78vw, 820px);
    block-size: auto;
  }

  .hero__asset-slot {
    background-position: 68% 50%;
  }

  .hero__video {
    object-position: 58% 54%;
  }

  .hero__overlay {
    background:
      linear-gradient(90deg, rgba(5, 4, 3, .98) 0%, rgba(5, 4, 3, .88) 44%, rgba(5, 4, 3, .36) 100%),
      linear-gradient(180deg, rgba(0, 0, 0, .28), rgba(0, 0, 0, .68));
  }

  .hero__content {
    inset-inline-start: 48px;
    inset-block-start: 180px;
    inline-size: min(58vw, 560px);
    min-block-size: 470px;
  }

  .hero__title {
    font-size: clamp(54px, 6.3vw, 72px);
  }

  .hero__title span {
    font-size: clamp(15px, 1.8vw, 18px);
    letter-spacing: .34em;
  }

  .hero__body {
    inline-size: min(100%, 460px);
    font-size: 14px;
  }

  .hero__actions {
    inset-block-start: 420px;
    gap: 28px;
  }

  .hero__actions .button--primary {
    inline-size: 245px;
    block-size: 50px;
  }

  .video-trigger {
    inline-size: 185px;
    block-size: 50px;
  }

  .intro-split {
    block-size: auto;
    min-block-size: 420px;
    display: grid;
    grid-template-columns: 42% 1fr;
    gap: 32px;
    padding: 54px 32px;
  }

  .intro-split__media,
  .intro-split__statement,
  .intro-split__copy {
    position: relative;
    inset: auto;
    inline-size: auto;
  }

  .intro-split__media {
    min-block-size: 312px;
  }

  .intro-split__statement {
    align-self: start;
    text-align: left;
  }

  .intro-split__quote {
    font-size: clamp(24px, 3.4vw, 32px);
  }

  .intro-split__ornament {
    margin-inline-start: 0;
  }

  .intro-split__copy {
    grid-column: 2;
    margin-block-start: -126px;
    padding-inline-start: 0;
    font-size: 14px;
  }

  .intro-split__copy::before {
    display: none;
  }

  .signatures {
    block-size: auto;
    padding: 48px 32px 56px;
  }

  .signatures__panel {
    position: relative;
    inset: auto;
    inline-size: 100%;
    block-size: auto;
    min-block-size: 0;
    padding: 68px 28px 34px;
  }

  .signatures__header {
    inset-block-start: 26px;
  }

  .signatures__list {
    position: relative;
    inset: auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 36px 0;
    block-size: auto;
    padding: 0;
  }

  .signature-item + .signature-item::before {
    display: none;
  }

  .signature-item {
    padding-inline: 20px;
  }

  .signature-item__icon {
    inline-size: 62px;
    block-size: 62px;
  }

  .collection-heading {
    block-size: 128px;
  }

  .collection-heading__title-row {
    inline-size: min(640px, 78vw);
  }

  .collection-heading__controls {
    inset-inline-end: 32px;
  }

  .collection {
    block-size: auto;
    padding: 0 32px 64px;
  }

  .collection__viewport {
    position: relative;
    inset: auto;
    inline-size: 100%;
    block-size: auto;
    overflow: visible;
  }

  .collection__list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    block-size: auto;
  }

  .collection-card,
  .collection-card:nth-child(4),
  .collection-card:nth-child(8) {
    block-size: 380px;
  }

  .collection-card__media {
    block-size: 100%;
  }

  .collection-card__content {
    padding: 76px 18px 30px;
  }

  .collection-card__title {
    font-size: 24px;
  }

  .collection-card__text {
    font-size: 13px;
  }

  .collection-card__cta {
    opacity: 1;
    pointer-events: auto;
  }

  .invitation {
    block-size: auto;
    min-block-size: 310px;
    display: grid;
    grid-template-columns: 46% 1fr;
    gap: 32px;
    padding: 46px 32px;
  }

  .invitation__media,
  .invitation__content,
  .invitation__event-box {
    position: relative;
    inset: auto;
    inline-size: auto;
  }

  .invitation__media {
    min-block-size: 240px;
    grid-row: span 2;
  }

  .invitation__content {
    align-self: end;
  }

  .invitation__event-box {
    block-size: auto;
    min-block-size: 166px;
  }

  .site-footer__links {
    display: none;
  }
}

/* -------------------------------------------------------------------------- */
/* Tablette portrait — 600 à 767 px                                             */
/* -------------------------------------------------------------------------- */
@media (min-width: 600px) and (max-width: 767px) {
  .site-header {
    block-size: 108px;
  }

  .brand {
    inset-inline-start: 24px;
    inset-block-start: 22px;
    inline-size: 250px;
  }

  .brand__mark {
    flex-basis: 50px;
    inline-size: 50px;
    block-size: 60px;
  }

  .brand__text {
    inline-size: 170px;
    font-size: 22px;
  }

  .site-header__actions {
    inset-inline-end: 24px;
    inset-block-start: 29px;
    inline-size: 200px;
    block-size: 46px;
  }

  .button--header {
    font-size: 9px;
    letter-spacing: .14em;
  }

  .hero {
    min-block-size: 720px;
    block-size: auto;
  }

  .hero__asset-slot {
    background-position: 72% 50%;
  }

  .hero__video {
    object-position: 50% 50%;
  }

  .hero__overlay {
    background:
      linear-gradient(90deg, rgba(5,4,3,.96), rgba(5,4,3,.74)),
      linear-gradient(180deg, rgba(0,0,0,.24), rgba(0,0,0,.74));
  }

  .hero__content {
    inset-inline: 32px;
    inset-block-start: 170px;
    inline-size: auto;
    min-block-size: 500px;
  }

  .hero__title {
    font-size: clamp(48px, 8vw, 60px);
  }

  .hero__title span {
    font-size: 14px;
    letter-spacing: .28em;
  }

  .hero__body {
    max-inline-size: 520px;
    font-size: 15px;
  }

  .hero__actions {
    inset-block-start: 440px;
  }

  .intro-split,
  .invitation {
    display: grid;
    gap: 28px;
    block-size: auto;
    padding: 42px 32px;
  }

  .intro-split__media,
  .intro-split__statement,
  .intro-split__copy,
  .invitation__media,
  .invitation__content,
  .invitation__event-box {
    position: relative;
    inset: auto;
    inline-size: auto;
  }

  .intro-split__media,
  .invitation__media {
    min-block-size: 260px;
  }

  .intro-split__statement { text-align: center; }
  .intro-split__quote { font-size: 29px; }
  .intro-split__copy { font-size: 15px; }
  .intro-split__copy::before { display: none; }

  .signatures {
    block-size: auto;
    padding: 42px 32px;
  }

  .signatures__panel {
    position: relative;
    inset: auto;
    inline-size: 100%;
    block-size: auto;
    padding: 68px 24px 34px;
  }

  .signatures__header {
    inset-block-start: 24px;
  }

  .signatures__list {
    position: relative;
    inset: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px 0;
    block-size: auto;
    padding: 0;
  }

  .signature-item + .signature-item::before { display: none; }

  .collection-heading {
    block-size: 130px;
  }

  .collection-heading__title-row {
    inline-size: calc(100% - 64px);
  }

  .collection-heading__controls {
    display: none;
  }

  .collection {
    block-size: auto;
    padding-block-end: 58px;
  }

  .collection__viewport {
    position: relative;
    inset: auto;
    inline-size: 100%;
    block-size: auto;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 32px;
    padding-inline: 32px;
    scrollbar-width: thin;
  }

  .collection__list {
    display: flex;
    gap: var(--space-scroll-snap-gap);
    inline-size: max-content;
    block-size: auto;
  }

  .collection-card,
  .collection-card:nth-child(4),
  .collection-card:nth-child(8) {
    flex: 0 0 min(72vw, 260px);
    inline-size: min(72vw, 260px);
    block-size: 390px;
    scroll-snap-align: start;
  }

  .collection-card__media { block-size: 100%; }
  .collection-card__content { padding: 72px 20px 72px; }
  .collection-card__cta { opacity: 1; pointer-events: auto; }

  .invitation__event-box {
    min-block-size: 170px;
  }
}

/* -------------------------------------------------------------------------- */
/* Mobile — moins de 600 px                                                     */
/* -------------------------------------------------------------------------- */
@media (max-width: 599px) {
  .page-shell {
    inline-size: 100%;
    max-inline-size: none;
  }

  .site-header {
    block-size: 104px;
  }

  .brand {
    inset-inline-start: 18px;
    inset-block-start: 18px;
    inline-size: 210px;
    gap: 11px;
  }

  .brand__mark {
    flex-basis: 44px;
    inline-size: 44px;
    block-size: 52px;
  }

  .brand__text {
    inline-size: 148px;
    font-size: 18px;
    letter-spacing: .10em;
  }

  .site-header__actions {
    inset-inline-end: 18px;
    inset-block-start: 28px;
    inline-size: 132px;
    block-size: 44px;
	display: none;
  }

  .button--header {
    padding-inline: 8px;
    font-size: 8px;
    letter-spacing: .09em;
	display: none;
	
  }

  .hero {
    min-block-size: 720px;
    block-size: auto;
  }

  .hero__asset-slot {
    background-position: 74% 50%;
  }

  .hero__video {
    object-position: 50% 50%;
  }

  .hero__overlay {
    /* background: */
      /* linear-gradient(90deg, rgba(5,4,3,.97), rgba(5,4,3,.80)), */
      /* linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,.78)); */
  }

  .hero__content {
    inset-inline: 20px;
    inset-block-start: 150px;
    inline-size: auto;
    min-block-size: 540px;
  }

  .hero__eyebrow {
    margin-block-end: 22px;
    font-size: 10px;
    letter-spacing: .18em;
  }

  .hero__title {
    font-size: clamp(40px, 11vw, 50px);
    line-height: .96;
    letter-spacing: 0.03em;
  }

  .hero__title span {
    margin-block-start: 14px;
    font-size: 12px;
    letter-spacing: .22em;
  }

  .hero__body {
    max-inline-size: 100%;
    margin-block-start: 24px;
    font-size: 15px;
    line-height: 1.7;
  }

  .hero__credit {
    font-size: 14px;
  }

  .hero__actions {
    inset-inline: 0;
    inset-block-start: 470px;
    display: grid;
    gap: 16px;
  }

  .hero__actions .button--primary,
  .video-trigger {
    inline-size: min(100%, 320px);
    block-size: 48px;
  }

  .video-trigger {
    justify-content: flex-start;
  }

  .video-trigger__icon {
    flex-basis: 48px;
    inline-size: 48px;
    block-size: 48px;
  }

  .intro-split,
  .invitation {
    display: grid;
    gap: 26px;
    block-size: auto;
    padding: 38px 20px;
  }

  .intro-split__media,
  .intro-split__statement,
  .intro-split__copy,
  .invitation__media,
  .invitation__content,
  .invitation__event-box {
    position: relative;
    inset: auto;
    inline-size: auto;
  }

  .intro-split__media,
  .invitation__media {
    min-block-size: 230px;
  }

  .intro-split__statement {
    text-align: center;
  }

  .intro-split__quote {
    font-size: clamp(24px, 7vw, 30px);
    letter-spacing: .10em;
  }

  .intro-split__copy {
    font-size: 15px;
  }

  .intro-split__copy::before {
    display: none;
  }

  .signatures {
    block-size: auto;
    padding: 38px 20px;
  }

  .signatures__panel {
    position: relative;
    inset: auto;
    inline-size: 100%;
    block-size: auto;
    padding: 68px 20px 28px;
  }

  .signatures__header {
    inset-block-start: 24px;
  }

  .signatures__eyebrow {
    gap: 12px;
    font-size: 11px;
    letter-spacing: .16em;
  }

  .signatures__list {
    position: relative;
    inset: auto;
    grid-template-columns: 1fr;
    gap: 26px;
    block-size: auto;
    padding: 0;
  }

  .signature-item {
    padding: 0 10px 24px;
  }

  .signature-item + .signature-item::before {
    display: none;
  }

  .signature-item:not(:last-child)::after {
    content: "";
    position: absolute;
    inset-inline: 22%;
    inset-block-end: 0;
    block-size: 1px;
    background: linear-gradient(90deg, transparent, rgba(184,134,69,.34), transparent);
  }

  .signature-item__icon {
    inline-size: 52px;
    block-size: 52px;
    margin-block-end: 14px;
  }

  .signature-item__text {
    max-inline-size: 240px;
    font-size: 13px;
  }

  .collection-heading {
    block-size: 132px;
  }

  .collection-heading__eyebrow {
    inset-block-start: 18px;
  }

  .collection-heading__title-row {
    inset-block-start: 50px;
    inline-size: calc(100% - 40px);
    gap: 14px;
  }

  .collection-heading__title {
    font-size: clamp(24px, 7vw, 30px);
    letter-spacing: .055em;
  }

  .collection-heading__text {
    inset-block-start: 108px;
    padding-inline: 20px;
    font-size: 11px;
  }

  .collection-heading__controls {
    display: none;
  }

  .collection {
    block-size: auto;
    padding-block-end: 52px;
  }

  .collection__viewport {
    position: relative;
    inset: auto;
    inline-size: 100%;
    block-size: auto;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 20px;
    padding-inline: 20px;
    scrollbar-width: none;
  }

  .collection__viewport::-webkit-scrollbar {
    display: none;
  }

  .collection__list {
    display: flex;
    gap: var(--space-scroll-snap-gap);
    inline-size: max-content;
    block-size: auto;
  }

  .collection-card,
  .collection-card:nth-child(4),
  .collection-card:nth-child(8) {
    flex: 0 0 var(--card-w-mobile);
    inline-size: var(--card-w-mobile);
    block-size: 390px;
    scroll-snap-align: start;
  }

  .collection-card__media {
    block-size: 100%;
  }

  .collection-card__content {
    padding: 72px 20px 72px;
  }

  .collection-card__title {
    font-size: 24px;
  }

  .collection-card__text {
    font-size: 13px;
  }

  .collection-card__cta {
    opacity: 1;
    pointer-events: auto;
  }

  .invitation__title {
    font-size: 27px;
  }

  .invitation__proofs,
  .invitation__event-box p {
    font-size: 13px;
  }

  .invitation__event-box {
    min-block-size: 172px;
    padding-block-end: 62px;
  }

  .invitation__cta {
    block-size: 50px;
  }

  .site-footer {
    block-size: 84px;
  }

  .site-footer__inner {
    align-items: center;
    padding: 0 20px;
    text-align: center;
  }

  .site-footer__links {
    display: none;
  }
}


/* -------------------------------------------------------------------------- */
/* Texture globale — ajustements responsive                                   */
/* -------------------------------------------------------------------------- */
@media (max-width: 1199px) {
  .page-shell {
    background-size: auto, var(--texture-page-size-tablet);
  }

  .intro-split,
  .signatures,
  .collection-heading,
  .collection,
  .invitation {
    background: transparent;
  }
}

@media (max-width: 768px) {
  .page-shell {
    background-size: auto, var(--texture-page-size-mobile);
  }

  .intro-split__media,
  .invitation__media {
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 68%, rgba(0, 0, 0, .70) 82%, transparent 100%);
    mask-image: linear-gradient(180deg, #000 0%, #000 68%, rgba(0, 0, 0, .70) 82%, transparent 100%);
  }
}