/* Páginas de búsqueda (SEO fase 2): /estrategia-youtube/, /youtube-para-empresas/, /youtube-para-infoproductores/.
   Base: /kickstart-session/kickstart.css (fuentes, colores, cabecera, pie, píldora, vídeos, FAQ). Aquí solo lo editorial. */

.ld-hero { padding: 32px 0 56px; max-width: 900px; }
.ld-miga { font-size: 13px; letter-spacing: .04em; text-transform: uppercase; color: var(--suave); margin-bottom: 28px; }
.ld-miga a:hover { color: var(--azul); }
.ld-miga span[aria-hidden] { margin: 0 8px; }
.ld-hero h1 { font-size: clamp(38px, 5.2vw, 68px); margin-bottom: 24px; }
.ld-hero .lead { max-width: 56ch; margin-bottom: 32px; }
.ld-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
.mano { font-family: "Nanum Pen Script", cursive; font-weight: 400; font-size: 24px; line-height: 1.1; color: var(--azul); text-transform: none; letter-spacing: 0; }

/* artículo */
.ld-art { max-width: 720px; padding: 72px 0 0; }
.ld-art h2 { font-size: clamp(24px, 2.6vw, 34px); margin: 56px 0 18px; }
.ld-art h2:first-child { margin-top: 0; }
.ld-art h3 { font-size: 17px; margin: 28px 0 8px; }
.ld-art p { margin-bottom: 16px; }
.ld-art p, .ld-art li { color: rgba(26, 26, 26, .78); }
.ld-art strong { font-weight: 500; color: var(--tinta); }
.ld-art a:not(.pill) { color: var(--azul); text-decoration: underline; text-underline-offset: 3px; }
.ld-art ul, .ld-art ol { margin: 0 0 18px 1.2em; display: grid; gap: 8px; }

/* frase destacada, sin caja */
.ld-dest { font-size: clamp(22px, 2.4vw, 30px); line-height: 1.2; letter-spacing: -0.01em; color: var(--tinta); border-left: 3px solid var(--azul); padding-left: 20px; margin: 36px 0; text-transform: uppercase; }

/* servicios como lista editorial (filas, no tarjetas) */
.ld-serv { list-style: none; margin: 8px 0 0 !important; display: block !important; border-top: 1px solid var(--linea); }
.ld-serv li { display: grid; grid-template-columns: 1fr auto; gap: 6px 24px; padding: 22px 0; border-bottom: 1px solid var(--linea); }
.ld-serv h3 { margin: 0; font-size: 18px; }
.ld-serv h3 a { color: var(--tinta) !important; text-decoration: none !important; }
.ld-serv h3 a:hover { color: var(--azul) !important; }
.ld-serv .precio { font-size: 15px; color: var(--azul); white-space: nowrap; align-self: start; }
.ld-serv p { grid-column: 1 / -1; margin: 0; font-size: 16px; }

/* casos */
.ld-casos { padding-top: 88px; }
.ld-casos h2 { font-size: clamp(24px, 2.6vw, 34px); margin-bottom: 28px; }

/* faq */
.ld-faq { padding-top: 88px; }
.ld-faq h2 { font-size: clamp(24px, 2.6vw, 34px); margin-bottom: 20px; }

/* cierre */
.ld-fin { background: var(--azul); color: #fff; margin-top: 96px; padding: 80px 0; }
.ld-fin-in { max-width: 760px; }
.ld-fin h2 { color: #fff; margin-bottom: 18px; }
.ld-fin p { color: rgba(255, 255, 255, .85); margin-bottom: 28px; max-width: 54ch; }
.ld-fin .mano { color: #fff; }
.ld-fin .otras { font-size: 15px; margin: 28px 0 0; }
.ld-fin .otras a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

.foot-legal a:hover { color: var(--azul); }

@media (max-width: 639.98px) {
  .ld-hero { padding: 16px 0 40px; }
  .ld-hero h1 { font-size: clamp(28px, 9vw, 40px); hyphens: auto; overflow-wrap: break-word; }
  .ld-miga { margin-bottom: 20px; }
  .ld-art { padding-top: 48px; }
  .ld-art h2 { margin-top: 44px; }
  .ld-serv li { grid-template-columns: 1fr; }
  .ld-casos, .ld-faq { padding-top: 64px; }
  .ld-fin { margin-top: 64px; padding: 56px 0; }
  .mano { font-size: 22px; }
}