/* =========================================================
   Intelis Systems · Cabecera, menú, footer y modal compartidos
   Usado por index.html, reservia.html y todas las landing pages.
   Paleta coherente con index.html (#2d5a95 / #5598d7).
   ========================================================= */

:root{
  --isn-primary:#64748b;
  --isn-primary-2:#5598d7;
  --isn-ink:#111827;
  --isn-muted:#5b6478;
  --isn-line:#e5e7eb;
  --isn-ring:rgba(45,90,149,.35);
  --isn-container:1152px;
}

.isn-container{width:min(var(--isn-container),92%);margin-inline:auto}

/* ---------- Header ---------- */
.isn-header{
  position:sticky;top:0;z-index:70;background:#fff;
  box-shadow:0 1px 3px rgba(16,24,40,.08);
  transition:box-shadow .25s;
}
.isn-header.isn-scrolled{box-shadow:0 8px 24px rgba(16,24,40,.10)}
.isn-header-inner{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.7rem 0;
}
.isn-brand{display:flex;align-items:center;gap:.6rem;min-width:0;text-decoration:none}
.isn-brand.isn-active .isn-brand-name{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}
.isn-brand img{height:64px;width:auto;display:block}
.isn-brand-name{
  font-size:1.25rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:var(--isn-primary);white-space:nowrap;
}


