/* ==========================================================================
   Financiera Darcredit S.A.S. — hoja de estilos principal
   Estructura aprobada por el cliente · paleta clara en tonos tierra
   ========================================================================== */

:root{
  --papel:#fbf7f0;
  --crema:#f2ead9;
  --arena:#e5d8bf;
  --tierra:#6b5433;
  --tierra-d:#4a3a22;
  --tierra-x:#33281a;
  --ocre:#9c7328;
  --ocre-c:#b78a35;
  --oro:#c39a3c;
  --oro-s:#efe2c4;
  --tinta:#33281a;
  --texto:#6a5b47;
  --suave:#9b8a72;
  --linea:#e2d6c0;
  --linea-f:#d3c3a5;
  --blanco:#ffffff;
  --alerta:#98422a;
  --alerta-s:#fbeee8;
  --ok:#55702f;
  --ok-s:#eef2e3;

  --maxw:1180px;
  --font:'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --serif:'Fraunces', Georgia, 'Times New Roman', serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:80px}
body{
  margin:0; background:var(--papel); color:var(--texto);
  font-family:var(--font); font-size:16.5px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:var(--ocre); text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{
  color:var(--tinta); margin:0 0 .5em; font-family:var(--serif);
  font-weight:600; letter-spacing:-.012em; line-height:1.14;
}
h1{font-size:clamp(2.2rem,4.6vw,3.7rem)}
h2{font-size:clamp(1.8rem,3.1vw,2.7rem)}
h3{font-size:1.16rem}
h2 em,h1 em{font-style:italic; color:var(--ocre)}
p{margin:0 0 1.05em}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px}
.narrow{max-width:800px}
section{padding:100px 0}
.center{text-align:center; max-width:760px; margin:0 auto 56px}
.eyebrow{
  display:block; font-family:var(--font); font-size:.71rem; font-weight:800;
  letter-spacing:.26em; text-transform:uppercase; color:var(--ocre); margin-bottom:18px;
}
.lead{font-size:1.06rem}
.center .lead{margin-left:auto; margin-right:auto; max-width:620px}

/* ---------- Botones ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 30px; border-radius:999px; border:1.5px solid transparent;
  font-family:var(--font); font-weight:700; font-size:.94rem; cursor:pointer;
  text-decoration:none; white-space:nowrap;
  transition:transform .2s ease, background .2s ease, box-shadow .2s ease, color .2s ease;
}
.btn:hover{text-decoration:none; transform:translateY(-2px)}
.btn-primary{background:var(--oro); color:var(--tierra-x)}
.btn-primary:hover{background:var(--ocre-c); box-shadow:0 10px 26px rgba(156,115,40,.26)}
.btn-ghost{background:transparent; color:var(--tierra-d); border-color:var(--linea-f)}
.btn-ghost:hover{border-color:var(--tierra-d); background:var(--blanco)}
.btn-dark{background:var(--tierra-d); color:var(--papel)}
.btn-dark:hover{background:var(--tierra)}
.btn-light{background:transparent; color:var(--oro); border-color:rgba(195,154,60,.55)}
.btn-light:hover{background:rgba(195,154,60,.14)}
.btn-block{width:100%}
.btn:focus-visible{outline:2px solid var(--ocre); outline-offset:3px}

/* ---------- Barra superior y encabezado ---------- */
.topbar{
  background:var(--crema); color:var(--suave); font-size:.8rem; padding:9px 0;
  border-bottom:1px solid var(--linea);
}
.topbar .wrap{display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap}
.topbar a{color:var(--tierra)}
.topbar .tb-links{display:flex; gap:18px; align-items:center}

.site-header{
  position:sticky; top:0; z-index:60; background:rgba(251,247,240,.95);
  backdrop-filter:saturate(150%) blur(9px); border-bottom:1px solid var(--linea);
}
.nav{display:flex; align-items:center; justify-content:space-between; gap:22px; padding:12px 0}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none}
.brand:hover{text-decoration:none}
.brand img{height:44px; width:44px}
.brand-name{display:flex; flex-direction:column; line-height:1.1}
.brand-name b{
  color:var(--tinta); font-family:var(--serif); font-size:1.2rem; font-weight:600; letter-spacing:.02em;
}
.brand-name span{
  color:var(--suave); font-size:.57rem; font-weight:700; letter-spacing:.24em;
  text-transform:uppercase; margin-top:3px;
}
.menu{display:flex; align-items:center; gap:26px}
.menu a{color:var(--tierra); font-weight:600; font-size:.88rem}
.menu a:hover{color:var(--ocre); text-decoration:none}
.nav-actions{display:flex; align-items:center; gap:10px}
.nav-actions .btn{padding:11px 22px; font-size:.87rem}
.nav-toggle{
  display:none; background:none; border:1.5px solid var(--linea-f); border-radius:6px;
  width:44px; height:42px; cursor:pointer; padding:0; align-items:center; justify-content:center;
}
.nav-toggle span{display:block; width:20px; height:2px; background:var(--tierra-d); position:relative}
.nav-toggle span::before,.nav-toggle span::after{
  content:''; position:absolute; left:0; width:20px; height:2px; background:var(--tierra-d);
}
.nav-toggle span::before{top:-6px} .nav-toggle span::after{top:6px}

