/* BRP Soluciones · estilos del sitio. Colores tomados del logo: del cian al violeta. */
:root {
  --cian: #1fc3dc; --azul: #3c6ca8; --violeta: #5b2382; --celeste: #2aa7c8;
  --violeta-oscuro: #4a1c6b; --tinte: #f1ecf7;
  --tinta: #1c2130; --tinta2: #4a5166; --suave: #7a8196; --linea: #e2e6ef;
  --fondo: #ffffff; --fondo2: #f5f7fb; --noche: #141a2e;
  --degradado: linear-gradient(135deg, var(--cian) 0%, var(--azul) 52%, var(--violeta) 100%);
  --ancho: 1120px; --radio: 14px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 17px/1.6 "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif; color: var(--tinta); background: var(--fondo); }
img { max-width: 100%; display: block; }
a { color: var(--azul); }
h1, h2, h3 { line-height: 1.18; margin: 0 0 .5em; letter-spacing: -.01em; }
h1 { font-size: clamp(2.1rem, 4.6vw, 3.4rem); font-weight: 750; }
h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 700; }
h3 { font-size: 1.15rem; font-weight: 650; }
p { margin: 0 0 1em; }
.contenedor { width: min(var(--ancho), 100% - 40px); margin-inline: auto; }
.salto { position: absolute; left: -999px; }
.salto:focus { left: 12px; top: 12px; background: #fff; padding: 8px 12px; border-radius: 8px; z-index: 50; }
:focus-visible { outline: 3px solid var(--cian); outline-offset: 2px; }

/* Cabecera */
.cabecera { position: sticky; top: 0; z-index: 20; background: rgba(255,255,255,.94); backdrop-filter: blur(8px); border-bottom: 1px solid var(--linea); }
.cabecera .contenedor { display: flex; align-items: center; gap: 22px; min-height: 68px; }
.marca { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--tinta); font-weight: 700; font-size: 1.12rem; white-space: nowrap; }
.marca img { width: 38px; height: 38px; }
.marca img.logo { width: auto; height: 46px; border-radius: 8px; }
.marca img.logo.claro { height: 40px; border-radius: 0; }
.marca span span { color: var(--celeste); font-weight: 600; }
.menu { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.menu a { padding: 9px 13px; border-radius: 9px; text-decoration: none; color: var(--tinta2); font-size: .97rem; font-weight: 550; }
.menu a:hover { background: var(--fondo2); color: var(--tinta); }
.menu a[aria-current="page"] { color: var(--violeta); background: var(--tinte); }
.menu .idioma { border: 1px solid var(--linea); margin-left: 6px; }
.menu .boton { color: #fff; }
.abrir-menu { display: none; margin-left: auto; background: none; border: 1px solid var(--linea); border-radius: 9px; padding: 8px 11px; font: inherit; cursor: pointer; }

/* Botones */
.boton { display: inline-block; background: var(--violeta); color: #fff; padding: 12px 22px; border-radius: 10px; text-decoration: none; font-weight: 650; border: 0; font: inherit; font-weight: 650; cursor: pointer; }
.boton:hover { background: var(--violeta-oscuro); }
.boton.claro { background: #fff; color: var(--violeta); }
.boton.claro:hover { background: var(--tinte); }
.boton.linea { background: transparent; color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.7); }
.boton.linea:hover { background: rgba(255,255,255,.12); }
.boton[disabled] { opacity: .6; cursor: progress; }

/* Portada */
.portada { background: var(--noche); color: #fff; position: relative; overflow: hidden; }
.portada::before { content: ""; position: absolute; inset: -40% -10% auto auto; width: 720px; height: 720px; background: var(--degradado); opacity: .5; filter: blur(90px); border-radius: 50%; }
.portada .contenedor { position: relative; padding: clamp(64px, 10vw, 120px) 0 clamp(56px, 8vw, 100px); display: grid; grid-template-columns: 1.25fr .75fr; gap: 40px; align-items: center; }
.portada p.bajada { font-size: 1.2rem; color: #d5dbee; max-width: 36em; }
.portada .acciones { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.portada .iso { width: min(340px, 80%); height: auto; margin-inline: auto; filter: drop-shadow(0 26px 50px rgba(0,0,0,.45)); }
.sello { display: inline-flex; align-items: center; gap: 8px; font-size: .86rem; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; color: #bfeaf3; border: 1px solid rgba(191,234,243,.4); border-radius: 999px; padding: 5px 13px; margin-bottom: 18px; }
.sello::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--cian); }
.portada.breve .contenedor { grid-template-columns: 1fr; padding: clamp(48px, 7vw, 84px) 0; }
.portada.breve h1 { font-size: clamp(1.9rem, 4vw, 2.8rem); }

/* Secciones */
section { padding: clamp(52px, 7vw, 88px) 0; }
section.gris { background: var(--fondo2); }
.encabezado { max-width: 44em; margin-bottom: 34px; }
.encabezado p { color: var(--tinta2); font-size: 1.08rem; }
.antetitulo { color: var(--celeste); font-weight: 700; font-size: .86rem; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 8px; }
.rejilla { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); }
.tarjeta { background: #fff; border: 1px solid var(--linea); border-radius: var(--radio); padding: 24px; }
.tarjeta p { color: var(--tinta2); margin-bottom: 0; font-size: .98rem; }
.tarjeta .numero { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: var(--degradado); color: #fff; font-weight: 700; margin-bottom: 14px; }
.tarjeta ul { margin: 10px 0 0; padding-left: 1.1em; color: var(--tinta2); font-size: .96rem; }
.tarjeta .etiqueta { display: inline-block; font-size: .78rem; font-weight: 650; color: var(--violeta); background: var(--tinte); border-radius: 999px; padding: 2px 10px; margin-bottom: 10px; }
.enlaces { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 26px 0 0; }
.enlaces a { font-weight: 600; }
.dos { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: start; }
.tecnologias { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; margin: 0; list-style: none; }
.tecnologias li { border: 1px solid var(--linea); background: #fff; border-radius: 999px; padding: 7px 16px; font-weight: 550; color: var(--tinta2); font-size: .95rem; }
.nota { color: var(--suave); font-size: .9rem; }
.texto { max-width: 46em; }
.texto h2 { font-size: 1.3rem; margin-top: 1.6em; }
.texto p { color: var(--tinta2); }
.portada.breve .contenedor { min-height: 0; }
.franja { background: var(--degradado); color: #fff; text-align: center; }
.franja p { color: #eef4ff; max-width: 38em; margin-inline: auto; font-size: 1.08rem; }
.franja .acciones { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.oficinas { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.oficinas h3 { margin-bottom: 4px; }
.oficinas address { font-style: normal; color: var(--tinta2); }

/* Formulario */
form.contacto { display: grid; gap: 14px; }
form.contacto .par { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
form.contacto label { display: grid; gap: 5px; font-weight: 600; font-size: .94rem; }
form.contacto input, form.contacto textarea { font: inherit; padding: 11px 13px; border: 1px solid #c9cfdd; border-radius: 10px; background: #fff; color: var(--tinta); width: 100%; }
form.contacto textarea { min-height: 150px; resize: vertical; }
form.contacto .trampa { position: absolute; left: -9999px; }
.estado { padding: 12px 14px; border-radius: 10px; font-weight: 550; }
.estado.bien { background: #e8f6ee; color: #14633a; }
.estado.mal { background: #fdecea; color: #a12a1d; }

/* Pie */
.pie { background: var(--noche); color: #c5cbe0; padding: 46px 0 26px; font-size: .95rem; }
.pie a { color: #dfe5f7; text-decoration: none; }
.pie a:hover { text-decoration: underline; }
.pie .columnas { display: grid; gap: 30px; grid-template-columns: 1.4fr 1fr 1fr 1fr; }
.pie h3 { color: #fff; font-size: .95rem; margin-bottom: 10px; }
.pie ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.pie .marca { color: #fff; margin-bottom: 10px; }
.pie .legal { border-top: 1px solid rgba(255,255,255,.14); margin-top: 30px; padding-top: 18px; color: #98a0bb; font-size: .86rem; display: flex; flex-wrap: wrap; gap: 6px 18px; justify-content: space-between; }

@media (max-width: 900px) {
  .portada .contenedor, .dos { grid-template-columns: 1fr; }
  .portada .iso { display: none; }
  .pie .columnas { grid-template-columns: 1fr 1fr; }
  .abrir-menu { display: block; }
  .menu { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-bottom: 1px solid var(--linea); padding: 10px 20px 16px; flex-direction: column; align-items: stretch; gap: 2px; }
  .menu.abierto { display: flex; }
  .menu .idioma, .menu .boton { margin: 6px 0 0; text-align: center; }
}
@media (max-width: 560px) {
  body { font-size: 16px; }
  form.contacto .par, .pie .columnas { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }