/*
Theme Name: txyz » Main Theme
Theme URI: https://troposfera.xyz
Author: dídac gilabert
Author URI: https://didacgilabert.com
Description: Tema de blocs del lloc principal de troposfera.xyz.
Requires at least: 6.7
Tested up to: 6.7
Requires PHP: 7.2
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: txyz-main-theme
GitHub Theme URI: didacgilabert/txyz-main-theme
Primary Branch: main
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

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
a {
	text-decoration: none;
}

a:hover {
	color: var(--wp--preset--color--accent-1); 
}

strong {
  font-weight: 500;
}

em {
  font-style: italic;
  font-weight: inherit;
}

.entry-content a {
	text-decoration-thickness: 1px !important;
	text-underline-offset: .1em;
}

/* Focus styles */
:where(.wp-site-blocks *:focus) {
	outline-width: 0;
	outline-style: solid;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
	margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
	outline-offset: 4px;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	outline-offset: 0;
}

/*
 * Progressive enhancement to reduce widows and orphans
 * https://github.com/WordPress/gutenberg/issues/55190
 */
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
	text-wrap: pretty;
}

:root :where(.is-layout-flow) > h2 {
  margin-block-start: var(--wp--preset--spacing--40);
  margin-block-end: var(--wp--preset--spacing--20);
}

/*
 * Change the position of the more block on the front, by making it a block level element.
 * https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
	display: block;
}


.wp-block-cover-image{
	z-index: 0;
}


/* 1. txyz  */

.wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--wp--preset--color--base);
  }
.wp-block-navigation:not(.has-text-color) .wp-block-navigation__responsive-container.is-menu-open {
color: var(--wp--preset--color--contrast);
}

mark {
	background: transparent;
}


footer.wp-block-template-part {
  padding-top: var(--wp--preset--spacing--80);
}

.fixed-footer {
	position: fixed;
	bottom: 0;
	width: 100%;
	padding-bottom: 0.25rem;
	padding-top: 0.25rem;
	z-index: 9;
}


.main-title {
	order: 1;
	font-weight: inherit;
  font-weight: 700;
}

.secondary-title {
	order: 2; 
	font-weight: 300;
	display: block;
  font-size: 75%;
}

/*--------------------------------------------------------------
# MY CUSTOM BUTTONS – altura igual solid / outline
--------------------------------------------------------------*/

/* Radi i base del link de botó */
:where(.wp-block-button__link) {
	border-radius: 0;
	transition: all 200ms ease;
	font-weight: 400;
}


/* Base: SOLID (sense border, padding complet) */
.wp-block-button .wp-block-button__link {
	box-sizing: border-box;
	padding: 
		calc(clamp(0.25rem, 0.25rem + 0.25vw, 0.5rem)  + 2px)
		calc(clamp(0.5rem, 0.5rem + 0.25vw, 0.75rem) + 2px);
	border-style: solid;
	border-width: 0; /* solid sense border */
}

/* OUTLINE: té border, però menys padding vertical → mateixa alçada total */
.wp-block-button.is-style-outline .wp-block-button__link {
	padding: 
		clamp(0.25rem, 0.25rem + 0.25vw, 0.5rem) 
		clamp(0.5rem, 0.5rem + 0.25vw, 0.75rem);
	border-width: 2px;
	border-style: solid;
	border-color: inherit;
	background-color: transparent;
	color: var(--wp--preset--color--contrast);
}

/* Hover (solid + outline): només canviem colors, NO el gruix */
.wp-block-button__link.wp-element-button:hover,
.wp-block-button__link:not(.has-background):hover {
	background-color: var(--wp--preset--color--accent-1);
	color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--accent-1);
}


.wp-block-button__link.wp-element-button.has-base-background-color:hover {
	background-color: var(--wp--preset--color--accent-1) !important;
	color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--accent-1);
}


.wp-block-button.is-style-outline.is-style-outline--3 .wp-block-button__link:hover {
  color: var(--wp--preset--color--base) !important;
}


/* Button for Covers */

.wp-block-cover .wp-block-button__link {
    color: var(--wp--preset--color--contrast);
    background-color: color-mix(in srgb, var(--wp--preset--color--accent-3) 100%, transparent);
}

.wp-block-cover .wp-block-button.is-style-outline .wp-block-button__link {
    color: var(--wp--preset--color--accent-3);
    background-color: transparent;
    border-color: color-mix(in srgb, currentColor 90%, transparent);
}

/*--------------------------------------------------------------
# MEDIA + POEM
--------------------------------------------------------------*/ 
.video-poem  {
	padding-top: var(--wp--preset--spacing--20);
	padding-bottom: var(--wp--preset--spacing--60);
}

.video-poem h2 {
	font-size: var(--wp--preset--font-size--large);
	font-weight: 300;
}

.video-poem p {
	font-size: var(--wp--preset--font-size--medium);
}


/*--------------------------------------------------------------
# MEDIA + TEXT SECTION
--------------------------------------------------------------*/ 

.wp-block-media-text {
	padding-top: var(--wp--preset--spacing--80);
	padding-bottom: var(--wp--preset--spacing--80);
}

.wp-block-media-text>.wp-block-media-text__content {
	padding:0 0 0 8%;
}

.wp-block-media-text.has-media-on-the-right > .wp-block-media-text__content{
	padding:0 8% 0 0 ;
}

.wp-block-media-text .media-tagline {
	text-transform: uppercase;
	font-size: var(--wp--preset--font-size--medium);
	letter-spacing: 2px;
  padding: 0;
  margin: 0;
}

.wp-block-media-text h2.wp-block-heading {
	margin-top: 0;
  font-size: var(--wp--preset--font-size--xx-large);
  text-transform: uppercase;
}

.wp-block-media-text h3 {
	margin-top: 0;
}


.heading-tagline {
	text-transform: uppercase;
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 2px;
}

@media (max-width: 600px) {
    .wp-block-media-text > .wp-block-media-text__content,
    .wp-block-media-text.has-media-on-the-right > .wp-block-media-text__content {
        padding: 0; /* Adjust padding for smaller screens */
    }
}

  
/*--------------------------------------------------------------
#  Gallery My STYLE
--------------------------------------------------------------*/ 

