.nav-actions { display: flex; align-items: center; gap: 20px; }
.solutions, .benefits { background: #cbd5db; }
.solution-card { background: #e5eaed; }

.language-toggle {
  height: 34px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(98, 201, 255, 0.4);
  border-radius: 3px;
  background: rgba(4, 19, 32, 0.38);
  color: #fff;
  cursor: pointer;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.1em;
  backdrop-filter: blur(8px);
}

.language-toggle i { width: 1px; height: 12px; background: var(--cyan); opacity: 0.45; }
.language-toggle span { opacity: 0.45; transition: 0.2s; }
.language-toggle span.active { opacity: 1; color: var(--cyan); }

@media (max-width: 920px) {
  .nav-actions { gap: 5px; }
  .language-toggle { height: 32px; }
}

@media (max-width: 420px) {
  .brand img { width: 140px; }
}

/* Mantiene visibles las fotografías completas en todos los formatos. */
.project-card { display: grid; grid-template-rows: minmax(0, 1fr) auto; background: #071827; }
.project-card::after { display: none; }
.project-card img { grid-row: 1; width: 100%; height: 100%; object-fit: contain; padding: 7px; background: #071827; }
.project-card > span { position: static; padding: 14px 18px; background: #061421; text-align: left; }
.project-card:hover img { transform: none; }

.floating-contact {
  width: 62px;
  height: 62px;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  isolation: isolate;
}

.floating-contact::before,
.floating-contact::after {
  content: '';
  position: absolute;
  inset: 3px;
  z-index: -1;
  border: 2px solid rgba(34, 197, 94, 0.68);
  border-radius: 50%;
  animation: whatsapp-sonar 2.4s ease-out infinite;
}

.floating-contact::after { animation-delay: 1.2s; }
.whatsapp-icon-wrap { position: relative; z-index: 2; width: 62px; height: 62px; display: block; overflow: hidden; border: 3px solid rgba(255, 255, 255, 0.88); border-radius: 50%; background: #05bd23; box-shadow: 0 14px 35px rgba(0, 0, 0, 0.34), 0 0 0 1px rgba(7, 94, 37, 0.15); transition: transform 0.25s ease, box-shadow 0.25s ease; }
.whatsapp-icon-wrap img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.28); }
.floating-contact:hover .whatsapp-icon-wrap { transform: translateY(-3px) scale(1.04); box-shadow: 0 18px 42px rgba(0, 0, 0, 0.42); }
.whatsapp-label { position: absolute; right: 72px; top: 50%; padding: 8px 12px; border: 1px solid rgba(98, 201, 255, 0.2); border-radius: 4px; background: rgba(3, 17, 31, 0.96); color: #fff; opacity: 0; transform: translate(8px, -50%); pointer-events: none; font-size: 10px; letter-spacing: 0.05em; transition: 0.25s; }
.floating-contact:hover .whatsapp-label { opacity: 1; transform: translate(0, -50%); }

@keyframes whatsapp-sonar {
  0% { opacity: 0.72; transform: scale(0.9); }
  70%, 100% { opacity: 0; transform: scale(1.62); }
}

@media (max-width: 920px) { .whatsapp-label { display: none; } }
@media (prefers-reduced-motion: reduce) { .floating-contact::before, .floating-contact::after { animation: none; } }

/* Mosaico de altura natural: cada fotografía ocupa exactamente su proporción. */
.project-grid {
  display: block;
  columns: 3;
  column-gap: 12px;
}

.project-card,
.project-card.wide {
  display: inline-grid;
  grid-template-rows: auto auto;
  width: 100%;
  height: auto;
  margin: 0 0 12px;
  break-inside: avoid;
  grid-column: auto;
  grid-row: auto;
}

.project-card img {
  width: 100%;
  height: auto;
  padding: 0;
  object-fit: initial;
}

@media (max-width: 920px) {
  .project-grid { columns: 2; }
}

@media (max-width: 580px) {
  .project-grid { columns: 1; }
}

/* Mayor profundidad y contraste en las superficies claras. */
.solutions,
.benefits {
  background: #b9c6ce;
}

.solution-card {
  background: #dce3e7;
  border-color: rgba(5, 28, 45, 0.16);
}

.solutions .section-top > p {
  color: #30495b;
  font-weight: 500;
}

.solution-card:not(.large) .card-content span {
  color: #385064;
}

.solution-card.large .card-content span {
  color: rgba(235, 245, 251, 0.82);
}

.solution-card.energy .card-content span {
  color: #263b34;
}

.solutions .card-content > p,
.solutions .card-index,
.benefit-list > article > span {
  color: #006da8;
}

.benefit-list p {
  color: #344b5b;
  font-weight: 500;
}

.benefit-list article {
  border-top-color: rgba(4, 29, 46, 0.24);
}