/* ---------- Hero ---------- */
.hero{
  padding:84px 0 0; position:relative; overflow:hidden;
  background:radial-gradient(ellipse at 18% 0%, rgba(195,154,60,.2), transparent 58%);
  border-bottom:1px solid var(--linea);
}
.hero-grid{display:grid; grid-template-columns:1.02fr .98fr; gap:60px; align-items:center}
.hero .sello{
  display:inline-flex; align-items:center; gap:9px; border:1px solid var(--linea-f);
  border-radius:999px; padding:8px 18px; margin-bottom:26px;
  font-size:.7rem; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--ocre);
}
.hero .sello::before{content:''; width:7px; height:7px; border-radius:50%; background:var(--oro)}
.hero h1{margin-bottom:.34em; text-wrap:balance}
.hero p{font-size:1.1rem; max-width:44ch}
.hero-cta{display:flex; gap:14px; flex-wrap:wrap; margin-top:30px}
.hero-foto{position:relative; border-radius:6px; overflow:hidden; box-shadow:0 26px 60px rgba(51,40,26,.2)}
.hero-foto img{width:100%; height:100%; object-fit:cover; aspect-ratio:5/6}
.hero-dato{
  position:absolute; left:20px; bottom:20px; display:flex; align-items:center; gap:14px;
  background:rgba(251,247,240,.95); backdrop-filter:blur(6px); padding:14px 20px; border-radius:4px;
}
.hero-dato b{font-family:var(--serif); font-size:1.5rem; color:var(--tinta); line-height:1}
.hero-dato span{font-size:.79rem; color:var(--texto); line-height:1.35}

/* ---------- Banda de cifras ---------- */
.cifras{
  display:grid; grid-template-columns:repeat(6,1fr);
  margin-top:80px; border-top:1px solid var(--linea);
}
.cifra{padding:26px 16px; border-right:1px solid var(--linea); text-align:center}
.cifra:last-child{border-right:none}
.cifra b{
  display:block; color:var(--tinta); font-family:var(--serif); font-size:1.85rem;
  font-weight:600; line-height:1; font-variant-numeric:tabular-nums;
}
.cifra i{display:block; width:34px; height:1px; background:var(--oro); margin:12px auto}
.cifra span{
  display:block; font-size:.68rem; color:var(--suave); font-weight:700;
  text-transform:uppercase; letter-spacing:.13em; line-height:1.5;
}

/* ---------- Manifiesto ---------- */
.manifiesto{background:var(--crema); border-bottom:1px solid var(--linea); text-align:center}
.manifiesto .wrap{max-width:820px}
.manifiesto p{font-size:1.1rem; max-width:60ch; margin:0 auto 1.1em}

