/*
Theme Name:  ADA Artículos
Theme URI:   https://ada.co/
Description: Tema hijo de Genesis Block Theme. Le da a las entradas del blog la misma
             identidad visual que las páginas nuevas de ada.co: misma navegación,
             mismo pie, misma tipografía y misma paleta. No afecta a las páginas
             construidas con Elementor Lienzo.
Author:      ADA S.A.S.
Template:    genesis-block-theme
Version:     1.0.0
Text Domain: ada-articulos
*/


/* ==========================================================
   ADA — Software Factory · 1991–2026
   Conforme al Manual de Marca 2026 ADA RGB.
   Paleta oficial: #038C83 · #34C094 · #80EBBD · #ADFFDA ·
   #3F3E3D · #8E8E8E · #DCDCDB · #FFFFFF.
   Los oscuros de planta (#011C1A / #012E2B / #013B37) no son
   colores nuevos: son el primario #038C83 al 20 %, 33 % y 42 %
   de luminancia, para poder tener superficies oscuras.
   Tipografía: Roboto, como manda el manual. Roboto Flex para
   titulares (eje de ancho expandido = señalética de planta) y
   Roboto Mono para códigos y lecturas de línea.
   ========================================================== */

/* El tema de WordPress fija html{font-size:62.5%} = 10px, lo que encogía
   toda la escala tipográfica al 62,5%. La devolvemos a 16px en esta página. */
:root{ font-size:16px; }

:root{
  --bg:#F4F6F5; --surface:#FFFFFF; --surface-2:#E9EEEC;
  --line:#DCDCDB; --line-soft:#E8E8E7;
  --text:#3F3E3D; --text-2:#6E6D6B;

  /* planta de producción: oscuros derivados del primario #038C83
     (no son colores nuevos, son el primario a 20 %, 33 % y 42 % de luminancia) */
  --floor:#011C1A; --floor-2:#012E2B; --floor-3:#013B37;
  --floor-line:rgba(128,235,189,.16);
  --floor-text:#FFFFFF; --floor-text-2:#8E8E8E;

  /* banda de papel: siempre clara, para que los logos lean igual en ambos temas */
  --paper:#FFFFFF; --paper-2:#F7F8F7; --paper-line:#DCDCDB; --paper-text:#6E6D6B;

  /* paleta oficial del manual de marca */
  --teal:#038C83; --green:#34C094; --mint:#80EBBD; --mint-hi:#ADFFDA;
  --ink:#3F3E3D; --grey:#8E8E8E; --grey-soft:#DCDCDB;
  /* primario oscurecido (x0,77) para texto y enlaces sobre fondo claro */
  --teal-deep:#026B65;

  --accent:var(--teal-deep); --accent-soft:rgba(3,140,131,.10);

  --maxw:1200px; --pad:clamp(1.25rem,4vw,2.5rem);
  --mono:"Roboto Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:"Roboto","Helvetica Neue",system-ui,-apple-system,sans-serif;
  --disp:"Roboto Flex","Roboto","Helvetica Neue",system-ui,sans-serif;

  /* cinemática: 3312px por ciclo en 46s ≈ 72 px/s */
  --belt-cycle:46s; --tread-cycle:.2778s;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#011512; --surface:#012421; --surface-2:#012E2B;
    --line:rgba(128,235,189,.15); --line-soft:rgba(128,235,189,.09);
    --text:#FFFFFF; --text-2:#A9A9A8;
    --accent:var(--mint); --accent-soft:rgba(128,235,189,.10);
  }
}
:root[data-theme="dark"]{
  --bg:#011512; --surface:#012421; --surface-2:#012E2B;
  --line:rgba(128,235,189,.15); --line-soft:rgba(128,235,189,.09);
  --text:#FFFFFF; --text-2:#A9A9A8;
  --accent:var(--mint); --accent-soft:rgba(128,235,189,.10);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--sans); font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
:focus-visible{ outline:2px solid var(--mint); outline-offset:3px; border-radius:2px; }

/* ---------- tipografía ---------- */
.display{
  font-family:var(--disp); font-weight:700; font-stretch:132%;
  letter-spacing:-.022em; line-height:1.03; text-wrap:balance; margin:0;
}
h1.display{ font-size:clamp(2.6rem,5.6vw,4.5rem); }
h2.display{ font-size:clamp(1.85rem,3.6vw,2.9rem); line-height:1.07; }
h3{
  font-family:var(--disp); font-weight:600; font-stretch:118%;
  font-size:1.2rem; line-height:1.28; letter-spacing:-.01em; margin:0; text-wrap:balance;
}
h4{ font-family:var(--disp); font-weight:600; font-stretch:115%; font-size:1rem; line-height:1.3; margin:0; }
p{ margin:0; }
.lede{ font-size:clamp(1.04rem,1.4vw,1.17rem); color:var(--text-2); max-width:64ch; }
.tag{ font-family:var(--mono); font-size:.7rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; }

/* ---------- estructura ---------- */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }
section{ padding-block:clamp(4rem,8vw,7rem); }
.floor{ background:var(--floor); color:var(--floor-text); }
.floor .lede{ color:var(--floor-text-2); }
.tint{ background:var(--surface-2); }
.paper{ background:var(--paper-2); color:var(--ink); }
.paper .lede{ color:var(--paper-text); }
.paper .tag{ color:var(--teal-deep); }

.sec-head{ display:flex; flex-direction:column; gap:1rem; margin-bottom:clamp(2.25rem,4.5vw,3.5rem); }
.sec-head .tag{ color:var(--accent); }
.floor .sec-head .tag{ color:var(--mint); }
.sec-head--split{ display:grid; gap:1.5rem 3rem; align-items:end; }
@media (min-width:900px){ .sec-head--split{ grid-template-columns:1.3fr .7fr; } }

.stack{ display:flex; flex-direction:column; }
.gap-s{ gap:.75rem; } .gap-m{ gap:1.25rem; } .gap-l{ gap:2rem; }


