/* Página Tutoriales · familia visual del index */
.tu .hero{padding:80px 0 40px}
.tu .hero .lead{max-width:640px;margin-bottom:28px}
nav .nr .btn.r.on{background:var(--rd);color:#fff}
.tu .search{position:relative;display:block;max-width:520px;margin:0 auto}
.tu .search .si{position:absolute;left:18px;top:50%;transform:translateY(-50%);display:flex;color:var(--mu);pointer-events:none}
.tu .search svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tu .search input{width:100%;font:inherit;font-size:15px;padding:15px 20px 15px 48px;border:2px solid var(--bd);border-radius:99px;background:var(--surf);color:var(--tx);outline:none;box-shadow:0 14px 34px -20px rgba(79,70,229,.45);transition:.2s}
.tu .search input:focus{border-color:var(--ac);box-shadow:0 0 0 5px color-mix(in srgb,var(--ac) 14%,transparent),0 14px 34px -20px rgba(79,70,229,.55)}
.tu .grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.tu .card{display:flex;flex-direction:column;align-items:flex-start;color:inherit}
.tu .card .ic{width:44px;height:44px;font-size:14px;font-weight:800;letter-spacing:.02em;margin-bottom:16px}
.tu .card .cat{font-size:11.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--h);margin-bottom:6px}
.tu .card h3{font-size:17px;margin-bottom:18px}
.tu .card .go{margin-top:auto;font-size:13.5px;font-weight:700;color:var(--mu);transition:color .25s,transform .25s}
.tu .card:hover .go{color:var(--h);transform:translateX(4px)}
.empty{display:none;text-align:center;color:var(--mu);padding:40px 0}
.help{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap;padding:36px;border:2px solid var(--bd);border-radius:16px;background:var(--surf);transition:.25s}
.help:hover{border-color:var(--ac);box-shadow:0 0 0 5px color-mix(in srgb,var(--ac) 10%,transparent),0 20px 40px -24px color-mix(in srgb,var(--ac) 55%,transparent)}
.help h2{font-size:clamp(22px,3vw,30px);margin-bottom:8px}
.docs{display:flex;flex-wrap:wrap;gap:10px}
.docs .btn{padding:12px 18px;gap:8px;border:2px solid var(--bd)}
.docs .btn svg{width:18px;height:18px;flex:none;fill:none;stroke:var(--ac);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.docs .btn:not(.wa):hover{border-color:var(--ac);color:var(--ac)}
.docs .btn.wa svg{stroke:#fff}
@media(max-width:780px){.tu .hero{padding:56px 0 32px}.help{padding:26px 22px}}

/* Contraste: etiqueta de categoría */
.tu .card .cat{color:color-mix(in srgb,var(--h) 80%,#fff)}