:root{--serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;--navy:#050d1a;--navy2:#0a1b33;--blue:#0b6dff;--sky:#5aaeff;--ink:#0d1b2e;--mute:#4f5f76;--paper:#f2f6fc;--line:#dbe4f0;--r:14px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body.i2j-site{margin:0;font:17px/1.6 "Avenir Next","Segoe UI Variable Text","Segoe UI",Helvetica,Arial,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
.i2j-site img{display:block;max-width:100%;height:auto}
.i2j-site a{color:inherit;text-decoration:none}
.i2j-site h1,.i2j-site h2,.i2j-site h3{margin:0;line-height:1.12;letter-spacing:-.025em;font-weight:800}
.i2j-site :focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.wrap{width:min(1180px,92%);margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:12px;top:-60px;background:#fff;color:var(--ink);padding:10px 14px;border-radius:8px;z-index:50}
.skip:focus{top:12px}

/* logo */
.i2j-logo{width:auto;fill:#fff;display:block}
.i2j-logo .b{fill:var(--blue)}
.foot .i2j-logo{margin-bottom:12px}
.ico{flex-shrink:0}

/* bandeau utilitaire */
.util{background:#030914;color:#8aa0c4;font-size:13px}
.util-in{display:flex;justify-content:space-between;align-items:center;min-height:38px;gap:16px}
.util-r{display:flex;gap:26px;align-items:center}
.util a{display:inline-flex;align-items:center;gap:7px;color:#c3d3ec}
.util a:hover{color:#fff}

/* en-tête */
.top{position:sticky;top:0;z-index:40;background:rgba(7,18,36,.96);backdrop-filter:blur(12px);color:#fff;border-bottom:1px solid #16294a}
.top-in{display:flex;align-items:center;gap:36px;min-height:80px}
.brand{display:flex;align-items:center;gap:16px}
.brand span{font-size:11px;font-weight:600;color:#9fb3d1;letter-spacing:.14em;line-height:1.45;text-transform:uppercase;padding-left:16px;border-left:1px solid #2a4372}
.menu{display:flex;gap:28px;white-space:nowrap;margin-inline:auto;font-size:15px;font-weight:600}
.menu a{position:relative;padding:10px 0;color:#d5e1f4}
.menu a:after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--blue);transform:scaleX(0);transition:transform .2s}
.menu a:hover{color:#fff}
.menu a:hover:after{transform:scaleX(1)}
.menu .menu-cta{display:none}
.cta-top{background:var(--blue);color:#fff;font-weight:700;padding:13px 26px;border-radius:10px;font-size:15px;white-space:nowrap;box-shadow:0 6px 20px -6px rgba(11,109,255,.7);transition:background .2s}
.cta-top:hover{background:#2a82ff}
.burger{display:none;margin-left:auto;background:none;border:1px solid #27406b;border-radius:10px;width:46px;height:46px;cursor:pointer}
.burger i,.burger i:before,.burger i:after{display:block;width:20px;height:2px;background:#fff;margin:auto;position:relative;content:""}
.burger i:before{position:absolute;top:-6px;left:0}
.burger i:after{position:absolute;top:6px;left:0}

/* héros */
.hero{position:relative;z-index:2;color:#fff;text-align:center;background:radial-gradient(ellipse 62% 78% at 50% 46%,rgba(5,13,26,.80) 0,rgba(5,13,26,.48) 55%,rgba(5,13,26,.16) 100%),url(pcb.svg) center/cover no-repeat,linear-gradient(180deg,#071224,#050d1a)}
.hero-in{padding:52px 0 60px;display:flex;flex-direction:column;align-items:center}
.hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(32px,4.4vw,54px);line-height:1.1;letter-spacing:-.02em;color:#fff;max-width:none}

.hero h1 em{font-style:italic;font-weight:400;color:#8cc2ff}
.hero-in>p{color:#c3d3ec;font-size:17.5px;max-width:34em;margin:16px 0 26px}
.actions{display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.btn{display:inline-block;padding:13px 26px;border-radius:12px;font-weight:700;border:2px solid transparent;font-size:16px;transition:background .2s,border-color .2s}
.btn-main{background:var(--blue);color:#fff;box-shadow:0 10px 28px -10px rgba(11,109,255,.8)}
.btn-main:hover{background:#2a82ff}
.btn-ghost{border-color:#3a5688;color:#fff}
.btn-ghost:hover{background:#ffffff14;border-color:#5b7cb8}
.btn.big{font-size:20px;padding:17px 32px}
.hero-in>.meta{max-width:none;display:flex;flex-wrap:wrap;justify-content:center;margin:40px 0 0;font-size:15px;color:#9fb3d1}
.meta span{padding:0 22px;border-left:1px solid #2a4372;line-height:1.2}
.meta span:first-child{border-left:0}
.svc{position:relative;display:grid;grid-template-columns:repeat(4,1fr);transform:translateY(64px);background:linear-gradient(180deg,#0e2447,#0a1b36);border:1px solid #244a82;border-radius:20px;box-shadow:0 30px 60px -28px rgba(3,9,20,.85);overflow:hidden;text-align:left}
.svc a{position:relative;display:flex;gap:16px;align-items:center;padding:28px 26px;color:#9fb3d1;font-size:14.5px;line-height:1.4;transition:background .2s}
.svc a+a{border-left:1px solid #1d3a68}
.svc a:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--blue);transform:scaleX(0);transition:transform .25s}
.svc a:hover{background:rgba(11,109,255,.14)}
.svc a:hover:after{transform:scaleX(1)}
.svc .ico{color:var(--sky)}
.svc strong{display:block;color:#fff;font-size:17px;letter-spacing:-.01em;margin-bottom:2px}

/* sections */
.sec{padding:96px 0}
.ghead{text-align:center;max-width:720px;margin:0 auto 56px}
.ghead h2{font-family:var(--serif);font-weight:500;font-size:clamp(30px,3.6vw,44px);letter-spacing:-.015em}
.ghead h2:after{content:"";display:block;width:56px;height:3px;margin:20px auto 0;background:linear-gradient(90deg,var(--blue),var(--sky));border-radius:2px}
.ghead p{color:var(--mute);margin:18px 0 0;font-size:18px}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.card{display:flex;align-items:center;gap:14px;padding:16px 18px;background:#fff;border:1px solid var(--line);border-radius:14px;transition:border-color .2s,box-shadow .2s}
.card:hover{border-color:#8db8ff;box-shadow:0 10px 26px -18px rgba(11,109,255,.6)}
.card .ci{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:#eaf2ff;color:var(--blue);margin:0;flex-shrink:0}
.card:hover .ci{background:var(--blue);color:#fff}
.ct{display:flex;flex-direction:column;gap:2px;min-width:0}
.card strong{font-size:15.5px;line-height:1.25;letter-spacing:-.01em}
.cd{font-size:13px;color:var(--mute);line-height:1.4}
#offres{padding-top:150px;padding-bottom:72px;background:var(--paper)}
#offres .ghead{margin-bottom:36px}

/* annonce */
.promo{position:relative;background:linear-gradient(90deg,#0a4fc2,#0b6dff 50%,#2a82ff);color:#fff;font-size:14px}
.promo-link{display:flex;align-items:center;justify-content:center;gap:12px;min-height:42px;padding:8px 56px 8px 20px;text-align:center;line-height:1.35}
.promo-link .ico{flex-shrink:0;opacity:.95}
.promo-link em{font-style:normal;font-weight:700;border-bottom:1px solid rgba(255,255,255,.55);white-space:nowrap}
.promo-link:hover em{border-color:#fff}
.promo-x{position:absolute;top:50%;right:14px;transform:translateY(-50%);width:30px;height:30px;border:0;border-radius:50%;background:transparent;color:#fff;font-size:22px;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0 0 2px}
.promo-x:hover{background:rgba(255,255,255,.2)}
.promo.out{display:none}

/* marques (sous les boutons de la bannière) */
.brands{margin-top:28px;width:min(820px,100%);padding:18px 26px 16px;border:1px solid #1f3a66;border-radius:16px;background:rgba(255,255,255,.03)}
.brands .b-label{margin:0 0 12px;font-size:13px;color:#8aa0c4;letter-spacing:.02em}
.brands ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;row-gap:10px}
.brands li{padding:4px 26px;border-left:1px solid #26467a;display:flex;align-items:center;min-height:26px}
.brands li:first-child{border-left:0}
.brands li span{font-size:17px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#c9d8f0}
.brands li img{height:22px;width:auto;filter:brightness(0) invert(1);opacity:.85}
.brands .b-more{margin:14px 0 0;font-size:13px;color:#8aa0c4}
.brands .b-more a{color:var(--sky);border-bottom:1px solid rgba(90,174,255,.4)}

/* réparation : photos en alternance */
.tone-reparation .rhead{margin-bottom:12px}
.tone-reparation .rhead h2{font-size:clamp(28px,3.4vw,42px);font-weight:800;letter-spacing:-.025em;line-height:1.12}
.lead{color:var(--mute);max-width:40em;margin:14px 0 0;font-size:18px}
.row{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:64px 0}
.row:first-of-type{margin-top:28px}
.row+.row:before{content:"";position:absolute;top:0;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,#b4c6e2 22%,#b4c6e2 78%,transparent)}
.row+.row:after{content:"";position:absolute;top:-4px;left:50%;width:8px;height:8px;margin-left:-4px;background:var(--blue);transform:rotate(45deg);border-radius:1px;box-shadow:0 0 0 5px #fff}
.row:nth-of-type(even) .shot{order:2}
.shot{width:100%;border-radius:var(--r);box-shadow:14px 14px 0 #d6e6ff;aspect-ratio:16/9;object-fit:cover}
.row h3{font-size:clamp(24px,2.4vw,31px)}
.row-txt p{margin:0 0 14px;color:var(--ink)}
.row-txt .note{color:var(--mute)}
.row-txt .who{color:var(--blue);margin:8px 0 14px}

/* rubriques : une nuance par catégorie */
.tone-reparation{background:#fff}
.tone-reseau-securite{background:radial-gradient(900px 400px at 10% 0,rgba(11,109,255,.22),transparent 70%),url(netsec.svg) center/cover no-repeat,linear-gradient(180deg,#071a33,#0a2549);color:#d5e1f4}
.tone-assistance{background:linear-gradient(180deg,#dce9fc,#eaf2fe)}
.tone-domicile{background:#fff}
.tone-reseau-securite .ghead h2{color:#fff}
.tone-reseau-securite .ghead p{color:#9fb3d1}
.items{display:grid;grid-template-columns:repeat(6,1fr);gap:24px}
.item{grid-column:span 2;position:relative;padding:38px 30px 32px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 44px -34px rgba(13,27,46,.5)}
.item:before{content:"";position:absolute;left:30px;top:0;width:48px;height:4px;background:var(--blue);border-radius:0 0 4px 4px}
.items.n2 .item{grid-column:span 3}
.items.n5 .item:nth-child(4){grid-column:2/span 2}
.item .ci{display:grid;place-items:center;width:58px;height:58px;border-radius:16px;background:var(--navy2);color:var(--sky);margin-bottom:20px}
.item h3{font-size:22px;letter-spacing:-.015em}
.who{margin:8px 0 14px;color:var(--blue);font-weight:700;font-size:15px}
.item p{margin:0 0 14px;color:var(--mute)}
.item .who{color:var(--blue)}
.ticks{list-style:none;padding:0;margin:0 0 6px;display:grid;gap:9px;font-size:16px}
.ticks li{padding-left:30px;position:relative}
.ticks li:before{content:"";position:absolute;left:0;top:.45em;width:16px;height:9px;border-left:3px solid var(--blue);border-bottom:3px solid var(--blue);transform:rotate(-45deg) scale(.85);transform-origin:left top}
.item .note{font-size:14px;color:var(--mute);background:var(--paper);border-left:3px solid var(--blue);padding:10px 14px;border-radius:0 8px 8px 0;margin:14px 0 0}
.tone-reseau-securite .item{background:rgba(8,26,52,.82);border-color:#23497e;box-shadow:none;backdrop-filter:blur(2px)}
.tone-reseau-securite .item h3{color:#fff}
.tone-reseau-securite .item p{color:#b8c9e6}
.tone-reseau-securite .item .who{color:var(--sky)}
.tone-reseau-securite .ci{background:rgba(11,109,255,.22)}
.tone-reseau-securite .ticks li{color:#d5e1f4}
.tone-reseau-securite .ticks li:before{border-color:var(--sky)}
.tone-reseau-securite .item .note{background:rgba(255,255,255,.06);color:#b8c9e6}
.tone-assistance{padding:80px 0}
.senior{display:grid;grid-template-columns:6fr 5fr;gap:40px;align-items:center;max-width:980px;margin:0 auto 24px;background:#fff;border:1px solid #cfe0fa;border-radius:20px;padding:20px;box-shadow:0 24px 44px -34px rgba(13,27,46,.5)}
.senior-photo{width:100%;height:auto;border-radius:14px;display:block}
.badge{display:inline-flex;align-items:center;gap:8px;background:#e4eefe;color:#0b57d0;font-weight:700;font-size:13.5px;padding:6px 12px 6px 10px;border-radius:999px;margin-bottom:14px}
.senior-txt h3{font-size:clamp(22px,2.3vw,28px)}
.senior-txt p{margin:10px 0 14px;color:var(--mute)}
.senior .ticks{font-size:15.5px}
.daily{display:grid;grid-template-columns:1fr 1.25fr;gap:28px;align-items:center;max-width:980px;margin:0 auto;padding:20px 28px;background:rgba(255,255,255,.7);border:1px solid #cfe0fa;border-radius:18px}
.daily h3{font-size:19px}
.daily p{margin:6px 0 0;color:var(--mute);font-size:15px}
.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.chips li{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid #cfe0fa;border-radius:999px;padding:9px 16px 9px 12px;font-weight:600;font-size:14.5px}
.chips .ico{color:var(--blue)}

/* étapes */
.steps{background:var(--paper)}
.steps ol{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;padding:0;margin:0}
.steps li{counter-increment:s;padding-top:20px;border-top:3px solid var(--blue);color:var(--mute)}
.steps li:before{content:counter(s);display:block;font-weight:800;font-size:34px;color:var(--blue);line-height:1;margin-bottom:10px}
.steps strong{display:block;color:var(--ink);font-size:20px;margin-bottom:4px}

/* appel à l'action */
.cta{background:linear-gradient(120deg,var(--navy),#0b2a57);color:#fff;padding:64px 0}
.cta-in{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
.cta h2{font-size:clamp(26px,3vw,38px);max-width:16em}
.cta p{margin:10px 0 0;color:#c3d3ec}

/* pied de page */
.foot{background:var(--navy);color:#b8c9e6;padding:44px 0 26px;font-size:15px}
.foot-in{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:32px}
.foot p{margin:0}
.foot a:hover{color:#fff;text-decoration:underline}
.foot .legal{margin-top:28px;padding-top:18px;border-top:1px solid #16294a;font-size:13px;color:#8aa0c4}

@media(max-width:1080px){.menu{gap:20px;font-size:14px}.top-in{gap:22px}.brand span{display:none}}
@media(max-width:980px){
  .util-in>span:first-child{display:none}.util-in{justify-content:flex-end}
  .menu{position:absolute;left:0;right:0;top:100%;background:#071224;flex-direction:column;gap:0;padding:8px 4% 18px;display:none;border-bottom:1px solid #16294a;margin:0}
  .menu.open{display:flex}
  .menu a{padding:15px 0;border-top:1px solid #16294a}
  .menu a:after{display:none}
  .menu .menu-cta{display:block;margin-top:14px;text-align:center;background:var(--blue);border-radius:10px;border:0;font-weight:700}
  .cta-top{display:none}
  .burger{display:block}
  .hero-in{padding:64px 0 84px}
  .svc{grid-template-columns:1fr 1fr}
  .svc a:nth-child(3){border-left:0}
  .svc a:nth-child(n+3){border-top:1px solid #1d3a68}
  .cards{grid-template-columns:repeat(2,1fr)}
  .items,.items.n2{grid-template-columns:1fr 1fr}
  .row{grid-template-columns:1fr;gap:28px;padding:44px 0}
  .senior,.daily{grid-template-columns:1fr;gap:22px}
  .chips{justify-content:flex-start}
  .row:nth-of-type(even) .shot{order:0}
  .shot{box-shadow:8px 8px 0 #d6e6ff}
  .item,.items.n2 .item,.items.n5 .item:nth-child(4){grid-column:auto}
  .items .item:last-child:nth-child(odd){grid-column:1/-1}
  .steps ol,.foot-in{grid-template-columns:1fr}
  .sec{padding:72px 0}

}
@media(max-width:980px){.tone-reseau-securite{background:radial-gradient(600px 300px at 10% 0,rgba(11,109,255,.22),transparent 70%),url(netsec.svg) 40% 0/1100px auto repeat-y,linear-gradient(180deg,#071a33,#0a2549)}}
@media(max-width:620px){
  .top-in{min-height:68px}
  .hero-in>p{font-size:17px}
  .btn{width:100%;text-align:center}
  .promo{font-size:13px}
  .promo-link{justify-content:flex-start;padding:8px 48px 8px 14px;text-align:left}
  .promo-link em{display:none}
  .brands{padding:16px 12px}
  .brands li{padding:4px 14px}
  .brands li span{font-size:15px}
  .meta{flex-direction:column;gap:8px}.meta span{border:0;padding:0}
  .svc,.items,.items.n2,.cards{grid-template-columns:1fr}
  .svc a+a{border-left:0;border-top:1px solid #1d3a68}
  .svc a:nth-child(n+3){border-top:1px solid #1d3a68}
  .items .item:last-child:nth-child(odd){grid-column:auto}
  .ghead{margin-bottom:40px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card img{transition:none}.card:hover img{transform:none}}


/* ==========================================================================
   OPTIMISATION MOBILE — I2J
   Règles enfermées dans des media queries « max-width » : le rendu
   ordinateur (écrans > 980 px) n'est pas modifié.
   ========================================================================== */
@media(max-width:980px){
.util-in{min-height:40px}
.util a{min-height:40px}
.top-in{min-height:66px}
.burger{width:46px;height:46px}
.hero h1{text-wrap:balance}
.hero-in{padding:44px 0 32px}
.svc{transform:none;margin-top:0}
.hero{padding-bottom:30px}
#offres{padding-top:64px}
}

@media(max-width:620px){
body.i2j-site{font-size:16px}
html{scroll-padding-top:76px}

/* Bannière : titre, texte, boutons */
.hero-in{padding:38px 0 28px}
.hero h1{font-size:clamp(30px,8.6vw,38px);line-height:1.12}
.hero-in>p{margin:14px 0 22px;font-size:16px;line-height:1.55}
.actions{width:100%;gap:10px}
.btn{width:100%;min-height:52px;display:flex;align-items:center;justify-content:center;padding:12px 20px}
.btn.big{font-size:19px;padding:14px 20px}

/* Marques : grille 3 colonnes régulière */
.brands{margin-top:24px;padding:16px 12px 14px;border-radius:16px}
.brands ul{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.brands li{justify-content:center;min-height:40px;padding:6px 4px;border:1px solid #26467a;border-radius:10px;background:rgba(255,255,255,.04)}
.brands li:first-child{border-left:1px solid #26467a}
.brands li span{font-size:13px;letter-spacing:.1em}
.brands .b-more{margin-top:12px;font-size:12.5px}

/* Accès rapide : 2 × 2 */
.svc{grid-template-columns:1fr 1fr;margin-top:22px;border-radius:18px}
.svc a{flex-direction:column;align-items:flex-start;gap:10px;padding:18px 16px;font-size:12.5px}
.svc a+a{border-left:1px solid #1d3a68;border-top:0}
.svc a:nth-child(odd){border-left:0}
.svc a:nth-child(n+3){border-top:1px solid #1d3a68}
.svc strong{font-size:15px;line-height:1.25}

/* Sections */
.sec{padding:56px 0}
#offres{padding-top:56px;padding-bottom:48px}
.ghead{margin-bottom:30px}
.ghead h2{font-size:clamp(27px,7.6vw,32px)}
.ghead h2:after{margin-top:16px}
.ghead p{margin-top:14px;font-size:16px}
.tone-assistance{padding:56px 0}

/* « Toutes nos offres » : 12 cartes en 2 colonnes compactes */
.cards{grid-template-columns:1fr 1fr;gap:10px}
.card{flex-direction:column;align-items:flex-start;gap:10px;padding:14px 14px 15px;border-radius:14px}
.card .ci{width:40px;height:40px;border-radius:11px}
.card strong{font-size:14.5px}
.cd{font-size:12.5px}

/* Aide au quotidien */
.senior{gap:18px;padding:14px;border-radius:18px}
.senior-photo{border-radius:12px}
.senior-txt p{font-size:15px}
.daily{padding:18px 16px;border-radius:16px}
.chips{gap:8px}
.chips li{font-size:14px;padding:8px 14px 8px 11px}

/* Réparation : visuels bien cadrés */
.row{gap:20px;padding:36px 0}
.shot{aspect-ratio:16/10;border-radius:12px;box-shadow:6px 6px 0 #d6e6ff;width:calc(100% - 6px)}
.row h3{font-size:25px}
.lead{font-size:16px}

/* Rubriques en cartes */
.item{padding:32px 22px 26px;border-radius:18px}
.item:before{left:22px}
.item h3{font-size:21px}

/* Étapes, appel à l'action, pied de page */
.steps ol{gap:22px}
.cta{padding:48px 0}
.cta-in{flex-direction:column;align-items:stretch;gap:24px;text-align:center}
.cta h2{max-width:none;font-size:clamp(25px,7.2vw,30px)}
.foot{padding:36px 0 calc(24px + env(safe-area-inset-bottom,0px))}
.foot-in{gap:22px}
.foot a{display:inline-block;padding:4px 0}
}

@media(max-width:380px){
.hero h1{font-size:28px}
.svc a{padding:16px 12px}
.svc strong{font-size:14px}
.brands li span{font-size:12px}
.card{padding:12px}
}

/* ======================================================================
   FINITIONS & ISOLATION VISUELLE — I2J
   Protège la page partenaire des styles globaux du thème WordPress et
   harmonise les composants sur toutes les largeurs d'écran.
   ====================================================================== */
body.i2j-site{
  --i2j-shadow:0 18px 42px -30px rgba(5,18,42,.34);
  overflow-x:hidden;
  background:#fff!important;
  color:var(--ink);
  font-family:"Avenir Next","Segoe UI Variable Text","Segoe UI",Helvetica,Arial,sans-serif;
}
.i2j-site *, .i2j-site *::before, .i2j-site *::after{box-sizing:border-box}
.i2j-site main,.i2j-site header,.i2j-site footer,.i2j-site section,.i2j-site nav,.i2j-site article,.i2j-site div{min-width:0}
.i2j-site main{display:block;width:100%;max-width:none;margin:0;padding:0;overflow:clip}
.i2j-site section{position:relative;max-width:none;margin-inline:0}
.i2j-site p{max-width:100%;overflow-wrap:break-word}
.i2j-site h1,.i2j-site h2,.i2j-site h3,.i2j-site strong{overflow-wrap:normal;word-break:normal}
.i2j-site a{box-shadow:none;text-decoration:none}
.i2j-site button,.i2j-site input,.i2j-site select,.i2j-site textarea{font:inherit}
.i2j-site .wrap{width:min(1180px,92%);max-width:1180px;margin-left:auto;margin-right:auto}
.i2j-site .hero{isolation:isolate;overflow:visible}
.i2j-site .hero-in{width:min(1180px,92%)}
.i2j-site .hero h1{max-width:900px;text-wrap:balance}
.i2j-site .hero-in>p{max-width:650px;text-wrap:pretty}
.i2j-site .svc{z-index:3;max-width:1180px}
.i2j-site .svc a{min-width:0;overflow-wrap:anywhere}
.i2j-site .svc a span{min-width:0}
.i2j-site .card,.i2j-site .item,.i2j-site .senior,.i2j-site .daily{min-width:0;box-shadow:var(--i2j-shadow)}
.i2j-site .card{height:100%;align-items:center}
.i2j-site .card .ct{min-width:0}
.i2j-site .card strong,.i2j-site .cd{overflow-wrap:anywhere}
.i2j-site .items{align-items:stretch;grid-auto-rows:1fr}
.i2j-site .item{height:100%;overflow:hidden}
.i2j-site .item h3{line-height:1.2;text-wrap:balance}
.i2j-site .item p,.i2j-site .row-txt p,.i2j-site .senior-txt p{line-height:1.65}
.i2j-site .ticks li{line-height:1.5;overflow-wrap:anywhere}
.i2j-site .tone-reseau-securite .item{background:rgba(7,23,46,.94);border-color:rgba(120,169,235,.28)}
.i2j-site .tone-assistance{background:linear-gradient(145deg,#edf4ff 0%,#e5efff 52%,#f5f8ff 100%)}
.i2j-site .senior,.i2j-site .daily{border-color:#d8e5f7}
.i2j-site .senior-photo{aspect-ratio:1.9;object-fit:cover}
.i2j-site .row{min-width:0}
.i2j-site .shot{box-shadow:10px 10px 0 #e2edfc}
.i2j-site .cta{overflow:hidden}
.i2j-site .cta-in .actions{max-width:100%}
.i2j-site .foot-in>div,.i2j-site .foot-in>p{min-width:0;overflow-wrap:anywhere}
.i2j-site .foot .i2j-logo{width:114px;height:auto}

@media(max-width:1100px){
  .i2j-site .top-in{gap:18px}
  .i2j-site .menu{gap:16px;font-size:13.5px}
  .i2j-site .cta-top{padding:12px 17px}
  .i2j-site .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .i2j-site .items{gap:18px}
}
@media(max-width:980px){
  .i2j-site .hero{padding-bottom:28px}
  .i2j-site .hero-in{padding-top:48px;padding-bottom:32px}
  .i2j-site .svc{transform:none;margin-top:0}
  .i2j-site #offres{padding-top:66px}
  .i2j-site .items,.i2j-site .items.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .i2j-site .items .item:last-child:nth-child(odd){grid-column:1/-1}
  .i2j-site .row{grid-template-columns:minmax(0,1fr);gap:28px}
  .i2j-site .row .shot{order:0;width:100%;max-width:760px}
}
@media(max-width:620px){
  .i2j-site{font-size:16px;line-height:1.55}
  .i2j-site .wrap,.i2j-site .hero-in{width:calc(100% - 36px)}
  .i2j-site .util-in{justify-content:center}
  .i2j-site .util-r{gap:16px;flex-wrap:wrap;justify-content:center}
  .i2j-site .top{position:sticky}
  .i2j-site .top-in{min-height:66px;gap:12px}
  .i2j-site .brand .i2j-logo{width:92px;height:auto}
  .i2j-site .burger{flex:0 0 44px}
  .i2j-site .hero{padding-bottom:22px}
  .i2j-site .hero-in{padding:38px 0 26px}
  .i2j-site .hero h1{font-size:clamp(29px,8vw,37px);line-height:1.12}
  .i2j-site .hero-in>p{font-size:15.5px;line-height:1.6}
  .i2j-site .actions{width:100%;display:grid;grid-template-columns:1fr;gap:10px}
  .i2j-site .btn,.i2j-site .btn.big{width:100%;min-height:49px;padding:12px 16px;font-size:15.5px;white-space:normal;line-height:1.3}
  .i2j-site .brands{width:100%;margin-top:22px;padding:15px 12px;border-radius:15px}
  .i2j-site .brands li{min-width:0;padding:6px 3px}
  .i2j-site .brands li span{font-size:12px;letter-spacing:.06em}
  .i2j-site .svc{width:calc(100% - 36px);margin-top:0;grid-template-columns:repeat(2,minmax(0,1fr));border-radius:16px}
  .i2j-site .svc a{min-width:0;padding:16px 12px;gap:8px;font-size:12px;overflow-wrap:anywhere}
  .i2j-site .svc strong{font-size:14px}
  .i2j-site .sec,.i2j-site .tone-assistance{padding:52px 0}
  .i2j-site #offres{padding:54px 0 44px}
  .i2j-site .ghead{margin-bottom:28px}
  .i2j-site .ghead h2,.i2j-site .tone-reparation .rhead h2{font-size:clamp(26px,7vw,32px);line-height:1.16}
  .i2j-site .ghead p,.i2j-site .lead{font-size:15px;line-height:1.6}
  .i2j-site .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .i2j-site .card{padding:13px 12px;gap:9px;min-height:132px;border-radius:13px}
  .i2j-site .card .ci{width:38px;height:38px;flex:0 0 38px}
  .i2j-site .card strong{font-size:13.5px;line-height:1.25}
  .i2j-site .cd{font-size:11.5px;line-height:1.4}
  .i2j-site .senior{grid-template-columns:minmax(0,1fr);padding:12px;gap:16px}
  .i2j-site .senior-photo{width:100%;aspect-ratio:16/9}
  .i2j-site .daily{grid-template-columns:minmax(0,1fr);gap:16px;padding:17px 14px}
  .i2j-site .chips{justify-content:flex-start}
  .i2j-site .chips li{max-width:100%;font-size:12.5px;padding:8px 11px}
  .i2j-site .row{padding:30px 0;gap:19px}
  .i2j-site .shot{width:calc(100% - 6px);aspect-ratio:16/10}
  .i2j-site .row h3{font-size:23px;line-height:1.2}
  .i2j-site .row-txt p,.i2j-site .item p{font-size:14.5px}
  .i2j-site .items,.i2j-site .items.n2{grid-template-columns:minmax(0,1fr);gap:14px;grid-auto-rows:auto}
  .i2j-site .items .item:last-child:nth-child(odd){grid-column:auto}
  .i2j-site .item{height:auto;padding:28px 20px 23px}
  .i2j-site .item h3{font-size:20px}
  .i2j-site .ticks{font-size:14.5px;gap:8px}
  .i2j-site .cta{padding:42px 0}
  .i2j-site .cta-in{gap:20px}
  .i2j-site .cta h2{font-size:26px;line-height:1.2}
  .i2j-site .foot-in{grid-template-columns:minmax(0,1fr);gap:18px}
  .i2j-site .foot .legal{font-size:11.5px;line-height:1.5}
}
@media(max-width:380px){
  .i2j-site .wrap,.i2j-site .hero-in,.i2j-site .svc{width:calc(100% - 28px)}
  .i2j-site .cards{gap:8px}
  .i2j-site .card{padding:11px 9px;min-height:128px}
  .i2j-site .card strong{font-size:12.5px}
  .i2j-site .cd{font-size:11px}
  .i2j-site .svc a{padding:14px 10px}
  .i2j-site .svc strong{font-size:13px}
}


/* Correctifs de finition : aucune section ni aucun texte ne doit être rogné. */
.i2j-site main{overflow:visible!important}
.i2j-site .sec,.i2j-site .grp,.i2j-site .row,.i2j-site .item,.i2j-site .senior,.i2j-site .daily,.i2j-site .cta{overflow:visible}
.i2j-site .items{grid-auto-rows:auto;align-items:stretch}
.i2j-site .item{height:auto;min-height:100%;padding-bottom:30px}
.i2j-site .item h3,.i2j-site .item p,.i2j-site .item ul{max-width:100%;}
.i2j-site .hero{background-color:#071224;background-image:radial-gradient(ellipse 68% 88% at 50% 48%,rgba(5,13,26,.72) 0,rgba(5,13,26,.36) 58%,rgba(5,13,26,.10) 100%),url(pcb.svg),linear-gradient(180deg,#071224,#050d1a);background-position:center,center,center;background-size:cover,cover,cover;background-repeat:no-repeat}
.i2j-site .hero h1,.i2j-site .hero-in>p,.i2j-site .hero .actions,.i2j-site .hero .meta{position:relative;z-index:1}
@media(max-width:620px){
 .i2j-site .items,.i2j-site .items.n2{grid-auto-rows:auto}
 .i2j-site .item{min-height:0;height:auto;overflow:visible;padding:26px 20px 27px}
 .i2j-site .hero{background-position:center,58% center,center}
}

/* ==========================================================================
   v2.18 — Fonds d'image plus discrets (accueil et « Réseau et sécurité »)
   Un voile sombre est posé par-dessus l'image : le motif reste visible mais
   ne prend plus le dessus sur les textes.
   ========================================================================== */
.i2j-site .hero{box-shadow:inset 0 0 0 3000px rgba(5,13,26,.58)}
.i2j-site .tone-reseau-securite{box-shadow:inset 0 0 0 3000px rgba(7,26,51,.62)}
.i2j-site .hero,.i2j-site .tone-reseau-securite{isolation:isolate}

/* ==========================================================================
   v2.18 — Espace « Marketing et digital »
   ========================================================================== */
.i2j-site .dg{background:radial-gradient(rgba(140,180,240,.07) 1px,transparent 1.6px) 0 0/28px 28px,linear-gradient(160deg,#0a1630 0%,#10224f 55%,#0b1a3b 100%);color:#e6eefb}
.i2j-site .dg .ghead h2{color:#fff}
.i2j-site .dg .ghead p{color:#c9d8ee}
.i2j-site .dg .badge{background:rgba(90,174,255,.16);color:#c4e1ff;border:1px solid rgba(140,190,255,.35);margin-bottom:18px}
.dg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.dg-card{position:relative;padding:30px 26px 26px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(140,180,240,.28)}
.dg-card .ci{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:rgba(90,174,255,.18);color:#9ad0ff;margin-bottom:18px}
.dg-card h3{font-size:21px;color:#fff;letter-spacing:-.015em}
.dg-card p{margin:10px 0 16px;color:#d2dff2;font-size:16px}
.dg-card .ticks{font-size:15.5px;color:#e6eefb}
.dg-card .ticks li:before{border-color:var(--sky)}
.dg-steps{list-style:none;counter-reset:dg;display:grid;grid-template-columns:repeat(3,1fr);gap:26px;padding:0;margin:48px 0 0}
.dg-steps li{counter-increment:dg;padding-top:18px;border-top:3px solid var(--sky);color:#d2dff2}
.dg-steps li:before{content:counter(dg);display:block;font-weight:800;font-size:30px;line-height:1;color:var(--sky);margin-bottom:8px}
.dg-steps strong{display:block;color:#fff;font-size:19px;margin-bottom:4px}
.dg-cta{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;margin-top:44px;padding-top:28px;border-top:1px solid rgba(140,180,240,.25)}
.dg-note{margin:0;max-width:44em;font-size:14.5px;color:#b9cbe5}
.dg-cta .actions{display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:980px){.dg-grid{grid-template-columns:repeat(2,1fr)}.dg-steps{grid-template-columns:1fr}}
@media(max-width:620px){.dg-grid{grid-template-columns:1fr;gap:14px}.dg-card{padding:26px 20px 22px}.dg-steps{margin-top:34px;gap:20px}.dg-cta{flex-direction:column;align-items:stretch;text-align:left;margin-top:34px}.dg-cta .actions{flex-direction:column}}

/* ==========================================================================
   v2.18.2 — Bouton « Boutique Pièces Info », photo senior entière, rubriques marketing mises en valeur
   ========================================================================== */
/* Bouton retour vers la boutique */
.i2j-site .util a.pi-back{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:5px 14px;border-radius:999px;background:#0a5fe0;color:#fff;font-weight:700;font-size:13.5px;border:1px solid #4d94ff;box-shadow:0 4px 14px -6px rgba(11,109,255,.9);transition:background .2s,transform .2s}
.i2j-site .util a.pi-back:hover,.i2j-site .util a.pi-back:focus-visible{background:#0b6dff;color:#fff;transform:translateY(-1px);text-decoration:none}
.i2j-site .pi-back .ico{flex:none}
.i2j-site .foot a.pi-back-foot{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:9px 18px;margin-bottom:10px;border-radius:12px;background:#0a5fe0;color:#fff;font-weight:700;border:1px solid #4d94ff;text-decoration:none}
.i2j-site .foot a.pi-back-foot:hover{background:#0b6dff;color:#fff;text-decoration:none}

/* Photo « Aide aux seniors » : image entière, jamais rognée (ancien cadrage 16/9 sur mobile) */
.i2j-site .senior-photo{width:100%;height:auto;aspect-ratio:750/394;object-fit:contain;object-position:center;background:#eaf2fe}
@media(max-width:620px){.i2j-site .senior-photo{aspect-ratio:750/394}}

/* Pastille « Nouveau » */
.i2j-site .tag-new{display:inline-block;font-style:normal;font-weight:800;font-size:10.5px;line-height:1;letter-spacing:.06em;text-transform:uppercase;padding:4px 7px;border-radius:999px;background:#ffcf33;color:#1a1300;vertical-align:middle;margin-left:6px}
.i2j-site .menu a.menu-new i{display:inline-block;font-style:normal;font-weight:800;font-size:10px;line-height:1;letter-spacing:.06em;text-transform:uppercase;padding:4px 7px;border-radius:999px;background:#ffcf33;color:#1a1300;margin-left:7px;vertical-align:middle}
.i2j-site .dg .badge .tag-new{margin-left:10px}

/* Accueil : bandeau d'accès direct à l'espace marketing */
.i2j-site .hero-new{display:inline-flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;margin:26px auto 0;padding:10px 18px;border-radius:16px;background:rgba(11,109,255,.28);border:1px solid #5b9dff;color:#fff;font-size:15.5px;line-height:1.35;position:relative;z-index:1;box-shadow:0 10px 30px -14px rgba(11,109,255,.9);transition:background .2s,transform .2s}
.i2j-site .hero-new:hover{background:rgba(11,109,255,.45);transform:translateY(-1px)}
.i2j-site .hero-new b{background:#ffcf33;color:#1a1300;font-size:11px;letter-spacing:.07em;text-transform:uppercase;padding:5px 9px;border-radius:999px}
.i2j-site .hero-new em{font-style:normal;font-weight:700;display:inline-flex;align-items:center;gap:6px;border-bottom:1px solid rgba(255,255,255,.55)}

/* « Toutes nos offres » : cartes marketing mises en avant */
.i2j-site .card.card-new{border-color:#7fb0ff;background:linear-gradient(180deg,#f3f8ff,#e6f0ff);box-shadow:0 14px 30px -20px rgba(11,109,255,.75)}
.i2j-site .card.card-new .ci{background:var(--blue);color:#fff}

/* Espace marketing : plus grand, plus lumineux */
.i2j-site .dg{padding-top:112px;padding-bottom:112px;border-top:4px solid #ffcf33;box-shadow:0 -24px 60px -30px rgba(11,109,255,.55)}
.i2j-site .dg .ghead h2{font-size:clamp(34px,4.4vw,54px)}
.i2j-site .dg .ghead p{font-size:19px}
.i2j-site .dg-card{background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.04));border-color:rgba(140,190,255,.42);box-shadow:0 22px 44px -28px rgba(0,0,0,.7);transition:transform .2s,border-color .2s}
.i2j-site .dg-card:hover{transform:translateY(-4px);border-color:#7fb8ff}
.i2j-site .dg-card:before{content:"";position:absolute;left:26px;top:0;width:56px;height:4px;border-radius:0 0 4px 4px;background:linear-gradient(90deg,#ffcf33,#ffe58a)}
.i2j-site .dg-card .ci{width:58px;height:58px;background:rgba(255,207,51,.16);color:#ffd95e}
@media(max-width:620px){.i2j-site .dg{padding-top:68px;padding-bottom:68px}.i2j-site .hero-new{font-size:14.5px;padding:10px 14px}}

/* ==========================================================================
   v2.18.3 — Correctifs d'affichage : chevauchements et éléments coupés
   ========================================================================== */

/* 1. En-tête : le menu ne doit jamais passer sous le bouton « Contactez-nous ».
      Le menu occupe l'espace restant et se resserre ; en dessous de 1180 px
      on bascule sur le menu burger (le menu complet ne tient plus). */
.i2j-site .top-in{gap:clamp(14px,2vw,32px)}
.i2j-site .brand{flex:0 0 auto}
.i2j-site .menu{flex:1 1 auto;min-width:max-content;justify-content:center;margin-inline:0;gap:clamp(12px,1.6vw,26px);font-size:clamp(13.5px,1.15vw,15px)}
.i2j-site .menu a{flex:0 0 auto}
.i2j-site .menu a.menu-new{display:inline-flex;align-items:center}
.i2j-site .cta-top{flex:0 0 auto}
@media(max-width:1439px){.i2j-site .brand span{display:none}}
@media(max-width:1180px){
  .i2j-site .menu{position:absolute;left:0;right:0;top:100%;background:#071224;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;padding:8px 4% 18px;display:none;border-bottom:1px solid #16294a;margin:0;font-size:16px;max-height:calc(100vh - 120px);overflow-y:auto}
  .i2j-site .menu.open{display:flex}
  .i2j-site .menu a{padding:15px 0;border-top:1px solid #16294a;white-space:normal}
  .i2j-site .menu a:after{display:none}
  .i2j-site .menu .menu-cta{display:block;margin-top:14px;text-align:center;background:var(--blue);border-radius:10px;border:0;font-weight:700;padding:15px 0}
  .i2j-site .cta-top{display:none}
  .i2j-site .burger{display:block;margin-left:auto;flex:0 0 46px}
}

/* 2. Accès rapide : plus de translateY (qui laissait un vide ou un recouvrement
      selon la hauteur de la bannière). Le bloc déborde de la bannière avec une
      marge négative, et la section suivante réserve exactement cet espace. */
.i2j-site .hero{overflow:visible;padding-bottom:0}
.i2j-site .hero .svc{transform:none;margin-top:0;margin-bottom:-64px}
.i2j-site #offres{padding-top:calc(64px + 72px)}
@media(max-width:980px){
  .i2j-site .hero .svc{margin-bottom:0}
  .i2j-site .hero{padding-bottom:28px}
  .i2j-site #offres{padding-top:56px}
}

/* 3. Bannière « Nouveau » de l'accueil : jamais plus large que l'écran */
.i2j-site .hero-new{max-width:100%;text-align:center}
.i2j-site .hero-new span{min-width:0}
@media(max-width:620px){
  .i2j-site .hero-new{display:flex;flex-direction:column;gap:6px;width:100%;border-radius:14px}
}

/* 4. Bandeau d'annonce (haut de page) : texte et croix ne se recouvrent pas */
.i2j-site .promo-link{padding-right:56px}
.i2j-site .promo-link span{min-width:0}
@media(max-width:620px){.i2j-site .promo-link{padding:9px 46px 9px 14px}}

/* 5. Bandeau utilitaire : retour à la ligne propre sur petits écrans */
@media(max-width:620px){
  .i2j-site .util-in{padding-block:6px}
  .i2j-site .util a.pi-back{min-height:38px}
}

/* 6. Ancres : la barre d'en-tête collante ne doit pas masquer les titres */
html{scroll-padding-top:92px}
.i2j-site section[id],.i2j-site article[id]{scroll-margin-top:92px}

/* 7. Étiquettes « Nouveau » : retour à la ligne propre dans les cartes */
.i2j-site .card strong{display:block}
.i2j-site .card .tag-new{margin-left:0;margin-top:3px;display:inline-block}
.i2j-site .dg-card h3{overflow-wrap:break-word}

/* 8. Réparation : les images gardent leur cadre, ombre décalée incluse */
.i2j-site .row{overflow:visible}
.i2j-site .shot{max-width:100%;height:auto;margin-right:10px}
@media(max-width:980px){.i2j-site .row .shot{margin-right:10px;width:calc(100% - 10px)}}

/* 9. Cartes « rubriques » : rien n'est rogné, y compris la barre bleue du haut */
.i2j-site .item{overflow:visible}
.i2j-site .items.n5 .item:nth-child(4){grid-column:2/span 2}
.i2j-site .items.n5 .item:nth-child(5){grid-column:4/span 2}
@media(max-width:980px){.i2j-site .items.n5 .item:nth-child(4),.i2j-site .items.n5 .item:nth-child(5){grid-column:auto}}

/* 10. Pastille « Nouveau » du menu et bouton : jamais coupés */
.i2j-site .menu a.menu-new i{flex:0 0 auto}

/* 11. Fenêtres flottantes du thème (avis, cookies) toujours au-dessus et lisibles */
.i2j-site .pi-cookie-banner{position:fixed;left:16px;right:16px;bottom:16px;max-width:560px;margin:0 auto;background:#0b1723;color:#eef2f6;border-radius:12px;padding:16px 18px;z-index:9990;box-shadow:0 12px 40px rgba(0,0,0,.35);font-size:13.5px;line-height:1.5}
.i2j-site .pi-cookie-banner[hidden]{display:none}
.i2j-site .pi-cookie-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
@media(max-width:1180px){.i2j-site .menu{min-width:0}}

/* 12. Boutons : texte toujours centré, même quand deux boutons ont des hauteurs différentes */
.i2j-site .btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;line-height:1.25}
.i2j-site .cta-in .actions{align-items:stretch}
