/**
 * Nodoká · Design Tokens — Manual de Marca (20231010).
 * Pág.18 Paleta · Pág.19 Uso (secundarios = ACENTOS: viñetas/títulos/iconos/formas)
 * Pág.24 Tipografía Ubuntu · Pág.4/6/10 Isologo pin "á" · Pág.14 Espacio de respeto (1 letra a).
 */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/ubuntu-1.woff2') format('woff2');
}
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/ubuntu-6.woff2') format('woff2');
}
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/ubuntu-12.woff2') format('woff2');
}

:root {
  /* PRIMARIOS (pág.18) — fondos, figuras, tipografías */
  --ndk-rojo: #8E113F;
  --ndk-purpura: #561A44;
  /* SECUNDARIOS (pág.18/19) — ACENTOS: viñetas, subrayados, íconos, formas */
  --ndk-mostaza: #F9B32A;
  --ndk-cian: #91CCD1;

  --ndk-grad: linear-gradient(135deg, #8E113F 0%, #561A44 100%);
  --ndk-grad-rev: linear-gradient(135deg, #561A44 0%, #8E113F 100%);
  --ndk-rojo-soft: #f9ecf1;
  --ndk-purpura-soft: #f2ecf1;
  --ndk-mostaza-soft: #fef4e0;
  --ndk-cian-soft: #ecf6f8;

  --ndk-font: 'Ubuntu', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  --ndk-ink: #2b2340;
  --ndk-muted: #6b6480;
  --ndk-line: #e8e4ee;
  --ndk-bg: #f7f5fa;

  /* Semántica SOLO con colores de marca (sin verdes ni azules fuera de manual) */
  --ndk-ok: #561A44;        /* púrpura  */
  --ndk-ok-soft: #f2ecf1;
  --ndk-warn: #F9B32A;      /* mostaza  */
  --ndk-warn-soft: #fef4e0;
  --ndk-err: #8E113F;       /* rojo     */
  --ndk-err-soft: #f9ecf1;
}

/* ============ Modal Freemium (conversión) — identidad del manual ============ */
.ndk-premium-overlay {
  position: fixed;
  inset: 0;
  z-index: 999999;
  background: rgba(43, 35, 64, .68);
  backdrop-filter: blur(5px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  opacity: 0;
  visibility: hidden;
  transition: opacity .22s ease, visibility .22s ease;
}
.ndk-premium-overlay.is-open { opacity: 1; visibility: visible; }

.ndk-premium-modal {
  font-family: var(--ndk-font);
  width: 100%;
  max-width: 452px;
  background: #fff;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 34px 90px rgba(43, 35, 64, .42);
  transform: translateY(16px) scale(.97);
  transition: transform .22s ease;
}
.ndk-premium-overlay.is-open .ndk-premium-modal { transform: none; }

/* Cabecera: gradiente primario + pins isologo (mostaza + cian, pág.6/10) */
.ndk-premium-head {
  position: relative;
  background: var(--ndk-grad);
  color: #fff;
  padding: 28px 26px 24px;
  overflow: hidden;
}
.ndk-premium-head .ndk-pin {
  position: absolute;
  right: -20px;
  bottom: -34px;
  width: 132px;
  height: 132px;
  border-radius: 66px 66px 66px 10px;
  background: var(--ndk-mostaza);
}
.ndk-premium-head .ndk-pin-2 {
  position: absolute;
  right: 82px;
  bottom: -50px;
  width: 100px;
  height: 100px;
  border-radius: 50px 50px 50px 10px;
  background: var(--ndk-cian);
}
.ndk-premium-head .ndk-dots {
  position: absolute;
  left: 18px;
  bottom: 12px;
  width: 90px;
  height: 44px;
  background-image: radial-gradient(rgba(255,255,255,.55) 1.4px, transparent 1.4px);
  background-size: 11px 11px;
}
.ndk-premium-logo {
  height: 30px;
  width: auto;
  display: block;
  margin: 0 0 14px;
}
.ndk-premium-kicker {
  display: inline-block;
  background: var(--ndk-mostaza);
  color: var(--ndk-purpura);
  border-radius: 999px;
  padding: 5px 13px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  margin: 0 0 12px;
}
.ndk-premium-title {
  margin: 0;
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1.22;
  max-width: 15ch;
  color: #fff;
}

.ndk-premium-body { padding: 24px 26px 26px; }
.ndk-premium-lead {
  margin: 0 0 18px;
  color: var(--ndk-ink);
  font-size: 14.5px;
  line-height: 1.7;
}
.ndk-premium-lead strong { color: var(--ndk-rojo); }

.ndk-premium-feats { list-style: none; margin: 0 0 22px; padding: 0; }
.ndk-premium-feats li {
  position: relative;
  padding: 9px 0 9px 30px;
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--ndk-ink);
  border-bottom: 1px solid var(--ndk-line);
}
.ndk-premium-feats li:before {
  content: '\2713';
  position: absolute;
  left: 0;
  top: 9px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--ndk-cian);
  color: var(--ndk-purpura);
  font-size: 11px;
  font-weight: 700;
  line-height: 20px;
  text-align: center;
}

.ndk-premium-cta { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.ndk-premium-cta .ndk-btn-buy {
  flex: 1 1 200px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 15px 22px;
  border-radius: 12px;
  background: var(--ndk-grad);
  color: #fff;
  font-family: var(--ndk-font);
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  border: 0;
  cursor: pointer;
  box-shadow: 0 12px 26px rgba(142, 17, 63, .32);
  transition: transform .12s ease, box-shadow .12s ease;
}
.ndk-premium-cta .ndk-btn-buy:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 32px rgba(142, 17, 63, .4);
}
.ndk-premium-cta .ndk-btn-later {
  padding: 14px 18px;
  border-radius: 12px;
  background: #fff;
  border: 1.5px solid var(--ndk-line);
  color: var(--ndk-muted);
  font-family: var(--ndk-font);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
}
.ndk-premium-fine {
  margin: 14px 0 0;
  font-size: 11.5px;
  color: var(--ndk-muted);
  text-align: center;
}

/* Teaser premium: VISIBLE siempre (Catalina), bloqueado con modal */
.ndk-premium-locked { position: relative; }
.ndk-premium-locked > * { pointer-events: none; }
.ndk-premium-locked:hover { cursor: pointer; }
.ndk-premium-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: var(--ndk-mostaza);
  color: var(--ndk-purpura);
  font-family: var(--ndk-font);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
  border-radius: 999px;
  padding: 4px 11px;
  vertical-align: middle;
}
/* Los acentos premium SIEMPRE visibles (rol o login irrelevantes) */
.ndk-premium-featured {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

@media (max-width: 520px) {
  .ndk-premium-title { font-size: 1.3rem; }
  .ndk-premium-body { padding: 20px; }
}


/* ============ Resultado de compra (post-checkout) — diseño profesional ============ */
.ndk-result {
  font-family: var(--ndk-font);
  max-width: 560px;
  margin: 28px auto;
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 22px 54px rgba(85, 27, 68, .18);
}
.ndk-result-head {
  position: relative;
  background: var(--ndk-grad);
  color: #fff;
  padding: 30px 28px 26px;
  overflow: hidden;
}
.ndk-result-head .ndk-pin {
  position: absolute;
  right: -18px;
  bottom: -32px;
  width: 118px;
  height: 118px;
  border-radius: 59px 59px 59px 8px;
  background: var(--ndk-mostaza);
}
.ndk-result-head .ndk-pin-2 {
  position: absolute;
  right: 74px;
  bottom: -44px;
  width: 90px;
  height: 90px;
  border-radius: 45px 45px 45px 8px;
  background: var(--ndk-cian);
}
.ndk-result-logo { height: 28px; width: auto; display: block; margin: 0 0 16px; }
.ndk-result-icon {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .2);
  border: 1px solid rgba(255, 255, 255, .4);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 12px;
}
.ndk-result-title { margin: 0; font-size: 1.5rem; font-weight: 700; color: #fff !important; }
.ndk-result-body { padding: 24px 28px 28px; }
.ndk-result-text { margin: 0 0 14px; font-size: 14.5px; line-height: 1.7; color: var(--ndk-ink); }
.ndk-order {
  background: var(--ndk-bg);
  border: 1px solid var(--ndk-line);
  border-radius: 10px;
  padding: 11px 14px;
  font-size: 13px;
  color: var(--ndk-muted);
  margin: 0 0 18px;
}
.ndk-order code { color: var(--ndk-purpura); font-weight: 700; }
.ndk-result-cta { display: flex; flex-wrap: wrap; gap: 10px; }
.ndk-btn-buy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 24px;
  border-radius: 12px;
  background: var(--ndk-grad);
  color: #fff;
  font-family: var(--ndk-font);
  font-size: 14.5px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 10px 22px rgba(142, 17, 63, .28);
  border: 0;
  cursor: pointer;
}
.ndk-btn-later {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 13px 22px;
  border-radius: 12px;
  background: #fff;
  border: 1.5px solid var(--ndk-line);
  color: var(--ndk-muted);
  font-family: var(--ndk-font);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}

