/* ===================================================================
   Plantilla "editorial" para páginas de solución (layout:'editorial' en data.js).
   Todo va con prefijo ed- para no chocar con styles.css.
   El movimiento vive en /js/editorial.js; sin JS o con prefers-reduced-motion
   la página queda completa y estática.
   =================================================================== */
.ed{
  --ed-night:radial-gradient(120% 90% at 12% -10%,rgba(255,255,255,.07),transparent 55%),
             linear-gradient(168deg,#232a33 0%,#141920 52%,#0b0d11 100%);
  --ed-soft:#85858a;
}

/* Lenis: anula el scroll-behavior:smooth global mientras está activo */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto !important}
.lenis.lenis-stopped{overflow:hidden}

/* Estados previos al movimiento: solo existen si el script de <head> puso la clase */
html.ed-motion [data-ed-hero],html.ed-motion [data-ed-pre],html.ed-motion [data-ed-split],
html.ed-motion [data-ed-fade],html.ed-motion [data-ed-stagger] > *{visibility:hidden}
.ed-w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .05em .14em;margin:0 -.05em -.14em}
.ed-wi{display:inline-block;will-change:transform}
.ed-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- Estructura ---------- */
.ed-wrap{max-width:var(--maxw);margin:0 auto;padding:0 2rem}
.ed-sec{padding:clamp(4rem,9vw,8.5rem) 0}
.ed-sec--flush{padding-top:0}
.ed-head{margin-bottom:clamp(2rem,4.6vw,4rem)}
.ed-h2,.ed-page .detail-section > .block-head > .block-title{
  font-family:var(--font-display);font-size:clamp(2.1rem,5.2vw,4.2rem);font-weight:500;
  letter-spacing:-.035em;line-height:1;margin:0;max-width:16em}
.ed-page .detail-section > .block-head{max-width:none;margin-bottom:clamp(2rem,4.6vw,4rem)}
.ed-grainy{position:relative;overflow:hidden;isolation:isolate}
.ed-grainy::after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:var(--grain);background-size:150px 150px;mix-blend-mode:overlay;opacity:.17}
.ed-grainy > *{position:relative;z-index:1}

/* ---------- Héroe ---------- */
.ed-hero{position:relative;padding:9rem 0 clamp(3.5rem,7vw,6.5rem)}
.ed-hero .breadcrumb{margin-bottom:clamp(2rem,4vw,3.4rem)}
.ed-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(2rem,5vw,5rem);align-items:end}
.ed-title{font-family:var(--font-display);font-size:clamp(3.4rem,9.4vw,8.4rem);font-weight:500;letter-spacing:-.05em;
  line-height:.9;margin:0 0 clamp(1.4rem,3vw,2.4rem)}
.ed-title--long{font-size:clamp(2.6rem,5.6vw,5rem);letter-spacing:-.04em;line-height:.96}
.ed-lead{font-size:clamp(1.1rem,1.6vw,1.35rem);line-height:1.45;color:var(--gray);max-width:38ch;margin:0 0 2rem}
.ed-actions{display:flex;gap:.7rem;flex-wrap:wrap}
.ed-pad{border-radius:22px;padding:26px;background:var(--ed-night);color:#fff;box-shadow:0 44px 80px -44px rgba(0,0,0,.6)}
.ed-pad-top{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:16px;margin-bottom:14px;
  border-bottom:1px solid rgba(255,255,255,.1)}
.ed-pad-top b{display:block;font-weight:600;font-size:.98rem}
.ed-pad-top span{font:400 .62rem var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.ed-pad-dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);outline:5px solid rgba(45,195,253,.16)}
.ed-pad-label{font:400 .6rem var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55);margin:0 0 10px}
.ed-pad-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}

/* Mosaico del launchpad (espécimen de interfaz) */
.ed-tile{display:flex;flex-direction:column;min-height:128px;padding:14px;border-radius:12px;color:#e8eaee;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.ed-tile.is-accent{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.2)}
.ed-tile-ic{width:30px;height:30px;border-radius:9px;background:rgba(255,255,255,.07);display:grid;place-items:center;color:#c6c9d1;margin-bottom:10px}
.ed-tile-ic svg{width:17px;height:17px}
.ed-tile b{font-weight:600;font-size:.82rem;line-height:1.2}
.ed-tile-c{font:400 .6rem var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-top:2px}
.ed-tile-v{margin-top:auto;padding-top:10px;display:flex;align-items:baseline;gap:.4rem;flex-wrap:wrap}
.ed-tile-v strong{font-size:1.12rem;font-weight:700;letter-spacing:-.02em}
.ed-tile-v em{font:400 .6rem var(--font-mono);font-style:normal;color:rgba(255,255,255,.55)}
.ed-tile-bars{margin-top:auto;padding-top:10px;display:flex;align-items:flex-end;gap:5px;height:44px}
.ed-tile-bars i{width:8px;height:var(--h);border-radius:2px;background:rgba(255,255,255,.3)}
.ed-tile-line{margin-top:auto;padding-top:10px;height:44px;width:100%;display:block;overflow:visible}
.ed-tile-dots{margin-top:auto;padding-top:14px;display:grid;grid-template-columns:repeat(4,5px);gap:7px 14px}
.ed-tile-dots i{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.22)}
.ed-tile-dots i:nth-child(-n+2){background:rgba(255,255,255,.62)}

/* ---------- Qué es ---------- */
.ed-about{padding-top:clamp(2.5rem,5vw,5rem)}
.ed-statement{font-family:var(--font-display);font-size:clamp(1.6rem,3.7vw,3.1rem);font-weight:500;letter-spacing:-.03em;
  line-height:1.14;margin:0;max-width:21em;color:var(--ink)}
.ed-statement .ed-w{overflow:visible}
.ed-about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,6rem);
  margin-top:clamp(2.5rem,6vw,5rem);padding-top:2rem;border-top:1px solid var(--line-strong)}
.ed-about-grid > div > p{margin:0 0 1rem;color:var(--gray);font-size:1.08rem;max-width:46ch}
.ed-about-grid > div > p:last-child{margin-bottom:0}
.ed-points{list-style:none;margin:0;padding:0}
.ed-points li{padding:1rem 0;border-top:1px solid var(--line-strong)}
.ed-points li:first-child{border-top:0;padding-top:0}
.ed-points strong{display:block;font-weight:500;font-size:1.1rem}
.ed-points span{color:var(--gray)}

