/* tecnologia.css */

.tech-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.tech-intro-img { border-radius: var(--radius-lg); overflow: hidden; aspect-ratio: 4/3; box-shadow: var(--shadow-lift); }
.tech-intro-img img { width: 100%; height: 100%; object-fit: cover; }
.tech-intro-text p { color: var(--text-secondary); margin-bottom: 16px; line-height: 1.75; }

/* Tech pillars */
.tech-pillars { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; margin-top: 48px; }
.tech-pillar {
  background: var(--white); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-card); padding: 32px; box-shadow: var(--shadow-sm);
  transition: var(--transition);
}
.tech-pillar:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); border-color: var(--green-light); }
.tech-pillar-icon {
  width: 56px; height: 56px; border-radius: 12px;
  background: var(--green-pale); color: var(--green-dark);
  display: flex; align-items: center; justify-content: center; margin-bottom: 20px;
}
.tech-pillar h3 { margin-bottom: 10px; }
.tech-pillar p  { color: var(--text-secondary); font-size: 0.9rem; line-height: 1.65; }
.tech-pillar-list { margin-top: 16px; display: flex; flex-direction: column; gap: 7px; }
.tech-pillar-list li {
  display: flex; align-items: center; gap: 8px;
  font-size: 0.83rem; color: var(--text-secondary);
}
.tech-pillar-list li::before { content:''; width:5px;height:5px;border-radius:50%;background:var(--green-primary);flex-shrink:0; }

/* Monitoring center */
.monitoring-section {
  background: var(--navy-primary); border-radius: var(--radius-lg);
  overflow: hidden; margin-top: calc(var(--sp)*6);
}
.monitoring-banner {
  background: linear-gradient(90deg, var(--green-dark), var(--green-mid));
  padding: 28px 40px; display: flex; align-items: center; justify-content: space-between; gap: 20px;
}
.monitoring-banner h2 { color: var(--white); font-size: 1.4rem; }
.monitoring-banner p  { color: rgba(255,255,255,0.78); margin-top: 4px; font-size: 0.9rem; }
.monitoring-live {
  display: flex; align-items: center; gap: 8px; flex-shrink: 0;
  background: rgba(255,255,255,0.15); color: var(--white);
  padding: 8px 18px; border-radius: 24px; font-size: 0.8rem; font-weight: 700;
}
.live-dot {
  width: 8px; height: 8px; border-radius: 50%; background: #4ade80;
  animation: livePulse 1.5s infinite;
}
@keyframes livePulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:0.5;transform:scale(1.3)} }

.monitoring-body { padding: 40px; }
.monitoring-steps { display: grid; grid-template-columns: repeat(5,1fr); gap: 16px; margin-bottom: 40px; }
.monitoring-step  { text-align: center; }
.monitoring-step-num {
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(174,196,141,0.25); color: var(--green-light);
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem; font-weight: 800; margin: 0 auto 12px;
}
.monitoring-step h4 { color: var(--white); font-size: 0.85rem; margin-bottom: 6px; }
.monitoring-step p  { color: rgba(255,255,255,0.55); font-size: 0.78rem; line-height: 1.5; }

.monitoring-rooms { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.monitoring-room {
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.09);
  border-radius: var(--radius-card); padding: 20px; display: flex; align-items: center; gap: 14px;
}
.monitoring-room-icon {
  width: 44px; height: 44px; border-radius: 10px;
  background: rgba(174,196,141,0.18); color: var(--green-light);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.monitoring-room h4 { color: var(--white); font-size: 0.88rem; }
.monitoring-room p  { color: rgba(255,255,255,0.50); font-size: 0.78rem; margin-top: 2px; }

/* AI section */
.ai-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.ai-img  { border-radius: var(--radius-lg); overflow: hidden; aspect-ratio: 16/10; box-shadow: var(--shadow-lift); }
.ai-img img { width: 100%; height: 100%; object-fit: cover; }
.ai-features { display: flex; flex-direction: column; gap: 16px; margin-top: 24px; }
.ai-feature {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 16px; background: var(--white); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-card); box-shadow: var(--shadow-sm);
}
.ai-feature-icon {
  width: 40px; height: 40px; border-radius: 10px; flex-shrink: 0;
  background: rgba(30,58,99,0.08); color: var(--navy-primary);
  display: flex; align-items: center; justify-content: center;
}
.ai-feature h4 { font-size: 0.92rem; margin-bottom: 4px; }
.ai-feature p  { font-size: 0.82rem; color: var(--text-muted); }

@media (max-width: 1024px) {
  .tech-intro { grid-template-columns: 1fr; gap: 40px; }
  .tech-intro-img { order: -1; }
  .tech-pillars { grid-template-columns: 1fr 1fr; }
  .monitoring-steps { grid-template-columns: 1fr; }
  .monitoring-rooms { grid-template-columns: 1fr 1fr; }
  .ai-grid { grid-template-columns: 1fr; gap: 40px; }
  .ai-img { order: -1; }
}
@media (max-width: 768px) {
  .tech-pillars { grid-template-columns: 1fr; }
  .monitoring-rooms { grid-template-columns: 1fr; }
  .monitoring-banner { flex-direction: column; text-align: center; }
  .monitoring-body { padding: 24px; }
}
