/* V31.58.33 — Vitrine de l’accueil. Styles limités à ce composant. */
#gs-home-tools.gs-tools-motion {
 --gs-tools-accent: #ffac70;
 --gs-tools-rgb: 255,154,91;
 position: relative;
 isolation: isolate;
 box-sizing: border-box;
 width: min(1280px, calc(100% - 28px));
 max-width: 1280px;
 margin: 0 auto 40px;
 padding: clamp(22px, 3.2vw, 42px);
 overflow: hidden;
 border: 1px solid #30343e;
 border-radius: 22px;
 background: #0e1015;
 color: #f8f8fa;
 box-shadow: 0 20px 65px #0003;
 font-family: 'Outfit', system-ui, sans-serif;
}
#gs-home-tools *, #gs-home-tools *::before, #gs-home-tools *::after { box-sizing: border-box; }
#gs-home-tools [hidden] { display: none !important; }
#gs-home-tools[data-gs-current="xbox"] { --gs-tools-accent: #82e2a6; --gs-tools-rgb: 72,194,113; }
#gs-home-tools[data-gs-current="price"] { --gs-tools-accent: #7ce0b9; --gs-tools-rgb: 58,197,147; }
#gs-home-tools[data-gs-current="builder"] { --gs-tools-accent: #ff879e; --gs-tools-rgb: 244,67,104; }
#gs-home-tools[data-gs-current="halo"] { --gs-tools-accent: #83caff; --gs-tools-rgb: 57,154,232; }
#gs-home-tools .gs-tools-ambient {
 position: absolute;
 z-index: -1;
 inset: 12% -25% 5%;
 pointer-events: none;
 background: radial-gradient(ellipse at 30% 48%, rgba(var(--gs-tools-rgb), .13), transparent 58%);
 transition: background 800ms;
}
#gs-home-tools .gs-tools-grid {
 position: absolute;
 z-index: -1;
 inset: 0;
 pointer-events: none;
 opacity: .28;
 background: linear-gradient(#ffffff08 1px, transparent 1px), linear-gradient(90deg, #ffffff08 1px, transparent 1px);
 background-size: 48px 48px;
 -webkit-mask-image: linear-gradient(transparent, #000, transparent);
 mask-image: linear-gradient(transparent, #000, transparent);
}
#gs-home-tools .gs-tools-intro {
 display: flex;
 align-items: flex-end;
 justify-content: space-between;
 gap: 24px;
 margin: 0 0 28px;
 padding: 0;
 border: 0;
 background: none;
}
#gs-home-tools .gs-tools-eyebrow {
 display: flex;
 align-items: center;
 gap: 8px;
 margin: 0 0 12px;
 font-size: 11px;
 font-weight: 600;
 line-height: 1.5;
 letter-spacing: 1.8px;
 color: #aeb5c3;
}
#gs-home-tools .gs-tools-eyebrow > span { width: 5px; height: 5px; flex: 0 0 5px; border-radius: 50%; background: #eb3153; box-shadow: 0 0 12px #eb315388; }
#gs-home-tools h2 {
 margin: 0;
 font-family: 'Bebas Neue', 'Arial Narrow', sans-serif;
 font-size: clamp(42px, 4.1vw, 62px);
 font-weight: 400;
 line-height: .97;
 letter-spacing: .3px;
 color: #f8f8fa;
 text-transform: none;
}
#gs-home-tools h2 > span { color: #b8bdc9; }
#gs-home-tools .gs-tools-subtitle { margin: 12px 0 0; color: #aeb5c3; font-size: 14px; line-height: 1.5; }
#gs-home-tools .gs-tools-all {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 flex: 0 0 auto;
 min-height: 44px;
 padding: 9px 14px;
 border: 1px solid #343945;
 border-radius: 9px;
 background: #ffffff05;
 color: #e6e9ef;
 text-decoration: none;
 font-size: 12px;
 font-weight: 600;
 line-height: 1.5;
 transition: border-color 200ms, background 200ms;
}
#gs-home-tools .gs-tools-all:hover { border-color: #7d8594; background: #ffffff0b; }
#gs-home-tools .gs-tools-all > span { font-family: system-ui, sans-serif; font-size: 19px; font-weight: 400; }
#gs-home-tools .gs-tools-stage { position: relative; display: grid; gap: 38px; min-width: 0; touch-action: pan-y; }
#gs-home-tools .gs-tools-slide {
 --gs-tool-accent: #ffac70;
 --gs-tool-rgb: 255,154,91;
 display: grid;
 grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
 column-gap: clamp(24px, 3vw, 40px);
 row-gap: 12px;
 min-width: 0;
 margin: 0;
 padding: 0;
 border: 0;
 border-radius: 0;
 background: none;
 box-shadow: none;
}
#gs-home-tools .gs-tools-slide[data-gs-tool="xbox"] { --gs-tool-accent: #82e2a6; --gs-tool-rgb: 72,194,113; }
#gs-home-tools .gs-tools-slide[data-gs-tool="price"] { --gs-tool-accent: #7ce0b9; --gs-tool-rgb: 58,197,147; }
#gs-home-tools .gs-tools-slide[data-gs-tool="builder"] { --gs-tool-accent: #ff879e; --gs-tool-rgb: 244,67,104; }
#gs-home-tools .gs-tools-slide[data-gs-tool="halo"] { --gs-tool-accent: #83caff; --gs-tool-rgb: 57,154,232; }
#gs-home-tools.is-enhanced .gs-tools-stage { gap: 0; }
#gs-home-tools.is-enhanced .gs-tools-slide {
 grid-area: 1 / 1;
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
 transition: opacity 350ms;
}
#gs-home-tools.is-enhanced .gs-tools-slide.is-active { opacity: 1; visibility: visible; pointer-events: auto; z-index: 1; }
#gs-home-tools .gs-tools-caption {
 grid-column: 1 / -1;
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 align-items: center;
 gap: 12px;
 min-width: 0;
 color: var(--gs-tool-accent);
 font-size: 11px;
 font-weight: 600;
 line-height: 1.5;
 letter-spacing: 1.15px;
}
#gs-home-tools .gs-tools-count { white-space: nowrap; color: #f0f1f4; font-variant-numeric: tabular-nums; letter-spacing: .8px; }
#gs-home-tools .gs-tools-count em { font-style: normal; font-weight: 400; color: #929baa; }
#gs-home-tools .gs-tools-visual {
 position: relative;
 align-self: center;
 min-width: 0;
 aspect-ratio: 16 / 9;
 overflow: hidden;
 border: 1px solid rgba(var(--gs-tool-rgb), .45);
 border-radius: 12px;
 background: #080a0d;
 box-shadow: 0 12px 38px #0006, 0 0 24px rgba(var(--gs-tool-rgb), .05);
}
#gs-home-tools .gs-tools-art { display: block; position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; margin: 0; object-fit: contain; transform-origin: 50% 53%; }
#gs-home-tools .gs-tools-light { position: absolute; inset: 0; pointer-events: none; mix-blend-mode: screen; opacity: .12; background: radial-gradient(ellipse at 50% 97%, rgba(var(--gs-tool-rgb), .9), transparent 54%); }
#gs-home-tools [data-gs-tool="xbox"] .gs-tools-light { background: linear-gradient(120deg, transparent 45%, #69ff8830 60%, transparent 80%); }
#gs-home-tools [data-gs-tool="price"] .gs-tools-light { background: radial-gradient(ellipse at 72% 61%, #63ffc740, transparent 30%); }
#gs-home-tools [data-gs-tool="builder"] .gs-tools-light { background: radial-gradient(ellipse at 38% 32%, #ff22454d, transparent 34%); }
#gs-home-tools [data-gs-tool="halo"] .gs-tools-light { background: radial-gradient(ellipse at 77% 34%, #009aff88, transparent 30%); }
#gs-home-tools .gs-tools-sheen { position: absolute; inset: -40% -100%; width: 60%; pointer-events: none; background: linear-gradient(105deg, transparent, #ffffff13, transparent); transform: translateX(0) rotate(-10deg); }
#gs-home-tools .gs-tools-corner { position: absolute; width: 13px; height: 13px; border-color: var(--gs-tool-accent); border-style: solid; opacity: .8; pointer-events: none; }
#gs-home-tools .gs-tools-corner-tl { top: 8px; left: 8px; border-width: 1px 0 0 1px; }
#gs-home-tools .gs-tools-corner-br { bottom: 8px; right: 8px; border-width: 0 1px 1px 0; }
#gs-home-tools .gs-tools-body { align-self: center; min-width: 0; padding: 3px 0; }
#gs-home-tools .gs-tools-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; }
#gs-home-tools h3 { flex: 1 1 auto; min-width: 0; margin: 0; font-family: 'Bebas Neue', 'Arial Narrow', sans-serif; font-size: clamp(36px, 3.2vw, 49px); font-weight: 400; line-height: 1.05; letter-spacing: .25px; color: #f6f7f9; overflow-wrap: anywhere; text-transform: none; }
#gs-home-tools .gs-tools-kind { flex: 0 0 auto; color: var(--gs-tool-accent); font-size: 10px; font-weight: 600; line-height: 1.5; letter-spacing: .8px; }
#gs-home-tools .gs-tools-description { margin: 14px 0 22px; color: #b6bdc9; font-size: 15px; font-weight: 400; line-height: 1.6; }
#gs-home-tools .gs-tools-description > span { display: block; }
#gs-home-tools .gs-tools-cta { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; padding: 11px 17px; border: 1px solid transparent; border-radius: 9px; background: var(--gs-tool-accent); color: #11141a; text-decoration: none; font-size: 15px; font-weight: 600; line-height: 1.5; box-shadow: 0 5px 23px rgba(var(--gs-tool-rgb), .08); transition: filter 200ms, transform 200ms; }
#gs-home-tools .gs-tools-cta > span { flex: 0 0 auto; font-family: system-ui, sans-serif; font-size: 25px; font-weight: 400; line-height: 1; transition: transform 250ms; }
#gs-home-tools .gs-tools-cta:hover { color: #11141a; filter: brightness(1.08); transform: translateY(-2px); }
#gs-home-tools .gs-tools-cta:hover > span { transform: translateX(4px); }
#gs-home-tools .gs-tools-selector { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin: 28px 0 0; }
#gs-home-tools .gs-tools-pick { position: relative; display: flex; flex-direction: column; align-items: center; gap: 9px; min-width: 0; min-height: 44px; padding: 0 0 9px; border: 0; border-radius: 7px; background: transparent; color: #a6adbb; font-family: inherit; font-size: 12px; font-weight: 600; line-height: 1.4; cursor: pointer; touch-action: manipulation; transition: color 200ms; }
#gs-home-tools .gs-tools-thumb { position: relative; display: block; width: 100%; aspect-ratio: 16 / 6; overflow: hidden; border: 1px solid #343a45; border-radius: 8px; background: #181b22; transition: border-color 300ms, transform 300ms; }
#gs-home-tools .gs-tools-thumb img { display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; opacity: .45; filter: saturate(.6); transition: opacity 300ms, filter 300ms; }
#gs-home-tools .gs-tools-pick:hover .gs-tools-thumb { transform: translateY(-2px); }
#gs-home-tools .gs-tools-pick[aria-pressed="true"] { color: #f4f6fa; }
#gs-home-tools .gs-tools-pick[aria-pressed="true"] .gs-tools-thumb { border-color: var(--gs-tools-accent); }
#gs-home-tools .gs-tools-pick[aria-pressed="true"] img { opacity: 1; filter: none; }
#gs-home-tools .gs-tools-progress { position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; border-radius: 1px; background: var(--gs-tools-accent); transform: scaleX(0); transform-origin: left center; }
#gs-home-tools .gs-tools-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 52px; margin: 14px 0 0; padding: 9px 0 0; border-top: 1px solid #2c313b; }
#gs-home-tools .gs-tools-footnote { color: #9ba5b6; font-size: 11px; font-weight: 400; line-height: 1.4; }
#gs-home-tools .gs-tools-playback { display: flex; align-items: center; gap: 2px; flex: 0 0 auto; }
#gs-home-tools .gs-tools-playback button { min-width: 44px; min-height: 44px; padding: 8px; border: 0; border-radius: 7px; background: transparent; color: #e3e7ee; font-family: inherit; font-size: 19px; line-height: 1; cursor: pointer; touch-action: manipulation; transition: background 200ms; }
#gs-home-tools .gs-tools-playback button:hover { background: #ffffff0c; }
#gs-home-tools .gs-tools-playback .gs-tools-toggle { min-width: 52px; color: #b6c0d0; font-size: 11px; }
#gs-home-tools :is(a, button):focus-visible { outline: 2px solid #f8f8fa; outline-offset: 4px; }
#gs-home-tools .gs-tools-announcement { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
#gs-home-tools.is-enhanced .gs-tools-slide.is-active .gs-tools-visual { animation: gs-tools-frame-in 780ms cubic-bezier(.2,.7,.2,1) both; }
#gs-home-tools.is-enhanced .gs-tools-slide.is-active .gs-tools-art { animation: gs-tools-drift 6s ease-out both; }
#gs-home-tools.is-enhanced .gs-tools-slide.is-active .gs-tools-light { animation: gs-tools-breathe 5.4s ease-in-out both; }
#gs-home-tools.is-enhanced .gs-tools-slide.is-active .gs-tools-sheen { animation: gs-tools-sheen 2.2s 240ms ease-out both; }
#gs-home-tools.is-enhanced .gs-tools-slide.is-active .gs-tools-caption { animation: gs-tools-copy-in 550ms 60ms both; }
#gs-home-tools.is-enhanced .gs-tools-slide.is-active .gs-tools-heading { animation: gs-tools-copy-in 600ms 140ms both; }
#gs-home-tools.is-enhanced .gs-tools-slide.is-active .gs-tools-description { animation: gs-tools-copy-in 600ms 220ms both; }
#gs-home-tools.is-enhanced .gs-tools-slide.is-active .gs-tools-cta { animation: gs-tools-copy-in 600ms 300ms both; }
#gs-home-tools.is-paused .gs-tools-slide.is-active :is(.gs-tools-art, .gs-tools-light) { animation-play-state: paused; }
@keyframes gs-tools-frame-in { from { opacity: .25; transform: translateY(9px) scale(.984); clip-path: inset(0 0 0 12% round 12px); } to { opacity: 1; transform: none; clip-path: inset(0 round 12px); } }
@keyframes gs-tools-copy-in { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: none; } }
@keyframes gs-tools-drift { from { transform: scale(.985); } to { transform: scale(1); } }
@keyframes gs-tools-breathe { 0% { opacity: .06; } 35% { opacity: .24; } 100% { opacity: .08; } }
@keyframes gs-tools-sheen { from { transform: translateX(0) rotate(-10deg); } to { transform: translateX(550%) rotate(-10deg); } }
@media (max-width: 899px) {
 #gs-home-tools.gs-tools-motion { width: min(650px, calc(100% - 28px)); padding: 25px 24px 16px; border-radius: 20px; }
 #gs-home-tools .gs-tools-intro { align-items: flex-start; flex-direction: column; gap: 17px; margin-bottom: 22px; }
 #gs-home-tools h2 { font-size: clamp(45px, 8.7vw, 61px); }
 #gs-home-tools h2 > span { display: block; }
 #gs-home-tools .gs-tools-slide { grid-template-columns: minmax(0, 1fr); row-gap: 12px; }
 #gs-home-tools .gs-tools-body { padding: 8px 0 0; }
 #gs-home-tools h3 { font-size: clamp(35px, 6.4vw, 46px); }
 #gs-home-tools .gs-tools-description { margin: 11px 0 19px; font-size: 14px; line-height: 1.5; }
 #gs-home-tools .gs-tools-selector { gap: 8px; margin-top: 24px; }
 #gs-home-tools .gs-tools-thumb { aspect-ratio: 1.5; border-radius: 7px; }
 #gs-home-tools .gs-tools-pick { gap: 8px; font-size: 11px; }
 #gs-home-tools .gs-tools-footer { margin-top: 12px; }
}
@media (max-width: 390px) {
 #gs-home-tools.gs-tools-motion { padding: 22px 16px 12px; }
 #gs-home-tools .gs-tools-eyebrow { font-size: 10px; letter-spacing: 1.3px; }
 #gs-home-tools h2 { font-size: clamp(43px, 14.1vw, 55px); }
 #gs-home-tools h3 { font-size: 33px; }
 #gs-home-tools .gs-tools-caption { font-size: 10px; letter-spacing: .55px; gap: 8px; }
 #gs-home-tools .gs-tools-description { font-size: 13px; }
 #gs-home-tools .gs-tools-selector { gap: 6px; }
 #gs-home-tools .gs-tools-footnote { max-width: 110px; }
 #gs-home-tools .gs-tools-cta { padding: 11px 14px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
 #gs-home-tools *, #gs-home-tools *::before, #gs-home-tools *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}