/* ---------- monitores grandes ----------
   Hasta 1400 px nada cambia. De ahí en adelante el contenido se ensancha
   y la tipografía sube, para que la página no quede como una franja
   angosta en el centro de una pantalla de 2000 px. */
@media (min-width:1500px){
  :root{ --maxw:1400px; }
  body{ font-size:18px; }
  h1.display{ font-size:5.2rem; }
  h2.display{ font-size:3.3rem; }
  h3{ font-size:1.32rem; }
  .lede{ font-size:1.28rem; }
  .hero__sub{ font-size:1.26rem; }
  section{ padding-block:8rem; }
  .btn{ font-size:1rem; padding:.92rem 1.65rem; }
  .offer h3{ font-size:1.5rem; }
  .offer > p{ font-size:1.04rem; }
  .offer li, .uen li{ font-size:.95rem; }
  .cred__n{ font-size:2.6rem; }
  .factory{ height:clamp(430px,34vw,540px); }
  .seal35{ width:132px; }
  img.prodmark{ height:38px; }
  img.prodmark--light{ height:32px; }
}
@media (min-width:1800px){
  :root{ --maxw:1520px; }
  body{ font-size:19px; }
  h1.display{ font-size:5.8rem; }
  h2.display{ font-size:3.6rem; }
}

/* ---------- botones ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.55rem;
  font-family:var(--sans); font-weight:600; font-size:.94rem;
  padding:.82rem 1.45rem; border-radius:999px; text-decoration:none;
  border:1px solid transparent;
  transition:transform .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease;
}
.btn:hover{ transform:translateY(-2px); }
.btn-solid{ background:var(--mint); color:#011C1A; }
.btn-solid:hover{ background:var(--mint-hi); }
.btn-ghost{ border-color:var(--floor-line); color:var(--floor-text); }
.btn-ghost:hover{ border-color:var(--mint); color:var(--mint); }
/* #026B65 y no #038C83: blanco sobre el primario da 4,13:1 y no pasa AA */
.btn-dark{ background:var(--teal-deep); color:#fff; }
.btn-dark:hover{ background:var(--teal); }

/* ---------- barra de progreso y navegación ---------- */
.progress{
  position:fixed; top:0; left:0; height:2px; width:100%; z-index:70;
  transform:scaleX(0); transform-origin:left;
  background:linear-gradient(90deg, var(--teal), var(--mint));
}
.nav{
  position:sticky; top:0; z-index:60;
  background:rgba(1,28,26,.9); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--floor-line);
}
.nav__in{
  display:flex; align-items:center; gap:1.75rem; height:72px;
  max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad);
}
.brand{ display:flex; align-items:center; flex:none; }
.brand img{ height:30px; width:auto; }
.nav__links{ display:flex; gap:1.5rem; margin-left:auto; }
.nav__links a{
  font-size:.88rem; font-weight:500; text-decoration:none;
  color:var(--floor-text-2); transition:color .18s ease; white-space:nowrap;
}
.nav__links a:hover{ color:var(--mint); }
.nav .btn{ padding:.58rem 1.1rem; font-size:.84rem; }
.lang{ display:flex; align-items:center; gap:.2rem; font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; }
.lang button{
  background:none; border:0; padding:.3rem .35rem; cursor:pointer;
  color:var(--floor-text-2); font:inherit; letter-spacing:inherit;
  transition:color .18s ease;
}
.lang button:hover{ color:var(--mint); }
.lang button[aria-pressed="true"]{ color:var(--mint); font-weight:500; }
.lang span{ color:var(--floor-line); }
@media (max-width:1040px){ .nav__links{ display:none; } .lang{ margin-left:auto; } }
@media (max-width:560px){ .nav__cta{ display:none; } }

