/* ===== TITONET — design tokens (sistema cromático oficial) ===== */
:root{
  /* Paleta principal */
  --azul-marino:#0B1D3A;   /* Estructura / Profundidad */
  --azul-medio: #2F5FA7;   /* Conexión / Sistema */
  --azul-claro: #D6E4F2;   /* Apertura / Claridad */
  --gris-calido:#E5E7EB;   /* Soporte / Neutralidad */
  --arena:      #F2EDE6;   /* Editorial / Materia */
  --blanco-roto:#FAFAF8;   /* Luz / Aire */
  /* Color de activación */
  --insight:    #FFC72C;   /* Activación / Atención */
  --insight-2:  #E5B016;   /* hover / underline */

  /* aliases used across the page */
  --bg:var(--arena);
  --bg-soft:#EAE3D6;
  --paper:var(--blanco-roto);
  --navy:var(--azul-marino);
  --navy-2:#142D55;
  --navy-3:var(--azul-medio);
  --ink:var(--azul-marino);
  --ink-2:#3B4A63;
  --muted:#7A8499;
  --rule:#D9D2C2;
  --rule-2:var(--gris-calido);
  --amber:var(--insight);
  --amber-2:var(--insight-2);
  --live:#1F8A5B;            /* estado "en directo / publicado" (verde) */

  /* superficie oscura (bloques/botones que en claro eran fondo navy)
     y texto/icono que va SOBRE ámbar — se redefinen en dark mode */
  --ink-block:var(--navy);
  --ink-block-2:var(--navy-2);
  --on-amber:var(--navy);

  /* texto SOBRE superficies oscuras (ink-block) — se redefinen en dark.
     unifican #F2EDE6/#EEE6D2 (crema) y #C3CCDD (secundario) sueltos. */
  --on-ink:#F2EDE6;
  --on-ink-2:#C3CCDD;

  /* canales RGB para alphas que deben SEGUIR el theme (hairlines sobre
     imagen, tints de hover, sombras). Antes escritos como rgba(11,29,58,α)
     literal, que no flipaba en dark. */
  --navy-rgb:11,29,58;        /* = --azul-marino */

  /* patrones reutilizados (un punto de verdad) */
  --tint-hover:rgba(var(--navy-rgb),.04);
  --shadow-card:0 6px 18px rgba(var(--navy-rgb),.07);

  --serif:"Merriweather", Georgia, serif;          /* editorial: citas, destacados, letras A/B/C */
  --sans: "Inter", "Helvetica Neue", Arial, sans-serif; /* primaria (substituto de Söhne) */
  --mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
/* overflow-x:clip on the root clips the viewport horizontally INCLUDING
   position:fixed overflow (the off-canvas nav drawer at translateX(100%)).
   body{overflow-x:hidden} alone never constrained the fixed drawer, so
   every page had ~780px of phantom horizontal scroll on mobile. clip is
   used (not hidden) so it does not create a scroll container that would
   break the sticky header / position:sticky. */
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{
  min-width:320px;
  font-family:var(--sans);
  background:var(--bg);
  color:var(--ink);
  font-size:15px;
  line-height:1.5;
  font-feature-settings:"ss01","cv11";
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:clip;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
svg{max-width:100%}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}

.container{max-width:1240px;margin:0 auto;padding:0 32px}
@media (max-width: 900px){ .container{padding:0 20px} }
@media (max-width: 560px){ .container{padding:0 16px} }

/* ===== Cookie banner (RGPD) ===== */
.cookie-banner{
  position:fixed;left:0;right:0;bottom:0;z-index:120;
  background:var(--ink-block);color:var(--on-ink);
  border-top:3px solid var(--insight);
  animation:ck-rise .35s ease;
}
@keyframes ck-rise{from{transform:translateY(100%)}to{transform:translateY(0)}}
.cookie-banner .ck-inner{
  display:grid;
  grid-template-columns: 1.4fr auto;
  gap:24px;
  align-items:center;
  padding:18px 32px;
}
.cookie-banner .ck-text h4{
  font-family:var(--sans);font-size:13px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;margin:0 0 4px;color:var(--insight);
}
.cookie-banner .ck-text p{margin:0;font-size:13.5px;line-height:1.5;color:#E4E7EB;max-width:680px}
.cookie-banner .ck-text a{color:var(--insight);text-decoration:underline;text-underline-offset:3px}
.cookie-banner .ck-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.cookie-banner button{
  font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:.01em;
  padding:11px 18px;cursor:pointer;border:0;
  transition:background .15s ease, transform .15s ease;
}
.ck-btn-link{background:transparent;color:var(--on-ink-2);padding:11px 10px}
.ck-btn-link:hover{color:#fff;text-decoration:underline}
.ck-btn-secondary{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.25)}
.ck-btn-secondary:hover{background:rgba(255,255,255,.06)}
.ck-btn-primary{background:var(--insight);color:var(--on-amber)}
.ck-btn-primary:hover{background:var(--insight-2);transform:translateY(-1px)}
/* ===== Accesibilidad ===== */
.skip-link{
  position:absolute;left:-9999px;top:0;
  background:var(--ink-block);color:#fff;padding:10px 18px;
  font-size:13px;font-weight:600;z-index:200;
}
.skip-link:focus{left:0;top:0}

*:focus-visible{
  outline:2px solid var(--navy);
  outline-offset:3px;
}
.btn-primary:focus-visible,
.btn-sub:focus-visible{
  outline-color:var(--insight);
  outline-offset:3px;
}

/* eyebrow / label */
.eyebrow{
  font-family:var(--sans);
  font-size:12px;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink);
}
.eyebrow .dot{margin:0 .6em;opacity:.45}
.eyebrow.light{color:var(--on-ink-2)}
.eyebrow.muted{color:var(--muted)}

/* arrow link → Nivel 3 (navegación secundaria) */
.arrow-link{
  display:inline-flex;align-items:center;gap:8px;
  font-size:13px;font-weight:600;letter-spacing:.02em;
  padding-bottom:6px;
  border-bottom:1.5px solid var(--amber-2);
  color:var(--ink);
  transition:gap .2s ease, color .2s ease;
}
.arrow-link svg{
  width:14px;height:14px;
  stroke:var(--navy);       /* sobre fondo claro: navy = contraste alto */
  stroke-width:1.8;fill:none;
}
.arrow-link:hover{gap:12px;color:var(--navy)}
/* variante .light → fondo oscuro: flecha y subrayado en insight yellow */
.arrow-link.light{color:var(--on-ink);border-bottom-color:var(--insight)}
.arrow-link.light svg{stroke:var(--insight);stroke-width:1.8}
.arrow-link.light:hover{color:#fff}

/* serif headlines */
.h-display{
  font-family:var(--serif);
  font-weight:400;
  font-size:54px;
  line-height:1.12;
  letter-spacing:-0.01em;
  color:var(--ink);
}
.h-display .accent{color:var(--insight-2);font-style:italic;font-weight:400}
.h-2{font-family:var(--sans);font-weight:600;font-size:32px;line-height:1.25;letter-spacing:-0.01em}
.h-3{font-family:var(--sans);font-weight:500;font-size:20px;line-height:1.35;letter-spacing:-0.005em}

.section-label{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 0 8px;
  border-bottom:1px solid var(--rule);
  margin-bottom:24px;
}

/* ===== Header ===== */
.site-header{
  border-bottom:1px solid var(--rule);
  background:var(--bg);
  position:sticky;top:0;z-index:50;
  backdrop-filter:saturate(140%) blur(6px);
  transition:padding .25s ease;
}
.site-header.scrolled .inner{padding:8px 0}
.site-header.scrolled .brand .word .name{font-size:18px}
.site-header.scrolled .brand .mark{width:30px}
.site-header .inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 0;
}
.brand{display:flex;align-items:center;gap:14px}
.brand-logo{
  height:32px;width:auto;display:block;
  transition:height .25s ease;
}
.site-header.scrolled .brand-logo{height:26px}
.foot-brand .brand-logo{height:38px}
.brand .word{display:none}
.brand .word .name{display:none}
.brand .word .tag{display:none}

.nav{display:flex;align-items:center;gap:26px;flex-wrap:nowrap}
.nav a{font-size:13.5px;font-weight:500;color:var(--ink);position:relative;padding:6px 0;white-space:nowrap}
.nav a.has-caret::after{content:"";display:inline-block;width:7px;height:7px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;transform:translateY(-2px) rotate(45deg);margin-left:6px;opacity:.6}
.nav a:hover{color:var(--amber-2)}
.nav a.is-active{color:var(--navy)}
.nav a.is-active::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--amber-2);border-radius:2px}
.nav a.btn-sub{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--ink-block);color:var(--on-ink);
  padding:12px 22px;
  font-size:13.5px;font-weight:600;letter-spacing:.01em;
  white-space:nowrap;
  flex-shrink:0;
  transition:background .2s ease, transform .2s ease;
}
.nav a.btn-sub:hover{background:var(--ink-block-2);color:var(--on-ink)}
.nav a.btn-sub svg{width:14px;height:14px;stroke:var(--insight);fill:none}

/* search trigger + lang switch */
.nav-search{
  width:34px;height:34px;display:grid;place-items:center;
  border-radius:0;background:transparent;color:var(--ink);
  cursor:pointer;transition:background .15s ease, color .15s ease;
}
.nav-search svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.6}
.nav-search:hover{background:rgba(var(--navy-rgb),.06);color:var(--navy)}
.nav-search[aria-expanded="true"]{background:var(--ink-block);color:#fff}

/* --- Toggle de tema en el header (icono sol/luna), visible siempre --- */
.hd-bar-actions{display:flex;align-items:center;gap:6px}
.theme-icon{
  width:34px;height:34px;display:grid;place-items:center;
  background:transparent;color:var(--ink);cursor:pointer;
  transition:background .15s ease, color .15s ease;
}
.theme-icon svg{
  width:18px;height:18px;stroke:currentColor;fill:none;
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;
}
.theme-icon:hover{background:rgba(var(--navy-rgb),.06);color:var(--navy)}
:root[data-theme="dark"] .theme-icon:hover{background:rgba(236,227,210,.07);color:var(--navy)}
/* la versión "bar" (junto a la hamburguesa) sólo en móvil; la "nav" sólo en desktop */
.theme-icon-bar{display:none}
@media (max-width: 640px){
  .theme-icon-bar{display:grid}
  .nav .theme-icon-nav{display:none}
}

.lang-switch{
  display:inline-flex;border:1px solid var(--rule);
  padding:0;
}
.lang-switch button{
  font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:.08em;
  padding:6px 10px;color:var(--ink-2);cursor:pointer;
  transition:background .15s ease, color .15s ease;
}
.lang-switch button.active{background:var(--ink-block);color:#FAFAF8}
.lang-switch button:hover:not(.active){background:rgba(var(--navy-rgb),.06);color:var(--navy)}

.search-bar{
  max-height:0;overflow:hidden;
  border-bottom:1px solid var(--rule);
  background:var(--paper);
  transition:max-height .25s ease;
}
.search-bar.open{max-height:80px}
.search-bar .search-inner{
  display:flex;align-items:center;gap:12px;
  padding:18px 0;
}
.search-bar svg{width:18px;height:18px;stroke:var(--ink-2);fill:none;stroke-width:1.6;flex:0 0 18px}
.search-bar input{
  flex:1;border:0;background:transparent;outline:none;
  font-family:var(--sans);font-size:16px;color:var(--ink);
}
.search-bar input::placeholder{color:var(--muted)}
.search-bar kbd{
  font-family:var(--mono);font-size:10px;
  padding:3px 7px;border:1px solid var(--rule);color:var(--muted);
  text-transform:lowercase;
}

/* ===== Hero ===== */
.hero{
  position:relative;
  padding:22px 0 18px;
  overflow:hidden;
}
.hero-card{
  position:relative;
  height:350px;
  overflow:hidden;
  background:#0B1D3A;
  isolation:isolate;
}
.hero-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
  z-index:0;
}
.hero-copy{
  position:relative;
  z-index:1;
  width:min(46%, 540px);
  min-height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:34px 0 34px 42px;
  color:#F4EDE0;
}
.hero-copy .h-display{
  font-size:clamp(34px, 2.75vw, 39px);
  line-height:1.08;
  margin:0 0 20px;
  color:#F4EDE0;
  letter-spacing:-.035em;
}
.hero-copy .h-display .accent{
  color:var(--insight);
  font-style:italic;
}
.hero-lede{
  margin:0;
  max-width:500px;
  font-size:16px;
  line-height:1.5;
  color:#F4EDE0;
}
.hero-lede-highlight{
  font-family:var(--serif);
  font-style:normal;
  color:#F4EDE0;
  font-weight:400;
}
.hero-word-underline{
  text-decoration:underline;
  text-decoration-color:var(--insight);
  text-decoration-thickness:1.5px;
  text-underline-offset:4px;
  text-decoration-skip-ink:auto;
}

/* Shared primary CTA — used by Perfil ABC, Cómplices and other home blocks */
.btn-primary{
  display:inline-flex;
  align-items:center;
  gap:12px;
  background:var(--insight);
  color:var(--on-amber);
  padding:14px 22px;
  font-size:14px;
  font-weight:700;
  letter-spacing:.01em;
  white-space:nowrap;
  transition:background .2s ease, transform .2s ease;
}
.btn-primary svg{
  width:22px;
  height:22px;
  stroke:var(--navy);
  stroke-width:2.2;
  fill:none;
  flex:0 0 22px;
}
.btn-primary:hover{background:var(--insight-2);transform:translateY(-1px)}

/* Shared mini-pillars used outside the home hero */
.pillar-mini{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.pillar-mini .icon-row{display:flex;align-items:center;gap:14px;color:var(--ink)}
.pillar-mini .icon-row svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.6}
.pillar-mini .icon-row .arrow{width:16px;height:1px;background:var(--muted);position:relative}
.pillar-mini .icon-row .arrow::after{content:"";position:absolute;right:-1px;top:-3px;width:7px;height:7px;border-right:1px solid var(--muted);border-top:1px solid var(--muted);transform:rotate(45deg)}
.pillar-mini h4{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;margin:6px 0 4px}
.pillar-mini p{font-size:13px;color:var(--ink-2);margin:0;line-height:1.45}
.pillar-mini:last-child .icon-row .arrow{display:none}


/* ===== Espacio Cómplices ===== */
.espacio-complices{
  margin-top:0;
  margin-bottom:15px;
}
.espacio-complices .section-label{
  margin-bottom:20px;
}
.espacio-complices-grid{
  display:grid;
  grid-template-columns:minmax(0, 0.4fr) minmax(0, 0.6fr);
  gap:44px;
  align-items:start;
}
.espacio-complices-copy{
  max-width:none;
  padding-top:22px;
}
.espacio-complices-title{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(26px, 2.25vw, 34px);
  line-height:1.16;
  letter-spacing:-.02em;
  color:var(--ink);
  margin:0 0 24px;
}
.espacio-complices-text{
  max-width:340px;
  margin:0 0 20px;
  font-size:15px;
  line-height:1.55;
  color:var(--ink-2);
}
.espacio-complices-bullets{
  max-width:340px;
  margin:0 0 18px 18px;
  padding:0;
  font-size:12px;
  line-height:1.35;
  color:var(--ink-2);
}
.espacio-complices-bullets li{
  margin:0 0 3px;
}
.espacio-complices-bullets li:last-child{
  margin-bottom:0;
}
.espacio-complices-media{
  width:min(100%, 700px);
  justify-self:start;
  align-self:start;
}
.espacio-complices-media a{
  display:block;
  color:inherit;
  text-decoration:none;
}
.espacio-complices-media img{
  width:100%;
  height:auto;
  display:block;
}

/* ===== Perfil ABC ===== */
#abc{margin-top:0}
.abc{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:24px;
  margin-top:0;
}
.abc > .card{padding:24px 22px 20px;display:flex;flex-direction:column;min-height:0;position:relative;border:1px solid var(--rule);background:var(--paper)}
.abc .card.dark{background:var(--ink-block);color:var(--on-ink)}
.abc .card.dark .eyebrow{color:var(--on-ink-2)}
.abc .card.business{background:var(--ink-block);color:var(--on-ink)}
.abc .card.business .eyebrow{color:var(--on-ink-2)}
.abc .card.business .area-title{color:#fff}
.abc .card.business .h-3{color:#fff}
.abc .card.business p{color:var(--on-ink-2)}
.abc .card.business .list li{color:#E4DAC2}
.abc .card.business .list svg{stroke:var(--amber)}

.abc .area-letter{
  font-family:var(--serif);font-size:42px;line-height:1;font-weight:400;
  letter-spacing:-.02em;color:var(--ink);
}
.abc .card.business .area-letter,
.abc .card.dark .area-letter{color:#fff}

.abc .area-title{
  display:flex;align-items:baseline;gap:12px;margin-bottom:10px;
}
.abc .area-title small{
  font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2);
  padding-bottom:4px;border-bottom:1px solid var(--amber);
}
.abc .card.business .area-title small,
.abc .card.dark .area-title small{color:var(--on-ink-2);border-bottom-color:var(--amber)}

.abc p.lede{font-size:14px;line-height:1.4;color:var(--ink-2);margin:0 0 12px;max-width:240px}
.abc .list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.abc .list li{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--ink)}
.abc .list li.with-sub{align-items:flex-start}
.abc .list li.with-sub svg{margin-top:2px}
.abc .list .li-text{display:flex;flex-direction:column;line-height:1.25}
.abc .list .li-label{font-size:13.5px;font-weight:500;color:var(--ink)}
.abc .list .li-sub{font-size:11.5px;color:var(--ink-2);margin-top:2px;letter-spacing:.01em}
.abc .card.business .li-label,
.abc .card.dark .li-label{color:#fff}
.abc .card.business .li-sub,
.abc .card.dark .li-sub{color:var(--on-ink-2)}
.abc .list svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.6;flex:0 0 18px;color:var(--ink-2)}
.abc .card.business .list svg,
.abc .card.dark .list svg{color:#E4DAC2}
.abc .card .foot{margin-top:auto;padding-top:14px;border:0}

/* ABC overview card */
.abc-overview .triangle{
  position:relative;
  width:120px;height:120px;margin:0 auto;
}
.abc-overview .triangle svg{width:100%;height:100%}
.abc-overview .triangle .node{
  position:absolute;width:26px;height:26px;border-radius:50%;
  background:var(--amber);color:var(--on-amber);
  display:grid;place-items:center;
  font-family:var(--serif);font-size:14px;font-weight:600;
}
.abc-overview .triangle .node.a{top:0;left:50%;transform:translateX(-50%)}
.abc-overview .triangle .node.b{bottom:0;left:0}
.abc-overview .triangle .node.c{bottom:0;right:0}
.abc-overview .net-illustration{position:absolute;right:18px;top:18px;width:80px;height:60px;opacity:.5}

/* faint network behind area cards */
.abc .card .bg-net{position:absolute;right:8px;top:50%;width:178px;height:178px;opacity:.34;pointer-events:none;overflow:visible;transform:translateY(-50%)}
.abc .card .bg-net-image{object-fit:contain;object-position:center;opacity:.55}
.abc .card .bg-net-lines{opacity:.42}
.abc .card .bg-net-nodes{opacity:.42}
.abc .card.business .bg-net{right:20px;top:50%;width:144px;height:144px;opacity:.62}
.abc .card.business .bg-net-lines{opacity:.72}
.abc .card.business .bg-net-nodes{opacity:.78}
.abc .card.business .bg-net-image{opacity:.9}
.abc .card .bg-net-radial{transform:translateY(-50%) rotate(-7deg)}
.abc .card .bg-net-mesh{right:6px;top:50%;opacity:.3}
.abc .card .bg-net-image.bg-net-mesh{opacity:.58}

/* ===== Core temas ===== */
.themes{
  margin-top:19px;padding-bottom:0;
}
.themes-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
}
.theme{
  padding:22px 22px 22px;display:flex;flex-direction:column;gap:14px;
  background:var(--paper);
  border:1px solid var(--rule);
  transition:background .2s ease;
  position:relative;
  min-height:170px;
}
.theme .ic{width:44px;height:44px;display:grid;place-items:center;color:var(--ink)}
.theme:hover{background:#fff}
/* SVG icons inherit color from currentColor across the page */
.theme .ic svg,
.pillar-mini .icon-row svg,
.abc .list svg,
.news .feat svg,
.cc-badge svg{
  color: inherit;
  stroke: currentColor;
}

/* keep stroke-based icons crisp at scaled sizes */
.theme .ic svg{width:44px;height:44px;stroke-width:1.6;fill:none}
.theme .ic svg [fill="currentColor"]{fill:currentColor}
.theme h4{font-size:14px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;margin:0}
.theme p{font-size:13.5px;line-height:1.55;color:var(--ink-2);margin:0}
.theme .theme-link{margin-top:auto;align-self:flex-start}
/* Yellow-square CTA arrow — reusable across themes, articles, etc. */
.theme-cta{
  display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;
  margin-left:8px;vertical-align:-6px;
  background:var(--insight);
  flex:0 0 24px;
  transition:background .2s ease, transform .2s ease;
}
.theme-cta svg{width:14px;height:14px;stroke:var(--navy);stroke-width:2;fill:none}
.theme-cta:hover{background:var(--insight-2);transform:translateX(2px)}

/* ===== Articles ===== */
.articles{margin-top:19px}
.articles-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
}
.article{display:flex;flex-direction:column;gap:10px;position:relative}
.badge-new{
  position:absolute;top:10px;right:10px;
  background:var(--insight);color:var(--on-amber);
  font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  padding:4px 8px;z-index:3;
}
.article .thumb{
  aspect-ratio: 16/10;
  background:#0B1D3A;
  position:relative;overflow:hidden;
}
.article-thumb-link{display:block;color:inherit;text-decoration:none}
.article-title-link{color:inherit;text-decoration:none;transition:color .2s ease}
.article-title-link:hover{color:var(--navy)}
.article-thumb-link:focus-visible,.article-title-link:focus-visible{outline:2px solid var(--insight);outline-offset:3px}
/* --- Tarjeta de entrevista (miniatura YouTube + play) --- */
.article .thumb.ac-iv-thumb{display:block;cursor:pointer}
.ac-iv-img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;display:block;
  transition:transform .5s ease;
}
.article:hover .ac-iv-img{transform:scale(1.04)}
.ac-iv-shade{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(11,29,58,0) 45%,rgba(11,29,58,.5) 100%);
}
.ac-iv-thumb .photo-frame .frame-corner{border-color:rgba(250,250,248,.6)}
.ac-iv-play{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:54px;height:54px;display:flex;align-items:center;justify-content:center;
  background:rgba(250,250,248,.92);color:var(--azul-marino);
  box-shadow:0 6px 18px -6px rgba(11,29,58,.5);
  transition:transform .25s ease,background .25s ease;
}
.article:hover .ac-iv-play{transform:translate(-50%,-50%) scale(1.08);background:var(--insight,#FFC72C)}
.ac-iv-play svg{width:24px;height:24px;fill:currentColor;margin-left:2px}
.article .thumb .grid-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.article .thumb .photo-frame{position:absolute;inset:14px;pointer-events:none}
.article .thumb .frame-corner{position:absolute;width:14px;height:14px;border:1px solid rgba(11,29,58,.35)}
.article .thumb .photo-frame.dark .frame-corner{border-color:rgba(255,199,44,.45)}
.article .thumb .frame-corner.tl{top:0;left:0;border-right:0;border-bottom:0}
.article .thumb .frame-corner.tr{top:0;right:0;border-left:0;border-bottom:0}
.article .thumb .frame-corner.bl{bottom:0;left:0;border-right:0;border-top:0}
.article .thumb .frame-corner.br{bottom:0;right:0;border-left:0;border-top:0}
.article .thumb .photo-label-row{
  position:absolute;left:14px;right:14px;bottom:14px;
  display:flex;flex-direction:column;gap:4px;align-items:flex-start;
}
.article .thumb .photo-type{
  font-family:var(--sans);font-size:9.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  background:rgba(250,250,248,.92);color:var(--azul-marino);padding:5px 8px;
}
.article .thumb.photo-placeholder .photo-frame.dark ~ .photo-label-row .photo-type{
  background:rgba(11,29,58,.85);color:#FFC72C;
}
.article .thumb .photo-cap{
  font-family:var(--mono);font-size:11px;color:rgba(11,29,58,.7);
  background:rgba(250,250,248,.8);padding:3px 7px;
}
.article .thumb.photo-placeholder .photo-frame.dark ~ .photo-label-row .photo-cap{
  background:rgba(11,29,58,.7);color:rgba(255,199,44,.85);
}
.article .meta{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
.article .meta .cat{color:var(--amber-2)}
.article .meta .dot{color:var(--muted)}
.article .meta .date{color:var(--muted)}
.article h3{font-family:var(--serif);font-weight:400;font-size:17px;line-height:1.3;margin:0;letter-spacing:-.005em}
.article h3 .theme-cta{margin-left:6px;vertical-align:-5px}
.article-link{
  display:inline-flex;align-items:center;gap:10px;
  font-size:13px;font-weight:600;letter-spacing:.02em;
  color:var(--ink);
  margin-top:auto;align-self:flex-start;
  transition:color .2s ease;
}
.article-link:hover{color:var(--navy)}
.article-link:hover .theme-cta{background:var(--insight-2);transform:translateX(2px)}
.article .read{margin-top:2px}
.article .premium{
  display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--amber-2);margin-top:2px;
}
.article .premium svg{width:12px;height:12px;stroke:var(--amber-2);fill:none;stroke-width:1.6}

/* ===== Newsletter strip ===== */
.news{
  margin-top:28px;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  padding:22px 0 18px;
  background:var(--bg-soft);
}
.news .inner{
  display:grid;
  grid-template-columns: 1.15fr 0.9fr 0.9fr 0.9fr 0.9fr auto;
  gap:28px;align-items:center;
}
.news .pitch{display:flex;gap:14px;align-items:flex-start}
.news .pitch .brackets{font-family:var(--sans);font-size:32px;font-weight:300;color:var(--ink);line-height:.9;letter-spacing:-.05em}
.news .pitch p{font-size:13px;line-height:1.4;margin:0;max-width:260px;color:var(--ink);font-weight:500}
.news .feat{display:flex;gap:12px;align-items:center}
.news .feat svg{width:28px;height:28px;stroke:var(--ink);fill:none;stroke-width:1.3;flex:0 0 28px}
.news .feat p{margin:0;font-size:12.5px;line-height:1.35;color:var(--ink)}
.news .feat p strong{display:block;font-weight:700;font-size:13px;letter-spacing:.005em}

.btn-news{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--ink-block);color:var(--on-ink);
  padding:13px 20px;font-size:13px;font-weight:600;letter-spacing:.01em;
  white-space:nowrap;
}
.btn-news svg{width:14px;height:14px;stroke:var(--amber)}
.btn-news:hover{background:var(--ink-block-2)}

/* social-proof line under the newsletter row */
.news-foot{
  display:flex;align-items:center;gap:10px;
  margin-top:14px;padding-top:12px;
  border-top:1px dashed var(--rule);
  font-size:12.5px;color:var(--ink-2);letter-spacing:.01em;
}
.news-foot strong{color:var(--navy);font-weight:700}
.news-foot .dot-live{
  width:8px;height:8px;border-radius:50%;
  background:var(--insight);
  box-shadow:0 0 0 3px rgba(255,199,44,.25);
  display:inline-block;
}

/* ===== Footer ===== */
footer.foot{
  padding:36px 0 22px;
  border-top:1px solid var(--rule);
}
.foot-grid{
  display:grid;
  grid-template-columns: 1.3fr 1fr 1fr 1fr;
  gap:36px;
  padding-bottom:28px;
  border-bottom:1px solid var(--rule);
}
.foot-brand{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.foot-mission{
  font-size:12.5px;line-height:1.5;color:var(--ink-2);margin:4px 0 4px;
  max-width:220px;
}
.foot-col h5{
  font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink);margin:8px 0 14px;
}
.foot-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:9px}
.foot-col a{font-size:13.5px;color:var(--ink-2);transition:color .15s ease}
.foot-col a:hover{color:var(--navy)}

.foot-bottom{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:18px;gap:18px;flex-wrap:wrap;
}
.foot-copy{font-size:12.5px;color:var(--muted)}
.foot-bottom .social{display:flex;gap:14px;color:var(--ink)}
.foot-bottom .social a{width:22px;height:22px;display:grid;place-items:center}
.foot-bottom .social svg{width:18px;height:18px;fill:currentColor}
.foot-bottom .social a:hover{color:var(--navy)}
.foot .inner{
  display:none; /* legacy — replaced by .foot-grid */
}
.foot .links{display:none}
.cc-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 10px;
  border:1px solid var(--rule);
  font-size:11.5px;font-weight:600;letter-spacing:.04em;
  color:var(--ink);
  transition:border-color .2s ease, color .2s ease;
}
.cc-badge svg{width:18px;height:18px;stroke:var(--ink);fill:none}
.cc-badge .cc-text{margin-left:4px}
.cc-badge:hover{border-color:var(--navy);color:var(--navy)}
.foot .social{display:none}
.foot .social a{display:none}
.foot .social svg{display:none}
.foot .social a:hover{color:var(--navy)}

