@charset "utf-8";
/* ============================================================
   Lacados ATP — styles.css (clean)
   Estructura pensada para: index.html, atp-lacados.html,
   instalaciones-servicios.html y contacto.html.
   ============================================================ */

/* =========================
   Variables
   ========================= */
:root{
  --color-black:#000;
  --color-text:#111;
  --color-muted:#555;
  --color-border:#e4e4e4;
  --color-bg-soft:#f4f4f4;
  --color-primary:#0659a8;
  --color-secundary:#f9bc01;

  --radius-sm:4px;
  --radius-md:10px;

  --container:1200px;
  --pad-x:40px;

  --shadow-soft:0 10px 30px rgba(0,0,0,.08);
  --bp-md:900px;
}

/* =========================
   Reset / base
   ========================= */
*,
*::before,
*::after{ box-sizing:border-box; }

body{
  margin:0;
  font-family:"Lato",sans-serif;
  color:var(--color-text);
}

img{ max-width:100%; height:auto; }

p{
  font-size:16px;
  line-height:1.6;
  margin:0 0 16px 0;
}

/* =========================
   Layout
   ========================= */
.container{
  max-width:var(--container);
  width:100%;
  margin:0 auto;
  padding:0 var(--pad-x);
}

/* Utilities */
.bg_blanco{ background:#fff !important; }
.border-bottom{ border-bottom:1px solid rgba(0,0,0,.3); }

/* Responsive container padding */
@media (max-width: 600px){
  :root{ --pad-x:20px; }
}

/* =========================
   Typography helpers
   ========================= */
.main-title{
  text-align:center;
  margin:0 0 40px 0;
  font-size:32px;
  line-height:1.15;
}

/* Mantengo la clase con el typo por compatibilidad */
.main-title-borderbotom,
.main-title-borderbottom{
  display:inline-block;
  font-size:32px;
  line-height:1.15;
  padding-bottom:6px;
  border-bottom:4px solid var(--color-primary);
  text-align:center;
}

.title-tag{
  display:inline-block;
  font-size:12px;
  letter-spacing:1px;
  color:var(--color-primary);
  font-weight:700;
  margin-bottom:10px;
}

/* =========================
   Buttons (enlaces + botones)
   ========================= */
a.boton-azul,
button.boton-azul,
a.boton-negro{
  display:inline-block;
  margin-top:20px;
  padding:10px 24px;
  border-radius:20px;
  text-decoration:none;
  font-size:13px;
  border:0;
  cursor:pointer;
}

a.boton-azul,
button.boton-azul{
  background:var(--color-primary);
  color:#fff;
}

a.boton-negro{
  background:var(--color-black);
  color:#fff;
}

/* =========================
   HEADER (desktop + mobile)
   ========================= */
header{ background:#fff; }

.header-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 10px;
}

.logo img{
  height:60px;
  width:auto;
  display:block;
}

/* NAV desktop */
.nav-desktop a{
  margin-left:20px;
  text-decoration:none;
  color:var(--color-black);
  font-size:14px;
  position:relative;
}

.nav-desktop a:not(.lang-switch)::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-2px;
  width:0;
  height:2px;
  background:var(--color-black);
  transition:width .2s ease;
}

.nav-desktop a:not(.lang-switch):hover::after{ width:100%; }

/* Separador antes del idioma */
.nav-desktop .lang-switch{
  margin-left:30px;
  padding-left:20px;
  position:relative;
  font-weight:600;
}

.nav-desktop .lang-switch::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
  width:3px;
  height:18px;
  background:#f9bc01;
}

/* Estado activo */
.nav-desktop a.is-active{
  font-weight:700;
}
.nav-desktop a.is-active::after{
  width:100%;
}

/* No subrayado hover para idioma (como ya querías) */
.nav-desktop a:not(.lang-switch)::after{ /* tu underline */ }
.nav-desktop a:not(.lang-switch):hover::after{ width:100%; }