/* ---------- hero ---------- */
.hero{
  position:relative; overflow:hidden;
  background:
    radial-gradient(120% 78% at 78% -14%, rgba(3,140,131,.42) 0%, transparent 58%),
    radial-gradient(78% 58% at 4% 106%, rgba(128,235,189,.12) 0%, transparent 62%),
    var(--floor);
  color:var(--floor-text); padding-block:clamp(2.5rem,5vw,4rem) 0;
}
.hero::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(to right, rgba(128,235,189,.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(128,235,189,.05) 1px, transparent 1px);
  background-size:56px 56px;
  background-position:0 calc(var(--par,0) * 1px);
  mask-image:linear-gradient(to bottom, #000 0%, transparent 82%);
}
.hero__in{ position:relative; z-index:1; display:grid; gap:2rem 3rem; align-items:center; }
@media (min-width:960px){ .hero__in{ grid-template-columns:minmax(0,44%) minmax(0,1fr); } }
.hero__eyebrow{
  display:flex; flex-wrap:wrap; align-items:center; gap:.5rem .85rem;
  color:var(--mint); margin-bottom:1.5rem;
}
.hero__eyebrow .dot{ width:4px; height:4px; border-radius:50%; background:var(--mint); opacity:.55; }
.hero h1 em{ font-style:normal; color:var(--mint); }
.hero__sub{ margin-top:1.5rem; color:var(--floor-text-2); font-size:clamp(1.02rem,1.35vw,1.14rem); }
.hero__cta{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem; }
.hero__mini{ display:flex; flex-wrap:wrap; gap:.4rem 1.25rem; margin-top:1.6rem; color:var(--floor-text-2); }
.hero__mini span{ display:flex; align-items:center; gap:.4rem; font-size:.78rem; }
.hero__mini svg{ width:12px; height:12px; color:var(--mint); flex:none; }


/* ---------- sello de aniversario ---------- */
.seal35{
  position:absolute; z-index:2; pointer-events:none;
  top:clamp(1rem,3vw,2.25rem); right:clamp(1rem,4vw,2.5rem);
  width:clamp(76px,9vw,118px); aspect-ratio:1;
}
.seal35 svg{ width:100%; height:100%; display:block; overflow:visible; }
.s35-borde{ fill:none; stroke:var(--mint); stroke-width:1.5; opacity:.45; }
.s35-borde--fina{ stroke-width:1; opacity:.28; }
.s35-aro{
  font-family:var(--mono); font-size:8.4px; letter-spacing:.24em;
  fill:var(--mint); opacity:.75;
}
.s35-giro{ transform-box:view-box; transform-origin:60px 60px; animation:girar-sello 34s linear infinite; }
@keyframes girar-sello{ to{ transform:rotate(360deg); } }
.s35-num{
  font-family:var(--disp); font-weight:700; font-stretch:126%;
  font-size:34px; letter-spacing:-.03em; fill:#fff; text-anchor:middle;
}
.s35-lbl{
  font-family:var(--mono); font-size:8.6px; letter-spacing:.28em;
  fill:var(--mint); text-anchor:middle;
}
@media (max-width:900px){ .hero__eyebrow{ max-width:70%; } }

/* ---------- la fábrica animada ---------- */
.factory{ position:relative; width:100%; aspect-ratio:4/3; }
@media (min-width:700px){ .factory{ aspect-ratio:16/10; } }
@media (min-width:960px){ .factory{ aspect-ratio:auto; height:clamp(360px,42vw,470px); } }
.factory svg{ width:100%; height:100%; display:block; overflow:visible; }
.fx-line{ fill:none; stroke:var(--mint); stroke-linecap:round; stroke-linejoin:round; }
.fx-dim{ opacity:.35; } .fx-mid{ opacity:.6; }
.fx-fill{ fill:var(--mint); }
.fx-body{ fill:rgba(1,59,55,.9); stroke:var(--mint); stroke-width:2; opacity:.95; }
.fx-label{ font-family:var(--mono); font-size:13px; letter-spacing:.18em; fill:var(--mint); opacity:.75; }

.gear{ transform-box:fill-box; transform-origin:center; animation:spin 9s linear infinite; }
.gear--rev{ animation:spin 9s linear infinite reverse; }
.gear--fast{ animation-duration:5.5s; }
@keyframes spin{ to{ transform:rotate(360deg); } }

.piston{ transform-box:fill-box; transform-origin:center; animation:stamp 2.2s cubic-bezier(.5,0,.5,1) infinite; }
@keyframes stamp{ 0%,45%{ transform:translateY(0);} 58%{ transform:translateY(26px);} 75%,100%{ transform:translateY(0);} }

.puff{ transform-box:fill-box; transform-origin:center; opacity:0; animation:puff 3.6s ease-out infinite; }
.puff:nth-of-type(2){ animation-delay:1.2s; } .puff:nth-of-type(3){ animation-delay:2.4s; }
@keyframes puff{
  0%{ opacity:0; transform:translate(0,0) scale(.5); }
  25%{ opacity:.55; }
  100%{ opacity:0; transform:translate(26px,-92px) scale(1.7); }
}

.flowline{ stroke-dasharray:7 13; animation:flow 1.4s linear infinite; }
@keyframes flow{ to{ stroke-dashoffset:-40; } }

.spark{ transform-box:fill-box; transform-origin:center; opacity:0; animation:spark 2.2s ease-out infinite; }
.spark:nth-of-type(2){ animation-delay:.12s; } .spark:nth-of-type(3){ animation-delay:.24s; }
@keyframes spark{ 0%,52%{ opacity:0; transform:translate(0,0) scale(.4);} 60%{ opacity:1;} 82%,100%{ opacity:0; transform:translate(var(--sx,14px),var(--sy,-20px)) scale(1);} }

.idea{ transform-box:fill-box; transform-origin:center; animation:bob 4.5s ease-in-out infinite alternate; }
@keyframes bob{ from{ transform:translate(0,6px) rotate(-3deg);} to{ transform:translate(0,-8px) rotate(3deg);} }

.crumb{ transform-box:fill-box; transform-origin:center; opacity:0; animation:crumb 3.2s linear infinite; }
.crumb:nth-of-type(2){ animation-delay:1.05s; } .crumb:nth-of-type(3){ animation-delay:2.1s; }
@keyframes crumb{ 0%{ opacity:0; transform:translate(0,0);} 12%{ opacity:.9;} 88%{ opacity:.9;} 100%{ opacity:0; transform:translate(150px,26px);} }

.ship{ transform-box:fill-box; transform-origin:center; opacity:0; animation:ship 4.2s cubic-bezier(.4,0,.5,1) infinite; }
.ship:nth-of-type(2){ animation-delay:1.4s; } .ship:nth-of-type(3){ animation-delay:2.8s; }
@keyframes ship{
  0%{ opacity:0; transform:translate(-30px,-14px) scale(.85); }
  18%{ opacity:1; }
  70%{ opacity:1; transform:translate(96px,54px) scale(1); }
  100%{ opacity:0; transform:translate(150px,86px) scale(1); }
}

.lamp{ animation:blink 2.4s steps(1,end) infinite; }
.lamp:nth-of-type(2){ animation-delay:.6s; }
.lamp:nth-of-type(3){ animation-delay:1.2s; }
.lamp:nth-of-type(4){ animation-delay:1.8s; }
@keyframes blink{ 0%,22%{ opacity:1; } 23%,100%{ opacity:.22; } }

.codeline{ animation:type 3s steps(1,end) infinite; }
.codeline:nth-of-type(2){ animation-delay:.5s; }
.codeline:nth-of-type(3){ animation-delay:1s; }
.codeline:nth-of-type(4){ animation-delay:1.5s; }
.codeline:nth-of-type(5){ animation-delay:2s; }
@keyframes type{ 0%,12%{ opacity:.15; } 16%,100%{ opacity:.85; } }

/* ---------- banda transportadora ---------- */
.belt{ position:relative; margin-top:clamp(2rem,4vw,3rem); }
.belt__label{
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
  max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad);
  color:var(--floor-text-2); margin-bottom:.9rem;
}
.belt__label b{ color:var(--mint); font-weight:500; }
.belt__viewport{
  position:relative; overflow:hidden; padding-block:.25rem;
  mask-image:linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.belt__track{ display:flex; width:max-content; animation:belt-run var(--belt-cycle) linear infinite; }
@keyframes belt-run{ from{ transform:translate3d(0,0,0);} to{ transform:translate3d(-3312px,0,0);} }
.unit{
  width:252px; margin-right:24px; flex:none;
  background:linear-gradient(158deg, var(--floor-3) 0%, var(--floor-2) 100%);
  border:1px solid var(--floor-line); border-radius:4px;
  padding:1.05rem 1.1rem 1.15rem; position:relative;
}
.unit::before,.unit::after{ content:""; position:absolute; width:9px; height:9px; border-color:var(--mint); border-style:solid; opacity:.5; }
.unit::before{ top:6px; left:6px; border-width:1px 0 0 1px; }
.unit::after{ bottom:6px; right:6px; border-width:0 1px 1px 0; }
.unit__code{ font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; color:var(--mint); }
.unit__name{ font-family:var(--disp); font-weight:600; font-stretch:122%; font-size:1.02rem; letter-spacing:-.01em; margin-top:.45rem; color:var(--floor-text); }
.unit__desc{ font-size:.8rem; line-height:1.5; color:var(--floor-text-2); margin-top:.3rem; }
.unit__bar{ display:flex; gap:3px; margin-top:.9rem; }
.unit__bar i{ height:3px; flex:1; background:var(--mint); opacity:.22; border-radius:2px; }
.unit__bar i:nth-child(-n+3){ opacity:.75; }
.belt__surface{
  height:24px; margin-top:14px;
  border-top:1px solid var(--floor-line); border-bottom:1px solid var(--floor-line);
  background:
    repeating-linear-gradient(90deg, rgba(128,235,189,.20) 0 2px, transparent 2px 20px),
    linear-gradient(180deg, rgba(128,235,189,.05), rgba(0,0,0,.28));
  animation:tread var(--tread-cycle) linear infinite;
}
@keyframes tread{ from{ background-position-x:0,0; } to{ background-position-x:-20px,0; } }

/* ---------- ofertas principales ---------- */
.offers{ display:grid; gap:1px; background:var(--line); border:1px solid var(--line); }
@media (min-width:820px){ .offers{ grid-template-columns:repeat(3,1fr); } }
.offer{ background:var(--surface); padding:2rem 1.7rem 1.8rem; display:flex; flex-direction:column; gap:1rem; transition:background-color .2s ease; }
.offer:hover{ background:var(--surface-2); }
.offer__ico{ width:32px; height:32px; color:var(--accent); }
.offer h3{ font-size:1.35rem; }
.offer > p{ font-size:.95rem; color:var(--text-2); }
.offer ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.4rem; }
.offer li{ font-size:.87rem; color:var(--text-2); line-height:1.5; padding-left:1rem; position:relative; }
.offer li::before{ content:""; position:absolute; left:0; top:.62em; width:4px; height:4px; background:var(--accent); opacity:.6; }
.offer__foot{ margin-top:auto; padding-top:1.1rem; border-top:1px solid var(--line-soft); display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; justify-content:space-between; }
.chip{ display:inline-block; font-family:var(--mono); font-size:.67rem; letter-spacing:.05em; background:var(--accent-soft); color:var(--accent); padding:.32rem .55rem; border-radius:3px; }
.offer__cta{ font-size:.86rem; font-weight:600; color:var(--accent); text-decoration:none; white-space:nowrap; }
.offer__cta:hover{ text-decoration:underline; text-underline-offset:3px; }

