@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600&display=swap');

/* ============================================================
   Punctum Studio — Custom CSS
   Branch: feature/home-build
   ============================================================ */

/* BUG 6: Hero banner — responsive background images */
.banner-area .banner-item {
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

.banner-area .banner-item.full-height .row.align-items-center {
  min-height: 100vh;
}

.banner-area .banner-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Marble background — global body texture from Luxa demo */
body {
  background-image: url('/wp-content/uploads/2019/03/bg-body1.jpg');
  background-repeat: repeat;
  background-attachment: fixed;
  background-size: auto;
}

/* BUG 7: Marble/stone background for services section */
.bg-marble,
.vc_row.bg-marble {
  background: linear-gradient(135deg, #f5f0eb 0%, #ede8e0 50%, #f5f0eb 100%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='400' height='400' filter='url(%23noise)' opacity='0.03'/%3E%3C/svg%3E"), linear-gradient(135deg, #f5f0eb 0%, #ede8e0 50%, #f5f0eb 100%);
}

/* Brand logos — grayscale por defecto, color al hover */
.brand-item img {
  filter: grayscale(100%);
  opacity: 0.75;
  transition: filter 0.3s ease, opacity 0.3s ease;
}
.brand-item:hover img {
  filter: grayscale(0%);
  opacity: 1;
}

/* Fix: header-space — real header height is 95px (was 60px in main.css) */
.header-space {
  height: 95px;
}

/* Fix: sección bajo header no ocupa 100% del ancho (BUG full-width vc_row) */
/* Causa: main-container { overflow: hidden } corta los vc_row full-width que WPBakery
   posiciona con margin-left negativo y width: 100vw al inicializar el JS.
   Seguro: body { overflow-x: hidden } ya previene scroll horizontal. */
.main-container {
  overflow: visible;
}

/* Raleway font — menú principal y submenús (coincide con web antigua punctumstudio.es) */
.navigation .menu > li > a {
  font-family: "Raleway", sans-serif !important;
  font-weight: 500 !important;
}
.navigation .sub-menu li a,
.navigation .children li a {
  font-family: "Raleway", sans-serif;
}

/* Menu scroll: fondo negro en lugar de gris — 2026-05-21 */
.site-header.fixed {
    background-color: rgba(0, 0, 0, 0.75) !important;
}
/* Submenús: fondo negro coherente con header en scroll */
.site-header.fixed .navigation .sub-menu,
.site-header .navigation .sub-menu {
    background-color: rgba(0, 0, 0, 0.88) !important;
}
.site-header.fixed .navigation .sub-menu a,
.site-header .navigation .sub-menu a {
    color: #ffffff !important;
}

/* Restaurar color acento #feb406 del tema en hover/activos de menú y submenú */
.navigation .menu > li > a:hover,
.navigation .menu li.current-menu-item > a,
.navigation .menu li.current-menu-ancestor > a,
.navigation .menu li.current_page_item > a,
.navigation .menu li.current_page_parent > a,
.site-header .navigation .sub-menu li.current-menu-item > a,
.site-header .navigation .sub-menu li.current-menu-ancestor > a,
.site-header .navigation .sub-menu li.current_page_item > a,
.site-header .navigation .sub-menu li.current_page_parent > a,
.site-header .navigation .sub-menu li:hover > a,
.site-header .navigation .children li.current-menu-item > a,
.site-header .navigation .children li:hover > a {
    color: #feb406 !important;
}

/* Portfolio section — márgenes laterales uniformes */
.vc_row-69f890a443668 {
    padding-left: 40px !important;
    padding-right: 40px !important;
}
.vc_row-69f890a443668 .wpb_column:first-child .vc_column-inner {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* Hero banner — full-width via 100vw: .wpb_column hereda ancho container (1140px);
   left:50% + translateX(-50%) escapa el container y centra en viewport */
.vc_row-69f9fbd7d7daa .banner-area {
    position: relative !important;
    width: 100vw !important;
    max-width: 100vw !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}


/* Stats section lf878 — fondo oscuro y bordes garantizados (WPBakery CSS cache bypass) */
.vc_custom_lf878_stats {
  border-top: 1px solid #444444 !important;
  border-bottom: 1px solid #444444 !important;
  background-color: rgba(0, 0, 0, 0.2) !important;
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

/* Brand logos — desactivar click (links a href="#" causaban scroll al top) */
.brand-block-lf878-brands-001 .brand-item a {
  pointer-events: none !important;
  cursor: default !important;
}