.hm-picafort-sec {
    padding-bottom: 90px;
}

/* Aplica els estils del botó "+ informació" també als <span class="info-btn">
   (la maqueta v1 limita .info-btn a tags <a>; les cards ja viuen dins un <a>
   wrapper i un anidat seria HTML invàlid, així que emetem <span>). */
.info-btn,
a.info-btn {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 45px;
    padding: 0 38px;
    color: #fff;
    font-size: 15px;
    font-family: 'LEMONMILK-Medium';
    letter-spacing: 0.72px;
    border-radius: 30px;
    transition: all 0.5s ease;
    background: #048B98;
    cursor: pointer;
}

.info-btn:hover,
a.info-btn:hover {
    background: #182A3F;
}

/* inner-banner2 (single espai/agenda) no té imatge de fons. La maqueta
   l'organitza amb posicionament absolut que provoca solapaments amb el
   menú del header i amb el caption. Resetem a flow normal amb prou
   padding-top per deixar lloc al menú (que té position:absolute al header). */
.inner-banner2 {
    height: auto;
    min-height: 0;
}

.inner-banner2 .breadcrum {
    position: relative;
    top: auto;
    padding-top: 30px;
    padding-bottom: 60px;
}

.inner-banner2 .inner-ban-caption {
    position: static;
    bottom: auto;
    top: auto;
}

.inner-banner2 .in-ban-lft h1 {
    position: relative;
    bottom: -3px;
    padding-right: 20%;
}

.inner-banner img {
    height: 450px;
}

/* inner-banner1 (listings d'espais) té imatge de fons de 200px d'altura amb
   breadcrum i caption posicionats absolut. El menú del header s'hi superposa
   per z-index. Convertim la imatge a background-cover i posem els continguts
   en flow normal amb padding-top que deixi lloc al menú. */
.inner-banner1 {
    height: auto;
    overflow: hidden;
}

.inner-banner1>img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
    float: none;
}

.inner-banner1 .breadcrum,
.inner-banner1 .inner-ban-caption {
    position: relative;
    z-index: 2;
    top: auto;
    bottom: auto;
}

.inner-banner1 .breadcrum {
    position: relative;
    top: auto;
    padding-top: 30px;
    padding-bottom: 60px;
}

.inner-banner1 .in-ban-lft h1 {
    position: relative;
    bottom: -4px;
}

/* Header integrat amb el banner a totes les pàgines (com a la home).
   jquery.sticky.js crea un .sticky-wrapper amb height = outerHeight del header
   i això reserva espai al flow que separa el banner del header. Forçant
   height: 0 al wrapper, el banner viene al top i el .head-top (que té
   position: absolute) es superposa per damunt amb z-index. */
.sticky-wrapper {
    min-height: 0 !important;
}

/* Platges List */
.plat-top-lft h5>p,
.plat-top-lft .plat-intro > p {
    color: #404040;
    font-size: 22px;
    line-height: 1.5;
    font-family: 'Roboto-Semibold';
}

/* Rutes List */
.plat-top-lft h2>p {
    color: #182A3F;
    font-size: 40px;
    line-height: 1.2;
    font-family: 'LEMONMILK-Medium';
}

.rutes-title-lft h2 {
    font-size: 30px;
    line-height: 1.4;
    margin-bottom: 20px;
}

.ruta-div h2 {
    font-size: 30px;
    line-height: 1.4;
}

.rutes-title-lft p {
    font-size: 20px;
    line-height: 28px;
    color:#182A3F;
}

.rutes-title-sec {
    padding: 60px 0 50px;
    background: #ddeeee96;
}

.page-template-rutes-list .cf-text-imatge .ti-text strong {
	font-family: 'LEMONMILK-Medium';
	color:#182A3F;
}

.page-template-rutes-list .platges-dist-sec {
	background: #DEEFEE;
}

.page-template-rutes-list .platges-dist-top {
	margin-bottom: 0px;
}


/* Dies amb esdeveniment al calendari del filtre d'agenda. jQuery UI envolta
   l'enllaç del dia en <td class="has-event"><a class="ui-state-default">N</a></td>.
   Pintem un punt sota el número per indicar visualment que hi ha activitat. */
.ui-datepicker td.has-event > a.ui-state-default {
    position: relative;
    font-weight: 700;
}

.ui-datepicker td.has-event > a.ui-state-default::after {
    content: "";
    position: absolute;
    bottom: 2px;
    left: 50%;
    transform: translateX(-50%);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #F2A92F;
}

.calendar-clear {
    margin-top: 8px;
    font-size: 13px;
    text-align: right;
}

.calendar-clear a {
    color: #048B98;
    text-decoration: underline;
}

/* Placeholder de card (quan el post no té featured image). La maqueta v1 .espais-img
   no té height pròpia, depèn del <img> real (width:100%) i el seu aspect ratio
   per ocupar espai. Per al placeholder forcem aspect-ratio al contenidor i hi
   fem contain el SVG. Patró replicat del tema hermà enselvat. */
.espais-main .espais-img:has(> a > img.theme-placeholder-img) {
    aspect-ratio: 1.5;
    background: #f4f4f4;
}

.espais-main .espais-img img.theme-placeholder-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 30px;
    opacity: 0.55;
    float: none;
}

.espais-main:hover .espais-img img.theme-placeholder-img {
    transform: scale(1.03);
}

/* Slider d'agenda de la home: les cards han de tenir la mateixa alçada.
   La maqueta v1 .agenda-img no té height pròpia (img width:100%), així que
   imatges amb ratios diferents — i sobretot el placeholder, més petit —
   trenquen l'alineació. Forcem un aspect-ratio comú al contenidor i hi fem
   cover de la imatge real / contain del placeholder. */
.hm-agenda-sec .agenda-main .agenda-img {
    aspect-ratio: 4 / 3;
}

.hm-agenda-sec .agenda-main .agenda-img img {
    height: 100%;
    object-fit: cover;
}

.hm-agenda-sec .agenda-main .agenda-img img.theme-placeholder-img {
    object-fit: contain;
    padding: 30px;
    opacity: 0.55;
    background: #f4f4f4;
}

/* Galeries */
.esp-slider .swiper-slide img {
    aspect-ratio: 1.5;
	object-fit:cover;
}

.esp-slider .swiper-slide {
    border:2px solid #DEEFEE;
}

/* Bloc flexible "Galeria": fora de la columna floated del single, el .swiper-container
   (overflow:hidden = BFC) col·lapsa a width 0 i Swiper no calcula res. Forcem amplada. */
.cf-galeria .swiper-container {
	width: 100%;
}

/* Contingut */
.contingut h2 {
	margin-bottom: 20px;
}

.contingut iframe {
	width: 100%;
	min-height: 550px;
	max-height: 550px;
}

.contingut p strong {
    font-family: 'Roboto-Bold';
}

.contingut p a {
    font-family: 'Roboto-Semibold';
    color: #4EB5B0;
    text-decoration: underline;
}

.contingut p a:hover {
    opacity: 0.7;
}

.contingut h6 a {
    font-family: 'Roboto-Semibold';
    color: #4EB5B0;
    padding: 10px 20px;
    border: 1px solid  #4EB5B0;
}

.contingut hr {
    color: #4EB5B0;
    border: 1px solid #4EB5B0;
    margin-bottom: 20px;
    margin-top: 50px;
}

.contingut .alignleft {
    float: left;
    padding-right: 40px;
}