/* Activo en móvil */
.nav-mobile a.is-active{
  font-weight:700;
}






/* Botón hamburguesa */
.menu-toggle{
  display:none;
  background:none;
  border:0;
  font-size:38px;
  cursor:pointer;
  line-height:1;
  color:#000 !important;
}

/* NAV móvil overlay (ocultos en desktop) */
.nav-mobile,
.nav-backdrop{ display:none; }

@media (max-width: 900px){
  .nav-desktop{ display:none; }
  .menu-toggle{ display:block; }

  .nav-mobile{
    display:block;
    position:fixed;
    top:0;
    right:-320px;
    width:320px;
    height:100vh;
    background:#fff;
    padding:28px 22px;
    box-shadow:-10px 0 30px rgba(0,0,0,.15);
    transition:right .25s ease;
    z-index:1001;
    overflow-y:auto;
  }

  .nav-mobile a{
    display:block;
    padding:14px 6px;
    font-size:18px;
    text-decoration:none;
    color:var(--color-text);
    letter-spacing:.5px;
  }

  .menu-close{

    background:none;
    border:0;
    font-size:26px;
    cursor:pointer;
    margin-left:auto;
    display:block;
    margin-bottom:10px;
  }

  .nav-backdrop{
    display:block;
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.35);
    opacity:0;
    pointer-events:none;
    transition:opacity .25s ease;
    z-index:1000;
  }

  .nav-open .nav-mobile{ right:0; }
  .nav-open .nav-backdrop{
    opacity:1;
    pointer-events:auto;
  }
  
  /* Separador antes del idioma */
  .nav-mobile .lang-switch{
    margin-top:20px;
    padding-top:20px;
    border-top:1px solid #ddd;
    font-weight:600;
  }
  
  
}

/* =========================
   Breadcrumb bar
   ========================= */
.breadcrumb-bar{
  background:var(--color-bg-soft);
  border-bottom:1px solid var(--color-border);
  padding:20px 0;
}

.breadcrumb{
  height:48px;
  display:flex;
  align-items:center;
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#666;
}

.breadcrumb a{
  color:inherit;
  text-decoration:none;
}

.breadcrumb a:hover{ text-decoration:underline; }

.breadcrumb .sep{
  margin:0 6px;
  opacity:.6;
}

.breadcrumb span[aria-current="page"]{
  color:var(--color-text);
  font-weight:500;
}

/* =========================
   HERO
   ========================= */
.hero{
  background-image:url("../img/hero.jpg");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  padding:140px 0;
  position:relative;
}

.hero h1{
  font-size:48px;
  max-width:600px;
  margin:0 0 12px 0;
}

/* responsive: separadores pasan a horizontal */
@media (max-width: 600px){
  .hero h1{ font-size:35px; }
}

.hero .title-tag{
  font-size:14px;
  letter-spacing:1px;
  color:var(--color-black);
  font-weight:700;
  margin-bottom:0;
}



/* =========================
   INTRO
   ========================= */
.intro{
  text-align:center;
  padding:80px 20px 10px;
  font-weight:700;
}

.intro h2{ font-size:30px; }



/* =========================
   SERVICIOS
   ========================= */
.servicios{
  padding:45px 0 80px;
  background:var(--color-bg-soft);
  border-bottom:1px solid var(--color-border);
}

.servicios-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:5px;
}

.servicio{ 
	padding:0px 25px;
	text-align:center; 

}
.servicio:not(:last-child){
    border-right:3px solid var(--color-secundary);
  }

.servicio h3{
  font-size:18px;
  letter-spacing:1px;
  margin:0 0 20px 0;
  text-transform:uppercase;
}

.servicio a{
  display:inline-block;
  margin-top:15px;
  padding:8px 22px;
  background:var(--color-black);
  color:#fff;
  text-decoration:none;
  border-radius:20px;
  font-size:13px;
}

