/* Nordik FX extra (fase 2B): contacto, gracias, 404 y blog.
   Se carga después de nordik-fx.css. Se engancha a data-nk con prefijo ct-, nf-, blog- y post-,
   y al ID CSS «ct-form» del formulario de contacto (widget Formulario clásico). */

/* ---------- cursor verde de los claims (contacto, blog, 404, gracias) ---------- */
body .elementor [data-nk="ct-claim"]::before,
body .elementor [data-nk="nf-claim"]::before {
  content: ""; position: absolute; left: 0; top: 0.14em;
  width: 0.09em; height: 0.82em; background: var(--green, #0eeed4);
}

/* ---------- runas dentro de los títulos grandes (van en un <span> sin clase) ---------- */
body .elementor [data-nk="ct-word"] > span:not(.nk-ch) {
  font-family: var(--nk-rune, "Noto Sans Runic"); font-style: normal; font-weight: 400;
  font-size: 0.92em; color: var(--green, #0eeed4);
}
body .elementor [data-nk="nf-code"] > span:not(.nk-ch) {
  font-family: var(--nk-rune, "Noto Sans Runic"); font-style: normal; font-weight: 400; color: var(--green, #0eeed4);
}
/* el código del 404 tiene altura fija: las runas no cambian la altura de la línea */
body .elementor [data-nk="nf-code"] .nk-ch,
body .elementor [data-nk="nf-code"] > span:not(.nk-ch) { display: inline-block; height: 0.82em; line-height: 0.82; vertical-align: top; overflow: visible; }
body .elementor [data-nk="nf-code"] .is-rune { line-height: 0.82; }
/* Gracias: la I verde es una letra normal, no una runa: misma fuente que el resto de la palabra */
body.page-id-2349 .elementor [data-nk="nf-code"] > span:not(.nk-ch) { font-family: inherit; font-weight: inherit; font-stretch: inherit; }

/* runa grande de la cabecera del blog, en contorno verde */
body .elementor [data-nk="blog-rune"] { -webkit-text-stroke: 1.5px rgba(14, 238, 212, 0.55); }

/* ---------- formulario de contacto ---------- */
/* Widget «Formulario» clásico de Elementor Pro (ID CSS «ct-form», clase «nk-ct-form»). Colores, tamaños, bordes
   y espacios van en los controles del widget; aquí solo las fuentes de marca y lo que los controles no hacen. */
#ct-form.nk-ct-form { align-self: start; color: var(--black, #1a1a1a); }
#ct-form.nk-ct-form .elementor-form { font-family: var(--f-body, "Hanken Grotesk"), sans-serif; }
#ct-form.nk-ct-form .elementor-field-label { font-family: var(--f-mono, "Roboto Mono"), monospace; }

/* «¿En qué podemos ayudarte?»: título, no etiqueta */
#ct-form.nk-ct-form .elementor-field-group-servicio { margin-bottom: 32px; }
#ct-form.nk-ct-form .elementor-field-group-servicio > .elementor-field-label {
  padding-bottom: 16px; font-family: var(--f-display, "Bricolage Grotesque"), sans-serif; font-weight: 700;
  font-size: clamp(1.4rem, 2vw, 1.9rem); line-height: 1.2; letter-spacing: -0.03em; text-transform: none; color: var(--black, #1a1a1a);
}

/* chips de servicio: la casilla queda escondida y su texto hace de botón */
#ct-form.nk-ct-form .elementor-field-group-servicio .elementor-field-subgroup { display: flex; flex-wrap: wrap; gap: 10px; width: 100%; }
#ct-form.nk-ct-form .elementor-field-group-servicio .elementor-field-option { position: relative; display: inline-flex; margin: 0; padding: 0; }
#ct-form.nk-ct-form .elementor-field-group-servicio input[type="checkbox"] {
  position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; pointer-events: none;
}
#ct-form.nk-ct-form .elementor-field-group-servicio .elementor-field-option label {
  display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 11px 16px; border-radius: 999px;
  border: 1.5px solid rgba(26, 26, 26, 0.2); font-family: var(--f-body, "Hanken Grotesk"), sans-serif; font-weight: 500;
  font-size: 15px; line-height: 1.6; letter-spacing: normal; text-transform: none; color: var(--black, #1a1a1a); cursor: pointer;
  transition: background 0.25s, border-color 0.25s, color 0.25s;
}
#ct-form.nk-ct-form .elementor-field-group-servicio .elementor-field-option:hover label { border-color: var(--black, #1a1a1a); }
#ct-form.nk-ct-form .elementor-field-group-servicio input:checked + label {
  background: var(--black, #1a1a1a); border-color: var(--black, #1a1a1a); color: var(--green, #0eeed4);
}
#ct-form.nk-ct-form .elementor-field-group-servicio input:checked + label::before {
  content: ""; width: 6px; height: 6px; background: var(--green, #0eeed4);
}
#ct-form.nk-ct-form .elementor-field-group-servicio input:focus-visible + label { outline: 2px solid var(--black, #1a1a1a); outline-offset: 3px; }

/* campos */
#ct-form.nk-ct-form .elementor-field-textual {
  min-height: 0; padding: 14px 16px; font-family: var(--f-body, "Hanken Grotesk"), sans-serif;
  transition: border-color 0.25s, box-shadow 0.25s;
}
#ct-form.nk-ct-form textarea.elementor-field-textual { min-height: 130px; resize: vertical; }
#ct-form.nk-ct-form .elementor-field-textual:focus {
  outline: none; border-color: var(--black, #1a1a1a); box-shadow: 0 0 0 4px rgba(14, 238, 212, 0.35);
}
#ct-form.nk-ct-form ::placeholder { color: rgba(26, 26, 26, 0.42); opacity: 1; }

/* casilla de privacidad: la nativa, como el original */
#ct-form.nk-ct-form .elementor-field-group-privacidad { margin-top: 8px; }
#ct-form.nk-ct-form .elementor-field-group-privacidad .elementor-field-option { display: flex; align-items: flex-start; gap: 10px; }
#ct-form.nk-ct-form .elementor-field-group-privacidad input[type="checkbox"] {
  flex: none; width: 15px; height: 15px; margin: 3px 0 0; accent-color: var(--black, #1a1a1a); cursor: pointer;
}
#ct-form.nk-ct-form .elementor-field-group-privacidad label {
  margin: 0; font-size: 14px; line-height: 1.5; color: var(--on-light, rgba(26, 26, 26, 0.66)); cursor: pointer;
}
#ct-form.nk-ct-form .elementor-field-group-privacidad a { color: inherit; text-decoration: underline; }