/* el figure és la referència */
.wp-block-gallery.has-nested-images figure.wp-block-image {
  position: relative;
  padding-bottom: 0;
  margin-bottom: 2rem !important; /* reserva l’alçada de la caption per quan e sun grid*/
}

/* caption fora, sota */
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 1.5rem;
  margin: 0;
  padding: 0rem 1em;
  background: var(--wp--preset--color--accent-3);
  color: var(--wp--preset--color--contrast);
  text-align: center;
  font-size: var(--wp--preset--font-size--small);
  text-shadow: none;
}


.wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption)::before {
  backdrop-filter: blur(0px);
  content: "";
  height: 100%;
  -webkit-mask-image: linear-gradient(0deg,#000 20%,#0000);
  mask-image: linear-gradient(0deg,#000 20%,#0000);
  max-height: 40%;
  pointer-events: none;
}


/* treu el blur del core */
.wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption)::before{
  content: none;
}
  
/*--------------------------------------------------------------
# .entry-content
--------------------------------------------------------------*/ 
.entry-content p a,
.firts-blog-page-content p a {
	font-weight: 500;
	text-decoration: underline;
}

.entry-content h2,
.single-post .entry-content h2 {
  margin-top: var(--wp--preset--spacing--60);
}

.single-post .entry-content h3 {
  margin-top: var(--wp--preset--spacing--40);
}

.entry-content .wp-block-group.has-global-padding h2,
.entry-content .wp-block-group.has-padding h2 {
  margin-top: 0;
}

.ez-toc-wrap-center {
    margin: var(--wp--preset--spacing--60) auto !important;
}

.entry-content > .wp-block-group {
  margin-top: var(--wp--preset--spacing--40);
  margin-bottom: var(--wp--preset--spacing--40);
}


/*--------------------------------------------------------------
# SCROLL ROW · BASE
--------------------------------------------------------------*/

.scroll-row .wp-block-post-template {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto;
  overflow-y: hidden;
  gap: var(--wp--preset--spacing--40);
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 0.5rem;

  scrollbar-width: none;       /* Firefox */
  -ms-overflow-style: none;    /* IE/Edge antic */
}

.scroll-row .wp-block-post-template::-webkit-scrollbar {
  display: none;               /* Chrome / Safari */
}

.scroll-row {
    margin: var(--wp--preset--spacing--60) 0;
}

/*--------------------------------------------------------------
# SCROLL ROW · ITEMS
--------------------------------------------------------------*/

.scroll-row .wp-block-post {
  width: clamp(25rem, 30vw, 35rem);
  min-width: clamp(25rem, 30vw, 35rem);
  margin: 0;
  align-self: flex-start;
}

.scroll-row .post-card {
  background: var(--wp--preset--color--contrast-1, #fff);
  border-radius: 0.5rem;
  overflow: hidden;
}

.scroll-row .wp-block-post-featured-image img {
  width: 100%;
  height: auto;
  display: block;
}

.scroll-row .wp-block-post-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0.5rem 1rem;
}


/*--------------------------------------------------------------
# SCROLL ROW · HOVER BASE (imatge)
--------------------------------------------------------------*/

.scroll-row .wp-block-post:hover {
  filter: grayscale(0%) hue-rotate(-390deg) brightness(0.9);
  transition: filter .33s ease;
}

/*--------------------------------------------------------------
# BLOG
--------------------------------------------------------------*/

.is-blog .scroll-row .wp-block-post {
  width: clamp(20rem, 25vw, 30rem);
  min-width: clamp(20rem, 25vw, 30rem);
  margin: 0;
  align-self: flex-start;
}

/* al blog: NO filtrem el contenidor */
.is-blog .scroll-row .wp-block-post:hover {
  filter: none;
}


.is-blog .scroll-row .wp-block-cover__image-background {
  filter: grayscale(0%) hue-rotate(0deg) brightness(.9);
  transition: filter .33s ease;
}

.is-blog .scroll-row .wp-block-post:hover
.wp-block-cover__image-background{
  filter: grayscale(0%) hue-rotate(-390deg) brightness(1);
}


.is-blog .scroll-row .wp-block-post-title {
  color:var(--wp--preset--color--accent-3);
  transition: color .25s ease, background-color .25s ease;
}

.is-blog .scroll-row .wp-block-post:hover
.wp-block-post-title{
  color: var(--wp--preset--color--accent-3);
}

/* secundari fora */
.is-blog .scroll-row .secondary-title{
  display: none;
}


.project-labs.wp-block-post .wp-block-cover__image-background {
 background-color: var(--wp--preset--color--taxonomy-tags-txyz);
}

/*--------------------------------------------------------------
# WORKSHOPS / LABS
--------------------------------------------------------------*/


.workshops-labs-loop .wp-block-post-title {
  font-size: var(--wp--preset--font-size--x-large);
  font-weight: 700;
}

.single-labs h1,
.single-workshops h1 {
  font-weight: 700;
}


.workshops-labs-loop .wp-block-post-terms {
  font-size: var(--wp--preset--font-size--small);
  font-weight: 400;
  color: var(--wp--preset--color--accent-4);
  text-transform: uppercase;
}


.is-workshops .scroll-row .wp-block-post:hover,
.is-labs .scroll-row .wp-block-post:hover {
  filter: hue-rotate(180deg) invert(1) contrast(1.5);
}


/*--------------------------------------------------------------
# IS WORK
--------------------------------------------------------------*/

.is-work .scroll-row .wp-block-post:hover{
  filter:hue-rotate(-390deg) invert(0) contrast(1.1)
}



/*--------------------------------------------------------------
# OBJCTIVE SECTIONS
--------------------------------------------------------------*/  
  .objectives-section,
  .objective-section {
	padding: var(--wp--preset--spacing--80) 0;
  }

  .single-objective,
  .single-objective.is-style-default {
	background-color: var(--wp--preset--color--accent-3);
	padding: var(--wp--preset--spacing--40);
  }

  .objectives-section h2.wp-block-heading {
	margin-top: 0;
	margin-bottom: var(--wp--preset--spacing--40);
}


	.single-work .single-objective,
	.single-work .single-objective.is-style-default {
	color: var(--wp--preset--color--accent-3);
	background-color: var(--wp--preset--color--contrast);
  }

/*--------------------------------------------------------------
# FAQ SECTIONS
--------------------------------------------------------------*/  
	.faq-image-section{
		padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40);
    background: var(--wp--preset--color--accent-3)
	}

	/* Aquest CSS garanteix que la columna amb la cover s'estiri com l'altra */
	.faq-image-section .wp-block-columns {
	align-items: stretch;
	}

	.faq-image-section .wp-block-column {
	display: flex;
	flex-direction: column;
	}

	.faq-image-section .wp-block-cover {
	height: 100%;
	}
    


  details summary {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 0.5em;
  }

  details summary::before {
    content: "»";
    display: inline-block;

    font-weight:500;
    transition: transform 0.3s ease;
  }

  details[open] summary::before {
    transform: rotate(90deg);
  }

