/* ── Formación a Medida Page ────────────────────────────── */

.medida-hero {
  padding-top: calc(68px + var(--sp-3xl));
  position: relative;
  overflow: hidden;
}
.medida-hero__bg {
  position: absolute;
  top: -200px; left: -200px;
  width: 800px; height: 800px;
  background: radial-gradient(circle, rgba(161,0,255,0.12) 0%, transparent 70%);
  pointer-events: none;
}
.medida-hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-2xl);
  align-items: center;
  padding-bottom: var(--sp-3xl);
}
.medida-hero__h1 {
  font-size: clamp(2.2rem, 4.5vw, 3.5rem);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.03em;
  margin-bottom: var(--sp-md);
}
.medida-hero__sub {
  font-size: 1.1rem;
  color: var(--color-gray-l);
  line-height: 1.7;
  margin-bottom: var(--sp-lg);
}
.medida-hero__actions { display: flex; gap: var(--sp-sm); flex-wrap: wrap; margin-bottom: var(--sp-lg); }
.medida-trust-row {
  display: flex;
  gap: var(--sp-lg);
  flex-wrap: wrap;
}
.medida-trust-item {
  display: flex;
  flex-direction: column;
}
.medida-trust-item strong { font-size: 1.5rem; font-weight: 800; color: var(--color-accent); }
.medida-trust-item span { font-size: 0.8rem; color: var(--color-gray-l); }
.medida-hero__img {
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 4/3;
}
.medida-hero__img img { width: 100%; height: 100%; object-fit: cover; }

/* Compare table */
.medida-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-md);
  margin-top: var(--sp-2xl);
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}
.medida-compare__col {
  border-radius: var(--radius-lg);
  padding: var(--sp-lg);
}
.medida-compare__col--bad {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
}
.medida-compare__col--good {
  background: linear-gradient(135deg, #1a001a 0%, #0f000f 100%);
  border: 1px solid rgba(161,0,255,0.4);
}
.medida-compare__col h3 {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: var(--sp-md);
  padding-bottom: var(--sp-sm);
  border-bottom: 1px solid var(--color-border);
}
.medida-compare__col--good h3 { color: var(--color-accent); border-color: rgba(161,0,255,0.3); }
.medida-compare__col ul { list-style: none; display: flex; flex-direction: column; gap: 0.75rem; }
.medida-compare__col ul li { font-size: 0.9rem; color: var(--color-gray-l); padding-left: 1.5rem; position: relative; }
.medida-compare__col--bad ul li::before { content: '✗'; position: absolute; left: 0; color: #ef4444; }
.medida-compare__col--good ul li::before { content: '✓'; position: absolute; left: 0; color: #22c55e; }

/* Areas */
.medida-areas-section { background: var(--color-surface); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.medida-areas {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-md);
  margin-top: var(--sp-2xl);
}
.medida-area {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all 0.2s;
}
.medida-area:hover { border-color: rgba(161,0,255,0.5); transform: translateY(-3px); }
.medida-area__img { height: 160px; overflow: hidden; }
.medida-area__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s; }
.medida-area:hover .medida-area__img img { transform: scale(1.05); }
.medida-area__body { padding: var(--sp-md); }
.medida-area__body h3 { font-size: 1rem; font-weight: 700; margin-bottom: 0.5rem; }
.medida-area__body p { font-size: 0.875rem; color: var(--color-gray-l); line-height: 1.6; }
.medida-area__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: var(--sp-sm);
}
.medida-area__tags span {
  font-size: 0.7rem;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 4px;
  padding: 0.15rem 0.5rem;
  color: var(--color-gray-l);
}

/* Phases */
.medida-process-section { background: var(--color-surface); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.medida-phases {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--sp-md);
  margin-top: var(--sp-2xl);
}
.medida-phase {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--sp-md);
  position: relative;
  transition: border-color 0.2s;
}
.medida-phase:hover { border-color: rgba(161,0,255,0.4); }
.medida-phase__num {
  font-size: 2.5rem;
  font-weight: 900;
  color: rgba(161,0,255,0.2);
  line-height: 1;
  margin-bottom: var(--sp-sm);
}
.medida-phase h3 { font-size: 0.95rem; font-weight: 700; margin-bottom: 0.5rem; }
.medida-phase p { font-size: 0.82rem; color: var(--color-gray-l); line-height: 1.6; }
.medida-phase__time {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--color-accent);
  margin-top: var(--sp-sm);
}

/* Sectors */
.medida-sectors {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-md);
  margin-top: var(--sp-2xl);
}
.medida-sector-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--sp-lg);
  transition: all 0.2s;
}
.medida-sector-card:hover { border-color: rgba(161,0,255,0.4); transform: translateY(-2px); }
.medida-sector-card__icon { font-size: 2rem; margin-bottom: var(--sp-sm); }
.medida-sector-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: 0.5rem; }
.medida-sector-card p { font-size: 0.875rem; color: var(--color-gray-l); line-height: 1.6; }

/* Responsive */
@media (max-width: 1024px) {
  .medida-hero__inner { grid-template-columns: 1fr; }
  .medida-hero__img { display: none; }
  .medida-areas { grid-template-columns: repeat(2, 1fr); }
  .medida-phases { grid-template-columns: repeat(2, 1fr); }
  .medida-sectors { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .medida-compare { grid-template-columns: 1fr; }
  .medida-areas { grid-template-columns: 1fr; }
  .medida-phases { grid-template-columns: 1fr; }
  .medida-sectors { grid-template-columns: 1fr; }
}