/* ==========================================================================
   FEREMI Solutions — estilos de marca (sobre tema Fuse / Elementor)
   Paleta: naranja #F15A24 · azul marino #0E2A47 · gris #F5F7FA
   ========================================================================== */
:root{
  --fe-orange:#F15A24;
  --fe-orange-dark:#D94A18;
  --fe-navy:#0E2A47;
  --fe-gray:#F5F7FA;
  --fe-text:#54616E;
  --fe-card-shadow:0 10px 30px rgba(14,42,71,.08);
}

/* ---------- Tipografía base de secciones ---------- */
.feremi-hero,.feremi-cards,.feremi-coverage,.feremi-sechead,.feremi-where,
.feremi-formwrap,.feremi-faq,.feremi-cta,.feremi-intro-row{
  padding-top:64px;padding-bottom:64px;
}
.feremi-cards{padding-top:24px;}

/* ---------- HERO ---------- */
.feremi-hero{background:#fff;padding-top:80px;padding-bottom:72px;}
.feremi-hero-title .elementor-heading-title{
  font-size:3rem;line-height:1.08;font-weight:800;color:var(--fe-navy);margin:0;
}
.feremi-hero-text{margin-top:20px;max-width:660px;}
.feremi-hero-text p{font-size:1.12rem;line-height:1.7;color:var(--fe-text);}
@media(max-width:767px){.feremi-hero-title .elementor-heading-title{font-size:2.1rem;}}

/* ---------- Encabezados de sección ---------- */
.feremi-sechead{padding-bottom:8px;}
.feremi-supertitle .elementor-heading-title{
  color:var(--fe-orange);text-transform:uppercase;letter-spacing:1.5px;
  font-weight:700;font-size:.85rem;margin-bottom:6px;
}
.feremi-sectitle .elementor-heading-title{
  font-size:2.1rem;font-weight:800;color:var(--fe-navy);position:relative;
  padding-bottom:20px;margin:0;
}
.feremi-sectitle .elementor-heading-title:after{
  content:"";display:block;width:64px;height:3px;background:var(--fe-orange);
  position:absolute;left:50%;transform:translateX(-50%);bottom:6px;border-radius:2px;
}
@media(max-width:767px){.feremi-sectitle .elementor-heading-title{font-size:1.6rem;}}

/* ---------- Tarjetas (icon-box) — columnas equitativas y responsive ----------
   Elementor genera la clase 'elementor-col-33.33' (con punto decimal) y NO trae
   regla de ancho para ella (solo existe .elementor-col-33). Sin ancho, las
   columnas se ajustan al contenido y salen disparejas. Le damos el ancho real. */
.elementor-column.elementor-col-33\.33{width:33.333%;}
@media(max-width:767px){
  .elementor-column.elementor-col-33\.33{width:100%;}
}
.feremi-card{
  background:#fff;border-radius:14px;box-shadow:var(--fe-card-shadow);
  padding:36px 28px;width:100%;text-align:center;
  transition:transform .25s ease,box-shadow .25s ease;
  border:1px solid #eef2f6;
}
.feremi-card:hover{transform:translateY(-5px);box-shadow:0 18px 42px rgba(14,42,71,.15);}
.feremi-card .elementor-icon-box-icon{margin-bottom:18px;}
.feremi-card .elementor-icon{font-size:46px;color:var(--fe-orange);}
.feremi-card .elementor-icon svg{width:46px;height:46px;fill:var(--fe-orange);}
.feremi-card .elementor-icon-box-title{
  font-size:1.16rem;font-weight:700;color:var(--fe-navy);margin-bottom:12px;line-height:1.3;
}
.feremi-card .elementor-icon-box-description{color:var(--fe-text);font-size:.97rem;line-height:1.6;margin:0;}

/* ---------- Botones ---------- */
.feremi-btn .elementor-button{
  border-radius:9px;font-weight:700;padding:15px 30px;font-size:1rem;letter-spacing:.2px;
  transition:all .2s ease;border:2px solid transparent;
}
.feremi-btn-primary .elementor-button{background:var(--fe-orange);color:#fff;}
.feremi-btn-primary .elementor-button:hover{background:var(--fe-orange-dark);color:#fff;}
.feremi-btn-outline .elementor-button{background:transparent;color:var(--fe-navy);border-color:#dbe3ea;}
.feremi-btn-outline .elementor-button:hover{border-color:var(--fe-orange);color:var(--fe-orange);}
.feremi-btn-outline-white .elementor-button{background:transparent;color:#fff;border-color:rgba(255,255,255,.45);}
.feremi-btn-outline-white .elementor-button:hover{background:#fff;color:var(--fe-navy);}
.feremi-btn .elementor-button i{margin-right:9px;}
.feremi-btnrow{margin-top:26px;}
.feremi-btnrow .elementor-column{width:auto!important;flex:0 0 auto;}
.feremi-cta .feremi-btnrow,.feremi-coverage .feremi-btnrow{justify-content:center;}

/* ---------- Banda CTA (azul marino) ---------- */
.feremi-cta{background:var(--fe-navy)!important;padding:66px 0;}
.feremi-cta .elementor-heading-title{color:#fff!important;font-size:2rem;font-weight:800;}
.feremi-cta-text p{color:#c7d2de!important;font-size:1.08rem;margin-top:8px;}
@media(max-width:767px){.feremi-cta .elementor-heading-title{font-size:1.5rem;}}

/* ---------- Cobertura / checklist ---------- */
.feremi-coverage-text{max-width:760px;margin:0 auto;}
.feremi-coverage-text p{color:var(--fe-text);font-size:1.05rem;line-height:1.7;}
.feremi-checklist{list-style:none;padding:0;margin:18px auto;max-width:560px;text-align:left;}
.feremi-checklist li{position:relative;padding-left:32px;margin-bottom:12px;color:var(--fe-navy);font-weight:600;}
.feremi-checklist li:before{
  content:"✓";position:absolute;left:0;top:-1px;color:#fff;background:var(--fe-orange);
  width:22px;height:22px;border-radius:50%;font-size:.8rem;font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.feremi-intro-text{max-width:780px;margin:0 auto;}
.feremi-intro-text p{color:var(--fe-text);font-size:1.05rem;line-height:1.7;}

/* ---------- Placeholders de imagen ---------- */
.feremi-img-ph{
  border:2px dashed var(--fe-orange);background:#FFF6F2;color:var(--fe-orange-dark);
  padding:64px 20px;border-radius:14px;font-weight:600;margin:26px auto;max-width:880px;
}

/* ---------- ¿Dónde estamos? / mapa ---------- */
.feremi-where-text{max-width:760px;margin:0 auto 26px;}
.feremi-where-text p{color:var(--fe-text);line-height:1.7;}
.feremi-map iframe{border-radius:14px;box-shadow:var(--fe-card-shadow);}

/* ---------- FAQ ---------- */
.feremi-faq{background:var(--fe-gray);}
.feremi-faq .elementor-accordion{max-width:860px;margin:0 auto;}
.feremi-acc .elementor-tab-title{
  background:#fff;border-radius:10px;margin-bottom:12px;border:1px solid #e9eef3;
  font-weight:700;color:var(--fe-navy);padding:18px 22px;
}
.feremi-acc .elementor-tab-title.elementor-active{color:var(--fe-orange);}
.feremi-acc .elementor-tab-content{color:var(--fe-text);line-height:1.7;padding:6px 22px 22px;}

/* ---------- Formulario CF7 ---------- */
.feremi-formwrap{background:var(--fe-gray);}
.feremi-form{max-width:820px;margin:0 auto;background:#fff;padding:38px 34px;border-radius:14px;box-shadow:var(--fe-card-shadow);}
.feremi-form .feremi-f-row{margin-bottom:18px;}
.feremi-form label{display:block;font-weight:600;color:var(--fe-navy);font-size:.95rem;}
.feremi-form input[type=text],.feremi-form input[type=tel],.feremi-form textarea{
  width:100%;padding:13px 16px;border:1px solid #d8e0e8;border-radius:9px;
  font-size:1rem;margin-top:7px;background:#fbfcfd;transition:border-color .2s;
}
.feremi-form input:focus,.feremi-form textarea:focus{border-color:var(--fe-orange);outline:none;background:#fff;}
.feremi-form textarea{min-height:130px;resize:vertical;}
.feremi-form .wpcf7-radio .wpcf7-list-item{display:inline-block;margin:8px 18px 0 0;font-weight:500;color:var(--fe-text);}
.feremi-form input[type=submit]{
  background:var(--fe-orange);color:#fff;border:0;border-radius:9px;
  padding:15px 40px;font-weight:700;font-size:1.02rem;cursor:pointer;transition:background .2s;margin-top:6px;
}
.feremi-form input[type=submit]:hover{background:var(--fe-orange-dark);}

/* ---------- Utilidades ---------- */
.feremi-cards-4 .elementor-icon-box-description{font-size:.93rem;}

/* ---------- Hero 2 columnas (texto + imagen) ---------- */
.feremi-hero .elementor-container{align-items:center;}
.feremi-hero-img img{border-radius:16px;box-shadow:0 20px 50px rgba(14,42,71,.18);display:block;width:100%;height:auto;}
@media(max-width:767px){.feremi-hero-img{margin-top:26px;}}

/* ---------- Imagen de mapa / cobertura ---------- */
.feremi-mapimg img{border-radius:16px;box-shadow:var(--fe-card-shadow);width:100%;height:auto;}

/* ---------- Galería de bodega ---------- */
.feremi-gallery img{border-radius:12px;width:100%;height:100%;object-fit:cover;box-shadow:var(--fe-card-shadow);}
.feremi-gallery .elementor-column{padding:8px;}

/* ---------- FOOTER Feremi #127 ----------
   El theme elimina la clase de sección (.feremi-footer), así que scopeamos al
   wrapper real que sí renderiza: .footer_custom_127. Además las columnas usan
   anchos 32/22/26% que Elementor no trae como CSS → se los damos. */
.footer_custom_127 .elementor-col-32{width:32%;}
.footer_custom_127 .elementor-col-22{width:22%;}
.footer_custom_127 .elementor-col-26{width:26%;}
.footer_custom_127 .elementor-widget-heading .elementor-heading-title{margin-bottom:18px;letter-spacing:.3px;}
.footer_custom_127 .elementor-widget-text-editor ul{list-style:none;margin:0;padding:0;}
.footer_custom_127 .elementor-widget-text-editor li{margin-bottom:12px;line-height:1.45;}
.footer_custom_127 .elementor-widget-text-editor p{line-height:1.75;}
.footer_custom_127 a{text-decoration:none;transition:color .2s;}
.footer_custom_127 a:hover{color:var(--fe-orange)!important;}
@media(max-width:767px){
  .footer_custom_127 .elementor-col-32,
  .footer_custom_127 .elementor-col-22,
  .footer_custom_127 .elementor-col-26,
  .footer_custom_127 .elementor-col-20{width:100%;margin-bottom:22px;}
}
/* Footer: enlaces legales (Términos · Aviso) en una sola línea, bajo la firma */
.feremi-legal-links{white-space:nowrap;margin-top:10px;}
.feremi-legal-links a{white-space:nowrap;}
/* Centrar la firma LUNA en el footer */
.footer_custom_127 .luna-copy-footer{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  flex-wrap:wrap;
  width:100%;
  text-align:center;
}

/* ---------- Logo SVG: forzar altura (el archivo trae width/height 100% y colapsa a 0) ---------- */
.sc_layouts_logo img,.sc_layouts_logo svg{height:50px!important;width:auto!important;max-width:230px;}
@media(max-width:767px){.sc_layouts_logo img,.sc_layouts_logo svg{height:42px!important;}}

/* ---------- Menú: subrayado (hover/activo) en naranja Feremi ---------- */
.menu_hover_zoom_line .sc_layouts_menu_nav > li:not(.menu-collapse) > a:after,
.menu_hover_zoom_line > ul > li:not(.menu-collapse) > a:after{
  background-color:#F15A24 !important;
}

/* ---------- Logo BLANCO en páginas legales (header oscuro) ---------- */
.page-id-107 .sc_layouts_logo img.logo_image,
.page-id-108 .sc_layouts_logo img.logo_image{
  content:url('../../uploads/2026/06/logotipo-blanco.svg') !important;
  height:50px !important; width:auto !important;
}
@media(max-width:767px){
  .page-id-107 .sc_layouts_logo img.logo_image,
  .page-id-108 .sc_layouts_logo img.logo_image{height:42px !important;}
}