.contingut h5 { font-size: 16px; color:#182A3F; line-height: 1.4; font-family: 'LEMONMILK-Medium'; text-transform: uppercase; color: #182A3F; letter-spacing: -0.22px; margin-bottom: 20px; }
.contingut li { border-left: 2px solid #4EB5B0; margin-bottom: 10px; padding-left: 15px; }
.single-blog .contingut li { border-left:none; margin-bottom:0px; padding-left:0px; }
.contingut ul { margin-bottom: 20px; color: rgba(51, 51, 51, 0.75); }

.contingut .esp-tag-lst li { border-left:none; margin-bottom: 10px; padding-left:0px; }

/* ── Seccions Descobreix / Planifica ───────────────────────────────────────
   Reutilitzen el grid .hm-quefer de "Què fer", però aquell és un mosaic fix
   pensat per a 7 cards (spans .platjes/.art...). Amb 3/4 cards sense aquelles
   classes el grid quedava amb la 3a columna estreta (0.75fr) i alçada
   irregular. Aquí el normalitzem a columnes iguals i alçada uniforme. Només a
   desktop (>1023px): a tablet/mòbil la maqueta ja passa a 2 columnes / flex i
   funciona amb qualsevol nombre de cards. */
@media screen and (min-width: 1024px) {
    .seccions-grid .grid {
        grid-template-columns: repeat(3, 1fr);
        grid-auto-rows: 380px;
    }
    .seccions-planifica .grid {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 360px;
    }
}


/* Blog */
/* Galeria destacada (llistat + single): amplada completa amb alçada uniforme.
   La maqueta no fixa alçada a .blog-img img (width:100%), així que imatges amb
   ratios diferents (retrat vs apaïsat) trencaven la fila. Fixem aspect-ratio al
   contenidor i cover a la imatge. El slider ja és d'1 slide (JS), per tant NO
   forcem width als <li> (deixem que Swiper en gestioni l'amplada). */
.blog-irati-image .blog-main .blog-img {
	aspect-ratio: 2.2 / 1;
}

.blog-irati-image .blog-main .blog-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 2.2;
}

.blog-main span.tag {
    top: 52px;
}

.blog-main span.tag.destacat {
    top: 20px;
    color: rgba(199, 36, 43, 0.8);
    background: #FFF;
}

.blog-irati .blog-irati-lft h2 {
	font-family: 'LEMONMILK-Medium';
}

.blog-irati-lft {
	flex: 0 1 calc(100% - 100px);
    padding-right: 0px;
}

/* Galeria intermèdia del single (2 per vista). */
.blog-detail-wrap .blog-main .blog-img {
	aspect-ratio: 3 / 2;
}

.blog-detail-wrap .blog-main .blog-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Títol de l'article destacat del llistat amb enllaç: hereta el color del h2. */
.blog-irati-cnt h2 a { color: inherit; }
.blog-irati-cnt h2 a:hover { color: #048B98; }

/* "Més del blog" (related-blogs-sec): cards d'alçada uniforme al slider de 3. */
.related-blogs-sec .blog-irati-img {
	aspect-ratio: 3 / 2;
	width: 100%;
	float: left;
	overflow: hidden;
	border-radius: 10px;
	position: relative;
}

.related-blogs-sec .blog-irati-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	float: none;
	aspect-ratio: 1.4;
}
/* El color del títol (blanc sobre fons navy) i el hover ja els fixa la maqueta
   (.related-blogs-sec .blog-irati-lft h3 a). No els sobreescrivim. */

.single-blog .blog-main {
	border-radius: 20px!important;
}

.single-blog .blod-list {
    margin-top: 40px;
}

.single-blog .blod-list ul {
    column-gap: 3%;
}

.single-blog .blod-list ul li {
    margin-bottom: 3%;
}

.single-blog .contingut h2 {
    font-family: 'Roboto-Medium';
    font-size: 20px;
    line-height: 30px;
}

.single-blog .blog-slide:first-child {
	margin-bottom: 40px;
}

.single-blog .blog-slide .swiper-nav-rel {
    padding: 0 20px 20px 30px;
}

.single-blog .blog-slide {
	margin-bottom: 15px;
}

.single-blog .blog-irati-btm .blog-slide {
    margin-top: 10px;
}

.post-platja .sabies-title-div {
	width: 100%;
	padding-left: 10%;
	padding-right: 10%;
}

.single-blog .siguenos-sec {
    margin-top: -130px;
}

/* Platges */

.post-platja .serveis-platja-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.post-platja .servei-platja {
    display: flex;
    align-items: center;
    gap: 12px;
}

.post-platja .servei-icon {
    width: 44px;
    height: 44px;
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.post-platja .servei-pasarela .servei-icon {
    background-image: url('../../resources/v1/images/ico-platges/ico-pasarela.svg');
}

.post-platja .servei-telefons .servei-icon {
    background-image: url('../../resources/v1/images/ico-platges/ico-telefon.svg');
}

.post-platja .servei-dutxes .servei-icon {
    background-image: url('../../resources/v1/images/ico-platges/ico-dutxa.svg');
}

.post-platja .servei-escars .servei-icon {
    background-image: url('../../resources/v1/images/ico-platges/ico-escars.svg');
}

.post-platja .servei-socorrisme .servei-icon {
    background-image: url('../../resources/v1/images/ico-platges/ico-socorrisme.svg');
}

.post-platja .servei-esports-nautics .servei-icon {
    background-image: url('../../resources/v1/images/ico-platges/ico-esports-nautics.svg');
}

.post-platja .servei-wc .servei-icon {
    background-image: url('../../resources/v1/images/ico-platges/ico-wc.svg');
}

.post-platja .servei-parking .servei-icon {
    background-image: url('../../resources/v1/images/ico-platges/ico-parking.svg');
}

.post-platja .servei-restaurant .servei-icon {
    background-image: url('../../resources/v1/images/ico-platges/ico-restaurant.svg');
}

.post-platja .servei-bar .servei-icon {
    background-image: url('../../resources/v1/images/ico-platges/ico-bar.svg');
}

.post-platja .serveis-platja-list {
	font-size: 16px;
    line-height: 1.2;
    font-family: 'Roboto-Semibold';
    color: #404040;
    letter-spacing: -0.1px;
}

.post-platja .serveis-platja-list li {
	margin-bottom:15px;
}

.post-platja .breadcrum {
    padding: 20px 5px;
}

.post-platja .slider .swiper-slide::before {
    height: 220px;
    background: linear-gradient(to bottom, rgba(49, 35, 53, 0.01) 0%, rgba(0, 0, 0, 0.8) 100%);
}

.post-platja .in-ban-lft h1 {
    color: #fff;
    text-align: center;
}

.post-platja .breadcrum ul li a,
.post-platja .breadcrum ul li {
    font-size: 13px;	
}

.post-platja .swiper-wrapper {
    justify-content: center;
}

.post-platja .sabies-title-div h2 {
    z-index: 2;
}

.post-platja .platges-single-para p {
    width: 80%;
    text-align: center;
    margin-left: 10%;
}

/* Cards dels llistats — la maqueta v1 no fixa alçada a les imatges de card
   (.espais-img, .platges-img, .rutes-img, .allot-img, .blogs-img només tenen
   width:100%), així que cada card adopta l'aspect-ratio natural de la seva
   imatge i el grid queda amb cards de mida desigual. Forcem un aspect-ratio
   uniforme al contenidor i object-fit:cover a la imatge perquè totes les cards
   tinguin la mateixa mida sense deformar la foto. */
.espais-main .espais-img,
.platges-main .platges-img,
.allot-main .allot-img {
    aspect-ratio: 1.5;
}

.rutes-main .rutes-img,
.blod-list .blogs-img,
.blog-wrap .blogs-img {
    aspect-ratio: 0.82;
}

.perdre-irati .perdre-irati-img {
    aspect-ratio: 1.336;
}

.espais-main .espais-img img,
.platges-main .platges-img img,
.allot-main .allot-img img,
.rutes-main .rutes-img img,
.blod-list .blogs-img img,
.blog-wrap .blogs-img img,
.perdre-irati .perdre-irati-img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    float: none;
}

span.bandera-logo img {
    width: 80px !important;
}

.espais-main .espais-img span.tag {
    left: 15px;
    top: 15px;
    font-size: 12px;
}
/* On som — llista de punts d'informació (qualitat-list / som-qualitat).
   Quan un punt no té imatge destacada, ara mostrem el placeholder del tema
   (logo) a la columna d'imatge, igual que a les cards, en comptes de deixar
   el contingut a tota amplada. Per això ja no fem servir .no-img.
.qualitat-list .qualitat-main.no-img .qualitat-cont {
	flex: 0 1 100%;
	padding-left: 50px;
	padding-right: 50px;
}
*/

/* Files contínues: traiem el buit blanc entre files (row-gap de la maqueta) i
   donem padding vertical propi a cada fila perquè el contingut respiri dins de
   la banda de color. */
.som-qualitat .qualitat-list ul { row-gap: 0; }
.som-qualitat .qualitat-list ul li { padding-top: 40px; padding-bottom: 40px; }

/* Placeholder (punts sense imatge destacada, p. ex. Son Real i Son Serra de
   Marina): el logo SVG centrat sobre un fons gris, contingut a alçada fixa
   perquè la fila quedi alineada amb les que sí tenen foto. */
.qualitat-list .qualitat-img:has(img.theme-placeholder-img) {
	background: #f4f4f4;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 300px;
}
.qualitat-list .qualitat-img img.theme-placeholder-img {
	width: 100%;
	height: 300px;
	object-fit: contain;
	padding: 50px;
	opacity: 0.55;
	float: none;
}

/* On som — popup dels marcadors del mapa Leaflet (punts on-som). */
/* El wrapper per defecte de Leaflet té padding + border-radius:12px però NO
   overflow:hidden; amb la imatge a sang (.map-popup img) les cantonades
   quadrades sobreïxen del fons blanc arrodonit i es veu malament. Retallem el
   contingut al radi i traiem el padding perquè la imatge ompli la targeta. */
.som-map-div .leaflet-popup-content-wrapper { padding: 0; overflow: hidden; border-radius: 12px; }
.som-map-div .leaflet-popup-content { margin: 0; width: 220px !important; }
.map-popup img { display: block; width: 100%; height: 130px; object-fit: cover; }
.map-popup h3 { margin: 0; padding: 12px 15px; font-size: 16px; line-height: 1.3; }
.map-popup h3 a { color: #048B98; }
/* La "X" de tancar queda sobre la imatge: la posem en blanc amb contorn fosc
   perquè sigui visible damunt de qualsevol foto. */
.som-map-div .leaflet-popup-close-button {
	top: 5px !important;
	right: 8px !important;
	color: #fff !important;
	font-size: 22px !important;
	opacity: 1 !important;
	text-shadow: 1px 1px 1px rgba(0,0,0,.8), -1px -1px 1px rgba(0,0,0,.8), 1px -1px 1px rgba(0,0,0,.8), -1px 1px 1px rgba(0,0,0,.8);
}
.som-map-div .leaflet-popup-close-button:hover { opacity: .8 !important; background: none !important; }

/* Mega menu — enllaços amb etiqueta llarga (p. ex. "Destinació turística
   intel·ligent" a Descobreix). La maqueta fixa la píndola a height:43px,
   pensada per a etiquetes curtes ("Rutas", "Platges"). Una etiqueta que
   ocupa 2-3 línies sobreïx del fons arrodonit en hover. Deixem créixer la
   píndola en vertical i hi posem padding simètric perquè el text hi quedi dins. */
.cbp-hrsub-inner-lft ul li .mega-list ul li a {
	height: auto;
	min-height: 43px;
	padding-top: 8px;
	padding-bottom: 8px;
}

/* Estat ACTIU de l'ítem del mega menu (pàgina actual). La maqueta només estila
   el :hover (píndola vermella + text blanc + fletxa visible); l'ítem actiu no
   tenia cap indicador. Repliquem el look del hover de forma persistent perquè
   quan estàs dins d'una secció (p. ex. Gastronomia) l'ítem quedi seleccionat. */
.cbp-hrsub-inner-lft ul li .mega-list ul li a.active {
	background: rgba(199, 36, 43, 0.75);
	color: #fff;
}
.cbp-hrsub-inner-lft ul li .mega-list ul li a.active img {
	opacity: 1;
}

/* Home — espai entre el bloc "Coneix el territori"/slider de poblacions i el
   vídeo destacat. A la maqueta (resources/v1/index.html) el slider
   (.coniex-slider-div) és l'últim fill de <section class="hm-picafort-sec">,
   que té padding-bottom: 240px; aquest és l'espai que separa el slider del
   vídeo. Al port els blocs de contingut flexible són germans solts i es perd
   aquest padding, de manera que el vídeo queda enganxat a les cards. Restituïm
   l'espai amb un margin-bottom al bloc del slider, igualant els valors
   responsius de .hm-picafort-sec a media.css. */
.coniex-slider-div {
	margin-bottom: 240px;
}
.swiper-pagination-bullet {
    margin-right: 10px;
}

/* Favorits (6tems-wishlist) — estat ACTIU persistent del cor.
   La maqueta v1 només mostra ico-favorit-on.svg al :hover de la card; el wishlist
   necessita que el cor quedi "ple" de forma permanent quan l'element està a la cookie.
   El JS del parent afegeix la classe .active al <span class="wishlist-ico"> en marcar-lo.
   Aquí forcem la icona "on" de la maqueta (en comptes de l'ico-heart-red.svg del parent)
   perquè l'estat actiu sigui coherent amb el disseny. Cobrim les dues variants de marcatge:
   .fav-icon span  i  .fav-icon a span. */
.fav-icon span.wishlist-ico.active,
.fav-icon a span.wishlist-ico.active {
	background-image: url("../../resources/v1/images/ico-favorit-on.svg") !important;
}
.wishlist-ico {
	cursor: pointer;
}

/* Pàgina de Favorits: la graella reusa .espais-list de la maqueta; només cal donar
   aire al missatge buit. */
.wishlist-main-sec .wishlist-empty {
	padding: 40px 0 80px;
	text-align: center;
}

/* Vista mapa dels llistats (espais, platges, allotjaments, general).
   El toggle .view-tab mostra/oculta .item-list vs el contenidor del mapa.
   La maqueta v1 ja dona alçada a .espais-map-div #map / .platges-map-div #map
   (pensats per a Google Maps); aquí encara el reusem amb Leaflet. */
.espais-map-div,
.platges-map-div {
    height: 70vh;
	float: left;
	width: 100%;
	margin-top: 20px;
    position: relative;
    overflow: hidden;
}
.espais-map-div #map,
.platges-map-div #map {
	border-radius: 10px;
	overflow: hidden;
}
.espais-info-map #map {
    position: relative;
}

