/*
 * Nanomade — Design System V1
 * Styles réservés aux pages portant la classe .nm-v1
 */

/* =========================
   TYPOGRAPHY
   ========================= */

.nm-v1 .nm-eyebrow {
  font-family: "IBM Plex Mono", monospace;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--nm-primary, #0D3B6E);
  margin-top: 0;
  margin-bottom: 20px;
}

.nm-v1 .nm-display {
  font-family: "Source Serif 4", serif;
  font-size: 72px;
  font-weight: 600;
  line-height: 0.98;
  letter-spacing: -0.02em;
  color: var(--nm-ink, #0F1923);
  margin-top: 0;
  margin-bottom: 24px;
}

@media (max-width: 1024px) {
  .nm-v1 .nm-display {
    font-size: 58px;
  }
}

@media (max-width: 768px) {
  .nm-v1 .nm-display {
    /*
     * !important uniquement pour neutraliser
     * l'ancien override mobile global du site.
     */
    font-size: 44px !important;
    line-height: 0.98;
    font-weight: 600;
  }
}

/* Hero introduction */
.nm-v1 .nm-hero__intro {
  font-size: 20px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--nm-steel, #546E7A);
  max-width: 620px;
  margin-top: 0;
  margin-bottom: 32px;
}

@media (max-width: 768px) {
  .nm-v1 .nm-hero__intro {
    font-size: 18px !important;
  }
}

/* =========================
   HERO ACTIONS
   ========================= */

.nm-v1 .nm-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

/* Base button */
.nm-v1 .nm-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;

  padding: 14px 20px;

  font-family: "Source Sans 3", sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;

  text-decoration: none;

  border: 1px solid transparent;
  border-radius: 2px;

  transition:
    background-color 0.2s ease,
    color 0.2s ease,
    border-color 0.2s ease;
}

/* Primary */
.nm-v1 .nm-button--primary {
  background-color: var(--nm-primary, #0D3B6E);
  color: var(--nm-white, #FFFFFF);
  border-color: var(--nm-primary, #0D3B6E);
}

.nm-v1 .nm-button--primary:hover,
.nm-v1 .nm-button--primary:focus {
  background-color: var(--nm-ink, #0F1923);
  border-color: var(--nm-ink, #0F1923);
  color: var(--nm-white, #FFFFFF);
}

/* Secondary */
.nm-v1 .nm-button--secondary {
  background-color: transparent;
  color: var(--nm-ink, #0F1923);
  border-color: var(--nm-steel, #546E7A);
}

.nm-v1 .nm-button--secondary:hover,
.nm-v1 .nm-button--secondary:focus {
  background-color: var(--nm-surface, #F2F4F6);
  border-color: var(--nm-ink, #0F1923);
  color: var(--nm-ink, #0F1923);
}

@media (max-width: 600px) {
  .nm-v1 .nm-hero__actions {
    align-items: stretch;
  }

  .nm-v1 .nm-button {
    width: 100%;
  }
}

.nm-v1 .nm-hero__image {
  width: 100%;
  height: 100%;
  min-height: 520px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .nm-v1 .nm-hero__image {
    min-height: 380px;
  }
}

/* =========================
   HOMEPAGE HERO — DARK
   ========================= */

.nm-v1 .nm-home-hero {
  width: 100%;
  position: relative;
  overflow: hidden;
  background-color: #02070B;
  color: var(--nm-white, #FFFFFF);
  padding: 96px 32px;
}

@media (max-width: 1024px) {
  .nm-v1 .nm-home-hero {
    padding: 72px 24px;
  }
}

@media (max-width: 768px) {
  .nm-v1 .nm-home-hero {
    padding: 56px 20px;
  }
}

.nm-v1 .nm-container {
  width: 100%;
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
}

/* Homepage Hero — content */

.nm-v1 .nm-eyebrow--light {
  color: rgba(255, 255, 255, 0.68);
}

.nm-v1 .nm-home-hero__title {
  font-family: "Source Serif 4", serif;
  font-size: 72px;
  font-weight: 600;
  line-height: 0.98;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  margin: 0 0 28px;
}

.nm-v1 .nm-home-hero__intro {
  max-width: 520px;
  font-family: "Source Sans 3", sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.72);
  margin: 0;
}

@media (max-width: 1024px) {
  .nm-v1 .nm-home-hero__title {
    font-size: 58px;
  }
}

@media (max-width: 768px) {
  .nm-v1 .nm-home-hero__title {
    font-size: 44px !important;
  }

  .nm-v1 .nm-home-hero__intro {
    font-size: 18px !important;
  }
}

.nm-v1 .nm-home-hero__media {
  position: relative;
  overflow: hidden;
}

.nm-v1 .nm-home-hero__video,
.nm-v1 .nm-home-hero__video video {
  width: 100%;
  height: auto;
  display: block;
}

.nm-v1 .nm-home-hero__video video {
  object-fit: cover;
}

/* Homepage Hero — video */

.nm-v1 .nm-home-hero__media {
  position: relative;
  overflow: hidden;
}

.nm-v1 .nm-home-hero__video,
.nm-v1 .nm-home-hero__video video {
  width: 100%;
  height: auto;
  display: block;
}

.nm-v1 .nm-home-hero__video video {
  object-fit: cover;
}