/* ==========================================================================
   Page Ennov Refonte SaaS – compléments au gabarit css/pages/project.css
   ========================================================================== */

/* ---------- Hero : dégradé bleu, titre en 2 lignes, planètes (desktop) ---------- */
@media (min-width: 768px) {
  body[data-project="ennov"] .case-hero { background: linear-gradient(180deg, #ceeaff 0%, #fff 100%); }
}
.case-hero__title em { font-weight: 900; }

.cd-hero-e { left: -207.02px; top: -343.02px; width: 1682.032px; height: 1682.032px; }
.cd-hero-e > div { width: 1198px; height: 1198px; transform: rotate(128.12deg); }
.cd-hero-e img { left: -16.69%; top: -16.69%; width: 133.38%; height: 133.38%; }
.cd-hero-p { left: 102px; top: 257px; width: 1206px; height: 917px; }
.cd-hero-p > div { width: 1206px; height: 917px; transform: none; }
.cd-hero-p img { left: -5.74%; top: -16.36%; width: 111.48%; height: 107.72%; }

/* ---------- Mosaïque : écrans inclinés à -45° + barres de verre ---------- */
.case-gallery--mosaic {
  --rot: -45deg;
  --gh: 1328px;
  background-color: #ceeaff;
  background-image: conic-gradient(
    from 233deg at 58.9% 66.5%,
    rgb(204, 235, 255) -45.673%,
    rgb(167, 221, 255) -33.759%,
    rgb(131, 206, 255) -21.845%,
    rgb(94, 191, 255) -9.9309%,
    rgb(58, 176, 255) 1.9832%,
    rgb(94, 191, 255) 15.069%,
    rgb(131, 206, 255) 28.155%,
    rgb(167, 221, 255) 41.241%,
    rgb(204, 235, 255) 54.327%,
    rgb(167, 221, 255) 66.241%,
    rgb(131, 206, 255) 78.155%,
    rgb(94, 191, 255) 90.069%,
    rgb(58, 176, 255) 101.98%
  );
}
.mosaic__item--1  { left: 1116.08px; top: -141.34px; }
.mosaic__item--2  { left: 1095.57px; top: 365.65px; }
.mosaic__item--3  { left: 570.19px;  top: -159.73px; }
.mosaic__item--4  { left: 1085.67px; top: 884.67px; }
.mosaic__item--5  { left: 561px;     top: 358.58px; }
.mosaic__item--6  { left: 35.62px;   top: -166.8px; }
.mosaic__item--7  { left: 552.51px;  top: 880.43px; }
.mosaic__item--8  { left: 28.55px;   top: 353.63px; }
.mosaic__item--9  { left: -496.83px; top: -171.75px; }
.mosaic__item--10 { left: -183.59px; top: 671.83px; }
.mosaic__item--6 .mosaic__screen { filter: drop-shadow(100px 100px 125px rgba(9, 20, 50, .15)); }
.mosaic__item--8 .mosaic__screen { filter: drop-shadow(150px 50px 125px rgba(9, 20, 50, .15)); }

/* ---------- Contexte : texte + métriques centrés sur l'image ---------- */
.case-context--center { align-items: center; }
.case-context--center .metrics { margin-top: 8px; }

/* ---------- Réalisations ---------- */
.case-ux--real { padding-bottom: 0; }

/* ---------- Écran Apple Pro Display XDR ---------- */
.case-display { padding: 60px var(--gutter) 80px; }
.cd-disp-e { left: -117.24px; top: -222.07px; width: 1885.482px; height: 1593.14px; }
.cd-disp-e > div { width: 1615px; height: 993px; transform: rotate(-25.59deg); }
.cd-disp-e img { left: -12.38%; top: -19.39%; width: 124.77%; height: 139.53%; }
.cd-disp-p { left: 362.25px; top: -196.66px; width: 1532.53px; height: 1532.53px; }
.cd-disp-p > div { width: 1206px; height: 1206px; transform: rotate(71.03deg); opacity: .35; }
.cd-disp-p img { left: -5.74%; top: -12.44%; width: 111.48%; height: 99.88%; }
.display { position: relative; width: min(1078.631px, 100%); margin: 0 auto; aspect-ratio: 1078.631 / 937.223; }
.display__frame { width: 100%; height: 100%; object-fit: contain; }
.display__screen { position: absolute; left: 2.25%; top: 9.18%; width: 95.5%; height: 61.89%; display: block; object-fit: cover; }
.video-slot--screen { border-radius: 0; background: linear-gradient(135deg, #0b2a4a 0%, #1d5f9a 100%); }

/* ---------- Autres projets : cartes de même hauteur, image qui remplit (desktop) ---------- */
.case-others--fill .other-card__text { gap: 24px; }
.other-card__heading .other-card__title em { font-weight: 900; }
.other-card__heading.only-desktop { align-items: flex-start; gap: 24px; }
body[data-project="ennov"] .others { max-width: none; }
@media (min-width: 961px) {
  .case-others--fill .others { align-items: stretch; }
  .case-others--fill .other-card { height: 715.96px; }
  .case-others--fill .other-card__media { flex: 1 1 auto; aspect-ratio: auto; min-height: 0; }
}

/* ---------- Mobile (frame Figma 393 px) ---------- */
@media (max-width: 767px) {
  /* Hero */
  .case-hero__title em { font-weight: 800; }
  .cd-planet { display: none; }
  body[data-project="ennov"] .cd-hero-e { left: -157.83px; top: 30.35px; width: 975.65px; height: 974.292px; }
  body[data-project="ennov"] .cd-hero-e > div { width: 660px; height: 719px; transform: rotate(134.07deg); }
  body[data-project="ennov"] .cd-hero-e img.u-mobile { left: -30.3%; top: -27.82%; width: 160.6%; height: 155.64%; }
  body[data-project="ennov"] .cd-hero-p { left: -138.4px; top: 346.28px; width: 548.63px; height: 722.723px; transform: none; }
  body[data-project="ennov"] .cd-hero-p > div { width: 647.987px; height: 419.919px; transform: rotate(77.67deg); opacity: 1; }
  body[data-project="ennov"] .cd-hero-p img.u-mobile { left: -16.45%; top: -35.72%; width: 132.9%; height: 146.44%; }

  /* Galerie : image unique */
  .case-gallery--mosaic .case-gallery__mobile { aspect-ratio: 393 / 392.73; }

  /* Écran */
  .case-display { padding: 32px var(--gutter) 48px; }
  .case-ux--real { padding-bottom: 0; }
}
