:root{--navy:#14213d;--orange:#e4572e;--water:#2d9cdb;--soft:#f4f9fd;--text:#526173}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;background:#fff;color:var(--navy)}
a{text-decoration:none;color:inherit}
img{max-width:100%}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.header{position:fixed;top:0;left:0;right:0;z-index:10;background:rgba(255,255,255,.88);backdrop-filter:blur(14px);border-bottom:1px solid #e8eef5}
.nav{height:86px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand img{height:58px;width:auto;display:block}
.menu{display:flex;align-items:center;gap:22px;font-size:14px;font-weight:800;color:#536174}
.menu a:hover{color:var(--orange)}
.buy-link{background:var(--navy);color:#fff!important;padding:12px 18px;border-radius:999px}
.hero{padding:155px 0 90px;background:radial-gradient(circle at 10% 20%,rgba(45,156,219,.18),transparent 28%),radial-gradient(circle at 90% 10%,rgba(228,87,46,.16),transparent 25%),linear-gradient(180deg,#fff,#f3f9ff)}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}
.pill,.eyebrow,.section-title span{display:inline-block;font-size:12px;font-weight:900;letter-spacing:.22em;text-transform:uppercase;color:var(--orange)}
.pill{background:#fff;border:1px solid #dde8f2;border-radius:999px;padding:10px 16px;box-shadow:0 10px 30px rgba(20,33,61,.08);color:var(--navy);letter-spacing:0;text-transform:none}
h1{font-size:clamp(46px,7vw,82px);line-height:.95;letter-spacing:-.06em;margin:25px 0;color:var(--navy)}
h2{font-size:clamp(30px,4vw,52px);line-height:1;letter-spacing:-.04em;margin:10px 0 18px;color:var(--navy)}
h3{font-size:22px;margin:16px 0 10px;color:var(--navy)}
p{color:var(--text);line-height:1.7}
.hero-text p{font-size:19px;max-width:650px}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}
.btn{display:inline-block;border:0;border-radius:999px;padding:16px 24px;font-weight:950;cursor:pointer}
.primary{background:var(--orange);color:#fff;box-shadow:0 14px 35px rgba(228,87,46,.24)}
.secondary{background:#fff;color:var(--navy);border:1px solid #d3dee8}
.hero-card{background:rgba(255,255,255,.75);border:1px solid #fff;border-radius:42px;padding:18px;box-shadow:0 30px 80px rgba(20,33,61,.16)}
.hero-card img{border-radius:30px;display:block}
.section{padding:96px 0}
.soft{background:var(--soft)}
.section-title{text-align:center;max-width:780px;margin:0 auto 48px}
.section-title.light h2,.section-title.light p{color:#fff}
.cards{display:grid;gap:22px}
.three{grid-template-columns:repeat(3,1fr)}
.card,.cards article{background:#fff;border:1px solid #e7eef6;border-radius:30px;padding:26px;box-shadow:0 16px 42px rgba(20,33,61,.06)}
.product article img{aspect-ratio:1.18/1;object-fit:contain;background:#f7fbff;border-radius:22px}
.dark{background:var(--navy);color:#fff}
.dark h3{color:#fff}.dark p{color:#cbd5e1}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.step,.steps article{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:28px;padding:24px}
.steps b{font-size:42px;color:#a5e2ff;display:block;margin-bottom:20px}
.app-grid,.buy,.contact{display:grid;grid-template-columns:1fr 1fr;gap:46px;align-items:center}
.phone{background:#101828;border-radius:46px;padding:14px;max-width:340px;margin:0 auto;box-shadow:0 30px 80px rgba(20,33,61,.25)}
.phone-screen{background:#fff;border-radius:34px;padding:18px}
.phone-logo{height:34px;width:auto;object-fit:contain;margin-bottom:14px}
.metric{background:#f2f7fb;border-radius:18px;padding:14px;margin-top:10px;display:flex;justify-content:space-between;align-items:center}
.metric.big{background:linear-gradient(135deg,var(--navy),#236b8f);color:#fff;display:block}
.metric.big span{color:#cdefff}.metric.big strong{display:block;font-size:58px;line-height:1;margin-top:6px}
.metric span{color:#657386}.metric strong{color:var(--navy);font-size:20px}
.benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.benefits div{background:#fff;border:1px solid #e7eef6;border-radius:28px;padding:24px;text-align:center;font-weight:950;box-shadow:0 12px 30px rgba(20,33,61,.05)}
.buy{background:#f6fbff;border:1px solid #e7eef6;border-radius:42px;padding:32px}
.buy-images{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.buy-images img{background:#fff;border-radius:22px;padding:8px;object-fit:contain;aspect-ratio:1/1;box-shadow:0 10px 25px rgba(20,33,61,.06)}
.price{font-size:72px;font-weight:950;margin:12px 0;color:var(--navy)}
.trust{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px;color:#59677b;font-weight:800}
form{background:#fff;border:1px solid #e7eef6;border-radius:32px;padding:28px;box-shadow:0 16px 42px rgba(20,33,61,.06)}
input,textarea{width:100%;border:1px solid #dbe5ef;border-radius:18px;padding:14px 16px;margin-bottom:14px;font:inherit}
textarea{min-height:120px}
.footer{background:#101828;color:#fff;padding:56px 0}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:36px}
.footer img{height:58px;background:#fff;border-radius:14px;padding:4px}
.footer h3{color:#fff}
.footer p{color:#aab6c5}

.footer-links a {
  color: #aab6c5;
  font-weight: 700;
  transition: color 0.2s ease;
}

.footer-links a:hover {
  color: #ffffff;
}

/* MENÚ EMPRESA DESPLEGABLE */

.empresa-menu-top {
  position: relative;
  display: inline-block;
  flex-shrink: 0;
}

.empresa-menu-top summary {
  list-style: none;
}

.empresa-menu-top summary::-webkit-details-marker {
  display: none;
}

.empresa-btn {
  width: 46px;
  height: 46px;
  border: 1px solid #e7eef6;
  background: linear-gradient(135deg, #ffffff, #f4f9fd);
  color: #14213d;
  font-family: inherit;
  font-size: 22px;
  font-weight: 900;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 10px 28px rgba(20,33,61,.10);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .2s ease;
}

.empresa-btn:hover {
  color: #e4572e;
  border-color: #e4572e;
  transform: translateY(-1px);
  box-shadow: 0 14px 32px rgba(20,33,61,.14);
}

.empresa-menu-top[open] .empresa-btn {
  background: #14213d;
  color: #ffffff;
  border-color: #14213d;
}

.empresa-dropdown {
  position: absolute;
  top: 58px;
  right: 0;
  min-width: 220px;
  background: #ffffff;
  border: 1px solid #e7eef6;
  border-radius: 22px;
  box-shadow: 0 22px 55px rgba(20,33,61,.16);
  padding: 10px;
  z-index: 200;
  animation: menuFade .18s ease;
}

.empresa-dropdown a {
  display: block;
  padding: 13px 15px;
  border-radius: 14px;
  color: #536174;
  font-weight: 850;
  white-space: nowrap;
}

.empresa-dropdown a:hover {
  background: #f4f9fd;
  color: #e4572e;
}

@keyframes menuFade {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* SECCIONES EMPRESA */

.empresa-section {
  scroll-margin-top: 100px;
}

.empresa-box {
  max-width: 900px;
}

.empresa-box h2 {
  margin-bottom: 20px;
}

.empresa-box p {
  font-size: 18px;
}

.valores-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin-top: 32px;
}

.valores-grid div {
  background: #ffffff;
  border: 1px solid #e7eef6;
  border-radius: 26px;
  padding: 24px;
  box-shadow: 0 12px 30px rgba(20,33,61,.05);
}

.valores-grid h3 {
  margin-top: 0;
}

@media(max-width:900px){
  .menu{display:none}
  .hero-grid,.app-grid,.buy,.contact,.footer-grid{grid-template-columns:1fr}
  .three,.steps{grid-template-columns:1fr}
  .benefits{grid-template-columns:1fr 1fr}
  .section{padding:72px 0}
  .nav{height:72px}
  .brand img{height:42px}
  .valores-grid{grid-template-columns:1fr}

  .empresa-btn {
    width: 42px;
    height: 42px;
    font-size: 20px;
  }

  .empresa-dropdown {
    right: 0;
    top: 52px;
    min-width: 205px;
  }
}

@media(max-width:560px){
  .benefits,.buy-images{grid-template-columns:1fr}
  .wrap{padding:0 14px}
  h1{font-size:44px}

  .nav {
    gap: 10px;
  }

  .empresa-btn {
    width: 40px;
    height: 40px;
    font-size: 19px;
  }

  .brand img {
    height: 38px;
  }
}
