/* LOREMAIR Landing — Blanco & Azul */
:root{
  --bg:#f7fbff;
  --bg-alt:#eaf3ff;
  --text:#0c2a4b;
  --brand:#0b6cfb;
  --brand-2:#0b49b8;
  --white:#ffffff;
  --shadow:0 10px 30px rgba(11,76,190,0.12);
  --radius:14px;
}

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

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

.site-header{
  position:sticky; top:0; z-index:50;
  background:var(--white);
  border-bottom:1px solid #e6eefb;
  backdrop-filter:saturate(180%) blur(6px);
}
.header-inner{display:flex; align-items:center; justify-content:space-between; gap:1rem; padding: .8rem 0}
.brand-logo{height:44px; display:block}
.nav a{margin-left:1rem; text-decoration:none; color:var(--text); font-weight:600}
.nav a:hover{color:var(--brand)}
.nav-toggle{display:none; background:none; border:0; font-size:1.4rem}

.hero{
  background:linear-gradient(180deg, var(--white) 0%, var(--bg) 100%);
  padding: clamp(2rem, 5vw, 4rem) 0;
}
.hero-inner{display:grid; grid-template-columns: 1.1fr .9fr; gap:2rem; align-items:center}
.hero-copy h1{font-size: clamp(2rem, 4.5vw, 3rem); line-height:1.1; letter-spacing:-0.3px}
.hero-copy p{margin-top: .9rem; font-size:1.05rem}
.cta-row{display:flex; gap:.75rem; margin-top:1.1rem}
.btn{display:inline-block; padding:.9rem 1.2rem; border-radius:999px; text-decoration:none; font-weight:700; border:2px solid transparent; text-align:center}
.btn.primary{background:var(--brand); color:var(--white)}
.btn.primary:hover{background:var(--brand-2)}
.btn.secondary{background:var(--white); color:var(--brand); border-color:var(--brand)}
.btn.secondary:hover{background:var(--bg-alt)}
.btn.ghost{background:transparent; color:var(--brand); border-color:var(--brand)}
.bullets{display:flex; gap:1rem; flex-wrap:wrap; margin-top:1rem; font-weight:600}
.bullets li{list-style:"✓ ";}

.hero-media img{width:100%; border-radius:var(--radius); box-shadow:var(--shadow); background:var(--white)}

.section{padding: clamp(2rem, 5vw, 4rem) 0}
.section.alt{background:var(--bg-alt)}

h2{font-size: clamp(1.6rem, 3vw, 2rem); margin-bottom:1rem}
.cards{display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap:1.3rem; margin-top:1rem}
.card{background:var(--white); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow)}
.card img{width:100%; display:block; aspect-ratio: 4/3; object-fit:cover}
.card-body{padding:1rem}
.card-body h3{margin-bottom:.4rem}
.card-body p{opacity:.9; margin-bottom:.9rem}

.grid-3{display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:1rem; margin-top:.7rem}
.benefit{background:var(--white); padding:1rem; border-radius:var(--radius); box-shadow:var(--shadow)}

.contact-wrap{display:grid; grid-template-columns: 1fr 1fr; gap:1.2rem; margin-top:.8rem}
.contact-form{background:var(--white); padding:1rem; border-radius:var(--radius); box-shadow:var(--shadow)}
.field{display:flex; flex-direction:column; gap:.35rem; margin-bottom:.8rem}
input, textarea{border:1.5px solid #d8e6ff; border-radius:10px; padding:.75rem .9rem; font:inherit; background:#fff}
input:focus, textarea:focus{outline:2px solid #cfe2ff; border-color:#b9d5ff}
.contact-aside{background:var(--white); padding:1rem; border-radius:var(--radius); box-shadow:var(--shadow)}
.contact-list{display:grid; gap:.4rem}
.contact-list a{color:var(--brand); text-decoration:none; font-weight:600}
.lead{opacity:.9}

.site-footer{background:#0c2a4b; color:#dbe8ff}
.footer-inner{display:flex; flex-direction:column; align-items:center; gap:.4rem; padding:1.4rem 0}
.footer-logo{height:36px; filter: brightness(0) invert(1)}
.socials{display:flex; gap:1rem}
.socials a{color:#cfe1ff; text-decoration:none}
.socials a:hover{color:#fff}

.whatsapp{
  position:fixed; right:16px; bottom:16px; z-index:60;
  background:#25D366; color:#fff; border-radius:999px; padding:.9rem 1.1rem;
  text-decoration:none; font-weight:800; box-shadow:0 8px 24px rgba(37,211,102,.35);
}
.whatsapp:hover{filter:brightness(0.95)}

@media (max-width: 900px){
  .hero-inner{grid-template-columns:1fr}
  .nav{display:none}
  .nav.is-open{display:flex; position:absolute; top:60px; right:4%; background:var(--white); padding:.6rem .8rem; border-radius:12px; box-shadow:var(--shadow); gap:.8rem; flex-direction:column}
  .nav-toggle{display:block}
  .contact-wrap{grid-template-columns:1fr}
}