:root{
  --bg:#252525;
  --muted:#585858;
  --light:#e6e6e6;
  --accent:#3f3f3f;
  --white:#ffffff;
}

*{box-sizing:border-box}
body{margin:0;font-family:Inter, system-ui, Arial, sans-serif;background:var(--white);color:#111;}
.container{max-width:1100px;margin:0 auto;padding:2rem;}
.nav{background:transparent;padding:1rem 0;position:sticky;top:0;z-index:50}
.nav-inner{display:flex;align-items:center;justify-content:space-between;}
.logo{height:44px}
nav a{margin:0 12px;color:#333;text-decoration:none}
#lang-toggle{background:none;border:1px solid #ccc;padding:.4rem .6rem;border-radius:6px}

/* Hero */
.hero{padding:4rem 0;display:flex;align-items:center;}
.hero-inner{display:flex;gap:2rem;align-items:center;justify-content:space-between;}
.hero h1{font-size:2.2rem;margin:0;color:var(--accent)}
.hero p{color:var(--muted);margin:1rem 0 1.5rem;max-width:540px}
.hero-image img{width:220px;opacity:.95}

/* CTA */
.btn{padding:.7rem 1rem;border-radius:8px;text-decoration:none;display:inline-block;font-weight:600;transition:transform .2s ease-in-out}
.primary{background:var(--accent);color:var(--white)}
.outline{background:transparent;border:1px solid var(--accent);color:var(--accent)}
.btn:hover{transform:scale(1.05)} /* efecto hover */

/* Benefits */
.benefits{padding:2.5rem 0}
.benefits-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}
.benefit{background:#fff;border-radius:10px;padding:1.2rem;box-shadow:0 6px 18px rgba(0,0,0,.06);transition:transform .2s ease-in-out}
.benefit:hover{transform:scale(1.05)} /* efecto hover */

/* Services */
.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;padding:1rem 0}
.services-grid article{background:#fff;border-radius:10px;padding:1.2rem;box-shadow:0 6px 18px rgba(0,0,0,.06);transition:transform .2s ease-in-out}
.services-grid article:hover{transform:scale(1.05)} /* efecto hover */

/* Contact form */
.contact form{max-width:720px;background:#f6f6f6;padding:1rem;border-radius:8px}
.row{display:flex;gap:1rem}
input,textarea{width:100%;padding:.8rem;border:1px solid #ddd;border-radius:6px}
.form-actions{display:flex;gap:.6rem;margin-top:.6rem;align-items:center}
.form-note{color:var(--muted);margin-top:.6rem}

/* Footer */
.footer{display:flex;justify-content:space-between;padding:2rem 0;border-top:1px solid #eee;margin-top:2rem}
.logo-small{height:36px}
.icon{height:20px;margin-right:6px;vertical-align:middle}
@media(max-width:900px){
  .hero-inner{flex-direction:column;text-align:center}
  .benefits-grid{grid-template-columns:1fr}
  .services-grid{grid-template-columns:1fr}
  .row{flex-direction:column}
}