/* ---------- credenciales ---------- */
.creds{ background:var(--floor-2); border-top:1px solid var(--floor-line); color:var(--floor-text); padding-block:clamp(2.5rem,5vw,3.5rem); }
.creds__grid{ display:grid; gap:1px; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); background:var(--floor-line); border:1px solid var(--floor-line); }
.cred{ background:var(--floor-2); padding:1.4rem 1.3rem; }
.cred__n{ font-family:var(--disp); font-weight:700; font-stretch:126%; font-size:clamp(1.7rem,2.9vw,2.3rem); line-height:1; letter-spacing:-.03em; color:var(--mint); font-variant-numeric:tabular-nums; }
.cred__l{ font-size:.83rem; color:var(--floor-text-2); margin-top:.45rem; line-height:1.45; }
.seals{ display:flex; flex-wrap:wrap; align-items:center; gap:1rem; margin-top:1.5rem; }
.seal{ background:#fff; border-radius:4px; padding:.5rem .8rem; display:flex; align-items:center; }
.seal img{ height:30px; width:auto; }
.seal--sq img{ height:52px; }
.seals p{ font-size:.85rem; color:var(--floor-text-2); max-width:36ch; }

/* ---------- muro de clientes ---------- */
.clients{ display:grid; gap:1px; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); background:var(--paper-line); border:1px solid var(--paper-line); }
@media (min-width:940px){ .clients{ grid-template-columns:repeat(4,1fr); } }
.client{ background:var(--paper); display:flex; align-items:center; justify-content:center; padding:1.6rem 1.4rem; min-height:112px; }
.client img{ max-height:38px; max-width:86%; width:auto; object-fit:contain; filter:grayscale(1) contrast(.92) opacity(.62); transition:filter .3s ease, transform .3s ease; }
.client--tall img{ max-height:52px; }
.client:hover img{ filter:none; transform:scale(1.04); }
.client--stat{ flex-direction:column; gap:.3rem; text-align:center; }
.client--stat b{ font-family:var(--disp); font-weight:700; font-stretch:126%; font-size:1.9rem; line-height:1; letter-spacing:-.02em; color:var(--teal-deep); }
.client--stat span{ font-family:var(--mono); font-size:.64rem; letter-spacing:.14em; text-transform:uppercase; color:var(--paper-text); }

