/* ==========================================================================
   Blueclownfish — Home (evolución controlada de la primera propuesta / MASTER)
   Todo el CSS está encapsulado bajo .bcf-home para no colisionar con WoodMart.
   Tipografías: hereda Montserrat (títulos) y Lato (texto) ya cargadas por el tema.
   Paleta, radios, sombras y tono general = idénticos a bcf-home(1).html.
   v6.1: corrige el bug real detectado en producción ("Error ancho"/tarjetas
   vacías en Soluciones 360º). Causa: las 8 fotos de esa sección se pintaban
   con position:absolute + z-index NEGATIVO dentro de un contenedor con
   isolation:isolate — válido en un navegador limpio, pero muy fresco por
   WPBakery/WoodMart, que envuelven cada bloque en contenedores propios;
   basta que uno no aísle el stacking context exactamente igual y la imagen
   queda pintada por detrás de todo, dejando la tarjeta en blanco. Se
   reescribe con z-index POSITIVO explícito (imagen 0, degradado 1, texto 2)
   que no depende de ningún comportamiento implícito de wrappers externos.
   Se quita loading="lazy" de esas 8 imágenes (conflictaba con el lazy-load
   propio de LiteSpeed Cache y podía dejarlas a medio cargar). Se añade
   max-width:100vw/100% como red de seguridad extra contra desbordamiento
   horizontal en todo el componente.
   v6.0: pasada de responsive/depuración sobre v5.4. Elimina las dos imágenes
   embebidas en base64 (logo Zoo Aquarium Madrid y logo "360° Service": ~150KB
   de texto en el HTML, nunca cacheables) — se extraen a archivos reales
   (ver entrega) y se sustituyen por placeholders de texto/insignia hasta que
   estén en la Mediateca. Reescribe el grid de Soluciones 360º: de
   grid-template-areas + alturas en píxeles fijas duplicadas en 3 breakpoints
   a un sistema de column/row-span sobre grid-auto-rows (misma regla vale en
   4, 2 y 1 columnas). Sube los tamaños de letra que se leían pequeños en
   tarjetas de categoría, meta de producto, marca de producto e ítems de
   experiencia. Añade un escalón de padding vertical específico para tablet
   (641–1024px), antes fijo desde desktop hasta 640px. Añade un breakpoint de
   768px a la cabecera de Soluciones 360º. Nada de esto cambia el copy, las
   URLs de imagen reales ni la estructura de secciones.
   v5.4: incorpora las ocho imágenes finales de Soluciones 360º, actualiza sus
   dimensiones intrínsecas, sustituye las pestañas de marca por filtros comerciales
   y corrige la cifra de experiencia eliminando el punto separador tras +30.
   v5.3: incorpora la fotografía final del hero, elimina la cuadrícula provisional,
   mejora el recorte responsive, amplía el mosaico 360º y deja identificados los
   assets que se sustituirán por nuevas imágenes optimizadas.
   v5.2: revisión integral de CSS/HTML. Corrige las colisiones de especificidad
   que anulaban el margen de la lista B2B y rompían la alineación de sus checks;
   fija colores de enlaces/botones frente a WoodMart, prepara la imagen del hero
   y elimina del copy B2B cualquier alusión a pago o compra directa.
   Base v5.1: ajustes de copy puntuales. Hero (stat MULTIMARCA, claim visual, lead),
   Productos (título + copy sin lenguaje de compra), Marcas (título nuevo, CTA
   "Ver todas las marcas" eliminado), 360º (título/texto/caption nuevos), B2B
   (copy sin compra/pagos, más espaciado), bloque "Garantía y asesoramiento"
   ELIMINADO, pilares de +30 años con "Garantía y postventa", Prefooter con
   nuevo texto. Categorías, Confían y la estructura visual de Productos: sin
   tocar. Fix de especificidad del CTA del hero y logos reales embebidos
   (Zoo Aquarium, 360° Service) de la iteración anterior se mantienen.

   GUÍA DE ASSETS (dimensiones reales de los archivos cargados)
   - Hero: 1600 × 2000 px, proporción 4:5, JPG/WebP. Mantener el motivo principal
     en el centro: en tablet el contenedor recorta la misma imagen a 16:10.
   - Logos de instituciones: SVG preferente o PNG transparente de 600 × 240 px.
   - Aquascaping, agua dulce y agua salada: 1254 × 1254 px, PNG.
   - Acuarios XXL: 2400 × 1002 px, PNG.
   - Viveros de marisco: 1448 × 1086 px, PNG.
   - Universidades: 1491 × 1055 px, PNG.
   - Estanques: 1490 × 1055 px, PNG.
   - Acuariofilia profesional: 1492 × 1054 px, PNG.
   - Logos de marcas pendientes: SVG preferente o PNG transparente de 600 × 240 px.
   - Logo 360° Service: SVG preferente o PNG transparente de 640 × 676 px.
   - Producto: formato cuadrado; 800 × 800 px recomendado (430 × 430 px mínimo).
   - Peso objetivo: Hero <= 250 KB; cada foto de Soluciones <= 180 KB;
     producto <= 120 KB; logo raster <= 80 KB. Sin márgenes transparentes sobrantes.

   SEO ANTES DE PUBLICAR
   - Sustituir todos los href="#" por las URLs definitivas; no publicar anclas vacías.
   - Title sugerido: Distribuidor de acuariofilia profesional | Blueclownfish
   - Meta description sugerida: Equipamiento, marcas y soluciones de acuariofilia
     para tiendas, instalaciones profesionales, acuarios y centros de investigación.
   - La plantilla de WordPress debe aportar canonical, Open Graph y datos de Organization.
   - Servir imágenes desde la Mediateca mediante el módulo/attachment de WordPress
     para conservar width/height y generar srcset/sizes; evitar data URI en producción.
   ========================================================================== */