.hm-contingut-lliure .contingut-lliure-inner > p:has(#map) { position: relative; }
.hm-contingut-lliure .contingut-lliure-inner > p > #map { position: relative; }

/* Popup dels marcadors: reutilitza la card real, així que retallem el padding
   del wrapper de Leaflet i fixem una amplada perquè la card ompli la targeta
   (les regles #map .espais-main de la maqueta s'apliquen al contingut). */
.leaflet-custom-card .leaflet-popup-content-wrapper {
	padding: 0;
	overflow: hidden;
	border-radius: 10px;
}
.leaflet-custom-card .leaflet-popup-content {
	margin: 0;
	width: 280px !important;
}
.leaflet-custom-card .leaflet-popup-content .espais-main,
.leaflet-custom-card .leaflet-popup-content .platges-main,
.leaflet-custom-card .leaflet-popup-content .allot-main {
	width: 100%;
}
.leaflet-custom-card .leaflet-popup-content img {
	max-width: 100%;
}
.leaflet-custom-card .leaflet-popup-close-button {
	top: 6px !important;
	right: 8px !important;
	color: #fff !important;
	font-size: 22px !important;
	opacity: 1 !important;
	z-index: 2;
	text-shadow: 1px 1px 1px rgba(0,0,0,.8), -1px -1px 1px rgba(0,0,0,.8), 1px -1px 1px rgba(0,0,0,.8), -1px 1px 1px rgba(0,0,0,.8);
}
.leaflet-custom-card .leaflet-popup-close-button:hover { opacity: .8 !important; background: none !important; }

/* Botons */ 

a.boto {
    position: relative;
    z-index: 2;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 45px;
    padding: 0px 20px;
    color: #fff;
    font-size: 15px;
    font-family: 'LEMONMILK-Medium';
    letter-spacing: 0.72px;
    border-radius: 30px;
    transition: all 0.5s ease;
    background: #182A3F;
    margin-top: 20px;
    margin-bottom:5px;
}

/* Rutes */

.plat-top-rgt p {
    margin-bottom: 20px;
}

.rutes-title-rgt p {
    margin-bottom: 20px;
}

/* ── Pàgina lliure / plantilla per defecte ──────────────────────────────────
   Capçalera configurable (ACF tipus_capcalera + color_capcalera) i estil del
   bloc "Contingut lliure", perquè quedi acord amb el disseny del site i no pla. */

/* Capçalera AMB IMATGE — la imatge ve d'un camp ACF propi (imatge_capcalera),
   no de la imatge destacada. Si encara no se n'ha triat cap, el banner no ha de
   col·lapsar: hi posem min-height i un fons de color segons l'opció (la imatge,
   quan hi és, el cobreix amb object-fit:cover). */
.inner-banner.page-banner { min-height: 345px; }
.inner-banner.page-banner .breadcrum,
.inner-banner.page-banner .inner-ban-caption { z-index: 2; }
.inner-banner2.page-banner { padding-bottom: 30px; }

/* ===== Paleta de colors del disseny (camp ACF color_capcalera) =====
   S'aplica a la banda sense imatge (.inner-banner2) i, com a to de fons,
   a la capçalera amb imatge mentre no se n'hagi triat cap (.inner-banner).
   Les regles de color de títol s'escopen a .inner-banner/.inner-banner2 perquè
   .inner-banner1 (petita amb imatge) conservi el seu títol blanc de la maqueta. */

/* Blau fosc — fons fosc, títol blanc. */
.inner-banner.page-banner.cap-color-blau_fosc,
.inner-banner2.page-banner.cap-color-blau_fosc { background: #182A3F; }
.inner-banner2.page-banner.cap-color-blau_fosc::before { display: none; }
.page-banner.cap-color-blau_fosc .in-ban-lft :is(h1, h5, .ban-avanttitol) {
    color: #fff;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.35);
}
.page-banner.cap-color-blau_fosc .breadcrum { top: 0; }
.page-banner.cap-color-blau_fosc .breadcrum ul li,
.page-banner.cap-color-blau_fosc .breadcrum ul li a { color: rgba(255, 255, 255, 0.85); }
/* Icona "home": la maqueta la pinta amb ico-home.svg (fosc); sobre fons fosc cal la blanca. */
.page-banner.cap-color-blau_fosc .breadcrum ul li a.home {
    background-image: url("../../resources/v1/images/ico-home-white.svg");
}
/* Sobre imatge fosca (gran): degradat per llegibilitat del títol blanc. */
.inner-banner.page-banner.cap-color-blau_fosc::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(24, 42, 63, 0.10) 0%, rgba(24, 42, 63, 0.60) 100%);
    z-index: 1;
}

/* CAPÇALERA SOBRE BLAU FOSC START */
body:has(.page-banner.cap-color-blau_fosc):not(.single-ruta, .hidden-mob, .hide-scroll) #sticky-wrapper:not(.is-sticky) > header:not(.inner-header, .dark-bg) .logo-top img.desk-logo {
    content: url("../images/logo-header-white-can-picafort.svg");
    max-width: 186px;
    height: auto;
}
body:has(.page-banner.cap-color-blau_fosc):not(.single-ruta, .hidden-mob, .hide-scroll) #sticky-wrapper:not(.is-sticky) > header:not(.inner-header, .dark-bg) .cbp-hrmenu > ul > li > a {
    color: #fff;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.35);
}
body:has(.page-banner.cap-color-blau_fosc):not(.single-ruta, .hidden-mob, .hide-scroll) #sticky-wrapper:not(.is-sticky) > header:not(.inner-header, .dark-bg) :is(.scl-links ul li a, .hdr-links ul li a) { filter: brightness(0) invert(1); }
body:has(.page-banner.cap-color-blau_fosc):not(.single-ruta, .hidden-mob, .hide-scroll) #sticky-wrapper:not(.is-sticky) > header:not(.inner-header, .dark-bg) :is(.scl-links, .hdr-links > ul > li) { border-left-color: rgba(255, 255, 255, 0.6); }
body:has(.page-banner.cap-color-blau_fosc):not(.single-ruta, .hidden-mob, .hide-scroll) #sticky-wrapper:not(.is-sticky) > header:not(.inner-header, .dark-bg) .select-lang .nice-select { color: #fff; }
body:has(.page-banner.cap-color-blau_fosc):not(.single-ruta, .hidden-mob, .hide-scroll) #sticky-wrapper:not(.is-sticky) > header:not(.inner-header, .dark-bg) .select-lang .nice-select::after { border-color: #fff; }
body:has(.page-banner.cap-color-blau_fosc):not(.single-ruta, .hidden-mob, .hide-scroll) #sticky-wrapper:not(.is-sticky) > header:not(.inner-header, .dark-bg) .select-lang .nice-select .list { color: #182A3F; }
body:has(.page-banner.cap-color-blau_fosc):not(.single-ruta, .hidden-mob, .hide-scroll) #sticky-wrapper:not(.is-sticky) > header:not(.inner-header, .dark-bg) .hamburger :is(span, span::before, span::after) { background: #fff; }
/* CAPÇALERA SOBRE BLAU FOSC END */

