/* Klyvea — CSS combiné+minifié. NE PAS ÉDITER : modifier les sources (base/theme-a/theme-b/transition-pixel/transitions) puis régénérer. */

:root {
--bg:       #0A0A0A;
--bg2:      #131316;
--bg3:      #1c1c22;
--ink:      #FFFFFF;
--ink2:     rgba(255,255,255,0.72);
--muted:    rgba(255,255,255,0.5);
--line:     rgba(255,255,255,0.08);
--line2:    rgba(255,255,255,0.16);
--accent:   #1E3A8A;
--accent2:  #5B21B6;
--halo:     #A855F7;
--violet:   #7C3AED;
--glow-rgb:  30,58,138;
--glow2-rgb: 91,33,182;
--gradient: linear-gradient(90deg, #1E3A8A, #5B21B6, #A855F7);
--sans:     'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
--mono:     'JetBrains Mono', 'Fira Code', monospace;
--radius-sm: 8px;
--radius:    12px;
--radius-lg: 14px;
--max:       1100px;
--pad:       56px;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
font-family: var(--sans);
background: var(--bg);
color: var(--ink);
line-height: 1.5;
-webkit-font-smoothing: antialiased;
overflow-x: hidden;
padding-top: 34px; 
}
a { color: inherit; text-decoration: none; }
button, input, select, textarea {
font-family: var(--sans);
color: var(--ink);
}
img { display: block; max-width: 100%; }
ul { list-style: none; }
.container { max-width: var(--max); margin: 0 auto; }
.mono { font-family: var(--mono); }
.gradient-text {
background: var(--gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
padding-right: 0.12em;
-webkit-box-decoration-break: clone;
box-decoration-break: clone;
}
.halo {
position: absolute;
border-radius: 50%;
pointer-events: none;
}
.halo-tl { top: -100px; left: -100px; width: 500px; height: 500px;
background: radial-gradient(circle, rgba(168,85,247,0.16), transparent 70%); }
.halo-tr { top: -100px; right: -100px; width: 600px; height: 600px;
background: radial-gradient(circle, rgba(168,85,247,0.18), transparent 70%); }
.halo-center { top:50%; left:50%; transform:translate(-50%,-50%); width:600px; height:600px;
background: radial-gradient(circle, rgba(168,85,247,0.14), transparent 70%); }
.halo-bl { bottom: -200px; left: -100px; width: 500px; height: 500px;
background: radial-gradient(circle, rgba(168,85,247,0.16), transparent 70%); }
.site-header {
--logo: 104px;                 
display: flex;
justify-content: space-between;
align-items: center;
min-height: 64px;              
padding: 8px var(--pad);
border-bottom: 1px solid var(--line);
position: sticky;
top: 34px; 
background: rgba(10,10,10,0.85);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
z-index: 10000;
}
.header-brand {
position: relative;
display: flex;
align-items: center;
gap: 14px;
padding-left: calc(var(--logo) + 14px); 
min-height: 48px;
}
.header-logo {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: var(--logo);
height: var(--logo);
object-fit: contain;
filter: drop-shadow(0 0 12px rgba(168,85,247,0.5));
pointer-events: none;
}
.header-name {
font-size: 22px;
font-weight: 700;
letter-spacing: -0.02em;
color: var(--ink);
}
.site-nav {
display: flex;
gap: 6px;
font-size: 15px;
}
.nav-links-group {
display: contents;
}
.nav-cta-group,
.nav-footer-info {
display: none;
}
.site-nav a {
color: rgba(255,255,255,0.55);
padding: 8px 16px;
border-radius: 8px;
font-weight: 500;
transition: color 0.18s, background 0.18s, transform 0.12s;
position: relative;
}
.site-nav a:hover {
color: #fff;
background: rgba(255,255,255,0.08);
}
.site-nav a:active {
transform: scale(0.95);
background: rgba(255,255,255,0.12);
}
.site-nav a.active {
color: #fff;
background: rgba(255,255,255,0.06);
}
.btn-primary {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 10px 20px;
background: linear-gradient(135deg, #1E3A8A, #5B21B6);
color: #fff;
border-radius: 999px;
font-size: 15px;
font-weight: 600;
border: none;
cursor: pointer;
position: relative;
overflow: hidden;
white-space: nowrap;
transition: box-shadow 0.2s, transform 0.12s;
box-shadow: 0 0 0 rgba(168,85,247,0);
}
.btn-primary::after {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(135deg, rgba(255,255,255,0.18), rgba(255,255,255,0));
opacity: 0;
transition: opacity 0.2s;
border-radius: inherit;
}
.btn-primary:hover {
box-shadow: 0 0 24px rgba(168,85,247,0.55), 0 4px 16px rgba(var(--glow-rgb),0.4);
transform: translateY(-1px);
}
.btn-primary:hover::after { opacity: 1; }
.btn-primary:active {
transform: scale(0.96) translateY(0px);
box-shadow: 0 0 10px rgba(168,85,247,0.3);
}
.btn-primary.large {
padding: 18px 32px;
font-size: 15px;
}
.btn-ghost {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 18px 0;
color: var(--ink2);
font-size: 15px;
font-weight: 500;
border-bottom: 1px solid var(--line2);
background: none;
border-top: none; border-left: none; border-right: none;
cursor: pointer;
transition: color 0.15s;
}
.btn-ghost:hover { color: var(--ink); }
.btn-outline {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 14px 22px;
color: var(--ink);
font-size: 14px;
font-weight: 600;
border: 1px solid var(--line2);
border-radius: 999px;
background: none;
cursor: pointer;
transition: border-color 0.15s;
}
.btn-outline:hover { border-color: var(--line2); }
.nav-toggle {
display: none;
flex-direction: column;
gap: 5px;
background: none;
border: none;
cursor: pointer;
padding: 4px;
position: relative;
z-index: 10001; 
}
.nav-toggle span {
display: block;
width: 22px;
height: 1.5px;
background: var(--ink);
transition: all 0.2s;
}
.eyebrow {
display: inline-flex;
align-items: center;
gap: 8px;
font-family: var(--mono);
font-size: 11px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--accent);
margin-bottom: 16px;
}
.eyebrow::before {
content: '';
display: block;
width: 18px;
height: 1px;
background: var(--accent);
flex-shrink: 0;
}
.card {
background: var(--bg2);
border: 1px solid var(--line);
border-radius: var(--radius);
padding: 28px;
}
.card-dark {
background: var(--bg3);
border: 1px solid var(--line2);
border-radius: var(--radius);
padding: 28px;
}
section { position: relative; }
.section-inner {
max-width: var(--max);
margin: 0 auto;
padding: 0 var(--pad);
}
.img-placeholder {
background: repeating-linear-gradient(
45deg,
var(--bg2), var(--bg2) 10px,
var(--bg3) 10px, var(--bg3) 20px
);
border: 1px solid var(--line2);
border-radius: var(--radius);
display: flex;
align-items: center;
justify-content: center;
font-family: var(--mono);
font-size: 11px;
color: var(--muted);
text-align: center;
line-height: 1.6;
padding: 20px;
}
.faq-item {
border-bottom: 1px solid var(--line);
cursor: pointer;
}
.faq-trigger {
width: 100%;
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 24px;
padding: 20px 0;
background: none;
border: none;
text-align: left;
cursor: pointer;
color: var(--ink);
}
.faq-question {
font-size: 18px;
font-weight: 500;
color: var(--ink);
line-height: 1.35;
font-family: var(--sans);
}
.faq-icon {
font-size: 20px;
color: var(--accent);
min-width: 20px;
text-align: right;
margin-top: -2px;
flex-shrink: 0;
transition: transform 0.2s;
}
.faq-answer {
font-size: 14px;
color: var(--ink2);
line-height: 1.6;
max-width: 680px;
padding-bottom: 20px;
display: none;
}
.faq-item.open .faq-answer { display: block; }
.faq-item.open .faq-icon { transform: rotate(45deg); }
.launch-banner {
padding: 32px 40px;
background: linear-gradient(135deg, rgba(var(--glow-rgb),0.22), rgba(168,85,247,0.16));
border: 1px solid rgba(124,58,237,0.35);
border-radius: 16px;
display: flex;
justify-content: space-between;
align-items: center;
gap: 32px;
position: relative;
overflow: hidden;
}
.launch-banner::before {
content: '';
position: absolute;
top: -50px; right: -50px;
width: 200px; height: 200px;
border-radius: 50%;
background: radial-gradient(circle, rgba(168,85,247,0.32), transparent 70%);
pointer-events: none;
}
.launch-dot {
display: inline-flex;
align-items: center;
gap: 8px;
font-family: var(--mono);
font-size: 11px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--accent);
margin-bottom: 10px;
}
.launch-dot::before {
content: '';
display: block;
width: 6px; height: 6px;
border-radius: 50%;
background: var(--accent);
box-shadow: 0 0 8px var(--accent);
}
.launch-title {
font-size: 22px;
font-weight: 500;
color: var(--ink);
letter-spacing: -0.01em;
}
.site-footer {
padding: 56px var(--pad) 32px;
border-top: 1px solid var(--line);
background: var(--bg2);
}
.footer-grid {
max-width: var(--max);
margin: 0 auto;
display: grid;
grid-template-columns: 1.4fr 1fr 1fr 1fr;
gap: 48px;
}
.footer-brand-logo {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 18px;
}
.footer-brand-logo img {
width: 135px;
height: 135px;
object-fit: contain;
}
.footer-brand-logo span {
font-size: 20px;
font-weight: 600;
color: var(--ink);
}
.footer-tagline {
font-size: 13px;
color: var(--ink2);
line-height: 1.6;
margin-bottom: 18px;
max-width: 340px;
}
.footer-siret {
font-family: var(--mono);
font-size: 11px;
color: var(--muted);
letter-spacing: 0.04em;
}
.footer-col h4 {
font-family: var(--mono);
font-size: 11px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--accent);
margin-bottom: 16px;
}
.footer-col ul { display: flex; flex-direction: column; gap: 10px; }
.footer-col li { font-size: 13px; color: var(--ink2); }
.footer-col a:hover { color: var(--ink); }
.footer-bottom {
max-width: var(--max);
margin: 40px auto 0;
padding-top: 24px;
border-top: 1px solid var(--line);
display: flex;
justify-content: space-between;
font-family: var(--mono);
font-size: 11px;
color: var(--muted);
letter-spacing: 0.04em;
}
.check-list { display: flex; flex-direction: column; gap: 10px; }
.check-list li {
display: flex;
gap: 10px;
font-size: 13px;
color: var(--ink2);
line-height: 1.45;
align-items: flex-start;
}
.check-list li .icon { color: var(--accent); margin-top: 2px; flex-shrink: 0; }
.icon-svg {
display: inline-block;
flex-shrink: 0;
}
.pill-tag {
padding: 4px 10px;
border: 1px solid var(--line2);
border-radius: 999px;
font-family: var(--mono);
font-size: 11px;
color: var(--ink2);
letter-spacing: 0.02em;
transition: border-color 0.25s, box-shadow 0.25s;
}
.pill-tag:hover {
border-color: rgba(var(--glow-rgb),0.8);
box-shadow: 0 0 0 1px rgba(var(--glow-rgb),0.4), 0 4px 20px rgba(var(--glow-rgb),0.35);
}
.dashed-list li {
display: flex;
justify-content: space-between;
padding: 12px 0;
border-bottom: 1px dashed var(--line);
font-size: 13px;
}
.dashed-list li .val {
font-family: var(--mono);
color: var(--accent);
}
.section-pad { padding: 100px var(--pad); }
.section-pad-sm { padding: 60px var(--pad); }
.section-pad-xs { padding: 40px var(--pad); }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.hero-grid {
display: grid;
grid-template-columns: 1.2fr 1fr;
gap: 64px;
align-items: center;
}
.price-card {
padding: 32px;
background: var(--bg2);
border: 1px solid var(--line);
border-radius: var(--radius-lg);
display: flex;
flex-direction: column;
position: relative;
}
.price-card.emph {
background: var(--bg3);
border-color: var(--accent);
box-shadow: 0 0 0 1px var(--accent), 0 20px 40px rgba(168,85,247,0.16);
}
.price-badge {
position: absolute;
top: -12px; left: 24px;
padding: 5px 14px;
background: var(--accent);
color: #fff;
font-family: var(--mono);
font-size: 10px;
letter-spacing: 0.08em;
text-transform: uppercase;
border-radius: 999px;
font-weight: 600;
}
.price-name {
font-size: 24px;
font-weight: 500;
letter-spacing: -0.01em;
margin-bottom: 8px;
}
.price-target {
font-size: 13px;
color: var(--muted);
margin-bottom: 24px;
min-height: 36px;
line-height: 1.5;
}
.price-amount {
display: flex;
align-items: baseline;
gap: 6px;
margin-bottom: 6px;
}
.price-from {
font-family: var(--mono);
font-size: 11px;
color: var(--muted);
}
.price-num {
font-size: 44px;
font-weight: 500;
letter-spacing: -0.02em;
color: var(--ink);
}
.price-card.emph .price-num { color: var(--accent); }
.price-unit { font-size: 13px; color: var(--muted); }
.price-note {
font-size: 11px;
color: var(--muted);
font-style: italic;
margin-bottom: 20px;
}
.price-cta {
width: 100%;
padding: 14px 0;
background: transparent;
color: var(--ink);
border: 1px solid var(--line2);
border-radius: 999px;
font-size: 14px;
font-weight: 600;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
margin-top: auto;
transition: border-color 0.15s;
}
.price-card.emph .price-cta {
background: var(--accent);
color: #fff;
border: none;
}
.price-cta:hover { opacity: 0.9; }
.timeline {
position: relative;
padding-left: 36px;
}
.timeline::before {
content: '';
position: absolute;
left: 11px; top: 8px; bottom: 8px;
width: 1px;
background: linear-gradient(180deg, rgba(var(--glow-rgb),0.4), var(--line2));
}
.timeline-item {
position: relative;
padding: 16px 0 32px;
}
.timeline-dot {
position: absolute;
left: -36px; top: 22px;
width: 22px; height: 22px;
border-radius: 50%;
background: var(--bg);
border: 2px solid var(--accent);
box-shadow: 0 0 12px rgba(124,58,237,0.5);
}
.timeline-year {
font-family: var(--mono);
font-size: 11px;
color: var(--accent);
letter-spacing: 0.08em;
text-transform: uppercase;
margin-bottom: 6px;
}
.cal-day {
padding: 10px 0;
border-radius: 10px;
border: 1px solid var(--line2);
background: transparent;
color: var(--ink);
cursor: pointer;
display: flex;
flex-direction: column;
align-items: center;
gap: 2px;
transition: border-color 0.25s, background 0.25s, box-shadow 0.25s;
}
.cal-day:hover {
border-color: rgba(var(--glow-rgb),0.8);
box-shadow: 0 0 0 1px rgba(var(--glow-rgb),0.4), 0 4px 16px rgba(var(--glow-rgb),0.3);
background: rgba(var(--glow-rgb),0.08);
}
.cal-day.selected {
border-color: var(--accent);
background: var(--accent);
color: #fff;
}
.cal-day .day-name { font-family: var(--mono); font-size: 9px; opacity: 0.7; text-transform: uppercase; letter-spacing: 0.05em; }
.cal-day .day-num { font-size: 18px; font-weight: 600; }
.slot-btn {
padding: 10px 0;
border-radius: 8px;
border: 1px solid var(--line2);
background: transparent;
color: var(--ink2);
font-family: var(--mono);
font-size: 13px;
cursor: pointer;
transition: all 0.15s;
}
.slot-btn:hover { border-color: var(--accent); color: var(--accent); }
.slot-btn.selected {
border-color: var(--accent);
background: rgba(168,85,247,0.14);
color: var(--accent);
font-weight: 600;
}
.form-label {
display: block;
font-size: 11px;
font-weight: 600;
color: var(--ink2);
margin-bottom: 6px;
letter-spacing: 0.02em;
}
.form-input {
width: 100%;
padding: 12px 14px;
border: 1px solid var(--line2);
border-radius: var(--radius-sm);
background: var(--bg);
color: var(--ink);
font-size: 13px;
outline: none;
transition: border-color 0.15s;
}
.form-input:focus { border-color: var(--accent); }
.form-input::placeholder { color: var(--muted); }
textarea.form-input { resize: none; }
@media (max-width: 900px) {
:root { --pad: 24px; }
.site-nav, .header-cta { display: none; }
.nav-toggle { display: flex; }
.site-header {
position: fixed !important;
top: 34px; 
left: 0;
right: 0;
z-index: 10000 !important;
}
body.menu-open .site-header {
backdrop-filter: none;
-webkit-backdrop-filter: none;
background: var(--bg); 
}
.site-nav.open {
display: flex !important;
flex-direction: column;
justify-content: space-between;
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
width: 100vw !important;
height: 100vh !important;
height: 100dvh !important;
background: var(--bg) !important; 
background-image: radial-gradient(
ellipse 80% 50% at 50% 0%,
rgba(var(--glow2-rgb), 0.12) 0%,
transparent 60%
) !important;
padding: 88px 32px 48px;
z-index: 9999 !important;
isolation: isolate;
overflow: hidden !important;
gap: 0;
box-sizing: border-box;
animation: menu-slide-in 320ms cubic-bezier(0.16, 1, 0.3, 1) both;
}
.site-nav.open .nav-links-group {
display: flex;
flex-direction: column;
flex: 1;
justify-content: center;
gap: 0;
}
.site-nav.open .nav-links-group a {
font-size: 26px;
font-weight: 400;
letter-spacing: -0.02em;
color: rgba(255,255,255,0.55);
padding: 20px 16px;
margin: 0;
border-radius: 0;
background: none !important;
border-bottom: 1px solid rgba(255,255,255,0.06);
display: flex;
align-items: center;
transition: color 0.2s, padding-left 0.2s;
text-decoration: none;
}
.site-nav.open .nav-links-group a:first-child {
border-top: 1px solid rgba(255,255,255,0.06);
}
.site-nav.open .nav-links-group a:hover {
color: #ffffff;
padding-left: 24px;
}
.site-nav.open .nav-links-group a.active {
color: #ffffff;
font-weight: 500;
border-left: 2px solid #A855F7;
padding-left: 14px;
}
.site-nav.open .nav-links-group a:nth-child(1) { animation: link-fade-in 280ms cubic-bezier(0.16,1,0.3,1) 60ms both; }
.site-nav.open .nav-links-group a:nth-child(2) { animation: link-fade-in 280ms cubic-bezier(0.16,1,0.3,1) 100ms both; }
.site-nav.open .nav-links-group a:nth-child(3) { animation: link-fade-in 280ms cubic-bezier(0.16,1,0.3,1) 140ms both; }
.site-nav.open .nav-links-group a:nth-child(4) { animation: link-fade-in 280ms cubic-bezier(0.16,1,0.3,1) 180ms both; }
.site-nav.open .nav-cta-group {
display: flex;
flex-direction: column;
gap: 16px;
padding-top: 28px;
border-top: 1px solid rgba(255,255,255,0.05);
animation: link-fade-in 280ms cubic-bezier(0.16,1,0.3,1) 240ms both;
}
.nav-mobile-cta {
display: flex;
align-items: center;
justify-content: space-between;
padding: 18px 24px;
background: linear-gradient(135deg, rgba(var(--glow-rgb),0.6), rgba(var(--glow2-rgb),0.6));
border: 1px solid rgba(124,58,237,0.4);
border-radius: 14px;
color: #fff !important;
font-size: 16px;
font-weight: 500;
letter-spacing: -0.01em;
text-decoration: none;
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
transition: background 0.2s, border-color 0.2s;
width: 100%;
}
.nav-mobile-cta::after,
.nav-mobile-cta::before {
display: none !important;
content: none !important;
}
.nav-mobile-cta:hover {
background: linear-gradient(135deg, rgba(var(--glow-rgb),0.8), rgba(var(--glow2-rgb),0.8));
border-color: rgba(168,85,247,0.6);
color: #fff !important;
}
.site-nav.open .nav-footer-info {
display: flex;
flex-direction: row;
align-items: center;
gap: 8px;
padding-top: 4px;
}
.nav-footer-info span {
font-family: var(--mono);
font-size: 11px;
color: rgba(255,255,255,0.22);
letter-spacing: 0.04em;
}
.nav-footer-info span + span::before {
content: '·';
margin-right: 8px;
color: rgba(255,255,255,0.15);
}
@media (prefers-reduced-motion: reduce) {
.site-nav.open,
.site-nav.open .nav-links-group a,
.site-nav.open .nav-cta-group {
animation: none !important;
}
}
.nav-toggle.open span:nth-child(1) {
transform: rotate(45deg) translate(5px, 5px);
}
.nav-toggle.open span:nth-child(2) {
opacity: 0;
transform: scaleX(0);
}
.nav-toggle.open span:nth-child(3) {
transform: rotate(-45deg) translate(5px, -5px);
}
body.menu-open {
overflow: hidden;
position: fixed;
width: 100%;
}
@media (max-width: 390px) {
.site-nav.open a {
font-size: 24px;
padding: 13px 0;
}
.site-nav.open {
padding: 72px 24px 40px;
}
}
#hero-shader { z-index: 1 !important; }
.hero-grid { grid-template-columns: 1fr; }
.grid-3, .grid-4 { grid-template-columns: 1fr; }
.grid-2 { grid-template-columns: 1fr; }
.footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
.footer-grid > :first-child { grid-column: 1 / -1; }
.launch-banner { flex-direction: column; align-items: flex-start; gap: 20px; }
h1 { font-size: clamp(40px, 8vw, 78px) !important; }
h2 { font-size: clamp(28px, 5vw, 48px) !important; }
.section-pad { padding: 60px var(--pad); }
.section-pad-sm { padding: 40px var(--pad); }
.section-pad-xs { padding: 24px var(--pad); }
.site-header { --logo: 78px; }
.footer-brand-logo img { width: 48px; height: 48px; }
}
@keyframes menu-slide-in {
from {
opacity: 0;
transform: translateY(-12px);
filter: blur(4px);
}
to {
opacity: 1;
transform: translateY(0);
filter: blur(0);
}
}
@keyframes link-fade-in {
from { opacity: 0; transform: translateY(10px); }
to   { opacity: 1; transform: translateY(0); }
}
@media (max-width: 640px) {
.footer-grid { grid-template-columns: 1fr; }
.grid-2 { grid-template-columns: 1fr; }
}
.cpu-architecture {
offset-anchor: 10px 0px;
animation: animation-path;
animation-iteration-count: infinite;
animation-timing-function: cubic-bezier(0.75, -0.01, 0, 0.99);
}
.cpu-line-1 { offset-path: path("M 10 20 h 79.5 q 5 0 5 5 v 30"); animation-duration: 5s; animation-delay: 1s; }
.cpu-line-2 { offset-path: path("M 180 10 h -69.7 q -5 0 -5 5 v 40"); animation-delay: 6s; animation-duration: 2s; }
.cpu-line-3 { offset-path: path("M 130 20 v 21.8 q 0 5 -5 5 h -25"); animation-delay: 4s; animation-duration: 6s; }
.cpu-line-4 { offset-path: path("M 170 80 v -21.8 q 0 -5 -5 -5 h -65"); animation-delay: 3s; animation-duration: 3s; }
.cpu-line-5 { offset-path: path("M 135 65 h 15 q 5 0 5 5 v 10 q 0 5 -5 5 h -39.8 q -5 0 -5 -5 v -35"); animation-delay: 9s; animation-duration: 4s; }
.cpu-line-6 { offset-path: path("M 94.8 95 v -46"); animation-delay: 3s; animation-duration: 7s; }
.cpu-line-7 { offset-path: path("M 88 88 v -15 q 0 -5 -5 -5 h -10 q -5 0 -5 -5 v -5 q 0 -5 5 -5 h 28"); animation-delay: 4s; animation-duration: 4s; }
.cpu-line-8 { offset-path: path("M 30 30 h 25 q 5 0 5 5 v 6.5 q 0 5 5 5 h 35"); animation-delay: 3s; animation-duration: 3s; }
@keyframes animation-path { 0% { offset-distance: 0%; } 100% { offset-distance: 100%; } }
.terminal-topbar {
position: fixed;
top: 0; left: 0; right: 0;
z-index: 10001;
height: 34px;
display: flex;
align-items: center;
padding: 0 var(--pad);
background: var(--bg);
box-shadow: 0 1px 0 0 var(--line); 
font-family: var(--mono);
font-size: 13px;
color: transparent;      
white-space: nowrap;
overflow: hidden;
}
.terminal-topbar-cursor { display: none; } 
.section-tag { display: none; }
.ico-pixel { display: none; }
.hero-overlay {
position: absolute;
inset: 0;
z-index: 1;
pointer-events: none;
background: rgba(8,8,12,0.55); 
}
.theme-switch-wrap {
display: inline-flex;
align-items: center;
gap: 9px;
margin-left: 8px;
flex-shrink: 0;
}
.theme-switch-label {
font-family: var(--mono);
font-size: 12px;
font-weight: 500;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--ink2);
cursor: pointer;               
user-select: none;
transition: color 0.18s, text-shadow 0.18s;
}
.theme-switch-label:hover { color: var(--ink); }
.theme-switch {
--sw-w: 56px;
--sw-h: 30px;
--sw-bd: 1px;
--sw-pad: 4px;
--sw-knob: 20px;
--sw-travel: calc(var(--sw-w) - var(--sw-knob) - var(--sw-pad) * 2 - var(--sw-bd) * 2);
position: relative;
flex-shrink: 0;
width: var(--sw-w);
height: var(--sw-h);
margin-left: 0;
padding: 0;
background: linear-gradient(180deg, var(--bg2), var(--bg3));
border: var(--sw-bd) solid var(--line2);
border-radius: 999px;
cursor: pointer;
vertical-align: middle;
box-shadow: inset 0 1px 3px rgba(0,0,0,0.5);
transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
}
.theme-switch:hover { border-color: var(--accent); }
.theme-switch:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.theme-switch-knob {
position: absolute;
top: 50%;                       
left: var(--sw-pad);
width: var(--sw-knob);
height: var(--sw-knob);
border-radius: 50%;
background: radial-gradient(circle at 35% 28%, #ffffff, #c4ccdd);
box-shadow: 0 1px 3px rgba(0,0,0,0.5), inset 0 1px 1px rgba(255,255,255,0.7);
transform: translateY(-50%);
transition: transform 0.28s cubic-bezier(0.2,0.9,0.25,1),
border-radius 0.28s, background 0.28s, box-shadow 0.28s;
}
.theme-switch-knob::before {
content: '';
position: absolute;
inset: 0;
margin: auto;
width: 9px;
height: 9px;
border-radius: 50%;
border: 2px solid rgba(var(--glow-rgb),0.55);
box-sizing: border-box;
}
#theme-toggle[aria-checked="true"] .theme-switch-knob {
transform: translate(var(--sw-travel), -50%);
}
@media (max-width: 900px) {
.theme-switch-wrap { margin-right: 8px; gap: 7px; }
.theme-switch-label { font-size: 11px; letter-spacing: 0.06em; }
}
html.theme-a {
--bg:       #0A0A0A;
--bg2:      #131316;
--bg3:      #1c1c22;
--ink:      #FFFFFF;
--ink2:     rgba(255,255,255,0.72);
--muted:    rgba(255,255,255,0.5);
--line:     rgba(255,255,255,0.08);
--line2:    rgba(255,255,255,0.16);
--accent:   #1E3A8A;
--accent2:  #5B21B6;
--halo:     #A855F7;
--violet:   #7C3AED;
--glow-rgb:  30,58,138;
--glow2-rgb: 91,33,182;
--gradient: linear-gradient(90deg, #1E3A8A, #5B21B6, #A855F7);
--sans:     'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
--mono:     'JetBrains Mono', 'Fira Code', monospace;
--radius-sm: 8px;
--radius:    12px;
--radius-lg: 14px;
}
html.theme-b {
--bg:       #0a0a0f;
--bg2:      #0e0e16;
--bg3:      #14141f;
--ink:      #FFFFFF;
--ink2:     rgba(220,235,255,0.82);
--muted:    rgba(170,190,220,0.55);
--line:     rgba(34,211,238,0.18);
--line2:    rgba(34,211,238,0.38);
--accent:   #22d3ee;   
--accent2:  #a855f7;   
--halo:     #ff2bd6;   
--violet:   #a855f7;
--green:    #39ff14;   
--glow-rgb:  34,211,238;
--glow2-rgb: 168,85,247;
--gradient: linear-gradient(90deg, #22d3ee, #a855f7, #ff2bd6);
--glow-cyan:    0 0 8px rgba(34,211,238,0.55);
--glow-magenta: 0 0 8px rgba(255,43,214,0.55);
--glow-violet:  0 0 8px rgba(168,85,247,0.55);
--sans:     'Space Grotesk', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
--mono:     'VT323', 'JetBrains Mono', ui-monospace, monospace;
--display:  'VT323', 'JetBrains Mono', ui-monospace, monospace;
--pixel:    'Press Start 2P', 'JetBrains Mono', monospace;
--radius-sm: 4px;
--radius:    6px;
--radius-lg: 8px;
}
html.theme-b .ico-line  { display: none; }
html.theme-b .ico-pixel { display: inline-block; }
html.theme-b body {
padding-top: 34px;
background-color: var(--bg);
background-image:
linear-gradient(rgba(34,211,238,0.045) 1px, transparent 1px),
linear-gradient(90deg, rgba(34,211,238,0.045) 1px, transparent 1px);
background-size: 38px 38px;
background-attachment: fixed;
font-size: 16px;
line-height: 1.55;
counter-reset: eyebrow;
}
html.theme-b h1, html.theme-b h2, html.theme-b h3 {
font-family: var(--sans);
font-weight: 700;
letter-spacing: -0.01em;
text-shadow: 0 0 18px rgba(34,211,238,0.18);
}
html.theme-b .gradient-text { filter: drop-shadow(0 0 14px rgba(168,85,247,0.35)); }
html.theme-b .terminal-topbar {
display: flex;
position: fixed;
top: 0; left: 0; right: 0;
z-index: 10001;
width: 100%;
background: #04040a;
box-shadow: 0 1px 0 0 rgba(34,211,238,0.4); 
padding: 5px var(--pad);
align-items: center;
font-family: var(--mono);
font-size: 15px;
letter-spacing: 0.06em;
color: #3df58b;
text-shadow: 0 0 8px rgba(61,245,139,0.5);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
html.theme-b .terminal-topbar-cursor {
display: inline-block;
margin-left: 4px;
font-family: var(--mono);
color: #3df58b;
text-shadow: 0 0 8px rgba(61,245,139,0.6);
animation: terminal-blink 1.05s step-end infinite;
}
html.theme-b .terminal-topbar-cursor::before { content: '/'; }
@keyframes terminal-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
html.theme-b .site-header {
top: 34px;
border-bottom: 1px solid var(--line2);
box-shadow: 0 1px 0 rgba(34,211,238,0.25), 0 6px 24px rgba(0,0,0,0.4);
background: rgba(10,10,15,0.9);
}
html.theme-b .header-logo {
filter: drop-shadow(0 0 12px rgba(34,211,238,0.45)) drop-shadow(0 0 18px rgba(255,43,214,0.3));
}
html.theme-b .header-name {
font-family: var(--pixel);
font-size: 16px;
font-weight: 400;
letter-spacing: 0.02em;
text-shadow: 0 0 12px rgba(34,211,238,0.5);
}
html.theme-b .site-nav { font-family: var(--mono); font-size: 20px; }
html.theme-b .site-nav a {
color: rgba(200,220,245,0.6);
padding: 6px 14px;
border-radius: var(--radius-sm);
font-weight: 400;
letter-spacing: 0.03em;
transition: color 0.18s, background 0.18s, transform 0.12s, text-shadow 0.18s;
}
html.theme-b .site-nav a:hover { color: var(--accent); background: rgba(34,211,238,0.08); text-shadow: var(--glow-cyan); }
html.theme-b .site-nav a:active { background: rgba(34,211,238,0.14); }
html.theme-b .site-nav a.active { color: var(--accent); background: rgba(34,211,238,0.07); text-shadow: var(--glow-cyan); }
html.theme-b .btn-primary {
padding: 8px 22px;
background: linear-gradient(135deg, rgba(34,211,238,0.16), rgba(255,43,214,0.16));
color: var(--accent);
border-radius: var(--radius);
font-size: 19px;
font-weight: 400;
letter-spacing: 0.04em;
text-transform: uppercase;
border: 1px solid var(--accent);
font-family: var(--mono);
text-shadow: var(--glow-cyan);
transition: box-shadow 0.2s, transform 0.12s, color 0.2s, border-color 0.2s;
box-shadow: 0 0 0 rgba(34,211,238,0), inset 0 0 12px rgba(34,211,238,0.08);
}
html.theme-b .btn-primary:hover {
color: #fff;
border-color: var(--halo);
box-shadow: 0 0 24px rgba(255,43,214,0.45), inset 0 0 16px rgba(34,211,238,0.12);
transform: translateY(-1px);
}
html.theme-b .btn-primary:active { transform: scale(0.96) translateY(0); box-shadow: 0 0 10px rgba(34,211,238,0.35); }
html.theme-b .btn-primary.large { padding: 14px 32px; font-size: 21px; }
html.theme-b .btn-ghost {
padding: 14px 0;
font-size: 19px;
font-weight: 400;
text-transform: uppercase;
letter-spacing: 0.04em;
font-family: var(--mono);
transition: color 0.15s, text-shadow 0.15s;
}
html.theme-b .btn-ghost:hover { color: var(--accent); text-shadow: var(--glow-cyan); }
html.theme-b .btn-outline {
padding: 11px 22px;
font-size: 18px;
font-weight: 400;
text-transform: uppercase;
letter-spacing: 0.04em;
border-radius: var(--radius);
font-family: var(--mono);
transition: border-color 0.15s, color 0.15s, box-shadow 0.15s;
}
html.theme-b .btn-outline:hover { border-color: var(--accent); color: var(--accent); box-shadow: var(--glow-cyan); }
html.theme-b .eyebrow {
counter-increment: eyebrow;
gap: 7px;
font-family: var(--mono);
font-size: 18px;
font-weight: 400;
letter-spacing: 0.04em;
color: var(--accent);
margin-bottom: 22px;
padding: 5px 14px;
border: 1px solid rgba(34,211,238,0.45);
border-radius: 8px;
background: rgba(34,211,238,0.05);
box-shadow: 0 0 20px rgba(34,211,238,0.18), inset 0 0 16px rgba(34,211,238,0.06);
text-shadow: 0 0 10px rgba(34,211,238,0.35);
line-height: 1.1;
}
html.theme-b .eyebrow::before {
content: '> ' counter(eyebrow, decimal-leading-zero) '_';
width: auto; height: auto;            
background: none;
color: var(--green);
text-shadow: 0 0 10px rgba(57,255,20,0.6);
flex-shrink: 0;
}
html.theme-b .eyebrow-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
flex-wrap: wrap;
margin-bottom: 22px;
}
html.theme-b .eyebrow-row .eyebrow { margin-bottom: 0; }
html.theme-b .section-tag {
display: inline-block;
font-family: var(--mono);
font-size: 18px;
letter-spacing: 0.04em;
text-transform: uppercase;
color: #ff3da0;
padding: 5px 13px;
border: 1px solid rgba(255,61,160,0.45);
border-radius: 8px;
background: rgba(255,61,160,0.06);
box-shadow: 0 0 18px rgba(255,61,160,0.18);
text-shadow: 0 0 10px rgba(255,61,160,0.4);
white-space: nowrap;
line-height: 1.1;
}
html.theme-b .section-tag::before { content: '['; }
html.theme-b .section-tag::after  { content: ']'; }
html.theme-b .pricing-num,
html.theme-b .price-preview-num,
html.theme-b .step-num span,
html.theme-b .hero-stat-num {
font-family: var(--pixel) !important;
color: var(--accent) !important;
letter-spacing: 0 !important;
text-shadow: 0 0 16px rgba(34,211,238,0.5), 0 0 4px rgba(34,211,238,0.75);
}
html.theme-b .pricing-num       { font-size: 24px !important; line-height: 1.1 !important; }
html.theme-b .price-preview-num { font-size: 20px !important; line-height: 1.1 !important; }
html.theme-b .step-num span     { font-size: 14px !important; }
html.theme-b .hero-stat-num     { font-size: 20px !important; line-height: 1.2 !important; }
html.theme-b .card {
border: 1px solid var(--accent);
box-shadow: 0 0 14px rgba(34,211,238,0.22), inset 0 0 24px rgba(34,211,238,0.05);
font-family: var(--mono);
}
html.theme-b .card-dark {
border: 1px solid var(--accent2);
box-shadow: 0 0 14px rgba(168,85,247,0.22), inset 0 0 24px rgba(168,85,247,0.05);
font-family: var(--mono);
}
html.theme-b .pricing-card, html.theme-b .benefit-card, html.theme-b .value-card,
html.theme-b .pain-card, html.theme-b .price-preview-card, html.theme-b .module-card,
html.theme-b .cgv-intro-card, html.theme-b .right-card, html.theme-b .volet-card,
html.theme-b .scenario-card, html.theme-b .gain-card {
font-family: var(--mono);
border-color: var(--accent) !important;
box-shadow: 0 0 14px rgba(34,211,238,0.22), inset 0 0 20px rgba(34,211,238,0.04) !important;
}
html.theme-b .faq-question { font-size: 17px; line-height: 1.4; }
html.theme-b .faq-icon { font-size: 24px; text-shadow: var(--glow-cyan); }
html.theme-b .launch-banner { font-family: var(--mono); }
html.theme-b .launch-dot { font-size: 16px; letter-spacing: 0.12em; text-shadow: var(--glow-cyan); }
html.theme-b .launch-title { font-family: var(--display); font-size: 24px; font-weight: 400; letter-spacing: 0.01em; }
html.theme-b .footer-brand-logo span {
font-family: var(--pixel);
font-size: 14px;
font-weight: 400;
letter-spacing: 0.02em;
text-shadow: 0 0 12px rgba(34,211,238,0.5);
}
html.theme-b .footer-tagline { font-size: 14px; }
html.theme-b .footer-siret { font-size: 15px; }
html.theme-b .footer-col h4 { font-size: 16px; letter-spacing: 0.12em; text-shadow: var(--glow-cyan); }
html.theme-b .footer-col ul { gap: 9px; }
html.theme-b .footer-col li { font-size: 14px; }
html.theme-b .footer-col a:hover { color: var(--accent); text-shadow: var(--glow-cyan); }
html.theme-b .footer-bottom { font-size: 15px; }
html.theme-b .pill-tag {
padding: 3px 10px;
border-radius: var(--radius-sm);
font-size: 16px;
color: var(--accent);
text-transform: uppercase;
letter-spacing: 0.06em;
transition: border-color 0.25s, box-shadow 0.25s, color 0.25s;
}
html.theme-b .pill-tag::before { content: '['; color: var(--accent2); }
html.theme-b .pill-tag::after  { content: ']'; color: var(--accent2); }
html.theme-b .pill-tag:hover { border-color: var(--accent); color: #fff; box-shadow: var(--glow-cyan); }
html.theme-b .price-card {
border: 1px solid var(--accent);
font-family: var(--mono);
box-shadow: 0 0 14px rgba(34,211,238,0.18), inset 0 0 20px rgba(34,211,238,0.04);
}
html.theme-b .price-card.emph {
border-color: var(--accent);
box-shadow: 0 0 0 1px var(--accent), 0 20px 40px rgba(168,85,247,0.16);
}
html.theme-b .price-badge {
padding: 4px 14px;
color: #061015;
box-shadow: var(--glow-cyan);
font-size: 14px;
border-radius: var(--radius-sm);
font-weight: 400;
}
html.theme-b .price-card.emph .price-cta { color: #061015; box-shadow: var(--glow-cyan); }
html.theme-b .cal-day.selected { color: #061015; box-shadow: var(--glow-cyan); }
html.theme-b .cal-day .day-name { font-size: 13px; }
html.theme-b .cal-day .day-num { font-size: 22px; font-weight: 400; }
html.theme-b .slot-btn { padding: 8px 0; border-radius: var(--radius-sm); font-size: 17px; }
html.theme-b .form-label {
font-family: var(--mono);
font-size: 15px;
font-weight: 400;
letter-spacing: 0.06em;
text-transform: uppercase;
}
html.theme-b .form-input { padding: 10px 14px; font-size: 15px; font-family: var(--sans); }
html.theme-b .form-input:focus { box-shadow: var(--glow-cyan); }
html.theme-b .theme-switch {
border-color: var(--accent);
background: linear-gradient(180deg, #0a1418, #0b1620);
box-shadow: inset 0 0 10px rgba(34,211,238,0.2), 0 0 6px rgba(34,211,238,0.18);
}
html.theme-b .theme-switch-knob {
border-radius: var(--radius-sm);   
background: linear-gradient(180deg, #2ee0f2, #0bb5d6);
box-shadow: var(--glow-cyan), 0 1px 2px rgba(0,0,0,0.5), inset 0 1px 1px rgba(255,255,255,0.35);
}
html.theme-b #theme-toggle .theme-switch-knob {
transform: translate(var(--sw-travel), -50%);
}
html.theme-b .theme-switch-label:hover { color: var(--accent); text-shadow: var(--glow-cyan); }
html.theme-b .theme-switch-knob::before {
width: 9px;
height: 9px;
border: none;
border-radius: 0;
background:
linear-gradient(#063038 0 0) 0   0   / 3.5px 3.5px no-repeat,
linear-gradient(#063038 0 0) 5.5px 0   / 3.5px 3.5px no-repeat,
linear-gradient(#063038 0 0) 0   5.5px / 3.5px 3.5px no-repeat,
linear-gradient(#063038 0 0) 5.5px 5.5px / 3.5px 3.5px no-repeat;
}
html.theme-b .submit-btn {
padding: 14px;
color: #061015;
border-radius: var(--radius);
font-size: 20px;
font-weight: 400;
text-transform: uppercase;
letter-spacing: 0.05em;
box-shadow: var(--glow-cyan);
font-family: var(--mono);
transition: opacity 0.15s, box-shadow 0.15s;
}
html.theme-b .submit-btn:hover { opacity: 0.92; box-shadow: 0 0 20px rgba(34,211,238,0.6); }
html.theme-b .benefit-num {
width: 32px; height: 32px;
border-radius: var(--radius-sm);
color: #061015;
box-shadow: var(--glow-cyan);
font-size: 16px;
font-weight: 400;
}
html.theme-b .hero-card { font-family: var(--mono); }
html.theme-b .hero-overlay { background: rgba(8,8,12,0.42); }
@media (max-width: 900px) {
html.theme-b .terminal-topbar { font-size: 13px; padding: 6px 16px; }
html.theme-b .site-header { top: 34px !important; }
html.theme-b .site-nav.open .nav-links-group a.active { border-left-color: #60A5FA; }
}
:root {
--klv-sweep-dur: 600ms;
--klv-sweep-px: 13px;   
}
#theme-sweep {
position: fixed;
inset: 0;
z-index: 99999;
pointer-events: none;
transform: translateX(-115%);
will-change: transform, opacity;
background: linear-gradient(90deg,
transparent 0%,
rgba(34,211,238,0.95) 40%,
rgba(168,85,247,0.95) 72%,
transparent 100%);
-webkit-mask-image: linear-gradient(90deg, #000 70%, transparent 0),
linear-gradient(0deg,  #000 70%, transparent 0);
mask-image: linear-gradient(90deg, #000 70%, transparent 0),
linear-gradient(0deg,  #000 70%, transparent 0);
-webkit-mask-size: var(--klv-sweep-px) var(--klv-sweep-px);
mask-size: var(--klv-sweep-px) var(--klv-sweep-px);
-webkit-mask-repeat: repeat;
mask-repeat: repeat;
-webkit-mask-composite: source-in;   
mask-composite: intersect;   
}
#theme-sweep.run {
animation: klv-sweep var(--klv-sweep-dur) steps(34, end) forwards;
}
@keyframes klv-sweep {
0%   { transform: translateX(-115%); opacity: 0; }
12%  { opacity: 1; }
88%  { opacity: 1; }
100% { transform: translateX(115%);  opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
#theme-sweep { display: none !important; }
}
@view-transition {
navigation: auto;
}
@supports (view-transition-name: none) {
.header-brand {
view-transition-name: brand;
}
.site-nav {
view-transition-name: nav;
}
.header-cta {
view-transition-name: header-cta;
}
.site-footer {
view-transition-name: footer;
}
.nav-toggle {
view-transition-name: nav-toggle;
}
} 
@supports (view-transition-name: none) {
::view-transition-group(footer),
::view-transition-group(nav),
::view-transition-group(brand),
::view-transition-group(header-cta),
::view-transition-group(nav-toggle) {
overflow: clip;
}
::view-transition-group(brand) {
animation-duration: 500ms;
animation-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1.0);
}
::view-transition-group(nav) {
animation-duration: 500ms;
animation-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1.0);
}
::view-transition-group(header-cta) {
animation-duration: 500ms;
animation-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1.0);
}
::view-transition-group(page-title) {
animation-duration: 500ms;
animation-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1.0);
}
::view-transition-group(page-eyebrow) {
animation-duration: 500ms;
animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
::view-transition-group(footer) {
animation-duration: 380ms;
animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1.0);
}
::view-transition-group(nav-toggle) {
animation-duration: 380ms;
animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1.0);
}
} 
@supports (view-transition-name: none) {
::view-transition-old(*),
::view-transition-new(*) {
animation-fill-mode: both;
}
::view-transition-old(*) {
animation-duration: 200ms;
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
::view-transition-new(*) {
animation-duration: 500ms;
animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}
::view-transition-old(root) {
animation: none;
}
::view-transition-new(root) {
animation: none;
}
::view-transition-old(page-eyebrow) {
animation: klv-slide-up-out 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19) 0ms both;
}
::view-transition-new(page-eyebrow) {
animation: klv-fade-drop-in 380ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 0ms both;
}
::view-transition-old(page-title) {
animation: klv-slide-up-out 260ms cubic-bezier(0.55, 0.055, 0.675, 0.19) 0ms both;
}
::view-transition-new(page-title) {
animation: klv-fade-drop-in 460ms cubic-bezier(0.34, 1.56, 0.64, 1.0) 30ms both;
}
::view-transition-old(brand),
::view-transition-new(brand) {
animation-duration: 160ms;
animation-timing-function: ease;
}
::view-transition-old(nav),
::view-transition-new(nav) {
animation-duration: 160ms;
animation-timing-function: ease;
}
::view-transition-old(header-cta),
::view-transition-new(header-cta) {
animation-duration: 160ms;
animation-timing-function: ease;
}
::view-transition-old(footer),
::view-transition-new(footer) {
animation-duration: 260ms;
animation-timing-function: ease;
}
} 
@keyframes klv-slide-up-out {
from {
opacity: 1;
transform: translateY(0);
filter: blur(0px);
}
to {
opacity: 0;
transform: translateY(-6px);
filter: blur(1px);
}
}
@keyframes klv-fade-drop-in {
from {
opacity: 0;
transform: translateY(-8px);
filter: blur(2px);
}
to {
opacity: 1;
transform: translateY(0);
filter: blur(0px);
}
}
@keyframes klv-fade-out {
from { opacity: 1; }
to   { opacity: 0; }
}
@keyframes klv-fade-in {
from { opacity: 0; }
to   { opacity: 1; }
}
@keyframes klv-card-in {
from {
opacity: 0;
transform: translateY(12px) scale(0.98);
}
to {
opacity: 1;
transform: translateY(0) scale(1);
}
}
@media (prefers-reduced-motion: reduce) {
::view-transition-old(*),
::view-transition-new(*) {
animation: none !important;
}
::view-transition-group(*) {
animation-duration: 0ms !important;
}
}
html[data-klv-entering] body::before {
content: '';
position: fixed;
inset: 0;
z-index: 9999;
pointer-events: all;
background-color: #09090E;
background-image: radial-gradient(
ellipse 80% 60% at 50% 50%,
rgba(var(--glow2-rgb), 0.12) 0%,
transparent 70%
);
}
.page-veil {
position: fixed;
inset: 0;
z-index: 10000;
pointer-events: none;
will-change: transform;
transform: translateY(-100%);
background-color: #09090E;
background-image: radial-gradient(
ellipse 80% 60% at 50% 50%,
rgba(var(--glow2-rgb), 0.12) 0%,
rgba(var(--glow-rgb), 0.06) 40%,
transparent 70%
);
overflow: hidden;
}
.page-veil::before {
content: '';
position: absolute;
inset: -100px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
background-size: 200px 200px;
opacity: 0.04;
animation: klv-grain 0.16s steps(3) infinite;
pointer-events: none;
}
.page-veil::after {
content: '';
position: absolute;
bottom: -1px;
left: 0;
right: 0;
height: 1.5px;
background: linear-gradient(
90deg,
transparent  0%,
#1E3A8A     12%,
#7C3AED     38%,
#A855F7     50%,
#7C3AED     62%,
#1E3A8A     88%,
transparent 100%
);
box-shadow:
0  0 10px  2px rgba(168, 85, 247, 0.55),
0  0 30px  6px rgba(var(--glow2-rgb), 0.22),
0  0 60px 10px rgba(var(--glow-rgb), 0.12);
}
@keyframes klv-grain {
0%   { transform: translate(  0px,  0px); }
33%  { transform: translate( -5px,  2px); }
66%  { transform: translate(  3px, -4px); }
100% { transform: translate( -2px,  5px); }
}
@keyframes klv-veil-in {
from { transform: translateY(-100%); }
to   { transform: translateY(0);     }
}
@keyframes klv-veil-out {
from { transform: translateY(0);    }
to   { transform: translateY(100%); }
}
.page-veil--exit {
pointer-events: all;
animation: klv-veil-in 280ms cubic-bezier(0.65, 0, 0.35, 1) forwards;
}
.page-veil--enter {
pointer-events: all;
animation: klv-veil-out 440ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes klv-logo-flash {
0%   { filter: none; }
25%  { filter: drop-shadow(0 0 7px rgba(168, 85, 247, 0.85)) brightness(1.35); }
100% { filter: none; }
}
.klv-logo-pulse {
animation: klv-logo-flash 480ms ease-out forwards;
}
@media (prefers-reduced-motion: reduce) {
.page-veil::before,
.klv-logo-pulse {
animation: none !important;
}
}