/* ---------- Modelos de despliegue ---------- */
.ed-models{display:grid;grid-template-columns:repeat(var(--cols,2),minmax(0,1fr));gap:1.3rem}
.ed-mcard{border-radius:20px;padding:clamp(1.5rem,3vw,2.4rem);color:#fff;
  background:radial-gradient(130% 120% at 15% -10%,rgba(255,255,255,.08),transparent 55%),
  linear-gradient(162deg,color-mix(in srgb,var(--dm) 88%,#fff 12%) 0%,var(--dm) 48%,color-mix(in srgb,var(--dm) 62%,#000 38%) 100%)}
.ed-mcard-k{font:400 .68rem var(--font-mono);letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.64)}
.ed-mcard h3{font-family:var(--font-display);font-size:clamp(1.5rem,2.6vw,2.2rem);font-weight:500;letter-spacing:-.03em;line-height:1.05;margin:.6rem 0 1.5rem}
.ed-mcard dl{margin:0;display:grid;gap:.5rem}
.ed-mcard dl div{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem .95rem;border-radius:12px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13)}
.ed-mcard dt{font:400 .64rem var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.ed-mcard dd{margin:0;font-weight:500;font-size:.95rem;text-align:right}
.ed-mcard p{margin:1.3rem 0 0;color:rgba(255,255,255,.76);font-size:.92rem}

/* ---------- Beneficios (se fija y avanza en horizontal en escritorio) ---------- */
.ed-benx{padding:clamp(5.5rem,9vw,7rem) 0 clamp(3rem,6vw,5rem);overflow:hidden;min-height:100svh;
  display:flex;flex-direction:column;justify-content:center}
.ed-benx > .ed-wrap{width:100%}
.ed-benx .ed-head{margin-bottom:clamp(1.8rem,4vw,3rem)}
.ed-benx-view{overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}
.ed-benx-view::-webkit-scrollbar{display:none}
.ed-benx.is-pinned .ed-benx-view{overflow:visible}
.ed-benx-track{list-style:none;margin:0;display:flex;gap:20px;padding:0 max(2rem,calc((100vw - var(--maxw)) / 2 + 2rem));width:max-content}
.ed-bcard{scroll-snap-align:start;width:min(80vw,430px);min-height:clamp(300px,42vh,390px);display:flex;flex-direction:column;
  padding:28px;border-radius:18px;background:#fff;border:1px solid var(--line-strong)}
.ed-bcard .n{font:400 .78rem var(--font-mono);color:var(--blue)}
.ed-bcard h3{font-family:var(--font-display);font-size:clamp(1.5rem,2.4vw,2rem);font-weight:500;letter-spacing:-.03em;line-height:1.08;
  margin:auto 0 .9rem;padding-top:2rem}
.ed-bcard p{margin:0;color:var(--gray)}
.ed-benx-bar{display:none;height:2px;background:var(--line-strong);max-width:calc(var(--maxw) - 4rem);width:calc(100% - 4rem);margin:2.2rem auto 0}
.ed-benx.is-pinned .ed-benx-bar{display:block}
.ed-benx-bar i{display:block;height:100%;background:var(--ink);transform-origin:left;transform:scaleX(0)}
/* Variante con 3 o menos beneficios: una fila, sin fijar la sección */
.ed-benx--grid{min-height:0;padding:clamp(4rem,9vw,8.5rem) 0}
.ed-benx--grid .ed-benx-view{overflow:visible}
.ed-benx--grid .ed-benx-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:auto;max-width:var(--maxw);margin:0 auto;padding:0 2rem}
.ed-benx--grid .ed-bcard{width:auto;min-height:230px}

/* ---------- Alcance ---------- */
.ed-scope{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:clamp(2rem,6vw,6rem);border-bottom:1px solid var(--line-strong)}
.ed-scope li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:.25rem 1rem;padding:1.5rem 0;border-top:1px solid var(--line-strong)}
.ed-scope .n{font:400 .76rem var(--font-mono);color:var(--blue);padding-top:.35rem}
.ed-scope h3{font-family:var(--font-display);font-size:1.2rem;font-weight:500;letter-spacing:-.015em;line-height:1.25;margin:0}
.ed-scope p{grid-column:2;margin:0;color:var(--gray);font-size:.96rem}

/* ---------- Preguntas frecuentes ---------- */
.ed-faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.ed-faq-grid .ed-head{position:sticky;top:7rem;margin:0}
.ed-faq{border-bottom:1px solid var(--line-strong)}
.ed-faq details{border-top:1px solid var(--line-strong)}
.ed-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.45rem 0;
  font-family:var(--font-display);font-size:clamp(1.08rem,1.7vw,1.3rem);font-weight:500;letter-spacing:-.015em;line-height:1.25}
.ed-faq summary::-webkit-details-marker{display:none}
.ed-faq summary:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.ed-faq summary svg{flex:none;width:24px;height:24px;color:var(--gray);transition:transform .45s var(--ease),color .3s}
.ed-faq summary:hover svg{color:var(--ink)}
.ed-faq details[open] summary svg{transform:rotate(45deg);color:var(--ink)}
.ed-faq details p{margin:0;padding:0 3rem 1.7rem 0;color:var(--gray);max-width:68ch}

/* ===================================================================
   Páginas de industria: foto a pantalla completa, retos en banda oscura
   y soluciones mostradas con su panel
   =================================================================== */
.ed-ind-hero{position:relative;min-height:max(92svh,760px);padding:0;display:flex;flex-direction:column;justify-content:flex-end;
  color:#fff;background:#0b0d11;overflow:hidden;isolation:isolate}
.ed-ind-hero > .ed-wrap{position:relative;z-index:2;width:100%;padding-top:9rem;padding-bottom:clamp(2.5rem,5vw,4.5rem)}
.ed-ind-bg{position:absolute;inset:0;z-index:0}
.ed-ind-bg img{position:absolute;left:0;top:-6%;width:100%;height:112%;object-fit:cover;filter:saturate(.9) brightness(.82)}
.ed-ind-bg::after{content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,9,13,.6) 0%,rgba(8,9,13,.22) 38%,rgba(8,9,13,.94) 100%),
             linear-gradient(100deg,rgba(8,9,13,.72),rgba(8,9,13,.08) 72%)}
