.otgs-development-site-front-end {
  display: none;
}

/* MAP VIEW (rutas-list / establecimientos-list) START */

#map-view.map-view {
    width: 100%;
    height: 600px;
    border-radius: 8px;
    overflow: hidden;
}

#map-view.map-view:fullscreen,
#map-view.map-view:-webkit-full-screen {
    width: 100% !important;
    height: 100% !important;
    border-radius: 0 !important;
    overflow: visible !important;
}

.gm-style-iw-d {
    overflow: hidden !important;
    max-height: none !important;
}

.map-info {
    width: 240px;
    font-family: 'Lexend-Regular', sans-serif;
}

.map-info__img {
    display: block;
    width: 100%;
    height: 130px;
    overflow: hidden;
    border-radius: 5px;
    margin-bottom: 10px;
}

.map-info__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.map-info__cnt h3 {
    font-family: 'Lexend-Medium', sans-serif;
    font-size: 16px;
    line-height: 1.3;
    margin: 0 0 8px;
}

.map-info__cnt h3 a {
    color: #8F010A;
    text-decoration: none;
}

.map-info__cnt h3 a:hover {
    color: #FDB137;
}

.map-info__cnt p {
    font-size: 13px;
    line-height: 1.4;
    margin: 0 0 4px;
    color: #303030;
}

.map-info__cnt p a {
    color: #303030;
    text-decoration: none;
}

.map-info__cnt p a:hover {
    color: #8F010A;
}

/* MAP VIEW END */

/* HOME START */

.dormir-main .dormir-img img {
  height: 100%;
  aspect-ratio: 1.46376;
  object-fit: cover;
}

/* HOME END */

/* DESCUBRE START */
.puntos-main .puntos-img img {
  height: 100%;
  aspect-ratio: 0.722126;
  object-fit: cover;
}

/* DESCUBRE END */

/* SINGLE RUTA START */

.menjar-main .menjar-img img {
  height: 100%;
  aspect-ratio: 1.46376;
  object-fit: cover;
}

.ruta-img-slide .swiper-slide img {
  width: 100%;
  aspect-ratio: 1.684065989;
  object-fit: cover;
}

.ruta-wikiloc-embed {
  float: left;
  width: 100%;
  margin-top: 20px;
}

.ruta-wikiloc-embed iframe {
  width: 100%;
  height: 500px;
  border: 0;
  border-radius: 5px;
}

/* SINGLE RUTA END */

/* SLIDER SIMPLE START */

.rutes-main .rutes-img img {
  height: 100%;
  aspect-ratio: 1.340579;
  object-fit: cover;
}

/* SLIDER SIMPLE END */

/* PATRIMONIO EDIFICIOS START */

.patrimonio-edificios-sec {
  float: left;
  width: 100%;
  background: #FFF7EB;
  padding: 40px 0 60px;
}

.patrimonio-edificios-sec h2 {
  font-family: 'Lexend-Medium';
  color: #8F010A;
  font-size: 50px;
  line-height: 65px;
  letter-spacing: 0.02px;
  padding-bottom: 20px;
}

.patrimonio-edificios-sec .item-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  list-style: none;
  padding: 0;
  margin: 0 0 40px;
}

.patrimonio-edificios-sec .item-list > li {
  list-style: none;
}

.patrimonio-edificios-sec .venure-btn {
  text-align: center;
}

.patrimonio-edificios-sec .venure-btn a {
  display: inline-flex;
}

body.page-template-patrimonio .inner-ban-list-sec,
body.page-template-turismo-cine .inner-ban-list-sec { padding-bottom: 60px; }
body.page-template-patrimonio .patrimonio-edificios-sec h2,
body.page-template-turismo-cine .patrimonio-edificios-sec h2 { padding-bottom: 35px; }

/* PATRIMONIO EDIFICIOS END */

/* SLIDER HERO START */

/* Home (.slider): trapezi adaptat al text per evitar tall a viewports amples / zoom out */
.slider .swiper-slide .banner-caption {
    width: fit-content;
    max-width: 90vw;
}

.inner-slider .banner-caption {
    width: fit-content;
    max-width: 90vw;
}

