/* ============================================================
   EVOSYSTEM — shared.css
   Repositioning prototype. All brand tokens preserved verbatim
   from /opt/evosystem/apps/web/public/landing.css.
   ============================================================ */

:root{
  --bg:#05030a;
  --bg-2:#0a0612;
  --bg-3:#100822;
  --line:#1a0f2a;
  --line-2:#2a1a45;
  --milk:#F0EBF8;
  --silver:#C2BAD6;
  --mute:#5a4f7a;
  --violet:#9B5DE5;
  --violet-bright:#B57FFF;
  --violet-deep:#6B2FD9;
  --violet-glow:#C99FFF;
  --pink:#FF3D8B;
  --hot:#FF4D6D;
  --green:#00ff88;
  --pad-x: clamp(20px, 4vw, 64px);

  --grad-violet: linear-gradient(135deg, #C99FFF 0%, #B57FFF 50%, #6B2FD9 100%);
  --grad-text: linear-gradient(120deg, var(--violet-bright) 0%, var(--milk) 50%, var(--violet) 100%);
  --ease-ui: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-in-out: cubic-bezier(0.16, 1, 0.3, 1);
}

*{margin:0;padding:0;box-sizing:border-box;}
html,body{
  background:var(--bg);
  color:var(--milk);
  font-family:'Manrope',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  scroll-behavior: smooth;
}
body{min-height:100vh;position:relative;}

img,svg{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;}

/* === noise overlay === */
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:200;
  opacity:.06;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.9'/></svg>");
}

/* === custom selection === */
::selection{
  background:rgba(155,93,229,.32);
  color:var(--milk);
}
::-moz-selection{background:rgba(155,93,229,.32);color:var(--milk);}

/* === custom scrollbar === */
::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{
  background:var(--violet-deep);
  border-radius:100px;
  border:2px solid var(--bg);
}
::-webkit-scrollbar-thumb:hover{background:var(--violet);}

/* === tabular numbers for metrics === */
.mono, [data-count], .v, .duration, .price, .metric-value, .case-row .metric .v, .industry-tag, .live-row, .system-status, .filters .stat, .footer-bottom, .crumb{
  font-variant-numeric: tabular-nums lining-nums;
}

/* === top scroll progress (subtle) === */
.scroll-progress{
  position:fixed;top:0;left:0;right:0;
  height:1px;z-index:99;
  pointer-events:none;
}
.scroll-progress .bar{
  height:100%;width:0;
  background:var(--violet);
  transition:width 50ms linear;
}
/* === vignette === */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:190;
  background:radial-gradient(ellipse at center, transparent 35%, rgba(0,0,0,.7) 100%);
}

/* === cursor glow === */
.cursor-glow{
  position:fixed;width:600px;height:600px;border-radius:50%;
  pointer-events:none;z-index:1;
  background:radial-gradient(circle, rgba(155,93,229,.12) 0%, transparent 60%);
  transform:translate(-50%,-50%);opacity:0;
  transition:opacity .4s ease;
}
@media (hover:hover){body:hover .cursor-glow{opacity:1;}}

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
.eyebrow{
  display:inline-block;
  font-family:'Manrope',sans-serif;
  font-size:11px;font-weight:600;
  letter-spacing:.26em;text-transform:uppercase;
  color:var(--violet-bright);
  position:relative;
  padding-left:24px;
}
.eyebrow::before{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:14px;height:1px;
  background:linear-gradient(90deg, var(--violet), transparent);
}
.eyebrow.muted{color:var(--mute);}
.eyebrow.muted::before{background:linear-gradient(90deg, var(--mute), transparent);}

h1,h2,h3,h4{
  font-family:'Unbounded',sans-serif;
  font-weight:700;
  letter-spacing:-.02em;
  line-height:1;
  color:var(--milk);
  font-feature-settings: "ss01" 1, "ss02" 1, "kern" 1;
}
h1{
  font-size:clamp(48px,6.5vw,104px);
  font-weight:800;line-height:.92;letter-spacing:-.028em;
  text-wrap:balance;
}
h2{
  font-size:clamp(36px,4.4vw,72px);
  font-weight:700;line-height:1.0;letter-spacing:-.024em;
  text-wrap:balance;
}
h3{font-size:clamp(22px,2vw,32px);font-weight:600;line-height:1.15;letter-spacing:-.015em;}
h4{font-size:clamp(16px,1.2vw,20px);font-weight:600;line-height:1.2;letter-spacing:.02em;text-transform:uppercase;}