.ed-ind-hero::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:var(--grain);background-size:150px 150px;mix-blend-mode:overlay;opacity:.16}
.ed-ind-hero .breadcrumb,.ed-ind-hero .breadcrumb a{color:rgba(255,255,255,.72)}
.ed-ind-hero .breadcrumb a:hover{color:#fff}
.ed-ind-hero .breadcrumb .cur{color:#fff}
.ed-ind-hero .breadcrumb .sep{color:rgba(255,255,255,.4)}
.ed-ind-hero .eyebrow{color:rgba(255,255,255,.78)}
.ed-ind-hero .ed-title{font-size:clamp(3rem,8.4vw,7.6rem);color:#fff;margin-bottom:0;max-width:11em}
.ed-ind-row{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;
  margin-top:clamp(1.6rem,3vw,2.4rem);padding-top:1.6rem;border-top:1px solid rgba(255,255,255,.24)}
.ed-ind-row .ed-lead{color:rgba(255,255,255,.86);margin:0;max-width:44ch}
.ed-ind-hero .btn--primary{background:#fff;color:#040302;border-color:#fff}
.ed-ind-hero .btn--primary:hover{background:#e4e6e8;border-color:#e4e6e8;color:#040302;transform:none;box-shadow:none}
.ed-ind-hero .btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
.ed-ind-hero .btn--ghost:hover{border-color:#fff;color:#fff}
.ed-ind-retos{background:#0b0d11;color:#fff;padding:clamp(3rem,6vw,5rem) 0 clamp(4rem,8vw,7rem)}
.ed-ind-retos .block-kicker{color:rgba(255,255,255,.66)}
.ed-ind-retos .ed-h2{color:#fff}
.ed-ind-retos ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr))}
.ed-ind-retos li{padding:0 1.6rem;border-left:1px solid rgba(255,255,255,.16)}
.ed-ind-retos li:first-child{padding-left:0;border-left:0}
.ed-ind-retos .n{display:block;font-family:var(--font-display);font-size:3rem;font-weight:500;letter-spacing:-.04em;line-height:1;margin-bottom:1.6rem}
.ed-ind-retos h3{font-family:var(--font-display);font-size:1.35rem;font-weight:500;letter-spacing:-.015em;line-height:1.2;margin:0 0 .5rem;color:#fff}
.ed-ind-retos p{margin:0;color:rgba(255,255,255,.76)}
.ed-ind-pads{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6rem}
.ed-ind-pad{margin:0}
.ed-ind-cap{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-top:1.2rem}
.ed-ind-cap h3{font-family:var(--font-display);font-size:1.6rem;font-weight:500;letter-spacing:-.025em;line-height:1.1;margin:0}
.ed-ind-cap h3 small{display:block;font:400 .66rem var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:.4rem}
.ed-ind-cap a{flex:none;font:500 .72rem var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:inherit;text-decoration:none;
  border-bottom:1px solid currentColor;padding-bottom:3px}
.ed-ind-cap a:hover{color:var(--blue)}
.ed-ind-cap a:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.ed-ind-rest{margin-top:2.6rem;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6rem}
.ed-ind-all{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1000px){ .ed-ind-all{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(max-width:600px){ .ed-ind-all,.ed-ind-rest{grid-template-columns:1fr} }
.ed-ind-pads--one{align-items:start}
.ed-ind-pads--one .ed-ind-side{grid-template-columns:1fr;gap:1rem;margin:0}

@media(max-width:860px){
  .ed-ind-hero{min-height:88svh}
  .ed-ind-retos ol,.ed-ind-pads{grid-template-columns:1fr}
  .ed-ind-retos li,.ed-ind-retos li:first-child{padding:1.5rem 0;border-left:0;border-top:1px solid rgba(255,255,255,.16)}
  .ed-ind-retos li:first-child{border-top:0;padding-top:0}
  .ed-ind-retos .n{font-size:2.2rem;margin-bottom:.8rem}
  .ed-ind-pads{gap:2.4rem}
  .ed-wrap{padding:0 1.4rem}
  .ed-hero{padding-top:7.5rem}
  .ed-hero-grid,.ed-about-grid,.ed-models,.ed-scope,.ed-faq-grid{grid-template-columns:1fr}
  .ed-pad{padding:18px}
  .ed-pad-grid{gap:8px}
  .ed-tile{min-height:112px;padding:11px}
  .ed-benx{min-height:0;padding-top:clamp(4rem,9vw,5.5rem)}
  .ed-benx-track{padding:0 1.4rem}
  .ed-benx--grid .ed-benx-track{grid-template-columns:1fr;padding:0 1.4rem}
  .ed-benx--grid .ed-bcard{min-height:0}
  .ed-benx--grid .ed-bcard h3{padding-top:1.2rem}
  .ed-faq-grid .ed-head{position:static;margin-bottom:1.5rem}
  .ed-faq details p{padding-right:0}
}