.bcf-home{
  --bcf-teal-500:#60A5AC;
  --bcf-teal-600:#3F868E;
  --bcf-teal-700:#285B61;
  --bcf-teal-050:#EAF3F3;
  --bcf-teal-100:#D7E9E9;
  --bcf-ink-900:#0C1719;
  --bcf-ink-800:#152426;
  --bcf-ink-700:#22383B;
  --bcf-text-900:#1B2426;
  --bcf-text-600:#5B6667;
  --bcf-text-500:#78878A;
  --bcf-paper:#FFFFFF;
  --bcf-mist:#F4F8F8;
  --bcf-mist-2:#EEF4F4;
  --bcf-line:#E1E9E9;
  --bcf-line-soft:#EDF3F3;
  --bcf-shadow:0 18px 40px -24px rgba(12,23,25,.35);
  --bcf-shadow-sm:0 8px 20px -14px rgba(12,23,25,.3);
  --bcf-radius:14px;
  --bcf-radius-sm:10px;
  --bcf-container:1240px;

  /* Escala tipográfica para texto de apoyo (los titulares grandes —h1, h2,
     cifras— siguen en clamp() dentro de cada sección porque son fluidos).
     Todo lo que antes eran valores sueltos (9.5px, 10.5px, 11.5px, 13px...)
     repartidos por el archivo ahora sale de aquí, para que dos textos con el
     mismo papel midan siempre lo mismo. */
  --bcf-fs-tag:    11px;    /* etiquetas/insignias sobre fotografía o chips diminutos */
  --bcf-fs-label:  12.5px;  /* eyebrows y micro-etiquetas en mayúsculas */
  --bcf-fs-caption:13.5px;  /* meta/caption bajo un titular */
  --bcf-fs-body-sm:14.5px;  /* descripciones de tarjeta, texto de apoyo */
  --bcf-fs-body:   16px;    /* párrafo estándar de sección */
  --bcf-fs-lead:   17.5px;  /* el lead del hero — el párrafo más importante de la página */

  font-family:'Lato', Arial, Helvetica, sans-serif;
  color:var(--bcf-text-900);
  background:var(--bcf-paper);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  max-width:100vw;
}

.bcf-home *{ box-sizing:border-box; max-width:100%; }
.bcf-home img{ max-width:100%; display:block; }
.bcf-home a{ text-decoration:none; color:inherit; }
.bcf-home ul{ margin:0; padding:0; list-style:none; }
.bcf-home h1,
.bcf-home h2,
.bcf-home h3,
.bcf-home h4{
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  color:var(--bcf-text-900);
  margin:0;
  line-height:1.18;
  letter-spacing:-.01em;
}
.bcf-home p{ margin:0; }

.bcf-container{
  max-width:var(--bcf-container);
  margin:0 auto;
  padding:0 40px;
}
@media (max-width:1024px){ .bcf-container{ padding:0 28px; } }
@media (max-width:640px){ .bcf-container{ padding:0 20px; } }

.bcf-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:var(--bcf-fs-label);
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--bcf-teal-700);
}
.bcf-eyebrow::before{
  content:"";
  width:20px;
  height:2px;
  background:var(--bcf-teal-500);
  display:block;
}
.bcf-eyebrow.is-on-dark{ color:var(--bcf-teal-500); }

.bcf-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:32px;
  margin-bottom:40px;
}
.bcf-section-head__text{ max-width:640px; }
.bcf-section-head h2{
  font-size:clamp(26px,3vw,36px);
  margin-top:14px;
}
.bcf-section-head p{
  margin-top:14px;
  font-size:var(--bcf-fs-body);
  line-height:1.65;
  color:var(--bcf-text-600);
}
@media (max-width:768px){
  .bcf-section-head{ flex-direction:column; align-items:flex-start; gap:16px; margin-bottom:32px; }
}