/* ---------- diferenciadores ---------- */
.diffs{ display:grid; gap:1px; background:var(--floor-line); border:1px solid var(--floor-line); }
@media (min-width:820px){ .diffs{ grid-template-columns:repeat(2,1fr); } }
.diff{ background:var(--floor); padding:1.9rem 1.7rem; display:flex; flex-direction:column; gap:.65rem; }
.diff .tag{ color:var(--mint); }
.diff h3{ color:var(--floor-text); }
.diff p{ font-size:.93rem; color:var(--floor-text-2); }
.diff em{ font-style:normal; color:var(--mint-hi); }

/* ---------- línea de estaciones ---------- */
.flow{ display:grid; gap:1px; background:var(--line); border:1px solid var(--line); }
@media (min-width:640px){ .flow{ grid-template-columns:repeat(3,1fr); } }
@media (min-width:1000px){ .flow{ grid-template-columns:repeat(6,1fr); } }
.step{ background:var(--bg); padding:1.7rem 1.2rem 1.9rem; position:relative; display:flex; flex-direction:column; gap:.55rem; }
.step__rail{ position:absolute; left:1.2rem; right:1.2rem; top:0; height:2px; background:var(--accent); transform:scaleX(0); transform-origin:left; transition:transform .65s cubic-bezier(.22,.61,.36,1); }
.is-on .step__rail{ transform:scaleX(1); }
.step__n{ font-family:var(--mono); font-size:.7rem; letter-spacing:.14em; color:var(--accent); transition:color .3s ease; }
.step p{ font-size:.86rem; color:var(--text-2); line-height:1.55; }
.floor .flow{ background:var(--floor-line); border-color:var(--floor-line); }
.floor .step{ background:var(--floor); }
.floor .step__n{ color:var(--mint); }
.floor .step__rail{ background:var(--mint); }
.floor .step p{ color:var(--floor-text-2); }
.flow--scroll .step__rail{ transition:none; }
.scrollfx .flow--scroll .step__rail{ transform:scaleX(var(--fill,0)); }
.flow--scroll .step.is-lit .step__n{ color:var(--mint); }
.floor .flow--scroll .step.is-lit h4{ color:var(--mint-hi); }

/* ---------- casos ---------- */
.cases{ display:grid; gap:1.15rem; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); }
@media (min-width:900px){ .cases{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1140px){ .cases{ grid-template-columns:repeat(3,1fr); } }
.case{ background:var(--surface); border:1px solid var(--line); border-radius:5px; padding:1.5rem 1.4rem 1.35rem; display:flex; flex-direction:column; gap:.9rem; }
.case__logo{ height:40px; display:flex; align-items:center; }
.case__logo img{ max-height:34px; width:auto; }
.case__row{ display:flex; flex-direction:column; gap:.2rem; }
.case__row .tag{ color:var(--text-2); font-size:.64rem; }
.case__row p{ font-size:.87rem; color:var(--text-2); line-height:1.55; }
.case__res{ margin-top:auto; padding-top:.9rem; border-top:1px solid var(--line-soft); display:flex; flex-direction:column; gap:.5rem; }
.case__res .tag{ color:var(--accent); font-size:.64rem; }
.case__res ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.3rem; }
.case__res li{ font-size:.87rem; color:var(--text); font-weight:500; line-height:1.45; }

/* ---------- producto: máquina y fichas ---------- */
.machine{ display:grid; gap:2rem 3rem; align-items:center; }
@media (min-width:900px){ .machine{ grid-template-columns:.8fr 1.2fr; } }
.machine__shot{ position:relative; display:flex; justify-content:center; align-items:flex-end; min-height:340px; }
.machine__shot::after{
  content:""; position:absolute; left:50%; bottom:1%; translate:-50% 0;
  width:70%; height:24px; border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(0,0,0,.6), transparent 70%);
  filter:blur(7px);
}
.machine__shot img{
  position:relative; z-index:1; width:auto; height:auto;
  max-height:clamp(320px,46vw,500px);
  transform:translateY(calc(var(--float,0) * 1px));
  animation:hover-machine 7s ease-in-out infinite alternate;
  filter:drop-shadow(0 24px 44px rgba(0,0,0,.55));
}
@keyframes hover-machine{ from{ translate:0 6px; } to{ translate:0 -10px; } }
.machine__spec{ display:grid; gap:1px; background:var(--floor-line); border:1px solid var(--floor-line); margin-top:1.5rem; }
@media (min-width:560px){ .machine__spec{ grid-template-columns:repeat(2,1fr); } }
.machine__spec div{ background:var(--floor-2); padding:.95rem 1.05rem; }
.machine__spec b{ display:block; font-size:.87rem; color:var(--floor-text); font-weight:600; }
.machine__spec span{ display:block; font-size:.8rem; color:var(--floor-text-2); margin-top:.15rem; }

.feat{ display:grid; gap:1px; background:var(--floor-line); border:1px solid var(--floor-line); }
@media (min-width:620px){ .feat{ grid-template-columns:repeat(2,1fr); } }
.feat__i{ background:var(--floor-2); padding:1.35rem 1.3rem; display:flex; flex-direction:column; gap:.4rem; }
.feat__i h4{ color:var(--floor-text); }
.feat__i p{ font-size:.86rem; color:var(--floor-text-2); line-height:1.55; }
.feat__i .tag{ color:var(--mint); }
.metrics{ display:grid; gap:1px; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); background:var(--floor-line); border:1px solid var(--floor-line); margin-top:1.5rem; }
.metric{ background:var(--floor-2); padding:1.15rem 1rem; }
.metric b{ display:block; font-family:var(--disp); font-weight:700; font-stretch:126%; font-size:clamp(1.4rem,2.4vw,1.9rem); line-height:1; color:var(--mint); letter-spacing:-.02em; }
.metric span{ display:block; font-size:.78rem; color:var(--floor-text-2); margin-top:.4rem; line-height:1.35; }

/* ---------- logotipos de producto ---------- */
/* align-self evita que la columna flex estire y deforme el logotipo */
img.prodmark{ align-self:flex-start; height:clamp(24px,2.4vw,32px); width:auto; max-width:100%; }
img.prodmark--light{ height:clamp(21px,2vw,27px); }