/*--------------------------------------------------------------
# Link to project SECTION
--------------------------------------------------------------*/  
	.link-to-project-section {
		padding: var(--wp--preset--spacing--40) 0 0 0;
	}

	.link-to-project-section .linked-group{
		background: var(--wp--preset--color--contrast);
		color: var(--wp--preset--color--accent-3);
	}
	.link-to-project-section .linked-group:hover {
		background: var(--wp--preset--color--accent-1);
	}

	.link-to-project-section .wp-block-cover {
		color: var(--wp--preset--color--accent-3);
		padding: 4vw;
		min-height: 160px;
		aspect-ratio: unset;
	}



	.p-higlight{
		font-size: var(--wp--preset--font-size--large);
		font-weight: 800;
		text-transform: uppercase;
	}

/*--------------------------------------------------------------
# GALLERY SECTION
--------------------------------------------------------------*/  
	.wp-block-gallery {
		padding: var(--wp--preset--spacing--60) 0;
	}
	

  /*--------------------------------------------------------------
# VIDEO SECTION
--------------------------------------------------------------*/  
  .video-section {
	padding: var(--wp--preset--spacing--80) 0;
  }

  .video-section .heading-column {

  }

  .video-section h2,
  .video-section h3 {
	margin-top: 0 !important;
  }



@media (max-width: 768px) {

	.video-section-cols {
	display: flex;
	flex-direction: column;
	}

  .video-section .col-video-heading {
    order: 1;
  }

  .video-section .col-video-embed{
    order: 2;
  }
}
/*--------------------------------------------------------------
# COMMENTS
--------------------------------------------------------------*/  

 .wp-block-comments {
  padding: var(--wp--preset--spacing--20); 
  background: var(--wp--preset--color--accent-3); 
  margin: var(--wp--preset--spacing--60) 0;
 }

.wp-block-comments-title {
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 300;
}
.wp-block-post-comments-form .comment-reply-title {
  font-weight: 500;
	text-transform: uppercase;
  font-size: var(--wp--preset--font-size--small);
}

.wp-block-comments-title .secondary-title { 
  display: none; 
}

/*--------------------------------------------------------------
# RELATEDS
--------------------------------------------------------------*/  

.attachment-related_sm {
  max-width: 100%;
  height: auto;
}

/*--------------------------------------------------------------
# RELATED COLABORATORS
--------------------------------------------------------------*/  
.related-collaborators {
 margin: var(--wp--preset--spacing--40) 0 0 0;
}

.related-collaborators h2 {
 font-size: var(--wp--preset--font-size--x-large);
 font-weight: 200;
 text-transform: uppercase;
}

.related-collaborator {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 6;
  overflow: hidden;
  max-width: 12rem;
}

