/* Guías: vidrio esmerilado en versión clara. Se conservan los colores (portada azul marino, cuerpo claro,
   cajas azul marino y vino); lo nuevo es la transparencia, el desenfoque y un fondo suave con foto detrás. */
body{--cr-vidrio:rgba(255,255,255,.58);--cr-borde:rgba(255,255,255,.85);--cr-sombra:0 10px 30px rgba(40,84,138,.10)}
.barra{background:rgba(40,84,138,.62) !important;-webkit-backdrop-filter:blur(22px) saturate(1.5);backdrop-filter:blur(22px) saturate(1.5);border-bottom:1px solid rgba(255,255,255,.18) !important}
/* portada de la guía: azul marino sobre una foto desenfocada */
.doc-hero{position:relative;isolation:isolate;overflow:hidden}
.doc-hero::before{content:"";position:absolute;inset:-30px;background:url(../images/entrevista/hero-F.webp) center 30%/cover no-repeat;filter:blur(26px) saturate(1.2);opacity:.55;z-index:-2}
.doc-hero::after{content:"";position:absolute;inset:0;background:rgba(40,84,138,.78);z-index:-1}
.doc-hero .etiqueta,.doc-hero .volver-btn{background:rgba(255,255,255,.14) !important;border:1px solid rgba(255,255,255,.4) !important;color:#fff !important;border-radius:999px !important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
/* cuerpo claro con color suave detrás, para que el vidrio se note */
.doc-seccion{position:relative;isolation:isolate;background:#eef2f8 !important}
.doc-seccion::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 40% at 15% 8%,rgba(233,180,76,.22),transparent 70%),radial-gradient(55% 35% at 90% 30%,rgba(60,110,190,.20),transparent 70%),radial-gradient(60% 40% at 20% 75%,rgba(242,181,59,.16),transparent 70%);z-index:-1}
/* vidrio claro: receta común */
.respuesta,.recorrido .paso,.tip,.dialogo .linea,.videos-ordenes li,.cta-guia,.relacionadas li,.parte-n400,.aviso-guia,.doc h2,.partes .parte-n400{
  -webkit-backdrop-filter:blur(20px) saturate(1.5);backdrop-filter:blur(20px) saturate(1.5)}
