/* Manual de VDUF.com — hoja de estilos propia (sin dependencias). Claro y oscuro con variables. */
:root{
  --bg:#F6F8F6; --surf:#FFFFFF; --surf2:#EEF3EF; --ink:#13201A; --ink2:#3A4A42; --mute:#66756D; --line:#DCE5DF; --line2:#E9EFEB;
  --acc:#0B6B3A; --acc-2:#13A05B; --acc-soft:#E3F2E9; --acc-ink:#FFFFFF; --oro:#B7791F; --oro-soft:#FBF1DE;
  --azul:#2563EB; --azul-soft:#E6EEFE; --vio:#7C3AED; --vio-soft:#F0E9FE; --rojo:#B5452B;
  --mk:#E8590C; --mk-soft:rgba(232,89,12,.14);
  --sh:0 1px 2px rgba(16,32,24,.06),0 8px 24px -12px rgba(16,32,24,.18); --sh2:0 24px 60px -20px rgba(16,32,24,.35);
  --r:16px; --r-sm:10px; --top:64px;
  --f:'Public Sans',system-ui,-apple-system,'Segoe UI',sans-serif; --fd:'Plus Jakarta Sans','Public Sans',system-ui,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0D1512; --surf:#131D19; --surf2:#1A2621; --ink:#E7EFEA; --ink2:#C3D0C8; --mute:#8FA097; --line:#26342D; --line2:#1F2B26;
  --acc:#4CC38A; --acc-2:#7BE0AE; --acc-soft:#173326; --acc-ink:#06130C; --oro:#E7B252; --oro-soft:#2C2414;
  --azul:#7AA2FF; --azul-soft:#18223A; --vio:#B794F6; --vio-soft:#251C38; --rojo:#F08A6C; --mk:#FF8A3D; --mk-soft:rgba(255,138,61,.16);
  --sh:0 1px 2px rgba(0,0,0,.3),0 8px 24px -12px rgba(0,0,0,.6); --sh2:0 24px 60px -20px rgba(0,0,0,.8); color-scheme:dark;
}}
:root[data-theme="dark"]{
  --bg:#0D1512; --surf:#131D19; --surf2:#1A2621; --ink:#E7EFEA; --ink2:#C3D0C8; --mute:#8FA097; --line:#26342D; --line2:#1F2B26;
  --acc:#4CC38A; --acc-2:#7BE0AE; --acc-soft:#173326; --acc-ink:#06130C; --oro:#E7B252; --oro-soft:#2C2414;
  --azul:#7AA2FF; --azul-soft:#18223A; --vio:#B794F6; --vio-soft:#251C38; --rojo:#F08A6C; --mk:#FF8A3D; --mk-soft:rgba(255,138,61,.16);
  --sh:0 1px 2px rgba(0,0,0,.3),0 8px 24px -12px rgba(0,0,0,.6); --sh2:0 24px 60px -20px rgba(0,0,0,.8); color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--top) + 16px);-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
html,body{overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16.5px/1.7 var(--f);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--acc);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
img{max-width:100%;height:auto;display:block}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
code{font:500 .88em/1.4 ui-monospace,'SF Mono',Menlo,Consolas,monospace;background:var(--surf2);border:1px solid var(--line);padding:.1em .4em;border-radius:6px;white-space:nowrap}
kbd{display:inline-block;min-width:1.7em;text-align:center;font:600 .78em/1.6 ui-monospace,Menlo,monospace;padding:0 .45em;border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;background:var(--surf);color:var(--ink2)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--acc);color:var(--acc-ink);padding:8px 14px;border-radius:8px}
.skip:focus{top:10px}
:focus-visible{outline:3px solid var(--azul);outline-offset:2px;border-radius:6px}

