:root {
  --font-main: "Helvetica", Arial, sans-serif;
  --color-primary: #1B7C78;
  --color-accent: #6A0DAD;
  --color-footer: #0F4F4B;
  --color-bg: #ffffff;
  --color-text: #111827;
  --color-muted: #6b7280;
  --dark-0: #111111;
  --dark-1: #1a1a1a;
  --dark-2: #1e1e1e;
  --dark-3: #2b2b2b;
  --dark-4: #3a3a3a;
  --aqua: #E0F7F7;
  --line: rgba(255,255,255,.14);
  --line-light: rgba(17, 24, 39, .12);
  --maxw: 1120px;
  --radius: 14px;
  --shadow: 0 10px 30px rgba(0,0,0,.18);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-main);background:var(--color-bg);color:var(--color-text);line-height:1.6}
img{max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.site-header{position:sticky;top:0;z-index:50;background:var(--color-primary);color:#fff;border-bottom:1px solid rgba(255,255,255,.18)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0}
.brand{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:.2px}
.brand img{height:52px;width:auto;display:block}
.nav{display:flex;align-items:center;gap:10px}
.nav-links{display:flex;align-items:center;gap:10px}
.nav-links a{display:inline-block;padding:8px 10px;border-radius:999px;color:#fff;opacity:.95}
.nav-links a:hover{text-decoration:none;background:rgba(255,255,255,.12)}
.nav-links a[aria-current="page"]{background:rgba(0,0,0,.15);opacity:1}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 14px;border-radius:999px;border:1px solid transparent;cursor:pointer;font-weight:700;line-height:1;white-space:nowrap;text-decoration:none!important}
.btn-primary{background:var(--color-accent);color:#fff}
.btn-primary:hover{filter:brightness(.95)}
.btn-ghost{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.18);color:#fff}
.btn-ghost:hover{filter:brightness(.95)}
.menu-toggle{display:none}
.menu-btn{display:none;border:1px solid rgba(255,255,255,.25);background:rgba(0,0,0,.12);color:#fff;padding:8px 12px;border-radius:10px;font-weight:700}
.menu-btn:hover{filter:brightness(.95)}
.section{padding:56px 0}
.section.dark{color:#fff;background:linear-gradient(180deg,var(--dark-0) 0%,var(--dark-1) 100%)}
.section.dark2{color:#fff;background:var(--dark-2)}
.section.dark3{color:#fff;background:var(--dark-3)}
.section.dark4{color:#fff;background:var(--dark-4)}
.section.aqua{background:var(--aqua)}
.section-head{margin-bottom:22px}
.section-head h1,.section-head h2{margin:0 0 8px;line-height:1.15}
.section-head p{margin:0;color:rgba(255,255,255,.85)}
.section.dark .section-head p,.section.dark2 .section-head p,.section.dark3 .section-head p,.section.dark4 .section-head p{color:rgba(255,255,255,.82)}
h1{font-size:clamp(1.9rem,2.6vw + 1rem,3.0rem)}
h2{font-size:clamp(1.5rem,1.4vw + 1rem,2.1rem)}
h3{font-size:1.1rem}
.lead{font-size:1.12rem}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:26px;align-items:center}
.hero-card{background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:18px}
.hero-actions{margin-top:16px;display:flex;flex-wrap:wrap;gap:10px}
/* HERO sin recuadro */
.hero-media{
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  overflow: visible;
}
.hero-media img{
  border-radius: 0;
  display: block;
}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{border-radius:var(--radius);border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.18);padding:16px}
.card h3{margin:0 0 8px}
.card p{margin:0;color:rgba(255,255,255,.82)}
.kpi-list{margin:14px 0 0;padding:0;list-style:none}
.kpi-list li{display:flex;gap:10px;align-items:flex-start;margin:10px 0;color:rgba(255,255,255,.85)}
.dot{flex:0 0 auto;width:10px;height:10px;border-radius:50%;background:var(--color-primary);margin-top:7px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.step{background:#fff;border:1px solid var(--line-light);border-radius:var(--radius);padding:16px}
.step .num{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:999px;background:var(--color-primary);color:#fff;font-weight:800}
.step h3{margin:10px 0 6px}
.step p{margin:0;color:var(--color-muted)}
.examples{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.example{background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);overflow:hidden}
.example .body{padding:14px}
.example h3{margin:0 0 6px}
.example p{margin:0;color:rgba(255,255,255,.82)}
.example img{display:block;width:100%}
.cta{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;align-items:center}
.cta-card{background:rgba(255,255,255,.9);border:1px solid rgba(17,24,39,.10);border-radius:var(--radius);padding:18px}
.cta-card h2{margin:0 0 8px}
.cta-card p{margin:0 0 12px;color:#374151}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form-grid .full{grid-column:1/-1}
input,textarea{width:100%;padding:12px 12px;border-radius:12px;border:1px solid rgba(17,24,39,.15);font-family:var(--font-main);font-size:1rem}
input:focus,textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 4px rgba(27,124,120,.18)}
.form-actions{margin-top:10px;display:flex;gap:10px;flex-wrap:wrap}
.small{font-size:.92rem;color:rgba(17,24,39,.70)}
.faq{display:grid;grid-template-columns:1fr;gap:10px}
.faq details{background:#fff;border:1px solid var(--line-light);border-radius:12px;padding:12px 14px}
.faq summary{cursor:pointer;font-weight:800;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq .answer{margin-top:10px;color:var(--color-muted)}
.to-top{
  position: fixed;
  right: 16px;
  bottom: 16px;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  border: none;
  background: var(--color-primary); /* círculo */
  cursor: pointer;
  box-shadow: 0 10px 20px rgba(0,0,0,.35);
  display: none;

  display: flex;
  align-items: center;
  justify-content: center;
}

.to-top svg{
  width: 28px;
  height: 28px;
  fill: #ffffff !important;   /* 👈 flecha blanca */
}

.to-top:hover{
  background: var(--color-accent);
  transform: translateY(-2px);
}


@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .examples{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .cta{grid-template-columns:1fr}
  .menu-btn{display:inline-flex}
  .nav-links{display:none;position:absolute;left:0;right:0;top:74px;background:var(--color-primary);padding:12px 20px;border-bottom:1px solid rgba(255,255,255,.18);flex-direction:column;align-items:flex-start;gap:8px}
  .menu-toggle:checked ~ .nav .nav-links{display:flex}
}
#formStatus{
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(27,124,120,.10);
  border: 1px solid rgba(27,124,120,.25);
  color: #0f4f4b;
}
/* =========================
   FOOTER (2 columnas + iconos grandes)
   ========================= */
.site-footer{
  background: #254E4A;
  color: rgba(255,255,255,0.92);
  padding: 56px 0 28px;
}

.site-footer h4{
  margin: 0 0 18px;
  color: #fff;
  font-size: 28px;
  font-weight: 600;
}

.site-footer p{
  margin: 0;
  font-size: 20px;
  line-height: 1.65;
  color: rgba(255,255,255,0.9);
}

.site-footer .footer-flex{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 56px;
}

.site-footer .footer-brand{
  flex: 1 1 auto;
  max-width: 820px;
}

.site-footer .footer-connect{
  flex: 0 0 320px;
}

/* Iconos grandes (estilo “Let’s connect”) */
.site-footer .connect-icons{
  display: flex;
  gap: 18px;
  margin-top: 6px;
}

.site-footer .connect-icons a{
  width: 60px;
  height: 60px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  color: rgba(255,255,255,0.72);
  text-decoration: none;
  transition: transform .2s ease, color .2s ease;
}

.site-footer .connect-icons a:hover{
  color: #ffffff;
  transform: translateY(-2px);
}

.site-footer .footer-bottom{
  margin-top: 34px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,0.18);
  text-align: left;
  font-size: 20px;
  color: rgba(255,255,255,0.82);
}

/* Responsive */
@media (max-width: 900px){
  .site-footer .footer-flex{
    flex-direction: column;
    gap: 28px;
  }
  .site-footer .footer-connect{
    flex: 1 1 auto;
  }
  .site-footer .footer-bottom{
    text-align: left;
  }
}

/* Honeypot anti-bot: debe ser invisible */
.hp-field{
  position: absolute !important;
  left: -10000px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}


