/*
Theme Name: Porto Child
Theme URI: https://www.portotheme.com/wordpress/porto
Author: P-THEMES
Author URI: https://www.portotheme.com/
Description: Porto Responsive WordPress + eCommerce Theme.
Version: 1.1
Template: porto
License: Commercial
License URI: http://themeforest.net/licenses/regular_extended
Tags: woocommerce, corporate, ecommerce, responsive, blue, black, green, white, light, dark, red, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
*/

/*************** ADD YOUR CUSTOM CSS HERE  ***************/

/* =========================================================
   SUPERSERVIS — HOME: ancho tipo Ametller (≈80% centrado)
   SIN afectar header / menú
========================================================= */

:root{
  --ss-home-max: 1280px;   /* tope desktop (ajusta si quieres) */
  --ss-home-pad: 24px;     /* padding lateral mínimo */
}

/* 1) SOLO contenido (main/content/page), nunca header */
.home main .vc_section > .vc_row,
.home main .vc_row.wpb_row,
.home #main .vc_section > .vc_row,
.home #main .vc_row.wpb_row,
.home #content .vc_section > .vc_row,
.home #content .vc_row.wpb_row,
.home .page-content .vc_section > .vc_row,
.home .page-content .vc_row.wpb_row{
  width: min(80vw, var(--ss-home-max)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--ss-home-pad) !important;
  padding-right: var(--ss-home-pad) !important;
}

/* 2) Si WPBakery estira filas full-width, neutralizamos SOLO en contenido */
.home main .vc_row[data-vc-full-width="true"],
.home #main .vc_row[data-vc-full-width="true"],
.home #content .vc_row[data-vc-full-width="true"],
.home .page-content .vc_row[data-vc-full-width="true"]{
  left: auto !important;
  width: auto !important;
}

/* 3) No dejes que wrappers internos rompan el centrado */
.home main .vc_row.wpb_row .vc_row,
.home #main .vc_row.wpb_row .vc_row,
.home #content .vc_row.wpb_row .vc_row{
  max-width: 100% !important;
}

/* 4) Móvil: 100% con padding cómodo */
@media (max-width: 767px){
  .home main .vc_section > .vc_row,
  .home main .vc_row.wpb_row,
  .home #main .vc_section > .vc_row,
  .home #main .vc_row.wpb_row,
  .home #content .vc_section > .vc_row,
  .home #content .vc_row.wpb_row,
  .home .page-content .vc_section > .vc_row,
  .home .page-content .vc_row.wpb_row{
    width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* =========================================================
   SUPERSERVIS — HOME: quitar rectángulo/línea en HERO (.ss-hero)
   (Porto stretch row)
========================================================= */

/* 1) Asegura el MISMO fondo en el área de contenido */
.home .page-content{
  background-color: #f6dfe3 !important; /* <-- pon aquí tu rosa exacto */
}

/* 2) Mata el “marco” solo en la fila del hero */
.home .ss-hero{
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  outline: 0 !important;
}

/* 3) Porto a veces pinta overlay/pseudo-elementos en stretch rows */
.home .ss-hero::before,
.home .ss-hero::after{
  content: none !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* 4) WPBakery inner: quita cualquier fondo/borde que cree el “rectángulo” */
.home .ss-hero .vc_column-inner,
.home .ss-hero .wpb_wrapper{
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* 5) Si Porto mete padding “extra” arriba/abajo generando la franja,
      lo neutralizamos solo aquí */
.home .ss-hero.porto_stretch_css,
.home .ss-hero.stretch_row_css{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* =========================================================
   SUPERSERVIS — GLOBAL: quitar división entre menú (header) y contenido
========================================================= */

/* 1) Header: sin borde ni sombra */
header,
#header,
.header-wrapper,
.main-header,
.sticky-header,
.porto-header,
.header-main{
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* 2) Contenedores internos que suelen meter la línea */
#header .header-main,
#header .header-bottom,
#header .header-top,
.header-top,
.header-bottom{
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* 3) Separadores genéricos */
hr,
.vc_separator,
.separator,
.divider{
  display: none !important;
}

/* 4) A veces el “corte” es border-top del contenido */
.page-content,
main,
#main,
#content{
  border-top: 0 !important;
}

/* =========================================================
   SUPERSERVIS — GLOBAL: matar línea residual header→contenido (Porto / sticky)
========================================================= */

/* 1) Quita cualquier borde/sombra en TODOS los niveles del header */
#header,
#header *,
header,
header *{
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  filter: none !important;              /* por si usan drop-shadow */
}

/* 2) Porto suele dibujar la línea con pseudo-elementos */
#header::before,
#header::after,
header::before,
header::after,
#header .header-main::before,
#header .header-main::after,
#header .header-wrapper::before,
#header .header-wrapper::after,
#header .sticky-header::before,
#header .sticky-header::after{
  content: none !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* 3) Si la “línea” es un separador con altura 1px */
#header .header-bottom,
#header .header-main,
#header .header-top,
#header .header-container,
#header .header-row{
  border: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* 4) A veces el corte lo pone el primer bloque del contenido */
main,
#main,
#content,
.page-content{
  border-top: 0 !important;
  box-shadow: none !important;
}
