.trat{
  --tr-bg:#070a12;
  --tr-card:#0d1017;
  --tr-line:rgba(255,255,255,.08);
  --tr-accent:#5b73d6;
  --tr-text:#fff;
  background:var(--tr-bg);
  color:var(--tr-text);
  padding:clamp(56px,9vw,120px) 24px;
}
.trat__inner{
  max-width:1200px;
  margin:0 auto;
}

/* Encabezado en dos columnas */
.trat__head{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:32px;
  align-items:start;
  margin-bottom:56px;
}
.trat__eyebrow{
  margin:0;
  font-family:'JetBrains Mono',monospace;
  font-weight:500;
  font-size:clamp(18px,2.4vw,30px);
  letter-spacing:.35em;
  text-transform:uppercase;
  color:var(--tr-accent);
}
.trat__title{
  margin:0;
  font-family:'Space Grotesk',sans-serif;
  font-weight:500;
  font-size:clamp(26px,3.6vw,48px);
  line-height:1.05;
  letter-spacing:-.02em;
}

/* Tarjetas */
.trat__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  align-items:stretch;
}
.trat__card{
  background:var(--tr-card);
  border:1px solid var(--tr-line);
  border-radius:20px;
  padding:32px 36px 36px;
  transition:border-color .3s ease, transform .3s ease;
}
.trat__card:hover{
  border-color:rgba(91,115,214,.45);
  transform:translateY(-4px);
}

.trat__label{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 18px;
  padding-bottom:18px;
  border-bottom:1px solid var(--tr-line);
  font-family:'JetBrains Mono',monospace;
  font-weight:500;
  font-size:13px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--tr-accent);
  min-height:52px;
}
.trat__icon{
  flex:none;
  width:22px;
  height:22px;
  object-fit:contain;
}

.trat__list{
  list-style:none;
  margin:0;
  padding:0;
}
.trat__list li{
  padding:13px 0;
  border-bottom:1px solid var(--tr-line);
  font-family:'Inter',sans-serif;
  font-weight:400;
  font-size:13px;
  color:rgba(255,255,255,.88);
}
.trat__list li:last-child{ border-bottom:0; }

/* Logo */
.trat__logo{
  margin-top:36px;
}
.trat__logo img{
  width:min(260px,60%);
  height:auto;
}

/* Animación de entrada */
.trat__head,
.trat__card,
.trat__logo{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s ease, transform .7s ease, border-color .3s ease;
}
.trat.is-visible .trat__head,
.trat.is-visible .trat__card,
.trat.is-visible .trat__logo{
  opacity:1;
  transform:none;
}
.trat.is-visible .trat__card:nth-child(1){ transition-delay:.1s; }
.trat.is-visible .trat__card:nth-child(2){ transition-delay:.22s; }
.trat.is-visible .trat__card:nth-child(3){ transition-delay:.34s; }
.trat.is-visible .trat__card:hover{ transform:translateY(-4px); }

/* Tablet */
@media (max-width:980px){
  .trat__grid{ grid-template-columns:1fr; }
  .trat__label{ min-height:0; }
}

/* Móvil */
@media (max-width:720px){
  .trat{ padding:56px 16px; }
  .trat__head{
    grid-template-columns:1fr;
    gap:14px;
    margin-bottom:36px;
  }
  .trat__eyebrow{ letter-spacing:.25em; }
  .trat__card{ padding:24px; }
}

@media (prefers-reduced-motion:reduce){
  .trat__head,.trat__card,.trat__logo{
    opacity:1;
    transform:none;
    transition:none;
  }
}