.inner-slider .banner-caption h1 {
    font-size: clamp(35px, 4vw, 70px);
    line-height: 1.2;
    overflow-wrap: break-word;
    word-wrap: break-word;
    hyphens: auto;
}

/* SLIDER HERO END */

/* BANNER HM-AREA START */

.hm-area-ban .ban-content {
    max-width: max(600px, calc((100vw - 1170px) / 2 + 500px));
}

/* BANNER HM-AREA END */

/* PAGINATION START */

.pagination ul {
  max-width: 100%;
  flex-wrap: wrap;
  row-gap: 8px;
}

.pagination ul li a.prev-arw,
.pagination ul li a.next-arw {
  width: auto;
  height: auto;
  border-radius: 0;
}

.pagination ul li a.prev-arw:hover {
  background: url("../../resources/ver1/images/dble-left-arr.svg") no-repeat
    scroll left center;
  color: #303030;
}

.pagination ul li a.next-arw:hover {
  background: url("../../resources/ver1/images/dble-right-arr.svg") no-repeat
    scroll right center;
  color: #303030;
}

.pagination ul li a.prev-arw,
.pagination ul li a.next-arw {
  display: inline-block;
  line-height: 21px;
}

.pagination ul li:has(> a.prev-arw),
.pagination ul li:has(> a.next-arw) {
  display: flex;
  align-items: center;
}

/* PAGINATION END */

/* SINGLE ESTABLECIMIENTO START */

ul.data-list.estab-data-list li {
  align-items: flex-start;
}

ul.data-list.estab-data-list li > div:first-child {
  flex: 0 0 auto !important;
}

ul.data-list.estab-data-list li > div:last-child {
  flex: 1 1 auto !important;
  min-width: 0;
  word-break: break-word;
}

.single-establecimiento-content p {
  float: left;
  width: 100%;
  color: #303030;
  font-size: 15px;
  line-height: 27px;
  font-family: "Lexend-Light";
  padding-bottom: 15px;
}

.estab-map-sec {
  float: left;
  width: 100%;
  margin-top: 30px;
}

.estab-map-sec #fichamap {
  width: 100%;
  height: 350px;
}

.estab-map-sec a {
  display: inline-block;
  margin-top: 10px;
  color: #8f010a;
  text-decoration: underline;
  font-family: "Lexend-Medium";
}

/* SINGLE ESTABLECIMIENTO END */

/* DESCARGABLES START */

.download-main .download-img img {
    height: 100%;
    aspect-ratio: 0.70709;
    object-fit: cover;
}

/* DESCARGABLES END */

/* CONTACTO FORM (6tems-forms plugin) START */

/* Reset llista del plugin perquè usi el grid de la maqueta */
.contact-form .SistemsFormularioForm .consult-list ul {
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
}

.contact-form .SistemsFormularioForm .consult-list ul li.col-1 {
    float: left;
    width: 100%;
    margin-bottom: 14px;
    position: relative;
    padding: 0;
    list-style: none;
}

.contact-form .SistemsFormularioForm .consult-list ul li .count {
    float: left;
    width: 100%;
    position: relative;
}

/* Inputs i textarea (alta especificitat per superar formulario.css del plugin) */
.contact-form .SistemsFormularioForm .consult-list ul li input[type="text"],
.contact-form .SistemsFormularioForm .consult-list ul li input[type="email"],
.contact-form .SistemsFormularioForm .consult-list ul li input[type="tel"],
.contact-form .SistemsFormularioForm .consult-list ul li input[type="number"],
.contact-form .SistemsFormularioForm .consult-list ul li textarea {
    width: 100%;
    color: #303030;
    font-family: 'Lexend-Regular';
    padding: 22px 20px 8px;
    height: 55px;
    border-radius: 7px;
    border: none;
    border-bottom: none;
    font-size: 16px;
    line-height: normal;
    transition: all .5s ease;
    background: #fff;
    box-shadow: none;
}

.contact-form .SistemsFormularioForm .consult-list ul li textarea {
    resize: none;
    height: 130px;
    line-height: 22px;
    padding: 25px 20px 10px;
}

