
@font-face {
  font-family: 'Versa';
  src: url('versa.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}
:root {
  --map-bg: url("mapa.png");
  --red: #E30613;
  --white: #fff;
  --off-white: #ccc;
  --gray: #777;
  --border: rgba(255,255,255,0.07);
  --border-red: rgba(227,6,19,0.25);
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Rajdhani',sans-serif; background:#000; color:#fff; overflow-x:hidden; }

nav::before {
  content:'';
  position:absolute; inset:0;
  background-image:var(--map-bg);
  background-size:cover;
  background-position:center top;
  mix-blend-mode:screen;
  opacity:0.2;
  z-index:0;
  pointer-events:none;
}
nav > * { position:relative; z-index:1; }

.versa { font-family:'Versa','Rajdhani',sans-serif; }


/* ===== LANGUAGE TOGGLE ===== */
.lang-toggle {
  font-family:'Versa',sans-serif;
  font-size:11px; letter-spacing:0.18em;
  color:rgba(255,255,255,0.5);
  background:transparent; border:0.5px solid rgba(255,255,255,0.15);
  padding:6px 14px; cursor:pointer;
  transition:all 0.2s; white-space:nowrap;
}
.lang-toggle:hover { border-color:var(--red); color:#fff; }

/* ===== NAV ===== */
nav {
  position:fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 64px; height:68px;
  background:rgba(0,0,0,0.92);
  border-bottom:0.5px solid var(--border);
  backdrop-filter:blur(16px);
  overflow:hidden;
}
.nav-logo { display:flex; align-items:center; text-decoration:none; flex-shrink:0; }
.nav-wordmark {
  font-family:'Versa',sans-serif;
  font-size:15px; letter-spacing:0.18em; font-weight:normal;
  color:#fff; text-transform:uppercase; white-space:nowrap;
}
.nav-wordmark .red { color:var(--red); }
.nav-links { display:flex; align-items:center; gap:40px; list-style:none; }
.nav-links a {
  font-family:'Rajdhani',sans-serif; font-size:13px; font-weight:500;
  letter-spacing:0.18em; text-transform:uppercase; color:var(--off-white);
  text-decoration:none; transition:color 0.2s;
}
.nav-links a:hover { color:var(--red); }
.nav-cta {
  font-family:'Versa',sans-serif; font-size:11px; letter-spacing:0.15em;
  text-transform:uppercase; color:#fff; text-decoration:none;
  border:1px solid var(--red); padding:9px 24px; transition:all 0.2s; white-space:nowrap;
}
.nav-cta:hover { background:var(--red); }

/* Burger */
.burger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:8px; z-index:300; background:none; border:none; }
.burger span { display:block; width:24px; height:1.5px; background:#fff; transition:all 0.3s; }
.burger.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
.burger.open span:nth-child(2) { opacity:0; }
.burger.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }

/* Full-screen mobile menu */
.mobile-menu {
  display:none; position:fixed; inset:0; z-index:150;
  background:#000; flex-direction:column;
  align-items:center; justify-content:center; gap:0;
  padding:80px 40px 60px;
}
.mobile-menu.open { display:flex; }
.mobile-menu ul { list-style:none; text-align:center; width:100%; }
.mobile-menu ul li { border-bottom:0.5px solid var(--border); }
.mobile-menu ul li a {
  display:block; padding:22px 0;
  font-family:'Versa',sans-serif; font-size:22px; letter-spacing:0.15em;
  text-transform:uppercase; color:#fff; text-decoration:none; transition:color 0.2s;
}
.mobile-menu ul li a:hover { color:var(--red); }
.mobile-menu .mobile-cta {
  margin-top:48px;
  font-family:'Versa',sans-serif; font-size:13px; letter-spacing:0.15em;
  text-transform:uppercase; color:#fff; text-decoration:none;
  border:1px solid var(--red); padding:14px 40px; display:inline-block; transition:all 0.2s;
}
.mobile-menu .mobile-cta:hover { background:var(--red); }
.mobile-menu .mobile-hud {
  margin-top:40px;
  font-family:'Share Tech Mono',monospace; font-size:9px; letter-spacing:0.18em;
  color:rgba(227,6,19,0.35); text-transform:uppercase; text-align:center;
}

/* ===== HERO ===== */
.hero-map-tint {
  position:absolute; inset:0; z-index:0;
  background: transparent;
}
.hero-bg-img {
  position:absolute; inset:0;
  background:url("mapa.png") center center / cover no-repeat;
  opacity:1; z-index:0;
  mix-blend-mode: screen;
}

.hero {
  position:relative; width:100%; height:100vh; min-height:600px;
  display:flex; align-items:center; overflow:hidden; background:#000;
}
canvas#hud { position:absolute; inset:0; width:100%; height:100%; }
.hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to right, rgba(0,0,0,0.96) 0%, rgba(0,0,0,0.93) 34%, rgba(0,0,0,0.35) 56%, rgba(0,0,0,0.0) 100%);
  z-index:1;
}
.scanline {
  position:absolute; left:0; right:0; height:1px;
  background:rgba(227,6,19,0.1); z-index:2;
  animation:scan 7s linear infinite;
}
@keyframes scan { 0%{top:0;opacity:0} 8%{opacity:1} 92%{opacity:1} 100%{top:100%;opacity:0} }

.hero-hud-tr {
  position:absolute; top:86px; right:64px; z-index:2; text-align:right;
}
.hud-metric { margin-bottom:16px; }
.hud-label {
  font-family:'Share Tech Mono',monospace; font-size:9px; letter-spacing:0.22em;
  color:rgba(227,6,19,0.4); text-transform:uppercase; display:block; margin-bottom:2px;
}
.hud-value {
  font-family:'Share Tech Mono',monospace; font-size:22px;
  color:rgba(227,6,19,0.72); letter-spacing:0.04em;
}
.hud-small {
  font-family:'Share Tech Mono',monospace; font-size:9px;
  letter-spacing:0.14em; color:rgba(227,6,19,0.38); text-transform:uppercase; line-height:1.8;
}
.hero-hud-bl { position:absolute; bottom:44px; left:64px; z-index:2; }
.hero-hud-br { position:absolute; bottom:44px; right:64px; z-index:2; text-align:right; }

.hero-content { position:relative; z-index:2; padding:0 64px; max-width:680px; }
.hero-tag {
  display:inline-flex; align-items:center; gap:10px;
  font-family:'Share Tech Mono',monospace; font-size:10px; letter-spacing:0.22em;
  color:var(--red); text-transform:uppercase; margin-bottom:28px;
}
.hero-tag::before { content:''; display:inline-block; width:24px; height:1px; background:var(--red); }
.hero h1 {
  font-family:'Versa',sans-serif;
  font-size:clamp(36px,5.5vw,68px); font-weight:normal;
  line-height:1.06; letter-spacing:0.04em; text-transform:uppercase;
  margin-bottom:12px; color:#fff;
}
.hero h1 .red { color:var(--red); }
.hero-sub {
  font-family:'Share Tech Mono',monospace; font-size:11px; letter-spacing:0.18em;
  color:rgba(227,6,19,0.8); text-transform:uppercase; margin-bottom:22px;
}
.hero-desc {
  font-family:'Rajdhani',sans-serif; font-size:17px; font-weight:400;
  color:var(--off-white); line-height:1.7; max-width:500px; margin-bottom:44px;
}
.hero-actions { display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.btn-primary {
  font-family:'Versa',sans-serif; font-size:11px; letter-spacing:0.18em;
  text-transform:uppercase; color:#fff; background:var(--red); border:none;
  padding:16px 38px; cursor:pointer; text-decoration:none; display:inline-block; 
  transition:background 0.2s; -webkit-appearance:none; appearance:none;
  font-size:11px; line-height:normal;
}
.btn-primary:hover { background:#bf0511; }
.btn-ghost {
  font-family:'Versa',sans-serif; font-size:11px; letter-spacing:0.18em;
  text-transform:uppercase; color:rgba(255,255,255,0.6); background:transparent;
  border:1px solid rgba(255,255,255,0.18); padding:16px 38px; cursor:pointer;
  text-decoration:none; display:inline-block; transition:all 0.2s;
}
.btn-ghost:hover { border-color:var(--red); color:var(--red); }

/* ===== TICKER ===== */
.ticker {
  background:rgba(227,6,19,0.04); border-top:0.5px solid var(--border-red);
  border-bottom:0.5px solid var(--border-red); padding:11px 0; overflow:hidden; white-space:nowrap;
}
.ticker-inner { display:inline-block; animation:roll 30s linear infinite; }
.ticker-inner span {
  font-family:'Share Tech Mono',monospace; font-size:10px; letter-spacing:0.22em;
  color:rgba(227,6,19,0.55); padding:0 48px; text-transform:uppercase;
}
.ticker-inner span::before { content:'// '; color:rgba(227,6,19,0.25); }
@keyframes roll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ===== SECTIONS ===== */
section { padding:110px 64px; scroll-margin-top:68px; }
.eyebrow { display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.eyebrow-line { width:28px; height:1px; background:#FF0A1A; flex-shrink:0; box-shadow: 0 0 6px rgba(255,10,26,0.8); }
.eyebrow-text { font-family:'Share Tech Mono',monospace; font-size:10px; letter-spacing:0.25em; color:#FF0A1A; text-transform:uppercase; text-shadow: 0 0 8px rgba(227,6,19,0.8); }
.section-title { font-family:'Versa',sans-serif; font-size:clamp(28px,3.8vw,50px); font-weight:normal; line-height:1.08; letter-spacing:0.04em; text-transform:uppercase; color:#fff; margin-bottom:20px; }
.section-title .red { color:var(--red); }
.section-lead { font-family:'Rajdhani',sans-serif; font-size:17px; font-weight:400; color:var(--off-white); line-height:1.7; max-width:560px; }

/* ===== SERVICES ===== */
.services { background:#000; border-top:0.5px solid var(--border); }
.services-head { margin-bottom:56px; }
.services-grid {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:1px; background:rgba(255,255,255,0.05); border:0.5px solid var(--border);
}
.svc-card { background:#000; padding:40px 28px; position:relative; overflow:hidden; transition:background 0.3s; }
.svc-card::after { content:''; position:absolute; top:0; left:0; width:2px; height:0; background:var(--red); transition:height 0.4s ease; }
.svc-card:hover::after { height:100%; }
.svc-card:hover { background:rgba(227,6,19,0.03); }
.svc-num { font-family:'Share Tech Mono',monospace; font-size:10px; letter-spacing:0.2em; color:#FF0A1A; margin-bottom:32px; display:block; text-shadow: 0 0 6px rgba(255,10,26,0.7); }
.svc-icon { width:38px; height:38px; color:var(--red); margin-bottom:20px; }
.svc-name { font-family:'Versa',sans-serif; font-size:14px; letter-spacing:0.06em; text-transform:uppercase; font-weight:normal; color:#fff; margin-bottom:10px; line-height:1.3; }
.svc-desc { font-family:'Rajdhani',sans-serif; font-size:14px; font-weight:400; color:var(--gray); line-height:1.65; }

/* ===== WHY ===== */
.why { background:#050505; border-top:0.5px solid var(--border); }
.why-layout { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start; }
.stats-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(255,255,255,0.05); border:0.5px solid var(--border); margin-top:48px; }
.stat-cell { background:#050505; padding:26px 20px; }
.stat-num { font-family:'Versa',sans-serif; font-size:34px; font-weight:normal; color:var(--red); line-height:1; margin-bottom:6px; letter-spacing:0.03em; }
.stat-lbl { font-family:'Rajdhani',sans-serif; font-size:12px; font-weight:500; letter-spacing:0.12em; text-transform:uppercase; color:var(--gray); }
.diff-item { display:flex; gap:20px; padding:24px 0; border-bottom:0.5px solid var(--border); }
.diff-item:first-child { border-top:0.5px solid var(--border); }
.diff-idx { font-family:'Share Tech Mono',monospace; font-size:10px; letter-spacing:0.18em; color:#FF0A1A; flex-shrink:0; width:24px; padding-top:3px; text-shadow: 0 0 6px rgba(255,10,26,0.7); }
.diff-title { font-family:'Versa',sans-serif; font-size:13px; letter-spacing:0.07em; text-transform:uppercase; font-weight:normal; color:#fff; margin-bottom:6px; }
.diff-body { font-family:'Rajdhani',sans-serif; font-size:14px; font-weight:400; color:var(--gray); line-height:1.65; }

/* ===== CONTACT ===== */
.contact { background:#000; border-top:0.5px solid var(--border); }
.contact-layout { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start; }
.ci-item { display:flex; align-items:center; gap:14px; padding:18px 0; border-bottom:0.5px solid var(--border); }
.ci-item:first-child { border-top:0.5px solid var(--border); }
.ci-icon { width:32px; height:32px; border:0.5px solid var(--border-red); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ci-icon svg { width:14px; height:14px; stroke:var(--red); fill:none; stroke-width:1.5; }
.ci-label { font-family:'Share Tech Mono',monospace; font-size:9px; letter-spacing:0.2em; color:var(--gray); text-transform:uppercase; display:block; margin-bottom:2px; }
.ci-val { font-family:'Rajdhani',sans-serif; font-size:15px; font-weight:500; color:#fff; }
.form { display:flex; flex-direction:column; gap:14px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.form-group { display:flex; flex-direction:column; gap:6px; }
.form-group label { font-family:'Share Tech Mono',monospace; font-size:9px; letter-spacing:0.2em; text-transform:uppercase; color:rgba(255,255,255,0.3); }
.form-group input, .form-group select, .form-group textarea {
  background:#080808; border:0.5px solid rgba(255,255,255,0.1); color:#fff;
  font-family:'Rajdhani',sans-serif; font-size:15px; padding:12px 14px;
  outline:none; border-radius:0; -webkit-appearance:none; transition:border-color 0.2s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color:var(--red); }
.form-group select option { background:#0a0a0a; }
.form-group textarea { height:110px; resize:none; }
.form-footer { display:flex; align-items:center; gap:20px; margin-top:6px; flex-wrap:wrap; }
.form-note { font-family:'Share Tech Mono',monospace; font-size:9px; letter-spacing:0.08em; color:rgba(255,255,255,0.2); }

/* ===== FOOTER ===== */
footer { border-top:0.5px solid var(--border); padding:28px 64px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.footer-wordmark { font-family:'Versa',sans-serif; font-size:13px; letter-spacing:0.2em; text-transform:uppercase; font-weight:normal; color:#fff; white-space:nowrap; }
.footer-wordmark .red { color:var(--red); }
.footer-copy { font-family:'Share Tech Mono',monospace; font-size:10px; letter-spacing:0.08em; color:rgba(255,255,255,0.2); }
.footer-links { display:flex; gap:28px; list-style:none; }
.footer-links a { font-family:'Rajdhani',sans-serif; font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:rgba(255,255,255,0.28); text-decoration:none; transition:color 0.2s; }
.footer-links a:hover { color:var(--red); }

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
  nav { padding:0 36px; }
  section { padding:80px 36px; }
  .hero-content { padding:0 36px; }
  .hero-hud-tr { display:none; }
  .hero-hud-bl, .hero-hud-br { display:none; }
  .services-grid { grid-template-columns:repeat(2,1fr); }
  .why-layout { grid-template-columns:1fr; gap:48px; }
  .contact-layout { grid-template-columns:1fr; gap:48px; }
  footer { padding:28px 36px; }
}

@media (max-width: 768px) {
  .hero h1 { word-break: break-word; hyphens: auto; }
  nav { padding:0 20px; height:60px; }
  .nav-links { display:none; }
  .nav-cta { display:none; }
  .burger { display:flex; }
  .nav-wordmark { font-size:13px; letter-spacing:0.14em; }

  section { padding:64px 20px; }
  .hero-content { padding:0 20px; max-width:100%; }
  .hero-overlay { background:linear-gradient(to bottom, rgba(0,0,0,0.88) 60%, rgba(0,0,0,0.7) 100%); }
  .hero h1 { font-size:clamp(30px,8vw,48px); }
  .hero-desc { font-size:15px; max-width:100%; }
  .hero-actions { flex-direction:column; align-items:flex-start; }
  .btn-primary, .btn-ghost { width:100%; text-align:center; padding:16px 0; }

  .services-grid { grid-template-columns:1fr; }
  .svc-card { padding:32px 24px; }

  .stats-grid { grid-template-columns:1fr 1fr; }

  .form-row { grid-template-columns:1fr; }

  footer { padding:24px 20px; flex-direction:column; align-items:flex-start; gap:14px; }
  .footer-links { gap:20px; }

  .hero-hud-tr, .hero-hud-bl, .hero-hud-br { display:none; }
}

@media (max-width: 480px) {
  .nav-wordmark { font-size:12px; letter-spacing:0.1em; }
  .hero h1 { font-size:clamp(26px,9vw,40px); }
  .section-title { font-size:clamp(24px,7vw,36px); }
}
