/* ======= Variables (aprox. paleta corporativa) ======= */
:root{
  --primary:#0a3d62;      /* Azul industrial */
  --accent:#e74c3c;       /* Rojo seguridad */
  --ink:#0b1521;
  --muted:#6b7b8c;
  --bg:#f6f8fb;
  --card:#ffffff;
  --ring: rgba(14, 99, 156, 0.25);
}

/* ======= Reset simple ======= */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{margin:0;padding-left:1rem}
h1,h2,h3,h4{margin:0 0 .5rem}

/* ======= Base ======= */
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.6;
}

.container{
  width:min(1100px, 92%);
  margin-inline:auto;
}

.section{
  padding: clamp(48px, 7vw, 96px) 0;
}

.section.alt{
  background: linear-gradient(180deg, #ffffff 0%, #f3f6fb 100%);
}

.section-header{
  text-align:center;
  margin-bottom:clamp(24px,4vw,40px);
}
.section-header h2{
  font-family: Montserrat, Inter, sans-serif;
  font-weight:800;
  font-size:clamp(28px, 4.5vw, 40px);
  color:var(--primary);
}
.section-header p{color:var(--muted)}

/* ======= Header / Nav ======= */
.site-header{
  position:sticky;top:0;z-index:20;
  background:#fff;
  border-bottom:1px solid #e9edf3;
}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0}
.brand{display:flex;align-items:center;gap:10px;font-family:Montserrat,sans-serif;font-weight:800;color:var(--primary)}
.brand span{letter-spacing:.5px}
.site-nav{display:flex;align-items:center;gap:20px}
.site-nav a{font-weight:600;color:#143044}
.site-nav .btn{margin-left:6px}
.nav-toggle{display:none;flex-direction:column;gap:4px;background:transparent;border:0}
.nav-toggle span{width:22px;height:2px;background:#143044;display:block;border-radius:2px}

/* ======= Buttons ======= */
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:.8rem 1.2rem;font-weight:700;border:2px solid transparent;transition:.2s}
.btn-primary{background:var(--primary);color:white}
.btn-primary:hover{filter:brightness(1.1)}
.btn-ghost{background:transparent;border-color:#d1d9e6;color:#143044}
.btn-ghost:hover{background:#eef3f9}
.btn-accent{background:var(--accent);color:white}
.btn-accent:hover{filter:brightness(1.05)}

/* ======= Hero (Parallax) ======= */
.hero{
  position:relative;min-height:72vh;display:grid;place-items:center;
  color:white;
  background-image: linear-gradient(rgba(10,61,98,.65), rgba(10,61,98,.35)), url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width=\"1600\" height=\"900\"><rect width=\"100%\" height=\"100%\" fill=\"%230a3d62\"/><g fill=\"%23ffffff\" fill-opacity=\"0.05\"><circle cx=\"200\" cy=\"200\" r=\"120\"/><circle cx=\"500\" cy=\"320\" r=\"90\"/><circle cx=\"900\" cy=\"180\" r=\"140\"/></g></svg>');
  background-size:cover;background-attachment:fixed;background-position:center;
}
.hero .overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.25) 0%, rgba(0,0,0,.35) 60%, rgba(0,0,0,.4) 100%)}
.hero-content{position:relative;text-align:center}
.hero h1{font-family:Montserrat,sans-serif;font-size:clamp(30px,5.6vw,56px);line-height:1.1;margin-bottom:12px}
.hero p{font-size:clamp(15px,2.5vw,18px);opacity:.95;margin-bottom:22px}
.cta-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ======= Cards / Grid ======= */
.grid{display:grid;gap:18px}
.cards{grid-template-columns:repeat(6, 1fr)}
@media (max-width:1100px){.cards{grid-template-columns:repeat(3, 1fr)}}
@media (max-width:680px){.cards{grid-template-columns:1fr}}

.card{
  background:var(--card);padding:20px;border:1px solid #e6ecf4;border-radius:14px;
  box-shadow: 0 6px 24px rgba(12, 44, 76, .06);
  transition:.2s transform;
}
.card:hover{transform:translateY(-4px)}
.card h3{font-family:Montserrat,sans-serif;font-size:1.1rem;margin:8px 0;color:#0f2f4a}
.card p{color:var(--muted)}
.card .icon{width:44px;height:44px;border-radius:10px;background:#eef3f9;color:var(--primary);display:grid;place-items:center}
.card .icon svg{width:26px;height:26px}

/* ======= Two column ======= */
.two-col{display:grid;grid-template-columns: 1.2fr .8fr;gap:28px;align-items:start}
@media (max-width:900px){.two-col{grid-template-columns:1fr}}

/* ======= Divider Parallax ======= */
.divider{
  position:relative;min-height:44vh;display:grid;place-items:center;color:white;
  background-image: linear-gradient(rgba(231,76,60,.55), rgba(231,76,60,.35)), url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width=\"1600\" height=\"900\"><rect width=\"100%\" height=\"100%\" fill=\"%23e74c3c\"/><g fill=\"%23ffffff\" fill-opacity=\"0.06\"><rect x=\"100\" y=\"120\" width=\"260\" height=\"160\"/><rect x=\"600\" y=\"200\" width=\"260\" height=\"160\"/><rect x=\"1000\" y=\"80\" width=\"220\" height=\"140\"/></g></svg>');
  background-size:cover;background-attachment:fixed;background-position:center;
}
.divider .overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.35) 100%)}
.divider-title{font-family:Montserrat,sans-serif;font-size:clamp(22px,4vw,34px);position:relative}