/* tot és clicable */
.related-collaborator-link{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

/* imatge al fons */
.related-collaborator-image{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

/* lleu vel per llegibilitat */
.related-collaborator-link::before{
  content: "";
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, var(--wp--preset--color--contrast) 25%, transparent);
  z-index: 1;
}

/* text al centre */
.related-collaborator-text{
  position: relative;
  z-index: 2;
  text-align: center;
  color: var(--wp--preset--color--accent-3);
  padding: 0.5em 0.75em;
}

/* text al centre */
.related-collaborator-text{
  position: relative;
  z-index: 2;
  text-align: center;
}

.related-collaborator-link::before { 
	transition: background .25s ease; 
}
.related-collaborator-image { 
	transition: transform .25s ease; 
}

.related-collaborator-link:hover::before { 
	background: color-mix(in srgb, var(--wp--preset--color--accent-1) 25%, transparent);
}
.related-collaborator-link:hover .related-collaborator-image { 
	transform: scale(1.03); 
}



/*--------------------------------------------------------------
# CTA MINIMAL PRE FOOTER
--------------------------------------------------------------*/  

.cta-footer-linkbox {
	padding:  var(--wp--preset--spacing--60) var(--wp--preset--spacing--edge);
	margin: var(--wp--preset--spacing--80) auto;
}

.cta-footer-linkbox:hover {
	background: var(--wp--preset--color--accent-1);
}

.cta-footer-tagline {
	font-size: var(--wp--preset--font-size--large);
	font-weight: 100;
	text-transform: uppercase;
}
  
.cta-footer-mail{
	font-size: var(--wp--preset--font-size--large);
	font-weight: 800;
}

  

/*--------------------------------------------------------------
# EMBEDS
--------------------------------------------------------------*/  

.rll-youtube-player .play {
	background-image: url('assets/images/youtube.webp') !important;
	background-size: 60px 40px !important;
}

.featured-media img {
	max-width: 100%;
	height: auto;
}

.bandcamp-iframe > .wp-block-group__inner-container {
	padding-bottom: 100%;
	height: 0;
	overflow: hidden;
	width: 100%;
	max-width: 700px;
	position: relative;
  }

.bandcamp-iframe > .wp-block-group__inner-container  iframe {
  border: 5px solid var(--color-lavaglow-txyz);
  width: 100%;
  height: 100%;
  position: absolute;
}  



/*--------------------------------------------------------------
# Tribe Events X
--------------------------------------------------------------*/ 


.tribe-common {
  --tec-font-family-sans-serif: var(--wp--preset--font-family--geomanist);
  --tec-color-text-primary:  var(--wp--preset--color--contrast) !important;


  --tec-color-accent-primary: var(--wp--preset--color--contrast) !important;
  --tec-color-link-primary:  var(--wp--preset--color--contrast) !important;
  --tec-color-link-accent: var(--wp--preset--color--contrast) !important;
  --tec-color-button-primary:  var(--wp--preset--color--contrast) !important;
  --tec-color-text-secondary: var(--wp--preset--color--accent-3) !important;
  /*-----
  --tec-color-background-events: inherit;
  --tec-color-background: #fff !important;
  --tec-color-text-secondary: #0a0 !important;
  --tec-color-text-disabled: #888 !important;

  --tec-color-button-primary: #f0f !important;
  --tec-color-button-primary-hover: #c0c !important;
  --tec-color-button-primary-active: #909 !important;
  --tec-color-button-primary-background: #eee !important;
  --tec-color-button-secondary: #fa0 !important;

  --tec-color-border-default: #000 !important;
  --tec-color-border-active: #f0f !important;

  --tec-color-icon-primary: #f0f !important;
  --tec-color-icon-secondary: #00f !important;
  --tec-color-icon-disabled: #999 !important;
  --tec-color-icon-active: #f0f !important;

  --tec-form-color-background: #fff !important;
  --tec-form-color-border-default: #000 !important;
  --tec-form-color-border-secondary: #555 !important;
  --tec-form-color-border-active: #f0f !important;
  --tec-form-box-shadow-default: 0 0 0 3px rgba(255,0,255,.25) !important;
  ----*/ 
}


h2.tribe-events-widget-events-list__header-title.tribe-common-h6.tribe-common-h--alt {
  font-size: var(--wp--preset--font-size--x-large);
  font-weight: 700;
}

			


.tribe-events .tribe-events-calendar-list__event-date-tag-datetime {
	background: var(--wp--preset--color--contrast);
	margin-right: 10px;
	font-weight: 500;
	height: 60px !important;
	width: 55px;
	padding: 5px 0;
	color: var(--wp--preset--color--accent-3) !important;
}

.tribe-common .tribe-common-h2 {
  color: var(--wp--preset--color--accent-3) !important;
}


.tribe-events-calendar-list__event-date-tag-weekday,
.tribe-events-calendar-list__event-date-tag-daynum.tribe-common-h5.tribe-common-h4--min-medium {
  color: var(--wp--preset--color--accent-3) !important;
}

.tribe-events-venue-map iframe {
  /* filter: grayscale(1) brightness(0.6) contrast(1.5) sepia(1) hue-rotate(15deg) saturate(5);    /* Opció 1: Notmal -> Negre sobre Groc*/
    filter: invert(1) sepia(1) saturate(3)  hue-rotate(337deg) brightness(1) contrast(1.1) ; /* Opció 2: Invert-> Groc sobre negre  */
  border-radius: 10px;
}

.tribe-events-single>.tribe_events>:not(.primary):not(.secondary):not(.tribe-events-related-events-title):not(.tribe-related-events) {
    order: 3;
}

.tribe-events-event-image img {
	display: block;
	max-width: 100%;
	height: auto;
	display: block;
	overflow: hidden;
}

/*--------------------------------------------------------------
# tribe-events-widget xyz
--------------------------------------------------------------*/  
.tribe-events-widget .tribe-events-widget-events-list__events {
  padding: 2rem 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem; /* opcional: separació entre columnes */
}

@media (max-width: 768px) {
  .tribe-events-widget .tribe-events-widget-events-list__events {
    grid-template-columns: 1fr;
  }
}

.tribe-events-widget  .tribe-common-h6 {
}

.tribe-events-widget .tribe-events-widget-events-list__event-date-tag-datetime {
	background: var(--wp--preset--color--contrast);
	font-weight: 500;
	height: 65px !important;
	width: 55px;
	padding: 5px 0;
	color: var(--wp--preset--color--accent-3) !important;
}

.tribe-events-widget .tribe-events-widget-events-list__view-more-link {
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 500;
}

/*--------------------------------------------------------------
# tribe-events-widget dg
--------------------------------------------------------------*/  


.tribe-events-widget .tribe-events-calendar-list__event-date-tag-weekday,
.tribe-events-widget .tribe-events-calendar-list__event-date-tag-daynum.tribe-common-h5.tribe-common-h4--min-medium {
  color: var(--wp--preset--color--contrast-2) !important;
}

/*--------------------------------------------------------------
# BLOG
--------------------------------------------------------------*/  



/*  Blog covers · base */
.wp-block-post .linked-group .wp-block-cover__image-background{
  filter: grayscale(0%) hue-rotate(0deg) brightness(.9);
  transition: filter .33s ease;
}

.wp-block-post .linked-group .wp-block-post-title {
  transition: color .33s ease;
}

/* Hover real sobre l’enllaç */
.wp-block-post .linked-group:has(a:hover) .wp-block-cover__image-background{
  filter: grayscale(0%) hue-rotate(-390deg) brightness(1);
}

.wp-block-post .linked-group:has(a:hover) .wp-block-post-title{
  color: var(--wp--preset--color--accent-1);
}


/*--------------------------------------------------------------
# JR
--------------------------------------------------------------*/  


h1.wp-block-query-title  {
	font-weight: 300;
}
h1.wp-block-query-title  span {
	font-weight: 900;
}


/*--------------------------------------------------------------
# ONLY FOR T.XYZ 2025 MAIN THEME
--------------------------------------------------------------*/  

.has-inline-color.has-contrast-color {
    font-weight: 300;
}


/* 1. News Marquee */

@keyframes news-marquee {
	0% { left: 60%; }
	50% { left: -120%; }
	100% { left: 60%; }
}
  
.fadeout-horizontal {
	mask-image: linear-gradient(
	  to right,
	  transparent,
	  var(--wp--preset--color--contrast) 5rem,
	  var(--wp--preset--color--contrast) calc(100% - 5rem),
	  transparent
	);
  }

.news-marquee {
	position: relative;
	width: 100vw;
	max-width: 100%;
	height: 2.1rem;
	overflow-x: hidden;
	background:  var(--wp--preset--color--contrast); 
	color:  var(--wp--preset--color--base);
}

.news-marquee a {

}
  
.news-marquee a:hover {
	color:  var(--wp--preset--color--accent-1);
}
  
.news-marquee-text {
	position: absolute;
	white-space: nowrap;
	will-change: transform;
	animation: news-marquee 60s linear infinite;
	font-size: 1rem !important;
	padding: 0.25rem;
}
  

.news-marquee-text:hover {
	animation-play-state: paused;
}


ul.news-marquee-text  {
	display: inline-flex;
	margin: 0 1rem;
	list-style: none;
}
  
ul.news-marquee-text  li {
	margin: 0 1rem;
}



/* 1.1 News POSTS */
@keyframes posts-marquee {
	0% { left: 60%; }
	50% { left: -120%; }
	100% { left: 60%; }
}

.posts-marquee {
	position: relative;
	width: 100vw;
	max-width: 100%;
	height: 2.1rem;
	overflow-x: hidden;
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}

.posts-marquee a:hover {
	color: var(--wp--preset--color--accent-1);
}

.posts-marquee-track {
	position: absolute;
	white-space: nowrap;
	will-change: transform;
	animation: posts-marquee 60s linear infinite;
	font-size: 1rem !important;
	padding: 0.25rem;
	display: inline-flex;
	align-items: center;
}

.posts-marquee-track:hover {
	animation-play-state: paused;
}

ul.posts-marquee-label {
	display: inline-flex;
	margin: 0 1rem;
	padding: 0;
	list-style: none;
}

ul.posts-marquee-label li {
	margin: 0 1rem;
	white-space: nowrap;
}

.posts-marquee-text {
	display: inline-flex;
	margin: 0 1rem;
	padding: 0;
	list-style: none;
}

.posts-marquee-text .wp-block-post {
	margin: 0 1rem;
	white-space: nowrap;
	flex: 0 0 auto;
}

.posts-marquee-text .wp-block-post-title {
	margin: 0;
	font-size: 1rem !important;
	white-space: nowrap;
}

.posts-marquee .wp-block-post-title,
.posts-marquee .wp-block-post-title a {
	display: inline-block;
	max-width: 16ch;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	vertical-align: bottom;
}
.posts-marquee-text .secondary-title {
  display: none;
}


/* 2. LANG MENU */



.blend-my-work {
	mix-blend-mode: difference;
  }

.wpm-switcher-list {
	list-style:none;
	padding-left: 0rem !important;
	line-height: 0.6rem;
	display: flex;
	font-size: 1rem;
}

.wpm-switcher-list ul {
	list-style-type: none; /* Remove default list markers */
	padding-left: 0; /* Optional: remove padding from the list */
	margin-left: 0; /* Optional: adjust margins if needed */
  }
  
.wpm-switcher-list ul li::marker {
	content: ""; /* Remove any content that could appear */
}


.wpm-switcher-list li {
	padding-right: 0.5rem;
}

.wpm-switcher-list li.active a,
.wpm-switcher-list li.active>span {
  color: inherit;
  font-weight: 600;
}

.wpm-switcher-list li a {
  color:var( --wp--preset--color--base );
}

.wpm-switcher-dropdown a:hover,.wpm-switcher-list li a:hover,
.wpm-switcher-list li>span:hover {
    color: var( --wp--preset--color--accent-1 );
}




/*--------------------------------------------------------------
# ZIG ZAG SECTION
--------------------------------------------------------------*/


/* Columns container */
.section-zigzag.wp-block-columns {
  display: flex;
  gap: 0;
  align-items: flex-end;
  padding: var(--wp--preset--spacing--80) 0;
}

.section-zigzag.wp-block-columns > .wp-block-column{
  align-self: flex-end;
}

.section-zigzag .zigzag__media .wp-block-cover{
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important; /* vertical: bottom */
}

/*--------------------------------------------------------------
# COLUMNS BASE
--------------------------------------------------------------*/

.section-zigzag .zigzag__media,
.section-zigzag .zigzag__content {
  display: flex;
  flex-direction: column;
}

/* Desktop widths (editor-safe) */
.section-zigzag .zigzag__media {
  flex: 50%;
}

.section-zigzag .zigzag__content {
  flex: 50%;
}

/* Padding intern segons posició */
.section-zigzag.wp-block-columns
> .wp-block-column:last-child.zigzag__content
  .zigzag__content-inner {
  padding: 0 0 0 var(--wp--preset--spacing--40);
  text-align: left;
}

.section-zigzag.wp-block-columns
> .wp-block-column:first-child.zigzag__content
  .zigzag__content-inner {
  padding: 0  var(--wp--preset--spacing--40) 0 0 ;
  text-align: right;
}

.section-zigzag.wp-block-columns
> .wp-block-column:first-child.zigzag__media
  .wp-block-buttons {
  justify-content: flex-end;
}

.section-zigzag.wp-block-columns
> .wp-block-column:last-child.zigzag__media
  .wp-block-buttons {
  justify-content: flex-start;
}


.section-zigzag .zigzag__media .wp-block-cover{
  display: flex;
  flex-direction: column ;
  justify-content: flex-bottom; /* vertical: bottom */
}

/* Media column is first → content aligned right */
.section-zigzag.wp-block-columns
> .wp-block-column:first-child.zigzag__media
  .wp-block-group {
  align-items: flex-end;
  text-align: right;
}



/* Media column is second → content aligned left */
.section-zigzag.wp-block-columns
> .wp-block-column:last-child.zigzag__media
  .wp-block-group {
  align-items: flex-start;
  text-align: left;
}

/* Text per sobre */
.section-zigzag .zigzag__media .wp-block-cover__inner-container{
  z-index: 2;
  color:var( --wp--preset--color--base );
}

/* Overlay teu via pseudo-element */
.section-zigzag .zigzag__media .wp-block-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: color-mix(in srgb, var(--wp--preset--color--contrast) 55%, transparent);
}

