:root{--azul:#0E2C48;--oro:#B89A45;--gris:#F4F6F8;--txt:#1B1B1B}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;color:var(--txt);background:#fff}
a{color:var(--azul);text-decoration:none}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
/* Nav */
header{position:sticky;top:0;background:#fff;border-bottom:1px solid #e9eef2;z-index:50}
.nav{display:flex;justify-content:space-between;align-items:center;padding:12px 0}
.nav img{height:48px}
.nav-logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.nav-logo strong{color:var(--azul)}
.nav-links{display:flex;align-items:center;gap:16px}
.nav-links a{font-weight:600}
.nav-links a.active-link {
  color: var(--oro);
  border-bottom: 2px solid var(--oro);
  padding-bottom: 4px;
}
/* Botón de menú móvil (hamburguesa) */
.nav-toggle {
  display: none;
  background: none;
  border: none;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  color: var(--azul);
  z-index: 1001;
}
.nav-toggle .icon-close { display: none; }
.btn{display:inline-block;padding:12px 18px;border-radius:10px;font-weight:600;transition: filter 0.2s ease;}
.btn.primary{background:var(--azul);color:#fff;border:1px solid var(--azul)}
.btn.ghost{border:1px solid var(--azul);color:var(--azul)}
.btn:hover{filter:brightness(.96)}
/* Hero (Imagen de fondo) */
.hero{
  background-image: 
    linear-gradient(rgba(14, 44, 72, 0.85), rgba(23, 60, 96, 0.95)), 
    url('https://images.unsplash.com/photo-1589578236290-0b9e8790c068?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=MnwyMDUwMzZ8MHwxfHNlYXJjaHwxfHxsYXclMjBidWlsZGluZ3xlbnwwfHx8fDE2NzgwMTkzNzA&ixlib=rb-4.0.3&q=80&w=1920');
  background-size: cover;
  background-position: center center;
  color:#fff
}
.hero .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:center;padding:64px 20px}
h1{
  font-family:"Cormorant Garamond",serif;
  font-weight:600;
  letter-spacing:.5px;
  margin:0 0 10px;
  font-size:48px;
}
.chipset{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 24px}
.chip{padding:8px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);font-size:14px}
.hero-card{display:flex;gap:12px;align-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);padding:14px;border-radius:14px}
.hero-card img{width:56px;height:56px;object-fit:contain}
.hero-card .profile-pic{border-radius:10px}
/* Secciones */
section{padding:56px 0; overflow: hidden;}
h2{font-family:"Cormorant Garamond",serif;font-size:32px;color:var(--azul);margin:0 0 8px}
.sub{color:#5a6a77;margin:0 0 16px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{border:1px solid #e6ecf0;border-radius:14px;padding:18px;background:#fff}
.card h3{margin:0 0 6px;color:var(--azul);font-size:18px}
.profile{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.profile img{width:100%;max-width:340px;border-radius:14px;border:1px solid #e6ecf0}
.cta{background:var(--gris);border-top:1px solid #e6ecf0;border-bottom:1px solid #e6ecf0}
.cta .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;align-items:start}
.cta .legal{margin-top:10px;display:block}
.cta .card h3{margin-top:0}
.cta .card dl{margin:0}
.cta .card dt{font-weight:600;margin-top:8px}
.cta .card dd{margin-left:0;font-size:15px}
/* Formulario */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form-control{
  width:100%;
  padding:12px;
  border:1px solid #cfd8df;
  border-radius:10px;
  font-family:inherit;
  font-size:15px;
  -webkit-appearance:none;
}
textarea.form-control{resize:vertical;min-height:100px}
/* Footer */
footer{background:#0f2033;color:#dfe7ee;padding:26px 0}
.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.legal{font-size:12px;opacity:.9;line-height:1.6}
footer a{color:#dfe7ee;text-decoration:underline}
/* Clases de Utilidad */
.spacer-sm{height:8px}
.spacer-md{height:12px}
.ml-8{margin-left:8px}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
/* Clases de animación */
.fade-in-up {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}
.fade-in-up.visible {
  opacity: 1;
  transform: translateY(0);
}
/* Media Queries */
@media (max-width:900px){
  .hero .wrap,.profile,.cta .wrap,.footer-grid{grid-template-columns:1fr}
  .grid{grid-template-columns:1fr 1fr}
  .nav-toggle { display: block; }
  .nav-links {
    position: absolute;
    top: 73px;
    right: 0;
    background: #fff;
    width: 100%;
    border-bottom: 1px solid #e9eef2;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-10px);
    transition: all 0.3s ease-out;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
    gap: 15px;
  }
  .nav-links.active {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
  }
  .nav-links a { margin: 0; }
  .nav-links a.btn { width: 100%; text-align: center; }
  
  .nav-toggle[aria-expanded="true"] .icon-menu { display: none; }
  .nav-toggle[aria-expanded="true"] .icon-close { display: block; }
}
@media (max-width:620px){
  h1 {font-size: 38px;}
  .grid{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
}