/* ========================================================================= arc144 skin — deep reskin of Digital Ecom Club to match arc144.com. Reversible OVERRIDE layer. Structure + French content unchanged. Loaded LAST in , so it wins the cascade. arc144 language: near-black canvas, mostly WHITE + GREY, teal used only as a sparse technical ACCENT (thin beams, ticks, chevrons). Restrained glow. Signatures: monospace technical labels, dark glass eyebrow pills, bright teal beam lines, corner brackets, edge ruler rails, faint grid. All old-site color/glow (gold #fce48f, blue #000212, bright-blue media) is neutralized here so everything blends into the new palette. ========================================================================= */ :root { /* ---- canvas ---- */ --arc-bg: #060708; /* near-black */ --arc-bg-1: #0a0c0d; /* panels */ --arc-bg-2: #0e1113; /* lifted panels */ /* ---- ink ---- */ --arc-white: #f4f6f6; --arc-grey: #a6afb1; /* body copy */ --arc-dim: #6b7578; /* muted / captions */ /* ---- lines ---- */ --arc-line: rgba(255,255,255,0.07); --arc-line-2: rgba(255,255,255,0.13); --arc-line-3: rgba(255,255,255,0.22); /* ---- teal accent (sparse) ---- */ --arc-teal: #269dae; --arc-teal-bright: #45c2d4; /* beams / ticks */ --arc-teal-soft: rgba(38,157,174,0.14); --arc-teal-line: rgba(69,194,212,0.9); /* ---- type ---- */ --arc-font: 'Geist', 'Helvetica Neue', Arial, sans-serif; --arc-mono: 'Geist Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace; /* ---- surfaces ---- */ --gr-panel: linear-gradient(180deg, rgba(255,255,255,0.035) 0%, rgba(255,255,255,0.006) 45%, rgba(255,255,255,0) 100%), var(--arc-bg-1); --gr-glass: linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.015) 100%), rgba(11,14,15,0.6); --sh-panel: 0 1px 0 0 rgba(255,255,255,0.04) inset, 0 24px 60px -34px rgba(0,0,0,0.9); --beam: 0 0 12px rgba(69,194,212,0.55), 0 0 4px rgba(69,194,212,0.85); /* ---- motion ---- */ --ease: cubic-bezier(0.22, 1, 0.36, 1); --ease-main: cubic-bezier(0.6, 0.6, 0, 1); --dur-med: 0.6s; --dur-half: 0.4s; --dur-fast: 0.28s; } /* ============================= BASE ============================= */ html, body { background: var(--arc-bg) !important; color: var(--arc-grey); } body, p, li, span, a, div, blockquote, figcaption, input, textarea, select, button, .w-button { font-family: var(--arc-font); } ::selection { background: var(--arc-teal); color: #001014; } * { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } /* ambient backdrop: teal wash up top + a soft second beam upper-right for depth + deep vignette. Present (arc144 atmosphere) but still restrained. */ body::before { content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(78% 48% at 50% -8%, rgba(38,157,174,0.11) 0%, transparent 60%), radial-gradient(48% 44% at 88% 10%, rgba(38,157,174,0.055) 0%, transparent 62%), radial-gradient(120% 90% at 50% 118%, rgba(0,0,0,0.5) 0%, transparent 66%); } /* faint technical grid, masked to the top so it fades out */ body::after { content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .55; background-image: linear-gradient(rgba(255,255,255,0.028) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.028) 1px, transparent 1px); background-size: 74px 74px; -webkit-mask-image: radial-gradient(135% 100% at 50% 0%, #000 0%, transparent 78%); mask-image: radial-gradient(135% 100% at 50% 0%, #000 0%, transparent 78%); } /* keep all real content above the fixed backdrop + ruler rails */ .page-wrapper, .navbar, header, main, footer, section, .footer, .section-pricing, .section-8, .section-2 { position: relative; z-index: 1; } /* ---- NEUTRALIZE old-site glows / colored washes ---- */ /* NB: `.glow` is the class on
— a CONTENT container (the "contenu réservé aux membres" feature grid). Only strip its colored wash; NEVER opacity:0/display:none it or the whole section vanishes. */ .section-2.glow { background-image: none !important; background-color: transparent !important; box-shadow: none !important; filter: none !important; } /* old dark-blue hero background media -> clean black canvas (arc144 hero). NB: .background-video is the page-level wrapper that HOLDS the navbar + all content, so only the inner