@media (max-width: 900px){
  .servicios-grid{
    grid-template-columns:1fr;
    gap:30px;
  }
  .servicio{ padding:10px 10px 30px 10px; }
  
  .servicio:not(:last-child){
    border-bottom:1px solid rgba(209,209,209,1.00);
	border-right:none;
  }
  .servicios{
	  padding-bottom:10px;
  }
  
}

/* =========================
   FALDÓN AZUL (genérico)
   ========================= */
.faldon-azul{
  padding:50px 0 50px;
  background-color:var(--color-primary);
  color:#fff;
}

.faldon-azul h2{ color:#fff; }

.faldon-azul-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:0; /* quitamos gap para usar separadores */
}

.faldon-azul-contenido{
  text-align:center;
  padding:28px 34px;
  position:relative;
}

/* separadores verticales */
.faldon-azul-contenido:not(:last-child)::after{
  content:"";
  position:absolute;
  top:12px;
  right:0;
  width:1px;
  height:calc(100% - 24px);
  background:rgba(255,255,255,.45);
}


.faldon-azul-contenido h3{
  font-size:18px;
  letter-spacing:1px;
  margin:0 0 20px 0;
  text-transform:uppercase;
  color:#fff;
}

.faldon-azul-contenido p{ color:#fff; }

.faldon-azul-contenido a{
  display:inline-block;
  margin-top:25px;
  padding:8px 22px;
  background:var(--color-black);
  color:#fff;
  text-decoration:none;
  border-radius:20px;
  font-size:13px;
}



@media (max-width: 900px){

  .faldon-azul-grid{
    grid-template-columns:1fr;
    gap:30px;
  }
  .faldon-azul-contenido{ padding:10px; }

  /* quitamos separador vertical */
  .faldon-azul-contenido::after{
    display:none;
  }

  /* separador horizontal */
  .faldon-azul-contenido:not(:last-child){
    border-bottom:1px solid rgba(255,255,255,.45);
  }
}


/* =========================
   FALDÓN AZUL — variante CONTACTO
   ========================= */
.faldon-azul--contacto{
  padding:60px 0 70px;
}

/* grid sin gap para separadores */
.faldon-azul--contacto .faldon-azul-grid{ gap:0; }

/* cada columna */
.faldon-azul--contacto .faldon-azul-col{
  padding:28px 34px;
  position:relative;
  text-align:left;
}

/* separadores verticales */
.faldon-azul--contacto .faldon-azul-col:not(:last-child)::after{
  content:"";
  position:absolute;
  top:12px;
  right:0;
  width:1px;
  height:calc(100% - 24px);
  background:rgba(255,255,255,.45);
}


@media (max-width: 900px){

  /* quitamos separador vertical */
  .faldon-azul--contacto::after{
    display:none;
  }

  /* separador horizontal */
  .faldon-azul--contacto:not(:last-child){
    border-bottom:1px solid rgba(255,255,255,.45);
  }
}


/* cabecera: título + icono derecha */
.faldon-azul--contacto .faldon-azul-col-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:16px;
}

.faldon-azul--contacto .faldon-azul-col h3{
  margin:0;
  font-size:18px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#fff;
}

/* icono (Font Awesome) */
.faldon-azul--contacto .faldon-azul-col .fa{
  font-size:22px;
  line-height:1;
  opacity:.95;
}

/* texto */
.faldon-azul--contacto .faldon-azul-texto{
  margin:0;
  font-size:18px;
  line-height:1.7;
  color:rgba(255,255,255,.95);
}

.faldon-azul--contacto .faldon-azul-texto strong{
  font-weight:700;
  color:#fff;
}

/* links mail/tel limpios */
.faldon-azul--contacto .faldon-azul-link{
  color:#fff;
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.35);
}

.faldon-azul--contacto .faldon-azul-link:hover{
  border-bottom-color:rgba(255,255,255,.9);
}

/* rrss simple */
.faldon-azul--contacto .faldon-azul-rrss{
  display:flex;
  gap:14px;
  margin-top:18px;
}

