/* enytrack.com — « Une immatriculation, et tout s’enchaîne. » : le visuel d’Enyss (Téléchargements, « une immatriculation.png »,
   2172 × 724) reproduit en HTML/CSS. FICHIER GÉNÉRÉ par generer.py (chantiers/enytrack-immat-enchaine) : régler là, pas ici.
   REPÈRE : --u = 1 px de maquette (largeur du bloc / 2172) ; --x --y --w --h --f --lh = valeurs de maquette sans unité.
   · Fond : la maquette nettoyée (textes, pastilles, cartes, téléphone, enseigne et écritures effacés).
   · Téléphone : écran « déplié » 300 × 665,8 replacé sur ses 4 coins par une transformation 3D calculée (écart 0 px) ;
     grande carte de même (≤ 1,3 px) ; petites cartes par rotation autour de leur centre mesuré.
   · Polices : Inter (chargée par la page), Kalam 700 locale pour l’écriture ; tailles calibrées sur la largeur d’encre.
   · Sous 1300 px de large : repli (illustrations en tête, puis titre, texte, atouts, étapes en grille).
   [Cigogne-16 · PC2-260912-TS34 · Claude Code] */
@font-face{font-family:'IM Kalam';src:url('/fonts/kalam-700-latin.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
.im{container:im / inline-size;position:relative;width:min(calc(100vw - 48px),1760px);left:50%;transform:translateX(-50%);margin:22px 0 30px}
.im *,.im *::before,.im *::after{box-sizing:border-box}
.im h2,.im h3,.im p,.im ul,.im ol,.im li,.im b,.im small{margin:0;padding:0;list-style:none}
.im-stage{--u:calc(100cqw / 2172);position:relative;height:calc(724 * var(--u));overflow:hidden;border-radius:calc(24 * var(--u));background:#f7f9fe;
  font-family:Inter,"Avenir Next","Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#0b1433;-webkit-font-smoothing:antialiased;text-align:left}
.im .q{position:absolute;left:calc(var(--x) * var(--u));top:calc(var(--y) * var(--u))}
.im .qs{width:calc(var(--w) * var(--u));height:calc(var(--h) * var(--u));max-width:none}
.im .t{font-size:calc(var(--f) * var(--u));line-height:calc(var(--lh, var(--f)) * var(--u));white-space:nowrap;font-weight:600}
.im .im-fond{position:absolute;left:0;top:0;width:100%;height:100%;max-width:none;object-fit:cover;pointer-events:none}
.im .im-ico{display:block;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.im-g{position:absolute;top:0;height:calc(724 * var(--u))}
.im-g-gauche{left:0;width:calc(600 * var(--u))}
.im-g-droite{left:calc(1500 * var(--u));width:calc(672 * var(--u))}
.im-deco{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible}
.im-deco .im-main text{font-family:'IM Kalam','Segoe Print','Comic Sans MS',cursive;font-weight:700}
.im-deco .im-ens text{font-family:Inter,"Segoe UI",Arial,sans-serif;font-weight:600}
/* téléphone */
.im-tel{--cadre-g1:#8c9cb3;--cadre-g2:#56647c;--cadre-c:#3a4760;position:absolute;left:calc(168.2 * var(--u));top:calc(36.95 * var(--u));width:calc(300 * var(--u));height:calc(665.8 * var(--u));
  transform-origin:calc(150 * var(--u)) calc(332.9 * var(--u));
  transform:translate(calc(5.409 * var(--u)),calc(-9.758 * var(--u))) perspective(calc(1917.3 * var(--u))) rotateX(19.17deg) rotateY(37.85deg) rotateZ(-8.445deg) scale(1.07643,.87288)}
.im-tel-cadre{border-radius:calc(52 * var(--u));background:linear-gradient(90deg,var(--cadre-g1) 0,var(--cadre-g2) 4%,var(--cadre-c) 10%,var(--cadre-c) 91%,var(--cadre-g2) 96%,var(--cadre-g1) 100%);
  box-shadow:inset 0 0 0 calc(1.6 * var(--u)) #9fb0c6,inset 0 0 0 calc(4 * var(--u)) #4a576e,calc(24 * var(--u)) calc(32 * var(--u)) calc(56 * var(--u)) rgba(12,32,84,.28)}
.im-tel-bouton{border-radius:calc(3 * var(--u));background:linear-gradient(90deg,#2a3450,#141d35)}
.im-tel-ecran{position:absolute;inset:0;border-radius:calc(36 * var(--u));overflow:hidden;box-shadow:0 0 0 calc(3.5 * var(--u)) #06080d;background:linear-gradient(180deg,#fdfdff 0,#f7f8fb 70%,#eff1f6 100%)}
.im-tel-heure{color:#0b0d12}
.im .im-tel-logo{font-weight:800;color:#0d1a45}
.im-tel-logo span{color:#1759f9}
.im-tel-menu{background:linear-gradient(#1b2340 0 0) 0 0/100% 16% no-repeat,linear-gradient(#1b2340 0 0) 0 50%/100% 16% no-repeat,linear-gradient(#1b2340 0 0) 0 100%/100% 16% no-repeat}
.im .im-tel-titre{text-align:center;white-space:normal;color:#1d2447}
.im-tel-plaque{border-radius:calc(13 * var(--u));object-fit:cover}
.im-tel-champ{border:calc(1.5 * var(--u)) solid #d6dbe6;border-radius:calc(19 * var(--u));background:#fff}
.im-tel-plaque-txt{color:#15182b}
.im-tel-bouton-bleu{border-radius:calc(29 * var(--u));background:linear-gradient(180deg,#2a72ff,#0a55f5);box-shadow:0 calc(7 * var(--u)) calc(16 * var(--u)) rgba(10,85,245,.32);display:flex;align-items:center;justify-content:center;color:#fff}
.im .im-tel-legende{text-align:center;font-weight:500;color:#8a90a5}
/* cartes */
.im-carte{background:#fff;border-radius:calc(16 * var(--u));box-shadow:0 calc(14 * var(--u)) calc(32 * var(--u)) rgba(24,64,160,.13),0 calc(2 * var(--u)) calc(6 * var(--u)) rgba(24,64,160,.05)}
.im-rond-ok{border-radius:50%;display:grid;place-items:center}
.im-rond-ok svg{width:50%;height:50%}
.im-bleu{background:linear-gradient(180deg,#2d6bff,#1450f0)}
.im .im-c-vehicule{font-weight:800;color:#1533a0;white-space:nowrap}
.im-c-grande{transform-origin:calc(145 * var(--u)) calc(188.5 * var(--u));border-radius:calc(20 * var(--u));
  transform:translate(calc(1.076 * var(--u)),calc(.567 * var(--u))) perspective(calc(5715.3 * var(--u))) rotateX(-5.405deg) rotateY(16.35deg) rotateZ(-1.948deg) scale(1.03916,.99387)}
.im-c-pastille{border-radius:calc(22 * var(--u));background:#e2f3ea}
.im .im-c-pret{font-weight:700;color:#10231b}
.im .im-c-modele{font-weight:800;color:#0b1433}
.im .im-c-version{font-weight:400;color:#4d5b86}
.im .im-c-spec{color:#1d2440}
.im-c-grande .t{transform:rotate(2deg);transform-origin:0 50%}
/* planchers de lisibilité (portables 1300-1550 px) */
.im .im-lab{font-size:max(calc(var(--f) * var(--u)), 10.5px)}
.im .im-atouts b{font-size:max(calc(var(--f) * var(--u)), 11.5px)}
.im .im-atouts small{font-size:max(calc(var(--f) * var(--u)), 8px)}
.im .im-texte{font-size:max(calc(var(--f) * var(--u)), 12.5px);line-height:max(calc(var(--lh) * var(--u)), 17.5px)}
.im .im-c-titre{color:#0e1a4a}
.im-c-vignette{border-radius:calc(9 * var(--u));object-fit:cover}
.im-c-barre{border-radius:calc(5 * var(--u));background:#dfe6f4}
.im-c-plus{border-radius:calc(6 * var(--u));background:#f1f4fa;display:grid;place-items:center;color:#0e1a4a}
.im-c-plus .t{font-weight:700}
/* centre */
.im .im-h2{margin:0;text-align:center;color:#030d3a;font-family:inherit;font-size:inherit;letter-spacing:normal}
.im .im-h2 .t{font-weight:800}
.im .im-l1{letter-spacing:-.057em}
.im-l1 em{font-style:normal;color:#0b4ef9}
.im .im-l2{letter-spacing:-.02em}
.im .im-texte{text-align:center;white-space:normal;font-weight:400;letter-spacing:-.01em;color:#2b3a64}
.im-texte-l4{letter-spacing:.001em}
.im-texte b{font-weight:700;color:#0a47f5}
.im-atouts li{border-radius:calc(36 * var(--u));background:#fff;border:calc(1 * var(--u)) solid #e8eefb;box-shadow:0 calc(6 * var(--u)) calc(18 * var(--u)) rgba(24,64,160,.07)}
.im-atout-rond{border-radius:50%;background:linear-gradient(180deg,#2a6dff,#0a4ff2);color:#fff;display:grid;place-items:center}
.im .im-atouts b{font-weight:700;color:#0b1433}
.im .im-atouts small{font-weight:400;color:#5a6479}
.im-etapes{counter-reset:im-etape}
.im-etapes li{border-radius:calc(30 * var(--u));background:#fff;border:calc(1 * var(--u)) solid #e6ecf7;box-shadow:0 calc(5 * var(--u)) calc(15 * var(--u)) rgba(24,64,160,.08)}
.im-num{border-radius:50%;background:linear-gradient(180deg,#2a6dff,#0a4ff2);color:#fff;display:grid;place-items:center}
.im-num::before{counter-increment:im-etape;content:counter(im-etape);font-size:max(calc(15 * var(--u)), 10px);font-weight:700;line-height:1}
.im-etapes .im-ico{color:#1552f5}
.im .im-lab{color:#0b1433}
.im-fleche{color:#1e56f0;overflow:visible}
.im-pied-auto{color:#0b1433}
.im-pied-traits{color:#2f6bff}
.im .im-pied{font-weight:400;color:#3b4563}
.im-pied b{font-weight:700;color:#0b1433}
.im-pied-barre{border-radius:calc(2 * var(--u));background:linear-gradient(90deg,#1e5eff,#8fb2ff)}
/* repli */
@supports not (width: 1cqw){ .im-stage{--u:calc(min(100vw - 48px, 1760px) / 2172)} }
@container im (max-width: 1299px){
  .im-stage{height:auto;display:flex;flex-direction:column;align-items:center;gap:16px;padding:18px 14px 22px;border-radius:20px}
  .im .im-fond,.im .im-fleche,.im .im-pied-auto,.im .im-pied-traits,.im .im-pied-barre{display:none}
  .im-illus{--u:calc(min(100cqw - 28px, 760px) / 1272);display:flex;justify-content:center;width:100%;order:-1}
  .im-g-gauche{-webkit-mask-image:linear-gradient(90deg,#000 90%,transparent);mask-image:linear-gradient(90deg,#000 90%,transparent)}
  .im-g-droite{-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%);mask-image:linear-gradient(90deg,transparent,#000 10%)}
  .im .im-etapes .im-num{left:calc(14 * var(--u));top:50%;transform:translateY(-50%)}
  .im .im-etapes .im-ico{left:calc(62 * var(--u));top:50%;transform:translateY(-50%)}
  .im .im-etapes .im-lab{left:calc(100 * var(--u));top:50%;transform:translateY(-50%)}
  .im-g{position:relative;left:auto;flex:none;overflow:hidden;background:url('/assets/enytrack-home-v2/immat/im-fond.webp?v=20260913e') 0 0/calc(2172 * var(--u)) calc(724 * var(--u)) no-repeat}
  .im-g-droite{background-position:calc(-1500 * var(--u)) 0}
  .im .im-h2,.im .im-texte,.im .im-pied,.im .im-l1,.im .im-l2{position:static;width:auto;height:auto;white-space:normal;text-align:center}
  .im .im-l1,.im .im-l2{display:block}
  .im .im-l1{font-size:clamp(26px,6.4cqw,46px);line-height:1.1;letter-spacing:-.04em}
  .im .im-l2{font-size:clamp(20px,4.8cqw,36px);line-height:1.15;letter-spacing:-.02em;margin-top:4px}
  .im .im-texte{font-size:15px;line-height:1.55}
  .im-texte br{display:none}
  .im .im-pied{font-size:16px;line-height:1.4}
  .im-atouts{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;width:100%}
  .im-atouts li.q{--u:.85px;position:relative;left:auto;top:auto;width:auto}
  .im-etapes{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;width:100%}
  .im-etapes li.q{--u:.8px;position:relative;left:auto;top:auto;width:auto}
}
@container im (min-width: 560px) and (max-width: 1299px){
  .im-atouts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .im-etapes{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container im (min-width: 1000px) and (max-width: 1299px){
  .im-atouts{grid-template-columns:repeat(4,minmax(0,1fr))}
  .im-atouts li.q{--u:.8px}
  .im-etapes{grid-template-columns:repeat(4,minmax(0,1fr))}
  .im-etapes li.q{--u:.72px}
}