/* ============ Confirmación de downgrade (consecuencias) ============ */
.ndk-confirm-downgrade { border: 2px solid var(--ndk-mostaza); }
.ndk-ms-loses {
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}
.ndk-ms-loses li {
  position: relative;
  padding: 8px 0 8px 30px;
  font-size: 13.5px;
  color: var(--ndk-ink);
  border-bottom: 1px dashed var(--ndk-line);
}
.ndk-ms-loses li:before {
  content: '\2715';
  position: absolute;
  left: 2px;
  top: 8px;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: var(--ndk-rojo);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 19px;
  text-align: center;
}

/* Freemium Teaser — atractivo (QA r7, Manual de Marca):
   chip "Premium" mostaza integrado DENTRO de la esquina del elemento
   (no rompe la línea gráfica) + leve atenuación. Conversión, no castigo. */
.ndk-premium-locked {
	position: relative;
	opacity: .85;
	filter: saturate(.75);
	transition: opacity .18s ease, filter .18s ease;
}
.ndk-premium-locked::after {
	content: 'Premium';
	position: absolute;
	top: 3px;
	right: 4px;
	background: #F9B32A;
	color: #561A44;
	font-family: 'Ubuntu', sans-serif;
	font-weight: 700;
	font-size: 8px;
	letter-spacing: .05em;
	text-transform: uppercase;
	padding: 2px 5px;
	border-radius: 5px;
	line-height: 1.2;
	pointer-events: none;
}
.ndk-premium-locked:hover {
	opacity: 1;
	filter: saturate(1);
}