/* =========================================================================
   ATLANTIS STRENGTH, Nouveautes / New Arrivals, page de lancement PW625
   -------------------------------------------------------------------------
   CE FICHIER A ETE REECRIT LE 2026-08-29. Il habillait sept machines
   inventees, retirees le 2026-08-28 (voir le commentaire de l'audit dans
   nouveautes/index.html), et il est reste orphelin une journee. Il sert
   maintenant la premiere vraie nouveaute du site : le PW625, appareil en T
   incline, en production a Laval.

   Ce qui a ete garde de l'ancien fichier : la vitrine .launch et les cartes
   .ncard, parce que le moteur de mouvement de main.js cite ces deux noms de
   classe dans sa liste de selecteurs et que les renommer aurait coute une
   modification de main.js pour rien. Ce qui est parti : le journal .changelog,
   qui n'annonce plus rien.

   Le noir et les gris d'atelier portent le poids, le rouge ponctue (<= 20 %),
   Integral CF pour les titres (tout en capitales), JetBrains Mono pour chaque
   modele, chiffre et cote. Reutilise tokens.css + styles.css (.cta, .btn,
   .eyebrow, .section-title) + industries.css (.crumbs, .ihero) + contact.css
   (.news). Aucun JavaScript propre a la page.
   ========================================================================= */

/* ------------------------- Hero de lancement ---------------------------- */
/* .ihero vient d'industries.css. Ici la photo est CELLE DE LA MACHINE, pas un
   fond d'ambiance : d'ou l'absence de data-hero-bank sur la section, qui
   remplacerait ce cliche par le diaporama de la banque d'images, et un voile
   plus dense a gauche pour que le texte tienne sur un cliche clair. */
.ihero--launch .ihero__scrim{
  background:linear-gradient(90deg, rgba(0,0,0,.94) 0%, rgba(0,0,0,.82) 42%, rgba(0,0,0,.34) 100%),
             linear-gradient(0deg, rgba(0,0,0,.8), rgba(0,0,0,.15) 55%);
}
.ihero--launch .ihero__title{ max-width:14ch; }

/* La ligne d'identite, sous le titre : modele, nom, gamme. Mono, parce que
   c'est une reference de catalogue et qu'elle doit se lire comme telle. */
.launchid{ display:flex; align-items:center; flex-wrap:wrap; gap:10px 14px; margin:0 0 26px; }
.launchid__code{
  font-family:var(--font-mono); font-weight:700; font-size:14px; letter-spacing:.08em;
  color:#fff; background:var(--accent); padding:6px 12px;
}
.launchid__name{
  font-family:var(--font-display); font-weight:700; font-size:clamp(15px,1.5vw,19px);
  text-transform:uppercase; letter-spacing:.02em; color:#fff;
}
.launchid__sep{ color:var(--atl-ink-600); }
.launchid__line{
  font-family:var(--font-mono); font-size:12.5px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--atl-ink-300);
}

/* Le jalon de production, une phrase et pas une promesse de date : la source
   dit « In production now », elle ne dit pas quand la machine a ete lancee. */
.ihero__stamp{
  display:inline-flex; align-items:center; gap:9px; margin:0 0 30px;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--atl-ink-200);
}
.ihero__stamp::before{
  content:""; width:8px; height:8px; border-radius:50%; background:var(--accent);
  box-shadow:0 0 0 4px rgba(194,32,50,.22);
}