/* Blau cel — banda teal clara (aspecte per defecte de la maqueta), títol blau marí. */
.inner-banner.page-banner.cap-color-blau_cel,
.inner-banner2.page-banner.cap-color-blau_cel { background: #DEEFEE; }
.inner-banner.page-banner.cap-color-blau_cel .in-ban-lft h1,
.inner-banner2.page-banner.cap-color-blau_cel .in-ban-lft h1 { color: #182A3F; }

/* Blanc — fons blanc, títol blau marí. */
.inner-banner.page-banner.cap-color-blanc,
.inner-banner2.page-banner.cap-color-blanc { background: #fff; }
.inner-banner2.page-banner.cap-color-blanc::before { display: none; }
.inner-banner.page-banner.cap-color-blanc .in-ban-lft h1,
.inner-banner2.page-banner.cap-color-blanc .in-ban-lft h1 { color: #182A3F; }

/* Gris — fons gris clar, títol blau marí. */
.inner-banner.page-banner.cap-color-gris,
.inner-banner2.page-banner.cap-color-gris { background: #E6E9EC; }
.inner-banner2.page-banner.cap-color-gris::before { display: none; }
.inner-banner.page-banner.cap-color-gris .in-ban-lft h1,
.inner-banner2.page-banner.cap-color-gris .in-ban-lft h1 { color: #182A3F; }

/* Bloc "Contingut lliure" — tipografia i ritme acord amb el site. */
.hm-contingut-lliure {
    float: left;
    width: 100%;
    padding: 70px 0;
}
.hm-contingut-lliure .contingut-lliure-inner {
    /* max-width: 900px; */
    margin: 0 auto;
    float: none;
}
.hm-contingut-lliure .contingut-lliure-inner > *:first-child { margin-top: 0; }
.hm-contingut-lliure .contingut-lliure-inner h2 {
    font-family: 'LEMONMILK-Medium';
    font-size: 38px;
    line-height: 1.2;
    color: #182A3F;
    letter-spacing: -0.5px;
    margin: 0 0 24px;
}
.hm-contingut-lliure .contingut-lliure-inner h3 {
    font-family: 'LEMONMILK-Medium';
    font-size: 26px;
    line-height: 1.3;
    color: #182A3F;
    margin: 36px 0 16px;
}
.hm-contingut-lliure .contingut-lliure-inner h4 {
    font-family: 'Roboto-SemiBold';
    font-size: 20px;
    line-height: 1.3;
    color: #182A3F;
    margin: 26px 0 12px;
}
.hm-contingut-lliure .contingut-lliure-inner p {
    font-family:'Roboto-Regular';
    font-size:16px;
    line-height:26px;
    color:#515151;
    margin-bottom:15px;
}
.hm-contingut-lliure .contingut-lliure-inner ul,
.hm-contingut-lliure .contingut-lliure-inner ol {
    margin: 0 0 24px;
    padding-left: 0;
    list-style: none;
}
.hm-contingut-lliure .contingut-lliure-inner li {
    font-family: 'Roboto-Regular';
    font-size: 17px;
    line-height: 1.6;
    color: #515151;
    position: relative;
    padding-left: 28px;
    margin-bottom: 12px;
}
.hm-contingut-lliure .contingut-lliure-inner ul li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 10px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #048B98;
}
.hm-contingut-lliure .contingut-lliure-inner ol { counter-reset: cl; }
.hm-contingut-lliure .contingut-lliure-inner ol li { counter-increment: cl; }
.hm-contingut-lliure .contingut-lliure-inner ol li::before {
    content: counter(cl) ".";
    position: absolute;
    left: 0;
    top: 0;
    color: #048B98;
    font-family: 'Roboto-Bold';
}
.hm-contingut-lliure .contingut-lliure-inner a {
    color: #048B98;
    font-family: 'Roboto-SemiBold';
    text-decoration: underline;
    transition: opacity .3s ease;
}
.hm-contingut-lliure .contingut-lliure-inner a:hover { opacity: .7; }
.hm-contingut-lliure .contingut-lliure-inner strong { font-family: 'Roboto-Bold'; color: #182A3F; }
.hm-contingut-lliure .contingut-lliure-inner img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    margin: 12px 0 24px;
}
.hm-contingut-lliure .contingut-lliure-inner blockquote {
    background: #DEEFEE;
    border-radius: 10px;
    padding: 28px 34px;
    margin: 0 0 28px;
    font-family: 'Roboto-SemiBoldItalic';
    color: #182A3F;
    font-size: 22px;
    line-height: 1.4;
}
/* Mapes / embeds dins del contingut lliure: cantonades i ombra suau. */
.hm-contingut-lliure .contingut-lliure-inner iframe {
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(24, 42, 63, 0.10);
    margin: 12px 0;
}

/* Fallback de contingut clàssic (the_content sense blocs flexibles). */
.inner-content { float: left; width: 100%; padding: 70px 0; }
.inner-content:not(.contingut) .row > * { max-width: 900px; margin-left: auto; margin-right: auto; float: none; }


/* Botons */ 
a.boto,
.hm-contingut-lliure a.boto{
    position: relative;
    z-index: 2;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 45px;
    padding: 0px 20px;
    color: #fff;
    font-size: 15px;
    font-family: 'LEMONMILK-Medium';
    letter-spacing: 0.72px;
    border-radius: 30px;
    transition: all 0.5s ease;
    background: #182A3F;
    margin-top: 20px;
    margin-bottom:5px;
    margin-right: 10px;
    text-decoration: none;
}

/* Rutes */ 
.plat-top-rgt p {
    margin-bottom: 20px;
}

/* Contingut */ 
.contingut h3 {
	font-size: 20px;
    line-height: 1.4;
    font-family: 'LEMONMILK-Medium';
    text-transform: uppercase;
    color:#182A3F;
    letter-spacing: -0.22px;
    margin-bottom: 22px;
}

/* Columnes rutes */ 
ul.rutes-lst li {
    flex: 0 1 31%;
}
/* ───────────────────────────────────────────────────────────────
   Pàgina Esports (page-id-538) — reusa el bloc "Categories què fer"
   (.hm-quefer) però amb 6 cards uniformes en lloc de la mosaic fixa
   de 7 de la home/Què fer. Les cards porten modificador_class buit,
   així que NO apliquen les regles .platjes/.espais/... amb grid-area;
   aquí els donem una graella regular 3×2 amb alçada de fila pròpia
   (la mosaic original confiava en grid-row spans, que aquí no hi són).
   Només desktop: per sota de 1024px la maqueta ja fa wrap (2 i 1 col). */
@media (min-width: 1024px) {
    .page-id-538 .hm-quefer .grid {
        grid-template-columns: repeat(3, 1fr);
        grid-auto-rows: 300px;
    }
}

/* La card de "Categories què fer" embolcalla la imatge dins un <a> sense
   amplada pròpia. Amb imatges horitzontals l'enllaç ja omple la card, però
   amb una imatge VERTICAL (p.ex. Senderisme, 1707×2560) l'<a> encongeix a
   l'amplada natural de la foto i deixa un buit blanc a la dreta. Forcem
   l'<a> a omplir la card perquè object-fit:cover de .card img retalli sigui
   quin sigui el ràtio. Sense media query: el mateix passa en mòbil/tauleta. */
.page-id-538 .hm-quefer .grid .card > a {
    display: block;
    width: 100%;
    height: 100%;
}

/* ───────────────────────────────────────────────────────────────
   Bloc flexible "Cards (Què fer)" (template-parts/contenido-flexible/cards_quefer.php)
   Versió reutilitzable del grid de cards, amb selector d'estil propi en lloc de
   dependre de l'id de pàgina. Reusa el markup .hm-quefer .grid .card de la maqueta.

   - .estil-cards  → graella uniforme (com Esports / page-id-538).
   - .estil-mosaic → mosaic fix de 7 cards estil "Què fer", resolt per :nth-child()
     (el repeater no porta classe modificadora per card, a diferència de
     categories_quefer que les feia servir).

   Igual que la resta de variants del grid: només desktop (≥1024px). Per sota, la
   maqueta ja passa a 2 i 1 columna amb qualsevol nombre de cards. */

/* L'<a> sempre ha d'omplir la card (imatges verticals si no deixen buit blanc). */
.cards-quefer .grid .card > a {
    display: block;
    width: 100%;
    height: 100%;
}

@media (min-width: 1024px) {
    /* Cards uniformes */
    .cards-quefer.estil-cards .grid {
        grid-template-columns: repeat(3, 1fr);
        /* El .grid global (override.css) força grid-template-rows: 320px 320px 290px;
           sense reset, es generen 3 files fixes (960px d'alt) encara que només hi
           hagi una fila de cards, deixant un buit enorme (SMCP-37). El reset deixa
           que grid-auto-rows dimensioni només les files necessàries. */
        grid-template-rows: none;
        grid-auto-rows: 300px;
    }

    /* Mosaic fix de 7 cards (replica .platjes/.espais/.art/... per posició) */
    .cards-quefer.estil-mosaic .grid {
        grid-template-columns: 1.20fr 1.20fr 0.75fr;
    }
    .cards-quefer.estil-mosaic .grid .card:nth-child(1) { grid-column: 1; grid-row: 1 / span 2; }
    .cards-quefer.estil-mosaic .grid .card:nth-child(2) { grid-column: 2; grid-row: 1; }
    .cards-quefer.estil-mosaic .grid .card:nth-child(3) { grid-column: 3; grid-row: 1 / span 2; }
    .cards-quefer.estil-mosaic .grid .card:nth-child(4) { grid-column: 2; grid-row: 2; }
    .cards-quefer.estil-mosaic .grid .card:nth-child(5) { grid-column: 1; grid-row: 3; }
    .cards-quefer.estil-mosaic .grid .card:nth-child(6) { grid-column: 2; grid-row: 3; }
    .cards-quefer.estil-mosaic .grid .card:nth-child(7) { grid-column: 3; grid-row: 3; }
}

/* ── Cards (Què fer): estil "Icones" ─────────────────────────────────────
   Targetes amb icona/imatge, nom i subtítol centrats (replica la fila
   "TRES POBLACIONS / 27 EXPERIÈNCIES / 55 HOTELS" de la maqueta). El color de
   fons i el color de text venen per ACF com a style inline a cada .card / <a>.
   A diferència de cards/mosaic, aquí la card NO és una imatge de fons sinó un
   bloc de contingut, així que cal sobreescriure el comportament base del grid. */
.cards-quefer.estil-icones .grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    /* El .grid global (override.css) força grid-template-rows: 320px 320px 290px,
       que crearia 3 files explícites buides encara que només hi hagi 3 cards.
       Aquí el resetegem perquè les files siguin automàtiques segons el contingut. */
    grid-template-rows: none;
    grid-auto-rows: auto;
    gap: 20px;
}
.cards-quefer.estil-icones .grid .card {
    background-color: #dbeef0;
    border-radius: 10px;
    overflow: hidden;
}
.cards-quefer.estil-icones .grid .card > a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 35px 25px;
    color: #1d6f7c;
    text-decoration: none;
    height: 100%;
}
.cards-quefer.estil-icones .grid .card .icona {
    margin-bottom: 18px;
}
.cards-quefer.estil-icones .grid .card .icona img {
    width: auto;
    max-width: 60px;
    height: 50px;
    object-fit: contain;
}
/* A la maqueta .content és position:absolute (text sobre la imatge de fons).
   A l'estil icones el volem en flux normal, sota la icona. */
.cards-quefer.estil-icones .grid .card .content {
    position: static;
    width: auto;
    padding: 0;
    float: none;
}
.cards-quefer.estil-icones .grid .card .content h2,
.cards-quefer.estil-icones .grid .card .content .card-titol {
    font-size: 22px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0 0 6px;
    color: inherit;
}
.cards-quefer.estil-icones .grid .card .content .subtitol {
    font-size: 15px;
    margin: 0;
    opacity: 0.85;
    color: inherit;
}
.cards-quefer.estil-icones .grid .card:hover {
    transform: translateY(-4px);
    transition: transform .25s ease;
}

@media (max-width: 1023px) {
    .cards-quefer.estil-icones .grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 575px) {
    .cards-quefer.estil-icones .grid {
        grid-template-columns: 1fr;
    }
}

/* RUTES */
.rutes-detail-img {
    margin-bottom: 20px;
    position: relative;
}

.rutes-detail-img #map {
    position: relative;
    height: 75vh;
    border-radius: 10px;
    margin-top: 50px;
}

.rutes-irati-img img {
    aspect-ratio: 1.4;
	object-fit: cover;
}

.ruta-kml-wrap {
	margin-bottom: 40px;	
}

.single-ruta .inner-banner.page-banner.cap-color-blau_fosc::after {
    background: linear-gradient(to bottom, rgba(24, 42, 63, 0.2) 0%, rgba(24, 42, 63, 0.6) 100%);
}

.single-ruta .inner-banner::before {
    background: linear-gradient(to bottom, rgba(49, 35, 53, 0.0) 0%, rgba(0, 0, 0, 0.0) 100%);
}

.single-ruta .inner-ban-caption {

}

.single-ruta .in-ban-lft h1 {
    font-size: 55px;
}

.single-ruta .breadcrum {
    padding: 0px 0 30px 0;
}

.hm-contingut-lliure .contingut-lliure-inner p small {
    line-height: 1.35;
}

/* SPORTS */
.esports .hm-contingut-lliure {
    padding: 0px 0 0 0;	
}

.esports .hm-picafort-sec {
        padding: 0px 0px 90px;
    }

.esports .inner-banner.page-banner.cap-color-blau_fosc {
    margin-bottom: 60px;
}

.esports .siguenos-sec {
    margin-top: 60px;
}

.col50 {
    width: 45%;
    float: left;
}

/* CARDS */
.card img {
    filter: brightness(0.9);
}

/* FLETXES */
.esp-slider .swiper-button {
    background: rgba(255, 255, 255, 0.2);
    border: 2px solid rgba(255, 255, 255, 0.5);
}

.grid {
    float: left;
    width: 100%;
    display: grid;
    grid-template-columns: 1.20fr 1.20fr 0.75fr 0.75fr;
    grid-template-rows: 220px 220px 220px;
    gap: 16px;
    padding: 0;
}

/* 4 primeros igual que ahora */
.platjes {
    grid-column: 1;
    grid-row: 1 / span 2;
}

.espais {
    grid-column: 2;
    grid-row: 1;
}

.art {
    grid-column: 3 / span 2;
    grid-row: 1 / span 2;
}

.elements {
    grid-column: 2;
    grid-row: 2;
}

/* 4 últimos en 4 columnas */
.fires {
    grid-column: 1;
    grid-row: 3;
}

.gastronomia {
    grid-column: 2;
    grid-row: 3;
}

.esports {
    grid-column: 3;
    grid-row: 3;
}

.rutes {
    grid-column: 4;
    grid-row: 3;
}

.ultima {
    grid-column: 3 / span 4;
    grid-row: 3;
    margin-right: 30px;
}

.card > a {
    display: block;
    width: 100%;
    height: 100%;
}

.card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 1024px) {
    .grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: auto;
    }

    .platjes,
    .espais,
    .art,
    .elements,
    .fires,
    .gastronomia,
    .esports,
    .rutes {
        grid-column: auto;
        grid-row: auto;
        min-height: 260px;
    }
}

@media (max-width: 575px) {
    .grid {
        grid-template-columns: 1fr;
    }

    .platjes,
    .espais,
    .art,
    .elements,
    .fires,
    .gastronomia,
    .esports,
    .rutes {
        min-height: 240px;
    }
}

/* Tamany de text del menú */
.cbp-hrsub-inner-lft ul li .mega-list ul li a {
    font-size: 16px;
    line-height: -0.8;
}

/* Fitxa nucli població */
.single-on-som .blog-irati-image .blog-main .blog-img {
    aspect-ratio: 1.8 / 1;
}

.single-on-som .blod-list ul li {
    flex: 0 1 48%;
}