/* Text per sobre */
.section-zigzag .zigzag__media .wp-block-cover__inner-container{
  z-index: 2;
}


/* TIPOGRAPHY ELEMENTS */

.section-zigzag .big-concept {
  font-weight: 100;
  font-size: var(--wp--preset--font-size--xx-large);
}

.section-zigzag .heading-tagline {
  letter-spacing: 0.25rem;
  text-transform: uppercase;
}

.section-zigzag .heading {
  line-height: 1;
  margin: 0;
}

.zigzag__media .wp-block-heading {
	font-size: var(--wp--preset--font-size--xxx-large);
	text-transform: uppercase;
}


/*--------------------------------------------------------------
# MOBILE BEHAVIOUR
--------------------------------------------------------------*/

@media (max-width: 781px) {

  .section-zigzag.wp-block-columns {
    flex-direction: column;
  }

  /* Always image first */
  .section-zigzag .zigzag__media {
    order: 1;
  }

  .section-zigzag .zigzag__content {
    order: 2;
  }

.zigzag__content-inner {
    padding: 0 0 0 0;
  }

  /* Reset heights for mobile */
  .section-zigzag .zigzag__media .wp-block-cover {
    min-height: clamp(14rem, 60vw, 22rem);
  }

}



.btn.contact.primary,
.btn.contact.secondary,
.btn.contact.footer {
  display: inline-block;
  box-sizing: border-box;
  border-radius: 0;
  transition: all 200ms ease;
  font-weight: 400;

  padding:
    calc(clamp(0.25rem, 0.25rem + 0.25vw, 0.5rem) + 2px)
    calc(clamp(0.5rem, 0.5rem + 0.25vw, 0.75rem) + 2px);

  border-style: solid;
  border-width: 0;
}

