/* DealConverter.Ai — marca sobre plantilla Webflow (carga después de dealconverter.webflow.css)
   Colores: #2FD6A2 (verde), #2C2F8F (azul). Tipografía: Inter 400 (cuerpo), 600 (semibold, títulos y CTAs). */

:root {
  --dc-green: #2fd6a2;
  --dc-blue: #2c2f8f;
  --accent--primary-1: #2fd6a2;
  --secondary--color-1: #24a882;
  --neutral--800: #2c2f8f;
  --gradient-top: #4fe8b8;
  --gradient-bottom: #2fd6a2;
  --gradient-variant-top: #5dccb0;
  --gradient-variant-bottom: #2fd6a2;
  --secondary--color-2: #e8faf4;
  --secondary--color-3: #d4f5eb;
  --secondary--color-4: #2fd6a2;
  --secondary--color-5: #2c2f8f;
  --secondary-color-6: #1e2266;
  --system--blue-400: #2c2f8f;
  --system--blue-300: #3d42a8;
  --system--blue-200: #8b8ed4;
  --system--blue-100: #e8e9f7;
  --system--green-400: #1a9e78;
  --system--green-300: #2fd6a2;
  --system--green-200: #7fe8c8;
  --system--green-100: #e8faf4;
}

body {
  font-family: Inter, sans-serif;
  font-weight: 400;
}

/* Cabecera: sombra un poco más marcada (respeta .bg-transparent sin sombra) */
.header-wrapper:not(.bg-transparent) {
  box-shadow: 0 4px 24px rgb(18 20 41 / 0.14), 0 1px 3px rgb(18 20 41 / 0.1) !important;
}

/* Navegación por anclas: scroll suave y offset para que el header fijo no tape
   el título de la sección de destino. */
html {
  scroll-behavior: smooth;
}
#features,
#product,
#pricing,
#get-started {
  scroll-margin-top: 110px;
}

/* Carrito modal: texto oscuro sobre panel claro */
.w-commerce-commercecartcontainer,
.w-commerce-commercecartcontainer .color-neutral-800 {
  color: #1b1e3e !important;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 600;
}

.text-100.bold,
.text-200.bold,
.text-300.bold,
.text-400.bold,
.display-1,
.display-2,
.display-3,
.display-4 {
  font-weight: 600;
}

.btn-primary,
.badge-primary {
  font-weight: 600;
}

.btn-secondary {
  font-weight: 400;
}

.header-nav-list-item {
  font-weight: 400;
}

.header-nav-list-item .btn-primary.small.nav-btn {
  font-weight: 600;
}

.btn-primary.buy-template-button.no-hover {
  color: #2fd6a2 !important;
}

.w-commerce-commercecartopenlink {
  background-color: #2c2f8f !important;
}

.header-logo-link.left {
  flex-shrink: 0;
}

/* Hero Get Started: sombra para separarlo del fondo claro / verde suave */
.section.home-hero-v1 .buttons-row a.btn-primary.w-button {
  box-shadow:
    0 6px 20px rgb(18 20 41 / 0.18),
    0 2px 6px rgb(18 20 41 / 0.12);
}

.section.home-hero-v1 .buttons-row a.btn-primary.w-button:hover {
  box-shadow:
    0 8px 26px rgb(18 20 41 / 0.22),
    0 3px 10px rgb(18 20 41 / 0.14);
}

/* Pie: LinkedIn con SVG (el glifo del font era YouTube por error del template) */
a.social-media-link.dc-footer-linkedin .dc-footer-linkedin-img {
  width: 20px;
  height: 20px;
  display: block;
  object-fit: contain;
}

/* Wordmark SVG: DEALCONVERTER-02.svg (nitidez a cualquier zoom). Favicon: DEALCONVERTER-10.svg */
img.header-logo.dc-logo-lock {
  display: block;
  height: auto;
  max-height: 56px !important;
  max-width: min(300px, 88vw) !important;
  width: auto !important;
  min-width: 0;
  shape-rendering: geometricPrecision;
}

img.footer-logo.dc-logo-lock {
  display: block;
  height: auto;
  max-height: 52px;
  max-width: 280px;
  width: auto;
  shape-rendering: geometricPrecision;
}

.nav-logo img.dc-logo-lock,
img.style---logo-sidebar.dc-logo-lock {
  max-height: 48px;
  width: auto;
  shape-rendering: geometricPrecision;
}

/* BRIX: punto Lottie + tarjetas flotantes “Premium Webflow Templates” (esquina inferior) */
.more-templates-lottie-2,
.more-templates-badge-wrapper {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.dc-header-cart-hidden {
  display: none !important;
}

/* Hero: el template deja opacity:0 hasta la animación IX; sin JS el copy queda invisible */
.section.home-hero-v1 [data-w-id="fb3cdd82-cf6b-8dc2-60af-846b7419a0e5"],
.section.home-hero-v1 [data-w-id="fb3cdd82-cf6b-8dc2-60af-846b7419a103"] {
  opacity: 1 !important;
  transform: none !important;
}

/* Hero imagen: caja al ancho de la imagen (sin bandas vacías dentro del borde/fondo) */
.section.home-hero-v1 .grid-2-columns.home-hero-grid > .position-relative.home-hero-bg-wrapper {
  width: fit-content;
  max-width: 100%;
  min-height: 0;
  margin-left: auto;
  justify-self: end;
  align-items: flex-start;
  justify-content: center;
}

@media screen and (max-width: 991px) {
  .section.home-hero-v1 .grid-2-columns.home-hero-grid > .position-relative.home-hero-bg-wrapper {
    justify-self: center;
    margin-right: auto;
  }
}

.section.home-hero-v1 .bg-image-wrapper.home-hero-image {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  overflow: visible;
  box-sizing: border-box;
}

.section.home-hero-v1 .bg-image-wrapper.home-hero-image .image {
  width: auto;
  max-width: min(100%, 966px);
  height: auto;
  max-height: min(58.8vh, 546px);
  margin: 0;
  display: block;
  object-fit: contain;
  object-position: center top;
  border-radius: 12px;
  box-shadow:
    0 28px 60px rgb(18 20 41 / 0.22),
    0 12px 28px rgb(18 20 41 / 0.14),
    0 0 0 1px rgb(18 20 41 / 0.08);
  filter: contrast(1.05);
}

/* Pie: una sola columna tras quitar bloques Pages / Utility */
.w-layout-grid.footer-grid {
  grid-template-columns: 1fr !important;
}