/* ---------- barra superior ---------- */
.progreso{position:fixed;inset:0 0 auto;height:3px;z-index:60;pointer-events:none}
.progreso i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--acc),var(--acc-2),var(--oro))}
.top{position:sticky;top:0;z-index:50;height:var(--top);display:flex;align-items:center;gap:12px;padding:0 20px;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--line)}
.marca{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font:600 16px var(--fd);white-space:nowrap}
.marca b{font-weight:800;letter-spacing:.02em}
.marca span{display:flex;gap:6px}
.ib{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:12px;background:var(--surf);color:var(--ink2);cursor:pointer;flex:none}
.ib:hover{color:var(--acc);border-color:var(--acc)}
.menu{display:none}
#temaBtn .luna{display:none}
:root[data-theme="dark"] #temaBtn .sol{display:none}:root[data-theme="dark"] #temaBtn .luna{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) #temaBtn .sol{display:none}:root:not([data-theme="light"]) #temaBtn .luna{display:block}}
.btn{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 18px;border-radius:12px;border:1px solid var(--line);background:var(--surf);color:var(--ink);font:600 14.5px var(--f);text-decoration:none;white-space:nowrap;box-shadow:var(--sh);transition:transform .15s,box-shadow .15s,border-color .15s}
.btn:hover{transform:translateY(-1px);border-color:var(--acc)}
.btn.pri{background:var(--acc);border-color:var(--acc);color:var(--acc-ink)}
.btn svg{width:16px;height:16px}
.abrir{margin-left:4px;height:40px}

