/*
 * PremierNetwork · Precisión 3.1
 * Sistema visual sobrio para una marca tecnológica premium.
 */

@font-face {
  font-family: "Space Grotesk";
  src: url("../assets/fonts/SpaceGrotesk-Variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
}

@font-face {
  font-family: "JetBrains Mono";
  src: url("../assets/fonts/JetBrainsMono-Variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
}

:root {
  --pn-interactive: #f3263a;
  --pn-interactive-hover: #cf172a;
  --pn-bg: #050505;
  --pn-surface: #0a0a0b;
  --pn-surface-raised: #111113;
  --pn-outline: #252528;
  --pn-outline-strong: #3b3b40;
  --pn-text: #f5f7fa;
  --pn-text-muted: #a5adba;
  --pn-text-faint: #727986;
  --pn-font-display: "Space Grotesk", "Arial Narrow", Arial, sans-serif;
  --pn-font-body: "Segoe UI", Arial, sans-serif;
  --pn-font-data: "JetBrains Mono", Consolas, monospace;
  --pn-max: 1440px;
  --red: var(--pn-interactive);
  --red-dark: var(--pn-interactive-hover);
  --red-glow: rgba(243, 38, 58, .1);
  --bg: var(--pn-bg);
  --bg2: var(--pn-surface);
  --bg3: var(--pn-surface-raised);
  --surface: var(--pn-surface);
  --surface2: var(--pn-surface-raised);
  --border: var(--pn-outline);
  --border-red: var(--pn-interactive);
  --text: var(--pn-text);
  --text2: var(--pn-text-muted);
  --text3: var(--pn-text-faint);
  --font-head: var(--pn-font-display);
  --font-body: var(--pn-font-body);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: hidden;
  background: var(--pn-bg);
  color: var(--pn-text);
  font-family: var(--pn-font-body);
  font-size: 16px;
  line-height: 1.6;
  text-rendering: optimizeLegibility;
}
body::before {
  content: none;
}
img { max-width: 100%; height: auto; }
a { color: var(--pn-interactive); }
a, button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--pn-text);
  outline-offset: 4px;
}
::selection { background: var(--pn-interactive); color: #fff; }

.pn-skip-link {
  position: fixed;
  left: 1rem;
  top: -6rem;
  z-index: 99999;
  padding: .8rem 1rem;
  background: var(--pn-text);
  color: var(--pn-bg);
  font-weight: 700;
  text-decoration: none;
}
.pn-skip-link:focus { top: 1rem; }
#pn-content { padding-top: 0; }

/* Cabecera */
.pn-site-header { position: sticky; top: 0; z-index: 1000; background: rgba(5,5,5,.94); border-bottom: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(18px); }
.admin-bar .pn-site-header { top: 32px; }
.pn-nav {
  position: relative;
  inset: auto;
  display: grid;
  grid-template-columns: minmax(230px, 1fr) auto;
  align-items: center;
  min-height: 82px;
  padding: 0 max(24px, calc((100vw - var(--pn-max)) / 2));
  background: transparent;
}
.pn-brand-lockup { display: flex; align-items: center; }
.pn-nav-logo, .pn-footer-brand-logo {
  color: var(--pn-text);
  font-family: var(--pn-font-display);
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -.03em;
  text-decoration: none;
}
.pn-nav-logo span, .pn-footer-brand-logo span { color: var(--pn-interactive); }
.custom-logo-link { display: flex; align-items: center; }
.custom-logo { width: auto; max-height: 42px; }
.pn-nav-links { display: flex; align-items: center; gap: 34px; margin: 0; padding: 0; list-style: none; }
.pn-nav-links li { display: flex; align-items: center; }
.pn-nav-links a {
  display: flex;
  align-items: center;
  padding: 10px 0;
  color: var(--pn-text-muted);
  font-family: var(--pn-font-display);
  font-size: .78rem;
  font-weight: 520;
  letter-spacing: .02em;
  text-decoration: none;
  transition: color 180ms ease;
}
.pn-nav-links a:hover, .pn-nav-links .current-menu-item > a, .pn-nav-links .current_page_item > a { color: var(--pn-text); }
.pn-nav-links .pn-nav-cta { padding: 11px 20px !important; background: var(--pn-interactive) !important; color: #fff !important; border-radius: 3px; }
.pn-nav-links > li:last-child > a { padding: 11px 20px; background: var(--pn-interactive); color: #fff; border-radius: 3px; }
.pn-nav-links .pn-nav-cta:hover { background: var(--pn-interactive-hover) !important; }
.pn-mobile-btn { display: none; align-self: center; justify-self: end; width: 48px; height: 48px; padding: 12px; border: 1px solid var(--pn-outline); background: transparent; cursor: pointer; }
.pn-mobile-btn span { display: block; width: 100%; height: 1px; margin: 5px 0; background: var(--pn-text); border-radius: 0; }
.pn-mobile-menu { position: fixed; inset: 82px 0 auto; z-index: 999; padding: 0 24px 24px; background: #050505; border-bottom: 1px solid var(--pn-outline); }
.pn-mobile-menu.open { display: flex; flex-direction: column; }
.pn-mobile-menu a { padding: 16px 0; border-bottom: 1px solid var(--pn-outline); color: var(--pn-text); font-family: var(--pn-font-data); font-size: .75rem; letter-spacing: .07em; text-decoration: none; text-transform: uppercase; }
.pn-mobile-menu .pn-mobile-cta { margin-top: 20px; padding: 14px; background: var(--pn-interactive); color: #fff; text-align: center; }
.pn-menu-open { overflow: hidden; }

/* Componentes */
.pn-btn {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 13px 22px;
  border: 1px solid var(--pn-outline-strong);
  border-radius: 0;
  font-family: var(--pn-font-data);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  line-height: 1.2;
  text-decoration: none;
  text-transform: uppercase;
  transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease, transform 140ms ease;
}
.pn-btn-primary { border-color: var(--pn-interactive); background: var(--pn-interactive); color: #fff; }
.pn-btn-primary:hover { border-color: var(--pn-interactive-hover); background: var(--pn-interactive-hover); color: #fff; transform: translateY(-2px); }
.pn-btn-secondary, .pn-btn-ghost { background: transparent; color: var(--pn-text); }
.pn-btn-secondary:hover, .pn-btn-ghost:hover { border-color: var(--pn-text-muted); background: var(--pn-surface-raised); color: var(--pn-text); }
.pn-text-link { display: inline-flex; align-items: center; gap: 12px; color: var(--pn-text); font-family: var(--pn-font-data); font-size: .72rem; font-weight: 600; letter-spacing: .05em; text-decoration: none; text-transform: uppercase; }
.pn-text-link:hover { color: var(--pn-interactive); }
.se-kicker, .pn-eyebrow, .pn-page-tag, .pn-section-tag {
  margin: 0 0 18px;
  color: var(--pn-interactive);
  font-family: var(--pn-font-data);
  font-size: .69rem;
  font-weight: 600;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.pn-page-tag { padding: 0; border: 0; }
.pn-page-tag::before { display: none; }

/* Inicio */
.se-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(410px, .8fr);
  width: min(calc(100% - 48px), 1360px);
  min-height: 650px;
  margin: 0 auto;
  border-bottom: 1px solid var(--pn-outline);
}
.se-hero-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(76px, 8vw, 118px) clamp(28px, 5.2vw, 76px) clamp(70px, 7vw, 104px) 0; }
.se-hero h1 { max-width: 760px; margin: 0; font-family: var(--pn-font-display); font-size: clamp(3rem, 4.45vw, 4.8rem); font-weight: 500; letter-spacing: -.047em; line-height: 1.01; text-wrap: balance; }
.se-hero h1 span { display: block; color: #c7c9ce; }
.se-hero h1::after { content: ""; display: block; width: 52px; height: 3px; margin-top: 30px; background: var(--pn-interactive); }
.se-lead { max-width: 650px; margin: 28px 0 0; color: var(--pn-text-muted); font-size: clamp(1rem, 1.25vw, 1.16rem); line-height: 1.7; }
.se-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 30px; margin-top: 34px; }
.se-hero-facts { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 700px; margin: 56px 0 0; }
.se-hero-facts div { padding: 0 18px; border-left: 1px solid var(--pn-outline-strong); }
.se-hero-facts div:first-child { padding-left: 0; border-left: 0; }
.se-hero-facts dt { color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .6rem; letter-spacing: .08em; text-transform: uppercase; }
.se-hero-facts dd { margin: 7px 0 0; color: var(--pn-text); font-size: .78rem; }
.se-topology { align-self: center; display: grid; grid-template-rows: auto 1fr auto; min-width: 0; min-height: 550px; margin: 48px 0; border: 1px solid var(--pn-outline); background: var(--pn-surface); }
.se-panel-head, .se-panel-foot, .pn-footer-index { display: flex; justify-content: space-between; gap: 20px; padding: 12px 18px; border-bottom: 1px solid var(--pn-outline); color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .58rem; letter-spacing: .08em; }
.se-panel-foot { border-top: 1px solid var(--pn-outline); border-bottom: 0; }
.se-network-flow { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 474px; padding: 28px 32px; background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px); background-size: 48px 48px; }
.se-flow-node { position: relative; z-index: 2; width: min(76%, 290px); padding: 12px 16px 13px; border: 1px solid var(--pn-outline-strong); background: #080809; }
.se-flow-node span, .se-flow-observability span { display: block; margin-bottom: 5px; color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .56rem; letter-spacing: .08em; }
.se-flow-node strong, .se-flow-observability strong { display: block; color: var(--pn-text); font-family: var(--pn-font-display); font-size: .77rem; font-weight: 550; letter-spacing: .01em; }
.se-flow-node small, .se-flow-observability small { display: block; margin-top: 3px; color: var(--pn-text-faint); font-size: .62rem; }
.se-flow-security { border-color: #55565d; }
.se-flow-core { border-color: var(--pn-interactive); }
.se-flow-connector { display: block; width: 1px; height: 16px; background: var(--pn-outline-strong); }
.se-flow-branch { position: relative; width: 100%; height: 22px; }
.se-flow-branch::before { content: ""; position: absolute; top: 0; left: 25%; width: 50%; height: 1px; background: var(--pn-outline-strong); }
.se-flow-branch::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent calc(25% - .5px), var(--pn-outline-strong) calc(25% - .5px), var(--pn-outline-strong) calc(25% + .5px), transparent calc(25% + .5px), transparent calc(75% - .5px), var(--pn-outline-strong) calc(75% - .5px), var(--pn-outline-strong) calc(75% + .5px), transparent calc(75% + .5px)); }
.se-flow-leaves { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; width: 100%; }
.se-flow-leaves .se-flow-node { width: 100%; }
.se-flow-observability { width: 100%; margin-top: 16px; padding: 10px 14px; border-top: 1px solid var(--pn-outline); text-align: center; }
.se-flow-observability span { display: inline; margin: 0 8px 0 0; }
.se-flow-observability strong { display: inline; }
.se-flow-observability small { margin-top: 2px; }
.se-capability-strip { display: grid; grid-template-columns: repeat(5, 1fr); width: min(calc(100% - 48px), 1360px); margin: 0 auto; border-bottom: 1px solid var(--pn-outline); }
.se-capability-strip span { padding: 18px; border-right: 1px solid var(--pn-outline); color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .64rem; letter-spacing: .08em; text-align: center; text-transform: uppercase; }
.se-capability-strip span:last-child { border-right: 0; }
.se-section { width: min(calc(100% - 48px), 1360px); margin: 0 auto; padding: clamp(76px, 8vw, 112px) clamp(12px, 4vw, 56px); border-bottom: 1px solid var(--pn-outline); }
.se-section-head { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(280px, .7fr); gap: 8vw; align-items: end; margin-bottom: 60px; }
.se-section h2, .se-final-cta h2 { margin: 0; font-family: var(--pn-font-display); font-size: clamp(2.2rem, 4vw, 4rem); font-weight: 500; letter-spacing: -.045em; line-height: 1.04; }
.se-section-head > p, .se-proof-intro > p, .se-final-cta > div > p { max-width: 560px; margin: 0; color: var(--pn-text-muted); }
.se-bento { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: minmax(250px, auto); border-top: 1px solid var(--pn-outline); border-left: 1px solid var(--pn-outline); }
.se-service { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 260px; padding: 30px; border-right: 1px solid var(--pn-outline); border-bottom: 1px solid var(--pn-outline); background: var(--pn-surface); color: var(--pn-text); text-decoration: none; transition: background-color 180ms ease, border-color 180ms ease; }
.se-service:hover { border-color: var(--pn-outline-strong); background: var(--pn-surface-raised); color: var(--pn-text); }
.se-service:hover p, .se-service:hover .se-code { color: var(--pn-text-muted); }
.se-service:hover .se-index { color: var(--pn-interactive); }
.se-service-network { grid-column: span 2; min-height: 340px; }
.se-service-security { grid-row: span 2; }
.se-service-monitor { grid-column: span 1; }
.se-service-support { grid-column: span 2; }
.se-index { color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .7rem; }
.se-service h3 { max-width: 540px; margin: 10px 0 12px; font-family: var(--pn-font-display); font-size: clamp(1.5rem, 2.4vw, 2.3rem); font-weight: 500; letter-spacing: -.035em; line-height: 1.06; }
.se-service p { max-width: 560px; margin: 0; color: var(--pn-text-muted); }
.se-code { color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }
.se-arrow { position: absolute; right: 24px; top: 20px; font-size: 1.25rem; }
.se-observability { display: grid; grid-template-columns: 2fr 1fr; padding: 0; }
.se-evidence { padding: clamp(76px, 8vw, 120px) clamp(24px, 5vw, 72px); border-right: 1px solid var(--pn-outline); }
.se-evidence h2 { max-width: 800px; }
.se-signal-map { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 72px; border-top: 1px solid var(--pn-outline); border-left: 1px solid var(--pn-outline); }
.se-signal-map > div { position: relative; min-height: 190px; padding: 22px; border-right: 1px solid var(--pn-outline); border-bottom: 1px solid var(--pn-outline); }
.se-signal-map > div:not(:last-child)::after { content: "→"; position: absolute; right: -11px; top: 50%; z-index: 2; padding: 2px; background: var(--pn-bg); color: var(--pn-interactive); font-family: var(--pn-font-data); transform: translateY(-50%); }
.se-signal-map span, .se-method-grid span { color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .65rem; }
.se-signal-map strong { display: block; margin-top: 48px; font-family: var(--pn-font-display); font-size: 1.2rem; }
.se-signal-map small { display: block; margin-top: 8px; color: var(--pn-text-faint); }
.se-status-panel { display: flex; flex-direction: column; background: var(--pn-surface); }
.se-status-main { display: flex; align-items: center; gap: 18px; padding: 34px 24px; border-bottom: 1px solid var(--pn-outline); }
.se-status-symbol { display: grid; width: 44px; height: 44px; place-items: center; border: 1px solid var(--pn-interactive); color: var(--pn-interactive); font-family: var(--pn-font-data); }
.se-status-main small { display: block; color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .6rem; letter-spacing: .07em; text-transform: uppercase; }
.se-status-main strong { display: block; margin-top: 3px; font-family: var(--pn-font-display); font-size: 1.45rem; }
.se-status-panel dl { margin: 0; }
.se-status-panel dl div { padding: 20px 24px; border-bottom: 1px solid var(--pn-outline); }
.se-status-panel dt { color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .6rem; letter-spacing: .08em; text-transform: uppercase; }
.se-status-panel dd { margin: 5px 0 0; color: var(--pn-text); font-size: .86rem; }
.se-status-note { margin: auto 0 0; padding: 24px; color: var(--pn-text-faint); font-size: .74rem; }
.se-method { background: var(--pn-surface); }
.se-method-grid { display: grid; grid-template-columns: 1.15fr 1fr 1.15fr 1fr 1.15fr; margin: 0; padding: 0; border-top: 1px solid var(--pn-outline); border-left: 1px solid var(--pn-outline); list-style: none; }
.se-method-grid li { min-height: 240px; padding: 24px; border-right: 1px solid var(--pn-outline); border-bottom: 1px solid var(--pn-outline); }
.se-method-grid h3 { margin: 74px 0 10px; font-family: var(--pn-font-display); font-size: 1.35rem; font-weight: 550; }
.se-method-grid p { margin: 0; color: var(--pn-text-muted); font-size: .86rem; }
.se-proof { display: grid; grid-template-columns: minmax(280px, .8fr) minmax(0, 1.7fr); gap: 8vw; }
.se-proof-intro h2 { margin-bottom: 26px; font-size: clamp(2.4rem, 4vw, 4.3rem); }
.se-proof-intro .pn-text-link { margin-top: 30px; }
.se-proof-list { border-top: 1px solid var(--pn-outline); }
.se-proof-list article { display: grid; grid-template-columns: 120px 1fr 1fr; gap: 24px; align-items: start; padding: 26px 0; border-bottom: 1px solid var(--pn-outline); }
.se-proof-list span { color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .62rem; }
.se-proof-list h3 { margin: 0; font-family: var(--pn-font-display); font-size: 1.25rem; }
.se-proof-list p { margin: 0; color: var(--pn-text-muted); font-size: .88rem; }
.se-journal { background: var(--pn-surface); }
.se-post-grid { display: grid; grid-template-columns: 1.3fr .85fr .85fr; border-top: 1px solid var(--pn-outline); border-left: 1px solid var(--pn-outline); }
.se-post { display: flex; flex-direction: column; min-height: 330px; padding: 26px; border-right: 1px solid var(--pn-outline); border-bottom: 1px solid var(--pn-outline); }
.se-post h3 { margin: 40px 0 16px; font-family: var(--pn-font-display); font-size: clamp(1.35rem, 2.2vw, 2.1rem); line-height: 1.1; }
.se-post h3 a { color: var(--pn-text); text-decoration: none; }
.se-post h3 a:hover { color: var(--pn-interactive); }
.se-post > p:not(.se-code) { margin: 0 0 30px; color: var(--pn-text-muted); }
.se-post .pn-text-link { margin-top: auto; }
.se-empty { display: flex; justify-content: space-between; gap: 20px; padding: 30px; border: 1px solid var(--pn-outline); color: var(--pn-text-muted); }
.se-empty strong { color: var(--pn-text); }
.se-final-cta { display: grid; grid-template-columns: .35fr 1.65fr 1fr; gap: 5vw; width: min(calc(100% - 48px), 1360px); margin: 0 auto; padding: clamp(72px, 8vw, 112px) clamp(12px, 4vw, 56px); border-bottom: 1px solid var(--pn-outline); }
.se-final-cta h2 { font-size: clamp(2.3rem, 4vw, 4rem); }
.se-final-cta .pn-btn { margin-top: 32px; }

/* Páginas interiores y componentes heredados */
.pn-page-hero {
  position: relative;
  width: min(calc(100% - 48px), 1360px);
  margin: 0 auto;
  padding: clamp(74px, 9vw, 130px) clamp(24px, 6vw, 88px);
  overflow: hidden;
  border-bottom: 1px solid var(--pn-outline);
  background: var(--pn-bg);
}
.pn-page-hero::after { content: ""; position: absolute; right: 6%; top: 50%; width: 72px; height: 3px; background: var(--pn-interactive); pointer-events: none; }
.pn-page-hero-grid, .pn-page-hero-glow { display: none; }
.pn-page-hero-content { position: relative; z-index: 1; max-width: 940px; }
.pn-breadcrumb { display: flex; gap: 10px; margin: 0 0 34px; color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .66rem; letter-spacing: .07em; text-transform: uppercase; }
.pn-breadcrumb a { color: var(--pn-text-faint); text-decoration: none; }
.pn-breadcrumb a:hover, .pn-breadcrumb span { color: var(--pn-interactive); }
.pn-page-hero h1 { max-width: 900px; margin: 0 0 24px; font-family: var(--pn-font-display); font-size: clamp(2.65rem, 4.5vw, 4.75rem); font-weight: 500; letter-spacing: -.047em; line-height: 1.02; }
.pn-page-hero p, .pn-page-hero-sub { max-width: 720px; margin: 0; color: var(--pn-text-muted); font-size: clamp(1rem, 1.5vw, 1.2rem); line-height: 1.65; }
.pn-section { width: min(calc(100% - 48px), 1360px); margin: 0 auto; padding: clamp(66px, 8vw, 104px) clamp(12px, 4vw, 56px); border-bottom: 1px solid var(--pn-outline); background: var(--pn-bg); }
.pn-section-dark, .pn-section-mid { background: var(--pn-surface); }
.pn-section-heading { margin-bottom: 48px; }
.pn-section-title, .pn-section-heading h2 { max-width: 900px; margin: 0 0 16px; font-family: var(--pn-font-display); font-size: clamp(2rem, 3.5vw, 3.65rem); font-weight: 500; letter-spacing: -.042em; line-height: 1.04; }
.pn-section-sub { max-width: 650px; margin: 0 0 40px; color: var(--pn-text-muted); font-size: 1rem; }
.pn-two-col { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr); gap: clamp(40px, 8vw, 120px); }
.pn-feat-grid, .pn-topic-grid, .pn-case-grid, .pn-profile-grid, .pn-blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid var(--pn-outline); border-left: 1px solid var(--pn-outline); }
.pn-feat-card, .pn-topic-card, .pn-case-card, .pn-profile-card, .pn-blog-card, .pn-tech-card, .testimonial-card {
  padding: 26px;
  border: 0;
  border-right: 1px solid var(--pn-outline);
  border-bottom: 1px solid var(--pn-outline);
  border-radius: 0;
  background: var(--pn-surface);
  box-shadow: none;
  text-align: left;
}
.pn-feat-card:hover, .pn-topic-card:hover, .pn-case-card:hover, .pn-profile-card:hover, .pn-blog-card:hover { border-color: var(--pn-outline); background: var(--pn-surface-raised); transform: none; }
.pn-feat-card h3, .pn-topic-card h3, .pn-case-card h3, .pn-profile-card h3, .pn-blog-card h3 { margin: 0 0 12px; font-family: var(--pn-font-display); font-size: 1.3rem; }
.pn-feat-card p, .pn-topic-card p, .pn-case-card p, .pn-profile-card p, .pn-blog-card p { color: var(--pn-text-muted); }
.pn-feat-icon, .why-feature-icon, .service-icon { width: auto; height: auto; margin-bottom: 28px; border: 0; border-radius: 0; }
.pn-feat-icon svg, .why-feature-icon svg, .service-icon svg { width: 24px; height: 24px; stroke: var(--pn-text-faint); }
.pn-case-industry, .pn-blog-cat, .pn-profile-role, .pn-spec-label { color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .63rem; letter-spacing: .08em; text-transform: uppercase; }
.pn-process-grid { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--pn-outline); }
.pn-process-item { min-height: 210px; padding: 24px; border-right: 1px solid var(--pn-outline); background: var(--pn-surface); }
.pn-process-num { color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .7rem; opacity: 1; }
.pn-spec-grid { gap: 0; border: 1px solid var(--pn-outline); background: transparent; }
.pn-spec-item { border-right: 1px solid var(--pn-outline); border-bottom: 1px solid var(--pn-outline); background: var(--pn-surface); }
.pn-tech-badge { border: 1px solid var(--pn-outline-strong); border-radius: 0; background: transparent; color: var(--pn-text); }
.pn-cta, .cta-section {
  width: min(calc(100% - 48px), 1360px);
  margin: 0 auto;
  padding: clamp(64px, 8vw, 108px) clamp(24px, 6vw, 88px);
  border-bottom: 1px solid var(--pn-outline);
  background: var(--pn-surface);
  text-align: left;
}
.pn-cta h2, .cta-section h2 { max-width: 900px; margin: 0 0 22px; font-family: var(--pn-font-display); font-size: clamp(2.2rem, 3.8vw, 3.85rem); font-weight: 500; letter-spacing: -.045em; line-height: 1.04; }

/* Plantillas de servicio heredadas, normalizadas al nuevo sistema */
.page-hero {
  position: relative;
  width: min(calc(100% - 48px), 1360px);
  margin: 0 auto;
  padding: clamp(74px, 9vw, 130px) clamp(24px, 6vw, 88px);
  overflow: hidden;
  border-bottom: 1px solid var(--pn-outline);
  background: var(--pn-bg);
}
.page-hero-grid { display: none; }
.page-hero-glow { display: none; }
.page-hero-content { position: relative; z-index: 1; max-width: 940px; }
.breadcrumb { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 34px; color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .66rem; letter-spacing: .07em; text-transform: uppercase; }
.breadcrumb a { color: var(--pn-text-faint); text-decoration: none; }
.breadcrumb a:hover, .breadcrumb span { color: var(--pn-interactive); }
.page-tag { display: block; margin: 0 0 18px; padding: 0; border: 0; color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .69rem; letter-spacing: .11em; text-transform: uppercase; }
.page-tag::before { display: none; }
.page-hero h1 { max-width: 900px; margin: 0 0 24px; color: var(--pn-text); font-family: var(--pn-font-display); font-size: clamp(2.65rem, 4.5vw, 4.75rem); font-weight: 500; letter-spacing: -.047em; line-height: 1.02; }
.page-hero h1 em { color: var(--pn-interactive); font-style: normal; }
.page-hero-sub { max-width: 720px; margin: 0 0 34px; color: var(--pn-text-muted); font-size: clamp(1rem, 1.5vw, 1.2rem); line-height: 1.65; }
.page-hero ~ section { width: min(calc(100% - 48px), 1360px); margin: 0 auto; padding: clamp(66px, 8vw, 104px) clamp(12px, 4vw, 56px); border-bottom: 1px solid var(--pn-outline); background: var(--pn-bg); }
.page-hero ~ section[style] { background: var(--pn-surface) !important; }
.section-title { max-width: 900px; margin: 0 0 16px; color: var(--pn-text); font-family: var(--pn-font-display); font-size: clamp(2rem, 3.5vw, 3.65rem); font-weight: 500; letter-spacing: -.042em; line-height: 1.04; }
.section-sub { max-width: 650px; margin: 0 0 40px; color: var(--pn-text-muted); font-size: 1rem; }
.section-tag { color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .68rem; letter-spacing: .1em; }
.hero-actions, .cta-actions { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.btn-primary, .btn-ghost {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 13px 22px;
  border: 1px solid var(--pn-outline-strong);
  border-radius: 0;
  font-family: var(--pn-font-data);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-decoration: none;
  text-transform: uppercase;
}
.btn-primary { border-color: var(--pn-interactive); background: var(--pn-interactive); color: #fff; }
.btn-primary:hover { border-color: var(--pn-interactive-hover); background: var(--pn-interactive-hover); color: #fff; transform: translateY(-2px); }
.btn-ghost { background: transparent; color: var(--pn-text); }
.btn-ghost:hover { border-color: var(--pn-text-muted); background: var(--pn-surface-raised); color: var(--pn-text); }
.feat-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0; border-top: 1px solid var(--pn-outline); border-left: 1px solid var(--pn-outline); }
.feat-card { min-height: 250px; padding: 26px; border: 0; border-right: 1px solid var(--pn-outline); border-bottom: 1px solid var(--pn-outline); border-radius: 0; background: var(--pn-surface); box-shadow: none; }
.feat-card { grid-column: span 4; }
.feat-card:nth-child(6n + 1), .feat-card:nth-child(6n + 4) { grid-column: span 7; }
.feat-card:nth-child(6n + 2), .feat-card:nth-child(6n + 3) { grid-column: span 5; }
.feat-card:nth-child(6n + 5) { grid-column: span 8; }
.feat-card:nth-child(6n + 6) { grid-column: span 4; }
.feat-card:hover { border-color: var(--pn-outline); background: var(--pn-surface-raised); transform: none; }
.feat-icon { display: block; width: auto; height: auto; margin: 0 0 48px; border: 0; border-radius: 0; }
.feat-icon svg { width: 24px; height: 24px; stroke: var(--pn-text-faint); }
.feat-card h3 { margin: 0 0 12px; font-family: var(--pn-font-display); font-size: 1.35rem; font-weight: 550; }
.feat-card p { margin: 0; color: var(--pn-text-muted); }
.two-col { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr); gap: clamp(40px, 8vw, 120px); align-items: start; }
.two-col-text p, .two-col-text li { color: var(--pn-text-muted); }
.two-col-text ul { padding-left: 1.2rem; }
.tech-card { padding: 0; border: 1px solid var(--pn-outline); border-radius: 0; background: var(--pn-surface); box-shadow: none; }
.tech-card h4 { margin: 0; padding: 20px; border-bottom: 1px solid var(--pn-outline); font-family: var(--pn-font-data); font-size: .72rem; letter-spacing: .07em; text-transform: uppercase; }
.tech-row { display: flex; justify-content: space-between; gap: 16px; padding: 16px 20px; border-bottom: 1px solid var(--pn-outline); }
.tech-row:last-child { border-bottom: 0; }
.tech-name { color: var(--pn-text-muted); }
.tech-badge { padding: 2px 8px; border: 1px solid var(--pn-outline-strong); border-radius: 0; background: transparent; color: var(--pn-text); font-family: var(--pn-font-data); font-size: .6rem; text-transform: uppercase; }
.spec-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid var(--pn-outline); border-left: 1px solid var(--pn-outline); background: transparent; }
.spec-item { padding: 24px; border-right: 1px solid var(--pn-outline); border-bottom: 1px solid var(--pn-outline); background: var(--pn-surface); }
.spec-label { color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .62rem; text-transform: uppercase; }
.spec-val { color: var(--pn-text); font-family: var(--pn-font-display); }
.process-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; border-top: 1px solid var(--pn-outline); border-left: 1px solid var(--pn-outline); }
.process-item { min-height: 220px; padding: 24px; border-right: 1px solid var(--pn-outline); border-bottom: 1px solid var(--pn-outline); background: var(--pn-surface); }
.process-item:hover { background: var(--pn-surface-raised); }
.process-num { color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .68rem; opacity: 1; }
.process-item h4 { margin: 68px 0 10px; font-family: var(--pn-font-display); font-size: 1.2rem; }
.process-item p { color: var(--pn-text-muted); }
.cta-strip { background: var(--pn-surface) !important; text-align: left; }
.job-list { display: grid; gap: 0; border-top: 1px solid var(--pn-outline); }
.job-card { display: grid; grid-template-columns: 1fr auto; gap: 24px; padding: 28px 0; border-bottom: 1px solid var(--pn-outline); border-radius: 0; background: transparent; }
.job-info h3 { font-family: var(--pn-font-display); }
.job-tag, .job-tags span { border: 1px solid var(--pn-outline-strong); border-radius: 0; background: transparent; color: var(--pn-text-muted); font-family: var(--pn-font-data); }

/* Formularios */
.pn-contact-grid { display: grid; grid-template-columns: minmax(280px, .7fr) minmax(0, 1.3fr); gap: 0; border: 1px solid var(--pn-outline); }
.pn-contact-info, .pn-form { padding: clamp(28px, 5vw, 58px); background: var(--pn-surface); }
.pn-contact-info { border-right: 1px solid var(--pn-outline); }
.pn-contact-info h2 { margin-top: 0; font-family: var(--pn-font-display); font-size: 2rem; }
.pn-contact-item { padding: 20px 0; border-bottom: 1px solid var(--pn-outline); }
.pn-contact-item h3 { margin: 0 0 4px; color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; }
.pn-contact-item p, .pn-contact-item a { margin: 0; color: var(--pn-text); text-decoration: none; }
.pn-privacy-note { color: var(--pn-text-faint); font-size: .78rem; }
.pn-form { display: grid; gap: 22px; }
.pn-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.pn-form-group { display: grid; gap: 8px; }
.pn-form label, .pn-consent { color: var(--pn-text-muted); font-family: var(--pn-font-data); font-size: .68rem; letter-spacing: .04em; }
.pn-form input, .pn-form select, .pn-form textarea {
  width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid var(--pn-outline-strong);
  border-radius: 0;
  background: #000;
  color: var(--pn-text);
  font: inherit;
}
.pn-form textarea { min-height: 180px; resize: vertical; }
.pn-form input:hover, .pn-form select:hover, .pn-form textarea:hover { border-color: var(--pn-text-faint); }
.pn-form input:focus, .pn-form select:focus, .pn-form textarea:focus { border-color: var(--pn-interactive); }
.pn-consent { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start; line-height: 1.5; }
.pn-consent input { width: 18px; min-height: 18px; margin-top: 2px; accent-color: var(--pn-interactive); }
.pn-hp { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.pn-notice { margin-bottom: 28px; padding: 18px 20px; border: 1px solid var(--pn-outline-strong); border-left: 4px solid var(--pn-interactive); border-radius: 0; background: var(--pn-surface); color: var(--pn-text); }

/* Blog */
.pn-blog-card { padding: 0; overflow: hidden; }
.pn-blog-thumb { display: grid; min-height: 200px; place-items: center; border-bottom: 1px solid var(--pn-outline); background: #000; color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: 2rem; text-decoration: none; }
.pn-blog-thumb img { width: 100%; height: 220px; object-fit: cover; filter: grayscale(1) contrast(1.1); }
.pn-blog-body { padding: 24px; }
.pn-blog-body h3 a, .entry-title a { color: var(--pn-text); text-decoration: none; }
.pn-blog-body h3 a:hover, .entry-title a:hover { color: var(--pn-interactive); }
.pn-blog-meta { color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .62rem; }
.pn-blog-link { color: var(--pn-text); font-family: var(--pn-font-data); font-size: .68rem; text-decoration: none; text-transform: uppercase; }
.pn-pagination { margin-top: 38px; }
.pn-pagination .page-numbers { display: inline-grid; min-width: 42px; height: 42px; place-items: center; border: 1px solid var(--pn-outline); color: var(--pn-text); text-decoration: none; }
.pn-pagination .current { border-color: var(--pn-interactive); background: var(--pn-interactive); }
.pn-empty-state { padding: 36px; border: 1px solid var(--pn-outline); background: var(--pn-surface); }

/* Artículo editorial */
.pn-article { background: var(--pn-bg); }
.pn-reading-progress { position: fixed; inset: 82px 0 auto; z-index: 999; height: 2px; pointer-events: none; }
.admin-bar .pn-reading-progress { inset-block-start: 114px; }
.pn-reading-progress span { display: block; width: 0; height: 100%; background: var(--pn-interactive); transform-origin: left center; }
.pn-article-hero { width: min(calc(100% - 48px), 1360px); margin: 0 auto; padding: 38px 0 64px; border-bottom: 1px solid var(--pn-outline); }
.pn-article-breadcrumb { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 54px; color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .61rem; letter-spacing: .07em; text-transform: uppercase; }
.pn-article-breadcrumb a { color: var(--pn-text-faint); text-decoration: none; }
.pn-article-breadcrumb a:hover, .pn-article-breadcrumb > span:last-child { color: var(--pn-text); }
.pn-article-hero-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(360px, .62fr); gap: clamp(48px, 7vw, 104px); align-items: stretch; }
.pn-article-hero-copy { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 34px 0; }
.pn-article-kicker { margin: 0 0 20px; color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .68rem; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; }
.pn-article-hero h1 { max-width: 900px; margin: 0; font-family: var(--pn-font-display); font-size: clamp(2.65rem, 4vw, 4.25rem); font-weight: 500; letter-spacing: -.046em; line-height: 1.04; text-wrap: balance; }
.pn-article-deck { max-width: 760px; margin: 28px 0 0; color: var(--pn-text-muted); font-size: clamp(1.02rem, 1.25vw, 1.18rem); line-height: 1.65; }
.pn-article-meta { display: flex; flex-wrap: wrap; gap: 0; margin-top: 42px; border-top: 1px solid var(--pn-outline); }
.pn-article-meta > span { min-width: 150px; padding: 16px 24px 0 0; color: var(--pn-text); font-size: .76rem; }
.pn-article-meta small { display: block; margin-bottom: 4px; color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .56rem; letter-spacing: .08em; text-transform: uppercase; }
.pn-article-cover { display: grid; grid-template-rows: auto 1fr auto; min-height: 430px; border: 1px solid var(--pn-outline); background: var(--pn-surface); }
.pn-article-cover-head, .pn-article-cover-foot { display: flex; justify-content: space-between; gap: 20px; padding: 13px 16px; color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .56rem; letter-spacing: .08em; }
.pn-article-cover-head { border-bottom: 1px solid var(--pn-outline); }
.pn-article-cover-foot { border-top: 1px solid var(--pn-outline); }
.pn-article-map { position: relative; display: grid; align-content: center; gap: 22px; padding: 38px; overflow: hidden; background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px); background-size: 44px 44px; }
.pn-map-axis { position: absolute; left: 61px; top: 21%; bottom: 21%; width: 1px; background: var(--pn-outline-strong); }
.pn-map-stage { position: relative; z-index: 1; display: grid; grid-template-columns: 34px 1fr; padding: 15px 16px; border: 1px solid var(--pn-outline); background: #080809; }
.pn-map-stage::before { content: ""; position: absolute; left: -20px; top: 50%; width: 19px; height: 1px; background: var(--pn-outline-strong); }
.pn-map-stage span { grid-row: span 2; color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .58rem; }
.pn-map-stage strong { font-family: var(--pn-font-display); font-size: .82rem; font-weight: 550; }
.pn-map-stage small { margin-top: 3px; color: var(--pn-text-faint); font-size: .63rem; }
.pn-map-stage-two { margin-left: 26px; border-color: var(--pn-interactive); }
.pn-article-layout { display: grid; grid-template-columns: minmax(210px, .55fr) minmax(0, 2fr); gap: clamp(52px, 8vw, 120px); width: min(calc(100% - 48px), 1160px); margin: 0 auto; padding: 82px 0 108px; }
.pn-article-sidebar { min-width: 0; }
.pn-article-toc-wrap { position: sticky; top: 124px; }
.pn-article-toc-wrap > p { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0; padding: 15px 16px; border: 1px solid var(--pn-outline-strong); background: var(--pn-surface-raised); color: var(--pn-text); font-family: var(--pn-font-display); font-size: .92rem; font-weight: 550; }
.pn-article-toc-wrap > p::before { content: ""; width: 18px; height: 2px; flex: 0 0 auto; background: var(--pn-interactive); }
.pn-article-toc-wrap > p > span { margin-right: auto; }
.pn-article-toc-wrap > p small { color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .53rem; font-weight: 500; letter-spacing: .07em; text-transform: uppercase; }
.pn-article-toc ol { margin: 0; padding: 0; border: 1px solid var(--pn-outline); border-top: 0; background: var(--pn-surface); list-style: none; counter-reset: toc; }
.pn-article-toc li { margin: 0; padding: 0; border-top: 1px solid var(--pn-outline); counter-increment: toc; }
.pn-article-toc li:first-child { border-top: 0; }
.pn-article-toc a { display: grid; grid-template-columns: 34px minmax(0, 1fr); min-height: 58px; align-items: center; gap: 10px; padding: 11px 14px; background: transparent; color: var(--pn-text-muted); font-size: .76rem; line-height: 1.4; text-decoration: none; text-decoration-line: none; transition: background-color 160ms ease, color 160ms ease; }
.pn-article-toc a::before { content: "0" counter(toc); display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid var(--pn-outline-strong); color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .54rem; line-height: 1; }
.pn-article-toc a:hover { background: var(--pn-surface-raised); color: var(--pn-text); }
.pn-article-toc a[aria-current="true"] { box-shadow: inset 2px 0 var(--pn-interactive); background: var(--pn-surface-raised); color: var(--pn-text); }
.pn-article-toc a[aria-current="true"]::before { border-color: var(--pn-interactive); background: var(--pn-interactive); color: #fff; }
.pn-article-note { margin-top: 44px; padding: 20px 0; border-block: 1px solid var(--pn-outline); }
.pn-article-note span { color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .57rem; letter-spacing: .08em; }
.pn-article-note p { margin: 10px 0 0; color: var(--pn-text-faint); font-size: .72rem; line-height: 1.6; }
.pn-article-main { min-width: 0; }
.pn-article-content { max-width: 760px; color: #c1c4ca; font-size: 1.08rem; line-height: 1.78; }
.pn-article-content > p:first-child { margin-top: 0; color: var(--pn-text); font-family: var(--pn-font-display); font-size: clamp(1.3rem, 2vw, 1.65rem); font-weight: 400; letter-spacing: -.018em; line-height: 1.48; }
.pn-article-content p { margin: 0 0 1.55em; }
.pn-article-content h2 { position: relative; margin: 3.2em 0 .85em; padding-top: 26px; border-top: 1px solid var(--pn-outline); color: var(--pn-text); font-family: var(--pn-font-display); font-size: clamp(1.75rem, 2.6vw, 2.35rem); font-weight: 500; letter-spacing: -.035em; line-height: 1.16; scroll-margin-top: 120px; }
.pn-article-content h2::before { content: ""; position: absolute; left: 0; top: -1px; width: 48px; height: 2px; background: var(--pn-interactive); }
.pn-article-content h3 { margin: 2.4em 0 .75em; color: var(--pn-text); font-family: var(--pn-font-display); font-size: 1.35rem; font-weight: 550; scroll-margin-top: 120px; }
.pn-article-content ul, .pn-article-content ol { display: grid; gap: 10px; margin: 0 0 1.8em; padding: 4px 0 4px 28px; }
.pn-article-content li { padding-left: 7px; }
.pn-article-content li::marker { color: var(--pn-interactive); }
.pn-article-content a { color: var(--pn-text); text-decoration-color: var(--pn-interactive); text-decoration-thickness: 1px; text-underline-offset: 4px; }
.pn-article-content a:hover { color: var(--pn-interactive); }
.pn-article-content blockquote { margin: 2.4em 0; padding: 22px 28px; border-left: 3px solid var(--pn-interactive); background: var(--pn-surface); color: var(--pn-text); font-family: var(--pn-font-display); font-size: 1.25rem; }
.pn-article-content img { width: 100%; margin: 1.5em 0; border: 1px solid var(--pn-outline); }
.pn-article-cta { display: grid; grid-template-columns: 1.2fr .8fr; gap: 48px; max-width: 900px; margin-top: 82px; padding: 38px; border: 1px solid var(--pn-outline); background: var(--pn-surface); }
.pn-article-cta span { color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .6rem; letter-spacing: .09em; text-transform: uppercase; }
.pn-article-cta h2 { margin: 12px 0 0; font-family: var(--pn-font-display); font-size: clamp(1.8rem, 3vw, 2.55rem); font-weight: 500; letter-spacing: -.04em; line-height: 1.08; }
.pn-article-cta p { margin: 0 0 22px; color: var(--pn-text-muted); font-size: .88rem; }
.pn-article-pagination { display: grid; grid-template-columns: 1fr 1fr; max-width: 900px; margin-top: 48px; border-top: 1px solid var(--pn-outline); border-bottom: 1px solid var(--pn-outline); }
.pn-article-pagination > div { min-width: 0; }
.pn-article-pagination > div + div { border-left: 1px solid var(--pn-outline); text-align: right; }
.pn-article-pagination a { display: block; min-height: 104px; padding: 22px; color: var(--pn-text); text-decoration: none; }
.pn-article-pagination a:hover { background: var(--pn-surface); }
.pn-article-pagination small { display: block; margin-bottom: 8px; color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .56rem; letter-spacing: .08em; text-transform: uppercase; }
.pn-article-pagination span { display: block; overflow: hidden; font-family: var(--pn-font-display); font-size: .88rem; text-overflow: ellipsis; white-space: nowrap; }
.pn-related-posts { width: min(calc(100% - 48px), 1360px); margin: 0 auto; padding: 76px 0 104px; border-top: 1px solid var(--pn-outline); }
.pn-related-posts > header { display: grid; grid-template-columns: .5fr 1.5fr; gap: 36px; align-items: end; margin-bottom: 38px; }
.pn-related-posts > header p { margin: 0; color: var(--pn-interactive); font-family: var(--pn-font-data); font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }
.pn-related-posts > header h2 { margin: 0; font-family: var(--pn-font-display); font-size: clamp(2rem, 3vw, 3rem); font-weight: 500; letter-spacing: -.04em; }
.pn-related-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--pn-outline); border-left: 1px solid var(--pn-outline); }
.pn-related-grid a { display: flex; min-height: 220px; flex-direction: column; padding: 24px; border-right: 1px solid var(--pn-outline); border-bottom: 1px solid var(--pn-outline); background: var(--pn-surface); color: var(--pn-text); text-decoration: none; }
.pn-related-grid a:hover { background: var(--pn-surface-raised); }
.pn-related-grid span, .pn-related-grid small { color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .57rem; letter-spacing: .07em; text-transform: uppercase; }
.pn-related-grid h3 { margin: 42px 0 24px; font-family: var(--pn-font-display); font-size: 1.25rem; font-weight: 500; line-height: 1.2; }
.pn-related-grid small { margin-top: auto; color: var(--pn-text); }

/* Portada del blog */
.pn-topics .pn-topic-grid { grid-template-columns: repeat(4, 1fr); }
.pn-topics .pn-topic-card:first-child { grid-column: span 2; }
.pn-topics .pn-topic-card:nth-child(4) { grid-column: span 2; }
.pn-blog-listing .pn-blog-grid { grid-template-columns: repeat(3, 1fr); }
.pn-blog-listing .pn-blog-card:first-child { grid-column: span 2; display: grid; grid-template-columns: .82fr 1.18fr; }
.pn-blog-listing .pn-blog-card:first-child .pn-blog-thumb { min-height: 100%; border-right: 1px solid var(--pn-outline); border-bottom: 0; }
.pn-blog-listing .pn-blog-card:first-child .pn-blog-body { padding: 34px; }
.pn-blog-listing .pn-blog-card:first-child h3 { font-size: clamp(1.65rem, 2.5vw, 2.4rem); font-weight: 500; letter-spacing: -.035em; }
.pn-blog-thumb span { display: grid; width: calc(100% - 48px); height: calc(100% - 48px); min-height: 150px; place-items: center; border: 1px solid var(--pn-outline); color: var(--pn-text-faint); font-size: .68rem; letter-spacing: .14em; }

/* Pie */
.pn-footer { width: min(100%, var(--pn-max)); margin: 0 auto; border-inline: 1px solid var(--pn-outline); background: #000; }
.pn-footer-index { border-top: 0; border-bottom: 1px solid var(--pn-outline); }
.pn-footer-top { display: grid; grid-template-columns: 1.7fr 1fr 1fr 1fr; gap: 0; padding: 0; border-bottom: 1px solid var(--pn-outline); }
.pn-footer-brand, .pn-footer-col { padding: 42px 32px; border-right: 1px solid var(--pn-outline); }
.pn-footer-col:last-child { border-right: 0; }
.pn-footer-brand p { max-width: 360px; color: var(--pn-text-muted); }
.pn-footer-direct { display: inline-block; margin-top: 18px; color: var(--pn-text); font-family: var(--pn-font-data); font-size: .7rem; text-decoration: none; text-transform: uppercase; }
.pn-footer-direct:hover { color: var(--pn-interactive); }
.pn-footer-col h2 { margin: 0 0 20px; color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; }
.pn-footer-col ul { margin: 0; padding: 0; list-style: none; }
.pn-footer-col li { margin: 0 0 10px; color: var(--pn-text-muted); font-size: .85rem; }
.pn-footer-col a { color: var(--pn-text-muted); text-decoration: none; }
.pn-footer-col a:hover { color: var(--pn-text); }
.pn-footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding: 18px 32px; color: var(--pn-text-faint); font-family: var(--pn-font-data); font-size: .6rem; letter-spacing: .05em; }
.pn-footer-legal { position: static; inset: auto; z-index: auto; display: flex; width: auto; height: auto; gap: 22px; padding: 0; border: 0; background: transparent; backdrop-filter: none; }
.pn-footer-legal a { color: var(--pn-text-faint); text-decoration: none; }

@media (max-width: 1180px) {
  .pn-nav-links { gap: 22px; }
  .se-hero { grid-template-columns: 1.2fr minmax(390px, .8fr); }
  .se-hero-copy { padding-right: 44px; }
  .se-hero h1 { font-size: clamp(2.9rem, 5vw, 4.25rem); }
  .se-proof-list article { grid-template-columns: 90px 1fr; }
  .se-proof-list p { grid-column: 2; }
  .pn-article-hero-grid { grid-template-columns: minmax(0, 1.3fr) minmax(330px, .7fr); gap: 54px; }
  .pn-article-hero h1 { font-size: clamp(2.7rem, 4.8vw, 4.2rem); }
}

@media (max-width: 960px) {
  .pn-nav { grid-template-columns: 1fr auto; }
  .pn-nav-links { display: none; }
  .pn-mobile-btn { display: block; }
  .se-hero { grid-template-columns: 1fr; }
  .se-hero-copy { padding-right: 0; border-bottom: 1px solid var(--pn-outline); }
  .se-topology { width: min(100%, 620px); min-height: 520px; margin: 48px auto 72px; }
  .se-network-flow { min-height: 444px; }
  .se-section-head, .se-proof, .se-final-cta { grid-template-columns: 1fr; gap: 32px; }
  .se-bento { grid-template-columns: repeat(2, 1fr); }
  .se-service-security { grid-row: auto; }
  .se-service-support { grid-column: span 1; }
  .se-observability { grid-template-columns: 1fr; }
  .se-evidence { border-right: 0; border-bottom: 1px solid var(--pn-outline); }
  .se-signal-map { grid-template-columns: repeat(2, 1fr); }
  .se-method-grid { grid-template-columns: repeat(2, 1fr); }
  .se-post-grid { grid-template-columns: 1fr 1fr; }
  .se-post:first-child { grid-column: span 2; }
  .pn-two-col, .pn-contact-grid { grid-template-columns: 1fr; }
  .pn-contact-info { border-right: 0; border-bottom: 1px solid var(--pn-outline); }
  .pn-feat-grid, .pn-topic-grid, .pn-case-grid, .pn-profile-grid, .pn-blog-grid { grid-template-columns: repeat(2, 1fr); }
  .pn-process-grid { grid-template-columns: repeat(2, 1fr); }
  .pn-footer-top { grid-template-columns: 1.4fr 1fr 1fr; }
  .pn-footer-brand { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid var(--pn-outline); }
  .pn-article-hero-grid { grid-template-columns: 1fr; }
  .pn-article-cover { min-height: 390px; }
  .pn-article-layout { grid-template-columns: 1fr; gap: 52px; }
  .pn-article-sidebar { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
  .pn-article-toc-wrap { position: static; }
  .pn-article-note { margin-top: 0; }
  .pn-blog-listing .pn-blog-grid { grid-template-columns: 1fr 1fr; }
  .pn-topics .pn-topic-grid { grid-template-columns: repeat(2, 1fr); }
  .pn-related-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 782px) {
  .admin-bar .pn-site-header { top: 46px; }
}

@media (max-width: 680px) {
  .pn-nav { min-height: 68px; padding-inline: 16px; }
  .pn-mobile-menu { inset-block-start: 68px; padding-inline: 16px; }
  .se-hero, .se-capability-strip, .se-section, .se-final-cta { width: min(calc(100% - 32px), 1360px); }
  .se-hero-copy { padding: 64px 0 58px; }
  .se-hero h1 { font-size: clamp(2.5rem, 11.5vw, 3.6rem); }
  .se-hero-facts { grid-template-columns: 1fr; }
  .se-hero-facts div { padding: 12px 0; border-top: 1px solid var(--pn-outline); border-left: 0; }
  .se-hero-facts div:first-child { padding-top: 0; border-top: 0; }
  .se-actions { align-items: flex-start; flex-direction: column; }
  .se-topology { margin: 24px auto 56px; }
  .se-network-flow { min-height: 0; padding: 26px 18px; }
  .se-flow-node { width: min(90%, 290px); }
  .se-flow-leaves { gap: 10px; }
  .se-flow-leaves .se-flow-node { padding-inline: 11px; }
  .se-flow-leaves .se-flow-node small { font-size: .57rem; }
  .se-capability-strip { grid-template-columns: 1fr 1fr; }
  .se-capability-strip span { border-bottom: 1px solid var(--pn-outline); }
  .se-bento, .se-signal-map, .se-method-grid, .se-post-grid { grid-template-columns: 1fr; }
  .se-service-network, .se-service-support, .se-post:first-child { grid-column: auto; }
  .se-service { min-height: 260px; }
  .se-signal-map > div:not(:last-child)::after { content: "↓"; right: 50%; top: auto; bottom: -12px; transform: translateX(50%); }
  .se-proof-list article { grid-template-columns: 1fr; }
  .se-proof-list p { grid-column: auto; }
  .se-empty, .pn-footer-bottom { align-items: flex-start; flex-direction: column; }
  .pn-page-hero, .pn-section, .se-section, .se-final-cta { padding-inline: 24px; }
  .pn-page-hero h1, .page-hero h1 { font-size: clamp(2.35rem, 10.5vw, 3.35rem); }
  .page-hero, .page-hero ~ section { padding-inline: 24px; }
  .feat-grid, .process-grid, .spec-grid { grid-template-columns: 1fr; }
  .feat-card, .feat-card:nth-child(n) { grid-column: auto; }
  .two-col { grid-template-columns: 1fr; }
  .pn-form-row { grid-template-columns: 1fr; }
  .pn-feat-grid, .pn-topic-grid, .pn-case-grid, .pn-profile-grid, .pn-blog-grid, .pn-process-grid { grid-template-columns: 1fr; }
  .pn-footer-top { grid-template-columns: 1fr; }
  .pn-footer-brand, .pn-footer-col { grid-column: auto; border-right: 0; border-bottom: 1px solid var(--pn-outline); }
  .pn-footer-col:last-child { border-bottom: 0; }
  .pn-reading-progress { inset-block-start: 68px; }
  .admin-bar .pn-reading-progress { inset-block-start: 114px; }
  .pn-article-hero, .pn-article-layout, .pn-related-posts { width: min(calc(100% - 32px), 1360px); }
  .pn-article-hero { padding-top: 26px; }
  .pn-article-breadcrumb { margin-bottom: 40px; }
  .pn-article-hero h1 { font-size: clamp(2.35rem, 10.5vw, 3.35rem); }
  .pn-article-meta { display: grid; grid-template-columns: 1fr 1fr; }
  .pn-article-cover { min-height: 360px; }
  .pn-article-map { padding: 26px; }
  .pn-map-axis { left: 49px; }
  .pn-article-layout { padding: 58px 0 76px; }
  .pn-article-sidebar { grid-template-columns: 1fr; }
  .pn-article-content { font-size: 1rem; line-height: 1.72; }
  .pn-article-content > p:first-child { font-size: 1.25rem; }
  .pn-article-content h2 { margin-top: 2.6em; }
  .pn-article-cta { grid-template-columns: 1fr; gap: 26px; padding: 26px; }
  .pn-article-pagination { grid-template-columns: 1fr; }
  .pn-article-pagination > div + div { border-top: 1px solid var(--pn-outline); border-left: 0; text-align: left; }
  .pn-related-posts > header { grid-template-columns: 1fr; }
  .pn-related-grid, .pn-blog-listing .pn-blog-grid, .pn-topics .pn-topic-grid { grid-template-columns: 1fr; }
  .pn-related-grid a { min-height: 180px; }
  .pn-blog-listing .pn-blog-card:first-child, .pn-topics .pn-topic-card:first-child, .pn-topics .pn-topic-card:nth-child(4) { grid-column: auto; display: block; }
  .pn-blog-listing .pn-blog-card:first-child .pn-blog-thumb { min-height: 200px; border-right: 0; border-bottom: 1px solid var(--pn-outline); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media print {
  body { background: #fff; color: #000; }
  body::before, .pn-site-header, .pn-footer, .se-topology { display: none !important; }
  .se-hero, .se-section, .pn-section, .pn-page-hero { width: 100%; border: 0; background: #fff; color: #000; }
  a { color: #000; text-decoration: underline; }
}
