/* ASCENDA · plantilla de solución (Banco de Proyectos, Cultura de Innovación)
   Prefijo sl- · móvil primero · 768 tablet · 1100 escritorio (diseño a 1440) */

:root {
  --sl-y: clamp(64px, 4.6vw + 46px, 112px);
  --sl-lila: #64478E;
  --sl-borgona-12: rgba(76, 32, 57, .12);
  --sl-citrico-40: rgba(202, 242, 59, .4);
  --sl-card-shadow: 0 1px 2px rgba(29,18,40,.04), 0 8px 24px rgba(29,18,40,.05);
  --sl-fig-shadow: 0 1px 2px rgba(29,18,40,.05), 0 16px 40px rgba(29,18,40,.08);
}

/* ---------- Secciones y títulos ---------- */
.sl-sec { padding-block: var(--sl-y); }
.sl-sec--work { padding-block: clamp(64px, 3.05vw + 52.1px, 96px); }
.sl-h2 { font-size: clamp(30px, 1.34vw + 24.8px, 44px); letter-spacing: -.02em; }
.sl-h2--dark { font-size: clamp(26px, 1.34vw + 20.8px, 40px); }
.sl-h2--md { font-size: clamp(30px, .96vw + 26.3px, 40px); }
.sl-sub { margin-top: 14px; font-size: clamp(16px, .2vw + 15.2px, 18px); line-height: 1.6; }
.sl-inl { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; color: var(--borgona); text-decoration: none; }
.sl-inl:hover { color: var(--borgona); text-decoration: underline; text-underline-offset: 3px; }
.sl-nowrap { white-space: nowrap; }

/* Animación de entrada de la ilustración del primer pantallazo */
@keyframes slUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.sl-anim { animation: slUp .6s cubic-bezier(.2,.7,.2,1) .1s both; }
@media (prefers-reduced-motion: reduce) { .sl-anim { animation: none; } }

/* ---------- Hero ---------- */
.sl-hero { padding: clamp(28px, 2.67vw + 17.6px, 56px) 0 clamp(56px, 5.33vw + 35.2px, 112px); }
.sl-hero__grid { display: grid; gap: 48px; align-items: center; }
.sl-hero__text { display: flex; flex-direction: column; min-width: 0; }
.sl-hero__eyebrow { margin-top: 28px; font-size: clamp(12px, .1vw + 11.6px, 13px); }
.sl-hero__name { margin-top: 12px; font-size: clamp(17px, .29vw + 15.9px, 20px); font-weight: 700; line-height: 1.35; }
.sl-hero__title { margin-top: 14px; font-size: clamp(34px, 2.1vw + 26px, 56px); }
.sl-hero__lead { margin-top: 20px; max-width: 60ch; }
.sl-hero__cta { margin-top: 32px; }
.sl-hero__cta .btn { padding-inline: 28px; }

/* Escalones (Descubrir · Conectar · Acceder) */
.sl-stairs { --w: 100px; --h: 32px; --sh: 42px; --step-x: 106px; --step-y: 10px; position: relative; width: calc(var(--step-x) * 2 + var(--w)); max-width: 100%; height: calc(var(--h) + var(--step-y) * 2 + 10px); }
.sl-stair { position: absolute; width: var(--w); height: var(--h); display: flex; align-items: center; padding-left: 12px; font-size: 13px; font-weight: 700; line-height: 1; color: var(--noche); text-decoration: none; }
.sl-stair svg { position: absolute; left: 0; top: 0; width: 100%; height: var(--sh); overflow: visible; }
.sl-stair span { position: relative; }
.sl-stair--1 { left: 0; top: calc(var(--step-y) * 2); }
.sl-stair--2 { left: var(--step-x); top: var(--step-y); }
.sl-stair--3 { left: calc(var(--step-x) * 2); top: 0; }
.sl-stair--1 svg { fill: var(--borgona); fill-opacity: .25; }
.sl-stair--2 svg { fill: var(--nube); fill-opacity: .25; }
.sl-stair--3 svg { fill: var(--citrico); fill-opacity: .25; }
.sl-stair[aria-current="step"] { color: var(--blanco); }
.sl-stair[aria-current="step"] svg { fill-opacity: 1; }
.sl-stair:hover { color: var(--noche); }
.sl-stair[aria-current="step"]:hover { color: var(--blanco); }
.sl-stair:hover svg { fill-opacity: .55; }
.sl-stair[aria-current="step"]:hover svg { fill-opacity: 1; }
@media (max-width: 339px) { .sl-stairs { --w: 92px; --step-x: 96px; } .sl-stair { font-size: 12px; padding-left: 10px; } }