/* =====================================================================
   ACADEMIC PAGE
   ===================================================================== */

/* --- Breadcrumbs --- */
.breadcrumbs{
  display:flex;align-items:center;gap:12px;
  padding:36px 32px 32px;
  font-size:13px;font-weight:500;letter-spacing:.04em;
  color:var(--ink-2);
  border-bottom:1px solid var(--rule);
  background:var(--bg);
}
.breadcrumbs a{color:var(--ink-2);transition:color .15s ease}
.breadcrumbs a:hover{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.breadcrumbs .sep{color:var(--muted);font-weight:400}
.breadcrumbs [aria-current="page"]{color:var(--navy);font-weight:600}

/* --- Hero --- */
.ac-hero{
  padding:40px 0 32px;
  border-bottom:1px solid var(--rule);
}
.ac-hero-grid{
  display:grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap:56px;
  align-items:start;
}
.ac-hero-text{display:flex;flex-direction:column}
.ac-eyebrow{color:var(--ink-2);margin-bottom:14px}
.ac-title{
  font-size:48px;line-height:1.05;margin:0 0 18px;
  color:var(--navy);font-weight:400;
}
.ac-lede{
  font-size:15px;line-height:1.55;color:var(--ink-2);
  max-width:420px;margin:0;
}
.bz-hero-lede{display:flex;flex-direction:column;gap:13px}
.bz-hero-lede .bz-lede-lead{
  font-family:var(--serif);font-weight:400;font-size:19px;line-height:1.4;
  letter-spacing:-.005em;color:var(--navy);max-width:440px;
}
.ac-rule{
  display:block;width:48px;height:2px;
  background:var(--amber);margin-top:22px;
}

/* hero photo placeholder */
.ac-hero-photo{
  position:relative;
  aspect-ratio: 16/10;
  background:
    radial-gradient(80% 65% at 70% 45%, #C9BEA8 0%, #8E7E63 55%, #3F3623 100%);
  overflow:hidden;
}
.ac-hero-photo.has-img{background:#0B1D3A}
.ac-hero-photo .ac-hero-img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  object-position:center 38%;
  display:block;z-index:0;
}
.ac-hero-photo .grid-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.ac-hero-photo .frame-corners{position:absolute;inset:18px;pointer-events:none}
.ac-hero-photo .frame-corners span{position:absolute;width:18px;height:18px;border:1px solid rgba(250,250,248,.55)}
.ac-hero-photo .frame-corners .tl{top:0;left:0;border-right:0;border-bottom:0}
.ac-hero-photo .frame-corners .tr{top:0;right:0;border-left:0;border-bottom:0}
.ac-hero-photo .frame-corners .bl{bottom:0;left:0;border-right:0;border-top:0}
.ac-hero-photo .frame-corners .br{bottom:0;right:0;border-left:0;border-top:0}
.ac-hero-photo .photo-meta{
  position:absolute;top:24px;left:24px;display:flex;flex-direction:column;gap:6px;align-items:flex-start;z-index:2;
}
.ac-hero-photo .photo-meta .type{
  font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  background:rgba(250,250,248,.92);color:var(--azul-marino);padding:6px 10px;
}
.ac-hero-photo .photo-meta .cap{
  font-family:var(--mono);font-size:11px;color:rgba(11,29,58,.78);
  background:rgba(250,250,248,.85);padding:4px 9px;
}
.ac-hero-photo .photo-bottom{
  position:absolute;bottom:24px;right:24px;z-index:2;
}
.ac-hero-photo .photo-bottom .principle{
  font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(11,29,58,.85);background:rgba(250,250,248,.78);padding:5px 9px;
}

/* --- Section heading (numbered) ---
   Ritmo vertical:
   - section→section: 64px
   - heading → contenido: 24px
*/
/* First .ac-section sits below the hero (which has its own border-bottom) */
.ac-section{padding:64px 32px 0}
/* Section dividers: hairline between consecutive sections, with breathing room above and below. */
.ac-section + .ac-section{
  margin-top:32px;
  border-top:1px solid var(--rule);
  padding-top:56px;
}
.ac-section-head{
  display:grid;
  grid-template-columns: 1fr auto;
  align-items:end;
  gap:24px;
  margin-bottom:24px;
}
.ac-section-head-left{display:flex;flex-direction:column;gap:6px;min-width:0}
.ac-section-title{
  font-family:var(--serif);font-weight:400;
  font-size:30px;line-height:1.15;letter-spacing:-.005em;
  color:var(--navy);margin:0;
}
.ac-section-title .ac-num{font-family:var(--serif);color:var(--navy);font-weight:400}
.ac-section-lede{
  font-size:13.5px;line-height:1.5;color:var(--ink-2);margin:2px 0 0;max-width:680px;
}

/* --- 1. Cursos --- */
/* Índice por área (cabecera de catálogo) */
.ac-cat-index{
  display:flex;align-items:baseline;gap:18px;
  padding:0 0 14px;margin:0 0 24px;
  border-bottom:1px solid var(--rule);
}
.ac-cat-index-label{color:var(--muted);white-space:nowrap}
.ac-cat-index-rule{
  flex:1;height:0;align-self:center;
  border-bottom:1px dotted var(--rule);
}
.ac-cat-index-total{
  font-family:var(--serif);font-weight:400;font-size:19px;
  color:var(--navy);white-space:nowrap;
}
/* recuento por área dentro de la card */
.ac-cat-count strong{font-weight:800}

.ac-vip-legend{
  display:inline-flex;align-items:center;gap:10px;
  margin:20px 0 0;
  font-size:12.5px;color:var(--ink-2);
}
.ac-vip-legend strong{color:var(--navy);font-weight:700}
.ac-vip-legend .ac-vip-dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--insight);
  box-shadow:0 0 0 3px rgba(255,199,44,.25);
}

.ac-courses-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
}
.ac-courses-grid.four{grid-template-columns:repeat(4,1fr);gap:20px}
.ac-course{
  position:relative;
  display:flex;flex-direction:column;
  background:var(--paper);
  border:1px solid var(--rule);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ac-course:hover{transform:translateY(-2px);border-color:var(--navy);box-shadow:var(--shadow-card)}

.ac-vip{
  position:absolute;top:12px;right:12px;z-index:4;
  background:var(--ink-block);color:var(--insight);
  font-family:var(--sans);font-size:9.5px;font-weight:700;letter-spacing:.18em;
  padding:4px 8px;
}

.ac-thumb{
  position:relative;aspect-ratio: 16/9;overflow:hidden;
}
.ac-thumb .thumb-pattern{position:absolute;inset:0;width:100%;height:100%}
.ac-thumb.has-img{background:var(--bg-soft)}
.ac-thumb-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ac-thumb-frame{position:absolute;inset:12px;pointer-events:none}
.ac-thumb-frame .fc{position:absolute;width:12px;height:12px;border:1px solid rgba(250,250,248,.4)}
.ac-thumb.light .ac-thumb-frame .fc{border-color:rgba(11,29,58,.3)}
.ac-thumb-frame .fc.tl{top:0;left:0;border-right:0;border-bottom:0}
.ac-thumb-frame .fc.tr{top:0;right:0;border-left:0;border-bottom:0}
.ac-thumb-frame .fc.bl{bottom:0;left:0;border-right:0;border-top:0}
.ac-thumb-frame .fc.br{bottom:0;right:0;border-left:0;border-top:0}
.ac-featured{
  position:absolute;top:14px;left:14px;
  background:var(--insight);color:var(--on-amber);
  font-family:var(--sans);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  padding:5px 9px;z-index:3;
}
.ac-course-body{padding:20px 22px 18px;display:flex;flex-direction:column;gap:10px;flex:1}
.ac-cat{
  font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--amber-2);
}
.ac-course-title{
  font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.25;
  color:var(--navy);margin:0;
}
.ac-course-lede{
  font-size:13.5px;line-height:1.55;color:var(--ink-2);margin:0 0 8px;
}
.ac-course-link{
  margin-top:auto;padding-top:14px;
  border-top:1px solid var(--rule);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  font-size:13px;font-weight:600;color:var(--ink);
}
.ac-course-link:hover{color:var(--navy)}
.ac-course-link:hover .theme-cta{background:var(--insight-2);transform:translateX(2px)}

/* --- 2. Escuelas --- */
.ac-schools-wrap{
  margin-top:56px;
  background:var(--bg-soft);
  padding:8px 0 40px;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
}
.ac-schools-wrap .ac-section{padding-top:40px;padding-bottom:0}
.ac-schools{
  display:flex;flex-direction:column;
  border-top:1px solid var(--rule);
}
.ac-school{
  display:grid;
  grid-template-columns: 280px 1fr auto;
  gap:24px;align-items:center;
  padding:18px 4px;
  border-bottom:1px solid var(--rule);
  color:var(--ink);
  transition:padding .2s ease;
}
.ac-school:hover{padding-left:10px;padding-right:0}
.ac-school:hover .ac-school-name{color:var(--navy)}
.ac-school:hover .ac-school-arrow{transform:translateX(4px)}
.ac-school-name{
  font-family:var(--sans);font-weight:600;font-size:14.5px;color:var(--navy);
  letter-spacing:-.005em;
}
.ac-school-desc{font-size:13px;color:var(--ink-2);line-height:1.45}
.ac-school-arrow{
  display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;color:var(--navy);
  transition:transform .2s ease;
}
.ac-school-arrow svg{width:16px;height:16px;stroke:var(--navy);stroke-width:1.8;fill:none}
.ac-schools-more{margin-top:18px;display:inline-flex}

/* inline schools (under courses) — una sola línea sutil */
.ac-schools-inline{
  display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;
  margin-top:32px;
}
.ac-schools-inline-label{
  font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-2);
}
.ac-schools-inline-list{
  list-style:none;padding:0;margin:0;
  display:flex;flex-wrap:wrap;gap:6px 0;flex:1;
}
.ac-schools-inline-list li{
  font-family:var(--sans);font-size:13.5px;font-weight:500;color:var(--ink);
  letter-spacing:-.005em;
}
.ac-schools-inline-list li + li::before{
  content:"·";display:inline-block;margin:0 12px;color:var(--muted);font-weight:400;
}
.ac-schools-inline-more{white-space:nowrap;font-size:12.5px}

/* --- 2. Conferencias — ahora como cards consistentes con Cursos --- */
.ac-talks-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
}
.ac-talks-grid.four{grid-template-columns:repeat(4,1fr);gap:20px}
.ac-talk{
  padding:22px 22px 18px;
  background:var(--paper);
  border:1px solid var(--rule);
  display:flex;flex-direction:column;gap:10px;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ac-talk:hover{transform:translateY(-2px);border-color:var(--navy);box-shadow:var(--shadow-card)}
.ac-talk-title{
  font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.25;
  color:var(--navy);margin:0;letter-spacing:-.005em;
}
.ac-talk-lede{
  font-size:13.5px;line-height:1.55;color:var(--ink-2);margin:0;
}
.ac-talk-foot{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:auto;padding-top:14px;
  border-top:1px solid var(--rule);
}
.ac-talk-meta{
  font-size:11.5px;font-weight:600;color:var(--ink-2);
  letter-spacing:.04em;
  display:inline-flex;align-items:center;gap:8px;
}
.ac-talk-meta .dot{color:var(--muted)}
.ac-talk-date{color:var(--ink)}
.ac-talk-n{
  font-family:var(--sans);font-size:11px;font-weight:600;
  letter-spacing:.14em;color:var(--ink-2);
  display:inline-block;margin-bottom:2px;
}
.ac-talk-link{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);font-size:12.5px;font-weight:600;
  letter-spacing:.02em;color:var(--navy);
  text-decoration:none;
}
.ac-talk-link:hover{color:var(--navy)}