/* Enhanced gradient text — multi-stop with shimmer */
.grad{
  background:linear-gradient(
    120deg,
    var(--violet-bright) 0%,
    var(--violet-glow) 18%,
    var(--milk) 38%,
    var(--violet-glow) 58%,
    var(--violet-bright) 78%,
    var(--violet-deep) 100%
  );
  background-size:280% 100%;
  background-position:0% 50%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:gradShift 8s ease-in-out infinite;
  display:inline-block;
  filter:drop-shadow(0 0 24px rgba(181,127,255,.15));
}
@keyframes gradShift{
  0%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}

/* Subtle text shimmer on hero headings */
h1 .shimmer, .shimmer{
  position:relative;
  display:inline-block;
}
h1 .shimmer::after, .shimmer::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(120deg, transparent 30%, rgba(255,255,255,.15) 50%, transparent 70%);
  background-size:200% 100%;
  background-position:-100% 0;
  mix-blend-mode:overlay;
  pointer-events:none;
  animation:shimmerSweep 6s ease-in-out infinite;
  animation-delay:2s;
}
@keyframes shimmerSweep{
  0%, 60%{background-position:-100% 0;}
  100%{background-position:200% 0;}
}

/* Improved lead — better optical rhythm */
.lead{
  font-size:clamp(17px,1.3vw,20px);line-height:1.55;
  color:var(--silver);font-weight:400;
  text-wrap:pretty;
  max-width:60ch;
}
.body-text{font-size:15px;line-height:1.6;color:var(--silver);text-wrap:pretty;}
.caption{font-size:12px;line-height:1.5;color:var(--mute);letter-spacing:.02em;}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace;}

/* Section labels — consistent ⬡ prefix */
.section-marker{
  font-family:'JetBrains Mono',monospace;
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--violet-bright);
}
.section-marker::before{content:"⬡ ";opacity:.7;}

/* ============================================================
   LAYOUT
   ============================================================ */
.container{
  max-width:1320px;margin:0 auto;
  padding-left:var(--pad-x);padding-right:var(--pad-x);
}
.container-narrow{
  max-width:920px;margin:0 auto;
  padding-left:var(--pad-x);padding-right:var(--pad-x);
}
section{position:relative;}
.section-padding{padding:clamp(80px,10vh,160px) 0;}
.section-padding-sm{padding:clamp(50px,6vh,90px) 0;}

.section-head{margin-bottom:clamp(40px,5vh,72px);max-width:780px;}
.section-head .eyebrow{margin-bottom:18px;}
.section-head h2{margin-bottom:18px;}
.section-head p{max-width:640px;}

.hr-line{height:1px;background:linear-gradient(90deg,transparent,var(--line-2),transparent);}

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:18px var(--pad-x);
  display:flex;align-items:center;justify-content:space-between;
  background:linear-gradient(to bottom,rgba(5,3,10,.85),rgba(5,3,10,0));
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
/* Eva is showcased in the portfolio (/cases) + homepage banner, not as a
   top-level product nav item — hide the standalone menu entry on every page. (2026-06-04) */
