:root {
    --hint-color: #8b2c2c;
    --base-color: #1f2a44;    
    --base-color-dark: #0d1935;
    --base-color-light: #2c3447;
    --hint-color-light: #ce9191;
    --hint-color-dark: #8b2c2c75;
    --hint-color-extralight: #ffbdbd54;
    --extra-color: #f2b705;
    --club-header-bg-color: #FFF;
    --club-header-font-color: #1f2a44 ;
    --club-header-font-color-hover: #8b2c2c ;
  }
.compositor-wrapper .compositor-block-header {
    font-weight: 900;
    font-family: "Roboto", sans-serif;
}

.compositor-wrapper .compositor-block-titleblock h2 {
    font-weight: 400;
    font-family: "Roboto", sans-serif;
}



.compositor-wrapper .compositor-block-accordion .compositor-block-accordion-item {
    border-bottom: 1px solid #1f2a44;
}

.compositor-wrapper .compositor-block-accordion .compositor-block-accordion-item-title:hover {
    background-color: #1f2a44;
}

.compositor-wrapper .compositor-block-accordion .compositor-block-accordion-item-content {
    border: 1px solid #1f2a44;
}

.compositor-wrapper .compositor-block-accordion .compositor-block-accordion-item.open .compositor-block-accordion-item-title {
    background-color: #1f2a44;
}
/* Dropdown menu styles */
.header-menu-group-container {
    position: relative;
    display: inline-block;
}

.header-menu-group-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    min-width: 200px;
    z-index: 1000;
    padding: 8px 0;
}

.header-menu-group-container:hover .header-menu-group-dropdown {
    display: block;
}

.header-menu-group-block-link {
    display: block;
    padding: 10px 20px;
    color: #333;
    text-decoration: none;
    transition: background-color 0.2s ease;
}

.header-menu-group-block-link:hover {
    background-color: #f5f5f5;
}

#header-wrapper {
    background-color: var(--club-header-bg-color);
    color: var(--club-header-font-color);
}

#header-wrapper .header-navigation-menu a.header-menu-item,
#header-wrapper .header-navigation-extras a,
#header-wrapper .header-navigation-extras .header-navigation-extras-icon,
#header-wrapper .header-navigation-catalogue-mobile-wrapper a {
    color: var(--club-header-font-color);
}

#header-wrapper .header-navigation-menu a.header-menu-item:hover,
#header-wrapper .header-navigation-extras a:hover,
#header-wrapper .header-navigation-extras .header-navigation-extras-icon:hover,
#header-wrapper .header-navigation-catalogue-mobile-wrapper a:hover {
    color: var(--club-header-font-color-hover);
}

#header-wrapper .header-navigation-extras #header-navigation-extras-menu-mobile {
    border-color: var(--club-header-font-color);
}

#header-wrapper .header-navigation-extras #header-navigation-extras-menu-mobile svg path {
    fill: var(--club-header-font-color);
}


@media screen and (max-width: 950px) {
    #header-wrapper .header-navigation-extras .header-navigation-extras-account-link {
        display: block;
    }

}




.archive-wrapper .archive-sidebar {
    justify-content: center;
    padding-top: 40px;
    padding-bottom: 40px;
    --texture-opacity:0.08;          /* intensidad de textura */
    --wm-opacity:0.08;               /* opacidad marca de agua */
    --swoosh-opacity:0.10;           /* opacidad swoosh */
    background-color:var(--hint-color);
    overflow:hidden;                  /* recorta decoraciones */
}


.archive-wrapper .archive-sidebar .archive-sidebar-club-content {
    transform: rotate(-180deg);
    writing-mode: vertical-lr;
    text-orientation: mixed;
    font-size: 70px;
    color: #FFF;
    font-weight: 400;
}

.archive-wrapper .archive-sidebar .archive-sidebar-club-content{
    transform:rotate(-180deg);
    writing-mode:vertical-lr;
    text-orientation:mixed;
    font-size:70px;color:#fff;font-weight:600;
    letter-spacing:2px;
    /* legibilidad en fondos claros/ruidosos */
    text-shadow:0 1px 2px rgba(0,0,0,.08);
}

.archive-sidebar.is-gradient{
    background-image:
      linear-gradient(180deg, rgba(0,0,0,.06), rgba(255,255,255,.00) 40%, rgba(0,0,0,.10)),
      linear-gradient(180deg, var(--hint-color), var(--hint-color-dark));
    background-blend-mode:soft-light, normal;
}


.archive-sidebar.has-texture{
    background-image:
      repeating-linear-gradient(
        135deg,
        rgba(255,255,255, var(--texture-opacity)) 0px,
        rgba(255,255,255, var(--texture-opacity)) 2px,
        rgba(0,0,0, 0) 2px,
        rgba(0,0,0, 0) 8px
      ),
      linear-gradient(180deg, var(--hint-color), var(--hint-color-dark));
    background-blend-mode:overlay, normal;
}


.archive-sidebar.has-watermark .archive-sidebar-club-logo{
    content:"";
    position:absolute; inset:0;
    background-image: var(--club-logo-sidebar);
    background-repeat:no-repeat;
    background-position:center 60%;
    background-size: 70% auto;         /* ajusta tamaño del escudo */
    opacity: var(--wm-opacity);
    pointer-events:none;
    filter: saturate(90%) contrast(110%);
}


.archive-sidebar.has-swoosh::before{
    content:"";
    position:absolute;
    width:160%; height:60%;
    left:-30%; top:5%;
    transform:skewY(-10deg);
    background:
      linear-gradient(90deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,var(--swoosh-opacity)) 35%,
        rgba(255,255,255,0) 70%);
    border-radius:40% 60% 40% 60%/60% 40% 60% 40%;
    pointer-events:none;
    mix-blend-mode:soft-light;
}


#category-nav-buttom {
    display: none !important;
}
    
.contact-wrapper .contact-info-content p {
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 30px;
}
    

.contact-wrapper .contact-info-content p b {
    font-weight: 600;
}

.contact-wrapper .contact-details {
    max-width: 450px;
}

.contact-wrapper .contact-info img {
    max-height: 400px;
}

@media (max-width: 1300px) {
    .contact-wrapper .contact-details {
        max-width: 350px;
    }
}
.footer-wrapper {
    background-color: var(--base-color);
    display: flex;
    flex-direction: column;
    gap: 30px;
    justify-content: center;
    align-items: center;
    padding-top: 40px;
    padding-bottom: 20px;
    margin-top: 60px;
    border-top: 2px solid var(--base-color-dark);
}


.footer-wrapper.club {
    background-color: var(--hint-color);
    border-top: 2px solid var(--hint-color);
}