@media (min-width: 768px) {
  .sl-hero__cta .btn-with-note { align-items: flex-start; }
  .sl-hero__cta .note { text-align: left; }
  .sl-hero__grid > figure { max-width: 600px; }
}
@media (min-width: 1100px) {
  .sl-stairs { --w: 132px; --h: 36px; --sh: 50px; --step-x: 140px; --step-y: 14px; height: 78px; }
  .sl-hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 72px; }
  .sl-hero__grid > figure { max-width: none; }
  .sl-hero__eyebrow { margin-top: 40px; }
}

/* ---------- Ilustraciones (figuras “Ejemplo ilustrativo”) ---------- */
.sl-fig { margin: 0; position: relative; background: var(--blanco); border: 1px solid var(--algodon); border-radius: var(--radius-lg); box-shadow: var(--sl-fig-shadow); overflow: hidden; padding: 20px; min-width: 0; }
.sl-fig--bar { padding-top: 26px; }
.sl-fig--bar::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 6px; background: var(--borgona); }
.sl-fig__cap { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.sl-fig__title { font-family: var(--f-display); font-weight: 700; font-size: 19px; line-height: 1.2; }
.sl-tag { flex-shrink: 0; padding: 4px 10px; border-radius: 999px; background: var(--algodon); font-size: 12px; font-weight: 700; line-height: 1.4; white-space: nowrap; }
@media (min-width: 1100px) { .sl-fig { padding: 28px; } .sl-fig--bar { padding-top: 34px; } }

/* Prioridad y etiquetas de mecanismo */
.sl-prio { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 999px; background: var(--algodon); color: var(--noche); font-size: 12px; font-weight: 700; line-height: 1.4; white-space: nowrap; }
.sl-prio--alta { background: var(--sl-borgona-12); color: var(--borgona); }
.sl-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.sl-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; border-radius: 999px; background: var(--algodon); color: var(--noche); font-size: 12px; font-weight: 700; line-height: 1.2; }
.sl-chip svg, .sl-head svg { flex-shrink: 0; max-width: none; }
.sl-chip--fin { background: var(--nube); color: var(--noche); }
.sl-chip--tri { background: var(--sl-borgona-12); color: var(--borgona); }
.sl-chip--coop { background: var(--sl-citrico-40); color: var(--noche); }
.sl-chip--pub { background: var(--algodon); color: var(--noche); }

/* Lista de portafolio (hero de Banco) */
.sl-port > li { padding: 14px 0; border-top: 1px solid var(--algodon); display: flex; flex-direction: column; gap: 8px; }
.sl-port__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sl-port__name { font-size: 15px; font-weight: 700; line-height: 1.35; }

/* Marca de verificación */
.sl-check { width: 24px; height: 24px; flex-shrink: 0; border-radius: 999px; background: var(--borgona); display: inline-flex; align-items: center; justify-content: center; }