/* ---------- Rejilla de tarjetas ---------- */
.crema{background:var(--crema); border-top:1px solid var(--linea); border-bottom:1px solid var(--linea)}
.section-alt{background:var(--crema); border-top:1px solid var(--linea); border-bottom:1px solid var(--linea)}
.cards{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--linea);
  border:1px solid var(--linea)}
.cards-3{grid-template-columns:repeat(3,1fr)}
.card{background:var(--papel); padding:34px 28px; transition:background .3s ease}
.crema .card,.section-alt .card{background:var(--crema)}
.card:hover{background:var(--blanco)}
.card .icon{
  width:42px; height:42px; border:1.5px solid var(--linea-f); color:var(--ocre);
  display:grid; place-items:center; font-size:1.1rem; margin-bottom:20px; border-radius:4px;
  transition:background .3s ease, color .3s ease, border-color .3s ease;
}
.card:hover .icon{background:var(--oro); color:var(--blanco); border-color:var(--oro)}
.card p{font-size:.93rem; margin:0}
.card .rotulo{
  display:block; font-size:.66rem; font-weight:800; letter-spacing:.14em;
  text-transform:uppercase; color:var(--suave); margin:16px 0 4px;
}
.card .enlace{
  display:inline-block; margin-top:20px; font-weight:700; font-size:.9rem; color:var(--ocre);
}
.card.destacada{position:relative; background:var(--blanco); box-shadow:inset 0 0 0 1.5px var(--oro)}
.card .cinta{
  position:absolute; top:-1px; left:28px; background:var(--oro); color:var(--tierra-x);
  font-size:.64rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  padding:5px 12px; border-radius:0 0 4px 4px;
}

/* ---------- A quién ayudamos ---------- */
.negocios{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.negocio{
  position:relative; border-radius:6px; overflow:hidden; min-height:270px;
  display:flex; align-items:flex-end; background:var(--tierra-d);
}
.negocio img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform .6s cubic-bezier(.2,.8,.2,1);
}
.negocio::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(28,21,12,.88) 0%, rgba(28,21,12,.35) 45%, rgba(28,21,12,.05) 100%);
}
.negocio:hover img{transform:scale(1.05)}
.negocio .texto{position:relative; z-index:1; padding:26px}
.negocio h3{color:var(--papel); margin:0 0 4px; font-size:1.25rem}
.negocio span{color:#d9c9a8; font-size:.88rem}

/* ---------- Cómo funciona: línea de tiempo ---------- */
.linea-tiempo{position:relative; margin-top:62px}
.linea-tiempo .riel{position:absolute; top:26px; left:6%; right:6%; height:1px; background:var(--linea-f)}
.linea-tiempo .riel i{
  position:absolute; inset:0; display:block; background:var(--oro);
  transform-origin:left; transform:scaleX(1);
}
.pasos{position:relative; display:grid; grid-template-columns:repeat(6,1fr); gap:14px}
.paso{text-align:center}
.paso .bola{
  width:52px; height:52px; border-radius:50%; margin:0 auto 20px;
  display:grid; place-items:center; font-family:var(--serif); font-weight:600; font-size:1rem;
  background:var(--oro); color:var(--tierra-x); border:4px solid var(--papel);
}
.section-alt .paso .bola,.crema .paso .bola{border-color:var(--crema)}
.paso.pendiente .bola{background:var(--arena); color:var(--tierra)}
.paso h3{font-size:1rem; margin:0 0 6px}
.paso p{font-size:.86rem; margin:0; color:var(--texto)}

/* ---------- Cómo se liquida el crédito ---------- */
.plan-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center}
.grafico{width:100%; height:auto}
.grafico .eje{stroke:var(--linea-f)}
.grafico .etiquetas text{fill:var(--suave); font-family:var(--font); font-weight:700}
.grafico-caja{margin:0; background:var(--blanco); border:1px solid var(--linea); padding:30px}
.grafico-caja figcaption{
  font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ocre); margin-bottom:22px;
}
.grafico-caja small{display:block; margin-top:18px; font-size:.78rem; line-height:1.5; color:var(--suave)}
.lista-plan{list-style:none; margin:26px 0 0; padding:0}
.lista-plan li{padding:16px 0; border-top:1px solid var(--linea); display:flex; flex-direction:column; gap:3px}
.lista-plan b{color:var(--tinta); font-size:.97rem}
.lista-plan span{font-size:.88rem}