.faldon-azul--contacto .faldon-azul-rrss a{
  color:#fff;
  text-decoration:none;
  opacity:.9;
}

.faldon-azul--contacto .faldon-azul-rrss a:hover{ opacity:1; }

/* responsive: separadores pasan a horizontal */
@media (max-width: 900px){
  .faldon-azul--contacto .faldon-azul-grid{ grid-template-columns:1fr; }

  .faldon-azul--contacto .faldon-azul-col{ padding:24px 18px; }

  .faldon-azul--contacto .faldon-azul-col:not(:last-child)::after{
    top:auto;
    right:auto;
    left:18px;
    bottom:0;
    width:calc(100% - 36px);
    height:1px;
  }
}

/* =========================
   HISTORIA (home)
   ========================= */
.historia{
  display:grid;
  background:#f2f2f2;
  grid-template-columns:1fr 1fr;
}

.historia-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.historia-texto{
  display:flex;
  align-items:center;
}

.historia-contenido{
  max-width:600px;
  padding:60px;
}

.historia-claim, .historia-claim-fr{
  margin-top: 80px;
  padding-left: 18px;
  max-width: 90%;
  border-left: 3px solid var(--color-primary);

  /* Tipografía del bloque */
  font-size: 1.15rem;
  line-height: 1.55;
  font-weight: 600;
  letter-spacing: -0.2px;

  /* Color (por si el tema lo hereda raro) */
  color: #0f172a;
}

.historia-claim::before{
  content: "Compromiso";
  display: block;
  margin-bottom: 8px;

  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-primary);
}
.historia-claim.fr::before{
  content: "ENGAGEMENT";
  display: block;
  margin-bottom: 8px;

  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-primary);
}

/* Importante: quitar margen por defecto del <p> */
.historia-claim p, .historia-claim-fr p{
  margin: 0;
  font-size: 20px;
}


@media (max-width: 900px){
  .historia{ grid-template-columns:1fr; }
  .historia-img{ order:1; }
  .historia-texto{ order:2; }

  .historia-img img{ height:320px; }

  .historia-contenido{
    max-width:100%;
    padding:40px 24px;
  }
}

/* =========================
   CONTACTO (bloque genérico con formulario)
   ========================= */
.contacto{
  padding:90px 0;
  background:#fff;
}

.contacto-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:start;
}

.contacto-info h2{
  margin:0 0 18px 0;
  font-size:32px;
  line-height:1.15;
}

/* Form (base) */
.contacto-form{ padding-left:0; }

.form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}

.form-field{ margin-bottom:18px; }

.form-field label{
  display:block;
  font-size:14px;
  color:var(--color-black);
  margin-bottom:8px;
  font-weight:700;
}
@media (max-width: 900px){
	.form-field label{
  font-size:16px;
}
}

.form-field input,
.form-field textarea{
  width:100%;
  border:0;
  border-bottom:2px solid var(--color-black);
  padding:10px 4px;
  font-family:"Lato",sans-serif;
  font-size:16px;
  outline:none;
  background:transparent;
}

.form-field textarea{
  resize:vertical;
  margin-top:6px;
}

/* Honeypot */
.hp-field{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}

/* Mensajes */
.form-msg{ margin-top:12px; font-size:14px; }
.form-msg.ok{ color:#0a7; }
.form-msg.err{ color:#c22; }

/* Consentimiento */
.form-consent{
  margin:18px 0 10px;
  font-size:14px;
}

.form-consent label{
  display:flex;
  align-items:flex-start;
  gap:10px;
  line-height:1.4;
  cursor:pointer;
}

/* clave para que el texto pueda “encoger” y partir bien en móvil */
.form-consent .consent-text{
  min-width:0;
}

.form-consent input[type="checkbox"]{
  margin-top:3px;
  accent-color:var(--color-primary);
}

.form-consent a{
  color:var(--color-primary);
  text-decoration:underline;
}



/* Responsive contacto */
@media (max-width: 900px){
  .contacto-grid{
    grid-template-columns:1fr;
    gap:40px;
  }
  .form-row{ grid-template-columns:1fr; }
}

/* =========================
   CONTACTO (página individual)
   ========================= */

/* Bloque superior: foto + tarjeta info */
.contacto-top{
  padding:60px 0 40px;
  background:#fff;
}

.contacto-top-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:start;
}

.contacto-top-media img{
  width:100%;
  height:460px;
  display:block;
  object-fit:cover;
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-soft);
}