/* Floating label (p.txt) generat per JS */
.contact-form .SistemsFormularioForm .count p.txt {
    color: #4C4E54;
    cursor: text;
    font-size: 16px;
    line-height: 24px;
    font-family: 'Lexend-Regular';
    position: absolute;
    pointer-events: none;
    top: 15px;
    left: 20px;
    transition: all 0.5s ease;
    background: transparent;
    padding: 0;
    margin: 0;
}

.contact-form .SistemsFormularioForm .count p.txt.focus {
    top: 10px;
    left: 15px;
    font-size: 10px !important;
    line-height: 12px !important;
    color: #0D413B !important;
    background: #fff;
    text-transform: uppercase;
    padding: 0 5px;
}

/* Amaga el placeholder natiu (perquè ara fem servir floating label) */
.contact-form .SistemsFormularioForm input::placeholder,
.contact-form .SistemsFormularioForm textarea::placeholder {
    color: transparent;
}

/* Evita el fons blau de l'autofill de Chrome */
.contact-form .SistemsFormularioForm input:-webkit-autofill,
.contact-form .SistemsFormularioForm input:-webkit-autofill:hover,
.contact-form .SistemsFormularioForm input:-webkit-autofill:focus,
.contact-form .SistemsFormularioForm textarea:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
    -webkit-text-fill-color: #303030 !important;
    transition: background-color 9999s ease-in-out 0s;
}

/* Radio com a checkbox visual (substitueix l'estil del plugin) */
.contact-form .SistemsFormularioForm .consult-list ul li .radio-btn {
    float: left;
    width: 100%;
    margin-bottom: 0;
}

.contact-form .SistemsFormularioForm .consult-list ul li .radio-btn > div {
    position: relative;
    padding-left: 35px;
    min-height: 20px;
}

.contact-form .SistemsFormularioForm .consult-list ul li .radio-btn > div label {
    line-height: 20px;
    vertical-align: top;
    padding-top: 10px;
}

.contact-form .SistemsFormularioForm .consult-list ul li .radio-btn input[type="radio"] {
    position: absolute;
    width: 1px;
    height: 1px;
    left: 0;
    top: 0;
    visibility: hidden;
    opacity: 0;
}

.contact-form .SistemsFormularioForm .consult-list ul li .radio-btn [type="radio"]:checked + label,
.contact-form .SistemsFormularioForm .consult-list ul li .radio-btn [type="radio"]:not(:checked) + label {
    color: #0D413B;
    cursor: pointer;
    letter-spacing: 0.4px;
    font-family: 'Lexend-Regular';
    font-size: 14px;
    padding-left: 0;
    position: static;
    float: none;
    width: auto;
    line-height: 20px;
    margin-bottom: 0;
    text-align: left;
    display: inline-block;
}

/* No faig position:relative al label perquè el ::before quedi ancorat al wrapper > div */

.contact-form .SistemsFormularioForm .consult-list ul li .radio-btn label::before {
    content: "";
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px solid #8F010A;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    transition: all 0.3s ease;
    box-sizing: border-box;
}

.contact-form .SistemsFormularioForm .consult-list ul li .radio-btn input[type="radio"]:checked + label::before {
    background: #8F010A;
}

/* Estat error: radio requerit no marcat */
.contact-form .SistemsFormularioForm .consult-list ul li .radio-btn.has-error label::before {
    border-color: #d92d20;
}

.contact-form .SistemsFormularioForm .consult-list ul li .radio-btn.has-error label {
    color: #d92d20;
}

.contact-form .SistemsFormularioForm .consult-list ul li .error-msg {
    color: #d92d20;
    font-family: 'Lexend-Regular';
    font-size: 13px;
    line-height: 18px;
    margin: 6px 0 0;
    padding-left: 35px;
    width: 100%;
    float: left;
}

/* Cancel·lem el ::after taronja del plugin */
.contact-form .SistemsFormularioForm .consult-list ul li .radio-btn [type="radio"]:checked + label::after,
.contact-form .SistemsFormularioForm .consult-list ul li .radio-btn [type="radio"]:not(:checked) + label::after {
    content: none;
    display: none;
    background: transparent;
}

/* Botó submit (alta especificitat per superar formulario.css) */
.contact-form .SistemsFormularioForm .enviar-btn {
    float: right;
    width: auto;
    margin-top: 30px;
    padding: 0;
}