/* Buttons -------------------------------------------------------------- */
.bcf-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-weight:700;
  font-size:13.5px;
  letter-spacing:.03em;
  text-transform:uppercase;
  padding:15px 30px;
  border-radius:40px;
  border:1.6px solid transparent;
  cursor:pointer;
  transition:background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
  white-space:nowrap;
}
.bcf-btn--primary{
  background:var(--bcf-teal-700);
  color:#fff;
}
.bcf-btn--primary:hover{ background:#1F4A4F; transform:translateY(-1px); }
/* Fix definitivo: .bcf-home a{color:inherit} tiene más especificidad (clase+tipo)
   que .bcf-btn--primary{color:#fff} (una sola clase) y ganaba. Esta regla
   (clase+clase+tipo) es más específica que ambas y fija el blanco del CTA. */
.bcf-home a.bcf-btn--primary{ color:#fff; }
.bcf-btn--ghost-dark{
  background:transparent;
  border-color:rgba(255,255,255,.4);
  color:#fff;
}
.bcf-btn--ghost-dark:hover{ border-color:#fff; background:rgba(255,255,255,.08); }
.bcf-btn--ghost-light{
  background:transparent;
  border-color:var(--bcf-line);
  color:var(--bcf-text-900);
}
.bcf-btn--ghost-light:hover{ border-color:var(--bcf-teal-500); color:var(--bcf-teal-700); }
.bcf-home a.bcf-btn--ghost-dark{ color:#fff; }
.bcf-home a.bcf-btn--ghost-light{ color:var(--bcf-text-900); }
.bcf-home a.bcf-btn--ghost-light:hover{ color:var(--bcf-teal-700); }
.bcf-btn--sm{ padding:11px 22px; font-size:var(--bcf-fs-label); }
.bcf-btn--link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-weight:700;
  font-size:13px;
  letter-spacing:.03em;
  text-transform:uppercase;
  color:var(--bcf-teal-700);
  padding-bottom:2px;
  border-bottom:1.5px solid var(--bcf-teal-500);
}
.bcf-btn--link:hover{ color:var(--bcf-teal-600); }
.bcf-home a.bcf-btn--link{ color:var(--bcf-teal-700); }º
.bcf-home a.bcf-btn--link:hover{ color:var(--bcf-teal-600); }
.bcf-btn--link svg{ width:14px; height:14px; transition:transform .2s ease; }
.bcf-btn--link:hover svg{ transform:translateX(3px); }
.bcf-home a:focus-visible,
.bcf-home button:focus-visible{
  outline:3px solid rgba(63,134,142,.45);
  outline-offset:3px;
}

/* ==========================================================================
   1. HERO — sin cambios respecto al master
   ========================================================================== */
.bcf-hero{
  padding:64px 0 80px;
  background:
    radial-gradient(1100px 460px at 82% -10%, var(--bcf-teal-050) 0%, rgba(234,243,243,0) 65%),
    var(--bcf-paper);
}
.bcf-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,0.86fr);
  gap:56px;
  align-items:center;
}
.bcf-hero__content h1{
  margin-top:16px;
  font-size:clamp(34px,4.4vw,52px);
  max-width:15ch;
}
.bcf-hero__content h1 em{
  font-style:normal;
  color:var(--bcf-teal-600);
}
.bcf-hero__lead{
  margin-top:22px;
  font-size:var(--bcf-fs-lead);
  line-height:1.7;
  color:var(--bcf-text-600);
  max-width:46ch;
}
.bcf-hero__kicker{
  display:block;
  margin-top:20px;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:var(--bcf-fs-label);
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--bcf-teal-600);
}
.bcf-hero__actions{
  display:flex;
  align-items:center;
  gap:16px;
  margin-top:34px;
  flex-wrap:wrap;
}
.bcf-hero__stats{
  display:flex;
  gap:34px;
  margin-top:46px;
  padding-top:28px;
  border-top:1px solid var(--bcf-line);
  flex-wrap:wrap;
}
.bcf-hero__stat{ position:relative; }
.bcf-hero__stat::before{
  content:"";
  display:block;
  width:18px;
  height:2px;
  background:var(--bcf-teal-500);
  margin-bottom:10px;
}
.bcf-hero__stat b{
  display:block;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:24px;
  color:var(--bcf-text-900);
}
.bcf-hero__stat span{
  display:block;
  margin-top:4px;
  font-size:var(--bcf-fs-caption);
  color:var(--bcf-text-500);
  letter-spacing:.02em;
}

.bcf-hero__visual{
  position:relative;
  aspect-ratio:4/5;
  border-radius:22px;
  overflow:hidden;
  background:
    linear-gradient(155deg, var(--bcf-ink-800) 0%, var(--bcf-ink-900) 100%);
  isolation:isolate;
}
.bcf-hero__visual-img{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 43%;
}
.bcf-hero__visual::after{
  content:"";
  position:absolute;
  width:340px; height:340px;
  right:-90px; top:-90px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(96,165,172,.55) 0%, rgba(96,165,172,0) 70%);
  filter:blur(2px);
  z-index:1;
}
.bcf-hero__ring{
  position:absolute;
  right:-70px; bottom:-70px;
  width:280px; height:280px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.14);
  z-index:2;
}
.bcf-hero__ring::before{
  content:"";
  position:absolute; inset:34px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.1);
}
.bcf-hero__visual-note{
  position:absolute;
  left:28px; bottom:28px; right:28px;
  z-index:2;
  color:#fff;
}
.bcf-hero__visual-tag{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:var(--bcf-fs-tag);
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--bcf-teal-500);
  background:rgba(9,18,20,.55);
  border:1px solid rgba(96,165,172,.4);
  padding:8px 14px;
  border-radius:30px;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  max-width:100%;
}
.bcf-hero__visual-tag span.bcf-dot{
  width:6px; height:6px; border-radius:50%;
  background:var(--bcf-teal-500);
  box-shadow:0 0 0 4px rgba(96,165,172,.25);
}

@media (max-width:1024px){
  .bcf-hero__grid{ grid-template-columns:1fr; }
  .bcf-hero__visual{ aspect-ratio:16/10; order:-1; }
}
@media (max-width:640px){
  .bcf-hero{ padding:44px 0 56px; }
  .bcf-hero__stats{ gap:22px 30px; }
  .bcf-hero__actions{ flex-direction:column; align-items:stretch; }
  .bcf-hero__actions .bcf-btn{ width:100%; }
}

/* ==========================================================================
   2. CONFÍAN EN NOSOTROS — compacta, chip neutro para que ningún logo
   (blanco o de color) se pierda sobre el fondo claro de la sección.
   ========================================================================== */