.btn.contact.primary {
  background-color: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--base);
}

.btn.contact.secondary {
  background-color: var(--wp--preset--color--base);
  color: var(--wp--preset--color--contrast);
}

.btn.contact.footer {
  background-color: var(--wp--preset--color--base);
  color: var(--wp--preset--color--contrast);
  font-weight: 300;
  padding: 8px 16px;
  font-size: var(--wp--preset--font-size--small);
}

.btn.contact.primary:hover,
.btn.contact.secondary:hover,
.btn.contact.footer:hover {
  background-color: var(--wp--preset--color--accent-1);
  color: var(--wp--preset--color--base);
  border-color: var(--wp--preset--color--accent-1);
}


.btn.contact.footer.pings:hover {
  background-color: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--accent-3);
  border-color: var(--wp--preset--color--contrast);
}



/*--------------------------------------------------------------
# HERO TOP
--------------------------------------------------------------*/
 
.ha-hero-tagline {
  font-size: var(--wp--preset--font-size--xxx-large);
  font-weight: 300;
  line-height: 1.07;
  letter-spacing: -0.025em;
  margin-bottom: var(--wp--preset--spacing--60);
}
 
.ha-hero-tagline em {
  font-style: italic;
  font-weight: 300;
}
 
.ha-bottom {
  align-items: flex-end;
}
 
.ha-sub {
  font-size: var(--wp--preset--font-size--large);
  font-weight: 300;
  line-height: 1.8;
  color: var(--wp--preset--color--accent-4);
}
 
@media (max-width: 600px) {
  .ha-hero-tagline {
    font-size: var(--wp--preset--font-size--xx-large);
  }
 
  .ha-bottom {
    flex-direction: column;
    align-items: flex-start;
  }
}
 

/*--------------------------------------------------------------
# INTRO · DOS COLUMNES
--------------------------------------------------------------*/

.ha-intro {
  padding-top: var(--wp--preset--spacing--80);
  padding-bottom: var(--wp--preset--spacing--80);
}

.ha-intro h2 {
  font-size: var(--wp--preset--font-size--x-large);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -0.01em;
  margin-top: 0;
}

.ha-intro p:not(.ha-label) {
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 300;
  line-height: 1.8;
  color: var(--wp--preset--color--accent-4);
}

/*--------------------------------------------------------------
# LABEL · Global
--------------------------------------------------------------*/

.ha-label {
  font-size: var(--wp--preset--font-size--small);
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--wp--preset--color--accent-4);
  margin-bottom: var(--wp--preset--spacing--20);
}

/*--------------------------------------------------------------
# SEPARADOR · Global
--------------------------------------------------------------*/

.ha-sep {
  border-top: 0.5px solid var(--wp--preset--color--accent-1);
}



/*==============================================================
  DYNAMICS
  Animacions: marquee, dynamic cover, hue video, related projects
==============================================================*/

/* BOUNCING MARQUEE */

.marquee {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	overflow: hidden;
}

@keyframes marquee {
	0%   { left:  80%; }
	50%  { left: -20%; }
	100% { left:  80%; }
}

.marquee-text {
	position: relative;
	overflow: visible;
	animation: marquee 24s linear infinite;
	white-space: nowrap;
}

@keyframes marquee-inv {
	0%   { left: -80%; }
	50%  { left:  20%; }
	100% { left: -80%; }
}

.marquee-text-inv {
	position: relative;
	overflow: visible;
	animation: marquee-inv 36s linear infinite;
	white-space: nowrap;
	margin-top: 6rem;
}

/* DYNAMIC COVER */

.cover-dynamic.wp-block-cover {
	min-height: 150px;
}

.cover-dynamic,
.dynamic-cover {
	animation: mymove 7s infinite;
}

.dinamic-cover-stack {
	gap: 0;
}

.dinamic-cover-heading {
	font-size: var(--wp--preset--font-size--extra-large);
	font-weight: 800;
}

.dinamic-cover-tagline {
	text-transform: uppercase;
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 2px;
}

@keyframes mymove {
	50% {
		-webkit-filter: grayscale(100%);
		filter: grayscale(100%);
	}
}

/* HUE LINE VIDEO */

@keyframes hue-line-video {
	from { filter: invert(80%) hue-rotate(0deg); }
	to   { filter: invert(80%) hue-rotate(360deg); }
}

.wp-block-cover__video-background.intrinsic-ignore {
	animation: hue-line-video 5s ease alternate infinite;
}

/* HUE RELATED PROJECTS */

@keyframes hue-related-project {
	from { filter: hue-rotate(0deg); }
	to   { filter: hue-rotate(-90deg); }
}


/*==============================================================
  RELATEDS
  Sidebar de relacionats als singles del blog
==============================================================*/

/* Related Project */


/* Related Project */
h3.related-project {
    font-size: var(--wp--preset--font-size--small);
    font-weight: 700;
    margin: 0.334rem auto 0;
    display: block;
}

h3.related-project a {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    padding: 0.625rem 0.5rem;
	  background: var(--wp--preset--color--contrast);
    color: var(--wp--preset--color--base);

    text-decoration: none;
    transition: background 300ms, color 300ms;
    overflow: hidden;
    white-space: nowrap;
    gap: 0.5em;
}

h3.related-project a:hover {
    background: var(--wp--preset--color--accent-1);
    color: var(--wp--preset--color--contrast);
}

