/* ============================================
   Quas — capa de degradados corporativos
   Se carga al final de cada layout.
   ============================================ */

:root {
  --grad-brand: linear-gradient(135deg, #034d38 0%, #07825c 55%, #12b886 100%);
  --grad-brand-soft: linear-gradient(135deg, #07825c 0%, #12b886 100%);
  --grad-deep: linear-gradient(160deg, #023b2b 0%, #045a41 50%, #07825c 100%);
  --grad-text: linear-gradient(100deg, #034d38 0%, #07825c 45%, #14b383 100%);
  --grad-mint:
    radial-gradient(ellipse 55% 60% at 100% 0%, rgba(18, 184, 134, 0.16), transparent 60%),
    radial-gradient(ellipse 45% 55% at 0% 100%, rgba(7, 130, 92, 0.1), transparent 60%),
    linear-gradient(180deg, #f2fbf7 0%, #ffffff 100%);
}

/* Barra superior y navegación */
.navbar-top {
  height: 5px;
  background: linear-gradient(90deg, #034d38, #07825c, #12b886, #07825c, #034d38);
  background-size: 300% 100%;
  animation: quasFlow 14s linear infinite;
}

@keyframes quasFlow {
  from { background-position: 0% 50%; }
  to { background-position: 300% 50%; }
}

@media (prefers-reduced-motion: reduce) {
  .navbar-top { animation: none; }
}

#navbar.navbar {
  box-shadow: 0 6px 24px rgba(3, 77, 56, 0.06);
}

/* Títulos con degradado */
.solutions-title,
.casos-tittle,
.success-title,
#titulo-sobre,
.title-script,
.services-page-header h1,
.services-detail h2,
.contact-title,
.blog-title,
#titulo-casos,
.ley-section h2,
.ley-thanks h1 {
  background: var(--grad-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #07825c;
  width: fit-content;
  max-width: 100%;
}

/* Hero de la home */
.consulting-container {
  background:
    radial-gradient(ellipse 55% 65% at 35% 105%, rgba(22, 196, 143, 0.6), transparent 60%),
    radial-gradient(ellipse 40% 50% at 0% 0%, rgba(2, 47, 35, 0.6), transparent 60%),
    linear-gradient(115deg, rgba(2, 59, 43, 0.92) 0%, rgba(4, 96, 69, 0.78) 35%, rgba(10, 150, 105, 0.5) 70%, rgba(18, 184, 134, 0.2) 100%),
    url("../image/img-header2.webp") center / cover no-repeat;
}

.consulting-image::after {
  background: linear-gradient(90deg, rgba(4, 90, 65, 0.45) 0%, rgba(18, 184, 134, 0.08) 45%, transparent 70%);
}

@media (max-width: 900px) {
  .consulting-image::after {
    background: linear-gradient(0deg, rgba(4, 90, 65, 0.8) 0%, rgba(18, 184, 134, 0.1) 55%, transparent 80%);
  }
}

/* Secciones claras */
.solutions-container,
.success-cases,
#contacto-index.contact-form,
.services-detail,
.nosot {
  background: var(--grad-mint);
}

.py-12.bg-white {
  background:
    radial-gradient(ellipse 50% 60% at 0% 0%, rgba(18, 184, 134, 0.14), transparent 60%),
    linear-gradient(180deg, #eefaf5 0%, #ffffff 70%);
}

/* Tarjetas: borde superior en degradado */
.solution-card,
.service-card {
  border-top: 0;
  position: relative;
}

.solution-card::before,
.service-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--grad-brand);
  z-index: 2;
}

.testimonial-card {
  border-left: 0;
  position: relative;
}

.testimonial-card::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  background: linear-gradient(180deg, #12b886, #034d38);
}

/* Secciones oscuras: verde profundo en vez de casi negro */
.bg-dark-green {
  background:
    radial-gradient(ellipse 60% 55% at 85% 0%, rgba(18, 184, 134, 0.4), transparent 60%),
    radial-gradient(ellipse 50% 60% at 0% 100%, rgba(7, 130, 92, 0.45), transparent 60%),
    linear-gradient(160deg, #022f23 0%, #034d38 55%, #046447 100%);
}

.recursos-section {
  background:
    radial-gradient(ellipse 50% 40% at 50% 0%, rgba(18, 184, 134, 0.3), transparent 60%),
    radial-gradient(ellipse 40% 50% at 0% 85%, rgba(7, 130, 92, 0.45), transparent 55%),
    radial-gradient(ellipse 40% 50% at 100% 70%, rgba(18, 184, 134, 0.18), transparent 55%),
    linear-gradient(180deg, #022a1f 0%, #034d38 55%, #023b2b 100%);
}

/* Pie de página */
footer {
  overflow: hidden;
  isolation: isolate;
  padding-top: 4.25rem;
  background:
    radial-gradient(ellipse 45% 70% at 100% 0%, rgba(18, 184, 134, 0.38), transparent 62%),
    radial-gradient(ellipse 40% 65% at 0% 100%, rgba(7, 130, 92, 0.5), transparent 60%),
    radial-gradient(ellipse 30% 40% at 55% 110%, rgba(18, 184, 134, 0.18), transparent 60%),
    linear-gradient(155deg, #046447 0%, #034d38 38%, #023324 72%, #01261c 100%);
}

footer::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #034d38, #12b886 30%, #9ff0d0 50%, #12b886 70%, #034d38);
  background-size: 200% 100%;
  animation: quasFlow 18s linear infinite;
}

footer::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image: radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px);
  background-size: 22px 22px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.9), transparent 75%);
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.9), transparent 75%);
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  footer::before { animation: none; }
}

#marca-footer {
  background: linear-gradient(100deg, #ffffff 0%, #c9ffe9 55%, #6fe3bb 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 2rem;
  width: fit-content;
}

#certficacion-empresas,
#footer-contacto,
#siguenos {
  position: relative;
  padding-bottom: 0.6rem;
  color: #c9ffe9;
}

