/*
Theme Name: Casa Gari
Theme URI: https://wordpress.org/themes/twentytwentyfour/
Author: the WordPress team
Author URI: https://wordpress.org
Description: Copy of Twenty Twenty-Four. Twenty Twenty-Four is designed to be flexible, versatile and applicable to any website. Its collection of templates and patterns tailor to different needs, such as presenting a business, blogging and writing or showcasing work. A multitude of possibilities open up with just a few adjustments to color and typography. Twenty Twenty-Four comes with style variations and full page designs to help speed up the site building process, is fully compatible with the site editor, and takes advantage of new design tools introduced in WordPress 6.4.
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.0
Version: 1.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: casagari
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

/* Oculta por defecto */
.i18n-es, .i18n-ca, .i18n-en, .i18n-fr { display: none; }

/* Muestra según el idioma activo */
:lang(es) .i18n-es { display: revert; }
:lang(ca) .i18n-ca { display: revert; }
:lang(en) .i18n-en { display: revert; }
:lang(fr) .i18n-fr { display: revert; }

html {
  scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

body {
	font-family: "Cormorant Garamond", serif;
  font-size: 18px;
}

a,
a:hover {
  text-decoration: none;
}

/* Evita que aparezca el overlay nativo */
.wp-block-navigation__responsive-container { display: none !important; }
body.has-modal-open { overflow: auto !important; }
.wp-block-navigation__responsive-container.is-menu-open { display:none !important; }


/* Overlay: pantalla completa */
.c-overlay[hidden] { display: none !important; }

.c-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;

  display: flex;
  align-items: center;
  /*justify-content: center;*/
  opacity: 0;                 /* estado base (cerrado) */
  pointer-events: none;       /* no interactivo cuando está cerrado */
  transition: opacity .25s ease;  /* en sync con setTimeout(250) */
  will-change: opacity;

  /*padding-top: 45px;
  padding-bottom: 45px;
  padding-left: var(--wp--style--root--padding-left);
  padding-right: var(--wp--style--root--padding-right);*/
}

.c-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
}

/* Panel que contiene todo */
.c-overlay__panel {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  /*justify-content: center;*/
  background: #000;           /* fondo negro */
  color: #fff;                /* texto blanco */

  /* Animación de entrada/salida del panel */
  opacity: 0;
  transform: translateY(12px) scale(.98);
  transition: transform .25s ease, opacity .25s ease;
  will-change: transform, opacity;
}

.c-overlay.is-open .c-overlay__panel {
  opacity: 1;
  transform: none;
}

/* Botón cerrar (esquina superior derecha) */
.c-overlay__close {
  position: absolute;
  top: 103px;
  right: 15%;
  font-size: 4rem;
  background: none;
  border: 0;
  color: #fff;
  cursor: pointer;
  font-family: "Cormorant Garamond", serif;
}

/* Contenido centrado */
.c-overlay__content {
  text-align: center;
  /*margin-top: 86px;*/
}

.c-overlay__logo {
  padding: 132px 0px 50px 0px;
}

/* Logo centrado */
.c-overlay__logo img {
  max-width: 200px;
  height: auto;
  /*margin-bottom: 2rem;*/
}

.c-overlay__nav {
  display: flex;
  flex-direction: column;     /* apila logo y nav */
  justify-content: center;    /* centra vertical */
  align-items: center;        /* centra horizontal */
  min-height: 100%;           /* ocupar toda la altura disponible */
  text-align: center;
}

/* Navegación centrada */
.c-overlay__nav .menu li {
  /*margin: 1rem 0;*/
  letter-spacing: 7px;
  height: 50px;
}

.c-overlay__nav .menu a {
  color: #fff;
  /*font-size: 1.5rem;*/
  text-decoration: none;
}

/* Accesibilidad: respetar usuarios que prefieren menos movimiento */
@media (prefers-reduced-motion: reduce) {
  .c-overlay,
  .c-overlay__panel {
    transition: none;
  }
}




/* El selector de idioma al fondo */
.language-switcher {
  margin-top: auto; /* empuja hacia abajo */
  margin-bottom: 2rem;
  width: 100%;
  display: flex;
  justify-content: center; /* centrado horizontal */
}

.language-switcher ul {
  /*display: flex;
  gap: 1.5rem; */
  list-style: none;
  padding: 0px 20px;
  margin: 0;
}

.language-switcher li {
  /*display: flex;
  align-items: center;*/
  display: inline;
}