.contacto-top-info{
  background:#fff;
  border-radius:var(--radius-md);
  padding:28px;
}

.contacto-top-info h1{
  margin:0 0 12px 0;
  font-size:32px;
  line-height:1.15;
}

.contacto-lead{ margin:40px 0 18px 0; }

/* Formulario en panel (sin tocar inputs base) */
.contacto-form-full{
  background:var(--color-bg-soft);
  border-top:1px solid var(--color-border);
  padding:60px 0 80px;
}

.contacto-form-panel{
  background:#fff;
  border:1px solid #e9e9e9;
  border-radius:var(--radius-md);
  padding:28px;
}

.contacto-form-head h2{
  margin:0 0 8px 0;
  font-size:22px;
}

.contacto-form-head p{
  margin:0 0 18px 0;
  color:var(--color-muted);
}

/* Ajustes de aire */
.contacto-form-full .form-consent{ margin:18px 0 18px; }
.contacto-form-full .boton-azul{ margin-top:6px; }

/* Mapa */
.mapa{ border-top:1px solid var(--color-border); }
.mapa iframe{ display:block; width:100%; }

/* Responsive */
@media (max-width: 900px){
  .contacto-top{ padding:40px 0 25px; }
  .contacto-top-grid{ grid-template-columns:1fr; gap:24px; }
  .contacto-top-media img{ height:300px; }
  .contacto-form-full{ padding:40px 0 65px; }
}

/* Mensajes del formulario */
.form-msg{
  display: none;              /* oculto por defecto */
  margin: 14px 0 18px;
  padding: 12px 14px;
  border-radius: 10px;
  font-size: 14px;
  line-height: 1.3;
  border: 1px solid transparent;
}

/* Mostrar cuando haya contenido o clase */
.form-msg.is-ok,
.form-msg.is-error,
.form-msg.is-info{
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

/* Icono (sin imágenes) */
/*.form-msg.is-ok::before,
.form-msg.is-error::before,
.form-msg.is-info::before{
  content: "";
  width: 10px;
  height: 10px;
  margin-top: 6px;
  border-radius: 50%;
  flex: 0 0 10px;
}*/

/* Error */
.form-msg.is-error{
  background: rgba(220, 53, 69, 0.08);
  border-color: rgba(220, 53, 69, 0.25);
  color: #b42318;
}
/*.form-msg.is-error::before{
  background: #b42318;
}*/

/* OK */
.form-msg.is-ok{
  background: rgba(34, 197, 94, 0.10);
  border-color: rgba(34, 197, 94, 0.25);
  color: #166534;
}
/*.form-msg.is-ok::before{
  background: #166534;
}*/

/* Info (opcional, por ejemplo "Enviando...") */
.form-msg.is-info{
  background: rgba(13, 110, 253, 0.08);
  border-color: rgba(13, 110, 253, 0.25);
  color: #0b3b8a;
}
.form-msg.is-info::before{
  background: #0b3b8a;
}
/* Error */
.form-msg.is-error{
  background: rgba(220, 53, 69, 0.08);
  border-color: rgba(220, 53, 69, 0.25);
  color: #842029;
}
.form-msg.is-error::before{
  background: #842029;
}


/* =========================
   FOOTER
   ========================= */
.footer{
  background:var(--color-black);
  color:#fff;
  padding-top:70px;
}

.footer-grid{
  display:grid;
  grid-template-columns:1.1fr 1fr 1.2fr;
  gap:60px;
  padding-bottom:60px;
}
.footer .logo-footer{
	width:80%;
	max-width:200px;
}

.footer h4{
  margin:0 0 18px 0;
  letter-spacing:1px;
  font-size:16px;
}

.footer p{ color:rgba(255,255,255,.8); }

.footer ul{
  list-style:none;
  padding:0;
  margin:0;
}

.footer ul li{ margin-bottom:10px; }

.footer a{
  color:rgba(255,255,255,.85);
  text-decoration:none;
}

.footer a:hover{ color:#fff; }

.footer-social{
  display:flex;
  gap:10px;
  margin-top:18px;
}

.footer-social a{
  width:36px;
  height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:6px;
  background:var(--color-primary);
  color:#fff;
  transition:opacity .2s ease;
}

.footer-social a:hover{ opacity:.85; }

.datos-box p{ margin:10px 0; }

.footer-datos .dato-item{
  display:flex;
  gap:10px;
  align-items:flex-start;
  margin-bottom:6px;
}

.footer-datos .dato-item .fa{
  margin-top:2px;
  color:var(--color-primary);
  min-width:16px;
}

.footer-datos a{
  color:inherit;
  text-decoration:none;
}

.footer-datos a:hover{ text-decoration:underline; }

.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12);
  padding:18px 0;
}