h3.related-project a span {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

h3.related-project a::after {
    content: "»";
    flex-shrink: 0;
}

h3.related-project a:hover::after {
    color: var(--wp--preset--color--contrast);
}

.related-project .secondary-title {
    font-weight: 500;
}
/* Related Articles */

.related-articles {
	padding: 0;
	list-style: none;
}

.related-articles .wp-block-post-featured-image img {
	width: 100%;
	max-height: 12vh;
	object-fit: cover;
	margin: 0 0 0.5rem 0;
	object-position: 100% 100%;
	filter: grayscale(1);
	transition: all 300ms;
}

.related-articles a:hover .wp-block-post-featured-image img {
	filter: grayscale(0);
}

.related-articles h3 {
	margin: 0 0 2rem 0;
}

.related-articles .wp-block-post-featured-image {
	margin: 0;
}


/* Relateds in COVER */

.related-cover {
    position: relative;
    background-size: cover;
    background-position: center;
    aspect-ratio: 2.39/1;
    filter: grayscale(1);
    transition: all 300ms;
    display: flex;
    align-items: flex-end;
    margin-bottom: 1rem;
}

.related-articles a:hover .related-cover {
    filter: grayscale(0);
}

.related-cover h3 {
    margin: 0;
    padding: 0.5rem;
    width: 100%;
    background: linear-gradient(transparent, rgba(0,0,0,0.7));
    color: var(--wp--preset--color--accent-3);
    font-size: var(--wp--preset--font-size--small);
    line-height: 1.3;
}

/* Títols de Relateds */

.highly-related .main-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 300;
  text-transform: uppercase;
}

h3.highly-related {
	font-weight: 300;
}

.highly-related .secondary-title {
	display: none;
}

.related-project .line-break {
	display: block;
}


/*==============================================================
  TXYZ STYLE VARIATIONS
  Específic de troposfera.xyz (no subdominis)
==============================================================*/

/* Home */

.video-home {
	z-index: -1;
}

/* Main Title & Secondary Title exceptions */

.archive h1 .secondary-title {
	font-size: 100%;
	display: inline;
}

.firts-blog-page-content .main-title {
	order: 1;
	font-weight: inherit;
}

.firts-blog-page-content .secondary-title {
	order: 2;
	font-weight: 300;
	font-size: 66%;
}

.page .secondary-title {
	order: 1;
	font-weight: inherit;
}

.page .main-title {
	order: 2;
	font-weight: 300;
}

.horizontal-loop .main-title,
.type-work .main-title,
.single-work .main-title,
.type-labs .main-title,
.single-labs .main-title {
	order: 1;
	font-weight: inherit;
}

.horizontal-loop .secondary-title,
.type-work .secondary-title,
.single-work .secondary-title,
.type-labs .secondary-title,
.single-labs .secondary-title {
	order: 2;
	font-size: 90%;
	font-weight: 300;
}

.type-workshops .main-title,
.invert-title-order .main-title {
	order: 2;
	font-size: 66%;
	font-weight: 300;
}

.type-workshops .secondary-title,
.invert-title-order .secondary-title {
	order: 1;
	font-weight: inherit;
	font-size: 100%;
}

.sub-menu .secondary-title {
	display: none;
}

.single-workshops .main-title {
	order: 2;
	font-size: 90%;
	font-weight: 300;
}

.single-workshops .secondary-title {
	order: 1;
	font-size: 100%;
	font-weight: inherit;
}

/* Direct Menus — footer multilingual */

#menu-direct-work,
#menu-direct-workshops,
#menu-direct-labs,
#menu-direct-to-articles,
#menu-featured-filters-blog {
	padding: 0;
	margin: 0;
	list-style: none;
	font-size: var(--wp--preset--font-size--small);
}

.menu-direct-to-articles-container .menu-item {
	display: block;
}

.menu-direct-to-articles-container > ul > li {
	max-width: 240px;
	white-space: nowrap;
	overflow: hidden !important;
	text-overflow: ellipsis;
}

.menu-direct-to-articles-container a {
	padding: 7px 0;
}

.menu-featured-filters-blog-container .menu-item {
	display: block;
}

.menu-featured-filters-blog-container > ul > li {
	white-space: nowrap;
	overflow: hidden !important;
	text-overflow: ellipsis;
}

.menu-featured-filters-blog-container a {
	padding: 7px 0;
}

#menu-direct-to-de-projects {
	padding: 0;
	list-style: none;
	font-size: var(--wp--preset--font-size--small);
}

#menu-direct-to-de-projects ul > li {
	padding-left: 0;
}

#menu-direct-to-de-projects a {
	padding: 7px 0;
}

/* Blended Menu */

.blend-menu.wp-block-senff-sticky-block {
	mix-blend-mode: difference;
}

.blend-menu.wp-block-senff-sticky-block .wp-block-navigation__responsive-container-open,
.blend-menu.wp-block-senff-sticky-block .wp-block-navigation-item__label,
.blend-menu.wp-block-senff-sticky-block img {
	filter: invert(1);
}