.bcf-clients{
  padding:44px 0;
  border-top:1px solid var(--bcf-line);
  border-bottom:1px solid var(--bcf-line);
}
.bcf-clients__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
}
.bcf-clients__label{
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:var(--bcf-fs-label);
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--bcf-text-500);
  white-space:nowrap;
}
.bcf-clients__row{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  flex:1;
  justify-content:flex-end;
}
.bcf-clients__logo{
  height:64px;
  width:150px;
  padding:0 18px;
  border-radius:10px;
  background:var(--bcf-mist);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.bcf-clients__logo img{
  height:auto;
  max-height:38px;
  width:auto;
  max-width:100%;
  object-fit:contain;
}
.bcf-clients__logo--pending{
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:11px;
  font-weight:700;
  line-height:1.3;
  color:var(--bcf-text-500);
  text-align:center;
}
@media (max-width:768px){
  .bcf-clients__row{ justify-content:flex-start; gap:10px; }
}
@media (max-width:640px){
  .bcf-clients__logo{ height:52px; width:120px; padding:0 12px; }
  .bcf-clients__logo img{ max-height:30px; }
  .bcf-clients__logo--pending{ font-size:10px; }
}

/* ==========================================================================
   3. CATEGORÍAS — 12 accesos, mismo estilo card+icono del master
   ========================================================================== */
.bcf-categories{ padding:96px 0; background:var(--bcf-mist); }
.bcf-cat__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}
.bcf-cat__card{
  background:var(--bcf-paper);
  border:1px solid var(--bcf-line);
  border-radius:var(--bcf-radius);
  padding:28px 24px;
  display:flex;
  flex-direction:column;
  gap:16px;
  transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.bcf-cat__card:hover{
  border-color:var(--bcf-teal-500);
  box-shadow:var(--bcf-shadow-sm);
  transform:translateY(-3px);
}
.bcf-cat__icon{
  width:50px; height:50px;
  border-radius:12px;
  background:var(--bcf-teal-050);
  display:flex; align-items:center; justify-content:center;
  color:var(--bcf-teal-700);
  flex-shrink:0;
}
.bcf-cat__icon svg{ width:24px; height:24px; }
.bcf-cat__card h3{ font-size:17px; }
.bcf-cat__card p{ font-size:var(--bcf-fs-body-sm); color:var(--bcf-text-500); line-height:1.6; }
.bcf-cat__card .bcf-cat__link{
  margin-top:auto;
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:var(--bcf-fs-label);
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--bcf-teal-700);
}
.bcf-cat__card .bcf-cat__link svg{ width:12px; height:12px; transition:transform .2s ease; }
.bcf-cat__card:hover .bcf-cat__link svg{ transform:translateX(3px); }
.bcf-categories__foot{
  display:flex;
  justify-content:center;
  margin-top:36px;
}
@media (max-width:1024px){ .bcf-cat__grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:768px){ .bcf-cat__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .bcf-cat__grid{ gap:14px; } .bcf-cat__card{ padding:20px 16px; } }

/* ==========================================================================
   4. PRODUCTOS — grid 4×2 puro de V1 (sin destacado+lateral). Filtros arriba:
   Destacados (activo), Novedades, Promociones y Más vendidos. En producción
   deben conectarse a las consultas correspondientes de WooCommerce.
   ========================================================================== */
.bcf-products{ padding:96px 0; background:var(--bcf-paper); }
.bcf-prod__tabs{
  display:flex;
  gap:26px;
  margin-bottom:32px;
  border-bottom:1px solid var(--bcf-line);
  overflow-x:auto;
  scrollbar-width:none;
}
.bcf-prod__tabs::-webkit-scrollbar{ display:none; }
.bcf-prod__tab{
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:var(--bcf-fs-label);
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--bcf-text-500);
  padding:0 1px 14px;
  border-bottom:2.5px solid transparent;
  cursor:default;
  white-space:nowrap;
  flex-shrink:0;
}
.bcf-prod__tab.is-active{ color:var(--bcf-teal-700); border-bottom-color:var(--bcf-teal-600); }

.bcf-prod__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
}
.bcf-prod__card{
  border:1px solid var(--bcf-line);
  border-radius:var(--bcf-radius);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  background:var(--bcf-paper);
  transition:box-shadow .2s ease, border-color .2s ease, transform .2s ease;
}
.bcf-prod__card:hover{ box-shadow:var(--bcf-shadow-sm); border-color:var(--bcf-line-soft); transform:translateY(-3px); }
.bcf-prod__media{
  position:relative;
  aspect-ratio:1/1;
  background:var(--bcf-mist);
  display:flex; align-items:center; justify-content:center;
  padding:22px;
}
.bcf-prod__media img{ max-height:100%; max-width:100%; object-fit:contain; mix-blend-mode:multiply; }
.bcf-prod__badge{
  position:absolute; top:12px; left:12px;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:var(--bcf-fs-tag);
  font-weight:700;
  letter-spacing:.06em;
  color:#fff;
  background:var(--bcf-teal-600);
  padding:5px 10px;
  border-radius:20px;
}
.bcf-prod__body{
  padding:18px 18px 20px;
  display:flex;
  flex-direction:column;
  gap:6px;
  flex:1;
}
.bcf-prod__brand{
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:var(--bcf-teal-700);
}
.bcf-home h3.bcf-prod__name{
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:15px;
  font-weight:600;
  color:var(--bcf-text-900);
  line-height:1.3;
}
.bcf-prod__meta{
  font-size:var(--bcf-fs-caption);
  color:var(--bcf-text-500);
}
.bcf-prod__foot{
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid var(--bcf-line-soft);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.bcf-prod__access{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-weight:700;
  font-size:11.5px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--bcf-text-500);
}
.bcf-prod__access svg{ width:13px; height:13px; }
.bcf-prod__view{
  width:36px; height:36px;
  border-radius:50%;
  border:1.4px solid var(--bcf-line);
  display:flex; align-items:center; justify-content:center;
  color:var(--bcf-teal-700);
  transition:background-color .2s ease, border-color .2s ease;
  flex-shrink:0;
}
.bcf-home a.bcf-prod__view{ color:var(--bcf-teal-700); }
.bcf-prod__view svg{ width:15px; height:15px; }
.bcf-prod__card:hover .bcf-prod__view{ background:var(--bcf-teal-600); border-color:var(--bcf-teal-600); color:#fff; }
.bcf-products__foot{
  display:flex;
  justify-content:center;
  margin-top:40px;
}
@media (max-width:1024px){ .bcf-prod__grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:640px){
  .bcf-prod__grid{ grid-template-columns:repeat(2,1fr); gap:14px; }
  .bcf-prod__body{ padding:14px; }
  .bcf-prod__tabs{ gap:20px; }
  .bcf-prod__access{ font-size:10px; letter-spacing:.02em; }
  .bcf-prod__view{ width:32px; height:32px; }
}
@media (max-width:420px){
  .bcf-prod__grid{ grid-template-columns:1fr; }
  .bcf-prod__access{ font-size:11px; }
  .bcf-prod__view{ width:36px; height:36px; }
}

/* ==========================================================================
   5. MARCAS — grid modular: admite altas y bajas sin depender de una cifra fija.
   Hasta 6 columnas en desktop, 3 en tablet y 2 en móvil. Logos grandes, sin
   grayscale ni opacidad reducida. Sin CTA redundante bajo el grid.
   ========================================================================== */
.bcf-brands{ padding:96px 0; background:var(--bcf-mist); }
.bcf-brands__grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:1px;
  background:var(--bcf-line);
  border:1px solid var(--bcf-line);
  border-radius:var(--bcf-radius);
  overflow:hidden;
}
.bcf-brands__item{
  background:var(--bcf-paper);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:26px 18px;
  min-height:112px;
  transition:background-color .2s ease;
}
.bcf-brands__item:hover{ background:var(--bcf-mist); }
.bcf-brands__item img{
  max-height:50px;
  width:auto;
  max-width:100%;
  object-fit:contain;
  transition:transform .2s ease;
}
.bcf-brands__item:hover img{ transform:scale(1.04); }
.bcf-brands__item--pending{
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:13px;
  font-weight:700;
  letter-spacing:.03em;
  text-transform:uppercase;
  color:var(--bcf-text-500);
  text-align:center;
}
.bcf-brands__foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-top:28px;
  flex-wrap:wrap;
}
.bcf-brands__foot p{ color:var(--bcf-text-600); font-size:var(--bcf-fs-body-sm); max-width:56ch; }
@media (max-width:768px){
  .bcf-brands__grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:640px){
  .bcf-brands__grid{ grid-template-columns:repeat(2,1fr); }
  .bcf-brands__item{ padding:22px 14px; min-height:92px; }
  .bcf-brands__item img{ max-height:38px; }
}

