@charset "UTF-8";
/* ==========================================================================
   Global Test — estilos propios de index.html (la landing)
   Requiere estilos.css cargado antes.
   ========================================================================== */

html{scroll-behavior:smooth}

body{
  color:var(--texto);
  background:var(--blanco);
  line-height:1.6;
  overflow-x:hidden;
}

.contenedor{width:100%;max-width:1180px;margin:0 auto;padding:0 28px}

/* ---------- NAVEGACIÓN ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(0,11,59,.92);
  backdrop-filter:blur(10px);
  transition:padding .25s ease;
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.marca{gap:12px}
.marca img{height:34px}
.nav-links{display:flex;align-items:center;gap:32px;list-style:none}
.nav-links a{
  color:rgba(255,255,255,.82);text-decoration:none;font-size:.94rem;font-weight:400;
  transition:color .2s;
}
.nav-links a:hover,.nav-links a:focus-visible{color:var(--naranja)}
.nav-cta{
  background:var(--naranja);color:var(--azul)!important;
  padding:11px 22px;border-radius:var(--radio-lobulo);
  font-weight:600!important;font-size:.9rem!important;
  transition:background .2s,transform .2s;
}
.nav-cta:hover{background:var(--naranja-claro);transform:translateY(-1px)}
.menu-btn{display:none;background:none;border:0;cursor:pointer;padding:8px}
.menu-btn span{display:block;width:24px;height:2px;background:var(--blanco);margin:5px 0;border-radius:2px;transition:.25s}

/* ---------- HERO ---------- */
.hero{
  position:relative;background:var(--azul);color:var(--blanco);
  padding:170px 0 120px;overflow:hidden;
}
.hero-lobulos{
  position:absolute;right:-60px;top:50%;transform:translateY(-50%);
  display:flex;gap:14px;opacity:.9;pointer-events:none;
}
.lobulo{
  width:230px;height:400px;border-radius:var(--radio-lobulo);
  background:linear-gradient(160deg,var(--naranja) 0%,#F26100 100%);
}
.lobulo:nth-child(2){margin-top:56px}

.hero-inner{position:relative;z-index:2;max-width:620px}
.hero h1{
  font-size:clamp(2.35rem,5.4vw,4rem);
  font-weight:400;line-height:1.12;letter-spacing:-.025em;margin-bottom:26px;
}
.hero h1 strong{font-weight:700}
.hero p{
  font-size:clamp(1.02rem,1.7vw,1.18rem);
  color:rgba(255,255,255,.8);max-width:44ch;margin-bottom:38px;
}
.hero-acciones{display:flex;flex-wrap:wrap;gap:14px}

/* ---------- SECCIONES ---------- */
.seccion{padding:100px 0}
.seccion-gris{background:var(--gris)}

.titulo{
  font-size:clamp(1.85rem,3.4vw,2.6rem);
  font-weight:600;color:var(--azul);line-height:1.2;
  letter-spacing:-.02em;margin-bottom:18px;
}
.entrada{font-size:1.06rem;max-width:60ch;margin-bottom:52px}

/* Públicos */
.publicos{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:26px}
.publico{
  background:var(--blanco);border-radius:26px;padding:36px 32px;
  border-top:5px solid var(--naranja);
}
.seccion:not(.seccion-gris) .publico{border:1px solid #E4E6F0;border-top:5px solid var(--naranja)}
.publico h3{font-size:1.28rem;font-weight:600;color:var(--azul);margin-bottom:12px}
.publico p{font-size:.98rem}
.publico-icono{
  width:52px;height:52px;border-radius:16px;background:var(--azul);
  display:flex;align-items:center;justify-content:center;margin-bottom:22px;
}
.publico-icono svg{width:26px;height:26px;stroke:var(--naranja);fill:none;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}

/* Propuesta de valor */
.valor{display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:center}
.pastillas{display:flex;flex-direction:column;gap:14px}
.pastilla{
  background:var(--azul);color:var(--blanco);
  padding:16px 34px;border-radius:var(--radio-lobulo);
  font-weight:600;font-size:.95rem;letter-spacing:.13em;text-align:center;
}
.pastilla:nth-child(even){background:var(--azul-suave)}

/* Plataforma */
.plataforma{position:relative;background:var(--azul);color:var(--blanco);overflow:hidden}
.plataforma .titulo{color:var(--blanco)}
.plataforma-arco{opacity:.55}
.plataforma-arco circle{stroke-width:12}
.plataforma-inner{position:relative;z-index:2}
.plataforma p{color:rgba(255,255,255,.82)}
.rasgos{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:34px;margin-top:16px}
.rasgo h4{
  font-size:1.08rem;font-weight:600;color:var(--naranja);margin-bottom:9px;
  padding-top:16px;border-top:2px solid rgba(255,123,2,.35);
}
.rasgo p{font-size:.96rem;color:rgba(255,255,255,.75)}

.aviso{
  margin-top:52px;padding:30px 34px;border-radius:26px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:22px;
}
.aviso p{font-size:1.04rem;color:var(--blanco);max-width:46ch;font-weight:500}

/* Contacto */
.contacto{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}
.datos{list-style:none;margin-top:8px}
.datos li{display:flex;gap:15px;align-items:flex-start;margin-bottom:24px}
.datos svg{width:22px;height:22px;stroke:var(--naranja);fill:none;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;margin-top:3px}
.datos strong{display:block;color:var(--azul);font-weight:600;font-size:.97rem}
.datos a{color:var(--texto);text-decoration:none;font-size:.97rem}
.datos a:hover{color:var(--naranja)}

.form-caja{background:var(--azul);border-radius:30px;padding:42px 38px}
.form-caja h3{color:var(--blanco);font-size:1.35rem;font-weight:600;margin-bottom:10px}
.form-caja > p{color:rgba(255,255,255,.72);font-size:.96rem;margin-bottom:28px}
.campo{margin-bottom:18px}
.campo label{display:block;color:rgba(255,255,255,.8);font-size:.87rem;margin-bottom:7px}
.campo input,.campo select,.campo textarea{
  width:100%;padding:13px 17px;border-radius:14px;
  border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.07);
  color:var(--blanco);font-family:inherit;font-size:.96rem;
}
.campo textarea{resize:vertical;min-height:96px}
.campo input:focus,.campo select:focus,.campo textarea:focus{
  outline:none;border-color:var(--naranja);background:rgba(255,255,255,.12);
}
.campo select option{background:var(--azul);color:var(--blanco)}
.form-caja .btn{width:100%;justify-content:center;margin-top:8px}

/* Footer */
.pie{background:var(--azul);color:rgba(255,255,255,.6);padding:52px 0 34px;
  border-top:1px solid rgba(255,255,255,.1)}
.pie-inner{display:flex;flex-wrap:wrap;gap:26px;justify-content:space-between;align-items:center}
.pie-lema{color:var(--blanco);font-size:1.05rem;font-weight:500;max-width:34ch}
.pie-lema b{color:var(--naranja);font-weight:600}
.pie small{font-size:.87rem}

/* Campo trampa para bots: invisible para personas */
.trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- RESPONSIVE ---------- */
@media (max-width:980px){
  .valor,.contacto{grid-template-columns:1fr;gap:44px}
  .hero-lobulos{opacity:.16;right:-130px}
}
@media (max-width:760px){
  .nav-links{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;gap:0;background:var(--azul);padding:14px 28px 26px;
  }
  .nav-links.abierto{display:flex}
  .nav-links li{width:100%;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.09)}
  .nav-links li:last-child{border-bottom:0;padding-top:20px}
  .nav-cta{display:inline-block;text-align:center}
  .menu-btn{display:block}
  .hero{padding:130px 0 90px}
  .seccion{padding:74px 0}
  .hero-acciones .btn{width:100%;justify-content:center}
  .aviso{flex-direction:column;align-items:flex-start}
  .aviso .btn{width:100%;justify-content:center}
  .form-caja{padding:34px 26px}
}