/* ===========================================
   SUPERANDO CRISIS · PARAGUAY
   Estilo Apple-like
   =========================================== */

:root{
  --apple-bg:#fbfbfd;
  --apple-fg:#1d1d1f;
  --apple-fg-2:#86868b;
  --apple-link:#0066cc;
  --apple-radius:980px;
  --azul:#0f3a5f;
  --azul-osc:#0a2540;
  --azul-claro:#1d5a8a;
  --azul-suave:#e8f0f8;
  --gris-1:#f5f7fa;
  --gris-2:#e6ebf1;
  --gris-3:#9aa6b2;
  --gris-4:#445566;
  --texto:#1c2733;
  --acento:#c89a47;
  --acento-osc:#9a7530;
  --acento-suave:#fbf3e2;
  --rojo:#a8323a;
  --rojo-suave:#fde7e9;
  --verde:#2e7d57;
  --verde-suave:#e3f1ea;
  --sombra:0 2px 12px rgba(15,58,95,.08);
  --sombra-fuerte:0 6px 24px rgba(15,58,95,.14);
  --serif:-apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'Helvetica Neue', Arial, sans-serif;
  --sans:-apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'Helvetica Neue', Arial, sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--serif);
  color:var(--texto);
  background:#fff;
  line-height:1.65;
  font-size:17px;
}
.sans{font-family:var(--sans)}
a{color:var(--azul-claro)}
img{max-width:100%;display:block}

