/* ==========================================================================
   WIDGET: PROFIC MISIÓN (ESTADÍSTICAS Y CEO)
   ========================================================================== */

/* Neutralizar spacing de Elementor alrededor de Misión (Figma: secciones a tope). */
.elementor-widget-profic_mision,
.elementor-widget-profic_mision:not(:last-child),
.elementor-widget-profic_mision > .elementor-widget-container {
  margin: 0 !important;
  margin-block-end: 0 !important;
  padding: 0 !important;
}

/*
 * Contenedor Principal — Figma Design-Profic-Mike 2:223 / copia 1:798
 *
 * SOLO los 6 stats (números/SVG + labels, SIN rejilla/fondos):
 *   --profic-mision-stats-nudge  →  negativo = sube, positivo = baja
 *
 * Todo el widget (stats+Bruno+fondos):
 *   --profic-mision-nudge
 *
 * Otros: pad-top-base / pad-bottom / stats-ceo-gap
 */
.profic-mision-section {
  --profic-mision-nudge: 160px;
  --profic-mision-pad-top-base: 30px;
  --profic-mision-pad-bottom: 90px;
  --profic-mision-stats-ceo-gap: 40px;
  /* ← ESTE: solo el bloque de los 6 items */
  --profic-mision-stats-nudge: -20px;
  /* Padding efectivo — los fondos se anclan a ESTO (no sumar nudge otra vez en top) */
  --profic-mision-pad-top: calc(var(--profic-mision-pad-top-base) + var(--profic-mision-nudge));
  /* Fallback pre-GSAP; en runtime GSAP usa xPercent + y en transform */
  --mision-float-y: 0px;

  position: relative;
  width: 100%;
  padding: var(--profic-mision-pad-top) 0 var(--profic-mision-pad-bottom);
  background-color: transparent;
  overflow: visible;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 1;
}

/* ==========================================================================
   CAPAS DE FONDO DECORATIVO (Estructura de capas idéntica a Figma)
   ========================================================================== */

/* CAPA 1: Linea de Fondo */
.profic-mision-bg-curve {
  position: absolute;
  left: 50%;
  transform: translate3d(-50%, var(--mision-float-y, 0px), 0);
  z-index: 0;
  pointer-events: none;
}

.profic-mision-bg-curve-inset {
  position: absolute;
  width: 100%;
  height: 100%;
}

.profic-mision-bg-curve svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* CAPA 2: Cuadrados de Fondo */
.profic-mision-bg-squares-layer {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  pointer-events: none;
}

.profic-mision-bg-squares {
  position: absolute;
  left: 50%;
  /* Centrado pre-GSAP; GSAP sobrescribe con xPercent:-50 + y */
  transform: translate3d(-50%, var(--mision-float-y, 0px), 0);
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
}

.profic-mision-square {
  position: relative;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
}

.profic-mision-square-inner {
  width: 100%;
  height: 100%;
  opacity: 0.65;
  box-sizing: border-box;
  background-size: cover;
  background-repeat: no-repeat;
}

.profic-mision-square-spacer {
  display: block;
}

/* Mobile grid específico para cuadrados */
.profic-mision-mobile-bg-grid {
  display: grid;
  grid-template-columns: repeat(2, 187px);
  grid-template-rows: repeat(3, 187px);
}

.profic-mision-square-mob {
  position: relative;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 187px;
  height: 187px;
}

.profic-mision-square-mob.col-1 { grid-column-start: 1; }
.profic-mision-square-mob.col-2 { grid-column-start: 2; }
.profic-mision-square-mob.row-1 { grid-row-start: 1; }
.profic-mision-square-mob.row-2 { grid-row-start: 2; }
.profic-mision-square-mob.row-3 { grid-row-start: 3; }

.profic-mision-square-mob .profic-mision-square-inner {
  width: 187px;
  height: 187px;
  transform: rotate(-90deg);
}

/* CAPA 3: Lineas y Difuminado — Figma SVG 820×… (isolated bounds)
 * Desktop 820×557 · Tablet 820×506 · Mobile 820×545.245
 * Centrado: left 50% + offset Figma + translateX(-50%) vía --mision-float-y
 */
.profic-mision-grid-lines {
  position: absolute;
  left: 50%;
  transform: translate3d(-50%, var(--mision-float-y, 0px), 0);
  z-index: 2;
  pointer-events: none;
  box-sizing: border-box;
  overflow: visible;
}

