/* styles.css — Fullservicios (paleta: #0b3b53, #facc15, #10b981) */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');

:root{
  --brand-blue:#0b3b53;
  --brand-gold:#facc15;
  --brand-green:#10b981;
  --muted:#6b7280;
  --bg:#f8fafc;
  --card:#ffffff;
  --maxw:1100px;
}

*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Poppins',sans-serif;background:var(--bg);color:#1f2937;line-height:1.6}
.container{max-width:var(--maxw);margin:0 auto;padding:18px}

/* Header */
.site-header{background:var(--brand-blue);color:#fff;padding:14px 18px;position:sticky;top:0;z-index:50}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px}
.site-logo{height:64px; width:auto; display:block; transition:transform .25s ease; filter: drop-shadow(0 6px 18px rgba(11,59,83,0.25));}
.site-logo:hover{transform:scale(1.03)}
.main-nav a{color:#fff;text-decoration:none;margin-left:14px;font-weight:600;transition:color .18s}
.main-nav a:hover{color:var(--brand-gold)}
@media(max-width:820px){.main-nav{display:none} /* keep simple: mobile menu can be added later */}

/* Hero (logo destacado) */
.hero{background:linear-gradient(180deg,#e6f4f1, #ffffff);text-align:center;padding:56px 20px}
.hero-logo{display:flex;flex-direction:column;align-items:center;gap:14px;margin-bottom:18px}
.hero-logo img{width:200px;max-width:48vw;border-radius:10px;animation:pulse 2.6s ease-in-out infinite alternate;filter:drop-shadow(0 10px 30px rgba(11,59,83,0.18))}
@keyframes pulse{from{transform:scale(1)}to{transform:scale(1.04)}}
.hero h1{color:var(--brand-blue);font-size:22px;max-width:900px;margin:0 auto}

/* Services 2x2 grid */
.features{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;padding:40px 20px;max-width:900px;margin:0 auto}
.feature-card{background:var(--card);padding:22px;border-radius:12px;box-shadow:0 6px 22px rgba(15,23,42,0.06);text-align:center;transition:transform .28s,box-shadow .28s}
.feature-card:hover{transform:translateY(-8px);box-shadow:0 14px 36px rgba(15,23,42,0.12)}
.feature-card .icon{font-size:42px;color:var(--brand-gold);margin-bottom:10px}
.feature-card h3{color:var(--brand-blue);margin-bottom:8px}
.feature-card p{color:var(--muted)}

/* compromiso */
.compromiso{background:#f3f6f8;padding:46px 20px;margin-top:18px;text-align:center}
.compromiso h2{color:var(--brand-blue);margin-bottom:12px}
.compromiso p{max-width:880px;margin:0 auto;color:var(--muted)}

/* clientes + testimonios */
.clients-section{padding:46px 20px}
.clients-grid{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;align-items:center}
.clients-grid img{height:72px;object-fit:contain;border-radius:8px;background:#fff;padding:8px;box-shadow:0 4px 10px rgba(0,0,0,0.04)}
.testimonials{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:22px}
.testimonial{background:#fff;border-radius:12px;padding:18px;box-shadow:0 6px 20px rgba(0,0,0,0.04)}
.testimonial .stars{color:var(--brand-gold);margin-bottom:8px;font-size:16px}
.testimonial p{color:#334155;font-size:14px}

/* values / team */
.valores-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:18px}
.valor-card{background:#fff;padding:16px;border-radius:10px;box-shadow:0 6px 18px rgba(2,6,23,0.04);text-align:center}
.valor-card i{font-size:28px;color:var(--brand-blue);margin-bottom:8px}

/* Contact */
.contact-wrap{display:grid;grid-template-columns:1fr 360px;gap:24px;max-width:1000px;margin:0 auto;padding:30px 18px}
@media(max-width:900px){.contact-wrap{grid-template-columns:1fr}}
.contact-card{background:#fff;padding:18px;border-radius:12px;box-shadow:0 6px 20px rgba(0,0,0,0.04)}
.contact-card label{display:block;margin-bottom:8px;color:var(--muted);font-size:14px}
.contact-card input,.contact-card textarea,.contact-card select{width:100%;padding:10px;border:1px solid #e6eef2;border-radius:8px;margin-bottom:12px}
.btn{background:var(--brand-blue);color:#fff;padding:10px 14px;border-radius:8px;border:none;cursor:pointer;font-weight:600}
.btn-ghost{background:transparent;border:2px solid var(--brand-blue);color:var(--brand-blue)}

/* footer */
.site-footer{background:var(--brand-blue);color:#fff;padding:22px;text-align:center;margin-top:26px;font-size:14px}

/* small helpers */
.kicker{display:inline-block;padding:6px 10px;border-radius:999px;background:rgba(16,185,129,0.12);color:var(--brand-green);font-weight:700;margin-bottom:12px}
.lead{color:var(--muted);font-size:15px}

/* responsive tweaks */
@media(max-width:820px){
  .features{grid-template-columns:1fr}
  .site-logo{height:56px}
  header .header-inner{flex-direction:column;align-items:flex-start}
}