/* buscador */
.buscador{position:relative;flex:1;max-width:560px;margin-left:auto}
.buscador>svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--mute)}
.buscador input{width:100%;height:42px;padding:0 44px 0 40px;border:1px solid var(--line);border-radius:12px;background:var(--surf);color:var(--ink);font:400 15px var(--f);box-shadow:var(--sh)}
.buscador input:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 4px color-mix(in srgb,var(--acc) 18%,transparent)}
.kb-busca{position:absolute;right:10px;top:50%;transform:translateY(-50%)}
.buscador input:focus~.kb-busca{display:none}
.res{position:absolute;left:0;right:0;top:calc(100% + 8px);list-style:none;margin:0;padding:6px;max-height:min(70vh,520px);overflow:auto;background:var(--surf);border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh2)}
.res li{border-radius:10px}
.res a{display:grid;gap:2px;padding:9px 12px;color:var(--ink);text-decoration:none}
.res li[aria-selected="true"] a,.res a:hover{background:var(--acc-soft)}
.res small{color:var(--mute);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.res b{font:600 15px var(--fd)}
.res span{color:var(--ink2);font-size:13.5px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.res mark{background:color-mix(in srgb,var(--oro) 35%,transparent);color:inherit;border-radius:3px;padding:0 1px}
.res .vacio{padding:14px;color:var(--mute);font-size:14px}

/* ---------- maqueta ---------- */
.layout{display:grid;grid-template-columns:276px minmax(0,1fr) 220px;gap:40px;max-width:1440px;margin:0 auto;padding:0 28px}
.toc{position:sticky;top:var(--top);height:calc(100vh - var(--top));overflow:auto;padding:24px 4px 40px 0;scrollbar-width:thin;overscroll-behavior:contain}
.toc-ini{display:block;padding:7px 10px;margin-bottom:10px;border-radius:9px;color:var(--ink);font:600 14px var(--fd);text-decoration:none}
.toc-g{margin:0 0 16px}
.toc-p{margin:0 0 4px;padding:0 10px;font:700 11.5px var(--f);text-transform:uppercase;letter-spacing:.07em;color:var(--mute)}
.toc ol{list-style:none;margin:0;padding:0}
.toc li a{display:flex;gap:10px;align-items:baseline;padding:6px 10px;border-radius:9px;color:var(--ink2);font-size:14.2px;line-height:1.35;text-decoration:none;border-left:2px solid transparent}
.toc li a span{font:600 11px ui-monospace,Menlo,monospace;color:var(--mute);min-width:18px}
.toc a:hover{background:var(--surf2);color:var(--ink)}
.toc a.on{background:var(--acc-soft);color:var(--acc);font-weight:600}
.toc a.on span{color:var(--acc)}
main{min-width:0;padding:8px 0 80px;outline:none}
.rail{position:sticky;top:var(--top);height:calc(100vh - var(--top));overflow:auto;padding:28px 0;font-size:13.5px}
.rail-t{margin:0 0 8px;font:700 11.5px var(--f);text-transform:uppercase;letter-spacing:.07em;color:var(--mute)}
.rail ul{list-style:none;margin:0 0 16px;padding:0;border-left:1px solid var(--line)}
.rail li a{display:block;padding:4px 0 4px 12px;margin-left:-1px;border-left:2px solid transparent;color:var(--mute);text-decoration:none;line-height:1.4}
.rail li a:hover{color:var(--ink)}
.rail li a.on{color:var(--acc);border-left-color:var(--acc);font-weight:600}
.arriba{color:var(--mute);text-decoration:none;font-weight:600}

/* ---------- portada ---------- */
.hero{position:relative;padding:56px 0 24px;isolation:isolate}
.hero::before{content:'';position:absolute;inset:-40px 0 auto;height:420px;z-index:-1;background:radial-gradient(600px 260px at 15% 20%,color-mix(in srgb,var(--acc) 22%,transparent),transparent 70%),radial-gradient(500px 240px at 85% 10%,color-mix(in srgb,var(--oro) 20%,transparent),transparent 70%);filter:blur(10px);opacity:.9;pointer-events:none}
.eyebrow{display:inline-flex;gap:8px;align-items:center;margin:0 0 14px;padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:var(--surf);font:700 12px var(--f);text-transform:uppercase;letter-spacing:.08em;color:var(--acc)}
.hero h1{margin:0 0 16px;font:800 clamp(34px,5vw,56px)/1.06 var(--fd);letter-spacing:-.025em;max-width:16ch}
.grad{background:linear-gradient(100deg,var(--acc),var(--acc-2) 55%,var(--oro));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:18.5px;line-height:1.6;color:var(--ink2);max-width:68ch}
.hero-acc{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 28px}
.hero-datos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;list-style:none;margin:0 0 44px;padding:0}
.hero-datos li{padding:16px 18px;border:1px solid var(--line);border-radius:var(--r);background:var(--surf);box-shadow:var(--sh)}
.hero-datos b{display:block;font:800 30px/1.1 var(--fd);letter-spacing:-.02em;color:var(--acc)}
.hero-datos span{font-size:13.5px;color:var(--mute)}
.h-rutas{font:700 22px/1.3 var(--fd);margin:0 0 14px;letter-spacing:-.01em}
.rutas{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.ruta{position:relative;display:grid;gap:6px;align-content:start;padding:18px 18px 16px;border:1px solid var(--line);border-radius:var(--r);background:var(--surf);color:var(--ink);text-decoration:none;box-shadow:var(--sh);transition:transform .18s,box-shadow .18s,border-color .18s}
.ruta:hover{transform:translateY(-3px);box-shadow:var(--sh2);border-color:color-mix(in srgb,var(--acc) 50%,var(--line))}
.ri{font-size:26px;line-height:1}
.ruta b{font:700 16.5px/1.3 var(--fd)}
.ruta span:not(.ri){font-size:14px;line-height:1.5;color:var(--ink2)}
.ruta em{font-style:normal;font:600 12px var(--f);color:var(--acc);margin-top:4px}

/* ---------- apartados ---------- */
.cap{padding:56px 0 8px;border-top:1px solid var(--line);margin-top:24px}
.cap h2{display:flex;align-items:baseline;gap:14px;margin:0 0 14px;font:800 clamp(26px,3.2vw,34px)/1.15 var(--fd);letter-spacing:-.02em}
.cap h2 .num{font:700 14px ui-monospace,Menlo,monospace;color:var(--acc);background:var(--acc-soft);padding:4px 8px;border-radius:8px;transform:translateY(-6px)}
.cap h3{margin:36px 0 10px;font:700 21px/1.3 var(--fd);letter-spacing:-.01em}
.cap h4{margin:0 0 6px;font:700 16px var(--fd)}
.ancla{margin-left:8px;color:var(--mute);text-decoration:none;opacity:0;font-weight:500;transition:opacity .15s}
h2:hover .ancla,h3:hover .ancla,.ancla:focus{opacity:1}
.cap p,.cap li{max-width:72ch}
.cap ul,.cap ol{padding-left:22px}
.cap li{margin:4px 0}
.cap li::marker{color:var(--acc)}
.acc{margin:18px 0 0}
.rejilla3{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:20px 0}
.tarjeta{padding:16px 18px;border:1px solid var(--line);border-radius:var(--r);background:var(--surf);box-shadow:var(--sh)}
.tarjeta p{margin:0;font-size:15px;color:var(--ink2)}

/* avisos */
.nota{position:relative;margin:20px 0;padding:14px 18px 14px 50px;border-radius:14px;background:var(--surf2);border:1px solid var(--line);font-size:15.5px;line-height:1.6;max-width:76ch}
.nota::before{content:'ℹ';position:absolute;left:16px;top:13px;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:var(--ink2);color:var(--surf);font:700 13px var(--f)}
.nota.consejo{background:var(--acc-soft);border-color:color-mix(in srgb,var(--acc) 30%,transparent)}.nota.consejo::before{content:'✓';background:var(--acc);color:var(--acc-ink)}
.nota.aviso{background:var(--oro-soft);border-color:color-mix(in srgb,var(--oro) 35%,transparent)}.nota.aviso::before{content:'!';background:var(--oro);color:#fff}
.nota.ia{background:var(--vio-soft);border-color:color-mix(in srgb,var(--vio) 30%,transparent)}.nota.ia::before{content:'✦';background:var(--vio);color:#fff}
.nota.atajo{background:var(--azul-soft);border-color:color-mix(in srgb,var(--azul) 30%,transparent)}.nota.atajo::before{content:'⌘';background:var(--azul);color:#fff}
.mk-i{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--mk);color:#fff;font:700 11.5px var(--f);vertical-align:2px}
.probar-i{font-weight:600;color:var(--acc)}
.probar{display:inline-flex;align-items:center;gap:8px;padding:9px 16px 9px 12px;border-radius:999px;background:var(--acc-soft);color:var(--acc);font:600 14.5px var(--f);text-decoration:none;border:1px solid color-mix(in srgb,var(--acc) 30%,transparent);transition:background .15s,transform .15s}
.probar::before{content:'';width:18px;height:18px;border-radius:50%;background:var(--acc) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6v12l9-6z' fill='white'/%3E%3C/svg%3E") center/12px no-repeat}
.probar:hover{background:color-mix(in srgb,var(--acc) 20%,var(--surf));transform:translateX(2px)}

/* pasos */
.pasos{list-style:none;counter-reset:p;padding:0!important;margin:16px 0;display:grid;gap:10px}
.pasos li{counter-increment:p;position:relative;padding:2px 0 2px 44px;min-height:30px}
.pasos li::before{content:counter(p);position:absolute;left:0;top:0;width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:var(--surf);border:2px solid var(--acc);color:var(--acc);font:700 14px var(--fd)}
.pasos li:not(:last-child)::after{content:'';position:absolute;left:14px;top:32px;bottom:-12px;width:2px;background:var(--line)}

/* tablas */
.tabla-env{overflow-x:auto;margin:18px 0;border:1px solid var(--line);border-radius:14px;background:var(--surf);box-shadow:var(--sh)}
table{width:100%;border-collapse:collapse;font-size:15px}
th,td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line2);vertical-align:top}
thead th{background:var(--surf2);font:700 12.5px var(--f);text-transform:uppercase;letter-spacing:.05em;color:var(--mute);white-space:nowrap}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover td{background:color-mix(in srgb,var(--acc-soft) 45%,transparent)}

/* ---------- figuras con capturas señaladas ---------- */
.fig{margin:28px 0 32px;padding:18px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(180deg,var(--surf),var(--surf2));box-shadow:var(--sh)}
.fig figcaption{margin-top:12px;font-size:13.5px;color:var(--mute);text-align:center}
.fig figcaption span{font-weight:700;color:var(--ink2)}
.fig-tabs{display:inline-flex;gap:4px;padding:4px;margin:0 0 14px;border-radius:12px;background:var(--surf2);border:1px solid var(--line)}
.fig-tabs button{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 14px;border:0;border-radius:9px;background:transparent;color:var(--ink2);font:600 13.5px var(--f);cursor:pointer}
.fig-tabs button svg{width:16px;height:16px}
.fig-tabs button[aria-selected="true"]{background:var(--surf);color:var(--acc);box-shadow:var(--sh)}
.marco{position:relative;border-radius:12px;overflow:visible;background:var(--surf)}
.marco-pc{border:1px solid var(--line);box-shadow:0 18px 40px -24px rgba(0,0,0,.45)}
.barra-nav{display:flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-bottom:1px solid var(--line);background:var(--surf2);border-radius:12px 12px 0 0}
.barra-nav i{width:10px;height:10px;border-radius:50%;background:#FF5F57}.barra-nav i:nth-child(2){background:#FEBC2E}.barra-nav i:nth-child(3){background:#28C840}
.barra-nav span{margin:0 auto;padding:2px 40px;border-radius:7px;background:var(--surf);border:1px solid var(--line);font:500 11.5px var(--f);color:var(--mute)}
.marco-movil{width:min(100%,340px);margin:0 auto;padding:12px 10px;border-radius:38px;background:#111;box-shadow:0 0 0 2px #2a2a2a inset,0 22px 50px -20px rgba(0,0,0,.55)}
.marco-movil::before{content:'';position:absolute;left:50%;top:18px;transform:translateX(-50%);width:90px;height:22px;border-radius:12px;background:#111;z-index:3}
.marco-movil .shot-img{border-radius:28px;overflow:hidden}
.shot-img{position:relative;line-height:0}
.marco-pc .shot-img{border-radius:0 0 12px 12px}
.marco-pc .shot-img img{border-radius:0 0 11px 11px}
.zoom-btn{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.mk{position:absolute;border:2px solid var(--mk);border-radius:8px;background:var(--mk-soft);box-shadow:0 0 0 3px color-mix(in srgb,var(--mk) 18%,transparent);pointer-events:none;transition:background .2s,box-shadow .2s,opacity .2s}
.mk b{position:absolute;left:-11px;top:-11px;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--mk);color:#fff;font:800 12.5px/1 var(--f);box-shadow:0 2px 6px rgba(0,0,0,.3),0 0 0 2px #fff}
.shot-img.foco .mk{opacity:.25}
.shot-img.foco .mk.on{opacity:1;background:color-mix(in srgb,var(--mk) 22%,transparent);box-shadow:0 0 0 4px color-mix(in srgb,var(--mk) 35%,transparent),0 0 0 9999px rgba(0,0,0,.18)}
.shot[hidden]{display:none!important}
.marco-pc{margin:0 auto}
.shot-estrecha{display:grid;grid-template-columns:minmax(0,auto) minmax(240px,1fr);gap:24px;align-items:start}
.shot-estrecha .marco-pc{width:100%;margin:0}
.shot-estrecha .ley{margin-top:0!important}
@media (max-width:1100px){.shot-estrecha{grid-template-columns:1fr}.shot-estrecha .marco-pc{margin:0 auto}.shot-estrecha .ley{margin-top:16px!important}}
.shot-movil{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:start}
.shot-movil .marco-movil{width:300px}
@media (max-width:760px){.shot-movil{grid-template-columns:1fr}.shot-movil .marco-movil{width:min(100%,300px)}}
.ley{list-style:none;margin:16px 0 0!important;padding:0!important;display:grid;gap:6px;counter-reset:none}
.ley li{display:flex;gap:12px;align-items:flex-start;max-width:none!important;margin:0!important;padding:8px 10px;border-radius:10px;font-size:15px;line-height:1.55;cursor:default;transition:background .15s}
.ley li:hover,.ley li.on{background:var(--mk-soft)}
.ley .n{flex:none;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--mk);color:#fff;font:800 12.5px/1 var(--f);margin-top:1px}

/* recetas, preguntas y glosario */
.recetas,.faq{display:grid;gap:10px;margin-top:16px}
details.receta,.faq details{border:1px solid var(--line);border-radius:14px;background:var(--surf);box-shadow:var(--sh)}
details summary{list-style:none;cursor:pointer;padding:14px 48px 14px 18px;position:relative;font:600 16px/1.4 var(--fd)}
details summary::-webkit-details-marker{display:none}
details summary::after{content:'';position:absolute;right:18px;top:50%;width:9px;height:9px;border-right:2px solid var(--mute);border-bottom:2px solid var(--mute);transform:translateY(-70%) rotate(45deg);transition:transform .2s}
details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
details>*:not(summary){margin-left:18px;margin-right:18px}
details>.probar{margin-bottom:16px}
.faq details p{margin-top:0;color:var(--ink2)}
.glo-ir{display:flex;flex-wrap:wrap;gap:6px}
.glo-ir a{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:9px;background:var(--surf);font:700 14px var(--fd);text-decoration:none}
.glo-ir a:hover{background:var(--acc-soft)}
.glosario{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:0;margin:18px 0;border:1px solid var(--line);border-radius:14px;background:var(--surf);overflow:hidden}
.glosario dt,.glosario dd{margin:0;padding:11px 16px;border-bottom:1px solid var(--line2)}
.glosario dt{font:700 15px var(--fd);background:var(--surf2)}
.glosario dd{color:var(--ink2);font-size:15px}
@media (max-width:600px){.glosario{grid-template-columns:1fr}.glosario dt{border-bottom:0;padding-bottom:2px}}

.pie{margin-top:64px;padding:24px 0;border-top:1px solid var(--line);font-size:14px;color:var(--mute)}
.pie p{max-width:none}

/* ampliación */
#zoom{width:min(96vw,1700px);max-width:none;max-height:94vh;padding:0;border:0;border-radius:16px;background:var(--surf);box-shadow:var(--sh2);overflow:auto}
#zoom::backdrop{background:rgba(5,12,9,.72);backdrop-filter:blur(3px)}
#zoom .cerrar{position:sticky;top:10px;margin:10px 10px -50px auto;z-index:5;display:grid}
#zoomBody{padding:14px}
#zoomBody .shot-img{max-width:100%;margin:0 auto}
#zoomBody.movil .shot-img{width:min(100%,520px)}
.aviso-copia{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:80;padding:10px 18px;border-radius:999px;background:var(--ink);color:var(--bg);font:600 14px var(--f);box-shadow:var(--sh2)}

/* ---------- pantallas medianas y móviles ---------- */
@media (max-width:1240px){.layout{grid-template-columns:260px minmax(0,1fr);gap:32px}.rail{display:none}}
@media (max-width:960px){
  .layout{grid-template-columns:minmax(0,1fr);padding:0 18px}
  .menu{display:grid}
  .toc{position:fixed;left:0;top:0;bottom:0;z-index:70;width:min(86vw,320px);height:auto;padding:20px 14px 40px;background:var(--surf);border-right:1px solid var(--line);box-shadow:var(--sh2);transform:translateX(-105%);transition:transform .25s ease}
  .toc.abierto{transform:none}
  .capa{position:fixed;inset:0;z-index:65;background:rgba(0,0,0,.35)}
  .abrir{display:none}
  .marca span{display:none}
}
@media (max-width:640px){
  :root{--top:60px}
  body{font-size:16px}
  .top{padding:0 12px;gap:8px}
  .buscador input{font-size:16px;padding-right:12px}
  .kb-busca{display:none}
  .hero{padding-top:32px}
  .hero-datos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lead{font-size:17px}
  .cap{padding-top:40px}
  .fig{padding:10px;margin-left:-6px;margin-right:-6px;border-radius:16px}
  .barra-nav span{padding:2px 16px}
  .mk b{width:20px;height:20px;left:-9px;top:-9px;font-size:11px}
  th,td{padding:9px 10px}
}

/* ---------- impresión ---------- */
@media print{
  .top,.toc,.rail,.progreso,.fig-tabs,.hero-acc,.probar,.ancla,#zoom,.capa{display:none!important}
  .layout{display:block;padding:0}
  body{background:#fff;color:#000;font-size:11pt}
  .shot[hidden]{display:block!important}
  .fig,.tarjeta,.nota,.tabla-env,details{box-shadow:none;break-inside:avoid}
  details>*{display:block}
  .cap{break-before:page;border:0}
  a{color:#000}
}
.destello>h2,.destello>h3,h3.destello{animation:destello 1.6s ease}
@keyframes destello{0%,40%{background:color-mix(in srgb,var(--oro) 30%,transparent);border-radius:8px}100%{background:transparent}}

/* ---------- volver a la web: botón de la cabecera (escritorio) y aspa flotante (móvil) ---------- */
.cerrar-flot{display:none;position:fixed;top:calc(var(--top) + 10px);right:12px;z-index:55;width:44px;height:44px;place-items:center;padding:0;border-radius:50%;border:1px solid color-mix(in srgb,var(--ink) 14%,transparent);background:color-mix(in srgb,var(--surf) 62%,transparent);color:var(--ink);backdrop-filter:blur(10px) saturate(1.4);-webkit-backdrop-filter:blur(10px) saturate(1.4);box-shadow:0 6px 18px -8px rgba(0,0,0,.35);cursor:pointer;transition:transform .15s,background .15s}
.cerrar-flot:active{transform:scale(.94)}
.cerrar-flot svg{width:20px;height:20px;stroke-width:2.4}
@media (max-width:960px){.cerrar-flot{display:grid}}
#salir{width:min(92vw,400px);padding:22px 22px 18px;border:1px solid var(--line);border-radius:20px;background:var(--surf);color:var(--ink);box-shadow:var(--sh2)}
#salir::backdrop{background:rgba(5,12,9,.55);backdrop-filter:blur(2px)}
#salir h2{margin:0 0 6px;font:800 20px/1.25 var(--fd)}
#salir p{margin:0 0 18px;color:var(--ink2);font-size:15.5px;line-height:1.5}
.salir-acc{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.salir-acc .btn{flex:1 1 auto;justify-content:center;box-shadow:none}
@media print{.cerrar-flot{display:none!important}}
.abrir.volver svg{transform:rotate(-90deg)}

/* icono dentro del texto */
.ico-in{width:1.15em;height:1.15em;vertical-align:-.2em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;padding:1px;border:1px solid var(--line,#ccc);border-radius:4px}