/* ==========================================================================
   6. SOLUCIONES 360º — presentación + mosaico completo de 8 piezas sin huecos
   ========================================================================== */
.bcf-solutions{ padding:96px 0; background:var(--bcf-paper); }
.bcf-sol__intro{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:40px;
  padding-bottom:44px;
  flex-wrap:wrap;
}
.bcf-sol__intro .bcf-section-head{ margin-bottom:0; flex:1 1 480px; }
/* Insignia compacta (antes: bloque de 150px con un PNG en base64 dominando la
   sección por encima de la fotografía real). Ahora es una etiqueta discreta,
   sin depender de ningún asset de imagen. */
.bcf-sol__logo-slot{
  display:flex;
  align-items:center;
  gap:16px;
  flex:0 0 auto;
  max-width:260px;
}
.bcf-sol__badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  flex-shrink:0;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:14px;
  font-weight:700;
  color:var(--bcf-teal-700);
  background:var(--bcf-teal-050);
  border-radius:50px;
  padding:9px 16px;
}
.bcf-sol__badge svg{ width:17px; height:17px; }
.bcf-sol__logo-caption{
  display:block;
  font-size:var(--bcf-fs-caption);
  line-height:1.5;
  color:var(--bcf-text-500);
  max-width:24ch;
}
.bcf-sol__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:200px;
  gap:18px;
}
.bcf-sol__card{
  position:relative;
  border-radius:var(--bcf-radius);
  overflow:hidden;
  display:flex;
  align-items:flex-end;
  color:#fff;
  background:var(--bcf-ink-700);
}
/* Estos 8 recuadros dependen de que su foto cargue y se pinte por encima
   del fondo de respaldo (background de la línea de arriba). Antes la imagen
   usaba position:absolute + z-index NEGATIVO dentro de un contenedor con
   isolation:isolate: técnicamente correcto en un navegador limpio, pero muy
   frágil en WordPress -> WPBakery/WoodMart envuelven cada bloque en más
   contenedores con su propio stacking context, y basta que uno de ellos NO
   aísle correctamente para que la imagen quede pintada por detrás de todo
   y la tarjeta se vea vacía (justo lo que se ve en las capturas). Ahora la
   imagen, el degradado y el texto usan z-index POSITIVO y explícito
   (0 / 1 / 2): no dependen de ningún comportamiento "por defecto" del
   navegador ni de que ningún wrapper externo se comporte de una manera
   concreta, así que no pueden desaparecer por culpa de markup ajeno. */
.bcf-sol__card img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  z-index:0;
  transition:transform .5s ease;
}
.bcf-sol__card:hover img{ transform:scale(1.06); }
.bcf-sol__card::after{
  content:"";
  position:absolute; inset:0;
  z-index:1;
  background:linear-gradient(190deg, rgba(12,23,25,0) 30%, rgba(9,17,19,.86) 100%);
}
.bcf-sol__card-body{ position:relative; z-index:2; padding:22px; }
.bcf-sol__tag{
  display:inline-block;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:var(--bcf-fs-tag);
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--bcf-teal-500);
  margin-bottom:8px;
}
.bcf-sol__card h3{
  color:#fff;
  font-size:19px;
  max-width:20ch;
}
/* Spans en vez de grid-template-areas fijas: el mismo bloque de reglas
   funciona en las 4, 2 y 1 columnas de cada breakpoint sin duplicar mapas. */