.single-on-som .rutes-main .rutes-img, 
.single-on-som .blod-list .blogs-img, 
.single-on-som .blog-wrap .blogs-img
 {
	object-fit:cover;
	aspect-ratio: 1;	
}

.coniex-main .coniex-img img,
.agenda-main .agenda-img img {
    aspect-ratio: 1.4;
    object-fit: cover;
}

/* Video a la home */
.home .video-sec {
	width: 74%;
    margin-left: 13%;
    margin-right: 13%;
    border-radius: 10px;	
}

.home .hm-platjes-sec {
	margin-top: -100px;
    padding-top: 200px;
}

/* Historia */
.historia .hm-picafort-sec {
	padding: 0;
	background: none;
}

.historia .hm-contingut-lliure {
	padding-bottom: 0px;
}

.historia .coniex-slider-div {
    margin-bottom: 100px;
}

.historia .coniex-slider-div {
    margin-top: 20px;
}

/* Bloc cards icones */ 

.home .title-sec h2 {
	font-size: 35px;
}

.home .title-sec h2 span {
	color:#4EB5B0;
}

.home .coniex-slider-div {
    margin-bottom: 120px;
}

.home .cards-quefer.estil-icones .grid .card > a {
    padding: 45px 25px;
}

.cbp-hrsub-inner-lft ul li .mega-list ul li a {
    font-size: 16px!important;
}

/* Contenedor principal de los cards */
.cards-quefer.estil-icones .grid {
    display: grid;
    /* Grid flexible que se adapta al número de cards */
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    grid-auto-rows: auto;
    gap: 20px;

    /* Centrado horizontal cuando hay menos items que columnas */
    justify-content: center;
}

/* Opcional: centrar contenido interno de cada card */
.cards-quefer.estil-icones .grid .card {
    display: flex;
    flex-direction: column;
    align-items: center; /* centra icono y texto */
    text-align: center;  /* centra texto */
    justify-content: center;
}

/* HEADER i breadcrumb */
.inner-banner .breadcrum,
.cap-color-blau_fosc.inner-banner .breadcrum.abs-sec {
    padding: 20px 0;
}

.page-template-que-fer .cap-color-blau_fosc.inner-banner .breadcrum {
    top:20%;
}

.inner-ban-caption {
    top: 54.5%;
}

/* CARDS tamanys dels textos */
.espais-main .espais-txt h3 a {
    font-size: 25px;
    line-height: 1.3;
}

.espais-main-sec {
    padding: 0px 0px 90px;
}

.espais-main .espais-txt span.date span.card-any {
    font-family: 'Roboto-Regular';	
    color:rgba(24, 43, 64, 0.6);
}

.espais-main .espais-txt span.date span.card-origen {
    font-family: 'Roboto-Medium';
    color:rgba(24, 43, 64, 1);    
}


/* FOOTER */
.foot-mid-btm ul.foot-menu li ul li a {
    font-size: 16px;
    font-family: 'Roboto-Light';
}

.foot-mid-btm ul.foot-menu li h3 {
	font-size:22px;
    font-family: 'Roboto-Regular';
}

.news-lft h2 {
    font-size: 35px!important;
}

.foot-top {
    padding: 30px 85px!important;
}

.foot-mid-btm {
    padding: 35px 40px 35px;
}

.foot-mid-lst {
    padding: 20px 40px;
}

.foot-mid-btm ul.foot-menu li ul {
    row-gap: 10px;
}

.foot-mid-top {
    padding: 30px 40px;
}

/* SLIDER BLOG */

/* Menú mòbil: ítem actiu sense vora vermella superior, només text vermell.
   La maqueta (accordion.css) posa border-top: 3px solid #CE003A a .active.acc_head;
   aquí el traiem i deixem només el color del text. */
.mobile-menu .accordionjs .acc_section .active.acc_head,
.mobile-menu .accordionjs .acc_section .acc_content ul li a.active {
    border-top: none !important;
    color: #CE003A !important;
}

/* ── Bloc flexible "Text + imatge (2 columnes)" ──────────────────────────────
   (template-parts/contenido-flexible/text_imatge.php)
   Reprodueix el disseny de la pàgina Transport (.qualitat-list): imatge a sang a
   mitja columna + banda de color amb títol (LEMONMILK), descripció i botó "+".
   - .img-esquerra / .img-dreta → imatge a esquerra o dreta (alterna per zigzag).
   - .color-blau / .color-gris / .color-blanc → fons del bloc; el títol i el botó
     hi combinen. Alternant blau/gris entre blocs consecutius s'obté la zebra.
   - .amb-espaiat → marge inferior opcional.
   Cada bloc és una banda a tota amplada (germà solt dins _init.php). */