/* ======= Bullets / Aside highlight ======= */
.bullets{color:#22384f}
.bullets li{margin:6px 0}
.highlight{
  background: #0b2136;
  color: #eaf2fb;
  padding:18px;border-radius:14px;border:1px solid #173a5a;
}
.highlight a{color:#fff;text-decoration:underline}

/* ======= Logos ======= */
.logos{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;align-items:center}
.logo{background:#ffffff;border:1px dashed #d7e0ec;border-radius:12px;padding:16px;text-align:center;font-weight:700;color:#1b3654}
@media (max-width:900px){.logos{grid-template-columns:repeat(2,1fr)}}

/* ======= Contacto ======= */
.contact .map-embed{aspect-ratio:16/10;border-radius:12px;overflow:hidden;border:1px solid #dbe4ef}
.contact-form{display:grid;gap:14px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:760px){.form-row{grid-template-columns:1fr}}
label{display:grid;gap:6px;font-weight:600;color:#1b3654}
input,select,textarea{
  padding:12px;border-radius:10px;border:1px solid #cfe0f3;background:#fff;color:#0b1521;font:inherit;
  outline:none;box-shadow:0 0 0 0 var(--ring);
}
input:focus,select:focus,textarea:focus{box-shadow:0 0 0 4px var(--ring)}

/* ======= Footer ======= */
.site-footer{background:#091725;color:#cfe0f3;margin-top:24px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:24px;padding:28px 0}
.brand-light{color:#cfe0f3}
.links-col ul, .contact-col ul{list-style:none;padding:0;margin:0}
.links-col li, .contact-col li{margin:8px 0}
.footer-bottom{border-top:1px solid #14304422;padding:12px 0;text-align:center;color:#9ab1cb}

/* ======= Mobile nav ======= */
@media (max-width:880px){
  .site-nav{position:fixed;inset:64px 16px auto 16px;background:#fff;border:1px solid #e2e9f4;border-radius:14px;box-shadow:0 18px 60px rgba(6, 29, 51, .12);padding:14px;flex-direction:column;align-items:stretch;gap:6px;display:none}
  .site-nav a{padding:12px;border-radius:10px}
  .site-nav a:hover{background:#f3f7fc}
  .nav-toggle{display:flex}
  body.menu-open .site-nav{display:flex}
}

/* ======= Misc ======= */
.center{text-align:center}


/* ======= Parallax image band (intermedia) ======= */
.parallax-image.band{
  position:relative;
  min-height:52vh;
  display:grid;
  place-items:center;
  color:#fff;
  background-image:
    linear-gradient(rgba(11,33,54,.55), rgba(11,33,54,.55)),
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="1800" height="1000"><defs><linearGradient id="lg" x1="0" y1="0" x2="1" y2="1"><stop offset="0" stop-color="%230a3d62"/><stop offset="1" stop-color="%23184670"/></linearGradient></defs><rect width="100%" height="100%" fill="url(%23lg)"/><g fill="%23ffffff" fill-opacity="0.07"><path d="M200 800 L450 200 L700 800 Z"/><path d="M900 820 L1100 220 L1300 820 Z"/></g><g stroke="%23ffffff" stroke-opacity="0.15" stroke-width="6"><circle cx="300" cy="500" r="160"/><circle cx="1180" cy="420" r="120"/></g></svg>');
  background-size:cover;
  background-position:center;
  background-attachment:fixed;
  text-align:center;
}
.band .overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.1) 0%, rgba(0,0,0,.35) 100%)}
.band-title{font-family:Montserrat,sans-serif;font-size:clamp(24px,4.6vw,40px);position:relative}
.band-sub{position:relative;opacity:.95}

/* ======= Horizontal scroll gallery ======= */
.hscroll{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:min(78vw, 520px);
  gap:16px;
  overflow-x:auto;
  padding-bottom:6px;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling: touch;
}
.hscroll::-webkit-scrollbar{height:10px}
.hscroll::-webkit-scrollbar-thumb{background:#c6d6ea;border-radius:999px}
.hscroll::-webkit-scrollbar-track{background:#eef3f9;border-radius:999px}
.shot{
  background:#fff;
  border:1px solid #e2e9f4;
  border-radius:16px;
  overflow:hidden;
  scroll-snap-align:start;
  box-shadow:0 10px 30px rgba(9, 23, 37, .12);
}
.shot img{
  display:block;
  width:100%;
  height:340px;
  object-fit:cover;
}