/* ── TEMA 1: DARK TECH ─────────────────────────────────────────── */
:root {
  --green: #3fb950;
  --green-light: #56d364;
  --green-pale: rgba(63,185,80,.12);
  --text: #e6edf3;
  --text-light: #8b949e;
  --border: rgba(255,255,255,.1);
  --max-w: 860px;
}
body { background: #0d1117; color: var(--text); }

/* Nav */
.main-nav { background: #161b22; border-bottom: 1px solid rgba(255,255,255,.08); box-shadow: none; }
.brand { color: var(--text); }
.nav-links li a { color: #8b949e; }
.nav-links li a:hover, .nav-links li a.active { color: var(--green); background: rgba(63,185,80,.1); }
.nav-toggle { color: var(--text); }
@media(max-width:600px){
  .nav-links { background: #161b22; border-bottom-color: rgba(255,255,255,.08); }
}

/* Hero */
.hero {
  background: #0d1117;
  border-bottom: 1px solid rgba(63,185,80,.2);
  position: relative;
  overflow: hidden;
}
.hero::before {
  content: '';
  position: absolute;
  top: -150px; left: 50%;
  transform: translateX(-50%);
  width: 700px; height: 500px;
  background: radial-gradient(ellipse at center, rgba(63,185,80,.18) 0%, transparent 65%);
  pointer-events: none;
}
.hero-inner { position: relative; z-index: 1; }
.hero h1 { color: #e6edf3; }
.hero-brand-light { color: var(--green); }
.hero-label { color: rgba(255,255,255,.5); }
.hero-sub { color: rgba(255,255,255,.75); }

/* Buttons */
.btn-hero-primary { background: var(--green); color: #0d1117; font-weight: 700; }
.btn-hero-primary:hover { background: var(--green-light); color: #0d1117; transform: translateY(-2px); }
.btn-hero-secondary { border-color: rgba(255,255,255,.3); color: rgba(255,255,255,.8); }
.btn-hero-secondary:hover { border-color: var(--green); background: rgba(63,185,80,.1); color: var(--green); }

/* Value strip */
.value-strip { background: #161b22; border-color: rgba(255,255,255,.08); }
.value-item { color: #8b949e; }
.value-item .value-icon { color: var(--green); }
.value-item span:last-child { color: rgba(255,255,255,.75); }

/* Section */
.section-title { color: var(--text); }
.section-sub { color: #8b949e; }
h1 { color: var(--text); }
h2 { color: var(--text); }
h3 { color: var(--green); }

/* Service cards */
.service-card {
  background: #161b22;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
}
.service-card:hover {
  border-color: var(--green);
  box-shadow: 0 0 20px rgba(63,185,80,.12), 0 4px 20px rgba(0,0,0,.3);
  transform: translateY(-3px);
}
.service-card h3 { color: var(--green); }
.service-card p { color: #8b949e; }
.service-card ul li { color: rgba(255,255,255,.75); }

/* Methodology */
.methodology-section { background: #161b22; border-color: rgba(255,255,255,.06); }
.methodology-section .section-title { color: var(--text); }
.methodology-section .section-sub { color: #8b949e; }
.method-step { background: #0d1117; border-color: rgba(255,255,255,.08); }
.method-step:hover { border-color: var(--green); }
.step-num { color: transparent; -webkit-text-stroke: 2px rgba(63,185,80,.3); }
.method-step h4 { color: var(--green); }
.method-step p { color: #8b949e; }
.method-arrow { color: rgba(63,185,80,.5); }

/* CTA */
.cta-section { background: #161b22; border-top: 1px solid rgba(63,185,80,.2); margin-top: 0; }
.cta-section h2 { color: var(--text); }
.cta-section p { color: #8b949e; }
.cta-section .btn-hero-primary { background: var(--green); color: #0d1117; }

/* Footer */
footer { background: #010409; border-top: 1px solid rgba(255,255,255,.06); color: #8b949e; margin-top: 0; }
footer a { color: var(--green); }

/* Page / post */
.page-title { color: var(--text); border-bottom-color: rgba(255,255,255,.08); }
.post-card { background: #161b22; border-color: rgba(255,255,255,.08); color: var(--text); }
.post-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.4); border-color: var(--green); }
.post-card h2 { color: var(--green); }
.post-card p { color: #8b949e; }
blockquote { border-left-color: var(--green); color: #8b949e; }
a { color: var(--green); }
a:hover { color: var(--green-light); }

/* Contact */
.form-group input, .form-group textarea {
  background: #161b22;
  border-color: rgba(255,255,255,.12);
  color: var(--text);
}
.form-group input:focus, .form-group textarea:focus {
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgba(63,185,80,.15);
  background: #161b22;
}
.form-group label { color: rgba(255,255,255,.75); }
.btn-submit { background: var(--green); color: #0d1117; font-weight: 700; }
.btn-submit:hover:not(:disabled) { background: var(--green-light); }

/* ── WIDGET FLOTANTE CONTACTO ─────────────────────────────────── */
.float-cta {
  position: fixed;
  bottom: 1.5rem;
  left: 1.5rem;
  z-index: 999;
}
.float-cta-card {
  display: flex;
  align-items: center;
  gap: .8rem;
  background: #161b22;
  border: 1px solid rgba(63,185,80,.35);
  border-radius: 50px;
  padding: .6rem 1.2rem .6rem .6rem;
  text-decoration: none;
  box-shadow: 0 4px 24px rgba(0,0,0,.5);
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
.float-cta-card:hover {
  border-color: var(--green);
  box-shadow: 0 6px 28px rgba(63,185,80,.22);
  transform: translateY(-2px);
}
.float-cta-icon {
  width: 2.4rem;
  height: 2.4rem;
  background: var(--green);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
  color: #0d1117;
}
.float-cta-text {
  display: flex;
  flex-direction: column;
  line-height: 1.3;
}
.float-cta-text strong {
  color: #e6edf3;
  font-size: .88rem;
  font-weight: 600;
}
.float-cta-text span {
  color: #8b949e;
  font-size: .75rem;
}
@media (max-width: 480px) {
  .float-cta { bottom: 1rem; left: 1rem; }
  .float-cta-text span { display: none; }
}