/* ---------- sector público ---------- */
.gov{ display:grid; gap:2rem 3rem; }
@media (min-width:940px){ .gov{ grid-template-columns:1fr 1fr; } }
.mods{ display:flex; flex-wrap:wrap; gap:.45rem; }
.mod{ font-size:.82rem; padding:.42rem .75rem; border-radius:3px; border:1px solid var(--line); color:var(--text-2); background:var(--accent-soft); }
.mod--core{ border-color:var(--accent); color:#fff; background:var(--accent); font-weight:600; }
.govlist{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.75rem; }
.govlist li{ font-size:.92rem; color:var(--text-2); line-height:1.55; }
.govlist b{ color:var(--text); }

/* ---------- trayectoria ---------- */
.time{ display:grid; gap:1px; background:var(--floor-line); border:1px solid var(--floor-line); }
@media (min-width:700px){ .time{ grid-template-columns:repeat(3,1fr); } }
@media (min-width:1060px){ .time{ grid-template-columns:repeat(7,1fr); } }
.tstep{ background:var(--floor); padding:1.6rem 1.15rem 1.8rem; display:flex; flex-direction:column; gap:.5rem; }
.tstep__y{ font-family:var(--disp); font-weight:700; font-stretch:126%; font-size:1.45rem; letter-spacing:-.02em; color:var(--mint); line-height:1; font-variant-numeric:tabular-nums; }
.tstep p{ font-size:.83rem; color:var(--floor-text-2); line-height:1.5; }
.tstep--now{ background:var(--floor-3); }

/* ---------- bandas de llamado ---------- */
.cta-band{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:1.25rem; padding:1.5rem 1.6rem; border-radius:6px; margin-top:2.25rem;
  background:var(--accent-soft); border:1px solid var(--line);
}
.floor .cta-band{ background:var(--floor-2); border-color:var(--floor-line); }
.cta-band p{ font-size:1rem; font-weight:500; max-width:52ch; }
.cta-band .sub{ display:block; font-size:.87rem; font-weight:400; color:var(--text-2); margin-top:.25rem; }
.floor .cta-band .sub{ color:var(--floor-text-2); }
.cta-band__btns{ display:flex; flex-wrap:wrap; gap:.7rem; }

/* ---------- agendamiento ---------- */
.book{ background:var(--floor-2); border:1px solid var(--floor-line); border-radius:6px; padding:clamp(1.5rem,3vw,2.25rem); display:flex; flex-direction:column; gap:1.5rem; }
.book__row{ display:flex; flex-direction:column; gap:.65rem; }
.book__row > .tag{ color:var(--mint); }
.chips{ display:flex; flex-wrap:wrap; gap:.45rem; }
.chip-btn{
  font-family:var(--sans); font-size:.85rem; font-weight:500;
  padding:.5rem .85rem; border-radius:999px; cursor:pointer;
  background:transparent; color:var(--floor-text-2); border:1px solid var(--floor-line);
  transition:background-color .18s ease, color .18s ease, border-color .18s ease;
}
.chip-btn:hover{ border-color:var(--mint); color:var(--mint); }
.chip-btn[aria-pressed="true"]{ background:var(--mint); color:#011C1A; border-color:var(--mint); font-weight:600; }
.fields{ display:grid; gap:.75rem; grid-template-columns:1fr; }
@media (min-width:640px){ .fields{ grid-template-columns:repeat(2,1fr); } }
.field{ display:flex; flex-direction:column; gap:.35rem; }
.field label{ font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--floor-text-2); }
.field input, .field select{
  font-family:var(--sans); font-size:.95rem; color:var(--floor-text);
  background:var(--floor); border:1px solid var(--floor-line); border-radius:4px;
  padding:.7rem .85rem; width:100%;
}
.field input::placeholder{ color:rgba(141,178,166,.6); }
.field input:focus, .field select:focus{ outline:2px solid var(--mint); outline-offset:1px; }
.book__summary{ font-family:var(--mono); font-size:.82rem; color:var(--mint); background:rgba(128,235,189,.07); border:1px dashed var(--floor-line); border-radius:4px; padding:.85rem 1rem; }
.book__actions{ display:flex; flex-wrap:wrap; gap:.75rem; align-items:center; }
.book__note{ font-size:.82rem; color:var(--floor-text-2); max-width:62ch; }
/* el calendario es una herramienta dentro de la página, no la página */
.book__cal{ margin-top:.25rem; }
.book__cal[hidden]{ display:none; }
.book__embed{
  border:1px solid var(--floor-line); border-radius:6px; overflow:hidden;
  background:#fff; max-width:780px; width:100%;
  animation:abrir-agenda .35s cubic-bezier(.22,.61,.36,1);
}
.book__embed iframe{ display:block; width:100%; height:560px; border:0; }
@keyframes abrir-agenda{ from{ opacity:0; transform:translateY(-8px); } to{ opacity:1; transform:none; } }
@media (max-width:700px){ .book__embed iframe{ height:660px; } }
@media (prefers-reduced-motion:reduce){ .book__embed{ animation:none; } }


/* ---------- formulario de contacto ---------- */
.lead{
  background:var(--surface); border:1px solid var(--line); border-radius:6px;
  padding:clamp(1.5rem,3vw,2.25rem); margin-top:1.5rem;
  display:flex; flex-direction:column; gap:1.25rem;
}
.lead__head{ display:flex; flex-direction:column; gap:.5rem; }
.lead__head .tag{ color:var(--accent); }
.lead__head p{ font-size:.93rem; color:var(--text-2); max-width:60ch; }
.lead__form{ display:flex; flex-direction:column; gap:.9rem; }
.lead .field label{ color:var(--text-2); }
.lead .field input, .lead .field select, .lead .field textarea{
  font-family:var(--sans); font-size:.95rem; color:var(--text);
  background:var(--bg); border:1px solid var(--line); border-radius:4px;
  padding:.7rem .85rem; width:100%; resize:vertical;
}
.lead .field input::placeholder, .lead .field textarea::placeholder{ color:var(--text-2); opacity:.7; }
.lead .field input:focus, .lead .field select:focus, .lead .field textarea:focus{
  outline:2px solid var(--accent); outline-offset:1px;
}
.lead .field input:user-invalid{ border-color:#B4471F; }
.lead__acciones{ display:flex; flex-wrap:wrap; gap:.8rem; align-items:center; }
.lead__acciones .btn-solid{ background:var(--accent); color:#fff; }
.lead__acciones .btn-solid:hover{ background:var(--teal); }
.lead .book__note{ color:var(--text-2); }

/* ---------- WhatsApp fijo ---------- */
.wa{
  position:fixed; right:clamp(1rem,2.5vw,1.75rem); bottom:clamp(1rem,2.5vw,1.75rem);
  z-index:64; width:54px; height:54px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:#25D366; color:#fff; text-decoration:none;
  box-shadow:0 8px 22px rgba(0,0,0,.28);
  transition:transform .18s ease, box-shadow .18s ease;
}
.wa:hover{ transform:translateY(-3px); box-shadow:0 12px 28px rgba(0,0,0,.34); }
.wa svg{ width:29px; height:29px; }
@media (max-width:760px){ .wa{ bottom:calc(76px + 1rem); width:50px; height:50px; } .wa svg{ width:27px; height:27px; } }
@media (prefers-reduced-motion:reduce){ .wa:hover{ transform:none; } }


/* ---------- contacto en dos columnas ---------- */
.contacto-2col{ display:grid; gap:1.25rem; align-items:start; }
@media (min-width:1040px){ .contacto-2col{ grid-template-columns:1.05fr .95fr; } }

/* ---------- avance de sector público ---------- */
.gov-teaser{
  display:grid; gap:1.5rem 2.5rem; align-items:center;
  background:var(--surface); border:1px solid var(--line); border-radius:6px;
  padding:clamp(1.6rem,3vw,2.5rem);
}
@media (min-width:940px){ .gov-teaser{ grid-template-columns:1.4fr .6fr; } }
.gov-teaser__cta{ display:flex; flex-direction:column; gap:.7rem; align-items:flex-start; }
@media (min-width:940px){ .gov-teaser__cta{ align-items:stretch; } .gov-teaser__cta .btn{ justify-content:center; } }

/* ---------- detalle plegable en los casos ---------- */
.case__mas{ border-top:1px solid var(--line-soft); padding-top:.75rem; }
.case__mas summary{
  cursor:pointer; list-style:none; font-family:var(--mono); font-size:.64rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--accent);
  display:flex; align-items:center; gap:.4rem;
}
.case__mas summary::-webkit-details-marker{ display:none; }
.case__mas summary::after{ content:"+"; font-family:var(--sans); font-size:1rem; line-height:1; margin-left:auto; }
.case__mas[open] summary::after{ content:"–"; }
.case__mas p{ font-size:.87rem; color:var(--text-2); line-height:1.55; margin-top:.5rem; }


/* ---------- artículos recientes ---------- */
.posts-grid{ display:grid; gap:1.15rem; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); }
.post-card{
  display:flex; flex-direction:column; text-decoration:none; color:inherit;
  background:var(--surface); border:1px solid var(--line); border-radius:5px; overflow:hidden;
  transition:border-color .2s ease, transform .2s ease;
}
.post-card:hover{ border-color:var(--accent); transform:translateY(-3px); }
.post-card__img{ aspect-ratio:16/9; background:var(--surface-2); overflow:hidden; }
.post-card__img img{ width:100%; height:100%; object-fit:cover; }
.post-card__body{ padding:1.2rem 1.25rem 1.35rem; display:flex; flex-direction:column; gap:.5rem; flex:1; }
.post-card__fecha{ font-family:var(--mono); font-size:.64rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text-2); }
.post-card__tit{ font-family:var(--disp); font-weight:600; font-stretch:118%; font-size:1.05rem; line-height:1.3; letter-spacing:-.01em; }
.post-card__res{ font-size:.87rem; color:var(--text-2); line-height:1.55; }
.post-card__mas{ margin-top:auto; padding-top:.75rem; font-size:.84rem; font-weight:600; color:var(--accent); }
@media (prefers-reduced-motion:reduce){ .post-card:hover{ transform:none; } }