/* ============ NAV ============ */
header.top{
  background:var(--azul-osc);
  color:#fff;
  position:sticky;top:0;z-index:50;
  border-bottom:3px solid var(--acento);
}
.nav-wrap{
  max-width:1200px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 28px;
  gap:20px;
}
.brand{
  font-family:var(--sans);
  font-weight:700;letter-spacing:.5px;
  font-size:1.05rem;
  display:flex;align-items:center;gap:10px;
  color:#fff;text-decoration:none;
}
.brand .logo-mark{
  width:44px;height:44px;
  background:transparent;
  display:flex;align-items:center;justify-content:center;
  border-radius:0;
}
.brand .logo-mark svg{width:44px;height:44px;fill:initial}
.brand-text{display:flex;flex-direction:column;line-height:1.1}
.brand-text .b1{font-size:.95rem;color:#0038A8;font-weight:800}
.brand-text .b2{font-size:.7rem;letter-spacing:2px;color:#D52B1E;font-weight:700}
nav ul{
  list-style:none;display:flex;gap:24px;
  font-family:var(--sans);font-size:.9rem;
}
nav a{
  color:#dde4ec;text-decoration:none;
  transition:color .2s;
  padding:6px 2px;
  border-bottom:2px solid transparent;
}
nav a:hover,nav a.activo{color:#fff;border-bottom-color:var(--acento)}
.menu-toggle{display:none;background:none;border:none;color:#fff;font-size:1.6rem;cursor:pointer}

/* ============ HERO ============ */
.hero{
  background:linear-gradient(135deg,var(--azul-osc) 0%,var(--azul) 60%,var(--azul-claro) 100%);
  color:#fff;
  padding:90px 28px 100px;
  position:relative;overflow:hidden;
}
.hero::before{
  content:"";position:absolute;inset:0;
  background-image:
    radial-gradient(circle at 85% 20%, rgba(200,154,71,.18), transparent 50%),
    radial-gradient(circle at 15% 85%, rgba(255,255,255,.05), transparent 50%);
  pointer-events:none;
}
.hero-inner{max-width:1000px;margin:0 auto;position:relative;z-index:1}
.kicker{
  font-family:var(--sans);
  text-transform:uppercase;letter-spacing:3px;
  font-size:.78rem;color:var(--acento);
  margin-bottom:18px;font-weight:600;
  display:flex;align-items:center;gap:10px;
}
.kicker svg{width:18px;height:18px;fill:var(--acento)}
.hero h1{
  font-size:2.8rem;line-height:1.2;
  font-weight:normal;margin-bottom:22px;
  max-width:820px;
}
.hero p.lead{
  font-size:1.18rem;color:#d9e3ee;
  max-width:740px;margin-bottom:32px;
}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}

.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 26px;
  font-family:var(--sans);font-size:.95rem;
  text-decoration:none;font-weight:600;
  border:2px solid transparent;border-radius:2px;
  transition:all .25s;cursor:pointer;
  line-height:1;
}
.btn svg{width:16px;height:16px}
.btn-primary{background:var(--acento);color:#fff;border-color:var(--acento)}
.btn-primary:hover{background:var(--acento-osc);border-color:var(--acento-osc);transform:translateY(-1px)}
.btn-primary svg{fill:#fff}
.btn-secondary{background:transparent;color:#fff;border-color:#fff}
.btn-secondary:hover{background:#fff;color:var(--azul-osc)}
.btn-secondary svg{fill:currentColor}
.btn-azul{background:var(--azul-osc);color:#fff;border-color:var(--azul-osc)}
.btn-azul:hover{background:var(--azul);border-color:var(--azul)}
.btn-azul svg{fill:#fff}
.btn-outline{background:transparent;color:var(--azul-osc);border-color:var(--azul-osc)}
.btn-outline:hover{background:var(--azul-osc);color:#fff}
.btn-outline svg{fill:currentColor}

/* ============ SECCIONES GENÉRICAS ============ */
section.block{padding:80px 28px;max-width:1200px;margin:0 auto}
section.alt{background:var(--gris-1);max-width:none;padding-left:0;padding-right:0}
section.alt .inner{max-width:1200px;margin:0 auto;padding:0 28px}
section.dark{background:var(--azul-osc);color:#fff;max-width:none;padding-left:0;padding-right:0}
section.dark .inner{max-width:1200px;margin:0 auto;padding:80px 28px}
section.dark h2.section-title{color:#fff}
section.dark h2.section-title::after{background:var(--acento)}
section.dark .section-sub{color:#cfd9e3}

h2.section-title{
  font-size:2rem;color:var(--azul-osc);
  margin-bottom:14px;font-weight:normal;
  position:relative;padding-bottom:14px;
}
h2.section-title::after{
  content:"";position:absolute;left:0;bottom:0;
  width:60px;height:3px;background:var(--acento);
}
h2.center{text-align:center;padding-bottom:20px}
h2.center::after{left:50%;transform:translateX(-50%)}
.section-sub{
  font-family:var(--sans);
  color:var(--gris-4);font-size:1.02rem;
  margin-bottom:42px;max-width:780px;
}
.section-sub.center{margin-left:auto;margin-right:auto;text-align:center}

/* ============ CAJA DEFINICIÓN ============ */
.def-box{
  background:#fff;border-left:4px solid var(--azul-claro);
  padding:28px 32px;box-shadow:var(--sombra);
  margin:30px 0;
}
.def-box h3{
  color:var(--azul-osc);font-size:1.15rem;
  margin-bottom:10px;font-family:var(--sans);
  text-transform:uppercase;letter-spacing:1.2px;
  display:flex;align-items:center;gap:10px;
}
.def-box h3 svg{width:22px;height:22px;fill:var(--azul-claro)}
.def-box .legal{
  font-size:.85rem;color:var(--gris-4);
  margin-top:14px;font-style:italic;
}

/* ============ TARJETAS / PILARES ============ */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:36px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;margin-top:36px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:36px}

.card{
  background:#fff;padding:32px 26px;
  border-top:3px solid var(--azul-claro);
  box-shadow:var(--sombra);
  transition:transform .25s, box-shadow .25s;
}
.card:hover{transform:translateY(-4px);box-shadow:var(--sombra-fuerte)}
.card .icon-wrap{
  width:60px;height:60px;
  background:var(--azul-suave);color:var(--azul-osc);
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;
  margin-bottom:18px;
}
.card .icon-wrap svg{width:30px;height:30px;fill:var(--azul-osc)}
.card.dorado{border-top-color:var(--acento)}
.card.dorado .icon-wrap{background:var(--acento-suave)}
.card.dorado .icon-wrap svg{fill:var(--acento-osc)}
.card.verde{border-top-color:var(--verde)}
.card.verde .icon-wrap{background:var(--verde-suave)}
.card.verde .icon-wrap svg{fill:var(--verde)}
.card h3{
  font-size:1.2rem;color:var(--azul-osc);
  margin-bottom:12px;font-weight:normal;
}
.card p{color:var(--gris-4);font-size:.97rem;line-height:1.55}

/* Tarjetas con número grande */
.card.numero .icon-wrap{
  font-family:var(--sans);font-weight:700;font-size:1.6rem;
  background:var(--azul-osc);color:#fff;
}

/* ============ TARJETAS GRANDES (audiencia) ============ */
.aud-card{
  background:#fff;padding:38px;
  border:1px solid var(--gris-2);
  position:relative;
  box-shadow:var(--sombra);
}
.aud-card.deudor{border-top:4px solid var(--azul-claro)}
.aud-card.acreedor{border-top:4px solid var(--acento)}
.aud-card .badge{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--sans);font-size:.75rem;
  text-transform:uppercase;letter-spacing:2px;
  background:var(--gris-1);color:var(--azul-osc);
  padding:6px 12px;margin-bottom:16px;font-weight:600;
}
.aud-card .badge svg{width:14px;height:14px;fill:currentColor}
.aud-card h3{
  font-size:1.4rem;color:var(--azul-osc);
  margin-bottom:8px;font-weight:normal;
}
.aud-card ul{list-style:none;margin-top:18px}
.aud-card ul li{
  padding:12px 0 12px 36px;
  position:relative;font-size:.97rem;
  border-bottom:1px solid var(--gris-2);
}
.aud-card ul li:last-child{border-bottom:none}
.aud-card ul li svg{
  position:absolute;left:0;top:14px;
  width:20px;height:20px;
}
.aud-card ul li.ok svg{fill:var(--verde)}
.aud-card ul li.bad svg{fill:var(--rojo)}
.aud-card h4{
  font-family:var(--sans);
  font-size:.92rem;color:var(--azul-osc);
  text-transform:uppercase;letter-spacing:1px;
  margin-top:24px;margin-bottom:6px;
  display:flex;align-items:center;gap:8px;
}
.aud-card h4 svg{width:18px;height:18px;fill:var(--azul-osc)}

/* ============ TIMELINE ============ */
.timeline{position:relative;margin-top:50px;padding-left:50px}
.timeline::before{
  content:"";position:absolute;left:19px;top:8px;bottom:8px;
  width:2px;background:var(--gris-2);
}
.tl-item{position:relative;margin-bottom:42px}
.tl-item .tl-icon{
  position:absolute;left:-50px;top:0;
  width:40px;height:40px;border-radius:50%;
  background:#fff;border:3px solid var(--azul-claro);
  display:flex;align-items:center;justify-content:center;
  z-index:2;
}
.tl-item .tl-icon svg{width:18px;height:18px;fill:var(--azul-claro)}
.tl-item.activo .tl-icon{background:var(--acento);border-color:var(--acento)}
.tl-item.activo .tl-icon svg{fill:#fff}
.tl-item h4{
  font-size:1.18rem;color:var(--azul-osc);
  margin-bottom:6px;font-weight:normal;
}
.tl-item .etapa{
  font-family:var(--sans);
  font-size:.75rem;text-transform:uppercase;
  letter-spacing:2px;color:var(--acento);
  margin-bottom:8px;font-weight:600;
}
.tl-item p{color:var(--gris-4);font-size:.96rem;max-width:820px}
.tl-item .plazo{
  display:inline-flex;align-items:center;gap:6px;
  margin-top:10px;
  font-family:var(--sans);font-size:.82rem;
  background:var(--gris-1);color:var(--azul-osc);
  padding:5px 12px;border-radius:2px;
}
.tl-item .plazo svg{width:13px;height:13px;fill:currentColor}

/* ============ TABLA COMPARATIVA ============ */
.tabla-wrap{overflow-x:auto;margin-top:36px}
table.compara{
  width:100%;border-collapse:collapse;
  background:#fff;box-shadow:var(--sombra);
  font-size:.95rem;min-width:720px;
}
table.compara th,table.compara td{
  padding:16px 20px;text-align:left;
  border-bottom:1px solid var(--gris-2);
  vertical-align:top;
}
table.compara thead th{
  background:var(--azul-osc);color:#fff;
  font-family:var(--sans);font-weight:600;
  text-transform:uppercase;letter-spacing:1px;font-size:.82rem;
}
table.compara th.criterio{background:var(--gris-1);color:var(--azul-osc)}
table.compara th.quiebra{background:#7a2730;color:#fff}
table.compara tbody th{
  background:var(--gris-1);color:var(--azul-osc);
  font-family:var(--sans);font-weight:600;width:25%;
}
table.compara td.bueno{color:var(--verde)}
table.compara td.malo{color:var(--rojo)}
.leyenda{
  font-size:.85rem;color:var(--gris-4);
  margin-top:12px;font-style:italic;
}

/* ============ MITOS ============ */
.mito{
  background:#fff;border:1px solid var(--gris-2);
  padding:26px 28px;box-shadow:var(--sombra);
}
.mito .tag{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 12px;
  font-family:var(--sans);font-size:.72rem;
  text-transform:uppercase;letter-spacing:1.5px;
  background:var(--rojo-suave);color:var(--rojo);
  margin-bottom:12px;font-weight:600;
}
.mito .tag svg{width:12px;height:12px;fill:currentColor}
.mito .tag.real{background:var(--verde-suave);color:var(--verde)}
.mito p.afirm{
  font-size:1.05rem;color:var(--azul-osc);
  margin-bottom:12px;font-style:italic;
}
.mito p.expl{color:var(--gris-4);font-size:.95rem}

/* ============ FAQ / DETAILS ============ */
.faq{margin-top:36px}
details{
  background:#fff;border:1px solid var(--gris-2);
  margin-bottom:12px;padding:0;
  transition:box-shadow .2s;
}
details[open]{box-shadow:var(--sombra)}
summary{
  padding:18px 24px;cursor:pointer;
  font-family:var(--sans);font-weight:600;color:var(--azul-osc);
  font-size:1rem;list-style:none;
  position:relative;padding-right:50px;
}
summary::-webkit-details-marker{display:none}
summary::after{
  content:"+";position:absolute;right:24px;top:50%;
  transform:translateY(-50%);
  color:var(--acento);font-size:1.6rem;font-weight:300;
  transition:transform .2s;
}
details[open] summary::after{content:"−"}
.faq-body{padding:0 24px 22px;color:var(--gris-4);font-size:.97rem}

/* ============ CIFRAS / KPI ============ */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:30px}
.kpi{
  background:#fff;padding:30px 22px;
  text-align:center;border:1px solid var(--gris-2);
  border-top:3px solid var(--acento);
}
.kpi .num{
  font-family:var(--sans);font-size:2.4rem;
  color:var(--azul-osc);font-weight:700;
  line-height:1;margin-bottom:8px;
}
.kpi .lbl{
  font-family:var(--sans);font-size:.85rem;
  color:var(--gris-4);text-transform:uppercase;
  letter-spacing:1.5px;
}

/* ============ TIPOS DE EMPRESAS ============ */
.tipo{
  background:#fff;padding:30px;border:1px solid var(--gris-2);
  display:flex;flex-direction:column;
  transition:transform .25s,box-shadow .25s;
  position:relative;overflow:hidden;
}
.tipo:hover{transform:translateY(-4px);box-shadow:var(--sombra-fuerte)}
.tipo .ico{
  width:64px;height:64px;background:var(--azul-suave);
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  margin-bottom:18px;
}
.tipo .ico svg{width:32px;height:32px;fill:var(--azul-osc)}
.tipo h3{
  font-size:1.25rem;color:var(--azul-osc);
  margin-bottom:10px;font-weight:normal;
}
.tipo p.intro{color:var(--gris-4);font-size:.95rem;margin-bottom:14px}
.tipo ul{list-style:none;margin-top:10px}
.tipo ul li{
  font-size:.9rem;color:var(--texto);
  padding:6px 0 6px 22px;position:relative;
}
.tipo ul li::before{
  content:"";position:absolute;left:0;top:14px;
  width:8px;height:8px;background:var(--acento);
  border-radius:50%;
}

/* ============ VIDEOS ============ */
.video-card{
  background:#fff;border:1px solid var(--gris-2);
  overflow:hidden;display:flex;flex-direction:column;
  transition:box-shadow .2s;
  box-shadow:var(--sombra);
}
.video-card:hover{box-shadow:var(--sombra-fuerte)}
.video-thumb{
  background:linear-gradient(135deg,var(--azul-osc),var(--azul-claro));
  aspect-ratio:16/9;position:relative;
  display:flex;align-items:center;justify-content:center;
  color:#fff;overflow:hidden;
}
.video-thumb iframe{
  position:absolute;inset:0;width:100%;height:100%;border:0;
}
.video-thumb .play-icon{
  width:70px;height:70px;border-radius:50%;
  background:rgba(255,255,255,.15);
  border:2px solid rgba(255,255,255,.7);
  display:flex;align-items:center;justify-content:center;
  transition:all .25s;
}
.video-thumb .play-icon svg{width:28px;height:28px;fill:#fff;margin-left:4px}
.video-card:hover .play-icon{background:var(--acento);border-color:var(--acento)}
.video-info{padding:22px 24px}
.video-info .meta{
  font-family:var(--sans);font-size:.72rem;
  text-transform:uppercase;letter-spacing:2px;
  color:var(--acento);margin-bottom:8px;font-weight:600;
}
.video-info h3{
  font-size:1.1rem;color:var(--azul-osc);
  margin-bottom:8px;font-weight:normal;
}
.video-info .autor{
  font-family:var(--sans);font-size:.85rem;color:var(--gris-4);
}
.video-info .autor strong{color:var(--azul-osc)}

.video-upload-card{
  background:var(--gris-1);
  border:2px dashed var(--gris-3);
  padding:42px 28px;text-align:center;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:280px;
}
.video-upload-card svg{width:50px;height:50px;fill:var(--gris-3);margin-bottom:16px}
.video-upload-card h3{
  color:var(--azul-osc);font-size:1.1rem;
  margin-bottom:8px;font-weight:normal;
}
.video-upload-card p{
  color:var(--gris-4);font-size:.88rem;
  font-family:var(--sans);max-width:260px;
}

/* ============ LLAMADO ============ */
.llamado{
  background:linear-gradient(135deg,var(--azul-osc),var(--azul));
  color:#fff;padding:80px 28px;text-align:center;
  position:relative;overflow:hidden;
}
.llamado::before{
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(circle at 70% 30%,rgba(200,154,71,.18),transparent 55%);
  pointer-events:none;
}
.llamado-inner{max-width:820px;margin:0 auto;position:relative;z-index:1}
.llamado h2{
  font-size:2.1rem;font-weight:normal;
  margin-bottom:18px;line-height:1.3;
}
.llamado h2 span{color:var(--acento)}
.llamado p{color:#d9e3ee;font-size:1.08rem;margin-bottom:30px}
.llamado .nota{
  font-size:.85rem;color:#a8b8c8;
  margin-top:26px;font-style:italic;
}

/* ============ BREADCRUMB ============ */
.crumbs{
  background:var(--gris-1);
  padding:14px 28px;font-family:var(--sans);font-size:.86rem;
  color:var(--gris-4);
}
.crumbs-inner{max-width:1200px;margin:0 auto}
.crumbs a{color:var(--azul-claro);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.crumbs span.sep{margin:0 8px;color:var(--gris-3)}

/* ============ MINI HERO (subpáginas) ============ */
.mini-hero{
  background:linear-gradient(135deg,var(--azul-osc),var(--azul));
  color:#fff;padding:60px 28px 70px;
  position:relative;overflow:hidden;
}
.mini-hero::before{
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(circle at 85% 30%,rgba(200,154,71,.15),transparent 50%);
  pointer-events:none;
}
.mini-hero-inner{max-width:1000px;margin:0 auto;position:relative;z-index:1}
.mini-hero h1{
  font-size:2.2rem;font-weight:normal;
  line-height:1.25;margin-bottom:14px;
}
.mini-hero p{color:#d9e3ee;font-size:1.08rem;max-width:760px}

/* ============ FOOTER ============ */
footer.site-foot{
  background:var(--azul-osc);color:#9aaabd;
  padding:50px 28px 30px;
  font-family:var(--sans);font-size:.88rem;
}
.foot-grid{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;
  padding-bottom:30px;border-bottom:1px solid #1a3553;
}
.foot-col h4{
  color:#fff;font-size:.85rem;
  text-transform:uppercase;letter-spacing:2px;
  margin-bottom:16px;font-weight:600;
}
.foot-col ul{list-style:none}
.foot-col ul li{margin-bottom:8px}
.foot-col a{color:#9aaabd;text-decoration:none}
.foot-col a:hover{color:#fff}
.foot-bottom{
  max-width:1200px;margin:0 auto;
  padding-top:24px;text-align:center;
  font-size:.8rem;color:#7a8a9d;
}
.foot-brand{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.foot-brand .logo-mark{
  width:44px;height:44px;background:transparent;
  display:flex;align-items:center;justify-content:center;border-radius:0;
}
.foot-brand .logo-mark svg{width:44px;height:44px;fill:initial}
.foot-brand .name{
  font-weight:700;color:#fff;font-size:1rem;letter-spacing:.5px;
}
.foot-brand .sub{color:var(--acento);font-size:.7rem;letter-spacing:2px}

/* ============ FLECHA LINK ============ */
.arrow-link{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--sans);font-weight:600;font-size:.92rem;
  color:var(--azul-osc);text-decoration:none;
  margin-top:14px;
  transition:gap .2s, color .2s;
}
.arrow-link svg{width:16px;height:16px;fill:var(--acento);transition:transform .2s}
.arrow-link:hover{color:var(--acento-osc)}
.arrow-link:hover svg{transform:translateX(4px)}

/* ============ GRÁFICA TRANSFORMACIÓN BOLETO ============ */
.transform-graphic{
  display:grid;
  grid-template-columns:1fr 1.1fr 1fr;
  align-items:stretch;gap:0;
  margin:30px 0;
  background:#fff;
  border-radius:24px;
  border:1px solid var(--gris-2);
  box-shadow:0 14px 60px rgba(0,0,0,.08);
  overflow:hidden;
}

/* === Pasos laterales === */
.tg-step{
  padding:44px 38px;
  display:flex;flex-direction:column;
  position:relative;
}
.tg-step.tg-start{
  background:linear-gradient(180deg,#fde7e9 0%, #fff 100%);
  border-right:none;
}
.tg-step.tg-end{
  background:linear-gradient(180deg,#e3f1ea 0%, #fff 100%);
  border-left:none;
}
.tg-step .tg-badge{
  font-family:var(--sans);font-size:.72rem;
  letter-spacing:2.5px;text-transform:uppercase;
  font-weight:800;margin-bottom:18px;
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 12px;background:rgba(255,255,255,.75);
  border-radius:980px;align-self:flex-start;
  box-shadow:0 2px 8px rgba(0,0,0,.04);
}
.tg-step.tg-start .tg-badge{color:var(--rojo)}
.tg-step.tg-end .tg-badge{color:var(--verde)}
.tg-step .tg-badge svg{width:14px;height:14px;fill:currentColor}
.tg-step .tg-icon{
  width:72px;height:72px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:22px;
  box-shadow:0 6px 18px rgba(0,0,0,.06);
}
.tg-step.tg-start .tg-icon{background:#fff;border:2px solid var(--rojo)}
.tg-step.tg-end .tg-icon{background:#fff;border:2px solid var(--verde)}
.tg-step.tg-start .tg-icon svg{width:34px;height:34px;fill:var(--rojo)}
.tg-step.tg-end .tg-icon svg{width:34px;height:34px;fill:var(--verde)}
.tg-step h4{
  font-size:1.35rem;color:var(--azul-osc);
  font-weight:800;font-family:var(--sans);
  margin-bottom:18px;line-height:1.2;
  letter-spacing:-.01em;
}
.tg-step ul{list-style:none;margin:0}
.tg-step ul li{
  font-size:.95rem;
  padding:9px 0 9px 26px;position:relative;
  line-height:1.45;font-family:var(--sans);
  font-weight:500;
}
.tg-step ul li::before{
  content:"";position:absolute;left:0;top:15px;
  width:9px;height:9px;border-radius:50%;
}
.tg-step.tg-start ul li{color:#7a2730}
.tg-step.tg-start ul li::before{background:var(--rojo);opacity:.7}
.tg-step.tg-end ul li{color:#1f5a3e}
.tg-step.tg-end ul li::before{background:var(--verde);opacity:.7}
.tg-step ul li strong{color:var(--azul-osc);font-weight:800}

/* === Columna central (paso clave) === */
.tg-arrow{
  background:linear-gradient(160deg,#0a2540 0%, #14406b 100%);
  color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:44px 32px;min-width:240px;position:relative;
  text-align:center;
  overflow:hidden;
}
.tg-arrow::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(circle at 30% 20%, rgba(200,154,71,.18), transparent 50%),
    radial-gradient(circle at 70% 80%, rgba(200,154,71,.12), transparent 55%);
  pointer-events:none;
}
.tg-arrow > *{position:relative;z-index:1}
.tg-arrow .tg-arrow-label{
  font-family:var(--sans);font-weight:800;
  font-size:.78rem;letter-spacing:3px;
  text-transform:uppercase;color:var(--acento);
  margin-bottom:18px;
  display:inline-block;
  padding:5px 14px;background:rgba(200,154,71,.15);
  border:1px solid rgba(200,154,71,.35);border-radius:980px;
}
.tg-arrow .tg-arrow-icon{
  width:82px;height:82px;border-radius:50%;
  background:var(--acento);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 22px;
  box-shadow:0 12px 32px rgba(200,154,71,.45);
  position:relative;
}
.tg-arrow .tg-arrow-icon::after{
  content:"";position:absolute;inset:-8px;
  border:2px solid rgba(200,154,71,.35);
  border-radius:50%;
  animation:pulseRing 2.2s ease-out infinite;
}
@keyframes pulseRing{
  0%{transform:scale(1);opacity:.7}
  100%{transform:scale(1.35);opacity:0}
}
.tg-arrow .tg-arrow-icon svg{width:38px;height:38px;fill:#fff}
.tg-arrow h3{
  font-size:1.4rem;font-weight:800;color:#fff;
  margin-bottom:18px;line-height:1.15;
  font-family:var(--sans);letter-spacing:-.01em;
}
.tg-arrow p{
  font-family:var(--sans);font-size:.88rem;
  color:#cfd9e3;line-height:1.55;
  max-width:280px;margin:0 auto;
}

/* Sub-pasos numerados dentro del paso clave */
.tg-arrow .tg-steps{
  margin-top:24px;padding-top:22px;
  border-top:1px solid rgba(255,255,255,.12);
  display:flex;flex-direction:column;gap:10px;
  width:100%;max-width:280px;
}
.tg-arrow .tg-steps .ts-item{
  display:flex;align-items:flex-start;gap:12px;
  font-family:var(--sans);font-size:.82rem;
  color:#dfe5ec;line-height:1.4;text-align:left;
}
.tg-arrow .tg-steps .ts-num{
  flex-shrink:0;
  width:24px;height:24px;border-radius:50%;
  background:var(--acento);color:#0a2540;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:.78rem;
}
.tg-arrow .tg-steps .ts-item strong{color:#fff;font-weight:700;display:block;margin-bottom:2px}

/* === Footer del flujo === */
.tg-footer{
  background:#0a2540;color:#fff;
  padding:30px 36px;text-align:center;
  font-family:var(--sans);
  border-top:3px solid var(--acento);
}
.tg-footer h4{
  font-size:1.15rem;color:#fff;margin-bottom:8px;
  font-weight:800;letter-spacing:-.005em;
}
.tg-footer h4 span{color:var(--acento)}
.tg-footer p{
  color:#a8b6c6;font-size:.92rem;
  max-width:680px;margin:0 auto;line-height:1.5;
}

@media (max-width:880px){
  .transform-graphic{grid-template-columns:1fr;border-radius:18px}
  .tg-step.tg-start,.tg-step.tg-end{border:none}
  .tg-arrow{padding:38px 28px}
  .tg-arrow h3{font-size:1.2rem}
}

@media (max-width:880px){
  .transform-graphic{grid-template-columns:1fr;}
  .tg-arrow{min-width:0;padding:18px}
  .tg-arrow::before{
    left:50%;top:-1px;transform:translateX(-50%);
    border-left:14px solid transparent;
    border-right:14px solid transparent;
    border-top:14px solid var(--azul-osc);
    border-bottom:0;width:0;height:0;
  }
  .tg-arrow::after{
    right:auto;left:50%;top:auto;bottom:-1px;transform:translateX(-50%);
    border-left:14px solid transparent;
    border-right:14px solid transparent;
    border-bottom:14px solid var(--azul-osc);
    border-top:0;width:0;height:0;
  }
  .tg-step.tg-start{border-right:none;border-bottom:1px dashed var(--gris-2)}
  .tg-step.tg-end{border-left:none;border-top:1px dashed var(--gris-2)}
}

/* ============ AVISO ARANCEL ============ */
.aviso-arancel{
  background:var(--acento-suave);
  border-left:4px solid var(--acento);
  padding:22px 28px;margin:24px 0;
  display:flex;align-items:flex-start;gap:18px;
  font-family:var(--sans);
}
.aviso-arancel .aa-icono{
  width:42px;height:42px;border-radius:50%;
  background:var(--acento);color:#fff;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;font-weight:700;font-size:.92rem;
}
.aviso-arancel h4{
  color:var(--azul-osc);font-size:1rem;
  margin-bottom:6px;font-weight:700;
}
.aviso-arancel p{
  color:var(--gris-4);font-size:.92rem;line-height:1.55;
}

/* ============ BOTÓN DESCARGAR PDF ============ */
.btn-pdf{
  display:inline-flex;align-items:center;gap:10px;
  padding:12px 22px;
  background:var(--azul-osc);color:#fff;
  border:2px solid var(--azul-osc);
  font-family:var(--sans);font-size:.9rem;font-weight:600;
  cursor:pointer;border-radius:2px;
  text-decoration:none;
  transition:all .2s;
}
.btn-pdf:hover{background:var(--acento);border-color:var(--acento)}
.btn-pdf svg{width:18px;height:18px;fill:currentColor}
.barra-acciones{
  background:var(--gris-1);
  padding:18px 28px;
  display:flex;justify-content:flex-end;align-items:center;gap:14px;
  border-bottom:1px solid var(--gris-2);
}
.barra-acciones .ba-leyenda{
  font-family:var(--sans);font-size:.85rem;
  color:var(--gris-4);
}

/* ===========================================
   APPLE.COM STYLE OVERRIDES
   Tipografía SF Pro, espaciado generoso,
   botones tipo pill, paleta limpia
   =========================================== */

body{
  font-family:var(--sans);
  color:var(--apple-fg);
  background:#fff;
  letter-spacing:-.003em;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

h1, h2, h3, h4, h5{
  font-family:var(--sans);
  color:var(--apple-fg);
  letter-spacing:-.022em;
  font-weight:600;
}

/* HERO grande tipo Apple */
.hero{
  padding:120px 28px 140px;
  background:linear-gradient(180deg,#000 0%,#1d1d1f 100%);
}
.hero h1{
  font-size:clamp(2.6rem, 5.4vw, 4.2rem);
  font-weight:700;
  letter-spacing:-.025em;
  line-height:1.07;
  margin-bottom:24px;
}
.hero p.lead{
  font-size:clamp(1.1rem, 1.6vw, 1.45rem);
  font-weight:400;
  color:#a1a1a6;
  letter-spacing:-.005em;
  line-height:1.4;
}
.hero .kicker{
  color:var(--acento);
  font-weight:600;
  font-size:.78rem;
  letter-spacing:2px;
}

/* Mini hero más limpio */
.mini-hero{
  background:#fbfbfd;
  color:var(--apple-fg);
  padding:100px 28px 80px;
}
.mini-hero::before{display:none}
.mini-hero h1{
  font-size:clamp(2.2rem, 4vw, 3.4rem);
  font-weight:700;
  letter-spacing:-.022em;
  line-height:1.1;
  color:var(--apple-fg);
}
.mini-hero h1 span{color:var(--azul-claro)}
.mini-hero p{
  color:var(--apple-fg-2);
  font-size:clamp(1rem, 1.3vw, 1.2rem);
  font-weight:400;
  line-height:1.5;
}
.mini-hero .kicker{color:var(--azul-claro);font-weight:600}

/* Section titles más Apple */
h2.section-title{
  font-size:clamp(2rem, 3.5vw, 3rem);
  font-weight:700;
  color:var(--apple-fg);
  letter-spacing:-.022em;
  line-height:1.1;
  margin-bottom:18px;
  padding-bottom:0;
}
h2.section-title::after{display:none}
h2.section-title.center{text-align:center}

.section-sub{
  font-size:1.18rem;
  color:var(--apple-fg-2);
  font-weight:400;
  line-height:1.5;
  letter-spacing:-.005em;
  margin-bottom:50px;
}

/* Botones pill estilo Apple */
.btn{
  border-radius:var(--apple-radius);
  padding:14px 28px;
  font-weight:500;
  font-size:1rem;
  letter-spacing:-.005em;
}
.btn-primary{
  background:var(--azul-claro);
  border-color:var(--azul-claro);
}
.btn-primary:hover{
  background:#0058a5;
  border-color:#0058a5;
}
.btn-secondary{
  border-width:1px;
}
.btn-pdf{
  border-radius:var(--apple-radius);
  padding:11px 22px;
  font-weight:500;
}

/* Brand más limpio */
.brand{font-weight:600;letter-spacing:-.01em}
.brand-text .b1{font-size:1rem;font-weight:600}
.brand-text .b2{font-size:.62rem;letter-spacing:1.5px;font-weight:500}

/* Nav más sutil */
nav ul{gap:32px}
nav a{font-weight:400;font-size:.92rem}

/* Botón de acceso al administrador */
.nav-admin{margin-left:auto}
nav a.btn-admin{
  display:inline-flex;align-items:center;
  background:rgba(200,154,71,.12);
  border:1px solid rgba(200,154,71,.35);
  color:#c89a47 !important;
  padding:6px 14px !important;
  border-radius:980px;
  font-size:.82rem !important;font-weight:600 !important;
  letter-spacing:.2px;
  transition:background .15s, border-color .15s, color .15s, transform .1s;
}
nav a.btn-admin:hover{
  background:#c89a47;
  border-color:#c89a47;
  color:#0a2540 !important;
  border-bottom-color:#c89a47 !important;
}
nav a.btn-admin:active{transform:translateY(1px)}
@media (max-width:900px){
  .nav-admin{margin-left:0}
  nav a.btn-admin{margin-top:4px}
}

/* Cards más limpias */
.card{
  border-radius:18px;
  border-top:none;
  background:#fbfbfd;
  box-shadow:none;
  padding:36px 30px;
}
.card:hover{
  box-shadow:0 10px 40px rgba(0,0,0,.08);
  transform:translateY(-2px);
}
.card h3{
  font-size:1.35rem;
  font-weight:600;
  color:var(--apple-fg);
}
.card p{color:var(--apple-fg-2)}
.card.dorado{background:#fdf7eb}
.card.verde{background:#e8f5ed}

/* Aud-cards más amplias */
.aud-card{
  border-radius:18px;
  border:1px solid #d2d2d7;
  border-top:1px solid #d2d2d7;
  background:#fff;
  padding:44px 40px;
}
.aud-card.deudor,
.aud-card.acreedor{border-top:3px solid var(--azul-claro)}
.aud-card.acreedor{border-top-color:var(--acento)}
.aud-card h3{font-size:1.6rem;font-weight:700;letter-spacing:-.018em}

/* Sección block más aire */
section.block{padding:100px 28px;background:#FFFBF5}
section.alt .inner{padding:0 28px}
section.alt{background:#EEF6FC}
section.dark{background:#1d1d1f}

/* Paleta pastel suave alternada entre bloques */
section.block + section.block{background:#F4FAF1}
section.block + section.block + section.block{background:#FFF6F0}
section.block + section.block + section.block + section.block{background:#F5F1FB}
section.block + section.block + section.block + section.block + section.block{background:#FFFCEB}

/* Clases modificadoras opcionales para forzar color */
section.block.bg-crema, .bg-crema{background:#FFFBF5 !important}
section.block.bg-azul, .bg-azul{background:#EEF6FC !important}
section.block.bg-verde, .bg-verde{background:#F0F8EE !important}
section.block.bg-rosa, .bg-rosa{background:#FDF3F0 !important}
section.block.bg-lavanda, .bg-lavanda{background:#F5F0FB !important}
section.block.bg-amarillo, .bg-amarillo{background:#FFFCEB !important}
section.block.bg-menta, .bg-menta{background:#EBF7F2 !important}
section.block.bg-durazno, .bg-durazno{background:#FFF1E6 !important}

/* Suaviza también la doble-puerta y otros wrappers */
.doble-puerta-wrap{background:#FFF8EE}
.barra-acciones{background:#FCF8F2}
.crumbs{background:#FAF6F0}

/* Misión institucional en el footer */
.foot-mision{
  max-width:1200px;margin:0 auto;
  padding:30px 28px 24px;
  border-top:1px solid #d2d2d7;
  font-family:var(--sans);
}
.foot-mision p{
  color:var(--apple-fg-2);
  font-size:.92rem;line-height:1.6;
  text-align:center;max-width:880px;margin:0 auto;
}
.foot-mision strong{color:var(--apple-fg);font-weight:700}
section.dark h2.section-title{color:#fff;letter-spacing:-.022em}
section.dark .section-sub{color:#a1a1a6}

/* Llamado más limpio */
.llamado{
  background:linear-gradient(180deg,#000 0%,#1d1d1f 100%);
  padding:120px 28px;
}
.llamado::before{display:none}
.llamado h2{
  font-size:clamp(2.2rem, 4.5vw, 3.6rem);
  font-weight:700;
  letter-spacing:-.022em;
  line-height:1.1;
  color:#ffffff !important;
}
.llamado h2 span{color:var(--acento) !important}
.llamado p{
  font-size:1.18rem;
  color:#a1a1a6;
  line-height:1.5;
}

/* Títulos sobre fondo oscuro = blanco con spans amarillos */
section.dark h2,
section.dark h3,
section.dark h4{color:#ffffff !important}
section.dark h2 span,
section.dark h3 span,
section.dark h4 span{color:var(--acento) !important}

/* Excepción: títulos de las cápsulas (cards) dentro de secciones oscuras
   deben ir en azul oscuro y negrita, porque la card tiene fondo pastel claro */
section.dark .card h3,
section.dark .card h4,
section.dark a.card h3,
section.dark a.card h4{
  color:#0a2540 !important;
  font-weight:800 !important;
  letter-spacing:-.01em;
}
section.dark .card h3 span,
section.dark .card h4 span{color:#0a2540 !important}
.hero h1{color:#ffffff !important}
.hero h1 span{color:var(--acento) !important}

/* Tablas comparativas dentro de fondos oscuros: forzar legibilidad */
section.dark table.compara,
section.dark table.compara tbody,
section.dark table.compara tr{background:#ffffff}
section.dark table.compara td{color:var(--apple-fg) !important;background:#ffffff}
section.dark table.compara tbody th{color:var(--azul-osc) !important;background:var(--gris-1) !important}
section.dark table.compara td.bueno{color:var(--verde) !important}
section.dark table.compara td.malo{color:var(--rojo) !important}
section.dark table.compara thead th{color:#ffffff !important;background:var(--azul-osc) !important}
section.dark table.compara th.criterio{color:var(--azul-osc) !important;background:var(--gris-1) !important}
section.dark table.compara th.quiebra{color:#ffffff !important;background:#7a2730 !important}
section.dark .leyenda{color:#a1a1a6 !important}

/* KPIs estilo Apple */
.kpis{gap:28px;margin-top:60px}
.kpi{
  border:none;border-radius:18px;
  background:#fbfbfd;
  padding:40px 22px;
}
.kpi .num{
  font-size:3.4rem;
  font-weight:700;
  color:var(--azul-claro);
  letter-spacing:-.025em;
  margin-bottom:14px;
}
.kpi .lbl{
  color:var(--apple-fg-2);
  font-weight:400;
  text-transform:none;
  letter-spacing:-.003em;
  font-size:.95rem;
}

/* Doble puerta más Apple */
.doble-puerta-wrap{
  background:#fbfbfd;
  padding:100px 28px;
}
.doble-puerta-head h2{
  font-size:clamp(2rem, 3.5vw, 3rem);
  font-weight:700;
  letter-spacing:-.022em;
  color:var(--apple-fg);
}
.doble-puerta-head p{
  color:var(--apple-fg-2);
  font-size:1.18rem;
  font-weight:400;
}
.puerta{
  border-radius:22px;
  border:none;
  background:#fff;
  box-shadow:0 4px 24px rgba(0,0,0,.06);
  padding:54px 42px;
}
.puerta::before{display:none}
.puerta:hover{box-shadow:0 12px 48px rgba(0,0,0,.12)}
.puerta h3{
  font-size:2.2rem;font-weight:700;letter-spacing:-.022em;
  line-height:1.1;color:var(--apple-fg);
}
.puerta .lead{color:var(--apple-fg-2);font-size:1.05rem;line-height:1.5}
.puerta .cta{
  border-radius:var(--apple-radius);
  padding:13px 26px;font-weight:500;
}

/* FAQ más limpio */
details{
  border-radius:14px;
  border:none;
  background:#fbfbfd;
  margin-bottom:6px;
}
summary{
  padding:22px 28px;
  font-weight:500;
  color:var(--apple-fg);
}
summary::after{color:var(--azul-claro);font-weight:300}
.faq-body{padding:0 28px 24px;color:var(--apple-fg-2);line-height:1.55}

/* Footer más limpio */
footer.site-foot{
  background:#fbfbfd;
  color:var(--apple-fg-2);
  border-top:1px solid #d2d2d7;
}
.foot-col h4{color:var(--apple-fg);font-size:.8rem;font-weight:600}
.foot-col a{color:var(--apple-fg-2)}
.foot-col a:hover{color:var(--azul-claro)}
.foot-bottom{color:var(--apple-fg-2);border-top-color:#d2d2d7;background:transparent}
.foot-grid{border-bottom-color:#d2d2d7}
.foot-brand .name{color:var(--apple-fg)}
.foot-brand .sub{color:var(--apple-fg-2);font-size:.62rem}

/* Hero image (nuevo) */
.hero-image{
  position:relative;width:100%;
  max-width:1200px;margin:60px auto 0;
  border-radius:24px;overflow:hidden;
  aspect-ratio:21/9;
  background:linear-gradient(135deg,#1d1d1f,#3a3a3c);
}
.hero-image img{
  width:100%;height:100%;object-fit:cover;
  display:block;
}
.section-image{
  width:100%;max-width:1100px;margin:50px auto 0;
  border-radius:22px;overflow:hidden;
  aspect-ratio:16/9;
  background:linear-gradient(135deg,#e8eaed,#d2d2d7);
}
.section-image img{width:100%;height:100%;object-fit:cover;display:block}

.image-split{
  display:grid;grid-template-columns:1fr 1fr;
  gap:50px;align-items:center;
  margin-top:50px;
}
@media (max-width:880px){
  .image-split{grid-template-columns:1fr;gap:30px}
}
.image-split .is-img{
  border-radius:22px;overflow:hidden;
  aspect-ratio:4/3;
  background:linear-gradient(135deg,#e8eaed,#d2d2d7);
}
.image-split .is-img img{width:100%;height:100%;object-fit:cover;display:block}
.image-split .is-text h3{
  font-size:clamp(2.2rem,4vw,3.4rem);
  font-weight:800;letter-spacing:-.025em;line-height:1.1;
  color:var(--apple-fg);margin-bottom:22px;
}
.image-split .is-text p{
  color:var(--apple-fg-2);font-size:1.05rem;line-height:1.6;
  margin-bottom:14px;
}
.image-split .is-text .quote-mark{
  color:var(--azul-claro);font-size:3rem;line-height:1;
  font-weight:700;margin-bottom:0;
}

/* Header más limpio */
header.top{
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(0,0,0,.08);
  color:var(--apple-fg);
}
.brand{color:var(--apple-fg)}
.brand-text .b1{color:var(--apple-fg)}
nav a{color:var(--apple-fg);opacity:.8}
nav a:hover,nav a.activo{color:var(--apple-fg);opacity:1;border-bottom-color:var(--azul-claro)}
@media (max-width:720px){
  nav ul{background:#fff;color:var(--apple-fg)}
  nav ul li a{color:var(--apple-fg)}
}

/* Crumbs más sutil */
.crumbs{background:#fbfbfd;color:var(--apple-fg-2);border-bottom:1px solid #d2d2d7}
.crumbs a{color:var(--azul-claro)}

/* Barra acciones discreta */
.barra-acciones{background:#fbfbfd;border-bottom:1px solid #d2d2d7}

/* ============ IMPRESIÓN / PDF ============ */
@media print{
  *{
    -webkit-print-color-adjust:exact !important;
    print-color-adjust:exact !important;
  }
  body{font-size:11pt;color:#000;background:#fff}
  header.top,
  .crumbs,
  .barra-acciones,
  footer.site-foot,
  .menu-toggle,
  nav,
  .btn-pdf,
  .hero-cta,
  .llamado .hero-cta,
  .llamado .nota{
    display:none !important;
  }
  .mini-hero,
  .llamado,
  section.dark,
  section.dark .inner{
    background:#fff !important;
    color:#000 !important;
    padding:18px 0 !important;
  }
  .mini-hero h1, .llamado h2, section.dark h2.section-title{color:#0a2540 !important}
  .mini-hero p, .llamado p, section.dark .section-sub, section.dark p{color:#333 !important}
  .mini-hero .kicker{color:#9a7530 !important}
  section.block, section.alt, section.dark{padding:18px 0 !important}
  section.alt{background:#fff !important}
  .card, .aud-card, .def-box, .mito, details, .transform-graphic{
    page-break-inside:avoid;break-inside:avoid;
    box-shadow:none !important;
    border:1px solid #ccc !important;
  }
  h1, h2, h3, h4{page-break-after:avoid;break-after:avoid}
  table.compara{box-shadow:none !important}
  .tg-arrow{background:#0a2540 !important;color:#fff !important}
  .tg-arrow::before, .tg-arrow::after{display:none}
  a{color:inherit;text-decoration:none}
  body::before{
    content:"Superando Crisis Paraguay · Material informativo";
    display:block;text-align:center;
    font-family:'Helvetica Neue',sans-serif;font-size:9pt;
    color:#666;padding:8px 0;border-bottom:1px solid #ccc;
    margin-bottom:14px;
  }
}

/* ============ RESPONSIVE ============ */
@media (max-width:980px){
  .grid-3,.grid-4,.kpis{grid-template-columns:repeat(2,1fr)}
  .grid-2{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr;gap:30px}
}
@media (max-width:720px){
  .hero h1{font-size:1.9rem}
  .hero{padding:60px 22px 70px}
  .mini-hero h1{font-size:1.6rem}
  section.block{padding:60px 22px}
  section.alt .inner,section.dark .inner{padding:0 22px}
  section.dark .inner{padding:60px 22px}
  .grid-3,.grid-4,.kpis{grid-template-columns:1fr}
  nav ul{
    display:none;position:absolute;top:100%;left:0;right:0;
    background:var(--azul-osc);flex-direction:column;
    padding:18px 22px;gap:14px;border-bottom:3px solid var(--acento);
  }
  nav ul.abierto{display:flex}
  .menu-toggle{display:block}
  h2.section-title{font-size:1.5rem}
  .llamado h2{font-size:1.5rem}
  .timeline{padding-left:42px}
  .tl-item .tl-icon{left:-42px;width:34px;height:34px}
  .tl-item .tl-icon svg{width:15px;height:15px}
  .timeline::before{left:16px}
}