.language-switcher li:not(:last-child)::after {
  content: "/";
  margin-left: .5rem;
  margin-right: .5rem;
  color: #fff; /* mismo color que el texto */
  opacity: 0.7; /* un poco más suave */
}

.language-switcher a {
  color: #fff;          /* texto blanco para overlay negro */
  text-decoration: none;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: .5rem;           /* espacio bandera-texto */
}

.language-switcher a:hover {
  text-decoration: none;
}

.language-switcher .current-lang a {
  font-weight: 700;     /* resalta el idioma actual */
}





.img-contacto {
	max-width: 1000px!important;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}


.is-layout-constrained > .alignwidefull {
  max-width: 1600px;
}

.block-editor-block-list__layout.is-root-container > .alignwidefull {
  max-width: 1600px!important;
}

.boder-simple table {
  /*border-top: 1px solid #111;
  border-bottom: 1px solid #111;*/
  border: none;
  overflow: hidden;
}
.boder-simple table tr td{
  border: none;
  border-left: 1px solid #111;
  border-right: 1px solid #111;
  padding: 0px 10px 0px 10px;
}

/*
.boder-simple table img {
  margin-bottom: -20px;
}
*/

.pantalla-completa-vertical {
  min-height: calc(100vh - 300px);
}
.pantalla-completa-vertical2 {
  min-height: 100vh;
}


/* Centrado vertical (y horizontal opcional) */
.pantalla-completa-vertical3{
  min-height: calc(100vh - 300px);
  display: flex;
  flex-direction: column; /* apila los <p> */
  justify-content: center;/* centra en vertical */
  align-items: center;    /* opcional: centra en horizontal */
  gap: 0.75rem;           /* espacio entre párrafos */
}

/* Evita márgenes colapsados de los <p> */
.pantalla-completa-vertical > p{
  margin: 0;
}

.onlygray {
  webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}

.img-bnw{
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%);          /* Safari */
  transition: filter .4s ease-in-out, 
  -webkit-filter .4s ease-in-out;
}

.img-bnw:hover,
.img-bnw:focus{
  filter: grayscale(0%);
  -webkit-filter: grayscale(0%);
}

/* Si prefieres que el hover sea en el contenedor/enlace: */
.link:hover .img-bnw,
.link:focus .img-bnw{
  filter: grayscale(0%);
  -webkit-filter: grayscale(0%);
}

/* Accesibilidad: menos movimiento si el usuario lo pide */
@media (prefers-reduced-motion: reduce){
  .img-bnw{
    transition: none;
  }
}


.img-atenua{
  background-color: rgba(0,0,0,.45)!important; /* el overlay */
  background-blend-mode: multiply;   /* mezcla color+imagen */
  color:#fff;
}

#icono_menu {
  cursor: pointer;
}

#icono_menu img {
  max-width: none; /*Evitamos resize del icono del menú en pantallas pequeñas */
}

.kb-splide .splide__pagination__page {
  height: 5px;
  width: 5px;
}



/* Base: quita el subrayado nativo y prepara el pseudo-elemento */
p.fade-underline a,
div.language-switcher a,
div.menu a {
/*main p a {*/
  position: relative;
  text-decoration: none;
}

/*a:hover {
  text-decoration: underline;
}*/
/* Línea “fake” que aparece con fade */
p.fade-underline a::after,
div.language-switcher a::after,
div.menu a::after {
/*main p a::after {*/
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;        /* separación respecto al texto: ajusta a tu gusto */
  width: 100%;
  height: 2px;         /* grosor de la línea */
  background: currentColor;
  opacity: 0;
  transition: opacity .25s ease;  /* suavidad */
}

/* Hover/focus: muestra la línea completa con fade */
p.fade-underline a:hover::after,
div.language-switcher a:hover::after,
div.menu a:hover::after,
div.menu a:focus::after {
/*main p a:hover::after,
main p a:focus::after {*/
  opacity: 1;
}


/* SVG responsive */
.hotspots-svg{
  width: min(100%, 600px); /* opcional limitar ancho */
  height: auto;
}

/* Interacción/feedback visual (opcional) */
.hotspots-svg a rect{
  cursor: pointer;
}
.hotspots-svg a:hover rect,
.hotspots-svg a:focus rect{
  stroke: rgba(255, 200, 0, .9);
  stroke-width: 2;
  fill: rgba(255, 200, 0, .22); /* resalta la zona al hover, opcional */
}