/* --- 3. Libros — marco 16:10 sin fondo, consistente con cards --- */
.ac-books-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
}
.ac-books-grid.four{grid-template-columns:repeat(4,1fr);gap:20px}
.ac-book{
  display:flex;flex-direction:column;
  background:var(--paper);
  border:1px solid var(--rule);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ac-book:hover{transform:translateY(-2px);border-color:var(--navy);box-shadow:var(--shadow-card)}
.ac-book-cover{
  position:relative;
  aspect-ratio: 16/10;
  overflow:hidden;
  background:var(--bg-soft);
  display:flex;align-items:center;justify-content:center;
  padding:14px 0;
  border-bottom:1px solid var(--rule);
}
.ac-book-cover img{
  max-width:100%;max-height:100%;
  height:100%;width:auto;
  object-fit:contain;display:block;
  box-shadow:
    1px 0 0 rgba(11,29,58,.18),
    3px 4px 10px rgba(11,29,58,.15);
}
.ac-book-body{display:flex;flex-direction:column;gap:8px;min-width:0;padding:18px 20px 16px;flex:1}
.ac-book-title{
  font-family:var(--serif);font-weight:400;font-size:19px;line-height:1.2;
  color:var(--navy);margin:0;letter-spacing:-.005em;
}
.ac-book-lede{
  font-size:13px;line-height:1.5;color:var(--ink-2);margin:0;
}
.ac-book-foot{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-top:auto;padding-top:14px;
  border-top:1px solid var(--rule);
}
.ac-book-pub{
  font-size:11px;font-weight:700;color:var(--muted);letter-spacing:.12em;text-transform:uppercase;
}

/* --- Resources strip --- */
.ac-resources-wrap{
  margin-top:72px;
  background:var(--bg-soft);
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  padding:32px 0 36px;
}
.ac-resources-title{
  font-family:var(--sans);font-weight:600;font-size:15px;
  color:var(--navy);margin:0 0 20px;letter-spacing:-.005em;
}
.ac-resources-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr) 1.15fr;
  gap:24px;
  align-items:stretch;
}
.ac-resource{
  display:flex;flex-direction:column;gap:8px;
  padding:4px 18px 4px 0;
  border-right:1px solid var(--rule);
  color:var(--ink);
  transition:transform .2s ease;
}
.ac-resource:last-child{border-right:0}
.ac-resource:hover{transform:translateY(-1px)}
.ac-resource-ic{width:22px;height:22px;display:grid;place-items:center;color:var(--navy);margin-bottom:6px}
.ac-resource-ic svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.6}
.ac-resource-title{
  font-family:var(--sans);font-weight:600;font-size:13.5px;color:var(--navy);
  letter-spacing:-.005em;
}
.ac-resource-desc{
  font-size:12px;line-height:1.5;color:var(--ink-2);
}
.ac-resource-arrow{
  margin-top:auto;display:inline-flex;align-items:center;gap:6px;
  color:var(--navy);
  font-size:12px;font-weight:600;
}
.ac-resource-arrow svg{width:14px;height:14px;stroke:var(--navy);stroke-width:1.8;fill:none}
.ac-resource:hover .ac-resource-arrow{transform:translateX(2px)}

/* highlighted ('¿Nuevo por aquí?') card */
.ac-resource-hi{
  background:var(--paper);
  border:1px solid var(--rule);
  border-right:1px solid var(--rule);
  padding:18px 20px;
  position:relative;
}
.ac-resource-ic-hi{
  width:36px;height:36px;
  background:var(--azul-claro);color:var(--navy);
  display:grid;place-items:center;
  margin-bottom:8px;
}
.ac-resource-ic-hi svg{width:20px;height:20px}
.ac-resource-arrow-hi{
  border-bottom:1.5px solid var(--amber-2);padding-bottom:4px;align-self:flex-start;
}

/* responsive */
@media (max-width: 1180px){
  .ac-resources-grid{grid-template-columns: repeat(3, 1fr); gap:20px}
  .ac-resources-grid .ac-resource:nth-child(3){border-right:0}
  .ac-resources-grid .ac-resource-hi{grid-column: span 3}
}
@media (max-width: 720px){
  .ac-hero-grid{grid-template-columns:1fr;gap:32px}
  .ac-courses-grid, .ac-courses-grid.four{grid-template-columns:1fr}
  .ac-talks-grid, .ac-talks-grid.four{grid-template-columns:1fr}
  .ac-talk{border-right:0}
  .ac-books-grid, .ac-books-grid.four{grid-template-columns:1fr}
  .ac-school{grid-template-columns: 1fr;gap:6px}
  .ac-school-arrow{justify-self:end}
  .ac-resources-grid{grid-template-columns:1fr}
  .ac-schools-inline{grid-template-columns:1fr;gap:12px}
  .ac-schools-inline-label{border-right:0;padding-right:0;padding-bottom:8px;border-bottom:1px solid var(--rule)}
}

/* misc helpers */
.row{display:flex}
.between{justify-content:space-between}
.center{align-items:center}
.gap-12{gap:12px}
.gap-24{gap:24px}
.gap-32{gap:32px}
.mt-8{margin-top:8px}
.mt-16{margin-top:16px}
.mt-24{margin-top:24px}
.mt-32{margin-top:32px}
.mt-48{margin-top:48px}

/* responsive cutoff — only collapse on real mobile, not narrow previews */
@media (max-width: 720px){
  .hero-card{height:420px}
  .hero-bg{object-position:50% center}
  .hero-copy{width:52%;padding:28px 0 28px 24px}
  .hero-copy .h-display{font-size:26px;line-height:1.08;margin-bottom:14px}
  .hero-lede{font-size:13px;line-height:1.45}
  .abc{grid-template-columns:1fr 1fr}
  .themes-grid{grid-template-columns:repeat(2,1fr)}
  .articles-grid{grid-template-columns:1fr}
  .news .inner{grid-template-columns:1fr}
}
/* keep nav compact at medium widths so it doesn't wrap */
@media (max-width: 1180px){
  .nav{gap:22px}
  .nav a{font-size:13px}
  .container{padding:0 24px}
}

/* =====================================================================
   BUSINESS PAGE
   ===================================================================== */

/* --- Hero photo (oficina · trabajo) — variante editorial --- */
.bz-hero-photo{
  position:relative;
  aspect-ratio: 16/10;
  background:#060C1A;
  overflow:hidden;
}
.bz-hero-photo img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
}
.bz-hero-photo .grid-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.bz-hero-photo .frame-corners{position:absolute;inset:18px;pointer-events:none}
.bz-hero-photo .frame-corners span{position:absolute;width:18px;height:18px;border:1px solid rgba(214,228,242,.4)}
.bz-hero-photo .frame-corners .tl{top:0;left:0;border-right:0;border-bottom:0}
.bz-hero-photo .frame-corners .tr{top:0;right:0;border-left:0;border-bottom:0}
.bz-hero-photo .frame-corners .bl{bottom:0;left:0;border-right:0;border-top:0}
.bz-hero-photo .frame-corners .br{bottom:0;right:0;border-left:0;border-top:0}
.bz-hero-photo .photo-meta{
  position:absolute;top:24px;left:24px;display:flex;flex-direction:column;gap:6px;align-items:flex-start;z-index:2;
}
.bz-hero-photo .photo-meta .type{
  font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  background:rgba(250,250,248,.92);color:var(--azul-marino);padding:6px 10px;
}
.bz-hero-photo .photo-meta .cap{
  font-family:var(--mono);font-size:11px;color:rgba(11,29,58,.78);
  background:rgba(250,250,248,.85);padding:4px 9px;
}
.bz-hero-photo .photo-bottom{
  position:absolute;bottom:24px;right:24px;z-index:2;
}
.bz-hero-photo .photo-bottom .principle{
  font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:#fff;background:rgba(11,29,58,.55);padding:5px 9px;
  border:1px solid rgba(255,199,44,.4);
}

/* --- Foxize: feature project block --- */
.bz-foxize-wrap{
  margin:48px 0 0;
  background:var(--azul-claro);
  border-top:1px solid rgba(11,29,58,.08);
  border-bottom:1px solid rgba(11,29,58,.08);
}
.bz-foxize{
  display:grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap:48px;
  align-items:center;
  padding:40px 32px 36px;
}
.bz-foxize-text{display:flex;flex-direction:column}
.bz-foxize-cta{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.bz-foxize-eyebrow{color:#34507F;margin-bottom:14px}
.bz-foxize-title{
  font-family:var(--serif);font-weight:400;
  font-size:48px;line-height:1.05;letter-spacing:-.01em;
  color:var(--navy);margin:0 0 14px;
}
.bz-foxize-lede{
  font-size:14.5px;line-height:1.55;color:var(--ink-2);
  margin:0 0 28px;max-width:440px;
}

.bz-foxize-pillars{
  display:grid;grid-template-columns:repeat(3, 1fr);gap:18px;
  margin:0 0 28px;max-width:460px;
}
.bz-foxize-pillars .pillar-mini h4{
  font-family:var(--sans);font-weight:600;font-size:12.5px;
  letter-spacing:-.005em;text-transform:none;line-height:1.35;
  color:var(--navy);margin:6px 0 0;max-width:130px;
}
.bz-foxize-pillars .pillar-mini .icon-row svg{
  width:26px;height:26px;color:var(--navy);stroke-width:1.5;
}

.bz-foxize-body{
  font-size:13.5px;line-height:1.6;color:var(--ink-2);
  margin:0 0 28px;max-width:460px;
}

.bz-role-label{
  font-family:var(--sans);font-size:11px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:#34507F;
  margin-bottom:8px;
}
.bz-role-list{
  display:flex;flex-wrap:wrap;gap:6px 0;font-size:13.5px;color:var(--ink);
  margin-bottom:24px;
}
.bz-role-list span + span::before{
  content:"·";display:inline-block;margin:0 12px;color:var(--muted);
}
/* btn-navy — CTA secundario navy. Definición ÚNICA (antes duplicada en dos
   sitios con valores en conflicto; gana la full-width, que es la que se
   conserva aquí + las props que solo aportaba la otra: nowrap/align-self). */
.btn-navy{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  background:var(--ink-block);color:var(--on-ink);
  padding:14px 22px;font-size:14px;font-weight:600;letter-spacing:.01em;
  white-space:nowrap;align-self:flex-start;width:100%;
  transition:background .2s ease, transform .2s ease;
}
.btn-navy svg{width:18px;height:18px;stroke:var(--insight);stroke-width:2;fill:none}
.btn-navy:hover{background:var(--ink-block-2);transform:translateY(-1px)}

/* --- Foxize: real product screenshot --- */
.bz-foxize-shot{margin:0;align-self:center}
.bz-foxize-shot-frame{
  position:relative;background:#0B1D3A;padding:8px;
  box-shadow:0 18px 34px -12px rgba(11,29,58,.4);
}
.bz-foxize-shot-frame img{
  display:block;width:100%;height:auto;
  border:1px solid rgba(11,29,58,.2);
}
.bz-foxize-shot-frame .frame-corners{position:absolute;inset:18px;pointer-events:none;z-index:2}
.bz-foxize-shot-frame .frame-corners span{position:absolute;width:16px;height:16px;border:1px solid rgba(250,250,248,.5)}
.bz-foxize-shot-frame .frame-corners .tl{top:0;left:0;border-right:0;border-bottom:0}
.bz-foxize-shot-frame .frame-corners .tr{top:0;right:0;border-left:0;border-bottom:0}
.bz-foxize-shot-frame .frame-corners .bl{bottom:0;left:0;border-right:0;border-top:0}
.bz-foxize-shot-frame .frame-corners .br{bottom:0;right:0;border-left:0;border-top:0}
.bz-foxize-shot-cap{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.02em;
  color:var(--ink-2);margin-top:12px;
}

/* --- Otros proyectos --- */
.bz-projects{
  margin-top:48px;
}
.bz-projects-label{
  font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-2);margin:0 0 18px;
}
.bz-projects-grid{
  display:grid;grid-template-columns:repeat(3, 1fr);gap:20px;
}
.bz-project{
  display:grid;
  grid-template-columns: 84px 1fr;
  gap:18px;
  padding:4px 0 16px;
  align-items:start;
}
.bz-project-logo{
  width:84px;height:84px;display:grid;place-items:center;
  font-family:var(--sans);font-weight:700;line-height:1;
  letter-spacing:-.01em;text-align:center;
  padding:8px;font-size:14px;
  background:var(--paper);border:1px solid var(--rule);
}
.bz-project-logo.has-img{padding:13px}
.bz-project-logo.has-img img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.bz-project-logo.rentingcar .lg-1{color:var(--navy);font-weight:700}
.bz-project-logo.rentingcar .lg-2{color:var(--azul-medio);font-weight:600}
.bz-project-logo .lg-1{font-weight:700}
.bz-project-logo .lg-2{font-weight:500}
.bz-project-body{display:flex;flex-direction:column;gap:6px;min-width:0}
.bz-project-title{
  font-family:var(--serif);font-weight:400;font-size:18px;line-height:1.2;
  color:var(--navy);margin:0;letter-spacing:-.005em;
}
.bz-project-meta{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.03em;
  color:var(--muted);margin:0 0 2px;
}
.bz-project-desc{
  font-size:13px;line-height:1.5;color:var(--ink-2);margin:0;
}
.bz-project-desc + .bz-project-desc{margin-top:4px}
.bz-project-link{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  align-self:flex-start;
  margin-top:10px;padding:10px 16px;
  background:var(--ink-block);color:var(--on-ink);
  font-size:12.5px;font-weight:600;letter-spacing:.01em;
  white-space:nowrap;
  transition:background .2s ease, transform .2s ease;
}
.bz-project-link svg{width:15px;height:15px;stroke:var(--insight);stroke-width:2;fill:none}
.bz-project-link:hover{background:var(--ink-block-2);color:var(--on-ink);transform:translateY(-1px)}

/* --- Aprendizajes / Converge strips --- */
.bz-strip{
  margin-top:32px;
  background:var(--azul-claro);
  padding:24px 32px;
  display:grid;
  grid-template-columns: 290px repeat(3, 1fr);
  gap:24px;
  align-items:center;
}
.bz-strip-head{
  display:flex;align-items:center;gap:16px;
}
.bz-strip-ic{
  width:48px;height:48px;border-radius:50%;
  background:rgba(255,255,255,.55);
  display:grid;place-items:center;color:var(--navy);flex:0 0 48px;
}
.bz-strip-ic svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.5}
.bz-strip-title{
  font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.2;
  color:var(--navy);margin:0;letter-spacing:-.005em;
}
.bz-strip-item{
  font-size:13.5px;line-height:1.55;color:var(--ink);
  border-left:1px solid rgba(11,29,58,.12);padding-left:18px;
}

/* Converge — variant with stats */
.bz-converge{
  grid-template-columns: 290px 1fr auto;
  align-items:start;
  padding:28px 32px;
}
.bz-converge-body{
  font-size:13.5px;line-height:1.6;color:var(--ink);max-width:520px;
}
.bz-converge-body strong{color:var(--navy);font-weight:600}
.bz-converge-stats{
  display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));
  gap:0;background:rgba(255,255,255,.55);
  padding:18px 24px;border-left:1px solid rgba(11,29,58,.1);
}
.bz-stat{
  text-align:center;padding:0 12px;
  border-right:1px dashed rgba(11,29,58,.18);
}
.bz-stat:last-child{border-right:0}
.bz-stat .n{
  font-family:var(--serif);font-weight:400;font-size:30px;line-height:1;
  color:var(--navy);letter-spacing:-.01em;display:block;
}
.bz-stat .l{
  font-family:var(--sans);font-size:10.5px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);
  margin-top:6px;display:block;
}

@media (max-width: 1080px){
  .bz-foxize{grid-template-columns:1fr;gap:32px}
  .bz-projects-grid{grid-template-columns:1fr}
  .bz-strip{grid-template-columns:1fr;gap:14px}
  .bz-strip-item{border-left:0;border-top:1px solid rgba(11,29,58,.12);padding-left:0;padding-top:10px}
  .bz-converge{grid-template-columns:1fr;}
  .bz-converge-stats{border-left:0;border-top:1px solid rgba(11,29,58,.1)}
}


/* =====================================================================
   ARTICLES PAGE
   ===================================================================== */

/* --- Banner compacto con imagen --- */
.ar-banner{
  padding:22px 0 20px;
  border-bottom:1px solid var(--rule);
  background:var(--bg);
}
.ar-banner-inner{
  display:grid;
  grid-template-columns: auto 1fr minmax(260px, 340px);
  gap:32px;
  align-items:center;
}
.ar-banner-left{display:flex;flex-direction:column;gap:2px;min-width:0}
.ar-banner-eyebrow{
  color:var(--ink-2);font-size:10.5px;letter-spacing:.2em;
}
.ar-banner-title{
  font-family:var(--serif);font-weight:400;
  font-size:38px;line-height:1;letter-spacing:-.015em;
  color:var(--navy);margin:0;
}
.ar-banner-count{
  margin:8px 0 0;
  font-family:var(--sans);font-size:12.5px;font-weight:500;line-height:1.25;
  color:var(--ink-2);letter-spacing:.01em;
}
.ar-banner-lede{
  font-family:var(--sans);font-size:13.5px;line-height:1.5;
  color:var(--ink-2);margin:0;
  max-width:460px;
  padding-left:28px;
  border-left:1px solid var(--rule);
  text-wrap:pretty;
}