.contact-form .SistemsFormularioForm .enviar-btn button[type="submit"] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 46px;
    height: 42px;
    margin-top: 0;
    border-radius: 5px;
    background: #FDB137;
    border: 1px solid #FDB137;
    color: #303030;
    font-size: 15px;
    font-family: 'Lexend-SemiBold';
    text-align: center;
    text-transform: uppercase;
    transition: all 0.5s ease;
    float: none;
}

.contact-form .SistemsFormularioForm .enviar-btn button[type="submit"]:hover {
    background: #8F010A;
    color: #fff;
    border-color: #8F010A;
}

/* Evita que el :focus/active aplicti l'estil de hover */
.contact-form .SistemsFormularioForm .enviar-btn button[type="submit"]:focus,
.contact-form .SistemsFormularioForm .enviar-btn button[type="submit"]:focus-visible,
.contact-form .SistemsFormularioForm .enviar-btn button[type="submit"]:active {
    background: #FDB137;
    color: #303030;
    border-color: #FDB137;
    outline: none;
}

/* Segon .enviar-btn (loader + form-response): ocupa tot, s'amaga si buit */
.contact-form .SistemsFormularioForm .enviar-btn:has(.form-response) {
    float: left;
    width: 100%;
    margin-top: 0;
    clear: both;
    padding: 0;
}

.contact-form .SistemsFormularioForm .form-response:empty {
    display: none;
}

.contact-form .SistemsFormularioForm .enviar-btn:has(.form-response:empty):has(.loader[style*="display: none"]) {
    display: none;
}

/* CONTACTO FORM END */

/* FIX HEADER START */

header {
    z-index: 1001;
}
.mobile-menu {
    z-index: 1002;
    overflow-y: auto;
    padding-bottom: 80px;
}
.cbp-hrmenu > ul, .cbp-hrmenu .cbp-hrsub-inner {
    column-gap: 50px;
}
.mobile-search {
    z-index: 1002;
}

/* Selector d'idiomes — override del color hover injectat per 6tems-events (events-nice-select-inline-css) */
.select-lang .nice-select:hover {
    color: #FFFFFF;
}

.select-lang .nice-select:hover::after,
.select-lang .nice-select:focus::after,
.select-lang .nice-select.open::after {
    border-bottom-color: #FFFFFF !important;
    border-right-color: #FFFFFF !important;
}

.select-lang .nice-select .list .option {
    display: block;
}

/* Amaga el selector quan no hi ha cap idioma a mostrar */
.select-lang:has(select:empty) {
    display: none;
}

/* Submenu */
.cbp-hrsub-inner-lft .menu-rht > ul li a {
    height: auto;
    min-height: 53px;
    padding-top: 8px;
    padding-bottom: 8px;
    line-height: 1.2;
    text-align: left;
    justify-content: flex-start;
}

/* FIX HEADER END */

/* PAGINA LEGAL START */

.legal-sec {
    padding: 40px 0 80px;
}

.legal-sec .legal-content {
    color: #303030;
    font-family: 'Lexend-Light';
    font-size: 15px;
    line-height: 27px;
}

.legal-sec .legal-content h2,
.legal-sec .legal-content h3,
.legal-sec .legal-content h4 {
    font-family: 'Lexend-Medium';
    color: #8F010A;
    margin: 30px 0 15px;
}

.legal-sec .legal-content h2 { font-size: 28px; line-height: 34px; }
.legal-sec .legal-content h3 { font-size: 22px; line-height: 28px; }
.legal-sec .legal-content h4 { font-size: 18px; line-height: 24px; }

.legal-sec .legal-content p {
    margin: 0 0 15px;
}

.legal-sec .legal-content ul,
.legal-sec .legal-content ol {
    margin: 0 0 15px 20px;
    padding-left: 20px;
}

.legal-sec .legal-content ul li { list-style: disc; margin-bottom: 8px; }
.legal-sec .legal-content ol li { list-style: decimal; margin-bottom: 8px; }

.legal-sec .legal-content a {
    color: #8F010A;
    text-decoration: underline;
}

.legal-sec .legal-content a:hover {
    color: #FDB137;
}

/* PAGINA LEGAL END */


/* DIRECTORIO EQUIPAMIENTOS START */

