/* Landing pública de formación para empresas (/claude-para-empresas). Perfil landing de mif-ui: una idea, una
   prueba, una acción. Un solo acento naranja (el subrayado del titular); el resto, tokens del campus. */
.page:has(.ld) { padding-bottom: 0; }
.ld { font-size: 1.0625rem; line-height: 1.6; }
.ld h2 { margin: 0 0 .75rem; }
.ld p { max-width: 68ch; }
.ld-seccion { padding: 4rem 0; }
.ld-banda { background: var(--surface-2); padding: 4rem 0; }
.ld-lead { color: var(--ink-2); margin-bottom: 1.5rem; }
.ld-nota { color: var(--ink-2); margin-top: 1rem; }
.ld-dos { display: grid; gap: 2rem; grid-template-columns: 1fr; }
@media (min-width: 900px) { .ld-dos { grid-template-columns: 5fr 6fr; gap: 3.5rem; align-items: start; } }

/* Hero */
.ld-hero { padding: 2.5rem 0 4rem; }
.ld-sello { display: inline-block; font-size: .875rem; font-weight: 600; color: var(--ink-2); border: 1px solid var(--line-2); border-radius: 999px; padding: .25rem .8rem; margin-bottom: 1.25rem; }
.ld-hero h1 { font-size: clamp(2rem, 5.2vw, 3.25rem); line-height: 1.12; letter-spacing: -.01em; font-weight: 700; max-width: 22ch; margin: 0 0 1.25rem; }
.ld-marca { display: inline; background-image: linear-gradient(var(--color-accent), var(--color-accent)); background-size: 100% .14em; background-position: 0 92%; background-repeat: no-repeat; }
.ld-bajada { font-size: 1.1875rem; color: var(--ink-2); margin-bottom: 1.75rem; }
.ld-cta { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; }
.ld-btn { padding: .85rem 1.4rem; font-size: 1rem; min-height: 48px; }
.ld-wa { font-weight: 600; }

/* Problema */
.ld-causas { margin: 0; display: grid; gap: 1rem; }
.ld-causas div { border-left: 3px solid var(--primary); padding: .15rem 0 .15rem 1rem; }
.ld-causas dt { font-weight: 700; }
.ld-causas dd { margin: .15rem 0 0; color: var(--ink-2); }