.nav-links a[href="/eva"]{display:none;}
.nav-logo{
  font-family:'Unbounded',sans-serif;font-weight:600;
  font-size:15px;letter-spacing:-.012em;
  color:var(--milk);
  display:flex;align-items:center;gap:0;
  position:relative;
  text-transform:none;
}
.nav-logo .wordmark{
  display:inline-flex;align-items:baseline;
  letter-spacing:-.01em;
  background:linear-gradient(180deg, var(--milk) 0%, #DCD2EE 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  text-shadow:0 0 24px rgba(155,93,229,.18);
}
.nav-logo:hover .wordmark{
  background:linear-gradient(180deg, var(--violet-glow), var(--violet-bright));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.nav-logo .wordmark .em-dot{display:none;}
.nav-logo .e-mark{
  position:relative;display:inline-flex;
  width:24px;height:24px;margin-right:10px;
  align-items:center;justify-content:center;
}
.nav-logo .e-mark .e-stroke{
  fill:none;stroke:url(#eGrad);
  stroke-width:3;
  stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:80;stroke-dashoffset:0;
  animation:eDraw 6s ease-in-out infinite;
  filter:drop-shadow(0 0 10px rgba(155,93,229,.6));
}
.nav-logo .e-mark svg{width:100%;height:100%;overflow:visible;}
.nav-logo .e-mark .e-stroke{
  fill:none;stroke:url(#eGrad);
  stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:80;stroke-dashoffset:0;
  animation:eDraw 6s ease-in-out infinite;
  filter:drop-shadow(0 0 6px var(--violet));
}
.nav-logo .e-mark .e-stroke{
  fill:none;stroke:url(#eGrad);
  stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:80;stroke-dashoffset:0;
  animation:eDraw 6s ease-in-out infinite;
  filter:drop-shadow(0 0 6px var(--violet));
}
.nav-logo .e-mark .e-orbit{
  fill:none;stroke:var(--violet-bright);
  stroke-width:1;opacity:.35;
  transform-origin:center;
  animation:eOrbitSpin 8s linear infinite;
}
.nav-logo .e-mark .e-dot{
  fill:var(--violet-glow);
  filter:drop-shadow(0 0 8px var(--violet-bright));
  animation:eDotOrbit 4s linear infinite;
  transform-origin:center;
}
@keyframes eDraw{
  0%{stroke-dashoffset:80;}
  50%{stroke-dashoffset:0;}
  100%{stroke-dashoffset:-80;}
}
@keyframes eOrbitSpin{from{transform:rotate(0);}to{transform:rotate(360deg);}}
@keyframes eDotOrbit{from{transform:rotate(0);}to{transform:rotate(-360deg);}}

.nav-logo .crumb{
  font-family:'JetBrains Mono',monospace;
  font-weight:400;
  font-size:10px;letter-spacing:.14em;
  color:var(--mute);
  margin-left:12px;padding-left:12px;
  border-left:1px solid var(--line-2);
  text-transform:uppercase;
}

.nav-links{display:flex;gap:28px;align-items:center;}
.nav-links a{
  font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--silver);font-weight:500;
  transition:color .25s ease;
  position:relative;
}
.nav-links a:hover{color:var(--violet-bright);}
.nav-links a.has-dropdown::after{
  content:"";display:inline-block;
  width:6px;height:6px;
  border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:rotate(45deg) translateY(-3px);margin-left:7px;
  opacity:.6;
}
.nav-links a.active{color:var(--violet-bright);}
.nav-links a .badge{
  display:inline-block;
  font-size:8px;font-weight:600;letter-spacing:.16em;
  padding:2px 6px;margin-left:6px;
  border:1px solid var(--violet);
  border-radius:100px;
  color:var(--violet-bright);
  vertical-align:middle;
  background:rgba(155,93,229,.08);
}

.nav-right{display:inline-flex;align-items:center;gap:14px;}
.lang-toggle{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 12px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(155,93,229,.2);
  border-radius:100px;cursor:pointer;
  font-family:'Manrope',sans-serif;
  font-size:10px;font-weight:600;letter-spacing:.18em;
  color:var(--mute);
  transition:all .25s ease;
}
.lang-toggle:hover{border-color:rgba(155,93,229,.4);background:rgba(155,93,229,.06);}
.lang-toggle span{color:var(--mute);transition:color .2s;}
.lang-toggle span.active{color:var(--violet-bright);}
.lang-toggle .sep{opacity:.3;}

.nav-cta{
  padding:10px 18px;
  border:1px solid var(--violet);
  background:rgba(155,93,229,.1);
  color:var(--milk);
  font-family:'Unbounded',sans-serif;
  font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  transition:all .25s ease;
  box-shadow:0 0 20px rgba(155,93,229,.3);
}
.nav-cta:hover{background:var(--violet);box-shadow:0 0 30px var(--violet);}

.nav-burger{display:none;}

@media (max-width:1080px){
  .nav-links{display:none;}
  .nav-burger{
    display:inline-flex;width:38px;height:38px;
    align-items:center;justify-content:center;
    background:rgba(155,93,229,.08);
    border:1px solid var(--line-2);border-radius:8px;cursor:pointer;
  }
  .nav-burger span{
    display:block;width:16px;height:1.5px;background:var(--milk);
    position:relative;
  }
  .nav-burger span::before,.nav-burger span::after{
    content:"";position:absolute;left:0;width:100%;height:1.5px;background:var(--milk);
  }
  .nav-burger span::before{top:-5px;}
  .nav-burger span::after{top:5px;}
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{
  position:relative;
  display:inline-flex;align-items:center;gap:14px;
  padding:18px 28px;
  font-family:'Unbounded',sans-serif;
  font-size:11px;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;text-decoration:none;cursor:pointer;border:none;
  transition:all .3s var(--ease-ui);
  white-space:nowrap;
}
.btn-primary{
  background:linear-gradient(135deg,var(--violet-bright),var(--violet-deep));
  color:var(--milk);
  box-shadow:0 0 30px rgba(155,93,229,.5), inset 0 0 20px rgba(255,255,255,.1);
}
.btn-primary::before{
  content:"";position:absolute;inset:-2px;
  background:linear-gradient(135deg,var(--violet-bright),var(--violet));
  z-index:-1;filter:blur(8px);opacity:.7;
  animation:btnGlow 3s ease-in-out infinite;
}
@keyframes btnGlow{0%,100%{opacity:.7;}50%{opacity:1;}}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 0 50px rgba(155,93,229,.8);}
.btn-ghost{
  background:transparent;color:var(--milk);
  border:1px solid var(--line-2);
}
.btn-ghost:hover{
  border-color:var(--violet);background:rgba(155,93,229,.06);
  box-shadow:0 0 20px rgba(155,93,229,.2);
}
.btn-arr{
  display:inline-block;width:14px;height:10px;position:relative;
  transition:transform .3s ease;
}
.btn-arr::after{
  content:"";position:absolute;right:0;top:50%;
  width:8px;height:8px;
  border-top:2px solid currentColor;border-right:2px solid currentColor;
  transform:translateY(-50%) rotate(45deg);
}
.btn-arr::before{
  content:"";position:absolute;left:0;top:50%;
  width:100%;height:2px;
  background:currentColor;transform:translateY(-50%);
}
.btn:hover .btn-arr{transform:translateX(4px);}
.btn-lg{padding:22px 36px;font-size:12px;}
.btn-sm{padding:12px 18px;font-size:10px;letter-spacing:.2em;gap:10px;}

.text-link{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Manrope',sans-serif;
  font-size:13px;font-weight:600;letter-spacing:.06em;
  color:var(--violet-bright);
  transition:color .2s,gap .25s var(--ease-ui);
}
.text-link:hover{color:var(--milk);gap:12px;}
.text-link::after{content:"→";font-weight:400;}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{
  position:relative;
  border-top:1px solid var(--line);
  padding:80px var(--pad-x) 40px;
  background:linear-gradient(to bottom,transparent,rgba(10,6,18,.6));
  z-index:5;
}
.footer-grid{
  display:grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap:50px;
  max-width:1320px;margin:0 auto 60px;
}
.footer-brand{max-width:380px;}
.footer-brand .logo-line{
  display:flex;align-items:center;gap:10px;
  font-family:'Unbounded',sans-serif;font-weight:800;
  font-size:14px;letter-spacing:.28em;margin-bottom:18px;
  color:var(--milk);
}
.footer-brand p{font-size:13px;line-height:1.6;color:var(--silver);margin-bottom:18px;}
.footer-brand .socials{display:flex;gap:10px;}
.footer-brand .socials a{
  width:34px;height:34px;
  border:1px solid var(--line-2);
  border-radius:8px;
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--silver);
  transition:all .25s var(--ease-ui);
}
.footer-brand .socials a:hover{
  border-color:var(--violet);color:var(--violet-bright);
  background:rgba(155,93,229,.08);
}
.footer-col h5{
  font-family:'Unbounded',sans-serif;font-weight:600;
  font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--milk);margin-bottom:18px;
}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:10px;}
.footer-col a{
  font-size:13px;color:var(--silver);
  transition:color .2s;
}
.footer-col a:hover{color:var(--violet-bright);}
.footer-bottom{
  max-width:1320px;margin:0 auto;
  padding-top:30px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:18px;
  font-size:12px;color:var(--mute);
}
.footer-bottom .legal{display:flex;gap:18px;}
.footer-bottom .legal a:hover{color:var(--silver);}

@media (max-width:880px){
  .footer-grid{grid-template-columns: 1fr 1fr;gap:40px 30px;}
  .footer-brand{grid-column:1/-1;}
}

/* ============================================================
   COMMON COMPONENTS
   ============================================================ */

/* Manifesto stripe */
.manifesto-stripe{
  position:relative;z-index:5;
  padding:36px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  overflow:hidden;
  background:linear-gradient(90deg,var(--bg),var(--bg-2),var(--bg));
}
.manifesto-track{
  display:flex;gap:60px;white-space:nowrap;
  animation:marquee 42s linear infinite;
  font-family:'Unbounded',sans-serif;
  font-size:14px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--silver);font-weight:500;
  will-change:transform;
}
.manifesto-track span{display:inline-flex;align-items:center;gap:60px;}
.manifesto-track i{
  font-style:normal;color:var(--violet-bright);
  font-size:14px;text-shadow:0 0 10px var(--violet);
}
.manifesto-track b{color:var(--violet-bright);font-weight:700;}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* Card primitives */
.card{
  position:relative;
  background:linear-gradient(180deg, rgba(155,93,229,.04), rgba(10,6,18,.6));
  border:1px solid var(--line-2);
  padding:32px;
  transition:all .3s var(--ease-ui);
  overflow:hidden;
}
.card::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse at top, rgba(155,93,229,.08), transparent 60%);
  opacity:0;transition:opacity .3s ease;
  pointer-events:none;
}
.card:hover::before{opacity:1;}
.card:hover{
  border-color:rgba(155,93,229,.5);
  transform:translateY(-4px);
  box-shadow:0 12px 40px rgba(0,0,0,.4), 0 0 0 1px rgba(155,93,229,.2), 0 0 60px rgba(155,93,229,.08);
}
.card-arrow{
  position:absolute;right:24px;bottom:24px;
  width:32px;height:32px;
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--mute);
  transition:all .3s var(--ease-ui);
}
.card:hover .card-arrow{color:var(--violet-bright);transform:translate(4px,-4px);}