/* ---------- pie y barra fija ---------- */
.foot{ background:var(--floor-2); color:var(--floor-text-2); padding-block:3rem 1.75rem; border-top:1px solid var(--floor-line); }
.foot__grid{ display:flex; flex-wrap:wrap; gap:2rem 3rem; justify-content:space-between; }
.foot a{ color:var(--floor-text-2); text-decoration:none; }
.foot a:hover{ color:var(--mint); }
.foot__c{ display:flex; flex-direction:column; align-items:flex-start; gap:.38rem; font-size:.88rem; }
.foot__c b{ color:var(--floor-text); font-weight:600; font-size:.92rem; margin-bottom:.25rem; }
.foot__bot{ margin-top:2.25rem; padding-top:1.15rem; border-top:1px solid var(--floor-line); display:flex; flex-wrap:wrap; gap:.7rem 1.5rem; justify-content:space-between; font-family:var(--mono); font-size:.7rem; letter-spacing:.06em; }
.dock{
  position:fixed; left:0; right:0; bottom:0; z-index:65; display:none; gap:.6rem;
  padding:.7rem var(--pad) calc(.7rem + env(safe-area-inset-bottom));
  background:rgba(1,28,26,.95); backdrop-filter:blur(12px); border-top:1px solid var(--floor-line);
  transform:translateY(110%); transition:transform .3s cubic-bezier(.22,.61,.36,1);
}
.dock.is-on{ transform:none; }
.dock .btn{ flex:1; justify-content:center; padding:.75rem 1rem; font-size:.88rem; }
@media (max-width:760px){ .dock{ display:flex; } body{ padding-bottom:76px; } }

