/* Landings del catálogo migrado. Comparte tipografía, color y ritmo con FormaFlow. */
.legado.legado-landing {
  --lg-ink: #271635;
  --lg-accent: #64149a;
  --lg-tint: #f8f2fc;
  --lg-line: #e7daf0;
  --lg-gutter: clamp(20px, 4vw, 32px);
  --lg-content: 1320px;
  --lg-edge: max(var(--lg-gutter), calc((100% - var(--lg-content)) / 2 + var(--lg-gutter)));
  --lg-section-pad: clamp(52px, 7vw, 96px);
  --lg-surface-raised: 0 14px 42px #43185b0e;
  --lg-hero-art: url("/ff-2026/img/optimized/bola-logo-640-62bf3b89828c.webp");
  --cyan-neon: var(--lg-accent);
  width: 100%;
  padding: 0 0 clamp(52px, 7vw, 96px);
  color: var(--lg-ink);
  overflow-wrap: break-word;
}

.legado-landing > :is(.lg-section-container, .lg-ffd, .lg-scorm-subnav-bar) {
  width: min(100%, var(--lg-content));
  margin-inline: auto;
  padding-inline: var(--lg-gutter);
}

.legado.legado-landing > :where(section, div, nav) + :where(section, nav) {
  margin-top: 0;
}

.legado-landing > .lg-section-container {
  padding-block: var(--lg-section-pad);
}

.legado-landing > .lg-section-container > :is(h2, .lg-section-header, .lg-h2-signature) {
  max-width: 35ch;
}

.legado.legado-landing h2 {
  color: inherit;
  font-size: clamp(1.85rem, 4vw, 3.35rem);
  letter-spacing: -.042em;
  font-weight: 530;
}

.legado.legado-landing h3 {
  color: inherit;
  font-size: clamp(1.18rem, 2vw, 1.52rem);
  font-weight: 610;
}

.legado-landing .lg-eyebrow-signature,
.legado-landing .lg-cyber-badge,
.legado-landing .lg-pricing-badge-ribbon,
.legado-landing .lg-ffd__eyebrow {
  color: var(--lg-accent);
  font-size: .8rem;
  font-weight: 670;
  letter-spacing: .045em;
}

.legado-landing .lg-mt-2 { --lg-gap: clamp(18px, 3vw, 32px); }
.legado-landing .lg-mt-3 { --lg-gap: clamp(24px, 4vw, 44px); }

.legado-landing .lg-btn-gradient-signature,
.legado-landing .lg-btn-outline-signature,
.legado-landing .lg-ffd__cta {
  min-height: 46px;
  padding: 11px 17px;
  font-weight: 620;
}

.legado-landing a:where(.lg-btn-gradient-signature, .lg-btn-outline-signature, .lg-ffd__cta):hover {
  text-decoration: none;
}

/* La ilustración es decorativa. Las etiquetas y enlaces conservan el orden del documento. */
.legado-landing[data-landing="/soluciones/"] {
  --lg-hero-art: image-set(url("/ff-2026/img/optimized/hero-robots-640-711416ea3161.webp") 1x, url("/ff-2026/img/optimized/hero-robots-960-ce99dd014f13.webp") 2x);
}

.legado-landing[data-landing="/plataforma-sepe/"] {
  --lg-hero-art: image-set(url("/ff-2026/img/optimized/hero-empresas-640-fa7fc4562b80.webp") 1x, url("/ff-2026/img/optimized/hero-empresas-1300-6eb5f3d3b4e4.webp") 2x);
}

.legado-landing[data-landing="/digitalizacion-scorm/"] {
  --lg-hero-art: image-set(url("/ff-2026/img/optimized/hero-course-factory-640-4397bc957511.webp") 1x, url("/ff-2026/img/optimized/hero-course-factory-1300-46213c5eaa89.webp") 2x);
}

.legado-landing[data-landing="/plugins-moodle/soap-sepe/"] {
  --lg-hero-art: image-set(url("/ff-2026/img/optimized/hero-connect-640-7c5a8ce34fc2.webp") 1x, url("/ff-2026/img/optimized/hero-connect-1300-40292f82396a.webp") 2x);
}

.legado-landing[data-landing="/plugins-moodle/fundae/"] {
  --lg-hero-art: image-set(url("/ff-2026/img/optimized/hero-erp-640-299bc4563c68.webp") 1x, url("/ff-2026/img/optimized/hero-erp-1300-f2372dafac5b.webp") 2x);
}