/* Imagen del banner (placeholder editorial 21:6) */
.ar-banner-photo{
  position:relative;
  aspect-ratio: 21/6;
  width:100%;
  background:
    linear-gradient(95deg, #E8E1D2 0%, #C4B89C 45%, #6A5D45 100%);
  overflow:hidden;
}
.ar-banner-photo .grid-overlay{
  position:absolute;inset:0;width:100%;height:100%;pointer-events:none;
}
.ar-banner-photo.has-img{background:#0B1D3A}
.ar-banner-img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center 42%;display:block;
}
.ar-banner-photo-frame{position:absolute;inset:10px;pointer-events:none}
.ar-banner-photo-frame .fc{
  position:absolute;width:12px;height:12px;border:1px solid rgba(250,250,248,.55);
}
.ar-banner-photo-frame .fc.tl{top:0;left:0;border-right:0;border-bottom:0}
.ar-banner-photo-frame .fc.tr{top:0;right:0;border-left:0;border-bottom:0}
.ar-banner-photo-frame .fc.bl{bottom:0;left:0;border-right:0;border-top:0}
.ar-banner-photo-frame .fc.br{bottom:0;right:0;border-left:0;border-top:0}
.ar-banner-photo-type{
  position:absolute;left:14px;bottom:14px;
  font-family:var(--sans);font-size:9.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  background:rgba(250,250,248,.92);color:var(--azul-marino);padding:4px 8px;
}

/* --- Filtros --- */
.ar-filters{padding:28px 32px 4px}
.ar-search{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:8px;
  align-items:center;
  margin:0 0 16px;
  padding:10px 12px;
  border:1px solid var(--rule);
  background:var(--paper);
}
.ar-search-ic{display:inline-flex;color:var(--muted)}
.ar-search-ic svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.6}
.ar-search input{
  width:100%;border:0;outline:0;background:transparent;color:var(--ink);
  font-family:var(--sans);font-size:14px;
}
.ar-search input::placeholder{color:var(--muted)}
.ar-filters-row{
  display:flex;align-items:center;gap:18px;
  padding-bottom:14px;border-bottom:1px solid var(--rule);
  flex-wrap:wrap;
}
.ar-chips{display:flex;gap:6px;align-items:center}
.ar-chip{
  font-family:var(--sans);font-size:12.5px;font-weight:600;letter-spacing:.01em;
  padding:8px 14px;color:var(--ink);
  background:transparent;border:1px solid transparent;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.ar-chip:hover{background:var(--tint-hover);color:var(--navy)}
.ar-chip.is-on{
  background:var(--ink-block);color:var(--on-ink);
}
.ar-chip.is-on:hover{background:var(--ink-block-2);color:#fff}

.ar-filter-sep{
  width:1px;height:30px;align-self:center;
  margin:0 8px;
  background:linear-gradient(to bottom, transparent 0, transparent 3px, var(--rule-2) 3px, var(--rule-2) 27px, transparent 27px);
}
.ar-chip-open{
  background:#fff;
  border-color:var(--rule);
  color:var(--navy);
  min-height:36px;
  padding:0 14px;
  display:inline-flex;align-items:center;
  box-shadow:0 1px 0 rgba(11,29,58,.03);
}
.ar-chip-open:hover{background:var(--bg-soft);border-color:var(--rule-2);color:var(--navy)}
.ar-chip-open.is-on{background:var(--navy);color:#fff;border-color:var(--navy)}
.ar-chip-open.is-on:hover{background:var(--ink-block-2);color:#fff}

.ar-tabs{display:flex;gap:18px;align-items:center}
.ar-tab{
  font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.01em;
  color:var(--ink-2);padding:8px 2px 6px;
  border-bottom:1.5px solid transparent;
  transition:color .15s ease, border-color .15s ease;
}
.ar-tab:hover{color:var(--navy)}
.ar-tab.is-on{
  color:var(--navy);font-weight:600;
  border-bottom-color:var(--amber-2);
}

.ar-sort{
  display:flex;align-items:center;gap:10px;
}
.ar-sort-label{
  font-family:var(--sans);font-size:12px;font-weight:500;color:var(--ink-2);
  letter-spacing:.02em;
}
.ar-select{position:relative;display:inline-flex;align-items:center}
.ar-select select{
  appearance:none;-webkit-appearance:none;
  font-family:var(--sans);font-size:13px;font-weight:600;color:var(--navy);
  background:transparent;border:0;
  padding:6px 22px 6px 0;cursor:pointer;outline:none;
  letter-spacing:-.005em;
}
.ar-select-caret{
  position:absolute;right:4px;top:50%;transform:translateY(-50%);
  color:var(--navy);font-size:13px;pointer-events:none;
}

.ar-meta-row{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:14px;
  font-family:var(--mono);font-size:10.5px;color:var(--muted);letter-spacing:.04em;
}
.ar-count strong{
  font-family:var(--sans);font-weight:500;color:var(--ink-2);
  letter-spacing:0;font-size:11.5px;
}

/* --- Grid 4 columnas --- */
.ar-grid-wrap{padding:14px 32px 16px}
.ar-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:28px 22px;
}
:root[data-density="spacious"] .ar-grid{gap:40px 26px}

.ar-card{
  display:flex;flex-direction:column;gap:14px;
  position:relative;
  background:transparent;
  height:100%;
}
.ar-card-thumb{position:relative;display:block;cursor:pointer}
.ar-title-link{color:inherit;text-decoration:none}
.ar-title-link:hover{color:var(--insight, var(--amber-2))}
.ar-thumb{aspect-ratio: 16/10}
.ar-badge-new{top:12px;left:12px;right:auto}

.ar-lock-pill{
  position:absolute;top:10px;left:10px;
  width:28px;height:28px;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--insight, var(--amber-2));color:var(--navy);
  border:1px solid rgba(11,29,58,.14);
  box-shadow:0 6px 16px rgba(11,29,58,.16);
  z-index:3;
}
.ar-lock-pill svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.8;fill:none}
.ar-row-thumb{position:relative}

.ar-card-body{display:flex;flex-direction:column;gap:8px;padding:2px 0 4px;flex:1;min-width:0}
.ar-cat{
  font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink);
  margin-bottom:2px;
}
.ar-cat-vip{color:var(--amber-2)}

.ar-card-title{
  font-family:var(--serif);font-weight:400;
  font-size:18px;line-height:1.25;letter-spacing:-.005em;
  color:var(--navy);margin:0;
  text-wrap:pretty;
  display:-webkit-box;
  min-height:calc(2 * 1.25em);
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow-wrap:anywhere;
}
.ar-card-title.is-locked{color:var(--azul-medio)}

.ar-card-lede{
  font-family:var(--sans);font-size:12.5px;line-height:1.5;
  color:var(--ink-2);margin:0;
  text-wrap:pretty;
  display:-webkit-box;
  min-height:calc(2 * 1.5em);
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow-wrap:anywhere;
}

.ar-card-foot{
  margin-top:auto;padding-top:10px;
  border-top:1px solid var(--rule);
  display:flex;flex-direction:column;align-items:flex-start;gap:6px;
}
.ar-card-meta{
  display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap;
  font-family:var(--sans);font-size:11px;color:var(--ink-2);letter-spacing:.01em;
}
.ar-card-meta .ar-dot{color:var(--muted)}
.ar-date{color:var(--ink)}
.ar-read{color:var(--ink-2)}
.ar-status{
  display:inline-flex;align-items:center;gap:5px;
  font-weight:600;color:var(--live);
}
.ar-status::before{
  content:"";display:inline-block;width:6px;height:6px;border-radius:50%;
  background:var(--live);
}
.ar-status.is-vip{color:var(--amber-2)}
.ar-status.is-vip::before{background:var(--amber-2)}

.ar-card-cta{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--sans);font-size:12px;font-weight:600;color:var(--ink);
  transition:color .2s ease;
}
.ar-card-cta:hover{color:var(--navy)}
.ar-card-cta:hover .theme-cta{background:var(--insight-2);transform:translateX(2px)}

.ar-empty{
  text-align:center;padding:48px 0;color:var(--ink-2);
}
.ar-empty p{margin:0}
.ar-empty-sub{font-size:13px;color:var(--muted);margin-top:6px !important}

/* --- Substack strip --- */
.ar-substack-wrap{padding:28px 32px 8px}
.ar-substack{
  display:grid;
  grid-template-columns: auto 1fr auto;
  gap:24px;align-items:center;
  padding:18px 24px;
  background:var(--bg-soft);
  border:1px solid var(--rule);
}
.ar-substack-mark{
  width:auto;min-width:46px;height:46px;padding:0 12px;
  background:var(--ink-block);
  display:grid;place-items:center;
}
.ar-substack-s{
  font-family:var(--sans);font-size:13px;font-weight:700;
  letter-spacing:.18em;color:var(--insight);
}
.ar-substack-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.ar-substack-title{
  margin:0;font-family:var(--sans);font-weight:600;font-size:14px;
  color:var(--navy);letter-spacing:-.005em;
}
.ar-substack-lede{
  margin:0;font-family:var(--sans);font-size:13px;color:var(--ink-2);
}
.ar-substack-btn{align-self:center}

/* --- Pagination --- */
.ar-pagination{
  display:flex;align-items:center;justify-content:center;gap:6px;
  padding:28px 32px 12px;
}
.ar-pg-num{
  min-width:34px;height:34px;padding:0 10px;
  display:inline-grid;place-items:center;
  font-family:var(--sans);font-size:13px;font-weight:600;color:var(--ink);
  background:transparent;border:1px solid transparent;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.ar-pg-num:hover{color:var(--navy);background:var(--tint-hover)}
.ar-pg-num.is-on{
  background:var(--ink-block);color:var(--on-ink);border-color:var(--navy);
}
.ar-pg-num.is-on:hover{background:var(--ink-block-2);color:#fff}
.ar-pg-dots{
  display:inline-grid;place-items:center;
  min-width:24px;height:34px;color:var(--muted);
  font-family:var(--sans);font-size:14px;font-weight:500;
}
.ar-pg-arrow{
  width:34px;height:34px;display:inline-grid;place-items:center;
  color:var(--ink);background:transparent;border:1px solid var(--rule);
  cursor:pointer;transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.ar-pg-arrow:hover{color:var(--navy);border-color:var(--navy);background:var(--tint-hover)}
.ar-pg-arrow:disabled{opacity:.4;cursor:not-allowed}
.ar-pg-chev{
  display:inline-block;width:8px;height:8px;
  border-right:1.6px solid currentColor;
  border-bottom:1.6px solid currentColor;
}
.ar-pg-chev.left{transform:rotate(135deg);margin-left:2px}
.ar-pg-chev.right{transform:rotate(-45deg);margin-right:2px}

@media (max-width: 1180px){
  .ar-grid{grid-template-columns:repeat(3, 1fr)}
}
@media (max-width: 1080px){
  .ar-banner-inner{grid-template-columns:1fr;gap:14px;align-items:start}
  .ar-banner-lede{padding-left:0;border-left:0}
  .ar-banner-photo{aspect-ratio: 21/4}
  .ar-grid{grid-template-columns:repeat(2, 1fr)}
  .ar-substack{grid-template-columns:auto 1fr;}
  .ar-substack-btn{grid-column: 1 / -1; justify-self:start}
  .ar-filters-row{gap:12px}
  .ar-right{margin-left:0;width:100%;justify-content:space-between}
}
@media (max-width: 720px){
  .ar-search{grid-template-columns:auto minmax(0,1fr);gap:8px}
  .ar-search-clear,.ar-search-submit{justify-self:start}
  .ar-grid{grid-template-columns:1fr}
  .ar-banner-title{font-size:32px}
  .ar-filter-sep{display:none}
  .ar-chips{flex-wrap:wrap}
  .ar-tabs{flex-wrap:wrap}
  .ar-row{grid-template-columns: 120px 1fr; gap:18px}
  .ar-row-side{display:none}
}


/* --- Bloque derecho de filtros: toggle vista + ordenar --- */
.ar-right{
  margin-left:auto;
  display:flex;align-items:center;gap:18px;
}
.ar-view{
  display:inline-flex;
  border:1px solid var(--rule);
  background:var(--paper);
}
.ar-view-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 12px;
  font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.01em;
  color:var(--ink-2);background:transparent;
  border:0;cursor:pointer;
  transition:background .15s ease, color .15s ease;
}
.ar-view-btn + .ar-view-btn{border-left:1px solid var(--rule)}
.ar-view-btn:hover{color:var(--navy);background:var(--tint-hover)}
.ar-view-btn.is-on{
  background:var(--ink-block);color:var(--on-ink);
}
.ar-view-btn.is-on:hover{background:var(--ink-block-2);color:#fff}
.ar-view-btn svg{flex:0 0 16px}

/* --- Vista listado --- */
.ar-list{
  display:flex;flex-direction:column;
  border-top:1px solid var(--rule);
}
.ar-row{
  display:grid;
  grid-template-columns: 180px 1fr 180px;
  gap:28px;align-items:center;
  padding:16px 4px;
  border-bottom:1px solid var(--rule);
  color:var(--ink);
  transition:padding .2s ease, background .15s ease;
}
.ar-row:hover{
  padding-left:10px;padding-right:0;background:rgba(var(--navy-rgb),.02);
}
.ar-row:hover .ar-row-title{color:var(--navy)}
.ar-row:hover .ar-row-cta{color:var(--navy);gap:10px}
.ar-row.is-locked:hover .ar-row-title{color:var(--azul-medio)}

.ar-row-thumb{
  position:relative;width:180px;aspect-ratio: 16/10;overflow:hidden;
}
.ar-row-thumb .ar-thumb{aspect-ratio: 16/10;height:100%}
.ar-row-lock{
  position:absolute;top:8px;right:8px;
  width:24px;height:24px;display:grid;place-items:center;
  background:rgba(250,250,248,.95);color:var(--azul-marino);
}
.ar-row-lock svg{width:13px;height:13px;stroke:currentColor;stroke-width:1.8;fill:none}

.ar-row-main{display:flex;flex-direction:column;gap:6px;min-width:0}
.ar-row-meta{
  display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-family:var(--sans);font-size:11px;color:var(--ink-2);letter-spacing:.01em;
}
.ar-row-meta .ar-row-dot{color:var(--muted)}
.ar-row-date{
  font-family:var(--mono);font-size:11px;color:var(--ink);letter-spacing:.02em;
}
.ar-row-read{font-family:var(--sans)}
.ar-row-new{
  background:var(--insight);color:var(--on-amber);
  font-family:var(--sans);font-size:9.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  padding:3px 7px;
}

.ar-row-title{
  font-family:var(--serif);font-weight:400;
  font-size:21px;line-height:1.25;letter-spacing:-.005em;
  color:var(--navy);margin:0;
  transition:color .15s ease;
}
.ar-row-title.is-locked{color:var(--azul-medio)}
.ar-row-lede{
  font-family:var(--sans);font-size:13px;line-height:1.5;
  color:var(--ink-2);margin:0;max-width:780px;
  text-wrap:pretty;
}

.ar-row-side{
  display:flex;flex-direction:column;align-items:flex-end;gap:8px;
  justify-self:end;
}
.ar-row-status{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--live);
}
.ar-row-status::before{
  content:"";display:inline-block;width:7px;height:7px;border-radius:50%;
  background:var(--live);
}
.ar-row-status.is-vip{color:var(--amber-2)}
.ar-row-status.is-vip::before{background:var(--amber-2)}

.ar-row-cta{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--ink);
  transition:color .15s ease, gap .15s ease;
}
.ar-row-cta svg{
  width:14px;height:14px;stroke:var(--navy);stroke-width:1.8;fill:none;
}

/* =====================================================================
   ARTICLE DETAIL PAGE
   ===================================================================== */

/* Reading progress – barra fina sticky encima del header */
.art-progress{
  position:fixed;left:0;right:0;top:0;height:2px;z-index:60;
  background:transparent;pointer-events:none;
}
.art-progress i{
  display:block;height:100%;background:var(--insight);
  transform-origin:left center;transform:scaleX(0);
  transition:transform .08s linear;
}

.art-page{padding-bottom:48px}

/* Layout: artículo a una sola columna centrada */
.art-layout{
  display:block;
  padding-top:36px;padding-bottom:48px;
}
:root[data-measure="compact"]     .art-main{max-width:680px}
:root[data-measure="comfortable"] .art-main{max-width:780px}
:root[data-measure="wide"]        .art-main{max-width:900px}

.art-main{width:100%;margin:0 auto}

/* "Te recomendamos" — selección al pie del artículo */
.art-reco{
  margin-top:24px;
  padding-top:40px;padding-bottom:8px;
  border-top:1px solid var(--rule);
}
.art-reco-head{
  display:flex;align-items:baseline;justify-content:space-between;
  gap:24px;flex-wrap:wrap;margin-bottom:24px;
}
.art-reco-title{
  font-family:var(--serif);font-weight:400;
  font-size:28px;line-height:1.1;letter-spacing:-.01em;
  color:var(--navy);margin:0;
}

/* --- Mast / cabecera del artículo --- */
.art-mast{display:flex;flex-direction:column;gap:16px;margin-bottom:28px}
.art-cat{margin-bottom:-4px}
.art-title{
  font-family:var(--serif);font-weight:400;
  font-size:40px;line-height:1.12;letter-spacing:-.012em;
  color:var(--navy);margin:0;
  text-wrap:balance;
}
.art-lede{
  font-family:var(--sans);font-size:17px;line-height:1.5;
  color:var(--ink-2);margin:0;max-width:42em;
  text-wrap:pretty;
}

/* Byline */
.art-byline{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap;
  margin-top:10px;padding:16px 0 20px;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
}
.art-byline-left{display:flex;align-items:center;gap:12px;min-width:0}
.art-byline-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.art-byline-meta{display:flex;flex-direction:column;gap:2px;line-height:1.2}
.art-byline-name{
  font-family:var(--sans);font-size:13.5px;font-weight:600;color:var(--navy);
  letter-spacing:-.005em;
}
.art-byline-sub{
  display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap;
  font-family:var(--sans);font-size:12px;color:var(--ink-2);letter-spacing:.01em;
}
.art-byline-date{color:var(--ink-2)}
.art-byline-read{color:var(--ink-2)}
.art-byline-status{
  display:inline-flex;align-items:center;gap:5px;
  font-weight:600;color:var(--live);
}
.art-byline-status::before{
  content:"";display:inline-block;width:6px;height:6px;border-radius:50%;
  background:var(--live);
}
.art-dot{color:var(--muted)}

/* Avatar — círculo navy con inicial serif (placeholder hasta tener foto real) */
.art-avatar{
  position:relative;display:inline-grid;place-items:center;
  flex-shrink:0;border-radius:50%;overflow:hidden;
  background:var(--ink-block);
}
.art-avatar-inner{position:absolute;inset:0;display:grid;place-items:center}
.art-avatar-bg{
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 35% 35%, rgba(255,255,255,.18), transparent 55%),
    linear-gradient(160deg, #2A3E5E 0%, #0B1D3A 70%);
}
.art-avatar-mono{
  position:relative;z-index:2;
  font-family:var(--serif);font-weight:400;color:var(--insight);
  font-size: calc(0.45em + 6px);
  letter-spacing:-.02em;
}
.art-avatar[style*="56"] .art-avatar-mono{font-size:22px}
.art-avatar[style*="36"] .art-avatar-mono{font-size:15px}

/* Share buttons */
.art-share{display:inline-flex;align-items:center;gap:6px}
.art-share-btn{
  width:32px;height:32px;display:inline-grid;place-items:center;
  color:var(--ink-2);background:transparent;
  border:1px solid var(--rule);cursor:pointer;
  transition:color .15s ease, border-color .15s ease, background .15s ease;
}
.art-share-btn:hover{color:var(--navy);border-color:var(--navy);background:var(--tint-hover)}
.art-share-btn svg{width:14px;height:14px;fill:currentColor}
.art-share-btn svg[stroke="currentColor"]{fill:none;stroke:currentColor}
/* link icon is stroked, X & LinkedIn are filled — handled per-svg */
.art-share-btn svg path{fill:currentColor}
.art-share-btn:has(svg [stroke]) svg path{fill:none;stroke:currentColor}

.art-share.is-compact{gap:10px}
.art-share-label{
  font-family:var(--sans);font-size:12px;font-weight:600;color:var(--ink-2);
  letter-spacing:.01em;margin-right:4px;
}

/* --- Hero photo del artículo --- */
.art-hero{margin:0 0 28px;display:flex;flex-direction:column;gap:8px}
.art-hero-frame{position:relative;width:100%}
.art-hero-frame .ar-thumb{aspect-ratio: 16/9}
.art-hero-caption{
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  font-family:var(--sans);font-size:11.5px;color:var(--ink-2);
  line-height:1.5;letter-spacing:.01em;
  padding-top:4px;
}
.art-hero-caption em{font-family:var(--serif);font-style:italic;color:var(--ink)}
.art-hero-caption-tag{
  font-family:var(--sans);font-size:10.5px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--navy);
  padding:3px 7px;background:var(--bg-soft);
  flex-shrink:0;
}

/* --- Body / texto editorial --- */
.art-body{font-family:var(--sans);font-size:15.5px;line-height:1.65;color:var(--ink)}
.art-body p{margin:0 0 1.1em}
.art-body p em{font-family:var(--serif);font-style:italic;color:var(--navy)}
.art-body .art-lead-p{
  font-size:17px;line-height:1.55;color:var(--ink);
  margin-bottom:1.3em;
}
.art-body .art-lead-p::first-letter{
  font-family:var(--serif);font-weight:400;
  font-size:3.2em;line-height:.9;color:var(--navy);
  float:left;padding:6px 10px 0 0;
}

.art-body .art-h2{
  font-family:var(--serif);font-weight:400;
  font-size:26px;line-height:1.2;letter-spacing:-.01em;color:var(--navy);
  margin:42px 0 14px;text-wrap:balance;
}

/* Pullquote — editorial, sin borde-izquierdo de accent */
.art-pull{
  position:relative;margin:36px 0 32px;padding:18px 0 22px;
  display:grid;
  grid-template-columns: 32px 1fr;
  gap:14px;align-items:start;
  border-top:1px solid var(--rule);
}
.art-pull-mark{
  display:inline-flex;color:var(--amber-2);margin-top:6px;
}
.art-pull-mark svg{width:28px;height:auto;fill:currentColor}
.art-pull-quote{
  margin:0;font-family:var(--serif);font-weight:400;font-style:italic;
  font-size:21px;line-height:1.35;color:var(--navy);
  letter-spacing:-.005em;text-wrap:balance;
}
.art-pull-rule{
  grid-column: 1 / -1;
  display:block;width:48px;height:2px;background:var(--insight);
  margin-top:14px;
}