.profic-mision-grid-lines-inset {
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
}

.profic-mision-grid-lines svg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

/*
 * Toggle show-* por breakpoint (más específico que el <style> inline del widget,
 * que usa display:flex y antes forzábamos block en las 3 a la vez → se superponían).
 */
.profic-mision-section .profic-mision-grid-lines.show-desktop,
.profic-mision-section .profic-mision-grid-lines.show-tablet,
.profic-mision-section .profic-mision-grid-lines.show-mobile {
  display: none !important;
}

@media (min-width: 1280px) {
  .profic-mision-section .profic-mision-grid-lines.show-desktop {
    display: block !important;
  }
}

@media (min-width: 800px) and (max-width: 1279px) {
  .profic-mision-section .profic-mision-grid-lines.show-tablet {
    display: block !important;
  }
}

@media (max-width: 799px) {
  .profic-mision-section .profic-mision-grid-lines.show-mobile {
    display: block !important;
  }
}


/* ==========================================================================
   CAPA 4: Contenido Principal (Estadísticas y CEO)
   ========================================================================== */

.profic-mision-container {
  position: relative;
  z-index: 3;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--profic-mision-stats-ceo-gap); /* Figma: stats → Bruno = 40 */
  box-sizing: border-box;
}

/* Grilla de Estadísticas — solo los 6 items (sin rejilla decorativa) */
.profic-mision-stats-grid {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  box-sizing: border-box;
  /* nudge via margin so GSAP can own transform for appear (y: 150 → 0) */
  margin: var(--profic-mision-stats-nudge) 0 0;
}

/* Appear block 1: fondos se mueven con Propiedades (GSAP y) */
.profic-mision-bg-curve,
.profic-mision-bg-squares,
.profic-mision-grid-lines,
.profic-mision-stats-grid,
.profic-ceo-card {
  will-change: transform;
}

/*
 * Celdas — Figma 1:822 / 2:223 Propiedades Empresa
 * Cada celda 200px: pad-top 10.5 + zona media 100 + label 79 → labels alineados.
 * NO usar justify-content:center (iconos de distinta altura desalineaban los textos).
 */
.profic-stat-cell {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding-top: 10.5px;
  box-sizing: border-box;
  text-align: center;
  transition: transform 0.3s ease, filter 0.3s ease;
}

.profic-stat-cell:hover {
  transform: translateY(-5px);
  filter: drop-shadow(0 10px 15px rgba(114, 53, 235, 0.15));
}

