/*
Theme Name: Cactus
Theme URI: http://www.cactussenygrafic.com/
Version: 1.0
Description: Plantilla desenvolupada per Cactus
Author: Cactus Seny Grafic
Author URI: https://www.cactussenygrafic.com/
Template: Divi
*/
@font-face {
    font-family: 'Almarena Display';
    src: url('fonts/AlmarenaDisplayBold.woff2') format('woff2'),
        url('fonts/AlmarenaDisplayBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Almarena Display';
    src: url('fonts/AlmarenaDisplayLight.woff2') format('woff2'),
        url('fonts/AlmarenaDisplayLight.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Almarena Display';
    src: url('fonts/AlmarenaDisplayRegular.woff2') format('woff2'),
        url('fonts/AlmarenaDisplayRegular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



:root{
	--offcanvas_up_ini: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
	--offcanvas_right_ini: polygon(100% 0, 100% 0%, 100% 100%, 100% 100%);;
	--offcanvas_down_ini: polygon(0 0, 100% 0%, 100% -10%, 0 0);
	--offcanvas_left_ini: polygon(0 0, 0 0, 0 100%, 0% 100%);
	--offcanvas_fin: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
	--animation_timing:cubic-bezier(.785,.135,.15,.86);
}

/** font custom **/
body, p, h1, h2, h3, h4, h5, h6, a, span:not(.ab-icon), li, div, td, th, label, input, textarea, button, .almarena {font-family: 'Almarena Display', 'Helvetica', 'Arial', sans-serif;}
body{font-weight: 400;}

.title-separator-animation h1>*,
.title-separator-animation h2>*,
.title-separator-animation h3>*,
.title-separator-animation h4>*,
.title-separator-animation h5>*,
.title-separator-animation p>*{overflow: hidden;padding-bottom: 10px;margin-top: -10px;}

.align-bottom{align-items: baseline;}

.marquee .js-marquee{line-height: 1;}
.marquee .js-marquee span{margin:0 0.5ch;}
.marquee .js-marquee span:after{content:'·'; padding-left: 0.5ch;}

.marquee_card{overflow: hidden;}
.marquee_card .et_parallax_bg_wrap{transition: all 0.5s ease-in-out;}
.marquee_card .et_pb_text_inner{opacity: 0; transition: all 0.5s ease-in-out; transition-delay: 0.25s;}
.marquee_card:hover .et_parallax_bg_wrap{filter:blur(15px);}
.marquee_card:hover .et_pb_text_inner{opacity: 1;}


/*
body.home header.et-l--header:not(.fixed) .menu_icons, body.home header.et-l--header:not(.fixed) .menu_lang{filter: invert(1);}
body.home header.et-l--header:not(.fixed) .et_pb_menu--with-logo .et_pb_menu__menu>nav>ul>li>a{color:#fff !important}
body.home header.et-l--header:not(.fixed) .et_pb_menu--with-logo .et_pb_menu__logo{background-image: url('../../uploads/2025/05/logo_catalonia_white.svg'); background-size: 100%;}
body.home header.et-l--header:not(.fixed) .et_pb_menu--with-logo .et_pb_menu__logo img{opacity: 0;}
body.home .entry-content .et-l--post .et_pb_section:first-child{margin-top: 0px !important;}
body.home header.et-l--header:not(.fixed) .catalonia_menu .menu-item a{color:#fff !important}
body.home header.et-l--header:not(.fixed) .catalonia_logo a .et_pb_image_wrap picture img{opacity: 0;}
*/

html.js.et-fb-preview--desktop.et-tb-html.et-fb-root-ancestor.et_fb_event_mode.et_fb_event_mode--click {
  overflow: auto !important;
}

.dsm_card_carousel_child_image_wrapper{overflow: hidden;}
.dsm_card_carousel_child_image_wrapper .dsm_card_carousel_child_img{transform: scale(1.1); transition: all 0.5s ease-in-out;}
.dsm_card_carousel_child_image_wrapper:hover .dsm_card_carousel_child_img{transform: scale(1.15) !important;}

.dsm-perspective-image-wrapper .et_pb_image_wrap{overflow: hidden;} 
.dsm-perspective-image-wrapper .et_pb_image_wrap img{transform: scale(1.1);}
.offcanvas_card .dsm_card_image_wrapper{overflow: hidden;} 
.offcanvas_card .dsm_card_image_wrapper .dsm_card_image_background{transition:all 0.5s ease-in-out;}
.offcanvas_card:hover .dsm_card_image_wrapper .dsm_card_image_background{transform: scale(1.1);}

html:not(.et-tb-html) .offcanvas {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999999;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
  }

.offcanvas.animation_down  {position:fixed !important; z-index:99999; top:0px; left: 0px; clip-path: var(--offcanvas_down_ini)}



.offcanvas.animation_down.active{animation-name: offcanvas_animation_down; overflow-y: auto;}
.offcanvas .et_pb_row_2_tb_header{height: fit-content !important;}
.offcanvas .et_pb_row_3_tb_header{margin-top: 0px !important;} 
.offcanvas .et_pb_row_4_tb_header{height: fit-content !important;}
.offcanvas .et_pb_row_6_tb_header{height: fit-content !important;}

@keyframes offcanvas_animation_down  { 0% { clip-path: var(--offcanvas_down_ini);  } 100% { clip-path: var(--offcanvas_fin); } }
.offcanvas.animation_down.close{animation-name: offcanvas_animation_down_close;animation-iteration-count: 1;animation-fill-mode: forwards;animation-timing-function: var(--animation_timing);}
@keyframes offcanvas_animation_down_close  { 0% { clip-path: var(--offcanvas_fin); } 100% { clip-path: var(--offcanvas_down_ini) } }

.close_offcanvas{cursor: pointer;}

.offcanvas_card{position: relative; margin-bottom: 0px !important;}
.offcanvas_card .dsm_card_wrapper{position: absolute; bottom:30px; left: 30px;}
.offcanvas_card .dsm_card_title{width: 75%;}

.offcanvas_card_column {
    height: 100%; /* o 80vh si quieres más control */
    overflow: hidden;
    display: flex;
    flex-direction: column;
    position: relative;
  }
  
  .offcanvas_scroll_inner {
    flex: 1;
    overflow-y: auto;
    max-height: 100%; /* usa 100% porque el padre ya lo limita */
    -webkit-overflow-scrolling: touch;
    padding-right: 10px;
  }


  .offcanvas_scroll_inner {
    will-change: transform;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
  }

  .offcanvas.active {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    animation-duration: 0.6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-timing-function: var(--animation_timing);
  }
  .offcanvas.active {
    height: 100vh !important;
  }

  body.home .entry-content .et-l--post .et_pb_section:first-child{padding-top: 0px !important;}
  body.home .et_pb_section_0_tb_header{border:0px !important}
  body.home .et-l--header:not(.fixed)  .et_pb_menu--style-inline_centered_logo .et_pb_menu__logo-slot .et_pb_menu__logo a{background-image: url('../../uploads/2025/05/logo_catalonia_white.svg'); background-position: center; background-size: contain; background-repeat: no-repeat;}
  body.home .et-l--header:not(.fixed) .et_pb_menu--style-inline_centered_logo .et_pb_menu__logo-slot .et_pb_menu__logo a img{opacity: 0;}
  .card_background{display: flex; position:relative;}
  .card_background .et_pb_module_inner{margin-top: auto;z-index: 2;}

  .card_background::after {
    content: " ";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 75%;
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(40px);
    -webkit-backdrop-filter: blur(40px);
    z-index: 0;

    /* Aquí está la clave */
    mask-image: linear-gradient(to top, black 0%, transparent 100%);
    -webkit-mask-image: linear-gradient(to top, black 0%, transparent 100%);
    mask-size: 100% 100%;
    -webkit-mask-size: 100% 100%;
}

.slider_home .dsm_card_carousel_child{position: relative;}
.slider_home .dsm_card_carousel_child:after{content: " ";
  position: absolute;
  bottom: 1px;
  left: 1px;
  width: calc(100% - 2px);
  height: 75%;
  background-color: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(40px);
  -webkit-backdrop-filter: blur(40px);

  /* Aquí está la clave */
  mask-image: linear-gradient(to top, black 0%, transparent 100%);
  -webkit-mask-image: linear-gradient(to top, black 0%, transparent 100%);
  mask-size: 100% 100%;
  -webkit-mask-size: 100% 100%;
  opacity: 0;
  transition: all 0.5s ease-in-out;
  z-index: 0;
  mix-blend-mode: multiply;
}
.slider_home .dsm_card_carousel_child .et_pb_module_inner .dsm_card_title{opacity: 0; transition: opacity 0.5s ease-in-out !important; z-index: 1;position: relative;}
.slider_home .dsm_card_carousel_child:hover:after{opacity: 1;}
.slider_home .dsm_card_carousel_child:hover .et_pb_module_inner .dsm_card_title{opacity: 1;}

.mapboxgl-ctrl{display: none !important;}

.accordeon .accordeon_content{display: none; padding-top: 16px;}
.accordeon .accordeon_title{font-size: 24px; cursor: pointer; font-weight: 600;}
.accordeon{border-top: 1px solid #000; border-bottom: 1px solid #000; margin-bottom: -1px !important; padding:20px 0px; cursor: pointer;}
.accordeon .accordeon_content.active{display: block;}

.dp-dfg-image{aspect-ratio: 4 / 3 ;overflow: hidden;}
.dp-dfg-image img {width: 100%;height: 100%;object-fit: cover;object-position: center;display: block;}
.dp-dfg-layout-grid .dp-dfg-item{padding: 0px 3em 2em 3em;    display: flex;flex-direction: column;}
.dp-dfg-layout-grid .dp-dfg-image {margin: 0 -3em; margin-bottom: 2em;}
.dpdfg_filtergrid_0_tb_body .dp-dfg-item .et_pb_button_wrapper.read-more-wrapper{margin-top: auto;padding:0px !important}


.offcanvas_card .dsm_card_image_wrapper .dsm_card_image_background:after{content:" "; width: 100%; height: 100%; background: linear-gradient(180deg,rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
 position: absolute; top: 0; left: 0;display: block; opacity: 0.5;}


.csg_espaciocolumnas > .et_pb_column{width: calc(25.4% - 20px) !important; margin-right:20px !important;}





.catalonia_menu .et_pb_menu__menu, .catalonia_menu .et_pb_menu__menu .et-menu-nav, .catalonia_menu .et_pb_menu__menu .et-menu-nav .et-menu { width: calc(100% + 22px) !important; display: flex !important; }



.catalonia_menu .et_pb_menu__menu .et-menu-nav .et-menu li.m-left-auto{margin-left:auto !important;}

@media (max-width:650px){

  .header_row{display: flex !important;}
  .header_row .et_pb_text a:has(img){display: none !important;}
  .header_row .et_pb_column{margin-bottom: 0px !important;}

  .header_row .et_pb_column_1_4{width: fit-content !important;}
  .header_row .et_pb_column_1_4 .et_pb_text{width: fit-content !important;}
  .header_row .et_pb_column_1_4 .et_pb_text p{white-space: nowrap; margin-right: -3ch; margin-left: 1ch;}
  .et_pb_module .mobile_menu_bar:before{top: 0 !important;}


  .offcanvas_first_row{display: flex;}
  .offcanvas_first_row .et_pb_column_1_2{margin-bottom: 0px !important;}
  
  


  .offcanvas_scroll_inner{display: flex;flex-direction: column; padding:0px}
  .offcanvas_card{
        margin-bottom: 10px !important;
        margin-left: 10px !important;
        margin-right: 10px !important;
    }
  .offcanvas_card .et_pb_module_inner{height: 320px;}
  .offcanvas_card .et_pb_module_inner .dsm_card_image_wrapper{height: 320px !important;}
  .offcanvas_card .dsm_card_wrapper{padding: 0 !important;}


  .offcanvas .et_pb_row_2_tb_header .et_pb_column_1_4, .et_pb_row_4_tb_header.et_pb_row .et_pb_column_1_4, .et_pb_row_6_tb_header.et_pb_row .et_pb_column_1_4{margin-bottom: 0px !important;}
  .offcanvas_card h4.dsm_card_title{font-size: 26px !important;}
  .offcanvas_card .et_pb_button_wrapper{font-size: 16px;}

  .offcanvas_card_column{overflow: visible;height: auto;}
    .offcanvas_scroll_inner{position: relative;}

    .csg_espaciocolumnas > .et_pb_column{width: 100% !important;margin:0px 0px 30px 0px !important;}
    .catalonia_menu .et_pb_menu__menu, .catalonia_menu .et_pb_menu__menu .et-menu-nav #menu-menu{display: none !important;}


    .et_pb_column_1_tb_header,
    .et_pb_column_1_tb_header .et_pb_menu,
    .et_pb_column_1_tb_header .et_pb_menu .et_pb_menu_inner_container{position: initial !important;}
    #mobile_menu1{margin-top: 1px !important;}
}