.directorio-sec .info { white-space: normal; overflow-wrap: anywhere; word-break: break-word; }
.directorio-sec .info > span:not([class*="-icon"]) { overflow-wrap: anywhere; min-width: 0; }
.directorio-sec .info > span[class*="-icon"] { flex-shrink: 0; }

.directorio-sec thead th:first-child,
.directorio-sec tbody td:first-child { padding-right: 10px; }
.directorio-sec .info a[href^="tel:"] { white-space: nowrap; }

/* DIRECTORIO EQUIPAMIENTOS END */


/* COMO LLEGAR START */

.arribar-map #map-arribar { height: 525px; }

/* COMO LLEGAR END */


/* MAPA PLUGIN START */

/* SVG plugin */
.mapa-sec .right-arrow img { filter: brightness(0) invert(1); }

/* Sobreescriu el placeholder del plugin (turquesa) amb un en paleta granat. */
.mapa-sec .rutes-img-sec img[src*="placeholder.svg"] {
    content: url('../images/placeholder-map.svg');
}

/* Botons inferiors detail (Veure fitxa, Compartir, Descarregar): separacio
   horitzontal i vertical entre items perque no quedin enganxats. */
.mapa-sec .btm-btn ul {
    column-gap: 12px !important;
    row-gap: 12px !important;
}
.mapa-sec .btm-btn ul li { flex: 1 1 calc(50% - 12px) !important; }

/* MAPA PLUGIN END */


/* TURISMO DE CINE START */

/* Card amb video: play overlay sobre la imatge. */
.rodajes-sec .rodaje-video-link { display: block; }
.rodajes-sec .play-ico {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 56px; height: 56px;
    border-radius: 50%;
    background: rgba(255,255,255,0.85);
    pointer-events: none;
    transition: background .3s ease;
}
.rodajes-sec .play-ico::after {
    content: '';
    position: absolute;
    top: 50%; left: 55%;
    transform: translate(-50%, -50%);
    width: 0; height: 0;
    border-style: solid;
    border-width: 10px 0 10px 16px;
    border-color: transparent transparent transparent #8F010A;
}
.rodajes-sec .rutes-main.has-video:hover .play-ico { background: #FDB137; }

/* Propuestas: 2 columnes */
.propuestas-sec { float: left; width: 100%; padding: 60px 0; }
.propuestas-sec h2 {
    font-family: 'Lexend-Medium';
    color: #8F010A;
    font-size: 50px;
    line-height: 65px;
    letter-spacing: 0.02px;
    padding-bottom: 20px;
}
.propuestas-sec .propuestas-intro {
    font-family: 'Lexend-Light';
    color: #303030;
    font-size: 15px;
    line-height: 27px;
    margin-bottom: 30px;
}
.propuestas-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px 30px;
    list-style: none;
    padding: 0;
    margin: 0 0 40px;
}
.propuestas-list > li { list-style: none; }
.propuesta-item { display: flex; gap: 18px; align-items: flex-start; }
.propuesta-img { flex: 0 0 180px; border-radius: 5px; overflow: hidden; }
.propuesta-img img { width: 100%; height: 100%; aspect-ratio: 1.15; object-fit: cover; display: block; }
.propuesta-txt { flex: 1 1 auto; min-width: 0; }
.propuesta-txt h3 {
    font-family: 'Lexend-Medium';
    color: #303030;
    font-size: 24px;
    line-height: 30px;
    margin: 0 0 8px;
    transition: color 0.5s ease;
}
.propuesta-item:hover .propuesta-txt h3 { color: #8F010A; }
.propuesta-txt p {
    font-family: 'Lexend-Light';
    color: #303030;
    font-size: 14px;
    line-height: 22px;
    margin: 0;
}
.propuesta-desc { max-width: 80%; }

/* Botons inferior */
.cine-btns {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    margin-top: 50px;
}
.cine-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    padding: 0 30px;
    border-radius: 5px;
    background: #FDB137;
    color: #303030;
    font-family: 'Lexend-Medium';
    font-size: 15px;
    text-decoration: none;
    border: 2px solid #FDB137;
    transition: all .4s ease;
}
.cine-btn:hover { background: #8F010A; border-color: #8F010A; color: #fff; }

/* TURISMO DE CINE END */