/* Distribución visual exclusiva de la sección "Una operación conectada". */
.solution .feature-grid{
  grid-template-columns:minmax(0,1.55fr) minmax(280px,.85fr);
  grid-template-areas:
    "sales inventory"
    "service service";
  gap:18px;
  align-items:stretch;
}

.solution .feature{
  min-height:0;
  height:100%;
  padding:clamp(24px,2.4vw,36px);
  border-color:rgba(145,163,193,.24);
  border-radius:18px;
  box-shadow:0 16px 38px rgba(7,12,22,.11);
  transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease;
}

.solution .feature:hover{
  transform:translateY(-5px);
  border-color:rgba(0,229,230,.52);
  box-shadow:0 25px 48px rgba(9,18,35,.2),0 0 28px rgba(0,229,230,.08);
}

.solution .feature.large{grid-area:sales;min-height:420px;}
.solution .feature.inventory{grid-area:inventory;min-height:420px;}

/* Ventas: el contenido y el panel visual se leen como una sola composición. */
.solution .feature.large{
  display:grid;
  grid-template-columns:minmax(190px,.8fr) minmax(310px,1.2fr);
  grid-template-rows:auto 1fr;
  isolation:isolate;
}

.solution .feature.large:after{
  content:"";
  position:absolute;
  z-index:0;
  width:240px;
  height:240px;
  left:-130px;
  bottom:-160px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(0,229,230,.16),transparent 68%);
  pointer-events:none;
}

.solution .large .feature-copy{
  grid-column:1;
  grid-row:1 / span 2;
  display:flex;
  min-height:100%;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
}

.solution .large .feature-copy h3{font-size:clamp(29px,2.8vw,42px);margin-top:18px;}
.solution .large .feature-copy p{max-width:265px;font-size:13px;}
.solution .large .feature-copy a{margin-top:auto;padding-bottom:2px;}

.solution .large .sales-visual{
  right:1.5%;
  bottom:-3%;
  width:55%;
  height:91%;
  border-radius:18px 18px 0 0;
  padding:clamp(28px,4vw,54px) clamp(18px,2vw,30px);
  box-shadow:-20px 24px 42px rgba(0,0,0,.18);
}

/* Inventario: imagen, copy y acción aprovechan toda la altura de la tarjeta. */
.solution .feature.inventory{
  display:grid;
  grid-template-rows:auto minmax(170px,1fr) auto auto auto;
  align-items:start;
}

.solution .inventory .inventory-icon{
  align-self:center;
  justify-self:center;
  width:min(100%,290px);
  height:185px;
  margin:8px auto!important;
  display:grid;
  place-items:center;
}

.solution .inventory .inventory-icon img{
  max-height:185px;
  width:auto;
  object-fit:contain;
}

.solution .inventory h3{font-size:clamp(28px,2.35vw,36px);margin:6px 0 12px;}
.solution .inventory p{max-width:285px;margin-bottom:18px;font-size:13px;}
.solution .inventory a{position:static;align-self:end;justify-self:start;}

.solution .feature.service{
  grid-area:service;
  min-height:250px;
  display:grid;
  grid-template-columns:minmax(240px,.85fr) minmax(260px,1.15fr) minmax(250px,1fr);
  grid-template-rows:auto 1fr auto;
  column-gap:clamp(28px,5vw,72px);
  align-items:center;
  background:radial-gradient(circle at 82% 15%,rgba(0,203,224,.25),transparent 30%),linear-gradient(120deg,#101a21,#101116 61%,#131126);
}

.solution .service .num{grid-column:1;grid-row:1;align-self:start;}
.solution .service .service-visual{grid-column:1;grid-row:2 / span 2;height:172px;margin-top:10px;}
.solution .service h3{grid-column:2;grid-row:2;margin:0;font-size:clamp(28px,2.5vw,38px);}
.solution .service p{grid-column:3;grid-row:2;margin:0;max-width:290px;font-size:13px;}
.solution .service a{grid-column:3;grid-row:3;position:static;align-self:end;justify-self:start;margin-top:20px;}

.solution .feature h3{letter-spacing:-1.9px;}
.solution .feature a{transition:color .2s ease,transform .2s ease;}
.solution .feature a:hover{color:var(--cyan);transform:translateX(3px);}

.solution .inventory-icon{margin:18px auto 14px!important;}
.solution .inventory h3{margin-top:12px;}

@media (max-width:900px){
  .solution .feature-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-areas:"sales inventory" "service service";
  }

  .solution .feature.service{grid-template-columns:1fr 1fr;column-gap:30px;}
  .solution .service h3{grid-column:2;grid-row:1;margin-top:18px;}
  .solution .service p{grid-column:2;grid-row:2;align-self:start;}
  .solution .service a{grid-column:2;grid-row:3;}
  .solution .service .service-visual{grid-row:1 / span 3;align-self:center;}
  .solution .feature.large{grid-template-columns:minmax(160px,.75fr) minmax(230px,1.25fr);}
  .solution .large .sales-visual{width:58%;}
}

@media (max-width:700px){
  .solution .feature-grid{grid-template-columns:1fr;grid-template-areas:"sales" "inventory" "service";gap:14px;}
  .solution .feature.large,.solution .feature.inventory{min-height:390px;}
  .solution .feature.large{display:block;}
  .solution .large .feature-copy{display:flex;min-height:0;}
  .solution .large .feature-copy a{margin-top:22px;}
  .solution .large .sales-visual{width:55%;height:82%;right:-3%;bottom:0;}
  .solution .inventory .inventory-icon{height:170px;}
  .solution .inventory .inventory-icon img{max-height:170px;}
  .solution .feature.service{display:block;min-height:390px;}
  .solution .service .num{display:block;}
  .solution .service .service-visual{height:158px;margin:12px 0 8px;}
  .solution .service h3{margin:10px 0 12px;font-size:28px;}
  .solution .service p{margin:0;}
  .solution .service a{position:absolute;margin:0;}
}