/* Trust strip */
.trust-strip{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:12px;
  padding:22px 28px;
  border:1px solid var(--line-2);
  background:rgba(10,6,18,.6);
  backdrop-filter:blur(10px);
}
.trust-strip .item{
  display:flex;align-items:center;gap:14px;
  padding-right:12px;
  border-right:1px solid var(--line);
}
.trust-strip .item:last-child{border-right:none;}
.trust-strip .item .v{
  font-family:'Unbounded',sans-serif;font-weight:700;
  font-size:22px;color:var(--milk);line-height:1;letter-spacing:-.01em;
}
.trust-strip .item .v .accent{color:var(--violet-bright);}
.trust-strip .item .k{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--mute);margin-top:4px;font-weight:500;
}
@media (max-width:880px){
  .trust-strip{grid-template-columns:1fr 1fr;}
  .trust-strip .item:nth-child(2){border-right:none;}
}

/* Metrics row */
.metrics-row{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:24px;padding:32px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.metric .v{
  font-family:'Unbounded',sans-serif;font-weight:700;
  font-size:clamp(32px,3.6vw,48px);
  color:var(--milk);line-height:1;letter-spacing:-.02em;
  margin-bottom:8px;
}
.metric .v .accent{color:var(--violet-bright);}
.metric .k{
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--mute);font-weight:500;
}
@media (max-width:760px){.metrics-row{grid-template-columns:1fr 1fr;gap:18px;}}

