/* NovaWorks — Paleta y estilos base */
:root{
  --nw-bg: #0B1220;        /* fondo oscuro */
  --nw-surface: #0E1628;   /* superficie/cards */
  --nw-indigo: #6366F1;    /* acento índigo */
  --nw-purple: #7C3AED;    /* acento púrpura */
  --nw-gold: #F59E0B;      /* acento dorado */
  --nw-gold-2: #FACC15;    /* dorado claro */
  --nw-text: #E5E7EB;      /* texto claro */
  --nw-muted: #94A3B8;     /* texto secundario */
  --nw-border: rgba(255,255,255,0.08);
}

*{ box-sizing: border-box; }
html, body{
  margin:0; padding:0;
  font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--nw-text);
  background: var(--nw-bg);
  scroll-behavior: smooth;
}

/* Utilidades */
.nw-container{ width:100%; max-width:1200px; margin:0 auto; padding:0 1.25rem; }
.nw-section{ padding:4rem 0; }
.nw-muted{ color: var(--nw-muted); }
.nw-list{ margin:1rem 0; padding-left:1.25rem; }
.nw-list li{ margin: .35rem 0; }

/* Botones */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:.5rem; padding:.8rem 1.25rem;
  border-radius:14px; border:1px solid transparent;
  cursor:pointer; text-decoration:none; font-weight:600;
  transition: transform .05s ease, filter .2s ease, background .2s ease;
}
.btn:active{ transform: translateY(1px); }
.btn-primary{
  background: var(--nw-gold); color:#0B1220;
}
.btn-primary:hover{ background: var(--nw-gold-2); }
.btn-ghost{
  background: rgba(255,255,255,.06); color: var(--nw-text);
  border-color: var(--nw-border);
}
.btn-ghost:hover{ background: rgba(255,255,255,.1); }

/* Header / Nav */
.nw-header{
  position:sticky; top:0; z-index:10;
  background: rgba(11,18,32, .6);
  backdrop-filter: blur(8px);
  border-bottom:1px solid var(--nw-border);
}
.nw-nav{ display:flex; align-items:center; justify-content:space-between; padding:.9rem 0; }
.nw-brand{ display:flex; align-items:center; gap:.6rem; }
.nw-brand-name{ font-weight:600; letter-spacing:.2px; }
.nw-logo{ width:32px; height:32px; border-radius:8px; }
.nw-burger{
  display:none; position:relative; width:38px; height:38px;
  background: transparent; border:1px solid var(--nw-border); border-radius:10px;
}
.nw-burger span{
  position:absolute; left:8px; right:8px; height:2px; background: var(--nw-text);
}
.nw-burger span:nth-child(1){ top:11px; }
.nw-burger span:nth-child(2){ top:18px; }
.nw-burger span:nth-child(3){ top:25px; }

.nw-menu{ display:flex; gap:1rem; }
.nw-menu a{
  color:var(--nw-muted); text-decoration:none; padding:.6rem .8rem; border-radius:10px;
}
.nw-menu a:hover{ color:var(--nw-text); background: rgba(255,255,255,.06); }

/* Hero */
.nw-hero{
  position:relative; overflow:hidden;
  padding: 5rem 0 4rem;
  background:
    radial-gradient(60% 60% at 70% -10%, rgba(124,58,237,.20), transparent 60%),
    radial-gradient(50% 50% at -10% 10%, rgba(99,102,241,.14), transparent 60%);
}
.nw-hero h1{
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 1.1; margin: .2rem 0 .6rem;
}
.nw-hero p{
  color:var(--nw-muted);
  max-width: 720px;
}
.nw-hero .nw-cta{ margin-top:1.4rem; display:flex; gap:.75rem; flex-wrap:wrap; }


/* Cards & grid */
.nw-card{
  background: rgba(255,255,255,.04);
  border:1px solid var(--nw-border);
  border-radius: 18px;
  padding: 1.25rem;
  display:flex; flex-direction:column; gap:1rem;
}
.nw-grid{
  display:grid; gap:1rem;
  grid-template-columns: repeat(12, 1fr);
}
.nw-project{ grid-column: span 12; }
@media (min-width: 720px){
  .nw-project{ grid-column: span 4; }
}
.nw-project .nw-project-badge{
  display:inline-block; font-size:.7rem; letter-spacing:.4px;
  padding:.25rem .5rem; border-radius:999px;
  background: rgba(245,158,11,.15); color: var(--nw-gold);
  border: 1px solid rgba(245,158,11,.35);
  margin-bottom:.5rem;
}
.nw-badge-soon{ background: rgba(124,58,237,.15); color:#C4B5FD; border-color: rgba(124,58,237,.35); }

.nw-card-actions{ display:flex; gap:.5rem; margin-top: .75rem; }

/* Hover flotante para cards */
.hover-float{ transition: transform 0.3s ease; }
.hover-float:hover{ transform: translateY(-6px); }

/* Fade-in al hacer scroll */
.fade { opacity: 0; transform: translateY(20px); transition: all 0.8s ease-out; }
.appear { opacity: 1; transform: translateY(0); }

/* Contacto */
.nw-contact{
  display:grid; gap:1rem; grid-template-columns: 1fr;
}
@media (min-width: 920px){
  .nw-contact{ grid-template-columns: 1fr 1fr; }
}
.nw-contact-list{
  display:grid; gap:.6rem; margin: .75rem 0 0; padding:0; list-style:none;
}
.nw-contact-list li{ display:flex; gap:.5rem; align-items:center; }
.nw-contact-list li span{ width:100px; color:var(--nw-muted); }

.nw-form .nw-field{ margin-bottom:.85rem; }
.nw-form label{ display:block; font-size:.9rem; margin-bottom:.35rem; color: var(--nw-text); }
.nw-form input, .nw-form textarea{
  width:100%; padding:.8rem .9rem; border-radius:12px;
  border:1px solid var(--nw-border); background: rgba(255,255,255,.06);
  color: var(--nw-text);
}
.nw-form input::placeholder, .nw-form textarea::placeholder{ color: #9aa5b1; }
.nw-form .nw-error{ display:block; color:#ffacac; font-size:.8rem; min-height:1rem; }

/* Footer */
.nw-footer{
  border-top:1px solid var(--nw-border);
  padding:1.25rem 0; text-align:center; color: var(--nw-muted);
}

/* Responsive nav */
@media (max-width: 880px){
  .nw-burger{ display:inline-flex; align-items:center; justify-content:center; }
  .nw-menu{
    position:absolute; top:64px; right:16px;
    flex-direction:column; gap:.5rem;
    background: rgba(11,18,32, .9); backdrop-filter: blur(8px);
    border:1px solid var(--nw-border); border-radius:14px;
    padding:.6rem; display:none;
  }
  .nw-menu.open{ display:flex; }
}

/* Extras: botones internos servicios/productos */
.nw-card a.btn{ align-self:start; margin-top:auto; transition: all 0.2s ease; }
.nw-card a.btn:hover{ transform: translateY(-2px) scale(1.02); }