.recorrido .paso,.tip,.videos-ordenes li,.cta-guia,.relacionadas li,.parte-n400,.aviso-guia{background:var(--cr-vidrio) !important;border:1px solid var(--cr-borde) !important;border-radius:18px !important;box-shadow:var(--cr-sombra),inset 0 1px 0 rgba(255,255,255,.9) !important}
.recorrido .paso{padding:16px !important}
.doc h2{background:rgba(255,255,255,.55) !important;border:1px solid var(--cr-borde) !important;border-radius:14px !important;box-shadow:var(--cr-sombra),inset 0 1px 0 rgba(255,255,255,.9) !important}
.dialogo .linea{background:rgba(244,241,234,.6) !important;border:1px solid rgba(255,255,255,.85);border-radius:14px !important}
.dialogo .linea.sol{background:rgba(220,234,250,.65) !important}
/* caja de respuesta rápida: el mismo azul marino, en vidrio */
.respuesta{background:rgba(40,84,138,.82) !important;border:1px solid rgba(255,255,255,.28) !important;border-radius:18px !important;box-shadow:0 14px 34px rgba(40,84,138,.25),inset 0 1px 0 rgba(255,255,255,.25) !important;color:#fff}
.respuesta *{color:inherit}
/* fotos */
.hero-guia img,.recorrido .paso img{border-radius:16px;box-shadow:0 8px 24px rgba(40,84,138,.18)}
.hero-guia{border-radius:20px}
.videos-ordenes video{border-radius:12px}
/* velocidad */
.velocidad,.velocidad--mini{background:rgba(255,255,255,.6) !important;border:1px solid var(--cr-borde) !important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
/* botones */
.cta-guia .btn,.doc .btn--principal{border-radius:14px}
/* pie de la guía oscuro, sin tocar */
.doc-hero .etiqueta{display:inline-block !important;width:auto !important;padding:6px 14px !important}
.doc-hero::after{background:rgba(40,84,138,.68)}
.velocidad:not(.velocidad--mini){display:inline-flex !important;width:fit-content !important;border-radius:999px !important}
.doc-seccion::before{background:radial-gradient(60% 35% at 12% 6%,rgba(233,180,76,.32),transparent 70%),radial-gradient(55% 30% at 92% 28%,rgba(60,110,190,.28),transparent 70%),radial-gradient(60% 35% at 18% 70%,rgba(242,181,59,.24),transparent 70%),radial-gradient(50% 30% at 85% 92%,rgba(233,180,76,.26),transparent 70%)}
/* v4: volver al aspecto de la guía N-400 (portada azul marino lisa, cuerpo blanco); sin rosa. Solo el material es vidrio. */
.doc-hero::after{background:rgba(40,84,138,.94)}
.doc-seccion{background:#f7f8fb !important}
.doc-seccion::before{background:radial-gradient(55% 28% at 8% 10%,rgba(60,110,190,.16),transparent 70%),radial-gradient(50% 26% at 95% 35%,rgba(40,84,138,.12),transparent 70%),radial-gradient(55% 28% at 12% 72%,rgba(60,110,190,.14),transparent 70%),radial-gradient(50% 26% at 90% 92%,rgba(40,84,138,.10),transparent 70%)}
/* v5: orden del texto en lista de guías y fuentes */
.doc ul.relacionadas{list-style:none;margin:0 0 8px;padding:0;display:grid;gap:10px}
.doc ul.relacionadas li{margin:0 !important;padding:14px 18px !important;line-height:1.5;font-size:.98rem}
.doc ul.relacionadas li a{font-weight:600;text-underline-offset:3px}
.doc h2{margin:36px 0 14px !important}
.doc ul.fuentes-lista{margin:0 0 18px;padding-left:1.2em;line-height:1.55;font-size:.96rem}
.doc ul.fuentes-lista li{margin:0 0 8px}
@media(max-width:600px){.doc h2{font-size:1.05rem;padding:10px 14px}.doc{font-size:1rem;line-height:1.65}}
.doc .cta-guia .btn--principal,.doc a.btn--principal{color:#fff !important;text-decoration:none !important;background:#7c1c2c !important}
.doc .cta-guia h2{background:none !important;border:0 !important;box-shadow:none !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important;padding:0 !important;margin:0 0 12px !important}
.velocidad .vel-ico{display:inline-flex;align-items:center;color:#14253d;padding:0 4px 0 2px}
/* v8: más vidrio de verdad */
.doc-hero::before{opacity:.9;filter:blur(18px) saturate(1.3)}
.doc-hero::after{background:linear-gradient(180deg,rgba(40,84,138,.55),rgba(40,84,138,.78))}
.doc-hero{padding-top:clamp(96px,12vw,150px)}
.doc-hero .volver-btn,.doc-hero .etiqueta{display:inline-flex !important;align-items:center;gap:6px;height:38px;padding:0 16px !important;margin:0 8px 0 0;font-size:.85rem !important;line-height:1;vertical-align:middle;background:rgba(255,255,255,.16) !important;border:1px solid rgba(255,255,255,.45) !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.respuesta{background:rgba(20,37,61,.55) !important;border:1px solid rgba(255,255,255,.45) !important;box-shadow:0 18px 40px -16px rgba(40,84,138,.45),inset 0 1px 0 rgba(255,255,255,.5) !important;-webkit-backdrop-filter:blur(26px) saturate(1.7);backdrop-filter:blur(26px) saturate(1.7)}
.parte-n400{background:rgba(255,255,255,.42) !important;-webkit-backdrop-filter:blur(24px) saturate(1.7);backdrop-filter:blur(24px) saturate(1.7);padding:18px 18px 14px !important}
.parte-n400 p{margin:0 0 10px}
.parte-n400 .entrevista,.parte-n400 .en-entrevista,.parte-n400 p.ent{background:rgba(255,255,255,.55) !important;border:1px solid rgba(255,255,255,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.doc-seccion::before{background:radial-gradient(60% 26% at 5% 8%,rgba(60,110,190,.30),transparent 70%),radial-gradient(50% 24% at 98% 30%,rgba(90,60,170,.20),transparent 70%),radial-gradient(60% 26% at 8% 62%,rgba(40,150,170,.24),transparent 70%),radial-gradient(50% 24% at 95% 88%,rgba(60,110,190,.28),transparent 70%)}
.respuesta{background:rgba(14,30,52,.72) !important}
.doc-hero .volver-btn,.doc-hero .etiqueta{margin-bottom:22px}
#parte-1{--img:url(../images/n400/parte-01.webp)}
#parte-2{--img:url(../images/n400/parte-02.webp)}
#parte-3{--img:url(../images/n400/parte-03.webp)}
#parte-4{--img:url(../images/n400/parte-04.webp)}
#parte-5{--img:url(../images/n400/parte-05.webp)}
#parte-6{--img:url(../images/n400/parte-06.webp)}
#parte-7{--img:url(../images/n400/parte-07.webp)}
#parte-8{--img:url(../images/n400/parte-08.webp)}
#parte-9{--img:url(../images/n400/parte-09.webp)}
#parte-10{--img:url(../images/n400/parte-10.webp)}
#parte-11{--img:url(../images/n400/parte-11.webp)}
#parte-12{--img:url(../images/n400/parte-12.webp)}
#parte-13{--img:url(../images/n400/parte-13.webp)}
#parte-14{--img:url(../images/n400/parte-14.webp)}
#parte-15{--img:url(../images/n400/parte-15.webp)}
#parte-16{--img:url(../images/n400/parte-16.webp)}
/* v9: las 16 partes como tarjetas con foto de fondo */
.partes{display:grid;grid-template-columns:1fr;gap:16px;margin:0 0 26px;width:100%}
@media(min-width:900px){.partes{grid-template-columns:1fr 1fr;width:min(1060px,calc(100vw - 48px));margin-left:calc(50% - min(530px,50vw - 24px))}}
.partes .parte-n400{position:relative;isolation:isolate;overflow:hidden;margin:0 !important;padding:150px 12px 12px !important;border:1px solid rgba(255,255,255,.7) !important;background:#0d2038 var(--img) center/cover no-repeat !important;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:22px !important;box-shadow:0 18px 40px -18px rgba(40,84,138,.5) !important}
.partes .parte-n400::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(40,84,138,0) 0,rgba(40,84,138,.1) 120px,rgba(40,84,138,.55) 100%)}
.partes .parte-n400 h3{position:absolute;left:12px;right:12px;top:92px;margin:0 !important;display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:16px;color:#fff !important;font:600 1.12rem/1.2 "Fraunces",Georgia,serif;background:rgba(40,84,138,.42);border:1px solid rgba(255,255,255,.4);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5)}
.partes .parte-n400 h3 .num{flex:none;background:rgba(255,255,255,.92) !important;color:#14253d !important;border-radius:999px;padding:3px 10px;font-size:.78rem}
.partes .parte-n400 p{margin:0 0 8px !important;padding:11px 14px;border-radius:14px;background:rgba(255,255,255,.66);border:1px solid rgba(255,255,255,.8);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6);font-size:.95rem;line-height:1.55}
.partes .parte-n400 p.tip{background:rgba(255,248,226,.72) !important;border:1px solid rgba(255,255,255,.85) !important;border-radius:14px !important;box-shadow:none !important}
.partes .parte-n400 p:last-child{margin-bottom:0 !important}
/* v10: una parte a la vez */
.partes.paso-a-paso{grid-template-columns:1fr !important;width:100% !important;margin-left:0 !important;max-width:640px;margin:0 auto 14px !important}
.partes.paso-a-paso .parte-n400[hidden]{display:none !important}
.partes.paso-a-paso .parte-n400{padding-top:190px !important}
.partes.paso-a-paso .parte-n400 h3{top:128px}
.pn-puntos{display:flex;justify-content:center;flex-wrap:wrap;gap:7px;margin:0 auto 12px;max-width:640px}
.pn-puntos button{width:10px;height:10px;padding:0;border-radius:50%;border:1px solid rgba(20,37,61,.5);background:rgba(255,255,255,.55);cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.pn-puntos button.on{background:#14253d;border-color:#14253d;transform:scale(1.25)}
.partes-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:640px;margin:0 auto 26px}
.partes-nav button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:128px;height:50px;padding:0 20px;border-radius:999px;font:700 .98rem "Instrument Sans",sans-serif;cursor:pointer;color:#fff;background:rgba(124,28,44,.9);border:1px solid rgba(255,255,255,.4);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);box-shadow:0 12px 26px -12px rgba(124,28,44,.9),inset 0 1px 0 rgba(255,255,255,.35)}
.partes-nav .pn-atras{color:#14253d;background:rgba(255,255,255,.6);box-shadow:0 8px 22px -12px rgba(40,84,138,.4),inset 0 1px 0 rgba(255,255,255,.9);border-color:rgba(255,255,255,.9)}
.partes-nav button:disabled{opacity:.4;cursor:default}
.pn-cuenta{font:600 .9rem "Instrument Sans",sans-serif;color:#33435c;text-align:center}
@media(max-width:480px){.partes-nav button{min-width:0;flex:1;padding:0 12px}.pn-cuenta{display:none}}
/* v11: fondo = formulario N-400 (opaco) para que se aprecie el vidrio; títulos de las partes sin solaparse */
.doc-seccion{background:#e2e9f3 !important}
.doc-seccion::before{background:url(../images/n400/fondo-formulario.webp) center top/min(1000px,100%) auto repeat-y !important;opacity:.9}
.partes .parte-n400,.partes.paso-a-paso .parte-n400{padding:0 12px 12px !important}
.partes .parte-n400 h3,.partes.paso-a-paso .parte-n400 h3{position:relative !important;left:auto;right:auto;top:auto !important;margin:150px 0 10px !important;flex-wrap:wrap}
.partes.paso-a-paso .parte-n400 h3{margin-top:190px !important}
.partes .parte-n400 h3,.partes .parte-n400 p{overflow-wrap:anywhere}
/* texto suelto sobre el formulario: vidrio detrás para que se lea */
.doc>p,.doc>ul.fuentes-lista,.doc>ol,.doc>ul:not(.relacionadas):not(.fuentes-lista){background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.85);border-radius:16px;padding:14px 18px !important;-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5)}
.doc>ul.fuentes-lista,.doc>ol,.doc>ul:not(.relacionadas){padding-left:2.2em !important}
.doc>figure figcaption,.hero-guia figcaption{display:inline-block;background:rgba(255,255,255,.7);padding:4px 10px;border-radius:10px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
/* v12: fondo = foto muy borrosa y colorida (como la portada), no el dibujo del formulario */
.doc-seccion{background:#d9e2ef !important}
.doc-seccion::before{background:url(../images/n400/fondo-borroso.webp) center top/100% auto repeat-y !important;opacity:1}
.doc-seccion::after{content:"";position:absolute;inset:0;z-index:-1;background:rgba(240,245,252,.32);pointer-events:none}
/* v13: el texto de las tarjetas no se mezcla con la foto: paneles más sólidos */
.partes .parte-n400 p{background:rgba(255,255,255,.9) !important;-webkit-backdrop-filter:blur(30px) saturate(1.4);backdrop-filter:blur(30px) saturate(1.4);color:#14253d}
.partes .parte-n400 p.tip{background:rgba(255,248,230,.93) !important}
.partes .parte-n400 h3{background:rgba(40,84,138,.66) !important;-webkit-backdrop-filter:blur(26px) saturate(1.4);backdrop-filter:blur(26px) saturate(1.4)}
.partes .parte-n400::before{background:linear-gradient(180deg,rgba(40,84,138,0) 0,rgba(40,84,138,.25) 150px,rgba(40,84,138,.6) 100%)}
/* v14: fondo de tono medio para que los paneles blancos de vidrio resalten */
.doc-seccion{background:#7f90ab !important}
.doc-seccion::after{background:rgba(20,37,61,.42) !important}
body{--cr-vidrio:rgba(255,255,255,.82);--cr-sombra:0 14px 34px -10px rgba(5,15,30,.55)}
.doc>p,.doc>ul.fuentes-lista,.doc>ol,.doc>ul:not(.relacionadas),.doc h2,.recorrido .paso,.tip,.cta-guia,.relacionadas li{background:rgba(255,255,255,.86) !important;border:1px solid rgba(255,255,255,.95) !important;box-shadow:0 14px 34px -12px rgba(5,15,30,.55),inset 0 1px 0 #fff !important}
.hero-guia figcaption,.doc>figure figcaption{background:rgba(255,255,255,.88);color:#14253d}
.pn-cuenta{color:#fff;text-shadow:0 1px 6px rgba(5,15,30,.6)}
.pn-puntos button{border-color:rgba(255,255,255,.8);background:rgba(255,255,255,.35)}
.pn-puntos button.on{background:#fff;border-color:#fff}
/* v15: botones solo con flecha, redondos y pequeños */
.partes-nav{justify-content:center;gap:18px}
.partes-nav button{min-width:0 !important;flex:none !important;width:46px;height:46px;padding:0 !important}
.partes-nav button span{display:none}
.partes-nav button svg{width:20px;height:20px}
.pn-cuenta{display:block !important;min-width:96px}
/* v16: el recorrido de la entrevista, un paso a la vez, igual que las partes del N-400 */
.recorrido.paso-a-paso{display:block !important;max-width:640px;margin:0 auto 14px !important}
.recorrido.paso-a-paso .paso[hidden]{display:none !important}
.recorrido.paso-a-paso .paso{position:relative;isolation:isolate;overflow:hidden;display:block !important;padding:0 12px 12px !important;border-radius:22px !important;border:1px solid rgba(255,255,255,.7) !important;background:#0d2038 var(--img) center 18%/cover no-repeat !important;box-shadow:0 18px 40px -18px rgba(40,84,138,.5) !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important}
.recorrido.paso-a-paso .paso::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(40,84,138,0) 0,rgba(40,84,138,.3) 200px,rgba(40,84,138,.65) 100%)}
.recorrido.paso-a-paso .paso figure{display:none !important}
.recorrido.paso-a-paso .paso>div{margin-top:230px}
.recorrido.paso-a-paso .paso h3{display:flex;align-items:center;gap:10px;margin:0 0 10px !important;padding:10px 14px;border-radius:16px;color:#fff !important;background:rgba(40,84,138,.66);border:1px solid rgba(255,255,255,.4);-webkit-backdrop-filter:blur(26px) saturate(1.4);backdrop-filter:blur(26px) saturate(1.4)}
.recorrido.paso-a-paso .paso p,.recorrido.paso-a-paso .paso .dialogo .linea{background:rgba(255,255,255,.9) !important;border:1px solid rgba(255,255,255,.85) !important;border-radius:14px !important;padding:11px 14px;margin:0 0 8px !important;-webkit-backdrop-filter:blur(30px) saturate(1.4);backdrop-filter:blur(30px) saturate(1.4);box-shadow:none !important}
.recorrido.paso-a-paso .paso p.tip{background:rgba(255,248,230,.93) !important}
.recorrido.paso-a-paso .paso .dialogo .linea.sol{background:rgba(222,234,250,.93) !important}
.recorrido.paso-a-paso .paso .dialogo{display:grid;gap:8px}
.recorrido.paso-a-paso .paso .dialogo .linea{margin:0 !important}
.doc>ol.recorrido.paso-a-paso{background:none !important;border:0 !important;box-shadow:none !important;padding:0 !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important;border-radius:0 !important}
.recorrido.paso-a-paso .paso{background-position:center top !important;background-size:100% auto !important}
.recorrido.paso-a-paso .paso>div{margin-top:260px}
.recorrido.paso-a-paso .paso[data-n="1"] h3::before{content:"1"}
.recorrido.paso-a-paso .paso[data-n="2"] h3::before{content:"2"}
.recorrido.paso-a-paso .paso[data-n="3"] h3::before{content:"3"}
.recorrido.paso-a-paso .paso[data-n="4"] h3::before{content:"4"}
.recorrido.paso-a-paso .paso[data-n="5"] h3::before{content:"5"}
.recorrido.paso-a-paso .paso[data-n="6"] h3::before{content:"6"}
.recorrido.paso-a-paso .paso[data-n="7"] h3::before{content:"7"}
.recorrido.paso-a-paso .paso[data-n="8"] h3::before{content:"8"}
.recorrido.paso-a-paso .paso[data-n="9"] h3::before{content:"9"}
/* v17: videos de las órdenes, uno por uno */
.videos-ordenes.paso-a-paso{display:block !important;max-width:640px;margin:0 auto 14px !important;padding:0 !important;list-style:none}
.videos-ordenes.paso-a-paso>li[hidden]{display:none !important}
.videos-ordenes.paso-a-paso>li{padding:12px !important;margin:0 !important}
.doc>ul.videos-ordenes.paso-a-paso{background:none !important;border:0 !important;box-shadow:none !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important;padding:0 !important}
.videos-ordenes .velocidad--mini{background:transparent !important;border:0 !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important;padding:8px 0 !important}
/* tablas: panel de vidrio casi sólido para que se lean sobre el fondo */
.doc table{border-collapse:separate !important;border-spacing:0;width:100%;overflow:hidden;background:rgba(255,255,255,.9) !important;border:1px solid rgba(255,255,255,.95) !important;border-radius:16px;box-shadow:0 14px 34px -12px rgba(5,15,30,.55);-webkit-backdrop-filter:blur(30px) saturate(1.4);backdrop-filter:blur(30px) saturate(1.4);color:#14253d}
.doc table th,.doc table td{background:transparent !important;color:#14253d !important;border-color:rgba(20,37,61,.12) !important}
.doc table thead th,.doc table tr:first-child th{background:rgba(20,37,61,.08) !important}
.doc table tbody th{background:rgba(20,37,61,.05) !important}
.doc table a{color:#7c1c2c !important}