#certficacion-empresas::after,
#footer-contacto::after,
#siguenos::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 36px;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, #12b886, #ffb020);
}

#siguenos {
  margin-top: 1.25rem;
}

.certificaciones-footer li::marker,
.certificaciones-footer-2 li::marker {
  color: #12b886;
}

.certificaciones-footer b,
.certificaciones-footer-2 b {
  color: #e3fbf0;
}

#parrafo-caja-3,
#Terminos {
  background: linear-gradient(90deg, #ffb020, #ffb020) left bottom / 0 1px no-repeat;
  transition: color 0.25s var(--quas-ease), background-size 0.3s var(--quas-ease);
}

#parrafo-caja-3:hover,
#Terminos:hover {
  color: #ffffff;
  background-size: 100% 1px;
}

#facebook,
#instagram {
  width: 38px;
  height: 38px;
  padding: 8px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(18, 184, 134, 0.35), rgba(255, 255, 255, 0.08));
  border: 1px solid rgba(255, 255, 255, 0.18);
  display: inline-block;
  opacity: 1;
  transition: transform 0.25s var(--quas-ease), box-shadow 0.25s var(--quas-ease);
}

#facebook:hover,
#instagram:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(18, 184, 134, 0.45);
}

#banderas img {
  border-radius: 3px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
  opacity: 1;
}

.footer-credit {
  border-top: 0;
  position: relative;
}

.footer-credit::before {
  content: "";
  position: absolute;
  top: 0;
  left: var(--space-gutter);
  right: var(--space-gutter);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(159, 240, 208, 0.35), transparent);
}

/* Botones */
.btn-success,
#boton-nosotros,
.button-quas,
#contacto-index button[type="submit"] {
  background: var(--grad-brand-soft) !important;
  border: 0 !important;
  color: #ffffff !important;
  box-shadow: 0 8px 22px rgba(7, 130, 92, 0.28);
  transition: transform 0.25s var(--quas-ease), box-shadow 0.25s var(--quas-ease), filter 0.25s var(--quas-ease);
}

.btn-success:hover,
#boton-nosotros:hover,
.button-quas:hover,
#contacto-index button[type="submit"]:hover {
  transform: translateY(-2px);
  filter: brightness(1.06);
  box-shadow: 0 12px 28px rgba(7, 130, 92, 0.36);
}

.btn-accent,
.hero-cta {
  background: linear-gradient(135deg, #ffc94d 0%, #ffb020 55%, #f59e0b 100%);
}

.btn-accent:hover,
.hero-cta:hover {
  background: linear-gradient(135deg, #ffd56e 0%, #ffbd3a 55%, #ffab1f 100%);
}

.discover-button,
.discover-button:hover {
  border-bottom: 0;
  background: linear-gradient(90deg, #034d38, #12b886) left bottom / 100% 2px no-repeat;
}

/* Formularios: foco con color de marca */
.form-control:focus,
#contacto-index input:focus,
#contacto-index textarea:focus,
#contacto-index select:focus {
  border-color: #12b886;
  box-shadow: 0 0 0 3px rgba(18, 184, 134, 0.2);
}

/* Ley 21.719 */
.ley-hero {
  background:
    radial-gradient(ellipse 55% 70% at 85% 15%, rgba(18, 184, 134, 0.6), transparent 60%),
    radial-gradient(ellipse 45% 60% at 5% 100%, rgba(7, 130, 92, 0.6), transparent 60%),
    linear-gradient(125deg, #022f23 0%, #034d38 40%, #07825c 100%);
}

.ley-contact {
  background:
    radial-gradient(ellipse 60% 80% at 100% 0%, rgba(18, 184, 134, 0.35), transparent 60%),
    linear-gradient(135deg, #023b2b 0%, #046447 55%, #07825c 100%);
}

.ley-steps li::before,
.ley-thanks-icon {
  background: var(--grad-brand-soft);
}

.ley-option--si input:checked + span {
  background: var(--grad-brand-soft);
  border-color: transparent;
}

#facebook,
#instagram {
  filter: none;
}

#facebook:not(:hover),
#instagram:not(:hover) {
  filter: brightness(0) invert(1) opacity(0.85);
  background: none;
}

#facebook:hover,
#instagram:hover {
  background: none;
  filter: brightness(0) invert(1) drop-shadow(0 0 8px rgba(18, 184, 134, 0.9));
}

#footer #parrafo-caja-3 {
  display: table;
}

.certificaciones-footer li#parrafo-caja-2 {
  padding-left: 0;
}
