/*************** MC2 · Diginova INV · ago-2026 ***************/

:root{
  --mc2-teal:#00A19A;
  --mc2-teal-dark:#0E2E31;
  --mc2-orange:#EA5B0A;
  --mc2-ink:#17323A;
  --mc2-gray:#5C6B70;
  --mc2-line:#DDE5E6;
}

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

/* Anclas: compensan el header sticky de Flatsome */
.mc2-anchor{display:block;position:relative;top:-96px;width:1px;height:1px;pointer-events:none;visibility:hidden}

/* ---------- Tipografia base ---------- */
.mc2-h1{
  font-size:3.05rem;line-height:1.12;font-weight:600;color:#fff;
  letter-spacing:-.5px;margin:0 0 18px;max-width:16em;
}
.mc2-h2{
  font-size:2.1rem;line-height:1.2;font-weight:600;color:var(--mc2-ink);
  margin:0 0 12px;
}
.mc2-h2-light{color:#fff}
.mc2-h2-left{text-align:left}
.mc2-h2::after{
  content:"";display:block;width:52px;height:3px;background:var(--mc2-orange);
  margin:16px auto 0;
}
.mc2-h2-left::after{margin-left:0;margin-right:auto}
.mc2-sub{
  font-size:1.06rem;line-height:1.6;color:var(--mc2-gray);
  max-width:44em;margin:14px auto 0;
}
.mc2-sub-light{color:rgba(255,255,255,.78)}
.mc2-eyebrow{
  font-size:.78rem;letter-spacing:2.4px;text-transform:uppercase;
  color:var(--mc2-teal);font-weight:600;margin:0 0 14px;
}
.mc2-lead{
  font-size:1.18rem;line-height:1.62;color:rgba(255,255,255,.9);
  max-width:34em;margin:0 0 30px;
}
.mc2-lead-dark{
  font-size:1.16rem;line-height:1.6;color:var(--mc2-ink);font-weight:600;margin:0 0 16px;
}

/* ---------- Botones ---------- */
.mc2-btn.button{
  font-weight:600;letter-spacing:.4px;text-transform:none;
  border-width:2px;margin-right:14px;margin-bottom:10px;
}
.mc2-btn-orange.button{background-color:var(--mc2-orange);border-color:var(--mc2-orange);color:#fff}
.mc2-btn-orange.button:hover{background-color:#cf4f08;border-color:#cf4f08}
.mc2-btn-teal.button{background-color:var(--mc2-teal);border-color:var(--mc2-teal);color:#fff}
.mc2-btn-teal.button:hover{background-color:#008a84;border-color:#008a84}
.mc2-btn-ghost.button{border-color:rgba(255,255,255,.65);color:#fff}
.mc2-btn-ghost.button:hover{background-color:#fff;color:var(--mc2-teal-dark);border-color:#fff}

/* ---------- Hero ---------- */
.mc2-hero{border-bottom:4px solid var(--mc2-orange)}

/* ---------- Banda de ganchos ---------- */
.mc2-band .mc2-band-item{
  margin:0;color:#fff;font-size:1rem;line-height:1.45;font-weight:600;
  text-align:center;padding:6px 22px;
}
.mc2-band .col{padding-top:8px;padding-bottom:8px}

/* ---------- Tarjetas ---------- */
.mc2-card .col-inner{
  background:#fff;border:1px solid var(--mc2-line);border-top:3px solid var(--mc2-teal);
  padding:30px 28px;height:100%;
}
.mc2-servicios .mc2-card .col-inner,
.mc2-casos .mc2-card .col-inner{background:#fff}
.mc2-card-t{
  font-size:1.08rem;line-height:1.35;font-weight:600;color:var(--mc2-ink);margin:0 0 10px;
}
.mc2-card-p{
  font-size:.97rem;line-height:1.62;color:var(--mc2-gray);margin:0;
}

/* ---------- Servicios destacados ---------- */
.mc2-serv .box-text{padding:20px 4px 6px}
.mc2-serv .box-image{border-bottom:3px solid var(--mc2-orange)}
.mc2-serv-t{
  font-size:1.06rem;line-height:1.35;font-weight:600;color:var(--mc2-ink);margin:0 0 8px;
}
.mc2-serv-p{font-size:.95rem;line-height:1.6;color:var(--mc2-gray);margin:0}
.mc2-serv:hover .box-image{border-bottom-color:var(--mc2-teal)}

/* ---------- Proceso ---------- */
.mc2-paso .col-inner{
  border-left:2px solid var(--mc2-line);padding:6px 26px 6px 24px;height:100%;
}
.mc2-num{
  font-size:1.65rem;font-weight:600;color:var(--mc2-orange);
  margin:0 0 6px;letter-spacing:1px;line-height:1;
}
.mc2-paso-t{
  font-size:1.05rem;font-weight:600;color:var(--mc2-ink);margin:0 0 8px;
}

/* ---------- Diferenciadores ---------- */
.mc2-dif-item .col-inner{padding:22px 26px;border-left:2px solid rgba(0,161,154,.5);height:100%}
.mc2-dif-t{font-size:1.04rem;font-weight:600;color:#fff;margin:0 0 8px}
.mc2-dif-p{font-size:.95rem;line-height:1.6;color:rgba(255,255,255,.72);margin:0}

/* ---------- Resultados / casos ---------- */
.mc2-metric .col-inner{
  background:#fff;border:1px solid var(--mc2-line);padding:30px 28px;height:100%;
}
.mc2-metric-t{
  font-size:1.06rem;font-weight:600;color:var(--mc2-teal);margin:0 0 10px;
}

/* ---------- Nosotros ---------- */
.mc2-valor{
  font-size:.98rem;line-height:1.55;color:var(--mc2-gray);
  margin:0 0 12px;padding-left:18px;border-left:2px solid var(--mc2-orange);
}

/* ---------- Contacto ---------- */
.mc2-datos-t{font-size:1.1rem;font-weight:600;color:#fff;margin:0 0 16px}
.mc2-dato{font-size:1rem;line-height:1.6;color:rgba(255,255,255,.88);margin:0 0 8px}
.mc2-dato a{color:#fff;border-bottom:1px solid var(--mc2-orange)}
.mc2-dato a:hover{color:var(--mc2-orange)}
.mc2-dato-nota{font-size:.92rem;line-height:1.6;color:rgba(255,255,255,.6);margin:18px 0 24px}

.mc2-form .form-row{display:flex;flex-wrap:wrap;margin:0 -8px}
.mc2-form .column-half{width:50%;padding:0 8px;min-width:0}
.mc2-form .column-full{width:100%;padding:0 8px;min-width:0}
.mc2-form input[type=text],
.mc2-form input[type=email],
.mc2-form input[type=tel],
.mc2-form select,
.mc2-form textarea{
  width:100%;max-width:100%;min-width:0;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.24);color:#fff;box-shadow:none;
  border-radius:2px;margin-bottom:14px;
}
.mc2-form input::placeholder,.mc2-form textarea::placeholder{color:rgba(255,255,255,.5)}
.mc2-form select option{color:var(--mc2-ink)}
.mc2-form textarea{min-height:120px}
.mc2-form .wpcf7-list-item{margin:0}
.mc2-form .wpcf7-acceptance,
.mc2-form .wpcf7-acceptance label{font-size:.9rem;color:rgba(255,255,255,.72)}
.mc2-form .wpcf7-acceptance a{color:#fff;border-bottom:1px solid var(--mc2-orange)}
.mc2-file-label{
  display:block;font-size:.9rem;color:rgba(255,255,255,.62);margin:0 0 8px;
}
.mc2-form input[type=file]{
  width:100%;max-width:100%;color:rgba(255,255,255,.72);font-size:.9rem;
  background:rgba(255,255,255,.06);border:1px dashed rgba(255,255,255,.28);
  border-radius:2px;padding:12px 14px;margin-bottom:18px;
}
.mc2-form input[type=file]::file-selector-button{
  background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff;
  border-radius:2px;padding:6px 14px;margin-right:14px;cursor:pointer;font-size:.88rem;
}
.mc2-form input[type=file]::file-selector-button:hover{border-color:var(--mc2-orange);color:var(--mc2-orange)}
.mc2-form input[type=submit]{
  background:var(--mc2-orange);border:2px solid var(--mc2-orange);color:#fff;
  font-weight:600;letter-spacing:.4px;border-radius:2px;padding:0 34px;
  height:48px;line-height:44px;text-transform:none;
}
.mc2-form input[type=submit]:hover{background:#cf4f08;border-color:#cf4f08}
.mc2-form .wpcf7-not-valid-tip{color:#FFB4A0;font-size:.85rem}
.mc2-form .wpcf7-response-output{
  border-color:rgba(255,255,255,.4);color:#fff;margin:16px 0 0;padding:12px 16px;
}
.mc2-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

@media only screen and (max-width: 48em) {
/*************** MOVIL ***************/
  .mc2-h1{font-size:2rem;line-height:1.18}
  .mc2-lead{font-size:1.04rem}
  .mc2-h2{font-size:1.6rem}
  .mc2-hero{padding-top:84px !important;padding-bottom:84px !important;min-height:auto !important}
  .mc2-hero .col,.mc2-contacto .col,.mc2-nosotros .col{padding-left:20px;padding-right:20px}
  .mc2-band .col{border:0 !important}
  .mc2-band .mc2-band-item{padding:10px 18px;font-size:.96rem}
  .mc2-card .col-inner,.mc2-metric .col-inner{padding:24px 22px}
  .mc2-paso .col-inner{border-left:0;border-top:2px solid var(--mc2-line);padding:20px 6px 6px}
  .mc2-dif-item .col-inner{padding:18px 20px}
  .mc2-form .column-half{width:100%}
  .mc2-btn.button{margin-right:8px}
  section.mc2-problemas,section.mc2-servicios,section.mc2-proceso,
  section.mc2-industrias,section.mc2-casos,section.mc2-nosotros,
  section.mc2-contacto{padding-top:56px !important;padding-bottom:56px !important}
}

/* ---------- Pie de pagina ---------- */
.footer-widgets .widget-title{
  font-size:.95rem;font-weight:600;letter-spacing:.6px;color:#fff;margin-bottom:14px;
}
.footer-widgets .textwidget p,
.footer-widgets .widget_custom_html p{
  font-size:.95rem;line-height:1.7;color:rgba(255,255,255,.7);margin:0 0 12px;
}
.footer-widgets a{color:rgba(255,255,255,.86)}
.footer-widgets a:hover{color:var(--mc2-orange)}
.absolute-footer{border-top:1px solid rgba(255,255,255,.12)}
.mc2-credito{
  display:inline-flex;align-items:center;gap:8px;font-size:.8rem;
  color:rgba(255,255,255,.55);letter-spacing:.3px;
}
.mc2-credito-logo{
  display:inline-block;height:22px;width:auto;opacity:.62;vertical-align:middle;
  transition:opacity .2s ease;
}
.mc2-credito a:hover .mc2-credito-logo{opacity:1}

/* ---------- Retícula de hexágonos (identidad MC2: tarjetas de presentación) ---------- */
.mc2-problemas,.mc2-servicios,.mc2-industrias,.mc2-casos,.mc2-nosotros{
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2256%22%20height%3D%22100%22%20viewBox%3D%220%200%2056%20100%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%230E2E31%22%20stroke-opacity%3D%220.055%22%20stroke-width%3D%221%22%3E%3Cpath%20d%3D%22M28%2066L0%2050L0%2016L28%200L56%2016L56%2050L28%2066L28%20100%22%2F%3E%3Cpath%20d%3D%22M28%200L28%2034L0%2050L0%2084L28%20100L56%2084L56%2050L28%2034%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-repeat:repeat;background-position:center top;
}
.mc2-dif,.mc2-contacto{
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2256%22%20height%3D%22100%22%20viewBox%3D%220%200%2056%20100%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23FFFFFF%22%20stroke-opacity%3D%220.05%22%20stroke-width%3D%221%22%3E%3Cpath%20d%3D%22M28%2066L0%2050L0%2016L28%200L56%2016L56%2050L28%2066L28%20100%22%2F%3E%3Cpath%20d%3D%22M28%200L28%2034L0%2050L0%2084L28%20100L56%2084L56%2050L28%2034%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-repeat:repeat;background-position:center top;
}
.mc2-dif .section-bg,.mc2-contacto .section-bg{opacity:1}

/* El descriptor de marca del logotipo */
.mc2-descriptor{
  font-style:italic;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;
  font-size:.8rem;color:var(--mc2-teal);margin:0 0 14px;line-height:1.5;
}
.mc2-descriptor span{color:rgba(255,255,255,.55);margin:0 8px;font-style:normal}

/* La barra inferior venia en gris del tema; se unifica con el pie */
.absolute-footer,.absolute-footer.dark{
  background-color:#0A2427 !important;color:rgba(255,255,255,.55);
}
.absolute-footer a{color:rgba(255,255,255,.66)}
.absolute-footer a:hover{color:var(--mc2-orange)}
.mc2-credito-logo{height:26px}

/* Catalogo B2B: no hay venta en linea, se ocultan los restos de tienda */
li.cart-item,.header-button .cart-item,.nav-dropdown.cart-dropdown,
.header .account-item,.mobile-sidebar .cart-item{display:none !important}

@media only screen and (max-width: 48em){
  /* Nada al ras del margen en movil */
  .mc2-problemas .col,.mc2-industrias .col,.mc2-casos .col,
  .mc2-servicios .col,.mc2-proceso .col,.mc2-dif .col{
    padding-left:20px;padding-right:20px;
  }
  .mc2-band .col{padding-left:24px;padding-right:24px}
}

/* ---------- Tipografia tecnica: Exo 2 autoalojada (nada de CDN) ---------- */
@font-face{font-family:'Exo 2';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(fonts/exo2-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Exo 2';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(fonts/exo2-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Exo 2';font-style:italic;font-weight:100 900;font-display:swap;
  src:url(fonts/exo2-italic-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Exo 2';font-style:italic;font-weight:100 900;font-display:swap;
  src:url(fonts/exo2-italic-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}

h1,h2,h3,h4,h5,h6,.mc2-h1,.mc2-h2,.mc2-eyebrow,.mc2-descriptor,.mc2-num,
.button,input[type=submit],.nav>li>a,.widget-title,.mc2-band-item,
.mc2-card-t,.mc2-serv-t,.mc2-paso-t,.mc2-dif-t,.mc2-metric-t,.mc2-datos-t{
  font-family:'Exo 2',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
h1,h2,h3,h4,h5,h6{font-weight:600;letter-spacing:-.2px}
.nav>li>a{letter-spacing:.6px}

/* Las cuatro aristas del negocio */
.mc2-arista .col-inner{
  border-top:2px solid var(--mc2-teal);padding:20px 20px 6px 0;height:100%;
}
.mc2-refac-texto .col-inner{padding-right:34px}
@media only screen and (max-width: 48em){
  .mc2-arista .col-inner{padding:18px 4px 6px}
  .mc2-refac-texto .col-inner{padding-right:0}
}

/* Parrafos consecutivos: se pegaban por el margin:0 de .mc2-card-p */
.mc2-card-p + .mc2-card-p,.mc2-card-p + .mc2-lead-dark{margin-top:16px}

/* ================= Barra de navegación en naranja =================
   El teal como texto sobre el naranja da 1.09:1 (invisible), asi que
   en hover el teal pasa al fondo del boton y la letra se queda blanca. */
.header-bottom,
.header-bottom.dark,
.header-bottom .header-bottom-nav{
  background-color:var(--mc2-orange) !important;
  border-bottom:none !important;
}
.header-bottom .nav > li > a,
.header-bottom .nav > li > a:visited,
.header-bottom .nav > li.current-menu-item > a,
.header-bottom .nav > li.active > a{
  color:#fff !important;opacity:1;font-weight:600;
}
.header-bottom .nav > li > a{
  padding-left:18px;padding-right:18px;
  transition:background-color .18s ease;
}
/* Solo el hover pinta el fondo. Ojo: NO usar .current-menu-item aqui,
   porque todas las entradas apuntan a anclas de la home y WordPress las
   marca todas como pagina actual, con lo que la barra entera salia teal. */
.header-bottom .nav > li > a:hover,
.header-bottom .nav > li:hover > a{
  background-color:var(--mc2-teal) !important;color:#fff !important;
}
.header-bottom .nav > li > a::before{display:none}

/* ================= Onditas del botón de WhatsApp =================
   Mismo sistema que Multimarcas y Cerámica Leonesa (plugin wpt-whatsapp). */
.wptwa-toggle{overflow:visible !important}
.wptwa-container .wptwa-toggle::before,
.wptwa-container .wptwa-toggle::after{
  content:'';position:absolute;inset:0;border-radius:50%;
  background:#25D366;z-index:-1;pointer-events:none;
  animation:mc2-wa-onditas 2.6s cubic-bezier(.25,.46,.45,.94) infinite;
}
.wptwa-container .wptwa-toggle::after{animation-delay:1.3s}
@keyframes mc2-wa-onditas{
  0%  {transform:scale(1);  opacity:.55}
  70% {opacity:0}
  100%{transform:scale(2.6);opacity:0}
}
@media (prefers-reduced-motion: reduce){
  .wptwa-container .wptwa-toggle::before,
  .wptwa-container .wptwa-toggle::after{animation:none;display:none}
}

/* ================= Barra superior (movil): naranja con texto blanco ======== */
#top-bar,#top-bar.header-top,#top-bar.nav-dark{
  background-color:var(--mc2-orange) !important;
}
#top-bar,#top-bar a,#top-bar .nav > li > a,#top-bar strong,
#top-bar .html_topbar_left a{
  color:#fff !important;opacity:1;
}
#top-bar .nav > li > a:hover,#top-bar a:hover{color:#fff !important;text-decoration:underline}

/* ================= Fuera "Acceder" y "Newsletter" ========================= */
li.account-item,
li.header-newsletter-item,
#header-newsletter-signup{display:none !important}

/* ================= Menú móvil fijo abajo ================================== */
.mc2-bottomnav{display:none}
@media only screen and (max-width: 849px){
  .mc2-bottomnav{
    display:grid;grid-template-columns:repeat(3,1fr);
    position:fixed;left:0;right:0;bottom:0;z-index:9998;
    background:var(--mc2-teal-dark);border-top:2px solid var(--mc2-orange);
    padding-bottom:env(safe-area-inset-bottom);
    box-shadow:0 -3px 14px rgba(0,0,0,.22);
  }
  .mc2-bottomnav a{
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:5px;padding:10px 4px 9px;color:#fff;text-decoration:none;
    font-size:.7rem;line-height:1.15;letter-spacing:.3px;text-align:center;
    font-family:'Exo 2',sans-serif;font-weight:600;
  }
  .mc2-bottomnav a + a{border-left:1px solid rgba(255,255,255,.13)}
  .mc2-bottomnav a:active,.mc2-bottomnav a:hover{background:var(--mc2-orange);color:#fff}
  .mc2-bottomnav svg{
    width:21px;height:21px;stroke:currentColor;fill:none;
    stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;
  }
  /* Aire al final para que la barra no tape el contenido ni el pie */
  body{padding-bottom:66px}
  /* El botón de WhatsApp sube por encima de la barra */
  .wptwa-container .wptwa-toggle,.wptwa-toggle{bottom:86px !important}
}

/* ================= Aire alrededor del logo ================================
   Flatsome dejaba el alto del encabezado y el alto maximo del logo en el
   mismo valor (90px y 90px), asi que el logo tocaba arriba y abajo.
   Se sube el alto de la barra y se baja el del logo para que respire. */
.header-main{height:110px !important}
.header-main #logo img,#logo img{max-height:72px !important}
.header-main #logo{display:flex;align-items:center}

/* Al hacer scroll el encabezado se compacta, pero conserva su aire */
.stuck .header-main{height:76px !important}
.stuck #logo img{max-height:48px !important}

@media only screen and (max-width: 849px){
  .header-main{height:96px !important}
  .header-main #logo img,#logo img{max-height:60px !important}
  .stuck .header-main{height:74px !important}
  .stuck #logo img{max-height:46px !important}
}
@media only screen and (max-width: 549px){
  .header-main{height:90px !important}
  .header-main #logo img,#logo img{max-height:56px !important}
}

/* ================= Encabezado fijo: el logo tambien necesita aire =========
   Flatsome imprime su CSS DESPUES de este archivo y con !important
   (.stuck .header-main{height:70px!important}), asi que hay que ganarle
   con mas especificidad, no con !important a secas. */
body .stuck .header-main{height:84px !important}
body .stuck #logo img{max-height:52px !important}
@media only screen and (max-width: 849px){
  body .stuck .header-main{height:76px !important}
  body .stuck #logo img{max-height:46px !important}
}

/* ================= Mensaje de cobertura en el encabezado ================== */
.html_top_right_text{margin-left:34px}
.mc2-claim{
  display:flex;flex-direction:column;justify-content:center;line-height:1.25;
  padding-left:16px;border-left:3px solid var(--mc2-orange);text-align:left;
}
.mc2-claim-1{
  font-family:'Exo 2',sans-serif;font-weight:600;font-size:.92rem;
  color:var(--mc2-ink);letter-spacing:.2px;text-transform:none;
}
.mc2-claim-2{
  font-size:.78rem;color:var(--mc2-teal);font-weight:600;letter-spacing:.2px;
  margin-top:2px;
}
/* Debajo de 1150px ya no cabe junto al logo y los contactos */
@media only screen and (max-width: 1150px){
  .html_top_right_text{display:none !important}
}