/* Pedido antes y después */
.ld-pedido { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 760px) { .ld-pedido { grid-template-columns: 2fr 3fr; } }
.ld-caso { margin: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-md); padding: 1.25rem; display: flex; flex-direction: column; gap: .9rem; }
.ld-caso-bien { border-color: var(--primary); }
.ld-caso figcaption { font-size: .875rem; font-weight: 700; color: var(--ink-2); }
.ld-caso blockquote { margin: 0; font-size: 1rem; flex: 1; }
.ld-partes { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.ld-partes li { font-size: .8125rem; font-weight: 600; padding: .2rem .6rem; border-radius: var(--radius-sm); }
.ld-partes .no { color: var(--ink-2); background: var(--surface-2); text-decoration: line-through; }
.ld-partes .si { color: var(--primary); background: var(--primary-soft); }
.ld-partes .si::before { content: "✓ "; }

/* Productos */
.ld-productos { display: grid; gap: 1.25rem; grid-template-columns: 1fr; }
@media (min-width: 860px) { .ld-productos { grid-template-columns: 1fr 1fr; } }
.ld-producto { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 1.5rem; display: flex; flex-direction: column; }
.ld-producto h3 { font-size: 1.3rem; margin: 0 0 .5rem; }
.ld-producto ul { margin: .25rem 0 1.5rem; padding-left: 1.2rem; flex: 1; }
.ld-producto li + li { margin-top: .35rem; }
.ld-dato { font-size: .875rem; font-weight: 600; color: var(--ink-2); margin-bottom: .5rem; font-variant-numeric: lining-nums; }
.ld-btn-sec { align-self: flex-start; border-color: var(--primary); color: var(--primary); min-height: 44px; white-space: normal; text-align: left; }

/* Tres números */
.ld-numeros { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: 1fr; counter-reset: n; }
@media (min-width: 760px) { .ld-numeros { grid-template-columns: repeat(3, 1fr); } }
.ld-numeros li { counter-increment: n; border-top: 2px solid var(--ink); padding-top: .75rem; display: grid; gap: .3rem; }
.ld-numeros li::before { content: counter(n); font-size: .875rem; font-weight: 700; color: var(--ink-2); }
.ld-numeros strong { font-size: 1.15rem; }
.ld-numeros span { color: var(--ink-2); }

/* Formulario */
.ld-form-banda:focus { outline: none; }
.ld-form { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 1.5rem; display: grid; gap: 1rem; }
.ld-form > p { margin: 0; }
.ld-campos { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 560px) { .ld-campos { grid-template-columns: 1fr 1fr; } }
.ld-form input:not([type="radio"]), .ld-form select, .ld-form textarea { width: 100%; font: inherit; font-size: 1rem; padding: .6rem .75rem; border-radius: var(--radius-sm); border: 1px solid var(--line-2); background: var(--surface); color: var(--ink); min-height: 44px; }
.ld-form textarea { resize: vertical; }
.ld-form input:focus-visible, .ld-form select:focus-visible, .ld-form textarea:focus-visible { outline: none; border-color: var(--primary); box-shadow: var(--focus-ring); }
.ld-opciones { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; }
.ld-opciones legend { font-size: .85rem; font-weight: 600; margin-bottom: .4rem; padding: 0; }
.ld-opciones label { display: inline-flex; align-items: center; gap: .4rem; min-height: 32px; font-size: .95rem; }
.ld-form .btn-primary { justify-self: start; }
.ld-trampa { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.ld-gracias { background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--color-success); border-radius: var(--radius-lg); padding: 1.5rem; }
.ld-gracias h3 { margin: 0 0 .5rem; }

/* Preguntas y cierre */
.ld-faq details { border-bottom: 1px solid var(--line); padding: .25rem 0; max-width: 780px; }
.ld-faq summary { cursor: pointer; font-weight: 600; padding: .75rem 0; min-height: 44px; }
.ld-faq details p { color: var(--ink-2); margin: 0 0 1rem; }
.ld-cierre { padding: 2rem 0 5rem; text-align: center; }
.ld-cierre h2 { margin-bottom: 1.25rem; }
.ld-form .has-error input { border-color: var(--bad); }
.field .error { color: var(--bad); font-size: .85rem; margin: .25rem 0 0; }

/* Panel de ventas (/admin) */
.ad { padding: 1rem 0 3rem; display: grid; gap: 1.5rem; }
.ad h1 { font-size: 1.6rem; margin: 0; }
.ad-cabeza { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: .75rem; }
.ad-filtros { display: flex; flex-wrap: wrap; gap: .4rem; }
.ad-tabla-wrap { position: relative; overflow-x: auto; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-md); }
.ad-tabla { width: 100%; border-collapse: collapse; font-size: .92rem; }
.ad-tabla th { text-align: left; font-weight: 600; color: var(--ink-2); padding: .7rem .75rem; border-bottom: 1px solid var(--line); white-space: nowrap; }
.ad-tabla td { padding: .75rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.ad-tabla tr:last-child td { border-bottom: 0; }
.ad-tabla .muted { color: var(--ink-2); }
.ad-form { display: grid; gap: .4rem; min-width: 14rem; }
.ad-form select, .ad-form textarea { font: inherit; font-size: .9rem; padding: .45rem .6rem; border-radius: var(--radius-sm); border: 1px solid var(--line-2); background: var(--surface); color: var(--ink); width: 100%; }
.ad-form select:focus-visible, .ad-form textarea:focus-visible { outline: none; border-color: var(--primary); box-shadow: var(--focus-ring); }
.ad-pie { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }

/* Etapas de la empresa y ventajas de Claude */
.ld-etapas { display: grid; gap: 1.25rem; grid-template-columns: 1fr; }
@media (min-width: 860px) { .ld-etapas { grid-template-columns: repeat(3, 1fr); } }
.ld-etapas article { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 1.5rem; display: flex; flex-direction: column; }
.ld-etapas h3 { font-size: 1.15rem; margin: 0 0 .5rem; }
.ld-etapas p { color: var(--ink-2); flex: 1; }
.ld-etapas a { font-weight: 700; align-self: flex-start; min-height: 32px; display: inline-flex; align-items: center; }
.ld-ventajas { margin: 0; display: grid; gap: 1.5rem 2.5rem; grid-template-columns: 1fr; }
@media (min-width: 760px) { .ld-ventajas { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .ld-ventajas { grid-template-columns: repeat(3, 1fr); } }
.ld-ventajas div { border-top: 2px solid var(--primary); padding-top: .75rem; }
.ld-ventajas dt { font-weight: 700; }
.ld-ventajas dd { margin: .3rem 0 0; color: var(--ink-2); }
.ld-cierre h2 { max-width: 28ch; margin-inline: auto; }
.ld-legal { font-size: .8125rem; color: var(--ink-2); margin: .25rem 0 1rem; max-width: 90ch; }
