/* Pidi Lite — components dels mòduls Divi (compartits frontend i llenç). */

/* ==========================================================================
   Base
   ========================================================================== */
html, body { overflow-x: hidden; }

/* ==========================================================================
   Amplada completa
   ========================================================================== */
.pl-fullwidth {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* ==========================================================================
   Sliders
   ========================================================================== */
.pl-slider { position: relative; overflow: hidden; border-radius: 0; background: #2ea3f2; height: 100%; min-height: 430px; }
.pl-slider--fullwidth { border-radius: 0; }
.pl-slides { position: relative; height: 100%; min-height: 430px; }
.pl-slide {
	display: block;
	position: absolute;
	inset: 0;
	min-height: 430px;
	background-color: transparent;
	background-size: cover;
	background-position: center;
	color: #fff;
	opacity: 0;
	visibility: hidden;
}
.pl-slide.is-active { opacity: 1; visibility: visible; z-index: 1; }
.pl-slider:not([data-pl-init]) .pl-slide:first-child { opacity: 1; visibility: visible; }
.pl-slide--light { color: #0f172a; }
.pl-slide-overlay { position: absolute; inset: 0; background: rgba(15, 23, 42, .45); }
.pl-slide-inner {
	position: relative;
	display: flex;
	align-items: center;
	gap: 40px;
	max-width: 1140px;
	margin: 0 auto;
	padding: 70px 40px;
	min-height: 430px;
	height: 100%;
	box-sizing: border-box;
}
.pl-slide--center .pl-slide-inner { justify-content: center; text-align: center; }
.pl-slide--right .pl-slide-inner { justify-content: flex-end; text-align: right; }
.pl-slide--left .pl-slide-inner { justify-content: flex-start; text-align: left; }
.pl-slide-media { flex: 0 1 46%; }
.pl-slide-media img { display: block; width: 100%; height: auto; border-radius: 16px; box-shadow: 0 24px 50px -30px rgba(0, 0, 0, .6); }
.pl-slide-content { flex: 1 1 0; max-width: 720px; }
.pl-slide-title { margin: 0 0 16px; font-size: 42px; line-height: 1.12; letter-spacing: -.02em; font-weight: 800; color: inherit; }
.pl-slide-title a { color: inherit; text-decoration: none; }
.pl-slide .pl-text { color: inherit; font-size: 17px; line-height: 1.7; opacity: .92; }
.pl-slide-meta { margin: 0 0 10px; font-size: 13px; opacity: .8; }
.pl-slider-prev, .pl-slider-next {
	position: absolute;
	top: 50%;
	z-index: 3;
	width: auto;
	height: auto;
	margin-top: -24px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--pl-slider-arrow-color, #fff);
	font-size: 0;
	line-height: 1;
	cursor: pointer;
	opacity: 0;
	transition: all .2s ease-in-out;
}
.pl-slider-prev { left: -22px; }
.pl-slider-next { right: -22px; }
.pl-slider-prev::before, .pl-slider-next::before {
	font-family: "ETmodules";
	font-size: 48px;
	line-height: 1;
}
.pl-slider-prev::before { content: "4"; }
.pl-slider-next::before { content: "5"; }
.pl-slider:hover .pl-slider-prev { left: 22px; opacity: 1; }
.pl-slider:hover .pl-slider-next { right: 22px; opacity: 1; }
.pl-slider-dots { position: absolute; left: 0; right: 0; bottom: 20px; z-index: 3; display: flex; justify-content: center; }
.pl-slider-dot { width: 7px; height: 7px; margin: 0 10px 0 0; padding: 0; border: 0; border-radius: 7px; cursor: pointer; background: var(--pl-slider-dot-color, hsla(0, 0%, 100%, .5)); opacity: .5; text-indent: -9999px; }
.pl-slider-dot:last-child { margin-right: 0; }
.pl-slider-dot.is-active { background: var(--pl-slider-dot-color, #fff); opacity: 1; transform: none; }
.pl-slider--video { background: #0b1220; }
.pl-slide--video { padding: 30px; }
.pl-slide--video .pl-video { margin: 0 auto; max-width: 960px; }

/* ==========================================================================
   Portafolis
   ========================================================================== */
.pl-portfolio { display: grid; gap: 24px; }
.pl-portfolio--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pl-portfolio--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pl-portfolio--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pl-portfolio-item {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 18px 40px -34px rgba(15, 23, 42, .5);
	transition: transform .15s ease, box-shadow .15s ease;
}
.pl-portfolio-item:hover { transform: translateY(-2px); box-shadow: 0 24px 46px -30px rgba(15, 23, 42, .45); }
.pl-portfolio-thumb { display: block; overflow: hidden; }
.pl-portfolio-thumb img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .3s ease; }
.pl-portfolio-item:hover .pl-portfolio-thumb img { transform: scale(1.03); }
.pl-portfolio-placeholder { display: block; aspect-ratio: 4 / 3; background: linear-gradient(135deg, #e2e8f0, #f8fafc); }
.pl-portfolio-body { padding: 18px 20px 20px; }
.pl-portfolio-title { margin: 0 0 6px; font-size: 18px; font-weight: 700; letter-spacing: -.01em; }
.pl-portfolio-title a { color: #0f172a; text-decoration: none; }
.pl-portfolio-title a:hover { color: var(--pl-primary, #4f46e5); }
.pl-portfolio-cats, .pl-portfolio-date { color: #64748b; font-size: 13px; }
.pl-portfolio-heading { margin: 0 0 22px; font-size: 28px; font-weight: 800; letter-spacing: -.02em; }
.pl-portfolio-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.pl-portfolio-filter {
	border: 1px solid #cbd5e1;
	background: #fff;
	color: #334155;
	border-radius: 999px;
	padding: 8px 16px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.pl-portfolio-filter:hover { border-color: #94a3b8; }
.pl-portfolio-filter.is-active { background: var(--pl-primary, #4f46e5); border-color: transparent; color: #fff; }

/* ==========================================================================
   Capçalera a amplada completa
   ========================================================================== */
.pl-header {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 520px;
	background-size: cover;
	background-position: center;
	color: #fff;
}
.pl-header--light { color: #0f172a; }
.pl-header::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15, 23, 42, .45), rgba(15, 23, 42, .2)); }
.pl-header--light::before { background: linear-gradient(180deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, 0)); }
.pl-header-inner { position: relative; z-index: 2; width: 100%; max-width: 1140px; margin: 0 auto; padding: 90px 28px; box-sizing: border-box; }
.pl-header--center .pl-header-inner { text-align: center; }
.pl-header--right .pl-header-inner { text-align: right; }
.pl-header-title { margin: 0 0 14px; font-size: 54px; line-height: 1.08; letter-spacing: -.03em; font-weight: 800; color: inherit; }
.pl-header-subhead { margin: 0 0 22px; font-size: 20px; line-height: 1.5; opacity: .92; }
.pl-header-text { max-width: 720px; margin: 0 auto 26px; font-size: 17px; color: inherit; }
.pl-header--left .pl-header-text { margin-left: 0; }
.pl-header--right .pl-header-text { margin-right: 0; }
.pl-header-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.pl-header--left .pl-header-actions { justify-content: flex-start; }
.pl-header--right .pl-header-actions { justify-content: flex-end; }
.pl-button--ghost {
	background: rgba(255, 255, 255, .14) !important;
	border: 1px solid rgba(255, 255, 255, .5);
	color: inherit !important;
	box-shadow: none !important;
}
.pl-header-scroll {
	position: absolute;
	left: 50%;
	bottom: 20px;
	transform: translateX(-50%);
	z-index: 2;
	color: inherit;
	font-size: 30px;
	line-height: 1;
	text-decoration: none;
	opacity: .8;
}

/* ==========================================================================
   Menús
   ========================================================================== */
.pl-menu { display: flex; align-items: center; gap: 24px; padding: 0; background: transparent; color: inherit; }
.pl-menu-inner { flex: 1 1 auto; }
.pl-menu-list { display: flex; flex-wrap: wrap; align-items: center; gap: 0 26px; list-style: none; margin: 0; padding: 0; }
.pl-menu-list li { position: relative; }
.pl-menu-list a { color: inherit; text-decoration: none; font-weight: 600; font-size: 15px; }
/* Els mòduls Menu del Divi fan els enllaços de bloc, amb 8 px de marge
   inferior i 8 px de farcit; així el menú vertical del hero i el del peu
   tenen exactament el mateix ritme que el Divi. */
.pl-menu .pl-menu-list { padding-top: 8px; }
.pl-menu .pl-menu-list li { margin: 0 0 8px; }
.pl-menu .pl-menu-list li:last-child { margin-bottom: 0; }
.pl-menu .pl-menu-list a {
	display: block;
	padding-bottom: 8px;
	font-size: 14px;
	line-height: 1em;
	font-weight: 400;
}
/* Mode mòbil del Divi per als menús de contingut que no el forcen a
   escriptori: 14 px de farcit horitzontal, 10,5 px vertical i amplada
   completa, de manera que els ítems fan 42 px (30 px de lletra) o 63 px
   (60 px de lletra), com el Divi. */
@media (max-width: 980px) {
	.pl-menu--divi-mobile .pl-menu-list { display: block; padding: 14px 14px 0; }
	.pl-menu--divi-mobile .pl-menu-list li { display: block; margin: 0; }
	.pl-menu--divi-mobile .pl-menu-list a {
		display: block;
		width: 100%;
		box-sizing: border-box;
		padding: 10.5px 0;
	}
}
.pl-menu-list a:hover { color: var(--pl-primary, #4f46e5); }
.pl-menu-list .sub-menu {
	position: absolute;
	left: 0;
	top: 100%;
	z-index: 20;
	min-width: 200px;
	padding: 10px 0;
	margin: 0;
	list-style: none;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 10px;
	box-shadow: 0 18px 40px -26px rgba(15, 23, 42, .5);
	display: none;
}
.pl-menu-list li:hover > .sub-menu { display: block; }
.pl-menu-list .sub-menu a { display: block; padding: 7px 16px; font-weight: 500; }
.pl-menu--center .pl-menu-list { justify-content: center; }
.pl-menu--right .pl-menu-list { justify-content: flex-end; }
.pl-menu-logo img { display: block; max-height: 40px; width: auto; }

/* ==========================================================================
   Mapes
   ========================================================================== */
.pl-map { border: 1px solid #e2e8f0; border-radius: 16px; overflow: hidden; background: #f8fafc; }
.pl-map iframe { display: block; width: 100%; height: 100%; border: 0; }
.pl-map-pins { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 12px; }
.pl-map-pin { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 12px; padding: 14px 16px; }
.pl-map-pin strong { display: block; color: #0f172a; }
.pl-map-pin span { color: #64748b; font-size: 13px; }
.pl-map-pin .pl-text { margin-top: 8px; font-size: 14px; }

/* ==========================================================================
   Subscripció
   ========================================================================== */
.pl-signup { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 18px; padding: 32px; }
.pl-signup-title { margin: 0 0 10px; font-size: 26px; font-weight: 800; letter-spacing: -.02em; color: #0f172a; }
.pl-signup-desc { margin: 0 0 18px; color: #475569; }
.pl-signup-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 20px; }
.pl-signup-fields .pl-form-field { grid-column: 1 / -1; }
.pl-signup-form .pl-form-actions { margin-top: 18px; }

/* ==========================================================================
   Comptador enrere
   ========================================================================== */
.pl-countdown { text-align: center; padding: 34px 24px; border-radius: 18px; background: #0f172a; color: #fff; }
.pl-countdown--light { background: #f8fafc; color: #0f172a; border: 1px solid #e2e8f0; }
.pl-countdown-title { margin: 0 0 20px; font-size: 26px; font-weight: 800; letter-spacing: -.02em; color: inherit; }
.pl-countdown-units { display: flex; justify-content: center; flex-wrap: wrap; gap: 14px; }
.pl-countdown-unit { min-width: 92px; padding: 14px 10px; border-radius: 14px; background: rgba(255, 255, 255, .08); }
.pl-countdown--light .pl-countdown-unit { background: #fff; border: 1px solid #e2e8f0; }
.pl-countdown-number { display: block; font-size: 38px; font-weight: 800; line-height: 1.1; letter-spacing: -.02em; }
.pl-countdown-label { display: block; margin-top: 4px; font-size: 11px; text-transform: uppercase; letter-spacing: .09em; opacity: .7; }

/* ==========================================================================
   Navegació entre entrades
   ========================================================================== */
.pl-post-nav { display: flex; justify-content: space-between; gap: 18px; border-top: 1px solid #e2e8f0; padding-top: 20px; }
.pl-post-nav a { color: var(--pl-primary, #4f46e5); text-decoration: none; font-weight: 600; }
.pl-post-nav-next { text-align: right; }

/* ==========================================================================
   Files i columnes internes
   ========================================================================== */
.pl-row--inner { margin: 0; }
.pl-column--inner { padding: 0 20px; min-width: 0; }

/* ==========================================================================
   Responsiu
   ========================================================================== */
@media (max-width: 980px) {
	.pl-slide-inner { flex-direction: column; padding: 56px 28px; text-align: center; }
	.pl-slide-title { font-size: 32px; }
	.pl-slide-media { flex-basis: auto; width: 100%; }
	.pl-header-title { font-size: 40px; }
	.pl-portfolio--3, .pl-portfolio--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
	.pl-slide-title { font-size: 26px; }
	.pl-slider-prev::before, .pl-slider-next::before { font-size: 36px; }
	.pl-portfolio--2, .pl-portfolio--3, .pl-portfolio--4 { grid-template-columns: 1fr; }
	.pl-header-title { font-size: 32px; }
	.pl-header { min-height: 420px; }
	.pl-signup-fields { grid-template-columns: 1fr; }
	.pl-countdown-number { font-size: 28px; }
	.pl-countdown-unit { min-width: 70px; }
	.pl-menu--left .pl-menu-list, .pl-menu--right .pl-menu-list { justify-content: flex-start; }
}

/* ==========================================================================
   Visibilitat per dispositiu (disabled_on de Divi)
   ========================================================================== */
@media (min-width: 981px) { .pl-hide-desktop { display: none !important; } }
@media (min-width: 768px) and (max-width: 980px) { .pl-hide-tablet { display: none !important; } }
@media (max-width: 767px) { .pl-hide-phone { display: none !important; } }

/* ==========================================================================
   Animacions d'entrada (animation_style de Divi)
   ========================================================================== */
.pl-js .pl-anim {
	opacity: var(--pl-anim-start-opacity, 0);
	transform: translateY(26px);
	transition:
		opacity var(--pl-anim-duration, 500ms) var(--pl-anim-ease, ease-in-out) var(--pl-anim-delay, 0ms),
		transform var(--pl-anim-duration, 500ms) var(--pl-anim-ease, ease-in-out) var(--pl-anim-delay, 0ms);
	will-change: opacity, transform;
}
.pl-js .pl-anim--fade { transform: none; }
.pl-js .pl-anim--slide { transform: translateX(calc(-42px * var(--pl-anim-intensity, 1))); }
.pl-js .pl-anim--slide-left { transform: translateX(calc(-42px * var(--pl-anim-intensity, 1))); }
.pl-js .pl-anim--slide-right { transform: translateX(calc(42px * var(--pl-anim-intensity, 1))); }
.pl-js .pl-anim--slide-top { transform: translateY(calc(-42px * var(--pl-anim-intensity, 1))); }
.pl-js .pl-anim--slide-bottom { transform: translateY(calc(42px * var(--pl-anim-intensity, 1))); }
.pl-js .pl-anim--zoom { transform: scale(.94); }
.pl-js .pl-anim--zoom-top { transform: translateY(-20px) scale(.94); }
.pl-js .pl-anim--zoom-bottom { transform: translateY(20px) scale(.94); }
.pl-js .pl-anim--zoom-left { transform: translateX(-20px) scale(.94); }
.pl-js .pl-anim--zoom-right { transform: translateX(20px) scale(.94); }
.pl-js .pl-anim--bounce { transform: translateY(calc(34px * var(--pl-anim-intensity, 1))); transition-timing-function: cubic-bezier(.34, 1.56, .64, 1); }
.pl-js .pl-anim--bounce-top { transform: translateY(calc(-34px * var(--pl-anim-intensity, 1))); }
.pl-js .pl-anim--bounce-bottom { transform: translateY(calc(34px * var(--pl-anim-intensity, 1))); }
.pl-js .pl-anim--bounce-left { transform: translateX(calc(-34px * var(--pl-anim-intensity, 1))); }
.pl-js .pl-anim--bounce-right { transform: translateX(calc(34px * var(--pl-anim-intensity, 1))); }
.pl-js .pl-anim--flip { transform: perspective(700px) rotateX(-18deg); }
.pl-js .pl-anim--flip-top { transform: perspective(700px) rotateX(-18deg); }
.pl-js .pl-anim--flip-bottom { transform: perspective(700px) rotateX(18deg); }
.pl-js .pl-anim--flip-left { transform: perspective(700px) rotateY(18deg); }
.pl-js .pl-anim--flip-right { transform: perspective(700px) rotateY(-18deg); }
.pl-js .pl-anim--fold { transform: scaleY(.9); transform-origin: top; }
.pl-js .pl-anim--fold-top { transform: scaleY(.9); transform-origin: top; }
.pl-js .pl-anim--fold-bottom { transform: scaleY(.9); transform-origin: bottom; }
.pl-js .pl-anim--fold-left { transform: scaleX(.9); transform-origin: left; }
.pl-js .pl-anim--fold-right { transform: scaleX(.9); transform-origin: right; }
.pl-js .pl-anim--roll { transform: translateX(calc(-60px * var(--pl-anim-intensity, 1))) rotate(-2deg); }
.pl-js .pl-anim--roll-left { transform: translateX(calc(-60px * var(--pl-anim-intensity, 1))) rotate(-2deg); }
.pl-js .pl-anim--roll-right { transform: translateX(calc(60px * var(--pl-anim-intensity, 1))) rotate(2deg); }
.pl-js .pl-anim--roll-top { transform: translateY(calc(-40px * var(--pl-anim-intensity, 1))) rotate(-2deg); }
.pl-js .pl-anim--roll-bottom { transform: translateY(calc(40px * var(--pl-anim-intensity, 1))) rotate(2deg); }
.pl-js .pl-anim--rotate { transform: rotate(-3deg) scale(.97); }
.pl-js .pl-anim.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.pl-js .pl-anim { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* Paritat amb Divi: vel del text i controls visibles a mòbil. */
.pl-slider--text-overlay .pl-slide-content {
	background: var(--pl-slider-text-overlay, rgba(0, 0, 0, .4));
	border-radius: var(--pl-slider-text-radius, 0);
	padding: 24px 28px;
}
@media (max-width: 767px) {
	.pl-slider--hide-content-mobile .pl-slide-content { display: none !important; }
	.pl-slider--hide-cta-mobile .pl-button-wrap { display: none !important; }
	.pl-slider--hide-media-mobile .pl-slide-media { display: none !important; }
	.pl-slider--hide-media-mobile .pl-slide { background-image: none !important; }
}

/* Capçalera a amplada completa: opcions del Divi. */
.pl-header--fullscreen { min-height: 100vh; }
.pl-header--vbottom { align-items: flex-end; }
.pl-header-overlay { position: absolute; inset: 0; z-index: 1; }
.pl-header-logo { position: relative; z-index: 2; display: block; max-width: 240px; height: auto; margin: 0 auto 20px; }
.pl-header--left .pl-header-logo { margin-left: 0; }
.pl-header--right .pl-header-logo { margin-right: 0; }
.pl-header-image { position: relative; z-index: 2; display: block; max-width: 100%; height: auto; margin: 24px auto 0; }
