/* Pages commerciales v2 (Boutique et vitrines produit, prototypes ?v=2, 09.10). */
.s1v2 { padding-top: 48px; padding-bottom: 72px; }
.s1v2-hero { padding: 56px 48px 44px; border-radius: var(--s1-r-xl); background: var(--s1-ink); color: #fff; }
.s1v2-hero h1 { margin: 0 0 12px; max-width: 18ch; font-size: clamp(34px, 4.4vw, 56px); line-height: 1.05; font-weight: var(--s1-w-title); color: #fff; }
.s1v2-hero > p { margin: 0 0 28px; max-width: 60ch; font-size: 18px; line-height: 1.5; color: #CCCCCC; }
.s1v2-search { position: relative; display: flex; align-items: center; gap: 8px; max-width: 760px; padding: 6px 6px 6px 50px; border-radius: var(--s1-r-pill); background: #fff; }
.s1v2-search > i { position: absolute; left: 20px; color: var(--s1-ink-2); font-size: 17px; }
.s1v2-search input { flex: 1 1 auto; min-width: 0; height: 48px; border: 0; outline: 0; background: none; font-size: 17px; color: var(--s1-ink); }
.s1v2-search:focus-within { box-shadow: 0 0 0 3px rgba(255, 85, 93, .55); }
.s1v2-search .btn { flex: none; }
.s1v2-hero-h { margin: 14px 0 0 !important; font-size: 14px !important; color: #CCCCCC !important; }
.s1v2-sec { margin-top: 64px; }
.s1v2-h { margin: 8px 0 24px; font-size: 30px; font-weight: var(--s1-w-strong); color: var(--s1-ink); }

/* Mosaïque */
.s1v2-bento { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); grid-template-rows: auto auto; gap: 16px; margin-top: 20px; }
.s1v2-t { position: relative; display: flex; flex-direction: column; gap: 20px; padding: 28px; border-radius: var(--s1-r-xl); text-decoration: none !important; color: var(--s1-ink); overflow: hidden; transition: transform .25s cubic-bezier(.2,.7,.2,1); }
.s1v2-t:hover { transform: translateY(-3px); }
.s1v2-t:focus-visible { outline: 2px solid var(--s1-red); outline-offset: 3px; }
.s1v2-t--web { grid-row: 1 / span 2; background: linear-gradient(120deg, #E52D36, #FF555D); color: #fff; justify-content: space-between; }
.s1v2-t--mail { background: #F4F4F4; }
.s1v2-t--tr { background: var(--s1-ink); color: #fff; flex-direction: row; align-items: flex-end; justify-content: space-between; }
.s1v2-t-txt { display: flex; flex-direction: column; gap: 8px; }
.s1v2-t-name { font-size: 22px; line-height: 1.2; font-weight: var(--s1-w-strong); }
.s1v2-t--web .s1v2-t-name { font-size: 32px; font-weight: var(--s1-w-title); }
.s1v2-t-d { max-width: 46ch; font-size: 16px; line-height: 1.5; opacity: .92; }
.s1v2-t-p { font-size: 14px; color: inherit; opacity: .9; }
.s1v2-t-p b { font-size: 22px; font-weight: var(--s1-w-title); opacity: 1; }
.s1v2-t-cta { align-self: flex-start; margin-top: 8px; padding: 10px 20px; border-radius: var(--s1-r-pill); background: #fff; color: var(--s1-ink); font-weight: var(--s1-w-strong); font-size: 15px; }
.s1v2-tld { flex: none; font-size: 56px; line-height: 1; font-weight: var(--s1-w-title); letter-spacing: .02em; white-space: nowrap; }
.s1v2-t--tr { flex-direction: column !important; align-items: flex-start !important; justify-content: space-between !important; }
.s1v2-t--tr .s1v2-t-p b { font-size: 17px; }
.s1v2-tld span { color: var(--s1-red); }

/* Maquettes du portail */
.s1v2-mock { display: flex; flex-direction: column; gap: 2px; padding: 0 0 8px; border-radius: 14px; background: #fff; color: var(--s1-ink); font-size: 14px; box-shadow: 0 12px 32px rgba(34, 34, 34, .18); }
.s1v2-mock-bar { display: flex; align-items: center; gap: 6px; padding: 12px 16px; border-bottom: 1px solid #E3E3E3; color: var(--s1-ink-2); font-size: 13px; }
.s1v2-mock-bar i { width: 9px; height: 9px; border-radius: 50%; background: #E3E3E3; }
.s1v2-mock-bar span { margin-left: 10px; }
.s1v2-mock-tabs { display: flex; gap: 18px; padding: 10px 16px 8px; color: var(--s1-ink-2); font-size: 13px; }
.s1v2-mock-tabs b { color: var(--s1-ink); box-shadow: inset 0 -2px 0 var(--s1-red); padding-bottom: 6px; }
.s1v2-mock-row, .s1v2-mock-ok { display: flex; align-items: center; gap: 10px; padding: 8px 16px; border-top: 1px solid #F4F4F4; }
.s1v2-mock-row i { color: var(--s1-ink-2); width: 14px; }
.s1v2-mock-row em, .s1v2-mock-ok em { margin-left: auto; font-style: normal; color: var(--s1-ink-2); font-size: 13px; }
.s1v2-mock-ok i { color: #1E7B34; width: 14px; }
.s1v2-mock--mail { padding: 8px 0; }
.s1v2-mbox { display: flex; align-items: center; gap: 12px; padding: 10px 16px; }
.s1v2-mbox + .s1v2-mbox { border-top: 1px solid #F4F4F4; }
.s1v2-mbox .av { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: var(--s1-tint); color: var(--s1-red); font-weight: var(--s1-w-strong); font-size: 13px; }
.s1v2-mbox > span:nth-child(2) { display: flex; flex-direction: column; gap: 6px; min-width: 0; flex: 1; }
.s1v2-mbox b { font-weight: var(--s1-w-body); font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.s1v2-mbox .q { height: 4px; border-radius: 4px; background: #E3E3E3; overflow: hidden; }
.s1v2-mbox .q i { display: block; height: 100%; background: var(--s1-red); }
.s1v2-mbox em { flex: none; font-style: normal; color: var(--s1-ink-2); font-size: 12px; }

/* Cybersécurité : le visuel domine */
.s1v2-row3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.s1v2-v { display: flex; flex-direction: column; gap: 8px; color: var(--s1-ink); text-decoration: none !important; }
.s1v2-v-m { position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 3; margin-bottom: 8px; border-radius: var(--s1-r-xl); overflow: hidden; background: #F4F4F4; transition: transform .25s cubic-bezier(.2,.7,.2,1); }
.s1v2-v:hover .s1v2-v-m { transform: translateY(-3px); }
.s1v2-v:focus-visible { outline: 2px solid var(--s1-red); outline-offset: 4px; border-radius: var(--s1-r-xl); }
.s1v2-v-m--logo img { width: 58%; height: auto; }
.s1v2-v-m--art > img:first-child, .s1v2-ed-m--art > img:first-child { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.s1v2-v-m--art .ill, .s1v2-ed-m--art .ill { position: relative; width: 70%; height: auto; }
.s1v2-v strong { font-size: 19px; font-weight: var(--s1-w-strong); }
.s1v2-v:hover strong { text-decoration: underline; text-underline-offset: 3px; }
.s1v2-v-d { font-size: 15px; line-height: 1.5; color: var(--s1-ink-2); }

/* Rangées éditoriales */
.s1v2-ed { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center; margin-top: 24px; }
.s1v2-ed + .s1v2-ed { margin-top: 40px; }
.s1v2-ed--rev .s1v2-ed-m { order: 2; }
.s1v2-ed-m { position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 16 / 9; border-radius: var(--s1-r-xl); overflow: hidden; background: #F4F4F4; }
.s1v2-ed-m--logo img { width: 46%; height: auto; }
.s1v2-ed-t h3 { margin: 0 0 12px; font-size: 30px; font-weight: var(--s1-w-strong); color: var(--s1-ink); }
.s1v2-ed-t p { margin: 0 0 12px; max-width: 48ch; font-size: 17px; line-height: 1.55; color: var(--s1-ink-2); }
.s1v2-ed-t .s1v2-t-p { color: var(--s1-ink); }
.s1v2-ed-a { display: inline-block; margin-top: 8px; padding-bottom: 6px; border-bottom: 1px solid var(--s1-ink); color: var(--s1-ink); font-size: 17px; text-decoration: none !important; }
.s1v2-ed-a:hover { border-bottom-color: var(--s1-red); color: var(--s1-ink); }

/* Aide */
.s1v2-help { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; margin-top: 72px; padding: 36px 40px; border-radius: var(--s1-r-xl); background: #F4F4F4; }
.s1v2-help h2 { margin: 0 0 8px; font-size: 28px; font-weight: var(--s1-w-strong); color: var(--s1-ink); }
.s1v2-help p { margin: 0; color: var(--s1-ink-2); font-size: 16px; }
.s1v2-help-a { display: flex; align-items: center; gap: 20px; }
.s1v2-help-tel { color: var(--s1-ink); font-weight: var(--s1-w-strong); font-size: 17px; }

/* v2b : rangées éditoriales partout, un seul fond pour tous les visuels. */
.s1v2-ed-m--mock { padding: 32px; aspect-ratio: auto; min-height: 300px; }
.s1v2-ed-m--mock .s1v2-mock { width: 100%; max-width: 480px; }
.s1v2-ed-m .s1v2-tld { color: var(--s1-ink); font-size: 88px; }
.s1v2-ed-m .s1v2-tld .b { color: var(--s1-red); }
.s1v2-ed-m .s1v2-tld .a { color: var(--s1-ink); }
.s1v2-v-m .ill, .s1v2-ed-m > .ill { width: 62%; height: auto; }
.s1v2-ed-btn { margin-top: 8px; }
.s1v2-ed-t .s1v2-t-p { margin: 4px 0 8px; font-size: 15px; }
@media (max-width: 900px) {
    .s1v2-hero { padding: 36px 24px 28px; }
    .s1v2-bento { grid-template-columns: minmax(0, 1fr); }
    .s1v2-t--web { grid-row: auto; }
    .s1v2-row3 { grid-template-columns: minmax(0, 1fr); }
    .s1v2-ed { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    .s1v2-ed--rev .s1v2-ed-m { order: 0; }
}
@media (max-width: 560px) {
    .s1v2-search { padding-left: 42px; }
    .s1v2-search > i { left: 16px; }
    .s1v2-search .btn { padding-left: 14px; padding-right: 14px; }
    .s1v2-tld { font-size: 48px; }
    .s1v2-help { padding: 28px 22px; }
}
@media (prefers-reduced-motion: reduce) { .s1v2-t, .s1v2-v-m { transition: none; } }
/* Couleurs forcées : les règles de liens du thème recolorent le texte des tuiles. */
html body .s1v2 a.s1v2-t--web .s1v2-t-txt, html body .s1v2 a.s1v2-t--web .s1v2-t-txt *, html body .s1v2 a.s1v2-t--tr, html body .s1v2 a.s1v2-t--tr * { color: #fff !important; }
html body .s1v2 a.s1v2-t--web .s1v2-t-cta { color: var(--s1-ink) !important; }
html body .s1v2 a.s1v2-t--tr .s1v2-tld span { color: var(--s1-red) !important; }
html body .s1v2 a.s1v2-t--mail, html body .s1v2 a.s1v2-t--mail *, html body .s1v2 a.s1v2-v, html body .s1v2 a.s1v2-v strong { color: var(--s1-ink); }

/* v2c : maquettes vivantes, jouées une fois quand elles entrent à l'écran (retour Nolann). */
.s1v2-res { display: flex; align-items: center; gap: 14px; max-width: 760px; margin: 14px 0 0 !important; padding: 12px 20px; border-radius: 14px; background: rgba(255, 255, 255, .08); color: #fff !important; font-size: 16px !important; }
.s1v2-res .d { font-weight: var(--s1-w-strong); transition: opacity .3s ease; }
.s1v2-res .d.is-out { opacity: 0; }
.s1v2-res .ok { display: inline-flex; align-items: center; gap: 6px; padding: 3px 12px; border-radius: var(--s1-r-pill); background: rgba(30, 123, 52, .25); color: #9BE3AE; font-size: 13px; font-weight: var(--s1-w-strong); }
.s1v2-mbox .q i { width: var(--w); }
.s1v2-mock-wp .bar { flex: 1 1 auto; height: 4px; margin: 0 12px; border-radius: 4px; background: #E3E3E3; overflow: hidden; }
.s1v2-mock-wp .bar i { display: block; height: 100%; width: 100%; background: var(--s1-red); }
.s1v2-mock-wp > i { color: #21759B !important; }
.js-live .s1v2-ed-m--mock .s1v2-mock-row, .js-live .s1v2-ed-m--mock .s1v2-mock-ok, .js-live .s1v2-ed-m--mock .s1v2-mbox { opacity: 0; transform: translateY(6px); transition: opacity .4s ease, transform .4s ease; }
.js-live .is-live .s1v2-mock-row, .js-live .is-live .s1v2-mock-ok, .js-live .is-live .s1v2-mbox { opacity: 1; transform: none; }
.js-live .is-live .s1v2-mock > :nth-child(4) { transition-delay: .1s; } .js-live .is-live .s1v2-mock > :nth-child(5) { transition-delay: .2s; }
.js-live .is-live .s1v2-mock > :nth-child(6) { transition-delay: .3s; } .js-live .is-live .s1v2-mock > :nth-child(7) { transition-delay: .4s; }
.js-live .is-live .s1v2-mbox:nth-child(2) { transition-delay: .15s; } .js-live .is-live .s1v2-mbox:nth-child(3) { transition-delay: .3s; }
.js-live .s1v2-mock-wp .bar i { width: 0; transition: width 1.6s cubic-bezier(.4,0,.2,1) .5s; }
.js-live .is-live .s1v2-mock-wp .bar i { width: 100%; }
.js-live .s1v2-mock-wp em { opacity: 0; transition: opacity .3s ease 2.1s; }
.js-live .is-live .s1v2-mock-wp em { opacity: 1; }
.js-live .s1v2-mock-ok i { color: #CCCCCC !important; transition: color .3s ease 2.3s; }
.js-live .is-live .s1v2-mock-ok i { color: #1E7B34 !important; }
.js-live .s1v2-mbox .q i { width: 0; transition: width 1.2s cubic-bezier(.4,0,.2,1) .4s; }
.js-live .is-live .s1v2-mbox .q i { width: var(--w); }
.js-live .s1v2-ed-m--tld .a, .js-live .s1v2-ed-m--tld .b { display: inline-block; opacity: 0; transform: translateY(14px); transition: opacity .5s ease, transform .5s cubic-bezier(.2,.7,.2,1); }
.js-live .s1v2-ed-m--tld .b { transition-delay: .2s; }
.js-live .is-live.s1v2-ed-m--tld .a, .js-live .is-live.s1v2-ed-m--tld .b { opacity: 1; transform: none; }
.s1v2-v-m .ill { width: 46%; }
.s1v2-ed-m > .ill { width: 52%; }
@media (prefers-reduced-motion: reduce) { .js-live * { transition: none !important; } }

/* Vitrines produit v2 */
.s1v2-hero-meta { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: -12px 0 28px !important; font-size: 15px !important; color: #CCCCCC !important; }
.s1v2-hero-a { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; }
html body .s1v2 .s1v2-hero-link { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.s1v2-lead { margin: -12px 0 24px; max-width: 64ch; font-size: 16px; line-height: 1.55; color: var(--s1-ink-2); }
.s1v2-ed-t .s1v2-ed-h2 { margin-top: 20px; font-size: 22px; }
.s1v2-more { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 48px; margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--s1-line); }
.s1v2-more h4 { margin: 0 0 8px; font-size: 18px; font-weight: var(--s1-w-strong); color: var(--s1-ink); }
.s1v2-more p { margin: 0; font-size: 16px; line-height: 1.55; color: var(--s1-ink-2); }
@media (max-width: 700px) { .s1v2-more { grid-template-columns: minmax(0, 1fr); } }
/* Maquette statistiques : courbe de visites en barres qui montent à l'écran. */
.s1v2-stat { display: flex; align-items: baseline; gap: 12px; padding: 14px 16px 4px; }
.s1v2-stat span { font-size: 13px; color: var(--s1-ink-2); }
.s1v2-stat b { font-size: 26px; font-weight: var(--s1-w-title); color: var(--s1-ink); }
.s1v2-stat em { font-style: normal; font-size: 13px; font-weight: var(--s1-w-strong); color: #1E7B34; }
.s1v2-chart { display: flex; align-items: flex-end; gap: 6px; height: 120px; padding: 8px 16px 12px; }
.s1v2-chart i { flex: 1 1 0; height: var(--h); border-radius: 4px 4px 0 0; background: #F4C9CB; }
.s1v2-chart i:last-child { background: var(--s1-red); }
.js-live .s1v2-chart i { transform: scaleY(0); transform-origin: bottom; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.js-live .is-live .s1v2-chart i { transform: none; }
.js-live .is-live .s1v2-chart i:nth-child(n+4) { transition-delay: .1s; } .js-live .is-live .s1v2-chart i:nth-child(n+7) { transition-delay: .2s; }
.js-live .is-live .s1v2-chart i:nth-child(n+10) { transition-delay: .3s; } .js-live .is-live .s1v2-chart i:last-child { transition-delay: .45s; }

/* Vitrine v2b : plus d'air, titres centrés, bandeau en deux colonnes, sous-menu collant, bande grise, appel final. */
.s1v2-sec--c { margin-top: 120px; }
.s1v2-sec--c > .s1m-sq { justify-content: center; border-bottom: 0 !important; padding-bottom: 0 !important; text-align: center; }
.s1v2-sec--c > .s1v2-h { margin: 12px auto 16px; text-align: center; font-size: clamp(30px, 3.4vw, 42px); font-weight: var(--s1-w-title); line-height: 1.12; max-width: 22ch; }
.s1v2-sec--c > .s1v2-lead { margin: 0 auto 48px; text-align: center; max-width: 60ch; font-size: 18px; }
.s1v2-band { padding: 96px 56px; border-radius: var(--s1-r-xl); background: #F4F4F4; }
.s1v2-band .s1v2-ed-m { background: #fff; }
.s1v2-band .s1v2-ed + .s1v2-ed { margin-top: 72px; }
.s1v2-band .s1v2-more { border-top-color: #E3E3E3; }
.s1v2-ed + .s1v2-ed { margin-top: 72px; }
.s1v2-ed-t h3 { font-size: 32px; }

.s1v2-hero--split { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 48px; align-items: center; padding: 64px 56px; }
.s1v2-hero-txt h1 { max-width: 14ch; }
.s1v2-hero-vis { display: block; }
.s1v2-mock--site { box-shadow: 0 24px 60px rgba(0, 0, 0, .35); }
.s1v2-mock-bar .lock { margin-right: 6px; color: #1E7B34; font-weight: 400; }
.s1v2-site { display: flex; flex-direction: column; gap: 12px; padding: 18px 20px 22px; }
.s1v2-site-nav { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.s1v2-site-nav b { width: 70px; height: 12px; border-radius: 6px; background: var(--s1-ink); }
.s1v2-site-nav i { width: 36px; height: 8px; border-radius: 4px; background: #E3E3E3; }
.s1v2-site-nav i:first-of-type { margin-left: auto; }
.s1v2-site-h { width: 78%; height: 22px; border-radius: 6px; background: var(--s1-ink); }
.s1v2-site-h--2 { width: 52%; background: #CCCCCC; height: 14px; }
.s1v2-site-btn { width: 120px; height: 30px; margin: 6px 0 10px; border-radius: var(--s1-r-pill); background: var(--s1-red); }
.s1v2-site-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.s1v2-site-cols i { height: 70px; border-radius: 10px; background: #F4F4F4; }
.js-live .s1v2-hero-vis .s1v2-site > * { opacity: 0; transform: translateY(8px); transition: opacity .45s ease, transform .45s ease; }
.js-live .s1v2-hero-vis.is-live .s1v2-site > * { opacity: 1; transform: none; }
.js-live .s1v2-hero-vis.is-live .s1v2-site > :nth-child(2) { transition-delay: .15s; } .js-live .s1v2-hero-vis.is-live .s1v2-site > :nth-child(3) { transition-delay: .25s; }
.js-live .s1v2-hero-vis.is-live .s1v2-site > :nth-child(4) { transition-delay: .4s; } .js-live .s1v2-hero-vis.is-live .s1v2-site > :nth-child(5) { transition-delay: .55s; }

.s1v2-subnav { position: sticky; top: 76px; z-index: 5; display: flex; justify-content: center; gap: 4px; width: max-content; max-width: 100%; margin: 32px auto 0; padding: 5px; border: 1px solid var(--s1-line); border-radius: var(--s1-r-pill); background: rgba(255, 255, 255, .92); backdrop-filter: blur(6px); overflow-x: auto; }
.s1v2-subnav a { padding: 8px 18px; border-radius: var(--s1-r-pill); color: var(--s1-ink); font-size: 15px; text-decoration: none !important; white-space: nowrap; }
.s1v2-subnav a:hover, .s1v2-subnav a.is-cur { background: var(--s1-ink); color: #fff; }
.s1v2 [id] { scroll-margin-top: 140px; }

.s1v2-seg { display: flex; justify-content: center; gap: 4px; width: max-content; margin: 0 auto 48px; padding: 5px; border-radius: var(--s1-r-pill); background: #F4F4F4; }
.s1v2-seg button { padding: 10px 22px; border: 0; border-radius: var(--s1-r-pill); background: none; font: inherit; font-size: 15px; color: var(--s1-ink-2); cursor: pointer; }
.s1v2-seg button[aria-selected="true"] { background: #fff; color: var(--s1-ink); font-weight: var(--s1-w-strong); box-shadow: 0 1px 3px rgba(34, 34, 34, .12); }
.s1v2-panel { text-align: left; }
.s1v2-panel[hidden] { display: none; }
.s1v2-sec--c .s1v2-ed { margin-top: 0; }

.s1v2-cta { margin-top: 120px; padding: 96px 48px; border-radius: var(--s1-r-xl); background: var(--s1-ink); text-align: center; color: #fff; }
.s1v2-cta h2 { margin: 0 0 12px; font-size: clamp(32px, 4vw, 52px); font-weight: var(--s1-w-title); color: #fff; }
.s1v2-cta p { margin: 0 0 28px; font-size: 18px; color: #CCCCCC; }

@media (max-width: 900px) {
    .s1v2-hero--split { grid-template-columns: minmax(0, 1fr); padding: 40px 24px; gap: 32px; }
    .s1v2-sec--c { margin-top: 80px; }
    .s1v2-band { padding: 56px 20px; }
    .s1v2-cta { padding: 64px 24px; margin-top: 80px; }
    .s1v2-subnav { top: 72px; justify-content: flex-start; }
}
/* Bascule douce des onglets Migration. */
.s1v2-seg { position: relative; }
.s1v2-seg button { position: relative; z-index: 1; transition: color .25s ease; }
.s1v2-seg button:focus { outline: 0; }
.s1v2-seg button:focus-visible { outline: 2px solid var(--s1-red); outline-offset: 2px; }
.s1v2-seg.has-ind button[aria-selected="true"] { background: none; box-shadow: none; }
.s1v2-seg-ind { position: absolute; top: 5px; bottom: 5px; left: 5px; border-radius: var(--s1-r-pill); background: #fff; box-shadow: 0 1px 3px rgba(34, 34, 34, .12); }
.s1v2-seg.is-ready .s1v2-seg-ind { transition: transform .35s cubic-bezier(.2,.7,.2,1), width .35s cubic-bezier(.2,.7,.2,1); }
.s1v2-panel { transition: opacity .3s ease, transform .35s cubic-bezier(.2,.7,.2,1); }
.s1v2-panel.is-out { opacity: 0; transform: translateX(-16px); transition-duration: .2s; }
.s1v2-panel.is-in-start { opacity: 0; transform: translateX(16px); transition: none; }
@media (prefers-reduced-motion: reduce) { .s1v2-seg-ind, .s1v2-panel { transition: none !important; } }
/* Vitrines v2 générées (e-mail, partenaires) */
.s1v2-hero-logo { display: inline-flex; align-items: center; margin-bottom: 20px; padding: 10px 16px; border-radius: 12px; background: #fff; }
.s1v2-hero-logo img { display: block; height: 26px; width: auto; }
.s1v2-band .s1m-table, .s1v2-band .pub-feats > *, .s1v2-band .s1m-card { background: #fff; }
.s1v2-sec--c .s1m-table-wrap, .s1v2-sec--c .s1m-faq { text-align: left; }
.s1v2-cta--page { margin-left: 0; margin-right: 0; }
.s1v2-band .pub-feats { gap: 16px; }
.s1v2-band .pub-feats > * { padding: 24px; border-radius: var(--s1-r-lg, 16px); }
html body .s1v2 .s1v2-subnav a.is-cur, html body .s1v2 .s1v2-subnav a:hover { color: #fff !important; }
html body .s1v2 .s1v2-subnav a { color: var(--s1-ink); }
.s1v2-hero--split .s1v2-hero-txt h1 { max-width: none; font-size: clamp(32px, 3.4vw, 46px); line-height: 1.08; }
/* Proofpoint : parcours d'un e-mail selon l'offre choisie. */
.s1v2-tiers { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 0 auto 32px; }
.s1v2-tiers button { padding: 9px 18px; border: 1px solid var(--s1-line); border-radius: var(--s1-r-pill); background: #fff; font: inherit; font-size: 15px; color: var(--s1-ink); cursor: pointer; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.s1v2-tiers button:hover { border-color: var(--s1-ink); }
.s1v2-tiers button[aria-pressed="true"] { background: var(--s1-ink); border-color: var(--s1-ink); color: #fff; }
.s1v2-tiers button:focus { outline: 0; } .s1v2-tiers button:focus-visible { outline: 2px solid var(--s1-red); outline-offset: 2px; }
.s1v2-flow { max-width: 720px; margin: 0 auto; text-align: left; }
.s1v2-flow-list { margin: 0; padding: 0; list-style: none; }
.s1v2-flow-r { display: flex; align-items: center; gap: 14px; padding: 16px 20px; border-top: 1px solid #F4F4F4; transition: background .3s ease; }
.s1v2-flow-r > i { width: 18px; text-align: center; color: var(--s1-ink-2); }
.s1v2-flow-r .t { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 0; }
.s1v2-flow-r .t b { font-size: 16px; font-weight: var(--s1-w-strong); color: var(--s1-ink); }
.s1v2-flow-r .t small { font-size: 13px; color: var(--s1-ink-2); transition: opacity .3s ease; }
.s1v2-flow-r .st { flex: none; padding: 4px 12px; border-radius: var(--s1-r-pill); font-size: 13px; font-weight: var(--s1-w-strong); transition: background .3s ease, color .3s ease; }
.s1v2-flow-r.is-ok .st { background: var(--s1-ok-bg, #E4F3E8); color: var(--s1-ok, #1E7B34); }
.s1v2-flow-r.is-may .st { background: var(--s1-warn-bg, #FFF1DC); color: var(--s1-warn, #7A4300); }
.s1v2-flow-r.is-may { background: #FFFBF4; }
.s1v2-flow-r.is-may .t small { opacity: .45; text-decoration: line-through; }
.s1v2-flow-count { margin: 20px 0 6px; text-align: center; font-size: 17px; font-weight: var(--s1-w-strong); color: var(--s1-ink); }
.s1v2-flow-note { margin: 0; text-align: center; font-size: 13px; color: var(--s1-ink-2); }
@media (max-width: 560px) { .s1v2-flow-r { padding: 14px; } .s1v2-flow-r .st { font-size: 12px; } }
.s1v2-sec--c > .s1v2-h, .s1v2-hero h1, .s1v2-cta h2, .s1v2-ed-t h3 { text-wrap: balance; } .s1v2-sec--c > .s1v2-h { max-width: 26ch; }
/* Microsoft 365 : calculateur par nombre d'utilisateurs. */
.s1v2-calc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: center; max-width: 980px; margin: 0 auto 16px; text-align: left; }
.s1v2-calc .s1v2-tiers { justify-content: flex-start; margin-bottom: 28px; }
.s1v2-calc-l { display: block; margin: 0 0 10px; font-size: 15px; color: var(--s1-ink-2); }
.s1v2-calc-users { display: flex; align-items: center; gap: 10px; }
.s1v2-calc-users input { width: 110px; height: 56px; border: 1px solid var(--s1-line-strong); border-radius: var(--s1-r-md, 10px); text-align: center; font-size: 26px; font-weight: var(--s1-w-title); color: var(--s1-ink); -moz-appearance: textfield; }
.s1v2-calc-users input::-webkit-outer-spin-button, .s1v2-calc-users input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.s1v2-calc-users input:focus { outline: 0; border-color: var(--s1-red); box-shadow: var(--s1-ring); }
.s1v2-calc-step { width: 44px; height: 44px; border: 1px solid var(--s1-line); border-radius: 50%; background: #fff; font-size: 22px; line-height: 1; color: var(--s1-ink); cursor: pointer; }
.s1v2-calc-step:hover { border-color: var(--s1-ink); }
.s1v2-calc-range { width: 100%; margin-top: 18px; accent-color: var(--s1-ink); }
.s1v2-calc-out .s1v2-mock-row { padding: 14px 18px; }
.s1v2-calc-total { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 18px; border-top: 1px solid #E3E3E3; }
.s1v2-calc-total span { font-size: 15px; color: var(--s1-ink-2); }
.s1v2-calc-total b { font-size: 34px; font-weight: var(--s1-w-title); color: var(--s1-ink); font-variant-numeric: tabular-nums; }
.s1v2-calc-btn { margin: 0 18px 10px; }
@media (max-width: 800px) { .s1v2-calc { grid-template-columns: minmax(0, 1fr); gap: 28px; } }
/* E-mail : aperçu du message ; Vulnerability Checker : exemple d'alerte ; SentinelOne : chronologie. */
.s1v2-addr-in { height: 52px; font-size: 18px; }
.s1v2-msg .s1v2-mock-row { gap: 14px; }
.s1v2-msg .s1v2-mock-row small { flex: none; width: 52px; font-size: 13px; color: var(--s1-ink-2); }
.s1v2-addr-mail { color: var(--s1-ink-2); }
.s1v2-addr-mail::before { content: "<"; } .s1v2-addr-mail::after { content: ">"; }
.s1v2-msg-body { display: block; padding: 16px 18px 20px; border-top: 1px solid #F4F4F4; font-size: 15px; line-height: 1.6; color: var(--s1-ink); }
.s1v2-addr-dom { color: var(--s1-red); }
.s1v2-chips { justify-content: flex-start; margin: 16px 0 0; }
.s1v2-chips button { font-size: 14px; padding: 7px 14px; }
.s1v2-vcx-subj { display: flex; align-items: center; gap: 10px; padding: 16px 18px 0; font-size: 17px; }
.s1v2-vcx-subj i { color: var(--s1-crit, #B42318); }
.s1v2-pill-crit { padding: 2px 10px; border-radius: var(--s1-r-pill); background: var(--s1-crit-bg, #FDECEA); color: var(--s1-crit, #B42318) !important; font-weight: var(--s1-w-strong); }
.s1v2-tl { position: relative; max-width: 720px; margin: 0 auto; padding: 0 0 0 36px; list-style: none; text-align: left; }
.s1v2-tl::before { content: ""; position: absolute; left: 11px; top: 8px; bottom: 8px; width: 2px; background: #E3E3E3; }
.s1v2-tl li { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 0 0 28px; }
.s1v2-tl li::before { content: ""; position: absolute; left: -31px; top: 5px; width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 3px solid var(--s1-ok, #1E7B34); }
.s1v2-tl li:first-child::before { border-color: var(--s1-crit, #B42318); }
.s1v2-tl li:last-child::before { border-color: var(--s1-ink); }
.s1v2-tl .w { font-size: 13px; font-weight: var(--s1-w-strong); color: var(--s1-ink-2); text-transform: none; }
.s1v2-tl .d { font-size: 19px; line-height: 1.4; color: var(--s1-ink); }
.js-live .s1v2-tl li { opacity: 0; transform: translateY(10px); transition: opacity .5s ease, transform .5s ease; }
.js-live .s1v2-tl.is-live li { opacity: 1; transform: none; }
.js-live .s1v2-tl.is-live li:nth-child(2) { transition-delay: .5s; } .js-live .s1v2-tl.is-live li:nth-child(3) { transition-delay: 1s; }
.js-live .s1v2-tl.is-live li:nth-child(4) { transition-delay: 1.5s; } .js-live .s1v2-tl.is-live li:nth-child(5) { transition-delay: 2s; }
.s1v2-flow-r--arch { border-top: 1px dashed #CCCCCC; }
.s1v2-flow-r--arch.is-may { background: #FAFAFA; }
.s1v2-flow-r--arch.is-may .st { background: #F4F4F4; color: var(--s1-ink-2); }
/* Encart "Pas trouvé votre réponse ?" vers le chatbot. */
.s1v2-ask { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 32px; margin-top: 72px; padding: 32px 36px; border: 1px solid var(--s1-line); border-radius: var(--s1-r-xl); }
.s1v2-ask[hidden] { display: none; }
.s1v2-ask h3 { margin: 0 0 6px; font-size: 22px; font-weight: var(--s1-w-strong); color: var(--s1-ink); }
.s1v2-ask p { margin: 0; max-width: 52ch; font-size: 15px; line-height: 1.5; color: var(--s1-ink-2); }
.s1v2-ask-a { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.s1v2-ask-q { padding: 9px 16px; border: 0; border-radius: var(--s1-r-pill); background: #F4F4F4; font: inherit; font-size: 14px; color: var(--s1-ink); cursor: pointer; text-align: left; }
.s1v2-ask-q:hover { background: #E3E3E3; }
.s1v2-ask-q:focus-visible { outline: 2px solid var(--s1-red); outline-offset: 2px; }
.s1v2-ask + .s1v2-cta { margin-top: 32px; }
@media (max-width: 700px) { .s1v2-ask { padding: 24px 20px; } }

/* Jetons IA : page de démarrage guidée (modules/addons/s1aitokens/templates/aitokens-guide.tpl). */
.s1ait .pub-sit { margin-top: 8px; text-align: left; }
.s1ait-term .s1ait-code { display: block; padding: 16px 18px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; line-height: 1.6; white-space: pre-wrap; color: var(--s1-ink); }
.s1ait-term .s1ait-code b { color: var(--s1-red); }
.s1ait-steps { display: flex; justify-content: center; gap: 8px 28px; flex-wrap: wrap; margin: 0 auto 32px; padding: 0; list-style: none; }
.s1ait-steps li { display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--s1-ink-2); }
.s1ait-steps li span { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: #E3E3E3; font-size: 13px; font-weight: var(--s1-w-strong); color: var(--s1-ink-2); }
.s1ait-steps li.is-cur { color: var(--s1-ink); font-weight: var(--s1-w-strong); }
.s1ait-steps li.is-cur span { background: var(--s1-ink); color: #fff; }
.s1ait-steps li.is-done span { background: var(--s1-red); color: #fff; }
.s1ait-card { max-width: 720px; margin: 0 auto; padding: 32px; border-radius: var(--s1-r-xl); background: #fff; text-align: left; }
.s1ait-help { margin: 8px 0 20px; font-size: 14px; color: var(--s1-ink-2); }
.s1ait-lead { margin: 0 0 16px; font-size: 16px; color: var(--s1-ink); }
.s1ait-err { margin: 0 0 16px; color: var(--s1-crit, #B42318); font-size: 14px; }
.s1ait-err[hidden], .s1ait-pane[hidden], .s1ait-note[hidden] { display: none; }
.s1ait-packs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 16px; }
.s1ait-pack { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 20px; border: 1px solid var(--s1-line); border-radius: var(--s1-r-lg, 16px); }
.s1ait-pack b { font-size: 20px; font-weight: var(--s1-w-title); color: var(--s1-ink); }
.s1ait-price { font-size: 15px; color: var(--s1-ink-2); margin-bottom: 8px; }
.s1ait-pack .btn { align-self: flex-start; }
.s1ait-reco { display: none; align-self: flex-start; padding: 2px 10px; border-radius: var(--s1-r-pill); background: var(--s1-tint); color: var(--s1-red); font-size: 12px; font-weight: var(--s1-w-strong); }
.s1ait-pack.is-reco { border-color: var(--s1-ink); box-shadow: 0 0 0 1px var(--s1-ink); }
.s1ait-pack.is-reco .s1ait-reco { display: inline-block; }
.s1ait-pack.is-reco .btn { background: var(--s1-red); border-color: var(--s1-red); color: var(--s1-ink); }
.s1ait-later { border: 0; background: none; padding: 0 0 4px; cursor: pointer; }
.s1ait-copy { display: flex; gap: 8px; align-items: center; margin: 6px 0 4px; }
.s1ait-copy code { flex: 1; min-width: 0; padding: 12px 14px; border-radius: var(--s1-r-md, 10px); background: #F4F4F4; color: var(--s1-ink); font-size: 14px; overflow-x: auto; white-space: nowrap; }
.s1ait-pre { margin: 6px 0 24px; padding: 16px; border-radius: var(--s1-r-md, 10px); background: var(--s1-ink); color: #F4F4F4; font-size: 13px; line-height: 1.6; white-space: pre-wrap; word-break: break-all; }
.s1ait-note { margin: 0 0 20px; padding: 14px 16px; border-radius: var(--s1-r-md, 10px); background: var(--s1-warn-bg, #FFF1DC); color: var(--s1-ink); font-size: 14px; }
.s1ait-note p { margin: 0 0 10px; }
.s1ait-note--ok { background: var(--s1-ok-bg, #E4F3E8); }
.s1ait-login { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.s1ait-login p { flex-basis: 100%; margin: 0; font-size: 17px; font-weight: var(--s1-w-strong); }
@media (max-width: 560px) { .s1ait-packs { grid-template-columns: minmax(0, 1fr); } .s1ait-card { padding: 22px 18px; } }
.s1ait .pub-sit { list-style: none; padding: 0; } .s1ait .pub-sit > li { margin: 0; }
/* Accueil : section "Ce que vous pouvez faire" (onglets par usage). */
.s1v2.s1hw { padding-top: 0; padding-bottom: 0; }
.s1hw .s1hw-seg { margin: 40px 0 48px; flex-wrap: wrap; max-width: 100%; }
.s1hw .s1v2-ed-t .pub-ticks { margin: 0 0 20px; font-size: 16px; }
.s1hw .s1v2-ed-t p { max-width: 52ch; }
@media (max-width: 700px) { .s1hw .s1hw-seg { width: 100%; justify-content: flex-start; border-radius: 18px; } .s1hw .s1hw-seg button { padding: 9px 14px; font-size: 14px; } }
.s1v2-seg-ind { bottom: auto; }
.s1v2-seg.is-ready .s1v2-seg-ind { transition: transform .35s cubic-bezier(.2,.7,.2,1), width .35s cubic-bezier(.2,.7,.2,1), height .35s cubic-bezier(.2,.7,.2,1); }
/* Accueil : "Aussi chez 1SWISS1" en tuiles (au lieu d'une liste à filets identique à la FAQ). */
.pub-more2-h { margin-bottom: 40px; }
.pub-more2-h h2 { margin: 0 0 12px; font-size: clamp(30px, 3.4vw, 46px); line-height: 1.1; font-weight: var(--s1-w-title); }
.pub-more2-h h2 .red { color: var(--s1-red); }
.pub-more2-h p { margin: 0; max-width: 52ch; font-size: 17px; color: var(--s1-ink-2); }
.pub-more2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.pub-more2-c { display: flex; flex-direction: column; gap: 6px; height: 100%; color: var(--s1-ink); text-decoration: none !important; }
.pub-more2-m { display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 3; margin-bottom: 10px; border-radius: var(--s1-r-xl); background: #F4F4F4; transition: transform .25s cubic-bezier(.2,.7,.2,1); }
.pub-more2-m img { width: 62%; height: auto; }
.pub-more2-m img.ill { width: 46%; }
.pub-more2-c:hover .pub-more2-m { transform: translateY(-3px); }
.pub-more2-c:hover b { text-decoration: underline; text-underline-offset: 3px; }
.pub-more2-c:focus-visible { outline: 2px solid var(--s1-red); outline-offset: 4px; border-radius: var(--s1-r-xl); }
.pub-more2-c b { font-size: 18px; font-weight: var(--s1-w-strong); }
.pub-more2-c > span:last-child { font-size: 15px; line-height: 1.45; color: var(--s1-ink-2); }
@media (max-width: 560px) { .pub-more2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pub-more2 li:last-child { grid-column: 1 / -1; } .pub-more2 li:last-child .pub-more2-m { aspect-ratio: 16 / 7; } }
@media (prefers-reduced-motion: reduce) { .pub-more2-m { transition: none; } }