/* CONTRAST + FOOTER V36
   Loaded after global and page-specific styles. */

/* ---------- Service hero contrast ---------- */

/* Colored heroes in light mode */
.service-v34--desarrollo-web .service-hero-v34 .breadcrumbs,
.service-v34--landing-pages .service-hero-v34 .breadcrumbs,
.service-v34--anuncios-digitales .service-hero-v34 .breadcrumbs,
.service-layout--editorial .service-hero-copy .breadcrumbs {
  color: rgba(255,255,255,.72) !important;
}

.service-v34--desarrollo-web .service-hero-v34 .breadcrumbs a,
.service-v34--landing-pages .service-hero-v34 .breadcrumbs a,
.service-v34--anuncios-digitales .service-hero-v34 .breadcrumbs a,
.service-layout--editorial .service-hero-copy .breadcrumbs a {
  color: rgba(255,255,255,.72) !important;
}

.service-v34--desarrollo-web .service-hero-v34 .breadcrumbs b,
.service-v34--landing-pages .service-hero-v34 .breadcrumbs b,
.service-v34--anuncios-digitales .service-hero-v34 .breadcrumbs b,
.service-layout--editorial .service-hero-copy .breadcrumbs b {
  color: #fff !important;
}

.service-v34--desarrollo-web .service-hero-v34 .breadcrumbs a:hover,
.service-v34--landing-pages .service-hero-v34 .breadcrumbs a:hover,
.service-v34--anuncios-digitales .service-hero-v34 .breadcrumbs a:hover,
.service-layout--editorial .service-hero-copy .breadcrumbs a:hover {
  color: #fff !important;
}

.service-v34--desarrollo-web .service-hero-v34 .eyebrow,
.service-v34--landing-pages .service-hero-v34 .eyebrow,
.service-v34--anuncios-digitales .service-hero-v34 .eyebrow,
.service-layout--editorial .service-hero-copy .eyebrow {
  color: #fff !important;
  border-color: rgba(255,255,255,.30) !important;
  background: rgba(255,255,255,.10) !important;
}

/* Better button distinction on red heroes */
.service-v34--desarrollo-web .service-hero-v34 .btn.primary,
.service-v34--anuncios-digitales .service-hero-v34 .btn.primary {
  color: #8b1610 !important;
  border-color: #fff !important;
  background: #fff !important;
}

.service-v34--desarrollo-web .service-hero-v34 .btn:not(.primary),
.service-v34--anuncios-digitales .service-hero-v34 .btn:not(.primary),
.service-v34--landing-pages .service-hero-v34 .btn:not(.primary),
.service-layout--editorial .service-hero-copy .btn:not(.primary) {
  color: #fff !important;
  border-color: rgba(255,255,255,.42) !important;
  background: rgba(255,255,255,.08) !important;
}

.service-v34--desarrollo-web .service-hero-v34 .btn:not(.primary):hover,
.service-v34--anuncios-digitales .service-hero-v34 .btn:not(.primary):hover,
.service-v34--landing-pages .service-hero-v34 .btn:not(.primary):hover,
.service-layout--editorial .service-hero-copy .btn:not(.primary):hover {
  border-color: #fff !important;
  background: rgba(255,255,255,.16) !important;
}

/* Dark theme turns every service hero dark, so make all navigation labels legible. */
html[data-theme="dark"] .service-hero-v34 .breadcrumbs,
html[data-theme="dark"] .service-hero-v34 .breadcrumbs a {
  color: rgba(255,255,255,.70) !important;
}

html[data-theme="dark"] .service-hero-v34 .breadcrumbs b {
  color: #fff !important;
}

html[data-theme="dark"] .service-hero-v34 .eyebrow {
  color: #fff !important;
  border-color: rgba(255,255,255,.25) !important;
  background: rgba(255,255,255,.08) !important;
}

/* The result area is dark in both themes. */
.service-result-section .eyebrow,
.service-result-section .section-head .eyebrow {
  color: #fff !important;
  border-color: rgba(255,255,255,.24) !important;
  background: rgba(255,255,255,.08) !important;
}

/* Keep text inside the editorial dark panel consistently light. */
.service-layout--editorial .service-hero-copy,
.service-layout--editorial .service-hero-copy p {
  color: #cbd3d7 !important;
}

.service-layout--editorial .service-hero-copy h1,
.service-layout--editorial .service-hero-copy h2,
.service-layout--editorial .service-hero-copy h3 {
  color: #fff !important;
}

/* ---------- Global dark/red section labels ---------- */
.dark-page-hero .breadcrumbs,
.project-detail-hero .breadcrumbs {
  color: rgba(255,255,255,.68) !important;
}

.dark-page-hero .breadcrumbs a,
.project-detail-hero .breadcrumbs a {
  color: inherit !important;
}

.dark-page-hero .breadcrumbs b,
.project-detail-hero .breadcrumbs b {
  color: #fff !important;
}

/* ---------- Footer ---------- */
.site-footer {
  position: relative;
  overflow: hidden;
  padding: 78px 0 38px !important;
  color: rgba(255,255,255,.78) !important;
  background:
    radial-gradient(circle at 82% 12%,rgba(255,255,255,.11),transparent 28rem),
    linear-gradient(128deg,#ab1b14 0%,#7e130e 52%,#260706 100%) !important;
}

.site-footer::before {
  content: "";
  position: absolute;
  right: -150px;
  bottom: -235px;
  width: 470px;
  height: 470px;
  border: 62px solid rgba(255,255,255,.055);
  border-radius: 50%;
  pointer-events: none;
}

.site-footer::after {
  content: "";
  position: absolute;
  left: 47%;
  top: -170px;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 50%;
  pointer-events: none;
}

.site-footer .footer {
  position: relative;
  z-index: 1;
  border-top-color: rgba(255,255,255,.18) !important;
}

.site-footer .footer-brand-static {
  display: block;
  width: min(280px,100%);
  max-width: 280px;
  height: auto;
  overflow: visible;
}

.site-footer .footer-brand-static img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 112px;
  object-fit: contain;
  object-position: left center;
}

.site-footer .footer p,
.site-footer .footer small {
  color: rgba(255,255,255,.72) !important;
}

.site-footer .footer a,
.site-footer .footer-contact a {
  color: #fff !important;
}

.site-footer .footer a:hover,
.site-footer .footer-contact a:hover {
  color: #ffd8d5 !important;
}

.site-footer .footer-legal-links {
  margin-top: 12px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.13);
}

.site-footer .footer-contact {
  padding-left: 24px;
  border-left: 1px solid rgba(255,255,255,.14);
}

@media (max-width:980px) {
  .site-footer .footer-contact {
    padding-left: 0;
    padding-top: 22px;
    border-top: 1px solid rgba(255,255,255,.14);
    border-left: 0;
  }
}

@media (max-width:700px) {
  .site-footer {
    padding: 58px 0 28px !important;
  }

  .site-footer .footer-brand-static {
    width: min(240px,80%);
  }
}