:root{
  --brand: #1aa6a6;      /* turquesa */
  --brand-dark:#0b3c5d;  /* azul profundo */
  --ink: #0f172a;
  --muted:#475569;
}

body { color: var(--ink); }
.text-muted { color: var(--muted) !important; }

.btn-primary{
  --bs-btn-bg: var(--brand);
  --bs-btn-border-color: var(--brand);
  --bs-btn-hover-bg: #148d8d;
  --bs-btn-hover-border-color: #148d8d;
}

.text-brand{ color: var(--brand-dark); }
.bg-soft{
  background: linear-gradient(180deg, rgba(26,166,166,.12), rgba(11,60,93,.06));
}
.card-soft{
  border: 0;
  border-radius: 1rem;
  box-shadow: 0 14px 30px rgba(2,8,23,.08);
}
.rounded-xxl{ border-radius: 1.25rem; }
.badge-soft{
  background: rgba(26,166,166,.14);
  color: var(--brand-dark);
}
.navbar-brand{
  letter-spacing: .4px;
}
.section{
  padding: clamp(2rem, 4vw, 4rem) 0;
}

/* Contenedor del tooltip */
.tooltip-wrap{
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: not-allowed;
}

/* Mensaje oculto por defecto */
.tooltip-msg{
  position: absolute;
  bottom: 125%;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;

  background: rgba(168,218,220,.85); /* verde pastel */
  color: rgba(29,53,87,.95);
  font-size: .7rem;
  font-weight: 600;

  padding: .35rem .55rem;
  border-radius: 8px;
  border: 1px solid rgba(29,53,87,.15);
  box-shadow: 0 10px 25px rgba(2,8,23,.12);

  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
}

/* Flechita */
.tooltip-msg::after{
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 6px;
  border-style: solid;
  border-color: rgba(168,218,220,.85) transparent transparent transparent;
}

/* Hover (desktop) */
.tooltip-wrap:hover .tooltip-msg{
  opacity: 1;
  transform: translateX(-50%) translateY(-4px);
}

/* Focus (click / teclado / móvil) */
.tooltip-wrap:focus .tooltip-msg{
  opacity: 1;
  transform: translateX(-50%) translateY(-4px);
}

/* Links apagados */
.disabled-link{
  color: var(--muted);
  opacity: .7;
}

/* Link activo */
.active-link{
  font-weight: 700;
  color: var(--deep);
  border-bottom: 2px solid var(--primary);
  padding-bottom: 2px;
}


/* Contenedor del tooltip */
.tooltip-wrap{
  position: relative;
}

/* Texto apagado */
.disabled-link{
  color: var(--muted) !important;
  cursor: not-allowed;
}

/* Botón apagado */
.disabled-btn{
  opacity: .75;
  cursor: not-allowed;
}

/* Tooltip oculto por defecto */
.tooltip-msg{
  position: absolute;
  bottom: 130%;
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  white-space: nowrap;

  background: rgba(168,218,220,.95); /* verde pastel */
  color: rgba(29,53,87,.95);
  font-size: .7rem;
  font-weight: 600;

  padding: .35rem .6rem;
  border-radius: 8px;
  border: 1px solid rgba(29,53,87,.15);
  box-shadow: 0 10px 25px rgba(2,8,23,.15);

  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
  z-index: 1050;
}

/* Flecha */
.tooltip-msg::after{
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 6px;
  border-style: solid;
  border-color: rgba(168,218,220,.95) transparent transparent transparent;
}

/* Hover (mouse) */
.tooltip-wrap:hover .tooltip-msg{
  opacity: 1;
  transform: translateX(-50%) translateY(-4px);
}

/* Focus (click / teclado / móvil) */
.tooltip-wrap:focus-within .tooltip-msg{
  opacity: 1;
  transform: translateX(-50%) translateY(-4px);
}