/* ---------------------- La vitrine, machine + releve -------------------- */
.launch{ background:#000; padding-block:clamp(56px,7vw,104px); border-top:1px solid var(--atl-ink-800); }
.launch__grid{ display:grid; grid-template-columns:1.5fr 1fr; gap:clamp(36px,5vw,72px); align-items:center; }
.launch__media{ position:relative; aspect-ratio:4/3; overflow:hidden; isolation:isolate;
  border:1px solid var(--atl-ink-800); border-bottom:2px solid var(--accent);
  /* scene claire d'atelier, pour que le rendu noir de la machine se detache ;
     le rouge reste un liseré au bord, la page autour demeure noire */
  background:radial-gradient(78% 88% at 50% 38%, #e9eaed 0%, #c6c9ce 56%, #a2a6ac 100%);
  display:grid; place-items:center; grid-template-rows:minmax(0,1fr); grid-template-columns:minmax(0,1fr);
  padding:clamp(24px,4vw,56px); }
.launch__media::before{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(60% 100% at 6% 50%, rgba(194,32,50,.22), transparent 55%); }
/* minmax(0,1fr) rend la rangee et la colonne DEFINIES : sans cela la rangee
   d'une grille en place-items:center est auto, « max-height:100% » vaut auto, et
   le rendu PW625 (1000x897) sortait de la boite par le bas. L'explication
   complete est sur .icard__media, dans styles.css, avec la raison pour laquelle
   un enfant en position:absolute ne corrige PAS le probleme quand la boite a du
   padding. */
.launch__media img{ width:auto; height:auto; max-width:100%; max-height:100%; object-fit:contain;
  filter:drop-shadow(0 26px 44px rgba(0,0,0,.4)); }
.launch__badge{ position:absolute; top:18px; left:18px; z-index:1; display:inline-flex; align-items:center; gap:8px;
  padding:8px 14px; background:var(--accent); color:#fff;
  font-family:var(--font-sans); font-weight:700; font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.launch__badge::before{ content:""; width:6px; height:6px; border-radius:50%; background:#fff; }
.launch__note{ margin:12px 0 0; font-size:12px; color:var(--atl-ink-400); line-height:1.5; }

.launch__body{ min-width:0; }
.launch__eyebrow{ display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-mono); font-weight:700; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); margin-bottom:16px; }
.launch__eyebrow::before{ content:""; width:26px; height:2px; background:var(--accent); }
.launch__title{ font-family:var(--font-display); font-weight:800; text-transform:uppercase; color:#fff;
  font-size:clamp(30px,3.6vw,52px); line-height:0.98; letter-spacing:var(--track-tight); margin:0 0 10px; }
.launch__model{ font-family:var(--font-mono); font-weight:700; font-size:15px; letter-spacing:.08em; color:var(--accent); }
.launch__desc{ font-size:15px; line-height:1.7; color:var(--atl-ink-300); margin:16px 0 26px; max-width:52ch; }
/* releve en mono : cela doit se lire comme une fiche d'atelier, pas un prix */
.launch__specs{ display:flex; flex-direction:column; margin:0 0 26px; border-top:1px solid var(--atl-ink-700); }
.launch__spec{ display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  padding:12px 0; border-bottom:1px solid var(--atl-ink-700); }
.launch__spec-label{ font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--atl-ink-400); }
.launch__spec-val{ font-family:var(--font-mono); font-weight:700; font-size:14px; color:#fff; text-align:right; }
.launch__spec-val small{ display:block; font-weight:400; font-size:11.5px; color:var(--atl-ink-400); letter-spacing:.04em; }
.launch__actions{ display:flex; gap:14px; flex-wrap:wrap; }

/* --------------- Les quatre points d'ingenierie, photo + liste ---------- */
.eng{ background:var(--atl-ink-1000); padding-block:clamp(56px,7vw,104px); border-top:1px solid var(--atl-ink-800); }
.eng__grid{ display:grid; grid-template-columns:0.82fr 1.18fr; gap:clamp(32px,5vw,72px); align-items:start; }
.eng__media{ position:relative; overflow:hidden; border:1px solid var(--atl-ink-800);
  border-bottom:2px solid var(--accent); background:var(--atl-ink-900); position:sticky; top:96px; }
.eng__media img{ display:block; width:100%; height:auto; }
.eng__caption{ margin:0; padding:12px 14px; font-family:var(--font-mono); font-size:11px;
  letter-spacing:.06em; text-transform:uppercase; color:var(--atl-ink-400);
  border-top:1px solid var(--atl-ink-800); }
.eng__list{ display:flex; flex-direction:column; }

.engitem{ display:grid; grid-template-columns:auto 1fr; gap:0 22px; padding:26px 0;
  border-top:1px solid var(--atl-ink-800); }
.engitem:first-child{ border-top:0; padding-top:0; }
.engitem__num{ grid-row:1 / span 2; font-family:var(--font-mono); font-weight:700; font-size:13px;
  letter-spacing:.06em; color:var(--accent); padding-top:4px; }
.engitem__title{ font-family:var(--font-display); font-weight:700; font-size:clamp(17px,1.8vw,22px);
  text-transform:uppercase; letter-spacing:.01em; color:#fff; line-height:1.14; margin:0 0 9px; }
.engitem__text{ font-size:14.5px; line-height:1.7; color:var(--atl-ink-300); margin:0; max-width:60ch; }
.engitem__figs{ display:flex; flex-wrap:wrap; gap:8px; margin-top:13px; }
.engitem__fig{ font-family:var(--font-mono); font-size:11px; letter-spacing:.05em;
  color:var(--atl-ink-200); padding:5px 10px; border:1px solid var(--atl-ink-700); }

/* -------------------- Le detail : trois cliches legendes ---------------- */
.detail{ background:#000; padding-block:clamp(56px,7vw,104px); border-top:1px solid var(--atl-ink-800); }
.detailgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.dtile{ min-width:0; margin:0; }
.dtile__media{ position:relative; overflow:hidden; aspect-ratio:1/1; background:var(--atl-ink-900);
  border:1px solid var(--atl-ink-800); }
.dtile__media img{ width:100%; height:100%; object-fit:cover; display:block;
  transition:transform var(--dur-slow) var(--ease-out); }
.dtile:hover .dtile__media img{ transform:scale(1.04); }
.dtile__cap{ display:block; margin-top:14px; }
.dtile__name{ display:block; font-family:var(--font-display); font-weight:700; font-size:15px;
  text-transform:uppercase; letter-spacing:.02em; color:#fff; }
.dtile__sub{ display:block; margin-top:6px; font-family:var(--font-mono); font-size:11.5px;
  letter-spacing:.05em; color:var(--atl-ink-400); }

/* ------------------ Ce qui change par rapport a la generation M-1 -------- */
.gen{ background:var(--atl-ink-900); padding-block:clamp(48px,6vw,88px); border-top:1px solid var(--atl-ink-800); }
.genstrip{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--atl-ink-700);
  border:1px solid var(--atl-ink-700); }
.genfig{ background:var(--atl-ink-1000); padding:clamp(22px,2.6vw,32px) clamp(18px,2vw,26px); min-width:0; }
.genfig__val{ font-family:var(--font-display); font-weight:800; font-size:clamp(34px,4.4vw,58px);
  line-height:0.9; color:#fff; letter-spacing:var(--track-tight); }
.genfig__unit{ font-size:.42em; color:var(--accent); margin-left:6px; letter-spacing:.04em; }
.genfig__label{ display:block; margin-top:14px; font-family:var(--font-sans); font-weight:700;
  font-size:12px; letter-spacing:var(--track-wide); text-transform:uppercase; color:var(--atl-ink-200); }
.genfig__note{ display:block; margin-top:7px; font-family:var(--font-mono); font-size:11px;
  letter-spacing:.04em; color:var(--atl-ink-400); line-height:1.5; }
.genfig--was .genfig__note{ color:var(--accent); }

/* ------------------- Description, caracteristiques, cotes --------------- */
/* .section-title (styles.css) ne porte pas de marge basse : les sections qui
   l'emploient hors d'un .section-head doivent la poser elles-memes. */
.pwdesc .section-title, .pwspecs .section-title{ margin:0 0 26px; }
.pwtaxo{ padding-top:6px; }
.pwdesc{ background:#000; padding-block:clamp(56px,7vw,104px); border-top:1px solid var(--atl-ink-800); }
.pwdesc__grid{ display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:clamp(32px,4.5vw,68px); align-items:start; }
.pwdesc__prose p{ color:var(--atl-ink-300); font-size:15.5px; line-height:1.75; margin:0 0 18px; max-width:66ch; }
.pwdesc__prose p:last-child{ margin-bottom:0; }
.pwdesc__side{ border-top:2px solid var(--accent); padding-top:22px; }
.pwlist{ display:flex; flex-direction:column; gap:14px; margin:0; padding:0; list-style:none; }
.pwlist li{ position:relative; padding-left:22px; color:var(--atl-ink-200); font-size:14.5px; line-height:1.6; }
.pwlist li::before{ content:""; position:absolute; left:0; top:8px; width:9px; height:9px; background:var(--accent); }

.pwspecs{ background:var(--atl-ink-900); padding-block:clamp(56px,7vw,104px); border-top:1px solid var(--atl-ink-800); }
.pwspecs__grid{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:clamp(32px,4.5vw,68px); align-items:start; }
.spectable{ width:100%; border-collapse:collapse; border:1px solid var(--atl-ink-700); background:var(--atl-ink-1000); }
.spectable th, .spectable td{ padding:13px 16px; border-bottom:1px solid var(--atl-ink-700); text-align:left; font-size:14px; }
.spectable tr:last-child th, .spectable tr:last-child td{ border-bottom:0; }
.spectable thead th{ font-family:var(--font-mono); font-size:11px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--atl-ink-400); background:var(--atl-ink-900); font-weight:700; }
.spectable tbody th{ font-weight:600; color:#fff; width:40%; }
.spectable tbody td{ color:var(--atl-ink-200); font-family:var(--font-mono); font-size:13px;
  font-variant-numeric:tabular-nums; white-space:nowrap; }
.spectable__note{ margin:14px 0 0; font-size:12px; color:var(--atl-ink-400); line-height:1.55; }

/* La colonne de droite : ou la machine se range dans le catalogue. */
.pwtaxo{ display:flex; flex-direction:column; gap:18px; }
.pwtaxo__row{ min-width:0; }
.pwtaxo__label{ display:block; margin-bottom:9px; font-family:var(--font-mono); font-size:11px;
  letter-spacing:.1em; text-transform:uppercase; color:var(--atl-ink-400); }
.pwtaxo__list{ display:flex; flex-wrap:wrap; gap:8px; }
.pwtaxo__chip{ display:inline-flex; align-items:center; padding:7px 13px; border:1px solid var(--atl-ink-700);
  font-size:13px; color:var(--atl-ink-100); background:var(--atl-ink-1000);
  transition:border-color var(--dur-quick) var(--ease-out), color var(--dur-quick) var(--ease-out); }
.pwtaxo__chip:hover{ border-color:var(--accent); color:#fff; }

/* ------------------------------ Documents ------------------------------- */
.docs{ background:#000; padding-block:clamp(48px,6vw,88px); border-top:1px solid var(--atl-ink-800); }
.docsgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.doccard{ display:flex; align-items:center; gap:16px; padding:20px; background:var(--atl-ink-900);
  border:1px solid var(--atl-ink-700);
  transition:border-color var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out); }
.doccard:hover{ border-color:var(--accent); transform:translateY(-3px); }
.doccard__icon{ flex:none; width:44px; height:44px; display:grid; place-items:center;
  border:1px solid var(--atl-ink-700); color:var(--accent); }
.doccard__body{ min-width:0; }
.doccard__name{ display:block; font-family:var(--font-display); font-weight:700; font-size:14px;
  text-transform:uppercase; letter-spacing:.02em; color:#fff; line-height:1.2; }
.doccard__meta{ display:block; margin-top:6px; font-family:var(--font-mono); font-size:11px;
  letter-spacing:.06em; text-transform:uppercase; color:var(--atl-ink-400); }

/* ------------------- La famille de tirage, cartes produits -------------- */
/* .ncard est le nom d'origine du fichier : le moteur de mouvement de main.js
   le cite dans sa liste, le renommer couterait une modification de main.js. */
.family{ background:var(--atl-ink-900); padding-block:clamp(56px,7vw,104px); border-top:1px solid var(--atl-ink-800); }
.newgrid{ display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
.ncard{ display:flex; flex-direction:column; min-width:0;
  background:var(--atl-ink-1000); border:1px solid var(--atl-ink-700);
  transition:border-color var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out); }
.ncard:hover{ border-color:var(--accent); transform:translateY(-3px); }
.ncard__media{ position:relative; aspect-ratio:1/1;
  background:radial-gradient(80% 90% at 50% 40%, #eceef0 0%, #cfd2d7 100%);
  display:grid; place-items:center; grid-template-rows:minmax(0,1fr); grid-template-columns:minmax(0,1fr);
  padding:18px; border-bottom:1px solid var(--atl-ink-700); overflow:hidden; }
.ncard__media img{ width:auto; height:auto; max-width:100%; max-height:100%; object-fit:contain;
  transition:transform var(--dur-slow) var(--ease-out); }   /* voir .launch__media img */
.ncard:hover .ncard__media img{ transform:scale(1.04); }
.ncard__body{ padding:16px; display:flex; flex-direction:column; gap:7px; flex:1; }
.ncard__name{ font-family:var(--font-display); font-weight:700; font-size:14px; text-transform:uppercase;
  color:#fff; line-height:1.16; letter-spacing:.01em; }
.ncard__model{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.06em; color:var(--accent); }
.ncard__stamp{ margin-top:auto; padding-top:12px; font-family:var(--font-mono); font-size:11px;
  letter-spacing:.05em; text-transform:uppercase; color:var(--atl-ink-400); }

/* --------------------- Appel a l'action sur photographie ---------------- */
/* .cta vient de styles.css et pose son degrade rouge. Ici une photographie
   passe DESSOUS, le degrade devient un voile : d'ou le fond transparent et le
   ::before reecrit en teinte sombre plutot qu'en degrade lateral. */
.cta--photo{ background:#000; }
.cta--photo .cta__photo{ position:absolute; inset:0; z-index:0; }
.cta--photo .cta__photo img{ width:100%; height:100%; object-fit:cover; object-position:center 38%; }
.cta--photo::before{ z-index:1;
  background:linear-gradient(180deg, rgba(0,0,0,.72) 0%, rgba(10,2,4,.58) 45%, rgba(0,0,0,.86) 100%),
             radial-gradient(90% 120% at 82% 8%, rgba(194,32,50,.4), transparent 58%); }
.cta--photo .cta__inner{ z-index:2; }
.cta--photo .cta__lede{ max-width:56ch; margin:0 auto 40px; font-size:16px; line-height:1.65;
  color:var(--atl-ink-200); }
.cta--photo .cta__title{ margin-bottom:22px; }
.cta__actions{ display:flex; gap:14px; flex-wrap:wrap; justify-content:center; }

/* ------------------------------- Mouvement ------------------------------ */
/* Les elements cites par le moteur de main.js (.launch__media, .launch__body,
   .ncard, .section-title, .eyebrow, .cta__title, .stat) se revelent seuls.
   Les blocs propres a cette page s'y raccrochent en portant .engitem/.dtile,
   ajoutes a la liste par le meme moteur via .feature n'existant pas ici : on
   se contente donc du fondu general, sans regle bespoke, pour ne pas figer un
   contenu si le JS ne s'execute pas. */
html.motion .engitem__num{ transition:color var(--dur-base) var(--ease-out); }

/* ------------------------------ Responsive ------------------------------ */
@media (max-width:1180px){
  .newgrid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:1080px){
  .eng__grid{ grid-template-columns:1fr; }
  .eng__media{ position:static; max-width:520px; }
  .genstrip{ grid-template-columns:repeat(2,1fr); }
  .pwdesc__grid, .pwspecs__grid{ grid-template-columns:1fr; }
  .docsgrid{ grid-template-columns:1fr; }
}
@media (max-width:900px){
  .launch__grid{ grid-template-columns:1fr; }
  .launch__media{ order:-1; aspect-ratio:16/10; }
  .detailgrid{ grid-template-columns:1fr; }
  .newgrid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:620px){
  .genstrip{ grid-template-columns:1fr; }
  .launch__actions .btn, .cta__actions .btn{ width:100%; }
  .cta__actions{ flex-direction:column; }
}

/* ---------------------------- Mouvement reduit -------------------------- */
@media (prefers-reduced-motion: reduce){
  .ncard, .ncard:hover, .doccard, .doccard:hover{ transition:none !important; transform:none !important; }
  .ncard__media img, .ncard:hover .ncard__media img,
  .dtile__media img, .dtile:hover .dtile__media img{ transition:none !important; transform:none !important; }
}