/* errores de la validación de Elementor */
#ct-form.nk-ct-form .elementor-error .elementor-field-textual { border-color: #d6453d; }
#ct-form.nk-ct-form .elementor-field-group-privacidad.elementor-error label { color: #d6453d; }
#ct-form.nk-ct-form .elementor-message.elementor-help-inline { margin-top: 6px; font-size: 13px; line-height: 1.4; }
#ct-form.nk-ct-form .elementor-message::before { display: none; }
/* mensaje general (enviado o error), como la caja de estado del original */
#ct-form.nk-ct-form .elementor-message:not(.elementor-help-inline) {
  margin-top: 18px; padding: 14px 16px; border-radius: 10px; line-height: 1.5; text-align: left;
}
#ct-form.nk-ct-form .elementor-message-success:not(.elementor-help-inline) { background: var(--black, #1a1a1a); }
#ct-form.nk-ct-form .elementor-message-danger:not(.elementor-help-inline) { background: #f6dcda; }

/* botón enviar: K al final, como los «talk» */
#ct-form.nk-ct-form .elementor-field-type-submit { margin-top: 14px; }
#ct-form.nk-ct-form .elementor-button { min-height: 0; font-family: var(--f-display, "Bricolage Grotesque"), sans-serif; white-space: nowrap; }
#ct-form.nk-ct-form .elementor-button:active { transform: scale(0.97); }
#ct-form.nk-ct-form .elementor-button[disabled] { opacity: 0.6; cursor: progress; }
#ct-form.nk-ct-form .elementor-button-content-wrapper { display: inline-flex; align-items: center; gap: 0.5em; }
#ct-form.nk-ct-form .elementor-button-content-wrapper::after {
  content: ""; flex: none; width: 0.5em; height: 0.7em; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 290 393'%3E%3Cpath d='M2 2H83V208L185 72L248 120L180 213L288 338L228 390L83 225V390H2Z' fill='none' stroke='%23000' stroke-width='30'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 290 393'%3E%3Cpath d='M2 2H83V208L185 72L248 120L180 213L288 338L228 390L83 225V390H2Z' fill='none' stroke='%23000' stroke-width='30'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- 404 y gracias: todo en una pantalla, sin scroll ---------- */