/* ---------- Menú desktop ---------- */
.isn-nav{display:none}
.isn-menu{display:flex;align-items:center;gap:.4rem;list-style:none;margin:0;padding:0}
.isn-menu>li{position:relative}
.isn-link{
  display:inline-flex;align-items:center;gap:.35rem;
  padding:.55rem .85rem;border:0;background:none;cursor:pointer;
  font:inherit;font-weight:600;font-size:.97rem;color:#3c4257;
  text-decoration:none;border-radius:10px;transition:color .18s,background .18s;
}
.isn-link:hover,.isn-link:focus-visible{color:var(--isn-primary);background:#f3f7fc}
.isn-link.isn-active{color:var(--isn-primary)}
.isn-link.isn-active::after{
  content:"";position:absolute;left:.85rem;right:.85rem;bottom:.15rem;height:2px;
  background:linear-gradient(90deg,var(--isn-primary),var(--isn-primary-2));border-radius:2px;
}
.isn-caret{width:14px;height:14px;stroke:currentColor;stroke-width:2.2;fill:none;transition:transform .2s}
.isn-has-submenu.isn-open>.isn-submenu-btn .isn-caret{transform:rotate(180deg)}

/* ---------- Submenú ---------- */
.isn-submenu{
  position:absolute;left:0;top:calc(100% + 10px);min-width:270px;
  background:#fff;border:1px solid var(--isn-line);border-radius:14px;
  box-shadow:0 18px 40px rgba(16,24,40,.13);
  padding:.45rem;list-style:none;margin:0;
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .18s,transform .18s,visibility .18s;
}
.isn-has-submenu.isn-open>.isn-submenu{opacity:1;visibility:visible;transform:translateY(0)}
.isn-submenu a{
  display:block;padding:.6rem .75rem;border-radius:10px;
  color:#3c4257;text-decoration:none;font-weight:600;font-size:.93rem;
  transition:background .16s,color .16s;
}

/* ---------- Acciones / botón ---------- */
.isn-actions{display:flex;align-items:center;gap:.6rem}
.isn-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
  padding:.6rem 1.25rem;border-radius:999px;border:2px solid transparent;
  font-weight:700;font-size:.92rem;cursor:pointer;text-decoration:none;
  font-family:inherit;transition:transform .18s,box-shadow .18s,background .18s,color .18s,border-color .18s;
}
.isn-btn-primary{
  background:linear-gradient(135deg,var(--isn-primary),var(--isn-primary-2));
  color:#fff;box-shadow:0 6px 16px var(--isn-ring);
}
.isn-btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 24px var(--isn-ring)}
.isn-btn-ghost{border-color:#d9ddeb;background:#fff;color:var(--isn-ink)}
.isn-btn-ghost:hover{border-color:var(--isn-primary);color:var(--isn-primary)}

.isn-toggle{
  display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;
  border-radius:12px;border:1.5px solid #d9ddeb;background:#fff;cursor:pointer;
}
.isn-toggle svg{width:20px;height:20px;stroke:var(--isn-ink);stroke-width:2;stroke-linecap:round;fill:none}

/* ---------- Menú móvil ---------- */
.isn-mobile-nav{
  display:none;border-top:1px solid var(--isn-line);background:#fff;
  max-height:calc(100vh - 78px);overflow:auto;
}
.isn-mobile-nav.isn-open{display:block}
.isn-mobile-nav ul{list-style:none;margin:0;padding:.6rem 0}
.isn-mobile-nav a,.isn-mobile-btn{
  display:flex;align-items:center;justify-content:space-between;gap:.5rem;width:100%;
  padding:.85rem 1.15rem;font-weight:600;font-size:.98rem;color:#3c4257;
  text-decoration:none;background:none;border:0;font-family:inherit;cursor:pointer;text-align:left;
}
.isn-mobile-btn .isn-caret{transition:transform .2s}
.isn-mobile-nav .isn-has-submenu.isn-open>.isn-mobile-btn .isn-caret{transform:rotate(180deg)}
.isn-mobile-sub{display:none;border-left:2px solid var(--isn-line);background:#f8fafd}
.isn-mobile-nav .isn-has-submenu.isn-open>.isn-mobile-sub{display:block}

/* ---------- Footer ---------- */
.isn-footer{background:#111827;color:#9ca3af;padding:2.6rem 0;text-align:center}
.isn-footer-inner{display:flex;flex-direction:column;gap:.9rem;align-items:center}
.isn-footer-brand{display:flex;align-items:center;gap:.55rem;color:#fff;font-weight:800;font-size:1.05rem;text-decoration:none}
.isn-footer-brand img{height:34px;width:auto;border-radius:8px}
.isn-footer-links{display:flex;gap:1.1rem;flex-wrap:wrap;justify-content:center;list-style:none;margin:0;padding:0}
.isn-footer-links a{color:#9ca3af;text-decoration:none;font-size:.92rem}
.isn-footer-links a:hover{color:#fff}
.isn-footer-copy{font-size:.82rem;color:#6b7280;margin:0}
.isn-footer-copy a{color:#8fbde8}

/* ---------- Modal Contacto / lead capture ---------- */
.isn-modal{
  position:fixed;inset:0;z-index:200;display:none;
  align-items:center;justify-content:center;padding:1rem;
  background:rgba(15,23,42,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
}
.isn-modal.isn-open{display:flex}
.isn-modal-box{
  position:relative;width:min(640px,100%);max-height:88vh;overflow:auto;
  background:#fff;border-radius:20px;padding:1.9rem 1.7rem 1.6rem;
  box-shadow:0 30px 70px rgba(2,6,23,.45);
  animation:isnPop .22s ease-out;
}
@keyframes isnPop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.isn-modal-close{
  position:absolute;top:.85rem;right:.85rem;width:38px;height:38px;border-radius:50%;
  border:1px solid var(--isn-line);background:#fff;cursor:pointer;display:grid;place-items:center;
}
.isn-modal-close svg{width:18px;height:18px;stroke:#5b6478;stroke-width:2.2;fill:none;stroke-linecap:round}
.isn-modal-close:hover{border-color:var(--isn-primary);color:var(--isn-primary)}
.isn-modal-kicker{
  display:inline-block;color:var(--isn-primary);font-weight:800;font-size:.72rem;
  letter-spacing:1.6px;text-transform:uppercase;margin-bottom:.5rem;
}
.isn-modal-title{font-size:1.5rem;font-weight:800;color:var(--isn-ink);margin:0 0 .4rem}
.isn-modal-text{color:var(--isn-muted);margin:0 0 1.2rem;font-size:.96rem}
.isn-lead-frame{
  width:100%;height:min(460px,60vh);border:1px solid var(--isn-line);
  border-radius:14px;background:#f8fafd;display:block;
}
.isn-lead-fallback{display:none;text-align:center;padding:1rem .4rem}
.isn-lead-fallback.isn-visible{display:block}
.isn-lead-fallback .isn-fb-icon{
  width:60px;height:60px;border-radius:50%;margin:0 auto .9rem;
  display:grid;place-items:center;background:#eaf3fc;color:var(--isn-primary);
}
.isn-lead-fallback .isn-fb-icon svg{width:28px;height:28px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.isn-lead-fallback p{color:var(--isn-muted);font-size:.94rem;margin:0 0 1.1rem}
.isn-lead-actions{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap}
.isn-fb-note{font-size:.8rem;color:#8a93a6;margin-top:1rem}

body.isn-modal-open{overflow:hidden}

/* =========================================================
   Formulario de contacto dentro del modal
   ========================================================= */
.isn-contact-form {
  display: grid;
  gap: 1rem;
  margin-top: 0.6rem;
}

.isn-form-group {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

@media (max-width: 480px) {
  .isn-modal-box {
    padding: 1.4rem 1.1rem 1.2rem;
  }
  .isn-form-group {
    gap: 0.7rem;
  }
  .isn-form-group label {
    font-size: 0.86rem;
    margin-bottom: 0.15rem;
  }
  .isn-form-group input,
  .isn-form-group textarea {
    padding: 0.75rem 0.9rem;
    font-size: 0.95rem;
  }
  .isn-modal-title {
    font-size: 1.35rem;
    margin: 0 0 0.35rem;
  }
  .isn-modal-text {
    font-size: 0.9rem;
    margin: 0 0 1rem;
  }
  .isn-modal-close {
    top: 0.7rem;
    right: 0.7rem;
    width: 34px;
    height: 34px;
  }
  .isn-modal-close svg {
    width: 16px;
    height: 16px;
  }
  .isn-contact-submit {
    padding: 0.9rem 1rem;
    font-size: 0.95rem;
  }
}

.isn-form-group label {
  font-size: 0.86rem;
  font-weight: 700;
  color: var(--isn-ink, #1e293b);
}

.isn-form-group input,
.isn-form-group textarea {
  width: 100%;
  padding: 0.7rem 0.9rem;
  border: 1px solid var(--isn-line, #cbd5e1);
  border-radius: 10px;
  font-size: 0.95rem;
  font-family: inherit;
  background: #fff;
  box-sizing: border-box;
  resize: vertical;
}

.isn-form-group input:focus,
.isn-form-group textarea:focus {
  outline: none;
  border-color: var(--isn-primary, #2d5a95);
  box-shadow: 0 0 0 3px rgba(45, 90, 149, 0.15);
}

.isn-form-group input::placeholder,
.isn-form-group textarea::placeholder {
  color: #94a3b8;
}

.isn-contact-submit {
  width: 100%;
  padding: 0.85rem 1rem;
  background: var(--isn-primary, #2d5a95);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 0.95rem;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  margin-top: 0.2rem;
  transition: background 0.2s ease;
}

.isn-contact-submit:hover {
  background: #244a7a;
}

.isn-contact-submit:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

.isn-contact-result {
  margin-top: 1rem;
  padding: 1rem;
  border-radius: 10px;
  font-size: 0.92rem;
  line-height: 1.5;
  text-align: center;
  display: none;
}

.isn-contact-result.isn-success {
  background: #f0fdf4;
  border: 1px solid #86efac;
  color: #166534;
}

.isn-contact-result.isn-error {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #991b1b;
}

.isn-contact-result strong {
  display: block;
  margin-bottom: 0.4rem;
  font-size: 1rem;
}

.isn-contact-hidden {
  display: none !important;
}

/* Ocultar iframe y fallback cuando el formulario esta activo */
.isn-contact-active #isnLeadFrame,
.isn-contact-active #isnLeadFallback {
  display: none !important;
}

@media(min-width:900px){
  .isn-nav{display:block}
  .isn-toggle{display:none}
  .isn-mobile-nav{display:none!important}
}
@media(max-width:899.98px){
  .isn-brand img{height:48px}
  .isn-brand-name{font-size:1.05rem}
}
@media(max-width:420px){
  .isn-brand-name{display:none}
}

.isn-mobile-sub a{padding-left:1.9rem;font-weight:500;font-size:.94rem;color:#4b5163}
.isn-mobile-sub a:hover{color:var(--isn-primary)}
.isn-mobile-nav .isn-btn{margin:.8rem 1.15rem 1.2rem;width:calc(100% - 2.3rem)}

.isn-submenu a:hover{background:#eef4fc;color:var(--isn-primary)}
.isn-submenu a.isn-active{color:var(--isn-primary);background:#eef4fc}