.footer-bottom-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}

.footer-links{
  display:flex;
  gap:14px;
}

.footer-links a{
  font-size:13px;
  color:rgba(255,255,255,.75);
}

@media (max-width: 900px){
  .footer-grid{
    grid-template-columns:1fr;
    gap:40px;
  }
  .footer-bottom-inner{
    flex-direction:column;
    align-items:flex-start;
	font-size:16px !important;
  }
}

@media (max-width: 768px){

  .footer-bottom-inner{
    flex-direction: column;
    align-items: center;
    text-align: center;
	padding-bottom:30px;	
  }

  .footer-links{
    flex-direction: column;
    gap:10px;
  }
    .footer-links a{		
	padding:8px 0px;
	font-size:16px !important;
  }

}


/* =========================
   PÁGINA: LACADOS ATP
   ========================= */
.lacados-historia{
  padding:60px 0 90px;
  background:#fff;
}

.lacados-grid{
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:60px;
  align-items:start;
  padding-top:30px;
}

.lacados-texto h3{ margin:0 0 20px 0; padding:0px; font-size:23px; }
.lacados-texto p{ margin:0 0 20px 0; }

.lacados-media img{
  width:100%;
  display:block;
  border-radius:var(--radius-sm);
  object-fit:cover;
}

@media (max-width: 900px){
  .lacados-grid{
    grid-template-columns:1fr;
    gap:30px;
  }
}

/* =========================
   PÁGINA: INSTALACIONES Y SERVICIOS
   ========================= */
.instalaciones{ padding:60px 0 90px; }

.instalacion-bloque{
  margin:0;
  padding:30px 0;
}

.instalacion-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
}

.instalacion-texto h3{
  margin:0;
  font-size:22px;
  display:inline-block;
  padding-bottom:6px;
  margin-bottom:18px;
  border-bottom:4px solid var(--color-primary);
}

.instalacion-media img{
  width:100%;
  display:block;
  object-fit:cover;
  border-radius:var(--radius-sm);
}

@media (max-width: 900px){
  .instalacion-grid{
    grid-template-columns:1fr;
    gap:30px;
  }
}

.instalacion-features{
  list-style:none;
  padding:0;
  margin:50px 0 0 0;
}

.instalacion-features li{
  /*display:flex;
  align-items:center;
  gap:12px;*/
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin-bottom:10px;
  font-size:15px;
  color:#444;
}

.instalacion-features li i.fa{
  font-size:22px;
  color:var(--color-primary);
  min-width:25px;
  text-align:center;
}

.instalacion-features .feat-text{
  min-width:0;             /* CLAVE en flex para que el texto pueda partir bien */
}