/* ---------- Historias reales ---------- */
.historias{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.historia{background:var(--blanco); border:1px solid var(--linea); padding:32px; border-radius:6px}
.historia .comilla{font-family:var(--serif); font-size:2.6rem; color:var(--oro); line-height:.6; display:block; margin-bottom:14px}
.historia p{font-size:.96rem; font-style:italic; color:var(--tinta)}
.historia footer{margin-top:20px; padding-top:16px; border-top:1px solid var(--linea); font-size:.85rem}
.historia footer b{display:block; color:var(--tinta); font-style:normal}
.historia footer span{color:var(--suave)}
.pendiente-nota{
  grid-column:1 / -1; background:var(--oro-s); border-left:3px solid var(--oro);
  padding:16px 20px; font-size:.88rem; color:var(--tierra);
}

/* ---------- Preguntas frecuentes ---------- */
.faq{max-width:840px; margin:0 auto}
.faq details{border-bottom:1px solid var(--linea)}
.faq summary{
  cursor:pointer; list-style:none; padding:22px 40px 22px 0; position:relative;
  font-family:var(--serif); font-size:1.1rem; color:var(--tinta); font-weight:600;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:'+'; position:absolute; right:6px; top:50%; transform:translateY(-50%);
  font-family:var(--font); font-size:1.5rem; color:var(--oro); font-weight:400; line-height:1;
}
.faq details[open] summary::after{content:'−'}
.faq summary:focus-visible{outline:2px solid var(--ocre); outline-offset:2px}
.faq .respuesta{padding:0 40px 24px 0; font-size:.96rem; margin:0}

/* ---------- Llamado final ---------- */
.cta{
  background:var(--tierra-d); color:#e6dbc5; text-align:center;
  border-top:1px solid var(--linea);
}
.cta h2{color:var(--papel)}
.cta h2 em{color:var(--oro)}
.cta p{color:#cbbb9d; max-width:600px; margin-left:auto; margin-right:auto}
.cta .btn-row{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:30px}

/* ---------- Pie ---------- */
.site-footer{background:var(--tierra-x); color:#b6a687; padding:66px 0 26px; font-size:.88rem}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:36px}
.site-footer h4{
  color:var(--oro); font-family:var(--font); font-size:.7rem; letter-spacing:.2em;
  text-transform:uppercase; margin:0 0 18px; font-weight:800;
}
.site-footer a{color:#c8b795; display:block; margin-bottom:10px}
.foot-logo{display:block; margin-bottom:22px}
.foot-logo img{width:190px; height:auto}
.foot-bottom{
  border-top:1px solid rgba(230,219,197,.18); margin-top:44px; padding-top:22px;
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:.79rem; color:#94856a;
}

/* ---------- Páginas de formulario ---------- */
.page-head{background:var(--crema); color:var(--texto); padding:60px 0; border-bottom:1px solid var(--linea)}
.page-head h1{color:var(--tinta); margin-bottom:.3em; font-size:clamp(1.9rem,4vw,2.8rem)}
.page-head p{margin:0; max-width:62ch}
.form-card{
  background:var(--blanco); border:1px solid var(--linea);
  padding:36px; margin-top:-36px; position:relative; z-index:2;
}
.field{margin-bottom:18px}
.field label{
  display:block; font-weight:800; font-size:.76rem; color:var(--tierra); margin-bottom:8px;
  letter-spacing:.09em; text-transform:uppercase; font-family:var(--font);
}
.field .hint,.hint{
  display:block; font-weight:600; font-size:.79rem; color:var(--suave); margin-top:6px;
  letter-spacing:0; text-transform:none;
}
.input-money{position:relative}
.input-money span{
  position:absolute; left:14px; top:50%; transform:translateY(-50%);
  color:var(--suave); font-weight:800; font-size:.95rem; pointer-events:none;
}
/* El selector lleva [type=text] a propósito: si no, la regla general de más
   abajo tiene la misma especificidad, gana por ir después y el texto que se
   digita queda encima del signo $. */
.input-money input[type=text]{padding-left:34px}
input[type=text],input[type=number],input[type=email],input[type=tel],input[type=date],select,textarea{
  width:100%; padding:13px 14px; border:1px solid var(--linea-f); border-radius:3px;
  font:inherit; font-size:.98rem; color:var(--tinta); background:var(--blanco);
  transition:border-color .15s ease, box-shadow .15s ease;
}
input:focus,select:focus,textarea:focus{
  outline:none; border-color:var(--oro); box-shadow:0 0 0 3px rgba(195,154,60,.18);
}
textarea{min-height:112px; resize:vertical}
.fieldset{border:none; padding:0; margin:0 0 36px}
.fieldset legend{
  font-family:var(--serif); font-weight:600; color:var(--tinta); font-size:1.14rem;
  padding:0 0 8px; width:100%; border-bottom:2px solid var(--oro); margin-bottom:22px;
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.fieldset .sub{font-size:.9rem; color:var(--suave); margin:-12px 0 20px}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.req{color:var(--alerta)}
.aviso-borrador{display:block; margin-top:10px; font-size:.86rem; color:var(--texto)}
.enlace-borrar{
  background:none; border:none; padding:0; margin-left:4px; font:inherit; font-weight:800;
  color:var(--ocre); text-decoration:underline; cursor:pointer;
}
.enlace-borrar:hover{color:var(--tierra-d)}
.archivos-elegidos{list-style:none; margin:10px 0 0; padding:0}
.archivos-elegidos li{
  display:flex; align-items:center; gap:8px; background:var(--blanco);
  border:1px solid var(--linea); border-radius:3px; padding:6px 8px; margin-top:6px;
  font-size:.82rem; color:var(--tierra-d); word-break:break-all;
}
.archivos-elegidos li span{flex:1}
.quitar-archivo{
  flex:none; width:22px; height:22px; line-height:1; border:1px solid var(--linea-f);
  border-radius:50%; background:var(--papel); color:var(--tierra); cursor:pointer;
  font-size:1rem; font-weight:700; padding:0;
}
.quitar-archivo:hover{background:var(--oro); border-color:var(--oro); color:#fff}

/* Aviso mientras se envía la solicitud */
.enviando{
  display:flex; gap:12px; align-items:flex-start; margin-bottom:16px;
  background:var(--crema); border:1px solid var(--linea-f); border-left:3px solid var(--oro);
  padding:14px 16px; font-size:.92rem; line-height:1.5; color:var(--tierra-d);
}
.enviando[hidden]{display:none}   /* si no, el display:flex anula el atributo */
.giro{
  flex:none; width:18px; height:18px; margin-top:2px; border-radius:50%;
  border:2px solid var(--oro-s); border-top-color:var(--ocre);
  animation:giro .8s linear infinite;
}
@keyframes giro{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){ .giro{animation-duration:2.4s} }
.btn.cargando,.btn:disabled{opacity:.7; cursor:progress}
.file-field{border:1px dashed var(--linea-f); padding:16px; background:var(--crema)}
.file-field label{
  margin-bottom:4px; display:block; font-weight:800; font-size:.76rem; color:var(--tierra);
  letter-spacing:.09em; text-transform:uppercase;
}
.file-field input[type=file]{font-size:.88rem; width:100%; margin-top:8px}
.consent{display:flex; gap:12px; align-items:flex-start; background:var(--crema);
  border:1px solid var(--linea); padding:20px}
.consent input{margin-top:5px; width:18px; height:18px; flex:none; accent-color:var(--ocre)}
.consent p{font-size:.88rem; margin:0}
.alert{padding:16px 18px; margin-bottom:24px; font-weight:700; font-size:.94rem; border-radius:3px}
.alert-ok{background:var(--ok-s); color:#3f5522; border:1px solid #c6d4a6}
.alert-err{background:var(--alerta-s); color:#82331e; border:1px solid #e9c1b0}
.aviso{background:var(--crema); border-left:3px solid var(--oro); padding:16px 20px;
  font-size:.9rem; color:var(--texto); margin-bottom:28px}
.etiqueta-op,.etiqueta-cond{
  font-family:var(--font); font-size:.62rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; padding:4px 10px; line-height:1; border-radius:3px;
}
.etiqueta-op{background:var(--arena); color:var(--tierra)}
.etiqueta-cond{background:var(--oro-s); color:var(--ocre)}
.etiqueta-cond.exigido{background:var(--ocre); color:var(--blanco)}
.fieldset-cond{border-left:3px solid var(--oro-s); padding-left:22px; transition:border-color .2s ease}
.fieldset-cond.exigido{border-left-color:var(--ocre)}

/* ---------- Movimiento ---------- */
.anim .rev{opacity:0; transform:translateY(20px);
  transition:opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1)}
.anim .rev.visible{opacity:1; transform:none}
.anim .linea-tiempo .riel i{transform:scaleX(0); transition:transform 1.6s cubic-bezier(.2,.8,.2,1)}
.anim .linea-tiempo.visible .riel i{transform:scaleX(1)}
.anim .grafico .barra{
  transform-origin:center bottom; transform:scaleY(0);
  transition:transform .85s cubic-bezier(.2,.85,.25,1); transition-delay:calc(var(--i) * 70ms);
}
.anim .grafico-caja.visible .barra{transform:scaleY(1)}

/* ---------- Responsive ---------- */
@media (max-width:1040px){
  .cifras{grid-template-columns:repeat(3,1fr)}
  .cifra:nth-child(3n){border-right:none}
  .cifra:nth-child(n+4){border-top:1px solid var(--linea)}
  .cards{grid-template-columns:repeat(2,1fr)}
  .pasos{grid-template-columns:repeat(3,1fr); row-gap:38px}
  .linea-tiempo .riel{display:none}
}
@media (max-width:900px){
  .hero-grid,.plan-grid{grid-template-columns:1fr}
  .hero-foto{max-width:520px}
  .negocios,.historias{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .cards-3{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr 1fr}
}
@media (max-width:700px){
  body{font-size:16px}
  section{padding:66px 0}
  .hero{padding-top:56px}
  .brand img{height:38px; width:38px}
  .brand-name b{font-size:1.04rem}
  .menu{
    display:none; position:absolute; top:100%; left:0; right:0; background:var(--papel);
    flex-direction:column; align-items:stretch; gap:0; padding:10px 24px 18px;
    border-bottom:1px solid var(--linea); box-shadow:0 14px 30px rgba(51,40,26,.12);
  }
  .menu.open{display:flex}
  .menu a{padding:13px 0; border-bottom:1px solid var(--linea)}
  .nav-toggle{display:flex}
  .nav-actions .btn-ghost{display:none}
  .cards,.negocios,.historias,.foot-grid,.grid-2,.grid-3{grid-template-columns:1fr}
  .pasos{grid-template-columns:1fr 1fr}
  .cifras{grid-template-columns:1fr 1fr}
  .cifra:nth-child(2n){border-right:none}
  .cifra{border-right:none; border-bottom:1px solid var(--linea)}
  .form-card{padding:26px 20px}
  .topbar .wrap{justify-content:center; text-align:center}
}
@media (prefers-reduced-motion: reduce){
  .rev,.linea-tiempo .riel i,.grafico .barra,.negocio img{
    animation:none !important; transition:none !important;
  }
  .anim .rev{opacity:1; transform:none}
  .anim .linea-tiempo .riel i{transform:scaleX(1)}
  .anim .grafico .barra{transform:scaleY(1)}
}