.bcf-sol__card--aqua{ grid-column:span 2; grid-row:span 2; }
.bcf-sol__card--aqua h3{ font-size:25px; }
.bcf-sol__card--dulce{ grid-column:span 1; grid-row:span 1; }
.bcf-sol__card--sala{ grid-column:span 1; grid-row:span 1; }
.bcf-sol__card--xxl{ grid-column:span 2; grid-row:span 1; }
.bcf-sol__card--marisco{ grid-column:span 1; grid-row:span 1; }
.bcf-sol__card--uni{ grid-column:span 1; grid-row:span 1; }
.bcf-sol__card--estan{ grid-column:span 1; grid-row:span 1; }
.bcf-sol__card--prof{ grid-column:span 1; grid-row:span 1; background:var(--bcf-ink-700); }
.bcf-sol__card--prof .bcf-sol__card-body p{ margin-top:6px; font-size:11.5px; color:rgba(255,255,255,.55); }
.bcf-sol__pending-tag{
  display:inline-block;
  margin-top:10px;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:var(--bcf-fs-tag);
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,.5);
  border:1px solid rgba(255,255,255,.28);
  padding:3px 9px;
  border-radius:3px;
}

@media (max-width:1024px){
  .bcf-sol__grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:220px; }
}
@media (max-width:768px){
  .bcf-sol__intro{ flex-direction:column; align-items:flex-start; gap:20px; }
  .bcf-sol__logo-slot{ max-width:none; }
}
@media (max-width:640px){
  .bcf-solutions{ padding:64px 0; }
  .bcf-sol__grid{ grid-template-columns:1fr; grid-auto-rows:230px; }
  .bcf-sol__card--aqua{ grid-row:span 1; min-height:280px; }
}

/* ==========================================================================
   7. BLOQUE PROFESIONAL B2B — acotado a 4 conceptos seguros
   ========================================================================== */