html:has([data-nk="nf"]), body:has([data-nk="nf"]) { overflow: hidden; }
body:has([data-nk="nf"]) [data-nk="nf"] { min-height: 0 !important; height: calc(100svh - var(--nf-bar, 52px)); }
body:has([data-nk="nf"]) [data-nk="foot-green"] { display: none; }
body:has([data-nk="nf"]) [data-nk="foot-bar"] { padding-top: 14px; padding-bottom: 14px; }
body .elementor [data-nk="nf-rune"] { font-family: var(--nk-rune, "Noto Sans Runic"); color: var(--green, #0eeed4); transition: color 0.3s; }
body .elementor [data-nk="nf-path"]:hover [data-nk="nf-rune"] { color: var(--black, #1a1a1a); }
@media (max-width: 760px) {
  body:has([data-nk="nf"]) [data-nk="foot-bar"] { flex-direction: row; align-items: center; }
  body:has([data-nk="nf"]) [data-nk="foot-legal"], body:has([data-nk="nf"]) [data-nk="foot-social"] { display: none; }
}
/* en pantallas muy bajas (móvil apaisado) se deja hacer scroll */
@media (max-height: 520px) {
  html:has([data-nk="nf"]), body:has([data-nk="nf"]) { overflow: auto; }
  body:has([data-nk="nf"]) [data-nk="nf"] { height: auto; min-height: 100svh !important; }
}

/* títulos de entrada y archivo (widgets de tema): estrechos como los títulos de las páginas */
body .elementor [data-nk="post-hero"] .elementor-heading-title,
body .elementor [data-nk="blog-hero"] .elementor-heading-title { font-stretch: 75%; text-wrap: balance; }

/* ---------- blog: tarjetas ---------- */
/* el texto de las tarjetas va aquí: dentro del bucle Elementor no imprime el CSS propio de los widgets de tema */
body .elementor [data-nk="blog-card"] .elementor-widget-container > * { margin: 0; }
body .elementor [data-nk="blog-card"] [data-nk="blog-meta"] .elementor-widget {
  font-family: var(--f-mono, "Roboto Mono"), monospace; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  line-height: 1.6; color: var(--on-light-soft, rgba(26,26,26,0.42));
}
body .elementor [data-nk="blog-card"] [data-nk="blog-meta"] .elementor-widget:first-child { color: #0A6F65; }
body .elementor [data-nk="blog-card"] [data-nk="blog-card-title"] .elementor-widget {
  font-family: var(--f-display, "Bricolage Grotesque"), sans-serif; font-weight: 700; font-size: clamp(1.4rem, 1.9vw, 1.85rem);
  line-height: 1.12; letter-spacing: -0.03em; color: var(--black, #1a1a1a); text-wrap: balance;
}
body .elementor [data-nk="blog-card"] > * > .elementor-widget-theme-post-excerpt {
  margin-top: 12px; font-size: 16px; line-height: 1.55; color: var(--on-light, rgba(26,26,26,0.66));
}
body .elementor [data-nk="blog-card"] img { transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1); }
body .elementor [data-nk="blog-card"]:hover img { transform: scale(1.05); }
body .elementor [data-nk="blog-card-media"] .elementor-widget-container,
body .elementor [data-nk="blog-card-media"] .elementor-widget { height: 100%; }
body .elementor [data-nk="blog-card"] h1,
body .elementor [data-nk="blog-card"] .elementor-heading-title { font-size: inherit; }
body .elementor [data-nk="blog-card"] [data-nk="blog-read"] svg { transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1); }
body .elementor [data-nk="blog-card"]:hover [data-nk="blog-read"] svg { transform: translateX(5px); fill: var(--green, #0eeed4); }
/* la categoría y la fecha son párrafos del widget extracto */
body .elementor [data-nk="blog-meta"] p { margin: 0; }
body .elementor [data-nk="blog-meta"] a { color: inherit; }
/* sin imagen destacada: el hueco queda negro con la K */
body .elementor [data-nk="blog-card-media"]:not(:has(img))::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 34px; height: 46px; translate: -50% -50%;
  background: var(--green, #0eeed4);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 290 393'%3E%3Cpath d='M2 2H83V208L185 72L248 120L180 213L288 338L228 390L83 225V390H2Z' fill='none' stroke='%23000' stroke-width='22'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 290 393'%3E%3Cpath d='M2 2H83V208L185 72L248 120L180 213L288 338L228 390L83 225V390H2Z' fill='none' stroke='%23000' stroke-width='22'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* paginación: se esconde el botón que no lleva a ningún sitio */
body .elementor [data-nk="blog-page-btn"]:not([href]),
body .elementor [data-nk="blog-page-btn"][aria-disabled="true"],
body .elementor [data-nk="blog-page-btn"].is-disabled { opacity: 0.35; pointer-events: none; }

/* ---------- entrada: texto ---------- */
body .elementor [data-nk="post-img"] img,
body .elementor [data-nk="post-media"] img { display: block; margin: 0 auto; }
body .elementor [data-nk="post-content"] > * + * { margin-top: 0; }
body .elementor [data-nk="post-content"] :is(p, ul, ol, blockquote, figure, pre, table) { margin: 0 0 1.15em; }
body .elementor [data-nk="post-content"] :is(h2, h3, h4) {
  margin: 1.8em 0 0.6em; font-family: var(--f-display, "Bricolage Grotesque"), sans-serif; font-weight: 700;
  line-height: 1.1; letter-spacing: -0.03em; color: var(--black, #1a1a1a); text-wrap: balance;
}
body .elementor [data-nk="post-content"] h2 { font-size: clamp(1.8rem, 3vw, 2.5rem); }
body .elementor [data-nk="post-content"] h3 { font-size: clamp(1.4rem, 2.2vw, 1.8rem); }
body .elementor [data-nk="post-content"] h4 { font-size: 1.2rem; }
body .elementor [data-nk="post-content"] a {
  color: inherit; text-decoration: underline; text-decoration-color: var(--green, #0eeed4);
  text-decoration-thickness: 2px; text-underline-offset: 0.25em; transition: text-underline-offset 0.3s;
}
body .elementor [data-nk="post-content"] a:hover { text-underline-offset: 0.4em; }
body .elementor [data-nk="post-content"] :is(ul, ol) { padding-left: 1.3em; }
body .elementor [data-nk="post-content"] li { margin-bottom: 0.4em; }
body .elementor [data-nk="post-content"] li::marker { color: #0A6F65; }
body .elementor [data-nk="post-content"] blockquote {
  position: relative; padding: 0.2em 0 0.2em 1.1em; border-left: 0.2em solid var(--green, #0eeed4);
  font-family: var(--f-display, "Bricolage Grotesque"), sans-serif; font-weight: 700; font-size: 1.35em;
  line-height: 1.25; letter-spacing: -0.02em;
}
body .elementor [data-nk="post-content"] blockquote p:last-child { margin-bottom: 0; }
body .elementor [data-nk="post-content"] img { max-width: 100%; height: auto; border-radius: 14px; }
body .elementor [data-nk="post-content"] figcaption { margin-top: 0.6em; font-size: 14px; color: var(--on-light, rgba(26,26,26,0.66)); }
body .elementor [data-nk="post-content"] code {
  padding: 0.1em 0.35em; border-radius: 6px; background: var(--tint-light, rgba(26,26,26,0.06));
  font-family: var(--f-mono, "Roboto Mono"), monospace; font-size: 0.88em;
}
body .elementor [data-nk="post-content"] pre { padding: 1em 1.2em; overflow-x: auto; border-radius: 12px; background: var(--black, #1a1a1a); color: var(--cream, #f4f1ec); }
body .elementor [data-nk="post-content"] pre code { padding: 0; background: none; color: inherit; }
body .elementor [data-nk="post-content"] hr { margin: 2.4em 0; border: 0; border-top: 1px solid var(--line-light, rgba(26,26,26,0.12)); }
body .elementor [data-nk="post-share-link"].is-copied { background: var(--black, #1a1a1a); border-color: var(--black, #1a1a1a); color: var(--green, #0eeed4); }

/* ---------- portada: el hero y la cinta verde caben juntos en la primera pantalla ---------- */
:root { --nk-band-h: calc(26px + 1.2 * clamp(18px, 1.7vw, 26px)); }
body .elementor [data-nk="hero"] { min-height: calc(100svh - var(--nk-band-h)); }

/* con la sesión iniciada, la barra de WordPress no tapa el menú ni empuja la cinta fuera de pantalla */
body.admin-bar [data-nk="nav"] { top: calc(14px + 32px); }
body.admin-bar .elementor [data-nk="hero"] { min-height: calc(100svh - 32px - var(--nk-band-h)); }
@media (max-width: 782px) {
  body.admin-bar [data-nk="nav"] { top: calc(14px + 46px); }
  body.admin-bar .elementor [data-nk="hero"] { min-height: calc(100svh - 46px - var(--nk-band-h)); }
}