.blend-my-work {
	mix-blend-mode: difference;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation a {
	text-decoration: none;
}

.wp-block-navigation__responsive-container.is-menu-open .blend-my-work {
	mix-blend-mode: none;
}

.revert-z-index > .wp-block-cover__inner-container.has-global-padding.is-layout-constrained.wp-block-cover-is-layout-constrained {
	z-index: revert;
}

/* Post type archive — workshops title order */

.post-type-archive-workshops .main-title,
.invert-title-order .main-title {
	order: 2;
	font-size: 90%;
	font-weight: 300;
}

.post-type-archive-workshops .secondary-title {
	order: 1;
}


/* NOU CSS PER ORDENAR */

.col-for-videos {
  padding-top: var(--wp--preset--spacing--80);
  padding-bottom: var(--wp--preset--spacing--80);
}

.is-style-section-1 .wp-block-button__link:hover {
    background-color: var(--wp--preset--color--contrast);
    color: var(--wp--preset--color--accent-1);
}

.is-style-section-3 .wp-block-button__link:hover {
    background-color: var(--wp--preset--color--accent-1);
    color: var(--wp--preset--color--contrast);
}

/* EXTERNAL PROJECT LINK */

.txyz-external-project-link { padding: var(--wp--preset--spacing--40);}

.txyz-external-project-link .tagline{ text-transform: uppercase; font-size: var(--wp--preset--font-size--large); }

.txyz-external-project-link .cta { text-transform: uppercase; font-size: var(--wp--preset--font-size--large); padding: 0 0  var(--wp--preset--spacing--20) 0;}


/*  TESTING */

/* ============================================================
   COMPARTEIX · Taller per a equips
   Afegir al final de style.css del tema txyz-main-theme.
   Nomes fa servir custom properties que el tema ja genera
   des de theme.json. Cap valor de color escrit a ma.
   ============================================================ */


/* --- Hero -------------------------------------------------- */

/* El titular apila nom del taller i descriptor amb les classes
   .main-title / .secondary-title que el tema ja defineix. */
.txyz-hero-title {
	display: flex;
	flex-direction: column;
	gap: 0.35em;
}

.txyz-hero-title .secondary-title {
	font-size: clamp(1rem, 0.85rem + 0.7vw, 1.5rem);
	font-weight: 300;
	letter-spacing: 0;
	color: color-mix(in srgb, currentColor 65%, transparent);
}

.txyz-hero .txyz-standfirst {
	max-width: 32ch;
}

.txyz-hero-art img {
	width: 100%;
	height: auto;
}


/* --- Barra de fitxa rapida --------------------------------- */

.txyz-spec .txyz-spec__label {
	margin: 0;
	color: color-mix(in srgb, currentColor 55%, transparent);
}

.txyz-spec .txyz-spec__value {
	margin: 0;
	font-weight: 300;
	line-height: 1.3;
	text-wrap: balance;
}

@media (max-width: 781px) {
	.txyz-spec.wp-block-columns {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	}
	.txyz-spec.wp-block-columns > .wp-block-column {
		flex-basis: auto !important;
	}
}


/* --- Prosa ------------------------------------------------- */

.txyz-lead,
.txyz-lead + p,
.txyz-lead ~ p {
	max-width: 62ch;
}

.txyz-marginal {
	margin: 0;
	position: sticky;
	top: var(--wp--preset--spacing--50);
}

@media (max-width: 781px) {
	.txyz-marginal {
		position: static;
	}
}


/* --- Diagrama causal --------------------------------------- */

.txyz-causal {
	margin-block-start: var(--wp--preset--spacing--50);
}

.txyz-causal svg {
	display: block;
	width: 100%;
	height: auto;
	overflow: visible;
}

.txyz-causal__grid line {
	stroke: color-mix(in srgb, currentColor 12%, transparent);
	stroke-width: 1;
	stroke-dasharray: 2 6;
}

.txyz-causal__lane line {
	stroke: color-mix(in srgb, currentColor 28%, transparent);
	stroke-width: 1;
}

.txyz-causal__label text,
.txyz-causal__beat text {
	fill: color-mix(in srgb, currentColor 55%, transparent);
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: 15px;
	letter-spacing: 0.08em;
	text-anchor: middle;
}

.txyz-causal__beat text {
	font-size: 12px;
}

.txyz-causal__pass path {
	fill: none;
	stroke: var(--wp--preset--color--accent-1);
	stroke-width: 2;
	stroke-linecap: round;
	stroke-dasharray: 5 9;
	animation: txyz-causal-flow 4s linear infinite;
}

.txyz-causal__self path {
	fill: none;
	stroke: color-mix(in srgb, currentColor 35%, transparent);
	stroke-width: 1.5;
	stroke-linecap: round;
}

.txyz-causal__node circle {
	fill: var(--wp--preset--color--accent-1);
}

@keyframes txyz-causal-flow {
	to { stroke-dashoffset: -56; }
}

@media (prefers-reduced-motion: reduce) {
	.txyz-causal__pass path {
		animation: none;
		stroke-dasharray: none;
	}
}


/* --- Taula de programa ------------------------------------- */

.txyz-table-spec table {
	border-collapse: collapse;
	width: 100%;
}

.txyz-table-spec td {
	border: 0;
	border-top: 1px solid color-mix(in srgb, currentColor 20%, transparent);
	padding: var(--wp--preset--spacing--30) 0;
	vertical-align: baseline;
	line-height: 1.6;
}

.txyz-table-spec tr:last-child td {
	border-bottom: 1px solid color-mix(in srgb, currentColor 20%, transparent);
}

.txyz-table-spec td.txyz-t {
	width: 8rem;
	padding-inline-end: var(--wp--preset--spacing--40);
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: 0.85rem;
	letter-spacing: 0.04em;
	white-space: nowrap;
}

.txyz-table-spec td:not(.txyz-t) {
	max-width: 62ch;
}

@media (max-width: 600px) {
	.txyz-table-spec td {
		display: block;
		padding-block: 0;
	}
	.txyz-table-spec td.txyz-t {
		width: auto;
		padding-block-start: var(--wp--preset--spacing--30);
	}
	.txyz-table-spec td:not(.txyz-t) {
		border-top: 0;
		padding-block-end: var(--wp--preset--spacing--30);
	}
}


/* --- Targetes numerades ------------------------------------ */

.txyz-cards .txyz-num {
	margin: 0;
	font-variant-numeric: tabular-nums;
}

.txyz-cards h3 {
	margin: 0;
	text-wrap: balance;
}

.txyz-cards p:not(.txyz-num) {
	margin: 0;
}


/* --- FAQs -------------------------------------------------- */

.txyz-faq .wp-block-details {
	border-top: 1px solid color-mix(in srgb, currentColor 20%, transparent);
	padding-block: var(--wp--preset--spacing--30);
}

.txyz-faq .wp-block-details:last-of-type {
	border-bottom: 1px solid color-mix(in srgb, currentColor 20%, transparent);
}

.txyz-faq summary {
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 300;
	line-height: 1.35;
}

.txyz-faq summary::-webkit-details-marker {
	display: none;
}

.txyz-faq summary::after {
	content: "+";
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: 1.1rem;
	color: var(--wp--preset--color--accent-1);
	transition: transform 0.2s ease;
}

.txyz-faq details[open] summary::after {
	content: "−";
}

.txyz-faq details p {
	max-width: 62ch;
	margin-block-start: var(--wp--preset--spacing--30);
	line-height: 1.65;
}


/* --- Imatge a sang ----------------------------------------- */

.txyz-band img {
	width: 100%;
	height: auto;
	display: block;
}


/* --- Tancament --------------------------------------------- */

.txyz-close h2 {
	max-width: 22ch;
	text-wrap: balance;
}