/* Accesibilidad: sin animaciones si el usuario lo prefiere */
@media (prefers-reduced-motion: reduce) {
  p.fade-underline a::after,
  div.language-switcher a::after,
  div.menu a::after,
  main p a::after {
    transition: none;
  }
}

/* Móvil: sin hover; aún así se puede pulsar */
@media (hover:none){
  .hotspots:hover .spot::before{ opacity:0; }
}



#teatre_salons  .splide__arrow--prev {
  left: -15px;
  background: none;
  color: #000;
  font-size: 25px;
  top: -20px;
}
#teatre_salons  .splide__arrow--next {
  right: -15px;
  background: none;
  color: #000;
  font-size: 25px;
  top: -20px;
}


#golfes  .splide__arrow--prev {
  left: -15px;
  background: none;
  color: #000;
  font-size: 25px;
  top: -20px;
}
#golfes  .splide__arrow--next {
  right: -15px;
  background: none;
  color: #000;
  font-size: 25px;
  top: -20px;
}

#sales_nobles  .splide__arrow--prev {
  left: -15px;
  background: none;
  color: #000;
  font-size: 25px;
  top: -20px;
}
#sales_nobles  .splide__arrow--next {
  right: -15px;
  background: none;
  color: #000;
  font-size: 25px;
  top: -20px;
}

#jardi_templet  .splide__arrow--prev {
  left: -15px;
  background: none;
  color: #000;
  font-size: 25px;
  top: -20px;
}
#jardi_templet  .splide__arrow--next {
  right: -15px;
  background: none;
  color: #000;
  font-size: 25px;
  top: -20px;
}
#jardi_frances  .splide__arrow--prev {
  left: -15px;
  background: none;
  color: #000;
  font-size: 25px;
  top: -20px;
}
#jardi_frances  .splide__arrow--next {
  right: -15px;
  background: none;
  color: #000;
  font-size: 25px;
  top: -20px;
}
#placa_rodona  .splide__arrow--prev {
  left: -15px;
  background: none;
  color: #000;
  font-size: 25px;
  top: -20px;
}
#placa_rodona  .splide__arrow--next {
  right: -15px;
  background: none;
  color: #000;
  font-size: 25px;
  top: -20px;
}

.overlay-apagado {
  opacity: 50% !important;
}


.estil-underline a {
  border-bottom-width: 1px ;
  border-bottom-style: solid;
}

footer .wp-block-kadence-navigation .kb-nav-link-content {
  padding-top: 0px;
  padding-bottom: 0px;
  font-weight: bold;
}

footer ul.wp-block-navigation__container .wp-block-navigation-item__label {
  text-transform: none!important;
  letter-spacing: 1.4px!important;
  font-size: 18px!important;
}


.cont-central {
  justify-content: center!important;
}

.galeria-one-image {
  position: relative;
}
.amplia-galeria-one-image {
  /*position: absolute;
  bottom: 0;
  font-size: 5em !important;
  color: black;
  text-shadow: 2px 2px #000;
  left: 50%;
  transform: translate( -50%);*/
  cursor: pointer;
  margin-top: -20px;
}


ul.menu-peu li {
  list-style-type: none;
}

ul.menu-peu ul.wp-block-navigation__submenu-container {
  display: none;
}

.estil-nowrap table td {
  word-break: normal!important;
  white-space: nowrap!important;
}
.estil-nowrap table {
  table-layout: auto !important;
  width: auto !important;
}

.txt-contraste {
  text-shadow: 1px 2px #f5f5f5;
}


@media (max-width: 781px) {

  /* —o— si prefieres lados específicos */
  .wp-block-group.margen-movil {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .wp-block-group.margen-movil p {
    max-width: 80%;

  }

  .content-contacte p.has-text-align-right {
    text-align: left !important;
  }

  .wp-block-group.center-movile,
  .center-movile,
  .wp-block-column.center-movile,
  .wp-block-column.center-movile .wp-block-group {
    align-items: center !important;
  }

  #inicio {
    padding-top: 50px!important;
    min-height: 0px!important;
    padding-bottom: 50px!important;
  }

  .c-overlay__nav.wp-block-navigation {
    min-height: auto;
  }

  #inicio-events .grup-principal {
    padding-top: 50px!important;
  }



}

.btn-panel-cookies {
    padding: 0;
    margin: 0;
    text-decoration: underline;
    cursor: pointer;
    font: inherit;
}