/* Pill */
.pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 14px;
  font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;
  border:1px solid var(--line-2);border-radius:100px;
  color:var(--silver);
  background:rgba(155,93,229,.04);
}
.pill .dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--green);box-shadow:0 0 8px var(--green);
  animation:pulse 1.4s ease-in-out infinite;
}
.pill.violet{border-color:rgba(155,93,229,.4);color:var(--violet-bright);}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.4;transform:scale(.7);}}

/* Scroll reveal */
.reveal{
  opacity:0;transform:translateY(20px);
  transition:opacity .8s var(--ease-in-out), transform .8s var(--ease-in-out);
}
.reveal.in{opacity:1;transform:translateY(0);}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    transition-duration:.01ms !important;
  }
  .reveal{opacity:1;transform:none;}
}

/* Numbered list label */
.num-label{
  font-family:'Unbounded',sans-serif;font-weight:700;
  font-size:13px;letter-spacing:.16em;
  color:var(--violet-bright);
  display:inline-flex;align-items:center;gap:8px;
}
.num-label::before{
  content:"";display:inline-block;
  width:18px;height:1px;background:var(--violet);
}

/* Body wrapper */
main{position:relative;z-index:5;}

/* Spacer */
.spacer-sm{height:40px;}
.spacer-md{height:80px;}
.spacer-lg{height:120px;}

/* Util */
.text-center{text-align:center;}
.text-violet{color:var(--violet-bright);}
.text-milk{color:var(--milk);}
.text-silver{color:var(--silver);}
.text-mute{color:var(--mute);}
.hide-mobile{display:initial;}
@media (max-width:760px){.hide-mobile{display:none;}}