.bcf-b2b{
  padding:96px 0;
  background:linear-gradient(150deg, var(--bcf-ink-800) 0%, var(--bcf-ink-900) 100%);
  color:#fff;
  position:relative;
  overflow:hidden;
}
.bcf-b2b::before{
  content:"";
  position:absolute;
  width:520px; height:520px;
  right:-160px; top:-220px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(96,165,172,.28) 0%, rgba(96,165,172,0) 70%);
}
.bcf-b2b__grid{
  position:relative;
  display:grid;
  grid-template-columns:1.05fr 0.95fr;
  gap:72px;
  align-items:center;
}
.bcf-b2b__text h2{ color:#fff; margin-top:14px; font-size:clamp(26px,3vw,34px); max-width:16ch; }
.bcf-b2b__text > p{ margin-top:16px; color:rgba(255,255,255,.68); font-size:var(--bcf-fs-body); line-height:1.7; max-width:48ch; }
.bcf-home ul.bcf-b2b__list{
  margin:34px 0 0;
  display:grid;
  gap:18px;
}
.bcf-b2b__list li{
  display:flex;
  align-items:flex-start;
  gap:14px;
  font-size:15px;
  color:rgba(255,255,255,.9);
}
.bcf-b2b__list li > div{ min-width:0; }
.bcf-b2b__list li b{ display:block; font-family:'Montserrat', Arial, Helvetica, sans-serif; font-weight:600; color:#fff; margin-bottom:1px; font-size:var(--bcf-fs-body-sm); line-height:1.35; }
.bcf-b2b__list li > div > span{ display:block; color:rgba(255,255,255,.62); font-size:var(--bcf-fs-caption); line-height:1.5; }
.bcf-b2b__list li > .bcf-b2b__check{
  width:18px; height:18px;
  min-width:18px;
  border-radius:50%;
  background:rgba(96,165,172,.16);
  border:1px solid rgba(96,165,172,.5);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  margin-top:2px;
  padding:0;
  line-height:1;
}
.bcf-b2b__check svg{
  display:block;
  width:10px;
  height:10px;
  overflow:visible;
  color:var(--bcf-teal-500);
  stroke-linecap:round;
  stroke-linejoin:round;
}

.bcf-b2b__card{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  padding:46px 44px;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
.bcf-b2b__card .bcf-eyebrow{ margin-bottom:6px; }
.bcf-b2b__card h3{ color:#fff; font-size:22px; margin-top:10px; max-width:18ch; }
.bcf-b2b__card p{ margin-top:14px; color:rgba(255,255,255,.65); font-size:var(--bcf-fs-body-sm); line-height:1.65; }
.bcf-b2b__card-actions{ margin-top:28px; display:flex; flex-direction:column; gap:16px; }
.bcf-b2b__card-actions .bcf-btn{ width:100%; }
.bcf-b2b__card-action{ display:flex; flex-direction:column; gap:6px; }
.bcf-b2b__card-action span{ font-size:11.5px; color:rgba(255,255,255,.48); }
.bcf-b2b__card-foot{
  margin-top:24px;
  padding-top:20px;
  border-top:1px solid rgba(255,255,255,.14);
  font-size:var(--bcf-fs-caption);
  color:rgba(255,255,255,.5);
}

@media (max-width:1024px){
  .bcf-b2b__grid{ grid-template-columns:1fr; gap:44px; }
}
@media (max-width:640px){
  .bcf-b2b{ padding:64px 0; }
  .bcf-b2b__card{ padding:28px; }
  .bcf-home ul.bcf-b2b__list{ margin-top:30px; gap:16px; }
  .bcf-b2b__list li{ gap:12px; }
  .bcf-b2b__card .bcf-btn{ white-space:normal; text-align:center; }
}

/* ==========================================================================
   8. EXPERIENCIA BLUECLOWNFISH — sin cambios respecto al master
   ========================================================================== */
.bcf-experience{ padding:96px 0 104px; background:var(--bcf-paper); }
.bcf-exp__top{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:56px;
  align-items:end;
  padding-bottom:52px;
  border-bottom:1px solid var(--bcf-line);
}
.bcf-home h2.bcf-exp__figure{
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-weight:700;
  font-size:clamp(64px,8vw,108px);
  line-height:.9;
  color:var(--bcf-text-900);
}
.bcf-exp__figure span{ color:var(--bcf-teal-500); }
.bcf-exp__figure .bcf-exp__plus{ color:var(--bcf-teal-500); }
.bcf-exp__figure small{
  display:block;
  margin-top:10px;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:13px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--bcf-text-500);
}
.bcf-exp__top p{ font-size:var(--bcf-fs-body); line-height:1.7; color:var(--bcf-text-600); max-width:56ch; }

.bcf-exp__grid{
  margin-top:52px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
}
.bcf-exp__item{
  padding:0 28px;
  border-left:1px solid var(--bcf-line);
}
.bcf-exp__item:first-child{ border-left:none; padding-left:0; }
.bcf-exp__item-icon{
  width:44px; height:44px;
  border-radius:11px;
  background:var(--bcf-teal-050);
  color:var(--bcf-teal-700);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:18px;
}
.bcf-exp__item-icon svg{ width:21px; height:21px; }
.bcf-exp__item h3{ font-size:16px; margin-bottom:8px; }
.bcf-exp__item p{ font-size:var(--bcf-fs-body-sm); color:var(--bcf-text-500); line-height:1.6; }

@media (max-width:1024px){
  .bcf-exp__top{ grid-template-columns:1fr; gap:24px; }
  .bcf-exp__grid{ grid-template-columns:repeat(2,1fr); row-gap:32px; }
  .bcf-exp__item{ border-left:none; padding-left:0; }
}
@media (max-width:640px){
  .bcf-exp__grid{ grid-template-columns:1fr; }
  .bcf-exp__item{ padding:0; }
}

/* ==========================================================================
   9. PREFOOTER — cierre visual, preparado para HTML Block global de WoodMart
   ========================================================================== */
.bcf-prefooter{ background:var(--bcf-teal-700); color:#fff; padding:64px 0; border-radius:0; }
.bcf-prefooter__grid{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  flex-wrap:wrap;
}
.bcf-prefooter__text h2{ color:#fff; font-size:clamp(22px,2.6vw,30px); max-width:20ch; }
.bcf-prefooter__text p{ margin-top:10px; color:rgba(255,255,255,.78); font-size:15.5px; max-width:50ch; }
.bcf-prefooter__actions{ display:flex; gap:14px; flex-wrap:wrap; }
@media (max-width:640px){
  .bcf-prefooter__actions{ flex-direction:column; align-items:stretch; width:100%; }
  .bcf-prefooter__actions .bcf-btn{ width:100%; }
}

/* Ritmo vertical — antes el padding vertical se quedaba fijo en 88–100px
   desde el desktop hasta los 641px y caía de golpe a 64px, dejando las
   tablas (iPad, portátiles pequeños) con demasiado aire "muerto" entre
   secciones. Se añade un escalón intermedio en tablet. -------------------- */
@media (min-width:641px) and (max-width:1024px){
  .bcf-hero{ padding:52px 0 60px; }
  .bcf-categories,
  .bcf-products,
  .bcf-brands,
  .bcf-solutions{ padding:72px 0; }
  .bcf-experience{ padding:72px 0 80px; }
  .bcf-b2b{ padding:76px 0; }
}
@media (max-width:640px){
  .bcf-categories,
  .bcf-products,
  .bcf-brands,
  .bcf-experience{ padding:64px 0; }
  .bcf-hero__visual-note{ left:18px; right:18px; bottom:18px; }
  .bcf-hero__visual-tag{ font-size:10px; line-height:1.35; padding:8px 12px; }
}

@media (prefers-reduced-motion:reduce){
  .bcf-home *,
  .bcf-home *::before,
  .bcf-home *::after{
    scroll-behavior:auto !important;
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
  }
}

/* ── FOOTER BCF — HTML Block
   Tipografías: Montserrat (títulos) + Lato (texto), heredadas de WoodMart.
   Paleta: igual que bcf-home (variables definidas aquí por si el bloque
   se renderiza antes de que el CSS de la home esté en el DOM).
   Responsive: 4 col → 2 col (768px) → 1 col (480px).
   Prefijo .bcf-ft en todos los selectores para no colisionar con WoodMart.
   ──────────────────────────────────────────────────────────────────────── */

.bcf-ft *{ box-sizing:border-box; margin:0; padding:0; }
.bcf-ft a{ text-decoration:none; }
.bcf-ft img{ display:block; max-width:100%; }

.bcf-ft{
  --ft-teal-700:#285B61;
  --ft-teal-600:#3F868E;
  --ft-teal-500:#60A5AC;
  --ft-teal-050:#EAF3F3;
  --ft-ink-900:#0C1719;
  --ft-ink-800:#152426;
  --ft-ink-700:#22383B;
  --ft-text-muted:#4A6B70;
  --ft-text-dim:#638088;
  --ft-line:#1C3338;
  font-family:'Lato', Arial, Helvetica, sans-serif;
  background:var(--ft-ink-900);
  color:#fff;
  width:100%;
}

/* ── BANDA CTA SUPERIOR ─────────────────────────────────────────────── */
.bcf-ft__band{
  background:var(--ft-ink-800);
  border-bottom:1px solid var(--ft-line);
  padding:16px 40px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  flex-wrap:wrap;
}
.bcf-ft__band-text{
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:12px;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--ft-text-dim);
}
.bcf-ft__band-sep{
  color:var(--ft-line);
  font-size:18px;
  line-height:1;
}
.bcf-ft__band-btn{
  display:inline-flex;
  align-items:center;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  background:var(--ft-teal-700);
  color:#fff !important;
  padding:9px 20px;
  border-radius:4px;
  transition:background .2s;
}
.bcf-ft__band-btn:hover{ background:var(--ft-teal-600); }
.bcf-ft__band-link{
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--ft-teal-500) !important;
  transition:color .2s;
}
.bcf-ft__band-link:hover{ color:#fff !important; }

/* ── GRID PRINCIPAL ──────────────────────────────────────────────────── */
.bcf-ft__inner{
  max-width:1240px;
  margin:0 auto;
  padding:56px 40px 44px;
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1.1fr;
  gap:52px;
}

/* ── COLUMNA 1: IDENTIDAD ─────────────────────────────────────────────*/
.bcf-ft__logo{
  height:56px;
  width:auto;
  max-width:260px;
  margin-bottom:20px;
  filter:brightness(0) invert(1);
  opacity:.88;
}
.bcf-ft__desc{
  font-size:13.5px;
  line-height:1.78;
  color:var(--ft-text-dim);
  margin-bottom:20px;
  max-width:30ch;
}
.bcf-ft__addr{
  font-size:12.5px;
  line-height:1.9;
  color:var(--ft-text-muted);
  margin-bottom:18px;
}
.bcf-ft__contact{ display:flex; flex-direction:column; gap:6px; }
.bcf-ft__contact a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13.5px;
  color:var(--ft-text-dim);
  transition:color .2s;
}
.bcf-ft__contact a:hover{ color:var(--ft-teal-500); }
.bcf-ft__contact svg{
  width:14px; height:14px;
  stroke:var(--ft-teal-600);
  fill:none;
  stroke-width:2;
  flex-shrink:0;
}
.bcf-ft__social{
  display:flex;
  gap:10px;
  margin-top:22px;
}
.bcf-ft__social a{
  width:34px; height:34px;
  border-radius:50%;
  border:1px solid var(--ft-line);
  display:flex; align-items:center; justify-content:center;
  transition:background .2s, border-color .2s;
}
.bcf-ft__social a:hover{
  background:var(--ft-teal-700);
  border-color:var(--ft-teal-700);
}
.bcf-ft__social svg{
  width:15px; height:15px;
  fill:var(--ft-text-muted);
  stroke:none;
  color:var(--ft-text-muted);
  transition:fill .2s, color .2s;
}
.bcf-ft__social a:hover svg{ fill:#fff; color:#fff; }

/* ── COLUMNAS NAV ─────────────────────────────────────────────────────*/
.bcf-ft__col-title{
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ft-teal-600);
  margin-bottom:18px;
  padding-bottom:10px;
  border-bottom:1px solid var(--ft-line);
}
.bcf-ft__links{ display:flex; flex-direction:column; }
.bcf-ft__links a{
  font-size:13.5px;
  color:var(--ft-text-dim);
  line-height:2.3;
  transition:color .2s;
}
.bcf-ft__links a:hover{ color:#fff; }
.bcf-ft__links a.bcf-ft__accent{
  color:var(--ft-teal-500) !important;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  margin-top:6px;
  display:inline-flex;
  align-items:center;
  gap:4px;
}
.bcf-ft__links a.bcf-ft__accent:hover{ color:#fff !important; }

/* ── COLUMNA 4: ÁREA PROFESIONAL ──────────────────────────────────────*/
.bcf-ft__access-desc{
  font-size:13px;
  color:var(--ft-text-muted);
  line-height:1.7;
  margin-bottom:18px;
}
.bcf-ft__btn-primary{
  display:block;
  background:var(--ft-teal-700);
  color:#fff !important;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  text-align:center;
  padding:13px 16px;
  border-radius:5px;
  margin-bottom:10px;
  transition:background .2s;
}
.bcf-ft__btn-primary:hover{ background:var(--ft-teal-600); }
.bcf-ft__btn-outline{
  display:block;
  border:1px solid var(--ft-line);
  color:var(--ft-text-dim) !important;
  font-family:'Montserrat', Arial, Helvetica, sans-serif;
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  text-align:center;
  padding:12px 16px;
  border-radius:5px;
  transition:border-color .2s, color .2s;
}
.bcf-ft__btn-outline:hover{
  border-color:var(--ft-teal-600);
  color:var(--ft-teal-500) !important;
}
.bcf-ft__empresa{ margin-top:32px; }

/* ── BARRA INFERIOR ───────────────────────────────────────────────────*/
.bcf-ft__bottom{
  border-top:1px solid var(--ft-line);
  padding:18px 40px;
}
.bcf-ft__bottom-inner{
  max-width:1240px;
  margin:0 auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
}
.bcf-ft__copy{
  font-size:11.5px;
  color:var(--ft-text-muted);
}
.bcf-ft__legal{
  display:flex;
  gap:20px;
}
.bcf-ft__legal a{
  font-size:11.5px;
  color:var(--ft-text-muted);
  transition:color .2s;
}
.bcf-ft__legal a:hover{ color:var(--ft-teal-500); }

/* ── RESPONSIVE ───────────────────────────────────────────────────────*/
@media (max-width:1024px){
  .bcf-ft__inner{ gap:36px; padding:48px 28px 40px; }
  .bcf-ft__band{ padding:14px 28px; }
  .bcf-ft__bottom{ padding:16px 28px; }
}
@media (max-width:768px){
  .bcf-ft__inner{
    grid-template-columns:1fr 1fr;
    gap:36px 28px;
    padding:44px 24px 36px;
  }
  .bcf-ft__band{ flex-direction:column; gap:12px; text-align:center; }
  .bcf-ft__band-sep{ display:none; }
  .bcf-ft__band-btn{ width:100%; max-width:320px; justify-content:center; }
  .bcf-ft__bottom{ padding:14px 24px; }
  .bcf-ft__bottom-inner{ flex-direction:column; align-items:flex-start; gap:8px; }
}
@media (max-width:480px){
  .bcf-ft__inner{
    grid-template-columns:1fr;
    padding:36px 20px 28px;
  }
  .bcf-ft__desc{ max-width:none; }
  .bcf-ft__bottom{ padding:14px 20px; }
  .bcf-ft__legal{ flex-wrap:wrap; gap:12px 16px; }
  .bcf-ft__btn-primary,
  .bcf-ft__btn-outline{ font-size:13px; padding:14px 16px; }
}