/* Biblioteca de escenarios. Se apoya en styles.css y recursos.css. */

/* Tarjetas del listado */
.e-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.e-card{position:relative;display:flex;flex-direction:column;border-radius:28px;overflow:hidden;background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px var(--line);transition:transform .45s var(--ease),box-shadow .45s,background .45s}
.e-card[hidden]{display:none}
.e-card:hover{transform:translateY(-5px);background:rgba(255,255,255,.055);box-shadow:inset 0 0 0 1px rgba(79,209,255,.45),0 30px 60px -36px rgba(0,126,254,.7)}
.e-card .img{position:relative;aspect-ratio:16/11;overflow:hidden;background:#0A1B3D}
.e-card .img img{width:100%;height:100%;object-fit:cover;object-position:50% 25%;transition:transform .9s var(--ease)}
.e-card:hover .img img{transform:scale(1.05)}
.e-card .img::after{content:'';position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(transparent,rgba(4,8,20,.55))}
.e-area{position:absolute;left:14px;top:14px;z-index:1;padding:6px 12px;border-radius:999px;font:500 12px 'Poppins',sans-serif;background:rgba(4,10,28,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.e-live{position:absolute;right:14px;bottom:14px;z-index:1;display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;font:500 12px 'Poppins',sans-serif;color:#fff;background:rgba(4,10,28,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.e-live i{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.35}}
.e-card .body{display:flex;flex-direction:column;gap:10px;padding:22px 22px 24px;flex:1}
.e-card small{font:500 12.5px 'Poppins',sans-serif;color:var(--cyan)}
.e-card h3{margin:0;font:500 22px/1.2 'Poppins',sans-serif;letter-spacing:-.025em}
.e-card p{margin:0;font-size:15px;line-height:1.55;color:var(--ink2)}
.e-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.e-chips span{padding:5px 10px;border-radius:999px;font:500 12px 'Poppins',sans-serif;color:var(--ink2);box-shadow:inset 0 0 0 1px var(--line2)}
.e-card .tl{margin-top:auto;padding-top:10px;align-self:flex-start;font-size:15px}
.e-custom{justify-content:center;background:repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 12px,transparent 12px 24px);box-shadow:inset 0 0 0 1px var(--line2)}
.e-custom .body{justify-content:center}

/* Pasos */
.e-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:44px}
.e-steps>div{padding:28px;border-radius:24px;background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px var(--line)}
.e-steps b{font:500 40px/1 'JetBrains Mono',monospace;letter-spacing:-.06em;background:linear-gradient(120deg,#fff,var(--cyan) 50%,var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.e-steps h3{margin:18px 0 8px;font:500 20px/1.25 'Poppins',sans-serif;letter-spacing:-.02em}
.e-steps p{margin:0;font-size:15.5px;color:var(--ink2)}

/* Ficha: avatar en llamada */
.e-call{position:relative;margin:0;border-radius:clamp(22px,2.4vw,32px);overflow:hidden;aspect-ratio:4/3;background:#0A1B3D;box-shadow:inset 0 0 0 1px var(--line),0 60px 120px -60px rgba(0,80,220,.6)}
.e-call img{width:100%;height:100%;object-fit:cover;object-position:50% 25%}
.e-call .e-live{left:18px;top:18px;right:auto;bottom:auto}
.e-call figcaption{position:absolute;left:14px;right:14px;bottom:14px;padding:14px 18px;border-radius:18px;background:rgba(4,10,28,.66);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-size:14px;color:var(--ink2)}
.e-call figcaption b{display:block;font:500 16px 'Poppins',sans-serif;color:#fff}
.e-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}

/* Ficha: cuerpo */
.e-goal{margin:8px 0 34px;padding:24px 26px;border-radius:22px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 18px 40px -28px rgba(14,22,48,.35);border-left:4px solid var(--link,var(--cyan))}
.e-goal .eyebrow{color:var(--link);font-size:11.5px}
.e-goal .eyebrow::before{background:var(--link);box-shadow:none}
.prose .e-goal p{margin:10px 0 0;color:var(--ink);font-size:18px}
.e-mods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:6px 0 30px}
.e-mod{padding:20px 20px 18px;border-radius:20px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 14px 30px -24px rgba(14,22,48,.4)}
.e-mod b{display:flex;align-items:center;gap:10px;font:600 15.5px 'Poppins',sans-serif;color:var(--ink)}
.e-mod b::before{content:'✓';display:grid;place-items:center;width:22px;height:22px;border-radius:50%;font-size:12px;color:#fff;background:linear-gradient(135deg,#0063D1,#6B5CFF)}
.prose .e-mod p{margin:8px 0 0;font-size:15px;line-height:1.55}
/* Guion: el avatar a la izquierda, tú a la derecha */
.bub.ai{justify-self:start;border-radius:20px 20px 20px 6px;background:#F1F4FA;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.a-paper .bub.ai{background:#F1F4FA;box-shadow:inset 0 0 0 1px var(--line)}
.a-paper .bub.ai small{color:var(--link)}

/* Caso de éxito y sectores */
.c-ficha{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;border-radius:20px;overflow:hidden;background:var(--line)}
.c-ficha div{padding:16px 18px;background:#0A1633}
.c-ficha small{display:block;font:500 11.5px 'Poppins',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.c-ficha b{display:block;margin-top:4px;font:500 15px 'Poppins',sans-serif}
.c-figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 32px;margin-top:clamp(48px,6vw,80px)}
.c-figs .num{font-size:clamp(48px,5.4vw,84px)}
.c-perfiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:6px 0 26px}
.s-convs{display:grid;gap:12px;margin:6px 0 30px}
.s-conv{display:grid;grid-template-columns:44px minmax(0,1fr);gap:16px;padding:20px;border-radius:20px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 14px 30px -24px rgba(14,22,48,.4)}
.s-conv i{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;font:600 15px 'JetBrains Mono',monospace;font-style:normal;color:#fff;background:linear-gradient(135deg,#0063D1,#6B5CFF)}
.s-conv b{display:block;font:600 16px 'Poppins',sans-serif;color:var(--ink)}
.prose .s-conv p{margin:4px 0 0;font-size:15.5px;line-height:1.55}
.s-proof{margin:8px 0 30px;padding:26px;border-radius:24px;background:#0A1633;color:#F2F6FF}
.s-proof .eyebrow{font-size:11.5px}
.prose .s-proof h3{margin:12px 0 8px;color:#fff}
.prose .s-proof p{margin:0 0 16px;color:#C3D0EA;font-size:16px}
.s-proof .s-nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:6px 0 18px}
.s-proof .s-nums b{display:block;font:500 34px/1 'Poppins',sans-serif;letter-spacing:-.04em;color:#fff}
.s-proof .s-nums span{display:block;margin-top:6px;font-size:13.5px;line-height:1.45;color:#C3D0EA}
.prose .s-proof a:not(.btn){color:#4FD1FF}
.s-gs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:6px 0 10px}
.s-gs .e-mod small{display:block;margin-top:2px;font:500 12px 'Poppins',sans-serif;color:var(--mute)}
.s-note{font-size:13.5px!important;color:var(--mute)!important}

@media (max-width:1000px){
  .e-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .e-steps{grid-template-columns:minmax(0,1fr)}
  .c-ficha{grid-template-columns:repeat(2,minmax(0,1fr))}
  .c-figs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .c-perfiles{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  .e-grid,.e-mods,.s-gs{grid-template-columns:minmax(0,1fr)}
  .s-proof .s-nums{grid-template-columns:minmax(0,1fr)}
  .e-cta .btn{width:100%;justify-content:center}
}

/* Calculadora como página propia */
.calc-wrap{max-width:820px;margin:0 auto}

/* Herramientas gratuitas */
.t-card .body{gap:12px;padding:26px}
.t-ico{display:grid;place-items:center;width:48px;height:48px;border-radius:16px;font:600 20px 'Poppins',sans-serif;color:#fff;background:linear-gradient(135deg,var(--blue),var(--violet));box-shadow:0 12px 30px -12px rgba(0,126,254,.8)}
.t-hero{margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;aspect-ratio:4/3;border-radius:clamp(22px,2.4vw,32px);background:radial-gradient(80% 80% at 50% 30%,rgba(0,126,254,.35),rgba(8,17,39,.9));box-shadow:inset 0 0 0 1px rgba(160,200,255,.16),0 60px 120px -60px rgba(0,80,220,.6);text-align:center}
.t-ico.big{width:72px;height:72px;border-radius:22px;font-size:30px}
.t-hero b{font:500 clamp(64px,8vw,110px)/1 'Poppins',sans-serif;letter-spacing:-.05em}
.t-hero span:last-child{font:500 15px 'Poppins',sans-serif;color:var(--ink2)}
.t-next{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:8px 0 30px}
.t-next a.e-mod{transition:transform .3s var(--ease),box-shadow .3s}
.t-next a.e-mod:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1.5px var(--link),0 18px 36px -22px rgba(0,99,209,.45)}
.prose .t-next a{background-image:none;color:inherit}
@media (max-width:900px){.t-next{grid-template-columns:minmax(0,1fr)}.t-hero{aspect-ratio:auto;padding:40px 20px}}

/* Listado de soluciones */
.s-card .body{padding:24px}
.s-card h3{font-size:24px}
.s-more{margin-top:34px;color:var(--ink2);display:flex;flex-wrap:wrap;gap:10px;align-items:center}

.e-card .e-quote{font-family:Poppins,sans-serif;font-size:15px;line-height:1.45;color:#fff;margin:0 0 10px;font-style:italic}
.e-seo{color:var(--ink,#cfd6e6)}