/* Numbered steps (3 preguntas) */
.art-steps{
  list-style:none;padding:0;margin:8px 0 28px;
  display:flex;flex-direction:column;gap:6px;
  border-top:1px solid var(--rule);
}
.art-steps > li{
  display:grid;
  grid-template-columns: 48px 1fr;
  gap:16px;align-items:start;
  padding:18px 0 16px;
  border-bottom:1px solid var(--rule);
}
.art-step-num{
  font-family:var(--mono);font-size:12px;font-weight:500;
  color:var(--navy);letter-spacing:.06em;
  padding-top:4px;
}
.art-step-body{display:flex;flex-direction:column;gap:6px;min-width:0}
.art-step-title{
  font-family:var(--sans);font-weight:600;font-size:15.5px;line-height:1.35;
  color:var(--navy);margin:0;letter-spacing:-.005em;
}
.art-step-body p{margin:0;color:var(--ink-2);font-size:14.5px;line-height:1.55}

/* Foot row (share + save) */
.art-foot{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  margin-top:36px;padding:18px 0;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  flex-wrap:wrap;
}
.art-save{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--sans);font-size:13px;font-weight:600;
  color:var(--ink);padding:6px 4px;cursor:pointer;
  background:transparent;border:0;
  transition:color .15s ease;
}
.art-save:hover{color:var(--navy)}
.art-save-ic{display:inline-flex;width:14px;height:14px;color:var(--ink)}
.art-save-ic svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.6;fill:none}
.art-save:hover .art-save-ic{color:var(--navy)}
/* Marcado (guardado / me gusta): banderola y corazón en ámbar de activación, no solo el texto */
.art-save.is-on{color:var(--insight-2)}
.art-save.is-on .art-save-ic{color:var(--insight)}
.art-save.is-on .art-save-ic svg{stroke:var(--insight);fill:var(--insight)}
.art-save.is-on:hover{color:var(--insight-2)}
.art-save.is-on:hover .art-save-ic{color:var(--insight-2)}
.art-save.is-on:hover .art-save-ic svg{stroke:var(--insight-2);fill:var(--insight-2)}

/* =====================================================================
   ARTICLE — SIDEBAR
   ===================================================================== */
.art-side-card{
  background:var(--paper);
  border:1px solid var(--rule);
  padding:20px 22px;
  display:flex;flex-direction:column;gap:12px;
}
.art-side-eyebrow{
  font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink);
}

/* VIP / Newsletter CTA card */
.art-side-vip{gap:14px}
.art-side-vip-mark{
  width:44px;height:44px;display:grid;place-items:center;
  background:var(--ink-block);
}
.art-side-vip-letter{
  font-family:var(--sans);font-size:12px;font-weight:700;
  letter-spacing:.2em;color:var(--insight);
}
.art-side-vip-ic{display:inline-flex;width:22px;height:22px;color:var(--insight)}
.art-side-vip-ic svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.6;fill:none}
.art-side-vip-title{
  font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.25;
  color:var(--navy);margin:0;letter-spacing:-.005em;text-wrap:balance;
}
.art-side-vip-lede{
  margin:0;font-family:var(--sans);font-size:13.5px;line-height:1.5;color:var(--ink-2);
}
.art-side-vip-btn{
  align-self:flex-start;margin-top:2px;
}
.art-side-vip-note{
  margin:6px 0 0;font-family:var(--sans);font-size:12px;line-height:1.5;color:var(--ink-2);
  padding-top:12px;border-top:1px solid var(--rule);
}
.art-side-vip-link{
  color:var(--navy);font-weight:600;text-decoration:none;
  border-bottom:1.5px solid var(--amber-2);padding-bottom:1px;
}
.art-side-vip-link:hover{color:var(--navy-2)}

/* Author card */
.art-side-author-row{display:flex;align-items:center;gap:12px}
.art-side-author-meta{display:flex;flex-direction:column;gap:2px}
.art-side-author-name{
  font-family:var(--serif);font-weight:400;font-size:18px;line-height:1.15;
  color:var(--navy);margin:0;letter-spacing:-.005em;
}
.art-side-author-handle{
  font-family:var(--mono);font-size:11.5px;color:var(--muted);letter-spacing:.02em;
}
.art-side-author-bio{
  margin:0;font-family:var(--sans);font-size:13px;line-height:1.55;color:var(--ink-2);
}
.art-side-author-link{align-self:flex-start;margin-top:4px}

/* More on this topic */
.art-side-more{gap:14px}
.art-side-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}
.art-side-item{
  display:grid;
  grid-template-columns: 64px 1fr;
  gap:12px;align-items:start;
  color:var(--ink);
  transition:transform .15s ease;
}
.art-side-item:hover{transform:translateX(2px)}
.art-side-item:hover .art-side-item-title{color:var(--navy-2)}
.art-side-item-thumb{position:relative;width:64px;aspect-ratio: 1/1;overflow:hidden}
.art-side-item-thumb .ar-thumb{aspect-ratio: 1/1;height:100%}
.art-side-item-body{display:flex;flex-direction:column;gap:3px;min-width:0}
.art-side-item-cat{
  font-family:var(--sans);font-size:9.5px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--amber-2);
}
.art-side-item-title{
  font-family:var(--serif);font-weight:400;font-size:14px;line-height:1.25;
  color:var(--navy);letter-spacing:-.005em;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  transition:color .15s ease;
}
.art-side-item-date{
  font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.02em;
  margin-top:2px;
}

/* Cursos / Libros sobre este tema */
.art-side-courses,
.art-side-books{gap:14px}
.art-side-count{color:var(--muted);font-weight:400}
.art-side-foot-link{align-self:flex-start;margin-top:4px}

.art-side-course-ic{
  width:64px;height:64px;display:grid;place-items:center;
  background:var(--ink-block);color:var(--insight);
}
.art-side-course-ic svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.6;fill:none}

.art-side-book{grid-template-columns:52px 1fr}
.art-side-book-cover{
  width:52px;display:block;overflow:hidden;
  border:1px solid var(--rule);
  box-shadow:0 6px 16px rgba(11,29,58,.14);
}
.art-side-book-cover img{width:100%;height:auto;display:block}
.art-side-book-sub{
  font-family:var(--sans);font-size:12px;line-height:1.4;color:var(--ink-2);margin-top:3px;
}

/* Topics chips */
.art-side-topics{display:flex;flex-direction:column;gap:10px;padding:4px 0}
.art-side-topics-row{display:flex;flex-wrap:wrap;gap:6px}
.art-topic-chip{
  font-family:var(--sans);font-size:12px;font-weight:600;color:var(--ink-2);
  padding:6px 12px;border:1px solid var(--rule);background:transparent;
  letter-spacing:.01em;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.art-topic-chip:hover{color:var(--navy);border-color:var(--navy);background:var(--tint-hover)}
.art-topic-chip.is-on{
  background:var(--ink-block);color:var(--on-ink);border-color:var(--navy);
}

/* =====================================================================
   ARTICLE — COMMENTS
   ===================================================================== */
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.art-comments{
  margin-top:48px;padding-top:32px;
  border-top:1px solid var(--rule);
}
.art-comments-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  margin-bottom:24px;flex-wrap:wrap;
}
.art-comments-head-left{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}
.art-comments-title{
  font-family:var(--serif);font-weight:400;
  font-size:28px;line-height:1.15;letter-spacing:-.01em;
  color:var(--navy);margin:0;
}
.art-comments-count{color:var(--muted);font-weight:400}
.art-comments-sub{
  margin:0;font-family:var(--sans);font-size:13.5px;line-height:1.5;color:var(--ink-2);
  max-width:560px;
}
.art-comments-sort{display:flex;align-items:center;gap:10px;flex-shrink:0}
.art-comments-sort-label{
  font-family:var(--sans);font-size:12px;font-weight:500;color:var(--ink-2);letter-spacing:.02em;
}

/* Composer */
.art-comments-composer{
  display:grid;
  grid-template-columns: 44px 1fr;
  gap:14px;align-items:start;
  padding:18px 20px;
  background:var(--paper);
  border:1px solid var(--rule);
  margin-bottom:32px;
}
.art-comments-composer-body{display:flex;flex-direction:column;gap:12px;min-width:0}
.art-comments-textarea{
  width:100%;resize:vertical;min-height:90px;
  font-family:var(--sans);font-size:14.5px;line-height:1.55;color:var(--ink);
  background:transparent;border:0;outline:none;padding:6px 0;
}
.art-comments-textarea::placeholder{color:var(--muted)}
.art-comments-textarea:focus-visible{outline:none}
.art-comments-composer-foot{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding-top:12px;border-top:1px dashed var(--rule);flex-wrap:wrap;
}
.art-comments-rules{
  font-family:var(--sans);font-size:12px;color:var(--ink-2);line-height:1.5;
  max-width:380px;
}
.art-comments-rules strong{color:var(--navy);font-weight:700}
.art-comments-composer-actions{display:flex;align-items:center;gap:14px}
.art-comments-link{
  font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--ink);
  background:transparent;border:0;cursor:pointer;padding:8px 4px;
  transition:color .15s ease;
}
.art-comments-link:hover{color:var(--navy);text-decoration:underline;text-underline-offset:3px}

/* Comments avatar */
.art-comment-avatar{
  width:44px;height:44px;flex-shrink:0;
  display:inline-grid;place-items:center;position:relative;
  border-radius:50%;overflow:hidden;background:var(--ink-block);
}
.art-comment-avatar-bg{
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 35% 35%, rgba(255,255,255,.18), transparent 55%),
    linear-gradient(160deg, #2A3E5E 0%, #0B1D3A 70%);
}
.art-comment-avatar.is-author .art-comment-avatar-bg{
  background:
    radial-gradient(circle at 35% 35%, rgba(255,199,44,.32), transparent 55%),
    linear-gradient(160deg, #14223C 0%, #0B1D3A 70%);
}
.art-comment-avatar-mono{
  position:relative;z-index:2;
  font-family:var(--serif);font-weight:400;color:var(--on-ink);
  font-size:18px;letter-spacing:-.02em;
}
.art-comment-avatar.is-author .art-comment-avatar-mono{color:var(--insight)}

/* Comments list */
.art-comments-list{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;
  border-top:1px solid var(--rule);
}
.art-comment{
  display:grid;
  grid-template-columns: 44px 1fr;
  gap:14px;align-items:start;
  padding:22px 0 18px;
  border-bottom:1px solid var(--rule);
}
.art-comment.is-reply{
  padding:18px 0 14px;
  border-bottom:0;border-top:1px dashed var(--rule);
  margin-top:14px;
}
.art-comment-body{display:flex;flex-direction:column;gap:8px;min-width:0}
.art-comment-head{
  display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;
  font-family:var(--sans);font-size:12px;color:var(--ink-2);letter-spacing:.01em;
}
.art-comment-name{
  font-size:13.5px;font-weight:600;color:var(--navy);letter-spacing:-.005em;
  display:inline-flex;align-items:center;gap:8px;
}
.art-comment-tag{
  font-family:var(--sans);font-size:9.5px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--navy);
  background:var(--insight);padding:2px 6px;
}
.art-comment-role{color:var(--ink-2)}
.art-comment-role::before{content:"·";margin-right:8px;color:var(--muted)}
.art-comment-date{color:var(--muted)}
.art-comment-date::before{content:"·";margin-right:8px;color:var(--muted)}
.art-comment-text{
  margin:0;font-family:var(--sans);font-size:14.5px;line-height:1.6;color:var(--ink);
  text-wrap:pretty;
}
.art-comment-actions{
  display:flex;align-items:center;gap:18px;
  margin-top:2px;
}
.art-comment-action{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--ink-2);
  background:transparent;border:0;cursor:pointer;padding:4px 0;
  transition:color .15s ease;
}
.art-comment-action svg{width:14px;height:14px;color:currentColor}
.art-comment-action:hover{color:var(--navy)}
.art-comment-action-muted{color:var(--muted)}
.art-comment-action-muted:hover{color:var(--ink-2)}

.art-comment-replies{
  list-style:none;padding:0 0 0 4px;margin:6px 0 0;
  display:flex;flex-direction:column;gap:0;
}
.art-comment.is-author > .art-comment-body .art-comment-text{
  /* visually subtle highlight on author text */
}

.art-comments-foot{
  display:flex;justify-content:center;padding:22px 0 8px;
}

/* --- Responsive --- */
@media (max-width: 1180px){
  .art-layout{grid-template-columns: minmax(0, 1fr) 280px; gap:44px}
}
@media (max-width: 900px){
  .art-layout{grid-template-columns:1fr;gap:32px}
  .art-aside{position:static;top:auto}
}
@media (max-width: 720px){
  .art-title{font-size:30px}
  .art-byline{flex-direction:column;align-items:flex-start;gap:12px}
  .art-comments-composer{grid-template-columns:1fr;gap:12px}
  .art-comments-composer .art-comment-avatar{width:36px;height:36px}
  .art-comment{grid-template-columns:36px 1fr;gap:12px}
  .art-comment-avatar{width:36px;height:36px}
  .art-comment-avatar-mono{font-size:15px}
}

/* ===== Theme toggle (footer) ===== */
.theme-toggle{
  display:inline-flex;border:1px solid var(--rule);
  padding:0;
  margin-top:4px;
}
.theme-toggle button{
  font-family:var(--sans);
  font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  padding:6px 10px;color:var(--ink-2);cursor:pointer;
  display:inline-flex;align-items:center;gap:6px;
  transition:background .15s ease, color .15s ease;
}
.theme-toggle button svg{
  width:13px;height:13px;
  stroke:currentColor;fill:none;
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;
}
.theme-toggle button.active{background:var(--ink-block);color:#FAFAF8}
.theme-toggle button:hover:not(.active){background:rgba(var(--navy-rgb),.06);color:var(--navy)}

/* =====================================================================
   DARK MODE — paleta cálida diseñada (no inversión de tokens)
   · Base: negro CÁLIDO, coherente con la arena del modo claro (no negro puro,
     no navy frío).
   · Texto: contraste suavizado (off-white cálido, nunca #FFF sobre #000).
   · El navy estructural se ACLARA (sirve de texto/borde de contraste).
   · Las superficies oscuras tienen su propio token (--ink-block), así los
     bloques/botones siguen siendo oscuros con texto claro.
   · Ámbar recalibrado para brillar sobre fondo oscuro sin vibrar.
   ===================================================================== */
/* NOTA: el sistema de Tweaks/paleta escribe --bg/--paper/--rule… como estilos
   INLINE en :root, y el inline vence al stylesheet. Por eso los tokens del dark
   mode van con !important: una declaración !important en hoja de estilos vence
   a un inline normal, de modo que el modo oscuro manda sobre la paleta de
   tweaks (que es una herramienta de modo claro). */
:root[data-theme="dark"]{
  /* base cálida */
  --bg:#191512 !important;          /* página — negro cálido */
  --bg-soft:#211C17 !important;     /* bandas */
  --paper:#26201A !important;       /* cards / papel */
  /* texto suavizado (sin blanco puro) */
  --ink:#ECE3D2 !important;
  --ink-2:#B3A992 !important;
  --muted:#827862 !important;
  /* hairlines cálidos */
  --rule:rgba(236,227,210,.14) !important;
  --rule-2:rgba(236,227,210,.075) !important;
  /* color estructural de alto contraste → se aclara (texto/bordes) */
  --navy:#ECE3D2 !important;
  --navy-2:#FAF3E4 !important;
  --navy-3:#8FB2E6 !important;      /* azul de conexión, aclarado para enlaces/sistema */
  /* superficie azul suave → panel azul oscuro en dark (bandas/chips que la usan
     de fondo: .bz-strip/.bz-converge/.bz-foxize-wrap, .ac-resource-ic-hi,
     .bd-quote, libros). Antes quedaba #D6E4F2 fijo → texto crema invisible. */
  --azul-claro:#1C2740 !important;
  /* superficie oscura propia (bloques/botones que eran fondo navy) */
  --ink-block:#222A3E !important;
  --ink-block-2:#2B3550 !important;
  /* activación: ámbar recalibrado para fondo cálido oscuro */
  --insight:#F5C24B !important;
  --insight-2:#E0A838 !important;
  /* ámbar (aliases) forzados para coherencia, por encima del accent de tweaks */
  --amber:var(--insight) !important;
  --amber-2:var(--insight-2) !important;
  /* texto/icono OSCURO que va sobre ámbar */
  --on-amber:#1C160D !important;
  /* texto sobre superficies oscuras (ink-block sigue siendo oscuro en dark) */
  --on-ink:#ECE3D2 !important;
  --on-ink-2:#B7C0D0 !important;
  /* canales RGB → navy flipa a crema; paper a marrón oscuro */
  --navy-rgb:236,227,210 !important;
  --live:#4FB286 !important; /* verde de estado, aclarado para fondo oscuro */
  /* sombra de card: las claras desaparecen sobre fondo oscuro */
  --shadow-card:0 6px 18px rgba(0,0,0,.4) !important;
}
:root[data-theme="dark"] body{ color-scheme:dark; }

/* Bandas azul-claro (Business / libros): la superficie ya flipa a azul oscuro
   vía --azul-claro; aquí se ajustan los rellenos y hairlines internos que eran
   literales claros/oscuros y no seguían el theme. */
:root[data-theme="dark"] .bz-strip-ic,
:root[data-theme="dark"] .bz-converge-stats{ background:rgba(236,227,210,.06); }
:root[data-theme="dark"] .bz-converge-stats{ border-left-color:rgba(236,227,210,.12); }
:root[data-theme="dark"] .bz-stat{ border-right-color:rgba(236,227,210,.16); }
:root[data-theme="dark"] .bz-strip-item{ border-left-color:rgba(236,227,210,.14); }
:root[data-theme="dark"] .bz-foxize-wrap{ border-top-color:rgba(236,227,210,.1); border-bottom-color:rgba(236,227,210,.1); }
:root[data-theme="dark"] .bz-foxize-eyebrow,
:root[data-theme="dark"] .bz-role-label{ color:#8FB2E6; }

/* superficies #fff literales que reciben texto: chips y hovers de card →
   superficie oscura en dark (evita texto crema sobre blanco). */
:root[data-theme="dark"] .tn-chip{ background:var(--paper); border-color:var(--rule); }
:root[data-theme="dark"] .rc-cap:hover,
:root[data-theme="dark"] .tp-cap:hover,
:root[data-theme="dark"] .cn-service:hover,
:root[data-theme="dark"] .bk-pill:hover,
:root[data-theme="dark"] .pt-arrow:hover,
:root[data-theme="dark"] .theme:hover{ background:var(--bg-soft); }
:root[data-theme="dark"] .bk-substack:hover{ background:var(--ink-block); }

/* iconos sobre ámbar: oscuros, no claros (el navy aquí no debe aclararse) */
:root[data-theme="dark"] .btn-primary svg,
:root[data-theme="dark"] .theme-cta svg,
:root[data-theme="dark"] .nav a.btn-signup svg{ stroke:var(--on-amber); }
:root[data-theme="dark"] .nav a.btn-signup:hover{ color:var(--on-amber); }

/* ----------------------------------------------------------------
   Menú de usuario en cabecera (avatar + desplegable).
   Global (movido desde logged.css) para que la cabecera pública,
   auth-aware, lo muestre cuando hay sesión iniciada.
   ---------------------------------------------------------------- */
.hd-user{
  display:inline-flex; align-items:center; gap:10px;
  padding:5px 12px 5px 5px;
  background:transparent;
  border:1px solid var(--rule);
  margin-left:8px;
  transition:border-color .15s ease, background .15s ease;
}
.hd-user:hover{ border-color:var(--navy); background:var(--paper); }
.hd-avatar{
  width:32px; height:32px; border-radius:50%;
  background:linear-gradient(135deg, #2F5FA7 0%, #0B1D3A 100%);
  color:#F2EDE6;
  display:grid; place-items:center;
  font-family:var(--serif); font-weight:600; font-size:13px;
  letter-spacing:.02em;
  flex:0 0 32px;
  position:relative;
  overflow:hidden;
}
.hd-avatar::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.15), transparent 60%);
}
.hd-user-name{
  font-family:var(--sans); font-size:13.5px; font-weight:600;
  color:var(--ink); letter-spacing:-.005em;
}
.hd-user-caret{
  width:9px; height:9px;
  border-right:1.5px solid var(--ink-2);
  border-bottom:1.5px solid var(--ink-2);
  transform:translateY(-2px) rotate(45deg);
  margin-left:2px;
}
.hd-user-wrap{ position:relative; }
.hd-user-menu{
  position:absolute; top:calc(100% + 8px); right:0;
  min-width:240px;
  background:var(--paper);
  border:1px solid var(--rule);
  box-shadow:0 18px 40px -16px rgba(11,29,58,.25);
  padding:6px;
  z-index:60;
}
.hd-user-menu-head{
  padding:12px 12px 10px;
  border-bottom:1px solid var(--rule-2);
  margin-bottom:6px;
}
.hd-user-menu-name{
  font-family:var(--serif); font-weight:400; font-size:16px;
  color:var(--navy); margin:0;
}
.hd-user-menu-mail{
  font-family:var(--mono); font-size:11px; color:var(--muted);
  margin:2px 0 0;
}
.hd-user-menu a, .hd-user-menu button{
  display:flex; align-items:center; gap:10px; width:100%;
  padding:9px 12px;
  font-family:var(--sans); font-size:13.5px; color:var(--ink);
  text-align:left; background:transparent;
  transition:background .15s ease, color .15s ease;
}
.hd-user-menu a:hover, .hd-user-menu button:hover{
  background:var(--bg-soft); color:var(--navy);
}
.hd-user-menu svg{
  width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:1.6;
}
.hd-user-menu .sep{
  height:1px; background:var(--rule-2); margin:6px 0;
}
.hd-user-menu .pill-vip{
  display:inline-block; margin-left:auto;
  background:var(--insight); color:var(--on-amber);
  font-size:9.5px; font-weight:700; letter-spacing:.14em;
  padding:2px 6px;
}