.cf-text-imatge {
    float: left;
    width: 100%;
}
.cf-text-imatge.amb-espaiat {
    margin-bottom: 30px;
}
.cf-text-imatge .ti-main {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.cf-text-imatge.img-dreta .ti-main {
    flex-direction: row-reverse;
}
.cf-text-imatge .ti-img {
    flex: 0 1 50%;
    max-width: 50%;
    overflow: hidden;
}
.cf-text-imatge .ti-img img {
    float: left;
    width: 100%;
    display: block;
    transition: all .5s ease;
}
.cf-text-imatge:hover .ti-img img {
    transform: scale(1.03);
}
.cf-text-imatge .ti-cont {
    flex: 0 1 50%;
    max-width: 50%;
    padding: 40px 50px;
}
/* Sense imatge: el text ocupa tota l'amplada. */
.cf-text-imatge .ti-cont:only-child {
    flex-basis: 100%;
    max-width: 100%;
}
.cf-text-imatge .ti-cont h3,
.cf-text-imatge .ti-cont > h2.ti-titol {
    font-size: 25px;
    line-height: 1.2;
    font-family: 'LEMONMILK-Medium';
    letter-spacing: 0;
    margin-bottom: 20px;
}
.cf-text-imatge .ti-text,
.cf-text-imatge .ti-text p {
    font-size: 14px;
    line-height: 1.6;
    color: #515151;
    font-family: 'Roboto-Regular';
    letter-spacing: -0.2px;
}
.cf-text-imatge .ti-text p {
    margin-bottom: 15px;
}
.cf-text-imatge a.inform-btn {
    display: inline-flex;
    align-items: center;
    column-gap: 10px;
    height: 45px;
    padding: 0 35px;
    color: #fff;
    font-size: 15px;
    font-family: 'LEMONMILK-Medium';
    border-radius: 30px;
    transition: all .5s ease;
    margin-top: 10px; 
}

.cf-text-imatge .ti-text strong {
    font-family: 'Roboto-Bold';
}

/* Color del títol i del botó (independent de l'amplada) */
.cf-text-imatge.color-blau .ti-cont h3,
.cf-text-imatge.color-blau .ti-cont > h2.ti-titol { color: #048B98; }
.cf-text-imatge.color-blau a.inform-btn { background: #048B98; }
.cf-text-imatge.color-blau a.inform-btn:hover { background: #182A3F; }

.cf-text-imatge.color-gris .ti-cont h3,
.cf-text-imatge.color-gris .ti-cont > h2.ti-titol { color: #182A3F; }
.cf-text-imatge.color-gris a.inform-btn { background: #182A3F; }
.cf-text-imatge.color-gris a.inform-btn:hover { background: #048B98; }

.cf-text-imatge.color-blanc .ti-cont h3,
.cf-text-imatge.color-blanc .ti-cont > h2.ti-titol { color: #182A3F; }
.cf-text-imatge.color-blanc a.inform-btn { background: #048B98; }
.cf-text-imatge.color-blanc a.inform-btn:hover { background: #182A3F; }

/* Fons del bloc — SEMPRE a tota amplada del viewport. La banda de color es pinta
   sobre la <section> (width:100%), tant si el contingut va a tota amplada com si
   va en columna estreta. En columna estreta el contingut (imatge + text) queda
   dins .row (1170px, centrat), però el color s'estén fins a les vores. */
.cf-text-imatge.color-blau { background: #DEEFEE; padding-top: 30px; padding-bottom: 30px;}
.cf-text-imatge.color-gris { background: #ebeff0; padding-top: 30px; padding-bottom: 30px;}
.cf-text-imatge.color-blanc { background: #fff; }

@media (max-width: 1024px) {
    .cf-text-imatge .ti-img img { height: 270px; object-fit: cover; }
    .cf-text-imatge .ti-cont { padding: 30px; }
    .cf-text-imatge .ti-cont h3,
    .cf-text-imatge .ti-cont > h2.ti-titol { font-size: 22px; }
}

@media (max-width: 767px) {
    .cf-text-imatge .ti-main,
    .cf-text-imatge.img-dreta .ti-main { flex-direction: column; }
    .cf-text-imatge .ti-img,
    .cf-text-imatge .ti-cont { flex: 0 1 100%; max-width: 100%; }
    .cf-text-imatge .ti-img img { height: 280px; }
    .cf-text-imatge .ti-cont { padding: 30px 20px; }
}

/* Art urbà */
.espais-map-div #map { height: 70vh; }
ul.ft-logo-lst li img { max-width: 160px; }
.espais-main .espais-img { border-radius: 6px; }
.espais-filter-div p { margin-top: 25px; }
.page-template-general-list .siguenos-sec { margin-top: 50px; }

/* Filtres del llistat general (art-urbà i altres general-list): la maqueta
   (.esp-filter-lft ul) fa flex-wrap amb column-gap però SENSE row-gap, així que
   quan els filtres passen a una segona fila (p. ex. "Cercar" avall) queden
   enganxats verticalment. Hi afegim separació vertical. */
.general-filter-div .esp-filter-lft ul { row-gap: 18px; }

/* El desplegable nice-select hereta width:100% (l'amplada del pill, ~194px) i
   overflow:hidden, i les opcions són white-space:nowrap → les etiquetes llargues
   ("Intervencions artístiques") es tallen. Deixem créixer el desplegable fins al
   contingut (amb un topall) i permetem que el text de l'opció faci wrap. */
.general-filter-div .filter-select .nice-select .list {
    width: max-content;
    min-width: 100%;
    max-width: 320px;
}
.general-filter-div .filter-select .nice-select .option {
    white-space: normal;
    line-height: 1.4;
    padding-top: 7px;
    padding-bottom: 7px;
}

/* Mapa interactiu */
.cbp-hrmenu > ul > li { margin: 0px 8px; }
.map-title { display: none; }
.mobile-menu.open { z-index: 9999; }
.rutes-bar ul li .rutes-img img { aspect-ratio: 1; }
.page-template-map-base .siguenos-sec,
.page-template-map-base footer { display:none; }
.page-template-map-base .icon-label span.icon-label-prefix  { display:none; }
.page-template-map-base .cat-sec { top: 25px; }
.page-template-map-base .content { position: relative; }

/* Esports */
.page-template-que-fer .boto { color:#fff; text-decoration: none; margin-bottom: 20px; }
.page-template-que-fer .boto:hover { text-decoration:underline; }

/* Whatsapp */
.mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-trigger .mwai-icon-container { bottom:-64px!important; right:-5px;}
.mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-trigger .mwai-icon-container img { width: 48px!important; height: 48px!important; }
.cky-revisit-bottom-right { bottom: 10px!important; right: 10px!important; }
.cky-btn-revisit-wrapper { width: 48px!important; height: 48px!important; }
.mwai-timeless-theme .mwai-trigger .mwai-icon-container .mwai-icon { filter: drop-shadow(0px 0px 15px rgba(0, 0, 0, 0.0)); transition: all 0.2s ease-out; }

/* Home */
.coniex-mid p { margin-bottom: 20px; font-size: 16px; line-height: 24px; }
.coniex-mid a.blue-btn { margin-top: 15px; }
.siguenos-sec.title-sec h2 { margin-bottom: 20px; }
.siguenos-sec.title-sec p { margin-bottom: 30px; }
.siguenos-sec.title-sec p a { margin-bottom: 30px; }
.coniex-main .coniex-txt h3 { color: #182A3F; margin-top: 4px; }
.coniex-main .coniex-txt p { color: rgba(24, 43, 64, 0.7); margin-top: 8px;}

/* Què fer */
.page-template-que-fer .contingut h2,
.page-template-que-fer .title-sec p { text-align: center; }

/* Entradeta pàgina de filtres */
.page-template-general-list .espais-filter-div h3,
.page-template-pagina-lliure .espais-filter-div h3 { color:#182A3F; margin-bottom: 12px; text-align: center; width:80%; margin-left:10%; margin-right:10%; font-size:18px; line-height: 28px; }

.page-template-general-list .espais-filter-div h4,
.page-template-pagina-lliure .espais-filter-div h4, { color:#182A3F; margin-bottom: 12px; text-align: center; width:80%; margin-left:10%; margin-right:10%; font-size:16px; line-height: 26px; }

.page-template-general-list .espais-filter-div p,
.page-template-pagina-lliure .espais-filter-div p { color:#182A3F; margin-bottom: 12px; text-align: center; width:80%; margin-left:10%; margin-right:10%; font-size:14px; line-height: 24px; }

.page-template-general-list .espais-filter-div,
.page-template-pagina-lliure .espais-filter-div { margin-top: 10px; }

.page-template-general-list .in-ban-lft h1,
.page-template-pagina-lliure .in-ban-lft h1 {text-align: center;}

.page-template-general-list .espais-main-sec,
.page-template-pagina-lliure .espais-main-sec {
    padding: 0px 0px 0px;
}

.page-template-general-list .hm-picafort-sec .title-sec h2,
.page-template-pagina-lliure .hm-picafort-sec .title-sec h2 {
	padding-top: 30px;
	border-top: 2px solid rgba(24, 42, 63, 0.15);
}

/* Bloc Banner/card al 100% amplada */
.qualitat-list .qualitat-cont h4 { font-size: 16px; line-height: 1.2; font-family: 'LEMONMILK-Medium'; letter-spacing: 0px; margin-bottom:0px; }
.qualitat-list ul li:nth-child(even) .qualitat-cont h4 { color: #048B98; }


/* Contingut flexible "Planifica la visita": tabs + CTA final */
.hm-planificia .plan-menu-lst a { cursor: pointer; }
.hm-planificia .planificia-cta { float: left; width: 100%; text-align: center; margin-top: 60px; }

/* Contingut flexible "Botons": grup d'enllaços amb estil normal/invertit i alineació */
.cf-botons { float: left; width: 100%; }
.cf-botons .cf-botons-inner { display: flex; flex-wrap: wrap; gap: 15px; align-items: center; }
.cf-botons--esquerra .cf-botons-inner { justify-content: flex-start; }
.cf-botons--centre .cf-botons-inner { justify-content: center; }
.cf-botons--dreta .cf-botons-inner { justify-content: flex-end; }
.cf-botons a.cf-boto {
    display: inline-flex; align-items: center; justify-content: center; column-gap: 10px;
    height: 45px; padding: 0 35px; border-radius: 30px;
    font-size: 15px; font-family: 'LEMONMILK-Medium'; text-transform: uppercase; letter-spacing: 0.72px;
    color: #fff; transition: all 0.5s ease;
}
/* Estil independent per botó */
/* Blau clar: fons turquesa, text blanc */
.cf-botons a.cf-boto--blau_clar { background: #048B98; color: #ffffff; }
.cf-botons a.cf-boto--blau_clar:hover { background: #182A3F; color: #ffffff; }
/* Blau fosc: com .blue-btn (fons blau fosc, hover groc amb text fosc) */
.cf-botons a.cf-boto--blau_fosc { background: #182A3F; color: #ffffff; }
.cf-botons a.cf-boto--blau_fosc:hover { background: #F3BE3A; color: #182A3F; }

/* Missatge "No s'han trobat resultats" dels llistats AJAX (general, blog, agenda,
   espais, allotjaments, experiencies, platges, rutes, descarregues). El JS de cada
   llistat el mostra quan found_posts === 0. */
.list-empty {
    width: 100%;
    padding: 40px 24px 80px;
    text-align: center;
    color: #7a8893;
    font-size: 18px;
}

/* BLOC QUE FER */
a.blue-btn { width: auto; }
.hm-quefer a.blue-btn { margin-top: 28px; }
.hm-quefer .title-sec { margin-bottom: 30px; }

/* AJUSTOS HOME */
.home .hm-picafort-sec { padding: 90px 0px 0px 0px; }
.agenda-main .agenda-txt p { font-size: 16px; color: #515151ab;}
.hm-platjes-sec .title-sec { margin-bottom: 0px; }
.hm-platjes-sec .title-sec p { margin-bottom: 30px; width: 80%; margin-left: 10%; margin-right: 10%; }


/* ACCESSIBILITAT */
body #wp_access_helper_container button.aicon_link {
    position: absolute;
    left: unset;
}

body #wp_access_helper_container button.aicon_link, body #wp_access_helper_container button.aicon_link>img {
    background: none !important
}

body #wp_access_helper_container button.aicon_link {
    right: 220px !important;
    top: 110px !important;
}

/* ART URBÀ */

.single-art-urba .esp-lft-cont iframe {
	border-radius: 10px;
	margin-top: 25px;
}

.page-template-general-list .hm-contingut-lliure,
.page-template-pagina-lliure .hm-contingut-lliure {
    padding-bottom:0;
}

.page-template-general-list .espais-main-sec,
.page-template-pagina-lliure .espais-main-sec {
    padding-top:0px;
}

/* SMCP-37 — Bloc "MÉS COSES A FER" (cards_quefer) al final del llistat
   d'experiències. El .hm-quefer arrossega el margin-bottom de la home (125px);
   aquí el bloc és l'últim abans de "Segueix-nos", així que l'anul·lem.
   (El buit gran real el causava el grid amb files fixes — resolt a
   .cards-quefer.estil-cards .grid amb grid-template-rows: none.) */
.page-template-general-list .hm-picafort-sec .hm-quefer,
.page-template-pagina-lliure .hm-picafort-sec .hm-quefer {
    margin-bottom: 0;
}

/* ===================================================================
   SMCP-36 — Bloc flexible "Introducció 3 columnes" (intro_3col)
   Fons #DEEFEE, padding vertical 65px. 3 columnes: títol 23% · text 23%
   · collage 46% amb gaps del 4%. El collage són 5 imatges superposades.
   Responsive a override-media.css (s'apilen).
   =================================================================== */
.cf-intro3col {
    background: #DEEFEE;
    padding: 65px 0;
    float: left;
    width: 100%;
    min-height: 510px;
}
.cf-intro3col .i3c-grid {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 4%;
    width: 100%; /* el contenidor flex de nivell bloc col·lapsa a 0 amb el CSS base del tema */
}
.cf-intro3col .i3c-title { flex: 0 0 23%; max-width: 23%; }
.cf-intro3col .i3c-text  { flex: 0 0 23%; max-width: 23%; }
.cf-intro3col .i3c-collage { flex: 0 0 46%; max-width: 46%; }

.cf-intro3col .i3c-title h2 {
    font-family: 'Roboto-SemiBold';
    font-size: 28px;
    line-height: 38px;
    color: #404040;
    margin: 0;
}
.cf-intro3col .i3c-text,
.cf-intro3col .i3c-text p {
    font-family: 'Roboto-Regular';
    font-size: 16px;
    line-height: 26px;
    color: #404040;
}
.cf-intro3col .i3c-text p { margin: 0 0 22px; }
.cf-intro3col .i3c-text p:last-child { margin-bottom: 0; }
.cf-intro3col .i3c-text b,
.cf-intro3col .i3c-text strong { font-family: 'Roboto-Bold'; font-weight: normal; }

/* Collage: contenidor relatiu; cada figura absolutament posicionada per
   recrear la superposició de la maqueta. object-fit cover perquè cada foto
   ompli la seva targeta amb qualsevol proporció d'origen. */
.cf-intro3col .i3c-collage {
    position: relative;
    align-self: stretch;
    margin-bottom: -50px;
}

.cf-intro3col .i3c-img {
    position: absolute;
    margin: 0;
    overflow: hidden;
    border-radius: 10px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
}
.cf-intro3col .i3c-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.cf-intro3col .i3c-img-1 { top: 0;    left: 16%; width: 48%; aspect-ratio: 1.5;  z-index: 3; }
.cf-intro3col .i3c-img-2 { top: 20%;  left: 0;   width: 32%; aspect-ratio: 0.75;  z-index: 4; }
.cf-intro3col .i3c-img-3 { top: 44%;  left: 26%; width: 35%; aspect-ratio: 0.75;  z-index: 3; }
.cf-intro3col .i3c-img-4 { top: 8%;   right: 0;  width: 48%; aspect-ratio: 1.5;  z-index: 2; }
.cf-intro3col .i3c-img-5 { top: 54%;  right: 6%;  width: 44%; aspect-ratio: 1.5;  z-index: 3; }

/* BLOC RELACIONATS */
.hm-picafort-sec {
    background:none;
    padding-bottom: 50px;
}

@media screen and (min-width: 1367px) and (max-width: 1500px) {
    .hm-picafort-sec {
        padding-bottom: 100px!important;
    }
}

.hm-picafort-sec .content h2,
.hm-picafort-sec .content .card-titol {
    margin-bottom:0px;
}


.qualitat-list .qualitat-cont p,
.cf-text-imatge .ti-text p {
    font-size: 16px;
    line-height: 1.6;
}

/* COLUMNES ELEMENTS PATRIMONIALS */
.elements-patrimonials .cards-quefer.estil-icones .grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

/* FITXA "ON SOM" */
.single-on-som .itineraris-slider {
	display: none;
}

.single-on-som .cf-text-imatge .ti-img img,
.single-on-som .qualitat-list .qualitat-img img {
    object-fit: cover;
    aspect-ratio: 1;
}

/* BOTÓ AUDIOGUIA */
button.escolta-tag{
    background-color: transparent;
    border: none;
    float: left;
    width: auto;
    cursor: pointer;
    padding: 0px;
}

/* JIRA SMCP-48 */
.contact-sec .contact-main li.social {
    display: flex;
    flex-direction: column;
}

.contact-form .form-box input[type="email"], .form-box textarea {
    width: 100%;
    color: #182A3F;
    font-family: 'Roboto-Regular';
    padding: 10px 18px 10px;
    height: 50px;
    border-radius: 9px;
    border: 1px solid #DDDDDD;
    font-size: 16px;
    transition: all .5s ease;
    background: #ffffff;
}

.map-section {
    position: relative;
    width: 100%;
    clear: both;
    padding-bottom: 20px;
}

.map-section .row {
    position: relative;
}

#map {
    position: relative;
    width: 100%;
}

.contact-sec .contact-main .contact-left > p {
    margin-top: 30px;
}

.contingut-general{
    font-family: 'Roboto-Regular';
    font-size: 16px;
    line-height: 26px;
    color: #515151;
    margin-bottom: 15px;
}

.contingut-general h2{
    font-family: 'LEMONMILK-Medium';
    font-size: 26px;
    line-height: 1.3;
    color: #182A3F;
    margin: 36px 0 16px;
}
/* FI JIRA SMCP-48 */

/* La card sencera */
.visita-main.visita-img--imatge {
    position: relative;
    overflow: hidden;
}

/* El contenidor de la imatge ocupa tota la card */
.visita-main.visita-img--imatge > .visita-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    float: none;
    display: block;
}

/* La imatge omple tot l'espai sense deformar-se */
.visita-main.visita-img--imatge > .visita-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    float: none;
}

/* El text queda per sobre de la imatge */
.visita-main.visita-img--imatge > .visita-txt {
    position: relative;
    z-index: 2;
}

/*estilar llistats*/
.ti-main .ti-text ul {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}

.ti-text ul li {
    position: relative;
    padding-left: 28px;
    margin-bottom: 12px;
    line-height: 1.5;
    font-size: 16px;
}

.ti-text ul li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #000;
}
/* fi estilar llistats */

.page-template-platges-list .cap-color-blau_fosc.inner-banner .breadcrum {
    top: 20%;
}

.page-template-que-fer .in-ban-lft h1,
.page-template-platges-list .in-ban-lft h1 {
    text-align: center;
}


/* Botó flotant Whatsapp */

.whatsapp-float {
    position: fixed;
    right: 10px;
    bottom: 66px;
    width: 48px;
    height: 48px;
    background: #25D366;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    transition: transform .2s ease, box-shadow .2s ease;
}

.whatsapp-float img {
    width: 21px;
    height: 21px;
    display: block;

    /* Importante */
    pointer-events: none;
    user-select: none;
}

.whatsapp-float:hover {
    transform: scale(1.06);
}

.whatsapp-tooltip {
	display: none;
}

.chat-link {
	display: none;
}

/* Single rutes */

.single-ruta .head-top {
	position:static;
}

.single-ruta .ruta-slide {
	margin-top: 20px;
}

.single-ruta .blog-main .blog-img img {
	aspect-ratio: 1.5;	
	object-fit: cover;
}

.rutes-sec {
    display: flex;
}

.rutes-detail-sec {
    padding-bottom: 10px;
}

.related-blogs-sec {
    padding: 70px 0 150px;
}

.single-ruta .siguenos-sec {
    margin-top: -100px;
}

.ruta-div {
    padding: 40px 0 60px;
}

.ruta-list ul {
    row-gap: 18px;
}

.rutes-irati-cnt h3 a {
    font-size: 25px;
}


/* Bloc xarxes */

.siguenos-inst ul > li {
    flex: 0 1 11.5%;
}

.siguenos-inst ul {
    column-gap: 1%;
}

.siguenos-sec h2 {
    font-size: 38px;
    line-height: 1.2;
}

.share-links {
    padding-top: 35px;
}

.siguenos-inst ul > li {
    border-radius: 20px;
}

.share-links ul {
    column-gap: 9%;
}

.siguenos-sec {
    padding: 125px 0px 170px;
}

.llistat-rutes .cf-text-imatge.color-blau .ti-img {
    padding:50px 0;
}

.page-template-rutes-list .cf-text-imatge .ti-cont {
    padding-left:0px;
}

.page-template-rutes-list .cf-text-imatge .ti-img {
	
    padding-left: 20px;
}

.page-template-rutes-list .plat-top-rgt p strong {
    font-family: 'Roboto-Medium';
}



/* Single platges */

.single-platja .plat-det-slide .swiper-slide {
    width: 14% !important;
}

.single-platja .sabies-map-div #map {
    border-radius: 10px 10px 10px 10px;
    margin-top: 80px;
    margin-left:7%;
    margin-right:7%;
    width: 86%;
}

.single-platja a.gmap-btn {
    right: 9%;
    top: 18%;
}

.single-platja .sabies-lft > img {
    border-radius: 10px 10px 10px 10px;
}

.single-platja .sabies-title-div p {
    margin-left:15%;
    margin-right:15%;
    width: 70%;
}

.single-platja .sabies-title-div p {
    text-align: left;
}

.single-platja .sabies-title-div p strong {
        font-family: 'Roboto-Bold';
}

.single-platja .sabies-title-div p img {
	width: 100px;
	height: 100px;
    float: left;
    margin-right: 25px;
    border-radius: 100px;
}

.single-platja .sabies-que-sec {
    padding: 0px 0px 30px;
}

.row.audioguia-platges {
    display: flex;
    justify-content: center;
    padding-top:30px;
}

.single-platja .picafort-main-sec {
    padding: 0px 0px 100px;
}

.platges-single-sec {
    padding: 65px 0px 10px 0px;
}

/* Sicted */

.turistica-img {
    flex: 0 1 40%;
}

/* Esports */

.mobilon {
	margin-top: -30px!important;
}

.hm-contingut-lliure .contingut-lliure-inner img.logon {
	margin:0px!important; 
	margin-top: 10px!important;
}

/* Menu */

.cbp-hrsub-inner-lft .menu-rht .menu-cbp-div ul li ul li a.menu-lloc {
	font-family: 'LEMONMILK-Light';
	font-size: 13px!important;
}

/* Mini bus iframe */

.carrilets-map {
  width: 100%;
  min-height: 600px;
}

.carrilets-map iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

/* START JIRA SMCP-52 */
.single-platja .cap-color-blau_fosc.inner-banner .breadcrum {
    top: 20%;
}

.espais-single-sec.espai-full-swipper .espais-single-lft {
    width: 100%;
}

.post-platja .esp-slider .swiper-wrapper {
    justify-content: flex-start;
}
/* END JIRA SMCP-52 */

/* Galeria platges */
.single-platja .espais-single-sec {
    padding: 40px 0px 0px 0px;
}

.single-platja .espais-single-main {
	margin-left: 10%;
	margin-right: 10%;
	width: 80%;		
}

/* Cercador */
.search-tags ul {
    width: 50%;
	margin-left:25%;
	margin-right:25%;
	padding: 0px;
}

.search-lst-sec .search-count strong {
    font-family: 'Roboto-Bold';
}

.search-lst-sec .search-count span {
    font-family: 'Roboto-Bold';
}

.arbol-list ul li a.active {
	color:#4EB5B0;	
	font-family: 'Roboto-Bold';
}

.search-results .result-search-inner h1 {
    margin-bottom: 25px;
}

.search-results .result-search-inner {
    padding-top: 0px;
}

.search-results .search-lst-sec h3 {
    padding: 0px;
}

.search-results .result-list {
    margin-top: 15px;
}

.search-results .search-lst-sec ul li .arbol-img img {
    aspect-ratio: 1.3333;
    object-fit: cover;
}

.search-results .search-lst-sec ul li .arbol-img {
    width: 200px!important;
    min-width: 200px!important;
    min-height: 150px;
}

.search-results .siguenos-sec {
    background-color: #f8f9fb;
}

.search-results .search-lst-sec ul li .arbol-cnt h6 {
    color:#4EB5B0;
    margin-bottom: 5px;
}

.search-results .search-lst-sec ul li .arbol-cnt {
    padding: 0px 0px 0px 30px;
}

.search-results .search-lst-sec ul li .arbol-cnt h4 {
    margin: 0 0 5px 0;
    font-size: 20px;
}

.search-results .search-lst-sec ul li .arbol-cnt p {
    font-size: 14px;
    line-height: 1.5;
    margin-right: 30px
}
/* END Cercador */

/* Etiquetes mapa */
.page-template-map-base .cat-list ul { 
	display: none;
}

/* END Etiquetes mapa */

/* FAQs */
.page-template-faqs .search-filter  {
	display: none;
}
/* end FAQs */

/* Agenda */
.ui-datepicker td.has-event > a.ui-state-default::after {
    position: absolute;
    display: block;
    content: "";
    width: 28px;
    height: 28px;
    z-index: -1;
    border-radius: 50%;
    top: -2px;
    opacity: 1;
    right: 0;
    margin: auto;
    bottom: 0;
    transition: all 0.5s ease;
}

.ui-datepicker td.has-event > a.ui-state-default {
    color: white;
}
/* end Agenda */

/** Filtres rutes **/
.platges-dist-sec {
    padding: 50px 0px 65px 0px;
}
 
.platges-dist-sec .filter {
    padding: 0px 0px 27px;
}
 
.platges-dist-sec .filter a.boto {
    margin: 0 2px 0 0;
    border: 3px solid #deefee;
    color: #182a3f;
    background:#ffffff;
    cursor: pointer;
}
 
.platges-dist-sec .filter a.boto.active {
    background: #048B98;
    color: White;
}
/** end Filtres rutes **/

/* Planificador */

.planner-section__title {
    font-family: 'LEMONMILK-Medium';
}

.planner-page-title {
    font-family: 'LEMONMILK-Medium';	
}

.planner-form__title {
    font-family: 'Roboto-Regular';	
    color:#fff!important;
    opacity: 0.6;
}

.planner-submit {
    font-family: 'LEMONMILK-Medium';	
}

.page-template-agenda .banner-shape {
	display: none;
}

.planner-stop-list {
    max-height: 560px!important;
}

.planner-service-group--lodging {
	margin-top: 20px!important;
}

.planner-service-group .last-h3 {
    font-family: 'LEMONMILK-Medium';		
    font-size: 0.8rem!important;
}

.planner-service-list {
    margin-top: 10px!important;
}

.planner-day__header h2 {
    font-family: 'LEMONMILK-Medium';			
}

.planner-gpx {
    background: #048B98!important;
    font-weight: 800!important;
    padding: 0.7rem 1rem!important;
    border:0px!important;
    font-size: 14px!important;
}

.planner-mail-open {
    font-size: 14px!important;	
    font-weight: 800!important;
    border:0px!important;
    padding: 0.7rem 1rem!important;
}
	
/* end Planificador */

/* Gimcana */

.app-gimcana .hm-contingut-lliure .contingut-lliure-inner p {
	width: 70%;
	margin-left: 15%;
	margin-right: 15%;	
}

.app-gimcana .hm-contingut-lliure .contingut-lliure-inner h2 {
	font-family: 'LEMONMILK-Medium';
	font-size: 26px;
	font-weight: 400;
	line-height: 1.3;
	color: #182A3F;
	letter-spacing: -0.22px;
	text-transform: uppercase;
	margin: 36px 0 16px;
}

.app-gimcana .hm-contingut-lliure .contingut-lliure-inner h3 span,
.app-gimcana .hm-contingut-lliure .contingut-lliure-inner h2 span {
	color:#37C3BD;
}

.app-gimcana .hm-contingut-lliure {
    padding: 30px 0 70px 0;
}

.app-gimcana .hm-contingut-lliure .contingut-lliure-inner img {
    margin: 12px 0 12px;
}

/* Mapa obrir tancar */

.right-arrow a img.close-btn {
    transform: rotate(-180deg);
}

.rightsidebar.open .right-arrow .open-btn {
    transform: rotate(0deg);
}

/* LLISTA DESTACATS START */
.cf-destacats-graella ul.platges-lst { margin-top: 0; }
.cf-destacats-graella .dist-list-out + ul.platges-lst { margin-top: 35px; }
.cf-destacats-graella .dist-list-rgt { margin-left: auto; }
.cf-destacats-graella .dist-list-lft .destacats-titol { font-family: 'LEMONMILK-Medium'; font-size: 26px; line-height: 1.3; color: #182A3F; letter-spacing: -0.22px; text-transform: uppercase; }
/* LLISTA DESTACATS END */

/* LLISTAT PLATGES START */
.platges-dist-top + .esp-filter-out { margin-top: 0; }
.esp-filter-out + .platges-dist-list { margin-top: 45px; }
/* LLISTAT PLATGES END */

/* FITXA PLATJA START */
.platja-info { float: left; width: 100%; margin-bottom: 65px; }
.platja-info-cont { max-width: 936px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; column-gap: 80px; row-gap: 40px; }
.platja-info-col { border-top: 1px solid rgba(24,42,63,0.35); padding-top: 20px; }
.platja-info .platja-info-titol { font-family: 'Roboto-Bold'; font-size: 18px; line-height: 1.3; color: #182A3F; letter-spacing: 0.5px; text-transform: uppercase; margin: 0 0 15px; }
.platja-info-text p { font-family: 'Roboto-Regular'; font-size: 16px; line-height: 1.6; color: #404040; margin-bottom: 12px; }
.platja-info-text p:last-child { margin-bottom: 0; }
.platja-info-text strong, .platja-info-text b { font-family: 'Roboto-Bold'; font-weight: normal; }
.platja-horaris { display: grid; grid-template-columns: max-content 1fr; column-gap: 30px; row-gap: 6px; margin: 0; font-family: 'Roboto-Regular'; font-size: 16px; line-height: 1.6; color: #404040; }
.platja-horaris dt::after { content: ':'; }
.platja-horaris dd { margin: 0; }
/* FITXA PLATJA END */

/** Chat-bot **/
.admin-bar .accessability_container {
    top: 0px;
}

.mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-trigger .mwai-icon-container,
.mwai-timeless-theme.mwai-window .mwai-header .mwai-avatar {
    width: 48px;
    height: 48px;
    /* background: #000; */
    /* border-top-left-radius: 27px; */
    /* border-bottom-left-radius: 27px; */
    display: flex;
    align-items: center;
    overflow: hidden;
    transition: width .4s !important;
    cursor: pointer;
}

.mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-trigger .mwai-icon-container .mwai-icon,
.mwai-timeless-theme.mwai-window .mwai-header .mwai-avatar img {
    display: none;
}

.mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-trigger .mwai-icon-container::before,
.mwai-timeless-theme.mwai-window .mwai-header .mwai-avatar::before {
    content: "";
    width: 54px;
    height: 48px;
    flex: 0 0 48px;
    background-image: url(../images/ico-chatbot.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
}

/* ACCESIBILIDAD START */
:focus-visible { outline: 2px solid #048B98; outline-offset: 2px; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.agenda-main .agenda-txt span.date { display: block; color: #048B98; font-size: 18px; line-height: 1.2; font-family: 'Roboto-Regular'; letter-spacing: 0.14px; margin-top: 18px; }
.agenda-main .agenda-txt span.date span { font-family: 'Roboto-ExtraBold'; }
.espais-main .espais-txt span.date { display: block; color: #048B98; font-size: 16px; line-height: 1.2; font-family: 'Roboto-Light'; letter-spacing: 0.12px; margin-top: 16px; }
.espais-main .espais-txt span.date span { font-family: 'Roboto-Bold'; }
#map .espais-main .espais-txt span.date { font-size: 14px; margin-top: 15px; }
.coniex-main .fav-icon span.wishlist-ico { background: url("../../resources/v1/images/ico-favorit-off.svg") no-repeat center center; width: 40px; height: 40px; display: block; }
.coniex-main:hover .fav-icon span.wishlist-ico { background: url("../../resources/v1/images/ico-favorit-on.svg") no-repeat center center; }
.espais-single-lft .agenda-data { display: block; color: #048B98; font-size: 18px; line-height: 1.2; font-family: 'Roboto-Light'; letter-spacing: 0.14px; margin-bottom: 20px; }
.espais-single-lft .agenda-data span { font-family: 'Roboto-Bold'; }
.espais-single-lft .esp-destacat { color: #515151; font-size: 20px; line-height: 1.5; font-family: 'Roboto-Medium'; letter-spacing: -0.22px; margin-bottom: 20px; }
.espais-single-lft .esp-destacat span { font-family: 'Roboto-Bold'; }
.visita-main .visita-txt .visita-titol { display: block; font-size: 24px; line-height: 1.2; font-family: 'Roboto-Medium'; color: #fff; letter-spacing: 0.01px; transition: all 0.5s ease; }
.visita-main:hover .visita-txt .visita-titol { color: #F3BE3A; }
.espais-list-div .list-count { color: #182A3F; font-size: 16px; line-height: 1.2; font-family: 'Roboto-Light'; letter-spacing: 0.34px; margin-bottom: 20px; }
.espais-list-div .list-count span { font-family: 'Roboto-Bold'; }
.allot-list-div .list-count { color: #048B98; }
.search-results .search-lst-sec h2.search-count { display: block; float: left; width: 100%; margin: 0; padding: 0; font-size: 16px; font-family: 'Roboto-Regular', sans-serif; font-weight: 400; color: #333333; line-height: 20px; letter-spacing: 0.29px; text-transform: none; }
.search-results .search-lst-sec h2.search-count span { font-family: 'Roboto-Bold'; font-weight: 400; }
.search-results .search-lst-sec ul li .arbol-cnt .arbol-cat { display: block; order: -1; float: left; width: 100%; margin: 0 0 5px; padding: 0; font-size: 14px; font-family: 'Roboto-Regular', sans-serif; font-weight: 800; color: #4EB5B0; line-height: 18px; letter-spacing: 0.47px; text-transform: uppercase; text-align: left; }
.search-results .search-lst-sec ul li .arbol-cnt h3.arbol-titol { display: block; float: left; width: 100%; margin: 0 0 5px; padding: 0; font-size: 20px; font-family: 'LEMONMILK-Medium', sans-serif; font-weight: 700; color: #333333; line-height: 32px; letter-spacing: normal; text-transform: none; transition: all .5s ease; }
.search-results .search-lst-sec ul li:hover .arbol-cnt h3.arbol-titol { color: #182A3F; }
.som-irati-btm .som-destacat { font-size: 20px; line-height: 1.4; font-family: 'LEMONMILK-Medium'; text-transform: uppercase; color: #182A3F; letter-spacing: -0.22px; margin-bottom: 22px; }
.allot-main .allot-txt span.loc { display: block; color: #515151; font-size: 16px; line-height: 1.2; font-family: 'Roboto-Regular'; letter-spacing: 0.12px; margin-bottom: 12px; padding-left: 25px; background: url('../../resources/v1/images/ico-location-card.svg') no-repeat left top 2px; }
.plat-top-lft .plat-intro { color: #404040; font-size: 22px; line-height: 1.5; font-family: 'Roboto-Semibold'; }
.dist-list-lft .list-count { color: #182A3F; font-size: 16px; line-height: 1.2; font-family: 'Roboto-Light'; letter-spacing: 0.34px; }
.dist-list-lft .list-count span { font-family: 'Roboto-Bold'; }
.inner-title-sec .inner-intro { font-size: 20px; line-height: 1.4; color: #515151; font-family: 'Roboto-Medium'; letter-spacing: -0.22px; }
.content .card-titol { font-size: 30px; line-height: 1.2; font-family: 'Roboto-Semibold'; margin-bottom: 10px; color: #fff; }
.plat-det-main .plat-det-txt .plat-det-titol { font-size: 20px; line-height: 1.4; font-family: 'Roboto-Medium'; color: #fff; letter-spacing: 0.01px; transition: all 0.5s ease; }
.plat-det-main:hover .plat-det-txt .plat-det-titol { color: #EB663C; }
.sabies-rgt .sabies-text { font-size: 22px; line-height: 1.4; font-family: 'Roboto-Medium'; color: #404040; }
.mob-filter h2 { font-family: 'LEMONMILK-Medium'; color: #292857; font-size: 25px; line-height: 30px; letter-spacing: -0.37px; }
.inner-banner1 .in-ban-lft .ban-avanttitol, .inner-banner2 .in-ban-lft .ban-avanttitol { display: block; color: #4EB5B0; font-size: 20px; line-height: 1.2; font-family: 'LEMONMILK-Medium'; letter-spacing: -0.22px; margin-bottom: 15px; }
.hm-contingut-lliure .contingut-lliure-inner .titol-petit, .hm-contingut-lliure .contingut-lliure-inner .intro { font-family: 'LEMONMILK-Medium'; font-size: 26px; line-height: 1.3; color: #182A3F; letter-spacing: -0.22px; text-transform: uppercase; margin: 36px 0 16px; }
.hm-contingut-lliure .contingut-lliure-inner > .titol-petit:first-child, .hm-contingut-lliure .contingut-lliure-inner > .intro:first-child { margin-top: 0; }
.hm-contingut-lliure .contingut-lliure-inner .subtitol { font-family: 'Roboto-SemiBold'; font-size: 20px; line-height: 1.3; color: #182A3F; letter-spacing: normal; text-transform: none; margin: 26px 0 12px; }
.hm-contingut-lliure .contingut-lliure-inner .intro-petita { font-family: 'LEMONMILK-Medium'; font-size: 16px; line-height: 1.4; color: #182A3F; letter-spacing: -0.22px; text-transform: uppercase; margin: 0 0 20px; }
.destinacio-cont .intro { color: #515151; font-size: 20px; line-height: 1.4; font-family: 'Roboto-Medium'; letter-spacing: -0.22px; margin-bottom: 35px; }
.turistica-cont .intro { color: #515151; font-size: 20px; line-height: 1.4; font-family: 'Roboto-Medium'; letter-spacing: -0.29px; margin-bottom: 25px; }
.esp-lft-cont .esp-descripcio { font-size: 20px; line-height: 1.4; font-family: 'Roboto-Semibold'; color: rgba(51,51,51,0.75); letter-spacing: -0.22px; margin-bottom: 22px; }
.esp-lft-cont.contingut .esp-descripcio { font-size: 16px; line-height: 1.4; font-family: 'LEMONMILK-Medium'; text-transform: uppercase; color: #182A3F; letter-spacing: -0.22px; margin-bottom: 20px; }
.espais-single-rgt h2 { font-size: 26px; line-height: 1.2; font-family: 'Roboto-Semibold'; color: #182A3F; margin-bottom: 20px; letter-spacing: -0.72px; }
/* ACCESIBILIDAD END */

/* OMBRA CAPÇALERA */
.inner-banner::before {

    height: 100%;
    background: linear-gradient(to bottom, rgba(49, 35, 53, 0.3) 0%, rgba(0, 0, 0, 0) 100%);
}

/* end OMBRA CAPÇALERA */

/* FOOTER SENSE NEWSLETTER START */
.siguenos-sec {
    margin-bottom: 0;
    padding-bottom: 125px;
}
/* FOOTER SENSE NEWSLETTER END */