/* ---------- revelado ---------- */
.rv{ transition:opacity .55s ease, transform .55s cubic-bezier(.22,.61,.36,1); }
.js .rv{ opacity:0; transform:translateY(16px); }
.js .rv.is-on{ opacity:1; transform:none; }

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .belt__track,.belt__surface,.machine__shot img,.s35-giro,
  .gear,.piston,.puff,.flowline,.spark,.idea,.crumb,.ship,.lamp,.codeline{ animation:none; }
  .machine__shot img{ transform:none; }
  .puff,.spark,.crumb{ opacity:.4; }
  .ship{ opacity:1; }
  .flow--scroll .step__rail{ transform:scaleX(1); }
  .progress{ display:none; }
  .js .rv{ opacity:1; transform:none; transition:none; }
  .btn:hover{ transform:none; }
}


/* ===== Artículos ================================================= */
.ada-art{ background:var(--bg); color:var(--tx); }
.ada-art .wrap{ max-width:var(--maxw); margin:0 auto; padding:0 clamp(1.1rem,4vw,2.5rem); }

.ada-hd{ padding:clamp(5.5rem,10vw,7.5rem) 0 clamp(1.6rem,3vw,2.4rem); }
.ada-hd .eyebrow{ font-family:var(--mono); font-size:.72rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--ac); font-weight:600; margin:0 0 .9rem; }
.ada-hd h1{ font-size:clamp(2rem,4.6vw,3.1rem); line-height:1.12; margin:0 0 1rem;
  max-width:20ch; text-wrap:balance; }
.ada-meta{ display:flex; flex-wrap:wrap; gap:.4rem 1.4rem; font-family:var(--mono);
  font-size:.76rem; color:var(--tx2); }

.ada-cover{ margin:0 0 clamp(2rem,4vw,3rem); }
.ada-cover img{ width:100%; height:auto; border-radius:6px; display:block; }

.ada-body{ max-width:66ch; font-size:1.05rem; line-height:1.7; padding-bottom:4rem; }
.ada-body > p:first-of-type{ font-size:1.16rem; }
.ada-body p{ margin:0 0 1.25rem; }
.ada-body h2{ font-size:clamp(1.35rem,2.6vw,1.62rem); margin:2.6rem 0 .9rem;
  padding-top:.9rem; border-top:1px solid var(--bd); }
.ada-body h3{ font-size:1.1rem; margin:1.9rem 0 .55rem; color:var(--ac); }
.ada-body ul,.ada-body ol{ margin:0 0 1.35rem; padding-left:1.3rem; }
.ada-body li{ margin-bottom:.55rem; }
.ada-body a{ color:var(--ac); text-decoration:none;
  box-shadow:inset 0 -1px 0 color-mix(in srgb, var(--ac) 45%, transparent); }
.ada-body a:hover,.ada-body a:focus-visible{ box-shadow:inset 0 -2px 0 var(--ac); }
.ada-body img{ max-width:100%; height:auto; border-radius:5px; }
.ada-tabla{ overflow-x:auto; margin:0 0 1.6rem; }
.ada-body table{ width:100%; border-collapse:collapse; font-size:.95rem; }
.ada-body th{ text-align:left; background:var(--sf2); font-family:var(--mono);
  font-size:.71rem; font-weight:600; letter-spacing:.07em; text-transform:uppercase;
  padding:.65rem .8rem; border-bottom:1px solid var(--bd); }
.ada-body td{ padding:.7rem .8rem; border-bottom:1px solid var(--bd); vertical-align:top; }
.ada-body hr{ border:none; border-top:1px solid var(--bd); margin:2.6rem 0 1.5rem; }
.ada-body hr + p{ background:var(--sf2); border-left:3px solid var(--ac);
  padding:1.1rem 1.3rem; border-radius:0 4px 4px 0; }

/* ===== Listado del blog ========================================== */
.ada-lista{ display:grid; gap:1.1rem; grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  padding-bottom:4rem; }
.ada-card{ display:flex; flex-direction:column; background:var(--sf);
  border:1px solid var(--bd); border-radius:6px; overflow:hidden; text-decoration:none;
  color:inherit; transition:border-color .18s ease, transform .18s ease; }
.ada-card:hover,.ada-card:focus-visible{ border-color:var(--ac); transform:translateY(-2px); }
.ada-card img{ width:100%; aspect-ratio:1200/630; object-fit:cover; display:block; }
.ada-card__b{ padding:1.1rem 1.15rem 1.3rem; display:flex; flex-direction:column; gap:.5rem; }
.ada-card__f{ font-family:var(--mono); font-size:.71rem; color:var(--tx2);
  letter-spacing:.06em; text-transform:uppercase; }
.ada-card h2{ font-size:1.06rem; line-height:1.3; margin:0; }
.ada-card p{ margin:0; font-size:.92rem; color:var(--tx2); line-height:1.55; }

.ada-nav-posts{ display:flex; justify-content:space-between; gap:1rem;
  border-top:1px solid var(--bd); padding:1.6rem 0 4rem; font-size:.93rem; }
.ada-nav-posts a{ color:var(--ac); text-decoration:none; max-width:45%; }
.ada-nav-posts a:hover{ text-decoration:underline; }

@media (prefers-reduced-motion:reduce){ *{ animation:none!important; transition:none!important; } }

/* ===== Ajustes propios de los artículos ========================== */
/* En el home el dock aparece bajo 760px, pero .nav__links ya se oculta
   a los 1040. En un artículo eso dejaría un tramo sin navegación. */
@media (max-width:1040px){
  .ada-art .dock{ display:flex; }
}
@media (max-width:1040px){
  .ada-art .ada-body,
  .ada-art .ada-lista{ padding-bottom:6rem; }
}
/* el nav de los artículos no lleva selector de idioma: el CTA va a la derecha */
.ada-art .nav__cta{ margin-left:auto; }