/* toggles/segmentos activos sobre ámbar */
:root[data-theme="dark"] .theme-toggle button.active{background:var(--ink);color:var(--bg)}
:root[data-theme="dark"] .theme-toggle button:hover:not(.active){background:rgba(236,227,210,.07);color:var(--ink)}
:root[data-theme="dark"] .lang-switch button.active{background:var(--ink);color:var(--bg)}
:root[data-theme="dark"] .lang-switch button:hover:not(.active){background:rgba(236,227,210,.07);color:var(--ink)}
:root[data-theme="dark"] .cc-badge svg{stroke:var(--ink)}

/* logo navy fijo (PNG) → crema cálido sobre header/footer oscuros */
:root[data-theme="dark"] .brand-logo{
  filter:brightness(0) invert(1) sepia(.18) saturate(1.1) brightness(1.02);
}
:root[data-theme="dark"] .brand-logo--complices-private{
  filter:none;
}

/* sombras más profundas sobre fondo oscuro (las claras desaparecen) */
:root[data-theme="dark"] .login-gate.lg-overlay .lg-card{box-shadow:0 14px 36px -10px rgba(0,0,0,.6)}
:root[data-theme="dark"] .login-gate.lg-modal .lg-card{box-shadow:0 26px 64px -14px rgba(0,0,0,.72)}
:root[data-theme="dark"] .login-gate.lg-modal .lg-backdrop{background:rgba(0,0,0,.62)}

/* TRANSICIÓN suave entre modos — sólo tras el primer paint (clase .theme-anim
   añadida por ThemeToggle), para no animar el FOUC inicial. Limitada a
   superficies grandes: evita pisar las transiciones de hover (transform) de
   botones y cards interactivas. */
.theme-anim body,
.theme-anim .site-header,
.theme-anim .news,
.theme-anim .news-vip,
.theme-anim .article,
.theme-anim .login-gate .lg-card,
.theme-anim .acceso-level,
.theme-anim .acceso-hero,
.theme-anim .abc .card,
.theme-anim .cookie-banner,
.theme-anim main,
.theme-anim section{
  transition: background-color .45s ease, border-color .45s ease, color .35s ease;
}



/* =====================================================================
   RESPONSIVE — Mobile-first overhaul
   Tablet  ≤ 960px
   Mobile  ≤ 640px
   Small   ≤ 420px
   ===================================================================== */

/* --- Lock body scroll while mobile nav is open --- */
html, body{ max-width:100%; overflow-x:clip; }
body.nav-locked{ overflow:hidden; }

/* --- Mobile nav toggle (hidden on desktop) --- */
.nav-toggle{
  display:none;
  width:40px;height:40px;
  flex-direction:column;justify-content:center;align-items:center;gap:5px;
  background:transparent;border:0;cursor:pointer;
  margin-left:auto;
  z-index:60;
}
.nav-toggle span{
  display:block;width:22px;height:2px;background:var(--ink);
  transition:transform .25s ease, opacity .2s ease;
  transform-origin:center;
}
.nav-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.is-open span:nth-child(2){opacity:0}
.nav-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.nav-backdrop{
  position:fixed;inset:0;background:rgba(11,29,58,.32);
  opacity:0;visibility:hidden;transition:opacity .25s ease, visibility .25s ease;
  z-index:45;
}
.nav-backdrop.is-open{opacity:1;visibility:visible}

/* ========== TABLET ≤ 960 ========== */
@media (max-width: 960px){
  .container{padding:0 24px}

  /* Hero */
  .hero{padding:22px 0 18px}
  .hero-card{height:340px}
  .hero-copy{width:min(48%, 480px);padding-left:34px}
  .hero-copy .h-display{font-size:35px}

  /* Espacio Cómplices */
  .espacio-complices{margin-top:0;margin-bottom:15px}
  .espacio-complices-grid{grid-template-columns:minmax(0, 0.4fr) minmax(0, 0.6fr);gap:32px}
  .espacio-complices-copy{max-width:none;padding-top:16px}
  .espacio-complices-media{width:100%;justify-self:start}

  /* Perfil ABC */
  .abc{grid-template-columns:1fr 1fr}

  /* Themes */
  .themes-grid{grid-template-columns:repeat(2,1fr)}

  /* Articles */
  .articles-grid{grid-template-columns:repeat(2,1fr);gap:24px}

  /* Newsletter */
  .news .inner{grid-template-columns:1fr 1fr;gap:20px 28px}
  .news .pitch{grid-column:1 / -1}
  .btn-news{grid-column:1 / -1;justify-self:start}

  /* Footer */
  .foot-grid{grid-template-columns:1fr 1fr;gap:32px}
  .foot-brand{grid-column:1 / -1}

  /* ===== Academic ===== */
  .ac-hero-grid{grid-template-columns:1fr;gap:32px}
  .ac-title{font-size:36px}
  .ac-courses-grid, .ac-courses-grid.four{grid-template-columns:repeat(2,1fr)}
  .ac-talks-grid, .ac-talks-grid.four{grid-template-columns:repeat(2,1fr)}
  .ac-books-grid, .ac-books-grid.four{grid-template-columns:repeat(2,1fr)}
  .ac-school{grid-template-columns:1fr auto;gap:6px 18px}
  .ac-school .ac-school-desc{grid-column:1 / -1}
  .ac-section{padding-left:24px;padding-right:24px}

  /* ===== Business ===== */
  .bz-foxize{grid-template-columns:1fr;gap:32px;padding:32px 24px}
  .bz-foxize-title{font-size:36px}

  /* ===== Books listing ===== */
  .bk-hero-grid{grid-template-columns:1fr;gap:32px}
  .bk-title{font-size:42px}
  .bk-grid{grid-template-columns:repeat(2,1fr)}
  .bk-upcoming-grid{grid-template-columns:repeat(2,1fr)}
  .bk-upcoming-head{grid-template-columns:1fr;gap:24px}
  .bk-upcoming-meta{border-left:0;border-top:1px solid var(--rule);padding-top:14px;width:100%}
  .bk-featured{grid-template-columns:1fr;gap:24px;padding:28px}
  .bk-featured-body{border:0;padding:0}
  .bk-featured-meta{padding-left:0}
  .bk-substack{grid-template-columns:auto 1fr;row-gap:14px}
  .bk-substack-cta{grid-column:1 / -1;justify-self:start}

  /* ===== Book detail ===== */
  .bd-hero-grid{grid-template-columns:1fr;gap:32px}
  .bd-title{font-size:42px}
  .bd-about-grid{grid-template-columns:1fr;gap:28px}
  .bd-twocol{grid-template-columns:1fr;gap:28px}
  .bd-more-grid{grid-template-columns:repeat(2,1fr)}

  /* ===== Perfil ABC ===== */
  .pa-hero-grid{grid-template-columns:1fr;gap:36px}
  .pa-tensions-grid{grid-template-columns:repeat(2,1fr)}
  .pa-block{grid-template-columns:100px 1fr 1fr;gap:24px}
  .pa-block-cta{grid-column:1 / -1;flex-direction:row;justify-content:flex-start;align-items:center;padding-top:16px}
  .pa-outcome-grid{grid-template-columns:1fr;gap:28px}
  .pa-vip{grid-template-columns:1fr}

  /* ===== Article ===== */
  .art-layout{grid-template-columns:1fr;gap:32px}
  .art-aside{position:static;top:auto}
}

/* ========== MOBILE ≤ 640 ========== */
@media (max-width: 640px){
  /* --- Header / Nav --- */
  .site-header{position:sticky;top:0;backdrop-filter:none;-webkit-backdrop-filter:none}
  .site-header .inner{padding:12px 0;position:relative}
  .brand-logo{height:28px}
  .nav-toggle{display:flex}

  .nav{
    position:fixed;top:0;right:0;bottom:0;
    width:min(86vw, 340px);
    background:var(--paper);
    flex-direction:column;align-items:stretch;
    gap:0;
    padding:80px 24px 32px;
    transform:translateX(100%);
    transition:transform .28s ease;
    z-index:55;
    box-shadow:-12px 0 40px rgba(11,29,58,.18);
    overflow-y:auto;
    height:100dvh;max-height:100dvh;box-sizing:border-box;
    visibility:hidden;pointer-events:none;
  }
  .nav.is-open{transform:translateX(0);visibility:visible;pointer-events:auto}
  .nav a{
    font-size:17px;font-weight:500;
    padding:14px 0;
    border-bottom:1px solid var(--rule);
    white-space:normal;
  }
  .nav a.is-active::after{display:none}
  .nav a.is-active{color:var(--navy);font-weight:600}
  .nav-search{
    width:auto;height:auto;
    justify-content:flex-start;gap:10px;
    padding:14px 0;
    border-bottom:1px solid var(--rule);
    font-size:15px;
  }
  .nav-search::after{content:"Buscar";font-size:15px;font-weight:500;margin-left:6px}
  .nav .lang-switch{margin-top:18px;align-self:flex-start}
  .nav a.btn-sub{
    margin-top:18px;align-self:stretch;justify-content:center;
    padding:14px 22px;border-bottom:0;
  }

  .search-bar.open{max-height:120px}
  .search-bar .search-inner{padding:14px 0}

  /* --- Hero --- */
  .hero{padding:18px 0 16px}
  .hero-card{height:430px}
  .hero-bg{object-position:47% center}
  .hero-copy{width:52%;padding:24px 0 24px 20px}
  .hero-copy .h-display{font-size:23px;line-height:1.08;margin-bottom:12px}
  .hero-lede{font-size:12.5px;line-height:1.45}
  .pillar-mini .icon-row .arrow{display:none}

  /* --- Espacio Cómplices --- */
  .espacio-complices{margin-top:0;margin-bottom:15px}
  .espacio-complices-grid{grid-template-columns:1fr;gap:24px;align-items:start}
  .espacio-complices-copy{max-width:360px;padding-top:0}
  .espacio-complices-media{width:100%;justify-self:stretch}
  .espacio-complices-title{font-size:26px;margin:0 0 14px}
  .espacio-complices-text{max-width:310px;margin-bottom:8px}
  .espacio-complices-bullets{max-width:310px;margin-bottom:18px}
  .articles{margin-top:19px}

  /* --- Perfil ABC --- */
  .abc{grid-template-columns:1fr;margin-top:0}
  .abc > .card{padding:22px 20px}
  .abc .area-letter{font-size:34px}
  .abc .card .bg-net{display:none}

  /* --- Themes --- */
  .themes-grid{grid-template-columns:1fr}
  .theme{padding:20px 18px;min-height:0}

  /* --- Articles grid --- */
  .articles-grid{grid-template-columns:1fr;gap:24px}
  .article h3{font-size:18px}

  /* --- Newsletter --- */
  .news{padding:22px 0 18px}
  .news .inner{grid-template-columns:1fr;gap:18px}
  .news .feat{align-items:flex-start}
  .news-foot{flex-wrap:wrap}

  /* --- Footer --- */
  .foot-grid{grid-template-columns:1fr;gap:24px;padding-bottom:22px}
  .foot-mission{max-width:none}
  .foot-bottom{flex-direction:column;align-items:flex-start;gap:16px}

  /* --- Cookie banner --- */
  .cookie-banner .ck-inner{grid-template-columns:1fr;gap:14px;padding:16px 20px}
  .cookie-banner .ck-actions{justify-content:flex-start}

  /* --- Typography globals --- */
  .h-display{font-size:32px}
  .h-2{font-size:24px}
  .h-3{font-size:18px}

  /* --- Academic --- */
  .ac-section{padding:48px 20px 0}
  .ac-section + .ac-section{padding-top:40px}
  .ac-title{font-size:30px}
  .ac-section-head{grid-template-columns:1fr;gap:12px}
  .ac-section-title{font-size:24px}
  .ac-courses-grid, .ac-courses-grid.four{grid-template-columns:1fr}
  .ac-talks-grid, .ac-talks-grid.four{grid-template-columns:1fr}
  .ac-books-grid, .ac-books-grid.four{grid-template-columns:1fr}
  .ac-school{grid-template-columns:1fr;gap:6px;padding:16px 4px}
  .ac-school-arrow{justify-self:flex-end;margin-top:-28px}
  .ac-resources-grid{grid-template-columns:1fr}
  .ac-resource{border-right:0;border-bottom:1px solid var(--rule);padding:14px 0}
  .ac-resource:last-child{border-bottom:0}

  /* --- Business --- */
  .bz-foxize-title{font-size:30px}
  .bz-foxize-pillars{grid-template-columns:1fr;max-width:none}
  /* stats row: drop the 120px track floor so 3 columns fit a phone instead
     of forcing the converge block to ~408px and overflowing */
  .bz-converge-stats{grid-template-columns:repeat(3,minmax(0,1fr));padding:16px 6px}
  .bz-stat{padding:0 6px}
  .bz-stat .n{font-size:24px}

  /* --- Books listing --- */
  .bk-hero{padding:20px 0 36px}
  .bk-title{font-size:32px}
  .bk-hero-meta{grid-template-columns:1fr;gap:14px}
  .bk-hero-meta > div{padding-right:0;padding-bottom:14px;border-bottom:1px solid var(--rule)}
  .bk-hero-meta > div + div{border-left:0;padding-left:0;padding-top:14px;border-top:0}
  .bk-hero-meta > div:last-child{border-bottom:0;padding-bottom:0}
  .bk-grid{grid-template-columns:1fr;gap:18px}
  .bk-upcoming-grid{grid-template-columns:1fr}
  .bk-upcoming-title{font-size:28px}
  .bk-upcoming-meta{grid-template-columns:1fr}
  .bk-upcoming-meta li{border-right:0;border-bottom:1px solid var(--rule);padding:10px 0}
  .bk-upcoming-meta li:last-child{border-bottom:0}
  .bk-substack{grid-template-columns:1fr;text-align:left}
  .bk-substack-mark{margin-bottom:4px}
  .bk-toolbar{flex-direction:column;align-items:flex-start;gap:14px}
  .bk-toolbar-right{flex-wrap:wrap}

  /* --- Book detail --- */
  .bd-hero{padding:24px 0 36px}
  .bd-title{font-size:32px}
  .bd-subtitle{font-size:18px}
  .bd-meta{grid-template-columns:1fr;gap:12px;max-width:none}
  .bd-meta > div{padding-right:0;padding-bottom:12px;border-bottom:1px solid var(--rule)}
  .bd-meta > div + div{border-left:0;padding-left:0;padding-top:12px;border-top:0}
  .bd-meta > div:last-child{border-bottom:0;padding-bottom:0}
  .bd-section{padding:40px 0 0}
  .bd-section + .bd-section{margin-top:36px;padding-top:36px}
  .bd-section-title{font-size:24px}
  .bd-more-grid{grid-template-columns:1fr}
  .bd-cover-wrap{padding:18px 18px 22px}
  .bd-buy{padding:18px}
  .bd-toc{padding:18px}

  /* --- Perfil ABC --- */
  .pa-tensions-grid{grid-template-columns:1fr}
  .pa-block{grid-template-columns:1fr;gap:14px}
  .pa-block-list-items{grid-template-columns:1fr}
  .pa-outcome-stats{grid-template-columns:1fr}
  .pa-vip-features{grid-template-columns:1fr}

  /* --- Article --- */
  .art-title{font-size:28px}
  .art-byline{flex-direction:column;align-items:flex-start;gap:12px}
  .art-body{font-size:15px}
  .art-body .art-h2{font-size:22px;margin:32px 0 12px}
  .art-pull{grid-template-columns:1fr;gap:8px}
  .art-pull-quote{font-size:18px}
  .art-comments-composer{grid-template-columns:1fr;gap:12px}
  .art-comments-composer .art-comment-avatar{width:36px;height:36px}
  .art-comment{grid-template-columns:36px 1fr;gap:12px}
  .art-comment-avatar{width:36px;height:36px}

  /* --- Breadcrumbs --- */
  .breadcrumbs{padding:24px 20px 20px;flex-wrap:wrap;gap:8px}
}

/* ========== SMALL PHONE ≤ 420 ========== */
@media (max-width: 420px){
  .container{padding:0 14px}
  .bz-foxize{padding-left:14px;padding-right:14px}
  .hero-card{height:410px}
  .hero-bg{object-position:45% center}
  .hero-copy{width:52%;padding-left:18px}
  .hero-copy .h-display{font-size:21px}
  .hero-lede{font-size:12px}
  .h-display{font-size:28px}
  .bk-title, .bd-title{font-size:28px}
  .ac-title, .bz-foxize-title{font-size:26px}
  .art-title{font-size:24px}
  .nav{width:100vw}
}


/* =====================================================================
   BLOQUE 1 — Conversión al login
   ===================================================================== */

/* --- Header: Iniciar sesión + Crear cuenta --- */
.nav .nav-login{
  font-size:13.5px;font-weight:500;color:var(--ink-2);
  padding:6px 0;position:relative;white-space:nowrap;
  transition:color .15s ease;
}
.nav .nav-login::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;
  background:var(--ink-2);opacity:0;transition:opacity .15s ease;
}
.nav .nav-login:hover{color:var(--navy)}
.nav .nav-login:hover::after{opacity:.5;background:var(--ink-block)}
/* Crear cuenta — variante del btn-sub */
.nav a.btn-signup{
  background:var(--insight);color:var(--on-amber);
}
.nav a.btn-signup svg{stroke:var(--navy)}
.nav a.btn-signup:hover{background:var(--insight-2);color:var(--on-amber)}

/* --- Hero: línea de promesa de personalización --- */
.hero-promise{
  margin:-6px 0 18px;
  max-width:540px;
  font-family:var(--serif);
  font-style:italic;
  font-size:16px;line-height:1.5;color:var(--ink-2);
  letter-spacing:.005em;
  position:relative;padding-left:14px;
}
.hero-promise::before{
  content:"";position:absolute;left:0;top:8px;bottom:8px;
  width:2px;background:var(--insight);
}
.hero-promise strong{
  font-weight:400;font-style:normal;
  background:linear-gradient(transparent 62%, rgba(255,199,44,.32) 62%);
  color:var(--ink);
  padding:0 2px;
}

/* =====================================================================
   LoginGate — componente reutilizable
   ===================================================================== */
.login-gate{position:relative}

.login-gate .lg-card{
  position:relative;
  display:grid;
  grid-template-columns: auto 1fr auto;
  align-items:center;gap:24px;
  padding:22px 26px;
  background:var(--paper);
  border:1px solid var(--rule);
  border-left:3px solid var(--insight);
}
.login-gate .lg-icon{
  width:44px;height:44px;
  display:grid;place-items:center;
  background:rgba(255,199,44,.15);
  color:var(--navy);
  flex:0 0 44px;
}
.login-gate .lg-icon svg{width:22px;height:22px;stroke:var(--navy);stroke-width:1.6;fill:none}
.login-gate .lg-text{display:flex;flex-direction:column;gap:4px;min-width:0}
.login-gate .lg-eyebrow{
  font-family:var(--sans);font-size:10.5px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:var(--amber-2);
}
.login-gate .lg-title{
  font-family:var(--serif);font-size:17px;line-height:1.35;
  color:var(--navy);margin:0;font-weight:400;letter-spacing:-.005em;
  max-width:520px;
}
.login-gate .lg-actions{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  flex-shrink:0;
}
.login-gate .lg-primary{padding:12px 18px;font-size:13px}
.login-gate .lg-secondary{font-size:12.5px}
.login-gate .lg-close{
  position:absolute;top:10px;right:10px;
  width:28px;height:28px;display:grid;place-items:center;
  color:var(--ink-2);background:transparent;
  transition:color .15s ease, background .15s ease;
}
.login-gate .lg-close:hover{color:var(--navy);background:rgba(var(--navy-rgb),.06)}
.login-gate .lg-close svg{width:14px;height:14px}

