/* --------------------------------------------------------------------------
   Infrastructures (procédé PVI) : affiche paysage 1536 x 1024. Complète pages/fiche.css.

   Unité : --u = 1 px d'affiche = 100cqw / 1536. Positions et tailles ci-dessous :
   pixels mesurés sur infrastructures.png, multipliés par --u.
   Antonio pour les titres en capitales, Barlow pour le texte courant.
   Photo : 0 à 802 ; bande des atouts : 802 à 886 ; expertise et pied : 886 à 1024.
   -------------------------------------------------------------------------- */

.fiche.infra{--W:1536;--PH:802;max-width:1536px;--u:calc(100cqw / 1536);
  --vert:#0B4A22;--bleu:#0A3F78;--orange:#CF5A10;--navy:#0F2A52;--texte-carte:#1F1F1F;--bande:#044521}
.infra h1{font-family:var(--display);font-weight:700;text-transform:uppercase;color:#08320F}
.infra .lede{font-family:var(--texte);font-weight:600;color:var(--navy)}
.infra .lede strong{font-weight:600;color:#0B5020}

.infra .carte{background:#F2F2F1;border:0;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
.infra .carte h2{letter-spacing:0}
.infra #scheier-pvi{background:#F8F9F9}
.infra #scheier-pvi h2{font-family:var(--texte);font-weight:700;font-style:italic;text-transform:uppercase;color:#060606}
.infra #scheier-pvi h2 em{color:var(--vert)}
.infra .kicker{font-family:var(--display);font-weight:700;color:var(--navy)}
.infra .kicker b{font-weight:700;color:var(--vert)}
.infra .kicker .haut{text-transform:uppercase}
.infra .procede{font-family:var(--display);font-weight:700;text-transform:uppercase;color:var(--vert)}
.infra .desc{font-family:var(--texte);font-weight:500;color:#141414}
.infra #pvi-1000,.infra #pvi-4000{--c:var(--vert)}
.infra #pvi-2000{--c:var(--bleu)}
.infra #pvi-3000{--c:var(--orange)}
.infra .pvi h2{font-family:var(--display);font-weight:700;text-transform:uppercase;color:var(--c)}
.infra .pvi .pour{font-family:var(--texte);font-weight:600;text-transform:uppercase;color:var(--c)}
.infra .pvi li{display:block;font-family:var(--texte);font-weight:500;color:var(--texte-carte)}
.infra .pvi li::before{content:"\2022"}
.infra .vignette{object-fit:cover;max-width:none}

.infra .i-synergie{background:#EFEEEA}
.infra .i-synergie h2{font-family:var(--texte);font-weight:700;text-transform:uppercase;color:var(--vert)}
.infra .i-synergie img{border-radius:50%}
.infra .i-synergie b{display:block;font-family:var(--display);font-weight:700;text-transform:uppercase;color:#0D3F1F}
.infra .i-synergie .resultat b{color:var(--vert)}
.infra .i-synergie span{display:block;font-family:var(--texte);font-weight:500;color:#3F3F3D}
.infra .i-synergie .op{font-family:var(--texte);font-weight:700;color:var(--vert);text-align:center}

.infra .i-atouts{background:var(--bande);color:#fff}
.infra .i-atouts b{display:block;font-family:var(--display);font-weight:700;text-transform:uppercase;color:#fff}
.infra .i-atouts span{display:block;font-family:var(--texte);font-weight:500;color:#F4F9F5}

.infra .i-expertise{background:#F2F2F2}
.infra .i-titre h2{font-family:var(--display);font-weight:600;text-transform:uppercase;color:#13294A}
.infra .i-titre h2 span{display:block}
.infra .i-titre h2 .vert{color:var(--vert)}
.infra .i-titre p{font-family:var(--display);font-weight:600;text-transform:uppercase;color:#13294A}
.infra .i-expertise b{display:block;font-family:var(--display);font-weight:700;text-transform:uppercase;color:#13233A}
.infra .i-expertise li span{display:block;font-family:var(--display);font-weight:500;color:#383838}
.infra .i-logo .signature{font-family:var(--display);font-weight:500;text-transform:uppercase;color:#0A9A4A;text-align:center;line-height:1}
.infra .i-logo a{display:block;background:#0A3E22;color:#fff;font-family:var(--texte);font-weight:600;text-align:center;text-decoration:none}

/* ==========================================================================
   Écran large et impression : la composition de l'affiche.
   ========================================================================== */
@media screen and (min-width:900px), print{
  .infra .entete{position:absolute;left:0;top:0;width:100%;height:calc(802 * var(--u));z-index:3;pointer-events:none}
  .infra h1{left:calc(19 * var(--u));top:calc(4.4 * var(--u));width:auto;white-space:nowrap;
    font-size:calc(71 * var(--u));line-height:calc(79 * var(--u));
    text-shadow:0 0 calc(5 * var(--u)) rgba(255,255,255,.9)}
  .infra h1 .l1{letter-spacing:.0164em;margin-left:calc(-2 * var(--u))}
  .infra h1 .l2{letter-spacing:.0396em}
  .infra .lede{left:calc(20 * var(--u));top:calc(171 * var(--u));width:auto;white-space:nowrap;
    font-size:calc(22.5 * var(--u));line-height:calc(31 * var(--u))}
  .infra .lede .l1{letter-spacing:-.026em}
  .infra .lede .l2{letter-spacing:-.037em}

  .infra .mosaique{aspect-ratio:1536/802}

  .infra .carte{padding:0;height:calc(var(--ch) * var(--u));border-radius:calc(8 * var(--u));overflow:hidden;
    box-shadow:0 0 0 calc(1 * var(--u)) rgba(255,255,255,.85), 0 calc(2 * var(--u)) calc(8 * var(--u)) rgba(0,0,0,.18)}
  .infra .carte > *{position:absolute;margin:0;white-space:nowrap}

  /* encart de marque : 702,108 */
  .infra #scheier-pvi h2{left:calc(98 * var(--u));top:calc(44.8 * var(--u));font-size:calc(35 * var(--u));line-height:1;letter-spacing:-.01em}
  .infra .kicker{left:calc(20 * var(--u));top:calc(11.5 * var(--u));font-size:calc(17 * var(--u));line-height:1;letter-spacing:.054em}
  .infra #scheier-pvi .picto{left:calc(14 * var(--u));top:calc(34 * var(--u));width:calc(80 * var(--u))}
  .infra .procede{left:calc(100 * var(--u));top:calc(86 * var(--u));font-size:calc(16 * var(--u));line-height:calc(23 * var(--u));letter-spacing:.084em}
  .infra .desc{left:0;width:100%;text-align:center;top:calc(141.5 * var(--u));font-size:calc(15.8 * var(--u));line-height:calc(19.5 * var(--u));letter-spacing:-.025em}

  /* fiches PVI : x 1041 */
  .infra .pvi .vignette{left:calc(1 * var(--u));top:calc(var(--vt) * var(--u));width:calc(185 * var(--u));height:calc(var(--vh) * var(--u))}
  .infra .pvi h2{left:calc(203 * var(--u));top:calc(var(--t2) * var(--u));font-size:calc(22.2 * var(--u));line-height:1;letter-spacing:var(--lh2)}
  .infra .pvi .pour{left:calc(203 * var(--u));top:calc(var(--tp) * var(--u));font-size:calc(13.5 * var(--u));line-height:calc(var(--lp) * var(--u));letter-spacing:-.028em}
  .infra #pvi-3000 .pour span:first-child{letter-spacing:-.003em}
  .infra #pvi-3000 .pour span:last-child{letter-spacing:.014em}
  .infra #pvi-4000 .pour{font-size:calc(12.5 * var(--u))}
  .infra #pvi-4000 .pour span:first-child{letter-spacing:-.058em}
  .infra #pvi-4000 .pour span:last-child{font-size:calc(11.5 * var(--u));letter-spacing:-.05em}
  .infra .pvi ul{left:calc(203 * var(--u));top:calc(var(--tb) * var(--u))}
  .infra .pvi li{font-size:calc(12.2 * var(--u));line-height:calc(var(--lb) * var(--u));letter-spacing:var(--lb1,-.01em);margin:0}
  .infra .pvi li:nth-child(2){letter-spacing:var(--lb2,-.01em)}
  .infra .pvi li:nth-child(3){letter-spacing:var(--lb3,-.01em)}
  .infra .pvi li::before{margin-right:calc(5 * var(--u))}
  .infra .pvi .picto{left:calc(387 * var(--u));top:calc(var(--pt) * var(--u));width:calc(80 * var(--u))}
  .infra #pvi-1000{--lh2:.078em;--lb1:.001em;--lb2:.006em;--lb3:.0024em;--t2:13.6;--tp:40.8;--lp:21;--tb:92.4;--lb:21;--pt:23;--vt:1;--vh:178}
  .infra #pvi-2000{--lh2:.072em;--lb1:.0055em;--lb2:0em;--lb3:.013em;--t2:30.6;--tp:56.8;--lp:21;--tb:111.6;--lb:32.5;--pt:22;--vt:2;--vh:227}
  .infra #pvi-3000{--lh2:.068em;--t2:15.6;--tp:41.8;--lp:21;--tb:94.4;--lb:21.5;--pt:18;--vt:1;--vh:174}
  .infra #pvi-4000{--lh2:.06em;--lb1:-.03em;--lb2:-.019em;--lb3:-.0245em;--t2:12.6;--tp:39.3;--lp:20;--tb:86.9;--lb:20;--pt:17;--vt:1;--vh:153}

  /* bas : 802 à 1024 */
  .infra .i-bas{position:relative;z-index:4;height:calc(222 * var(--u))}
  .infra .i-bas li{position:static}
  .infra .i-bas img{max-width:none}
  .infra .i-bas li > *{position:absolute;margin:0;white-space:nowrap}

  .infra .i-synergie{position:absolute;left:calc(16 * var(--u));top:calc(-192 * var(--u));width:calc(943 * var(--u));height:calc(181 * var(--u));
    border-radius:calc(8 * var(--u));box-shadow:0 calc(2 * var(--u)) calc(8 * var(--u)) rgba(0,0,0,.15)}
  .infra .i-synergie h2{position:absolute;left:calc(130 * var(--u));top:calc(7.7 * var(--u));font-size:calc(20.5 * var(--u));line-height:1;letter-spacing:-.039em;white-space:nowrap}
  .infra .i-synergie li{position:absolute;left:calc((var(--c) - 16 - 75) * var(--u));top:calc(35 * var(--u));width:calc(150 * var(--u));text-align:center}
  .infra .i-synergie li > *{position:static;white-space:nowrap}
  .infra .i-synergie img{width:calc(var(--w,78) * var(--u));height:calc(var(--w,78) * var(--u));margin:calc(var(--dt,0) * var(--u)) auto 0}
  .infra .i-synergie b{font-size:calc(12.5 * var(--u));line-height:1;letter-spacing:.058em;margin-top:calc((85 - var(--w,78) - var(--dt,0)) * var(--u))}
  .infra .i-synergie .resultat b{font-size:calc(13 * var(--u));line-height:calc(17 * var(--u))}
  .infra .i-synergie span{font-size:calc(11.5 * var(--u));line-height:calc(16.5 * var(--u));letter-spacing:-.04em;margin-top:calc(1.5 * var(--u))}
  .infra .i-synergie .op{left:calc((var(--c) - 16 - 20) * var(--u));width:calc(40 * var(--u));top:calc(56 * var(--u));font-size:calc(32 * var(--u));line-height:1}

  .infra .i-atouts{position:absolute;left:0;top:0;width:100%;height:calc(84 * var(--u))}
  .infra .i-atouts img{left:calc(var(--x) * var(--u));top:calc(13 * var(--u));width:calc(57 * var(--u))}
  .infra .i-atouts b{left:calc(var(--t) * var(--u));top:calc(16.7 * var(--u));font-size:calc(13.5 * var(--u));line-height:1;letter-spacing:var(--lt)}
  .infra .i-atouts span{left:calc(var(--t) * var(--u));top:calc(34.3 * var(--u));font-size:calc(12.5 * var(--u));line-height:calc(18 * var(--u));letter-spacing:var(--lsd,-.015em)}
  .infra .i-atouts li + li::before{content:"";position:absolute;top:calc(14 * var(--u));height:calc(58 * var(--u));width:calc(1 * var(--u));background:rgba(170,205,180,.6)}
  .infra .i-atouts li:nth-child(2)::before{left:calc(239 * var(--u))}
  .infra .i-atouts li:nth-child(3)::before{left:calc(504 * var(--u))}
  .infra .i-atouts li:nth-child(4)::before{left:calc(748 * var(--u))}
  .infra .i-atouts li:nth-child(5)::before{left:calc(997 * var(--u))}

  .infra .i-expertise{position:absolute;left:0;top:calc(84 * var(--u));width:100%;height:calc(138 * var(--u));border-top:calc(1 * var(--u)) solid #FBFDFB}
  .infra .i-expertise > *{position:absolute}
  .infra .i-titre{left:0;top:0}
  .infra .i-titre > *{position:absolute;white-space:nowrap}
  .infra .i-titre h2{left:calc(20 * var(--u));top:calc(12.4 * var(--u));font-size:calc(24 * var(--u));line-height:calc(32 * var(--u));letter-spacing:.088em}
  .infra .i-titre p{left:calc(21 * var(--u));top:calc(84.5 * var(--u));font-size:calc(16.5 * var(--u));line-height:1;letter-spacing:.0935em}
  .infra .i-expertise ul{left:0;top:0}
  .infra .i-expertise li img{left:calc(var(--x) * var(--u));top:calc(27 * var(--u));height:calc(62 * var(--u));width:auto}
  .infra .i-expertise b{left:calc(var(--t) * var(--u));top:calc(33.3 * var(--u));font-size:calc(11.5 * var(--u));line-height:1;letter-spacing:var(--lx)}
  .infra .i-expertise li span{left:calc(var(--t) * var(--u));top:calc(52.1 * var(--u));font-size:calc(11 * var(--u));line-height:calc(17 * var(--u));letter-spacing:var(--ld,0em)}
  .infra .i-expertise li + li::before{content:"";position:absolute;top:calc(25 * var(--u));height:calc(71 * var(--u));width:calc(1 * var(--u));background:#9A9A9A}
  .infra .i-expertise li:nth-child(2)::before{left:calc(468 * var(--u))}
  .infra .i-expertise li:nth-child(3)::before{left:calc(677 * var(--u))}
  .infra .i-expertise li:nth-child(4)::before{left:calc(884 * var(--u))}
  .infra .i-expertise li:nth-child(5)::before{left:calc(1082 * var(--u))}
  .infra .i-logo{left:calc(1273 * var(--u));top:0;width:calc(240 * var(--u))}
  .infra .i-logo > *{position:absolute;left:0;width:100%}
  .infra .i-logo img{top:calc(22 * var(--u));width:calc(239 * var(--u))}
  .infra .i-logo .signature{top:calc(70.6 * var(--u));font-size:calc(16.8 * var(--u));letter-spacing:.098em}
  .infra .i-logo a{top:calc(96 * var(--u));height:calc(24 * var(--u));border-radius:calc(2 * var(--u));
    font-size:calc(18.2 * var(--u));line-height:calc(24 * var(--u));letter-spacing:.098em}
}

/* ==========================================================================
   Téléphone et tablette : le titre, puis chaque photo avec son encart.
   ========================================================================== */
@media screen and (max-width:899px){
  .infra h1{font-size:clamp(30px,8.6vw,44px);line-height:1.02;letter-spacing:0}
  .infra .lede br{display:none}
  .infra .lede{font-size:17px;line-height:1.35;letter-spacing:0;margin-bottom:6px}

  .infra .carte{position:relative;padding:12px 14px;border-radius:9px;background:rgba(244,244,243,.95);box-shadow:0 2px 10px -4px rgba(0,0,0,.4)}
  .infra #scheier-pvi{display:grid;grid-template-columns:60px 1fr;column-gap:12px;align-items:center}
  .infra #scheier-pvi h2{grid-column:2;grid-row:2;font-size:30px;line-height:1.05}
  .infra .kicker{grid-column:1 / -1;grid-row:1;font-size:15px;line-height:1.2;margin-bottom:8px}
  .infra #scheier-pvi .picto{grid-column:1;grid-row:2 / 4;width:60px}
  .infra .procede{grid-column:2;grid-row:3;font-size:14px;line-height:1.25;margin-top:4px}
  .infra .procede br{display:none}
  .infra .desc{grid-column:1 / -1;grid-row:4;font-size:15px;line-height:1.35;margin-top:10px}
  .infra .desc br{display:none}

  .infra .pvi{padding-right:64px}
  .infra .pvi .vignette{display:none}
  .infra .pvi h2{font-size:22px;letter-spacing:.02em}
  .infra .pvi .pour{font-size:13px;line-height:1.3;margin-top:4px}
  .infra .pvi .pour br{display:none}
  .infra .pvi ul{margin-top:8px}
  .infra .pvi li{font-size:14px;line-height:1.35;margin-top:3px;padding-left:12px;text-indent:-12px}
  .infra .pvi li::before{display:inline-block;width:12px;text-indent:0}
  .infra .pvi .picto{position:absolute;right:10px;top:10px;width:46px}

  .infra .i-bas{padding:0 16px}
  .infra .i-bas br{display:none}
  .infra .i-synergie{margin-top:16px;border-radius:10px;padding:16px 12px 14px}
  .infra .i-synergie h2{font-size:17px;line-height:1.25;text-align:center;margin-bottom:14px;text-wrap:balance}
  .infra .i-synergie ol{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 10px}
  .infra .i-synergie li{flex:0 1 140px;text-align:center}
  .infra .i-synergie img{width:72px;height:72px;margin:0 auto 8px}
  .infra .i-synergie b{font-size:13.5px;line-height:1.15}
  .infra .i-synergie span{font-size:13px;line-height:1.3;margin-top:4px}
  .infra .i-synergie .op{display:none}

  .infra .i-atouts{margin:18px -16px 0;padding:18px 16px}
  .infra .i-atouts ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px 12px}
  .infra .i-atouts li,.infra .i-expertise li{display:grid;grid-template-columns:46px 1fr;column-gap:12px;align-items:start}
  .infra .i-atouts img,.infra .i-expertise li img{grid-row:1 / 3;width:46px}
  .infra .i-atouts b{font-size:14px;line-height:1.2}
  .infra .i-atouts span{font-size:13.5px;line-height:1.35;margin-top:3px}

  .infra .i-expertise{margin:0 -16px;padding:20px 16px 24px}
  .infra .i-titre h2{font-size:24px;line-height:1.1;letter-spacing:.02em}
  .infra .i-titre p{font-size:15px;margin-top:4px}
  .infra .i-expertise ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px 12px;margin-top:18px}
  .infra .i-expertise b{font-size:14px;line-height:1.2}
  .infra .i-expertise li span{font-size:13.5px;line-height:1.35;margin-top:3px}
  .infra .i-logo{margin-top:24px;text-align:center}
  .infra .i-logo img{width:220px;margin:0 auto}
  .infra .i-logo .signature{font-size:14px;letter-spacing:.098em;margin-top:6px}
  .infra .i-logo a{display:inline-block;margin-top:14px;padding:6px 18px;border-radius:3px;font-size:17px;letter-spacing:.08em}
}

/* ==========================================================================
   Impression : une page au format de l'affiche (3:2 paysage), sans marge.
   ========================================================================== */
@page{size:315mm 210mm;margin:0}
@media print{
  .fiche.infra{width:315mm;height:210mm}
  .infra .carte{-webkit-backdrop-filter:none;backdrop-filter:none;background:#F2F2F1}
  .infra #scheier-pvi{background:#F8F9F9}
}