/* Page hero baseline */
.page-hero{
  position:relative;
  padding:160px var(--pad-x) 80px;
  overflow:hidden;
}
.page-hero::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 70% 30%, rgba(155,93,229,.12), transparent 50%),
    radial-gradient(ellipse at 20% 90%, rgba(107,47,217,.08), transparent 50%);
  pointer-events:none;z-index:0;
}
.page-hero .container{position:relative;z-index:2;}


/* ============ Footer legal-strip (Tooploox-style) ============ */
.footer-legal {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
  padding: 32px 0;
  margin-top: 24px;
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.footer-legal .legal-col { min-width: 0; }
.footer-legal .legal-label {
  display: block;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 10px;
}
.footer-legal .legal-value {
  font-size: 14px;
  color: var(--milk);
  line-height: 1.4;
  margin-bottom: 6px;
}
.footer-legal .legal-value a {
  color: var(--milk);
  text-decoration: none;
  border-bottom: 1px solid rgba(155,93,229,.4);
  transition: border-color .2s;
}
.footer-legal .legal-value a:hover { border-color: var(--violet-bright); }
.footer-legal .legal-meta {
  font-size: 12px;
  color: var(--silver);
  line-height: 1.4;
}
@media (max-width: 768px) {
  .footer-legal { grid-template-columns: 1fr 1fr; gap: 24px; padding: 24px 0; }
}
@media (max-width: 480px) {
  .footer-legal { grid-template-columns: 1fr; }
}

/* ============================================================
   MOBILE TYPOGRAPHY FIX
   Unbounded does not include Cyrillic → fallback rendering with
   negative letter-spacing causes Cyrillic words to visually merge.
   Neutralize on screens where the issue is most visible.
   ============================================================ */
@media (max-width:880px){
  h1, h2, h3, h4, .h1, .h2, .h3 {
    letter-spacing: 0 !important;
    word-spacing: .02em;
  }
  /* Hero h1 needs a little air around long Cyrillic compounds */
  h1 { line-height: 1.05; }
  /* Body copy: kill any subtle negative tracking */
  p, li, .lede, .lead, .desc, .case-desc, .card-desc {
    letter-spacing: 0 !important;
  }
}

/* ============================================================
   MOBILE NAV OVERLAY (burger → fullscreen menu)
   ============================================================ */
.nav-overlay{
  position:fixed;inset:0;z-index:150;
  background:rgba(5,3,10,.96);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  display:flex;flex-direction:column;
  padding:80px var(--pad-x) 40px;
  transform:translateX(100%);
  transition:transform .35s var(--ease-ui);
  overflow-y:auto;
}
.nav-overlay.open{transform:translateX(0);}
.nav-overlay .nav-overlay-close{
  position:absolute;top:24px;right:var(--pad-x);
  width:40px;height:40px;
  background:rgba(155,93,229,.08);
  border:1px solid var(--line-2);border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:var(--milk);font-size:24px;line-height:1;
}
.nav-overlay nav{
  display:flex;flex-direction:column;gap:6px;margin-top:20px;
}
.nav-overlay nav a{
  font-family:'Unbounded',sans-serif;
  font-weight:600;font-size:22px;
  letter-spacing:0;
  color:var(--milk);
  padding:18px 0;
  border-bottom:1px solid var(--line);
  display:flex;justify-content:space-between;align-items:center;
}
.nav-overlay nav a::after{content:"→";color:var(--violet-bright);font-weight:400;}
.nav-overlay nav a:hover,.nav-overlay nav a:active{color:var(--violet-bright);}
.nav-overlay .cta-row{
  margin-top:auto;padding-top:30px;
  display:flex;flex-direction:column;gap:14px;
}
.nav-overlay .cta-row .btn{justify-content:center;}
body.nav-open{overflow:hidden;}

/* ============================================================
   MOBILE NAV LAYOUT FIX (≤640px)
   At narrow widths the lang-toggle + CTA + burger overflow the
   viewport. Hide non-essentials, keep logo + burger only.
   ============================================================ */
@media (max-width:640px){
  .nav{padding:14px 16px;}
  .nav .lang-toggle,
  .nav .nav-cta{display:none;}
  .nav-logo .wordmark{font-size:14px;letter-spacing:.18em;}
  .nav-logo .crumb{display:none;}
  .nav-burger{margin-left:auto;}
}
@media (max-width:380px){
  .nav-logo .wordmark{display:none;}
}