/* --- inline variant --- */
.login-gate.lg-inline{margin:24px 0}

/* --- overlay variant (fixed bottom + gradient fade) --- */
.login-gate.lg-overlay{
  position:fixed;left:0;right:0;bottom:0;z-index:90;
  pointer-events:none;
  animation:lg-rise .35s ease;
}
.login-gate.lg-overlay .lg-fade{
  position:absolute;left:0;right:0;bottom:0;
  height:240px;pointer-events:none;
  background:linear-gradient(180deg,
    rgba(242,237,230,0)   0%,
    rgba(242,237,230,.85) 55%,
    var(--bg)             100%);
}
.login-gate.lg-overlay .lg-overlay-inner{
  position:relative;
  padding:0 32px 24px;
  pointer-events:auto;
}
.login-gate.lg-overlay .lg-card{
  box-shadow:0 12px 32px -8px rgba(11,29,58,.18);
}
@keyframes lg-rise{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}

/* --- modal variant --- */
.login-gate.lg-modal{
  position:fixed;inset:0;z-index:140;
  display:grid;place-items:center;
  padding:24px;
  animation:lg-fade .25s ease;
}
.login-gate.lg-modal .lg-backdrop{
  position:absolute;inset:0;
  background:rgba(11,29,58,.55);
  backdrop-filter:blur(4px) saturate(120%);
}
.login-gate.lg-modal .lg-modal-inner{
  position:relative;z-index:1;
  max-width:540px;width:100%;
  animation:lg-pop .35s cubic-bezier(.2,.8,.2,1);
}
.login-gate.lg-modal .lg-card{
  flex-direction:column;
  grid-template-columns:1fr;
  text-align:left;
  padding:32px 30px 28px;
  box-shadow:0 24px 60px -12px rgba(11,29,58,.4);
}
.login-gate.lg-modal .lg-actions{margin-top:6px}
@keyframes lg-fade{from{opacity:0}to{opacity:1}}
@keyframes lg-pop{from{transform:translateY(12px) scale(.98);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}

@media (max-width: 720px){
  .login-gate .lg-card{
    grid-template-columns:1fr;
    gap:16px;padding:20px;
  }
  .login-gate .lg-actions{justify-content:flex-start}
  .login-gate.lg-overlay .lg-overlay-inner{padding:0 16px 16px}
}

/* =====================================================================
   PersonalizedPreview — "Tu versión de TITONET"
   ===================================================================== */
.tn-preview-wrap{margin-top:48px}
.tn-preview{
  position:relative;
  display:block;
  color:inherit;text-decoration:none;
  margin-top:14px;
  background:var(--paper);
  border:1px solid var(--rule);
  padding:28px 28px 0;
  overflow:hidden;
  cursor:pointer;
  transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.tn-preview:hover{
  border-color:var(--navy);
  box-shadow:0 16px 40px -24px rgba(11,29,58,.5);
  transform:translateY(-2px);
}
.tn-preview:hover .btn-primary{background:var(--insight-2)}
.tn-preview:focus-visible{outline:2px solid var(--navy);outline-offset:3px}

/* Marca de "vista previa" */
.tn-preview-frame{
  position:absolute;inset:14px;pointer-events:none;
}
.tn-corner{
  position:absolute;width:18px;height:18px;
  border:1px solid var(--insight-2);opacity:.7;
}
.tn-corner.tl{top:0;left:0;border-right:0;border-bottom:0}
.tn-corner.tr{top:0;right:0;border-left:0;border-bottom:0}
.tn-corner.bl{bottom:0;left:0;border-right:0;border-top:0}
.tn-corner.br{bottom:0;right:0;border-left:0;border-top:0}
.tn-stamp{
  position:absolute;top:0;right:30px;
  transform:translateY(-50%);
  background:var(--paper);
  font-family:var(--mono);font-size:10.5px;
  letter-spacing:.04em;color:var(--ink-2);
  padding:3px 10px;
  border:1px solid var(--rule);
}

/* Mock de WelcomeStrip */
.tn-welcome{
  position:relative;z-index:1;
  display:grid;
  grid-template-columns: 1fr auto;
  gap:32px;align-items:end;
  padding:8px 14px 22px;
  border-bottom:1px solid var(--rule);
}
.tn-welcome-left{display:flex;flex-direction:column;gap:0}
.tn-eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--sans);font-size:10.5px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2);
  margin-bottom:9px;
}
.tn-eyebrow-dot{
  width:7px;height:7px;border-radius:50%;
  background:var(--insight);
  box-shadow:0 0 0 3px rgba(255,199,44,.22);
}
.tn-welcome-title{
  font-family:var(--serif);font-weight:400;
  font-size:26px;line-height:1.14;color:var(--navy);
  margin:0;letter-spacing:-.008em;
}
.tn-welcome-title em{font-style:italic;color:var(--amber-2)}
.tn-welcome-lede{
  margin:10px 0 0;max-width:460px;
  font-size:13px;line-height:1.55;color:var(--ink-2);
}
.tn-welcome-right{display:flex;flex-direction:column;gap:9px;align-items:flex-end}
.tn-chips-label{
  font-family:var(--sans);font-size:10.5px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2);
}
.tn-chips{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.tn-chip{
  font-family:var(--sans);font-size:12px;font-weight:600;
  padding:5px 12px;
  border:1px solid var(--rule-2);color:var(--ink);
  background:#fff;
  letter-spacing:.01em;
  border-radius:999px;
}
.tn-chip.is-on{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--ink-block);color:var(--blanco-roto);
  border-color:var(--navy);
}
.tn-chip-x{width:11px;height:11px;opacity:.7}
.tn-chip-add{border-style:dashed;color:var(--ink-2)}
.tn-chip-add::before{content:"+ ";color:var(--amber-2);font-weight:700}

/* Mock del encabezado "Artículos recomendados para ti" */
.tn-section-head{
  position:relative;z-index:1;
  display:flex;align-items:flex-end;justify-content:space-between;gap:20px;
  padding:20px 14px 12px;
  border-bottom:1px solid var(--rule);
}
.tn-section-head-left{display:flex;flex-direction:column;gap:4px}
.tn-section-title{
  font-family:var(--serif);font-weight:400;
  font-size:19px;line-height:1.15;color:var(--navy);
  margin:0;letter-spacing:-.005em;
}
.tn-section-sub{
  font-family:var(--sans);font-size:11px;font-weight:600;
  letter-spacing:.06em;color:var(--muted);text-transform:uppercase;
}
.tn-section-link{
  display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
  font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--ink);
  border-bottom:2px solid var(--insight);padding-bottom:3px;
}
.tn-section-link svg{width:13px;height:13px}

/* Mock de cards */
.tn-cards{
  position:relative;z-index:1;
  display:grid;grid-template-columns:repeat(3, 1fr);gap:18px;
  padding:20px 14px 6px;
}
.tn-card{display:flex;flex-direction:column;gap:8px;position:relative}
.tn-card-new{
  position:absolute;top:10px;left:10px;z-index:2;
  font-family:var(--sans);font-size:10px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  background:var(--insight);color:var(--on-amber);
  padding:4px 8px;
}
.tn-card .thumb{aspect-ratio: 16/10;overflow:hidden}
.tn-card-meta{
  display:flex;align-items:center;gap:10px;
  font-size:10.5px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;
}
.tn-chip-small{
  background:var(--insight);color:var(--on-amber);
  padding:3px 8px;letter-spacing:.14em;
}
.tn-card-date{color:var(--muted)}
.tn-card-title{
  font-family:var(--serif);font-weight:400;font-size:15.5px;line-height:1.3;
  color:var(--navy);margin:0;letter-spacing:-.005em;
}

/* CTA */
.tn-preview-cta{
  position:relative;z-index:1;
  margin:0 -28px;
  margin-top:14px;
  padding:22px 28px;
  background:var(--bg-soft);
  border-top:1px solid var(--rule);
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
}
.tn-preview-lede{
  margin:0;font-size:14px;line-height:1.5;color:var(--ink-2);
  max-width:480px;
}
.tn-preview-lede strong{color:var(--navy);font-weight:700}

@media (max-width: 900px){
  .tn-welcome{grid-template-columns:1fr;gap:14px}
  .tn-welcome-right{align-items:flex-start}
  .tn-chips{justify-content:flex-start}
  .tn-cards{grid-template-columns:1fr 1fr;gap:14px}
  .tn-cards .tn-card:nth-child(3){display:none}
}
@media (max-width: 560px){
  .tn-preview{padding:22px 18px 0}
  .tn-section-head{flex-direction:column;align-items:flex-start;gap:10px}
  .tn-cards{grid-template-columns:1fr}
  .tn-cards .tn-card:nth-child(3){display:flex}
  .tn-preview-cta{margin:0 -18px;padding:18px;flex-direction:column;align-items:flex-start}
  .tn-stamp{right:14px}
}

/* Articles page — gate overlay tweaks */
body.has-overlay-gate{padding-bottom:200px}


/* --- Book page: Resources block --- */
.bd-resources{padding-top:24px}
.bd-resources .bd-section-head{
  margin-bottom:18px;display:flex;flex-direction:column;gap:6px;
  border-bottom:1px solid var(--rule);padding-bottom:14px;
}
.bd-resources .bd-section-title{
  font-family:var(--serif);font-weight:400;
  font-size:30px;line-height:1.15;color:var(--navy);margin:0;letter-spacing:-.005em;
}
.bd-resources .bd-section-lede{
  font-size:14px;line-height:1.55;color:var(--ink-2);margin:0;max-width:640px;
}
.bd-resources-list{
  list-style:none;padding:0;margin:0 0 8px;
  display:flex;flex-direction:column;
  border-top:1px solid var(--rule);
}
.bd-resource-item{
  display:grid;grid-template-columns: 48px 1fr 28px;gap:18px;align-items:center;
  padding:16px 4px;
  border-bottom:1px solid var(--rule);
  color:var(--ink);
  transition:padding .2s ease;
}
.bd-resource-item:hover{padding-left:10px}
.bd-resource-n{
  font-family:var(--mono);font-size:12px;color:var(--muted);
  letter-spacing:.04em;
}
.bd-resource-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.bd-resource-title{
  font-family:var(--sans);font-weight:600;font-size:14.5px;color:var(--navy);
  letter-spacing:-.005em;
}
.bd-resource-desc{font-size:13px;color:var(--ink-2);line-height:1.45}
.bd-resource-lock{
  width:24px;height:24px;display:grid;place-items:center;
  color:var(--ink-2);opacity:.65;
}
.bd-resource-lock svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.6;fill:none}
@media (max-width: 560px){
  .bd-resource-item{grid-template-columns: 32px 1fr 24px;gap:12px}
}


/* =====================================================================
   BLOQUE 2.1 — Header reducido: dropdowns
   ===================================================================== */
.nav-dropdown{
  position:relative;
  display:inline-flex;align-items:center;
}
.nav-dropdown-trigger{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--sans);font-size:13.5px;font-weight:500;
  color:var(--ink);padding:6px 0;white-space:nowrap;
  background:transparent;border:0;cursor:pointer;
  position:relative;
}
.nav-dropdown-trigger .caret{
  width:9px;height:6px;color:var(--ink-2);
  transition:transform .2s ease, color .2s ease;
}
.nav-dropdown-trigger:hover{color:var(--amber-2)}
.nav-dropdown.is-open .nav-dropdown-trigger{color:var(--navy)}
.nav-dropdown.is-open .nav-dropdown-trigger .caret{transform:rotate(180deg);color:var(--navy)}
.nav-dropdown.is-active .nav-dropdown-trigger::after{
  content:"";position:absolute;left:0;right:14px;bottom:-2px;height:2px;
  background:var(--amber-2);border-radius:2px;
}

/* Panel (desktop popover) */
.nav-dropdown-panel{
  position:absolute;top:calc(100% + 6px);left:-20px;
  min-width:170px;
  background:var(--paper);
  border:1px solid var(--rule);
  box-shadow:0 18px 40px -12px rgba(11,29,58,.18);
  opacity:0;visibility:hidden;
  transform:translateY(-4px);
  transition:opacity .15s ease, transform .15s ease, visibility .15s ease;
  z-index:60;
}
.nav-dropdown.is-open .nav-dropdown-panel{
  opacity:1;visibility:visible;transform:translateY(0);
}
.nav-dropdown-inner{
  display:flex;flex-direction:column;
  padding:8px 0;
}
.nav .nav-dropdown-link{
  display:flex;flex-direction:column;gap:2px;
  padding:10px 20px;
  color:var(--ink);
  transition:background .15s ease, color .15s ease;
}
.nav-dropdown-link:hover{background:var(--bg-soft);color:var(--navy)}
.nav-dropdown-link .ndl-label{
  font-family:var(--sans);font-size:13.5px;font-weight:600;
  letter-spacing:-.005em;
}
.nav-dropdown-link .ndl-desc{
  font-size:11.5px;color:var(--ink-2);line-height:1.35;
}
.nav-dropdown-link:hover .ndl-desc{color:var(--ink-2)}

/* En el drawer móvil: el panel se vuelve acordeón inline */
@media (max-width: 640px){
  .nav-dropdown{display:flex;flex-direction:column;align-items:flex-start;width:100%}
  .nav-dropdown-trigger{
    width:100%;justify-content:space-between;
    padding:14px 0;font-size:17px;font-weight:500;
    border-bottom:1px solid var(--rule);
  }
  .nav-dropdown-trigger .caret{width:11px;height:7px}
  .nav-dropdown-panel{
    position:static;width:100%;min-width:0;
    background:transparent;border:0;box-shadow:none;
    opacity:1;visibility:visible;transform:none;
    max-height:0;overflow:hidden;
    transition:max-height .25s ease;
  }
  .nav-dropdown.is-open .nav-dropdown-panel{max-height:600px}
  .nav-dropdown-inner{padding:6px 0 10px}
  .nav .nav-dropdown-link{padding:10px 0;border-bottom:0}
  .nav-dropdown-link .ndl-label{font-size:15px;font-weight:500}
  .nav-dropdown-link .ndl-desc{font-size:12px;color:var(--muted)}
}


/* =====================================================================
   BLOQUE 6 — Acceso (Qué somos): los tres niveles
   ===================================================================== */

/* --- Hero --- */
.acceso-hero{
  padding:48px 0 0;
}
.acceso-hero-inner{display:flex;flex-direction:column;gap:18px;max-width:880px}
.acceso-hero-eyebrow{color:var(--amber-2)}
.acceso-h1{
  font-family:var(--serif);font-weight:400;
  font-size:64px;line-height:1.02;letter-spacing:-.02em;
  color:var(--navy);margin:0;
}
.acceso-h1 em{font-style:italic;color:var(--insight-2);font-weight:400}
.acceso-hero-lede{
  display:flex;flex-direction:column;gap:14px;
  font-size:18px;line-height:1.6;color:var(--ink-2);
  margin:0;max-width:620px;
}
.acceso-hero-lede p{margin:0}
.acceso-hero-lede-lead{
  font-size:21px;line-height:1.45;color:var(--ink);
}
.acceso-hero-lede-close{
  font-family:var(--serif);font-style:italic;
  font-size:20px;line-height:1.4;color:var(--navy);
}
.acceso-hero-lede strong{color:var(--ink);font-weight:600}

/* mini-índice de los 3 niveles */
.acceso-hero-meta{
  display:flex;flex-direction:column;
  margin-top:8px;
  border-top:1px solid var(--rule);
}
.acceso-hero-meta-row{
  display:grid;grid-template-columns: 44px 160px 1fr;gap:18px;align-items:baseline;
  padding:13px 2px;border-bottom:1px solid var(--rule);
}
.acceso-hero-meta-n{
  font-family:var(--mono);font-size:12px;color:var(--muted);letter-spacing:.04em;
}
.acceso-hero-meta-l{
  font-family:var(--sans);font-size:13px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--navy);
}
.acceso-hero-meta-d{font-size:14px;color:var(--ink-2);line-height:1.4}

/* --- section-label genérico (reuso) --- */
.acceso-levels-wrap{margin-top:56px}
.acceso-levels-hint{
  font-family:var(--mono);font-size:12.5px;color:var(--muted);letter-spacing:.01em;
}

/* --- Las columnas de nivel --- */
.acceso-levels{
  display:grid;grid-template-columns:repeat(3, 1fr);gap:0;
  margin-top:14px;
  border:1px solid var(--rule);
}
.acceso-level{
  display:flex;flex-direction:column;align-items:stretch;text-align:left;
  padding:30px 28px 28px;
  background:var(--paper);
  position:relative;
}
.acceso-level + .acceso-level{border-left:1px solid var(--rule)}

/* nivel 3 destacado */
.acceso-level-vip{
  background:var(--ink-block);color:var(--on-ink);
}
.acceso-level-vip::before{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--insight);
}

.acceso-level-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-bottom:18px;
}
.acceso-level-n{
  font-family:var(--serif);font-size:30px;font-weight:400;color:var(--navy);
  letter-spacing:-.01em;line-height:1;
}
.acceso-level-vip .acceso-level-n{color:var(--insight)}
.acceso-level-tag{
  font-family:var(--sans);font-size:10px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;
  padding:5px 10px;
  color:var(--ink-2);border:1px solid var(--rule);
}
.acceso-level-known .acceso-level-tag{
  background:var(--insight);color:var(--on-amber);border-color:var(--insight);
}
.acceso-level-vip .acceso-level-tag{color:var(--on-ink-2);border-color:rgba(255,255,255,.22)}

.acceso-level-name{
  font-family:var(--serif);font-weight:400;font-size:26px;line-height:1.1;
  color:var(--navy);margin:0 0 10px;letter-spacing:-.01em;
}
.acceso-level-vip .acceso-level-name{color:#fff}
.acceso-level-desc{
  font-size:14px;line-height:1.55;color:var(--ink-2);margin:0;
}
.acceso-level-vip .acceso-level-desc{color:var(--on-ink-2)}

.acceso-level-divider{
  height:1px;background:var(--rule);margin:20px 0 18px;
}
.acceso-level-vip .acceso-level-divider{background:rgba(255,255,255,.16)}

.acceso-level-list{
  list-style:none;padding:0;margin:0 0 24px;
  display:flex;flex-direction:column;gap:11px;flex:1;
}
.acceso-level-list li{
  display:flex;align-items:flex-start;gap:11px;
  font-size:13.5px;line-height:1.4;color:var(--ink);
}
.acceso-level-vip .acceso-level-list li{color:#E4DAC2}
.acceso-level-list li.is-locked{color:var(--muted)}
.acceso-level-ic{
  flex:0 0 18px;width:18px;height:18px;display:grid;place-items:center;
  margin-top:1px;color:var(--muted);
}
.acceso-level-ic svg{width:15px;height:15px;stroke-width:1.7;fill:none}
.acceso-level-ic-on{color:var(--insight-2)}
.acceso-level-vip .acceso-level-ic-on{color:var(--insight)}
.acceso-level-ic .lock,
.acceso-level-list li.is-locked .acceso-level-ic svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.5;fill:none}

.acceso-level-foot{
  margin-top:auto;display:flex;flex-direction:column;gap:14px;
}
.acceso-level-footnote{
  font-family:var(--mono);font-size:11.5px;line-height:1.5;color:var(--muted);
  margin:0;letter-spacing:.005em;
}
.acceso-level-vip .acceso-level-footnote{color:#8FA0BC}
.acceso-level-foot .btn-primary{width:100%;justify-content:center}
.acceso-level-ctas{display:flex;flex-direction:column;gap:10px}
.acceso-level-ctas .btn-navy{width:100%;justify-content:center}
.acceso-level-cta-ic{display:inline-flex;align-items:center;width:17px;height:17px}
.acceso-level-cta-ic svg{width:17px;height:17px}

/* --- FFF: franja horizontal, discreta --- */
.acceso-fff{
  display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;
  border:1px solid var(--rule);border-top:0;
  background:var(--bg-soft);padding:24px 28px;
}
.acceso-fff-main{flex:1 1 420px;min-width:280px}
.acceso-fff-head{display:flex;align-items:baseline;gap:12px;margin-bottom:6px}
.acceso-fff-n{font-family:var(--mono);font-size:13px;color:var(--ink-3);letter-spacing:.04em}
.acceso-fff-name{font-family:var(--serif);font-size:19px;color:var(--navy)}
.acceso-fff-tag{
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-3);border:1px solid var(--rule);padding:2px 8px;white-space:nowrap;
}
.acceso-fff-desc{font-size:14px;line-height:1.55;color:var(--ink-2);margin:0;max-width:62ch}
.acceso-fff-cta{flex:0 0 auto;width:auto;white-space:nowrap}
@media (max-width:680px){
  .acceso-fff{flex-direction:column;align-items:flex-start;gap:18px}
  .acceso-fff-cta{width:100%;justify-content:center}
}

/* "Estás aquí" badge para nivel 1 */
.acceso-level-here{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--sans);font-size:12px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);
  padding:11px 0;
}
.acceso-level-here .dot{
  width:8px;height:8px;border-radius:50%;background:var(--insight);
  box-shadow:0 0 0 3px rgba(255,199,44,.25);
}