/* ---------- ¿Es para ti? ---------- */
.sl-fit { margin-top: 28px; display: grid; gap: 14px; }
.sl-fit > li { position: relative; background: var(--blanco); border-radius: 20px; overflow: hidden; box-shadow: var(--sl-card-shadow); padding: 30px 24px 24px; }
.sl-fit > li::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 6px; background: var(--borgona); }
.sl-fit p { font-family: var(--f-display); font-weight: 700; font-size: clamp(20px, .29vw + 18.9px, 23px); line-height: 1.28; letter-spacing: -.01em; }
@media (min-width: 900px) {
  .sl-fit { margin-top: 40px; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
  .sl-fit > li { padding: 38px 32px 32px; }
}

/* ---------- Cómo funciona (pasos con conector) ---------- */
.sl-steps { margin-top: 28px; display: flex; flex-direction: column; }
.sl-step { display: grid; grid-template-columns: 48px minmax(0, 1fr); grid-template-rows: auto 1fr; column-gap: 16px; }
.sl-step__num { grid-column: 1; grid-row: 1; width: 48px; height: 48px; border-radius: 14px; background: var(--borgona); color: var(--blanco); display: inline-flex; align-items: center; justify-content: center; font-family: var(--f-display); font-weight: 800; font-size: 22px; }
.sl-step__link { grid-column: 1; grid-row: 2; position: relative; min-height: 84px; }
.sl-step__link svg { max-width: none; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(90deg); display: block; }
.sl-step__body { grid-column: 2; grid-row: 1 / span 2; padding: 4px 0 28px; }
.sl-step:last-child .sl-step__body { padding-bottom: 0; }
.sl-step__title { font-size: 17px; font-weight: 700; line-height: 1.3; }
.sl-step__body p { margin-top: 8px; font-size: 15px; line-height: 1.6; max-width: 60ch; }
@media (min-width: 1100px) {
  .sl-steps { margin-top: 48px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 108px; }
  .sl-step { position: relative; display: flex; flex-direction: column; }
  .sl-step__num { width: 56px; height: 56px; font-size: 24px; }
  .sl-step__link { position: absolute; left: calc(100% + 16px); top: 14px; min-height: 0; }
  .sl-step__link svg { position: static; transform: none; }
  .sl-step__body { padding: 0; }
  .sl-step__title { margin-top: 22px; font-size: 18px; }
  .sl-step__body p { margin-top: 10px; font-size: 15.5px; }
}

/* Etapas (Cultura: Definir · Activar · Expandir) */
.sl-stages { margin-top: 28px; display: flex; flex-direction: column; }
.sl-stage { display: grid; grid-template-columns: 48px minmax(0, 1fr); grid-template-rows: auto 1fr; column-gap: 16px; }
.sl-stage__num { grid-column: 1; grid-row: 1; width: 48px; height: 48px; border-radius: 14px; background: var(--borgona); color: var(--blanco); display: inline-flex; align-items: center; justify-content: center; font-family: var(--f-display); font-weight: 800; font-size: 22px; }
.sl-stage__line { grid-column: 1; grid-row: 2; justify-self: center; width: 0; margin: 8px 0; border-left: 3px solid var(--borgona); }
.sl-stage--opt .sl-stage__num { background: var(--blanco); color: var(--noche); border: 3px dashed var(--borgona); }
.sl-stage--opt .sl-stage__line { border-left-style: dashed; }
.sl-stage__body { grid-column: 2; grid-row: 1 / span 2; padding: 4px 0 28px; }
.sl-stage:last-child .sl-stage__body { padding-bottom: 8px; }
.sl-stage__head { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; }
.sl-stage__title { font-family: var(--f-display); font-weight: 700; font-size: clamp(22px, .38vw + 20.5px, 26px); line-height: 1.2; }
.sl-stage__opt { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 999px; border: 1px dashed var(--noche); font-size: 12px; font-weight: 700; line-height: 1.2; }
.sl-stage__when { margin-top: 6px; font-size: 14px; font-weight: 700; }
.sl-stage__text { margin-top: 10px; font-size: 15px; line-height: 1.6; max-width: 60ch; }
@media (min-width: 900px) {
  .sl-stages { margin-top: 48px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sl-stage { grid-template-columns: 56px minmax(0, 1fr); grid-template-rows: auto 1fr; column-gap: 0; align-content: start; }
  .sl-stage__num { width: 56px; height: 56px; font-size: 24px; }
  .sl-stage--opt .sl-stage__num { font-size: 22px; }
  .sl-stage__line { grid-column: 2; grid-row: 1; align-self: center; justify-self: stretch; width: auto; height: 0; margin: 0 12px; border-left: 0; border-top: 3px solid var(--borgona); }
  .sl-stage--opt .sl-stage__line { border-top-style: dashed; }
  .sl-stage__body { grid-column: 1 / -1; grid-row: 2; padding: 22px 32px 0 0; }
  .sl-stage:last-child .sl-stage__body { padding-bottom: 0; }
  .sl-stage__text { margin-top: 12px; font-size: 16px; }
}

/* ---------- Comportamientos (Cultura) ---------- */
.sl-intro { max-width: 760px; }
ul.sl-behav { margin: 28px calc(var(--gutter) * -1) 0; padding: 4px var(--gutter) 12px; display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-left: var(--gutter); scrollbar-width: none; }
.sl-behav::-webkit-scrollbar { display: none; }
.sl-behav > li { flex: 0 0 236px; scroll-snap-align: start; background: var(--blanco); border: 1px solid var(--algodon); border-radius: 20px; padding: 24px; display: flex; flex-direction: column; gap: 12px; box-shadow: var(--sl-card-shadow); }
.sl-behav h3 { margin-top: 4px; font-size: 17px; font-weight: 700; line-height: 1.3; }
.sl-behav p { font-size: 15px; line-height: 1.55; }
.sl-mech { margin-top: 28px; background: var(--algodon); border-radius: var(--radius-lg); padding: 24px; display: grid; gap: 10px; }
.sl-mech h3 { font-size: 17px; font-weight: 700; line-height: 1.35; color: var(--borgona); }
.sl-mech p { font-size: clamp(15px, .19vw + 14.3px, 17px); line-height: 1.6; }
@media (min-width: 768px) {
  ul.sl-behav { margin: 40px 0 0; padding: 0; overflow: visible; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .sl-mech { margin-top: 32px; padding: 32px 40px; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); gap: 40px; align-items: start; }
}
@media (min-width: 1100px) { ul.sl-behav { grid-template-columns: repeat(5, minmax(0, 1fr)); } }

/* ---------- Qué recibes ---------- */
.sl-get { display: grid; gap: 32px; align-items: center; }
.sl-checks { margin-top: 24px; display: flex; flex-direction: column; gap: 18px; }
.sl-checks--tight { gap: 16px; }
.sl-checks > li { display: flex; gap: 14px; align-items: flex-start; font-size: clamp(16px, .1vw + 15.6px, 17px); line-height: 1.55; }
@media (min-width: 1100px) {
  .sl-get { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 64px; }
  .sl-checks { margin-top: 32px; }
}

/* Tabla del portafolio: lista en móvil, tabla desde 768 */
.sl-table { width: 100%; border-collapse: collapse; }
.sl-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.sl-table tbody, .sl-table tr { display: block; }
.sl-table tbody tr { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 6px; padding: 14px 0; border-top: 1px solid var(--algodon); }
.sl-table tbody th { flex: 1 1 calc(100% - 150px); text-align: left; font-size: 15px; font-weight: 700; line-height: 1.35; }
.sl-table__prio { flex: 0 0 auto; margin-left: auto; }
.sl-table td.is-no, .sl-table td.is-yes > .sl-check { display: none; }
.sl-table td.is-yes { display: block; }
@media (min-width: 768px) {
  .sl-fig--table, .sl-fig--table.sl-fig--bar { padding: 32px; border: 0; border-radius: 28px; box-shadow: 0 1px 2px rgba(29,18,40,.05), 0 16px 40px rgba(29,18,40,.06); }
  .sl-fig--table::before { display: none; }
  .sl-fig--table .sl-fig__cap { margin-bottom: 20px; }
  .sl-fig--table .sl-fig__title { font-size: 22px; }
  .sl-fig--table .sl-tag { padding: 5px 12px; }
  .sl-table thead { position: static; width: auto; height: auto; overflow: visible; clip: auto; display: table-header-group; }
  .sl-table tbody { display: table-row-group; }
  .sl-table tr, .sl-table tbody tr { display: table-row; }
  .sl-table th, .sl-table td { display: table-cell !important; }
  .sl-table tbody tr { border-top: 1px solid var(--algodon); }
  .sl-table thead th { padding: 0 4px 14px; vertical-align: bottom; width: 96px; }
  .sl-table thead th.sl-table__txt { width: auto; padding: 0 8px 14px 0; text-align: left; font-size: 12px; font-weight: 700; color: rgba(29,18,40,.78); }
  .sl-table thead th.sl-table__txt + .sl-table__txt { padding-left: 8px; }
  .sl-table tbody th { padding: 16px 8px 16px 0; }
  .sl-table__prio { padding: 16px 8px; }
  .sl-table td.is-yes, .sl-table td.is-no { padding: 16px 4px; text-align: center; }
  .sl-table td.is-yes > .sl-check { display: inline-flex; }
  .sl-table td.is-yes > .sl-chip { display: none; }
  .sl-table td.is-no > span[aria-hidden] { color: rgba(29,18,40,.35); font-weight: 700; }
  .sl-head { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 5px 8px; border-radius: 10px; font-size: 12px; font-weight: 700; line-height: 1.2; text-align: center; }
}

/* Blueprint de cultura */
.sl-bp { background: var(--algodon); border: 0; }
.sl-bp .sl-fig__cap { margin-bottom: 14px; }
.sl-bp .sl-fig__title { font-size: 17px; }
.sl-bp .sl-tag { background: var(--blanco); }
.sl-bp__grid { display: grid; gap: 10px; }
.sl-bp__box { background: var(--blanco); border: 1px solid var(--algodon); border-radius: 14px; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.sl-bp__label { font-size: 12px; font-weight: 700; letter-spacing: .06em; line-height: 1.3; color: var(--borgona); }
.sl-bp__bars { display: flex; flex-direction: column; gap: 6px; }
.sl-bp__bar { display: block; height: 7px; width: var(--w, 80%); border-radius: 4px; background: rgba(29,18,40,.14); }
.sl-bp__pills { display: flex; flex-wrap: wrap; gap: 6px; }
.sl-bp__pill { display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 999px; background: var(--algodon); font-size: 12px; font-weight: 700; line-height: 1.4; white-space: nowrap; }
.sl-bp__route { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.sl-bp__solid { flex: 1 1 0; min-width: 10px; height: 4px; border-radius: 2px; background: var(--borgona); }
.sl-bp__dash { flex: 1 1 0; min-width: 10px; height: 0; border-top: 3px dashed var(--borgona); }
.sl-bp__item { display: flex; align-items: center; gap: 8px; }
.sl-bp__item .sl-check { width: 14px; height: 14px; }
.sl-bp__sq { width: 8px; height: 8px; flex-shrink: 0; border-radius: 2px; background: var(--borgona); }
.sl-bp--lg { background: var(--blanco); border-radius: 28px; box-shadow: 0 1px 2px rgba(29,18,40,.05), 0 16px 40px rgba(29,18,40,.06); }
.sl-bp--lg .sl-tag { background: var(--algodon); }
@media (min-width: 560px) {
  .sl-bp__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); }
  .sl-bp__wide { grid-column: 1 / -1; }
}
@media (min-width: 1100px) {
  .sl-bp { padding: 30px 24px 24px; }
  .sl-bp--lg .sl-fig__title { font-size: 21px; }
  .sl-bp--lg .sl-bp__box { padding: 16px 18px; }
  .sl-bp--lg .sl-bp__pill { padding: 4px 10px; }
}

/* ---------- Bloque oscuro: así llega a la plataforma ---------- */
.sl-flow__intro { max-width: 760px; }
.sl-flow__lead { margin-top: 18px; font-size: clamp(16px, .2vw + 15.2px, 18px); line-height: 1.6; color: var(--algodon); }
.sl-flow { margin-top: 32px; display: grid; gap: 24px; align-items: center; }
.sl-flow__col { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.sl-flow__label { font-size: 13px; font-weight: 700; letter-spacing: .08em; color: var(--nube); }
.sl-flow__arrow { display: flex; justify-content: center; }
.sl-flow__arrow svg { max-width: none; display: block; transform: rotate(90deg); }
.sl-flow__more { margin-top: 32px; }
.sl-link-nube { display: inline-flex; align-items: center; min-height: 44px; font-size: 16px; font-weight: 700; color: var(--nube); text-decoration: none; }
.sl-link-nube:hover { color: var(--nube); text-decoration: underline; text-underline-offset: 4px; }

.sl-pcards { display: flex; flex-direction: column; gap: 12px; }
.sl-pcards > li { background: var(--noche-linea); border-radius: 16px; padding: 16px 20px; display: flex; flex-direction: column; gap: 8px; }
.sl-pcards__kicker { font-size: 12px; font-weight: 700; color: var(--nube); }
.sl-pcards__row { display: flex; align-items: center; justify-content: space-between; gap: 8px 12px; flex-wrap: wrap; }
.sl-pcards__name { font-family: var(--f-display); font-weight: 700; font-size: 18px; line-height: 1.25; color: var(--blanco); }
.sl-pcards__prio { padding: 4px 10px; border-radius: 999px; border: 1px solid var(--sl-lila); font-size: 12px; font-weight: 700; color: var(--algodon); white-space: nowrap; }

.sl-icards { display: flex; flex-direction: column; gap: 12px; }
.sl-icards > li { background: var(--blanco); color: var(--noche); border-radius: 16px; padding: 14px 18px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.sl-icards__cat { font-size: 12px; font-weight: 700; line-height: 1.3; color: rgba(29,18,40,.84); }
.sl-icards__name { font-family: var(--f-display); font-weight: 700; font-size: 16px; line-height: 1.2; }
.sl-icards .sl-chip { padding: 5px 10px; }

/* Cultura: de reto a proyecto */
.sl-prog { display: flex; flex-direction: column; }
.sl-prog > li { position: relative; display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-radius: 14px; background: var(--noche-linea); }
.sl-prog > li + li { margin-top: 34px; }
.sl-prog__n { font-size: 12px; font-weight: 700; color: var(--nube); }
.sl-prog__t { font-family: var(--f-display); font-weight: 700; font-size: 18px; line-height: 1.25; color: var(--blanco); }
.sl-prog__link { max-width: none; position: absolute; left: 50%; top: calc(100% + 6px); transform: translateX(-50%) rotate(90deg); }
.sl-prog > li.is-final { background: var(--blanco); }
.sl-prog > li.is-final .sl-prog__n { color: var(--borgona); }
.sl-prog > li.is-final .sl-prog__t { color: var(--noche); }

@media (min-width: 900px) {
  .sl-flow { margin-top: 56px; grid-template-columns: minmax(0, 1fr) clamp(88px, 8.3vw, 120px) minmax(0, 1fr); gap: 0; }
  .sl-flow__arrow { padding-top: 28px; }
  .sl-flow__arrow svg { transform: none; }
  .sl-flow__more { margin-top: 40px; }
}

/* ---------- El siguiente paso ---------- */
.sl-next { display: grid; gap: 40px; }
.sl-ncards { margin-top: 28px; display: grid; gap: 14px; }
.sl-ncard { position: relative; display: flex; flex-direction: column; height: 100%; background: var(--blanco); border: 1px solid var(--algodon); border-radius: 20px; overflow: hidden; text-decoration: none; color: var(--noche); box-shadow: var(--sl-card-shadow); transition: box-shadow .15s ease; }
.sl-ncard::before { content: ""; height: 6px; background: var(--citrico); }
.sl-ncard:hover { color: var(--noche); box-shadow: 0 1px 2px rgba(29,18,40,.06), 0 14px 32px rgba(29,18,40,.10); }
.sl-ncard:hover .sl-ncard__more { text-decoration: underline; text-underline-offset: 3px; }
.sl-ncard__body { padding: 22px 24px; display: flex; flex-direction: column; gap: 8px; flex-grow: 1; }
.sl-ncard__kicker { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; letter-spacing: .08em; }
.sl-ncard__dot { width: 10px; height: 10px; border-radius: 3px; background: var(--citrico); box-shadow: inset 0 0 0 1px rgba(29,18,40,.12); }
.sl-ncard__title { font-family: var(--f-display); font-weight: 700; font-size: 20px; line-height: 1.2; }
.sl-ncard__text { font-size: 15px; line-height: 1.55; }
.sl-ncard__more { margin-top: auto; padding-top: 6px; font-size: 15px; font-weight: 700; color: var(--borgona); }
.sl-work { background: var(--blanco); border: 1px solid var(--algodon); border-radius: var(--radius-lg); padding: 24px; }
.sl-work__title { font-family: var(--f-display); font-weight: 800; font-size: clamp(24px, .38vw + 22.5px, 28px); line-height: 1.12; letter-spacing: -.015em; }
.sl-work p { margin-top: 14px; font-size: clamp(15.5px, .14vw + 14.9px, 17px); line-height: 1.6; }
.sl-work--lg { max-width: 820px; }
.sl-work--lg .sl-work__title { font-size: clamp(24px, .76vw + 21px, 32px); }
.sl-work--lg p { font-size: clamp(15.5px, .24vw + 14.6px, 18px); }
@media (min-width: 768px) {
  .sl-ncards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  .sl-work { padding: 36px; }
  .sl-work--lg { padding: 40px; }
}
@media (min-width: 1100px) {
  .sl-next--aside { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 56px; align-items: end; }
}

/* ---------- Caso (Cultura) ---------- */
.sl-case { padding-block: clamp(64px, 3.81vw + 49.1px, 104px); }
.sl-case__inner { display: flex; flex-direction: column; align-items: flex-start; }
.sl-case .eyebrow { margin-bottom: 24px; }
.sl-case__card { width: 100%; max-width: 560px; background: #70355C; border-radius: var(--radius-lg); padding: 24px; display: flex; flex-direction: column; }
.sl-case__logo { width: 120px; height: 56px; padding: 8px 12px; border-radius: 12px; background: var(--blanco); display: flex; align-items: center; justify-content: center; }
.sl-case__logo img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.sl-case__title { margin-top: 28px; font-family: var(--f-display); font-weight: 700; font-size: clamp(22px, .19vw + 21.3px, 24px); line-height: 1.22; letter-spacing: -.01em; color: var(--citrico); }
.sl-case blockquote { margin-top: 16px; font-size: 16px; line-height: 1.6; color: var(--algodon); }
.sl-case__who { margin-top: 24px; display: flex; flex-direction: column; gap: 2px; }
.sl-case__name { font-size: 15px; font-weight: 700; color: var(--blanco); }
.sl-case__role { font-size: 14px; color: var(--nube); }
@media (min-width: 768px) {
  .sl-case__inner { align-items: center; }
  .sl-case__card { padding: 32px; }
}

/* ---------- Preguntas frecuentes ---------- */
.sl-faqwrap { display: grid; gap: 28px; align-items: start; }
.sl-faqwrap__note { margin-top: 14px; font-size: clamp(16px, .1vw + 15.6px, 17px); line-height: 1.6; }
.sl-faq.faq { border-top: 0; display: flex; flex-direction: column; gap: 12px; }
.sl-faq .faq__item { background: var(--blanco); border: 0; border-radius: 16px; box-shadow: 0 1px 2px rgba(29,18,40,.05); }
.sl-faq .faq__btn { margin: 0; width: 100%; min-height: 60px; padding: 16px 18px; border-radius: 16px; font-size: clamp(16px, .1vw + 15.6px, 17px); line-height: 1.35; }
.sl-faq .faq__btn:hover { background: rgba(234,234,234,.45); }
.sl-faq .faq__ans { padding: 0 18px 20px; font-size: 16px; line-height: 1.6; }
@media (min-width: 1100px) {
  .sl-faqwrap { grid-template-columns: minmax(0, 7fr) minmax(0, 13fr); gap: 56px; }
  .sl-faqwrap__head { position: sticky; top: calc(var(--header-h) + 40px); }
  .sl-faq .faq__btn { min-height: 68px; padding: 18px 24px; }
  .sl-faq .faq__ans { padding: 0 24px 22px; }
}

/* ---------- Llamado final ---------- */
.sl-cta { padding: clamp(64px, 3.05vw + 52.1px, 96px) 0 clamp(72px, 3.05vw + 60.1px, 104px); }
.sl-cta__inner { display: flex; flex-direction: column; align-items: center; text-align: center; }
.sl-cta__title { font-size: clamp(30px, 1.71vw + 23.3px, 48px); letter-spacing: -.02em; }
.sl-cta__btn { margin-top: 28px; }
.sl-cta__btn .btn { padding-inline: 28px; }
.sl-cta__alt { margin-top: 16px; font-size: 15px; line-height: 1.6; }
@media (max-width: 767px) { .sl-cta__btn { width: 100%; max-width: 314px; } .sl-cta__btn .btn { width: 100%; } }