.tool-explorer{
  margin-top:28px;
  padding:20px 22px;
  border:1px solid var(--sand3);
  border-radius:16px;
  background:rgba(255,255,255,.46);
  box-shadow:0 14px 34px rgba(0,40,85,.06);
}
.tool-explorer-label{
  display:block;
  margin-bottom:13px;
  color:var(--ember);
  font:700 .62rem/1.2 var(--f-m);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.tool-explorer-controls{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.tool-explorer-controls button{
  min-height:40px;
  padding:9px 13px;
  border:1px solid rgba(0,40,85,.2);
  border-radius:999px;
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  font:700 .68rem/1.25 var(--f-d);
  transition:color .25s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease,transform .25s ease;
}
.tool-explorer-controls button:hover{
  transform:translateY(-2px);
  border-color:rgba(226,112,42,.55);
}
.tool-explorer-controls button:focus-visible{
  outline:3px solid rgba(245,158,59,.3);
  outline-offset:2px;
}
.tool-explorer-controls button[aria-pressed="true"]{
  border-color:var(--navy);
  background:var(--navy);
  color:var(--sand);
  box-shadow:0 8px 20px rgba(0,40,85,.16);
}
.tool-explorer-results{
  margin-top:12px;
  color:var(--tl);
  font:650 .68rem/1.3 var(--f-m);
}
#gpts [data-tool-category]{
  --tool-accent:#df9225;
  position:relative;
  overflow:hidden;
  padding:50px 22px 22px 28px;
  border:1px solid #d8ccb5!important;
  border-radius:10px;
  background:#fffdf8;
  box-shadow:none!important;
  transition:opacity .28s ease,transform .32s cubic-bezier(.22,1,.36,1),box-shadow .28s ease,border-color .28s ease;
}
#gpts [data-tool-category="gestion"]{--tool-accent:#35b9ba}
#gpts [data-tool-category="riesgo"]{--tool-accent:#c46f37}
#gpts [data-tool-category="plazo"]{--tool-accent:#6f8f5b}
#gpts [data-tool-category="decision"]{--tool-accent:#df9225}
#gpts [data-tool-category]::before{
  content:attr(data-tool-label);
  position:absolute;
  top:18px;
  left:22px;
  padding:2px 0 2px 18px;
  border:0;
  border-radius:0;
  background:linear-gradient(var(--tool-accent),var(--tool-accent)) left center/12px 2px no-repeat;
  color:var(--tool-accent);
  font:700 .55rem/1.1 var(--f-m);
  letter-spacing:.06em;
  text-transform:uppercase;
}
#gpts [data-tool-category]::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  width:5px;
  background:var(--tool-accent);
}
#gpts [data-tool-category]:hover{
  transform:translateY(-2px);
  border-color:var(--tool-accent)!important;
  box-shadow:none!important;
}
#gpts [data-tool-category]:hover::before{left:22px}
#gpts [data-tool-category] .pain{
  padding:0 0 13px;
  border-left:0;
  border-bottom:1px solid rgba(12,30,45,.11);
}
#gpts [data-tool-category] .gain{
  padding-left:0;
  border-left:0;
}
#gpts [data-tool-category] .gain b{color:var(--tool-accent)}
#gpts [data-tool-category].is-tool-entering{
  animation:tool-enter .42s cubic-bezier(.22,1,.36,1) both;
}
@keyframes tool-enter{
  from{opacity:0;transform:translateY(12px) scale(.985)}
  to{opacity:1;transform:none}
}
@media(max-width:650px){
  .tool-explorer{padding:18px 16px}
  .tool-explorer-controls{display:grid;grid-template-columns:1fr}
  .tool-explorer-controls button{text-align:left;width:100%}
}
@media(prefers-reduced-motion:reduce){
  .tool-explorer-controls button,
  #gpts [data-tool-category]{transition:none!important}
  .tool-explorer-controls button:hover{transform:none!important}
  #gpts [data-tool-category].is-tool-entering{animation:none!important}
}