.legado-landing[data-landing="/plugins-moodle/seguimiento-alumnado/"] {
  --lg-hero-art: url("/ff-2026/img/optimized/robot-gestion-checklist-620-2793bfa4d404.webp");
  --lg-hero-art-size: min(82%, 350px) auto;
}

.legado.legado-landing > .lg-scorm-hero-section {
  display: grid;
  grid-template-columns: minmax(0, 1.34fr) minmax(0, 1fr);
  gap: clamp(26px, 4vw, 66px);
  align-items: center;
  width: 100%;
  max-width: none;
  padding: clamp(42px, 5vw, 78px) var(--lg-edge) clamp(54px, 7vw, 102px);
  margin: 0;
  border: 0;
  border-radius: 0;
  background: linear-gradient(90deg, #29065026, #39084952), var(--lg-hero-surface, var(--grad-cabecera));
  color: #fff;
}

.legado-landing > .lg-scorm-hero-section::after {
  content: "";
  display: block;
  width: 100%;
  min-height: 320px;
  aspect-ratio: 1.16;
  background-image: var(--lg-hero-art, none), radial-gradient(ellipse at 52% 52%, #f4e4ff 0%, #edcbfa 49%, transparent 71%);
  background-position: center;
  background-repeat: no-repeat;
  background-size: var(--lg-hero-art-size, contain), 94% 95%;
  filter: drop-shadow(0 22px 36px #21002c46);
}

.legado-landing .lg-scorm-hero-content { min-width: 0; }
.legado-landing > .lg-scorm-hero-section:has(> h1) { row-gap: 12px; align-content: center; }
.legado-landing > .lg-scorm-hero-section:has(> h1) > * { grid-column: 1; }
.legado-landing > .lg-scorm-hero-section:has(> h1)::after { grid-column: 2; grid-row: 1 / span 3; }
.legado-landing .lg-scorm-hero-section h1 {
  margin-block: 12px 21px;
  max-width: 22ch;
  color: #fff;
  font-size: clamp(2.35rem, 4.4vw, 4.15rem);
  line-height: 1.035;
  letter-spacing: -.05em;
  font-weight: 510;
}

.legado-landing .lg-scorm-hero-section :is(.lg-eyebrow-signature, .lg-cyber-badge) { color: #ffe8a8; }
.legado-landing .lg-scorm-hero-section .lg-scorm-hero-lead {
  max-width: 66ch;
  margin-top: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #f8efff;
  font-size: clamp(1.02rem, 1.48vw, 1.16rem);
  line-height: 1.62;
}

.legado-landing .lg-scorm-hero-section .lg-scorm-hero-actions-bar { gap: 10px; margin-top: 24px; }
.legado-landing .lg-scorm-hero-section .lg-btn-gradient-signature {
  color: #571486;
  background: #fff;
  border-color: #fff;
}

.legado-landing .lg-scorm-hero-section .lg-btn-outline-signature {
  color: #fff;
  background: #ffffff0f;
  border-color: #f4e2ffa6;
}

.legado-landing .lg-scorm-hero-section .lg-btn-outline-signature:hover { background: #ffffff27; }
.legado-landing .lg-scorm-hero-section p > a { color: inherit; }
.legado-landing .lg-scorm-hero-section .lg-hero-badges-row { margin-top: 19px; gap: 8px; }
.legado-landing .lg-scorm-hero-section .lg-badge-item-pill {
  max-width: 100%;
  padding: 6px 10px;
  border-radius: 9px;
  color: #fff;
  background: #ffffff1b;
  font-size: .82rem;
}

.legado.legado-landing > .lg-scorm-subnav-bar {
  margin-block: 0;
  padding-block: 14px;
  justify-content: space-between;
  gap: 10px 18px;
  background: #fff;
  border: 0;
  border-bottom: 1px solid var(--lg-line);
  border-radius: 0;
}

.legado-landing .lg-subnav-links { gap: 4px 17px; }
.legado-landing .lg-subnav-links a {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  font-weight: 570;
  text-decoration: none;
}

.legado-landing .lg-subnav-links a:hover { text-decoration: underline; }

/* El contenido alterna bandas, pasos y listas con los paneles funcionales. */
.legado-landing > :is(#plataforma-incluye, #plataforma-precio, #scorm-servicio, #scorm-entregables,
  #caracteristicas, #que-incluye, #modelos-precio, #comparativa) {
  width: 100%;
  max-width: none;
  padding-inline: var(--lg-edge);
  background: linear-gradient(135deg, #fbf6ff, #f7f0fb);
}

.legado-landing :where(.lg-grid-2-col, .lg-grid-2x2-deliverables, .lg-grid-3-col, .lg-grid-3-cards,
  .lg-grid-4-services, .lg-grid-3-delivery-modes, .lg-timeline-horizontal-5) {
  gap: clamp(15px, 2.7vw, 30px);
}

.legado-landing :where(.lg-grid-3-cards, .lg-grid-4-services, .lg-grid-3-delivery-modes) {
  align-items: stretch;
}

.legado-landing :where(.lg-grid-2-col, .lg-grid-2x2-deliverables, .lg-grid-3-col,
  .lg-grid-3-cards, .lg-grid-4-services, .lg-timeline-horizontal-5) > .lg-glass-panel {
  padding: clamp(18px, 2.65vw, 32px);
}

.legado-landing :where(.lg-service-box-item, .lg-deliverable-card, .lg-delivery-mode-card) {
  border-radius: 19px;
  border: 0;
  background: #fff;
  box-shadow: var(--lg-surface-raised), inset 0 0 0 1px #eee4f4;
}

.legado-landing .lg-deliverable-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.legado-landing .lg-deliverable-card > * { margin-top: 0; }
.legado-landing .lg-deliverable-card > a:last-child { margin-top: auto; }

.legado-landing .lg-grid-3-cards > .lg-problem-card,
.legado-landing .lg-timeline-horizontal-5 > .lg-step-card {
  padding: 17px 0 0;
  border: 0;
  border-top: 2px solid #d8b5eb;
  border-radius: 0;
  background: transparent;
}

.legado-landing .lg-timeline-horizontal-5 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
}

.legado-landing .lg-card-num-sub,
.legado-landing .lg-step-num,
.legado-landing .lg-step-time-badge {
  font-size: .82rem;
  font-weight: 700;
  color: var(--lg-accent);
}

.legado-landing .lg-step-time-badge { display: inline-block; margin-inline-start: 8px; }
.legado-landing .lg-icon-service-box {
  display: grid;
  place-items: center;
  width: 46px;
  aspect-ratio: 1;
  border-radius: 12px;
  background: #f1e6fb;
  color: var(--lg-accent);
  margin-bottom: 15px;
}

.legado-landing .lg-icon-service-box.lg-pink { background: #f9e5f2; color: #94246d; }
.legado-landing .lg-icon-service-box.lg-gold { background: #faf0dd; color: #8a5a16; }
.legado-landing .lg-cross-promo-banner,
.legado-landing .lg-section-container .lg-contact-card-form:not(:has(> form)) {
  border: 0;
  border-radius: 22px;
  padding: clamp(22px, 4vw, 48px);
  background: linear-gradient(135deg, #f8f0ff, #fff 75%);
}

.legado-landing .lg-cross-promo-lead { max-width: 68ch; }
.legado-landing .lg-yt-facade { border-radius: 19px; background: linear-gradient(130deg, #4c1679, #67168a); }
.legado-landing .lg-yt-facade button { min-height: 130px; color: #fff; }
.legado-landing :is(.lg-stat-number, .lg-price-val, .lg-res-num, .lg-metric-val, .lg-calc-time-value) {
  font-size: clamp(1.55rem, 3.6vw, 2.65rem);
  line-height: 1.16;
  font-weight: 620;
  letter-spacing: -.035em;
}

.legado-landing .lg-metrics-trio-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
  gap: clamp(15px, 2.7vw, 30px);
}

.legado-landing .lg-metrics-trio-grid > * { border-top: 2px solid #d8b5eb; padding-top: 16px; }

.legado-landing > .lg-ffd {
  width: min(calc(100% - 2 * var(--lg-gutter)), calc(var(--lg-content) - 2 * var(--lg-gutter)));
  padding: clamp(22px, 5vw, 62px);
  border: 0;
  border-radius: 25px;
  background: linear-gradient(118deg, #3a105d, #5b1a88 66%, #77217d);
  color: #fff;
}

.legado-landing .lg-ffd__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.22fr) minmax(0, .78fr);
  gap: clamp(20px, 4vw, 54px);
  align-items: center;
}

.legado-landing .lg-ffd__grid::after {
  content: "";
  width: 100%;
  aspect-ratio: 1.3;
  background: url("/ff-2026/img/optimized/robot-estudiando-620-7101419a65dd.webp") center / contain no-repeat,
    radial-gradient(ellipse at center, #f5dfff 0%, #ecbafb 45%, transparent 72%);
}

.legado-landing .lg-ffd__eyebrow,
.legado-landing .lg-ffd__nota { color: #f2dffc; }
.legado-landing .lg-ffd__cta { margin-top: 18px; color: #571486; background: #fff; border-color: #fff; }
.legado-landing .lg-ffd__nota { font-size: .86rem; }

/* Precios y preguntas. */
.legado-landing .lg-pricing-showcase-card {
  max-width: 830px;
  margin-inline: auto;
  padding: clamp(24px, 5vw, 58px);
  background: linear-gradient(135deg, #fbf6ff, #f4e9fa);
  border: 0;
  border-radius: 24px;
}

.legado-landing .lg-pricing-showcase-card h2 {
  color: var(--lg-accent);
  font-size: clamp(2.5rem, 5.6vw, 4.5rem);
  letter-spacing: -.054em;
}

.legado-landing .lg-pricing-showcase-card h2 span { font-size: .4em; letter-spacing: 0; }
.legado-landing .lg-pricing-showcase-card .lg-w-100 { width: auto; margin-top: 21px; }
.legado-landing :is(#faq, #scorm-faq, #plataforma-faq) > :is(h2, .lg-section-header) { margin-bottom: 25px; }
.legado-landing :is(#faq, #scorm-faq, #plataforma-faq) details {
  margin-top: 0;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--lg-line);
  border-radius: 0;
  background: transparent;
}

.legado-landing :is(#faq, #scorm-faq, #plataforma-faq) details:first-child { border-top: 1px solid var(--lg-line); }
.legado-landing :is(#faq, #scorm-faq, #plataforma-faq) details summary {
  padding: 16px 3px;
  border: 0;
  color: var(--lg-ink);
  font-size: clamp(1rem, 1.6vw, 1.13rem);
}

.legado-landing :is(#faq, #scorm-faq, #plataforma-faq) details > :not(summary) {
  max-width: 70ch;
  padding: 0 3px 16px;
  color: #504259;
}

.legado-landing :is(#faq, #scorm-faq, #plataforma-faq) details > :is(ol, ul) { padding-inline-start: 22px; }
.legado-landing .lg-faq-grid-2-col { gap: 0 clamp(20px, 5vw, 56px); }

/* Formularios con una introducción separada en escritorio y una columna en móvil. */
.legado-landing > .lg-section-container > .lg-contact-card-form:has(> .lg-ff-form) {
  padding: clamp(20px, 4vw, 52px);
  border: 0;
  border-radius: 25px;
  background: linear-gradient(132deg, #f2e5fc, #fbf6ff);
}

.legado-landing .lg-contact-card-form:has(> .lg-ff-form) > .lg-ff-form {
  margin-top: 24px;
  padding: clamp(16px, 3vw, 34px);
  border: 1px solid #e7d9ee;
  border-radius: 17px;
  background: #fff;
  box-shadow: var(--lg-surface-raised);
  gap: 18px;
}

.legado-landing .lg-form-row-2 { gap: 14px; }
.legado-landing .lg-form-group label { color: var(--lg-ink); margin-bottom: 7px; font-weight: 630; }
.legado-landing :is(.lg-ff-form, .lg-calc-input-row) :where(input:not([type="hidden"], [type="checkbox"]), textarea, select) {
  min-height: 48px;
  border-color: #8b7a9b;
  border-radius: 9px;
  padding: 10px 12px;
}

.legado-landing .lg-ff-form textarea { min-height: 126px; }
.legado-landing .lg-ff-form .lg-form-group-checkbox { gap: 10px; }
.legado-landing .lg-ff-form .lg-form-group-checkbox input { min-width: 17px; min-height: 17px; }
.legado-landing .lg-ff-form .lg-form-actions-bar { margin-top: 3px; }

@media (min-width: 980px) {
  .legado-landing > .lg-section-container > .lg-contact-card-form:has(> .lg-ff-form) {
    display: grid;
    grid-template-columns: minmax(0, .74fr) minmax(0, 1.26fr);
    grid-template-rows: repeat(4, auto) 1fr;
    align-items: start;
    column-gap: clamp(24px, 5vw, 68px);
  }

  .legado-landing > .lg-section-container > .lg-contact-card-form:has(> .lg-ff-form) > :not(form) {
    grid-column: 1;
  }

  .legado-landing > .lg-section-container > .lg-contact-card-form:has(> .lg-ff-form) > .lg-ff-form {
    grid-column: 2;
    grid-row: 1 / 6;
    margin-top: 0;
  }
}

@media (max-width: 1050px) {
  .legado.legado-landing > .lg-scorm-hero-section { grid-template-columns: minmax(0, 1.45fr) minmax(0, .85fr); }
  .legado-landing > .lg-scorm-hero-section::after { min-height: 230px; }
}

@media (max-width: 780px) {
  .legado.legado-landing > .lg-scorm-hero-section { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .legado-landing > .lg-scorm-hero-section::after {
    width: min(100%, 420px);
    min-height: 0;
    aspect-ratio: 1.4;
    justify-self: center;
  }
  .legado-landing > .lg-scorm-hero-section:has(> h1)::after { grid-column: 1; grid-row: auto; }

  .legado-landing .lg-ffd__grid { grid-template-columns: minmax(0, 1fr); }
  .legado-landing .lg-ffd__grid::after { max-width: 280px; justify-self: center; }
}

@media (max-width: 650px) {
  .legado-landing .lg-form-row-2,
  .legado-landing .lg-faq-grid-2-col { grid-template-columns: minmax(0, 1fr); }
  .legado-landing .lg-ff-form .lg-btn-gradient-signature { width: 100%; }
  .legado-landing .lg-subnav-links { gap: 3px 12px; }
  .legado-landing .lg-subnav-links a { min-height: 40px; }
  .legado-landing :is(#scorm-faq, #plataforma-faq) .lg-faq-col:not(:first-child) details:first-child { border-top: 0; }
}

@media (forced-colors: active) {
  .legado-landing :is(.lg-service-box-item, .lg-deliverable-card, .lg-ffd, .lg-pricing-showcase-card) {
    border: 1px solid CanvasText;
  }
}


/* Mobile art follows its rendered width instead of the desktop width. */
@media(max-width:760px){
.legado-landing[data-landing="/soluciones/"]{--lg-hero-art:image-set(url("/ff-2026/img/optimized/hero-robots-320-70591610ccdc.webp") 1x,url("/ff-2026/img/optimized/hero-robots-640-711416ea3161.webp") 2x)}
.legado-landing[data-landing="/plataforma-sepe/"]{--lg-hero-art:image-set(url("/ff-2026/img/optimized/hero-empresas-320-7deb0d5c3c46.webp") 1x,url("/ff-2026/img/optimized/hero-empresas-640-fa7fc4562b80.webp") 2x)}
.legado-landing[data-landing="/digitalizacion-scorm/"]{--lg-hero-art:image-set(url("/ff-2026/img/optimized/hero-course-factory-320-e531fbc32fa3.webp") 1x,url("/ff-2026/img/optimized/hero-course-factory-640-4397bc957511.webp") 2x)}
.legado-landing[data-landing="/plugins-moodle/soap-sepe/"]{--lg-hero-art:image-set(url("/ff-2026/img/optimized/hero-connect-320-e1639a6dfafd.webp") 1x,url("/ff-2026/img/optimized/hero-connect-640-7c5a8ce34fc2.webp") 2x)}
.legado-landing[data-landing="/plugins-moodle/fundae/"]{--lg-hero-art:image-set(url("/ff-2026/img/optimized/hero-erp-320-be5c201f455b.webp") 1x,url("/ff-2026/img/optimized/hero-erp-640-299bc4563c68.webp") 2x)}
.legado-landing[data-landing="/plugins-moodle/seguimiento-alumnado/"]{--lg-hero-art:image-set(url("/ff-2026/img/optimized/robot-gestion-checklist-320-4c0bd755d036.webp") 1x,url("/ff-2026/img/optimized/robot-gestion-checklist-620-2793bfa4d404.webp") 2x)}
}