/* Zona fija superior (número O icono) — misma altura en todas las celdas */
.profic-stat-number-container,
.profic-stat-icon-wrapper {
  position: relative;
  width: 100%;
  height: 100px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

/* Celdas con Estadísticas de Texto Gigante (+500, +18, +20)
   Figma: Extra Light 64 → Amsi Pro 200 (AmsiPro-XLight) */
.profic-stat-number {
  font-family: 'Amsi Pro', sans-serif;
  font-weight: 200;
  /* Desktop Figma 38:990 — Extra Light 64 / LH 76.8 */
  font-size: 64px;
  line-height: 76.8px;
  margin: 0;
  padding: 0;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  box-sizing: border-box;
}

.profic-stat-number p {
  margin: 0;
  padding: 0;
  line-height: inherit;
  font: inherit;
  color: inherit;
  background: inherit;
  -webkit-background-clip: inherit;
  background-clip: inherit;
}

/* Gradientes específicos para los números */
.profic-stat-cell-1 .profic-stat-number {
  background-image: linear-gradient(to bottom, #4700d6, #7235eb);
}

.profic-stat-cell-3 .profic-stat-number {
  background-image: linear-gradient(199.465deg, rgb(71, 0, 214) 27.401%, rgb(114, 53, 235) 73.801%);
}

.profic-stat-cell-5 .profic-stat-number {
  background-image: linear-gradient(to top, #4700d6, #7235eb);
}

/* Etiquetas — Frame 48 Figma: 79px, texto centrado vertical → misma baseline en la fila */
.profic-stat-label-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 79px;
  flex-shrink: 0;
  box-sizing: border-box;
}

.profic-stat-label {
  font-family: 'Amsi Pro', sans-serif;
  font-weight: 400; /* Regular */
  font-size: 16px;
  color: #ffffff;
  line-height: 1;
  margin: 0;
  white-space: nowrap;
}

.profic-stat-icon-wrapper svg {
  width: 100%;
  height: 100%;
  display: block;
}


/* ==========================================================================
   SECCIÓN: TARJETA DEL CEO (BRUNO)
   ========================================================================== */

.profic-ceo-card {
  position: relative;
  display: flex;
  box-sizing: border-box;
  z-index: 2;
  align-items: center;
  justify-content: center;
  width: 100%;
}

/* Bloque de Foto y Nombre */
.profic-ceo-photo-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  box-sizing: border-box;
}

.profic-ceo-avatar-container {
  position: relative;
  box-sizing: border-box;
}

.profic-ceo-photo-container {
  position: relative;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 50%;
}

.profic-ceo-photo-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Marco Decorativo SVG */
.profic-ceo-frame-svg {
  position: absolute;
  box-sizing: border-box;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 95%; /* Proporción exacta de Figma: 152px SVG / 160px Círculo = 95% */
  aspect-ratio: 152 / 56;
  pointer-events: none;
}

.profic-ceo-frame-svg svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* Textos: Nombre y Cargo */
.profic-ceo-meta {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 6px;
  box-sizing: border-box;
}

/* Figma 1:863 — AmsiPro-Black 20 / leading-none / nowrap
   (h3 + sección: gana a tipografías globales del Site Kit / Elementor) */
.profic-mision-section h3.profic-ceo-name,
.profic-ceo-name {
  font-family: 'Amsi Pro', sans-serif;
  font-weight: 900; /* amsi-pro.css → AmsiPro-Black */
  font-size: 20px;
  font-style: normal;
  color: #ffffff;
  margin: 0;
  padding: 0;
  line-height: 1;
  letter-spacing: 0;
  white-space: nowrap;
}

/* Figma 1:864 — AmsiPro-Light 16 / tracking 1.12 / opacity 65% */
.profic-mision-section .profic-ceo-role,
.profic-ceo-role {
  font-family: 'Amsi Pro', sans-serif;
  font-weight: 300; /* amsi-pro.css → AmsiPro-Light */
  font-size: 16px;
  font-style: normal;
  color: #ffffff;
  opacity: 0.65;
  letter-spacing: 1.12px;
  margin: 0;
  padding: 0;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

/* Bloque de Descripción y LinkedIn */
.profic-ceo-info {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.profic-ceo-bio {
  font-family: 'Amsi Pro', sans-serif;
  font-weight: 300; /* Light */
  color: #ffffff;
  margin: 0;
  box-sizing: border-box;
}

/* Botón de LinkedIn */
.profic-ceo-linkedin {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  cursor: pointer;
}

.profic-ceo-linkedin svg {
  width: 20px;
  height: 20px;
  display: block;
}

.profic-ceo-linkedin svg path {
  fill: #ffffff;
  transition: fill 0.3s ease;
}

.profic-ceo-linkedin:hover {
  transform: scale(1.15) rotate(5deg);
}

.profic-ceo-linkedin:hover svg path {
  fill: #0077b5; /* Color azul oficial de LinkedIn */
}


/* ==========================================================================
   BREAKPOINTS RESPONSIVOS (Coordenadas y dimensiones exactas de Figma)
   ========================================================================== */

/* 1. MODO DESKTOP (ancho >= 1280px) — Figma cells 190×200, gap 70, Bruno gap 40 */
@media (min-width: 1280px) {
  .profic-mision-section {
    /* Figma 38:990 paddingTop 180 (+ nudge aparte si hace falta) */
    --profic-mision-pad-top-base: 170px;
    --profic-mision-pad-bottom: 90px;
  }

  /* CAPA 1: Linea de Fondo — Figma y=527.5, padTop=180 → +347.5 */
  .profic-mision-bg-curve {
    width: 2077.84px;
    height: 789.22px;
    left: 50%;
    margin-left: -100px;
    top: calc(var(--profic-mision-pad-top) + 347.5px);
  }

  .profic-mision-bg-curve-inset {
    /* El contenedor ya usa el viewBox 2077×789; el -16.75% de Figma era para el frame 591px */
    inset: 0;
  }

  /* CAPA 2: Cuadrados — Figma y=155, padTop=180 → -25 */
  .profic-mision-bg-squares {
    width: 1280px;
    height: 524px;
    top: calc(var(--profic-mision-pad-top) - 25px);
    padding: 0 250px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    align-content: flex-start;
  }

  .profic-mision-square {
    width: 260px;
    height: 260px;
  }

  .profic-mision-square-inner {
    width: 100%;
    height: 100%;
  }

  .profic-mision-square-3 {
    height: 264px;
  }

  .profic-mision-square-3 .profic-mision-square-inner {
    width: 264px;
    height: 260px;
    transform: rotate(90deg);
  }

  /* CAPA 3: Lineas Desktop — Figma 2216:2208
   * layout y=95 · isolated 820×557 · offset x +2 vs centro artboard */
  .profic-mision-grid-lines {
    width: 820px;
    height: 557px;
    top: calc(var(--profic-mision-pad-top) - 84px); /* 95 - padTop 180 */
    left: calc(50% + 2px);
  }

  .profic-mision-grid-lines-inset {
    inset: 0;
  }

  /* CAPA 4: Contenido — Figma Propiedades Empresa: celdas h 200, gap 70 */
  .profic-mision-stats-grid {
    width: 100%;
    max-width: 800px;
    padding: 0;
    gap: 70px;
    margin: 0;
  }

  .profic-stat-cell {
    height: 200px;
  }

  .profic-stat-cell-1, .profic-stat-cell-2 { width: 190px; }
  .profic-stat-cell-3, .profic-stat-cell-4 { width: 188px; }
  .profic-stat-cell-5, .profic-stat-cell-6 { width: 187px; }

  /* Iconos centrados dentro de la zona fija de 100px (Figma Icon frame) */
  .cap-wrapper-latam-dt { width: 48px; height: 104px; flex-shrink: 0; }
  .cap-wrapper-dd-dt { width: 100px; height: 100px; flex-shrink: 0; }
  .cap-wrapper-ai-dt { width: 127.31px; height: 47.19px; flex-shrink: 0; }

  .profic-ceo-card {
    width: 100%;
    max-width: 1280px;
    flex-direction: row;
    align-items: center;
    gap: 120px;
    padding: 50px 195px;
    margin: 0;
  }

  /* Figma 1:857 — Foto y Nombre: gap 24, px 21; avatar 160 (no width fija en el wrap) */
  .profic-ceo-photo-wrapper {
    gap: 24px;
    width: auto;
    max-width: none;
    flex-shrink: 0;
    padding: 0 21px;
  }

  .profic-ceo-avatar-container {
    width: 160px;
    height: 160px;
  }

  .profic-ceo-name {
    font-size: 20px;
    font-weight: 900;
  }

  .profic-ceo-role {
    font-size: 16px;
    font-weight: 300;
  }

  .profic-ceo-info {
    flex: 1;
    align-items: flex-start;
    gap: 31px;
    padding-top: 29px;
    padding-right: 30px;
  }

  /* Desktop Figma 2034:6523 — 18 / 26.64 */
  .profic-ceo-bio {
    font-size: 18px;
    line-height: 26.64px;
    text-align: left;
    letter-spacing: 0;
  }

  .profic-ceo-linkedin {
    align-self: flex-start;
  }
}

/* 2. MODO TABLET (800px <= ancho < 1280px) */
@media (min-width: 800px) and (max-width: 1279px) {
  .profic-mision-section {
    --profic-mision-pad-top-base: 205px;
    --profic-mision-pad-bottom: 90px;
  }

  /* CAPA 1: Linea — Figma y=559.5, padTop=205 → +354.5 */
  .profic-mision-bg-curve {
    width: 2077.84px;
    height: 789.22px;
    left: 50%;
    margin-left: -100px;
    top: calc(var(--profic-mision-pad-top) + 354.5px);
  }

  .profic-mision-bg-curve-inset {
    inset: -16.75% -1.16%;
  }

  /* CAPA 2: Cuadrados — Figma y=165, padTop=205 → -40 */
  .profic-mision-bg-squares {
    width: 800px;
    height: 711px;
    top: calc(var(--profic-mision-pad-top) - 40px);
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    align-content: flex-start;
    padding: 0 10px;
  }

  .profic-mision-square {
    width: 260px;
    height: 260px;
  }

  .profic-mision-square-inner {
    width: 100%;
    height: 100%;
  }

  .profic-mision-square-3 {
    height: 264px;
  }

  .profic-mision-square-3 .profic-mision-square-inner {
    width: 264px;
    height: 260px;
    transform: rotate(90deg);
  }

  /* CAPA 3: Lineas Tablet — Figma 2216:2213
   * layout y=166 · isolated 820×506 · offset x +1 vs centro */
  .profic-mision-grid-lines {
    width: 820px;
    height: 506px;
    top: calc(var(--profic-mision-pad-top) - 37px); /* 166 - padTop 205 */
    left: calc(50% + 1px);
  }

  .profic-mision-grid-lines-inset {
    inset: 0;
  }

  /* CAPA 4: Contenido Grilla */
  .profic-mision-stats-grid {
    width: 100%;
    max-width: 800px;
    gap: 41px 100px;
    margin: 0;
  }

  .profic-stat-cell {
    height: 200px;
  }

  .profic-stat-cell-1, .profic-stat-cell-2, .profic-stat-cell-4, .profic-stat-cell-6 { width: 155px; }
  .profic-stat-cell-3, .profic-stat-cell-5 { width: 154px; }

  /* Tablet Figma 1:1204 — números 64/1.2 · labels 16 */
  .profic-stat-number {
    font-size: 64px;
    line-height: 1.2;
  }

  .profic-stat-label {
    font-size: 16px;
  }

  /* Dimensiones de Iconos en Tablet según Figma (Pixel-Perfect) */
  .cap-wrapper-latam-tb { width: 45px; height: 99.045px; flex-shrink: 0; }
  .cap-wrapper-dd-tb { width: 75px; height: 75px; flex-shrink: 0; }
  .cap-wrapper-ai-tb { width: 95.482px; height: 35.392px; flex-shrink: 0; }

  /* CEO Card — Figma Bruno 38:1062: gap 59, pad 50 / 40 */
  .profic-ceo-card {
    width: 100%;
    max-width: 800px;
    flex-direction: row;
    align-items: center;
    gap: 59px;
    padding: 50px 40px;
  }

  .profic-ceo-photo-wrapper {
    gap: 24px;
    width: auto;
    flex-shrink: 0;
    padding: 0 21px;
  }

  .profic-ceo-avatar-container {
    width: 160px;
    height: 160px;
  }

  .profic-ceo-name {
    font-size: 20px;
    font-weight: 900;
  }

  .profic-ceo-role {
    font-size: 16px;
    font-weight: 300;
  }

  .profic-ceo-info {
    flex: 1;
    align-items: flex-start;
    gap: 31px;
    padding-top: 29px;
    padding-right: 30px;
  }

  .profic-ceo-bio {
    font-size: 20px;
    line-height: 1.5;
    text-align: left;
    letter-spacing: 0.2px;
  }

  .profic-ceo-linkedin {
    align-self: flex-start;
  }
}

/* 3. MODO MÓVIL (ancho < 800px) — Figma Misión 38:994 */
@media (max-width: 799px) {
  .profic-mision-section {
    --profic-mision-pad-top-base: 0px;
    --profic-mision-pad-bottom: 90px;
    /* Figma itemSpacing -1 entre Propiedades y Bruno */
    --profic-mision-stats-ceo-gap: -1px;
    --profic-mision-stats-nudge: 0px;
  }

  /* CAPA 1: Linea — Figma y=534.35, padTop=0 */
  .profic-mision-bg-curve {
    width: 1689.07px;
    height: 676.042px;
    left: 50%;
    margin-left: 0;
    top: calc(var(--profic-mision-pad-top) + 534.35px);
    opacity: 1;
    visibility: visible;
  }

  .profic-mision-bg-curve-inset {
    inset: -20.71% -1.43%;
  }

  /* CAPA 2: Cuadrados — Figma y≈0, h=1143 (Frame 86 + rects) */
  .profic-mision-bg-squares {
    width: 375px;
    height: 1143px;
    top: calc(var(--profic-mision-pad-top) + 0px);
    left: 50%;
    margin-left: 0;
    overflow: visible;
    display: block;
    opacity: 1;
    visibility: visible;
  }

  .profic-mision-square-spacer {
    display: none;
  }

  .profic-mision-mobile-bg-grid {
    width: 374px;
    margin: 0 auto;
  }

  /* CAPA 3: Lineas Mobile — Figma 2216:2217
   * layout y=95 pero isolated top ≈ 26.76 (SVG sobresale arriba)
   * isolated 820×545.245 · offset x +2.5 vs centro */
  .profic-mision-grid-lines {
    width: 820px;
    height: 545.245px;
    top: calc(var(--profic-mision-pad-top) + 28.755px);
    left: calc(50% + 2.5px);
    margin-left: 0;
    opacity: 1;
    visibility: visible;
  }

  .profic-mision-grid-lines-inset {
    inset: 0;
  }

  /* CAPA 4: Contenido Grilla (Reordenamiento) */
  .profic-mision-stats-grid {
    width: 375px;
    gap: 0;
    margin-bottom: 0;
  }

  .profic-stat-cell {
    width: 187px;
    height: 187px;
    /* Figma mobile: número/icono ~y 48.5, label Frame 48 y=108.5 h=30 */
    padding-top: 48.5px;
  }

  /* Reordenamiento exacto de Figma */
  .profic-stat-cell-1 { order: 1; }
  .profic-stat-cell-4 { order: 2; }
  .profic-stat-cell-2 { order: 3; }
  .profic-stat-cell-3 { order: 4; }
  .profic-stat-cell-5 { order: 5; }
  .profic-stat-cell-6 { order: 6; }

  .profic-stat-number-container,
  .profic-stat-icon-wrapper {
    height: 60px;
  }

  /* Mobile Figma — números 44/52.8 · labels 12 */
  .profic-stat-number {
    font-size: 44px;
    line-height: 52.8px;
  }

  .profic-stat-label-container {
    height: 30px;
    width: 106px;
    padding-top: 0;
  }

  .profic-stat-label {
    font-size: 12px;
  }

  /* Dimensiones de Iconos en Mobile según Figma (Pixel-Perfect) */
  .cap-wrapper-latam-mb { width: 28px; height: 60px; }
  .cap-wrapper-dd-mb { width: 62px; height: 61.101px; }
  .cap-wrapper-ai-mb { width: 88px; height: 33px; }

  /* CEO Card — Figma Bruno 38:1065 */
  .profic-ceo-card {
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: 0;
    padding: 50px 48px;
  }

  .profic-ceo-photo-wrapper {
    gap: 24px;
    width: 100%;
  }

  .profic-ceo-avatar-container {
    width: 133px;
    height: 134.24px;
  }

  .profic-ceo-name {
    font-size: 24px;
  }

  .profic-ceo-role {
    font-size: 16px;
  }

  .profic-ceo-info {
    width: 100%;
    max-width: 279px;
    align-items: center;
    gap: 31px;
    padding-top: 48px;
  }

  .profic-ceo-bio {
    font-size: 15px;
    line-height: 21px;
    text-align: center;
    letter-spacing: 0;
  }

  .profic-ceo-linkedin {
    align-self: center;
  }
}

/* Teléfonos anchos — Figma 1:1543 es 375×187; estirar a 1fr sin altura
 * colapsaba la rejilla y desalineaba cuadrados vs stats (iPhone 16 Pro Max).
 * Misma grilla 2×3, celdas cuadradas, fondos con el aspect-ratio del artboard. */
@media (max-width: 479px) {
  .profic-mision-section {
    overflow-x: clip;
  }

  .profic-mision-bg-squares.show-mobile {
    width: 100%;
    height: auto;
    aspect-ratio: 375 / 1143;
    align-items: flex-start;
  }

  .profic-mision-mobile-bg-grid {
    width: 100%;
    height: auto;
    aspect-ratio: 375 / 561;
    flex: 0 0 auto;
    margin: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(3, minmax(0, 1fr));
  }

  .profic-mision-square-mob,
  .profic-mision-square-mob .profic-mision-square-inner {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
  }

  /*
   * Grid-lines: en ≤479 las celdas dejan de ser 187px fijas y escalan (1:1).
   * Las líneas viven en artboard 375 — escalar width/height/top/left con el mismo factor
   * (si no, el cruce queda “corrido arriba” respecto a stats/fondos).
   */
  .profic-mision-grid-lines {
    width: calc(820 / 375 * 100%);
    height: auto;
    aspect-ratio: 820 / 545.245;
    /* top % = altura del padre — usar vw (mismo eje que el ancho de celda) */
    top: calc(var(--profic-mision-pad-top) + (28.755 / 375 * 100vw));
    left: calc(50% + (2.5 / 375 * 100%));
  }

  .profic-mision-stats-grid {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-content: stretch;
  }

  .profic-stat-cell {
    width: auto;
    max-width: none;
    height: auto;
    aspect-ratio: 1 / 1;
    min-width: 0;
  }
}