/* --- Voz / cita --- */
.acceso-voice-wrap{
  margin-top:56px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  background:var(--bg-soft);padding:52px 0;
}
.acceso-voice{display:flex;gap:28px;align-items:stretch;max-width:840px}
.acceso-voice-rule{flex:0 0 3px;background:var(--insight)}
.acceso-voice-q{margin:0}
.acceso-voice-q p{
  font-family:var(--serif);font-size:25px;line-height:1.45;
  color:var(--navy);margin:0 0 16px;font-weight:400;letter-spacing:-.005em;
}
.acceso-voice-q p em{font-style:italic;color:var(--insight-2)}
.acceso-voice-author{
  font-family:var(--sans);font-size:14px;font-weight:600;color:var(--ink);
}
.acceso-voice-handle{color:var(--muted);font-weight:500}

/* --- FAQ --- */
.acceso-faq-wrap{margin-top:48px;margin-bottom:8px}
.acceso-faq{margin-top:14px;border-top:1px solid var(--rule)}
.acceso-faq-item{border-bottom:1px solid var(--rule)}
.acceso-faq-item summary{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:20px 2px;cursor:pointer;list-style:none;
}
.acceso-faq-item summary::-webkit-details-marker{display:none}
.acceso-faq-q{
  font-family:var(--serif);font-size:18px;line-height:1.35;color:var(--navy);
  font-weight:400;letter-spacing:-.005em;
}
.acceso-faq-mark{
  flex:0 0 30px;width:30px;height:30px;display:grid;place-items:center;
  border:1px solid var(--rule);color:var(--ink-2);
  transition:transform .25s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.acceso-faq-mark svg{width:14px;height:14px}
.acceso-faq-item[open] .acceso-faq-mark{
  transform:rotate(45deg);
  background:var(--ink-block);color:var(--insight);border-color:var(--navy);
}
.acceso-faq-a{
  margin:0;padding:0 2px 22px;max-width:680px;
  font-size:14.5px;line-height:1.6;color:var(--ink-2);
}

/* --- Responsive --- */
@media (max-width: 900px){
  .acceso-h1{font-size:44px}
  .acceso-levels{grid-template-columns:1fr}
  .acceso-level + .acceso-level{border-left:0;border-top:1px solid var(--rule)}
  .acceso-hero-meta-row{grid-template-columns: 36px 1fr;gap:12px}
  .acceso-hero-meta-d{grid-column:1 / -1;padding-left:48px;margin-top:-6px}
}
@media (max-width: 560px){
  .acceso-h1{font-size:36px}
  .acceso-hero-lede{font-size:16px}
  .acceso-voice{flex-direction:column;gap:16px}
  .acceso-voice-rule{flex:0 0 auto;height:3px;width:48px}
  .acceso-voice-q p{font-size:21px}
}


/* =====================================================================
   BLOQUE 3 — Banda "Hazte cómplice" (CTA horizontal, sin newsletter)
   ===================================================================== */
.complice{
  margin-top:48px;
  background:var(--ink-block);color:var(--on-ink);
  border-top:3px solid var(--insight);
}
.complice-inner{
  display:flex;align-items:center;flex-wrap:wrap;
  gap:28px 48px;
  padding:34px 32px;
}
.complice-lead{
  display:flex;flex-direction:column;gap:6px;
  flex:0 0 auto;max-width:300px;
}
.complice-eyebrow{
  font-family:var(--sans);font-size:10.5px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:var(--insight);
}
.complice-title{
  font-family:var(--serif);font-weight:400;font-size:30px;line-height:1.06;
  color:#fff;margin:0;letter-spacing:-.01em;
}
.complice-title em{font-style:italic;color:var(--insight)}
.complice-copy{
  margin:0;color:var(--on-ink-2);font-size:14px;line-height:1.45;
}

.complice-benefits{
  list-style:none;margin:0;padding:0;
  flex:1 1 380px;min-width:300px;
  display:flex;flex-direction:column;gap:10px;
  border-left:1px solid rgba(255,255,255,.14);padding-left:40px;
}
.complice-benefits li{
  display:grid;grid-template-columns:20px 1fr;align-items:start;gap:11px;
  font-size:14px;line-height:1.4;color:var(--on-ink-2);
}
.complice-benefits strong{color:var(--on-ink);font-weight:600}
.complice-bic{display:flex;color:var(--insight);margin-top:1px}
.complice-bic svg{width:18px;height:18px}

.complice-cta{
  flex:0 0 auto;
  display:flex;flex-direction:column;align-items:flex-start;gap:12px;
  padding-left:40px;border-left:1px solid rgba(255,255,255,.14);
}
.complice-price{display:flex;align-items:baseline;gap:6px}
.complice-amount{font-family:var(--serif);font-size:34px;font-weight:400;color:var(--insight);line-height:1}
.complice-per{font-family:var(--sans);font-size:14px;color:var(--on-ink-2);font-weight:500}
.complice-btn{align-self:stretch;justify-content:center}
.complice-proof{
  display:flex;align-items:center;gap:9px;
  font-size:12px;color:var(--on-ink-2);
}
.complice-proof .dot-live{
  width:8px;height:8px;border-radius:50%;background:var(--insight);
  box-shadow:0 0 0 3px rgba(255,199,44,.22);flex:0 0 8px;
}

/* --- Responsive --- */
@media (max-width: 1080px){
  .complice-benefits{border-left:0;padding-left:0;flex-basis:100%;order:3}
  .complice-lead{max-width:none}
  .complice-cta{order:2;margin-left:auto}
}
@media (max-width: 720px){
  .complice-inner{padding:30px 20px;gap:22px 24px}
  .complice-lead{flex:1 1 100%;min-width:0}
  .complice-cta{
    flex-basis:100%;order:4;margin-left:0;
    padding-left:0;border-left:0;
    border-top:1px solid rgba(255,255,255,.14);padding-top:20px;
    flex-direction:row;align-items:center;flex-wrap:wrap;gap:14px 22px;
  }
  .complice-btn{align-self:auto}
  .complice-title{font-size:27px}
}
@media (max-width: 560px){
  .complice-inner{padding:28px 16px}
  .complice-btn{flex:1 1 100%}
}

/* Explorar v1.3: estado activo de la navegación superior de app */
.lh-tabs .lh-tab.is-on[href="Explorar.html"]{
  background:rgba(238,186,67,.12);
  font-weight:750;
  color:inherit;
  position:relative;
}
.lh-tabs .lh-tab.is-on[href="Explorar.html"]::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:0;
  height:3px;
  background:var(--amber-2, #EEBA43);
  border-radius:3px 3px 0 0;
}

/* App nav: estado activo común para Para ti · Explorar · Mis intereses */
.lh-tabs .lh-tab.is-on{
  background:rgba(244,243,239,.92);
  font-weight:750;
  color:inherit;
  position:relative;
}
.lh-tabs .lh-tab.is-on::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:0;
  height:3px;
  background:var(--amber-2, #EEBA43);
  border-radius:3px 3px 0 0;
}

/* App nav: igualar Explorar al estado activo común */
.lh-tabs .lh-tab.is-on[href="Explorar.html"]{
  background:rgba(244,243,239,.92);
}

/* App nav: dejar una única línea fina en la pestaña activa */
.lh-tabs .lh-tab.is-on{
  border-bottom:0 !important;
  box-shadow:none !important;
}
.lh-tabs .lh-tab.is-on::before{
  content:none !important;
  display:none !important;
}
.lh-tabs .lh-tab.is-on::after,
.lh-tabs .lh-tab.is-on[href="Explorar.html"]::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:0;
  height:1.5px;
  background:var(--amber-2, #EEBA43);
  border-radius:2px 2px 0 0;
}

/* Article interaction redesign — 2026-08-05 */
.art-interactions{
  position:relative;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin:0 0 28px;padding:10px 0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
}
.art-interaction{
  display:inline-flex;align-items:center;gap:8px;
  min-height:34px;padding:7px 10px;
  font-family:var(--sans);font-size:12.5px;font-weight:600;
  color:var(--ink-2);background:transparent;border:1px solid transparent;
  cursor:pointer;transition:color .15s ease, border-color .15s ease, background .15s ease;
}
.art-interaction:hover{color:var(--navy);border-color:var(--rule);background:var(--tint-hover)}
.art-interaction.is-on{color:var(--insight-2);background:rgba(255,199,44,.10);border-color:rgba(255,199,44,.35)}
.art-interaction-ic{display:inline-flex;width:14px;height:14px;color:currentColor;flex:0 0 14px}
.art-interaction-ic svg{width:14px;height:14px;stroke:currentColor;fill:none}
.art-interaction.is-on .art-interaction-ic svg{fill:currentColor}
.art-interaction-note{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--muted)}

.art-next{
  margin:40px 0 0;padding:30px 0 24px;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
}
.art-next-title,.art-deep-title{
  margin:0 0 18px;font-family:var(--serif);font-weight:400;
  font-size:28px;line-height:1.15;letter-spacing:-.01em;color:var(--navy);
}
.art-next-grid{
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;
}
.art-next-action{
  min-height:112px;padding:18px 14px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;
  font-family:var(--sans);font-size:13px;font-weight:600;line-height:1.25;color:var(--ink);
  background:var(--paper);border:1px solid var(--rule);cursor:pointer;
  transition:transform .15s ease, border-color .15s ease, background .15s ease, color .15s ease, box-shadow .15s ease;
}
.art-next-action:hover{transform:translateY(-1px);border-color:var(--navy);color:var(--navy);box-shadow:0 12px 30px -24px rgba(11,29,58,.35)}
.art-next-action.is-on{border-color:rgba(255,199,44,.55);background:rgba(255,199,44,.12);color:var(--insight-2)}
.art-next-ic{display:inline-flex;width:24px;height:24px;color:currentColor}
.art-next-ic svg{width:24px;height:24px;stroke:currentColor;fill:none}
.art-next-action.is-on .art-next-ic svg{fill:currentColor}
.art-next-note{margin:16px 0 0;font-family:var(--sans);font-size:12.5px;line-height:1.5;color:var(--muted)}

.art-deep{margin:34px 0 0;padding:26px 0 6px}
.art-deep-tabs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.art-deep-tab{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;
  min-height:48px;padding:10px 11px;color:var(--ink);text-decoration:none;
  background:transparent;border:1px solid var(--rule);
  font-family:var(--sans);transition:border-color .15s ease, background .15s ease, color .15s ease;
}
.art-deep-tab:hover{color:var(--navy);border-color:var(--navy);background:var(--tint-hover)}
.art-deep-ic{display:inline-flex;width:17px;height:17px;color:currentColor}
.art-deep-ic svg{width:17px;height:17px;stroke:currentColor;fill:none}
.art-deep-label{font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.art-deep-count{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--bg-soft);font-family:var(--mono);font-size:11px;color:var(--ink-2)}
.art-copy-toast{
  position:fixed;left:50%;bottom:28px;z-index:1000;transform:translateX(-50%);
  padding:10px 14px;background:var(--navy);color:#fff;border:1px solid rgba(255,255,255,.16);
  font-family:var(--sans);font-size:13px;font-weight:600;box-shadow:0 18px 50px -24px rgba(11,29,58,.45);
}
@media (max-width:980px){
  .art-next-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .art-next-action:last-child{grid-column:auto}
  .art-deep-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  .art-interactions{align-items:stretch;gap:6px}
  .art-interaction{width:100%;justify-content:center}
  .art-interaction-note{width:100%;margin-left:0;text-align:center}
  .art-next{margin-top:30px;padding-top:24px}
  .art-next-title,.art-deep-title{font-size:24px}
  .art-next-grid{grid-template-columns:1fr;gap:8px}
  .art-next-action{min-height:82px;flex-direction:row;justify-content:flex-start;text-align:left;padding:16px}
  .art-deep-tabs{grid-template-columns:1fr}
}

/* Article UX flow — lectura → interacción → conversación → seguir aprendiendo (2026-08-08) */
.art-body .art-lead-p::first-letter{
  font-family:inherit;font-weight:inherit;font-size:inherit;line-height:inherit;color:inherit;
  float:none;padding:0;
}
.art-byline{align-items:center;padding:14px 0 16px;border-top:0}
.art-byline-left{min-width:0}
.art-byline-sub{gap:11px;font-size:12px;color:var(--ink-2);letter-spacing:.005em}
.art-byline-sep{color:var(--muted);padding:0 2px}
.art-head-save{display:inline-flex;align-items:center;gap:10px;margin-left:auto;min-width:0}
.art-head-save-button.art-next-action.art-next-compact{padding:0;gap:0;flex:0 0 auto}
.art-head-save-button.art-next-action.art-next-compact .art-next-ic{width:32px;height:32px;flex-basis:32px}
.art-head-save-copy{font-family:var(--sans);font-size:13.5px;line-height:1.35;color:var(--ink-2);white-space:nowrap}
.art-head-save-copy strong{font-weight:750;color:var(--ink)}
.art-head-save.is-on .art-head-save-copy strong{color:var(--ink)}
.art-section-title{
  margin:0 0 18px;font-family:var(--serif);font-weight:400;
  font-size:28px;line-height:1.15;letter-spacing:-.01em;color:var(--navy);
}
.art-next{
  margin:36px 0 0;padding:24px 0 22px;
  border-top:1px solid var(--rule);border-bottom:0;
}
.art-next-row{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,1.65fr);
  align-items:center;gap:0;
}
.art-next-row > * + *{border-left:1px solid var(--rule);padding-left:22px;margin-left:22px}
.art-next-action.art-next-compact{
  min-height:0;padding:0;display:inline-flex;flex-direction:row;align-items:center;justify-content:flex-start;
  gap:10px;text-align:left;background:transparent;border:0;color:var(--ink);box-shadow:none;
  font-size:13.5px;font-weight:600;line-height:1.35;cursor:pointer;
}
.art-next-action.art-next-compact:hover{transform:none;background:transparent;border-color:transparent;box-shadow:none;color:var(--navy)}
.art-next-action.art-next-compact .art-next-ic{
  width:32px;height:32px;flex:0 0 32px;display:inline-flex;align-items:center;justify-content:center;
  color:var(--paper);background:var(--navy);border:1px solid var(--navy);border-radius:999px;
  transition:color .15s ease, background .15s ease;
}
.art-next-action.art-next-compact .art-next-ic svg{width:15px;height:15px;stroke:currentColor;fill:none}
.art-next-action.art-next-compact.is-on{background:transparent;border-color:transparent;color:var(--ink)}
.art-next-action.art-next-compact.is-on .art-next-ic{color:var(--insight);background:var(--navy)}
.art-next-action.art-next-compact.is-on .art-next-ic svg{stroke:currentColor;fill:currentColor}
.art-next-share-group{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0}
.art-next-share-title,.art-next-text{font-family:var(--sans);font-size:13.5px;font-weight:600;line-height:1.35;color:var(--ink)}
.art-next-share-links{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.art-next-sep{font-family:var(--sans);font-size:13px;color:var(--muted)}
.art-next-share{
  display:inline-flex;align-items:center;justify-content:center;padding:0;
  font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--ink-2);
  background:transparent;border:0;cursor:pointer;
  transition:color .15s ease;
}
.art-next-share:hover{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.art-next-note{margin:12px 0 0;font-family:var(--sans);font-size:12.5px;line-height:1.5;color:var(--muted)}
.art-comments{margin-top:0;padding-top:30px;border-top:1px solid var(--rule)}
.art-comments-head{align-items:flex-start;margin-bottom:14px}
.art-comments-composer{grid-template-columns:1fr;padding:12px 0 16px;background:transparent;border:0;border-bottom:1px solid var(--rule);margin-bottom:18px}
.art-comments-composer > .art-comment-avatar{display:none}
.art-comments-textarea{min-height:78px;padding:12px 14px;background:var(--paper);border:1px solid var(--rule)}
.art-comments-composer-foot{border-top:0;padding-top:0;justify-content:flex-end}
.art-comments-rules{display:none}
.art-comments-more{
  display:inline-flex;margin-top:18px;font-family:var(--sans);font-size:13px;font-weight:600;
  color:var(--ink);text-decoration:none;
}
.art-comments-more:hover{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.art-deep{margin:40px 0 0;padding:30px 0 0;border-top:1px solid var(--rule)}
.art-deep-tabs{display:flex;align-items:center;gap:18px;flex-wrap:nowrap;margin-bottom:24px;overflow-x:auto;overflow-y:hidden;padding-bottom:2px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.art-deep-tab{
  display:inline-flex;align-items:center;gap:7px;min-height:0;padding:0 0 6px;
  color:var(--ink-2);background:transparent;border:0;border-bottom:1.5px solid transparent;
  font-family:var(--sans);cursor:pointer;
}
.art-deep-tab:hover{color:var(--navy);background:transparent;border-color:var(--rule)}
.art-deep-tab.is-on{color:var(--navy);border-bottom-color:var(--insight)}
.art-deep-tab[aria-selected="true"]{font-weight:700}
.art-deep-label{font-size:13px;font-weight:600;white-space:nowrap;overflow:visible;text-overflow:clip}
.art-deep-cards{margin-top:0}
@media (max-width:980px){
  .art-next-row{grid-template-columns:1fr;gap:14px}
  .art-next-row > * + *{border-left:0;border-top:1px solid var(--rule);padding-left:0;margin-left:0;padding-top:14px}
  .art-deep-tabs{gap:12px 16px}
}
@media (max-width:720px){
  .art-head-save{margin-left:0}
  .art-head-save-copy{white-space:normal}
}
@media (max-width:560px){
  .art-section-title{font-size:24px}
  .art-next{margin-top:30px;padding-top:22px}
  .art-next-action.art-next-compact{width:auto;justify-content:flex-start}
  .art-next-share-group{align-items:flex-start;flex-direction:column;gap:8px}
  .art-comments-composer{grid-template-columns:1fr}
  .art-deep-tabs{align-items:center;margin-left:-4px;margin-right:-4px;padding-left:4px;padding-right:4px}
  .art-deep-tab{flex:0 0 auto}
}

/* Related-by-topic tabs: visitor keeps restricted formats visible; click goes to Cómplices (2026-08-08) */
.art-deep-tab.is-restricted{color:var(--ink-2)}
.art-deep-tab.is-restricted:hover{color:var(--navy);border-color:var(--rule)}
.art-deep-status{margin:0 0 18px;font-family:var(--sans);font-size:13px;color:var(--ink-2)}

/* Article comments empty state: no reserved block (2026-08-07) */
.art-comments-list.is-empty{display:none;border-top:0;margin:0;padding:0}

/* Article related cards: the active tab already provides the format context (2026-08-07) */
.art-deep-cards .article{gap:12px}
.art-deep-cards .article .meta{display:none}
.art-deep-cards .article .thumb{
  aspect-ratio:16/10;
  min-height:0;
  width:100%;
  background:#E5E5E5;
}
.art-deep-cards .article .thumb img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.art-deep-cards .article h3{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height:calc(1.3em * 3);
}
.art-deep-cards .article-link{margin-top:2px}