/* =========================================================
   VARIABLES & UTILIDADES
========================================================= */
:root{
  --brand:#3b82f6;
  --accent:#2563eb;
  --bgband:#f3f4f6;
  --bgband-alt:#eceff1;
}
.fw-900{font-weight:900}
[id]{scroll-margin-top:96px}

/* =========================================================
   SERVICIOS (bandas y layout)
========================================================= */
.svc-band{background:var(--bgband);color:#0a0a0a;font-family:'Inter','Poppins',sans-serif;font-size:1.15rem;line-height:1.65}
.svc-band.alt{background:var(--bgband-alt);color:#0a0a0a}
.svc-title{font-family:'Poppins',sans-serif;font-weight:900;line-height:1.2;letter-spacing:.3px;margin-bottom:.8rem;font-size:1.9rem;color:#0a0a0a}
.svc-title span{display:inline-block;background:var(--brand);color:#fff;padding:.2rem .7rem;font-weight:800}
.svc-sub{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.25rem;margin-bottom:.6rem;color:#0a0a0a}
.svc-band p{color:#0a0a0a;font-weight:500;font-size:1.15rem;line-height:1.65}
.svc-list{margin:0;padding-left:1.2rem}
.svc-list li{margin:.4rem 0;color:#0a0a0a;font-weight:500;font-size:1.15rem;line-height:1.6}
.svc-list li::marker{color:var(--accent)}
.svc-band.compact .svc-title{margin-bottom:.7rem;font-size:1.9rem}
.svc-band.compact .small{color:#0a0a0a;font-weight:600;font-size:1.1rem}
.svc-band.compact .svc-tags{font-size:1.05rem;color:#0a0a0a;font-weight:500;line-height:1.55}
.svc-logos{display:flex;align-items:center;flex-wrap:wrap;gap:26px;margin-top:10px}
.svc-logos a{display:inline-block;transition:transform .25s ease,filter .25s ease}
.svc-logos img{height:84px;width:auto;filter:grayscale(100%) brightness(.95);opacity:.9;transition:filter .25s ease,opacity .25s ease,transform .25s ease}
.svc-logos a:hover img{filter:grayscale(0%) brightness(1);opacity:1;transform:scale(1.1)}
.svc-logos span{font-size:1.1rem;font-weight:600;color:#0a0a0a}

/* =========================================================
   TIPOGRAFÍA 
========================================================= */
.page-servicios{
  --svc-title-font:"Plus Jakarta Sans",ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial;
  --svc-sub-font:"Plus Jakarta Sans",ui-sans-serif,system-ui;
  --svc-body-font:"Source Serif 4",ui-serif,Georgia,"Times New Roman",serif;
}
.page-servicios .svc-title{font-family:var(--svc-title-font);font-weight:800;letter-spacing:.2px;color:#0b1220;margin-bottom:.75rem}
.page-servicios .svc-title span{font-weight:800}
.page-servicios .svc-sub{font-family:var(--svc-sub-font);font-weight:700;letter-spacing:.2px;line-height:1.2;color:#0b1220;margin-bottom:.5rem}
.page-servicios .svc-band p{
  font-family:var(--svc-body-font);font-size:1.05rem;line-height:1.7;color:#111827;
  font-variation-settings:"opsz" 16;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility
}
.page-servicios .svc-list{margin:0;padding-left:1.15rem}
.page-servicios .svc-list li{font-family:var(--svc-body-font);font-size:1.02rem;line-height:1.65;color:#1f2937}
.page-servicios .svc-list li::marker{color:var(--accent)}
.page-servicios .seguridad-modal .modal-title{font-family:var(--svc-title-font);font-weight:800}

/* =========================================================
   FORMULARIO (Contacto)
========================================================= */
#contacto{
  background:#fff;color:#0b1220;border-top:1px solid #e5e7eb;
  padding-top:32px;padding-bottom:40px
}
#contacto .container{max-width:1140px}
#contacto h2{
  font-family:'Poppins','Inter',sans-serif;font-weight:900;letter-spacing:.2px;color:#0b1220;margin-bottom:.35rem
}
#contacto h2::after{
  content:"";display:block;width:58px;height:4px;margin:14px 0 8px;
  background:linear-gradient(90deg,var(--brand),var(--accent))
}
#contacto .form-label{color:#111827;font-weight:700;font-size:.95rem;margin-bottom:.35rem}

#contacto .form-control,
#contacto .form-select,
#contacto .input-group-text{
  height:44px;padding:.45rem .75rem;border-radius:0 !important;background:#fff;
  border:1px solid #d0d5dd;box-shadow:none !important
}
#contacto textarea.form-control{min-height:160px;height:auto}
#contacto .form-control:focus,
#contacto .form-select:focus,
#contacto textarea:focus{border-color:#111827;outline:0;box-shadow:none !important}

#contacto .form-check-input{
  width:1.1rem;height:1.1rem;margin-top:.25rem;border-radius:0 !important;border:1px solid #d0d5dd
}
#contacto .form-check-input:checked{background-color:#111827;border-color:#111827}

#contacto .btn{border-radius:0 !important;padding:.6rem 1rem}
#contacto .btn-primary{
  background:linear-gradient(90deg,var(--brand),var(--accent));border:0;color:#fff;font-weight:800;letter-spacing:.2px;
  box-shadow:0 6px 18px rgba(59,130,246,.18)
}
#contacto .btn-primary:hover{filter:brightness(.96)}
#contacto .btn-outline-secondary{border-color:#cbd5e1;color:#334155;background:#fff}
#contacto .btn-outline-secondary:hover{background:#f8fafc;border-color:#94a3b8;color:#0b1220}

#contacto .alert{
  border-radius:0 !important;background:#eef2ff;border:1px solid rgba(59,130,246,.35);color:#0b1220;box-shadow:none
}
#contacto #formAlert{margin-top:16px;clear:both}
#contacto .d-flex.gap-2.mt-2{margin-bottom:6px}

#servicio-extra .form-label{color:#111827;font-weight:700;font-size:.95rem;margin-bottom:.35rem}
#servicio-extra .form-control,
#servicio-extra .form-select{
  height:44px;padding:.45rem .75rem;border-radius:0 !important;background:#fff;border:1px solid #d0d5dd;box-shadow:none !important
}
#servicio-extra textarea.form-control{min-height:130px;height:auto}
#servicio-extra .form-control:focus,
#servicio-extra .form-select:focus,
#servicio-extra textarea:focus{border-color:#111827;outline:0;box-shadow:none !important}
/* Modal estilo Ingenial (limpio y corporativo) */
.modal-ingenial .modal-dialog {
  max-width: 540px;
}

.modal-ingenial .modal-content {
  border-radius: 12px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 20px 45px rgba(15, 23, 42, 0.25);
}

/* Header */
.modal-ingenial .modal-header {
  padding: 14px 18px 10px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.9);
  background-color: #ffffff;
}

.modal-ingenial .modal-eyebrow {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: rgba(100, 116, 139, 0.95);
}

.modal-ingenial .modal-title {
  font-size: 1.02rem;
  letter-spacing: 0.01em;
  color: #0f172a; /* similar a var(--ink) */
}

/* Botón de cierre */
.modal-ingenial .btn-close {
  opacity: 0.7;
}
.modal-ingenial .btn-close:hover {
  opacity: 1;
}

/* Body */
.modal-ingenial .modal-body {
  padding: 14px 18px 16px;
  font-size: 0.94rem;
  line-height: 1.6;
  color: #111827;
}

.modal-ingenial .modal-body p + p {
  margin-top: 0.75rem;
}

.modal-ingenial .modal-body a {
  color: var(--brand, #3b82f6);
  text-decoration: none;
  font-weight: 500;
}
.modal-ingenial .modal-body a:hover {
  text-decoration: underline;
}
.modal-ingenial .modal-eyebrow {
  font-size: 0.9rem;              /* antes 0.72rem */
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: rgba(100, 116, 139, 0.95);
  font-weight: 600;               /* un poco más marcado */
}

#contacto h2{
  font-family:'Poppins','Inter',sans-serif;
  font-weight:900;
  font-size:clamp(26px,4.6vw,36px); /* mismo tamaño que otros títulos */
  color:var(--heading-deep-blue, #111539); /* azul profundo */
  margin-bottom:1rem;
}

#contacto h2::after{
  content:"";
  display:block;
  width:58px;
  height:5px;
  margin-top:6px;
  background:linear-gradient(90deg,var(--brand,#3b82f6),var(--accent,#a5b4fc));
  box-shadow:0 1px 6px rgba(59,130,246,.22);
}
